@hellcoder/companion 0.105.0 → 0.105.1-preview.20260624135426.10d7236
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/assets/{AgentsPage-BeDMkE2_.js → AgentsPage-CWeUKtFI.js} +1 -1
- package/dist/assets/{CronManager-B_DSvQtN.js → CronManager-BKdouPOe.js} +1 -1
- package/dist/assets/{IntegrationsPage-ClbDqoEP.js → IntegrationsPage-Ccg_HgWi.js} +1 -1
- package/dist/assets/{LinearOAuthSettingsPage-BEeYBnSb.js → LinearOAuthSettingsPage-D9_JUWel.js} +1 -1
- package/dist/assets/{LinearSettingsPage-DN2raNtR.js → LinearSettingsPage-DWkwlh2E.js} +1 -1
- package/dist/assets/{Playground-Dlv72b_8.js → Playground-DSXKSds_.js} +2 -2
- package/dist/assets/{PromptsPage-BOxtGtfT.js → PromptsPage-DogzCF5T.js} +1 -1
- package/dist/assets/{RunsPage-CYUUHysG.js → RunsPage-BICx5Ywy.js} +1 -1
- package/dist/assets/{SandboxManager-B90xK3cu.js → SandboxManager-Lp__FqMb.js} +1 -1
- package/dist/assets/{SettingsPage-SvStjnbd.js → SettingsPage-CrOyTtWR.js} +1 -1
- package/dist/assets/{TailscalePage-C5J3VAqt.js → TailscalePage-DCdh_AMg.js} +1 -1
- package/dist/assets/{index-CDV255Wl.js → index-B9Oa9QD1.js} +49 -49
- package/dist/assets/{sw-register-BPlfMfHI.js → sw-register-Ctj8ZoBE.js} +1 -1
- package/dist/index.html +1 -1
- package/dist/sw.js +1 -1
- package/package.json +1 -1
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import{r as u,j as e,u as v,n as me,b as xe,P as j,C as pe,A as J,M as f,T as w,G as M,L as Y,D as P,S as L,c as U,d as B,e as Q,f as X,h as ue,k as he,l as ge,U as be,m as fe,o as se,p as te,a as je,q as ve,v as _,w as we}from"./index-
|
|
1
|
+
import{r as u,j as e,u as v,n as me,b as xe,P as j,C as pe,A as J,M as f,T as w,G as M,L as Y,D as P,S as L,c as U,d as B,e as Q,f as X,h as ue,k as he,l as ge,U as be,m as fe,o as se,p as te,a as je,q as ve,v as _,w as we}from"./index-B9Oa9QD1.js";const Ne=new Set(["pulling_image","running_init_script","building_image"]);function A({steps:t,error:c}){const[n,i]=u.useState({}),[r,x]=u.useState(new Set),l=u.useRef(new Map),h=u.useCallback(o=>m=>{m?l.current.set(o,m):l.current.delete(o)},[]);return u.useEffect(()=>{for(const o of t)o.detail&&Ne.has(o.step)&&(i(m=>{const a=m[o.step]||[];return a.length===0||a[a.length-1]!==o.detail?{...m,[o.step]:[...a,o.detail]}:m}),x(m=>{if(m.has(o.step))return m;const a=new Set(m);return a.add(o.step),a}))},[t]),u.useEffect(()=>{var o;for(const m of l.current.values())(o=m.scrollTo)==null||o.call(m,{top:m.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 m=n[o.step],a=m&&m.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:()=>x(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:m.slice(-30).join(`
|
|
2
2
|
`)})]},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) {
|
|
3
3
|
return d.toISOString();
|
|
4
4
|
}`,new_string:`export function formatDate(d: Date, locale = "en-US") {
|
|
@@ -68,7 +68,7 @@ The token should contain: userId, role, iat, exp. Expiry should be configurable.
|
|
|
68
68
|
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"]}],ze=[{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"}}],Fe=[{id:"sa-1",name:"Grep",input:{pattern:"useAuth",path:"src/"}},{id:"sa-2",name:"Grep",input:{pattern:"session.userId",path:"src/"}}],He=[{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}],$e=[{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}],qe=[{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}],Ke={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}},Je={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}},Ye={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}},Qe={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}},Xe=[{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"},Ze=[{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 ds(){const[t,c]=u.useState(()=>document.documentElement.classList.contains("dark"));return u.useEffect(()=>{document.documentElement.classList.toggle("dark",t)},[t]),u.useEffect(()=>{const n=v.getState(),i=v.getState(),r=b,x=i.sessions.get(r),l=i.messages.get(r),h=i.pendingPermissions.get(r),o=i.connectionStatus.get(r),m=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),()=>{v.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 x?G.set(r,x):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 m=="boolean"?F.set(r,m):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=v.getState().currentSessionId;n?me(n):xe()},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(j,{permission:ne,sessionId:b}),e.jsx(j,{permission:ye,sessionId:b}),e.jsx(j,{permission:ke,sessionId:b}),e.jsx(j,{permission:_e,sessionId:b}),e.jsx(j,{permission:Se,sessionId:b}),e.jsx(j,{permission:Ce,sessionId:b}),e.jsx(j,{permission:Ee,sessionId:b}),e.jsx(j,{permission:re,sessionId:b}),e.jsx(j,{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(j,{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(j,{permission:Me,sessionId:b})}),e.jsx(s,{label:"Multi-question",children:e.jsx(j,{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(j,{permission:Re,sessionId:b})}),e.jsx(s,{label:"Permission with AI recommendation (safe)",children:e.jsx(j,{permission:Te,sessionId:b})}),e.jsx(s,{label:"Permission with AI recommendation (dangerous)",children:e.jsx(j,{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(f,{message:ae})}),e.jsx(s,{label:"User message with image",children:e.jsx(f,{message:Le})}),e.jsx(s,{label:"Assistant message (markdown)",children:e.jsx(f,{message:ie})}),e.jsx(s,{label:"Assistant message (with tool calls)",children:e.jsx(f,{message:ce})}),e.jsx(s,{label:"Assistant message (streaming)",children:e.jsx(f,{message:Be})}),e.jsx(s,{label:"Assistant message (streaming thinking phase)",children:e.jsx(f,{message:Oe})}),e.jsx(s,{label:"Assistant message (empty streaming draft — lone sparkle)",children:e.jsx(f,{message:Ge})}),e.jsx(s,{label:"Assistant message (thinking block)",children:e.jsx(f,{message:Ue})}),e.jsx(s,{label:"Tool result with error",children:e.jsx(f,{message:oe})}),e.jsx(s,{label:"Meta notice (interruption / synthetic no-op)",children:e.jsx(f,{message:We})}),e.jsx(s,{label:"System message",children:e.jsx(f,{message:Ve})})]})}),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";
|
|
69
69
|
`},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
|
|
70
70
|
df = pd.read_csv('data.csv')
|
|
71
|
-
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(f,{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(f,{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(f,{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(f,{message:{id:"event-files",role:"system",content:"Persisted 3 file(s).",timestamp:Date.now()}})}),e.jsx(s,{label:"Hook outcome",children:e.jsx(f,{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(cs,{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:Ke})})}),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:Je})})}),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:Ye})})}),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:Qe})})})]})}),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"}),Ze.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:Xe.map(n=>e.jsx(is,{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(rs,{})})})}),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 — active (streaming)",children:e.jsxs("div",{className:"flex items-center gap-2 text-[11px] text-cc-muted font-mono-code pl-10 stats-glow py-1",children:[e.jsx("span",{className:"inline-block w-2 h-2 rounded-full bg-cc-primary animate-[typing-breathe_1.5s_ease-in-out_infinite]"}),e.jsx("span",{className:"text-cc-fg/70",children:"Generating"}),e.jsx("span",{className:"text-cc-muted/30",children:"|"}),e.jsx("span",{className:"tabular-nums",children:"12s"}),e.jsx("span",{className:"text-cc-muted/30",children:"|"}),e.jsx("span",{className:"tabular-nums",children:"1.2k tokens"})]})}),e.jsx(s,{label:"Generation stats bar — quiet (working silently, e.g. long tool call)",children:e.jsxs("div",{className:"flex items-center gap-2 text-[11px] text-cc-muted font-mono-code pl-10 stats-glow py-1",children:[e.jsx("span",{className:"inline-block w-2 h-2 rounded-full bg-cc-primary animate-[typing-breathe_1.5s_ease-in-out_infinite]"}),e.jsx("span",{className:"text-cc-fg/70",children:"Still working…"}),e.jsx("span",{className:"text-cc-muted/30",children:"|"}),e.jsx("span",{className:"tabular-nums",children:"no update for 23s"})]})}),e.jsx(s,{label:"Generation stats bar — stalled (may be stuck)",children:e.jsxs("div",{className:"flex items-center gap-2 text-[11px] text-cc-warning font-mono-code pl-10 stats-glow py-1",children:[e.jsx("span",{className:"inline-block w-2 h-2 rounded-full bg-cc-warning animate-[typing-breathe_1.5s_ease-in-out_infinite]"}),e.jsx("span",{children:"No activity for 7m 12s — the agent may be stuck"})]})})]})}),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:ze})}),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(ns,{description:"Search codebase for auth patterns",agentType:"Explore",status:"completed",senderThreadId:"thr_main",receiverThreadIds:["thr_sub_1","thr_sub_2"],receiverCount:2,items:Fe})})})}),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(os,{})})})}),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) {
|
|
71
|
+
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(f,{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(f,{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(f,{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(f,{message:{id:"event-files",role:"system",content:"Persisted 3 file(s).",timestamp:Date.now()}})}),e.jsx(s,{label:"Hook outcome",children:e.jsx(f,{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(cs,{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:Ke})})}),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:Je})})}),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:Ye})})}),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:Qe})})})]})}),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"}),Ze.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:Xe.map(n=>e.jsx(is,{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(rs,{})})})}),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 — active (streaming)",children:e.jsxs("div",{className:"flex items-center gap-2 text-[11px] text-cc-muted font-mono-code pl-10 stats-glow py-1",children:[e.jsx("span",{className:"inline-block w-2 h-2 rounded-full bg-cc-primary animate-[typing-breathe_1.5s_ease-in-out_infinite]"}),e.jsx("span",{className:"text-cc-fg/70",children:"Generating"}),e.jsx("span",{className:"text-cc-muted/30",children:"|"}),e.jsx("span",{className:"tabular-nums",children:"12s"}),e.jsx("span",{className:"text-cc-muted/30",children:"|"}),e.jsx("span",{className:"tabular-nums",children:"1.2k tokens"})]})}),e.jsx(s,{label:"Generation stats bar — quiet (working silently, e.g. long tool call)",children:e.jsxs("div",{className:"flex items-center gap-2 text-[11px] text-cc-muted font-mono-code pl-10 stats-glow py-1",children:[e.jsx("span",{className:"inline-block w-2 h-2 rounded-full bg-cc-primary animate-[typing-breathe_1.5s_ease-in-out_infinite]"}),e.jsx("span",{className:"text-cc-fg/70",children:"Still working…"}),e.jsx("span",{className:"text-cc-muted/30",children:"|"}),e.jsx("span",{className:"tabular-nums",children:"no update for 23s"})]})}),e.jsx(s,{label:"Generation stats bar — stalled (may be stuck)",children:e.jsxs("div",{className:"flex items-center gap-2 text-[11px] text-cc-warning font-mono-code pl-10 stats-glow py-1",children:[e.jsx("span",{className:"inline-block w-2 h-2 rounded-full bg-cc-warning animate-[typing-breathe_1.5s_ease-in-out_infinite]"}),e.jsx("span",{children:"No activity for 16m 12s — the agent may be stuck"})]})})]})}),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:ze})}),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(ns,{description:"Search codebase for auth patterns",agentType:"Explore",status:"completed",senderThreadId:"thr_main",receiverThreadIds:["thr_sub_1","thr_sub_2"],receiverCount:2,items:Fe})})})}),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(os,{})})})}),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) {
|
|
72
72
|
return d.toISOString();
|
|
73
73
|
}`,newText:`export function formatDate(d: Date, locale = "en-US") {
|
|
74
74
|
return d.toLocaleDateString(locale, {
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import{r as o,u as X,a as Z,j as e,n as ne,b as ae,F as Y}from"./index-
|
|
1
|
+
import{r as o,u as X,a as Z,j as e,n as ne,b as ae,F as Y}from"./index-B9Oa9QD1.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}
|
|
2
2
|
${s.content}
|
|
3
3
|
${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(`
|
|
4
4
|
`):"(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};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{r,a as N,j as e,t as I}from"./index-
|
|
1
|
+
import{r,a as N,j as e,t as I}from"./index-B9Oa9QD1.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};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{r as e,a as r,j as t,i as d}from"./index-
|
|
1
|
+
import{r as e,a as r,j as t,i as d}from"./index-B9Oa9QD1.js";function V({embedded:x=!1}){const c=d(),[m,l]=e.useState([]),[f,a]=e.useState(!0),[S,g]=e.useState(""),[h,p]=e.useState(!1),[b,N]=e.useState(!1),[w,E]=e.useState(null),[n,o]=e.useState(null),s=e.useRef(null),[I,j]=e.useState(""),[v,A]=e.useState(""),[C,D]=e.useState(null),[R,k]=e.useState(""),[y,B]=e.useState(""),[O,T]=e.useState(null),[_,L]=e.useState(null);e.useRef({});const[M,P]=e.useState(""),i=e.useCallback(()=>{r.listSandboxes().then(l).catch(()=>{}).finally(()=>a(!1))},[]);return e.useEffect(()=>{{a(!1);return}},[i,c]),e.useEffect(()=>{if(!n||n.status!=="pulling"){s.current&&(clearInterval(s.current),s.current=null);return}return s.current||(s.current=setInterval(()=>{r.getImageStatus("the-companion:latest").then(u=>o(u)).catch(()=>{})},2e3)),()=>{s.current&&(clearInterval(s.current),s.current=null)}},[n]),t.jsx("div",{className:"h-full bg-cc-bg text-cc-fg font-sans-ui antialiased overflow-y-auto overflow-x-hidden",children:t.jsxs("div",{className:"max-w-2xl mx-auto px-4 sm:px-6 py-6 sm:py-10 pb-safe",children:[t.jsx("h1",{className:"text-lg font-semibold mb-3",children:"Sandboxes"}),t.jsxs("div",{className:"rounded-xl bg-cc-card p-4 text-sm text-cc-muted leading-relaxed",children:[t.jsxs("p",{className:"mb-2",children:["Sandbox / container support is ",t.jsx("strong",{className:"text-cc-fg",children:"disabled"})," in this build."]}),t.jsxs("p",{className:"mb-2",children:["It relied on the upstream"," ",t.jsx("code",{className:"text-[12px] font-mono-code text-cc-fg",children:"the-companion"})," Docker image, which is no longer maintained — so the fork no longer pulls or runs it."]}),t.jsxs("p",{children:["To re-enable (e.g. with your own image), build the frontend with"," ",t.jsx("code",{className:"text-[12px] font-mono-code text-cc-fg",children:"VITE_SANDBOX_ENABLED=true"})," ","and run the server with"," ",t.jsx("code",{className:"text-[12px] font-mono-code text-cc-fg",children:"COMPANION_SANDBOX_ENABLED=1"}),"."]})]})]})})}export{V as SandboxManager};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{r as s,u as o,g as st,a as n,j as e,n as ct,b as nt,s as ot}from"./index-CDV255Wl.js";const Z=[{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 it({embedded:ee=!1}){const[p,te]=s.useState(""),[se,ce]=s.useState("claude-sonnet-4-6"),[d,ne]=s.useState(!1),[w,Le]=s.useState(!0),[g,C]=s.useState(!1),[oe,b]=s.useState(""),[ae,y]=s.useState(!1),Fe=o(t=>t.darkMode),Ke=o(t=>t.toggleDarkMode),ie=o(t=>t.diffBase),Me=o(t=>t.setDiffBase),Be=o(t=>t.notificationSound),He=o(t=>t.toggleNotificationSound),re=o(t=>t.notificationDesktop),le=o(t=>t.setNotificationDesktop),a=o(t=>t.updateInfo),I=o(t=>t.setUpdateInfo),Qe=o(t=>t.setUpdateOverlayActive),_e=typeof Notification<"u",[x,v]=s.useState("stable"),[S,V]=s.useState(!1),[de,R]=s.useState("loopback"),[P,ue]=s.useState(!1),[O,xe]=s.useState(!1),[pe,j]=s.useState(""),[me,A]=s.useState(""),[he,Ge]=s.useState(st()),[U,D]=s.useState(!1),[$,L]=s.useState(!0),[F,K]=s.useState(!1),[T,M]=s.useState(""),[fe,ge]=s.useState("general"),[qe,be]=s.useState(!1),[B,ye]=s.useState(!1),[k,m]=s.useState(null),[h,ve]=s.useState(""),[H,je]=s.useState(!1),[f,ke]=s.useState(""),[Q,Ne]=s.useState(!1),[_,we]=s.useState(!1),[Ye,G]=s.useState(!1),[Ce,Se]=s.useState(""),[We,Ae]=s.useState(!1),[Je,Ue]=s.useState(!1),[N,Te]=s.useState(null),[q,Ee]=s.useState(!1),[u,Ie]=s.useState(null),[E,ze]=s.useState(0),[Y,Ve]=s.useState(!1),[W,Re]=s.useState(!1),[Xe,Pe]=s.useState(!1),Oe=s.useRef(null),J=s.useRef({});s.useEffect(()=>{const t=Oe.current;if(!t)return;const c=new IntersectionObserver(i=>{var $e;let r=null;for(const X of i)X.isIntersecting&&(!r||X.boundingClientRect.top<r.boundingClientRect.top)&&(r=X);($e=r==null?void 0:r.target)!=null&&$e.id&&ge(r.target.id)},{root:t,rootMargin:"-10% 0px -70% 0px",threshold:0});for(const i of Z){const r=J.current[i.id];r&&c.observe(r)}return()=>c.disconnect()},[w]);const De=s.useCallback(t=>{ge(t);const c=J.current[t];c&&c.scrollIntoView({behavior:"smooth",block:"start"})},[]);s.useEffect(()=>{n.getSettings().then(t=>{ne(t.anthropicApiKeyConfigured),je(t.claudeCodeOAuthTokenConfigured),Ne(t.openaiApiKeyConfigured),ce(t.anthropicModel||"claude-sonnet-4-6"),typeof t.aiValidationEnabled=="boolean"&&D(t.aiValidationEnabled),typeof t.aiValidationAutoApprove=="boolean"&&L(t.aiValidationAutoApprove),typeof t.aiValidationAutoDeny=="boolean"&&K(t.aiValidationAutoDeny),(t.updateChannel==="stable"||t.updateChannel==="prerelease")&&v(t.updateChannel),typeof t.dockerAutoUpdate=="boolean"&&V(t.dockerAutoUpdate),(t.cliBridgeMode==="loopback"||t.cliBridgeMode==="jsonHandoff")&&R(t.cliBridgeMode),typeof t.publicUrl=="string"&&(M(t.publicUrl),o.getState().setPublicUrl(t.publicUrl))}).catch(t=>b(t instanceof Error?t.message:String(t))).finally(()=>Le(!1)),n.getAuthToken().then(t=>Te(t.token)).catch(()=>{})},[]);async function Ze(t){t.preventDefault(),C(!0),b(""),y(!1);try{const c=p.trim(),i={anthropicModel:se.trim()||"claude-sonnet-4-6"};c&&(i.anthropicApiKey=c);const r=await n.updateSettings(i);ne(r.anthropicApiKeyConfigured),te(""),y(!0),setTimeout(()=>y(!1),1800)}catch(c){b(c instanceof Error?c.message:String(c))}finally{C(!1)}}async function z(t){const c=t==="aiValidationEnabled"?U:t==="aiValidationAutoApprove"?$:F,i=!c;t==="aiValidationEnabled"?D(i):t==="aiValidationAutoApprove"?L(i):K(i);try{await n.updateSettings({[t]:i})}catch{t==="aiValidationEnabled"?D(c):t==="aiValidationAutoApprove"?L(c):K(c)}}async function et(){ue(!0),j(""),A("");try{const t=await n.forceCheckForUpdate();I(t),t.updateAvailable&&t.latestVersion?j(`Update v${t.latestVersion} is available.`):j("You are up to date.")}catch(t){A(t instanceof Error?t.message:String(t))}finally{ue(!1)}}async function tt(){xe(!0),j(""),A("");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"),A(t instanceof Error?t.message:String(t)),xe(!1)}}const l=s.useCallback(t=>c=>{J.current[t]=c},[]);return e.jsxs("div",{className:`${ee?"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."})]}),!ee&&e.jsx("button",{onClick:()=>{const t=o.getState().currentSessionId;t?ct(t):nt()},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:Z.map(t=>e.jsx("button",{type:"button",onClick:()=>De(t.id),className:`shrink-0 px-3 py-2 min-h-[44px] rounded-lg text-sm font-medium transition-colors cursor-pointer ${fe===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:Z.map(t=>e.jsx("button",{type:"button",onClick:()=>De(t.id),className:`text-left px-3 py-2 min-h-[44px] rounded-lg text-sm font-medium transition-colors cursor-pointer ${fe===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:Oe,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:Fe?"Dark":"Light"})]}),e.jsxs("button",{type:"button",onClick:()=>Me(ie==="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:ie==="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.jsx("div",{className:"pt-3 border-t border-cc-border",children:e.jsxs("div",{className:"flex items-center justify-between",children:[e.jsxs("div",{children:[e.jsx("span",{className:"block text-sm font-medium",children:"Claude Code bridge mode"}),e.jsx("p",{className:"mt-0.5 text-xs text-cc-muted",children:'How the Companion hands the bridge URL to the spawned Claude Code CLI. Loopback is the default fix for Claude Code v1.2.1+ which rejects the literal "localhost". JSON handoff is the more robust just-every/code-style approach: writes a temp descriptor with a one-shot token and passes its path via CLAUDE_BRIDGE_CONFIG.'})]}),e.jsxs("select",{"aria-label":"CLI bridge mode",value:de,onChange:async t=>{const c=t.target.value==="jsonHandoff"?"jsonHandoff":"loopback",i=de;R(c);try{await n.updateSettings({cliBridgeMode:c})}catch{R(i)}},className:"ml-3 px-2 py-1.5 text-xs bg-cc-bg rounded-lg border border-cc-border text-cc-fg focus:outline-none focus:ring-1 focus:ring-cc-primary",children:[e.jsx("option",{value:"loopback",children:"Loopback (default)"}),e.jsx("option",{value:"jsonHandoff",children:"JSON handoff (experimental)"})]})]})})]})]}),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=>M(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()=>{C(!0),b("");try{const t=await n.updateSettings({publicUrl:T.trim()});M(t.publicUrl),o.getState().setPublicUrl(t.publicUrl),y(!0),setTimeout(()=>y(!1),1800)}catch(t){b(t instanceof Error?t.message:String(t))}finally{C(!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:()=>Ee(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(()=>{Pe(!0),setTimeout(()=>Pe(!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:Xe?"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:()=>ze(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()=>{Ve(!0);try{const t=await n.getAuthQr();Ie(t.qrCodes)}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-hover hover:bg-cc-active text-cc-fg cursor-pointer"}`,children:Y?"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.")){Re(!0);try{const t=await n.regenerateAuthToken();Te(t.token),Ee(!0),Ie(null)}catch{}finally{Re(!1)}}},disabled:W,className:`px-3 py-2 min-h-[44px] rounded-lg text-sm font-medium transition-colors ${W?"bg-cc-hover text-cc-muted cursor-not-allowed":"bg-cc-error/10 hover:bg-cc-error/20 text-cc-error cursor-pointer"}`,children:W?"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:He,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:Be?"On":"Off"})]}),_e&&e.jsxs("button",{type:"button",onClick:async()=>{if(re)le(!1);else{if(Notification.permission!=="granted"&&await Notification.requestPermission()!=="granted")return;le(!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:re?"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:H&&!We&&!h?"••••••••••••••••":h,onChange:t=>ve(t.target.value),onFocus:()=>Ae(!0),onBlur:()=>Ae(!1),placeholder:H?"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:H?"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:Q&&!Je&&!f?"••••••••••••••••":f,onChange:t=>ke(t.target.value),onFocus:()=>Ue(!0),onBlur:()=>Ue(!1),placeholder:Q?"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:Q?"OpenAI key configured":"OpenAI key not configured"})]}),Ce&&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:Ce}),Ye&&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.trim()&&!f.trim(),onClick:async()=>{we(!0),Se(""),G(!1);try{const t={};h.trim()&&(t.claudeCodeOAuthToken=h.trim()),f.trim()&&(t.openaiApiKey=f.trim());const c=await n.updateSettings(t);je(c.claudeCodeOAuthTokenConfigured),Ne(c.openaiApiKeyConfigured),ve(""),ke(""),G(!0),setTimeout(()=>G(!1),1800)}catch(t){Se(t instanceof Error?t.message:String(t))}finally{we(!1)}},className:`px-4 py-2 min-h-[44px] rounded-lg text-sm font-medium transition-colors ${_||!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:_?"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:Ze,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&&!qe&&!p?"••••••••••••••••":p,onChange:t=>{te(t.target.value),m(null)},onFocus:()=>be(!0),onBlur:()=>be(!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:se,onChange:t=>ce(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"})]}),oe&&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:oe}),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:B||!p.trim(),onClick:async()=>{ye(!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{ye(!1)}},className:`px-3 py-2 min-h-[44px] rounded-lg text-sm font-medium transition-colors ${B||!p.trim()?"bg-cc-hover text-cc-muted cursor-not-allowed":"bg-cc-hover hover:bg-cc-active text-cc-fg cursor-pointer"}`,children:B?"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 ${F?"text-cc-success":"text-cc-muted"}`,children:F?"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:[a?e.jsxs("p",{className:"text-xs text-cc-muted",children:["Current version: v",a.currentVersion,a.latestVersion?` • Latest: v${a.latestVersion}`:"",a.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();I(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();I(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;V(t);try{await n.updateSettings({dockerAutoUpdate:t})}catch{V(!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"}`})})]}),me&&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:me}),pe&&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:pe}),e.jsxs("div",{className:"flex flex-wrap gap-2",children:[e.jsx("button",{type:"button",onClick:et,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"}),a!=null&&a.isServiceMode?e.jsx("button",{type:"button",onClick:tt,disabled:O||a.updateInProgress||!a.updateAvailable,className:`px-3 py-2 min-h-[44px] rounded-lg text-sm font-medium transition-colors ${O||a.updateInProgress||!a.updateAvailable?"bg-cc-hover text-cc-muted cursor-not-allowed":"bg-cc-primary hover:bg-cc-primary-hover text-white cursor-pointer"}`,children:O||a.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=!he;ot(t),Ge(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:he?"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{it as SettingsPage};
|
|
1
|
+
import{r as s,u as o,g as st,a as n,j as e,n as ct,b as nt,s as ot}from"./index-B9Oa9QD1.js";const Z=[{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 it({embedded:ee=!1}){const[p,te]=s.useState(""),[se,ce]=s.useState("claude-sonnet-4-6"),[d,ne]=s.useState(!1),[w,Le]=s.useState(!0),[g,C]=s.useState(!1),[oe,b]=s.useState(""),[ae,y]=s.useState(!1),Fe=o(t=>t.darkMode),Ke=o(t=>t.toggleDarkMode),ie=o(t=>t.diffBase),Me=o(t=>t.setDiffBase),Be=o(t=>t.notificationSound),He=o(t=>t.toggleNotificationSound),re=o(t=>t.notificationDesktop),le=o(t=>t.setNotificationDesktop),a=o(t=>t.updateInfo),I=o(t=>t.setUpdateInfo),Qe=o(t=>t.setUpdateOverlayActive),_e=typeof Notification<"u",[x,v]=s.useState("stable"),[S,V]=s.useState(!1),[de,R]=s.useState("loopback"),[P,ue]=s.useState(!1),[O,xe]=s.useState(!1),[pe,j]=s.useState(""),[me,A]=s.useState(""),[he,Ge]=s.useState(st()),[U,D]=s.useState(!1),[$,L]=s.useState(!0),[F,K]=s.useState(!1),[T,M]=s.useState(""),[fe,ge]=s.useState("general"),[qe,be]=s.useState(!1),[B,ye]=s.useState(!1),[k,m]=s.useState(null),[h,ve]=s.useState(""),[H,je]=s.useState(!1),[f,ke]=s.useState(""),[Q,Ne]=s.useState(!1),[_,we]=s.useState(!1),[Ye,G]=s.useState(!1),[Ce,Se]=s.useState(""),[We,Ae]=s.useState(!1),[Je,Ue]=s.useState(!1),[N,Te]=s.useState(null),[q,Ee]=s.useState(!1),[u,Ie]=s.useState(null),[E,ze]=s.useState(0),[Y,Ve]=s.useState(!1),[W,Re]=s.useState(!1),[Xe,Pe]=s.useState(!1),Oe=s.useRef(null),J=s.useRef({});s.useEffect(()=>{const t=Oe.current;if(!t)return;const c=new IntersectionObserver(i=>{var $e;let r=null;for(const X of i)X.isIntersecting&&(!r||X.boundingClientRect.top<r.boundingClientRect.top)&&(r=X);($e=r==null?void 0:r.target)!=null&&$e.id&&ge(r.target.id)},{root:t,rootMargin:"-10% 0px -70% 0px",threshold:0});for(const i of Z){const r=J.current[i.id];r&&c.observe(r)}return()=>c.disconnect()},[w]);const De=s.useCallback(t=>{ge(t);const c=J.current[t];c&&c.scrollIntoView({behavior:"smooth",block:"start"})},[]);s.useEffect(()=>{n.getSettings().then(t=>{ne(t.anthropicApiKeyConfigured),je(t.claudeCodeOAuthTokenConfigured),Ne(t.openaiApiKeyConfigured),ce(t.anthropicModel||"claude-sonnet-4-6"),typeof t.aiValidationEnabled=="boolean"&&D(t.aiValidationEnabled),typeof t.aiValidationAutoApprove=="boolean"&&L(t.aiValidationAutoApprove),typeof t.aiValidationAutoDeny=="boolean"&&K(t.aiValidationAutoDeny),(t.updateChannel==="stable"||t.updateChannel==="prerelease")&&v(t.updateChannel),typeof t.dockerAutoUpdate=="boolean"&&V(t.dockerAutoUpdate),(t.cliBridgeMode==="loopback"||t.cliBridgeMode==="jsonHandoff")&&R(t.cliBridgeMode),typeof t.publicUrl=="string"&&(M(t.publicUrl),o.getState().setPublicUrl(t.publicUrl))}).catch(t=>b(t instanceof Error?t.message:String(t))).finally(()=>Le(!1)),n.getAuthToken().then(t=>Te(t.token)).catch(()=>{})},[]);async function Ze(t){t.preventDefault(),C(!0),b(""),y(!1);try{const c=p.trim(),i={anthropicModel:se.trim()||"claude-sonnet-4-6"};c&&(i.anthropicApiKey=c);const r=await n.updateSettings(i);ne(r.anthropicApiKeyConfigured),te(""),y(!0),setTimeout(()=>y(!1),1800)}catch(c){b(c instanceof Error?c.message:String(c))}finally{C(!1)}}async function z(t){const c=t==="aiValidationEnabled"?U:t==="aiValidationAutoApprove"?$:F,i=!c;t==="aiValidationEnabled"?D(i):t==="aiValidationAutoApprove"?L(i):K(i);try{await n.updateSettings({[t]:i})}catch{t==="aiValidationEnabled"?D(c):t==="aiValidationAutoApprove"?L(c):K(c)}}async function et(){ue(!0),j(""),A("");try{const t=await n.forceCheckForUpdate();I(t),t.updateAvailable&&t.latestVersion?j(`Update v${t.latestVersion} is available.`):j("You are up to date.")}catch(t){A(t instanceof Error?t.message:String(t))}finally{ue(!1)}}async function tt(){xe(!0),j(""),A("");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"),A(t instanceof Error?t.message:String(t)),xe(!1)}}const l=s.useCallback(t=>c=>{J.current[t]=c},[]);return e.jsxs("div",{className:`${ee?"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."})]}),!ee&&e.jsx("button",{onClick:()=>{const t=o.getState().currentSessionId;t?ct(t):nt()},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:Z.map(t=>e.jsx("button",{type:"button",onClick:()=>De(t.id),className:`shrink-0 px-3 py-2 min-h-[44px] rounded-lg text-sm font-medium transition-colors cursor-pointer ${fe===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:Z.map(t=>e.jsx("button",{type:"button",onClick:()=>De(t.id),className:`text-left px-3 py-2 min-h-[44px] rounded-lg text-sm font-medium transition-colors cursor-pointer ${fe===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:Oe,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:Fe?"Dark":"Light"})]}),e.jsxs("button",{type:"button",onClick:()=>Me(ie==="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:ie==="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.jsx("div",{className:"pt-3 border-t border-cc-border",children:e.jsxs("div",{className:"flex items-center justify-between",children:[e.jsxs("div",{children:[e.jsx("span",{className:"block text-sm font-medium",children:"Claude Code bridge mode"}),e.jsx("p",{className:"mt-0.5 text-xs text-cc-muted",children:'How the Companion hands the bridge URL to the spawned Claude Code CLI. Loopback is the default fix for Claude Code v1.2.1+ which rejects the literal "localhost". JSON handoff is the more robust just-every/code-style approach: writes a temp descriptor with a one-shot token and passes its path via CLAUDE_BRIDGE_CONFIG.'})]}),e.jsxs("select",{"aria-label":"CLI bridge mode",value:de,onChange:async t=>{const c=t.target.value==="jsonHandoff"?"jsonHandoff":"loopback",i=de;R(c);try{await n.updateSettings({cliBridgeMode:c})}catch{R(i)}},className:"ml-3 px-2 py-1.5 text-xs bg-cc-bg rounded-lg border border-cc-border text-cc-fg focus:outline-none focus:ring-1 focus:ring-cc-primary",children:[e.jsx("option",{value:"loopback",children:"Loopback (default)"}),e.jsx("option",{value:"jsonHandoff",children:"JSON handoff (experimental)"})]})]})})]})]}),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=>M(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()=>{C(!0),b("");try{const t=await n.updateSettings({publicUrl:T.trim()});M(t.publicUrl),o.getState().setPublicUrl(t.publicUrl),y(!0),setTimeout(()=>y(!1),1800)}catch(t){b(t instanceof Error?t.message:String(t))}finally{C(!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:()=>Ee(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(()=>{Pe(!0),setTimeout(()=>Pe(!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:Xe?"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:()=>ze(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()=>{Ve(!0);try{const t=await n.getAuthQr();Ie(t.qrCodes)}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-hover hover:bg-cc-active text-cc-fg cursor-pointer"}`,children:Y?"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.")){Re(!0);try{const t=await n.regenerateAuthToken();Te(t.token),Ee(!0),Ie(null)}catch{}finally{Re(!1)}}},disabled:W,className:`px-3 py-2 min-h-[44px] rounded-lg text-sm font-medium transition-colors ${W?"bg-cc-hover text-cc-muted cursor-not-allowed":"bg-cc-error/10 hover:bg-cc-error/20 text-cc-error cursor-pointer"}`,children:W?"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:He,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:Be?"On":"Off"})]}),_e&&e.jsxs("button",{type:"button",onClick:async()=>{if(re)le(!1);else{if(Notification.permission!=="granted"&&await Notification.requestPermission()!=="granted")return;le(!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:re?"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:H&&!We&&!h?"••••••••••••••••":h,onChange:t=>ve(t.target.value),onFocus:()=>Ae(!0),onBlur:()=>Ae(!1),placeholder:H?"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:H?"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:Q&&!Je&&!f?"••••••••••••••••":f,onChange:t=>ke(t.target.value),onFocus:()=>Ue(!0),onBlur:()=>Ue(!1),placeholder:Q?"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:Q?"OpenAI key configured":"OpenAI key not configured"})]}),Ce&&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:Ce}),Ye&&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.trim()&&!f.trim(),onClick:async()=>{we(!0),Se(""),G(!1);try{const t={};h.trim()&&(t.claudeCodeOAuthToken=h.trim()),f.trim()&&(t.openaiApiKey=f.trim());const c=await n.updateSettings(t);je(c.claudeCodeOAuthTokenConfigured),Ne(c.openaiApiKeyConfigured),ve(""),ke(""),G(!0),setTimeout(()=>G(!1),1800)}catch(t){Se(t instanceof Error?t.message:String(t))}finally{we(!1)}},className:`px-4 py-2 min-h-[44px] rounded-lg text-sm font-medium transition-colors ${_||!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:_?"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:Ze,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&&!qe&&!p?"••••••••••••••••":p,onChange:t=>{te(t.target.value),m(null)},onFocus:()=>be(!0),onBlur:()=>be(!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:se,onChange:t=>ce(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"})]}),oe&&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:oe}),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:B||!p.trim(),onClick:async()=>{ye(!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{ye(!1)}},className:`px-3 py-2 min-h-[44px] rounded-lg text-sm font-medium transition-colors ${B||!p.trim()?"bg-cc-hover text-cc-muted cursor-not-allowed":"bg-cc-hover hover:bg-cc-active text-cc-fg cursor-pointer"}`,children:B?"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 ${F?"text-cc-success":"text-cc-muted"}`,children:F?"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:[a?e.jsxs("p",{className:"text-xs text-cc-muted",children:["Current version: v",a.currentVersion,a.latestVersion?` • Latest: v${a.latestVersion}`:"",a.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();I(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();I(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;V(t);try{await n.updateSettings({dockerAutoUpdate:t})}catch{V(!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"}`})})]}),me&&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:me}),pe&&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:pe}),e.jsxs("div",{className:"flex flex-wrap gap-2",children:[e.jsx("button",{type:"button",onClick:et,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"}),a!=null&&a.isServiceMode?e.jsx("button",{type:"button",onClick:tt,disabled:O||a.updateInProgress||!a.updateAvailable,className:`px-3 py-2 min-h-[44px] rounded-lg text-sm font-medium transition-colors ${O||a.updateInProgress||!a.updateAvailable?"bg-cc-hover text-cc-muted cursor-not-allowed":"bg-cc-primary hover:bg-cc-primary-hover text-white cursor-pointer"}`,children:O||a.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=!he;ot(t),Ge(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:he?"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{it as SettingsPage};
|