webui: clean up component demos
diff --git a/webui/src/web-components/demo/index-generated.html b/webui/src/web-components/demo/index-generated.html
index 7460e78..9faf25c 100644
--- a/webui/src/web-components/demo/index-generated.html
+++ b/webui/src/web-components/demo/index-generated.html
@@ -83,7 +83,7 @@
<div class="stats">
<strong>Auto-generated index</strong><br />
- Found 3 demo components • Last updated: 6/25/2025, 8:50:21 PM
+ Found 19 demo components • Last updated: 7/20/2025, 10:21:08 PM
</div>
<p>
@@ -97,6 +97,12 @@
<ul class="demo-list">
<li>
+ <a href="demo-runner.html#sketch-call-status">
+ <strong>Call Status Demo</strong> - Display current LLM and tool call
+ status with visual indicators
+ </a>
+ </li>
+ <li>
<a href="demo-runner.html#sketch-chat-input">
<strong>Chat Input Demo</strong> - Interactive chat input component
with send functionality
@@ -109,11 +115,101 @@
</a>
</li>
<li>
+ <a href="demo-runner.html#sketch-diff-range-picker">
+ <strong>Diff Range Picker Demo</strong> - Component for selecting
+ commit ranges for diff views
+ </a>
+ </li>
+ <li>
+ <a href="demo-runner.html#mobile-chat">
+ <strong>Mobile Chat Demo</strong> - Mobile chat interface with message
+ display and scroll behavior
+ </a>
+ </li>
+ <li>
+ <a href="demo-runner.html#sketch-push-button">
+ <strong>Push Button</strong>
+ </a>
+ </li>
+ <li>
+ <a href="demo-runner.html#sketch-app-shell">
+ <strong>Sketch App Shell Demo</strong> - Full sketch application shell
+ with chat, diff, and terminal views
+ </a>
+ </li>
+ <li>
+ <a href="demo-runner.html#sketch-diff2-view">
+ <strong>Sketch Monaco Diff View Demo</strong> - Monaco-based diff view
+ with range and file pickers using mock data
+ </a>
+ </li>
+ <li>
+ <a href="demo-runner.html#sketch-monaco-view">
+ <strong>Sketch Monaco Viewer Demo</strong> - Monaco editor with code
+ comparison functionality for different languages
+ </a>
+ </li>
+ <li>
+ <a href="demo-runner.html#sketch-network-status">
+ <strong>Sketch Network Status Demo</strong> - Status indicators
+ showing different connection and activity states
+ </a>
+ </li>
+ <li>
+ <a href="demo-runner.html#sketch-timeline-viewport">
+ <strong>Sketch Timeline Viewport Demo</strong> - Timeline viewport
+ rendering with memory leak protection and event-driven approach
+ </a>
+ </li>
+ <li>
+ <a href="demo-runner.html#sketch-tool-card">
+ <strong>Sketch Tool Card Demo</strong> - Demonstration of different
+ tool card components for various tool types
+ </a>
+ </li>
+ <li>
+ <a href="demo-runner.html#status-indicators">
+ <strong>Status Indicators Demo</strong> - Status indicators showing
+ connected, working, and disconnected states without the green
+ connection dot
+ </a>
+ </li>
+ <li>
+ <a href="demo-runner.html#sketch-theme-toggle">
+ <strong>Theme Toggle Demo</strong> - Three-way theme toggle: light
+ mode, dark mode, and system preference
+ </a>
+ </li>
+ <li>
+ <a href="demo-runner.html#sketch-timeline">
+ <strong>Timeline Demo</strong> - Interactive timeline component for
+ displaying conversation messages with various states
+ </a>
+ </li>
+ <li>
+ <a href="demo-runner.html#sketch-timeline-message">
+ <strong>Timeline Message Demo</strong> - Interactive timeline message
+ component with various message types and features
+ </a>
+ </li>
+ <li>
+ <a href="demo-runner.html#sketch-todo-panel">
+ <strong>Todo Panel Demo</strong> - Interactive todo list panel showing
+ task progress and allowing comments
+ </a>
+ </li>
+ <li>
<a href="demo-runner.html#sketch-tool-calls">
<strong>Tool Calls Demo</strong> - Interactive tool call display with
various tool types
</a>
</li>
+ <li>
+ <a href="demo-runner.html#sketch-view-mode-select">
+ <strong>View Mode Select Demo</strong> - Interactive tab navigation
+ for switching between chat, diff, and terminal views
+ </a>
+ </li>
</ul>
<hr style="margin: 40px 0; border: none; border-top: 1px solid #d1d9e0" />