feat(coding-agent): show tool input schema in /export HTML

Include tool parameter names, types, descriptions in a collapsible
section under each tool in the export HTML. Also adds parameters to
pi.getAllTools() return value.

closes #1407, closes #1416

packages/coding-agent/CHANGELOG.md

@@ -9,6 +9,8 @@
 ### Added
 
 - Added `ctx.reload()` to the extension API for programmatic runtime reload ([#1371](https://github.com/badlogic/pi-mono/issues/1371))
+- `/export` HTML now includes tool input schema (parameter names, types, descriptions) in a collapsible section under each tool ([#1416](https://github.com/badlogic/pi-mono/pull/1416) by [@marchellodev](https://github.com/marchellodev))
+- `pi.getAllTools()` now returns tool parameters in addition to name and description ([#1416](https://github.com/badlogic/pi-mono/pull/1416) by [@marchellodev](https://github.com/marchellodev))
 
 ### Fixed
 

packages/coding-agent/src/core/agent-session.ts

@@ -56,6 +56,7 @@ import {
 	type SessionBeforeTreeResult,
 	type ShutdownHandler,
 	type ToolDefinition,
+	type ToolInfo,
 	type TreePreparation,
 	type TurnEndEvent,
 	type TurnStartEvent,
@@ -535,12 +536,13 @@ export class AgentSession {
 	}
 
 	/**
-	 * Get all configured tools with name and description.
+	 * Get all configured tools with name, description, and parameter schema.
 	 */
-	getAllTools(): Array<{ name: string; description: string }> {
+	getAllTools(): ToolInfo[] {
 		return Array.from(this._toolRegistry.values()).map((t) => ({
 			name: t.name,
 			description: t.description,
+			parameters: t.parameters,
 		}));
 	}
 

packages/coding-agent/src/core/export-html/index.ts

@@ -3,6 +3,7 @@ import { existsSync, readFileSync, writeFileSync } from "fs";
 import { basename, join } from "path";
 import { APP_NAME, getExportTemplateDir } from "../../config.js";
 import { getResolvedThemeColors, getThemeExportColors } from "../../modes/interactive/theme/theme.js";
+import type { ToolInfo } from "../extensions/types.js";
 import type { SessionEntry } from "../session-manager.js";
 import { SessionManager } from "../session-manager.js";
 
@@ -128,7 +129,7 @@ interface SessionData {
 	entries: ReturnType<SessionManager["getEntries"]>;
 	leafId: string | null;
 	systemPrompt?: string;
-	tools?: { name: string; description: string }[];
+	tools?: ToolInfo[];
 	/** Pre-rendered HTML for custom tool calls/results, keyed by tool call ID */
 	renderedTools?: Record<string, RenderedToolHtml>;
 }
@@ -253,7 +254,7 @@ export async function exportSessionToHtml(
 		entries,
 		leafId: sm.getLeafId(),
 		systemPrompt: state?.systemPrompt,
-		tools: state?.tools?.map((t) => ({ name: t.name, description: t.description })),
+		tools: state?.tools?.map((t) => ({ name: t.name, description: t.description, parameters: t.parameters })),
 		renderedTools,
 	};
 

packages/coding-agent/src/core/export-html/template.css

@@ -663,6 +663,65 @@
       color: var(--dim);
     }
 
+    .tool-params-hint {
+      color: var(--muted);
+      font-style: italic;
+    }
+
+    .tool-item:has(.tool-params-hint) {
+      cursor: pointer;
+    }
+
+    .tool-params-hint::after {
+      content: '[click to show parameters]';
+    }
+
+    .tool-item.params-expanded .tool-params-hint::after {
+      content: '[hide parameters]';
+    }
+
+    .tool-params-content {
+      display: none;
+      margin-top: 4px;
+      margin-left: 12px;
+      padding-left: 8px;
+      border-left: 1px solid var(--dim);
+    }
+
+    .tool-item.params-expanded .tool-params-content {
+      display: block;
+    }
+
+    .tool-param {
+      margin-bottom: 4px;
+      font-size: 11px;
+    }
+
+    .tool-param-name {
+      font-weight: bold;
+      color: var(--text);
+    }
+
+    .tool-param-type {
+      color: var(--dim);
+      font-style: italic;
+    }
+
+    .tool-param-required {
+      color: var(--warning, #e8a838);
+      font-size: 10px;
+    }
+
+    .tool-param-optional {
+      color: var(--dim);
+      font-size: 10px;
+    }
+
+    .tool-param-desc {
+      color: var(--dim);
+      margin-left: 8px;
+    }
+
     /* Hook/custom messages */
     .hook-message {
       background: var(--customMessageBg);

packages/coding-agent/src/core/export-html/template.js

@@ -1331,7 +1331,27 @@
           html += `<div class="tools-list">
             <div class="tools-header">Available Tools</div>
             <div class="tools-content">
-              ${tools.map(t => `<div class="tool-item"><span class="tool-item-name">${escapeHtml(t.name)}</span> - <span class="tool-item-desc">${escapeHtml(t.description)}</span></div>`).join('')}
+              ${tools.map(t => {
+                const hasParams = t.parameters && typeof t.parameters === 'object' && t.parameters.properties && Object.keys(t.parameters.properties).length > 0;
+                if (!hasParams) {
+                  return `<div class="tool-item"><span class="tool-item-name">${escapeHtml(t.name)}</span> - <span class="tool-item-desc">${escapeHtml(t.description)}</span></div>`;
+                }
+                const params = t.parameters;
+                const properties = params.properties;
+                const required = params.required || [];
+                let paramsHtml = '';
+                for (const [name, prop] of Object.entries(properties)) {
+                  const isRequired = required.includes(name);
+                  const typeStr = prop.type || 'any';
+                  const reqLabel = isRequired ? '<span class="tool-param-required">required</span>' : '<span class="tool-param-optional">optional</span>';
+                  paramsHtml += `<div class="tool-param"><span class="tool-param-name">${escapeHtml(name)}</span> <span class="tool-param-type">${escapeHtml(typeStr)}</span> ${reqLabel}`;
+                  if (prop.description) {
+                    paramsHtml += `<div class="tool-param-desc">${escapeHtml(prop.description)}</div>`;
+                  }
+                  paramsHtml += `</div>`;
+                }
+                return `<div class="tool-item" onclick="this.classList.toggle('params-expanded')"><span class="tool-item-name">${escapeHtml(t.name)}</span> - <span class="tool-item-desc">${escapeHtml(t.description)}</span> <span class="tool-params-hint"></span><div class="tool-params-content">${paramsHtml}</div></div>`;
+              }).join('')}
             </div>
           </div>`;
         }

packages/coding-agent/src/core/extensions/types.ts

@@ -1159,8 +1159,8 @@ export type GetSessionNameHandler = () => string | undefined;
 
 export type GetActiveToolsHandler = () => string[];
 
-/** Tool info with name and description */
+/** Tool info with name, description, and parameter schema */
-export type ToolInfo = Pick<ToolDefinition, "name" | "description">;
+export type ToolInfo = Pick<ToolDefinition, "name" | "description" | "parameters">;
 
 export type GetAllToolsHandler = () => ToolInfo[];