@hellcoder/companion 0.96.0

package/dist/assets/Playground-BV3k0RbV.js

@@ -0,0 +1,109 @@
+import{r as u,j as e,u as j,n as xe,b as me,P as f,C as pe,A as J,M as v,T as w,G as M,L as Y,D as P,S as L,c as B,d as U,e as Q,f as X,h as ue,i as he,k as ge,U as be,l as fe,m as se,o as te,a as je,p as ve,q as _,v as we}from"./index-DkqeP-R9.js";const Ne=new Set(["pulling_image","running_init_script","building_image"]);function A({steps:t,error:c}){const[n,i]=u.useState({}),[r,m]=u.useState(new Set),l=u.useRef(new Map),h=u.useCallback(o=>x=>{x?l.current.set(o,x):l.current.delete(o)},[]);return u.useEffect(()=>{for(const o of t)o.detail&&Ne.has(o.step)&&(i(x=>{const a=x[o.step]||[];return a.length===0||a[a.length-1]!==o.detail?{...x,[o.step]:[...a,o.detail]}:x}),m(x=>{if(x.has(o.step))return x;const a=new Set(x);return a.add(o.step),a}))},[t]),u.useEffect(()=>{var o;for(const x of l.current.values())(o=x.scrollTo)==null||o.call(x,{top:x.scrollHeight})},[n]),t.length===0?null:e.jsxs("div",{className:"w-full max-w-md mx-auto mt-4 mb-2",children:[e.jsx("div",{className:"space-y-1.5",children:t.map(o=>{const x=n[o.step],a=x&&x.length>0,y=r.has(o.step);return e.jsxs("div",{children:[e.jsxs("div",{className:"flex items-center gap-2.5 py-1",children:[e.jsxs("div",{className:"w-4 h-4 flex items-center justify-center shrink-0",children:[o.status==="in_progress"&&e.jsx("span",{className:"w-3.5 h-3.5 border-2 border-cc-primary/30 border-t-cc-primary rounded-full animate-spin"}),o.status==="done"&&e.jsx("svg",{viewBox:"0 0 16 16",fill:"none",className:"w-3.5 h-3.5 text-cc-success",children:e.jsx("path",{d:"M13.25 4.75L6 12 2.75 8.75",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round"})}),o.status==="error"&&e.jsx("svg",{viewBox:"0 0 16 16",fill:"none",className:"w-3.5 h-3.5 text-cc-error",children:e.jsx("path",{d:"M4 4l8 8M12 4l-8 8",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round"})})]}),e.jsx("span",{className:`text-sm flex-1 ${o.status==="in_progress"?"text-cc-fg font-medium":o.status==="done"?"text-cc-muted":"text-cc-error"}`,children:o.label}),a&&e.jsx("button",{onClick:()=>m(N=>{const p=new Set(N);return p.has(o.step)?p.delete(o.step):p.add(o.step),p}),className:"text-[10px] text-cc-muted hover:text-cc-fg transition-colors cursor-pointer",children:y?"Hide logs":"Show logs"})]}),a&&y&&e.jsx("pre",{ref:h(o.step),className:"ml-[26px] mt-1 mb-1 px-3 py-2 text-[10px] font-mono-code bg-black/20 border border-cc-border rounded-md text-cc-muted max-h-[150px] overflow-auto whitespace-pre-wrap",children:x.slice(-30).join(`
+`)})]},o.step)})}),c&&e.jsx("div",{className:"mt-2.5 px-3 py-2 rounded-lg bg-cc-error/5 border border-cc-error/20",children:e.jsx("p",{className:"text-xs text-cc-error whitespace-pre-wrap",children:c})})]})}const b="playground-session";function g(t){return{request_id:`perm-${Math.random().toString(36).slice(2,8)}`,tool_use_id:`tu-${Math.random().toString(36).slice(2,8)}`,timestamp:Date.now(),...t}}const ne=g({tool_name:"Bash",input:{command:"git log --oneline -20 && npm run build",description:"View recent commits and build the project"},permission_suggestions:[{type:"addRules",rules:[{toolName:"Bash",ruleContent:"git log --oneline -20 && npm run build"}],behavior:"allow",destination:"session"},{type:"addRules",rules:[{toolName:"Bash",ruleContent:"git log --oneline -20 && npm run build"}],behavior:"allow",destination:"projectSettings"}]}),ye=g({tool_name:"Edit",input:{file_path:"/Users/stan/Dev/project/src/utils/format.ts",old_string:`export function formatDate(d: Date) {
+  return d.toISOString();
+}`,new_string:`export function formatDate(d: Date, locale = "en-US") {
+  return d.toLocaleDateString(locale, {
+    year: "numeric",
+    month: "short",
+    day: "numeric",
+  });
+}`},permission_suggestions:[{type:"addRules",rules:[{toolName:"Edit"}],behavior:"allow",destination:"session"}]}),ke=g({tool_name:"Write",input:{file_path:"/Users/stan/Dev/project/src/config.ts",content:`export const config = {
+  apiUrl: "https://api.example.com",
+  timeout: 5000,
+  retries: 3,
+  debug: process.env.NODE_ENV !== "production",
+};
+`}}),_e=g({tool_name:"Read",input:{file_path:"/Users/stan/Dev/project/package.json"},permission_suggestions:[{type:"addRules",rules:[{toolName:"Read"}],behavior:"allow",destination:"session"},{type:"addRules",rules:[{toolName:"Read"}],behavior:"allow",destination:"userSettings"}]}),Se=g({tool_name:"Glob",input:{pattern:"**/*.test.ts",path:"/Users/stan/Dev/project/src"}}),Ce=g({tool_name:"Grep",input:{pattern:"TODO|FIXME|HACK",path:"/Users/stan/Dev/project/src",glob:"*.ts"}}),Ae=g({tool_name:"ExitPlanMode",input:{plan:`## Summary
+Refactor the authentication module to use JWT tokens instead of session cookies.
+
+## Changes
+1. **Add JWT utility** — new \`src/auth/jwt.ts\` with sign/verify helpers
+2. **Update middleware** — modify \`src/middleware/auth.ts\` to validate Bearer tokens
+3. **Migrate login endpoint** — return JWT in response body instead of Set-Cookie
+4. **Update tests** — adapt all auth tests to use token-based flow
+
+## Test plan
+- Run \`npm test -- --grep auth\`
+- Manual test with curl`,allowedPrompts:[{tool:"Bash",prompt:"run tests"},{tool:"Bash",prompt:"install dependencies"}]}}),Ee=g({tool_name:"WebSearch",input:{query:"TypeScript 5.5 new features",allowed_domains:["typescriptlang.org","github.com"]},description:"Search the web for TypeScript 5.5 features"}),re=g({tool_name:"dynamic:code_interpreter",input:{code:"print('hello from dynamic tool')"},description:"Custom tool call: code_interpreter"}),Re=g({tool_name:"Bash",input:{command:"npm install --save-dev @types/react"},ai_validation:{verdict:"uncertain",reason:"Package installation modifies node_modules",ruleBasedOnly:!1}}),Te=g({tool_name:"Bash",input:{command:"git status"},ai_validation:{verdict:"safe",reason:"Read-only git command",ruleBasedOnly:!1}}),Ie=g({tool_name:"Bash",input:{command:"rm -rf node_modules && rm -rf .git"},ai_validation:{verdict:"dangerous",reason:"Recursive delete of project files",ruleBasedOnly:!1}}),De=g({tool_name:"Edit",display_name:"File Editor",title:"Edit a TypeScript file",decision_reason:"File is outside trusted directories",input:{file_path:"/workspace/src/app.ts",new_string:"const x = 1;",old_string:"const x = 0;"}}),Me=g({tool_name:"AskUserQuestion",input:{questions:[{header:"Auth method",question:"Which authentication method should we use for the API?",options:[{label:"JWT tokens (Recommended)",description:"Stateless, scalable, works well with microservices"},{label:"Session cookies",description:"Traditional approach, simpler but requires session storage"},{label:"OAuth 2.0",description:"Delegated auth, best for third-party integrations"}],multiSelect:!1}]}}),Pe=g({tool_name:"AskUserQuestion",input:{questions:[{header:"Database",question:"Which database should we use?",options:[{label:"PostgreSQL",description:"Relational, strong consistency"},{label:"MongoDB",description:"Document store, flexible schema"}],multiSelect:!1},{header:"Cache",question:"Do you want to add a caching layer?",options:[{label:"Redis",description:"In-memory, fast, supports pub/sub"},{label:"No cache",description:"Keep it simple for now"}],multiSelect:!1}]}}),ae={id:"msg-1",role:"user",content:"Can you help me refactor the authentication module to use JWT tokens?",timestamp:Date.now()-6e4},Le={id:"msg-2",role:"user",content:"Here's a screenshot of the error I'm seeing",images:[{media_type:"image/png",data:"iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAADUlEQVR42mNkYPj/HwADBwIAMCbHYQAAAABJRU5ErkJggg=="}],timestamp:Date.now()-55e3},ie={id:"msg-3",role:"assistant",content:"",contentBlocks:[{type:"text",text:`I'll help you refactor the authentication module. Let me first look at the current implementation.
+
+Here's what I found:
+- The current auth uses **session cookies** via \`express-session\`
+- Sessions are stored in a \`MemoryStore\` (not production-ready)
+- The middleware checks \`req.session.userId\`
+
+\`\`\`typescript
+// Current implementation
+app.use(session({
+  secret: process.env.SESSION_SECRET,
+  resave: false,
+  saveUninitialized: false,
+}));
+\`\`\`
+
+| Feature | Cookies | JWT |
+|---------|---------|-----|
+| Stateless | No | Yes |
+| Scalable | Limited | Excellent |
+| Revocation | Easy | Needs blocklist |
+`}],timestamp:Date.now()-5e4},ce={id:"msg-4",role:"assistant",content:"",contentBlocks:[{type:"text",text:"Let me check the current auth files."},{type:"tool_use",id:"tu-1",name:"Glob",input:{pattern:"src/auth/**/*.ts"}},{type:"tool_result",tool_use_id:"tu-1",content:`src/auth/middleware.ts
+src/auth/login.ts
+src/auth/session.ts`},{type:"tool_use",id:"tu-2",name:"Read",input:{file_path:"src/auth/middleware.ts"}},{type:"tool_result",tool_use_id:"tu-2",content:`export function authMiddleware(req, res, next) {
+  if (!req.session.userId) {
+    return res.status(401).json({ error: "Unauthorized" });
+  }
+  next();
+}`},{type:"text",text:"Now I understand the current structure. Let me create the JWT utility."}],timestamp:Date.now()-45e3},Be={id:"msg-5",role:"assistant",content:"",contentBlocks:[{type:"thinking",thinking:`Let me think about the best approach here. The user wants to migrate from session cookies to JWT. I need to:
+1. Create a JWT sign/verify utility
+2. Update the middleware to read Authorization header
+3. Change the login endpoint to return a token
+4. Update all tests
+
+I should use jsonwebtoken package for signing and jose for verification in edge environments. But since this is a Node.js server, jsonwebtoken is fine.
+
+The token should contain: userId, role, iat, exp. Expiry should be configurable. I'll also add a refresh token mechanism.`},{type:"text",text:"I've analyzed the codebase and have a clear plan. Let me start implementing."}],timestamp:Date.now()-4e4},Ue={id:"msg-streaming",role:"assistant",content:"Scanning auth files and drafting migration steps...",isStreaming:!0,timestamp:Date.now()-35e3},Oe={id:"msg-streaming-thinking",role:"assistant",content:"Let me analyze the codebase to understand the authentication architecture. I should look at the middleware, session store, and token validation...",isStreaming:!0,streamingPhase:"thinking",timestamp:Date.now()-34e3},Ge={id:"msg-6",role:"system",content:"Context compacted successfully",timestamp:Date.now()-3e4},oe={id:"msg-7",role:"assistant",content:"",contentBlocks:[{type:"text",text:"Let me try running the tests."},{type:"tool_use",id:"tu-3",name:"Bash",input:{command:"npm test -- --grep auth"}},{type:"tool_result",tool_use_id:"tu-3",content:`FAIL src/auth/__tests__/middleware.test.ts
+  ● Auth Middleware › should reject expired tokens
+    Expected: 401
+    Received: 500
+
+    TypeError: Cannot read property 'verify' of undefined`,is_error:!0},{type:"text",text:"There's a test failure. Let me fix the issue."}],timestamp:Date.now()-2e4},le=[{id:"1",subject:"Create JWT utility module",description:"",status:"completed"},{id:"2",subject:"Update auth middleware",description:"",status:"completed",activeForm:"Updating auth middleware"},{id:"3",subject:"Migrate login endpoint",description:"",status:"in_progress",activeForm:"Refactoring login to return JWT"},{id:"4",subject:"Add refresh token support",description:"",status:"pending"},{id:"5",subject:"Update all auth tests",description:"",status:"pending",blockedBy:["3"]},{id:"6",subject:"Run full test suite and fix failures",description:"",status:"pending",blockedBy:["5"]}],We=[{id:"tg-1",name:"Read",input:{file_path:"src/auth/middleware.ts"}},{id:"tg-2",name:"Read",input:{file_path:"src/auth/login.ts"}},{id:"tg-3",name:"Read",input:{file_path:"src/auth/session.ts"}},{id:"tg-4",name:"Read",input:{file_path:"src/auth/types.ts"}}],Ve=[{id:"sa-1",name:"Grep",input:{pattern:"useAuth",path:"src/"}},{id:"sa-2",name:"Grep",input:{pattern:"session.userId",path:"src/"}}],ze=[{toolUseId:"ta-1",toolName:"Bash",preview:"bun run test",startedAt:Date.now()-7200,completedAt:Date.now()-400,elapsedSeconds:6.8,isError:!1},{toolUseId:"ta-2",toolName:"Read",preview:"src/ws.ts",startedAt:Date.now()-500,completedAt:Date.now()-400,elapsedSeconds:.1,isError:!1},{toolUseId:"ta-3",toolName:"Edit",preview:"src/ws.ts",startedAt:Date.now()-400,completedAt:Date.now()-100,elapsedSeconds:1.4,isError:!1}],Fe=[{toolUseId:"ta-4",toolName:"Bash",preview:"npm run build",startedAt:Date.now()-5e3,completedAt:Date.now()-1e3,elapsedSeconds:4,isError:!0},{toolUseId:"ta-5",toolName:"Read",preview:"package.json",startedAt:Date.now()-900,completedAt:Date.now()-800,elapsedSeconds:.1,isError:!1}],He=[{toolUseId:"ta-6",toolName:"Bash",preview:"bun run test",startedAt:Date.now()-3e3,elapsedSeconds:3,isError:!1},{toolUseId:"ta-7",toolName:"Grep",preview:"TODO",startedAt:Date.now()-1e3,completedAt:Date.now()-500,elapsedSeconds:.5,isError:!1}],$e={number:162,title:"feat: add dark mode toggle to application settings",url:"https://github.com/example/project/pull/162",state:"OPEN",isDraft:!1,reviewDecision:"CHANGES_REQUESTED",additions:91,deletions:88,changedFiles:24,checks:[{name:"CI / Build",status:"COMPLETED",conclusion:"SUCCESS"},{name:"CI / Test",status:"COMPLETED",conclusion:"FAILURE"},{name:"CI / Lint",status:"COMPLETED",conclusion:"SUCCESS"}],checksSummary:{total:3,success:2,failure:1,pending:0},reviewThreads:{total:4,resolved:2,unresolved:2}},qe={number:158,title:"fix: prevent mobile keyboard layout shift and iOS zoom",url:"https://github.com/example/project/pull/158",state:"OPEN",isDraft:!1,reviewDecision:"APPROVED",additions:42,deletions:12,changedFiles:3,checks:[{name:"CI / Build",status:"COMPLETED",conclusion:"SUCCESS"},{name:"CI / Test",status:"COMPLETED",conclusion:"SUCCESS"}],checksSummary:{total:2,success:2,failure:0,pending:0},reviewThreads:{total:1,resolved:1,unresolved:0}},Ke={number:165,title:"refactor: migrate auth module to JWT tokens with refresh support",url:"https://github.com/example/project/pull/165",state:"OPEN",isDraft:!0,reviewDecision:null,additions:340,deletions:156,changedFiles:18,checks:[{name:"CI / Build",status:"IN_PROGRESS",conclusion:null},{name:"CI / Test",status:"QUEUED",conclusion:null}],checksSummary:{total:2,success:0,failure:0,pending:2},reviewThreads:{total:0,resolved:0,unresolved:0}},Je={number:155,title:"feat(cli): add service install/uninstall and separate dev/prod ports",url:"https://github.com/example/project/pull/155",state:"MERGED",isDraft:!1,reviewDecision:"APPROVED",additions:287,deletions:63,changedFiles:11,checks:[{name:"CI / Build",status:"COMPLETED",conclusion:"SUCCESS"},{name:"CI / Test",status:"COMPLETED",conclusion:"SUCCESS"},{name:"CI / Lint",status:"COMPLETED",conclusion:"SUCCESS"}],checksSummary:{total:3,success:3,failure:0,pending:0},reviewThreads:{total:3,resolved:3,unresolved:0}},Ye=[{name:"filesystem",status:"connected",config:{type:"stdio",command:"npx",args:["-y","@anthropic/mcp-fs"]},scope:"project",tools:[{name:"read_file",annotations:{readOnly:!0}},{name:"write_file",annotations:{destructive:!0}},{name:"list_directory",annotations:{readOnly:!0}}]},{name:"github",status:"connected",config:{type:"stdio",command:"npx",args:["-y","@anthropic/mcp-github"]},scope:"user",tools:[{name:"create_issue"},{name:"list_prs",annotations:{readOnly:!0}},{name:"create_pr"}]},{name:"postgres",status:"failed",error:"Connection refused: ECONNREFUSED 127.0.0.1:5432",config:{type:"stdio",command:"npx",args:["-y","@anthropic/mcp-postgres"]},scope:"project",tools:[]},{name:"web-search",status:"disabled",config:{type:"sse",url:"http://localhost:8080/sse"},scope:"user",tools:[{name:"search",annotations:{readOnly:!0,openWorld:!0}}]},{name:"docker",status:"connecting",config:{type:"stdio",command:"docker-mcp-server"},scope:"project",tools:[]}],T={identifier:"THE-147",title:"Associer un ticket Linear a une session dans le panneau lateral droit",priorityLabel:"High",stateName:"In Progress",teamName:"Thevibecompany"},I={identifier:"ENG-256",title:"Fix authentication flow for SSO users",priorityLabel:"Urgent",stateName:"Done",teamName:"Engineering"},Qe=[{id:"c1",body:"Started working on the sidebar integration",createdAt:new Date(Date.now()-36e5).toISOString(),userName:"Alice"},{id:"c2",body:"Added the search component, LGTM",createdAt:new Date(Date.now()-18e5).toISOString(),userName:"Bob"},{id:"c3",body:"Testing the polling flow now",createdAt:new Date(Date.now()-3e5).toISOString(),userName:"Alice"}];function os(){const[t,c]=u.useState(()=>document.documentElement.classList.contains("dark"));return u.useEffect(()=>{document.documentElement.classList.toggle("dark",t)},[t]),u.useEffect(()=>{const n=j.getState(),i=j.getState(),r=b,m=i.sessions.get(r),l=i.messages.get(r),h=i.pendingPermissions.get(r),o=i.connectionStatus.get(r),x=i.cliConnected.get(r),a=i.sessionStatus.get(r),y=i.streaming.get(r),N=i.streamingStartedAt.get(r),p=i.streamingOutputTokens.get(r),D={session_id:r,backend_type:"claude",model:"claude-sonnet-4-5",cwd:"/Users/stan/Dev/project",tools:["Bash","Read","Edit","Write","Glob","Grep","WebSearch"],permissionMode:"default",claude_code_version:"1.0.0",mcp_servers:[],agents:[],slash_commands:["explain","review","fix"],skills:["doc-coauthoring","frontend-design"],total_cost_usd:.1847,num_turns:14,context_used_percent:62,is_compacting:!1,git_branch:"feat/jwt-auth",is_worktree:!1,is_containerized:!0,repo_root:"/Users/stan/Dev/project",git_ahead:3,git_behind:0,total_lines_added:142,total_lines_removed:38};n.addSession(D),n.setConnectionStatus(r,"connected"),n.setCliConnected(r,!0),n.setSessionStatus(r,"running");const ee="I'm updating tests and then I'll run the full suite.";return n.setMessages(r,[ae,ie,ce,oe,{id:"stream-draft",role:"assistant",content:ee,timestamp:Date.now(),isStreaming:!0}]),n.setStreaming(r,ee),n.setStreamingStats(r,{startedAt:Date.now()-12e3,outputTokens:1200}),n.addPermission(r,ne),n.addPermission(r,re),()=>{j.setState(k=>{const G=new Map(k.sessions),W=new Map(k.messages),V=new Map(k.pendingPermissions),z=new Map(k.connectionStatus),F=new Map(k.cliConnected),H=new Map(k.sessionStatus),$=new Map(k.streaming),q=new Map(k.streamingStartedAt),K=new Map(k.streamingOutputTokens);return m?G.set(r,m):G.delete(r),l?W.set(r,l):W.delete(r),h?V.set(r,h):V.delete(r),o?z.set(r,o):z.delete(r),typeof x=="boolean"?F.set(r,x):F.delete(r),a?H.set(r,a):H.delete(r),typeof y=="string"?$.set(r,y):$.delete(r),typeof N=="number"?q.set(r,N):q.delete(r),typeof p=="number"?K.set(r,p):K.delete(r),{sessions:G,messages:W,pendingPermissions:V,connectionStatus:z,cliConnected:F,sessionStatus:H,streaming:$,streamingStartedAt:q,streamingOutputTokens:K}})}},[]),e.jsxs("div",{className:"fixed inset-0 bg-cc-bg text-cc-fg font-sans-ui overflow-y-auto",children:[e.jsx("header",{className:"sticky top-0 z-50 bg-cc-sidebar border-b border-cc-border",children:e.jsxs("div",{className:"max-w-5xl mx-auto px-6 py-4 flex items-center justify-between",children:[e.jsxs("div",{children:[e.jsx("h1",{className:"text-lg font-semibold text-cc-fg tracking-tight",children:"Component Playground"}),e.jsx("p",{className:"text-xs text-cc-muted mt-0.5",children:"Visual catalog of all UI components"})]}),e.jsxs("div",{className:"flex items-center gap-3",children:[e.jsx("button",{onClick:()=>{const n=j.getState().currentSessionId;n?xe(n):me()},className:"px-3 py-1.5 text-xs font-medium rounded-lg bg-cc-hover hover:bg-cc-active text-cc-fg border border-cc-border transition-colors cursor-pointer",children:"Back to App"}),e.jsx("button",{onClick:()=>c(!t),className:"px-3 py-1.5 text-xs font-medium rounded-lg bg-cc-primary/10 hover:bg-cc-primary/20 text-cc-primary border border-cc-primary/20 transition-colors cursor-pointer",children:t?"Light Mode":"Dark Mode"})]})]})}),e.jsxs("div",{className:"max-w-5xl mx-auto px-6 py-8 space-y-12",children:[e.jsx(d,{title:"Permission Banners",description:"Tool approval requests shown above the composer",children:e.jsxs("div",{className:"border border-cc-border rounded-xl overflow-hidden bg-cc-card divide-y divide-cc-border",children:[e.jsx(f,{permission:ne,sessionId:b}),e.jsx(f,{permission:ye,sessionId:b}),e.jsx(f,{permission:ke,sessionId:b}),e.jsx(f,{permission:_e,sessionId:b}),e.jsx(f,{permission:Se,sessionId:b}),e.jsx(f,{permission:Ce,sessionId:b}),e.jsx(f,{permission:Ee,sessionId:b}),e.jsx(f,{permission:re,sessionId:b}),e.jsx(f,{permission:De,sessionId:b})]})}),e.jsx(d,{title:"Real Chat Stack",description:"Integrated ChatView using real MessageFeed + PermissionBanner + Composer components",children:e.jsx("div",{"data-testid":"playground-real-chat-stack",className:"max-w-3xl border border-cc-border rounded-xl overflow-hidden bg-cc-card h-[620px]",children:e.jsx(pe,{sessionId:b})})}),e.jsx(d,{title:"ExitPlanMode",description:"Plan approval request — previously rendered as raw JSON, now shows formatted markdown",children:e.jsx("div",{className:"border border-cc-border rounded-xl overflow-hidden bg-cc-card",children:e.jsx(f,{permission:Ae,sessionId:b})})}),e.jsx(d,{title:"AskUserQuestion",description:"Interactive questions with selectable options",children:e.jsxs("div",{className:"space-y-4",children:[e.jsx(s,{label:"Single question",children:e.jsx(f,{permission:Me,sessionId:b})}),e.jsx(s,{label:"Multi-question",children:e.jsx(f,{permission:Pe,sessionId:b})})]})}),e.jsx(d,{title:"AI Validation",description:"AI-powered permission validation badges and recommendations",children:e.jsxs("div",{className:"space-y-4",children:[e.jsx(s,{label:"Permission with AI recommendation (uncertain)",children:e.jsx(f,{permission:Re,sessionId:b})}),e.jsx(s,{label:"Permission with AI recommendation (safe)",children:e.jsx(f,{permission:Te,sessionId:b})}),e.jsx(s,{label:"Permission with AI recommendation (dangerous)",children:e.jsx(f,{permission:Ie,sessionId:b})}),e.jsx(s,{label:"Per-session toggle (disabled)",children:e.jsx(de,{enabled:!1})}),e.jsx(s,{label:"Per-session toggle (enabled)",children:e.jsx(de,{enabled:!0})}),e.jsx(s,{label:"Auto-resolved badge (with dismiss)",children:e.jsx("div",{className:"border border-cc-border rounded-xl overflow-hidden bg-cc-card",children:e.jsx(J,{entry:{request:g({tool_name:"Read",input:{file_path:"/src/index.ts"}}),behavior:"allow",reason:"Read is a read-only tool",timestamp:Date.now()},onDismiss:()=>alert("Dismissed!")})})}),e.jsx(s,{label:"Auto-resolved badge (denied, with dismiss)",children:e.jsx("div",{className:"border border-cc-border rounded-xl overflow-hidden bg-cc-card",children:e.jsx(J,{entry:{request:g({tool_name:"Bash",input:{command:"rm -rf /"}}),behavior:"deny",reason:"Recursive delete of root directory",timestamp:Date.now()},onDismiss:()=>alert("Dismissed!")})})}),e.jsx(s,{label:"Auto-resolved badge (no dismiss)",children:e.jsx("div",{className:"border border-cc-border rounded-xl overflow-hidden bg-cc-card",children:e.jsx(J,{entry:{request:g({tool_name:"Grep",input:{pattern:"TODO",path:"/src"}}),behavior:"allow",reason:"Grep is a read-only tool",timestamp:Date.now()}})})})]})}),e.jsx(d,{title:"Messages",description:"Chat message bubbles for all roles",children:e.jsxs("div",{className:"space-y-4 max-w-3xl",children:[e.jsx(s,{label:"User message",children:e.jsx(v,{message:ae})}),e.jsx(s,{label:"User message with image",children:e.jsx(v,{message:Le})}),e.jsx(s,{label:"Assistant message (markdown)",children:e.jsx(v,{message:ie})}),e.jsx(s,{label:"Assistant message (with tool calls)",children:e.jsx(v,{message:ce})}),e.jsx(s,{label:"Assistant message (streaming)",children:e.jsx(v,{message:Ue})}),e.jsx(s,{label:"Assistant message (streaming thinking phase)",children:e.jsx(v,{message:Oe})}),e.jsx(s,{label:"Assistant message (thinking block)",children:e.jsx(v,{message:Be})}),e.jsx(s,{label:"Tool result with error",children:e.jsx(v,{message:oe})}),e.jsx(s,{label:"System message",children:e.jsx(v,{message:Ge})})]})}),e.jsx(d,{title:"Tool Blocks",description:"Expandable tool call visualization",children:e.jsxs("div",{className:"space-y-2 max-w-3xl",children:[e.jsx(w,{name:"Bash",input:{command:"git status && npm run lint",description:"Check git status and lint"},toolUseId:"tb-1"}),e.jsx(w,{name:"Read",input:{file_path:"/Users/stan/Dev/project/src/index.ts",offset:10,limit:50},toolUseId:"tb-2"}),e.jsx(w,{name:"Edit",input:{file_path:"src/utils.ts",old_string:"const x = 1;",new_string:"const x = 2;",replace_all:!0},toolUseId:"tb-3"}),e.jsx(w,{name:"Edit",input:{file_path:"/Users/stan/Dev/project/src/store.ts",changes:[{path:"/Users/stan/Dev/project/src/store.ts",kind:"update"},{path:"/Users/stan/Dev/project/src/ws.ts",kind:"update"}]},toolUseId:"tb-3b"}),e.jsx(w,{name:"Write",input:{file_path:"src/new-file.ts",content:`export const hello = "world";
+`},toolUseId:"tb-4"}),e.jsx(w,{name:"Glob",input:{pattern:"**/*.tsx",path:"/Users/stan/Dev/project/src"},toolUseId:"tb-5"}),e.jsx(w,{name:"Grep",input:{pattern:"useEffect",path:"src/",glob:"*.tsx",output_mode:"content",context:3,head_limit:20},toolUseId:"tb-6"}),e.jsx(w,{name:"WebSearch",input:{query:"React 19 new features",allowed_domains:["react.dev","github.com"]},toolUseId:"tb-7"}),e.jsx(w,{name:"WebFetch",input:{url:"https://react.dev/blog/2024/12/05/react-19",prompt:"Summarize the key changes in React 19"},toolUseId:"tb-8"}),e.jsx(w,{name:"Task",input:{description:"Search for auth patterns",subagent_type:"Explore",prompt:"Find all files related to authentication and authorization in the codebase. Look for middleware, guards, and token handling."},toolUseId:"tb-9"}),e.jsx(w,{name:"TodoWrite",input:{todos:[{content:"Create JWT utility module",status:"completed",activeForm:"Creating JWT module"},{content:"Update auth middleware",status:"in_progress",activeForm:"Updating middleware"},{content:"Migrate login endpoint",status:"pending",activeForm:"Migrating login"},{content:"Run full test suite",status:"pending",activeForm:"Running tests"}]},toolUseId:"tb-10"}),e.jsx(w,{name:"NotebookEdit",input:{notebook_path:"/Users/stan/Dev/project/analysis.ipynb",cell_type:"code",edit_mode:"replace",cell_number:3,new_source:`import pandas as pd
+df = pd.read_csv('data.csv')
+df.describe()`},toolUseId:"tb-11"}),e.jsx(w,{name:"SendMessage",input:{type:"message",recipient:"researcher",content:"Please investigate the auth module structure and report back.",summary:"Requesting auth module investigation"},toolUseId:"tb-12"})]})}),e.jsx(d,{title:"Tool Progress",description:"Real-time progress indicator shown while tools are running",children:e.jsxs("div",{className:"space-y-4 max-w-3xl",children:[e.jsx(s,{label:"Single tool running",children:e.jsxs("div",{className:"flex items-center gap-1.5 text-[11px] text-cc-muted font-mono-code pl-9",children:[e.jsx("span",{className:"inline-block w-1.5 h-1.5 rounded-full bg-cc-primary animate-pulse"}),e.jsx("span",{children:"Terminal"}),e.jsx("span",{className:"text-cc-muted/60",children:"8s"})]})}),e.jsx(s,{label:"Multiple tools running",children:e.jsxs("div",{className:"flex items-center gap-1.5 text-[11px] text-cc-muted font-mono-code pl-9",children:[e.jsx("span",{className:"inline-block w-1.5 h-1.5 rounded-full bg-cc-primary animate-pulse"}),e.jsx("span",{children:"Search Content"}),e.jsx("span",{className:"text-cc-muted/60",children:"3s"}),e.jsx("span",{className:"text-cc-muted/40",children:"·"}),e.jsx("span",{children:"Find Files"}),e.jsx("span",{className:"text-cc-muted/60",children:"2s"})]})})]})}),e.jsx(d,{title:"Compacting Context",description:"Spinner shown in the message feed when Claude Code is compacting context",children:e.jsx("div",{className:"space-y-4 max-w-3xl",children:e.jsx(s,{label:"Compacting indicator",children:e.jsxs("div",{className:"flex items-center gap-1.5 text-[11px] text-cc-warning font-mono-code pl-9",children:[e.jsxs("svg",{className:"w-3 h-3 animate-spin shrink-0",viewBox:"0 0 16 16",fill:"none",stroke:"currentColor",strokeWidth:"2",children:[e.jsx("circle",{cx:"8",cy:"8",r:"6",opacity:"0.25"}),e.jsx("path",{d:"M8 2a6 6 0 0 1 6 6",strokeLinecap:"round"})]}),e.jsx("span",{children:"Compacting context..."})]})})})}),e.jsx(d,{title:"Tool Use Summary",description:"System message summarizing batch tool execution",children:e.jsx("div",{className:"space-y-4 max-w-3xl",children:e.jsx(s,{label:"Summary as system message",children:e.jsx(v,{message:{id:"summary-1",role:"system",content:"Read 4 files, searched 12 matches across 3 directories",timestamp:Date.now()}})})})}),e.jsx(d,{title:"Interesting Events",description:"Event summaries that are worth surfacing in the chat feed",children:e.jsxs("div",{className:"space-y-4 max-w-3xl",children:[e.jsx(s,{label:"Context compacted",children:e.jsx(v,{message:{id:"event-compact",role:"system",content:"Context compacted (auto, pre-tokens: 182344).",timestamp:Date.now()}})}),e.jsx(s,{label:"Background task completed",children:e.jsx(v,{message:{id:"event-task",role:"system",content:"Task completed: a1b2c3d. Build finished successfully.",timestamp:Date.now()}})}),e.jsx(s,{label:"Files persisted",children:e.jsx(v,{message:{id:"event-files",role:"system",content:"Persisted 3 file(s).",timestamp:Date.now()}})}),e.jsx(s,{label:"Hook outcome",children:e.jsx(v,{message:{id:"event-hook",role:"system",content:"Hook success: lint (post_tool_use) (exit 0).",timestamp:Date.now()}})})]})}),e.jsx(d,{title:"Tasks",description:"Task list states: pending, in progress, completed, blocked",children:e.jsxs("div",{className:"w-[280px] border border-cc-border rounded-xl overflow-hidden bg-cc-card",children:[e.jsxs("div",{className:"px-4 py-3 border-b border-cc-border space-y-2.5",children:[e.jsxs("div",{className:"flex items-center justify-between",children:[e.jsx("span",{className:"text-[11px] text-cc-muted uppercase tracking-wider",children:"Cost"}),e.jsx("span",{className:"text-[13px] font-medium text-cc-fg tabular-nums",children:"$0.1847"})]}),e.jsxs("div",{className:"space-y-1",children:[e.jsxs("div",{className:"flex items-center justify-between",children:[e.jsx("span",{className:"text-[11px] text-cc-muted uppercase tracking-wider",children:"Context"}),e.jsx("span",{className:"text-[11px] text-cc-muted tabular-nums",children:"62%"})]}),e.jsx("div",{className:"w-full h-1.5 rounded-full bg-cc-hover overflow-hidden",children:e.jsx("div",{className:"h-full rounded-full bg-cc-warning transition-all duration-500",style:{width:"62%"}})})]}),e.jsxs("div",{className:"flex items-center justify-between",children:[e.jsx("span",{className:"text-[11px] text-cc-muted uppercase tracking-wider",children:"Turns"}),e.jsx("span",{className:"text-[13px] font-medium text-cc-fg tabular-nums",children:"14"})]})]}),e.jsxs("div",{className:"px-4 py-2.5 border-b border-cc-border flex items-center justify-between",children:[e.jsx("span",{className:"text-[12px] font-semibold text-cc-fg",children:"Tasks"}),e.jsxs("span",{className:"text-[11px] text-cc-muted tabular-nums",children:["2/",le.length]})]}),e.jsx("div",{className:"px-3 py-2 space-y-0.5",children:le.map(n=>e.jsx(as,{task:n},n.id))})]})}),e.jsx(d,{title:"GitHub PR Status",description:"PR health shown in the TaskPanel — checks, reviews, unresolved comments",children:e.jsxs("div",{className:"space-y-4",children:[e.jsx(s,{label:"Open PR — failing checks + changes requested",children:e.jsx("div",{className:"w-[280px] border border-cc-border rounded-xl overflow-hidden bg-cc-card",children:e.jsx(M,{pr:$e})})}),e.jsx(s,{label:"Open PR — all checks passed + approved",children:e.jsx("div",{className:"w-[280px] border border-cc-border rounded-xl overflow-hidden bg-cc-card",children:e.jsx(M,{pr:qe})})}),e.jsx(s,{label:"Draft PR — pending checks",children:e.jsx("div",{className:"w-[280px] border border-cc-border rounded-xl overflow-hidden bg-cc-card",children:e.jsx(M,{pr:Ke})})}),e.jsx(s,{label:"Merged PR",children:e.jsx("div",{className:"w-[280px] border border-cc-border rounded-xl overflow-hidden bg-cc-card",children:e.jsx(M,{pr:Je})})})]})}),e.jsx(d,{title:"Linear Issue (TaskPanel)",description:"Linear issue linked to a session — displayed in TaskPanel with status, comments, and actions",children:e.jsxs("div",{className:"space-y-4",children:[e.jsx(s,{label:"Active issue — In Progress with comments",children:e.jsxs("div",{className:"w-[280px] border border-cc-border rounded-xl overflow-hidden bg-cc-card",children:[e.jsxs("div",{className:"px-4 py-3 space-y-2",children:[e.jsxs("div",{className:"flex items-center gap-1.5",children:[e.jsx(Y,{className:"w-3.5 h-3.5 text-cc-muted shrink-0"}),e.jsx("span",{className:"text-[12px] font-semibold text-cc-fg font-mono-code",children:T.identifier}),e.jsx("span",{className:"text-[9px] font-medium px-1.5 rounded-full leading-[16px] text-blue-400 bg-blue-400/10",children:T.stateName}),e.jsx("button",{className:"ml-auto flex items-center justify-center w-5 h-5 rounded text-cc-muted hover:text-cc-fg hover:bg-cc-hover transition-colors cursor-pointer",title:"Unlink",children:e.jsx("svg",{viewBox:"0 0 16 16",fill:"none",stroke:"currentColor",strokeWidth:"1.5",className:"w-3 h-3",children:e.jsx("path",{d:"M4 4l8 8M12 4l-8 8"})})})]}),e.jsx("p",{className:"text-[11px] text-cc-muted truncate",children:T.title}),e.jsxs("div",{className:"flex items-center gap-2 text-[10px] text-cc-muted",children:[e.jsx("span",{children:T.priorityLabel}),e.jsx("span",{children:"·"}),e.jsx("span",{children:T.teamName}),e.jsx("span",{children:"·"}),e.jsx("span",{children:"@ Alice"})]}),e.jsxs("div",{className:"flex flex-wrap gap-1",children:[e.jsx("span",{className:"text-[9px] px-1.5 py-0.5 rounded-full",style:{backgroundColor:"#bb87fc20",color:"#bb87fc"},children:"feature"}),e.jsx("span",{className:"text-[9px] px-1.5 py-0.5 rounded-full",style:{backgroundColor:"#f2994a20",color:"#f2994a"},children:"frontend"})]})]}),e.jsxs("div",{className:"px-4 py-2 border-t border-cc-border space-y-1.5 max-h-36 overflow-y-auto",children:[e.jsx("span",{className:"text-[10px] text-cc-muted uppercase tracking-wider",children:"Comments"}),Qe.map(n=>e.jsxs("div",{className:"text-[11px]",children:[e.jsxs("div",{className:"flex items-center gap-1",children:[e.jsx("span",{className:"font-medium text-cc-fg",children:n.userName}),e.jsx("span",{className:"text-[9px] text-cc-muted",children:"just now"})]}),e.jsx("p",{className:"text-cc-muted line-clamp-2",children:n.body})]},n.id))]}),e.jsxs("div",{className:"px-4 py-2 border-t border-cc-border flex items-center gap-1.5",children:[e.jsx("input",{type:"text",placeholder:"Add a comment...",className:"flex-1 text-[11px] bg-transparent border border-cc-border rounded-md px-2 py-1.5 text-cc-fg placeholder:text-cc-muted focus:outline-none focus:border-cc-primary/50"}),e.jsx("button",{className:"flex items-center justify-center w-6 h-6 rounded text-cc-primary cursor-pointer",children:e.jsx("svg",{viewBox:"0 0 16 16",fill:"currentColor",className:"w-3.5 h-3.5",children:e.jsx("path",{d:"M1.724 1.053a.5.5 0 0 0-.714.545l1.403 4.85a.5.5 0 0 0 .397.354l5.19.736-5.19.737a.5.5 0 0 0-.397.353L1.01 13.48a.5.5 0 0 0 .714.545l13-6.5a.5.5 0 0 0 0-.894l-13-6.5z"})})})]})]})}),e.jsx(s,{label:"Completed issue — Done warning banner",children:e.jsxs("div",{className:"w-[280px] border border-cc-border rounded-xl overflow-hidden bg-cc-card",children:[e.jsxs("div",{className:"px-4 py-3 space-y-2",children:[e.jsxs("div",{className:"flex items-center gap-1.5",children:[e.jsx(Y,{className:"w-3.5 h-3.5 text-cc-muted shrink-0"}),e.jsx("span",{className:"text-[12px] font-semibold text-cc-fg font-mono-code",children:I.identifier}),e.jsx("span",{className:"text-[9px] font-medium px-1.5 rounded-full leading-[16px] text-cc-success bg-cc-success/10",children:I.stateName})]}),e.jsx("p",{className:"text-[11px] text-cc-muted truncate",children:I.title}),e.jsxs("div",{className:"flex items-center gap-2 text-[10px] text-cc-muted",children:[e.jsx("span",{children:I.priorityLabel}),e.jsx("span",{children:"·"}),e.jsx("span",{children:I.teamName})]})]}),e.jsxs("div",{className:"px-4 py-2 bg-cc-success/10 border-t border-cc-success/20 flex items-center justify-between gap-2",children:[e.jsxs("div",{className:"min-w-0",children:[e.jsx("p",{className:"text-[11px] text-cc-success font-medium",children:"Issue completed"}),e.jsx("p",{className:"text-[10px] text-cc-success/80",children:"Ticket moved to done."})]}),e.jsxs("div",{className:"flex items-center gap-1.5 shrink-0",children:[e.jsx("button",{className:"text-[10px] text-cc-muted hover:text-cc-fg px-1.5 py-0.5 rounded cursor-pointer",children:"Dismiss"}),e.jsx("button",{className:"text-[10px] text-cc-success font-medium px-2 py-0.5 rounded bg-cc-success/20 hover:bg-cc-success/30 cursor-pointer",children:"Close session"})]})]})]})}),e.jsx(s,{label:"No linked issue — Link button",children:e.jsx("div",{className:"w-[280px] border border-cc-border rounded-xl overflow-hidden bg-cc-card",children:e.jsx("div",{className:"shrink-0 px-4 py-3 border-b border-cc-border",children:e.jsxs("button",{className:"flex items-center gap-1.5 text-[11px] text-cc-muted hover:text-cc-fg transition-colors cursor-pointer",children:[e.jsx(Y,{className:"w-3.5 h-3.5"}),"Link Linear issue"]})})})})]})}),e.jsx(d,{title:"MCP Servers",description:"MCP server status display with toggle, reconnect, and tool listing",children:e.jsx("div",{className:"space-y-4",children:e.jsx(s,{label:"All server states (connected, failed, disabled, connecting)",children:e.jsxs("div",{className:"w-[280px] border border-cc-border rounded-xl overflow-hidden bg-cc-card",children:[e.jsxs("div",{className:"shrink-0 px-4 py-2.5 border-b border-cc-border flex items-center justify-between",children:[e.jsxs("span",{className:"text-[12px] font-semibold text-cc-fg flex items-center gap-1.5",children:[e.jsx("svg",{viewBox:"0 0 16 16",fill:"currentColor",className:"w-3.5 h-3.5 text-cc-muted",children:e.jsx("path",{d:"M1.5 3A1.5 1.5 0 013 1.5h10A1.5 1.5 0 0114.5 3v1A1.5 1.5 0 0113 5.5H3A1.5 1.5 0 011.5 4V3zm0 5A1.5 1.5 0 013 6.5h10A1.5 1.5 0 0114.5 8v1A1.5 1.5 0 0113 10.5H3A1.5 1.5 0 011.5 9V8zm0 5A1.5 1.5 0 013 11.5h10a1.5 1.5 0 011.5 1.5v1a1.5 1.5 0 01-1.5 1.5H3A1.5 1.5 0 011.5 14v-1z"})}),"MCP Servers"]}),e.jsx("span",{className:"text-[11px] text-cc-muted",children:e.jsxs("svg",{viewBox:"0 0 16 16",fill:"none",stroke:"currentColor",strokeWidth:"1.5",className:"w-3.5 h-3.5",children:[e.jsx("path",{d:"M2.5 8a5.5 5.5 0 019.78-3.5M13.5 8a5.5 5.5 0 01-9.78 3.5",strokeLinecap:"round"}),e.jsx("path",{d:"M12.5 2v3h-3M3.5 14v-3h3",strokeLinecap:"round",strokeLinejoin:"round"})]})})]}),e.jsx("div",{className:"px-3 py-2 space-y-1.5",children:Ye.map(n=>e.jsx(rs,{server:n},n.name))})]})})})}),e.jsx(d,{title:"Panel Config View",description:"Inline configuration for the right sidebar — toggle sections on/off and reorder them",children:e.jsx("div",{className:"space-y-4",children:e.jsx(s,{label:"Config mode with mixed enabled/disabled sections",children:e.jsxs("div",{className:"w-[320px] border border-cc-border rounded-xl overflow-hidden bg-cc-card",children:[e.jsxs("div",{className:"shrink-0 flex items-center justify-between px-4 py-3 border-b border-cc-border",children:[e.jsx("span",{className:"text-sm font-semibold text-cc-fg tracking-tight",children:"Panel Settings"}),e.jsx("button",{className:"flex items-center justify-center w-6 h-6 rounded-lg text-cc-muted hover:text-cc-fg hover:bg-cc-hover transition-colors cursor-pointer",children:e.jsx("svg",{viewBox:"0 0 16 16",fill:"none",stroke:"currentColor",strokeWidth:"1.5",className:"w-3.5 h-3.5",children:e.jsx("path",{d:"M4 4l8 8M12 4l-8 8"})})})]}),e.jsx("div",{className:"px-3 py-3 space-y-1",children:[{id:"git-branch",label:"Git Branch",desc:"Current branch, ahead/behind, and line changes",enabled:!0},{id:"usage-limits",label:"Usage Limits",desc:"API usage and rate limit meters",enabled:!0},{id:"github-pr",label:"GitHub PR",desc:"Pull request status, CI checks, and reviews",enabled:!1},{id:"linear-issue",label:"Linear Issue",desc:"Linked Linear ticket and comments",enabled:!0},{id:"mcp-servers",label:"MCP Servers",desc:"Model Context Protocol server connections",enabled:!1},{id:"tasks",label:"Tasks",desc:"Agent task list and progress",enabled:!0}].map((n,i,r)=>e.jsxs("div",{className:`flex items-center gap-2 px-2.5 py-2 rounded-lg border border-cc-border transition-opacity ${n.enabled?"bg-cc-bg":"bg-cc-hover/50 opacity-60"}`,children:[e.jsxs("div",{className:"flex flex-col gap-0.5 shrink-0",children:[e.jsx("button",{disabled:i===0,className:"w-5 h-4 flex items-center justify-center text-cc-muted hover:text-cc-fg disabled:opacity-20 disabled:cursor-not-allowed cursor-pointer transition-colors",children:e.jsx("svg",{viewBox:"0 0 16 16",fill:"currentColor",className:"w-3 h-3",children:e.jsx("path",{d:"M8 4l4 4H4l4-4z"})})}),e.jsx("button",{disabled:i===r.length-1,className:"w-5 h-4 flex items-center justify-center text-cc-muted hover:text-cc-fg disabled:opacity-20 disabled:cursor-not-allowed cursor-pointer transition-colors",children:e.jsx("svg",{viewBox:"0 0 16 16",fill:"currentColor",className:"w-3 h-3",children:e.jsx("path",{d:"M8 12l4-4H4l4 4z"})})})]}),e.jsxs("div",{className:"flex-1 min-w-0",children:[e.jsx("span",{className:"text-[12px] font-medium text-cc-fg block",children:n.label}),e.jsx("span",{className:"text-[10px] text-cc-muted block truncate",children:n.desc})]}),e.jsx("button",{className:`shrink-0 w-8 h-[18px] rounded-full transition-colors cursor-pointer relative ${n.enabled?"bg-cc-primary":"bg-cc-hover"}`,role:"switch","aria-checked":n.enabled,children:e.jsx("span",{className:`absolute top-[2px] w-[14px] h-[14px] rounded-full bg-white shadow transition-transform ${n.enabled?"translate-x-[16px]":"translate-x-[2px]"}`})})]},n.id))}),e.jsxs("div",{className:"shrink-0 border-t border-cc-border px-3 py-2.5 flex items-center justify-between",children:[e.jsx("button",{className:"text-[11px] text-cc-muted hover:text-cc-fg transition-colors cursor-pointer",children:"Reset to defaults"}),e.jsx("button",{className:"text-[11px] font-medium text-cc-primary hover:text-cc-primary-hover transition-colors cursor-pointer",children:"Done"})]})]})})})}),e.jsx(d,{title:"Codex Session Details",description:"Rate limits and token details for Codex (OpenAI) sessions — streamed via session_update",children:e.jsx("div",{className:"space-y-4",children:e.jsx(s,{label:"Rate limits with token breakdown",children:e.jsx(ts,{})})})}),e.jsx(d,{title:"Update Banner",description:"Notification banner for available updates",children:e.jsxs("div",{className:"space-y-4 max-w-3xl",children:[e.jsx(s,{label:"Service mode (auto-update)",children:e.jsx(O,{updateInfo:{currentVersion:"0.22.1",latestVersion:"0.23.0",updateAvailable:!0,isServiceMode:!0,updateInProgress:!1,lastChecked:Date.now(),channel:"stable"}})}),e.jsx(s,{label:"Foreground mode (manual)",children:e.jsx(O,{updateInfo:{currentVersion:"0.22.1",latestVersion:"0.23.0",updateAvailable:!0,isServiceMode:!1,updateInProgress:!1,lastChecked:Date.now(),channel:"stable"}})}),e.jsx(s,{label:"Update in progress",children:e.jsx(O,{updateInfo:{currentVersion:"0.22.1",latestVersion:"0.23.0",updateAvailable:!0,isServiceMode:!0,updateInProgress:!0,lastChecked:Date.now(),channel:"stable"}})}),e.jsx(s,{label:"Prerelease channel update",children:e.jsx(O,{updateInfo:{currentVersion:"0.22.1",latestVersion:"0.23.0-preview.20260228120000.abc1234",updateAvailable:!0,isServiceMode:!0,updateInProgress:!1,lastChecked:Date.now(),channel:"prerelease"}})})]})}),e.jsx(d,{title:"Status Indicators",description:"Connection and session status banners",children:e.jsxs("div",{className:"space-y-3 max-w-3xl",children:[e.jsx(s,{label:"CLI Disconnected",children:e.jsxs("div",{className:"px-4 py-2 bg-cc-warning/10 border border-cc-warning/20 rounded-lg text-center flex items-center justify-center gap-3",children:[e.jsx("span",{className:"text-xs text-cc-warning font-medium",children:"CLI disconnected"}),e.jsx("span",{className:"text-xs font-medium px-3 py-1.5 rounded-md bg-cc-warning/20 text-cc-warning cursor-pointer",children:"Reconnect"})]})}),e.jsx(s,{label:"CLI Reconnecting",children:e.jsxs("div",{className:"px-4 py-2 bg-cc-warning/10 border border-cc-warning/20 rounded-lg text-center flex items-center justify-center gap-3",children:[e.jsx("span",{className:"w-3 h-3 rounded-full border-2 border-cc-warning/30 border-t-cc-warning animate-spin"}),e.jsx("span",{className:"text-xs text-cc-warning font-medium",children:"Reconnecting…"})]})}),e.jsx(s,{label:"Reconnection Error",children:e.jsxs("div",{className:"px-4 py-2 bg-cc-warning/10 border border-cc-warning/20 rounded-lg text-center flex items-center justify-center gap-3",children:[e.jsx("span",{className:"text-xs text-cc-error font-medium",children:"Reconnection failed"}),e.jsx("span",{className:"text-xs font-medium px-3 py-1.5 rounded-md bg-cc-error/15 text-cc-error cursor-pointer",children:"Retry"})]})}),e.jsx(s,{label:"WS Disconnected",children:e.jsx("div",{className:"px-4 py-2 bg-cc-warning/10 border border-cc-warning/20 rounded-lg text-center",children:e.jsx("span",{className:"text-xs text-cc-warning font-medium",children:"Reconnecting to session..."})})}),e.jsx(s,{label:"Connected",children:e.jsxs("div",{className:"flex items-center gap-2 px-3 py-2 bg-cc-card border border-cc-border rounded-lg",children:[e.jsx("span",{className:"w-2 h-2 rounded-full bg-cc-success"}),e.jsx("span",{className:"text-xs text-cc-fg font-medium",children:"Connected"}),e.jsx("span",{className:"text-[11px] text-cc-muted ml-auto",children:"claude-opus-4-6"})]})}),e.jsx(s,{label:"Running / Thinking",children:e.jsxs("div",{className:"flex items-center gap-2 px-3 py-2 bg-cc-card border border-cc-border rounded-lg",children:[e.jsx("span",{className:"w-2 h-2 rounded-full bg-cc-primary animate-[pulse-dot_1.5s_ease-in-out_infinite]"}),e.jsx("span",{className:"text-xs text-cc-fg font-medium",children:"Thinking"})]})}),e.jsx(s,{label:"Compacting",children:e.jsxs("div",{className:"flex items-center gap-2 px-3 py-2 bg-cc-card border border-cc-border rounded-lg",children:[e.jsx("svg",{className:"w-3.5 h-3.5 text-cc-muted animate-spin",viewBox:"0 0 16 16",fill:"none",children:e.jsx("circle",{cx:"8",cy:"8",r:"6",stroke:"currentColor",strokeWidth:"1.5",strokeDasharray:"28",strokeDashoffset:"8",strokeLinecap:"round"})}),e.jsx("span",{className:"text-xs text-cc-muted font-medium",children:"Compacting context..."})]})})]})}),e.jsx(d,{title:"Composer",description:"Message input bar with mode toggle, image upload, saved prompts (@), and send/stop buttons",children:e.jsxs("div",{className:"max-w-3xl",children:[e.jsx(s,{label:"Connected — code mode",children:e.jsx("div",{className:"border-t border-cc-border bg-cc-card px-4 py-3",children:e.jsx("div",{className:"relative bg-cc-input-bg/95 border border-cc-border rounded-[14px] shadow-[0_10px_30px_rgba(0,0,0,0.10)] overflow-visible",children:e.jsxs("div",{className:"flex items-end gap-2 px-2.5 py-2",children:[e.jsxs("div",{className:"mb-0.5 flex items-center gap-1.5 px-2.5 py-1.5 rounded-md border border-cc-border text-[12px] font-semibold text-cc-muted",children:[e.jsxs("svg",{viewBox:"0 0 16 16",fill:"currentColor",className:"w-3.5 h-3.5",children:[e.jsx("path",{d:"M2.5 4l4 4-4 4",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round",fill:"none"}),e.jsx("path",{d:"M8.5 4l4 4-4 4",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round",fill:"none"})]}),e.jsx("span",{children:"code"})]}),e.jsx("textarea",{readOnly:!0,value:"Can you refactor the auth module to use JWT?",rows:1,className:"flex-1 min-w-0 px-2 py-1.5 text-sm bg-transparent resize-none text-cc-fg font-sans-ui",style:{minHeight:"36px"}}),e.jsxs("div",{className:"mb-0.5 flex items-center gap-1.5",children:[e.jsx("div",{className:"flex items-center justify-center w-9 h-9 rounded-lg border border-cc-border text-cc-muted",children:e.jsxs("svg",{viewBox:"0 0 16 16",fill:"none",stroke:"currentColor",strokeWidth:"1.5",className:"w-4 h-4",children:[e.jsx("rect",{x:"2",y:"2",width:"12",height:"12",rx:"2"}),e.jsx("circle",{cx:"5.5",cy:"5.5",r:"1",fill:"currentColor",stroke:"none"}),e.jsx("path",{d:"M2 11l3-3 2 2 3-4 4 5",strokeLinecap:"round",strokeLinejoin:"round"})]})}),e.jsx("div",{className:"flex items-center justify-center w-9 h-9 rounded-full bg-cc-primary text-white shadow-[0_6px_20px_rgba(0,0,0,0.18)]",children:e.jsx("svg",{viewBox:"0 0 16 16",fill:"currentColor",className:"w-3.5 h-3.5",children:e.jsx("path",{d:"M3 2l11 6-11 6V9.5l7-1.5-7-1.5V2z"})})})]})]})})})}),e.jsx("div",{className:"mt-4"}),e.jsx(s,{label:"@ prompt insertion",children:e.jsx("div",{className:"border-t border-cc-border bg-cc-card px-4 py-3",children:e.jsxs("div",{className:"relative bg-cc-input-bg/95 border border-cc-border rounded-[14px] shadow-[0_10px_30px_rgba(0,0,0,0.10)] overflow-visible",children:[e.jsx("div",{className:"absolute left-2 right-2 bottom-full mb-1 max-h-[180px] overflow-y-auto bg-cc-card border border-cc-border rounded-[10px] shadow-lg z-20 py-1",children:e.jsxs("div",{className:"px-3 py-2 flex items-center gap-2.5 bg-cc-hover",children:[e.jsx("span",{className:"flex items-center justify-center w-6 h-6 rounded-md bg-cc-hover text-cc-muted shrink-0",children:"@"}),e.jsxs("div",{className:"flex-1 min-w-0",children:[e.jsx("div",{className:"text-[13px] font-medium text-cc-fg truncate",children:"@review-pr"}),e.jsx("div",{className:"text-[11px] text-cc-muted truncate",children:"Review this PR and list risks, regressions, and missing tests."})]}),e.jsx("span",{className:"text-[10px] text-cc-muted shrink-0",children:"project"})]})}),e.jsxs("div",{className:"flex items-end gap-2 px-2.5 py-2",children:[e.jsx("textarea",{readOnly:!0,value:"@rev",rows:1,className:"flex-1 min-w-0 px-2 py-1.5 text-sm bg-transparent resize-none text-cc-fg font-sans-ui",style:{minHeight:"36px"}}),e.jsx("div",{className:"mb-0.5 flex items-center gap-1.5",children:e.jsx("div",{className:"flex items-center justify-center w-9 h-9 rounded-lg border border-cc-border text-cc-muted",children:e.jsx("svg",{viewBox:"0 0 16 16",fill:"none",stroke:"currentColor",strokeWidth:"1.5",className:"w-4 h-4",children:e.jsx("path",{d:"M4 2.75h8A1.25 1.25 0 0113.25 4v9.25L8 10.5l-5.25 2.75V4A1.25 1.25 0 014 2.75z"})})})})]})]})})}),e.jsx("div",{className:"mt-4"}),e.jsx(s,{label:"Plan mode active",children:e.jsx("div",{className:"border-t border-cc-border bg-cc-card px-4 py-3",children:e.jsx("div",{className:"relative bg-cc-input-bg/95 border border-cc-primary/40 rounded-[14px] shadow-[0_10px_30px_rgba(0,0,0,0.10)] overflow-visible",children:e.jsxs("div",{className:"flex items-end gap-2 px-2.5 py-2",children:[e.jsxs("div",{className:"mb-0.5 flex items-center gap-1.5 px-2.5 py-1.5 rounded-md border border-cc-primary/40 text-[12px] font-semibold text-cc-primary bg-cc-primary/8",children:[e.jsxs("svg",{viewBox:"0 0 16 16",fill:"currentColor",className:"w-3.5 h-3.5",children:[e.jsx("rect",{x:"3",y:"3",width:"3.5",height:"10",rx:"0.75"}),e.jsx("rect",{x:"9.5",y:"3",width:"3.5",height:"10",rx:"0.75"})]}),e.jsx("span",{children:"plan"})]}),e.jsx("textarea",{readOnly:!0,value:"",placeholder:"Type a message... (/ + @)",rows:1,className:"flex-1 min-w-0 px-2 py-1.5 text-sm bg-transparent resize-none text-cc-fg font-sans-ui placeholder:text-cc-muted",style:{minHeight:"36px"}}),e.jsxs("div",{className:"mb-0.5 flex items-center gap-1.5",children:[e.jsx("div",{className:"flex items-center justify-center w-9 h-9 rounded-lg border border-cc-border text-cc-muted",children:e.jsxs("svg",{viewBox:"0 0 16 16",fill:"none",stroke:"currentColor",strokeWidth:"1.5",className:"w-4 h-4",children:[e.jsx("rect",{x:"2",y:"2",width:"12",height:"12",rx:"2"}),e.jsx("circle",{cx:"5.5",cy:"5.5",r:"1",fill:"currentColor",stroke:"none"}),e.jsx("path",{d:"M2 11l3-3 2 2 3-4 4 5",strokeLinecap:"round",strokeLinejoin:"round"})]})}),e.jsx("div",{className:"flex items-center justify-center w-9 h-9 rounded-full bg-cc-hover text-cc-muted",children:e.jsx("svg",{viewBox:"0 0 16 16",fill:"currentColor",className:"w-3.5 h-3.5",children:e.jsx("path",{d:"M3 2l11 6-11 6V9.5l7-1.5-7-1.5V2z"})})})]})]})})})}),e.jsx("div",{className:"mt-4"}),e.jsx(s,{label:"Running — stop button visible",children:e.jsx("div",{className:"border-t border-cc-border bg-cc-card px-4 py-3",children:e.jsx("div",{className:"relative bg-cc-input-bg/95 border border-cc-border rounded-[14px] shadow-[0_10px_30px_rgba(0,0,0,0.10)] overflow-visible",children:e.jsxs("div",{className:"flex items-end gap-2 px-2.5 py-2",children:[e.jsxs("div",{className:"mb-0.5 flex items-center gap-1.5 px-2.5 py-1.5 rounded-md border border-cc-border text-[12px] font-semibold text-cc-muted",children:[e.jsxs("svg",{viewBox:"0 0 16 16",fill:"currentColor",className:"w-3.5 h-3.5",children:[e.jsx("path",{d:"M2.5 4l4 4-4 4",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round",fill:"none"}),e.jsx("path",{d:"M8.5 4l4 4-4 4",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round",fill:"none"})]}),e.jsx("span",{children:"code"})]}),e.jsx("textarea",{readOnly:!0,value:"",placeholder:"Type a message... (/ for commands)",rows:1,className:"flex-1 min-w-0 px-2 py-1.5 text-sm bg-transparent resize-none text-cc-fg font-sans-ui placeholder:text-cc-muted",style:{minHeight:"36px"}}),e.jsxs("div",{className:"mb-0.5 flex items-center gap-1.5",children:[e.jsx("div",{className:"flex items-center justify-center w-9 h-9 rounded-lg border border-cc-border text-cc-muted",children:e.jsxs("svg",{viewBox:"0 0 16 16",fill:"none",stroke:"currentColor",strokeWidth:"1.5",className:"w-4 h-4",children:[e.jsx("rect",{x:"2",y:"2",width:"12",height:"12",rx:"2"}),e.jsx("circle",{cx:"5.5",cy:"5.5",r:"1",fill:"currentColor",stroke:"none"}),e.jsx("path",{d:"M2 11l3-3 2 2 3-4 4 5",strokeLinecap:"round",strokeLinejoin:"round"})]})}),e.jsx("div",{className:"flex items-center justify-center w-9 h-9 rounded-lg bg-cc-error/10 text-cc-error",children:e.jsx("svg",{viewBox:"0 0 16 16",fill:"currentColor",className:"w-3.5 h-3.5",children:e.jsx("rect",{x:"3",y:"3",width:"10",height:"10",rx:"1"})})})]})]})})})})]})}),e.jsx(d,{title:"Prompt Suggestions",description:"Suggestion chips from the CLI for predicted next user prompts",children:e.jsxs("div",{className:"max-w-3xl space-y-4",children:[e.jsx(s,{label:"Suggestion chips (idle state)",children:e.jsx("div",{className:"flex flex-wrap gap-2 p-3",children:["Fix the failing test","Add error handling","Refactor to use async/await"].map(n=>e.jsx("button",{type:"button",className:"px-3 py-1.5 text-sm rounded-full border border-cc-border bg-cc-card text-cc-fg hover:bg-cc-hover transition-colors",onClick:()=>alert(`Selected: ${n}`),children:n},n))})}),e.jsx(s,{label:"Suggestion chips (after completion)",children:e.jsx("div",{className:"flex flex-wrap gap-2 p-3",children:["Run the test suite","Deploy to staging","Update the README"].map(n=>e.jsx("button",{type:"button",className:"px-3 py-1.5 text-sm rounded-full border border-cc-primary/30 bg-cc-primary/5 text-cc-primary hover:bg-cc-primary/10 transition-colors",onClick:()=>alert(`Selected: ${n}`),children:n},n))})})]})}),e.jsx(d,{title:"Streaming Indicator",description:"Live typing animation shown while the assistant is generating",children:e.jsxs("div",{className:"space-y-4 max-w-3xl",children:[e.jsx(s,{label:"Streaming with cursor",children:e.jsxs("div",{className:"flex items-start gap-3",children:[e.jsx("div",{className:"w-6 h-6 rounded-full bg-cc-primary/10 flex items-center justify-center shrink-0 mt-0.5",children:e.jsx("svg",{viewBox:"0 0 16 16",fill:"none",className:"w-3.5 h-3.5 text-cc-primary",children:e.jsx("path",{d:"M8 1v14M1 8h14",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round"})})}),e.jsx("div",{className:"flex-1 min-w-0",children:e.jsxs("pre",{className:"font-serif-assistant text-[15px] text-cc-fg whitespace-pre-wrap break-words leading-relaxed",children:["I'll start by creating the JWT utility module with sign and verify helpers. Let me first check what dependencies are already installed...",e.jsx("span",{className:"inline-block w-0.5 h-4 bg-cc-primary ml-0.5 align-middle animate-[pulse-dot_0.8s_ease-in-out_infinite]"})]})})]})}),e.jsx(s,{label:"Generation stats bar",children:e.jsxs("div",{className:"flex items-center gap-1.5 text-[11px] text-cc-muted font-mono-code pl-9",children:[e.jsx("span",{className:"inline-block w-1.5 h-1.5 rounded-full bg-cc-primary animate-pulse"}),e.jsx("span",{children:"Generating..."}),e.jsx("span",{className:"text-cc-muted/60",children:"("}),e.jsx("span",{children:"12s"}),e.jsx("span",{className:"text-cc-muted/40",children:"·"}),e.jsx("span",{children:"↓ 1.2k"}),e.jsx("span",{className:"text-cc-muted/60",children:")"})]})})]})}),e.jsx(d,{title:"Tool Message Groups",description:"Consecutive same-tool calls collapsed into a single expandable row",children:e.jsxs("div",{className:"space-y-4 max-w-3xl",children:[e.jsx(s,{label:"Multi-item group (4 Reads)",children:e.jsx(Z,{toolName:"Read",items:We})}),e.jsx(s,{label:"Single-item group",children:e.jsx(Z,{toolName:"Glob",items:[{id:"sg-1",name:"Glob",input:{pattern:"src/auth/**/*.ts"}}]})})]})}),e.jsx(d,{title:"Subagent Groups",description:"Nested messages from Task tool subagents shown in a collapsible indent",children:e.jsx("div",{className:"space-y-4 max-w-3xl",children:e.jsx(s,{label:"Subagent with nested tool calls",children:e.jsx(ss,{description:"Search codebase for auth patterns",agentType:"Explore",status:"completed",senderThreadId:"thr_main",receiverThreadIds:["thr_sub_1","thr_sub_2"],receiverCount:2,items:Ve})})})}),e.jsx(d,{title:"Activity Tray",description:"Floating pill + expandable panel showing background agents and tasks — appears bottom-right of the chat area",children:e.jsx("div",{className:"space-y-4 max-w-3xl",children:e.jsx(s,{label:"With running agents + tasks (interactive)",children:e.jsx(is,{})})})}),e.jsx(d,{title:"Diff Viewer",description:"Unified diff rendering with word-level highlighting — used in ToolBlock, PermissionBanner, and DiffPanel",children:e.jsxs("div",{className:"space-y-4 max-w-3xl",children:[e.jsx(s,{label:"Edit diff (compact mode)",children:e.jsx(P,{oldText:`export function formatDate(d: Date) {
+  return d.toISOString();
+}`,newText:`export function formatDate(d: Date, locale = "en-US") {
+  return d.toLocaleDateString(locale, {
+    year: "numeric",
+    month: "short",
+    day: "numeric",
+  });
+}`,fileName:"src/utils/format.ts",mode:"compact"})}),e.jsx(s,{label:"New file diff (compact mode)",children:e.jsx(P,{newText:`export const config = {
+  apiUrl: "https://api.example.com",
+  timeout: 5000,
+  retries: 3,
+  debug: process.env.NODE_ENV !== "production",
+};
+`,fileName:"src/config.ts",mode:"compact"})}),e.jsx(s,{label:"Git diff (full mode with line numbers)",children:e.jsx(P,{unifiedDiff:`diff --git a/src/auth/middleware.ts b/src/auth/middleware.ts
+--- a/src/auth/middleware.ts
++++ b/src/auth/middleware.ts
+@@ -1,8 +1,12 @@
+-import { getSession } from "./session";
++import { verifyToken } from "./jwt";
++import type { Request, Response, NextFunction } from "express";
+
+-export function authMiddleware(req, res, next) {
+-  const session = getSession(req);
+-  if (!session?.userId) {
++export function authMiddleware(req: Request, res: Response, next: NextFunction) {
++  const header = req.headers.authorization;
++  if (!header?.startsWith("Bearer ")) {
+     return res.status(401).json({ error: "Unauthorized" });
+   }
+-  req.userId = session.userId;
++  const token = header.slice(7);
++  const payload = verifyToken(token);
++  if (!payload) return res.status(401).json({ error: "Invalid token" });
++  req.userId = payload.userId;
+   next();
+ }`,mode:"full"})}),e.jsx(s,{label:"No changes",children:e.jsx(P,{oldText:"same content",newText:"same content"})})]})}),e.jsx(d,{title:"Session Creation Progress",description:"Step-by-step progress indicator shown during session creation (SSE streaming)",children:e.jsxs("div",{className:"space-y-4 max-w-md",children:[e.jsx(s,{label:"In progress (container session)",children:e.jsx(A,{steps:[{step:"resolving_env",label:"Resolving environment...",status:"done"},{step:"pulling_image",label:"Pulling Docker image...",status:"done"},{step:"creating_container",label:"Starting container...",status:"in_progress"},{step:"launching_cli",label:"Launching Claude Code...",status:"in_progress"}]})}),e.jsx(s,{label:"Completed (worktree session)",children:e.jsx(A,{steps:[{step:"resolving_env",label:"Resolving environment...",status:"done"},{step:"fetching_git",label:"Fetching from remote...",status:"done"},{step:"checkout_branch",label:"Checking out feat/auth...",status:"done"},{step:"creating_worktree",label:"Creating worktree...",status:"done"},{step:"launching_cli",label:"Launching Claude Code...",status:"done"}]})}),e.jsx(s,{label:"Error during image pull",children:e.jsx(A,{steps:[{step:"resolving_env",label:"Resolving environment...",status:"done"},{step:"pulling_image",label:"Pulling Docker image...",status:"error"}],error:"Failed to pull docker.io/stangirard/the-companion:latest — connection timed out after 30s"})}),e.jsx(s,{label:"With streaming init script logs",children:e.jsx(A,{steps:[{step:"resolving_env",label:"Resolving environment...",status:"done"},{step:"pulling_image",label:"Image ready",status:"done"},{step:"creating_container",label:"Container running",status:"done"},{step:"running_init_script",label:"Running init script...",status:"in_progress",detail:"Installing dependencies..."}]})}),e.jsx(s,{label:"With streaming image pull logs",children:e.jsx(A,{steps:[{step:"resolving_env",label:"Resolving environment...",status:"done"},{step:"pulling_image",label:"Pulling Docker image...",status:"in_progress",detail:"Downloading layer 3/7 [=====>    ] 45%"}]})}),e.jsx(s,{label:"Error during init script",children:e.jsx(A,{steps:[{step:"resolving_env",label:"Resolving environment...",status:"done"},{step:"pulling_image",label:"Pulling Docker image...",status:"done"},{step:"creating_container",label:"Starting container...",status:"done"},{step:"running_init_script",label:"Running init script...",status:"error"}],error:`npm ERR! code ENOENT
+npm ERR! syscall open
+npm ERR! path /app/package.json`})})]})}),e.jsx(d,{title:"Session Launch Overlay",description:"Full-screen overlay shown during session creation, replacing the inline progress list",children:e.jsxs("div",{className:"space-y-4",children:[e.jsx(s,{label:"In progress (container session)",children:e.jsx("div",{className:"relative h-[360px] bg-cc-bg rounded-lg overflow-hidden border border-cc-border",children:e.jsx(L,{steps:[{step:"resolving_env",label:"Environment resolved",status:"done"},{step:"pulling_image",label:"Pulling Docker image...",status:"done"},{step:"creating_container",label:"Starting container...",status:"in_progress"},{step:"launching_cli",label:"Launching Claude Code...",status:"in_progress"}],backend:"claude",onCancel:()=>{}})})}),e.jsx(s,{label:"All steps done (launching)",children:e.jsx("div",{className:"relative h-[360px] bg-cc-bg rounded-lg overflow-hidden border border-cc-border",children:e.jsx(L,{steps:[{step:"resolving_env",label:"Environment resolved",status:"done"},{step:"fetching_git",label:"Fetch complete",status:"done"},{step:"creating_worktree",label:"Worktree created",status:"done"},{step:"launching_cli",label:"CLI launched",status:"done"}],backend:"claude"})})}),e.jsx(s,{label:"Error state",children:e.jsx("div",{className:"relative h-[400px] bg-cc-bg rounded-lg overflow-hidden border border-cc-border",children:e.jsx(L,{steps:[{step:"resolving_env",label:"Environment resolved",status:"done"},{step:"pulling_image",label:"Pulling Docker image...",status:"error"}],error:"Failed to pull docker.io/stangirard/the-companion:latest — connection timed out after 30s",backend:"claude",onCancel:()=>{}})})}),e.jsx(s,{label:"Codex backend",children:e.jsx("div",{className:"relative h-[320px] bg-cc-bg rounded-lg overflow-hidden border border-cc-border",children:e.jsx(L,{steps:[{step:"resolving_env",label:"Environment resolved",status:"done"},{step:"launching_cli",label:"Launching Codex...",status:"in_progress"}],backend:"codex",onCancel:()=>{}})})})]})}),e.jsx(d,{title:"Update Overlay",description:"Full-screen overlay shown when auto-update is in progress, polls server and reloads when ready",children:e.jsxs("div",{className:"space-y-4",children:[e.jsx(s,{label:"Installing phase",children:e.jsx("div",{className:"relative h-[360px] bg-cc-bg rounded-lg overflow-hidden border border-cc-border",children:e.jsx(B,{phase:"installing"})})}),e.jsx(s,{label:"Restarting phase",children:e.jsx("div",{className:"relative h-[360px] bg-cc-bg rounded-lg overflow-hidden border border-cc-border",children:e.jsx(B,{phase:"restarting"})})}),e.jsx(s,{label:"Waiting for server",children:e.jsx("div",{className:"relative h-[360px] bg-cc-bg rounded-lg overflow-hidden border border-cc-border",children:e.jsx(B,{phase:"waiting"})})}),e.jsx(s,{label:"Update complete",children:e.jsx("div",{className:"relative h-[360px] bg-cc-bg rounded-lg overflow-hidden border border-cc-border",children:e.jsx(B,{phase:"ready"})})})]})}),e.jsx(d,{title:"Docker Update Dialog",description:"Post-update dialog asking whether to also update the sandbox Docker image",children:e.jsxs("div",{className:"space-y-4",children:[e.jsx(s,{label:"Prompt phase",children:e.jsx(U,{phase:"prompt"})}),e.jsx(s,{label:"Pulling phase",children:e.jsx(U,{phase:"pulling"})}),e.jsx(s,{label:"Done phase",children:e.jsx(U,{phase:"done"})}),e.jsx(s,{label:"Error phase",children:e.jsx(U,{phase:"error"})})]})}),e.jsx(d,{title:"CLAUDE.md Editor",description:"Modal for viewing and editing project CLAUDE.md instructions",children:e.jsxs("div",{className:"space-y-4 max-w-3xl",children:[e.jsx(s,{label:"Open editor button (from TopBar)",children:e.jsx(ns,{})}),e.jsx(s,{label:"Terminal quick tabs (from TopBar)",children:e.jsx(es,{})})]})}),e.jsx(d,{title:"Session Items",description:"Sidebar session rows — status dot, backend badge, Docker indicator, archive on hover",children:e.jsx(Ze,{})}),e.jsx(d,{title:"Browser Preview",description:"Browser preview panel — host mode (HTTP proxy) and container mode (noVNC) — loading, error, and active states",children:e.jsxs("div",{className:"space-y-4 max-w-3xl",children:[e.jsx(s,{label:"Loading state",children:e.jsxs("div",{className:"h-48 flex flex-col items-center justify-center gap-3 p-4 bg-cc-bg rounded border border-cc-border",children:[e.jsx("div",{className:"w-5 h-5 border-2 border-cc-primary border-t-transparent rounded-full animate-spin"}),e.jsx("div",{className:"text-sm text-cc-muted",children:"Starting browser preview..."})]})}),e.jsx(s,{label:"Error state",children:e.jsx("div",{className:"h-48 flex items-center justify-center p-4 bg-cc-bg rounded border border-cc-border",children:e.jsx("div",{className:"px-4 py-3 rounded-lg bg-cc-error/10 border border-cc-error/30 text-sm text-cc-error max-w-md text-center",children:"Browser preview unavailable."})})}),e.jsx(s,{label:"Host mode (proxy — before navigation)",children:e.jsxs("div",{className:"h-48 flex flex-col bg-cc-bg rounded border border-cc-border overflow-hidden",children:[e.jsxs("div",{className:"shrink-0 px-3 py-2 border-b border-cc-border flex items-center gap-2",children:[e.jsx("button",{type:"button",className:"flex items-center justify-center w-7 h-7 rounded text-cc-muted hover:text-cc-fg hover:bg-cc-hover transition-colors cursor-pointer","aria-label":"Reload browser",title:"Reload",children:e.jsx("svg",{viewBox:"0 0 16 16",fill:"currentColor",className:"w-3.5 h-3.5",children:e.jsx("path",{d:"M13.65 2.35a1 1 0 0 0-1.3 0L11 3.7A5.99 5.99 0 0 0 2 8a1 1 0 1 0 2 0 4 4 0 0 1 6.29-3.29L8.65 6.35a1 1 0 0 0 .7 1.7H13a1 1 0 0 0 1-1V3.4a1 1 0 0 0-.35-.7z M14 8a1 1 0 1 0-2 0 4 4 0 0 1-6.29 3.29l1.64-1.64a1 1 0 0 0-.7-1.7H3.05a1 1 0 0 0-1 1v3.65a1 1 0 0 0 1.7.7L5 11.7A5.99 5.99 0 0 0 14 8z"})})}),e.jsx("input",{type:"text",defaultValue:"http://localhost:3000",className:"flex-1 px-2 py-1 text-xs rounded bg-cc-bg border border-cc-border text-cc-fg placeholder:text-cc-muted focus:outline-none focus:border-cc-primary","aria-label":"Navigate URL",readOnly:!0}),e.jsx("button",{type:"button",className:"px-3 py-1 rounded text-xs font-medium bg-cc-primary text-white hover:bg-cc-primary-hover transition-colors cursor-pointer",children:"Go"})]}),e.jsx("div",{className:"flex-1 flex items-center justify-center text-xs text-cc-muted",children:"Enter a URL and click Go to preview."})]})}),e.jsx(s,{label:"Container mode (noVNC — active)",children:e.jsxs("div",{className:"h-48 flex flex-col bg-cc-bg rounded border border-cc-border overflow-hidden",children:[e.jsxs("div",{className:"shrink-0 px-3 py-2 border-b border-cc-border flex items-center gap-2",children:[e.jsx("button",{type:"button",className:"flex items-center justify-center w-7 h-7 rounded text-cc-muted hover:text-cc-fg hover:bg-cc-hover transition-colors cursor-pointer","aria-label":"Reload browser",title:"Reload",children:e.jsx("svg",{viewBox:"0 0 16 16",fill:"currentColor",className:"w-3.5 h-3.5",children:e.jsx("path",{d:"M13.65 2.35a1 1 0 0 0-1.3 0L11 3.7A5.99 5.99 0 0 0 2 8a1 1 0 1 0 2 0 4 4 0 0 1 6.29-3.29L8.65 6.35a1 1 0 0 0 .7 1.7H13a1 1 0 0 0 1-1V3.4a1 1 0 0 0-.35-.7z M14 8a1 1 0 1 0-2 0 4 4 0 0 1-6.29 3.29l1.64-1.64a1 1 0 0 0-.7-1.7H3.05a1 1 0 0 0-1 1v3.65a1 1 0 0 0 1.7.7L5 11.7A5.99 5.99 0 0 0 14 8z"})})}),e.jsx("input",{type:"text",defaultValue:"http://localhost:3000",className:"flex-1 px-2 py-1 text-xs rounded bg-cc-bg border border-cc-border text-cc-fg placeholder:text-cc-muted focus:outline-none focus:border-cc-primary","aria-label":"Navigate URL",readOnly:!0}),e.jsx("button",{type:"button",className:"px-3 py-1 rounded text-xs font-medium bg-cc-primary text-white hover:bg-cc-primary-hover transition-colors cursor-pointer",children:"Go"})]}),e.jsx("div",{className:"flex-1 flex items-center justify-center text-xs text-cc-muted",children:"noVNC iframe would render here"})]})})]})}),e.jsx(d,{title:"Tool Activity",description:"Live execution bar and post-turn summary strip",children:e.jsxs("div",{className:"space-y-6",children:[e.jsx(s,{label:"ToolExecutionBar — 1 tool running",children:e.jsx("div",{className:"bg-cc-bg p-2 rounded",children:e.jsx(Q,{tools:[{toolName:"Bash",elapsedSeconds:3}]})})}),e.jsx(s,{label:"ToolExecutionBar — 3 tools running",children:e.jsx("div",{className:"bg-cc-bg p-2 rounded",children:e.jsx(Q,{tools:[{toolName:"Bash",elapsedSeconds:7},{toolName:"Read",elapsedSeconds:1},{toolName:"Edit",elapsedSeconds:4}]})})}),e.jsx(s,{label:"ToolExecutionBar — empty (renders nothing)",children:e.jsx("div",{className:"bg-cc-bg p-2 rounded min-h-[24px]",children:e.jsx(Q,{tools:[]})})}),e.jsx(s,{label:"ToolTurnSummary — collapsed (3 tools, no errors)",children:e.jsx("div",{className:"bg-cc-bg p-2 rounded",children:e.jsx(X,{entries:ze})})}),e.jsx(s,{label:"ToolTurnSummary — collapsed (with error)",children:e.jsx("div",{className:"bg-cc-bg p-2 rounded",children:e.jsx(X,{entries:Fe})})}),e.jsx(s,{label:"ToolTurnSummary — collapsed (with running tool)",children:e.jsx("div",{className:"bg-cc-bg p-2 rounded",children:e.jsx(X,{entries:He})})})]})})]})]})}function S(t){return{id:`mock-${Math.random().toString(36).slice(2,8)}`,model:"claude-sonnet-4-20250514",cwd:"/Users/dev/project",gitBranch:"main",isContainerized:!1,gitAhead:0,gitBehind:0,linesAdded:0,linesRemoved:0,isConnected:!1,isReconnecting:!1,status:null,sdkState:null,createdAt:Date.now(),archived:!1,backendType:"claude",repoRoot:"/Users/dev/project",permCount:0,...t}}const Xe={current:null},C={onSelect:()=>{},onStartRename:()=>{},onArchive:t=>t.stopPropagation(),onUnarchive:t=>t.stopPropagation(),onDelete:t=>t.stopPropagation(),onClearRecentlyRenamed:()=>{},editingSessionId:null,editingName:"",setEditingName:()=>{},onConfirmRename:()=>{},onCancelRename:()=>{},editInputRef:Xe};function Ze(){return e.jsxs("div",{className:"space-y-4 max-w-sm",children:[e.jsx(s,{label:"Running — Claude Code",children:e.jsx("div",{className:"bg-cc-sidebar rounded-lg p-1",children:e.jsx(_,{session:S({isConnected:!0,status:"running",backendType:"claude"}),isActive:!1,sessionName:"Refactor auth module",permCount:0,isRecentlyRenamed:!1,...C})})}),e.jsx(s,{label:"Running — Codex + Docker",children:e.jsx("div",{className:"bg-cc-sidebar rounded-lg p-1",children:e.jsx(_,{session:S({isConnected:!0,status:"running",backendType:"codex",isContainerized:!0}),isActive:!1,sessionName:"Add payment flow",permCount:0,isRecentlyRenamed:!1,...C})})}),e.jsx(s,{label:"Awaiting Input — 2 permissions pending",children:e.jsx("div",{className:"bg-cc-sidebar rounded-lg p-1",children:e.jsx(_,{session:S({isConnected:!0,status:"running",backendType:"claude",permCount:2}),isActive:!1,sessionName:"Fix login bug",permCount:2,isRecentlyRenamed:!1,...C})})}),e.jsx(s,{label:"Idle — connected, not running",children:e.jsx("div",{className:"bg-cc-sidebar rounded-lg p-1",children:e.jsx(_,{session:S({isConnected:!0,status:"idle",backendType:"claude"}),isActive:!1,sessionName:"Review PR #42",permCount:0,isRecentlyRenamed:!1,...C})})}),e.jsx(s,{label:"Reconnecting — CLI restarting",children:e.jsx("div",{className:"bg-cc-sidebar rounded-lg p-1",children:e.jsx(_,{session:S({isReconnecting:!0}),isActive:!1,sessionName:"Debug auth flow",permCount:0,isRecentlyRenamed:!1,...C})})}),e.jsx(s,{label:"Exited — session stopped",children:e.jsx("div",{className:"bg-cc-sidebar rounded-lg p-1",children:e.jsx(_,{session:S({sdkState:"exited",backendType:"codex"}),isActive:!1,sessionName:"Deploy to staging",permCount:0,isRecentlyRenamed:!1,...C})})}),e.jsx(s,{label:"Active (selected session)",children:e.jsx("div",{className:"bg-cc-sidebar rounded-lg p-1",children:e.jsx(_,{session:S({isConnected:!0,status:"running",backendType:"claude",isContainerized:!0}),isActive:!0,sessionName:"Build new dashboard",permCount:0,isRecentlyRenamed:!1,...C})})}),e.jsx(s,{label:"Archived session",children:e.jsx("div",{className:"bg-cc-sidebar rounded-lg p-1",children:e.jsx(_,{session:S({archived:!0,backendType:"claude"}),isActive:!1,isArchived:!0,sessionName:"Old migration script",permCount:0,isRecentlyRenamed:!1,...C})})})]})}function d({title:t,description:c,children:n}){return e.jsxs("section",{children:[e.jsxs("div",{className:"mb-4",children:[e.jsx("h2",{className:"text-base font-semibold text-cc-fg",children:t}),e.jsx("p",{className:"text-xs text-cc-muted mt-0.5",children:c})]}),n]})}function s({label:t,children:c}){return e.jsxs("div",{className:"border border-cc-border rounded-xl overflow-hidden bg-cc-card",children:[e.jsx("div",{className:"px-3 py-1.5 bg-cc-hover/50 border-b border-cc-border",children:e.jsx("span",{className:"text-[10px] text-cc-muted font-mono-code uppercase tracking-wider",children:t})}),e.jsx("div",{className:"p-4",children:c})]})}function es(){var m;const t=[{id:"host",label:"Terminal",cwd:"/Users/demo/project"},{id:"docker",label:"Docker",cwd:"/workspace"}],[c,n]=u.useState("host"),[i,r]=u.useState("bottom");return e.jsxs("div",{className:"rounded-xl border border-cc-border bg-cc-card overflow-hidden",children:[e.jsxs("div",{className:"flex items-center gap-1.5 px-2 py-1.5 border-b border-cc-border bg-cc-sidebar",children:[e.jsx("div",{className:"flex items-center gap-0.5 bg-cc-hover rounded-md p-0.5 mr-1",children:["top","right","bottom","left"].map(l=>{var h;return e.jsxs("button",{onClick:()=>r(l),className:`px-2 py-1 rounded text-[10px] font-medium cursor-pointer ${i===l?"bg-cc-card text-cc-fg":"text-cc-muted"}`,children:[(h=l[0])==null?void 0:h.toUpperCase(),l.slice(1)]},l)})}),t.map(l=>e.jsx("button",{onClick:()=>n(l.id),className:`px-2 py-1 rounded-md text-[11px] font-medium border cursor-pointer ${c===l.id?"text-cc-fg bg-cc-card border-cc-border":"text-cc-muted border-transparent hover:bg-cc-hover"}`,children:l.label},l.id)),e.jsx("span",{className:"text-[11px] font-mono-code text-cc-muted truncate ml-1",children:(m=t.find(l=>l.id===c))==null?void 0:m.cwd})]}),e.jsx("div",{className:"h-32 p-3 bg-cc-bg",children:e.jsxs("div",{className:`h-full min-h-0 rounded-lg border border-cc-border bg-cc-card flex ${i==="left"||i==="right"?"flex-row":"flex-col"}`,children:[(i==="top"||i==="left")&&e.jsx("div",{className:`${i==="left"?"w-2/5 border-r":"h-2/5 border-b"} border-cc-border bg-cc-sidebar/40 flex items-center justify-center text-[10px] text-cc-muted font-mono-code`,children:"Terminal docked"}),e.jsx("div",{className:"flex-1 min-h-0 flex items-center justify-center text-xs text-cc-muted",children:"Session content"}),(i==="right"||i==="bottom")&&e.jsx("div",{className:`${i==="right"?"w-2/5 border-l":"h-2/5 border-t"} border-cc-border bg-cc-sidebar/40 flex items-center justify-center text-[10px] text-cc-muted font-mono-code`,children:"Terminal docked"})]})})]})}function Z({toolName:t,items:c}){const[n,i]=u.useState(!1),r=we(t),m=fe(t),l=c.length;if(l===1){const h=c[0];return e.jsxs("div",{className:"flex items-start gap-3",children:[e.jsx("div",{className:"w-6 h-6 rounded-full bg-cc-primary/10 flex items-center justify-center shrink-0 mt-0.5",children:e.jsx("svg",{viewBox:"0 0 16 16",fill:"currentColor",className:"w-3 h-3 text-cc-primary",children:e.jsx("circle",{cx:"8",cy:"8",r:"3"})})}),e.jsx("div",{className:"flex-1 min-w-0",children:e.jsxs("div",{className:"border border-cc-border rounded-[10px] overflow-hidden bg-cc-card",children:[e.jsxs("button",{onClick:()=>i(!n),className:"w-full flex items-center gap-2.5 px-3 py-2 text-left hover:bg-cc-hover transition-colors cursor-pointer",children:[e.jsx("svg",{viewBox:"0 0 16 16",fill:"currentColor",className:`w-3 h-3 text-cc-muted transition-transform shrink-0 ${n?"rotate-90":""}`,children:e.jsx("path",{d:"M6 4l4 4-4 4"})}),e.jsx(se,{type:r}),e.jsx("span",{className:"text-xs font-medium text-cc-fg",children:m}),e.jsx("span",{className:"text-xs text-cc-muted truncate flex-1 font-mono-code",children:te(h.name,h.input)})]}),n&&e.jsx("div",{className:"px-3 pb-3 pt-0 border-t border-cc-border mt-0",children:e.jsx("pre",{className:"mt-2 text-[11px] text-cc-muted font-mono-code whitespace-pre-wrap leading-relaxed max-h-60 overflow-y-auto",children:JSON.stringify(h.input,null,2)})})]})})]})}return e.jsxs("div",{className:"flex items-start gap-3",children:[e.jsx("div",{className:"w-6 h-6 rounded-full bg-cc-primary/10 flex items-center justify-center shrink-0 mt-0.5",children:e.jsx("svg",{viewBox:"0 0 16 16",fill:"currentColor",className:"w-3 h-3 text-cc-primary",children:e.jsx("circle",{cx:"8",cy:"8",r:"3"})})}),e.jsx("div",{className:"flex-1 min-w-0",children:e.jsxs("div",{className:"border border-cc-border rounded-[10px] overflow-hidden bg-cc-card",children:[e.jsxs("button",{onClick:()=>i(!n),className:"w-full flex items-center gap-2.5 px-3 py-2 text-left hover:bg-cc-hover transition-colors cursor-pointer",children:[e.jsx("svg",{viewBox:"0 0 16 16",fill:"currentColor",className:`w-3 h-3 text-cc-muted transition-transform shrink-0 ${n?"rotate-90":""}`,children:e.jsx("path",{d:"M6 4l4 4-4 4"})}),e.jsx(se,{type:r}),e.jsx("span",{className:"text-xs font-medium text-cc-fg",children:m}),e.jsx("span",{className:"text-[10px] text-cc-muted bg-cc-hover rounded-full px-1.5 py-0.5 tabular-nums font-medium",children:l})]}),n&&e.jsx("div",{className:"border-t border-cc-border px-3 py-1.5",children:c.map((h,o)=>{const x=te(h.name,h.input);return e.jsxs("div",{className:"flex items-center gap-2 py-1 text-xs text-cc-muted font-mono-code truncate",children:[e.jsx("span",{className:"w-1 h-1 rounded-full bg-cc-muted/40 shrink-0"}),e.jsx("span",{className:"truncate",children:x||JSON.stringify(h.input).slice(0,80)})]},h.id||o)})})]})})]})}function ss({description:t,agentType:c,backend:n="codex",status:i,senderThreadId:r,receiverThreadIds:m=[],receiverCount:l,items:h}){var N;const[o,x]=u.useState(!0),a=u.useMemo(()=>{if(!i)return null;const p=i.trim().toLowerCase();return p?p==="completed"?{label:"completed",className:"text-green-600 bg-green-500/15",summary:"completed"}:p==="failed"||p==="error"||p==="errored"?{label:"failed",className:"text-cc-error bg-cc-error/10",summary:"failed"}:p==="pending"||p==="pendinginit"||p==="pending_init"?{label:"pending",className:"text-amber-700 bg-amber-500/15",summary:"pending"}:p==="running"||p==="inprogress"||p==="in_progress"||p==="started"?{label:"running",className:"text-blue-600 bg-blue-500/15",summary:"running"}:{label:i,className:"text-amber-700 bg-amber-500/15",summary:"running"}:null},[i]),y=l!==void 0?l:h.length;return e.jsxs("div",{className:"ml-9 border-l-2 border-cc-primary/20 pl-4",children:[e.jsxs("button",{onClick:()=>x(!o),className:"w-full flex items-center gap-2 py-1.5 text-left cursor-pointer mb-1",children:[e.jsx("svg",{viewBox:"0 0 16 16",fill:"currentColor",className:`w-3 h-3 text-cc-muted transition-transform shrink-0 ${o?"rotate-90":""}`,children:e.jsx("path",{d:"M6 4l4 4-4 4"})}),e.jsxs("svg",{viewBox:"0 0 16 16",fill:"none",stroke:"currentColor",strokeWidth:"1.5",className:"w-3.5 h-3.5 text-cc-primary shrink-0",children:[e.jsx("circle",{cx:"8",cy:"8",r:"5"}),e.jsx("path",{d:"M8 5v3l2 1",strokeLinecap:"round"})]}),e.jsx("span",{className:"text-xs font-medium text-cc-fg truncate",children:t}),c&&e.jsx("span",{className:"text-[10px] text-cc-muted bg-cc-hover rounded-full px-1.5 py-0.5 shrink-0",children:c}),e.jsx("span",{className:"text-[10px] text-cc-muted bg-cc-hover rounded-full px-1.5 py-0.5 shrink-0",children:n==="codex"?"Codex":"Claude"}),a&&e.jsx("span",{className:`text-[10px] rounded-full px-1.5 py-0.5 shrink-0 ${a.className}`,children:a.label}),l!==void 0&&e.jsxs("span",{className:"text-[10px] text-cc-muted bg-cc-hover rounded-full px-1.5 py-0.5 shrink-0",children:[l," agent",l===1?"":"s"]}),e.jsx("span",{className:"text-[10px] text-cc-muted bg-cc-hover rounded-full px-1.5 py-0.5 tabular-nums shrink-0 ml-auto",children:h.length})]}),o&&e.jsxs("div",{className:"space-y-3 pb-2",children:[(a||r||m.length>0)&&e.jsxs("div",{className:"rounded-lg border border-cc-border bg-cc-card px-2.5 py-2 space-y-1.5",children:[e.jsxs("div",{className:"flex flex-wrap items-center gap-1.5 text-[10px]",children:[a&&e.jsxs("span",{className:`rounded-full px-1.5 py-0.5 ${a.className}`,children:[y," ",a.summary]}),r&&e.jsxs("span",{className:"rounded-full px-1.5 py-0.5 text-cc-muted bg-cc-hover font-mono-code",children:["sender: ",r]}),m.length>0&&e.jsxs("span",{className:"rounded-full px-1.5 py-0.5 text-cc-muted bg-cc-hover",children:["receivers: ",m.length]})]}),m.length>0&&e.jsx("div",{className:"flex flex-wrap gap-1",children:m.map(p=>e.jsx("span",{className:"text-[10px] rounded-full px-1.5 py-0.5 text-cc-muted bg-cc-hover font-mono-code",children:p},p))})]}),e.jsx(Z,{toolName:((N=h[0])==null?void 0:N.name)||"Grep",items:h})]})]})}const E="codex-playground-demo";function ts(){return u.useEffect(()=>{const t=j.getState(),c=t.sessions.get(E);return t.addSession({session_id:E,backend_type:"codex",model:"o3",cwd:"/Users/demo/project",tools:[],permissionMode:"bypassPermissions",claude_code_version:"0.1.0",mcp_servers:[],agents:[],slash_commands:[],skills:[],total_cost_usd:0,num_turns:8,context_used_percent:45,is_compacting:!1,git_branch:"main",is_worktree:!1,is_containerized:!1,repo_root:"/Users/demo/project",git_ahead:0,git_behind:0,total_lines_added:0,total_lines_removed:0,codex_rate_limits:{primary:{usedPercent:62,windowDurationMins:300,resetsAt:Date.now()+2*36e5},secondary:{usedPercent:18,windowDurationMins:10080,resetsAt:Date.now()+5*864e5}},codex_token_details:{inputTokens:84230,outputTokens:12450,cachedInputTokens:41200,reasoningOutputTokens:8900,modelContextWindow:2e5}}),()=>{j.setState(n=>{const i=new Map(n.sessions);return c?i.set(E,c):i.delete(E),{sessions:i}})}},[]),e.jsxs("div",{className:"w-[280px] border border-cc-border rounded-xl overflow-hidden bg-cc-card",children:[e.jsx(he,{sessionId:E}),e.jsx(ge,{sessionId:E})]})}function O({updateInfo:t}){return u.useEffect(()=>{const c=j.getState().updateInfo,n=j.getState().updateDismissedVersion;return j.getState().setUpdateInfo(t),n&&j.setState({updateDismissedVersion:null}),()=>{j.getState().setUpdateInfo(c),n&&j.setState({updateDismissedVersion:n})}},[t]),e.jsx(be,{})}function ns(){const[t,c]=u.useState(!1),[n,i]=u.useState("/tmp");return u.useEffect(()=>{je.getHome().then(r=>i(r.cwd)).catch(()=>{})},[]),e.jsxs("div",{className:"flex items-center gap-3",children:[e.jsxs("button",{onClick:()=>c(!0),className:"flex items-center gap-2 px-3 py-2 rounded-lg bg-cc-hover border border-cc-border hover:bg-cc-active transition-colors cursor-pointer",children:[e.jsx("svg",{viewBox:"0 0 16 16",fill:"currentColor",className:"w-4 h-4 text-cc-primary",children:e.jsx("path",{d:"M4 1.5a.5.5 0 01.5-.5h7a.5.5 0 01.354.146l2 2A.5.5 0 0114 3.5v11a.5.5 0 01-.5.5h-11a.5.5 0 01-.5-.5v-13zm1 .5v12h8V4h-1.5a.5.5 0 01-.5-.5V2H5zm6 0v1h1l-1-1zM6.5 7a.5.5 0 000 1h5a.5.5 0 000-1h-5zm0 2a.5.5 0 000 1h5a.5.5 0 000-1h-5zm0 2a.5.5 0 000 1h3a.5.5 0 000-1h-3z"})}),e.jsx("span",{className:"text-xs font-medium text-cc-fg",children:"Edit CLAUDE.md"})]}),e.jsx("span",{className:"text-[11px] text-cc-muted",children:"Click to open the editor modal (uses server working directory)"}),e.jsx(ve,{cwd:n,open:t,onClose:()=>c(!1)})]})}function rs({server:t}){var m;const[c,n]=u.useState(!1),i={connected:{label:"Connected",cls:"text-cc-success bg-cc-success/10",dot:"bg-cc-success"},connecting:{label:"Connecting",cls:"text-cc-warning bg-cc-warning/10",dot:"bg-cc-warning animate-pulse"},failed:{label:"Failed",cls:"text-cc-error bg-cc-error/10",dot:"bg-cc-error"},disabled:{label:"Disabled",cls:"text-cc-muted bg-cc-hover",dot:"bg-cc-muted opacity-40"}},r=i[t.status]||i.disabled;return e.jsxs("div",{className:"rounded-lg border border-cc-border bg-cc-bg",children:[e.jsxs("div",{className:"flex items-center gap-2 px-2.5 py-2",children:[e.jsx("span",{className:`w-1.5 h-1.5 rounded-full shrink-0 ${r.dot}`}),e.jsx("button",{onClick:()=>n(!c),className:"flex-1 min-w-0 text-left cursor-pointer",children:e.jsx("span",{className:"text-[12px] font-medium text-cc-fg truncate block",children:t.name})}),e.jsx("span",{className:`text-[9px] font-medium px-1.5 rounded-full leading-[16px] shrink-0 ${r.cls}`,children:r.label})]}),c&&e.jsxs("div",{className:"px-2.5 pb-2.5 space-y-1.5 border-t border-cc-border pt-2",children:[e.jsxs("div",{className:"text-[11px] text-cc-muted space-y-0.5",children:[e.jsxs("div",{className:"flex items-center gap-1",children:[e.jsx("span",{className:"text-cc-muted/60",children:"Type:"}),e.jsx("span",{children:t.config.type})]}),t.config.command&&e.jsxs("div",{className:"flex items-start gap-1",children:[e.jsx("span",{className:"text-cc-muted/60 shrink-0",children:"Cmd:"}),e.jsxs("span",{className:"font-mono text-[10px] break-all",children:[t.config.command,(m=t.config.args)!=null&&m.length?` ${t.config.args.join(" ")}`:""]})]}),t.config.url&&e.jsxs("div",{className:"flex items-start gap-1",children:[e.jsx("span",{className:"text-cc-muted/60 shrink-0",children:"URL:"}),e.jsx("span",{className:"font-mono text-[10px] break-all",children:t.config.url})]}),e.jsxs("div",{className:"flex items-center gap-1",children:[e.jsx("span",{className:"text-cc-muted/60",children:"Scope:"}),e.jsx("span",{children:t.scope})]})]}),t.error&&e.jsx("div",{className:"text-[11px] text-cc-error bg-cc-error/5 rounded px-2 py-1",children:t.error}),t.tools&&t.tools.length>0&&e.jsxs("div",{className:"space-y-1",children:[e.jsxs("span",{className:"text-[10px] text-cc-muted uppercase tracking-wider",children:["Tools (",t.tools.length,")"]}),e.jsx("div",{className:"flex flex-wrap gap-1",children:t.tools.map(l=>e.jsx("span",{className:"text-[10px] font-mono px-1.5 py-0.5 rounded bg-cc-hover text-cc-fg",children:l.name},l.name))})]})]})]})}function as({task:t}){const c=t.status==="completed",n=t.status==="in_progress";return e.jsxs("div",{className:`px-2.5 py-2 rounded-lg ${c?"opacity-50":""}`,children:[e.jsxs("div",{className:"flex items-start gap-2",children:[e.jsx("span",{className:"shrink-0 flex items-center justify-center w-4 h-4 mt-px",children:n?e.jsx("svg",{className:"w-4 h-4 text-cc-primary animate-spin",viewBox:"0 0 16 16",fill:"none",children:e.jsx("circle",{cx:"8",cy:"8",r:"6",stroke:"currentColor",strokeWidth:"1.5",strokeDasharray:"28",strokeDashoffset:"8",strokeLinecap:"round"})}):c?e.jsx("svg",{viewBox:"0 0 16 16",fill:"currentColor",className:"w-4 h-4 text-cc-success",children:e.jsx("path",{fillRule:"evenodd",d:"M8 15A7 7 0 108 1a7 7 0 000 14zm3.354-9.354a.5.5 0 00-.708-.708L7 8.586 5.354 6.94a.5.5 0 10-.708.708l2 2a.5.5 0 00.708 0l4-4z",clipRule:"evenodd"})}):e.jsx("svg",{viewBox:"0 0 16 16",fill:"none",className:"w-4 h-4 text-cc-muted",children:e.jsx("circle",{cx:"8",cy:"8",r:"6",stroke:"currentColor",strokeWidth:"1.5"})})}),e.jsx("span",{className:`text-[13px] leading-snug flex-1 ${c?"text-cc-muted line-through":"text-cc-fg"}`,children:t.subject})]}),n&&t.activeForm&&e.jsx("p",{className:"mt-1 ml-6 text-[11px] text-cc-muted italic truncate",children:t.activeForm}),t.blockedBy&&t.blockedBy.length>0&&e.jsxs("p",{className:"mt-1 ml-6 text-[11px] text-cc-muted flex items-center gap-1",children:[e.jsxs("svg",{viewBox:"0 0 16 16",fill:"none",className:"w-3 h-3 shrink-0",children:[e.jsx("circle",{cx:"8",cy:"8",r:"6",stroke:"currentColor",strokeWidth:"1.5"}),e.jsx("path",{d:"M5 8h6",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round"})]}),e.jsxs("span",{children:["blocked by ",t.blockedBy.map(i=>`#${i}`).join(", ")]})]})]})}const R="ai-validation-playground";function de({enabled:t}){return u.useEffect(()=>{const c=j.getState(),n=c.sessions.get(R);return c.updateSession(R,{session_id:R,model:"claude-sonnet-4-20250514",cwd:"/workspace",tools:[],permissionMode:"default",claude_code_version:"1.0.0",mcp_servers:[],agents:[],slash_commands:[],skills:[],total_cost_usd:0,num_turns:0,context_used_percent:0,is_compacting:!1,git_branch:"main",is_worktree:!1,is_containerized:!1,repo_root:"/workspace",git_ahead:0,git_behind:0,total_lines_added:0,total_lines_removed:0,aiValidationEnabled:t,aiValidationAutoApprove:!0,aiValidationAutoDeny:!1,...n}),()=>{n&&j.getState().updateSession(R,n)}},[t]),u.useEffect(()=>{j.getState().setSessionAiValidation(R,{aiValidationEnabled:t})},[t]),e.jsxs("div",{className:"flex items-center gap-2 p-2",children:[e.jsx(ue,{sessionId:R}),e.jsx("span",{className:"text-xs text-cc-muted",children:"Click to toggle"})]})}function is(){const[t,c]=u.useState(!0),[n,i]=u.useState("running"),r=[{name:"Explore codebase",agentType:"Explore",status:n,startedAt:Date.now()-12e3,completedAt:n==="completed"?Date.now():void 0},{name:"Research auth patterns",agentType:"general-purpose",status:"completed",startedAt:Date.now()-45e3,completedAt:Date.now()-3e3}],m=[{id:"1",subject:"Implement ActivityTray component",description:"",status:"completed"},{id:"2",subject:"Wire into ChatView layout",description:"",status:"completed"},{id:"3",subject:"Add background agent detection",description:"",status:"in_progress",activeForm:"Detecting Agent tool_use"},{id:"4",subject:"Write tests",description:"",status:"pending"}],l=r.filter(a=>a.status==="running").length,h=m.filter(a=>a.status==="completed").length,o=l>0||m.some(a=>a.status==="in_progress");function x(a,y){const N=Math.round(((y||Date.now())-a)/1e3);if(N<60)return`${N}s`;const p=Math.floor(N/60),D=N%60;return`${p}m${D>0?` ${D}s`:""}`}return e.jsxs("div",{className:"relative h-48 bg-cc-bg rounded-lg border border-cc-border/30 overflow-hidden",children:[e.jsx("div",{className:"absolute inset-0 flex items-center justify-center",children:e.jsx("span",{className:"text-[10px] text-cc-muted/20",children:"Chat area"})}),e.jsx("div",{className:"absolute top-2 left-2 z-30",children:e.jsxs("button",{type:"button",onClick:()=>i(a=>a==="running"?"completed":"running"),className:"text-[10px] px-2 py-1 rounded bg-cc-surface border border-cc-border text-cc-muted hover:text-cc-fg cursor-pointer",children:["Toggle agent: ",n]})}),e.jsxs("div",{className:"absolute bottom-3 right-3 z-20",children:[t&&e.jsxs("div",{className:"mb-1.5 w-72 max-w-[calc(100vw-2rem)] max-h-52 overflow-y-auto rounded-xl border border-cc-border/60 bg-cc-surface/95 backdrop-blur-xl shadow-lg shadow-black/20 animate-[fadeSlideIn_0.2s_ease-out]",children:[e.jsxs("div",{className:"flex items-center justify-between px-3 py-2 border-b border-cc-border/40",children:[e.jsx("span",{className:"text-[11px] font-semibold text-cc-fg/70 uppercase tracking-wider",role:"heading","aria-level":3,children:"Activity"}),e.jsx("button",{type:"button",onClick:()=>c(!1),className:"flex items-center justify-center w-7 h-7 -mr-1 rounded-md text-cc-muted/40 hover:text-cc-muted/70 hover:bg-cc-hover/50 transition-colors cursor-pointer","aria-label":"Close activity tray",children:e.jsx("svg",{viewBox:"0 0 16 16",fill:"currentColor",className:"w-3 h-3",children:e.jsx("path",{d:"M4.646 4.646a.5.5 0 01.708 0L8 7.293l2.646-2.647a.5.5 0 01.708.708L8.707 8l2.647 2.646a.5.5 0 01-.708.708L8 8.707l-2.646 2.647a.5.5 0 01-.708-.708L7.293 8 4.646 5.354a.5.5 0 010-.708z"})})})]}),e.jsxs("div",{className:"py-1",children:[e.jsx("div",{className:"px-3 py-1",role:"heading","aria-level":4,children:e.jsx("span",{className:"text-[9px] text-cc-muted/40 uppercase tracking-widest font-semibold",children:"Agents"})}),r.map((a,y)=>e.jsxs("div",{className:`flex items-center gap-2 px-2.5 min-h-[36px] transition-opacity duration-300 ${a.status!=="running"?"opacity-60":""}`,children:[a.status==="running"?e.jsxs("span",{className:"relative flex h-1.5 w-1.5 shrink-0",children:[e.jsx("span",{className:"absolute inline-flex h-full w-full rounded-full bg-cc-warning opacity-75 animate-ping"}),e.jsx("span",{className:"relative inline-flex rounded-full h-1.5 w-1.5 bg-cc-warning"})]}):e.jsx("span",{className:"h-1.5 w-1.5 rounded-full bg-cc-success shrink-0"}),e.jsx("span",{className:"text-[11px] text-cc-fg/80 truncate flex-1 font-medium",children:a.name}),e.jsx("span",{className:"text-[9px] text-cc-muted/50 uppercase tracking-wider shrink-0",children:a.agentType}),e.jsx("span",{className:"text-[10px] text-cc-muted/50 tabular-nums font-mono-code",children:x(a.startedAt,a.completedAt)})]},y))]}),e.jsx("div",{className:"border-t border-cc-border/30 mx-2",role:"separator"}),e.jsxs("div",{className:"py-1",children:[e.jsx("div",{className:"px-3 py-1",role:"heading","aria-level":4,children:e.jsx("span",{className:"text-[9px] text-cc-muted/40 uppercase tracking-widest font-semibold",children:"Tasks"})}),m.map(a=>e.jsxs("div",{className:`flex items-center gap-2 px-2.5 min-h-[32px] transition-opacity duration-300 ${a.status==="completed"?"opacity-40":""}`,children:[e.jsx("span",{className:"shrink-0 flex items-center justify-center w-3.5 h-3.5",children:a.status==="in_progress"?e.jsx("svg",{className:"w-3.5 h-3.5 text-cc-primary animate-spin",viewBox:"0 0 16 16",fill:"none",children:e.jsx("circle",{cx:"8",cy:"8",r:"6",stroke:"currentColor",strokeWidth:"1.5",strokeDasharray:"28",strokeDashoffset:"8",strokeLinecap:"round"})}):a.status==="completed"?e.jsx("svg",{viewBox:"0 0 16 16",fill:"currentColor",className:"w-3.5 h-3.5 text-cc-success",children:e.jsx("path",{fillRule:"evenodd",d:"M8 15A7 7 0 108 1a7 7 0 000 14zm3.354-9.354a.5.5 0 00-.708-.708L7 8.586 5.354 6.94a.5.5 0 10-.708.708l2 2a.5.5 0 00.708 0l4-4z",clipRule:"evenodd"})}):e.jsx("svg",{viewBox:"0 0 16 16",fill:"none",className:"w-3.5 h-3.5 text-cc-muted/40",children:e.jsx("circle",{cx:"8",cy:"8",r:"6",stroke:"currentColor",strokeWidth:"1.5"})})}),e.jsx("span",{className:`text-[11px] leading-snug flex-1 truncate ${a.status==="completed"?"text-cc-muted line-through":"text-cc-fg/80"}`,children:a.subject}),a.status==="in_progress"&&a.activeForm&&e.jsx("span",{className:"text-[10px] text-cc-muted/50 italic truncate max-w-[120px] shrink-0",children:a.activeForm})]},a.id))]})]}),e.jsxs("button",{type:"button",onClick:()=>c(!t),"aria-expanded":t,className:`flex items-center gap-2 px-3 min-h-[36px] rounded-full border border-cc-border/50 bg-cc-surface/90 backdrop-blur-lg shadow-md shadow-black/15 hover:bg-cc-hover/80 hover:border-cc-border/70 transition-all duration-200 cursor-pointer ${t?"ring-1 ring-cc-primary/30":""}`,children:[o?e.jsxs("span",{className:"relative flex h-2 w-2",children:[e.jsx("span",{className:"absolute inline-flex h-full w-full rounded-full bg-cc-warning opacity-75 animate-ping"}),e.jsx("span",{className:"relative inline-flex rounded-full h-2 w-2 bg-cc-warning"})]}):e.jsx("span",{className:"h-2 w-2 rounded-full bg-cc-success"}),l>0?e.jsxs("span",{className:"text-[11px] text-cc-fg/70 font-medium tabular-nums",children:[l," agent",l!==1?"s":""]}):e.jsxs("span",{className:"text-[11px] text-cc-fg/70 font-medium tabular-nums",children:[r.length," done"]}),e.jsx("span",{className:"w-0.5 h-0.5 rounded-full bg-cc-muted/30"}),e.jsxs("span",{className:"text-[11px] text-cc-fg/70 tabular-nums",children:[h,"/",m.length]}),e.jsx("svg",{viewBox:"0 0 16 16",fill:"currentColor",className:`w-2.5 h-2.5 text-cc-muted/40 transition-transform duration-200 ${t?"rotate-180":""}`,"aria-hidden":!0,children:e.jsx("path",{d:"M4 6l4 4 4-4"})})]})]})]})}export{os as Playground};

package/dist/assets/PromptsPage-CFojqNKP.js

@@ -0,0 +1,4 @@
+import{r as o,u as X,a as Z,j as e,n as ne,b as ae,F as Y}from"./index-DkqeP-R9.js";function me({embedded:r=!1}){const[a,i]=o.useState([]),[b,h]=o.useState(!0),[l,f]=o.useState(!1),[j,d]=o.useState(""),[v,P]=o.useState(""),[y,E]=o.useState(""),[u,N]=o.useState("global"),[p,w]=o.useState([]),[A,F]=o.useState(!1),[g,$]=o.useState(null),[D,S]=o.useState(""),[G,C]=o.useState(""),[L,k]=o.useState("global"),[M,m]=o.useState([]),[se,H]=o.useState(!1),[z,re]=o.useState(""),[B,q]=o.useState(!1),U=X(t=>t.currentSessionId),x=X(t=>{var s,c;return t.currentSessionId&&(((s=t.sessions.get(t.currentSessionId))==null?void 0:s.cwd)||((c=t.sdkSessions.find(n=>n.sessionId===t.currentSessionId))==null?void 0:c.cwd))||""}),I=o.useMemo(()=>{const t=z.trim().toLowerCase();return t?a.filter(s=>`${s.name}
+${s.content}
+${s.scope}`.toLowerCase().includes(t)):a},[a,z]),V=a.length,J=I.length,T=o.useMemo(()=>{const t=I.filter(n=>n.scope==="global"),s=I.filter(n=>n.scope==="project"),c=new Map;for(const n of s){const _=n.projectPaths??(n.projectPath?[n.projectPath]:[]),W=_.length>0?_.slice().sort().join(`
+`):"(no folder)",oe=_.length>0?_.map(Q=>Q.split("/").pop()||Q).join(", "):"(no folder)";c.has(W)||c.set(W,{label:oe,prompts:[]}),c.get(W).prompts.push(n)}return{globalPrompts:t,folderGroups:c}},[I]),R=o.useCallback(async()=>{h(!0),d("");try{const t=await Z.listPrompts();i(t)}catch(t){d(t instanceof Error?t.message:String(t))}finally{h(!1)}},[]);o.useEffect(()=>{R()},[R]);async function ce(t){if(t.preventDefault(),!(!v.trim()||!y.trim())){if(u==="project"&&p.length===0){d("Select at least one project folder");return}f(!0),d("");try{await Z.createPrompt({name:v.trim(),content:y.trim(),scope:u,projectPaths:u==="project"?p:void 0}),P(""),E(""),N("global"),w([]),q(!1),await R()}catch(s){d(s instanceof Error?s.message:String(s))}finally{f(!1)}}}async function K(t){try{await Z.deletePrompt(t),await R()}catch(s){d(s instanceof Error?s.message:String(s))}}async function O(){if(!(!g||!D.trim()||!G.trim())){if(L==="project"&&M.length===0){d("Select at least one project folder");return}try{await Z.updatePrompt(g,{name:D.trim(),content:G.trim(),scope:L,projectPaths:L==="project"?M:void 0}),$(null),S(""),C(""),k("global"),m([]),await R()}catch(t){d(t instanceof Error?t.message:String(t))}}}return e.jsxs("div",{className:`${r?"h-full":"h-[100dvh]"} bg-cc-bg text-cc-fg font-sans-ui antialiased overflow-y-auto`,children:[e.jsxs("div",{className:"max-w-5xl mx-auto px-4 sm:px-6 py-6 sm:py-10 pb-safe",children:[e.jsxs("div",{className:"flex items-start justify-between gap-3 mb-2",children:[e.jsxs("div",{className:"min-w-0",children:[e.jsx("h1",{className:"text-lg font-semibold text-cc-fg",children:"Saved Prompts"}),e.jsxs("p",{className:"mt-0.5 text-[13px] text-cc-muted leading-relaxed",children:["Create reusable prompts — insert with ",e.jsx("code",{className:"text-cc-fg text-xs bg-cc-hover rounded px-1 py-0.5",children:"@title"})," in the composer."]})]}),!r&&e.jsx("button",{onClick:()=>{U?ne(U):ae()},className:"px-3 py-2.5 min-h-[44px] rounded-lg text-sm text-cc-muted hover:text-cc-fg hover:bg-cc-hover transition-colors cursor-pointer shrink-0",children:"Back"})]}),e.jsxs("div",{className:"flex items-center gap-2 mt-4 mb-5",children:[e.jsxs("div",{className:"relative flex-1 min-w-0",children:[e.jsxs("svg",{className:"absolute left-3 top-1/2 -translate-y-1/2 w-3.5 h-3.5 text-cc-muted pointer-events-none",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",children:[e.jsx("circle",{cx:"11",cy:"11",r:"8"}),e.jsx("path",{d:"m21 21-4.35-4.35"})]}),e.jsx("input",{value:z,onChange:t=>re(t.target.value),placeholder:"Search by title or content...",className:"w-full pl-9 pr-3 py-2.5 min-h-[44px] text-sm bg-cc-card rounded-lg text-cc-fg placeholder:text-cc-muted focus:outline-none focus:ring-1 focus:ring-cc-primary/40 transition-shadow"})]}),e.jsxs("button",{onClick:()=>q(!B),className:`flex items-center gap-1.5 px-3.5 py-2.5 min-h-[44px] rounded-lg text-sm font-medium transition-colors cursor-pointer shrink-0 ${B?"bg-cc-active text-cc-fg":"bg-cc-primary hover:bg-cc-primary-hover text-white"}`,children:[e.jsx("svg",{viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",className:"w-4 h-4",children:B?e.jsx("path",{d:"M18 6 6 18M6 6l12 12"}):e.jsx("path",{d:"M12 5v14M5 12h14"})}),e.jsx("span",{className:"hidden sm:inline",children:B?"Cancel":"New Prompt"})]})]}),B&&e.jsx("form",{onSubmit:ce,className:"mb-6",style:{animation:"fadeSlideIn 150ms ease-out"},children:e.jsx(te,{mode:"create",name:v,content:y,scope:u,folders:p,error:j,saving:l,submitLabel:l?"Saving...":"Create Prompt",onNameChange:P,onContentChange:E,onScopeChange:t=>{N(t),t==="project"&&p.length===0&&x&&w([x])},onRemoveFolder:t=>w(s=>s.filter(c=>c!==t)),onAddFolder:()=>F(!0)})}),e.jsx("div",{className:"flex items-center gap-2 mb-3 text-[12px] text-cc-muted",children:e.jsx("span",{children:J===V?`${V} prompt${V!==1?"s":""}`:`${J} of ${V}`})}),b?e.jsx("div",{className:"py-12 text-center text-sm text-cc-muted",children:"Loading prompts..."}):a.length===0?e.jsx("div",{className:"py-12 text-center text-sm text-cc-muted",children:"No prompts yet."}):I.length===0?e.jsx("div",{className:"py-12 text-center text-sm text-cc-muted",children:"No prompts match your search."}):e.jsxs("div",{className:"space-y-4",children:[T.globalPrompts.length>0&&e.jsxs("div",{children:[e.jsx("h2",{className:"text-[11px] uppercase tracking-wider text-cc-muted font-semibold mb-1.5 px-1",children:"Global"}),e.jsx("div",{className:"space-y-1",children:T.globalPrompts.map(t=>e.jsx(ee,{prompt:t,isEditing:g===t.id,error:j,editName:D,editContent:G,editScope:L,editFolders:M,cwd:x,onEditNameChange:S,onEditContentChange:C,onEditScopeChange:s=>{k(s),s==="project"&&M.length===0&&x&&m([x])},onEditRemoveFolder:s=>m(c=>c.filter(n=>n!==s)),onEditAddFolder:()=>H(!0),onStartEdit:()=>{$(t.id),S(t.name),C(t.content),k(t.scope),m(t.projectPaths??(t.projectPath?[t.projectPath]:[]))},onCancelEdit:()=>{$(null),S(""),C(""),k("global"),m([])},onSaveEdit:()=>void O(),onDelete:()=>void K(t.id)},t.id))})]}),Array.from(T.folderGroups.entries()).map(([t,s])=>e.jsxs("div",{children:[e.jsx("h2",{className:"text-[11px] uppercase tracking-wider text-cc-muted font-semibold mb-1.5 px-1",children:s.label}),e.jsx("div",{className:"space-y-1",children:s.prompts.map(c=>e.jsx(ee,{prompt:c,isEditing:g===c.id,error:j,editName:D,editContent:G,editScope:L,editFolders:M,cwd:x,onEditNameChange:S,onEditContentChange:C,onEditScopeChange:n=>{k(n),n==="project"&&M.length===0&&x&&m([x])},onEditRemoveFolder:n=>m(_=>_.filter(W=>W!==n)),onEditAddFolder:()=>H(!0),onStartEdit:()=>{$(c.id),S(c.name),C(c.content),k(c.scope),m(c.projectPaths??(c.projectPath?[c.projectPath]:[]))},onCancelEdit:()=>{$(null),S(""),C(""),k("global"),m([])},onSaveEdit:()=>void O(),onDelete:()=>void K(c.id)},c.id))})]},t))]})]}),A&&e.jsx(Y,{initialPath:x||"/",onSelect:t=>{w(s=>s.includes(t)?s:[...s,t]),F(!1)},onClose:()=>F(!1)}),se&&e.jsx(Y,{initialPath:x||"/",onSelect:t=>{m(s=>s.includes(t)?s:[...s,t]),H(!1)},onClose:()=>H(!1)})]})}function ie({scope:r,onScopeChange:a,folders:i,onRemoveFolder:b,onAddFolder:h}){return e.jsxs("div",{className:"space-y-3",children:[e.jsxs("div",{children:[e.jsx("label",{className:"block text-xs font-medium uppercase tracking-[0.24em] text-cc-muted",children:"Scope"}),e.jsx("p",{className:"mt-1 text-xs text-cc-muted/80",children:"Choose whether this prompt should be available everywhere or only inside specific repos."})]}),e.jsxs("div",{className:"flex flex-wrap items-center gap-2",children:[e.jsx("button",{type:"button","aria-pressed":r==="global",onClick:()=>a("global"),className:`inline-flex min-h-[40px] items-center rounded-full border px-4 py-2 text-sm transition-colors cursor-pointer ${r==="global"?"border-cc-primary/40 text-cc-primary bg-cc-primary/10 shadow-[inset_0_0_0_1px_rgba(255,255,255,0.04)]":"border-cc-border text-cc-muted hover:text-cc-fg hover:bg-cc-hover"}`,children:"Global"}),e.jsx("button",{type:"button","aria-pressed":r==="project",onClick:()=>a("project"),className:`inline-flex min-h-[40px] items-center rounded-full border px-4 py-2 text-sm transition-colors cursor-pointer ${r==="project"?"border-cc-primary/40 text-cc-primary bg-cc-primary/10 shadow-[inset_0_0_0_1px_rgba(255,255,255,0.04)]":"border-cc-border text-cc-muted hover:text-cc-fg hover:bg-cc-hover"}`,children:"Project folders"})]}),r==="project"&&e.jsxs("div",{className:"rounded-2xl border border-cc-border/70 bg-cc-bg/60 p-3 space-y-3",children:[e.jsx("div",{className:"flex items-start justify-between gap-3",children:e.jsxs("div",{children:[e.jsx("p",{className:"text-sm font-medium text-cc-fg",children:"Project folders"}),e.jsx("p",{className:"mt-1 text-xs text-cc-muted",children:"Prompts scoped to folders only appear when the active session is inside one of those paths."})]})}),i.length>0&&e.jsx("div",{className:"flex flex-wrap gap-1.5",children:i.map(l=>e.jsxs("span",{className:"inline-flex min-h-[32px] items-center gap-1.5 rounded-full border border-cc-border/80 bg-cc-hover px-3 py-1.5 text-xs font-mono-code text-cc-fg",children:[e.jsx("span",{className:"truncate max-w-[200px]",title:l,children:l.split("/").pop()||l}),e.jsx("button",{type:"button",onClick:()=>b(l),className:"text-cc-muted hover:text-cc-error cursor-pointer shrink-0","aria-label":`Remove folder ${l}`,children:e.jsx("svg",{viewBox:"0 0 16 16",fill:"none",stroke:"currentColor",strokeWidth:"2",className:"w-3 h-3",children:e.jsx("path",{d:"M4 4l8 8M12 4l-8 8",strokeLinecap:"round"})})})]},l))}),e.jsxs("button",{type:"button",onClick:h,className:"inline-flex min-h-[40px] items-center gap-1.5 rounded-full border border-dashed border-cc-border px-3 py-2 text-sm text-cc-muted transition-colors cursor-pointer hover:text-cc-fg hover:bg-cc-hover",children:[e.jsx("svg",{viewBox:"0 0 16 16",fill:"none",stroke:"currentColor",strokeWidth:"1.5",className:"w-3 h-3",children:e.jsx("path",{d:"M8 3v10M3 8h10",strokeLinecap:"round"})}),"Add folder"]})]})]})}function te({mode:r,name:a,content:i,scope:b,folders:h,saving:l=!1,error:f,submitLabel:j,cancelLabel:d="Cancel",onNameChange:v,onContentChange:P,onScopeChange:y,onRemoveFolder:E,onAddFolder:u,onSubmit:N,onCancel:p}){const w=!!(a.trim()&&i.trim()),A=i.split(/\r?\n/).length,F=i.length;return e.jsxs("section",{className:"overflow-hidden rounded-[28px] border border-cc-border/70 bg-cc-card shadow-[0_20px_60px_rgba(0,0,0,0.22)]",children:[e.jsx("div",{className:"border-b border-cc-border/60 bg-[linear-gradient(135deg,rgba(255,255,255,0.04),rgba(255,255,255,0))] px-5 py-4 sm:px-6",children:e.jsxs("div",{className:"flex flex-wrap items-start justify-between gap-3",children:[e.jsxs("div",{children:[e.jsx("p",{className:"text-[11px] font-semibold uppercase tracking-[0.28em] text-cc-primary/80",children:r==="create"?"Prompt Studio":"Edit Prompt"}),e.jsx("h2",{className:"mt-1 text-xl font-semibold text-cc-fg",children:r==="create"?"Write with room to think":"Refine this saved prompt"}),e.jsx("p",{className:"mt-1 max-w-2xl text-sm leading-relaxed text-cc-muted",children:"Structure the title, scope, and body separately so longer instructions stay easy to review before saving."})]}),e.jsxs("div",{className:"flex flex-wrap gap-2 text-xs text-cc-muted",children:[e.jsxs("span",{className:"inline-flex min-h-[32px] items-center rounded-full border border-cc-border/70 bg-cc-bg/60 px-3",children:[A," line",A>1?"s":""]}),e.jsxs("span",{className:"inline-flex min-h-[32px] items-center rounded-full border border-cc-border/70 bg-cc-bg/60 px-3",children:[F," char",F>1?"s":""]})]})]})}),e.jsxs("div",{className:"grid gap-0 lg:grid-cols-[minmax(280px,340px)_minmax(0,1fr)]",children:[e.jsx("div",{className:"border-b border-cc-border/60 p-5 sm:p-6 lg:border-b-0 lg:border-r",children:e.jsxs("div",{className:"space-y-5",children:[e.jsxs("div",{children:[e.jsx("label",{className:"mb-1.5 block text-xs font-medium uppercase tracking-[0.24em] text-cc-muted",htmlFor:r==="create"?"prompt-name":void 0,children:"Title"}),e.jsx("input",{id:r==="create"?"prompt-name":void 0,type:"text",value:a,onChange:g=>v(g.target.value),placeholder:"review-pr",className:"w-full rounded-2xl border border-cc-border/70 bg-cc-bg px-4 py-3 text-sm text-cc-fg placeholder:text-cc-muted focus:outline-none focus:ring-1 focus:ring-cc-primary/40 transition-shadow"}),e.jsxs("p",{className:"mt-2 text-xs leading-relaxed text-cc-muted",children:["Use a short handle that is easy to insert with ",e.jsx("code",{className:"rounded bg-cc-hover px-1 py-0.5 text-[11px] text-cc-fg",children:"@title"}),"."]})]}),e.jsx(ie,{scope:b,onScopeChange:y,folders:h,onRemoveFolder:E,onAddFolder:u}),e.jsxs("div",{className:"rounded-2xl border border-dashed border-cc-border/70 bg-cc-bg/40 p-4",children:[e.jsx("p",{className:"text-xs font-medium uppercase tracking-[0.24em] text-cc-muted",children:"Storage"}),e.jsxs("p",{className:"mt-2 text-sm leading-relaxed text-cc-muted",children:["Saved in ",e.jsx("code",{className:"text-[11px] text-cc-fg",children:"~/.companion/prompts.json"})," and available from the composer autocomplete."]})]})]})}),e.jsx("div",{className:"p-5 sm:p-6",children:e.jsxs("div",{className:"space-y-4",children:[e.jsx("div",{className:"flex flex-wrap items-end justify-between gap-3",children:e.jsxs("div",{children:[e.jsx("label",{className:"mb-1.5 block text-xs font-medium uppercase tracking-[0.24em] text-cc-muted",htmlFor:r==="create"?"prompt-content":void 0,children:"Content"}),e.jsx("p",{className:"text-sm text-cc-muted",children:"Longer prompts stay readable here. Leave breathing room for detailed review flows, checklists, or operating instructions."})]})}),e.jsx("textarea",{id:r==="create"?"prompt-content":void 0,value:i,onChange:g=>P(g.target.value),placeholder:"Review this PR and summarize risks, regressions, and missing tests.",rows:r==="create"?14:10,className:"min-h-[320px] w-full resize-y rounded-[24px] border border-cc-border/70 bg-cc-bg px-4 py-4 text-sm leading-7 text-cc-fg placeholder:text-cc-muted focus:outline-none focus:ring-1 focus:ring-cc-primary/40 transition-shadow lg:min-h-[420px]"}),f&&e.jsx("div",{className:"rounded-2xl border border-cc-error/20 bg-cc-error/10 px-4 py-3 text-sm text-cc-error",children:f}),e.jsxs("div",{className:"flex flex-wrap items-center justify-end gap-2 border-t border-cc-border/60 pt-4",children:[p&&e.jsx("button",{type:"button",onClick:p,className:"min-h-[44px] rounded-full px-4 py-2.5 text-sm text-cc-muted transition-colors cursor-pointer hover:bg-cc-hover hover:text-cc-fg",children:d}),e.jsx("button",{type:N?"button":"submit",onClick:N,disabled:l||!w,className:`min-h-[44px] rounded-full px-5 py-2.5 text-sm font-medium transition-colors ${l||!w?"bg-cc-hover text-cc-muted cursor-not-allowed":"bg-cc-primary text-white cursor-pointer hover:bg-cc-primary-hover"}`,children:j})]})]})})]})]})}function le({prompt:r}){if(r.scope==="global")return e.jsx("span",{className:"text-[10px] uppercase tracking-wider text-cc-muted opacity-60",children:"global"});const a=r.projectPaths??(r.projectPath?[r.projectPath]:[]);return a.length===0?null:e.jsx("span",{className:"inline-flex items-center gap-1 flex-wrap",children:a.map(i=>e.jsx("span",{className:"text-[10px] px-1.5 py-0.5 rounded bg-cc-primary/8 text-cc-primary/70 font-mono-code",title:i,children:i.split("/").pop()||i},i))})}function ee({prompt:r,isEditing:a,error:i,editName:b,editContent:h,editScope:l,editFolders:f,onEditNameChange:j,onEditContentChange:d,onEditScopeChange:v,onEditRemoveFolder:P,onEditAddFolder:y,onStartEdit:E,onCancelEdit:u,onSaveEdit:N,onDelete:p}){return a?e.jsx("div",{className:"rounded-2xl",style:{animation:"fadeSlideIn 150ms ease-out"},children:e.jsx(te,{mode:"edit",name:b,content:h,scope:l,folders:f,error:i,submitLabel:"Save",onNameChange:j,onContentChange:d,onScopeChange:v,onRemoveFolder:P,onAddFolder:y,onCancel:u,onSubmit:N})}):e.jsxs("div",{className:"group flex items-start gap-3 px-3 py-3 min-h-[44px] rounded-lg hover:bg-cc-hover/60 transition-colors",children:[e.jsx("div",{className:"shrink-0 mt-0.5 w-7 h-7 rounded-md bg-cc-primary/10 flex items-center justify-center",children:e.jsx("svg",{viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"1.5",className:"w-3.5 h-3.5 text-cc-primary",children:e.jsx("path",{d:"M7 8h10M7 12h6M3 5a2 2 0 0 1 2-2h14a2 2 0 0 1 2 2v10a2 2 0 0 1-2 2H8l-4 4V5Z"})})}),e.jsxs("div",{className:"flex-1 min-w-0",children:[e.jsxs("div",{className:"flex items-center gap-2",children:[e.jsx("span",{className:"text-sm font-medium text-cc-fg truncate",children:r.name}),e.jsx(le,{prompt:r})]}),e.jsx("p",{className:"mt-0.5 text-xs text-cc-muted line-clamp-2 leading-relaxed",children:r.content})]}),e.jsxs("div",{className:"shrink-0 flex items-center gap-0.5 opacity-100 sm:opacity-0 sm:group-hover:opacity-100 transition-opacity",children:[e.jsx("button",{onClick:E,className:"p-2 min-h-[44px] min-w-[44px] sm:min-h-0 sm:min-w-0 sm:p-1.5 rounded-md text-cc-muted hover:text-cc-fg hover:bg-cc-active transition-colors cursor-pointer","aria-label":"Edit",children:e.jsxs("svg",{viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"1.5",className:"w-3.5 h-3.5",children:[e.jsx("path",{d:"M11 4H4a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2v-7"}),e.jsx("path",{d:"M18.5 2.5a2.121 2.121 0 0 1 3 3L12 15l-4 1 1-4 9.5-9.5Z"})]})}),e.jsx("button",{onClick:p,className:"p-2 min-h-[44px] min-w-[44px] sm:min-h-0 sm:min-w-0 sm:p-1.5 rounded-md text-cc-muted hover:text-cc-error hover:bg-cc-error/10 transition-colors cursor-pointer","aria-label":"Delete",children:e.jsx("svg",{viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"1.5",className:"w-3.5 h-3.5",children:e.jsx("path",{d:"M3 6h18M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2m3 0v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6h14Z"})})})]})]})}export{me as PromptsPage};

package/dist/assets/RunsPage-DUJ1QUSa.js

@@ -0,0 +1 @@
+import{r,a as N,j as e,t as I}from"./index-DkqeP-R9.js";function g(c){switch(c){case"manual":return"Manual";case"webhook":return"Webhook";case"schedule":return"Schedule";case"linear":return"Linear";default:return c}}function v(c){switch(c){case"manual":return"bg-blue-500/10 text-blue-600 dark:text-blue-400";case"webhook":return"bg-purple-500/10 text-purple-600 dark:text-purple-400";case"schedule":return"bg-amber-500/10 text-amber-600 dark:text-amber-400";case"linear":return"bg-violet-500/10 text-violet-600 dark:text-violet-400";default:return"bg-cc-hover text-cc-muted"}}function E(c){return c.error?{label:"Error",color:"text-cc-error"}:c.success?{label:"Success",color:"text-cc-success"}:c.completedAt?{label:"Unknown",color:"text-cc-muted"}:{label:"Running",color:"text-cc-warning"}}function y(c,x){const l=(x||Date.now())-c;if(l<1e3)return"<1s";if(l<6e4)return`${Math.round(l/1e3)}s`;const u=Math.floor(l/6e4),h=Math.round(l%6e4/1e3);return`${u}m ${h}s`}function T(){const[c,x]=r.useState([]),[m,l]=r.useState([]),[u,h]=r.useState(0),[k,w]=r.useState(!0),[n,A]=r.useState("all"),[i,S]=r.useState("all"),[o,C]=r.useState(""),[s,f]=r.useState(null),p=r.useCallback(async()=>{try{const t={limit:100};n!=="all"&&(t.triggerType=n),i!=="all"&&(t.status=i),o&&(t.agentId=o);const a=await N.listExecutions(t);x(a.executions),h(a.total)}catch(t){console.error("[runs] Failed to fetch executions:",t)}finally{w(!1)}},[n,i,o]),b=r.useCallback(async()=>{try{const t=await N.listAgents();l(t)}catch(t){console.error("[runs] Failed to fetch agents:",t)}},[]);r.useEffect(()=>{b()},[b]),r.useEffect(()=>{p();const t=setInterval(p,5e3);return()=>clearInterval(t)},[p]);const j=t=>{const a=m.find(d=>d.id===t);return(a==null?void 0:a.name)||t};return e.jsxs("div",{className:"h-full flex flex-col bg-cc-bg",children:[e.jsxs("div",{className:"shrink-0 border-b border-cc-border px-6 py-4",children:[e.jsx("h1",{className:"text-lg font-semibold text-cc-fg",children:"Runs"}),e.jsx("p",{className:"text-sm text-cc-muted mt-1",children:"Monitor agent executions across all triggers"})]}),e.jsxs("div",{className:"shrink-0 border-b border-cc-border px-6 py-3 flex items-center gap-4 flex-wrap",children:[e.jsxs("select",{value:o,onChange:t=>C(t.target.value),className:"text-sm rounded-md border border-cc-border bg-cc-input-bg text-cc-fg px-2 py-1","aria-label":"Filter by agent",children:[e.jsx("option",{value:"",children:"All agents"}),m.map(t=>e.jsx("option",{value:t.id,children:t.name},t.id))]}),e.jsx("div",{className:"flex items-center gap-1",children:["all","manual","webhook","schedule","linear"].map(t=>e.jsx("button",{onClick:()=>A(t),className:`text-xs px-2.5 py-1 rounded-full transition-colors ${n===t?"bg-cc-fg text-cc-bg":"bg-cc-hover text-cc-muted hover:text-cc-fg"}`,children:t==="all"?"All triggers":g(t)},t))}),e.jsx("div",{className:"flex items-center gap-1",children:["all","running","success","error"].map(t=>e.jsx("button",{onClick:()=>S(t),className:`text-xs px-2.5 py-1 rounded-full transition-colors ${i===t?"bg-cc-fg text-cc-bg":"bg-cc-hover text-cc-muted hover:text-cc-fg"}`,children:t==="all"?"All statuses":t.charAt(0).toUpperCase()+t.slice(1)},t))}),e.jsxs("span",{className:"text-xs text-cc-muted ml-auto",children:[u," total"]})]}),e.jsx("div",{className:"flex-1 overflow-auto",children:k?e.jsx("div",{className:"text-sm text-cc-muted text-center py-12",children:"Loading..."}):c.length===0?e.jsxs("div",{className:"text-center py-16",children:[e.jsx("div",{className:"mb-3 flex justify-center text-cc-muted",children:e.jsx("svg",{viewBox:"0 0 16 16",fill:"currentColor",className:"w-8 h-8",children:e.jsx("path",{d:"M8 1a7 7 0 100 14A7 7 0 008 1zm-.75 3.5a.75.75 0 011.5 0v3.19l2.03 2.03a.75.75 0 01-1.06 1.06l-2.25-2.25A.75.75 0 017.25 8V4.5z"})})}),e.jsx("p",{className:"text-sm text-cc-muted",children:"No executions found"}),e.jsx("p",{className:"text-xs text-cc-muted mt-1",children:"Run an agent to see executions here"})]}):e.jsxs("table",{className:"w-full text-sm",role:"table",children:[e.jsx("thead",{className:"sticky top-0 bg-cc-card backdrop-blur",children:e.jsxs("tr",{className:"text-left text-xs text-cc-muted uppercase tracking-wider",children:[e.jsx("th",{className:"px-6 py-2 font-medium",children:"Agent"}),e.jsx("th",{className:"px-4 py-2 font-medium",children:"Trigger"}),e.jsx("th",{className:"px-4 py-2 font-medium",children:"Status"}),e.jsx("th",{className:"px-4 py-2 font-medium",children:"Started"}),e.jsx("th",{className:"px-4 py-2 font-medium",children:"Duration"}),e.jsx("th",{className:"px-4 py-2 font-medium",children:"Session"})]})}),e.jsx("tbody",{className:"divide-y divide-cc-border/50",children:c.map(t=>{const a=E(t),d=(s==null?void 0:s.sessionId)===t.sessionId;return e.jsxs("tr",{onClick:()=>f(d?null:t),className:`cursor-pointer transition-colors ${d?"bg-cc-active":"hover:bg-cc-hover"}`,children:[e.jsx("td",{className:"px-6 py-3",children:e.jsx("div",{className:"flex items-center gap-2",children:e.jsx("span",{className:"text-cc-fg font-medium",children:j(t.agentId)})})}),e.jsx("td",{className:"px-4 py-3",children:e.jsx("span",{className:`inline-flex items-center px-2 py-0.5 rounded-full text-xs font-medium ${v(t.triggerType)}`,children:g(t.triggerType)})}),e.jsx("td",{className:"px-4 py-3",children:e.jsxs("span",{className:`font-medium ${a.color}`,children:[!t.completedAt&&!t.error&&e.jsx("span",{className:"inline-block w-1.5 h-1.5 rounded-full bg-cc-warning mr-1.5 animate-pulse"}),a.label]})}),e.jsx("td",{className:"px-4 py-3 text-cc-muted",children:I(t.startedAt)}),e.jsx("td",{className:"px-4 py-3 text-cc-muted font-mono text-xs",children:y(t.startedAt,t.completedAt)}),e.jsx("td",{className:"px-4 py-3",children:t.sessionId&&e.jsx("a",{href:`#/session/${t.sessionId}`,onClick:$=>$.stopPropagation(),className:"text-cc-primary hover:text-cc-primary-hover text-xs font-mono underline",children:"Open"})})]},`${t.sessionId}-${t.startedAt}`)})})]})}),s&&e.jsxs("div",{className:"shrink-0 border-t border-cc-border bg-cc-card px-6 py-4",children:[e.jsxs("div",{className:"flex items-center justify-between mb-2",children:[e.jsx("h3",{className:"text-sm font-semibold text-cc-fg",children:"Execution Details"}),e.jsx("button",{onClick:()=>f(null),className:"text-cc-muted hover:text-cc-fg text-sm transition-colors","aria-label":"Close details",children:"Close"})]}),e.jsxs("div",{className:"grid grid-cols-2 md:grid-cols-4 gap-4 text-sm",children:[e.jsxs("div",{children:[e.jsx("span",{className:"text-cc-muted",children:"Agent"}),e.jsx("p",{className:"text-cc-fg font-medium",children:j(s.agentId)})]}),e.jsxs("div",{children:[e.jsx("span",{className:"text-cc-muted",children:"Trigger"}),e.jsx("p",{className:`inline-flex items-center px-2 py-0.5 rounded-full text-xs font-medium ${v(s.triggerType)}`,children:g(s.triggerType)})]}),e.jsxs("div",{children:[e.jsx("span",{className:"text-cc-muted",children:"Started"}),e.jsx("p",{className:"text-cc-fg",children:new Date(s.startedAt).toLocaleString()})]}),e.jsxs("div",{children:[e.jsx("span",{className:"text-cc-muted",children:"Duration"}),e.jsx("p",{className:"text-cc-fg font-mono",children:y(s.startedAt,s.completedAt)})]})]}),s.error&&e.jsx("div",{className:"mt-3 p-2 bg-cc-error/10 rounded text-sm text-cc-error font-mono whitespace-pre-wrap",children:s.error}),s.sessionId&&e.jsx("a",{href:`#/session/${s.sessionId}`,className:"mt-3 inline-flex items-center gap-1 text-sm text-cc-primary hover:text-cc-primary-hover",children:"Open session to view live output"})]})]})}export{T as RunsPage};

package/dist/assets/SandboxManager-CrVQ-VU_.js

@@ -0,0 +1,8 @@
+import{r as n,a as c,j as e}from"./index-DkqeP-R9.js";function X({embedded:f=!1}){const[u,C]=n.useState([]),[V,W]=n.useState(!0),[v,l]=n.useState(""),[o,M]=n.useState(!1),[k,R]=n.useState(!1),[b,B]=n.useState(null),[s,E]=n.useState(null),i=n.useRef(null),[p,I]=n.useState(""),[T,D]=n.useState(""),[j,y]=n.useState(null),[P,$]=n.useState(""),[N,H]=n.useState(""),[h,w]=n.useState(null),[m,d]=n.useState(null),x=n.useRef({}),[S,z]=n.useState(""),g=n.useCallback(()=>{c.listSandboxes().then(C).catch(()=>{}).finally(()=>W(!1))},[]);n.useEffect(()=>{g(),c.getContainerStatus().then(t=>B(t.available)).catch(()=>B(!1)),c.getImageStatus("the-companion:latest").then(t=>E(t)).catch(()=>{}),c.getHome().then(({cwd:t})=>z(t)).catch(()=>{})},[g]),n.useEffect(()=>{if(!s||s.status!=="pulling"){i.current&&(clearInterval(i.current),i.current=null);return}return i.current||(i.current=setInterval(()=>{c.getImageStatus("the-companion:latest").then(t=>E(t)).catch(()=>{})},2e3)),()=>{i.current&&(clearInterval(i.current),i.current=null)}},[s]);function L(){c.pullImage("the-companion:latest").then(t=>{t.state&&E(t.state)}).catch(()=>{})}async function A(){const t=p.trim();if(t){R(!0);try{await c.createSandbox(t,{initScript:T||void 0}),I(""),D(""),M(!1),l(""),g()}catch(r){l(r instanceof Error?r.message:String(r))}finally{R(!1)}}}function Z(t){x.current={},y(t.slug),$(t.name),H(t.initScript||""),d(null),l("")}function q(){x.current={},y(null),d(null),w(null),l("")}async function K(){if(j){x.current={},w(null);try{await c.updateSandbox(j,{name:P.trim()||void 0,initScript:N||void 0}),y(null),d(null),l(""),g()}catch(t){l(t instanceof Error?t.message:String(t))}}}async function U(t){try{await c.deleteSandbox(t),j===t&&y(null),g()}catch(r){l(r instanceof Error?r.message:String(r))}}async function F(t){if(!S)return;const r={};x.current=r,w(t),d(null);try{const a=await c.testInitScript(t,S,N);if(x.current!==r)return;d(a)}catch(a){if(x.current!==r)return;d({success:!1,exitCode:-1,output:a instanceof Error?a.message:String(a)})}finally{x.current===r&&w(null)}}const G=b===null?null:b?e.jsx("span",{className:"text-[10px] px-2 py-1 rounded-md bg-green-500/10 text-green-500 font-medium",children:"Docker"}):e.jsx("span",{className:"text-[10px] px-2 py-1 rounded-md bg-amber-500/10 text-amber-500 font-medium",children:"No Docker"});function J(){if(!b)return null;const t=(s==null?void 0:s.status)==="pulling";return e.jsxs("div",{className:"rounded-xl bg-cc-card p-3 sm:p-4 mb-5",children:[e.jsxs("div",{className:"flex items-center justify-between gap-2",children:[e.jsxs("div",{className:"flex items-center gap-2 min-w-0",children:[e.jsx("span",{className:"text-[11px] font-medium text-cc-muted",children:"Base Image"}),e.jsx("code",{className:"text-[10px] font-mono-code text-cc-fg",children:"the-companion:latest"}),(s==null?void 0:s.status)==="ready"&&e.jsx("span",{className:"text-[10px] px-1.5 py-0.5 rounded bg-green-500/10 text-green-500",children:"Ready"}),(s==null?void 0:s.status)==="pulling"&&e.jsxs("span",{className:"text-[10px] px-1.5 py-0.5 rounded bg-amber-500/10 text-amber-500 flex items-center gap-1",children:[e.jsx("span",{className:"w-2.5 h-2.5 border border-amber-500/30 border-t-amber-500 rounded-full animate-spin"}),"Pulling..."]}),(s==null?void 0:s.status)==="error"&&e.jsx("span",{className:"text-[10px] px-1.5 py-0.5 rounded bg-cc-error/10 text-cc-error",children:"Pull failed"}),(!s||s.status==="idle")&&e.jsx("span",{className:"text-[10px] px-1.5 py-0.5 rounded bg-cc-hover text-cc-muted",children:"Not downloaded"})]}),(s==null?void 0:s.status)!=="ready"&&e.jsx("button",{onClick:L,disabled:t,className:`text-xs px-3 py-2 min-h-[36px] rounded-lg transition-colors shrink-0 ${t?"bg-cc-hover text-cc-muted cursor-not-allowed":"bg-blue-500/10 text-blue-400 hover:bg-blue-500/20 cursor-pointer"}`,children:t?"Pulling...":"Pull"})]}),t&&(s==null?void 0:s.progress)&&s.progress.length>0&&e.jsx("pre",{className:"mt-2 px-3 py-2 text-[10px] font-mono-code bg-cc-code-bg rounded-lg text-cc-muted max-h-[120px] overflow-auto whitespace-pre-wrap",children:s.progress.slice(-20).join(`
+`)}),(s==null?void 0:s.status)==="error"&&s.error&&e.jsx("p",{className:"mt-2 text-[10px] text-cc-error",children:s.error})]})}return f?e.jsx("div",{className:"h-full bg-cc-bg text-cc-fg font-sans-ui antialiased overflow-y-auto overflow-x-hidden",children:e.jsxs("div",{className:"max-w-2xl mx-auto px-4 sm:px-6 py-6 sm:py-10 pb-safe",children:[e.jsxs("div",{className:"flex items-start justify-between gap-3 mb-2",children:[e.jsxs("div",{className:"min-w-0",children:[e.jsx("h1",{className:"text-lg font-semibold text-cc-fg",children:"Sandboxes"}),e.jsx("p",{className:"mt-0.5 text-[13px] text-cc-muted leading-relaxed",children:"Reusable sandbox configurations for containerized sessions."})]}),e.jsx("div",{className:"flex items-center gap-2 shrink-0",children:G})]}),J(),e.jsxs("div",{className:"flex items-center gap-2 mt-4 mb-5",children:[e.jsx("div",{className:"flex-1"}),e.jsxs("button",{onClick:()=>M(!o),className:`flex items-center gap-1.5 px-3.5 py-2.5 min-h-[44px] rounded-lg text-sm font-medium transition-colors cursor-pointer shrink-0 ${o?"bg-cc-active text-cc-fg":"bg-cc-primary hover:bg-cc-primary-hover text-white"}`,children:[e.jsx("svg",{viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",className:"w-4 h-4",children:o?e.jsx("path",{d:"M18 6 6 18M6 6l12 12"}):e.jsx("path",{d:"M12 5v14M5 12h14"})}),e.jsx("span",{className:"hidden sm:inline",children:o?"Cancel":"New Sandbox"})]})]}),o&&e.jsxs("div",{className:"mb-6 rounded-xl bg-cc-card p-4 sm:p-5 space-y-3",style:{animation:"fadeSlideIn 150ms ease-out"},children:[e.jsx("input",{type:"text",value:p,onChange:t=>I(t.target.value),placeholder:"Sandbox name (e.g. node-project)",className:"w-full px-3 py-2.5 min-h-[44px] text-sm bg-cc-bg rounded-lg text-cc-fg placeholder:text-cc-muted focus:outline-none focus:ring-1 focus:ring-cc-primary/40 transition-shadow",onKeyDown:t=>{t.key==="Enter"&&p.trim()&&A()}}),e.jsxs("div",{children:[e.jsx("label",{className:"block text-[11px] font-medium text-cc-muted mb-1",children:"Init Script (optional)"}),e.jsx("textarea",{value:T,onChange:t=>D(t.target.value),placeholder:`# Runs inside the container before Claude starts
+# Example:
+bun install
+pip install -r requirements.txt`,rows:5,className:"w-full px-3 py-2.5 text-[11px] font-mono-code bg-cc-bg rounded-lg text-cc-fg placeholder:text-cc-muted focus:outline-none focus:ring-1 focus:ring-cc-primary/40 resize-y transition-shadow",style:{minHeight:"80px"}})]}),v&&o&&e.jsx("div",{className:"px-3 py-2 rounded-lg bg-cc-error/10 text-xs text-cc-error",children:v}),e.jsxs("div",{className:"flex items-center justify-between pt-1",children:[e.jsxs("p",{className:"text-[11px] text-cc-muted",children:["Stored in ",e.jsx("code",{className:"text-[10px]",children:"~/.companion/sandboxes/"})]}),e.jsx("button",{onClick:A,disabled:!p.trim()||k,className:`px-4 py-2.5 min-h-[44px] rounded-lg text-sm font-medium transition-colors ${p.trim()&&!k?"bg-cc-primary hover:bg-cc-primary-hover text-white cursor-pointer":"bg-cc-hover text-cc-muted cursor-not-allowed"}`,children:k?"Creating...":"Create"})]})]}),e.jsx("div",{className:"flex items-center gap-2 mb-3 text-[12px] text-cc-muted",children:e.jsxs("span",{children:[u.length," sandbox",u.length!==1?"es":""]})}),V?e.jsx("div",{className:"py-12 text-center text-sm text-cc-muted",children:"Loading sandboxes..."}):u.length===0?e.jsx("div",{className:"py-12 text-center text-sm text-cc-muted",children:"No sandboxes yet."}):e.jsx("div",{className:"space-y-1",children:u.map(t=>j===t.slug?e.jsxs("div",{className:"rounded-xl bg-cc-card p-4 space-y-3",style:{animation:"fadeSlideIn 150ms ease-out"},children:[e.jsx("input",{type:"text",value:P,onChange:a=>$(a.target.value),placeholder:"Sandbox name",className:"w-full px-3 py-2.5 min-h-[44px] text-sm bg-cc-bg rounded-lg text-cc-fg focus:outline-none focus:ring-1 focus:ring-cc-primary/40 transition-shadow"}),e.jsxs("div",{children:[e.jsx("div",{className:"flex items-center justify-between mb-1",children:e.jsx("div",{className:"text-[11px] font-medium text-cc-muted",children:"Init Script (optional)"})}),e.jsx("textarea",{value:N,onChange:a=>{H(a.target.value),d(null)},placeholder:`# Runs inside the container before Claude starts
+# Example:
+bun install
+pip install -r requirements.txt`,rows:5,className:"w-full px-3 py-2.5 text-[11px] font-mono-code bg-cc-bg rounded-lg text-cc-fg placeholder:text-cc-muted focus:outline-none focus:ring-1 focus:ring-cc-primary/40 resize-y transition-shadow",style:{minHeight:"80px"}})]}),h===t.slug&&e.jsxs("div",{className:"flex items-center gap-2 px-3 py-2 rounded-lg bg-amber-500/10 text-xs text-amber-500",children:[e.jsx("span",{className:"w-3 h-3 border-2 border-amber-500/30 border-t-amber-500 rounded-full animate-spin"}),"Testing init script..."]}),m&&h!==t.slug&&e.jsxs("div",{className:"space-y-2",children:[e.jsx("div",{className:`flex items-center gap-2 px-3 py-2 rounded-lg text-xs ${m.success?"bg-green-500/10 text-green-500":"bg-cc-error/10 text-cc-error"}`,children:m.success?"Test passed":`Test failed (exit ${m.exitCode})`}),m.output&&e.jsx("pre",{className:"px-3 py-2 text-[10px] font-mono-code bg-cc-code-bg rounded-lg text-cc-muted max-h-[200px] overflow-auto whitespace-pre-wrap",children:m.output})]}),e.jsxs("div",{className:"flex justify-end gap-2",children:[N.trim()&&b&&e.jsx("button",{onClick:()=>void F(t.slug),disabled:h===t.slug||!S,className:`px-3 py-2.5 min-h-[44px] text-sm rounded-lg font-medium transition-colors ${h===t.slug||!S?"bg-cc-hover text-cc-muted cursor-not-allowed":"bg-blue-500/10 text-blue-400 hover:bg-blue-500/20 cursor-pointer"}`,children:h===t.slug?"Testing...":"Test Init Script"}),e.jsx("button",{onClick:q,className:"px-3 py-2.5 min-h-[44px] text-sm rounded-lg text-cc-muted hover:text-cc-fg hover:bg-cc-hover transition-colors cursor-pointer",children:"Cancel"}),e.jsx("button",{onClick:()=>void K(),className:"px-4 py-2.5 min-h-[44px] text-sm rounded-lg font-medium bg-cc-primary hover:bg-cc-primary-hover text-white transition-colors cursor-pointer",children:"Save"})]})]},t.slug):e.jsx(O,{sandbox:t,onStartEdit:()=>Z(t),onDelete:()=>void U(t.slug)},t.slug))}),v&&!o&&e.jsx("div",{className:"mt-4 px-3 py-2 rounded-lg bg-cc-error/10 text-xs text-cc-error",children:v})]})}):e.jsx("div",{className:"h-full bg-cc-bg text-cc-fg font-sans-ui antialiased overflow-y-auto overflow-x-hidden",children:e.jsx("div",{className:"max-w-2xl mx-auto px-4 sm:px-6 py-6 sm:py-10 pb-safe",children:e.jsx("div",{className:"py-12 text-center text-sm text-cc-muted",children:"Use embedded mode to view sandboxes."})})})}function O({sandbox:f,onStartEdit:u,onDelete:C}){return e.jsxs("div",{className:"group flex items-start gap-3 px-3 py-3 min-h-[44px] rounded-lg hover:bg-cc-hover/60 transition-colors",children:[e.jsx("div",{className:"shrink-0 mt-0.5 w-7 h-7 rounded-md bg-cc-primary/10 flex items-center justify-center",children:e.jsxs("svg",{viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"1.5",className:"w-3.5 h-3.5 text-cc-primary",children:[e.jsx("path",{d:"M21 16V8a2 2 0 0 0-1-1.73l-7-4a2 2 0 0 0-2 0l-7 4A2 2 0 0 0 3 8v8a2 2 0 0 0 1 1.73l7 4a2 2 0 0 0 2 0l7-4A2 2 0 0 0 21 16Z"}),e.jsx("path",{d:"M3.27 6.96 12 12.01l8.73-5.05M12 22.08V12"})]})}),e.jsxs("div",{className:"flex-1 min-w-0",children:[e.jsx("div",{className:"flex items-center gap-2",children:e.jsx("span",{className:"text-sm font-medium text-cc-fg truncate",children:f.name})}),e.jsx("p",{className:"mt-0.5 text-xs text-cc-muted",children:f.initScript?"init script":"no init script"})]}),e.jsxs("div",{className:"shrink-0 flex items-center gap-0.5 opacity-100 sm:opacity-0 sm:group-hover:opacity-100 transition-opacity",children:[e.jsx("button",{onClick:u,className:"p-2 min-h-[44px] min-w-[44px] sm:min-h-0 sm:min-w-0 sm:p-1.5 rounded-md text-cc-muted hover:text-cc-fg hover:bg-cc-active transition-colors cursor-pointer","aria-label":"Edit",children:e.jsxs("svg",{viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"1.5",className:"w-3.5 h-3.5",children:[e.jsx("path",{d:"M11 4H4a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2v-7"}),e.jsx("path",{d:"M18.5 2.5a2.121 2.121 0 0 1 3 3L12 15l-4 1 1-4 9.5-9.5Z"})]})}),e.jsx("button",{onClick:C,className:"p-2 min-h-[44px] min-w-[44px] sm:min-h-0 sm:min-w-0 sm:p-1.5 rounded-md text-cc-muted hover:text-cc-error hover:bg-cc-error/10 transition-colors cursor-pointer","aria-label":"Delete",children:e.jsx("svg",{viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"1.5",className:"w-3.5 h-3.5",children:e.jsx("path",{d:"M3 6h18M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2m3 0v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6h14Z"})})})]})]})}export{X as SandboxManager};

package/dist/assets/SettingsPage-D1fPCL19.js

@@ -0,0 +1 @@
+import{r as s,u as a,g as et,a as n,j as e,n as tt,b as st,s as ct}from"./index-DkqeP-R9.js";const X=[{id:"general",label:"General"},{id:"webhooks",label:"Webhooks"},{id:"authentication",label:"Authentication"},{id:"notifications",label:"Notifications"},{id:"providers",label:"Providers"},{id:"anthropic",label:"Anthropic"},{id:"ai-validation",label:"AI Validation"},{id:"updates",label:"Updates"},{id:"telemetry",label:"Telemetry"},{id:"environments",label:"Environments"}];function at({embedded:Z=!1}){const[p,ee]=s.useState(""),[te,se]=s.useState("claude-sonnet-4-6"),[d,ce]=s.useState(!1),[w,$e]=s.useState(!0),[g,A]=s.useState(!1),[ne,b]=s.useState(""),[ae,y]=s.useState(!1),De=a(t=>t.darkMode),Ke=a(t=>t.toggleDarkMode),oe=a(t=>t.diffBase),Fe=a(t=>t.setDiffBase),Le=a(t=>t.notificationSound),Me=a(t=>t.toggleNotificationSound),ie=a(t=>t.notificationDesktop),re=a(t=>t.setNotificationDesktop),o=a(t=>t.updateInfo),V=a(t=>t.setUpdateInfo),Qe=a(t=>t.setUpdateOverlayActive),Be=typeof Notification<"u",[x,v]=s.useState("stable"),[S,I]=s.useState(!1),[P,le]=s.useState(!1),[R,de]=s.useState(!1),[ue,j]=s.useState(""),[xe,C]=s.useState(""),[pe,He]=s.useState(et()),[U,O]=s.useState(!1),[$,D]=s.useState(!0),[K,F]=s.useState(!1),[T,L]=s.useState(""),[me,he]=s.useState("general"),[_e,fe]=s.useState(!1),[M,ge]=s.useState(!1),[k,m]=s.useState(null),[h,be]=s.useState(""),[Q,ye]=s.useState(!1),[f,ve]=s.useState(""),[B,je]=s.useState(!1),[H,ke]=s.useState(!1),[qe,_]=s.useState(!1),[Ne,we]=s.useState(""),[Ge,Ae]=s.useState(!1),[Ye,Se]=s.useState(!1),[N,Ce]=s.useState(null),[q,Ue]=s.useState(!1),[u,Te]=s.useState(null),[E,We]=s.useState(0),[G,Ee]=s.useState(!1),[Y,Ve]=s.useState(!1),[ze,Ie]=s.useState(!1),Pe=s.useRef(null),W=s.useRef({});s.useEffect(()=>{const t=Pe.current;if(!t)return;const c=new IntersectionObserver(r=>{var Oe;let i=null;for(const J of r)J.isIntersecting&&(!i||J.boundingClientRect.top<i.boundingClientRect.top)&&(i=J);(Oe=i==null?void 0:i.target)!=null&&Oe.id&&he(i.target.id)},{root:t,rootMargin:"-10% 0px -70% 0px",threshold:0});for(const r of X){const i=W.current[r.id];i&&c.observe(i)}return()=>c.disconnect()},[w]);const Re=s.useCallback(t=>{he(t);const c=W.current[t];c&&c.scrollIntoView({behavior:"smooth",block:"start"})},[]);s.useEffect(()=>{n.getSettings().then(t=>{ce(t.anthropicApiKeyConfigured),ye(t.claudeCodeOAuthTokenConfigured),je(t.openaiApiKeyConfigured),se(t.anthropicModel||"claude-sonnet-4-6"),typeof t.aiValidationEnabled=="boolean"&&O(t.aiValidationEnabled),typeof t.aiValidationAutoApprove=="boolean"&&D(t.aiValidationAutoApprove),typeof t.aiValidationAutoDeny=="boolean"&&F(t.aiValidationAutoDeny),(t.updateChannel==="stable"||t.updateChannel==="prerelease")&&v(t.updateChannel),typeof t.dockerAutoUpdate=="boolean"&&I(t.dockerAutoUpdate),typeof t.publicUrl=="string"&&(L(t.publicUrl),a.getState().setPublicUrl(t.publicUrl))}).catch(t=>b(t instanceof Error?t.message:String(t))).finally(()=>$e(!1)),n.getAuthToken().then(t=>Ce(t.token)).catch(()=>{})},[]);async function Je(t){t.preventDefault(),A(!0),b(""),y(!1);try{const c=p.trim(),r={anthropicModel:te.trim()||"claude-sonnet-4-6"};c&&(r.anthropicApiKey=c);const i=await n.updateSettings(r);ce(i.anthropicApiKeyConfigured),ee(""),y(!0),setTimeout(()=>y(!1),1800)}catch(c){b(c instanceof Error?c.message:String(c))}finally{A(!1)}}async function z(t){const c=t==="aiValidationEnabled"?U:t==="aiValidationAutoApprove"?$:K,r=!c;t==="aiValidationEnabled"?O(r):t==="aiValidationAutoApprove"?D(r):F(r);try{await n.updateSettings({[t]:r})}catch{t==="aiValidationEnabled"?O(c):t==="aiValidationAutoApprove"?D(c):F(c)}}async function Xe(){le(!0),j(""),C("");try{const t=await n.forceCheckForUpdate();V(t),t.updateAvailable&&t.latestVersion?j(`Update v${t.latestVersion} is available.`):j("You are up to date.")}catch(t){C(t instanceof Error?t.message:String(t))}finally{le(!1)}}async function Ze(){de(!0),j(""),C("");try{localStorage.setItem("companion_docker_prompt_pending","1");const t=await n.triggerUpdate();j(t.message),Qe(!0)}catch(t){localStorage.removeItem("companion_docker_prompt_pending"),C(t instanceof Error?t.message:String(t)),de(!1)}}const l=s.useCallback(t=>c=>{W.current[t]=c},[]);return e.jsxs("div",{className:`${Z?"h-full":"h-[100dvh]"} bg-cc-bg text-cc-fg font-sans-ui antialiased flex flex-col`,children:[e.jsx("div",{className:"shrink-0 max-w-5xl w-full mx-auto px-4 sm:px-8 pt-6 sm:pt-10",children:e.jsxs("div",{className:"flex items-start justify-between gap-3 mb-6",children:[e.jsxs("div",{children:[e.jsx("h1",{className:"text-xl font-semibold text-cc-fg",children:"Settings"}),e.jsx("p",{className:"mt-1 text-sm text-cc-muted",children:"Configure API access, notifications, appearance, and workspace defaults."})]}),!Z&&e.jsx("button",{onClick:()=>{const t=a.getState().currentSessionId;t?tt(t):st()},className:"px-3 py-2.5 min-h-[44px] rounded-lg text-sm text-cc-muted hover:text-cc-fg hover:bg-cc-hover transition-colors cursor-pointer",children:"Back"})]})}),e.jsx("div",{className:"sm:hidden shrink-0 border-b border-cc-border",children:e.jsx("nav",{className:"flex gap-1 px-4 py-2 overflow-x-auto [scrollbar-width:none] [&::-webkit-scrollbar]:hidden","aria-label":"Settings categories",children:X.map(t=>e.jsx("button",{type:"button",onClick:()=>Re(t.id),className:`shrink-0 px-3 py-2 min-h-[44px] rounded-lg text-sm font-medium transition-colors cursor-pointer ${me===t.id?"text-cc-primary bg-cc-primary/8":"text-cc-muted hover:text-cc-fg hover:bg-cc-hover"}`,children:t.label},t.id))})}),e.jsxs("div",{className:"flex-1 min-h-0 flex max-w-5xl w-full mx-auto",children:[e.jsx("nav",{className:"hidden sm:flex flex-col gap-0.5 w-44 shrink-0 pt-2 pr-6 pl-8 sticky top-0 self-start","aria-label":"Settings categories",children:X.map(t=>e.jsx("button",{type:"button",onClick:()=>Re(t.id),className:`text-left px-3 py-2 min-h-[44px] rounded-lg text-sm font-medium transition-colors cursor-pointer ${me===t.id?"text-cc-primary bg-cc-primary/8":"text-cc-muted hover:text-cc-fg hover:bg-cc-hover"}`,children:t.label},t.id))}),e.jsx("div",{ref:Pe,className:"flex-1 min-w-0 overflow-y-auto px-4 sm:px-8 sm:pl-0 pb-safe",children:e.jsxs("div",{className:"space-y-10 py-4 sm:py-2",children:[e.jsxs("section",{id:"general",ref:l("general"),children:[e.jsx("h2",{className:"text-sm font-semibold text-cc-fg mb-4",children:"General"}),e.jsxs("div",{className:"space-y-3",children:[e.jsxs("button",{type:"button",onClick:Ke,className:"w-full flex items-center justify-between px-3 py-3 min-h-[44px] rounded-lg text-sm bg-cc-hover text-cc-fg hover:bg-cc-active transition-colors cursor-pointer",children:[e.jsx("span",{children:"Theme"}),e.jsx("span",{className:"text-xs text-cc-muted",children:De?"Dark":"Light"})]}),e.jsxs("button",{type:"button",onClick:()=>Fe(oe==="last-commit"?"default-branch":"last-commit"),className:"w-full flex items-center justify-between px-3 py-3 min-h-[44px] rounded-lg text-sm bg-cc-hover text-cc-fg hover:bg-cc-active transition-colors cursor-pointer",children:[e.jsx("span",{children:"Diff compare against"}),e.jsx("span",{className:"text-xs text-cc-muted",children:oe==="last-commit"?"Last commit (HEAD)":"Default branch"})]}),e.jsx("p",{className:"text-xs text-cc-muted px-1",children:"Last commit shows only uncommitted changes. Default branch shows all changes since diverging from main."})]})]}),e.jsxs("section",{id:"webhooks",ref:l("webhooks"),children:[e.jsx("h2",{className:"text-sm font-semibold text-cc-fg mb-4",children:"Webhooks"}),e.jsxs("div",{className:"space-y-4",children:[e.jsx("p",{className:"text-xs text-cc-muted",children:"The public URL is used for webhook URLs that external services (Linear, GitHub) send events to. Set this to the externally-reachable address of your Companion instance."}),e.jsxs("p",{className:"text-xs text-cc-muted",children:["Tip:"," ",e.jsx("a",{href:"#/integrations/tailscale",className:"text-cc-primary hover:underline",children:"Use the Tailscale integration"})," ","to get an HTTPS URL automatically."]}),e.jsxs("div",{children:[e.jsx("label",{className:"block text-xs font-medium text-cc-fg mb-1.5",htmlFor:"public-url",children:"Public URL"}),e.jsx("input",{id:"public-url",type:"url","aria-label":"Public URL",value:T,onChange:t=>L(t.target.value),placeholder:"https://your-domain.example.com",className:"w-full px-3 py-2.5 min-h-[44px] text-sm bg-cc-bg rounded-lg border border-cc-border text-cc-fg placeholder:text-cc-muted focus:outline-none focus:ring-1 focus:ring-cc-primary font-mono-code"}),e.jsx("p",{className:"mt-1.5 text-[10px] text-cc-muted",children:T?`Using: ${T}`:`Fallback: ${typeof window<"u"?window.location.origin:"http://localhost:3456"}`})]}),e.jsx("button",{type:"button",onClick:async()=>{A(!0),b("");try{const t=await n.updateSettings({publicUrl:T.trim()});L(t.publicUrl),a.getState().setPublicUrl(t.publicUrl),y(!0),setTimeout(()=>y(!1),1800)}catch(t){b(t instanceof Error?t.message:String(t))}finally{A(!1)}},disabled:g,className:"px-4 py-2 min-h-[44px] rounded-lg text-sm font-medium bg-cc-primary text-white hover:opacity-90 transition-opacity disabled:opacity-50 cursor-pointer",children:g?"Saving...":ae?"Saved!":"Save Public URL"})]})]}),e.jsxs("section",{id:"authentication",ref:l("authentication"),children:[e.jsx("h2",{className:"text-sm font-semibold text-cc-fg mb-4",children:"Authentication"}),e.jsxs("div",{className:"space-y-4",children:[e.jsx("p",{className:"text-xs text-cc-muted",children:"Use the auth token or QR code to connect additional devices (e.g. mobile over Tailscale)."}),e.jsxs("div",{children:[e.jsx("label",{className:"block text-sm font-medium mb-1.5",children:"Auth Token"}),e.jsxs("div",{className:"flex items-center gap-2",children:[e.jsx("div",{className:"flex-1 px-3 py-2.5 min-h-[44px] text-sm bg-cc-bg rounded-lg text-cc-fg font-mono-code select-all break-all flex items-center",children:N?q?N:"••••••••••••••••":e.jsx("span",{className:"text-cc-muted",children:"Loading..."})}),e.jsx("button",{type:"button",onClick:()=>Ue(t=>!t),className:"px-3 py-2.5 min-h-[44px] rounded-lg text-sm bg-cc-hover hover:bg-cc-active text-cc-fg transition-colors cursor-pointer",title:q?"Hide token":"Show token",children:q?"Hide":"Show"}),e.jsx("button",{type:"button",onClick:()=>{N&&navigator.clipboard.writeText(N).then(()=>{Ie(!0),setTimeout(()=>Ie(!1),1500)})},disabled:!N,className:"px-3 py-2.5 min-h-[44px] rounded-lg text-sm bg-cc-hover hover:bg-cc-active text-cc-fg transition-colors cursor-pointer disabled:opacity-50 disabled:cursor-not-allowed",title:"Copy token to clipboard",children:ze?"Copied":"Copy"})]})]}),e.jsxs("div",{children:[e.jsx("label",{className:"block text-sm font-medium mb-1.5",children:"Mobile Login QR"}),u&&u.length>0?e.jsxs("div",{className:"space-y-3",children:[u.length>1&&e.jsx("div",{className:"flex gap-1",children:u.map((t,c)=>e.jsx("button",{type:"button",onClick:()=>We(c),className:`px-3 py-1.5 rounded-md text-xs font-medium transition-colors cursor-pointer ${c===E?"bg-cc-primary text-white":"bg-cc-hover text-cc-muted hover:text-cc-fg"}`,children:t.label},t.label))}),e.jsx("div",{className:"inline-block rounded-lg bg-white p-2",children:e.jsx("img",{src:u[E].qrDataUrl,alt:`QR code for ${u[E].label} login`,className:"w-48 h-48"})}),e.jsx("div",{className:"px-3 py-2 rounded-lg bg-cc-bg text-sm font-mono-code text-cc-fg break-all select-all",children:u[E].url}),e.jsx("p",{className:"text-xs text-cc-muted",children:"Scan with your phone's camera app — it will open the URL and auto-authenticate."})]}):u&&u.length===0?e.jsx("p",{className:"text-xs text-cc-muted",children:"No remote addresses detected (LAN or Tailscale). Connect to a network to generate a QR code."}):e.jsx("button",{type:"button",onClick:async()=>{Ee(!0);try{const t=await n.getAuthQr();Te(t.qrCodes)}catch{}finally{Ee(!1)}},disabled:G,className:`px-3 py-2 min-h-[44px] rounded-lg text-sm font-medium transition-colors ${G?"bg-cc-hover text-cc-muted cursor-not-allowed":"bg-cc-hover hover:bg-cc-active text-cc-fg cursor-pointer"}`,children:G?"Generating...":"Show QR Code"})]}),e.jsxs("div",{className:"pt-2",children:[e.jsx("button",{type:"button",onClick:async()=>{if(confirm("Regenerate auth token? All existing sessions on other devices will be signed out.")){Ve(!0);try{const t=await n.regenerateAuthToken();Ce(t.token),Ue(!0),Te(null)}catch{}finally{Ve(!1)}}},disabled:Y,className:`px-3 py-2 min-h-[44px] rounded-lg text-sm font-medium transition-colors ${Y?"bg-cc-hover text-cc-muted cursor-not-allowed":"bg-cc-error/10 hover:bg-cc-error/20 text-cc-error cursor-pointer"}`,children:Y?"Regenerating...":"Regenerate Token"}),e.jsx("p",{className:"mt-1.5 text-xs text-cc-muted",children:"Creates a new token. All other signed-in devices will need to re-authenticate."})]})]})]}),e.jsxs("section",{id:"notifications",ref:l("notifications"),children:[e.jsx("h2",{className:"text-sm font-semibold text-cc-fg mb-4",children:"Notifications"}),e.jsxs("div",{className:"space-y-3",children:[e.jsxs("button",{type:"button",onClick:Me,className:"w-full flex items-center justify-between px-3 py-3 min-h-[44px] rounded-lg text-sm bg-cc-hover text-cc-fg hover:bg-cc-active transition-colors cursor-pointer",children:[e.jsx("span",{children:"Sound"}),e.jsx("span",{className:"text-xs text-cc-muted",children:Le?"On":"Off"})]}),Be&&e.jsxs("button",{type:"button",onClick:async()=>{if(ie)re(!1);else{if(Notification.permission!=="granted"&&await Notification.requestPermission()!=="granted")return;re(!0)}},className:"w-full flex items-center justify-between px-3 py-3 min-h-[44px] rounded-lg text-sm bg-cc-hover text-cc-fg hover:bg-cc-active transition-colors cursor-pointer",children:[e.jsx("span",{children:"Desktop Alerts"}),e.jsx("span",{className:"text-xs text-cc-muted",children:ie?"On":"Off"})]})]})]}),e.jsxs("section",{id:"providers",ref:l("providers"),children:[e.jsx("h2",{className:"text-sm font-semibold text-cc-fg mb-4",children:"Providers"}),e.jsxs("div",{className:"space-y-6",children:[e.jsx("p",{className:"text-xs text-cc-muted",children:"Configure authentication tokens for Claude Code and Codex. These are injected into sessions automatically."}),e.jsxs("div",{className:"space-y-2",children:[e.jsx("label",{className:"block text-sm font-medium",htmlFor:"claude-code-token",children:"Claude Code OAuth Token"}),e.jsxs("p",{className:"text-xs text-cc-muted",children:["Run ",e.jsx("code",{className:"font-mono-code bg-cc-code-bg px-1 py-0.5 rounded text-cc-code-fg",children:"claude setup-token"})," in your terminal, then paste the token here."]}),e.jsx("input",{id:"claude-code-token",type:"password",value:Q&&!Ge&&!h?"••••••••••••••••":h,onChange:t=>be(t.target.value),onFocus:()=>Ae(!0),onBlur:()=>Ae(!1),placeholder:Q?"Enter a new token to replace":"Paste token from claude setup-token",className:"w-full px-3 py-2.5 min-h-[44px] text-sm bg-cc-bg rounded-lg text-cc-fg placeholder:text-cc-muted focus:outline-none focus:ring-1 focus:ring-cc-primary/40 transition-shadow"}),e.jsx("p",{className:"text-xs text-cc-muted",children:Q?"Claude Code token configured":"Claude Code token not configured"})]}),e.jsxs("div",{className:"space-y-2",children:[e.jsx("label",{className:"block text-sm font-medium",htmlFor:"openai-api-key",children:"OpenAI API Key (Codex)"}),e.jsxs("p",{className:"text-xs text-cc-muted",children:["Used to authenticate Codex sessions. You can also use ",e.jsx("code",{className:"font-mono-code bg-cc-code-bg px-1 py-0.5 rounded text-cc-code-fg",children:"codex --login"})," for device-based auth."]}),e.jsx("input",{id:"openai-api-key",type:"password",value:B&&!Ye&&!f?"••••••••••••••••":f,onChange:t=>ve(t.target.value),onFocus:()=>Se(!0),onBlur:()=>Se(!1),placeholder:B?"Enter a new key to replace":"sk-...",className:"w-full px-3 py-2.5 min-h-[44px] text-sm bg-cc-bg rounded-lg text-cc-fg placeholder:text-cc-muted focus:outline-none focus:ring-1 focus:ring-cc-primary/40 transition-shadow"}),e.jsx("p",{className:"text-xs text-cc-muted",children:B?"OpenAI key configured":"OpenAI key not configured"})]}),Ne&&e.jsx("div",{className:"px-3 py-2 rounded-lg bg-cc-error/10 border border-cc-error/20 text-xs text-cc-error",children:Ne}),qe&&e.jsx("div",{className:"px-3 py-2 rounded-lg bg-cc-success/10 border border-cc-success/20 text-xs text-cc-success",children:"Provider settings saved."}),e.jsx("button",{type:"button",disabled:H||!h.trim()&&!f.trim(),onClick:async()=>{ke(!0),we(""),_(!1);try{const t={};h.trim()&&(t.claudeCodeOAuthToken=h.trim()),f.trim()&&(t.openaiApiKey=f.trim());const c=await n.updateSettings(t);ye(c.claudeCodeOAuthTokenConfigured),je(c.openaiApiKeyConfigured),be(""),ve(""),_(!0),setTimeout(()=>_(!1),1800)}catch(t){we(t instanceof Error?t.message:String(t))}finally{ke(!1)}},className:`px-4 py-2 min-h-[44px] rounded-lg text-sm font-medium transition-colors ${H||!h.trim()&&!f.trim()?"bg-cc-hover text-cc-muted cursor-not-allowed":"bg-cc-primary hover:bg-cc-primary-hover text-white cursor-pointer"}`,children:H?"Saving...":"Save Provider Settings"})]})]}),e.jsxs("section",{id:"anthropic",ref:l("anthropic"),children:[e.jsx("h2",{className:"text-sm font-semibold text-cc-fg mb-4",children:"Anthropic"}),e.jsxs("form",{onSubmit:Je,className:"space-y-4",children:[e.jsxs("div",{children:[e.jsx("label",{className:"block text-sm font-medium mb-1.5",htmlFor:"anthropic-key",children:"Anthropic API Key"}),e.jsx("input",{id:"anthropic-key",type:"password",value:d&&!_e&&!p?"••••••••••••••••":p,onChange:t=>{ee(t.target.value),m(null)},onFocus:()=>fe(!0),onBlur:()=>fe(!1),placeholder:d?"Enter a new key to replace":"sk-ant-api03-...",className:"w-full px-3 py-2.5 min-h-[44px] text-sm bg-cc-bg rounded-lg text-cc-fg placeholder:text-cc-muted focus:outline-none focus:ring-1 focus:ring-cc-primary/40 transition-shadow"}),e.jsx("p",{className:"mt-1.5 text-xs text-cc-muted",children:"Auto-renaming is disabled until this key is configured."})]}),e.jsxs("div",{children:[e.jsx("label",{className:"block text-sm font-medium mb-1.5",htmlFor:"anthropic-model",children:"Anthropic Model"}),e.jsx("input",{id:"anthropic-model",type:"text",value:te,onChange:t=>se(t.target.value),placeholder:"claude-sonnet-4-6",className:"w-full px-3 py-2.5 min-h-[44px] text-sm bg-cc-bg rounded-lg text-cc-fg placeholder:text-cc-muted focus:outline-none focus:ring-1 focus:ring-cc-primary/40 transition-shadow"})]}),ne&&e.jsx("div",{className:"px-3 py-2 rounded-lg bg-cc-error/10 border border-cc-error/20 text-xs text-cc-error",children:ne}),ae&&e.jsx("div",{className:"px-3 py-2 rounded-lg bg-cc-success/10 border border-cc-success/20 text-xs text-cc-success",children:"Settings saved."}),e.jsxs("div",{className:"flex items-center justify-between",children:[e.jsx("span",{className:"text-xs text-cc-muted",children:w?"Loading...":d?"Anthropic key configured":"Anthropic key not configured"}),e.jsxs("div",{className:"flex items-center gap-2",children:[e.jsx("button",{type:"button",disabled:M||!p.trim(),onClick:async()=>{ge(!0),m(null);try{const t=await n.verifyAnthropicKey(p.trim());m(t),setTimeout(()=>m(null),5e3)}catch(t){m({valid:!1,error:t instanceof Error?t.message:String(t)}),setTimeout(()=>m(null),5e3)}finally{ge(!1)}},className:`px-3 py-2 min-h-[44px] rounded-lg text-sm font-medium transition-colors ${M||!p.trim()?"bg-cc-hover text-cc-muted cursor-not-allowed":"bg-cc-hover hover:bg-cc-active text-cc-fg cursor-pointer"}`,children:M?"Verifying...":"Verify"}),e.jsx("button",{type:"submit",disabled:g||w,className:`px-3 py-2 min-h-[44px] rounded-lg text-sm font-medium transition-colors ${g||w?"bg-cc-hover text-cc-muted cursor-not-allowed":"bg-cc-primary hover:bg-cc-primary-hover text-white cursor-pointer"}`,children:g?"Saving...":"Save"})]})]}),k&&e.jsx("div",{className:`px-3 py-2 rounded-lg text-xs ${k.valid?"bg-cc-success/10 border border-cc-success/20 text-cc-success":"bg-cc-error/10 border border-cc-error/20 text-cc-error"}`,children:k.valid?"API key is valid.":`Invalid API key${k.error?`: ${k.error}`:"."}`})]})]}),e.jsxs("section",{id:"ai-validation",ref:l("ai-validation"),children:[e.jsx("h2",{className:"text-sm font-semibold text-cc-fg mb-4",children:"AI Validation"}),e.jsxs("div",{className:"space-y-3",children:[e.jsx("p",{className:"text-xs text-cc-muted leading-relaxed",children:"When enabled, an AI model evaluates tool calls before they execute. Safe operations are auto-approved, dangerous ones are blocked, and uncertain cases are shown to you with a recommendation. Requires an Anthropic API key. These settings serve as defaults for new sessions. Each session can override AI validation independently via the shield icon in the session header."}),e.jsxs("button",{type:"button",onClick:()=>z("aiValidationEnabled"),disabled:!d,className:`w-full flex items-center justify-between px-3 py-3 min-h-[44px] rounded-lg transition-colors ${d?"bg-cc-hover hover:bg-cc-active text-cc-fg cursor-pointer":"bg-cc-hover text-cc-muted cursor-not-allowed opacity-60"}`,children:[e.jsx("span",{className:"text-sm",children:"AI Validation Mode"}),e.jsx("span",{className:`text-xs font-medium ${U&&d?"text-cc-success":"text-cc-muted"}`,children:U&&d?"On":"Off"})]}),!d&&e.jsx("p",{className:"text-[11px] text-cc-warning",children:"Configure an Anthropic API key above to enable AI validation."}),U&&d&&e.jsxs(e.Fragment,{children:[e.jsxs("button",{type:"button",onClick:()=>z("aiValidationAutoApprove"),className:"w-full flex items-center justify-between px-3 py-3 min-h-[44px] rounded-lg bg-cc-hover hover:bg-cc-active text-cc-fg transition-colors cursor-pointer",children:[e.jsxs("div",{children:[e.jsx("span",{className:"text-sm",children:"Auto-approve safe tools"}),e.jsx("p",{className:"text-[11px] text-cc-muted mt-0.5",children:"Automatically allow read-only tools and benign commands"})]}),e.jsx("span",{className:`text-xs font-medium ${$?"text-cc-success":"text-cc-muted"}`,children:$?"On":"Off"})]}),e.jsxs("button",{type:"button",onClick:()=>z("aiValidationAutoDeny"),className:"w-full flex items-center justify-between px-3 py-3 min-h-[44px] rounded-lg bg-cc-hover hover:bg-cc-active text-cc-fg transition-colors cursor-pointer",children:[e.jsxs("div",{children:[e.jsx("span",{className:"text-sm",children:"Auto-deny dangerous tools"}),e.jsx("p",{className:"text-[11px] text-cc-muted mt-0.5",children:"Automatically block destructive commands like rm -rf"})]}),e.jsx("span",{className:`text-xs font-medium ${K?"text-cc-success":"text-cc-muted"}`,children:K?"On":"Off"})]})]})]})]}),e.jsxs("section",{id:"updates",ref:l("updates"),children:[e.jsx("h2",{className:"text-sm font-semibold text-cc-fg mb-4",children:"Updates"}),e.jsxs("div",{className:"space-y-3",children:[o?e.jsxs("p",{className:"text-xs text-cc-muted",children:["Current version: v",o.currentVersion,o.latestVersion?` • Latest: v${o.latestVersion}`:"",o.channel==="prerelease"?" (prerelease)":""]}):e.jsx("p",{className:"text-xs text-cc-muted",children:"Version information not loaded yet."}),e.jsxs("div",{children:[e.jsx("span",{id:"update-channel-label",className:"block text-sm font-medium mb-1.5",children:"Update Channel"}),e.jsxs("div",{className:"flex gap-1",role:"radiogroup","aria-labelledby":"update-channel-label",children:[e.jsx("button",{type:"button",role:"radio","aria-checked":x==="stable",onClick:async()=>{if(x!=="stable"){v("stable");try{await n.updateSettings({updateChannel:"stable"})}catch{v("prerelease");return}try{const t=await n.forceCheckForUpdate();V(t)}catch{}}},className:`px-3 py-2 min-h-[44px] rounded-lg text-sm font-medium transition-colors cursor-pointer ${x==="stable"?"bg-cc-primary text-white":"bg-cc-hover text-cc-muted hover:text-cc-fg hover:bg-cc-active"}`,children:"Stable"}),e.jsx("button",{type:"button",role:"radio","aria-checked":x==="prerelease",onClick:async()=>{if(x!=="prerelease"){v("prerelease");try{await n.updateSettings({updateChannel:"prerelease"})}catch{v("stable");return}try{const t=await n.forceCheckForUpdate();V(t)}catch{}}},className:`px-3 py-2 min-h-[44px] rounded-lg text-sm font-medium transition-colors cursor-pointer ${x==="prerelease"?"bg-cc-primary text-white":"bg-cc-hover text-cc-muted hover:text-cc-fg hover:bg-cc-active"}`,children:"Prerelease"})]}),e.jsx("p",{className:"mt-1.5 text-xs text-cc-muted",children:x==="prerelease"?"Tracking prerelease channel. You will receive preview builds from the latest main branch.":"Tracking stable channel. You will only receive versioned releases."})]}),e.jsxs("div",{className:"flex items-center justify-between",children:[e.jsxs("div",{children:[e.jsx("span",{className:"block text-sm font-medium",children:"Auto-update Docker image"}),e.jsx("p",{className:"mt-0.5 text-xs text-cc-muted",children:"Automatically re-pull the sandbox Docker image when updating The Companion"})]}),e.jsx("button",{type:"button",role:"switch","aria-checked":S,onClick:async()=>{const t=!S;I(t);try{await n.updateSettings({dockerAutoUpdate:t})}catch{I(!t)}},className:`relative inline-flex h-6 w-11 shrink-0 cursor-pointer rounded-full border-2 border-transparent transition-colors ${S?"bg-cc-primary":"bg-cc-hover"}`,children:e.jsx("span",{className:`pointer-events-none inline-block h-5 w-5 rounded-full bg-white shadow transform transition-transform ${S?"translate-x-5":"translate-x-0"}`})})]}),xe&&e.jsx("div",{className:"px-3 py-2 rounded-lg bg-cc-error/10 border border-cc-error/20 text-xs text-cc-error",children:xe}),ue&&e.jsx("div",{className:"px-3 py-2 rounded-lg bg-cc-success/10 border border-cc-success/20 text-xs text-cc-success",children:ue}),e.jsxs("div",{className:"flex flex-wrap gap-2",children:[e.jsx("button",{type:"button",onClick:Xe,disabled:P,className:`px-3 py-2 min-h-[44px] rounded-lg text-sm font-medium transition-colors ${P?"bg-cc-hover text-cc-muted cursor-not-allowed":"bg-cc-hover hover:bg-cc-active text-cc-fg cursor-pointer"}`,children:P?"Checking...":"Check for updates"}),o!=null&&o.isServiceMode?e.jsx("button",{type:"button",onClick:Ze,disabled:R||o.updateInProgress||!o.updateAvailable,className:`px-3 py-2 min-h-[44px] rounded-lg text-sm font-medium transition-colors ${R||o.updateInProgress||!o.updateAvailable?"bg-cc-hover text-cc-muted cursor-not-allowed":"bg-cc-primary hover:bg-cc-primary-hover text-white cursor-pointer"}`,children:R||o.updateInProgress?"Updating...":"Update & Restart"}):e.jsxs("p",{className:"text-xs text-cc-muted self-center",children:["Install service mode with ",e.jsx("code",{className:"font-mono-code bg-cc-code-bg px-1 py-0.5 rounded text-cc-code-fg",children:"the-companion install"})," to enable one-click updates."]})]})]})]}),e.jsxs("section",{id:"telemetry",ref:l("telemetry"),children:[e.jsx("h2",{className:"text-sm font-semibold text-cc-fg mb-4",children:"Telemetry"}),e.jsxs("div",{className:"space-y-3",children:[e.jsx("p",{className:"text-xs text-cc-muted",children:"Anonymous product analytics and crash reports via PostHog to improve reliability."}),e.jsxs("button",{type:"button",onClick:()=>{const t=!pe;ct(t),He(t)},className:"w-full flex items-center justify-between px-3 py-3 min-h-[44px] rounded-lg text-sm bg-cc-hover text-cc-fg hover:bg-cc-active transition-colors cursor-pointer",children:[e.jsx("span",{children:"Usage analytics and errors"}),e.jsx("span",{className:"text-xs text-cc-muted",children:pe?"On":"Off"})]}),e.jsx("p",{className:"text-xs text-cc-muted",children:"Browser Do Not Track is respected automatically."})]})]}),e.jsxs("section",{id:"environments",ref:l("environments"),children:[e.jsx("h2",{className:"text-sm font-semibold text-cc-fg mb-4",children:"Environments"}),e.jsxs("div",{className:"space-y-3",children:[e.jsx("p",{className:"text-xs text-cc-muted",children:"Manage reusable environment profiles used when creating sessions."}),e.jsx("button",{type:"button",onClick:()=>{window.location.hash="#/environments"},className:"px-3 py-2 min-h-[44px] rounded-lg text-sm font-medium bg-cc-primary hover:bg-cc-primary-hover text-white transition-colors cursor-pointer",children:"Open Environments Page"})]})]})]})})]})]})}export{at as SettingsPage};