- New SessionLifecycleStatus.vue: shows current hook lifecycle event with color-coded dot, event name, and detail text. Auto-detects mock vs real mode (falls back to demo cycle when no real data). - Wrap lifecycle + UserInput + status-bar in .bottom-overlay container to eliminate fragile hardcoded pixel offsets in FloatingTranscriptDebug. - Remove old agent-status-indicator square dot from status bar. - Add lastHookEvent/lastHookDetail to client AgentSessionState type. - Simplify idle-mode CSS: single .bottom-overlay rule replaces three separate show/hide rules for user-input, status-bar, lifecycle-ribbon.
Vue 3 + TypeScript + Vite
This template should help get you started developing with Vue 3 and TypeScript in Vite. The template uses Vue 3 <script setup> SFCs, check out the script setup docs to learn more.
Learn more about the recommended Project Setup and IDE Support in the Vue Docs TypeScript Guide.