@kernel.chat/kbot 3.99.15 → 3.99.16

package/dist/cli.js

@@ -879,6 +879,42 @@ async function main() {
             printInfo(`  ${result.skipped} skipped (existing user-authored files preserved)`);
         printInfo(`  → ${result.destination}`);
     });
+    program
+        .command('design <brief...>')
+        .description('Local-first alternative to Claude Design. Reads your repo\'s design tokens and generates an HTML prototype applying your visual system.')
+        .option('-o, --out <path>', 'Output file path (default: ./design-output/<slug>.html)')
+        .option('-k, --kind <kind>', 'Artifact kind: deck | page | prototype | one-pager', 'one-pager')
+        .option('--pdf', 'Also render to PDF via Playwright')
+        .option('--open', 'Open in default browser after generation')
+        .action(async (briefWords, opts) => {
+        const { runDesign } = await import('./design.js');
+        const brief = briefWords.join(' ');
+        if (!brief) {
+            printError('Usage: kbot design "<brief>" [--kind deck|page|prototype|one-pager] [--pdf] [--open]');
+            process.exit(1);
+        }
+        printInfo(`Designing ${opts.kind || 'one-pager'} from brief: "${brief.slice(0, 60)}${brief.length > 60 ? '…' : ''}"`);
+        try {
+            const out = await runDesign({
+                brief,
+                out: opts.out,
+                kind: opts.kind || 'one-pager',
+                pdf: opts.pdf,
+                open: opts.open,
+            });
+            printSuccess(`Written ${out}`);
+            if (opts.pdf) {
+                const pdf = out.replace(/\.html?$/i, '.pdf');
+                printInfo(`PDF: ${pdf}`);
+            }
+            if (!opts.open)
+                printInfo(`Preview: open ${out}`);
+        }
+        catch (err) {
+            printError(`Design failed: ${String(err).slice(0, 200)}`);
+            process.exit(1);
+        }
+    });
     program
         .command('doctor')
         .description('Diagnose your kbot setup — check everything is working')

package/dist/design.d.ts

@@ -0,0 +1,22 @@
+export interface DesignOptions {
+    /** The design brief — what to build */
+    brief: string;
+    /** Output file path (default: ./design-output/<slug>.html) */
+    out?: string;
+    /** Kind of artifact: 'deck' | 'page' | 'prototype' | 'one-pager' */
+    kind?: 'deck' | 'page' | 'prototype' | 'one-pager';
+    /** Also render to PDF via Playwright */
+    pdf?: boolean;
+    /** Open in browser after generation */
+    open?: boolean;
+}
+/**
+ * Discover the repo's design tokens by scanning common CSS / config files.
+ * Returns a deduplicated string block the agent can reference.
+ */
+export declare function extractDesignTokens(projectRoot: string): string;
+/** Build the prompt that the aesthete specialist will receive. */
+export declare function buildDesignPrompt(opts: DesignOptions, tokens: string): string;
+/** Run the design command. Returns the output file path. */
+export declare function runDesign(opts: DesignOptions, projectRoot?: string): Promise<string>;
+//# sourceMappingURL=design.d.ts.map

package/dist/design.js

@@ -0,0 +1,161 @@
+// kbot design — local-first alternative to Claude Design.
+//
+// Reads the current repo's CSS design tokens, feeds them to the aesthete
+// specialist along with the user's brief, writes an HTML prototype to disk
+// that applies those tokens, and optionally renders it to PDF via Playwright.
+//
+// No subscription. No cloud. $0 with a local model. The generated HTML lives
+// on your machine, your design tokens stay local, your prototype is yours.
+import { existsSync, readFileSync, writeFileSync, mkdirSync } from 'node:fs';
+import { join, resolve, dirname } from 'node:path';
+import { homedir } from 'node:os';
+/**
+ * Discover the repo's design tokens by scanning common CSS / config files.
+ * Returns a deduplicated string block the agent can reference.
+ */
+export function extractDesignTokens(projectRoot) {
+    const candidates = [
+        'src/index.css',
+        'src/styles/tokens.css',
+        'src/tokens.css',
+        'app/globals.css',
+        'styles/globals.css',
+        'tailwind.config.ts',
+        'tailwind.config.js',
+        'src/theme.ts',
+        'src/theme.css',
+    ];
+    const sections = [];
+    for (const rel of candidates) {
+        const path = join(projectRoot, rel);
+        if (!existsSync(path))
+            continue;
+        try {
+            const content = readFileSync(path, 'utf-8');
+            // Only grab the token-declaring sections, not full CSS
+            const customProps = content.match(/--[\w-]+\s*:\s*[^;}\n]+/g) ?? [];
+            const colorDecls = content.match(/#[0-9a-fA-F]{3,8}\b|rgb\([^)]+\)|hsl\([^)]+\)/g) ?? [];
+            const fontDecls = content.match(/font-family\s*:\s*[^;}\n]+/g) ?? [];
+            if (customProps.length > 0 || colorDecls.length > 0 || fontDecls.length > 0) {
+                const uniqueProps = [...new Set(customProps)].slice(0, 40);
+                const uniqueColors = [...new Set(colorDecls)].slice(0, 15);
+                const uniqueFonts = [...new Set(fontDecls)].slice(0, 5);
+                sections.push(`## Tokens from ${rel}\n\n${[
+                    ...uniqueProps,
+                    ...uniqueColors.map(c => `color: ${c}`),
+                    ...uniqueFonts,
+                ].join('\n')}`);
+            }
+        }
+        catch { /* skip unreadable */ }
+    }
+    if (sections.length === 0) {
+        return '(no design tokens found — using sensible defaults)';
+    }
+    return sections.join('\n\n');
+}
+/** Build the prompt that the aesthete specialist will receive. */
+export function buildDesignPrompt(opts, tokens) {
+    const kind = opts.kind ?? 'one-pager';
+    const kindGuide = {
+        'deck': 'A pitch deck — multiple slides via <section class="slide"> blocks, one idea per slide, big typography, clear hierarchy. Include title, problem, solution, market, team, ask slides as baseline.',
+        'page': 'A responsive landing page — hero, feature grid, social proof, CTA. Mobile-first.',
+        'prototype': 'An interactive product prototype — clickable navigation, realistic fake data, hover states, at least one interactive element (modal, form, toggle).',
+        'one-pager': 'A single-scroll one-pager — hero, three value props, visual diagram, conclusion. Print-friendly.',
+    };
+    return `You are the aesthete specialist producing a polished HTML artifact.
+
+## Brief
+${opts.brief}
+
+## Artifact kind: ${kind}
+${kindGuide[kind]}
+
+## Design tokens (USE THESE — respect the user's system)
+${tokens}
+
+## Requirements
+1. Output a SINGLE complete HTML file with inline <style>. No external deps.
+2. Use the design tokens above if provided (custom properties, colors, fonts).
+3. Mobile-first responsive — test at 375px, 768px, 1440px.
+4. Accessible: semantic HTML, aria-labels on interactive elements, color-contrast AA minimum.
+5. No JavaScript unless absolutely required for prototype interactivity.
+6. Typography system: clear scale, consistent rhythm, no orphan widows.
+7. If the user has Rubin tokens (--rubin-*), EB Garamond/Courier Prime, use them. Otherwise pick a tasteful system-font stack.
+8. Print to stdout ONLY the HTML, starting with <!DOCTYPE html>. No explanations, no markdown fences.`;
+}
+/** Run the design command. Returns the output file path. */
+export async function runDesign(opts, projectRoot = process.cwd()) {
+    const tokens = extractDesignTokens(projectRoot);
+    const prompt = buildDesignPrompt(opts, tokens);
+    // Route through the agent with the aesthete specialist.
+    // skipPlanner: bypass the complexity-detector planner — design prompts are
+    // long-form creative, not multi-step tasks, so plan mode returns scaffolding
+    // instead of the HTML we need.
+    const { runAgent } = await import('./agent.js');
+    const response = await runAgent(prompt, {
+        agent: 'aesthete',
+        stream: false,
+        plan: false,
+        skipPlanner: true,
+    });
+    // Extract the HTML — model may wrap in markdown fences despite instructions
+    let html = response.content.trim();
+    const fenceMatch = html.match(/```(?:html)?\s*([\s\S]*?)```/);
+    if (fenceMatch)
+        html = fenceMatch[1].trim();
+    if (!html.toLowerCase().includes('<!doctype')) {
+        html = `<!DOCTYPE html>\n${html}`;
+    }
+    // Determine output path
+    const slug = opts.brief
+        .toLowerCase()
+        .replace(/[^a-z0-9\s-]/g, '')
+        .trim()
+        .replace(/\s+/g, '-')
+        .slice(0, 50) || 'design';
+    const outPath = opts.out
+        ? resolve(opts.out.startsWith('~/') ? join(homedir(), opts.out.slice(2)) : opts.out)
+        : resolve(projectRoot, 'design-output', `${slug}.html`);
+    mkdirSync(dirname(outPath), { recursive: true });
+    writeFileSync(outPath, html);
+    // Optional: render to PDF via Playwright
+    if (opts.pdf) {
+        try {
+            await renderToPdf(outPath);
+        }
+        catch (err) {
+            process.stderr.write(`  (PDF render failed: ${String(err).slice(0, 80)})\n`);
+        }
+    }
+    // Optional: open in default browser
+    if (opts.open) {
+        try {
+            const { spawn } = await import('node:child_process');
+            const opener = process.platform === 'darwin' ? 'open' : process.platform === 'win32' ? 'start' : 'xdg-open';
+            spawn(opener, [outPath], { detached: true, stdio: 'ignore' }).unref();
+        }
+        catch { /* non-critical */ }
+    }
+    return outPath;
+}
+/** Render HTML to PDF via Playwright if it's available. */
+async function renderToPdf(htmlPath) {
+    const pdfPath = htmlPath.replace(/\.html?$/i, '.pdf');
+    // Dynamic import — Playwright is an optional peer dep
+    const playwright = await import('playwright').catch(() => null);
+    if (!playwright) {
+        throw new Error('playwright not installed; run `npm i -g playwright && npx playwright install chromium`');
+    }
+    const browser = await playwright.chromium.launch();
+    try {
+        const page = await browser.newPage();
+        await page.goto(`file://${htmlPath}`, { waitUntil: 'networkidle' });
+        await page.pdf({ path: pdfPath, format: 'A4', printBackground: true });
+        return pdfPath;
+    }
+    finally {
+        await browser.close();
+    }
+}
+//# sourceMappingURL=design.js.map

package/dist/tools/search.js

@@ -70,10 +70,71 @@ export function registerSearchTools() {
                 }
                 catch { /* skip */ }
             }
+            // Source 4: Brave Search (general web results, requires free API key)
+            // Sign up at https://api.search.brave.com — 2000 free queries/month.
+            const braveKey = process.env.BRAVE_API_KEY || process.env.BRAVE_SEARCH_API_KEY;
+            if (braveKey && parts.length < 2) {
+                try {
+                    const encoded = encodeURIComponent(query);
+                    const res = await fetch(`https://api.search.brave.com/res/v1/web/search?q=${encoded}&count=5`, {
+                        headers: {
+                            'Accept': 'application/json',
+                            'X-Subscription-Token': braveKey,
+                        },
+                        signal: AbortSignal.timeout(8000),
+                    });
+                    if (res.ok) {
+                        const data = await res.json();
+                        const items = data.web?.results ?? [];
+                        if (items.length > 0) {
+                            parts.push('**Brave Search:**');
+                            for (const item of items.slice(0, 5)) {
+                                const desc = (item.description || '').replace(/<[^>]+>/g, '').slice(0, 200);
+                                parts.push(`- [${item.title}](${item.url}) — ${desc}`);
+                            }
+                        }
+                    }
+                }
+                catch { /* skip */ }
+            }
+            // Source 5: DuckDuckGo HTML search (fallback when instant answers empty).
+            // No API key required. Free but fragile to HTML changes.
+            if (parts.length === 0) {
+                try {
+                    const encoded = encodeURIComponent(query);
+                    const res = await fetch(`https://html.duckduckgo.com/html/?q=${encoded}`, {
+                        headers: { 'User-Agent': 'Mozilla/5.0 (compatible; KBot/2.0)' },
+                        signal: AbortSignal.timeout(8000),
+                    });
+                    if (res.ok) {
+                        const html = await res.text();
+                        // Extract result snippets — DuckDuckGo HTML structure
+                        const resultPattern = /<a[^>]+class="result__a"[^>]+href="([^"]+)"[^>]*>([^<]+)<\/a>[\s\S]*?<a[^>]+class="result__snippet"[^>]*>([^<]+)</g;
+                        const results = [];
+                        let m;
+                        while ((m = resultPattern.exec(html)) !== null && results.length < 5) {
+                            const url = m[1].replace(/^\/\/duckduckgo\.com\/l\/\?uddg=/, '')
+                                .split('&')[0];
+                            const decoded = decodeURIComponent(url);
+                            const title = m[2].trim();
+                            const snippet = m[3].trim();
+                            results.push(`- [${title}](${decoded}) — ${snippet}`);
+                        }
+                        if (results.length > 0) {
+                            parts.push('**Web results:**');
+                            parts.push(...results);
+                        }
+                    }
+                }
+                catch { /* skip */ }
+            }
             if (parts.length > 0) {
                 return parts.join('\n\n');
             }
-            return `No instant results for "${query}". Try:\n- url_fetch with a specific documentation URL\n- research tool for deeper investigation`;
+            const hint = braveKey
+                ? `\n- Check BRAVE_API_KEY is valid and has quota`
+                : `\n- Set BRAVE_API_KEY (free at api.search.brave.com, 2000/mo) for real web search`;
+            return `No results for "${query}". Try:\n- url_fetch with a specific documentation URL\n- research tool for deeper investigation${hint}`;
         },
     });
     registerTool({

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@kernel.chat/kbot",
-  "version": "3.99.15",
+  "version": "3.99.16",
   "description": "Open-source terminal AI agent. 787+ tools, 35 agents, 20 providers. Dreams, learns, watches your system. Controls your phone. Fully local, fully sovereign. MIT.",
   "type": "module",
   "repository": {