@a13xu/lucid 1.9.5 → 1.11.0

package/build/tools/plan.d.ts

@@ -0,0 +1,75 @@
+import Database from "better-sqlite3";
+import { z } from "zod";
+import type { Statements } from "../database.js";
+export declare const PlanCreateSchema: z.ZodObject<{
+    title: z.ZodString;
+    description: z.ZodString;
+    user_story: z.ZodString;
+    tasks: z.ZodArray<z.ZodObject<{
+        title: z.ZodString;
+        description: z.ZodString;
+        test_criteria: z.ZodString;
+    }, "strip", z.ZodTypeAny, {
+        description: string;
+        title: string;
+        test_criteria: string;
+    }, {
+        description: string;
+        title: string;
+        test_criteria: string;
+    }>, "many">;
+}, "strip", z.ZodTypeAny, {
+    description: string;
+    title: string;
+    user_story: string;
+    tasks: {
+        description: string;
+        title: string;
+        test_criteria: string;
+    }[];
+}, {
+    description: string;
+    title: string;
+    user_story: string;
+    tasks: {
+        description: string;
+        title: string;
+        test_criteria: string;
+    }[];
+}>;
+export declare const PlanListSchema: z.ZodObject<{
+    status: z.ZodDefault<z.ZodOptional<z.ZodEnum<["active", "completed", "abandoned", "all"]>>>;
+}, "strip", z.ZodTypeAny, {
+    status: "all" | "active" | "completed" | "abandoned";
+}, {
+    status?: "all" | "active" | "completed" | "abandoned" | undefined;
+}>;
+export declare const PlanGetSchema: z.ZodObject<{
+    plan_id: z.ZodNumber;
+}, "strip", z.ZodTypeAny, {
+    plan_id: number;
+}, {
+    plan_id: number;
+}>;
+export declare const PlanUpdateTaskSchema: z.ZodObject<{
+    task_id: z.ZodNumber;
+    status: z.ZodEnum<["pending", "in_progress", "done", "blocked"]>;
+    note: z.ZodOptional<z.ZodString>;
+}, "strip", z.ZodTypeAny, {
+    status: "blocked" | "done" | "pending" | "in_progress";
+    task_id: number;
+    note?: string | undefined;
+}, {
+    status: "blocked" | "done" | "pending" | "in_progress";
+    task_id: number;
+    note?: string | undefined;
+}>;
+type PlanCreateArgs = z.infer<typeof PlanCreateSchema>;
+type PlanListArgs = z.infer<typeof PlanListSchema>;
+type PlanGetArgs = z.infer<typeof PlanGetSchema>;
+type PlanUpdateTaskArgs = z.infer<typeof PlanUpdateTaskSchema>;
+export declare function handlePlanCreate(db: Database.Database, stmts: Statements, args: PlanCreateArgs): string;
+export declare function handlePlanList(stmts: Statements, args: PlanListArgs): string;
+export declare function handlePlanGet(stmts: Statements, args: PlanGetArgs): string;
+export declare function handlePlanUpdateTask(stmts: Statements, args: PlanUpdateTaskArgs): string;
+export {};

package/build/tools/plan.js

@@ -0,0 +1,148 @@
+import { z } from "zod";
+// ---------------------------------------------------------------------------
+// Zod schemas
+// ---------------------------------------------------------------------------
+export const PlanCreateSchema = z.object({
+    title: z.string().min(1),
+    description: z.string().min(1),
+    user_story: z.string().min(1).describe("As a [user], I want [goal], so that [benefit]"),
+    tasks: z.array(z.object({
+        title: z.string().min(1),
+        description: z.string().min(1),
+        test_criteria: z.string().min(1),
+    })).min(1).max(20),
+});
+export const PlanListSchema = z.object({
+    status: z.enum(["active", "completed", "abandoned", "all"]).optional().default("active"),
+});
+export const PlanGetSchema = z.object({
+    plan_id: z.number().int().positive(),
+});
+export const PlanUpdateTaskSchema = z.object({
+    task_id: z.number().int().positive(),
+    status: z.enum(["pending", "in_progress", "done", "blocked"]),
+    note: z.string().optional(),
+});
+// ---------------------------------------------------------------------------
+// Helpers
+// ---------------------------------------------------------------------------
+const STATUS_ICONS = {
+    pending: "⬜",
+    in_progress: "🔄",
+    done: "✅",
+    blocked: "🚫",
+};
+const PLAN_STATUS_ICONS = {
+    active: "active",
+    completed: "completed",
+    abandoned: "abandoned",
+};
+function progressBar(done, total) {
+    if (total === 0)
+        return "░".repeat(10);
+    const filled = Math.round((done / total) * 10);
+    return "█".repeat(filled) + "░".repeat(10 - filled);
+}
+// ---------------------------------------------------------------------------
+// Handlers
+// ---------------------------------------------------------------------------
+export function handlePlanCreate(db, stmts, args) {
+    const { title, description, user_story, tasks } = args;
+    const planId = db.transaction(() => {
+        const result = stmts.insertPlan.run(title, description, user_story);
+        const id = result.lastInsertRowid;
+        for (let i = 0; i < tasks.length; i++) {
+            const t = tasks[i];
+            stmts.insertPlanTask.run(id, i + 1, t.title, t.description, t.test_criteria);
+        }
+        return id;
+    })();
+    const lines = [
+        `[PLAN #${planId} active] ${title}`,
+        `User Story: ${user_story}`,
+        ``,
+    ];
+    for (let i = 0; i < tasks.length; i++) {
+        lines.push(`[TASK ${i + 1} #${planId * 100 + i + 1} pending] ${tasks[i].title}`);
+    }
+    lines.push(``, `Progress: 0/${tasks.length} done`);
+    return lines.join("\n");
+}
+export function handlePlanList(stmts, args) {
+    const { status } = args;
+    const all = stmts.getAllPlans.all();
+    const filtered = status === "all" ? all : all.filter(p => p.status === status);
+    if (filtered.length === 0) {
+        return `No ${status === "all" ? "" : status + " "}plans found.`;
+    }
+    const lines = [];
+    for (const plan of filtered) {
+        const tasks = stmts.getTasksByPlanId.all(plan.id);
+        const doneCount = tasks.filter(t => t.status === "done").length;
+        const label = PLAN_STATUS_ICONS[plan.status] ?? plan.status;
+        lines.push(`[#${plan.id} ${label}] ${plan.title} — ${doneCount}/${tasks.length} tasks done`);
+    }
+    return lines.join("\n");
+}
+export function handlePlanGet(stmts, args) {
+    const plan = stmts.getPlanById.get(args.plan_id);
+    if (!plan)
+        return `Error: Plan #${args.plan_id} not found.`;
+    const tasks = stmts.getTasksByPlanId.all(plan.id);
+    const doneCount = tasks.filter(t => t.status === "done").length;
+    const total = tasks.length;
+    const bar = progressBar(doneCount, total);
+    const label = PLAN_STATUS_ICONS[plan.status] ?? plan.status;
+    const lines = [
+        `[PLAN #${plan.id} | ${label}] ${plan.title}`,
+        `User Story: ${plan.user_story}`,
+        `Progress: ${doneCount}/${total} done ${bar}`,
+        ``,
+    ];
+    for (const task of tasks) {
+        const icon = STATUS_ICONS[task.status] ?? "❓";
+        lines.push(`[${task.seq}] ${icon} ${task.status}  — ${task.title}`);
+        lines.push(`    Desc: ${task.description}`);
+        lines.push(`    Test: ${task.test_criteria}`);
+        let parsedNotes = [];
+        try {
+            parsedNotes = JSON.parse(task.notes);
+        }
+        catch { /* ignore */ }
+        for (const n of parsedNotes) {
+            const date = new Date(n.ts * 1000).toISOString().slice(0, 10);
+            lines.push(`    Note: ${date} — ${n.text}`);
+        }
+        lines.push(``);
+    }
+    return lines.join("\n").trimEnd();
+}
+export function handlePlanUpdateTask(stmts, args) {
+    const { task_id, status, note } = args;
+    const task = stmts.getTaskById.get(task_id);
+    if (!task)
+        return `Error: Task #${task_id} not found.`;
+    let notes = [];
+    try {
+        notes = JSON.parse(task.notes);
+    }
+    catch { /* ignore */ }
+    if (note) {
+        notes.push({ text: note, ts: Math.floor(Date.now() / 1000) });
+    }
+    const notesJson = JSON.stringify(notes);
+    stmts.updateTaskStatus.run(status, notesJson, task_id);
+    const lines = [`✅ Task #${task_id} → ${status}`];
+    if (status === "done") {
+        const remaining = stmts.countRemainingTasks.get(task.plan_id);
+        if (remaining && remaining.count === 0) {
+            stmts.updatePlanStatus.run("completed", task.plan_id);
+            const plan = stmts.getPlanById.get(task.plan_id);
+            const taskCount = stmts.getTasksByPlanId.all(task.plan_id).length;
+            lines.push(`🎉 Plan #${task.plan_id} completat! Toate ${taskCount} task-uri done.`);
+            if (plan)
+                lines.push(`   "${plan.title}"`);
+        }
+    }
+    return lines.join("\n");
+}

package/build/tools/webdev/accessibility-audit.d.ts

@@ -0,0 +1,23 @@
+import { z } from "zod";
+export declare const AccessibilityAuditSchema: z.ZodObject<{
+    code: z.ZodString;
+    wcag_level: z.ZodEnum<["A", "AA", "AAA"]>;
+    framework: z.ZodEnum<["html", "jsx", "vue"]>;
+}, "strip", z.ZodTypeAny, {
+    code: string;
+    framework: "vue" | "jsx" | "html";
+    wcag_level: "A" | "AA" | "AAA";
+}, {
+    code: string;
+    framework: "vue" | "jsx" | "html";
+    wcag_level: "A" | "AA" | "AAA";
+}>;
+export type A11ySeverity = "critical" | "warning" | "info";
+export interface A11yIssue {
+    line: number;
+    severity: A11ySeverity;
+    criterion: string;
+    message: string;
+    fix: string;
+}
+export declare function handleAccessibilityAudit(args: z.infer<typeof AccessibilityAuditSchema>): string;

package/build/tools/webdev/accessibility-audit.js

@@ -0,0 +1,214 @@
+import { z } from "zod";
+// ---------------------------------------------------------------------------
+// Schema
+// ---------------------------------------------------------------------------
+export const AccessibilityAuditSchema = z.object({
+    code: z.string().describe("HTML, JSX, or Vue template snippet to audit"),
+    wcag_level: z.enum(["A", "AA", "AAA"]).describe("WCAG conformance level to check against"),
+    framework: z.enum(["html", "jsx", "vue"]).describe("Code framework/format"),
+});
+const RULES = [
+    {
+        id: "img-alt",
+        criterion: "WCAG 1.1.1 (Non-text Content)",
+        level: "A",
+        severity: "critical",
+        // Matches <img> or JSX <img ... /> without an alt attribute
+        pattern: /<img(?![^>]*\balt=)[^>]*>/gi,
+        message: "<img> is missing an `alt` attribute",
+        fix: (m) => m.replace(/<img/, '<img alt=""'),
+    },
+    {
+        id: "anchor-empty",
+        criterion: "WCAG 2.4.4 (Link Purpose)",
+        level: "A",
+        severity: "critical",
+        pattern: /<a\b[^>]*>\s*<\/a>/gi,
+        message: "Anchor element has no text content",
+        fix: (m) => m.replace(/<\/a>/, "<!-- TODO: add descriptive link text --></a>"),
+    },
+    {
+        id: "button-empty",
+        criterion: "WCAG 4.1.2 (Name, Role, Value)",
+        level: "A",
+        severity: "critical",
+        pattern: /<button\b[^>]*>\s*<\/button>/gi,
+        message: "Button element has no accessible text",
+        fix: (m) => m.replace(/<\/button>/, "<!-- TODO: add button label --></button>"),
+    },
+    {
+        id: "input-no-label",
+        criterion: "WCAG 1.3.1 (Info and Relationships)",
+        level: "A",
+        severity: "critical",
+        // Input without aria-label, aria-labelledby, or id (which a <label for=...> would target)
+        pattern: /<input\b(?![^>]*(?:aria-label|aria-labelledby|id\s*=))[^>]*>/gi,
+        message: "<input> has no associated label (missing aria-label or id for <label for=>)",
+        fix: (m) => {
+            const withId = m.includes("id=") ? m : m.replace(/<input/, '<input id="field-id"');
+            return withId;
+        },
+    },
+    {
+        id: "heading-skip",
+        criterion: "WCAG 1.3.1 (Info and Relationships)",
+        level: "A",
+        severity: "warning",
+        // Detects <h4>+ without preceding h3 in the same snippet (simplified: warns on h4/h5/h6)
+        pattern: /<h[456]\b/gi,
+        message: "Heading level h4/h5/h6 found — verify heading hierarchy is not skipped",
+        fix: () => "<!-- Ensure h1 → h2 → h3 order is maintained before using this heading level -->",
+    },
+    {
+        id: "tabindex-positive",
+        criterion: "WCAG 2.4.3 (Focus Order)",
+        level: "A",
+        severity: "warning",
+        pattern: /tabindex\s*=\s*["'][1-9]\d*["']/gi,
+        message: "Positive tabindex disrupts natural focus order",
+        fix: (m) => m.replace(/tabindex\s*=\s*["'][^"']*["']/, 'tabindex="0"'),
+    },
+    {
+        id: "onclick-non-interactive",
+        criterion: "WCAG 2.1.1 (Keyboard)",
+        level: "A",
+        severity: "warning",
+        // onClick/onclick on non-interactive elements (div, span, p)
+        pattern: /<(?:div|span|p)\b[^>]*\bon[Cc]lick\b[^>]*>/g,
+        message: "onClick on a non-interactive element — use <button> or add role + keyboard handlers",
+        fix: (m) => m
+            .replace(/^<(div|span|p)/, '<button')
+            .replace(/>$/, ' type="button">'),
+    },
+    {
+        id: "color-only",
+        criterion: "WCAG 1.4.1 (Use of Color)",
+        level: "A",
+        severity: "info",
+        pattern: /color:\s*(?:red|green|#[0-9a-f]{3,6})\b/gi,
+        message: "Color appears to be used alone — ensure information is not conveyed by color only",
+        fix: () => "/* Add text, icon, or pattern as secondary indicator alongside color */",
+    },
+    {
+        id: "link-new-tab-warning",
+        criterion: "WCAG 3.2.2 (On Input)",
+        level: "A",
+        severity: "info",
+        pattern: /target\s*=\s*["']_blank["']/gi,
+        message: 'Links opening in new tab should warn users (add aria-label or visible indicator)',
+        fix: (m) => m.replace(/target\s*=\s*["']_blank["']/, 'target="_blank" rel="noopener noreferrer" aria-label="Opens in new tab"'),
+    },
+    {
+        id: "form-no-submit",
+        criterion: "WCAG 2.1.1 (Keyboard)",
+        level: "A",
+        severity: "warning",
+        // <form> without an onSubmit handler or submit button
+        pattern: /<form\b(?![^>]*(?:onSubmit|action))[^>]*>/gi,
+        message: "<form> has no onSubmit/action — keyboard users cannot submit",
+        fix: (m) => m.replace(/<form/, '<form onSubmit={handleSubmit}'),
+    },
+    {
+        id: "svg-no-title",
+        criterion: "WCAG 1.1.1 (Non-text Content)",
+        level: "A",
+        severity: "warning",
+        // <svg> without aria-label, aria-hidden, or <title>
+        pattern: /<svg\b(?![^>]*(?:aria-label|aria-hidden))[^>]*>/gi,
+        message: "<svg> is missing aria-label or aria-hidden (decorative SVGs need aria-hidden=\"true\")",
+        fix: (m) => m.replace(/<svg/, '<svg aria-hidden="true"'),
+    },
+    // AA-level rules
+    {
+        id: "contrast-inline-style",
+        criterion: "WCAG 1.4.3 (Contrast Minimum)",
+        level: "AA",
+        severity: "warning",
+        pattern: /color:\s*#(?:ccc|ddd|eee|aaa|bbb|999|888|fff|ffffff|eeeeee|dddddd|cccccc)\b/gi,
+        message: "Low-contrast color detected in inline style — verify 4.5:1 ratio for normal text",
+        fix: () => "/* Use a color with sufficient contrast ratio (≥4.5:1 for normal text) */",
+    },
+    {
+        id: "small-touch-target",
+        criterion: "WCAG 2.5.8 (Target Size)",
+        level: "AA",
+        severity: "info",
+        // Very small explicit width/height on interactive elements
+        pattern: /(?:width|height)\s*:\s*(?:[0-9]|1[0-9]|2[0-3])px/gi,
+        message: "Touch target may be too small — WCAG 2.5.8 recommends at least 24×24px",
+        fix: () => "/* Set min-width/min-height: 44px for touch targets (WCAG 2.5.5 enhanced) */",
+    },
+];
+// ---------------------------------------------------------------------------
+// Analyzer
+// ---------------------------------------------------------------------------
+function auditCode(code, wcagLevel, _framework) {
+    const lines = code.split("\n");
+    const issues = [];
+    // Level hierarchy: AAA includes AA includes A
+    const includedLevels = wcagLevel === "A" ? ["A"] : wcagLevel === "AA" ? ["A", "AA"] : ["A", "AA", "AAA"];
+    for (const rule of RULES) {
+        if (!includedLevels.includes(rule.level))
+            continue;
+        for (let i = 0; i < lines.length; i++) {
+            const line = lines[i];
+            let match;
+            const re = new RegExp(rule.pattern.source, rule.pattern.flags.replace("g", "") + "g");
+            while ((match = re.exec(line)) !== null) {
+                issues.push({
+                    line: i + 1,
+                    severity: rule.severity,
+                    criterion: rule.criterion,
+                    message: rule.message,
+                    fix: rule.fix(match[0]),
+                });
+                // Prevent infinite loops on zero-length matches
+                if (match.index === re.lastIndex)
+                    re.lastIndex++;
+            }
+        }
+    }
+    // Sort: critical first, then by line
+    const order = { critical: 0, warning: 1, info: 2 };
+    issues.sort((a, b) => order[a.severity] - order[b.severity] || a.line - b.line);
+    return issues;
+}
+// ---------------------------------------------------------------------------
+// Formatter
+// ---------------------------------------------------------------------------
+const SEV_ICON = {
+    critical: "🔴",
+    warning: "🟠",
+    info: "🔵",
+};
+function formatIssues(issues, wcagLevel) {
+    if (issues.length === 0) {
+        return `✅ No accessibility issues found at WCAG ${wcagLevel} level.`;
+    }
+    const critical = issues.filter((i) => i.severity === "critical").length;
+    const warning = issues.filter((i) => i.severity === "warning").length;
+    const info = issues.filter((i) => i.severity === "info").length;
+    const lines = [
+        `🔍 Accessibility Audit — WCAG ${wcagLevel}`,
+        `Found ${issues.length} issue(s): 🔴 ${critical} critical  🟠 ${warning} warning  🔵 ${info} info`,
+        ``,
+    ];
+    for (const issue of issues) {
+        lines.push(`${SEV_ICON[issue.severity]} Line ${issue.line} — ${issue.criterion}`, `   ${issue.message}`, `   Fix: ${issue.fix}`, ``);
+    }
+    lines.push(`💡 Reasoning: Scanned for WCAG ${wcagLevel} violations including missing alt text, ` +
+        `unlabeled form controls, empty interactive elements, keyboard accessibility issues, ` +
+        `and color contrast concerns. Automated checks cannot replace manual testing with ` +
+        `a screen reader (NVDA, JAWS, VoiceOver).`);
+    return lines.join("\n");
+}
+// ---------------------------------------------------------------------------
+// Handler
+// ---------------------------------------------------------------------------
+// Example call:
+//   handleAccessibilityAudit({ code: '<img src="hero.jpg">', wcag_level: "AA", framework: "html" })
+export function handleAccessibilityAudit(args) {
+    const { code, wcag_level, framework } = args;
+    const issues = auditCode(code, wcag_level, framework);
+    return formatIssues(issues, wcag_level);
+}

package/build/tools/webdev/api-client.d.ts

@@ -0,0 +1,24 @@
+import { z } from "zod";
+export declare const ApiClientSchema: z.ZodObject<{
+    endpoint: z.ZodString;
+    method: z.ZodEnum<["GET", "POST", "PUT", "PATCH", "DELETE"]>;
+    request_schema: z.ZodOptional<z.ZodString>;
+    response_schema: z.ZodOptional<z.ZodString>;
+    auth: z.ZodEnum<["bearer", "cookie", "apikey", "none"]>;
+    base_url_var: z.ZodOptional<z.ZodString>;
+}, "strip", z.ZodTypeAny, {
+    method: "POST" | "GET" | "PUT" | "PATCH" | "DELETE";
+    endpoint: string;
+    auth: "none" | "bearer" | "cookie" | "apikey";
+    request_schema?: string | undefined;
+    response_schema?: string | undefined;
+    base_url_var?: string | undefined;
+}, {
+    method: "POST" | "GET" | "PUT" | "PATCH" | "DELETE";
+    endpoint: string;
+    auth: "none" | "bearer" | "cookie" | "apikey";
+    request_schema?: string | undefined;
+    response_schema?: string | undefined;
+    base_url_var?: string | undefined;
+}>;
+export declare function handleApiClient(args: z.infer<typeof ApiClientSchema>): string;

package/build/tools/webdev/api-client.js

@@ -0,0 +1,167 @@
+import { z } from "zod";
+// ---------------------------------------------------------------------------
+// Schema
+// ---------------------------------------------------------------------------
+export const ApiClientSchema = z.object({
+    endpoint: z.string().describe("API endpoint path (e.g. /users/:id or /api/products)"),
+    method: z
+        .enum(["GET", "POST", "PUT", "PATCH", "DELETE"])
+        .describe("HTTP method"),
+    request_schema: z
+        .string()
+        .optional()
+        .describe("TypeScript type/interface string describing the request body"),
+    response_schema: z
+        .string()
+        .optional()
+        .describe("TypeScript type/interface string describing the response"),
+    auth: z
+        .enum(["bearer", "cookie", "apikey", "none"])
+        .describe("Authentication strategy"),
+    base_url_var: z
+        .string()
+        .optional()
+        .describe("Environment variable name for the base URL (e.g. NEXT_PUBLIC_API_URL)"),
+});
+// ---------------------------------------------------------------------------
+// Helpers
+// ---------------------------------------------------------------------------
+function endpointToFunctionName(endpoint, method) {
+    const parts = endpoint
+        .replace(/^\/+/, "")
+        .split("/")
+        .map((seg) => {
+        if (seg.startsWith(":") || (seg.startsWith("{") && seg.endsWith("}"))) {
+            const name = seg.replace(/[:{}]/g, "");
+            return "By" + name.charAt(0).toUpperCase() + name.slice(1);
+        }
+        return seg.charAt(0).toUpperCase() + seg.slice(1).toLowerCase();
+    })
+        .join("");
+    const methodPrefix = {
+        GET: "fetch",
+        POST: "create",
+        PUT: "update",
+        PATCH: "patch",
+        DELETE: "delete",
+    };
+    return (methodPrefix[method] ?? "call") + parts;
+}
+function buildAuthHeaders(auth) {
+    switch (auth) {
+        case "bearer":
+            return `    "Authorization": \`Bearer \${token}\`,`;
+        case "apikey":
+            return `    "X-Api-Key": apiKey,`;
+        default:
+            return "";
+    }
+}
+function buildFunctionSignature(fnName, method, endpoint, requestSchema, auth) {
+    const params = [];
+    // Path params
+    const pathParams = [...endpoint.matchAll(/:([a-zA-Z_]+)|{([a-zA-Z_]+)}/g)];
+    for (const m of pathParams) {
+        params.push(`${m[1] ?? m[2]}: string`);
+    }
+    // Body param for write methods
+    if (["POST", "PUT", "PATCH"].includes(method)) {
+        const bodyType = requestSchema ? "RequestBody" : "Record<string, unknown>";
+        params.push(`body: ${bodyType}`);
+    }
+    // Auth params
+    if (auth === "bearer")
+        params.push("token: string");
+    if (auth === "apikey")
+        params.push("apiKey: string");
+    return `async function ${fnName}(${params.join(", ")})`;
+}
+// ---------------------------------------------------------------------------
+// Handler
+// ---------------------------------------------------------------------------
+// Example call:
+//   handleApiClient({ endpoint: "/users/:id", method: "GET", response_schema: "{ id: string; name: string; email: string }", auth: "bearer", base_url_var: "NEXT_PUBLIC_API_URL" })
+export function handleApiClient(args) {
+    const { endpoint, method, request_schema, response_schema, auth, base_url_var } = args;
+    const fnName = endpointToFunctionName(endpoint, method);
+    const baseUrlVar = base_url_var ?? "API_BASE_URL";
+    const responseType = response_schema ? "ResponseData" : "unknown";
+    const authHeaders = buildAuthHeaders(auth);
+    const signature = buildFunctionSignature(fnName, method, endpoint, request_schema, auth);
+    // Build path interpolation
+    const pathWithVars = endpoint.replace(/:([a-zA-Z_]+)/g, "${$1}").replace(/\{([a-zA-Z_]+)\}/g, "${$1}");
+    const hasBody = ["POST", "PUT", "PATCH"].includes(method);
+    const typeBlock = [];
+    if (request_schema && hasBody) {
+        typeBlock.push(`type RequestBody = ${request_schema};`);
+    }
+    if (response_schema) {
+        typeBlock.push(`type ResponseData = ${response_schema};`);
+    }
+    const cookieComment = auth === "cookie" ? "\n  // Cookies sent automatically by browser" : "";
+    const credentialsOption = auth === "cookie" ? '\n    credentials: "include",' : "";
+    const bodyOption = hasBody
+        ? `\n    body: JSON.stringify(body),`
+        : "";
+    const code = `${typeBlock.length ? typeBlock.join("\n") + "\n\n" : ""}const BASE_URL = process.env.${baseUrlVar} ?? "";
+
+export ${signature}: Promise<${responseType}> {
+  const url = \`\${BASE_URL}${pathWithVars}\`;
+
+  const response = await fetch(url, {
+    method: "${method}",
+    headers: {${authHeaders ? "\n" + authHeaders : ""}
+      "Content-Type": "application/json",
+      "Accept": "application/json",
+    },${credentialsOption}${bodyOption}
+  });${cookieComment}
+
+  if (!response.ok) {
+    const errorText = await response.text().catch(() => "Unknown error");
+    throw new Error(\`\${method} \${url} failed: \${response.status} \${errorText}\`);
+  }
+
+  if (response.status === 204) {
+    return undefined as ${responseType};
+  }
+
+  return response.json() as Promise<${responseType}>;
+}
+
+// Usage example:
+// const data = await ${fnName}(${buildUsageExample(endpoint, method, request_schema, auth)});`;
+    const lines = [
+        `✅ API client: ${method} ${endpoint}`,
+        `📄 Function: ${fnName}`,
+        `🔧 Auth: ${auth} | Base URL: process.env.${baseUrlVar}`,
+        ``,
+        "```typescript",
+        code,
+        "```",
+        ``,
+        `💡 Reasoning: Generated a typed fetch wrapper for ${method} ${endpoint}. ` +
+            `Throws on non-2xx responses with status + body in the error message. ` +
+            `204 No Content returns \`undefined\`. ` +
+            (auth === "cookie"
+                ? "Uses credentials: include for cookie-based auth. "
+                : auth === "bearer"
+                    ? "Pass the JWT/token as the `token` parameter. "
+                    : auth === "apikey"
+                        ? "Pass the API key as the `apiKey` parameter. "
+                        : "") +
+            `Replace type aliases with your actual interfaces.`,
+    ];
+    return lines.join("\n");
+}
+function buildUsageExample(endpoint, method, requestSchema, auth) {
+    const pathParams = [...endpoint.matchAll(/:([a-zA-Z_]+)|{([a-zA-Z_]+)}/g)].map((m) => `"${m[1] ?? m[2]}-value"`);
+    const parts = [...pathParams];
+    if (["POST", "PUT", "PATCH"].includes(method)) {
+        parts.push(requestSchema ? "{ /* body */ }" : "{}");
+    }
+    if (auth === "bearer")
+        parts.push('"YOUR_TOKEN"');
+    if (auth === "apikey")
+        parts.push('"YOUR_API_KEY"');
+    return parts.join(", ");
+}

package/build/tools/webdev/design-tokens.d.ts

@@ -0,0 +1,18 @@
+import { z } from "zod";
+export declare const DesignTokensSchema: z.ZodObject<{
+    brand_name: z.ZodString;
+    primary_color: z.ZodString;
+    mood: z.ZodEnum<["minimal", "bold", "playful", "corporate"]>;
+    output_format: z.ZodEnum<["css-variables", "tailwind-config", "json"]>;
+}, "strip", z.ZodTypeAny, {
+    brand_name: string;
+    primary_color: string;
+    mood: "bold" | "minimal" | "playful" | "corporate";
+    output_format: "css-variables" | "tailwind-config" | "json";
+}, {
+    brand_name: string;
+    primary_color: string;
+    mood: "bold" | "minimal" | "playful" | "corporate";
+    output_format: "css-variables" | "tailwind-config" | "json";
+}>;
+export declare function handleDesignTokens(args: z.infer<typeof DesignTokensSchema>): string;