refactor(app): unified panel state machine for mobile sidebars

Replace separate sidebar stores with a unified panel store that uses a
discriminated union state machine on mobile. This makes it impossible
for both the agent list and file explorer sidebars to be open at the
same time on mobile.

Mobile state machine (mobileView):
- 'agent': Main agent view (no overlay panel)
- 'agent-list': Agent list sidebar (left overlay)
- 'file-explorer': File explorer sidebar (right overlay)

Desktop retains independent boolean toggles since sidebars sit
alongside content rather than overlaying it.

Key changes:
- Created stores/panel-store.ts with unified state
- Deleted stores/sidebar-store.ts and explorer-sidebar-store.ts
- Updated all components to use new panel store
- Animation contexts derive isOpen from unified state

packages/app/src/components/agent-input-area.tsx

@@ -231,14 +231,19 @@ export function AgentInputArea({
       return;
     }
 
-    const isControlled = value !== undefined;
+    const isControlledLocal = value !== undefined;
     setSelectedImages([]);
     setIsProcessing(true);
 
     try {
       await submitMessage(trimmedMessage, imageAttachments);
       // Clear input only after successful submission
-      if (isControlled) {
+      // For controlled inputs with onSubmitMessage, the parent handles clearing
+      // because agent creation is async (WebSocket) and errors come back later
+      if (onSubmitMessageRef.current) {
+        // Parent manages input state - don't clear here
+        // Parent will clear on success via onChangeText
+      } else if (isControlledLocal) {
         onChangeText?.("");
       } else {
         setUserInput("");
@@ -284,8 +289,13 @@ export function AgentInputArea({
     }
   }, [isAgentRunning, isConnected]);
 
-  // Hydrate draft only when switching agents
+  // Hydrate draft only when switching agents (uncontrolled mode only)
+  const isControlled = value !== undefined;
   useEffect(() => {
+    // Skip draft hydration for controlled inputs - parent manages state
+    if (isControlled) {
+      return;
+    }
     const draft = getDraftInput(agentId);
     if (!draft) {
       setUserInput("");
@@ -295,7 +305,7 @@ export function AgentInputArea({
 
     setUserInput(draft.text);
     setSelectedImages(draft.images as ImageAttachment[]);
-  }, [agentId, getDraftInput]);
+  }, [agentId, getDraftInput, isControlled]);
 
   // Persist drafts into the shared session store with change detection to avoid redundant work
   useEffect(() => {