diff --git a/apps/docs/app/global.css b/apps/docs/app/global.css
new file mode 100644
index 0000000..3c489ba
--- /dev/null
+++ b/apps/docs/app/global.css
@@ -0,0 +1,2 @@
+@import "tailwindcss";
+@import "@farming-labs/theme/colorful/css";
diff --git a/apps/docs/app/layout.tsx b/apps/docs/app/layout.tsx
new file mode 100644
index 0000000..2bd7c47
--- /dev/null
+++ b/apps/docs/app/layout.tsx
@@ -0,0 +1,33 @@
+import type { Metadata } from "next";
+import { Geist, Geist_Mono } from "next/font/google";
+import { RootProvider } from "@farming-labs/theme";
+import docsConfig from "../docs.config";
+import "./global.css";
+
+const geistSans = Geist({
+ variable: "--fd-font-sans",
+ subsets: ["latin"],
+});
+
+const geistMono = Geist_Mono({
+ variable: "--fd-font-mono",
+ subsets: ["latin"],
+});
+
+export const metadata: Metadata = {
+ title: {
+ default: "Docs",
+ template: docsConfig.metadata?.titleTemplate ?? "%s",
+ },
+ description: docsConfig.metadata?.description,
+};
+
+export default function RootLayout({ children }: { children: React.ReactNode }) {
+ return (
+
+
+ {children}
+
+
+ );
+}
diff --git a/apps/docs/app/page.tsx b/apps/docs/app/page.tsx
new file mode 100644
index 0000000..756d8a5
--- /dev/null
+++ b/apps/docs/app/page.tsx
@@ -0,0 +1,14 @@
+import Link from "next/link";
+
+const title = "Better Auth UI";
+const description = "Better Auth UI is a beautiful and compatible user interface designed to enhance the authentication experience in your applications using Better Auth as your authentication library , providing you a set of pre built UI components that you can easily copy and paste to kickstart your project.";
+
+export default function HomePage() {
+ return (
+
+
{title}
+
{description}
+ Open docs
+
+ );
+}
diff --git a/apps/docs/docs.config.tsx b/apps/docs/docs.config.tsx
new file mode 100644
index 0000000..33d8f32
--- /dev/null
+++ b/apps/docs/docs.config.tsx
@@ -0,0 +1,187 @@
+import { defineDocs } from "@farming-labs/docs";
+import { colorful } from "@farming-labs/theme/colorful";
+
+export default defineDocs({
+ entry: "docs",
+ theme: colorful(),
+ ordering: [
+ {
+ "slug": "quickstart"
+ },
+ {
+ "slug": "installation"
+ },
+ {
+ "slug": "features",
+ "children": [
+ {
+ "slug": "session-management"
+ }
+ ]
+ },
+ {
+ "slug": "configuration",
+ "children": [
+ {
+ "slug": "database"
+ },
+ {
+ "slug": "environment"
+ }
+ ]
+ },
+ {
+ "slug": "api",
+ "children": [
+ {
+ "slug": "config",
+ "children": [
+ {
+ "slug": "events-config"
+ },
+ {
+ "slug": "metadata-config"
+ }
+ ]
+ }
+ ]
+ },
+ {
+ "slug": "builder",
+ "children": [
+ {
+ "slug": "components"
+ },
+ {
+ "slug": "page"
+ }
+ ]
+ },
+ {
+ "slug": "components",
+ "children": [
+ {
+ "slug": "bottom-toolbar"
+ },
+ {
+ "slug": "codeblock"
+ },
+ {
+ "slug": "command-menu"
+ },
+ {
+ "slug": "command-palette-context"
+ },
+ {
+ "slug": "component-code"
+ },
+ {
+ "slug": "component-display"
+ },
+ {
+ "slug": "component-preview"
+ },
+ {
+ "slug": "component-render"
+ },
+ {
+ "slug": "credentail"
+ },
+ {
+ "slug": "element-render"
+ },
+ {
+ "slug": "element-strucuture"
+ },
+ {
+ "slug": "file-tree"
+ },
+ {
+ "slug": "grid-credential-social"
+ },
+ {
+ "slug": "icons"
+ },
+ {
+ "slug": "landing"
+ },
+ {
+ "slug": "logo"
+ },
+ {
+ "slug": "navbar"
+ },
+ {
+ "slug": "navlink"
+ },
+ {
+ "slug": "provider"
+ },
+ {
+ "slug": "sign-in"
+ },
+ {
+ "slug": "tab-context"
+ },
+ {
+ "slug": "theme-toggler"
+ },
+ {
+ "slug": "ui"
+ }
+ ]
+ },
+ {
+ "slug": "hints"
+ },
+ {
+ "slug": "page"
+ },
+ {
+ "slug": "parser",
+ "children": [
+ {
+ "slug": "next"
+ }
+ ]
+ },
+ {
+ "slug": "r",
+ "children": [
+ {
+ "slug": "registry"
+ }
+ ]
+ },
+ {
+ "slug": "store"
+ },
+ {
+ "slug": "templates",
+ "children": [
+ {
+ "slug": "file"
+ },
+ {
+ "slug": "server-client-dep"
+ },
+ {
+ "slug": "state"
+ },
+ {
+ "slug": "token-map"
+ },
+ {
+ "slug": "two-level"
+ },
+ {
+ "slug": "ui-function-dep"
+ }
+ ]
+ }
+ ],
+ metadata: {
+ titleTemplate: "%s – Docs",
+ description: "Generated by @farming-labs/docs Cloud",
+ },
+});
diff --git a/apps/docs/docs/api/config/events-config/page.mdx b/apps/docs/docs/api/config/events-config/page.mdx
new file mode 100644
index 0000000..b10df1f
--- /dev/null
+++ b/apps/docs/docs/api/config/events-config/page.mdx
@@ -0,0 +1,63 @@
+---
+title: "Events Config"
+description: "The source includes types or helpers for events config."
+order: 100
+---
+
+# Events Config
+
+The source includes types or helpers for events config.
+## What This Is
+This API reference page explains the events config shape, how developers pass it to the package, and which related feature pages depend on those settings.
+## Why It Matters
+Events Config matters because it is part of how Better Auth UI turns repository behavior into a usable developer or operator workflow. This page gives readers the mental model first, then uses implementation evidence as supporting context.
+## Core Concepts
+- Events Config
+- configuration type
+- runtime options
+- validation
+## Typical Workflow
+1. Locate the configuration object in the host application.
+2. Set only the options needed for the selected runtime and feature set.
+3. Use the related feature docs to understand behavior controlled by each option.
+## Detailed API Contract
+Events Config is a developer contract, not just an exported name. The page explains what the API represents, what problem it solves, what a caller provides, what the package returns or performs, and how it relates to the surrounding runtime.
+
+API pages are most useful when they explain the shape of responsibility. For an adapter, that means the host framework owns routing and the package supplies a handler. For configuration, it means the host app supplies options and the package changes runtime behavior. For utilities, it means the function supports a feature that needs to be understood before the utility is changed.
+
+## Integration Questions
+- What does the caller provide?
+- What does the package create, mutate, or return?
+- Which feature or configuration page explains the user-facing behavior behind this API?
+- What needs to be tested after this API changes?
+
+## Success Criteria
+- Readers understand the API purpose before looking at source files.
+- Readers know whether the API is public integration surface or internal support code.
+- Readers know which runtime or feature depends on it.
+## Import Surface
+Use `ui-better-auth` as the package path indicated by package metadata or adapter file evidence.
+## API Mental Model
+Configuration APIs are the contract between the host application and the product runtime. The important details are what each option changes and which feature depends on it.
+## Related Exports
+- `ThemeProvider`
+## Operational Notes
+- The concept comes before the file paths, so readers understand the workflow before they inspect implementation evidence.
+- Examples stay grounded in detected commands, config names, import paths, or behavior from the repository.
+- Maintainer details live in the reference section so the main page stays useful to product readers.
+- Inputs, outputs, side effects, and ownership boundaries are described before exported names.
+- The API connects back to feature or configuration pages that explain user-facing behavior.
+## Maintainer Reference
+The sections above are the reader-facing explanation. The references below are for maintainers who need to verify or update the implementation behind this page.
+
+### Implementation Map
+- `components/provider.tsx` - Evidence file that contributes to the implementation understanding for this page.
+
+### Knowledge Chunks
+- `components/provider.tsx:1-9` - ThemeProvider (source; TypeScript; module components/provider; symbols ThemeProvider). 'use client' import as React from "react"; import { ThemeProvider as NextThemesProvider } from "next themes"; import { type ThemeProviderProps } from "next themes/dist/types"; export function ThemeProvider({ children, ...props }: ThemeProviderProps) { return {children} ; }
+
+### Source Details
+- `components/provider.tsx`: language TypeScript; exports `ThemeProvider`
+
+### Evidence
+- `components/provider.tsx`
diff --git a/apps/docs/docs/api/config/metadata-config/page.mdx b/apps/docs/docs/api/config/metadata-config/page.mdx
new file mode 100644
index 0000000..8336227
--- /dev/null
+++ b/apps/docs/docs/api/config/metadata-config/page.mdx
@@ -0,0 +1,69 @@
+---
+title: "Metadata Config"
+description: "The source includes types or helpers for metadata config."
+order: 110
+---
+
+# Metadata Config
+
+The source includes types or helpers for metadata config.
+## What This Is
+This API reference page explains the metadata config shape, how developers pass it to the package, and which related feature pages depend on those settings.
+## Why It Matters
+Metadata Config matters because it is part of how Better Auth UI turns repository behavior into a usable developer or operator workflow. This page gives readers the mental model first, then uses implementation evidence as supporting context.
+## Core Concepts
+- Metadata Config
+- configuration type
+- runtime options
+- validation
+## Typical Workflow
+1. Locate the configuration object in the host application.
+2. Set only the options needed for the selected runtime and feature set.
+3. Use the related feature docs to understand behavior controlled by each option.
+## Detailed API Contract
+Metadata Config is a developer contract, not just an exported name. The page explains what the API represents, what problem it solves, what a caller provides, what the package returns or performs, and how it relates to the surrounding runtime.
+
+API pages are most useful when they explain the shape of responsibility. For an adapter, that means the host framework owns routing and the package supplies a handler. For configuration, it means the host app supplies options and the package changes runtime behavior. For utilities, it means the function supports a feature that needs to be understood before the utility is changed.
+
+## Integration Questions
+- What does the caller provide?
+- What does the package create, mutate, or return?
+- Which feature or configuration page explains the user-facing behavior behind this API?
+- What needs to be tested after this API changes?
+
+## Success Criteria
+- Readers understand the API purpose before looking at source files.
+- Readers know whether the API is public integration surface or internal support code.
+- Readers know which runtime or feature depends on it.
+## Import Surface
+Use `ui-better-auth` as the package path indicated by package metadata or adapter file evidence.
+## API Mental Model
+Configuration APIs are the contract between the host application and the product runtime. The important details are what each option changes and which feature depends on it.
+## Related Exports
+- `metadata`
+- `MobileThemeToggle`
+- `ThemeToggle`
+## Operational Notes
+- The concept comes before the file paths, so readers understand the workflow before they inspect implementation evidence.
+- Examples stay grounded in detected commands, config names, import paths, or behavior from the repository.
+- Maintainer details live in the reference section so the main page stays useful to product readers.
+- Inputs, outputs, side effects, and ownership boundaries are described before exported names.
+- The API connects back to feature or configuration pages that explain user-facing behavior.
+## Maintainer Reference
+The sections above are the reader-facing explanation. The references below are for maintainers who need to verify or update the implementation behind this page.
+
+### Implementation Map
+- `app/metadata.ts` - Evidence file that contributes to the implementation understanding for this page.
+- `components/theme-toggler.tsx` - Evidence file that contributes to the implementation understanding for this page.
+
+### Knowledge Chunks
+- `app/metadata.ts:1-22` - metadata (source; TypeScript; module metadata; symbols metadata). // app/metadata.ts import type { Metadata } from "next"; import { metadata as mt } from "@/meta"; const { title, description, ogImage } = mt; export const metadata: Metadata = { title, description, openGraph: { title, description, images: [{ url: ogImage }], url: "https://better auth.farmui.com", }, twitter: { card: "summary large image", title, description, images: [ogImage], creator: "@kinfishT", }, };
+- `components/theme-toggler.tsx:1-60` - MobileThemeToggle, ThemeToggle (source; TypeScript; module components/theme-toggler; symbols MobileThemeToggle, ThemeToggle). "use client"; import { Moon, Sun } from "lucide react"; import { useTheme } from "next themes"; import as React from "react"; import { Button } from "@/components/ui/button"; import { DropdownMenu, DropdownMenuContent, DropdownMenuItem, DropdownMenuTrigger, } from "@/components/ui/dropdown menu"; export function ThemeToggle() { const { setTheme } = useTheme(); return ( Toggle theme setTheme("light")} Light setTheme("
+
+### Source Details
+- `app/metadata.ts`: language TypeScript; exports `metadata`
+- `components/theme-toggler.tsx`: language TypeScript; exports `MobileThemeToggle`, `ThemeToggle`
+
+### Evidence
+- `app/metadata.ts`
+- `components/theme-toggler.tsx`
diff --git a/apps/docs/docs/api/config/page.mdx b/apps/docs/docs/api/config/page.mdx
new file mode 100644
index 0000000..d32fa76
--- /dev/null
+++ b/apps/docs/docs/api/config/page.mdx
@@ -0,0 +1,19 @@
+---
+title: "Configuration API"
+description: "Configuration type and helper references generated from source evidence."
+order: 90
+---
+
+# Configuration API
+
+Configuration type and helper references generated from source evidence.
+
+## How This Section Was Built
+This sidebar section is generated from repository evidence, not from a static template. The docs engine adds a section only when one or more child pages are backed by code, config, README, package export, route, CLI, or environment evidence.
+
+## Pages
+- [Events Config](/docs/api/config/events-config) - The source includes types or helpers for events config.
+- [Metadata Config](/docs/api/config/metadata-config) - The source includes types or helpers for metadata config.
+
+## Evidence Used
+- `components/provider.tsx`
diff --git a/apps/docs/docs/api/page.mdx b/apps/docs/docs/api/page.mdx
new file mode 100644
index 0000000..375a478
--- /dev/null
+++ b/apps/docs/docs/api/page.mdx
@@ -0,0 +1,18 @@
+---
+title: "API Reference"
+description: "Reference pages generated from detected routes, commands, exports, adapters, and type contracts."
+order: 80
+---
+
+# API Reference
+
+Reference pages generated from detected routes, commands, exports, adapters, and type contracts.
+
+## How This Section Was Built
+This sidebar section is generated from repository evidence, not from a static template. The docs engine adds a section only when one or more child pages are backed by code, config, README, package export, route, CLI, or environment evidence.
+
+## Pages
+- [Configuration API](/docs/api/config) - Configuration type and helper references generated from source evidence.
+
+## Evidence Used
+- `components/provider.tsx`
diff --git a/apps/docs/docs/builder/components/page.mdx b/apps/docs/docs/builder/components/page.mdx
new file mode 100644
index 0000000..a5054fa
--- /dev/null
+++ b/apps/docs/docs/builder/components/page.mdx
@@ -0,0 +1,119 @@
+---
+title: "Components"
+description: "Components is a repository module detected from 12 source files."
+order: 200
+---
+
+# Components
+
+Components is a repository module detected from 12 source files.
+## What This Module Owns
+Components owns a coherent part of the codebase. This page is generated from module structure, public symbols, routes, and package exports so larger repositories produce deeper docs instead of a fixed sidebar.
+The module key is `builder/components`. It was selected because the repository has concrete source evidence for this area, such as files, declarations, routes, or package exports.
+## Module Responsibilities
+- ApearanceLayout
+- AuthBuilder
+- authOptions
+- Builder
+- ComponentRender
+- Components
+- ForgetPaswordDemo
+- importAndDistructureCleanup
+- parseTokens
+- removeLinesWithNope
+## Detailed Module Model
+Components is generated from a coherent source area, not from a generic keyword. The docs engine groups files into this page when they share a module boundary, package export, route family, or public symbol surface.
+
+For Better Auth UI, module pages help the docs grow with the repository. Small codebases may only need a few module pages; larger codebases can expose many focused pages so readers can learn one capability, adapter, plugin, or subsystem at a time.
+
+## What to Look For
+- The responsibility owned by this module.
+- The public exports, route handlers, declarations, or configuration values attached to the module.
+- The neighboring docs pages that explain related user-facing workflows or integration details.
+
+## Success Criteria
+- Readers understand why this source area exists before reading file paths.
+- Readers can find the files that define the module without searching the whole repo.
+- Maintainers can update this page when the module's exports, routes, or responsibilities change.
+## Public or Observable Surface
+The items below are extracted from the files attached to this page. Treat them as evidence for what the module exposes or handles, not as a guarantee that every symbol is public API.
+- `ApearanceLayout`
+- `AuthBuilder`
+- `authOptions`
+- `ComponentRender`
+- `ForgetPaswordDemo`
+- `importAndDistructureCleanup`
+- `parseTokens`
+- `removeLinesWithNope`
+- `ResetPasswordDemo`
+- `SignIn`
+- `TopBar`
+## Repository Notes
+These notes come from the repository README so the page stays grounded in existing project language.
+
+### Overview
+Better-Auth UI is a beautiful and compatible user interface designed to enhance the authentication experience in your applications using [Better Auth](https://better-auth.com) as your authentication library , providing you a set of pre-built UI components that you can easily copy and paste to kickstart your project.
+
+### Features
+- Beautiful and responsive UI components (shadcn , or pure tailwind)
+- Easy integration with the Better-Auth authentication library
+- Customizable components to fit your design needs
+
+
+# Contribution Guidelines
+
+Thank you for considering contributing to Better-Auth UI. Always welcomed to Issues & PR's.
+## Operational Notes
+- The concept comes before the file paths, so readers understand the workflow before they inspect implementation evidence.
+- Examples stay grounded in detected commands, config names, import paths, or behavior from the repository.
+- Maintainer details live in the reference section so the main page stays useful to product readers.
+- Module pages are generated only from concrete source, route, declaration, or package export evidence.
+- If the module is internal, keep the page focused on responsibility and maintenance boundaries rather than promising public APIs.
+## Maintainer Reference
+The sections above are the reader-facing explanation. The references below are for maintainers who need to verify or update the implementation behind this page.
+
+### Implementation Map
+- `app/builder/_components/apearance-layout.tsx` - Evidence file that contributes to the implementation understanding for this page.
+- `app/builder/_components/auth-builder.tsx` - Evidence file that contributes to the implementation understanding for this page.
+- `app/builder/_components/component-render.tsx` - Evidence file that contributes to the implementation understanding for this page.
+- `app/builder/_components/lib/auth-options.tsx` - Evidence file that contributes to the implementation understanding for this page.
+- `app/builder/_components/lib/code-export.ts` - Evidence file that contributes to the implementation understanding for this page.
+- `app/builder/_components/nested/configs/database.ts` - Evidence file that contributes to the implementation understanding for this page.
+- `app/builder/_components/nested/pages/forget-password.tsx` - Forget Password page-level UI. This is where users usually encounter the capability in the product.
+- `app/builder/_components/nested/pages/reset-password.tsx` - Reset Password page-level UI. This is where users usually encounter the capability in the product.
+- `app/builder/_components/nested/topbar.tsx` - Evidence file that contributes to the implementation understanding for this page.
+- `app/builder/_components/signin.tsx` - Evidence file that contributes to the implementation understanding for this page.
+
+### Knowledge Chunks
+- `app/builder/_components/apearance-layout.tsx:1-25` - ApearanceLayout (source; TypeScript; module builder/components; symbols ApearanceLayout). import { AnimatePresence } from "framer motion"; import { motion } from "framer motion"; import { ReactNode } from "react"; export const ApearanceLayout = ({ children, className, }: { children: ReactNode; className?: string; }) = { return ( {children} ); };
+- `app/builder/_components/auth-builder.tsx:1-60` - AuthBuilder (source; TypeScript; module builder/components; symbols AuthBuilder). "use client"; import { Tooltip, TooltipContent, TooltipProvider, TooltipTrigger, } from "@/components/ui/tooltip"; import { Dialog, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogTitle, DialogTrigger, } from "@/components/ui/dialog"; import { anyBool } from "@/lib/utils"; import { Layout, Code2, InfoIcon } from "lucide react"; import { Button } from "@/components/ui/button"; import { Label } from
+- `app/builder/_components/auth-builder.tsx:60-98` - AuthBuilder (source; TypeScript; module builder/components; symbols AuthBuilder). Preview Code
+- `app/builder/_components/auth-builder.tsx:98-136` - AuthBuilder (source; TypeScript; module builder/components; symbols AuthBuilder). Create your own{" "} {" "} {" "} Component. Configure the sign in box to your liking and copy the code to your application Credential Login {Object.keys(enabledComp["credentials"]).map( (cred, indx) = { return ( { authOptions["credential"][ cred as keyof EnabledComponent["credentials"] ]["icon"] } { authOptions["credential"][
+- `app/builder/_components/auth-builder.tsx:136-172` - AuthBuilder (source; TypeScript; module builder/components; symbols AuthBuilder). cred as keyof EnabledComponent["credentials"] ]["name"] } {cred in hintTextWithString["yetGroup"] && ( { hintTextWithString[ "yetGroup" ][cred] } )} {anyBool([ enabledComp.otherSignIn.magicLink!, ]) && authOptions["credential"][ cred as keyof EnabledComponent["credentials"] ]["name"] === "Enabled" && (
+- `app/builder/_components/auth-builder.tsx:172-206` - AuthBuilder (source; TypeScript; module builder/components; symbols AuthBuilder). { hintsText["credential"][ "magicLink" ] } )} { updateEnabledComponent({ toogledComp: { credentials: { ...enabledComp["credentials"], [cred]: e, email: !enabledComp.credentials .enabled, }, }, }); }} checked={ enabledComp["credentials"][
+- `app/builder/_components/auth-builder.tsx:206-245` - AuthBuilder (source; TypeScript; module builder/components; symbols AuthBuilder). cred as keyof EnabledComponent["credentials"] ] } / ); }, )} Additional On Credential {Object.keys(enabledComp["additionals"]).map( (addition, indx) = { const exists = addition in authOptions["additionals"]; const enabledCredentials = Object.entries( enabledComp.credentials, ) .filter((curr) = curr[1]) .map((curr) = curr[0]); const fullDeps = enabledComp!.additionals![ addition as keyof EnabledComponent["additionals"
+- `app/builder/_components/auth-builder.tsx:245-281` - AuthBuilder (source; TypeScript; module builder/components; symbols AuthBuilder). addition as keyof additionalAuthType ]["icon"] } { authOptions["additionals"][ addition as keyof additionalAuthType ]["name"] } { updateEnabledComponent({ toogledComp: { additionals: { ...enabledComp["additionals"], [addition]: { ...enabledComp[ "additionals" ][ addition as keyof EnabledComponent["additionals"] ], visiblity: e, routing: false, }, resetPassword: { visiblity:
+- `app/builder/_components/auth-builder.tsx:281-319` - AuthBuilder (source; TypeScript; module builder/components; symbols AuthBuilder). enabledComp["additionals"] .forgetPassword ?.visiblity ?? false, routing: false, }, }, }, }); }} checked={ enabledComp["additionals"][ addition as keyof EnabledComponent["additionals"] ]?.visiblity } / ); } }, )} Other Sign In Options {Object.keys(enabledComp["otherSignIn"]).map( (other, indx) = { return ( { authOptions["otherSignIn"][
+- `app/builder/_components/auth-builder.tsx:319-334` - AuthBuilder (source; TypeScript; module builder/components; symbols AuthBuilder). other as keyof EnabledComponent["otherSignIn"] ]["icon"] } { authOptions["otherSignIn"][ other as keyof EnabledComponent["otherSignIn"] ]["name"] } { if ( authOptions["otherSignIn"][
+
+### Source Details
+- `app/builder/_components/apearance-layout.tsx`: language TypeScript; exports `ApearanceLayout`
+- `app/builder/_components/auth-builder.tsx`: language TypeScript; exports `AuthBuilder`
+- `app/builder/_components/component-render.tsx`: language TypeScript; exports `ComponentRender`
+- `app/builder/_components/lib/auth-options.tsx`: language TypeScript; exports `authOptions`
+- `app/builder/_components/lib/code-export.ts`: language TypeScript; exports `importAndDistructureCleanup`, `parseTokens`, `removeLinesWithNope`
+- `app/builder/_components/nested/pages/forget-password.tsx`: language TypeScript; exports `ForgetPaswordDemo`
+- `app/builder/_components/nested/pages/reset-password.tsx`: language TypeScript; exports `ResetPasswordDemo`
+- `app/builder/_components/nested/topbar.tsx`: language TypeScript; exports `TopBar`
+
+### Evidence
+- `app/builder/_components/apearance-layout.tsx`
+- `app/builder/_components/auth-builder.tsx`
+- `app/builder/_components/component-render.tsx`
+- `app/builder/_components/lib/auth-options.tsx`
+- `app/builder/_components/lib/code-export.ts`
+- `app/builder/_components/nested/configs/database.ts`
+- `app/builder/_components/nested/pages/forget-password.tsx`
+- `app/builder/_components/nested/pages/reset-password.tsx`
+- `app/builder/_components/nested/topbar.tsx`
+- `app/builder/_components/signin.tsx`
diff --git a/apps/docs/docs/builder/page.mdx b/apps/docs/docs/builder/page.mdx
new file mode 100644
index 0000000..9208d26
--- /dev/null
+++ b/apps/docs/docs/builder/page.mdx
@@ -0,0 +1,26 @@
+---
+title: "Builder"
+description: "Repository-specific builder pages generated for Better Auth UI."
+order: 120
+---
+
+# Builder
+
+Repository-specific builder pages generated for Better Auth UI.
+
+## How This Section Was Built
+This sidebar section is generated from repository evidence, not from a static template. The docs engine adds a section only when one or more child pages are backed by code, config, README, package export, route, CLI, or environment evidence.
+
+## Pages
+- [Components](/docs/builder/components) - Components is a repository module detected from 12 source files.
+- [Page](/docs/builder/page) - Page is a repository module detected from 1 source file.
+
+## Evidence Used
+- `app/builder/_components/apearance-layout.tsx`
+- `app/builder/_components/auth-builder.tsx`
+- `app/builder/_components/component-render.tsx`
+- `app/builder/_components/lib/auth-options.tsx`
+- `app/builder/_components/lib/code-export.ts`
+- `app/builder/_components/nested/configs/database.ts`
+- `app/builder/_components/nested/pages/forget-password.tsx`
+- `app/builder/_components/nested/pages/reset-password.tsx`
diff --git a/apps/docs/docs/builder/page/page.mdx b/apps/docs/docs/builder/page/page.mdx
new file mode 100644
index 0000000..9dd7530
--- /dev/null
+++ b/apps/docs/docs/builder/page/page.mdx
@@ -0,0 +1,55 @@
+---
+title: "Page"
+description: "Page is a repository module detected from 1 source file."
+order: 210
+---
+
+# Page
+
+Page is a repository module detected from 1 source file.
+## What This Module Owns
+Page owns a coherent part of the codebase. This page is generated from module structure, public symbols, routes, and package exports so larger repositories produce deeper docs instead of a fixed sidebar.
+The module key is `builder/page`. It was selected because the repository has concrete source evidence for this area, such as files, declarations, routes, or package exports.
+## Module Responsibilities
+- Builder
+- BuilderPage
+- metadata
+- Page
+## Detailed Module Model
+Page is generated from a coherent source area, not from a generic keyword. The docs engine groups files into this page when they share a module boundary, package export, route family, or public symbol surface.
+
+For Better Auth UI, module pages help the docs grow with the repository. Small codebases may only need a few module pages; larger codebases can expose many focused pages so readers can learn one capability, adapter, plugin, or subsystem at a time.
+
+## What to Look For
+- The responsibility owned by this module.
+- The public exports, route handlers, declarations, or configuration values attached to the module.
+- The neighboring docs pages that explain related user-facing workflows or integration details.
+
+## Success Criteria
+- Readers understand why this source area exists before reading file paths.
+- Readers can find the files that define the module without searching the whole repo.
+- Maintainers can update this page when the module's exports, routes, or responsibilities change.
+## Public or Observable Surface
+The items below are extracted from the files attached to this page. Treat them as evidence for what the module exposes or handles, not as a guarantee that every symbol is public API.
+- `BuilderPage`
+- `metadata`
+## Operational Notes
+- The concept comes before the file paths, so readers understand the workflow before they inspect implementation evidence.
+- Examples stay grounded in detected commands, config names, import paths, or behavior from the repository.
+- Maintainer details live in the reference section so the main page stays useful to product readers.
+- Module pages are generated only from concrete source, route, declaration, or package export evidence.
+- If the module is internal, keep the page focused on responsibility and maintenance boundaries rather than promising public APIs.
+## Maintainer Reference
+The sections above are the reader-facing explanation. The references below are for maintainers who need to verify or update the implementation behind this page.
+
+### Implementation Map
+- `app/builder/page.tsx` - Evidence file that contributes to the implementation understanding for this page.
+
+### Knowledge Chunks
+- `app/builder/page.tsx:1-13` - BuilderPage, metadata (source; TypeScript; module builder/page; symbols BuilderPage, metadata). import AuthBuilder from "./ components/auth builder"; export const metadata = { title: "Auth UI builder", }; export default function BuilderPage() { return ( ); }
+
+### Source Details
+- `app/builder/page.tsx`: language TypeScript; exports `BuilderPage`, `metadata`
+
+### Evidence
+- `app/builder/page.tsx`
diff --git a/apps/docs/docs/components/bottom-toolbar/page.mdx b/apps/docs/docs/components/bottom-toolbar/page.mdx
new file mode 100644
index 0000000..a2a612f
--- /dev/null
+++ b/apps/docs/docs/components/bottom-toolbar/page.mdx
@@ -0,0 +1,68 @@
+---
+title: "Bottom Toolbar"
+description: "Bottom Toolbar is a repository module detected from 1 source file."
+order: 220
+---
+
+# Bottom Toolbar
+
+Bottom Toolbar is a repository module detected from 1 source file.
+## What This Module Owns
+Bottom Toolbar owns a coherent part of the codebase. This page is generated from module structure, public symbols, routes, and package exports so larger repositories produce deeper docs instead of a fixed sidebar.
+The module key is `components/bottom-toolbar`. It was selected because the repository has concrete source evidence for this area, such as files, declarations, routes, or package exports.
+## Module Responsibilities
+- Bottom Toolbar
+- BottomToolbar
+- Components
+## Detailed Module Model
+Bottom Toolbar is generated from a coherent source area, not from a generic keyword. The docs engine groups files into this page when they share a module boundary, package export, route family, or public symbol surface.
+
+For Better Auth UI, module pages help the docs grow with the repository. Small codebases may only need a few module pages; larger codebases can expose many focused pages so readers can learn one capability, adapter, plugin, or subsystem at a time.
+
+## What to Look For
+- The responsibility owned by this module.
+- The public exports, route handlers, declarations, or configuration values attached to the module.
+- The neighboring docs pages that explain related user-facing workflows or integration details.
+
+## Success Criteria
+- Readers understand why this source area exists before reading file paths.
+- Readers can find the files that define the module without searching the whole repo.
+- Maintainers can update this page when the module's exports, routes, or responsibilities change.
+## Public or Observable Surface
+The items below are extracted from the files attached to this page. Treat them as evidence for what the module exposes or handles, not as a guarantee that every symbol is public API.
+- `BottomToolbar`
+## Repository Notes
+These notes come from the repository README so the page stays grounded in existing project language.
+
+### Overview
+Better-Auth UI is a beautiful and compatible user interface designed to enhance the authentication experience in your applications using [Better Auth](https://better-auth.com) as your authentication library , providing you a set of pre-built UI components that you can easily copy and paste to kickstart your project.
+
+### Features
+- Beautiful and responsive UI components (shadcn , or pure tailwind)
+- Easy integration with the Better-Auth authentication library
+- Customizable components to fit your design needs
+
+
+# Contribution Guidelines
+
+Thank you for considering contributing to Better-Auth UI. Always welcomed to Issues & PR's.
+## Operational Notes
+- The concept comes before the file paths, so readers understand the workflow before they inspect implementation evidence.
+- Examples stay grounded in detected commands, config names, import paths, or behavior from the repository.
+- Maintainer details live in the reference section so the main page stays useful to product readers.
+- Module pages are generated only from concrete source, route, declaration, or package export evidence.
+- If the module is internal, keep the page focused on responsibility and maintenance boundaries rather than promising public APIs.
+## Maintainer Reference
+The sections above are the reader-facing explanation. The references below are for maintainers who need to verify or update the implementation behind this page.
+
+### Implementation Map
+- `components/bottom-toolbar.tsx` - Evidence file that contributes to the implementation understanding for this page.
+
+### Knowledge Chunks
+- `components/bottom-toolbar.tsx:1-64` - BottomToolbar (source; TypeScript; module components/bottom-toolbar; symbols BottomToolbar). "use client"; import type React from "react"; import { useState } from "react"; import { GitBranch, Bell, Check, X, AlertCircle, ChevronDown, Settings, } from "lucide react"; const langMap: Record = { ts: "TypeScript", txt: "Text", }; const BottomToolbar = ({ lang = "ts" }: { lang?: string }) = { const [language, setLanguage] = useState(langMap[lang] || "TypeScript"); const toggleLanguage = () = { setLanguage((prev:
+
+### Source Details
+- `components/bottom-toolbar.tsx`: language TypeScript; exports `BottomToolbar`
+
+### Evidence
+- `components/bottom-toolbar.tsx`
diff --git a/apps/docs/docs/components/codeblock/page.mdx b/apps/docs/docs/components/codeblock/page.mdx
new file mode 100644
index 0000000..7816437
--- /dev/null
+++ b/apps/docs/docs/components/codeblock/page.mdx
@@ -0,0 +1,68 @@
+---
+title: "Codeblock"
+description: "Codeblock is a repository module detected from 1 source file."
+order: 230
+---
+
+# Codeblock
+
+Codeblock is a repository module detected from 1 source file.
+## What This Module Owns
+Codeblock owns a coherent part of the codebase. This page is generated from module structure, public symbols, routes, and package exports so larger repositories produce deeper docs instead of a fixed sidebar.
+The module key is `components/codeblock`. It was selected because the repository has concrete source evidence for this area, such as files, declarations, routes, or package exports.
+## Module Responsibilities
+- Codeblock
+- CodeSnippet
+- Components
+## Detailed Module Model
+Codeblock is generated from a coherent source area, not from a generic keyword. The docs engine groups files into this page when they share a module boundary, package export, route family, or public symbol surface.
+
+For Better Auth UI, module pages help the docs grow with the repository. Small codebases may only need a few module pages; larger codebases can expose many focused pages so readers can learn one capability, adapter, plugin, or subsystem at a time.
+
+## What to Look For
+- The responsibility owned by this module.
+- The public exports, route handlers, declarations, or configuration values attached to the module.
+- The neighboring docs pages that explain related user-facing workflows or integration details.
+
+## Success Criteria
+- Readers understand why this source area exists before reading file paths.
+- Readers can find the files that define the module without searching the whole repo.
+- Maintainers can update this page when the module's exports, routes, or responsibilities change.
+## Public or Observable Surface
+The items below are extracted from the files attached to this page. Treat them as evidence for what the module exposes or handles, not as a guarantee that every symbol is public API.
+- `CodeSnippet`
+## Repository Notes
+These notes come from the repository README so the page stays grounded in existing project language.
+
+### Overview
+Better-Auth UI is a beautiful and compatible user interface designed to enhance the authentication experience in your applications using [Better Auth](https://better-auth.com) as your authentication library , providing you a set of pre-built UI components that you can easily copy and paste to kickstart your project.
+
+### Features
+- Beautiful and responsive UI components (shadcn , or pure tailwind)
+- Easy integration with the Better-Auth authentication library
+- Customizable components to fit your design needs
+
+
+# Contribution Guidelines
+
+Thank you for considering contributing to Better-Auth UI. Always welcomed to Issues & PR's.
+## Operational Notes
+- The concept comes before the file paths, so readers understand the workflow before they inspect implementation evidence.
+- Examples stay grounded in detected commands, config names, import paths, or behavior from the repository.
+- Maintainer details live in the reference section so the main page stays useful to product readers.
+- Module pages are generated only from concrete source, route, declaration, or package export evidence.
+- If the module is internal, keep the page focused on responsibility and maintenance boundaries rather than promising public APIs.
+## Maintainer Reference
+The sections above are the reader-facing explanation. The references below are for maintainers who need to verify or update the implementation behind this page.
+
+### Implementation Map
+- `components/codeblock/index.tsx` - Evidence file that contributes to the implementation understanding for this page.
+
+### Knowledge Chunks
+- `components/codeblock/index.tsx:1-32` - CodeSnippet (source; TypeScript; module components/codeblock; symbols CodeSnippet). "use client"; import { CodeBlock } from "react code block"; import { themes } from "prism react renderer"; import BottomToolbar from "../bottom toolbar"; export const CodeSnippet = ({ code, language = "jsx", lang = "ts", }: { code: string; language?: string; lang?: string; }) = { return ( ); };
+
+### Source Details
+- `components/codeblock/index.tsx`: language TypeScript; exports `CodeSnippet`
+
+### Evidence
+- `components/codeblock/index.tsx`
diff --git a/apps/docs/docs/components/command-menu/page.mdx b/apps/docs/docs/components/command-menu/page.mdx
new file mode 100644
index 0000000..9072cda
--- /dev/null
+++ b/apps/docs/docs/components/command-menu/page.mdx
@@ -0,0 +1,68 @@
+---
+title: "Command Menu"
+description: "Command Menu is a repository module detected from 1 source file."
+order: 240
+---
+
+# Command Menu
+
+Command Menu is a repository module detected from 1 source file.
+## What This Module Owns
+Command Menu owns a coherent part of the codebase. This page is generated from module structure, public symbols, routes, and package exports so larger repositories produce deeper docs instead of a fixed sidebar.
+The module key is `components/command-menu`. It was selected because the repository has concrete source evidence for this area, such as files, declarations, routes, or package exports.
+## Module Responsibilities
+- Command Menu
+- CommandMenu
+- Components
+## Detailed Module Model
+Command Menu is generated from a coherent source area, not from a generic keyword. The docs engine groups files into this page when they share a module boundary, package export, route family, or public symbol surface.
+
+For Better Auth UI, module pages help the docs grow with the repository. Small codebases may only need a few module pages; larger codebases can expose many focused pages so readers can learn one capability, adapter, plugin, or subsystem at a time.
+
+## What to Look For
+- The responsibility owned by this module.
+- The public exports, route handlers, declarations, or configuration values attached to the module.
+- The neighboring docs pages that explain related user-facing workflows or integration details.
+
+## Success Criteria
+- Readers understand why this source area exists before reading file paths.
+- Readers can find the files that define the module without searching the whole repo.
+- Maintainers can update this page when the module's exports, routes, or responsibilities change.
+## Public or Observable Surface
+The items below are extracted from the files attached to this page. Treat them as evidence for what the module exposes or handles, not as a guarantee that every symbol is public API.
+- `CommandMenu`
+## Repository Notes
+These notes come from the repository README so the page stays grounded in existing project language.
+
+### Overview
+Better-Auth UI is a beautiful and compatible user interface designed to enhance the authentication experience in your applications using [Better Auth](https://better-auth.com) as your authentication library , providing you a set of pre-built UI components that you can easily copy and paste to kickstart your project.
+
+### Features
+- Beautiful and responsive UI components (shadcn , or pure tailwind)
+- Easy integration with the Better-Auth authentication library
+- Customizable components to fit your design needs
+
+
+# Contribution Guidelines
+
+Thank you for considering contributing to Better-Auth UI. Always welcomed to Issues & PR's.
+## Operational Notes
+- The concept comes before the file paths, so readers understand the workflow before they inspect implementation evidence.
+- Examples stay grounded in detected commands, config names, import paths, or behavior from the repository.
+- Maintainer details live in the reference section so the main page stays useful to product readers.
+- Module pages are generated only from concrete source, route, declaration, or package export evidence.
+- If the module is internal, keep the page focused on responsibility and maintenance boundaries rather than promising public APIs.
+## Maintainer Reference
+The sections above are the reader-facing explanation. The references below are for maintainers who need to verify or update the implementation behind this page.
+
+### Implementation Map
+- `components/command-menu.tsx` - Evidence file that contributes to the implementation understanding for this page.
+
+### Knowledge Chunks
+- `components/command-menu.tsx:1-46` - CommandMenu (source; TypeScript; module components/command-menu; symbols CommandMenu). // components/command menu.tsx 'use client'; import as React from 'react'; import { useRouter } from 'next/navigation'; import { CommandDialog, CommandEmpty, CommandGroup, CommandInput, CommandItem, CommandList, } from '@/components/ui/command'; import { searchItems } from '@/lib/search data'; interface CommandMenuProps { open: boolean; onOpenChange: (open: boolean) = void; } export function CommandMenu({ open, onOpe
+
+### Source Details
+- `components/command-menu.tsx`: language TypeScript; exports `CommandMenu`
+
+### Evidence
+- `components/command-menu.tsx`
diff --git a/apps/docs/docs/components/command-palette-context/page.mdx b/apps/docs/docs/components/command-palette-context/page.mdx
new file mode 100644
index 0000000..12fc101
--- /dev/null
+++ b/apps/docs/docs/components/command-palette-context/page.mdx
@@ -0,0 +1,70 @@
+---
+title: "Command Palette Context"
+description: "Command Palette Context is a repository module detected from 1 source file."
+order: 250
+---
+
+# Command Palette Context
+
+Command Palette Context is a repository module detected from 1 source file.
+## What This Module Owns
+Command Palette Context owns a coherent part of the codebase. This page is generated from module structure, public symbols, routes, and package exports so larger repositories produce deeper docs instead of a fixed sidebar.
+The module key is `components/command-palette-context`. It was selected because the repository has concrete source evidence for this area, such as files, declarations, routes, or package exports.
+## Module Responsibilities
+- Command Palette Context
+- CommandPaletteProvider
+- Components
+- useCommandPalette
+## Detailed Module Model
+Command Palette Context is generated from a coherent source area, not from a generic keyword. The docs engine groups files into this page when they share a module boundary, package export, route family, or public symbol surface.
+
+For Better Auth UI, module pages help the docs grow with the repository. Small codebases may only need a few module pages; larger codebases can expose many focused pages so readers can learn one capability, adapter, plugin, or subsystem at a time.
+
+## What to Look For
+- The responsibility owned by this module.
+- The public exports, route handlers, declarations, or configuration values attached to the module.
+- The neighboring docs pages that explain related user-facing workflows or integration details.
+
+## Success Criteria
+- Readers understand why this source area exists before reading file paths.
+- Readers can find the files that define the module without searching the whole repo.
+- Maintainers can update this page when the module's exports, routes, or responsibilities change.
+## Public or Observable Surface
+The items below are extracted from the files attached to this page. Treat them as evidence for what the module exposes or handles, not as a guarantee that every symbol is public API.
+- `CommandPaletteProvider`
+- `useCommandPalette`
+## Repository Notes
+These notes come from the repository README so the page stays grounded in existing project language.
+
+### Overview
+Better-Auth UI is a beautiful and compatible user interface designed to enhance the authentication experience in your applications using [Better Auth](https://better-auth.com) as your authentication library , providing you a set of pre-built UI components that you can easily copy and paste to kickstart your project.
+
+### Features
+- Beautiful and responsive UI components (shadcn , or pure tailwind)
+- Easy integration with the Better-Auth authentication library
+- Customizable components to fit your design needs
+
+
+# Contribution Guidelines
+
+Thank you for considering contributing to Better-Auth UI. Always welcomed to Issues & PR's.
+## Operational Notes
+- The concept comes before the file paths, so readers understand the workflow before they inspect implementation evidence.
+- Examples stay grounded in detected commands, config names, import paths, or behavior from the repository.
+- Maintainer details live in the reference section so the main page stays useful to product readers.
+- Module pages are generated only from concrete source, route, declaration, or package export evidence.
+- If the module is internal, keep the page focused on responsibility and maintenance boundaries rather than promising public APIs.
+## Maintainer Reference
+The sections above are the reader-facing explanation. The references below are for maintainers who need to verify or update the implementation behind this page.
+
+### Implementation Map
+- `components/command-palette-context.tsx` - Evidence file that contributes to the implementation understanding for this page.
+
+### Knowledge Chunks
+- `components/command-palette-context.tsx:1-40` - CommandPaletteProvider, useCommandPalette (source; TypeScript; module components/command-palette-context; symbols CommandPaletteProvider, useCommandPalette). 'use client'; import as React from 'react'; import { CommandMenu } from './command menu'; interface CommandPaletteContextType { setOpen: (open: boolean) = void; } const CommandPaletteContext = React.createContext (undefined); export function useCommandPalette() { const context = React.useContext(CommandPaletteContext); if (context === undefined) { throw new Error('useCommandPalette must be used within a CommandPalett
+
+### Source Details
+- `components/command-palette-context.tsx`: language TypeScript; exports `CommandPaletteProvider`, `useCommandPalette`
+
+### Evidence
+- `components/command-palette-context.tsx`
diff --git a/apps/docs/docs/components/component-code/page.mdx b/apps/docs/docs/components/component-code/page.mdx
new file mode 100644
index 0000000..318cd29
--- /dev/null
+++ b/apps/docs/docs/components/component-code/page.mdx
@@ -0,0 +1,77 @@
+---
+title: "Component Code"
+description: "Component Code is a repository module detected from 1 source file."
+order: 260
+---
+
+# Component Code
+
+Component Code is a repository module detected from 1 source file.
+## What This Module Owns
+Component Code owns a coherent part of the codebase. This page is generated from module structure, public symbols, routes, and package exports so larger repositories produce deeper docs instead of a fixed sidebar.
+The module key is `components/component-code`. It was selected because the repository has concrete source evidence for this area, such as files, declarations, routes, or package exports.
+## Module Responsibilities
+- CodeComponent
+- Component Code
+- Components
+## Detailed Module Model
+Component Code is generated from a coherent source area, not from a generic keyword. The docs engine groups files into this page when they share a module boundary, package export, route family, or public symbol surface.
+
+For Better Auth UI, module pages help the docs grow with the repository. Small codebases may only need a few module pages; larger codebases can expose many focused pages so readers can learn one capability, adapter, plugin, or subsystem at a time.
+
+## What to Look For
+- The responsibility owned by this module.
+- The public exports, route handlers, declarations, or configuration values attached to the module.
+- The neighboring docs pages that explain related user-facing workflows or integration details.
+
+## Success Criteria
+- Readers understand why this source area exists before reading file paths.
+- Readers can find the files that define the module without searching the whole repo.
+- Maintainers can update this page when the module's exports, routes, or responsibilities change.
+## Public or Observable Surface
+The items below are extracted from the files attached to this page. Treat them as evidence for what the module exposes or handles, not as a guarantee that every symbol is public API.
+- `CodeComponent`
+## Repository Notes
+These notes come from the repository README so the page stays grounded in existing project language.
+
+### Overview
+Better-Auth UI is a beautiful and compatible user interface designed to enhance the authentication experience in your applications using [Better Auth](https://better-auth.com) as your authentication library , providing you a set of pre-built UI components that you can easily copy and paste to kickstart your project.
+
+### Features
+- Beautiful and responsive UI components (shadcn , or pure tailwind)
+- Easy integration with the Better-Auth authentication library
+- Customizable components to fit your design needs
+
+
+# Contribution Guidelines
+
+Thank you for considering contributing to Better-Auth UI. Always welcomed to Issues & PR's.
+## Operational Notes
+- The concept comes before the file paths, so readers understand the workflow before they inspect implementation evidence.
+- Examples stay grounded in detected commands, config names, import paths, or behavior from the repository.
+- Maintainer details live in the reference section so the main page stays useful to product readers.
+- Module pages are generated only from concrete source, route, declaration, or package export evidence.
+- If the module is internal, keep the page focused on responsibility and maintenance boundaries rather than promising public APIs.
+## Maintainer Reference
+The sections above are the reader-facing explanation. The references below are for maintainers who need to verify or update the implementation behind this page.
+
+### Implementation Map
+- `app/_components/component-code.tsx` - Evidence file that contributes to the implementation understanding for this page.
+
+### Knowledge Chunks
+- `app/_components/component-code.tsx:1-21` - CodeComponent (source; TypeScript; module components/component-code; symbols CodeComponent). // @ts nocheck import { useEffect, useState, useTransition } from "react"; import { Dialog, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogTitle, DialogTrigger, } from "@/components/ui/dialog"; import { Select, SelectContent, SelectGroup, SelectItem, SelectLabel, SelectTrigger, SelectValue, } from "@/components/ui/select";
+- `app/_components/component-code.tsx:21-76` - CodeComponent (source; TypeScript; module components/component-code; symbols CodeComponent). import { Tabs, TabsContent, TabsList, TabsTrigger } from "@/components/ui/tabs"; import { Layout, Copy, Check, FileText, X, Loader, Terminal, } from "lucide react"; import { Icons } from "@/components/icons"; import { FileTree } from "./component preview"; import { Button } from "@/components/ui/button"; import { CodeSnippet } from "@/components/codeblock"; import { previewComponent } from "../constants/components";
+- `app/_components/component-code.tsx:76-150` - CodeComponent (source; TypeScript; module components/component-code; symbols CodeComponent). env, }; const codeExamples = { next: { language: "typescript", code: nextCode }, react: { language: "typescript", code: previewComponent[0].code.react }, svelte: { language: "html", code: previewComponent[0].code.svelte }, astro: { language: "html", code: previewComponent[0].code.astro }, nuxt: { language: "html", code: previewComponent[0].code.nuxt }, solid: { language: "html", code: previewComponent[0].code.solid }
+- `app/_components/component-code.tsx:150-231` - CodeComponent (source; TypeScript; module components/component-code; symbols CodeComponent). tsx"); break; case "nuxt": setFm("html"); setCurrentSlug("login"); setCurrentPage("login.vue"); break; default: break; } }; const [isPending, startTransition] = useTransition(); const [result, setResult] = useState(null); const [modalOpen, setModalOpen] = useState(false); const handleExport = async (example: any) = { const randomParts = generateCustomKey(); const isForgetEnabled = enabledComp.additionals.forgetPasswo
+- `app/_components/component-code.tsx:231-262` - CodeComponent (source; TypeScript; module components/component-code; symbols CodeComponent). then((res) = { setResult(res); setModalOpen(true); console.log({ res }); }) .catch((err) = { console.log({ err }); }); }); }; const highlightCommand = (command: string) = { const parts = command.split(" "); return ( {parts[0]} {" "} {parts[1]} {" "} {parts[2]} {" "} {parts.slice(3).join(" ")} ); }; return ( { setModalOpen(!modalOpen); }}
+- `app/_components/component-code.tsx:262-309` - CodeComponent (source; TypeScript; module components/component-code; symbols CodeComponent). Install Component Run this command in your terminal to install the component. {highlightCommand( npx shadcn@latest add "https://better auth.farmui.com/r/${result?.id.toString()}", )} { copyToClipboard( npx shadcn@latest add "https://better auth.farmui.com/r/${result?.id}", ); }} {copiedStates ? ( < Copied ) : ( < Copy )}
+- `app/_components/component-code.tsx:309-369` - CodeComponent (source; TypeScript; module components/component-code; symbols CodeComponent). { handleTabClick(e); }} Framework Nextjs React Svelte Nuxt Solid Astro Features > Features). Beautiful and responsive UI components (shadcn , or pure tailwind) Easy integration with the Better Auth authentication library Customizable components to fit your design needs
+- `README.md#features:6-8` - Contribution Guidelines (readme; Markdown; heading README > Features > Contribution Guidelines). Contribution Guidelines Thank you for considering contributing to Better Auth UI. Always welcomed to Issues & PR's.
+- `README.md#overview:1` - Overview (readme; Markdown; heading README > Overview > Overview). Better Auth UI is a beautiful and compatible user interface designed to enhance the authentication experience in your applications using Better Auth as your authentication library , providing you a set of pre built UI components that you can easily copy and paste to kickstart your project.
+- `app/builder/_components/auth-builder.tsx:1-60` - AuthBuilder (source; TypeScript; module builder/components; symbols AuthBuilder). "use client"; import { Tooltip, TooltipContent, TooltipProvider, TooltipTrigger, } from "@/components/ui/tooltip"; import { Dialog, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogTitle, DialogTrigger, } from "@/components/ui/dialog"; import { anyBool } from "@/lib/utils"; import { Layout, Code2, InfoIcon } from "lucide react"; import { Button } from "@/components/ui/button"; import { Label } from
+- `app/builder/_components/auth-builder.tsx:60-98` - AuthBuilder (source; TypeScript; module builder/components; symbols AuthBuilder). Preview Code
+- `app/builder/_components/auth-builder.tsx:98-136` - AuthBuilder (source; TypeScript; module builder/components; symbols AuthBuilder). Create your own{" "} {" "} {" "} Component. Configure the sign in box to your liking and copy the code to your application Credential Login {Object.keys(enabledComp["credentials"]).map( (cred, indx) = { return ( { authOptions["credential"][ cred as keyof EnabledComponent["credentials"] ]["icon"] } { authOptions["credential"][
+- `app/builder/_components/auth-builder.tsx:136-172` - AuthBuilder (source; TypeScript; module builder/components; symbols AuthBuilder). cred as keyof EnabledComponent["credentials"] ]["name"] } {cred in hintTextWithString["yetGroup"] && ( { hintTextWithString[ "yetGroup" ][cred] } )} {anyBool([ enabledComp.otherSignIn.magicLink!, ]) && authOptions["credential"][ cred as keyof EnabledComponent["credentials"] ]["name"] === "Enabled" && (
+- `app/builder/_components/auth-builder.tsx:172-206` - AuthBuilder (source; TypeScript; module builder/components; symbols AuthBuilder). { hintsText["credential"][ "magicLink" ] } )} { updateEnabledComponent({ toogledComp: { credentials: { ...enabledComp["credentials"], [cred]: e, email: !enabledComp.credentials .enabled, }, }, }); }} checked={ enabledComp["credentials"][
+- `app/builder/_components/auth-builder.tsx:206-245` - AuthBuilder (source; TypeScript; module builder/components; symbols AuthBuilder). cred as keyof EnabledComponent["credentials"] ] } / ); }, )} Additional On Credential {Object.keys(enabledComp["additionals"]).map( (addition, indx) = { const exists = addition in authOptions["additionals"]; const enabledCredentials = Object.entries( enabledComp.credentials, ) .filter((curr) = curr[1]) .map((curr) = curr[0]); const fullDeps = enabledComp!.additionals![ addition as keyof EnabledComponent["additionals"
+- `app/builder/_components/auth-builder.tsx:245-281` - AuthBuilder (source; TypeScript; module builder/components; symbols AuthBuilder). addition as keyof additionalAuthType ]["icon"] } { authOptions["additionals"][ addition as keyof additionalAuthType ]["name"] } { updateEnabledComponent({ toogledComp: { additionals: { ...enabledComp["additionals"], [addition]: { ...enabledComp[ "additionals" ][ addition as keyof EnabledComponent["additionals"] ], visiblity: e, routing: false, }, resetPassword: { visiblity:
+
+### Source Details
+- `app/builder/_components/auth-builder.tsx`: language TypeScript; exports `AuthBuilder`
+- `app/builder/_components/lib/auth-options.tsx`: language TypeScript; exports `authOptions`
+- `app/constants/templates/tokenMap.ts`: language TypeScript; exports `parserTokenMap`, `routeMap`
+- `components/sign-in.tsx`: language TypeScript; exports `SignIn`
+
+### Evidence
+- `app/builder/_components/auth-builder.tsx`
+- `app/builder/_components/lib/auth-options.tsx`
+- `app/constants/templates/tokenMap.ts`
+- `components/sign-in.tsx`
+- `README.md#features`
+- `README.md#overview`
diff --git a/apps/docs/docs/hints/page.mdx b/apps/docs/docs/hints/page.mdx
new file mode 100644
index 0000000..fec630b
--- /dev/null
+++ b/apps/docs/docs/hints/page.mdx
@@ -0,0 +1,54 @@
+---
+title: "Hints"
+description: "Hints is a repository module detected from 1 source file."
+order: 140
+---
+
+# Hints
+
+Hints is a repository module detected from 1 source file.
+## What This Module Owns
+Hints owns a coherent part of the codebase. This page is generated from module structure, public symbols, routes, and package exports so larger repositories produce deeper docs instead of a fixed sidebar.
+The module key is `hints`. It was selected because the repository has concrete source evidence for this area, such as files, declarations, routes, or package exports.
+## Module Responsibilities
+- Hints
+- hintsText
+- hintTextWithString
+## Detailed Module Model
+Hints is generated from a coherent source area, not from a generic keyword. The docs engine groups files into this page when they share a module boundary, package export, route family, or public symbol surface.
+
+For Better Auth UI, module pages help the docs grow with the repository. Small codebases may only need a few module pages; larger codebases can expose many focused pages so readers can learn one capability, adapter, plugin, or subsystem at a time.
+
+## What to Look For
+- The responsibility owned by this module.
+- The public exports, route handlers, declarations, or configuration values attached to the module.
+- The neighboring docs pages that explain related user-facing workflows or integration details.
+
+## Success Criteria
+- Readers understand why this source area exists before reading file paths.
+- Readers can find the files that define the module without searching the whole repo.
+- Maintainers can update this page when the module's exports, routes, or responsibilities change.
+## Public or Observable Surface
+The items below are extracted from the files attached to this page. Treat them as evidence for what the module exposes or handles, not as a guarantee that every symbol is public API.
+- `hintsText`
+- `hintTextWithString`
+## Operational Notes
+- The concept comes before the file paths, so readers understand the workflow before they inspect implementation evidence.
+- Examples stay grounded in detected commands, config names, import paths, or behavior from the repository.
+- Maintainer details live in the reference section so the main page stays useful to product readers.
+- Module pages are generated only from concrete source, route, declaration, or package export evidence.
+- If the module is internal, keep the page focused on responsibility and maintenance boundaries rather than promising public APIs.
+## Maintainer Reference
+The sections above are the reader-facing explanation. The references below are for maintainers who need to verify or update the implementation behind this page.
+
+### Implementation Map
+- `app/constants/hints.ts` - Evidence file that contributes to the implementation understanding for this page.
+
+### Knowledge Chunks
+- `app/constants/hints.ts:1-23` - hintsText, hintTextWithString (source; TypeScript; module hints; symbols hintsText, hintTextWithString). interface HintText { credential: { [key: string]: string; }; magicLink: { [key: string]: string; }; } export const hintsText: HintText = { credential: { magicLink: "Please turn off magic link to enable credential.", }, magicLink: { credential: "Please turn off credential to enable magic link.", }, }; export const hintTextWithString: Record = { yetGroup: { phoneNumber: "Phone number will be updated soon.", username: "
+
+### Source Details
+- `app/constants/hints.ts`: language TypeScript; exports `hintsText`, `hintTextWithString`
+
+### Evidence
+- `app/constants/hints.ts`
diff --git a/apps/docs/docs/installation/page.mdx b/apps/docs/docs/installation/page.mdx
new file mode 100644
index 0000000..a34b474
--- /dev/null
+++ b/apps/docs/docs/installation/page.mdx
@@ -0,0 +1,66 @@
+---
+title: "Installation"
+description: "Install and configure Better Auth UI."
+order: 20
+---
+
+# Installation
+
+This page explains how to get Better Auth UI into a runnable state. It separates the setup model from the raw command inventory so readers understand what each step is preparing.
+## Setup Model
+Installation has three jobs: install the package dependencies, provide the runtime configuration the project expects, and verify the command that exercises the main workflow. If any of those steps are skipped, the application may install correctly but still fail when it tries to load database, adapter, environment-backed, or service-backed behavior.
+## What Gets Configured
+- Dependencies provide the framework, CLI, adapters, and runtime libraries used by the project.
+- Environment variables provide secrets, URLs, database connections, provider tokens, and deployment-specific behavior.
+- Scripts provide repeatable entrypoints for local development, production builds, tests, and release tasks.
+## Successful Setup Looks Like
+- Dependencies install with the package manager already used by the repository.
+- Required environment variables are present before runtime commands are executed.
+- The primary command starts, builds, or verifies the project without needing undocumented manual steps.
+## Install Dependencies
+Run `pnpm install` from the repository root.
+## Configure Environment Variables
+Copy `env.example` into `.env` and fill in the required values before running the project.
+- `APPLE_CLIENT_ID`
+- `APPLE_CLIENT_SECRET`
+- `DISCORD_CLIENT_ID`
+- `DISCORD_CLIENT_SECRET`
+- `DROPBOX_CLIENT_ID`
+- `DROPBOX_CLIENT_SECRET`
+- `FACEBOOK_CLIENT_ID`
+- `FACEBOOK_CLIENT_SECRET`
+- `GITHUB_CLIENT_ID`
+- `GITHUB_CLIENT_SECRET`
+- `GITLAB_CLIENT_ID`
+- `GITLAB_CLIENT_SECRET`
+- `GOOGLE_CLIENT_ID`
+- `GOOGLE_CLIENT_SECRET`
+- `LINKEDIN_CLIENT_ID`
+- `LINKEDIN_CLIENT_SECRET`
+- `MICROSOFT_CLIENT_ID`
+- `MICROSOFT_CLIENT_SECRET`
+- `NODE_ENV`
+- `SPOTIFY_CLIENT_ID`
+- `SPOTIFY_CLIENT_SECRET`
+- `TURSO_AUTH_TOKEN`
+- `TURSO_DATABASE_URL`
+- `TWITCH_CLIENT_ID`
+- `TWITCH_CLIENT_SECRET`
+- `TWITTER_CLIENT_ID`
+- `TWITTER_CLIENT_SECRET`
+## Verify the Build or Runtime Command
+The most relevant command detected right now is `pnpm start`.
+## Framework and Adapter Coverage
+- Next.js
+## Configuration Files
+- `components.json` (ui) - shadcn/ui component aliases and project structure.
+- `next.config.mjs` (framework) - Next.js application configuration.
+- `package.json` (package) - Package metadata, scripts, dependencies, and exports.
+- `postcss.config.mjs` (styling) - Styling and CSS pipeline configuration.
+- `tailwind.config.ts` (styling) - Styling and CSS pipeline configuration.
+## Current Script Inventory
+- `dev`: `next dev`
+- `build`: `next build`
+- `start`: `next start`
+- `lint`: `next lint`
+- `postinstall`: `prisma generate`
diff --git a/apps/docs/docs/page.mdx b/apps/docs/docs/page.mdx
new file mode 100644
index 0000000..5d9538c
--- /dev/null
+++ b/apps/docs/docs/page.mdx
@@ -0,0 +1,183 @@
+---
+title: "Better Auth UI"
+description: "Overview for Better Auth UI."
+order: 0
+---
+
+# Better Auth UI
+
+Better Auth UI is a beautiful and compatible user interface designed to enhance the authentication experience in your applications using Better Auth as your authentication library , providing you a set of pre built UI components that you can easily copy and paste to kickstart your project.
+## Product Story
+Better Auth UI is documented as a product with capabilities, workflows, configuration decisions, and integration surfaces. These pages are organized so a reader can understand the purpose of the project before they need to inspect source files.
+## Reader Paths
+- Start with the overview, quickstart, and installation pages to understand the repository before drilling into implementation details.
+- Use feature pages to understand the product capabilities detected from README, routes, UI, or domain evidence.
+- Use configuration pages for detected runtime settings, environment files, deployment files, database files, or product config.
+- Use API reference pages after the mental model is clear and you need routes, commands, adapters, exports, or type contracts.
+## Knowledge Model
+Each page answers four questions: what the concept is, why it matters, how a developer or operator uses it, and where maintainers can verify the implementation. File paths and exports are kept as supporting evidence rather than the main explanation.
+## Documentation Map
+- Get Started: [Better Auth UI](/docs) - Core landing page for the docs app.
+- Get Started: [Quickstart](/docs/quickstart) - Core first-run workflow.
+- Get Started: [Installation](/docs/installation) - Core install and configuration workflow.
+- Core Features: [Features](/docs/features) - Section index generated so nested repository-specific pages are visible in the sidebar.
+- Core Features: [Session Management](/docs/features/session-management) - Detected feature evidence with confidence 0.92.
+- Configuration: [Configuration](/docs/configuration) - Section index generated so nested repository-specific pages are visible in the sidebar.
+- Configuration: [Database](/docs/configuration/database) - Detected configuration evidence with confidence 0.86.
+- Configuration: [Environment Variables](/docs/configuration/environment) - Detected configuration evidence with confidence 0.90.
+- API Reference: [API Reference](/docs/api) - Section index generated so nested repository-specific pages are visible in the sidebar.
+- API Reference: [Configuration API](/docs/api/config) - Section index generated so nested repository-specific pages are visible in the sidebar.
+- API Reference: [Events Config](/docs/api/config/events-config) - Detected api evidence with confidence 0.84.
+- API Reference: [Metadata Config](/docs/api/config/metadata-config) - Detected api evidence with confidence 0.84.
+- Builder: [Builder](/docs/builder) - Section index generated so nested repository-specific pages are visible in the sidebar.
+- Components: [Components](/docs/components) - Section index generated so nested repository-specific pages are visible in the sidebar.
+- Hints: [Hints](/docs/hints) - Detected module evidence with confidence 0.65.
+- Page: [Page](/docs/page) - Detected module evidence with confidence 0.65.
+- Parser: [Parser](/docs/parser) - Section index generated so nested repository-specific pages are visible in the sidebar.
+- R: [R](/docs/r) - Section index generated so nested repository-specific pages are visible in the sidebar.
+- Store: [Store](/docs/store) - Detected module evidence with confidence 0.73.
+- Templates: [Templates](/docs/templates) - Section index generated so nested repository-specific pages are visible in the sidebar.
+- Builder: [Components](/docs/builder/components) - Detected module evidence with confidence 0.94.
+- Builder: [Page](/docs/builder/page) - Detected module evidence with confidence 0.65.
+- Components: [Bottom Toolbar](/docs/components/bottom-toolbar) - Detected module evidence with confidence 0.63.
+- Components: [Codeblock](/docs/components/codeblock) - Detected module evidence with confidence 0.63.
+- Components: [Command Menu](/docs/components/command-menu) - Detected module evidence with confidence 0.63.
+- Components: [Command Palette Context](/docs/components/command-palette-context) - Detected module evidence with confidence 0.65.
+- Components: [Component Code](/docs/components/component-code) - Detected module evidence with confidence 0.63.
+- Components: [Component Display](/docs/components/component-display) - Detected module evidence with confidence 0.63.
+- Components: [Component Preview](/docs/components/component-preview) - Detected module evidence with confidence 0.67.
+- Components: [Component Render](/docs/components/component-render) - Detected module evidence with confidence 0.63.
+- Components: [Credentail](/docs/components/credentail) - Detected module evidence with confidence 0.63.
+- Components: [Element Render](/docs/components/element-render) - Detected module evidence with confidence 0.63.
+- Components: [Element Strucuture](/docs/components/element-strucuture) - Detected module evidence with confidence 0.74.
+- Components: [File Tree](/docs/components/file-tree) - Detected module evidence with confidence 0.70.
+- Components: [Grid Credential Social](/docs/components/grid-credential-social) - Detected module evidence with confidence 0.63.
+- Components: [Icons](/docs/components/icons) - Detected module evidence with confidence 0.63.
+- Components: [Landing](/docs/components/landing) - Detected module evidence with confidence 0.80.
+- Components: [Logo](/docs/components/logo) - Detected module evidence with confidence 0.63.
+- Components: [Navbar](/docs/components/navbar) - Detected module evidence with confidence 0.65.
+- Components: [Navlink](/docs/components/navlink) - Detected module evidence with confidence 0.63.
+- Components: [Provider](/docs/components/provider) - Detected module evidence with confidence 0.63.
+- Components: [Sign In](/docs/components/sign-in) - Detected module evidence with confidence 0.63.
+- Components: [Tab Context](/docs/components/tab-context) - Detected module evidence with confidence 0.67.
+- Components: [Theme Toggler](/docs/components/theme-toggler) - Detected module evidence with confidence 0.65.
+- Components: [Ui](/docs/components/ui) - Detected module evidence with confidence 0.94.
+- Parser: [Next](/docs/parser/next) - Detected module evidence with confidence 0.63.
+- R: [Registry](/docs/r/registry) - Detected module evidence with confidence 0.63.
+- Templates: [File](/docs/templates/file) - Detected module evidence with confidence 0.77.
+- Templates: [Server Client Dep](/docs/templates/server-client-dep) - Detected module evidence with confidence 0.63.
+- Templates: [State](/docs/templates/state) - Detected module evidence with confidence 0.63.
+- Templates: [Token Map](/docs/templates/token-map) - Detected module evidence with confidence 0.65.
+- Templates: [Two Level](/docs/templates/two-level) - Detected module evidence with confidence 0.63.
+- Templates: [Ui Function Dep](/docs/templates/ui-function-dep) - Detected module evidence with confidence 0.65.
+## Maintainer Snapshot
+- Project type: `cli`
+- Package name: `ui-better-auth`
+- Detected runtimes/adapters: Next.js
+- Bootstrap evidence: `README.md`, `package.json`, `components.json`, `next.config.mjs`, `postcss.config.mjs`, `tailwind.config.ts`, `app/builder/_components/auth-builder.tsx`, `app/builder/_components/lib/auth-options.tsx`, `app/constants/templates/tokenMap.ts`, `components/sign-in.tsx`, `README.md#features`, `README.md#overview`, `components/command-menu.tsx`, `components/command-palette-context.tsx`, `components/ui/command.tsx`, `app/builder/_components/apearance-layout.tsx`, `app/builder/_components/component-render.tsx`, `app/builder/_components/lib/code-export.ts`, `app/builder/_components/nested/configs/database.ts`, `app/builder/_components/nested/pages/forget-password.tsx`, `app/builder/_components/nested/pages/reset-password.tsx`, `app/builder/_components/nested/topbar.tsx`, `app/builder/_components/signin.tsx`, `components/ui/accordion.tsx`, `components/ui/alert.tsx`, `components/ui/breadcrumb.tsx`, `components/ui/button.tsx`, `components/ui/card.tsx`, `components/ui/checkbox.tsx`, `components/ui/collapsible.tsx`, `components/ui/dialog.tsx`, `components/ui/dropdown-menu.tsx`, `components/landing/grid-pattern.tsx`, `components/landing/hero.tsx`, `components/landing/section-svg.tsx`, `components/landing/sections.tsx`, `components/landing/shadow-text.tsx`, `app/constants/templates/file.ts`, `app/_components/element-strucuture.tsx`, `app/constants/store.ts`, `lib/store.ts`, `components/file-tree.tsx`, `app/_components/component-preview.tsx`, `components/tab-context.tsx`, `app/constants/hints.ts`, `components/navbar.tsx`, `app/builder/page.tsx`, `app/page.tsx`, `components/theme-toggler.tsx`, `app/constants/templates/ui-function-dep.ts`, `components/bottom-toolbar.tsx`, `components/codeblock/index.tsx`, `app/_components/component-code.tsx`, `app/_components/component-display.tsx`, `app/_components/component-render.tsx`, `app/constants/components/credentail/username-and-password.tsx`, `app/_components/element-render.tsx`, `app/constants/components/GridCredentialSocial.tsx`, `components/icons.tsx`, `components/logo.tsx`, `components/navlink.tsx`, `lib/parser/next.ts`, `components/provider.tsx`, `app/r/[registry]/route.ts`, `app/constants/templates/server-client-dep.ts`, `app/constants/templates/state.ts`, `app/constants/templates/two-level.ts`, `lib/db.ts`, `package.json:@prisma/client`, `package.json:prisma`, `app/metadata.ts`, `app/builder/_components/signup..tsx`, `app/builder/_components/tab.tsx`, `app/constants/components.tsx`, `app/layout.tsx`, `components/ui/input.tsx`, `components/ui/label.tsx`, `components/ui/password-input.tsx`, `components/ui/scroll-area.tsx`, `components/ui/select.tsx`, `components/ui/separator.tsx`, `components/ui/sheet.tsx`, `components/ui/sidebar.tsx`, `components/ui/skeleton.tsx`, `components/ui/switch.tsx`, `components/ui/tabs.tsx`, `components/ui/tooltip.tsx`, `lib/disable-relation.ts`, `lib/history.ts`, `lib/search-data.ts`, `lib/utils.ts`
+## Core Capabilities
+- Session Management: This area explains how the product observes active authentication state. It connects user identity, session creation, sign-in activity, cookies or tokens, and any security-sensitive controls exposed to administrators. Key concepts: sessions, sign in, tokens, cookies.
+- Developer Tools: This section explains the utilities that help developers inspect, configure, or generate parts of the product. These tools are not just UI screens; they are shortcuts for common setup, debugging, schema, email, or integration work. Key concepts: developer tools, generators, inspectors, visual editors.
+- Dashboard Overview: This area gives operators a high-level view of the system before they drill into individual records. It usually brings together counts, recent activity, database state, and health signals so an admin can understand whether the product is working as expected. Key concepts: workspace status, operational metrics, recent activity, dashboard widgets.
+- User Management: This capability is the administrative surface for user records. It helps an operator inspect accounts, find a user by identity, update profile or verification state, and remove records when needed. In an auth-oriented product, this page is usually one of the highest-value docs pages because it explains the exact model an admin interacts with. Key concepts: users, accounts, profiles, email verification.
+- Components: Components owns a coherent part of the codebase. This page is generated from module structure, public symbols, routes, and package exports so larger repositories produce deeper docs instead of a fixed sidebar. Key concepts: ApearanceLayout, AuthBuilder, authOptions, Builder.
+- Ui: Ui owns a coherent part of the codebase. This page is generated from module structure, public symbols, routes, and package exports so larger repositories produce deeper docs instead of a fixed sidebar. Key concepts: Accordion, AccordionContent, AccordionItem, AccordionTrigger.
+- Landing: Landing owns a coherent part of the codebase. This page is generated from module structure, public symbols, routes, and package exports so larger repositories produce deeper docs instead of a fixed sidebar. Key concepts: AuthUIHero, Components, GridPattern, Landing.
+- File: File owns a coherent part of the codebase. This page is generated from module structure, public symbols, routes, and package exports so larger repositories produce deeper docs instead of a fixed sidebar. Key concepts: File, forgetPasswordSnippet, MagicLinkClientImport, MagicLinkClientSnippet.
+- Element Strucuture: Element Strucuture owns a coherent part of the codebase. This page is generated from module structure, public symbols, routes, and package exports so larger repositories produce deeper docs instead of a fixed sidebar. Key concepts: ASTRO_ELEMENTS, Components, Element Strucuture, NEXT_ELEMENTS.
+- Store: Store owns a coherent part of the codebase. This page is generated from module structure, public symbols, routes, and package exports so larger repositories produce deeper docs instead of a fixed sidebar. Key concepts: EnabledComponent, Store, useCodeComponent, useComponents.
+- File Tree: File Tree owns a coherent part of the codebase. This page is generated from module structure, public symbols, routes, and package exports so larger repositories produce deeper docs instead of a fixed sidebar. Key concepts: CollapseButton, Components, File, File Tree.
+- Component Preview: Component Preview owns a coherent part of the codebase. This page is generated from module structure, public symbols, routes, and package exports so larger repositories produce deeper docs instead of a fixed sidebar. Key concepts: Component Preview, Components, ComponentShowcase, FileTree.
+- Tab Context: Tab Context owns a coherent part of the codebase. This page is generated from module structure, public symbols, routes, and package exports so larger repositories produce deeper docs instead of a fixed sidebar. Key concepts: Components, Tab Context, tabOptions, TabProvider.
+- Command Palette Context: Command Palette Context owns a coherent part of the codebase. This page is generated from module structure, public symbols, routes, and package exports so larger repositories produce deeper docs instead of a fixed sidebar. Key concepts: Command Palette Context, CommandPaletteProvider, Components, useCommandPalette.
+- Hints: Hints owns a coherent part of the codebase. This page is generated from module structure, public symbols, routes, and package exports so larger repositories produce deeper docs instead of a fixed sidebar. Key concepts: Hints, hintsText, hintTextWithString.
+- Navbar: Navbar owns a coherent part of the codebase. This page is generated from module structure, public symbols, routes, and package exports so larger repositories produce deeper docs instead of a fixed sidebar. Key concepts: Components, Navbar, navMenu.
+- Page: Page owns a coherent part of the codebase. This page is generated from module structure, public symbols, routes, and package exports so larger repositories produce deeper docs instead of a fixed sidebar. Key concepts: Builder, BuilderPage, metadata, Page.
+- Page: Page owns a coherent part of the codebase. This page is generated from module structure, public symbols, routes, and package exports so larger repositories produce deeper docs instead of a fixed sidebar. Key concepts: BetterAuthUI, metadata, Page.
+## Runtime and Adapter Coverage
+- Next.js
+## Language Coverage
+- TypeScript: 80 analyzed source files
+## Config Files
+- `components.json` (ui) - shadcn/ui component aliases and project structure.
+- `next.config.mjs` (framework) - Next.js application configuration.
+- `package.json` (package) - Package metadata, scripts, dependencies, and exports.
+- `postcss.config.mjs` (styling) - Styling and CSS pipeline configuration.
+- `tailwind.config.ts` (styling) - Styling and CSS pipeline configuration.
+## Available Commands
+- `dev`: `next dev`
+- `build`: `next build`
+- `start`: `next start`
+- `lint`: `next lint`
+- `postinstall`: `prisma generate`
+## Configuration Surface
+- `APPLE_CLIENT_ID`
+- `APPLE_CLIENT_SECRET`
+- `DISCORD_CLIENT_ID`
+- `DISCORD_CLIENT_SECRET`
+- `DROPBOX_CLIENT_ID`
+- `DROPBOX_CLIENT_SECRET`
+- `FACEBOOK_CLIENT_ID`
+- `FACEBOOK_CLIENT_SECRET`
+- `GITHUB_CLIENT_ID`
+- `GITHUB_CLIENT_SECRET`
+- `GITLAB_CLIENT_ID`
+- `GITLAB_CLIENT_SECRET`
+- `GOOGLE_CLIENT_ID`
+- `GOOGLE_CLIENT_SECRET`
+- `LINKEDIN_CLIENT_ID`
+- `LINKEDIN_CLIENT_SECRET`
+- `MICROSOFT_CLIENT_ID`
+- `MICROSOFT_CLIENT_SECRET`
+- `NODE_ENV`
+- `SPOTIFY_CLIENT_ID`
+- `SPOTIFY_CLIENT_SECRET`
+- `TURSO_AUTH_TOKEN`
+- `TURSO_DATABASE_URL`
+- `TWITCH_CLIENT_ID`
+- `TWITCH_CLIENT_SECRET`
+- `TWITTER_CLIENT_ID`
+- `TWITTER_CLIENT_SECRET`
+## Dependencies
+- `@prisma/client` (dependency): `^6.2.1`
+- `@radix-ui/react-accordion` (dependency): `^1.2.1`
+- `@radix-ui/react-checkbox` (dependency): `^1.1.2`
+- `@radix-ui/react-collapsible` (dependency): `^1.1.1`
+- `@radix-ui/react-dialog` (dependency): `^1.1.2`
+- `@radix-ui/react-dropdown-menu` (dependency): `^2.1.2`
+- `@radix-ui/react-icons` (dependency): `^1.3.0`
+- `@radix-ui/react-label` (dependency): `^2.1.0`
+- `@radix-ui/react-scroll-area` (dependency): `^1.2.0`
+- `@radix-ui/react-select` (dependency): `^2.1.2`
+- `@radix-ui/react-separator` (dependency): `^1.1.0`
+- `@radix-ui/react-slot` (dependency): `^1.1.0`
+- `@radix-ui/react-switch` (dependency): `^1.1.1`
+- `@radix-ui/react-tabs` (dependency): `^1.1.1`
+- `@radix-ui/react-tooltip` (dependency): `^1.1.3`
+- `@types/node` (devDependency): `^20`
+- `@types/react` (devDependency): `^18`
+- `@types/react-dom` (devDependency): `^18`
+- `class-variance-authority` (dependency): `^0.7.0`
+- `clsx` (dependency): `^2.1.1`
+- `cmdk` (dependency): `^1.1.1`
+- `eslint` (devDependency): `^8`
+- `eslint-config-next` (devDependency): `14.2.15`
+- `framer-motion` (dependency): `^11.11.9`
+## README Sections
+- ## Overview
+- ## Features
+## Named Exports
+- `Accordion`
+- `AccordionContent`
+- `AccordionItem`
+- `AccordionTrigger`
+- `actionUIDep`
+- `Alert`
+- `AlertDescription`
+- `AlertTitle`
+- `anyBool`
+- `ApearanceLayout`
+- `ASTRO_ELEMENTS`
+- `AuthBuilder`
+## CLI Options
+No CLI options were detected from the current source entrypoints.
diff --git a/apps/docs/docs/page/page.mdx b/apps/docs/docs/page/page.mdx
new file mode 100644
index 0000000..522082a
--- /dev/null
+++ b/apps/docs/docs/page/page.mdx
@@ -0,0 +1,54 @@
+---
+title: "Page"
+description: "Page is a repository module detected from 1 source file."
+order: 150
+---
+
+# Page
+
+Page is a repository module detected from 1 source file.
+## What This Module Owns
+Page owns a coherent part of the codebase. This page is generated from module structure, public symbols, routes, and package exports so larger repositories produce deeper docs instead of a fixed sidebar.
+The module key is `page`. It was selected because the repository has concrete source evidence for this area, such as files, declarations, routes, or package exports.
+## Module Responsibilities
+- BetterAuthUI
+- metadata
+- Page
+## Detailed Module Model
+Page is generated from a coherent source area, not from a generic keyword. The docs engine groups files into this page when they share a module boundary, package export, route family, or public symbol surface.
+
+For Better Auth UI, module pages help the docs grow with the repository. Small codebases may only need a few module pages; larger codebases can expose many focused pages so readers can learn one capability, adapter, plugin, or subsystem at a time.
+
+## What to Look For
+- The responsibility owned by this module.
+- The public exports, route handlers, declarations, or configuration values attached to the module.
+- The neighboring docs pages that explain related user-facing workflows or integration details.
+
+## Success Criteria
+- Readers understand why this source area exists before reading file paths.
+- Readers can find the files that define the module without searching the whole repo.
+- Maintainers can update this page when the module's exports, routes, or responsibilities change.
+## Public or Observable Surface
+The items below are extracted from the files attached to this page. Treat them as evidence for what the module exposes or handles, not as a guarantee that every symbol is public API.
+- `BetterAuthUI`
+- `metadata`
+## Operational Notes
+- The concept comes before the file paths, so readers understand the workflow before they inspect implementation evidence.
+- Examples stay grounded in detected commands, config names, import paths, or behavior from the repository.
+- Maintainer details live in the reference section so the main page stays useful to product readers.
+- Module pages are generated only from concrete source, route, declaration, or package export evidence.
+- If the module is internal, keep the page focused on responsibility and maintenance boundaries rather than promising public APIs.
+## Maintainer Reference
+The sections above are the reader-facing explanation. The references below are for maintainers who need to verify or update the implementation behind this page.
+
+### Implementation Map
+- `app/page.tsx` - Evidence file that contributes to the implementation understanding for this page.
+
+### Knowledge Chunks
+- `app/page.tsx:1-33` - BetterAuthUI, metadata (source; TypeScript; module page; symbols BetterAuthUI, metadata). import AuthUIHero from "@/components/landing/hero"; import { ComponentDisplay } from "./ components/component display"; import Section from "@/components/landing/sections"; export const metadata = { title: "Better Auth UI.", }; const BetterAuthUI = () = { return ( ); }; export default BetterAuthUI;
+
+### Source Details
+- `app/page.tsx`: language TypeScript; exports `BetterAuthUI`, `metadata`
+
+### Evidence
+- `app/page.tsx`
diff --git a/apps/docs/docs/parser/next/page.mdx b/apps/docs/docs/parser/next/page.mdx
new file mode 100644
index 0000000..a4dd8a7
--- /dev/null
+++ b/apps/docs/docs/parser/next/page.mdx
@@ -0,0 +1,55 @@
+---
+title: "Next"
+description: "Next is a repository module detected from 1 source file."
+order: 450
+---
+
+# Next
+
+Next is a repository module detected from 1 source file.
+## What This Module Owns
+Next owns a coherent part of the codebase. This page is generated from module structure, public symbols, routes, and package exports so larger repositories produce deeper docs instead of a fixed sidebar.
+The module key is `parser/next`. It was selected because the repository has concrete source evidence for this area, such as files, declarations, routes, or package exports.
+## Module Responsibilities
+- Next
+- parsedNextContent
+- Parser
+## Detailed Module Model
+Next is generated from a coherent source area, not from a generic keyword. The docs engine groups files into this page when they share a module boundary, package export, route family, or public symbol surface.
+
+For Better Auth UI, module pages help the docs grow with the repository. Small codebases may only need a few module pages; larger codebases can expose many focused pages so readers can learn one capability, adapter, plugin, or subsystem at a time.
+
+## What to Look For
+- The responsibility owned by this module.
+- The public exports, route handlers, declarations, or configuration values attached to the module.
+- The neighboring docs pages that explain related user-facing workflows or integration details.
+
+## Success Criteria
+- Readers understand why this source area exists before reading file paths.
+- Readers can find the files that define the module without searching the whole repo.
+- Maintainers can update this page when the module's exports, routes, or responsibilities change.
+## Public or Observable Surface
+The items below are extracted from the files attached to this page. Treat them as evidence for what the module exposes or handles, not as a guarantee that every symbol is public API.
+- `parsedNextContent`
+## Operational Notes
+- The concept comes before the file paths, so readers understand the workflow before they inspect implementation evidence.
+- Examples stay grounded in detected commands, config names, import paths, or behavior from the repository.
+- Maintainer details live in the reference section so the main page stays useful to product readers.
+- Module pages are generated only from concrete source, route, declaration, or package export evidence.
+- If the module is internal, keep the page focused on responsibility and maintenance boundaries rather than promising public APIs.
+## Maintainer Reference
+The sections above are the reader-facing explanation. The references below are for maintainers who need to verify or update the implementation behind this page.
+
+### Implementation Map
+- `lib/parser/next.ts` - Evidence file that contributes to the implementation understanding for this page.
+
+### Knowledge Chunks
+- `lib/parser/next.ts:1-58` - parsedNextContent (source; TypeScript; module parser/next; symbols parsedNextContent). import { EnabledComponent } from "../store"; import { importAndDistructureCleanup } from "@/app/builder/ components/lib/code export"; import { credentialDep, actionUIDep, } from "@/app/constants/templates/ui function dep"; import { anyBool, secretGen } from "../utils"; import { serverClientDep } from "@/app/constants/templates/server client dep"; import { stateMap } from "@/app/constants/templates/state"; import { pa
+- `lib/parser/next.ts:58-76` - parsedNextContent (source; TypeScript; module parser/next; symbols parsedNextContent). log({ otherEnabledLists, listsOfComments }); listsOfComments = [ "empty", "better auth secret env", ...otherEnabledLists, ...listsOfComments, ...socialEnabledLists, ...credentialLists, ]; let cleanedJsx = ""; const replacableLists = Object.keys(parserTokenMap); if (listsOfComments.length === 1) { cleanedJsx = parseTokens(replacableLists, content, { eraseAll: true, }); } else { /
+- `lib/parser/next.ts:76-118` - parsedNextContent (source; TypeScript; module parser/next; symbols parsedNextContent). cleaning up import distructuring at the top of the file if not used in file e.g import { } from "better auth/plugins" will be converted to empty string since it is useless putting it there / cleanedJsx = importAndDistructureCleanup( "noDistructure", content, otherEnabledLists.length === 0, ); / cleaning up lists like plugin if not imported in a file e.g plugins: [ ] will be converted to empty string since it is usele
+
+### Source Details
+- `lib/parser/next.ts`: language TypeScript; exports `parsedNextContent`
+
+### Evidence
+- `lib/parser/next.ts`
diff --git a/apps/docs/docs/parser/page.mdx b/apps/docs/docs/parser/page.mdx
new file mode 100644
index 0000000..52b0e10
--- /dev/null
+++ b/apps/docs/docs/parser/page.mdx
@@ -0,0 +1,18 @@
+---
+title: "Parser"
+description: "Repository-specific parser pages generated for Better Auth UI."
+order: 160
+---
+
+# Parser
+
+Repository-specific parser pages generated for Better Auth UI.
+
+## How This Section Was Built
+This sidebar section is generated from repository evidence, not from a static template. The docs engine adds a section only when one or more child pages are backed by code, config, README, package export, route, CLI, or environment evidence.
+
+## Pages
+- [Next](/docs/parser/next) - Next is a repository module detected from 1 source file.
+
+## Evidence Used
+- `lib/parser/next.ts`
diff --git a/apps/docs/docs/quickstart/page.mdx b/apps/docs/docs/quickstart/page.mdx
new file mode 100644
index 0000000..b0e6d08
--- /dev/null
+++ b/apps/docs/docs/quickstart/page.mdx
@@ -0,0 +1,38 @@
+---
+title: "Quickstart"
+description: "Run Better Auth UI with the current scripts and configuration."
+order: 10
+---
+
+# Quickstart
+
+Use this page as the shortest path from clone to a useful first run of Better Auth UI. The goal is not to understand every file yet; the goal is to install dependencies, provide required configuration, and run the command that proves the project is alive.
+## What You Will Accomplish
+- Prepare the repository with the detected package manager.
+- Add the minimum environment configuration needed for runtime behavior.
+- Run the primary workflow so you can confirm the project is usable before exploring advanced docs.
+## Before You Start
+This repository appears to use `pnpm` as its package manager.
+Environment-backed behavior was detected, so configuration is part of the first-run path.
+## Recommended First Run
+1. Install dependencies with `pnpm install`.
+2. Copy `env.example` to `.env` and set the required values.
+3. Run `pnpm start` to exercise the main workflow.
+## Useful Commands
+These commands are useful after the first run because they describe the repeatable workflows exposed by the repository.
+- `dev`: `next dev`
+- `build`: `next build`
+- `start`: `next start`
+- `lint`: `next lint`
+- `postinstall`: `prisma generate`
+## Useful CLI Options
+No CLI options were detected from the current source entrypoints.
+## Next Places to Read
+- Better Auth UI: `docs/page.mdx`
+- Installation: `docs/installation/page.mdx`
+- Features: `docs/features/page.mdx`
+- Session Management: `docs/features/session-management/page.mdx`
+- Configuration: `docs/configuration/page.mdx`
+- Database: `docs/configuration/database/page.mdx`
+- Environment Variables: `docs/configuration/environment/page.mdx`
+- API Reference: `docs/api/page.mdx`
diff --git a/apps/docs/docs/r/page.mdx b/apps/docs/docs/r/page.mdx
new file mode 100644
index 0000000..6cae4ea
--- /dev/null
+++ b/apps/docs/docs/r/page.mdx
@@ -0,0 +1,18 @@
+---
+title: "R"
+description: "Repository-specific r pages generated for Better Auth UI."
+order: 170
+---
+
+# R
+
+Repository-specific r pages generated for Better Auth UI.
+
+## How This Section Was Built
+This sidebar section is generated from repository evidence, not from a static template. The docs engine adds a section only when one or more child pages are backed by code, config, README, package export, route, CLI, or environment evidence.
+
+## Pages
+- [Registry](/docs/r/registry) - Registry is a repository module detected from 1 source file.
+
+## Evidence Used
+- `app/r/[registry]/route.ts`
diff --git a/apps/docs/docs/r/registry/page.mdx b/apps/docs/docs/r/registry/page.mdx
new file mode 100644
index 0000000..92e24ab
--- /dev/null
+++ b/apps/docs/docs/r/registry/page.mdx
@@ -0,0 +1,53 @@
+---
+title: "Registry"
+description: "Registry is a repository module detected from 1 source file."
+order: 460
+---
+
+# Registry
+
+Registry is a repository module detected from 1 source file.
+## What This Module Owns
+Registry owns a coherent part of the codebase. This page is generated from module structure, public symbols, routes, and package exports so larger repositories produce deeper docs instead of a fixed sidebar.
+The module key is `r/registry`. It was selected because the repository has concrete source evidence for this area, such as files, declarations, routes, or package exports.
+## Module Responsibilities
+- GET
+- R
+- Registry
+## Detailed Module Model
+Registry is generated from a coherent source area, not from a generic keyword. The docs engine groups files into this page when they share a module boundary, package export, route family, or public symbol surface.
+
+For Better Auth UI, module pages help the docs grow with the repository. Small codebases may only need a few module pages; larger codebases can expose many focused pages so readers can learn one capability, adapter, plugin, or subsystem at a time.
+
+## What to Look For
+- The responsibility owned by this module.
+- The public exports, route handlers, declarations, or configuration values attached to the module.
+- The neighboring docs pages that explain related user-facing workflows or integration details.
+
+## Success Criteria
+- Readers understand why this source area exists before reading file paths.
+- Readers can find the files that define the module without searching the whole repo.
+- Maintainers can update this page when the module's exports, routes, or responsibilities change.
+## Public or Observable Surface
+The items below are extracted from the files attached to this page. Treat them as evidence for what the module exposes or handles, not as a guarantee that every symbol is public API.
+- `GET`
+## Operational Notes
+- The concept comes before the file paths, so readers understand the workflow before they inspect implementation evidence.
+- Examples stay grounded in detected commands, config names, import paths, or behavior from the repository.
+- Maintainer details live in the reference section so the main page stays useful to product readers.
+- Module pages are generated only from concrete source, route, declaration, or package export evidence.
+- If the module is internal, keep the page focused on responsibility and maintenance boundaries rather than promising public APIs.
+## Maintainer Reference
+The sections above are the reader-facing explanation. The references below are for maintainers who need to verify or update the implementation behind this page.
+
+### Implementation Map
+- `app/r/[registry]/route.ts` - Evidence file that contributes to the implementation understanding for this page.
+
+### Knowledge Chunks
+- `app/r/[registry]/route.ts:1-21` - GET (source; TypeScript; module r/registry; symbols GET). import { db } from "@/lib/db"; export async function GET( request: Request, { params }: { params: { registry: string } }, ) { const registry = await db.componentExport.findUnique({ where: { id: params.registry, }, include: { files: true, }, }); if (!registry) { return new Response(null, { status: 404 }); } return new Response(JSON.stringify(registry), { headers: { "content type": "application/json" }, }); }
+
+### Source Details
+- `app/r/[registry]/route.ts`: language TypeScript; exports `GET`
+
+### Evidence
+- `app/r/[registry]/route.ts`
diff --git a/apps/docs/docs/store/page.mdx b/apps/docs/docs/store/page.mdx
new file mode 100644
index 0000000..3af1cbc
--- /dev/null
+++ b/apps/docs/docs/store/page.mdx
@@ -0,0 +1,72 @@
+---
+title: "Store"
+description: "Store is a repository module detected from 2 source files."
+order: 180
+---
+
+# Store
+
+Store is a repository module detected from 2 source files.
+## What This Module Owns
+Store owns a coherent part of the codebase. This page is generated from module structure, public symbols, routes, and package exports so larger repositories produce deeper docs instead of a fixed sidebar.
+The module key is `store`. It was selected because the repository has concrete source evidence for this area, such as files, declarations, routes, or package exports.
+## Module Responsibilities
+- EnabledComponent
+- Store
+- useCodeComponent
+- useComponents
+- useCurrentDisable
+- useUrl
+## Detailed Module Model
+Store is generated from a coherent source area, not from a generic keyword. The docs engine groups files into this page when they share a module boundary, package export, route family, or public symbol surface.
+
+For Better Auth UI, module pages help the docs grow with the repository. Small codebases may only need a few module pages; larger codebases can expose many focused pages so readers can learn one capability, adapter, plugin, or subsystem at a time.
+
+## What to Look For
+- The responsibility owned by this module.
+- The public exports, route handlers, declarations, or configuration values attached to the module.
+- The neighboring docs pages that explain related user-facing workflows or integration details.
+
+## Success Criteria
+- Readers understand why this source area exists before reading file paths.
+- Readers can find the files that define the module without searching the whole repo.
+- Maintainers can update this page when the module's exports, routes, or responsibilities change.
+## Public or Observable Surface
+The items below are extracted from the files attached to this page. Treat them as evidence for what the module exposes or handles, not as a guarantee that every symbol is public API.
+- `EnabledComponent`
+- `useCodeComponent`
+- `useComponents`
+- `useCurrentDisable`
+- `useUrl`
+## Operational Notes
+- The concept comes before the file paths, so readers understand the workflow before they inspect implementation evidence.
+- Examples stay grounded in detected commands, config names, import paths, or behavior from the repository.
+- Maintainer details live in the reference section so the main page stays useful to product readers.
+- Module pages are generated only from concrete source, route, declaration, or package export evidence.
+- If the module is internal, keep the page focused on responsibility and maintenance boundaries rather than promising public APIs.
+## Maintainer Reference
+The sections above are the reader-facing explanation. The references below are for maintainers who need to verify or update the implementation behind this page.
+
+### Implementation Map
+- `app/constants/store.ts` - Evidence file that contributes to the implementation understanding for this page.
+- `lib/store.ts` - Evidence file that contributes to the implementation understanding for this page.
+
+### Knowledge Chunks
+- `app/constants/store.ts:1-109` - useCodeComponent (source; TypeScript; module store; symbols useCodeComponent). import { create } from "zustand"; const firstName = "firstName"; const lastName = "lastName"; interface FileStructure { pages: Partial ; components: Partial ; files: Partial ; } interface Codeblocks { title: string; slug: string; code: Partial ; } interface CodeBlocks { title: "SignIn UI Block"; slug: "signin ui"; } export const useCodeComponent = create ((set) = ({ title: "SignIn UI Block", slug: "signin ui", code:
+- `app/constants/store.ts:109-128` - useCodeComponent (source; TypeScript; module store; symbols useCodeComponent). preventDefault(); setIsSubmitting(true); setError(""); try { const res = await client.forgetPassword({ email, redirectTo: "/reset password", }); setIsSubmitted(true); } catch (err) { setError("An error occurred. Please try again."); } finally { setIsSubmitting(false); } }; if (isSubmitted) { return (
+- `app/constants/store.ts:128-161` - useCodeComponent (source; TypeScript; module store; symbols useCodeComponent). Check your email We've sent a password reset link to your email. If you don't see the email, check your spam folder. setIsSubmitted(false)} Back to reset password ); } return ( {/ Radial gradient for the container to give a faded look /}
+- `app/constants/store.ts:161-238` - useCodeComponent (source; TypeScript; module store; symbols useCodeComponent). Forgot password Enter your email to reset your password Email setEmail(e.target.value)} required / {error && ( {error} )} {isSubmitting ? "Sending..." : "Send reset link"} Back to sign in ); }, resetPassword: "use client"; import { Alert, AlertDescription } from "@/components/ui/alert"; import { Button } from "@/components/ui/button"; import { Card, CardContent, CardDescription, CardFooter, CardHeader, CardTitle, } f
+- `app/constants/store.ts:238-251` - useCodeComponent (source; TypeScript; module store; symbols useCodeComponent). preventDefault(); setIsSubmitting(true); setError(""); const res = await client.resetPassword({ newPassword: password, }); if (res.error) { toast.error(res.error.message); } setIsSubmitting(false); router.push("/sign in"); } return (
+- `app/constants/store.ts:251-294` - useCodeComponent (source; TypeScript; module store; symbols useCodeComponent). Reset password Enter new password and confirm it to reset your password New password setPassword(e.target.value)} autoComplete="password" placeholder="Password" / Confirm password setConfirmPassword(e.target.value)} autoComplete="password" placeholder="Password" / {error && ( {error} )} {isSubmitting ? "Resetting...
+- `app/constants/store.ts:294-354` - useCodeComponent (source; TypeScript; module store; symbols useCodeComponent). " : "Reset password"} ); } , signin: "use client" import { Button } from "@/components/ui/button"; import { Card, CardContent, CardDescription, CardFooter, CardHeader, CardTitle, } from "@/components/ui/card"; import { Checkbox } from "@/components/ui/checkbox"; import { Input } from "@/components/ui/input"; import { Label } from "@/components/ui/label"; import { PasswordInput } from "@/components/ui/password input";
+- `app/constants/store.ts:354-397` - useCodeComponent (source; TypeScript; module store; symbols useCodeComponent). value); }} value={email} / // forgetPassword // passwordInput // rememberMeUI // signInAction // magicLinkAction // googleUI // googleContinueUI // appleUI // appleContinueUI // facebookUI // facebookContinueUI // microsoftUI // microsoftContinueUI // discordUI // discordContinueUI // twitterUI // twitterContinueUI // twitchUI // twitchContinueUI // githubUI // githubContinueUI // dropboxUI // dropboxContinueUI // gi
+- `app/constants/store.ts:397-454` - useCodeComponent (source; TypeScript; module store; symbols useCodeComponent). ); } export default LogIn , signup: "use client"; import { Button } from "@/components/ui/button"; import { Card, CardContent, CardDescription, CardFooter, CardHeader, CardTitle, } from "@/components/ui/card"; import { Input } from "@/components/ui/input"; import { Label } from "@/components/ui/label"; import { PasswordInput } from "@/components/ui/password input"; import { DiscordLogoIcon, GitHubLogoIcon } from "@ra
+- `app/constants/store.ts:454-523` - useCodeComponent (source; TypeScript; module store; symbols useCodeComponent). readAsDataURL(file); } }; const [loading, setLoading] = useState(false); return ( Sign Up Enter your information to create an account First name { setFirstName(e.target.value); }} value={firstName} / Last name { setLastName(e.target.value); }} value={lastName} / Email { setEmail(e.target.value); }} value={email} / Password setPassword(e.target.value)} autoComplete="new password" placeholder="Password" / Confirm Passw
+
+### Source Details
+- `app/constants/store.ts`: language TypeScript; exports `useCodeComponent`
+- `lib/store.ts`: language TypeScript; exports `EnabledComponent`, `useComponents`, `useCurrentDisable`, `useUrl`
+
+### Evidence
+- `app/constants/store.ts`
+- `lib/store.ts`
diff --git a/apps/docs/docs/templates/file/page.mdx b/apps/docs/docs/templates/file/page.mdx
new file mode 100644
index 0000000..b12e4c1
--- /dev/null
+++ b/apps/docs/docs/templates/file/page.mdx
@@ -0,0 +1,70 @@
+---
+title: "File"
+description: "File is a repository module detected from 1 source file."
+order: 470
+---
+
+# File
+
+File is a repository module detected from 1 source file.
+## What This Module Owns
+File owns a coherent part of the codebase. This page is generated from module structure, public symbols, routes, and package exports so larger repositories produce deeper docs instead of a fixed sidebar.
+The module key is `templates/file`. It was selected because the repository has concrete source evidence for this area, such as files, declarations, routes, or package exports.
+## Module Responsibilities
+- File
+- forgetPasswordSnippet
+- MagicLinkClientImport
+- MagicLinkClientSnippet
+- MagicLinkServerImport
+- MagicLinkServerSnippet
+- PassKeyClientImport
+- PassKeyClientSnippet
+- PassKeyServerImport
+- Templates
+## Detailed Module Model
+File is generated from a coherent source area, not from a generic keyword. The docs engine groups files into this page when they share a module boundary, package export, route family, or public symbol surface.
+
+For Better Auth UI, module pages help the docs grow with the repository. Small codebases may only need a few module pages; larger codebases can expose many focused pages so readers can learn one capability, adapter, plugin, or subsystem at a time.
+
+## What to Look For
+- The responsibility owned by this module.
+- The public exports, route handlers, declarations, or configuration values attached to the module.
+- The neighboring docs pages that explain related user-facing workflows or integration details.
+
+## Success Criteria
+- Readers understand why this source area exists before reading file paths.
+- Readers can find the files that define the module without searching the whole repo.
+- Maintainers can update this page when the module's exports, routes, or responsibilities change.
+## Public or Observable Surface
+The items below are extracted from the files attached to this page. Treat them as evidence for what the module exposes or handles, not as a guarantee that every symbol is public API.
+- `forgetPasswordSnippet`
+- `MagicLinkClientImport`
+- `MagicLinkClientSnippet`
+- `MagicLinkServerImport`
+- `MagicLinkServerSnippet`
+- `PassKeyClientImport`
+- `PassKeyClientSnippet`
+- `PassKeyServerImport`
+- `PassKeyServerSnippet`
+- `PassKeySnippet`
+- `remeberMeSnippet`
+## Operational Notes
+- The concept comes before the file paths, so readers understand the workflow before they inspect implementation evidence.
+- Examples stay grounded in detected commands, config names, import paths, or behavior from the repository.
+- Maintainer details live in the reference section so the main page stays useful to product readers.
+- Module pages are generated only from concrete source, route, declaration, or package export evidence.
+- If the module is internal, keep the page focused on responsibility and maintenance boundaries rather than promising public APIs.
+## Maintainer Reference
+The sections above are the reader-facing explanation. The references below are for maintainers who need to verify or update the implementation behind this page.
+
+### Implementation Map
+- `app/constants/templates/file.ts` - Evidence file that contributes to the implementation understanding for this page.
+
+### Knowledge Chunks
+- `app/constants/templates/file.ts:1-70` - forgetPasswordSnippet, MagicLinkClientImport, MagicLinkClientSnippet (source; TypeScript; module templates/file; symbols forgetPasswordSnippet, MagicLinkClientImport, MagicLinkClientSnippet, MagicLinkServerImport). export const forgetPasswordSnippet = Password Forgot your password? ; export const remeberMeSnippet = { setRememberMe(!rememberMe); }} / Remember me ; export const PassKeySnippet = { await signIn.passkey({ fetchOptions: { onResponse(context) { router.push("/dashboard"); }, }, }); }} Sign in with Passkey ; export const PassKeyServerImport = passkey, ; export const MagicLinkServerImport = magicLink ; export const PassK
+
+### Source Details
+- `app/constants/templates/file.ts`: language TypeScript; exports `forgetPasswordSnippet`, `MagicLinkClientImport`, `MagicLinkClientSnippet`, `MagicLinkServerImport`, `MagicLinkServerSnippet`, `PassKeyClientImport`
+
+### Evidence
+- `app/constants/templates/file.ts`
diff --git a/apps/docs/docs/templates/page.mdx b/apps/docs/docs/templates/page.mdx
new file mode 100644
index 0000000..65cea1d
--- /dev/null
+++ b/apps/docs/docs/templates/page.mdx
@@ -0,0 +1,23 @@
+---
+title: "Templates"
+description: "Repository-specific templates pages generated for Better Auth UI."
+order: 190
+---
+
+# Templates
+
+Repository-specific templates pages generated for Better Auth UI.
+
+## How This Section Was Built
+This sidebar section is generated from repository evidence, not from a static template. The docs engine adds a section only when one or more child pages are backed by code, config, README, package export, route, CLI, or environment evidence.
+
+## Pages
+- [File](/docs/templates/file) - File is a repository module detected from 1 source file.
+- [Server Client Dep](/docs/templates/server-client-dep) - Server Client Dep is a repository module detected from 1 source file.
+- [State](/docs/templates/state) - State is a repository module detected from 1 source file.
+- [Token Map](/docs/templates/token-map) - Token Map is a repository module detected from 1 source file.
+- [Two Level](/docs/templates/two-level) - Two Level is a repository module detected from 1 source file.
+- [Ui Function Dep](/docs/templates/ui-function-dep) - Ui Function Dep is a repository module detected from 1 source file.
+
+## Evidence Used
+- `app/constants/templates/file.ts`
diff --git a/apps/docs/docs/templates/server-client-dep/page.mdx b/apps/docs/docs/templates/server-client-dep/page.mdx
new file mode 100644
index 0000000..9fbb9ae
--- /dev/null
+++ b/apps/docs/docs/templates/server-client-dep/page.mdx
@@ -0,0 +1,53 @@
+---
+title: "Server Client Dep"
+description: "Server Client Dep is a repository module detected from 1 source file."
+order: 480
+---
+
+# Server Client Dep
+
+Server Client Dep is a repository module detected from 1 source file.
+## What This Module Owns
+Server Client Dep owns a coherent part of the codebase. This page is generated from module structure, public symbols, routes, and package exports so larger repositories produce deeper docs instead of a fixed sidebar.
+The module key is `templates/server-client-dep`. It was selected because the repository has concrete source evidence for this area, such as files, declarations, routes, or package exports.
+## Module Responsibilities
+- Server Client Dep
+- serverClientDep
+- Templates
+## Detailed Module Model
+Server Client Dep is generated from a coherent source area, not from a generic keyword. The docs engine groups files into this page when they share a module boundary, package export, route family, or public symbol surface.
+
+For Better Auth UI, module pages help the docs grow with the repository. Small codebases may only need a few module pages; larger codebases can expose many focused pages so readers can learn one capability, adapter, plugin, or subsystem at a time.
+
+## What to Look For
+- The responsibility owned by this module.
+- The public exports, route handlers, declarations, or configuration values attached to the module.
+- The neighboring docs pages that explain related user-facing workflows or integration details.
+
+## Success Criteria
+- Readers understand why this source area exists before reading file paths.
+- Readers can find the files that define the module without searching the whole repo.
+- Maintainers can update this page when the module's exports, routes, or responsibilities change.
+## Public or Observable Surface
+The items below are extracted from the files attached to this page. Treat them as evidence for what the module exposes or handles, not as a guarantee that every symbol is public API.
+- `serverClientDep`
+## Operational Notes
+- The concept comes before the file paths, so readers understand the workflow before they inspect implementation evidence.
+- Examples stay grounded in detected commands, config names, import paths, or behavior from the repository.
+- Maintainer details live in the reference section so the main page stays useful to product readers.
+- Module pages are generated only from concrete source, route, declaration, or package export evidence.
+- If the module is internal, keep the page focused on responsibility and maintenance boundaries rather than promising public APIs.
+## Maintainer Reference
+The sections above are the reader-facing explanation. The references below are for maintainers who need to verify or update the implementation behind this page.
+
+### Implementation Map
+- `app/constants/templates/server-client-dep.ts` - Evidence file that contributes to the implementation understanding for this page.
+
+### Knowledge Chunks
+- `app/constants/templates/server-client-dep.ts:1-16` - serverClientDep (source; TypeScript; module templates/server-client-dep; symbols serverClientDep). export const serverClientDep: Record = { passKey: [ "passKeyClient", "passKeyServerImport", "passKeyClientImport", "passKeyServer", ], magicLink: [ "magicLinkClient", "magicLinkServerImport", "magicLinkClientImport", "magicLinkServer", "magicLinkAction", ], };
+
+### Source Details
+- `app/constants/templates/server-client-dep.ts`: language TypeScript; exports `serverClientDep`
+
+### Evidence
+- `app/constants/templates/server-client-dep.ts`
diff --git a/apps/docs/docs/templates/state/page.mdx b/apps/docs/docs/templates/state/page.mdx
new file mode 100644
index 0000000..268105b
--- /dev/null
+++ b/apps/docs/docs/templates/state/page.mdx
@@ -0,0 +1,53 @@
+---
+title: "State"
+description: "State is a repository module detected from 1 source file."
+order: 490
+---
+
+# State
+
+State is a repository module detected from 1 source file.
+## What This Module Owns
+State owns a coherent part of the codebase. This page is generated from module structure, public symbols, routes, and package exports so larger repositories produce deeper docs instead of a fixed sidebar.
+The module key is `templates/state`. It was selected because the repository has concrete source evidence for this area, such as files, declarations, routes, or package exports.
+## Module Responsibilities
+- State
+- stateMap
+- Templates
+## Detailed Module Model
+State is generated from a coherent source area, not from a generic keyword. The docs engine groups files into this page when they share a module boundary, package export, route family, or public symbol surface.
+
+For Better Auth UI, module pages help the docs grow with the repository. Small codebases may only need a few module pages; larger codebases can expose many focused pages so readers can learn one capability, adapter, plugin, or subsystem at a time.
+
+## What to Look For
+- The responsibility owned by this module.
+- The public exports, route handlers, declarations, or configuration values attached to the module.
+- The neighboring docs pages that explain related user-facing workflows or integration details.
+
+## Success Criteria
+- Readers understand why this source area exists before reading file paths.
+- Readers can find the files that define the module without searching the whole repo.
+- Maintainers can update this page when the module's exports, routes, or responsibilities change.
+## Public or Observable Surface
+The items below are extracted from the files attached to this page. Treat them as evidence for what the module exposes or handles, not as a guarantee that every symbol is public API.
+- `stateMap`
+## Operational Notes
+- The concept comes before the file paths, so readers understand the workflow before they inspect implementation evidence.
+- Examples stay grounded in detected commands, config names, import paths, or behavior from the repository.
+- Maintainer details live in the reference section so the main page stays useful to product readers.
+- Module pages are generated only from concrete source, route, declaration, or package export evidence.
+- If the module is internal, keep the page focused on responsibility and maintenance boundaries rather than promising public APIs.
+## Maintainer Reference
+The sections above are the reader-facing explanation. The references below are for maintainers who need to verify or update the implementation behind this page.
+
+### Implementation Map
+- `app/constants/templates/state.ts` - Evidence file that contributes to the implementation understanding for this page.
+
+### Knowledge Chunks
+- `app/constants/templates/state.ts:1-5` - stateMap (source; TypeScript; module templates/state; symbols stateMap). export const stateMap: Record = { email: ["signInAction"], rememberMe: ["rememberMeState", "rememberMeValue", "rememberMeUI"], };
+
+### Source Details
+- `app/constants/templates/state.ts`: language TypeScript; exports `stateMap`
+
+### Evidence
+- `app/constants/templates/state.ts`
diff --git a/apps/docs/docs/templates/token-map/page.mdx b/apps/docs/docs/templates/token-map/page.mdx
new file mode 100644
index 0000000..4584aaa
--- /dev/null
+++ b/apps/docs/docs/templates/token-map/page.mdx
@@ -0,0 +1,64 @@
+---
+title: "Token Map"
+description: "Token Map is a repository module detected from 1 source file."
+order: 500
+---
+
+# Token Map
+
+Token Map is a repository module detected from 1 source file.
+## What This Module Owns
+Token Map owns a coherent part of the codebase. This page is generated from module structure, public symbols, routes, and package exports so larger repositories produce deeper docs instead of a fixed sidebar.
+The module key is `templates/token-map`. It was selected because the repository has concrete source evidence for this area, such as files, declarations, routes, or package exports.
+## Module Responsibilities
+- parserTokenMap
+- routeMap
+- Templates
+- Token Map
+## Detailed Module Model
+Token Map is generated from a coherent source area, not from a generic keyword. The docs engine groups files into this page when they share a module boundary, package export, route family, or public symbol surface.
+
+For Better Auth UI, module pages help the docs grow with the repository. Small codebases may only need a few module pages; larger codebases can expose many focused pages so readers can learn one capability, adapter, plugin, or subsystem at a time.
+
+## What to Look For
+- The responsibility owned by this module.
+- The public exports, route handlers, declarations, or configuration values attached to the module.
+- The neighboring docs pages that explain related user-facing workflows or integration details.
+
+## Success Criteria
+- Readers understand why this source area exists before reading file paths.
+- Readers can find the files that define the module without searching the whole repo.
+- Maintainers can update this page when the module's exports, routes, or responsibilities change.
+## Public or Observable Surface
+The items below are extracted from the files attached to this page. Treat them as evidence for what the module exposes or handles, not as a guarantee that every symbol is public API.
+- `parserTokenMap`
+- `routeMap`
+## Operational Notes
+- The concept comes before the file paths, so readers understand the workflow before they inspect implementation evidence.
+- Examples stay grounded in detected commands, config names, import paths, or behavior from the repository.
+- Maintainer details live in the reference section so the main page stays useful to product readers.
+- Module pages are generated only from concrete source, route, declaration, or package export evidence.
+- If the module is internal, keep the page focused on responsibility and maintenance boundaries rather than promising public APIs.
+## Maintainer Reference
+The sections above are the reader-facing explanation. The references below are for maintainers who need to verify or update the implementation behind this page.
+
+### Implementation Map
+- `app/constants/templates/tokenMap.ts` - Evidence file that contributes to the implementation understanding for this page.
+
+### Knowledge Chunks
+- `app/constants/templates/tokenMap.ts:1-77` - parserTokenMap, routeMap (source; TypeScript; module templates/token-map; symbols parserTokenMap, routeMap). import { secretGen } from "@/lib/utils"; import { forgetPasswordSnippet, MagicLinkClientImport, MagicLinkClientSnippet, MagicLinkServerImport, MagicLinkServerSnippet, PassKeyClientImport, PassKeyClientSnippet, PassKeyServerImport, PassKeyServerSnippet, PassKeySnippet, remeberMeSnippet, } from "./file"; const generateSec = secretGen(); export const parserTokenMap: Record = { socialProviders: socialProviders: { } , for
+- `app/constants/templates/tokenMap.ts:77-98` - parserTokenMap, routeMap (source; TypeScript; module templates/token-map; symbols parserTokenMap, routeMap). email( { email: email, password: password, callbackURL: "/dashboard", // rememberMeValue }, { onRequest: () = { setLoading(true); }, onResponse: () = { setLoading(false); }, onError: (ctx) = { toast.error(ctx.error.message); }, } ); }}
+- `app/constants/templates/tokenMap.ts:98-142` - parserTokenMap, routeMap (source; TypeScript; module templates/token-map; symbols parserTokenMap, routeMap). {loading ? : "Login"} , magicLinkAction: { await client.signin.magicLink({ email }) }} Sign in with Magickey , googleUI: { await client.signIn.social({ provider: "google" }) }}
+///
+
+// NOTE: This file should not be edited.
+// See https://nextjs.org/docs/app/api-reference/config/typescript for more information.
diff --git a/apps/docs/next.config.ts b/apps/docs/next.config.ts
new file mode 100644
index 0000000..3198e62
--- /dev/null
+++ b/apps/docs/next.config.ts
@@ -0,0 +1,3 @@
+import { withDocs } from "@farming-labs/next/config";
+
+export default withDocs({});
diff --git a/apps/docs/package.json b/apps/docs/package.json
new file mode 100644
index 0000000..e001e4c
--- /dev/null
+++ b/apps/docs/package.json
@@ -0,0 +1,26 @@
+{
+ "name": "docs",
+ "private": true,
+ "scripts": {
+ "dev": "next dev --turbopack",
+ "build": "next build --turbopack",
+ "start": "next start"
+ },
+ "dependencies": {
+ "@farming-labs/docs": "latest",
+ "@farming-labs/next": "latest",
+ "@farming-labs/theme": "latest",
+ "next": "16.2.3",
+ "react": "^19.0.0",
+ "react-dom": "^19.0.0"
+ },
+ "devDependencies": {
+ "@tailwindcss/postcss": "^4.1.18",
+ "@types/node": "^22.10.0",
+ "@types/react": "^19.0.0",
+ "@types/react-dom": "^19.0.0",
+ "postcss": "^8.5.6",
+ "tailwindcss": "^4.1.18",
+ "typescript": "^5.9.3"
+ }
+}
diff --git a/apps/docs/postcss.config.mjs b/apps/docs/postcss.config.mjs
new file mode 100644
index 0000000..61e3684
--- /dev/null
+++ b/apps/docs/postcss.config.mjs
@@ -0,0 +1,7 @@
+const config = {
+ plugins: {
+ "@tailwindcss/postcss": {},
+ },
+};
+
+export default config;
diff --git a/apps/docs/tsconfig.json b/apps/docs/tsconfig.json
new file mode 100644
index 0000000..247f602
--- /dev/null
+++ b/apps/docs/tsconfig.json
@@ -0,0 +1,42 @@
+{
+ "compilerOptions": {
+ "target": "ES2017",
+ "lib": [
+ "dom",
+ "dom.iterable",
+ "esnext"
+ ],
+ "allowJs": true,
+ "skipLibCheck": true,
+ "strict": true,
+ "noEmit": true,
+ "esModuleInterop": true,
+ "module": "esnext",
+ "moduleResolution": "bundler",
+ "resolveJsonModule": true,
+ "isolatedModules": true,
+ "jsx": "react-jsx",
+ "incremental": true,
+ "plugins": [
+ {
+ "name": "next"
+ }
+ ],
+ "baseUrl": ".",
+ "paths": {
+ "@/*": [
+ "./*"
+ ]
+ }
+ },
+ "include": [
+ "next-env.d.ts",
+ "**/*.ts",
+ "**/*.tsx",
+ ".next/types/**/*.ts",
+ ".next/dev/types/**/*.ts"
+ ],
+ "exclude": [
+ "node_modules"
+ ]
+}
diff --git a/docs.cloud.json b/docs.cloud.json
new file mode 100644
index 0000000..5cc4ee8
--- /dev/null
+++ b/docs.cloud.json
@@ -0,0 +1,15 @@
+{
+ "$schema": "https://docs.farming-labs.dev/schema/cloud.json",
+ "version": 1,
+ "docs": {
+ "root": "apps/docs",
+ "framework": "nextjs"
+ },
+ "preview": {
+ "enabled": true
+ },
+ "publish": {
+ "mode": "draft-pr",
+ "baseBranch": "main"
+ }
+}