uhyo · uhyo · Dec 14, 2025 · Dec 14, 2025 · Dec 14, 2025 · Dec 14, 2025
diff --git a/.github/workflows/deploy-docs.yml b/.github/workflows/deploy-docs.yml
@@ -0,0 +1,58 @@
+name: Deploy Docs
+
+on:
+  release:
+    types: [created]
+  workflow_dispatch:
+
+permissions:
+  contents: read
+  pages: write
+  id-token: write
+
+concurrency:
+  group: "pages"
+  cancel-in-progress: false
+
+jobs:
+  build:
+    runs-on: ubuntu-latest
+
+    steps:
+      - uses: actions/checkout@v6
+
+      - name: Setup pnpm
+        uses: pnpm/action-setup@v4
+
+      - name: Setup Node.js
+        uses: actions/setup-node@v6
+        with:
+          node-version: "24"
+          cache: "pnpm"
+
+      - name: Install dependencies
+        run: pnpm install --frozen-lockfile
+
+      - name: Build docs
+        run: pnpm --filter funstack-router-docs build
+
+      - name: Setup Pages
+        uses: actions/configure-pages@v5
+
+      - name: Upload artifact
+        uses: actions/upload-pages-artifact@v3
+        with:
+          path: packages/docs/dist
+
+  deploy:
+    environment:
+      name: github-pages
+      url: ${{ steps.deployment.outputs.page_url }}
+
+    runs-on: ubuntu-latest
+    needs: build
+
+    steps:
+      - name: Deploy to GitHub Pages
+        id: deployment
+        uses: actions/deploy-pages@v4
diff --git a/packages/docs/index.html b/packages/docs/index.html
@@ -0,0 +1,16 @@
+<!doctype html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <title>FUNSTACK Router - Documentation</title>
+    <meta
+      name="description"
+      content="Modern React router built on the Navigation API"
+    />
+  </head>
+  <body>
+    <div id="root"></div>
+    <script type="module" src="/src/main.tsx"></script>
+  </body>
+</html>
diff --git a/packages/docs/package.json b/packages/docs/package.json
@@ -0,0 +1,24 @@
+{
+  "name": "funstack-router-docs",
+  "version": "0.0.0",
+  "private": true,
+  "type": "module",
+  "scripts": {
+    "dev": "vite",
+    "build": "vite build",
+    "preview": "vite preview",
+    "typecheck": "tsc --noEmit"
+  },
+  "dependencies": {
+    "@funstack/router": "workspace:*",
+    "react": "^19.0.0",
+    "react-dom": "^19.0.0"
+  },
+  "devDependencies": {
+    "@types/react": "^19.0.0",
+    "@types/react-dom": "^19.0.0",
+    "@vitejs/plugin-react": "^4.3.0",
+    "typescript": "^5.7.0",
+    "vite": "^6.0.0"
+  }
+}
diff --git a/packages/docs/src/App.tsx b/packages/docs/src/App.tsx
@@ -0,0 +1,35 @@
+import { Router, route } from "@funstack/router";
+import { Layout } from "./components/Layout.js";
+import { HomePage } from "./pages/HomePage.js";
+import { GettingStartedPage } from "./pages/GettingStartedPage.js";
+import { ApiReferencePage } from "./pages/ApiReferencePage.js";
+import { ExamplesPage } from "./pages/ExamplesPage.js";
+
+const routes = [
+  route({
+    path: "/funstack-router",
+    component: Layout,
+    children: [
+      route({
+        path: "/",
+        component: HomePage,
+      }),
+      route({
+        path: "/getting-started",
+        component: GettingStartedPage,
+      }),
+      route({
+        path: "/api",
+        component: ApiReferencePage,
+      }),
+      route({
+        path: "/examples",
+        component: ExamplesPage,
+      }),
+    ],
+  }),
+];
+
+export function App() {
+  return <Router routes={routes} />;
+}
diff --git a/packages/docs/src/components/Layout.tsx b/packages/docs/src/components/Layout.tsx
@@ -0,0 +1,65 @@
+import { Outlet, useLocation, useNavigate } from "@funstack/router";
+
+const navItems = [
+  { path: "/funstack-router/", label: "Home" },
+  { path: "/funstack-router/getting-started", label: "Getting Started" },
+  { path: "/funstack-router/api", label: "API Reference" },
+  { path: "/funstack-router/examples", label: "Examples" },
+];
+
+export function Layout() {
+  const location = useLocation();
+  const navigate = useNavigate();
+
+  return (
+    <div className="layout">
+      <header className="header">
+        <div className="header-content">
+          <h1 className="logo">
+            <a
+              href="/funstack-router/"
+              onClick={(e) => {
+                e.preventDefault();
+                navigate("/funstack-router/");
+              }}
+            >
+              FUNSTACK Router
+            </a>
+          </h1>
+          <nav className="nav">
+            {navItems.map((item) => (
+              <a
+                key={item.path}
+                href={item.path}
+                className={`nav-link ${location.pathname === item.path || (item.path === "/funstack-router/" && location.pathname === "/funstack-router") ? "active" : ""}`}
+                onClick={(e) => {
+                  e.preventDefault();
+                  navigate(item.path);
+                }}
+              >
+                {item.label}
+              </a>
+            ))}
+          </nav>
+          <a
+            href="https://github.com/user/funstack-router"
+            className="github-link"
+            target="_blank"
+            rel="noopener noreferrer"
+          >
+            GitHub
+          </a>
+        </div>
+      </header>
+      <main className="main">
+        <Outlet />
+      </main>
+      <footer className="footer">
+        <p>
+          Built with <strong>@funstack/router</strong> &mdash; A modern React
+          router based on the Navigation API
+        </p>
+      </footer>
+    </div>
+  );
+}
diff --git a/packages/docs/src/main.tsx b/packages/docs/src/main.tsx
@@ -0,0 +1,10 @@
+import { StrictMode } from "react";
+import { createRoot } from "react-dom/client";
+import { App } from "./App.js";
+import "./styles.css";
+
+createRoot(document.getElementById("root")!).render(
+  <StrictMode>
+    <App />
+  </StrictMode>,
+);