llmd 0.1.0 → 0.2.0

package/README.md

@@ -2,203 +2,76 @@
 
 **Serve Markdown as beautiful HTML. Instantly.**
 
-A zero-config CLI tool for viewing Markdown files in your browser with syntax highlighting, live reload, and a clean interface. Built for developers reviewing LLM-generated documentation.
-
-```
- ██╗     ██╗     ███╗   ███╗██████╗ 
- ██║     ██║     ████╗ ████║██╔══██╗
- ██║     ██║     ██╔████╔██║██║  ██║
- ██║     ██║     ██║╚██╔╝██║██║  ██║
- ███████╗███████╗██║ ╚═╝ ██║██████╔╝
- ╚══════╝╚══════╝╚═╝     ╚═╝╚═════╝ 
-```
-
-## Features
-
-- **Zero config** - Point at a directory and go
-- **Syntax highlighting** - Powered by Shiki
-- **Live reload** - Watch mode reloads on file changes
-- **Copy buttons** - One-click code copying
-- **Dark/light themes** - With 3 font options
-- **Fast** - Built with Bun, instant startup
-- **Sidebar navigation** - Browse files with directory structure
-- **Table of contents** - Auto-generated from headings
+A minimal CLI tool for viewing Markdown files in your browser with syntax highlighting, live reload, and a clean interface. Built for developers reviewing LLM-generated documentation.
 
 ## Installation
 
-### npm (Recommended)
-
 ```bash
 npm install -g llmd
 ```
 
 Or run directly without installing:
+
 ```bash
 npx llmd
 ```
 
 Requires Node.js 22 or later.
 
-### From Source
+## Quick Start
 
-```bash
-git clone https://github.com/pbzona/llmd.git
-cd llmd
-bun install
-bun run build:npm
-npm install -g .
-```
-
-## Usage
+Want to see what llmd can do? **Try it on its own documentation:**
 
 ```bash
-# Serve current directory
-llmd
-
-# Serve specific directory
-llmd ./docs
-
-# Dark mode with live reload
-llmd ./docs --theme dark --watch
+# Install llmd
+npm install -g llmd
 
-# Custom port
-llmd ./docs --port 8080
+# View the documentation
+llmd docs
 ```
 
-## Font Combinations
+That's it! The docs will open in your browser. Click through the sidebar to explore.
 
-llmd includes 9 built-in font combinations:
-
-- **serif** - System serif fonts (Georgia, Times)
-- **sans** - System sans-serif fonts (default)
-- **mono** - System monospace fonts
-- **classic** - Baskerville headings + Geist body
-- **future** - Space Mono headings + Space Grotesk body
-- **modern** - Inter throughout + JetBrains Mono
-- **artsy** - Playfair Display + Fira Code
-- **literary** - Spectral headings + Newsreader body
-- **editorial** - Bitter headings + Lora body
-
-All custom fonts are loaded from Google Fonts CDN for fast, reliable delivery.
-
-### Custom Fonts
-
-Create custom font combinations in your `themes.json` config file.
+## Features
 
-**Location:** `~/.config/llmd/themes.json` (or `$XDG_CONFIG_HOME/llmd/themes.json`)
+- **Simple setup** - Point at a directory and go
+- **Syntax highlighting** - Powered by Shiki
+- **Live reload** - Watch mode reloads on file changes
+- **Copy buttons** - One-click code copying
+- **Dark/light themes** - With 9 font combinations
+- **Fast** - Built with Bun, instant startup
+- **Sidebar navigation** - Browse files with directory structure
+- **Table of contents** - Auto-generated from headings
+- **Usage Analytics** - Track which docs you view most (local-only, opt-in)
 
-**Simple Example (Auto-loaded from Google Fonts):**
-```json
-{
-  "fontThemes": {
-    "myfont": {
-      "heading": "Montserrat, sans-serif",
-      "body": "Open Sans, sans-serif",
-      "code": "Source Code Pro, monospace"
-    }
-  }
-}
-```
+## Documentation
 
-Google Fonts are **loaded automatically** with weights 400 and 700. Just specify the font family names - no need to construct Google Fonts URLs manually!
-
-**Advanced Example (Custom Weights/Styles):**
-```json
-{
-  "fontThemes": {
-    "custom": {
-      "heading": "Poppins, sans-serif",
-      "body": "Inter, sans-serif", 
-      "code": "Fira Code, monospace",
-      "googleFontsUrl": "https://fonts.googleapis.com/css2?family=Poppins:wght@400;600;700&family=Inter:wght@300;400;500&family=Fira+Code:wght@400;500&display=swap"
-    }
-  }
-}
-```
+- [Installation](./docs/installation.md) - Installation methods
+- [Usage](./docs/usage.md) - Command-line options and examples
+- [Themes](./docs/themes.md) - Built-in and custom color themes
+- [Fonts](./docs/fonts.md) - Built-in and custom font combinations
+- [Analytics](./docs/analytics.md) - Local usage tracking
 
-Use `googleFontsUrl` only if you need specific weights (like 300, 500, 600) or styles (italic, etc.). Get custom URLs from [Google Fonts](https://fonts.google.com).
+## Basic Usage
 
-**Usage:**
 ```bash
-llmd --fonts myfont
-```
+# View llmd documentation
+llmd docs
 
-**Requirements:**
-- `heading`, `body`, and `code` properties are required
-- Font names should include CSS fallbacks (e.g., `"Roboto, sans-serif"`)
-- System fonts (Arial, Georgia, etc.) don't load from Google Fonts
-- Invalid font names will show helpful errors listing all available fonts
-
-## Color Themes
-
-llmd includes 6 built-in color themes:
-
-- **dark** - Default dark theme (default)
-- **light** - Warm light theme
-- **nord** - Nord-inspired cool theme
-- **dracula** - Dracula-inspired purple theme
-- **solarized** - Solarized Light theme
-- **monokai** - Monokai-inspired theme
-
-### Custom Themes
-
-Create custom color themes in your `themes.json` config file.
-
-**Location:** `~/.config/llmd/themes.json` (or `$XDG_CONFIG_HOME/llmd/themes.json`)
-
-**Format:**
-```json
-{
-  "colorThemes": {
-    "mytheme": {
-      "bg": "#1a1a1a",
-      "fg": "#e0e0e0",
-      "border": "#333",
-      "hover": "#2a2a2a",
-      "accent": "#4a9eff",
-      "codeBg": "#2d2d2d",
-      "sidebarBg": "#151515",
-      "folderIcon": "#a78bfa",
-      "fileIcon": "#fbbf24"
-    }
-  }
-}
-```
-
-**Unified Config:**
-You can combine both color themes and font themes in a single file:
-```json
-{
-  "colorThemes": {
-    "mytheme": { ... }
-  },
-  "fontThemes": {
-    "myfont": { ... }
-  }
-}
-```
-
-**Usage:**
-```bash
-llmd --theme mytheme --fonts myfont
-```
+# Serve current directory
+llmd
 
-If a theme or font is not found, llmd will list all available options.
+# Serve specific directory
+llmd ./docs
 
-**Note:** The old flat format for color themes (without `colorThemes` key) is still supported for backward compatibility.
+# Dark mode with live reload
+llmd ./docs --theme dark --watch
 
-## Options
+# Open directly to analytics
+llmd analytics
+```
 
-| Flag | Description | Default |
-|------|-------------|---------|
-| `--port <number>` | Port (0 = random) | `0` (random) |
-| `--host <string>` | Host interface | `localhost` |
-| `--theme <name>` | Color theme: `dark`, `light`, `nord`, `dracula`, `solarized`, `monokai`, or custom | `dark` |
-| `--fonts <name>` | Font combination: `serif`, `sans`, `mono`, `classic`, `future`, `modern`, `artsy`, `literary`, `editorial` | `sans` |
-| `--open / --no-open` | Auto-open browser | `--open` |
-| `--watch / --no-watch` | Live reload on changes | `--no-watch` |
-| `-h, --help` | Show help | |
-| `--version` | Show version | |
+See [Usage](./docs/usage.md) for all options.
 
 ## Development
 
@@ -221,7 +94,7 @@ bun run build
 - **Runtime**: Bun
 - **Markdown**: marked (GFM support)
 - **Highlighting**: Shiki (VS Code themes)
-- **Server**: Bun.serve() with WebSocket
+- **Server**: Node.js http + ws
 - **Bundler**: Bun's built-in bundler
 
 ## License

package/dist/client.js

@@ -1 +1 @@
-var s=()=>{document.querySelectorAll("pre code").forEach((o)=>{let d=o.parentElement;if(!d)return;if(d.querySelector(".copy-button"))return;let t=document.createElement("button");t.className="copy-button",t.textContent="Copy",t.setAttribute("aria-label","Copy code to clipboard"),t.addEventListener("click",async()=>{try{await navigator.clipboard.writeText(o.textContent||""),t.textContent="Copied!",t.classList.add("copied"),setTimeout(()=>{t.textContent="Copy",t.classList.remove("copied")},2000)}catch(e){console.error("Failed to copy:",e),t.textContent="Failed",setTimeout(()=>{t.textContent="Copy"},2000)}}),d.appendChild(t)})};if(document.readyState==="loading")document.addEventListener("DOMContentLoaded",s);else s();var p=(o)=>{let t=`${window.location.protocol==="https:"?"wss:":"ws:"}//${window.location.host}/_ws`,e=null,n=null,l=()=>{e=new WebSocket(t),e.addEventListener("open",()=>{console.log("[llmd] Connected to file watcher"),e?.send(JSON.stringify({type:"watch",file:o}))}),e.addEventListener("message",(i)=>{try{let a=JSON.parse(i.data);if(a.type==="reload"&&a.file===o)console.log(`[llmd] File changed: ${o}, reloading...`),window.location.reload()}catch(a){console.error("[llmd] Failed to parse message:",a)}}),e.addEventListener("close",()=>{console.log("[llmd] Disconnected from file watcher"),n=window.setTimeout(()=>{console.log("[llmd] Reconnecting..."),l()},2000)}),e.addEventListener("error",(i)=>{console.error("[llmd] WebSocket error:",i),e?.close()})};l(),window.addEventListener("beforeunload",()=>{if(n)clearTimeout(n);e?.close()})};window.connectFileWatcher=p;console.log("[llmd] Client initialized");
+var Q=()=>{let y=document.querySelectorAll(".dir-label");for(let m of Array.from(y)){let C=m,L=document.createElement("span");L.className="dir-chevron",L.innerHTML='<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><polyline points="6 9 12 15 18 9"></polyline></svg>',C.insertBefore(L,C.firstChild),C.style.cursor="pointer",C.addEventListener("click",(q)=>{q.preventDefault();let B=C.closest(".dir-item");if(B)B.classList.toggle("collapsed")})}},Y=()=>{let y=document.querySelector(".toc");if(!y)return;let m=y.querySelector("h3");if(!m)return;let C=document.createElement("span");C.className="toc-chevron",C.innerHTML='<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><polyline points="6 9 12 15 18 9"></polyline></svg>',m.style.cursor="pointer",m.insertBefore(C,m.firstChild),y.classList.add("collapsed"),m.addEventListener("click",()=>{y.classList.toggle("collapsed")})};if(typeof window<"u")window.addEventListener("DOMContentLoaded",()=>{Q(),Y()});var u=()=>{for(let y of Array.from(document.querySelectorAll("pre code"))){let m=y.parentElement;if(!m)continue;if(m.querySelector(".copy-button"))continue;let C=document.createElement("button");C.className="copy-button",C.textContent="Copy",C.setAttribute("aria-label","Copy code to clipboard"),C.addEventListener("click",async()=>{try{await navigator.clipboard.writeText(y.textContent||""),C.textContent="Copied!",C.classList.add("copied"),setTimeout(()=>{C.textContent="Copy",C.classList.remove("copied")},2000)}catch(L){console.error("Failed to copy:",L),C.textContent="Failed",setTimeout(()=>{C.textContent="Copy"},2000)}}),m.appendChild(C)}};if(document.readyState==="loading")document.addEventListener("DOMContentLoaded",u);else u();var Z=(y)=>{let C=`${window.location.protocol==="https:"?"wss:":"ws:"}//${window.location.host}/_ws`,L=null,q=null,B=()=>{L=new WebSocket(C),L.addEventListener("open",()=>{console.log("[llmd] Connected to file watcher"),L?.send(JSON.stringify({type:"watch",file:y}))}),L.addEventListener("message",(M)=>{try{let x=JSON.parse(M.data);if(x.type==="reload"&&x.file===y)console.log(`[llmd] File changed: ${y}, reloading...`),window.location.reload()}catch(x){console.error("[llmd] Failed to parse message:",x)}}),L.addEventListener("close",()=>{console.log("[llmd] Disconnected from file watcher"),q=window.setTimeout(()=>{console.log("[llmd] Reconnecting..."),B()},2000)}),L.addEventListener("error",(M)=>{console.error("[llmd] WebSocket error:",M),L?.close()})};B(),window.addEventListener("beforeunload",()=>{if(q)clearTimeout(q);L?.close()})};window.connectFileWatcher=Z;var _=()=>{let y=document.querySelector(".sidebar");if(!y)return;let m=document.createElement("div");m.className="sidebar-resize-handle",y.appendChild(m);let C=!1,L=0,q=0,B=(A)=>{C=!0,L=A.clientX,q=y.offsetWidth,document.body.style.cursor="ew-resize",document.body.style.userSelect="none",A.preventDefault()},M=(A)=>{if(!C)return;let K=A.clientX-L,O=q+K,k=Math.max(200,Math.min(600,O));y.style.width=`${k}px`,localStorage.setItem("llmd-sidebar-width",k.toString())},x=()=>{if(!C)return;C=!1,document.body.style.cursor="",document.body.style.userSelect=""};m.addEventListener("mousedown",B),document.addEventListener("mousemove",M),document.addEventListener("mouseup",x);let j=localStorage.getItem("llmd-sidebar-width");if(j){let A=Number.parseInt(j,10);if(A>=200&&A<=600)y.style.width=`${A}px`}};if(typeof window<"u")window.addEventListener("DOMContentLoaded",()=>{_()});var E=(y,m,C)=>{fetch("/api/events",{method:"POST",headers:{"Content-Type":"application/json"},body:JSON.stringify({type:y,path:m,resourceType:C})}).catch(()=>{})},G=(y)=>{E("open",y,"dir")},J=(y)=>{E("view",y,"file")};window.trackDirectoryOpen=G;window.trackFileView=J;console.log("[llmd] Client initialized");