Add collapsible tool renderers with animated expand/collapse

- Add renderCollapsibleHeader() to renderer-registry
  - Places chevron on right, spinner on left
  - Toggles between ChevronRight (collapsed) and ChevronDown (expanded)
  - Uses max-h-0/max-h-[2000px] with transition-all for smooth animation
  - Dynamically adds/removes mt-3 to avoid margin when collapsed

- Update javascript-repl renderer to use collapsible sections
  - Code and console output hidden by default
  - Only file attachments remain visible
  - 300ms smooth animation on expand/collapse

- Export renderCollapsibleHeader from web-ui index
This commit is contained in:
Mario Zechner 2025-10-08 13:38:45 +02:00
parent 8ec9805112
commit f646a29d1a
3 changed files with 95 additions and 29 deletions

View file

@ -69,7 +69,7 @@ export { TextArtifact } from "./tools/artifacts/TextArtifact.js";
// Tools
export { getToolRenderer, registerToolRenderer, renderTool } from "./tools/index.js";
export { createJavaScriptReplTool, javascriptReplTool } from "./tools/javascript-repl.js";
export { renderHeader } from "./tools/renderer-registry.js";
export { renderCollapsibleHeader, renderHeader } from "./tools/renderer-registry.js";
export { BashRenderer } from "./tools/renderers/BashRenderer.js";
export { CalculateRenderer } from "./tools/renderers/CalculateRenderer.js";
// Tool renderers