veryfront 0.1.1195 → 0.1.1197

package/esm/cli/templates/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/cli/templates/index.ts"],"names":[],"mappings":"AAAA;;;;;;GAMG;AAQH,OAAO,KAAK,EACV,YAAY,EACZ,aAAa,EACb,WAAW,EACX,eAAe,EACf,cAAc,EACd,YAAY,EACZ,YAAY,EACb,MAAM,YAAY,CAAC;AAEpB,YAAY,EACV,YAAY,EACZ,aAAa,EACb,WAAW,EACX,eAAe,EACf,cAAc,EACd,YAAY,EACZ,YAAY,GACb,CAAC;AAEF,OAAO,EACL,kBAAkB,EAClB,aAAa,EACb,WAAW,EACX,iBAAiB,EACjB,WAAW,EACX,iBAAiB,EACjB,UAAU,EACV,eAAe,EACf,gBAAgB,GACjB,MAAM,qBAAqB,CAAC;AAE7B,eAAO,MAAM,eAAe,EAAE,OAAO,CAAC,MAAM,CAAC,YAAY,EAAE,cAAc,CAAC,CAQzE,CAAC;AAIF,wBAAsB,WAAW,CAAC,IAAI,EAAE,YAAY,GAAG,OAAO,CAAC,YAAY,EAAE,GAAG,IAAI,CAAC,CAmBpF;AAED,wBAAgB,iBAAiB,CAAC,IAAI,EAAE,YAAY,GAAG,cAAc,GAAG,IAAI,CAE3E;AAED,wBAAgB,iBAAiB,CAAC,YAAY,EAAE,MAAM,GAAG,MAAM,GAAG,IAAI,CAErE"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/cli/templates/index.ts"],"names":[],"mappings":"AAAA;;;;;;GAMG;AAQH,OAAO,KAAK,EACV,YAAY,EACZ,aAAa,EACb,WAAW,EACX,eAAe,EACf,cAAc,EACd,YAAY,EACZ,YAAY,EACb,MAAM,YAAY,CAAC;AAEpB,YAAY,EACV,YAAY,EACZ,aAAa,EACb,WAAW,EACX,eAAe,EACf,cAAc,EACd,YAAY,EACZ,YAAY,GACb,CAAC;AAEF,OAAO,EACL,kBAAkB,EAClB,aAAa,EACb,WAAW,EACX,iBAAiB,EACjB,WAAW,EACX,iBAAiB,EACjB,UAAU,EACV,eAAe,EACf,gBAAgB,GACjB,MAAM,qBAAqB,CAAC;AAgB7B,eAAO,MAAM,eAAe,EAAE,OAAO,CAAC,MAAM,CAAC,YAAY,EAAE,cAAc,CAAC,CAqBzE,CAAC;AAaF,wBAAsB,WAAW,CAAC,IAAI,EAAE,YAAY,GAAG,OAAO,CAAC,YAAY,EAAE,GAAG,IAAI,CAAC,CAoBpF;AAED,wBAAgB,iBAAiB,CAAC,IAAI,EAAE,YAAY,GAAG,cAAc,GAAG,IAAI,CAE3E;AAED,wBAAgB,iBAAiB,CAAC,YAAY,EAAE,MAAM,GAAG,MAAM,GAAG,IAAI,CAErE"}

package/esm/cli/templates/index.js

@@ -8,19 +8,54 @@
 import { loadAiRuleTemplate, loadTemplateFromDirectory, templateDirectoryExists, } from "./loader.js";
 import { STARTER_TEMPLATE_NAMES } from "./types.js";
 export { AVAILABLE_FEATURES, featureExists, loadFeature, loadFeatureConfig, mergeConfig, mergeDependencies, mergeFiles, resolveFeatures, validateFeatures, } from "./feature-loader.js";
+/**
+ * Markdown renderer dependencies for the chat starters.
+ *
+ * `veryfront/markdown` presents plain source until a renderer is installed, so
+ * every starter that renders `<Chat>` scaffolds one in `app/markdown-renderer.tsx`
+ * and installs the parser it uses. Versions are exact: these reach the browser
+ * through the module pipeline, where a floating range would resolve to whatever
+ * is latest at request time.
+ */
+const CHAT_MARKDOWN_DEPENDENCIES = {
+    "react-markdown": "9.0.3",
+    "remark-gfm": "4.0.1",
+};
 export const templateConfigs = {
+    "ai-agent": {
+        npmDependencies: { ...CHAT_MARKDOWN_DEPENDENCIES },
+    },
+    "coding-agent": {
+        npmDependencies: { ...CHAT_MARKDOWN_DEPENDENCIES },
+    },
+    "multi-agent-system": {
+        npmDependencies: { ...CHAT_MARKDOWN_DEPENDENCIES },
+    },
+    "saas-starter": {
+        npmDependencies: { ...CHAT_MARKDOWN_DEPENDENCIES },
+    },
     "docs-agent": {
         firstPartyExtensions: ["@veryfront/ext-document-kreuzberg"],
         npmDependencies: {
+            ...CHAT_MARKDOWN_DEPENDENCIES,
             "@kreuzberg/node": "^4.4.2",
             "@kreuzberg/wasm": "4.5.2",
         },
     },
 };
 const DIRECTORY_BASED_TEMPLATES = [...STARTER_TEMPLATE_NAMES];
+/**
+ * The router aliases scaffold the `ai-agent` files, so they must resolve the
+ * same config. Keeping the mapping in one place stops files and dependencies
+ * from drifting apart.
+ */
+function resolveTemplateAlias(name) {
+    return name === "pages-router" || name === "app-router" ? "ai-agent" : name;
+}
 export async function getTemplate(name) {
-    if (name === "pages-router" || name === "app-router") {
-        return getTemplate("ai-agent");
+    const resolved = resolveTemplateAlias(name);
+    if (resolved !== name) {
+        return getTemplate(resolved);
     }
     if (!DIRECTORY_BASED_TEMPLATES.includes(name)) {
         return null;
@@ -35,7 +70,7 @@ export async function getTemplate(name) {
     return files;
 }
 export function getTemplateConfig(name) {
-    return templateConfigs[name] ?? null;
+    return templateConfigs[resolveTemplateAlias(name)] ?? null;
 }
 export function getAiRuleTemplate(templateName) {
     return loadAiRuleTemplate(templateName);

package/esm/cli/templates/manifest.d.ts

@@ -25,6 +25,7 @@ declare namespace _default {
                 "agents/assistant.ts": string;
                 "app/api/ag-ui/route.ts": string;
                 "app/layout.tsx": string;
+                "app/markdown-renderer.tsx": string;
                 "app/page.tsx": string;
                 "evals/assistant.eval.ts": string;
                 "globals.css": string;
@@ -39,6 +40,7 @@ declare namespace _default {
                 "agents/coder.ts": string;
                 "app/api/ag-ui/route.ts": string;
                 "app/layout.tsx": string;
+                "app/markdown-renderer.tsx": string;
                 "app/page.tsx": string;
                 "globals.css": string;
                 "public/favicon.svg": string;
@@ -56,6 +58,7 @@ declare namespace _default {
                 "app/api/ingest/route.ts": string;
                 "app/api/uploads/route.ts": string;
                 "app/layout.tsx": string;
+                "app/markdown-renderer.tsx": string;
                 "app/page.tsx": string;
                 "app/uploads/page.tsx": string;
                 "content/architecture.md": string;
@@ -84,6 +87,7 @@ declare namespace _default {
                 "agents/writer.ts": string;
                 "app/api/ag-ui/route.ts": string;
                 "app/layout.tsx": string;
+                "app/markdown-renderer.tsx": string;
                 "app/page.tsx": string;
                 "globals.css": string;
                 "public/favicon.svg": string;
@@ -99,6 +103,7 @@ declare namespace _default {
                 "app/dashboard/page.tsx": string;
                 "app/layout.tsx": string;
                 "app/login/page.tsx": string;
+                "app/markdown-renderer.tsx": string;
                 "app/page.tsx": string;
                 "globals.css": string;
                 "public/favicon.svg": string;

package/esm/cli/templates/manifest.js

@@ -25,13 +25,14 @@ export default {
                 "agents/assistant.ts": "import { agent } from \"veryfront/agent\";\n\nexport default agent({\n  id: \"assistant\",\n  name: \"Assistant\",\n  description: \"Turn a rough idea into a clear next move.\",\n  system:\n    \"Be direct and practical. Structure complex answers clearly. Use the calculator tool for arithmetic instead of calculating mentally. Plan the calculation before calling the calculator, use the fewest calls needed, and answer immediately after you have the result. For currency splits, make rounded shares add exactly to the total and explain any remainder. Use other tools when they improve accuracy, and state assumptions that affect the result.\",\n  tools: true,\n  maxSteps: 20,\n  suggestions: [\n    {\n      type: \"prompt\",\n      title: \"Shape an idea\",\n      prompt: \"Turn this rough idea into a focused plan with the first three steps: \",\n    },\n    {\n      type: \"prompt\",\n      title: \"Run the numbers\",\n      prompt:\n        \"Calculate an 18% tip on $84.50, split the total among three people, and explain the result briefly.\",\n    },\n  ],\n});\n",
                 "app/api/ag-ui/route.ts": "import { createAgUiHandler } from \"veryfront/agent\";\n\nexport const POST = createAgUiHandler(\"assistant\");\n",
                 "app/layout.tsx": "import \"../globals.css\";\nimport { Head } from \"veryfront/head\";\n\nexport default function RootLayout({\n  children,\n}: {\n  children: React.ReactNode;\n}): React.ReactNode {\n  return (\n    <>\n      <Head>\n        <title>Assistant</title>\n        <link rel=\"icon\" href=\"/favicon.svg\" type=\"image/svg+xml\" />\n      </Head>\n      {children}\n    </>\n  );\n}\n",
-                "app/page.tsx": "\"use client\";\n\nimport { Chat } from \"veryfront/chat\";\n\nexport default function ChatPage(): React.JSX.Element {\n  return <Chat agentId=\"assistant\" className=\"h-screen\" />;\n}\n",
+                "app/markdown-renderer.tsx": "\"use client\";\n\nimport ReactMarkdown from \"react-markdown\";\nimport remarkGfm from \"remark-gfm\";\nimport type { MarkdownRendererProps } from \"veryfront/markdown\";\n\n/**\n * Rich Markdown for assistant answers.\n *\n * `veryfront/markdown` presents plain source until a renderer is installed, so\n * this component supplies one. Swap in any renderer that accepts\n * `MarkdownRendererProps` to change how answers are parsed and rendered.\n */\nexport function MarkdownRenderer({ source }: MarkdownRendererProps): React.JSX.Element {\n  return <ReactMarkdown remarkPlugins={[remarkGfm]}>{source}</ReactMarkdown>;\n}\n",
+                "app/page.tsx": "\"use client\";\n\nimport { Chat } from \"veryfront/chat\";\nimport { MarkdownRendererProvider } from \"veryfront/markdown\";\nimport { MarkdownRenderer } from \"./markdown-renderer.tsx\";\n\nexport default function ChatPage(): React.JSX.Element {\n  return (\n    <MarkdownRendererProvider renderer={MarkdownRenderer}>\n      <Chat agentId=\"assistant\" className=\"h-screen\" />\n    </MarkdownRendererProvider>\n  );\n}\n",
                 "evals/assistant.eval.ts": "import { datasets, evalAgent, judges, metrics } from \"veryfront/eval\";\n\nexport default evalAgent({\n  name: \"Assistant smoke test\",\n  target: \"agent:assistant\",\n  dataset: datasets.inline([\n    {\n      id: \"calculator\",\n      input:\n        \"Calculate an 18% tip on $84.50, split the total among three people, and explain the result briefly.\",\n      reference: \"$99.71 total; two people pay $33.24 and one pays $33.23.\",\n    },\n  ]),\n  metrics: [\n    metrics.answer.regex({\n      pattern: String.raw`(?<![-\\d.\\\\])\\\\?\\$15\\.21(?!\\d|\\.\\d)`,\n    }).gate(),\n    metrics.answer.regex({\n      pattern: String.raw`(?<![-\\d.\\\\])\\\\?\\$99\\.71(?!\\d|\\.\\d)`,\n    }).gate(),\n    metrics.answer.regex({\n      pattern: String.raw`(?<![-\\d.\\\\])\\\\?\\$33\\.24(?!\\d|\\.\\d)`,\n    }).gate(),\n    metrics.answer.regex({\n      pattern: String.raw`(?<![-\\d.\\\\])\\\\?\\$33\\.23(?!\\d|\\.\\d)`,\n    }).gate(),\n    metrics.agent.calledTool(\"calculator\").gate(),\n    metrics.agent.noFailedTools().gate(),\n    metrics.judge.rubric({\n      rubric:\n        \"The answer must correctly state the $15.21 tip, $99.71 total, and a cent-exact split of two payments of $33.24 and one of $33.23. It should explain the result briefly.\",\n      judge: judges.llm.rubric(),\n    }).gate({ min: 0.8 }),\n  ],\n});\n",
                 "globals.css": "@import \"tailwindcss\";\n",
                 "public/favicon.svg": "<svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 64 64\">\n  <rect width=\"64\" height=\"64\" fill=\"#fff\"/>\n  <circle cx=\"32\" cy=\"32\" r=\"20\" fill=\"#000\"/>\n</svg>\n",
                 "README.md": "# AI Agent\n\nA small, customizable agent with a streaming chat UI and tool support.\n\n## What's included\n\n- Single assistant agent with streaming chat UI\n- Example calculator tool\n- Smoke eval for the agent and calculator\n- App-mode `Chat` component for real-time responses\n\n## Structure\n\n```\nagents/assistant.ts    Agent definition\ntools/calculator.ts    Example tool\nevals/assistant.eval.ts Agent smoke eval\napp/\n  api/ag-ui/route.ts    AG-UI endpoint\n  page.tsx             Chat interface\n```\n\n## Customize\n\n- Edit `agents/assistant.ts` to change the agent's identity, instructions, and suggestions.\n- Add or replace files in `tools/` to give the agent new capabilities.\n- Update `evals/assistant.eval.ts`, then run `npm run eval -- assistant`.\n- Edit `app/page.tsx` when you need to customize the chat UI.\n",
                 "tools/calculator.ts": "import { tool } from \"veryfront/tool\";\nimport { defineSchema } from \"veryfront/schemas\";\n\nexport default tool({\n  id: \"calculator\",\n  description: \"Perform arithmetic. For round, a is the value and b is the decimal places.\",\n  inputSchema: defineSchema((v) => v.object({\n    operation: v.enum([\"add\", \"subtract\", \"multiply\", \"divide\", \"round\"]),\n    a: v.number(),\n    b: v.number(),\n  }))(),\n  execute: ({ operation, a, b }) => {\n    const precision = Math.min(100, Math.max(0, Math.trunc(b)));\n\n    if (operation === \"divide\" && b === 0) {\n      throw new Error(\"Cannot divide by zero\");\n    }\n\n    if (operation === \"add\") return { result: a + b };\n    if (operation === \"subtract\") return { result: a - b };\n    if (operation === \"multiply\") return { result: a * b };\n    if (operation === \"round\") {\n      const offset = Math.sign(a) * Number.EPSILON * Math.max(1, Math.abs(a));\n      return { result: Number((a + offset).toFixed(precision)) };\n    }\n    return { result: a / b };\n  },\n});\n",
-                "tsconfig.json": "{\n  \"compilerOptions\": {\n    \"target\": \"ES2022\",\n    \"module\": \"ESNext\",\n    \"moduleResolution\": \"bundler\",\n    \"strict\": true,\n    \"jsx\": \"react-jsx\",\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"paths\": {\n      \"@/*\": [\"./*\"]\n    }\n  },\n  \"include\": [\"**/*.ts\", \"**/*.tsx\"],\n  \"exclude\": [\"node_modules\"]\n}\n"
+                "tsconfig.json": "{\n  \"compilerOptions\": {\n    \"target\": \"ES2022\",\n    \"module\": \"ESNext\",\n    \"moduleResolution\": \"bundler\",\n    \"strict\": true,\n    \"jsx\": \"react-jsx\",\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"noEmit\": true,\n    \"allowImportingTsExtensions\": true,\n    \"paths\": {\n      \"@/*\": [\n        \"./*\"\n      ]\n    }\n  },\n  \"include\": [\n    \"**/*.ts\",\n    \"**/*.tsx\"\n  ],\n  \"exclude\": [\n    \"node_modules\"\n  ]\n}\n"
             }
         },
         "coding-agent": {
@@ -39,14 +40,15 @@ export default {
                 "agents/coder.ts": "import { agent } from \"veryfront/agent\";\n\nexport default agent({\n  id: \"coder\",\n  name: \"Code Agent\",\n  description: \"Read, search, and edit project files.\",\n  system: `You are an expert coding assistant. You can read, search, and modify code files in the project.\n\nWhen asked to make changes:\n1. First read the relevant files to understand the codebase\n2. Explain what you'll change and why\n3. Make the changes\n4. Verify the result\n\nAlways explain your reasoning before making edits.`,\n  tools: true,\n  maxSteps: 15,\n  suggestions: [\n    {\n      type: \"prompt\",\n      title: \"Explain the codebase\",\n      prompt: \"Explain how this project is organized.\",\n    },\n    {\n      type: \"prompt\",\n      title: \"Make a change\",\n      prompt: \"Make this code change: \",\n    },\n  ],\n});\n",
                 "app/api/ag-ui/route.ts": "import { createAgUiHandler } from \"veryfront/agent\";\n\nexport const POST = createAgUiHandler(\"coder\");\n",
                 "app/layout.tsx": "import \"../globals.css\";\nimport { Head } from \"veryfront/head\";\n\nexport default function RootLayout({\n  children,\n}: {\n  children: React.ReactNode;\n}): React.ReactNode {\n  return (\n    <>\n      <Head>\n        <title>Code Agent</title>\n        <link rel=\"icon\" href=\"/favicon.svg\" type=\"image/svg+xml\" />\n      </Head>\n      <div className=\"dark\">\n        <div className=\"flex flex-col h-screen bg-neutral-950\">\n          <header className=\"flex-shrink-0 border-b border-neutral-800\">\n            <div className=\"max-w-4xl mx-auto flex items-center gap-3 px-4 py-3\">\n              <div className=\"w-8 h-8 rounded-lg bg-emerald-500/10 flex items-center justify-center\">\n                <svg\n                  className=\"w-4 h-4 text-emerald-400\"\n                  fill=\"none\"\n                  viewBox=\"0 0 24 24\"\n                  stroke=\"currentColor\"\n                  strokeWidth={2}\n                >\n                  <path\n                    strokeLinecap=\"round\"\n                    strokeLinejoin=\"round\"\n                    d=\"M17.25 6.75L22.5 12l-5.25 5.25m-10.5 0L1.5 12l5.25-5.25m7.5-3l-4.5 16.5\"\n                  />\n                </svg>\n              </div>\n              <div>\n                <h1 className=\"font-medium text-white text-sm font-mono\">\n                  code-agent\n                </h1>\n                <p className=\"text-xs text-neutral-500\">\n                  read, search, edit project files\n                </p>\n              </div>\n              <div className=\"ml-auto flex items-center gap-1.5\">\n                <span className=\"w-2 h-2 rounded-full bg-emerald-400 animate-pulse\" />\n                <span className=\"text-xs text-neutral-500 font-mono\">ready</span>\n              </div>\n            </div>\n          </header>\n          {children}\n        </div>\n      </div>\n    </>\n  );\n}\n",
-                "app/page.tsx": "'use client'\n\nimport { Chat } from 'veryfront/chat'\n\nexport default function CodeAgent(): React.JSX.Element {\n  return (\n    <Chat\n      agentId=\"coder\"\n      api=\"/api/ag-ui\"\n      className=\"flex-1 min-h-0\"\n      placeholder=\"Describe what you want to build or fix...\"\n    />\n  )\n}\n",
+                "app/markdown-renderer.tsx": "'use client'\n\nimport ReactMarkdown from 'react-markdown'\nimport remarkGfm from 'remark-gfm'\nimport type { MarkdownRendererProps } from 'veryfront/markdown'\n\n/**\n * Rich Markdown for assistant answers.\n *\n * `veryfront/markdown` presents plain source until a renderer is installed, so\n * this component supplies one. Swap in any renderer that accepts\n * `MarkdownRendererProps` to change how answers are parsed and rendered.\n */\nexport function MarkdownRenderer({ source }: MarkdownRendererProps): React.JSX.Element {\n  return <ReactMarkdown remarkPlugins={[remarkGfm]}>{source}</ReactMarkdown>\n}\n",
+                "app/page.tsx": "'use client'\n\nimport { Chat } from 'veryfront/chat'\nimport { MarkdownRendererProvider } from 'veryfront/markdown'\nimport { MarkdownRenderer } from './markdown-renderer.tsx'\n\nexport default function CodeAgent(): React.JSX.Element {\n  return (\n    <MarkdownRendererProvider renderer={MarkdownRenderer}>\n      <Chat\n        agentId=\"coder\"\n        api=\"/api/ag-ui\"\n        className=\"flex-1 min-h-0\"\n        placeholder=\"Describe what you want to build or fix...\"\n      />\n    </MarkdownRendererProvider>\n  )\n}\n",
                 "globals.css": "@import \"tailwindcss\";\n",
                 "public/favicon.svg": "<svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 64 64\">\n  <rect width=\"64\" height=\"64\" fill=\"#fff\"/>\n  <circle cx=\"32\" cy=\"32\" r=\"20\" fill=\"#000\"/>\n</svg>\n",
                 "README.md": "# Coding Agent\n\nAn AI assistant that can read, understand, and modify project files.\n\n## What's included\n\n- Coder agent with file system tools\n- Read, list, and edit files through conversation\n- Safe search/replace editing pattern\n\n## Structure\n\n```\nagents/coder.ts        Agent with coding instructions\ntools/\n  read-file.ts         Read file contents\n  list-files.ts        List directory contents\n  edit-file.ts         Search and replace in files\napp/\n  api/ag-ui/route.ts    AG-UI endpoint\n  page.tsx             Chat interface\n```\n\nThis starter is not production-ready.\n",
                 "tools/edit-file.ts": "import { tool } from \"veryfront/tool\";\nimport { defineSchema } from \"veryfront/schemas\";\nimport { cwd, readTextFile, realPath, resolve, writeTextFile } from \"veryfront/fs\";\n\n/** True when `target` is the same as, or nested under, `root` (both canonical). */\nfunction isWithin(root: string, target: string): boolean {\n  const r = root.replace(/\\\\/g, \"/\");\n  const t = target.replace(/\\\\/g, \"/\");\n  return t === r || t.startsWith(`${r}/`);\n}\n\nexport default tool({\n  id: \"edit-file\",\n  description: \"Edit a file by replacing a specific string with new content\",\n  inputSchema: defineSchema((v) => v.object({\n    path: v.string().describe(\"File path relative to the project root\"),\n    search: v.string().describe(\"Exact string to find in the file\"),\n    replace: v.string().describe(\"String to replace it with\"),\n  }))(),\n  execute: async ({ path, search, replace }) => {\n    let projectDir: string;\n    let absolute: string;\n    try {\n      // Canonicalize both sides so a symlink that points outside the project\n      // is resolved to its real target before the containment check.\n      projectDir = await realPath(cwd());\n      absolute = await realPath(resolve(projectDir, path));\n    } catch {\n      return { error: `File not found: ${path}` };\n    }\n    if (!isWithin(projectDir, absolute)) {\n      return { error: `Path escapes project directory: ${path}` };\n    }\n\n    const content = await readTextFile(absolute);\n    if (!content.includes(search)) {\n      return { error: \"Search string not found in file\" };\n    }\n\n    const updated = content.replace(search, replace);\n    await writeTextFile(absolute, updated);\n    return { path, success: true };\n  },\n});\n",
                 "tools/list-files.ts": "import { tool } from \"veryfront/tool\";\nimport { defineSchema } from \"veryfront/schemas\";\nimport { cwd, readDir, realPath, resolve } from \"veryfront/fs\";\n\n/** True when `target` is the same as, or nested under, `root` (both canonical). */\nfunction isWithin(root: string, target: string): boolean {\n  const r = root.replace(/\\\\/g, \"/\");\n  const t = target.replace(/\\\\/g, \"/\");\n  return t === r || t.startsWith(`${r}/`);\n}\n\nexport default tool({\n  id: \"list-files\",\n  description: \"List files in a project directory\",\n  inputSchema: defineSchema((v) => v.object({\n    directory: v\n      .string()\n      .default(\".\")\n      .describe(\"Directory path relative to project root\"),\n    extensions: v\n      .array(v.string())\n      .optional()\n      .describe(\"Filter by file extensions (e.g. ['.ts', '.tsx'])\"),\n  }))(),\n  execute: async ({ directory, extensions }) => {\n    let projectDir: string;\n    let absolute: string;\n    try {\n      // Canonicalize both sides so a symlink that points outside the project\n      // is resolved to its real target before the containment check.\n      projectDir = await realPath(cwd());\n      absolute = await realPath(resolve(projectDir, directory));\n    } catch {\n      return { error: `Directory not found: ${directory}` };\n    }\n    if (!isWithin(projectDir, absolute)) {\n      return { error: `Path escapes project directory: ${directory}` };\n    }\n\n    const entries = await readDir(absolute);\n\n    let files = entries\n      .filter((e) => e.isFile)\n      .map((e) => e.name);\n\n    if (extensions?.length) {\n      files = files.filter((f) =>\n        extensions.some((ext) => f.endsWith(ext))\n      );\n    }\n\n    return { directory, files, count: files.length };\n  },\n});\n",
                 "tools/read-file.ts": "import { tool } from \"veryfront/tool\";\nimport { defineSchema } from \"veryfront/schemas\";\nimport { cwd, readTextFile, realPath, resolve } from \"veryfront/fs\";\n\n/** True when `target` is the same as, or nested under, `root` (both canonical). */\nfunction isWithin(root: string, target: string): boolean {\n  const r = root.replace(/\\\\/g, \"/\");\n  const t = target.replace(/\\\\/g, \"/\");\n  return t === r || t.startsWith(`${r}/`);\n}\n\nexport default tool({\n  id: \"read-file\",\n  description: \"Read the contents of a file in the project\",\n  inputSchema: defineSchema((v) => v.object({\n    path: v.string().describe(\"File path relative to the project root\"),\n  }))(),\n  execute: async ({ path }) => {\n    let projectDir: string;\n    let absolute: string;\n    try {\n      // Canonicalize both sides so a symlink that points outside the project\n      // is resolved to its real target before the containment check.\n      projectDir = await realPath(cwd());\n      absolute = await realPath(resolve(projectDir, path));\n    } catch {\n      return { error: `File not found: ${path}` };\n    }\n    if (!isWithin(projectDir, absolute)) {\n      return { error: `Path escapes project directory: ${path}` };\n    }\n    const content = await readTextFile(absolute);\n    return { path, content };\n  },\n});\n",
-                "tsconfig.json": "{\n  \"compilerOptions\": {\n    \"target\": \"ES2022\",\n    \"module\": \"ESNext\",\n    \"moduleResolution\": \"bundler\",\n    \"strict\": true,\n    \"jsx\": \"react-jsx\",\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"paths\": {\n      \"@/*\": [\"./*\"]\n    }\n  },\n  \"include\": [\"**/*.ts\", \"**/*.tsx\"],\n  \"exclude\": [\"node_modules\"]\n}\n"
+                "tsconfig.json": "{\n  \"compilerOptions\": {\n    \"target\": \"ES2022\",\n    \"module\": \"ESNext\",\n    \"moduleResolution\": \"bundler\",\n    \"strict\": true,\n    \"jsx\": \"react-jsx\",\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"noEmit\": true,\n    \"allowImportingTsExtensions\": true,\n    \"paths\": {\n      \"@/*\": [\n        \"./*\"\n      ]\n    }\n  },\n  \"include\": [\n    \"**/*.ts\",\n    \"**/*.tsx\"\n  ],\n  \"exclude\": [\n    \"node_modules\"\n  ]\n}\n"
             }
         },
         "docs-agent": {
@@ -56,7 +58,8 @@ export default {
                 "app/api/ingest/route.ts": "import { store } from \"../../../store.ts\";\n\nexport async function POST() {\n  await store.indexContentDir();\n  return Response.json({ ok: true });\n}\n",
                 "app/api/uploads/route.ts": "import { createUploadHandler } from \"veryfront/embedding\";\nimport { store } from \"../../../store.ts\";\n\nexport const { POST, GET, DELETE } = createUploadHandler(store, {\n  auth: { type: \"none\", allowUnauthenticated: true },\n});\n",
                 "app/layout.tsx": "'use client'\n\nimport \"../globals.css\";\nimport {\n  AppShell,\n  ChatSidebar,\n  ChatThemeScope,\n  ConversationsProvider,\n  Tabs,\n  TabsItem,\n} from \"veryfront/chat\";\nimport { Head } from \"veryfront/head\";\nimport { useRouter } from \"veryfront/router\";\n\nexport default function RootLayout({ children }: { children: React.ReactNode }): React.ReactNode {\n  const router = useRouter();\n  const activeTab = router.pathname.startsWith(\"/uploads\") ? \"uploads\" : \"chat\";\n\n  return (\n    <>\n      <Head>\n        <title>Docs Agent</title>\n        <link rel=\"icon\" href=\"/favicon.svg\" type=\"image/svg+xml\" />\n      </Head>\n      <ChatThemeScope className=\"flex flex-col h-screen\">\n        <ConversationsProvider storageKey=\"rag-conversations\">\n          <AppShell className=\"flex-1 min-h-0\">\n            <AppShell.Sidebar side=\"left\" className=\"border-r border-[var(--outline-border)]\">\n              <AppShell.SidebarContent className=\"p-0\">\n                <ChatSidebar.Root>\n                  <ChatSidebar.NewButton />\n                  <ChatSidebar.List />\n                </ChatSidebar.Root>\n              </AppShell.SidebarContent>\n            </AppShell.Sidebar>\n            <AppShell.Main>\n              <AppShell.Header border className=\"h-16 gap-3 px-3\">\n                <AppShell.Trigger side=\"left\" />\n                <div className=\"flex flex-1 justify-center\">\n                  <Tabs\n                    value={activeTab}\n                    onValueChange={(value: string) =>\n                      router.push(value === \"uploads\" ? \"/uploads\" : \"/\")}\n                  >\n                    <TabsItem value=\"chat\">Chat</TabsItem>\n                    <TabsItem value=\"uploads\">Uploads</TabsItem>\n                  </Tabs>\n                </div>\n              </AppShell.Header>\n              <AppShell.Content className=\"flex flex-col min-h-0 pt-3\">\n                {children}\n              </AppShell.Content>\n            </AppShell.Main>\n          </AppShell>\n        </ConversationsProvider>\n      </ChatThemeScope>\n    </>\n  );\n}\n",
-                "app/page.tsx": "'use client'\n\nimport { Chat } from 'veryfront/chat'\n\nexport default function DocsChat() {\n  return (\n    <Chat\n      agentId=\"rag\"\n      api=\"/api/ag-ui\"\n      className=\"flex-1 min-h-0\"\n      placeholder=\"Ask anything about your documents...\"\n    />\n  )\n}\n",
+                "app/markdown-renderer.tsx": "'use client'\n\nimport ReactMarkdown from 'react-markdown'\nimport remarkGfm from 'remark-gfm'\nimport type { MarkdownRendererProps } from 'veryfront/markdown'\n\n/**\n * Rich Markdown for assistant answers.\n *\n * `veryfront/markdown` presents plain source until a renderer is installed, so\n * this component supplies one. Swap in any renderer that accepts\n * `MarkdownRendererProps` to change how answers are parsed and rendered.\n */\nexport function MarkdownRenderer({ source }: MarkdownRendererProps): React.JSX.Element {\n  return <ReactMarkdown remarkPlugins={[remarkGfm]}>{source}</ReactMarkdown>\n}\n",
+                "app/page.tsx": "'use client'\n\nimport { Chat } from 'veryfront/chat'\nimport { MarkdownRendererProvider } from 'veryfront/markdown'\nimport { MarkdownRenderer } from './markdown-renderer.tsx'\n\nexport default function DocsChat(): React.JSX.Element {\n  return (\n    <MarkdownRendererProvider renderer={MarkdownRenderer}>\n      <Chat\n        agentId=\"rag\"\n        api=\"/api/ag-ui\"\n        className=\"flex-1 min-h-0\"\n        placeholder=\"Ask anything about your documents...\"\n      />\n    </MarkdownRendererProvider>\n  )\n}\n",
                 "app/uploads/page.tsx": "'use client'\n\nimport { AttachmentsPanel, useUploadsRegistry } from 'veryfront/chat'\n\nconst UPLOAD_API = '/api/uploads'\nconst ACCEPT = '.pdf,.doc,.docx,.xls,.xlsx,.ppt,.pptx,.csv,.txt,.md,.mdx,.html,.rtf,.epub,.json,.xml'\n\nexport default function UploadsPage(): React.JSX.Element {\n  const uploads = useUploadsRegistry({ url: UPLOAD_API, storageKey: 'rag-uploads' })\n  const error = uploads.uploadError\n    ?? uploads.refreshError\n    ?? uploads.removeError\n    ?? uploads.storageError\n\n  return (\n    <>\n      {error && (\n        <p role=\"alert\" className=\"m-4 rounded-md bg-red-50 p-3 text-sm text-red-800\">\n          {error.message}\n        </p>\n      )}\n      <AttachmentsPanel\n        uploads={uploads.items}\n        loading={uploads.isLoading}\n        onAttach={uploads.upload}\n        onRemoveUpload={uploads.remove}\n        attachAccept={ACCEPT}\n        className=\"flex-1 min-h-0\"\n      />\n    </>\n  )\n}\n",
                 "content/architecture.md": "# Architecture\n\nAcme Platform uses a modular, event-driven architecture.\n\n## Core Components\n\n### API Gateway\nRoutes incoming requests to the appropriate microservice. Handles authentication, rate limiting, and request validation.\n\n### Event Bus\nAsynchronous message broker connecting all services. Supports pub/sub and point-to-point messaging patterns.\n\n### Data Layer\nMulti-tenant data storage with automatic sharding. Supports PostgreSQL for relational data and Redis for caching.\n\n## Request Flow\n\n1. Client sends request to API Gateway\n2. Gateway validates authentication token\n3. Request is routed to the target service\n4. Service processes request and publishes events\n5. Response is returned through the gateway\n\n## Scaling\n\nEach component scales independently. The API Gateway uses horizontal scaling with load balancing. Services auto-scale based on queue depth and CPU utilization.\n\n## Security\n\n- All inter-service communication uses mTLS\n- API tokens are rotated every 24 hours\n- Data at rest is encrypted with AES-256\n- Audit logs are retained for 90 days\n",
                 "content/getting-started.md": "# Getting Started\n\nWelcome to Acme Platform. This guide covers initial setup and core concepts.\n\n## Installation\n\nInstall the CLI globally:\n\n```bash\nnpm install -g @acme/cli\n```\n\n## Creating a Project\n\nRun the init command to scaffold a new project:\n\n```bash\nacme init my-project\ncd my-project\n```\n\n## Project Structure\n\n- `src/`: Application source code\n- `config/`: Configuration files\n- `tests/`: Test suite\n- `docs/`: Documentation\n\n## Configuration\n\nCreate an `acme.config.ts` file in your project root:\n\n```ts\nexport default {\n  name: \"my-project\",\n  region: \"us-east-1\",\n  features: [\"auth\", \"storage\"],\n};\n```\n\n## Next Steps\n\n- Read the [Architecture Guide](./architecture) to understand the system design\n- Check [API Reference](./api-reference) for available endpoints\n- Join our Discord community for support\n",
@@ -84,27 +87,29 @@ export default {
                 "agents/writer.ts": "import { agent } from \"veryfront/agent\";\n\nexport default agent({\n  id: \"writer\",\n  system:\n    \"You are a writing specialist. \" +\n    \"Take research notes and transform them into clear, engaging prose. \" +\n    \"Use a professional but approachable tone.\",\n  maxSteps: 3,\n});\n",
                 "app/api/ag-ui/route.ts": "import { createAgUiHandler } from \"veryfront/agent\";\n\nexport const POST = createAgUiHandler(\"orchestrator\");\n",
                 "app/layout.tsx": "import \"../globals.css\";\nimport { Head } from \"veryfront/head\";\n\nexport default function RootLayout({\n  children,\n}: {\n  children: React.ReactNode;\n}): React.ReactNode {\n  return (\n    <>\n      <Head>\n        <title>Multi-Agent System</title>\n        <link rel=\"icon\" href=\"/favicon.svg\" type=\"image/svg+xml\" />\n      </Head>\n      <div className=\"flex flex-col h-screen bg-white dark:bg-neutral-950\">\n        <header className=\"flex-shrink-0 border-b border-neutral-200 dark:border-neutral-800\">\n          <div className=\"max-w-3xl mx-auto flex items-center gap-3 px-4 py-3\">\n            <div className=\"flex -space-x-2\">\n              <div className=\"w-7 h-7 rounded-full bg-blue-500 ring-2 ring-white dark:ring-neutral-950 flex items-center justify-center text-[10px] font-bold text-white\">\n                O\n              </div>\n              <div className=\"w-7 h-7 rounded-full bg-amber-500 ring-2 ring-white dark:ring-neutral-950 flex items-center justify-center text-[10px] font-bold text-white\">\n                R\n              </div>\n              <div className=\"w-7 h-7 rounded-full bg-violet-500 ring-2 ring-white dark:ring-neutral-950 flex items-center justify-center text-[10px] font-bold text-white\">\n                W\n              </div>\n            </div>\n            <div>\n              <h1 className=\"font-medium text-neutral-900 dark:text-white text-sm\">\n                Agent Team\n              </h1>\n              <p className=\"text-xs text-neutral-500 dark:text-neutral-400\">\n                Orchestrator, Researcher, Writer\n              </p>\n            </div>\n          </div>\n        </header>\n        {children}\n      </div>\n    </>\n  );\n}\n",
-                "app/page.tsx": "'use client'\n\nimport { Chat } from 'veryfront/chat'\n\nexport default function MultiAgentChat(): React.JSX.Element {\n  return (\n    <Chat\n      agentId=\"orchestrator\"\n      api=\"/api/ag-ui\"\n      className=\"flex-1 min-h-0\"\n      placeholder=\"Give the team a task...\"\n    />\n  )\n}\n",
+                "app/markdown-renderer.tsx": "'use client'\n\nimport ReactMarkdown from 'react-markdown'\nimport remarkGfm from 'remark-gfm'\nimport type { MarkdownRendererProps } from 'veryfront/markdown'\n\n/**\n * Rich Markdown for assistant answers.\n *\n * `veryfront/markdown` presents plain source until a renderer is installed, so\n * this component supplies one. Swap in any renderer that accepts\n * `MarkdownRendererProps` to change how answers are parsed and rendered.\n */\nexport function MarkdownRenderer({ source }: MarkdownRendererProps): React.JSX.Element {\n  return <ReactMarkdown remarkPlugins={[remarkGfm]}>{source}</ReactMarkdown>\n}\n",
+                "app/page.tsx": "'use client'\n\nimport { Chat } from 'veryfront/chat'\nimport { MarkdownRendererProvider } from 'veryfront/markdown'\nimport { MarkdownRenderer } from './markdown-renderer.tsx'\n\nexport default function MultiAgentChat(): React.JSX.Element {\n  return (\n    <MarkdownRendererProvider renderer={MarkdownRenderer}>\n      <Chat\n        agentId=\"orchestrator\"\n        api=\"/api/ag-ui\"\n        className=\"flex-1 min-h-0\"\n        placeholder=\"Give the team a task...\"\n      />\n    </MarkdownRendererProvider>\n  )\n}\n",
                 "globals.css": "@import \"tailwindcss\";\n",
                 "public/favicon.svg": "<svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 64 64\">\n  <rect width=\"64\" height=\"64\" fill=\"#fff\"/>\n  <circle cx=\"32\" cy=\"32\" r=\"20\" fill=\"#000\"/>\n</svg>\n",
                 "README.md": "# Multi-Agent System\n\nA team of specialized agents that collaborate on tasks.\n\n## What's included\n\n- Orchestrator that delegates to researcher and writer agents\n- Agent-as-tool composition via `getAgentsAsTools()`\n- Web search tool (placeholder, configure your own API)\n\n## Structure\n\n```\nagents/\n  orchestrator.ts      Coordinates the team\n  researcher.ts        Gathers information\n  writer.ts            Produces polished content\ntools/web-search.ts    Placeholder search tool\napp/\n  api/ag-ui/route.ts    AG-UI endpoint\n  page.tsx             Chat interface\n```\n\nThis starter is not production-ready.\n",
                 "tools/web-search.ts": "import { tool } from \"veryfront/tool\";\nimport { defineSchema } from \"veryfront/schemas\";\n\nexport default tool({\n  id: \"web-search\",\n  description: \"Search the web for information on a topic\",\n  inputSchema: defineSchema((v) => v.object({\n    query: v.string().describe(\"Search query\"),\n  }))(),\n  execute: async ({ query: _query }) => {\n    // Connect a real search API to use this tool.\n    // Popular options: Tavily, SerpAPI, Brave Search\n    throw new Error(\n      \"No search API configured. \" +\n        \"See https://veryfront.com/docs/code/guides/tools for setup instructions.\",\n    );\n  },\n});\n",
-                "tsconfig.json": "{\n  \"compilerOptions\": {\n    \"target\": \"ES2022\",\n    \"module\": \"ESNext\",\n    \"moduleResolution\": \"bundler\",\n    \"strict\": true,\n    \"jsx\": \"react-jsx\",\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"paths\": {\n      \"@/*\": [\"./*\"]\n    }\n  },\n  \"include\": [\"**/*.ts\", \"**/*.tsx\"],\n  \"exclude\": [\"node_modules\"]\n}\n"
+                "tsconfig.json": "{\n  \"compilerOptions\": {\n    \"target\": \"ES2022\",\n    \"module\": \"ESNext\",\n    \"moduleResolution\": \"bundler\",\n    \"strict\": true,\n    \"jsx\": \"react-jsx\",\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"noEmit\": true,\n    \"allowImportingTsExtensions\": true,\n    \"paths\": {\n      \"@/*\": [\n        \"./*\"\n      ]\n    }\n  },\n  \"include\": [\n    \"**/*.ts\",\n    \"**/*.tsx\"\n  ],\n  \"exclude\": [\n    \"node_modules\"\n  ]\n}\n"
             }
         },
         "saas-starter": {
             "files": {
                 "agents/assistant.ts": "import { agent } from \"veryfront/agent\";\n\nexport default agent({\n  id: \"assistant\",\n  name: \"SaaS Assistant\",\n  description: \"Answer product and customer questions.\",\n  system: \"You are a helpful AI assistant. Be concise and direct.\",\n  tools: true,\n  memory: { type: \"conversation\", maxMessages: 50 },\n  maxSteps: 10,\n  suggestions: [\n    {\n      type: \"prompt\",\n      title: \"Summarize account\",\n      prompt: \"Summarize the latest account activity.\",\n    },\n    {\n      type: \"prompt\",\n      title: \"Find customers\",\n      prompt: \"Find customers who need attention.\",\n    },\n  ],\n});\n",
                 "app/api/ag-ui/route.ts": "import { createAgUiHandler } from \"veryfront/agent\";\n\nexport const POST = createAgUiHandler(\"assistant\");\n",
-                "app/dashboard/page.tsx": "\"use client\";\n\nimport { useState } from \"react\";\nimport { Chat } from \"veryfront/chat\";\n\ninterface Conversation {\n  id: string;\n  title: string;\n  updatedAt: string;\n}\n\nconst INITIAL_CONVERSATIONS: Conversation[] = [\n  { id: \"1\", title: \"Getting started\", updatedAt: \"Just now\" },\n];\n\nexport default function Dashboard(): React.JSX.Element {\n  const [conversations] = useState<Conversation[]>(INITIAL_CONVERSATIONS);\n  const [activeId, setActiveId] = useState(\"1\");\n\n  return (\n    <div className=\"flex h-screen bg-white dark:bg-neutral-950\">\n      {/* Sidebar */}\n      <aside className=\"w-64 border-r border-neutral-200 dark:border-neutral-800 flex flex-col bg-neutral-50 dark:bg-neutral-900\">\n        <div className=\"p-4 border-b border-neutral-200 dark:border-neutral-800\">\n          <button className=\"w-full flex items-center gap-2 px-3 py-2 text-sm font-medium text-neutral-700 dark:text-neutral-300 bg-white dark:bg-neutral-800 border border-neutral-200 dark:border-neutral-700 rounded-lg hover:bg-neutral-50 dark:hover:bg-neutral-700 transition-colors\">\n            <svg\n              className=\"w-4 h-4\"\n              fill=\"none\"\n              viewBox=\"0 0 24 24\"\n              stroke=\"currentColor\"\n              strokeWidth={2}\n            >\n              <path\n                strokeLinecap=\"round\"\n                strokeLinejoin=\"round\"\n                d=\"M12 4.5v15m7.5-7.5h-15\"\n              />\n            </svg>\n            New chat\n          </button>\n        </div>\n\n        <nav className=\"flex-1 overflow-y-auto p-2 space-y-0.5\">\n          {conversations.map((conv) => (\n            <button\n              key={conv.id}\n              onClick={() => setActiveId(conv.id)}\n              className={`w-full text-left px-3 py-2 rounded-lg text-sm transition-colors ${\n                activeId === conv.id\n                  ? \"bg-neutral-200 dark:bg-neutral-800 text-neutral-900 dark:text-white\"\n                  : \"text-neutral-600 dark:text-neutral-400 hover:bg-neutral-100 dark:hover:bg-neutral-800/50\"\n              }`}\n            >\n              <p className=\"truncate\">{conv.title}</p>\n              <p className=\"text-xs text-neutral-400 mt-0.5\">\n                {conv.updatedAt}\n              </p>\n            </button>\n          ))}\n        </nav>\n\n        <div className=\"p-4 border-t border-neutral-200 dark:border-neutral-800\">\n          <div className=\"flex items-center gap-2\">\n            <div className=\"w-8 h-8 rounded-full bg-neutral-200 dark:bg-neutral-700 flex items-center justify-center text-xs font-medium text-neutral-600 dark:text-neutral-300\">\n              U\n            </div>\n            <div className=\"flex-1 min-w-0\">\n              <p className=\"text-sm font-medium text-neutral-900 dark:text-white truncate\">\n                User\n              </p>\n              <p className=\"text-xs text-neutral-500 truncate\">\n                user@example.com\n              </p>\n            </div>\n          </div>\n        </div>\n      </aside>\n\n      {/* Chat */}\n      <main className=\"flex-1 flex flex-col\">\n        <Chat\n          agentId=\"assistant\"\n          api=\"/api/ag-ui\"\n          className=\"flex-1 min-h-0\"\n          placeholder=\"Message...\"\n        />\n      </main>\n    </div>\n  );\n}\n",
+                "app/dashboard/page.tsx": "\"use client\";\n\nimport { useState } from \"react\";\nimport { Chat } from \"veryfront/chat\";\nimport { MarkdownRendererProvider } from \"veryfront/markdown\";\nimport { MarkdownRenderer } from \"../markdown-renderer.tsx\";\n\ninterface Conversation {\n  id: string;\n  title: string;\n  updatedAt: string;\n}\n\nconst INITIAL_CONVERSATIONS: Conversation[] = [\n  { id: \"1\", title: \"Getting started\", updatedAt: \"Just now\" },\n];\n\nexport default function Dashboard(): React.JSX.Element {\n  const [conversations] = useState<Conversation[]>(INITIAL_CONVERSATIONS);\n  const [activeId, setActiveId] = useState(\"1\");\n\n  return (\n    <div className=\"flex h-screen bg-white dark:bg-neutral-950\">\n      {/* Sidebar */}\n      <aside className=\"w-64 border-r border-neutral-200 dark:border-neutral-800 flex flex-col bg-neutral-50 dark:bg-neutral-900\">\n        <div className=\"p-4 border-b border-neutral-200 dark:border-neutral-800\">\n          <button className=\"w-full flex items-center gap-2 px-3 py-2 text-sm font-medium text-neutral-700 dark:text-neutral-300 bg-white dark:bg-neutral-800 border border-neutral-200 dark:border-neutral-700 rounded-lg hover:bg-neutral-50 dark:hover:bg-neutral-700 transition-colors\">\n            <svg\n              className=\"w-4 h-4\"\n              fill=\"none\"\n              viewBox=\"0 0 24 24\"\n              stroke=\"currentColor\"\n              strokeWidth={2}\n            >\n              <path\n                strokeLinecap=\"round\"\n                strokeLinejoin=\"round\"\n                d=\"M12 4.5v15m7.5-7.5h-15\"\n              />\n            </svg>\n            New chat\n          </button>\n        </div>\n\n        <nav className=\"flex-1 overflow-y-auto p-2 space-y-0.5\">\n          {conversations.map((conv) => (\n            <button\n              key={conv.id}\n              onClick={() => setActiveId(conv.id)}\n              className={`w-full text-left px-3 py-2 rounded-lg text-sm transition-colors ${\n                activeId === conv.id\n                  ? \"bg-neutral-200 dark:bg-neutral-800 text-neutral-900 dark:text-white\"\n                  : \"text-neutral-600 dark:text-neutral-400 hover:bg-neutral-100 dark:hover:bg-neutral-800/50\"\n              }`}\n            >\n              <p className=\"truncate\">{conv.title}</p>\n              <p className=\"text-xs text-neutral-400 mt-0.5\">\n                {conv.updatedAt}\n              </p>\n            </button>\n          ))}\n        </nav>\n\n        <div className=\"p-4 border-t border-neutral-200 dark:border-neutral-800\">\n          <div className=\"flex items-center gap-2\">\n            <div className=\"w-8 h-8 rounded-full bg-neutral-200 dark:bg-neutral-700 flex items-center justify-center text-xs font-medium text-neutral-600 dark:text-neutral-300\">\n              U\n            </div>\n            <div className=\"flex-1 min-w-0\">\n              <p className=\"text-sm font-medium text-neutral-900 dark:text-white truncate\">\n                User\n              </p>\n              <p className=\"text-xs text-neutral-500 truncate\">\n                user@example.com\n              </p>\n            </div>\n          </div>\n        </div>\n      </aside>\n\n      {/* Chat */}\n      <main className=\"flex-1 flex flex-col\">\n        <MarkdownRendererProvider renderer={MarkdownRenderer}>\n          <Chat\n            agentId=\"assistant\"\n            api=\"/api/ag-ui\"\n            className=\"flex-1 min-h-0\"\n            placeholder=\"Message...\"\n          />\n        </MarkdownRendererProvider>\n      </main>\n    </div>\n  );\n}\n",
                 "app/layout.tsx": "import \"../globals.css\";\nimport { Head } from \"veryfront/head\";\n\nexport default function RootLayout({\n  children,\n}: {\n  children: React.ReactNode;\n}): React.ReactNode {\n  return (\n    <>\n      <Head>\n        <title>AI SaaS</title>\n        <link rel=\"icon\" href=\"/favicon.svg\" type=\"image/svg+xml\" />\n      </Head>\n      <div className=\"antialiased\">\n        {children}\n      </div>\n    </>\n  );\n}\n",
                 "app/login/page.tsx": "\"use client\";\n\n// Demo sign-in: the buttons below pass straight through to /dashboard so the\n// starter is usable out of the box. To wire up real OAuth, scaffold provider\n// routes at app/api/auth/google/route.ts and app/api/auth/github/route.ts and\n// point the hrefs there. See https://veryfront.com/docs/code/guides/oauth.\nexport default function LoginPage(): React.JSX.Element {\n  return (\n    <div className=\"min-h-screen flex items-center justify-center bg-neutral-50 dark:bg-neutral-950 px-4\">\n      <div className=\"w-full max-w-sm\">\n        <div className=\"text-center mb-8\">\n          <h1 className=\"text-xl font-bold text-neutral-900 dark:text-white\">\n            Welcome back\n          </h1>\n          <p className=\"text-sm text-neutral-500 dark:text-neutral-400 mt-1\">\n            Sign in to continue\n          </p>\n        </div>\n\n        <div className=\"bg-white dark:bg-neutral-900 rounded-2xl border border-neutral-200 dark:border-neutral-800 p-6 space-y-3\">\n          <a\n            href=\"/dashboard\"\n            className=\"flex items-center justify-center gap-2 w-full px-4 py-2.5 border border-neutral-200 dark:border-neutral-800 rounded-xl text-sm font-medium text-neutral-700 dark:text-neutral-300 hover:bg-neutral-50 dark:hover:bg-neutral-800 transition-colors\"\n          >\n            <svg className=\"w-4 h-4\" viewBox=\"0 0 24 24\">\n              <path\n                fill=\"#4285F4\"\n                d=\"M22.56 12.25c0-.78-.07-1.53-.2-2.25H12v4.26h5.92a5.06 5.06 0 01-2.2 3.32v2.76h3.57c2.08-1.92 3.28-4.74 3.28-8.09z\"\n              />\n              <path\n                fill=\"#34A853\"\n                d=\"M12 23c2.97 0 5.46-.98 7.28-2.66l-3.57-2.77c-.98.66-2.23 1.06-3.71 1.06-2.86 0-5.29-1.93-6.16-4.53H2.18v2.84C3.99 20.53 7.7 23 12 23z\"\n              />\n              <path\n                fill=\"#FBBC05\"\n                d=\"M5.84 14.09a7.12 7.12 0 010-4.18V7.07H2.18A11.99 11.99 0 001 12c0 1.94.46 3.77 1.18 5.43l3.66-3.34z\"\n              />\n              <path\n                fill=\"#EA4335\"\n                d=\"M12 5.38c1.62 0 3.06.56 4.21 1.64l3.15-3.15C17.45 2.09 14.97 1 12 1 7.7 1 3.99 3.47 2.18 7.07l3.66 2.84c.87-2.6 3.3-4.53 6.16-4.53z\"\n              />\n            </svg>\n            Continue with Google\n          </a>\n          <a\n            href=\"/dashboard\"\n            className=\"flex items-center justify-center gap-2 w-full px-4 py-2.5 border border-neutral-200 dark:border-neutral-800 rounded-xl text-sm font-medium text-neutral-700 dark:text-neutral-300 hover:bg-neutral-50 dark:hover:bg-neutral-800 transition-colors\"\n          >\n            <svg className=\"w-4 h-4\" fill=\"currentColor\" viewBox=\"0 0 24 24\">\n              <path d=\"M12 0c-6.626 0-12 5.373-12 12 0 5.302 3.438 9.8 8.207 11.387.599.111.793-.261.793-.577v-2.234c-3.338.726-4.033-1.416-4.033-1.416-.546-1.387-1.333-1.756-1.333-1.756-1.089-.745.083-.729.083-.729 1.205.084 1.839 1.237 1.839 1.237 1.07 1.834 2.807 1.304 3.492.997.107-.775.418-1.305.762-1.604-2.665-.305-5.467-1.334-5.467-5.931 0-1.311.469-2.381 1.236-3.221-.124-.303-.535-1.524.117-3.176 0 0 1.008-.322 3.301 1.23A11.51 11.51 0 0112 5.803c1.02.005 2.047.138 3.006.404 2.291-1.552 3.297-1.23 3.297-1.23.653 1.653.242 2.874.118 3.176.77.84 1.235 1.911 1.235 3.221 0 4.609-2.807 5.624-5.479 5.921.43.372.823 1.102.823 2.222v3.293c0 .319.192.694.801.576C20.566 21.797 24 17.3 24 12c0-6.627-5.373-12-12-12z\" />\n            </svg>\n            Continue with GitHub\n          </a>\n        </div>\n\n        <p className=\"mt-6 text-center text-xs text-neutral-400\">\n          <a\n            href=\"/\"\n            className=\"hover:text-neutral-600 dark:hover:text-neutral-300\"\n          >\n            &larr; Back to home\n          </a>\n        </p>\n      </div>\n    </div>\n  );\n}\n",
+                "app/markdown-renderer.tsx": "\"use client\";\n\nimport ReactMarkdown from \"react-markdown\";\nimport remarkGfm from \"remark-gfm\";\nimport type { MarkdownRendererProps } from \"veryfront/markdown\";\n\n/**\n * Rich Markdown for assistant answers.\n *\n * `veryfront/markdown` presents plain source until a renderer is installed, so\n * this component supplies one. Swap in any renderer that accepts\n * `MarkdownRendererProps` to change how answers are parsed and rendered.\n */\nexport function MarkdownRenderer({ source }: MarkdownRendererProps): React.JSX.Element {\n  return <ReactMarkdown remarkPlugins={[remarkGfm]}>{source}</ReactMarkdown>;\n}\n",
                 "app/page.tsx": "export default function LandingPage(): React.JSX.Element {\n  return (\n    <div className=\"min-h-screen bg-white dark:bg-neutral-950\">\n      {/* Nav */}\n      <nav className=\"border-b border-neutral-100 dark:border-neutral-900\">\n        <div className=\"max-w-5xl mx-auto flex items-center justify-between px-6 h-14\">\n          <span className=\"font-semibold text-neutral-900 dark:text-white\">\n            AI SaaS\n          </span>\n          <div className=\"flex items-center gap-4\">\n            <a\n              href=\"/login\"\n              className=\"text-sm text-neutral-600 dark:text-neutral-400 hover:text-neutral-900 dark:hover:text-white transition-colors\"\n            >\n              Sign in\n            </a>\n            <a\n              href=\"/login\"\n              className=\"text-sm px-4 py-1.5 bg-neutral-900 dark:bg-white text-white dark:text-neutral-900 rounded-full font-medium hover:opacity-90 transition-opacity\"\n            >\n              Get started\n            </a>\n          </div>\n        </div>\n      </nav>\n\n      {/* Hero */}\n      <main className=\"max-w-5xl mx-auto px-6\">\n        <div className=\"pt-24 pb-16 text-center\">\n          <h1 className=\"text-4xl md:text-5xl font-bold tracking-tight text-neutral-900 dark:text-white\">\n            Your AI-powered platform\n          </h1>\n          <p className=\"mt-4 text-lg text-neutral-500 dark:text-neutral-400 max-w-lg mx-auto\">\n            Built with Veryfront. Agents, tools, and memory are ready for production.\n          </p>\n          <div className=\"mt-8 flex gap-3 justify-center\">\n            <a\n              href=\"/login\"\n              className=\"px-6 py-2.5 bg-neutral-900 dark:bg-white text-white dark:text-neutral-900 rounded-full font-medium hover:opacity-90 transition-opacity\"\n            >\n              Start free\n            </a>\n            <a\n              href=\"https://veryfront.com/docs/code/guides\"\n              className=\"px-6 py-2.5 border border-neutral-200 dark:border-neutral-800 text-neutral-700 dark:text-neutral-300 rounded-full font-medium hover:bg-neutral-50 dark:hover:bg-neutral-900 transition-colors\"\n            >\n              Documentation\n            </a>\n          </div>\n        </div>\n\n        {/* Features */}\n        <div className=\"grid grid-cols-1 md:grid-cols-3 gap-6 py-16 border-t border-neutral-100 dark:border-neutral-900\">\n          {[\n            {\n              title: \"AI Agents\",\n              desc:\n                \"Define agents with tools, memory, and streaming. Veryfront auto-discovers them from your project.\",\n            },\n            {\n              title: \"Per-User Memory\",\n              desc: \"Each user gets their own conversation history, persisted across sessions.\",\n            },\n            {\n              title: \"Production Ready\",\n              desc:\n                \"Use auth, rate limiting, and deployment to ship to production with one command.\",\n            },\n          ].map(({ title, desc }) => (\n            <div key={title}>\n              <h3 className=\"font-medium text-neutral-900 dark:text-white\">\n                {title}\n              </h3>\n              <p className=\"mt-1 text-sm text-neutral-500 dark:text-neutral-400\">\n                {desc}\n              </p>\n            </div>\n          ))}\n        </div>\n      </main>\n    </div>\n  );\n}\n",
                 "globals.css": "@import \"tailwindcss\";\n",
                 "public/favicon.svg": "<svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 64 64\">\n  <rect width=\"64\" height=\"64\" fill=\"#fff\"/>\n  <circle cx=\"32\" cy=\"32\" r=\"20\" fill=\"#000\"/>\n</svg>\n",
                 "README.md": "# SaaS Starter\n\nA SaaS-shaped starter with authentication, conversation memory, and a full UI.\n\n## What's included\n\n- Landing page with feature highlights\n- OAuth login (Google and GitHub)\n- Dashboard with conversation sidebar\n- Per-user conversation memory persisted across sessions\n\n## Structure\n\n```\nagents/assistant.ts        Agent with conversation memory\ntools/search.ts            Placeholder domain search\napp/\n  api/ag-ui/route.ts        AG-UI endpoint\n  page.tsx                 Landing page\n  login/page.tsx           OAuth login\n  dashboard/page.tsx       Chat with sidebar\n```\n\nThis starter is not production-ready.\n",
                 "tools/search.ts": "import { tool } from \"veryfront/tool\";\nimport { defineSchema } from \"veryfront/schemas\";\n\nexport default tool({\n  id: \"search\",\n  description: \"Search your knowledge base\",\n  inputSchema: defineSchema((v) =>\n    v.object({\n      query: v.string().describe(\"Search query\"),\n    })\n  )(),\n  execute: async ({ query }) => {\n    // Replace with your domain-specific search logic\n    return {\n      results: [],\n      query,\n      message: \"Connect your data source for real results.\",\n    };\n  },\n});\n",
-                "tsconfig.json": "{\n  \"compilerOptions\": {\n    \"target\": \"ES2022\",\n    \"module\": \"ESNext\",\n    \"moduleResolution\": \"bundler\",\n    \"strict\": true,\n    \"jsx\": \"react-jsx\",\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"paths\": {\n      \"@/*\": [\"./*\"]\n    }\n  },\n  \"include\": [\"**/*.ts\", \"**/*.tsx\"],\n  \"exclude\": [\"node_modules\"]\n}\n"
+                "tsconfig.json": "{\n  \"compilerOptions\": {\n    \"target\": \"ES2022\",\n    \"module\": \"ESNext\",\n    \"moduleResolution\": \"bundler\",\n    \"strict\": true,\n    \"jsx\": \"react-jsx\",\n    \"skipLibCheck\": true,\n    \"esModuleInterop\": true,\n    \"noEmit\": true,\n    \"allowImportingTsExtensions\": true,\n    \"paths\": {\n      \"@/*\": [\n        \"./*\"\n      ]\n    }\n  },\n  \"include\": [\n    \"**/*.ts\",\n    \"**/*.tsx\"\n  ],\n  \"exclude\": [\n    \"node_modules\"\n  ]\n}\n"
             }
         },
         "integration:_base": {

package/esm/deno.js

@@ -1,6 +1,6 @@
 export default {
     "name": "veryfront",
-    "version": "0.1.1195",
+    "version": "0.1.1197",
     "license": "Apache-2.0",
     "nodeModulesDir": "auto",
     "minimumDependencyAge": {
@@ -453,7 +453,7 @@ export default {
         "generate": "deno run -A scripts/build/generate-templates-manifest.ts && deno task generate:dev-ui && deno run -A scripts/build/prebundle-client-scripts.ts && deno run -A scripts/build/prebundle-bridge.ts && deno run -A scripts/build/prebundle-rsc-scripts.ts && deno run -A scripts/build/prebundle-hydration-runtime.ts",
         "generate:dev-ui": "deno run -A extensions/ext-dev-ui-react/scripts/generate-styles.ts && deno run -A extensions/ext-dev-ui-react/scripts/prebundle.ts",
         "generate:dev-ui:check": "deno run -A extensions/ext-dev-ui-react/scripts/generate-styles.ts --check && deno run -A extensions/ext-dev-ui-react/scripts/prebundle.ts --check",
-        "generate:manifests:check": "deno run -A scripts/build/generate-templates-manifest.ts --check && deno task generate:dev-ui:check && deno run -A scripts/build/prebundle-hydration-runtime.ts --check && deno run -A scripts/build/prebundle-client-scripts.ts --check",
+        "generate:manifests:check": "deno run -A scripts/build/generate-templates-manifest.ts --check && deno task generate:dev-ui:check && deno run -A scripts/build/prebundle-hydration-runtime.ts --check && deno run -A scripts/build/prebundle-client-scripts.ts --check && deno run -A scripts/build/prebundle-bridge.ts --check && deno run -A scripts/build/prebundle-rsc-scripts.ts --check",
         "start": "deno task generate && deno run --allow-read --allow-write --allow-net --allow-env --allow-run --allow-sys --unstable-worker-options --unstable-net cli/main.ts",
         "start:headless": "deno task generate && deno run --allow-read --allow-write --allow-net --allow-env --allow-run --allow-sys --unstable-worker-options --unstable-net cli/main.ts --headless",
         "proxy": "deno task generate && deno run --allow-read --allow-write --allow-net --allow-env --allow-run --allow-sys --unstable-worker-options --unstable-net cli/main.ts serve --mode=proxy",
@@ -525,7 +525,7 @@ export default {
         "lint:ban-test-only": "deno run --allow-read scripts/lint/ban-test-only.ts",
         "lint:sanitizer-baseline": "deno run --allow-read scripts/lint/check-sanitizer-baseline.ts",
         "lint:skipped-tests": "deno run --allow-read scripts/lint/check-skipped-tests-baseline.ts",
-        "test:scripts": "deno test --config=scripts/test.deno.json --no-check --allow-read --allow-write --allow-run scripts/ci/publish-npm-packages.test.ts scripts/ci/setup-deno-workflow.test.ts scripts/build/compile-binary.test.ts scripts/build/dnt-polyfill.test.ts scripts/build/generate-sbom.test.ts scripts/build/npm-dependency-sources.test.ts scripts/build/npm-extension-package-metadata.test.ts scripts/build/npm-package-metadata.test.ts scripts/build/npm-react-shims.test.ts scripts/build/npm-runtime-helper-contract.test.ts scripts/build/prepare-framework-sources.test.ts scripts/docs/docs-coverage.test.ts scripts/docs/generate-api-reference.test.ts scripts/docs/guide-validation.test.ts scripts/lint/audit-core-deps.test.ts scripts/lint/audit-dependency-boundaries.test.ts scripts/lint/audit-extension-capabilities.test.ts scripts/lint/audit-extension-contracts.test.ts scripts/lint/audit-deps.test.ts scripts/lint/check-module-boundaries.test.ts scripts/lint/lint-config.test.ts scripts/lint/ban-test-only.test.ts scripts/lint/check-sanitizer-baseline.test.ts scripts/lint/check-skipped-tests-baseline.test.ts scripts/lint/check-test-typecheck-baseline.test.ts scripts/lint/check-coverage.test.ts scripts/security/audit-npm.test.ts scripts/security/submit-dependency-snapshot.test.ts && deno task test:tool-search-live",
+        "test:scripts": "deno test --config=scripts/test.deno.json --no-check --allow-read --allow-write --allow-run scripts/ci/publish-npm-packages.test.ts scripts/ci/setup-deno-workflow.test.ts scripts/build/compile-binary.test.ts scripts/build/dnt-polyfill.test.ts scripts/build/generate-sbom.test.ts scripts/build/generated-artifact-checks.test.ts scripts/build/npm-dependency-sources.test.ts scripts/build/npm-extension-package-metadata.test.ts scripts/build/npm-package-metadata.test.ts scripts/build/npm-react-shims.test.ts scripts/build/npm-runtime-helper-contract.test.ts scripts/build/prepare-framework-sources.test.ts scripts/docs/docs-coverage.test.ts scripts/docs/generate-api-reference.test.ts scripts/docs/guide-validation.test.ts scripts/lint/audit-core-deps.test.ts scripts/lint/audit-dependency-boundaries.test.ts scripts/lint/audit-extension-capabilities.test.ts scripts/lint/audit-extension-contracts.test.ts scripts/lint/audit-deps.test.ts scripts/lint/check-module-boundaries.test.ts scripts/lint/lint-config.test.ts scripts/lint/ban-test-only.test.ts scripts/lint/check-sanitizer-baseline.test.ts scripts/lint/check-skipped-tests-baseline.test.ts scripts/lint/check-test-typecheck-baseline.test.ts scripts/lint/check-coverage.test.ts scripts/security/audit-npm.test.ts scripts/security/submit-dependency-snapshot.test.ts && deno task test:tool-search-live",
         "test:sentry-runtime-packages": "deno test --config=scripts/test.deno.json --no-check --no-lock --allow-read --allow-write --allow-run --allow-env=DENO_DIR,HOME,XDG_CACHE_HOME,LOCALAPPDATA,USERPROFILE scripts/build/sentry-runtime-packages.test.ts",
         "test:tool-search-live": "VF_DISABLE_LRU_INTERVAL=1 deno test --no-check -A tests/agent/verify-tool-search-live.test.ts",
         "test:cross-runtime": "deno run --allow-all src/platform/compat/cross-runtime.test.ts",

package/esm/src/html/html-shell-generator.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"html-shell-generator.d.ts","sourceRoot":"","sources":["../../../src/src/html/html-shell-generator.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,cAAc,EAAE,MAAM,mBAAmB,CAAC;AA+BxE,OAAO,EAGL,aAAa,EACd,MAAM,2BAA2B,CAAC;AACnC,OAAO,KAAK,EAAE,qBAAqB,EAAE,MAAM,YAAY,CAAC;AA4DxD,KAAK,gBAAgB,GAAG,OAAO,CAAC,UAAU,CAAC,OAAO,aAAa,CAAC,CAAC,GAAG,IAAI,CAAC;AAgFzE,wBAAgB,sBAAsB,CACpC,IAAI,EAAE,cAAc,EACpB,OAAO,EAAE,qBAAqB,EAC9B,MAAM,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,GAAG,MAAM,EAAE,CAAC,EAC1C,KAAK,CAAC,EAAE,cAAc,EACtB,kBAAkB,CAAC,EAAE,MAAM,EAC3B,iBAAiB,CAAC,EAAE,OAAO,CAAC,gBAAgB,CAAC,EAC7C,sBAAsB,CAAC,EAAE;IAAE,kBAAkB,CAAC,EAAE,MAAM,CAAA;CAAE,GACvD,OAAO,CAAC;IAAE,KAAK,EAAE,MAAM,CAAC;IAAC,GAAG,EAAE,MAAM,CAAA;CAAE,CAAC,CAoBzC;AA6RD,wBAAgB,eAAe,CAC7B,OAAO,EAAE,MAAM,EACf,IAAI,EAAE,cAAc,EACpB,OAAO,EAAE,qBAAqB,EAC9B,MAAM,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,GAAG,MAAM,EAAE,CAAC,EAC1C,KAAK,CAAC,EAAE,cAAc,EACtB,iBAAiB,CAAC,EAAE,OAAO,CAAC,gBAAgB,CAAC,GAC5C,OAAO,CAAC,MAAM,CAAC,CAoBjB"}
+{"version":3,"file":"html-shell-generator.d.ts","sourceRoot":"","sources":["../../../src/src/html/html-shell-generator.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,cAAc,EAAE,MAAM,mBAAmB,CAAC;AA+BxE,OAAO,EAGL,aAAa,EACd,MAAM,2BAA2B,CAAC;AACnC,OAAO,KAAK,EAAE,qBAAqB,EAAE,MAAM,YAAY,CAAC;AA4DxD,KAAK,gBAAgB,GAAG,OAAO,CAAC,UAAU,CAAC,OAAO,aAAa,CAAC,CAAC,GAAG,IAAI,CAAC;AAgFzE,wBAAgB,sBAAsB,CACpC,IAAI,EAAE,cAAc,EACpB,OAAO,EAAE,qBAAqB,EAC9B,MAAM,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,GAAG,MAAM,EAAE,CAAC,EAC1C,KAAK,CAAC,EAAE,cAAc,EACtB,kBAAkB,CAAC,EAAE,MAAM,EAC3B,iBAAiB,CAAC,EAAE,OAAO,CAAC,gBAAgB,CAAC,EAC7C,sBAAsB,CAAC,EAAE;IAAE,kBAAkB,CAAC,EAAE,MAAM,CAAA;CAAE,GACvD,OAAO,CAAC;IAAE,KAAK,EAAE,MAAM,CAAC;IAAC,GAAG,EAAE,MAAM,CAAA;CAAE,CAAC,CAoBzC;AAgSD,wBAAgB,eAAe,CAC7B,OAAO,EAAE,MAAM,EACf,IAAI,EAAE,cAAc,EACpB,OAAO,EAAE,qBAAqB,EAC9B,MAAM,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,GAAG,MAAM,EAAE,CAAC,EAC1C,KAAK,CAAC,EAAE,cAAc,EACtB,iBAAiB,CAAC,EAAE,OAAO,CAAC,gBAAgB,CAAC,GAC5C,OAAO,CAAC,MAAM,CAAC,CAoBjB"}

package/esm/src/html/html-shell-generator.js

@@ -170,6 +170,9 @@ async function generateHTMLShellPartsImpl(meta, options, params, props, contentF
         ? getDevScripts(meta.slug || "", options.config, params, props, nonce, {
             skipDevHMR,
             skipErrorLogger,
+            // Preview renders user-facing output, so it must not be marked as a
+            // development render even though it serves the dev scripts for HMR.
+            skipDevFlag: isPreviewMode,
         })
         : getProdScripts(meta.slug || "", params, props, nonce);
     const modeStyles = useDevScripts ? getErrorOverlayStyles(nonce) : "";

package/esm/src/html/hydration-script-builder/dev-flag.d.ts

@@ -0,0 +1,16 @@
+/**
+ * Announce a development render to client code.
+ *
+ * `__VERYFRONT_DEV__` is the framework's client-side development signal, read
+ * by components that warn about misconfiguration (the optimized image size
+ * check, the chat Markdown renderer check). The RSC page handler already sets
+ * it, but the app-router shell did not, so those warnings stayed silent on the
+ * page path most projects actually use.
+ *
+ * Emitted only from the dev script set, so a production document never carries
+ * it. The value is a literal, so there is nothing to escape.
+ *
+ * @module html/hydration-script-builder/dev-flag
+ */
+export declare function generateDevFlagScript(nonce?: string): string;
+//# sourceMappingURL=dev-flag.d.ts.map

package/esm/src/html/hydration-script-builder/dev-flag.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"dev-flag.d.ts","sourceRoot":"","sources":["../../../../src/src/html/hydration-script-builder/dev-flag.ts"],"names":[],"mappings":"AAEA;;;;;;;;;;;;;GAaG;AACH,wBAAgB,qBAAqB,CAAC,KAAK,CAAC,EAAE,MAAM,GAAG,MAAM,CAE5D"}

package/esm/src/html/hydration-script-builder/dev-flag.js

@@ -0,0 +1,18 @@
+import { buildNonceAttribute } from "../html-escape.js";
+/**
+ * Announce a development render to client code.
+ *
+ * `__VERYFRONT_DEV__` is the framework's client-side development signal, read
+ * by components that warn about misconfiguration (the optimized image size
+ * check, the chat Markdown renderer check). The RSC page handler already sets
+ * it, but the app-router shell did not, so those warnings stayed silent on the
+ * page path most projects actually use.
+ *
+ * Emitted only from the dev script set, so a production document never carries
+ * it. The value is a literal, so there is nothing to escape.
+ *
+ * @module html/hydration-script-builder/dev-flag
+ */
+export function generateDevFlagScript(nonce) {
+    return `<script${buildNonceAttribute(nonce)}>window.__VERYFRONT_DEV__=true;</script>`;
+}

package/esm/src/html/hydration-script-builder/dev-scripts.d.ts

@@ -5,6 +5,12 @@ interface DevScriptsOptions {
     skipDevHMR?: boolean;
     /** Skip error logger when endpoint is not available (preview mode) */
     skipErrorLogger?: boolean;
+    /**
+     * Skip the client development flag. Preview serves the dev script set for
+     * HMR, but its output is user-facing, so it must not switch on
+     * development-only client behaviour such as configuration warnings.
+     */
+    skipDevFlag?: boolean;
 }
 export declare function getDevScripts(_slug: string, config: VeryfrontConfig, _params?: Record<string, string | string[]>, _props?: ComponentProps, nonce?: string, options?: DevScriptsOptions): string;
 export {};

package/esm/src/html/hydration-script-builder/dev-scripts.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"dev-scripts.d.ts","sourceRoot":"","sources":["../../../../src/src/html/hydration-script-builder/dev-scripts.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,sBAAsB,CAAC;AAC3D,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,uBAAuB,CAAC;AAkB7D,UAAU,iBAAiB;IACzB,gEAAgE;IAChE,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,sEAAsE;IACtE,eAAe,CAAC,EAAE,OAAO,CAAC;CAC3B;AAED,wBAAgB,aAAa,CAC3B,KAAK,EAAE,MAAM,EACb,MAAM,EAAE,eAAe,EACvB,OAAO,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,GAAG,MAAM,EAAE,CAAC,EAC3C,MAAM,CAAC,EAAE,cAAc,EACvB,KAAK,CAAC,EAAE,MAAM,EACd,OAAO,CAAC,EAAE,iBAAiB,GAC1B,MAAM,CAaR"}
+{"version":3,"file":"dev-scripts.d.ts","sourceRoot":"","sources":["../../../../src/src/html/hydration-script-builder/dev-scripts.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,sBAAsB,CAAC;AAC3D,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,uBAAuB,CAAC;AAmB7D,UAAU,iBAAiB;IACzB,gEAAgE;IAChE,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,sEAAsE;IACtE,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B;;;;OAIG;IACH,WAAW,CAAC,EAAE,OAAO,CAAC;CACvB;AAED,wBAAgB,aAAa,CAC3B,KAAK,EAAE,MAAM,EACb,MAAM,EAAE,eAAe,EACvB,OAAO,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,GAAG,MAAM,EAAE,CAAC,EAC3C,MAAM,CAAC,EAAE,cAAc,EACvB,KAAK,CAAC,EAAE,MAAM,EACd,OAAO,CAAC,EAAE,iBAAiB,GAC1B,MAAM,CAiBR"}

package/esm/src/html/hydration-script-builder/dev-scripts.js

@@ -2,6 +2,7 @@ import { buildNonceAttribute } from "../html-escape.js";
 import { generateDevErrorLoggerScript } from "./dev-error-logger.js";
 import { generateDevComponentManifestScript } from "./dev-component-manifest.js";
 import { generateDevClientRendererScript } from "./dev-client-renderer.js";
+import { generateDevFlagScript } from "./dev-flag.js";
 function generateHMRScript(config, nonce, skipDevHMR) {
     // Skip dev HMR script when preview-hmr.js will be used instead
     if (skipDevHMR || !config.dev?.hmr)
@@ -11,6 +12,10 @@ function generateHMRScript(config, nonce, skipDevHMR) {
 }
 export function getDevScripts(_slug, config, _params, _props, nonce, options) {
     const scripts = [];
+    // First, so client code that branches on the development signal sees it
+    // before any other dev script runs.
+    if (!options?.skipDevFlag)
+        scripts.push(generateDevFlagScript(nonce));
     // Error logger only works in local dev (endpoint returns 404 in preview/prod)
     if (!options?.skipErrorLogger)
         scripts.push(generateDevErrorLoggerScript(nonce));