[ashx-j]

Phase 4c of the plugin system roadmap (#3, phase issue #8). It builds on #19, so until #14 to #19 merge this diff also shows their commits.

Web plugins could add panels and commands, but couldn't change how T3 looks or how conversations read. This lets a plugin add themes, banners and its own way of drawing tool calls and code blocks.

• Themes. A plugin's themes/ folder is published through the existing environment theme service, so its themes appear in the theme picker on web, desktop and mobile with no client change. The environment's own themes/ folder wins when ids collide, and a disabled plugin's themes disappear.
• Composer banners. api.composer.showBanner({ title, description, variant }) shows a banner above the composer in every thread until the plugin hides it, the user dismisses it, or the plugin unloads. It goes through useSystemComposerBanners, so ChatView is unchanged.
• Tool call renderers. api.timeline.registerToolRenderer({ tool, component }) draws the plugin's own MCP tool calls (plg_<pluginId>_<tool>) in the timeline's tool details. Only plg_ tools mount the lookup, so other tool rows read no registry. A renderer that throws falls back to the generic view.
• Code block renderers. api.markdown.registerCodeBlock({ language, component }) draws fenced code of that language in chat messages, for example a chart from ```hello-chart. It only replaces closed fences, so streaming text renders as code until the fence ends. mermaid and math stay T3's own.
• Styles. api.injectStyles(css) adds a stylesheet that is removed when the plugin unloads.

Changes from the roadmap (issue #8 is updated):

• The markdown hook is a renderer for fenced code languages rather than a general post-processor over assistant text. Code fences are the seam Mermaid and math already use, and a general text pass would run on every message render, the hottest path in the app.
• Not built yet, left for a follow-up:
  • Thread header badges and status indicators. They need a new field in the thread shell projection on the server.
  • Sidebar sections. The sidebar is one tree whose drag and drop logic knows every section by name.
  • The items moved from 4b: composer context chips, settings and state atoms, commands.run for built-in commands.

Measurements:

Bundle, from production web builds of #19's head and this branch, compared chunk by chunk:

• useTimelineFollow (the timeline chunk) grew 1.0 KB: the plugin tool body and its check in the tool details.
• main grew 0.8 KB: the banner, tool renderer and code block registries.
• pluginLoader grew 0.7 KB, _chat 0.3 KB and ChatMarkdown 0.2 KB.

Renders: not measured with a profiler. Chat code blocks read one atom that changes only when a plugin adds or removes a code block renderer. It is not the shared registry version, so banners and panels never re-render code blocks. Tool rows for non-plugin tools read nothing new. The sidebar did not change.

Video and screenshots:

GitHub's CLI can't upload images or video, so a 30-second recording and 2 screenshots are in the T3 thread for this work instead: /hello showing a plugin banner, the hello-web panel with its asset text and injected style, a chart drawn from a hello-chart fence in a message, and "Hello Dusk" in the theme picker. They still need to be dragged into this description during review.

Test plugin: hello-web, which now also ships themes/hello-dusk.json, shows a banner from /hello, draws hello-chart fences, injects a style, and has an MCP tool greet with a timeline renderer.

Verification:

• environmentTheme.test.ts covers plugin theme folders: they are added after the environment's own, the environment wins on the same id, and they disappear when cleared. The PluginHost.test.ts web files case checks the host publishes an active plugin's themes/ folder and clears it on disable.
• PluginToolBody.browser.test.tsx checks a registered renderer draws the tool call, the generic view returns after unloading, and a throwing renderer falls back.
• A new ChatMarkdown.browser.test.tsx case checks a plugin draws a closed hello-chart fence and leaves an open, streaming one as code.
• pluginLoader.browser.test.ts loads hello-web and checks its banner, tool renderer and stylesheet are added and removed on unload.
• In a browser against a dev server on seeded data, using the free Replay provider: everything in the video above, with no paid agent turn.
• vp run check:changed passed.
• Not verified: a plugin tool call drawn live, because that needs an agent to call the tool, and the desktop app.

Review: an adversarial review of #18 to #22 found issues in this PR; the fixes are in #23.

---

PR filed by Claude Opus 5.5 in Claude Code through T3 Code.