npm - @knowcode/doc-builder - Versions diffs - 1.9.20 → 1.9.21 - Mend

@knowcode/doc-builder 1.9.20 → 1.9.21

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

Files changed (86) hide show

package/cli.js +15 -1
package/doc-builder.config.js +4 -2
package/doc-builder.config.js.backup.1754567425847 +124 -0
package/html/README.html +3 -3
package/html/about-doc-builder.html +3 -3
package/html/documentation-index.html +3 -3
package/html/guides/authentication-default-change.html +3 -3
package/html/guides/authentication-guide.html +3 -3
package/html/guides/claude-workflow-guide.html +3 -3
package/html/guides/configuration-guide.html +3 -3
package/html/guides/documentation-standards.html +3 -3
package/html/guides/html-embedding-guide.html +3 -3
package/html/guides/image-modal-guide.html +3 -3
package/html/guides/phosphor-icons-guide.html +3 -3
package/html/guides/private-directory-authentication-troubleshooting.html +3 -3
package/html/guides/private-directory-authentication.html +3 -3
package/html/guides/public-site-deployment.html +3 -3
package/html/guides/search-engine-verification-guide.html +3 -3
package/html/guides/seo-guide.html +3 -3
package/html/guides/seo-optimization-guide.html +3 -3
package/html/guides/supabase-authentication-complete-guide.html +3 -3
package/html/guides/troubleshooting-guide.html +3 -3
package/html/guides/windows-setup-guide.html +3 -3
package/html/image-modal-test.html +3 -3
package/html/index.html +3 -3
package/html/private/cache-control-anti-pattern.html +3 -3
package/html/private/launch/README.html +3 -3
package/html/private/launch/auth-cleanup-summary.html +3 -3
package/html/private/launch/bubble-plugin-specification.html +3 -3
package/html/private/launch/go-to-market-strategy.html +3 -3
package/html/private/launch/launch-announcements.html +3 -3
package/html/private/launch/vercel-deployment-auth-setup.html +3 -3
package/html/private/next-steps-walkthrough.html +3 -3
package/html/private/supabase-auth-implementation-completed.html +3 -3
package/html/private/supabase-auth-implementation-plan.html +3 -3
package/html/private/supabase-auth-integration-plan.html +3 -3
package/html/private/supabase-auth-setup-guide.html +3 -3
package/html/private/test-private-doc.html +3 -3
package/html/private/user-management-tooling.html +3 -3
package/html/prompts/beautiful-documentation-design.html +3 -3
package/html/prompts/markdown-document-standards.html +3 -3
package/html/prompts/project-rename-strategy-sasha-publish.html +3 -3
package/html/sitemap.xml +59 -59
package/html/test-questions/how-does-it-work%3F.html +3 -3
package/html/test-questions/step-1%3A%20getting-started.html +3 -3
package/html/test-questions/what-is-the-purpose.html +3 -3
package/html/vercel-cli-setup-guide.html +3 -3
package/html/vercel-first-time-setup-guide.html +3 -3
package/html-static/404.html +115 -0
package/html-static/README.html +456 -0
package/html-static/about-doc-builder.html +425 -0
package/html-static/css/notion-style.css +2426 -0
package/html-static/documentation-index.html +405 -0
package/html-static/guides/authentication-default-change.html +304 -0
package/html-static/guides/authentication-guide.html +443 -0
package/html-static/guides/claude-workflow-guide.html +1008 -0
package/html-static/guides/configuration-guide.html +406 -0
package/html-static/guides/documentation-standards.html +628 -0
package/html-static/guides/html-embedding-guide.html +395 -0
package/html-static/guides/image-modal-guide.html +449 -0
package/html-static/guides/phosphor-icons-guide.html +518 -0
package/html-static/guides/private-directory-authentication-troubleshooting.html +489 -0
package/html-static/guides/private-directory-authentication.html +475 -0
package/html-static/guides/public-site-deployment.html +365 -0
package/html-static/guides/search-engine-verification-guide.html +476 -0
package/html-static/guides/seo-guide.html +595 -0
package/html-static/guides/seo-optimization-guide.html +821 -0
package/html-static/guides/supabase-authentication-complete-guide.html +800 -0
package/html-static/guides/troubleshooting-guide.html +567 -0
package/html-static/guides/windows-setup-guide.html +793 -0
package/html-static/image-modal-test.html +252 -0
package/html-static/index.html +456 -0
package/html-static/js/main.js +1692 -0
package/html-static/prompts/beautiful-documentation-design.html +718 -0
package/html-static/prompts/markdown-document-standards.html +356 -0
package/html-static/prompts/project-rename-strategy-sasha-publish.html +464 -0
package/html-static/robots.txt +5 -0
package/html-static/sitemap.xml +189 -0
package/html-static/test-questions/how-does-it-work%3F.html +228 -0
package/html-static/test-questions/step-1%3A%20getting-started.html +223 -0
package/html-static/test-questions/what-is-the-purpose.html +227 -0
package/html-static/vercel-cli-setup-guide.html +429 -0
package/html-static/vercel-first-time-setup-guide.html +388 -0
package/lib/config.js +9 -2
package/lib/core-builder.js +148 -4
package/package.json +1 -1

package/html-static/index.html ADDED Viewed

@@ -0,0 +1,456 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <meta name="description" content="&lt;div align=&quot;center&quot;&gt;">
+    <title>@knowcode/doc-builder | @knowcode/doc-builder</title>
+    <meta name="generator" content="@knowcode/doc-builder by Knowcode Ltd">
+    <meta name="author" content="Lindsay Smith">
+    <meta name="keywords" content="documentation, markdown, static site generator, vercel, notion-style, width, table">
+    <meta name="robots" content="index, follow">
+    <link rel="canonical" href="https://doc-builder-delta.vercel.app/README.html">
+    <!-- Open Graph / Facebook -->
+    <meta property="og:type" content="article">
+    <meta property="og:url" content="https://doc-builder-delta.vercel.app/README.html">
+    <meta property="og:title" content="@knowcode/doc-builder | @knowcode/doc-builder">
+    <meta property="og:description" content="&lt;div align=&quot;center&quot;&gt;">
+    <meta property="og:image" content="https://doc-builder-delta.vercel.app/og-default.png">
+    <meta property="og:site_name" content="@knowcode/doc-builder">
+    <meta property="og:locale" content="en_US">
+    <!-- Twitter Card -->
+    <meta name="twitter:card" content="summary_large_image">
+    <meta name="twitter:site" content="@planbbackups">
+    <meta name="twitter:creator" content="@planbbackups">
+    <meta name="twitter:title" content="@knowcode/doc-builder | @knowcode/doc-builder">
+    <meta name="twitter:description" content="&lt;div align=&quot;center&quot;&gt;">
+    <meta name="twitter:image" content="https://doc-builder-delta.vercel.app/og-default.png">
+    <!-- Custom Meta Tags -->
+    <meta name="google-site-verification" content="FtzcDTf5BQ9K5EfnGazQkgU2U4FiN3ITzM7gHwqUAqQ">
+    <meta name="msvalidate.01" content="B2D8C4C12C530D47AA962B24CAA09630">
+    <!-- Fonts -->
+    <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&family=JetBrains+Mono:wght@400;500&display=swap" rel="stylesheet">
+    <!-- Icons -->
+    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.1/css/all.min.css">
+    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@phosphor-icons/web@2.1.1/src/regular/style.css">
+    <!-- Mermaid -->
+    <script src="https://cdn.jsdelivr.net/npm/mermaid@10.6.1/dist/mermaid.min.js"></script>
+    <!-- Styles -->
+    <link rel="stylesheet" href="/css/notion-style.css">
+    <!-- Favicon -->
+    <link rel="icon" href="data:image/svg+xml,<svg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 100 100%22><text y=%22.9em%22 font-size=%2290%22>✨</text></svg>">
+    <script type="application/ld+json">
+{
+  "@context": "https://schema.org",
+  "@type": "TechArticle",
+  "headline": "@knowcode/doc-builder",
+  "description": "<div align=\"center\">",
+  "author": {
+    "@type": "Person",
+    "name": "Lindsay Smith"
+  },
+  "publisher": {
+    "@type": "Organization",
+    "name": "Knowcode Ltd",
+    "url": "https://knowcode.tech"
+  },
+  "datePublished": "2025-08-07T11:50:26.058Z",
+  "dateModified": "2025-08-07T11:50:26.058Z",
+  "mainEntityOfPage": {
+    "@type": "WebPage",
+    "@id": "https://doc-builder-delta.vercel.app/README.html"
+  },
+  "breadcrumb": {
+    "@type": "BreadcrumbList",
+    "itemListElement": [
+      {
+        "@type": "ListItem",
+        "position": 1,
+        "name": "@knowcode/doc-builder",
+        "item": "https://doc-builder-delta.vercel.app"
+      },
+      {
+        "@type": "ListItem",
+        "position": 2,
+        "name": "README",
+        "item": "https://doc-builder-delta.vercel.app/README.html"
+      }
+    ]
+  }
+}
+</script>
+</head>
+<body>
+    <!-- Header -->
+    <header class="header">
+        <div class="header-content">
+            <a href="/index.html" class="logo">@knowcode/doc-builder</a>
+            <div class="header-actions">
+                <div class="deployment-info">
+                    <span class="deployment-date" title="Built with doc-builder v1.9.20">Last updated: Aug 7, 2025, 11:50 AM UTC</span>
+                </div>
+                <button id="theme-toggle" class="theme-toggle" aria-label="Toggle theme">
+                    <i class="fas fa-moon"></i>
+                </button>
+                <button id="menu-toggle" class="menu-toggle" aria-label="Toggle menu">
+                    <i class="fas fa-bars"></i>
+                </button>
+            </div>
+        </div>
+    </header>
+    <!-- Breadcrumbs -->
+    <nav class="breadcrumbs" id="breadcrumbs">
+        <!-- Breadcrumbs will be generated by JavaScript -->
+    </nav>
+    <!-- Main Content -->
+    <div class="main-wrapper">
+        <!-- Sidebar -->
+        <aside class="sidebar">
+            <div class="sidebar-header">
+                <div class="filter-box">
+                    <input type="text" placeholder="Search menu..." class="filter-input" id="nav-filter">
+                    <i class="fas fa-search filter-icon"></i>
+                </div>
+            </div>
+            <nav class="navigation">
+      <div class="nav-section" data-level="0">
+        <a class="nav-title toggle-all-nav expanded" href="#" id="nav-toggle-all" title="Collapse/Expand All">
+          <i class="ph ph-caret-down" id="toggle-all-icon"></i> Documentation
+        </a>
+        <div class="nav-content">
+        <a href="/README.html" class="nav-item active" data-tooltip="@knowcode/doc-builder."><i class="ph ph-file-text"></i> Overview</a>
+        <a href="/about-doc-builder.html" class="nav-item" data-tooltip="About @knowcode/doc-builder."><i class="ph ph-check-circle" style="color: #059669;"></i> About Doc Builder</a>
+        <a href="/documentation-index.html" class="nav-item" data-tooltip="This directory contains additional documentation for the @knowcode/doc-builder project, organized by topic and purpose."><i class="ph ph-pencil-simple" style="color: #d97706;"></i> Documentation Index</a>
+        <a href="/image-modal-test.html" class="nav-item" data-tooltip="This document tests the new image modal functionality in doc-builder."><i class="ph ph-file-text"></i> Image Modal Test</a>
+        <a href="/vercel-cli-setup-guide.html" class="nav-item" data-tooltip="This guide provides comprehensive instructions for installing the Vercel CLI across different operating systems."><i class="ph ph-check-circle" style="color: #059669;"></i> Vercel Cli Setup Guide</a>
+        <a href="/vercel-first-time-setup-guide.html" class="nav-item" data-tooltip="This guide walks you through the Vercel deployment process when using ."><i class="ph ph-check-circle" style="color: #059669;"></i> Vercel First Time Setup Guide</a></div></div>
+      <div class="nav-section" data-level="1">
+        <a class="nav-title collapsible expanded" href="#" data-target="nav-guides-1" >
+          <i class="ph ph-caret-right collapse-icon"></i><i class="ph ph-book"></i> Guides
+        </a>
+        <div class="nav-content" id="nav-guides-1">
+        <a href="/guides/authentication-default-change.html" class="nav-item" data-tooltip="Starting from version 1.7.4, @knowcode/doc-builder now defaults to no authentication for all documentation sites."><i class="ph ph-file-text"></i> Authentication Default Change</a>
+        <a href="/guides/authentication-guide.html" class="nav-item" data-tooltip="@knowcode/doc-builder supports enterprise-grade authentication through Supabase - a secure, scalable authentication platform."><i class="ph ph-check-circle" style="color: #059669;"></i> Authentication Guide</a>
+        <a href="/guides/claude-workflow-guide.html" class="nav-item" data-tooltip="This guide demonstrates an efficient workflow for using Claude Code with a refined CLAUDE.md file to create high-quality documentation and deploy it..."><i class="ph ph-pencil-simple" style="color: #d97706;"></i> Claude Workflow Guide</a>
+        <a href="/guides/configuration-guide.html" class="nav-item" data-tooltip="This guide explains how @knowcode/doc-builder handles configuration files and settings."><i class="ph ph-check-circle" style="color: #059669;"></i> Configuration Guide</a>
+        <a href="/guides/documentation-standards.html" class="nav-item" data-tooltip="This document defines the documentation standards and conventions for the @knowcode/doc-builder project."><i class="ph ph-pencil-simple" style="color: #d97706;"></i> Documentation Standards</a>
+        <a href="/guides/html-embedding-guide.html" class="nav-item" data-tooltip="Starting from version 1.9.2, doc-builder treats HTML files ( and ) as attachments that are automatically copied to your output directory during the..."><i class="ph ph-check-circle" style="color: #059669;"></i> Html Embedding Guide</a>
+        <a href="/guides/image-modal-guide.html" class="nav-item" data-tooltip="When users click on any image in your generated documentation, it opens in a professional modal overlay with: Full-screen viewing experience Smooth..."><i class="ph ph-check-circle" style="color: #059669;"></i> Image Modal Guide</a>
+        <a href="/guides/phosphor-icons-guide.html" class="nav-item" data-tooltip="@knowcode/doc-builder automatically converts Unicode emojis in your markdown files to beautiful Phosphor icons in the generated HTML."><i class="ph ph-pencil-simple" style="color: #d97706;"></i> Phosphor Icons Guide</a>
+        <a href="/guides/private-directory-authentication.html" class="nav-item" data-tooltip="The @knowcode/doc-builder provides flexible authentication options to protect your documentation."><i class="ph ph-check-circle" style="color: #059669;"></i> Private Directory Authentication</a>
+        <a href="/guides/private-directory-authentication-troubleshooting.html" class="nav-item" data-tooltip="Private Directory Authentication Troubleshooting."><i class="ph ph-check-circle" style="color: #059669;"></i> Private Directory Authentication Troubleshooting</a>
+        <a href="/guides/public-site-deployment.html" class="nav-item" data-tooltip="The @knowcode/doc-builder now supports deploying public documentation sites without authentication."><i class="ph ph-check-circle" style="color: #059669;"></i> Public Site Deployment</a>
+        <a href="/guides/search-engine-verification-guide.html" class="nav-item" data-tooltip="Search engine verification provides access to powerful webmaster tools:."><i class="ph ph-check-circle" style="color: #059669;"></i> Search Engine Verification Guide</a>
+        <a href="/guides/seo-guide.html" class="nav-item" data-tooltip="@knowcode/doc-builder includes comprehensive SEO (Search Engine Optimization) features to help your documentation rank better in search results and..."><i class="ph ph-check-circle" style="color: #059669;"></i> Seo Guide</a>
+        <a href="/guides/seo-optimization-guide.html" class="nav-item" data-tooltip="Comprehensive guide to optimizing documentation for search engines. Learn SEO best practices, use built-in features, and improve your rankings."><i class="ph ph-check-circle" style="color: #059669;"></i> SEO Optimization Guide for @knowcode/doc-builder</a>
+        <a href="/guides/supabase-authentication-complete-guide.html" class="nav-item" data-tooltip="@knowcode/doc-builder includes built-in Supabase authentication that provides enterprise-grade security with zero configuration."><i class="ph ph-check-circle" style="color: #059669;"></i> Supabase Authentication Complete Guide</a>
+        <a href="/guides/troubleshooting-guide.html" class="nav-item" data-tooltip="This guide helps you resolve common issues when using @knowcode/doc-builder."><i class="ph ph-check-circle" style="color: #059669;"></i> Troubleshooting Guide</a>
+        <a href="/guides/windows-setup-guide.html" class="nav-item" data-tooltip="This guide helps Windows users set up the complete AI-powered documentation workflow using Claude Code, @knowcode/doc-builder, and Vercel."><i class="ph ph-check-circle" style="color: #059669;"></i> Windows Setup Guide</a></div></div>
+      <div class="nav-section" data-level="1">
+        <a class="nav-title collapsible expanded" href="#" data-target="nav-prompts-1" >
+          <i class="ph ph-caret-right collapse-icon"></i><i class="ph ph-chat-circle-dots"></i> Prompts
+        </a>
+        <div class="nav-content" id="nav-prompts-1">
+        <a href="/prompts/beautiful-documentation-design.html" class="nav-item" data-tooltip="🎨 Beautiful Documentation Design Guide."><i class="ph ph-check-circle" style="color: #059669;"></i> Beautiful Documentation Design</a>
+        <a href="/prompts/markdown-document-standards.html" class="nav-item" data-tooltip="Detailed introduction to the topic..."><i class="ph ph-pencil-simple" style="color: #d97706;"></i> Markdown Document Standards</a>
+        <a href="/prompts/project-rename-strategy-sasha-publish.html" class="nav-item" data-tooltip="This document outlines the comprehensive strategy for renaming the @knowcode/doc-builder project to &quot;sasha-publish&quot;, including all package references,..."><i class="ph ph-x-circle" style="color: #dc2626;"></i> Project Rename Strategy Sasha Publish</a></div></div>
+      <div class="nav-section" data-level="1">
+        <a class="nav-title collapsible expanded" href="#" data-target="nav-test-questions-1" >
+          <i class="ph ph-caret-right collapse-icon"></i><i class="ph ph-folder"></i> Test Questions
+        </a>
+        <div class="nav-content" id="nav-test-questions-1">
+        <a href="/test-questions/how-does-it-work%3F.html" class="nav-item" data-tooltip="This is a test file to verify that question marks work properly in filenames."><i class="ph ph-file-text"></i> How Does It Work?</a>
+        <a href="/test-questions/step-1%3A%20getting-started.html" class="nav-item" data-tooltip="Step 1: Getting Started."><i class="ph ph-file-text"></i> Step 1: Getting Started</a>
+        <a href="/test-questions/what-is-the-purpose.html" class="nav-item" data-tooltip="Understanding the purpose of our documentation system"><i class="ph ph-file-text"></i> What Is The Purpose?</a></div></div>
+            </nav>
+            <div class="resize-handle"></div>
+        </aside>
+        <!-- Content Area -->
+        <main class="content">
+            <div class="content-inner">
+                <h1>@knowcode/doc-builder</h1>
+<div align="center">
+<blockquote>
+<p>Transform your markdown documentation into beautiful, searchable websites with Notion-inspired styling</p>
+</blockquote>
+<p><a href="https://www.npmjs.com/package/@knowcode/doc-builder"><img src="https://img.shields.io/npm/v/@knowcode/doc-builder" alt="npm version"></a><br><a href="https://opensource.org/licenses/MIT"><img src="https://img.shields.io/badge/License-MIT-blue.svg" alt="License: MIT"></a></p>
+<h3><i style="font-size: 1.2em" class="ph ph-rocket-launch" aria-label="launch"></i> Quick Start</h3>
+<pre><code class="language-bash">npx @knowcode/doc-builder@latest deploy
+</code></pre>
+<p><a href="https://doc-builder-delta.vercel.app"><strong>You are looking at a demo</strong></a> | <a href="https://www.npmjs.com/package/@knowcode/doc-builder"><strong>NPM Package</strong></a> | <a href="https://github.com/wapdat/doc-builder"><strong>GitHub</strong></a></p>
+</div>
+<hr>
+<h2><i style="font-size: 1.2em" class="ph ph-sparkle" aria-label="special"></i> Features</h2>
+<table>
+<tr>
+<td width="50%">
+<h3><i style="font-size: 1.2em" class="ph ph-palette" aria-label="design"></i> Design &amp; UX</h3>
+<ul>
+<li><strong>Notion-inspired UI</strong> - Clean, modern interface</li>
+<li><strong>Dark mode support</strong> - Automatic theme switching</li>
+<li><strong>Responsive layout</strong> - Perfect on any device</li>
+<li><strong>Syntax highlighting</strong> - Beautiful code blocks</li>
+</ul>
+<h3><i style="font-size: 1.2em" class="ph ph-magnifying-glass" aria-label="search"></i> Navigation</h3>
+<ul>
+<li><strong>Full-text search</strong> - Find anything instantly</li>
+<li><strong>Smart navigation</strong> - Hierarchical structure</li>
+<li><strong>Breadcrumbs</strong> - Always know where you are</li>
+<li><strong>Keyboard shortcuts</strong> - Navigate like a pro</li>
+</ul>
+</td>
+<td width="50%">
+<h3><i style="font-size: 1.2em" class="ph ph-chart-bar" aria-label="chart"></i> Content Support</h3>
+<ul>
+<li><strong>Mermaid diagrams</strong> - Visual documentation</li>
+<li><strong>GitHub markdown</strong> - Full GFM support</li>
+<li><strong>Interactive tooltips</strong> - Document previews</li>
+<li><strong>Version tracking</strong> - Build metadata</li>
+</ul>
+<h3><i style="font-size: 1.2em" class="ph ph-rocket-launch" aria-label="launch"></i> Deployment</h3>
+<ul>
+<li><strong>One-command deploy</strong> - Push to Vercel</li>
+<li><strong>Static generation</strong> - Fast &amp; secure</li>
+<li><strong>Custom domains</strong> - Your brand</li>
+<li><strong>Preview deploys</strong> - Test changes</li>
+</ul>
+</td>
+</tr>
+</table>
+<h2><i style="font-size: 1.2em" class="ph ph-target" aria-label="goal"></i> Use Cases</h2>
+<table>
+<tr>
+<td width="25%">
+<h3>Open Source</h3>
+<p>Beautiful docs for your community</p>
+</td>
+<td width="25%">
+<h3>Technical Teams</h3>
+<p>Internal docs developers love</p>
+</td>
+<td width="25%">
+<h3>API Docs</h3>
+<p>Clear, searchable references</p>
+</td>
+<td width="25%">
+<h3>Knowledge Base</h3>
+<p>Organize team knowledge</p>
+</td>
+</tr>
+</table>
+<h2><i style="font-size: 1.2em" class="ph ph-gear-six" aria-label="tools"></i> Simple Workflow</h2>
+<table>
+<tr>
+<td width="50%">
+<h3>1️⃣ Setup</h3>
+<pre><code class="language-bash">npx @knowcode/doc-builder@latest init
+</code></pre>
+<p><em>Create project structure and configure doc-builder</em></p>
+</td>
+<td width="50%">
+<h3>2️⃣ Deploy</h3>
+<pre><code class="language-bash">npx @knowcode/doc-builder@latest deploy
+</code></pre>
+<p><em>Build your markdown files and deploy to production</em></p>
+</td>
+</tr>
+</table>
+<h2><i style="font-size: 1.2em" class="ph ph-gear" aria-label="settings"></i> Configuration</h2>
+<p>Configuration is fully managed through the CLI tools - no manual file editing required! The tool handles all settings automatically during setup and deployment.</p>
+<h3><i style="font-size: 1.2em" class="ph ph-arrows-clockwise" aria-label="refresh"></i> Auto-Configuration</h3>
+<ul>
+<li><strong>Auto-creation</strong>: If no <code>doc-builder.config.js</code> exists, one is created with all default settings</li>
+<li><strong>Auto-update</strong>: When upgrading versions, new features are automatically added to your config</li>
+<li><strong>Safe migration</strong>: Your customizations are preserved while adding new defaults</li>
+<li><strong>Backup protection</strong>: Config files are backed up before major updates</li>
+</ul>
+<table>
+<tr>
+<td width="50%">
+<h3>Basic Config (Reference Only)</h3>
+<pre><code class="language-javascript">// doc-builder.config.js
+// This file is auto-generated and managed by the CLI
+module.exports = {
+  siteName: &#39;@knowcode/doc-builder&#39;,
+  siteDescription: &#39;Transform markdown into beautiful documentation&#39;,
+  docsDir: &#39;docs&#39;,
+  outputDir: &#39;html&#39;,
+  favicon: &#39;✨&#39;  // Can be emoji or path to image
+};
+</code></pre>
+<p><em>The CLI creates and updates this for you</em></p>
+</td>
+<td width="50%">
+<h3>Advanced Features (Reference Only)</h3>
+<pre><code class="language-javascript">// Also managed via CLI commands
+features: {
+  mermaid: true,      // Diagrams
+  darkMode: true,     // Theme toggle
+  authentication: true, // Password
+  changelog: true     // Auto-generate
+}
+</code></pre>
+<p><em>Use <code>init</code> or <code>deploy</code> commands to configure</em></p>
+</td>
+</tr>
+</table>
+<h2><i style="font-size: 1.2em" class="ph ph-chart-bar" aria-label="chart"></i> Rich Content Examples</h2>
+<table>
+<tr>
+<td width="50%">
+<h3>Mermaid Diagrams</h3>
+<div class="mermaid-wrapper">
+      <div class="mermaid">graph LR
+    A[Write] --> B[Build]
+    B --> C[Deploy]
+    C --> D[Share]
+    style A fill:#e1f5fe
+    style D fill:#c8e6c9</div>
+    </div>
+</td>
+<td width="50%">
+<h3>Code with Syntax Highlighting</h3>
+<pre><code class="language-javascript">// Beautiful code blocks
+const docBuilder = require(&#39;@knowcode/doc-builder&#39;);
+docBuilder.build({
+  siteName: &#39;@knowcode/doc-builder&#39;,
+  features: { darkMode: true }
+});
+</code></pre>
+</td>
+</tr>
+</table>
+<h2><i style="font-size: 1.2em" class="ph ph-star-four" aria-label="sparkle"></i> Why Choose doc-builder?</h2>
+<table>
+<tr>
+<td width="33%">
+<h3><i style="font-size: 1.2em" class="ph ph-rocket-launch" aria-label="launch"></i> Performance</h3>
+<ul>
+<li><strong>Lightning fast</strong> - Static generation</li>
+<li><strong>SEO optimized</strong> - Search friendly</li>
+<li><strong>Accessible</strong> - WCAG compliant</li>
+</ul>
+</td>
+<td width="33%">
+<h3><i style="font-size: 1.2em" class="ph ph-gear-six" aria-label="tools"></i> Developer Experience</h3>
+<ul>
+<li><strong>Zero config</strong> - Works instantly</li>
+<li><strong>Version control</strong> - Git-friendly</li>
+<li><strong>Open source</strong> - MIT licensed</li>
+</ul>
+</td>
+<td width="33%">
+<h3><i style="font-size: 1.2em" class="ph ph-money" aria-label="money"></i> Cost Effective</h3>
+<ul>
+<li><strong>Free hosting</strong> - Vercel free tier</li>
+<li><strong>No vendor lock-in</strong> - Your content</li>
+<li><strong>Export anywhere</strong> - Static HTML</li>
+</ul>
+</td>
+</tr>
+</table>
+<h2><i style="font-size: 1.2em" class="ph ph-handshake" aria-label="partnership"></i> Get Involved</h2>
+<table>
+<tr>
+<td width="50%">
+<h3>Contributing</h3>
+<p>We welcome contributions! Check our <a href="https://github.com/wapdat/doc-builder">contribution guide</a> to get started.</p>
+<p><strong>Ways to help:</strong></p>
+<ul>
+<li><i style="font-size: 1.2em" class="ph ph-bug" aria-label="bug"></i> Report bugs</li>
+<li><i style="font-size: 1.2em" class="ph ph-lightbulb" aria-label="idea"></i> Suggest features</li>
+<li><i style="font-size: 1.2em" class="ph ph-note-pencil" aria-label="edit"></i> Improve docs</li>
+<li><i style="font-size: 1.2em" class="ph ph-wrench" aria-label="settings"></i> Submit PRs</li>
+</ul>
+</td>
+<td width="50%">
+<h3>Community</h3>
+<p>Join our growing community of documentation enthusiasts!</p>
+<p><strong>Connect with us:</strong></p>
+<ul>
+<li><i style="font-size: 1.2em" class="ph ph-package" aria-label="package"></i> <a href="https://www.npmjs.com/package/@knowcode/doc-builder">NPM Package</a></li>
+<li><i style="font-size: 1.2em" class="ph ph-github-logo" aria-label="github"></i> <a href="https://github.com/wapdat/doc-builder">GitHub Repo</a></li>
+<li><i style="font-size: 1.2em" class="ph ph-globe" aria-label="global"></i> <a href="https://knowcode.com">Website</a></li>
+<li><i style="font-size: 1.2em" class="ph ph-chat-circle" aria-label="chat"></i> <a href="https://github.com/wapdat/doc-builder/discussions">Discussions</a></li>
+</ul>
+</td>
+</tr>
+</table>
+<hr>
+<div align="center">
+<h3><i style="font-size: 1.2em" class="ph ph-note-pencil" aria-label="edit"></i> License: MIT © KnowCode</h3>
+<p>Built with <i style="font-size: 1.2em" class="ph ph-heart" aria-label="love"></i> by developers, for developers</p>
+<p><a href="https://www.npmjs.com/package/@knowcode/doc-builder"><strong>Get Started</strong></a> | <a href="https://doc-builder-delta.vercel.app"><strong>You are looking at a demo</strong></a> | <a href="https://github.com/wapdat/doc-builder"><strong>Star on GitHub</strong></a></p>
+</div>
+            </div>
+        </main>
+    </div>
+    <!-- Scripts -->
+    <script>
+    // Pass configuration to frontend
+    window.docBuilderConfig = {
+      features: {
+        showPdfDownload: true,
+        menuDefaultOpen: false,
+        mermaidEnhanced: true
+      }
+    };
+    </script>
+    <script src="/js/main.js"></script>
+</body>
+</html>