@grackle-ai/web 0.50.0 → 0.50.1

package/dist/assets/{index-B-4RitDJ.js → index-cPFBXn_Y.js}

@@ -95,4 +95,4 @@ const grackle = await host.mcpServer({
   url: env.vars.GRACKLE_MCP_URL,
 });
 
-$\`Summarize the current tasks.\`;`,rows:20,className:Fe.scriptEditor,required:!0,"data-testid":"persona-script-editor"})]})]}),f.jsxs("div",{className:Fe.formActions,children:[f.jsx("button",{type:"submit",className:Fe.btnPrimary,children:u?"Save":"Create"}),f.jsx("button",{type:"button",onClick:Y,className:Fe.btnSecondary,children:"Cancel"})]})]});return f.jsxs("div",{className:Fe.container,children:[f.jsxs("div",{className:Fe.header,children:[f.jsx("h2",{children:"Personas"}),f.jsx("button",{onClick:ie,className:Fe.btnPrimary,children:"+ New Persona"})]}),(m||u)&&ce(),n.length===0&&!m?f.jsx("p",{className:Fe.empty,children:"No personas yet. Create one to get started."}):f.jsx("div",{className:Fe.list,children:n.map(K=>{const ze=r===K.id,De=K.type==="script";return f.jsxs("div",{className:`${Fe.card} ${(u==null?void 0:u.id)===K.id?Fe.active:""}`,"data-testid":`persona-card-${K.id}`,children:[f.jsxs("div",{className:Fe.cardHeader,children:[f.jsxs("span",{className:Fe.cardTitle,children:[f.jsx("strong",{children:K.name}),f.jsx("span",{className:Fe.typeBadge,"data-testid":`persona-type-badge-${K.id}`,children:De?"Script":"Agent"}),ze&&f.jsx("span",{className:Fe.defaultBadge,"data-testid":`persona-default-badge-${K.id}`,children:"App Default"})]}),f.jsxs("div",{className:Fe.cardActions,children:[!ze&&f.jsx("button",{onClick:()=>d(K.id),className:Fe.btnSmall,"data-testid":`persona-set-default-${K.id}`,title:"Set as app default persona",children:"Set Default"}),f.jsx("button",{onClick:()=>pe(K),className:Fe.btnSmall,children:"Edit"}),y===K.id?f.jsxs(f.Fragment,{children:[f.jsx("button",{onClick:()=>X(K.id),className:Fe.btnDanger,children:"Confirm"}),f.jsx("button",{onClick:()=>v(null),className:Fe.btnSmall,children:"Cancel"})]}):f.jsx("button",{onClick:()=>v(K.id),className:Fe.btnSmall,children:"Delete"})]})]}),K.description&&f.jsx("p",{className:Fe.description,children:K.description}),f.jsxs("div",{className:Fe.meta,children:[K.runtime&&f.jsxs("span",{children:["Runtime: ",K.runtime]}),K.model&&f.jsxs("span",{children:["Model: ",K.model]}),K.maxTurns>0&&f.jsxs("span",{children:["Max turns: ",K.maxTurns]})]}),De?f.jsxs("details",{className:Fe.promptDetails,children:[f.jsx("summary",{children:"Script"}),f.jsx("pre",{className:Fe.promptText,children:K.script})]}):f.jsxs("details",{className:Fe.promptDetails,children:[f.jsx("summary",{children:"System Prompt"}),f.jsx("pre",{className:Fe.promptText,children:K.systemPrompt})]})]},K.id)})})]})}function D6(){return f.jsx(N6,{})}function M6(){const{themeId:n,resolvedThemeId:a,setTheme:i,preferSystem:o,setPreferSystem:r}=lb();return f.jsxs("section",{className:ue.section,children:[f.jsx("h3",{className:ue.sectionTitle,children:"Appearance"}),f.jsx("p",{className:ue.sectionDescription,children:"Choose how Grackle looks across the app."}),f.jsx("div",{className:ue.themeOptions,children:oc.filter(d=>!d.hidden).map(d=>{const u=!!(d.variantLightId&&d.variantDarkId),p=u?n===d.id||n===d.variantLightId||n===d.variantDarkId:n===d.id,m=u&&a===d.variantLightId;return f.jsxs("button",{type:"button",className:`${ue.themeOption} ${p?ue.themeOptionSelected:""}`,"aria-pressed":p,onClick:()=>i(d.id),children:[f.jsxs("span",{className:ue.themeOptionHeader,children:[f.jsxs("span",{children:[f.jsx("span",{className:ue.themeOptionLabel,children:d.label}),f.jsx("span",{className:ue.themeOptionDesc,children:d.description})]}),u&&f.jsxs("span",{className:ue.variantToggle,children:[f.jsx("span",{role:"button",tabIndex:0,className:`${ue.variantButton} ${p&&m?ue.variantActive:""}`,onClick:g=>{g.stopPropagation(),r(!1),i(d.variantLightId)},onKeyDown:g=>{(g.key==="Enter"||g.key===" ")&&(g.preventDefault(),g.stopPropagation(),r(!1),i(d.variantLightId))},"aria-label":"Light variant","aria-pressed":p&&m,children:"☼"}),f.jsx("span",{role:"button",tabIndex:0,className:`${ue.variantButton} ${p&&!m?ue.variantActive:""}`,onClick:g=>{g.stopPropagation(),r(!1),i(d.variantDarkId)},onKeyDown:g=>{(g.key==="Enter"||g.key===" ")&&(g.preventDefault(),g.stopPropagation(),r(!1),i(d.variantDarkId))},"aria-label":"Dark variant","aria-pressed":p&&!m,children:"☾"})]})]}),d.swatches&&f.jsx("span",{className:ue.themeSwatches,children:d.swatches.map((g,y)=>f.jsx("span",{className:ue.themeSwatch,style:{background:g}},y))})]},d.id)})}),f.jsxs("label",{className:ue.systemToggle,children:[f.jsx("input",{type:"checkbox",checked:o,onChange:d=>r(d.target.checked)}),f.jsx("span",{children:"Match system light/dark preference"})]}),f.jsx("p",{className:ue.systemToggleHint,children:"Automatically switches between light and dark variants when available."}),f.jsxs("p",{className:ue.themeActive,children:["Active theme: ",f.jsx("strong",{children:a})]})]})}function R6(){return f.jsx(M6,{})}function O6(){const{connected:n,environments:a,sessions:i}=Ot(),o=a.filter(u=>u.status==="connected").length,r=a.length,d=i.filter(u=>["running","idle"].includes(u.status)).length;return f.jsxs("section",{className:ue.section,"data-testid":"about-panel",children:[f.jsx("h3",{className:ue.sectionTitle,children:"About"}),f.jsx("p",{className:ue.sectionDescription,children:"Connection status and application information."}),f.jsxs("div",{className:ue.aboutGrid,children:[f.jsxs("div",{className:ue.aboutItem,children:[f.jsx("span",{className:ue.aboutLabel,children:"Connection"}),f.jsxs("span",{className:ue.aboutValue,children:[f.jsx("span",{className:`${ue.aboutDot} ${n?ue.aboutDotConnected:ue.aboutDotDisconnected}`}),n?"Connected":"Disconnected"]})]}),f.jsxs("div",{className:ue.aboutItem,children:[f.jsx("span",{className:ue.aboutLabel,children:"Environments"}),f.jsxs("span",{className:ue.aboutValue,children:[o,"/",r," connected"]})]}),f.jsxs("div",{className:ue.aboutItem,children:[f.jsx("span",{className:ue.aboutLabel,children:"Active Sessions"}),f.jsx("span",{className:ue.aboutValue,children:d})]}),f.jsxs("div",{className:ue.aboutItem,children:[f.jsx("span",{className:ue.aboutLabel,children:"Version"}),f.jsx("span",{className:ue.aboutValue,children:"0.49.0"})]})]})]})}function B6(){return f.jsx(O6,{})}const L6="_wizard_1260s_1",I6="_container_1260s_10",U6="_stepContent_1260s_19",z6="_logoArea_1260s_28",V6="_logoImage_1260s_32",H6="_heading_1260s_41",G6="_tagline_1260s_49",P6="_subtitle_1260s_56",F6="_featureList_1260s_64",$6="_runtimeGrid_1260s_89",q6="_runtimeCard_1260s_101",Y6="_runtimeName_1260s_133",K6="_runtimeDescription_1260s_139",Z6="_buttonRow_1260s_144",X6="_primaryButton_1260s_151",Q6="_ghostButton_1260s_185",W6="_dots_1260s_213",J6="_dot_1260s_213",ot={wizard:L6,container:I6,stepContent:U6,logoArea:z6,logoImage:V6,heading:H6,tagline:G6,subtitle:P6,featureList:F6,runtimeGrid:$6,runtimeCard:q6,runtimeName:Y6,runtimeDescription:K6,buttonRow:Z6,primaryButton:X6,ghostButton:Q6,dots:W6,dot:J6};function e5({onNext:n}){return f.jsxs("div",{className:ot.stepContent,"data-testid":"setup-welcome",children:[f.jsx("div",{className:ot.logoArea,children:f.jsx("img",{src:"/grackle-logo.png",alt:"Grackle",className:ot.logoImage})}),f.jsx("h1",{className:ot.heading,children:"Welcome to Grackle"}),f.jsx("p",{className:ot.tagline,children:"Multi-agent orchestration for software teams"}),f.jsx("button",{type:"button",className:ot.primaryButton,onClick:n,"data-testid":"setup-get-started",children:"Get Started"})]})}function t5({onNext:n,onBack:a}){return f.jsxs("div",{className:ot.stepContent,"data-testid":"setup-about",children:[f.jsx("h2",{className:ot.heading,children:"What is Grackle?"}),f.jsxs("ul",{className:ot.featureList,children:[f.jsx("li",{children:"Run Claude, Copilot, and Codex agents side by side"}),f.jsx("li",{children:"Provision and control dev environments — SSH, Codespaces, or local"}),f.jsx("li",{children:"Organize work into workspaces with agent-executable tasks"}),f.jsx("li",{children:"Customize agent behavior with personas, tools, and MCP servers"}),f.jsx("li",{children:"Live-stream agent sessions with full terminal replay"})]}),f.jsxs("div",{className:ot.buttonRow,children:[f.jsx("button",{type:"button",className:ot.ghostButton,onClick:a,children:"Back"}),f.jsx("button",{type:"button",className:ot.primaryButton,onClick:n,"data-testid":"setup-about-next",children:"Next"})]})]})}const n5=[{id:"claude-code",name:"Claude Code",description:"Anthropic's agentic coding tool"},{id:"copilot",name:"Copilot Coding Agent",description:"GitHub's AI pair programmer"},{id:"codex",name:"Codex CLI",description:"OpenAI's coding agent"}];function a5({currentRuntime:n,onFinish:a,onBack:i,finishDisabled:o}){const[r,d]=S.useState(n||"claude-code");return S.useEffect(()=>{n&&d(n)},[n]),f.jsxs("div",{className:ot.stepContent,"data-testid":"setup-runtime",children:[f.jsx("h2",{className:ot.heading,children:"Choose Your Runtime"}),f.jsx("p",{className:ot.subtitle,children:"Select the primary agent runtime for your workspace. You can change this later."}),f.jsx("div",{className:ot.runtimeGrid,children:n5.map(u=>f.jsxs("button",{type:"button",className:ot.runtimeCard,"data-selected":r===u.id,"aria-pressed":r===u.id,"data-testid":`runtime-card-${u.id}`,onClick:()=>d(u.id),children:[f.jsx("span",{className:ot.runtimeName,children:u.name}),f.jsx("span",{className:ot.runtimeDescription,children:u.description})]},u.id))}),f.jsxs("div",{className:ot.buttonRow,children:[f.jsx("button",{type:"button",className:ot.ghostButton,onClick:i,children:"Back"}),f.jsx("button",{type:"button",className:ot.primaryButton,onClick:()=>a(r),disabled:o,"data-testid":"setup-finish",children:"Finish"})]})]})}const s5=3,M0={"claude-code":"sonnet",copilot:"gpt-4o",codex:"o3"};function i5(){const{personas:n,updatePersona:a,completeOnboarding:i,onboardingCompleted:o}=Ot(),r=_n(),[d,u]=S.useState(0),p=n.find(g=>g.id==="claude-code"),m=S.useCallback(g=>{if(p&&g!==p.runtime){const v=M0[g]??"sonnet";a(p.id,void 0,void 0,void 0,g,v)}const y=n.find(v=>v.id===h0);if(y&&g!==y.runtime){const v=M0[g]??"sonnet";a(h0,void 0,void 0,void 0,g,v)}i(),r("/",{replace:!0})},[p,n,a,i,r]);return o===!0?f.jsx(Os,{to:"/",replace:!0}):f.jsx("div",{className:ot.wizard,"data-testid":"setup-wizard",children:f.jsxs("div",{className:ot.container,children:[f.jsx(In,{mode:"wait",children:f.jsxs(Kt.div,{initial:{opacity:0,x:40},animate:{opacity:1,x:0},exit:{opacity:0,x:-40},transition:{duration:.2,ease:"easeInOut"},children:[d===0&&f.jsx(e5,{onNext:()=>u(1)}),d===1&&f.jsx(t5,{onNext:()=>u(2),onBack:()=>u(0)}),d===2&&f.jsx(a5,{currentRuntime:(p==null?void 0:p.runtime)??"claude-code",onFinish:m,onBack:()=>u(1),finishDisabled:!p})]},d)}),f.jsx("div",{className:ot.dots,children:Array.from({length:s5},(g,y)=>f.jsx("span",{className:ot.dot,"data-active":y===d},y))})]})})}const l5="_root_h353j_1",o5="_body_h353j_7",r5="_main_h353j_19",c5="_sidebarWrapper_h353j_26",u5="_overlay_h353j_56",Gl={root:l5,body:o5,main:r5,sidebarWrapper:c5,overlay:u5},d5=typeof window<"u"&&new URLSearchParams(window.location.search).has("mock");function f5(){const{lastSpawnedId:n,environments:a,connected:i,onboardingCompleted:o}=Ot(),{showToast:r}=uo();lM(a,r);const d=_n(),u=Jt(),p=u.pathname.startsWith(Bi),[m,g]=S.useState(!1),y=S.useCallback(()=>g(v=>!v),[]);return S.useEffect(()=>{g(!1)},[u.pathname]),S.useEffect(()=>{if(!m)return;const v=x=>{x.key==="Escape"&&g(!1)};return document.addEventListener("keydown",v),()=>{document.removeEventListener("keydown",v)}},[m]),S.useEffect(()=>{n&&!u.pathname.startsWith("/tasks/")&&d(W0(n),{replace:!0})},[n,d,u.pathname]),i&&o===!1?f.jsx(Os,{to:"/setup",replace:!0}):f.jsxs("div",{className:Gl.root,children:[f.jsx(cC,{onToggleSidebar:p?void 0:y,sidebarOpen:m}),f.jsxs("div",{className:Gl.body,children:[f.jsx("div",{className:Gl.sidebarWrapper,"data-sidebar-open":m,"data-settings":p,children:p?f.jsx(BB,{}):f.jsx(kD,{})}),m&&!p&&f.jsx("div",{className:Gl.overlay,"data-testid":"drawer-overlay",onClick:()=>g(!1)}),f.jsxs("div",{className:Gl.main,children:[f.jsx(Y0,{}),f.jsx(qD,{})]})]}),f.jsx(iM,{})]})}function h5(){return f.jsxs(kT,{children:[f.jsx(ht,{path:"setup",element:f.jsx(i5,{})}),f.jsxs(ht,{element:f.jsx(f5,{}),children:[f.jsx(ht,{index:!0,element:f.jsx(Os,{to:"/chat",replace:!0})}),f.jsx(ht,{path:"chat",element:f.jsx(c3,{})}),f.jsx(ht,{path:"sessions/new",element:f.jsx(v3,{})}),f.jsx(ht,{path:"sessions/:sessionId",element:f.jsx(S3,{})}),f.jsx(ht,{path:"workspaces",element:f.jsx(u3,{})}),f.jsx(ht,{path:"workspaces/:workspaceId",element:f.jsx(zO,{})}),f.jsx(ht,{path:"tasks/new",element:f.jsx(oB,{})}),f.jsx(ht,{path:"tasks/:taskId",element:f.jsx(nf,{})}),f.jsx(ht,{path:"tasks/:taskId/stream",element:f.jsx(nf,{})}),f.jsx(ht,{path:"tasks/:taskId/findings",element:f.jsx(nf,{})}),f.jsx(ht,{path:"tasks/:taskId/edit",element:f.jsx(rB,{})}),f.jsx(ht,{path:"environments/new",element:f.jsx(CB,{})}),f.jsxs(ht,{path:"settings",element:f.jsx(NB,{}),children:[f.jsx(ht,{index:!0,element:f.jsx(Os,{to:"environments",replace:!0})}),f.jsx(ht,{path:"environments",element:f.jsx(y4,{})}),f.jsx(ht,{path:"credentials",element:f.jsx(i6,{})}),f.jsx(ht,{path:"tokens",element:f.jsx(Os,{to:"../credentials",replace:!0})}),f.jsx(ht,{path:"personas",element:f.jsx(D6,{})}),f.jsx(ht,{path:"appearance",element:f.jsx(R6,{})}),f.jsx(ht,{path:"about",element:f.jsx(B6,{})})]}),f.jsx(ht,{path:"*",element:f.jsx(Os,{to:"/",replace:!0})})]})]})}const p5=1e4;function m5(){const{onboardingCompleted:n}=Ot(),[a,i]=S.useState(!1);S.useEffect(()=>{if(n!==void 0)return;const r=setTimeout(()=>i(!0),p5);return()=>clearTimeout(r)},[n]);const o=n===void 0&&!a;return f.jsx(In,{mode:"wait",children:o?f.jsx(Kt.div,{initial:{opacity:1},exit:{opacity:0},transition:{duration:.25},children:f.jsx(TN,{})},"splash"):f.jsx(Kt.div,{initial:{opacity:0},animate:{opacity:1},transition:{duration:.25},style:{minHeight:"100vh"},children:f.jsx(WT,{children:f.jsx(h5,{})})},"app")})}function g5(){const n=d5?YE:UE;return f.jsx(JE,{children:f.jsx(ZE,{children:f.jsx(n,{children:f.jsx(m5,{})})})})}j_.createRoot(document.getElementById("root")).render(f.jsx(S.StrictMode,{children:f.jsx(g5,{})}));
+$\`Summarize the current tasks.\`;`,rows:20,className:Fe.scriptEditor,required:!0,"data-testid":"persona-script-editor"})]})]}),f.jsxs("div",{className:Fe.formActions,children:[f.jsx("button",{type:"submit",className:Fe.btnPrimary,children:u?"Save":"Create"}),f.jsx("button",{type:"button",onClick:Y,className:Fe.btnSecondary,children:"Cancel"})]})]});return f.jsxs("div",{className:Fe.container,children:[f.jsxs("div",{className:Fe.header,children:[f.jsx("h2",{children:"Personas"}),f.jsx("button",{onClick:ie,className:Fe.btnPrimary,children:"+ New Persona"})]}),(m||u)&&ce(),n.length===0&&!m?f.jsx("p",{className:Fe.empty,children:"No personas yet. Create one to get started."}):f.jsx("div",{className:Fe.list,children:n.map(K=>{const ze=r===K.id,De=K.type==="script";return f.jsxs("div",{className:`${Fe.card} ${(u==null?void 0:u.id)===K.id?Fe.active:""}`,"data-testid":`persona-card-${K.id}`,children:[f.jsxs("div",{className:Fe.cardHeader,children:[f.jsxs("span",{className:Fe.cardTitle,children:[f.jsx("strong",{children:K.name}),f.jsx("span",{className:Fe.typeBadge,"data-testid":`persona-type-badge-${K.id}`,children:De?"Script":"Agent"}),ze&&f.jsx("span",{className:Fe.defaultBadge,"data-testid":`persona-default-badge-${K.id}`,children:"App Default"})]}),f.jsxs("div",{className:Fe.cardActions,children:[!ze&&f.jsx("button",{onClick:()=>d(K.id),className:Fe.btnSmall,"data-testid":`persona-set-default-${K.id}`,title:"Set as app default persona",children:"Set Default"}),f.jsx("button",{onClick:()=>pe(K),className:Fe.btnSmall,children:"Edit"}),y===K.id?f.jsxs(f.Fragment,{children:[f.jsx("button",{onClick:()=>X(K.id),className:Fe.btnDanger,children:"Confirm"}),f.jsx("button",{onClick:()=>v(null),className:Fe.btnSmall,children:"Cancel"})]}):f.jsx("button",{onClick:()=>v(K.id),className:Fe.btnSmall,children:"Delete"})]})]}),K.description&&f.jsx("p",{className:Fe.description,children:K.description}),f.jsxs("div",{className:Fe.meta,children:[K.runtime&&f.jsxs("span",{children:["Runtime: ",K.runtime]}),K.model&&f.jsxs("span",{children:["Model: ",K.model]}),K.maxTurns>0&&f.jsxs("span",{children:["Max turns: ",K.maxTurns]})]}),De?f.jsxs("details",{className:Fe.promptDetails,children:[f.jsx("summary",{children:"Script"}),f.jsx("pre",{className:Fe.promptText,children:K.script})]}):f.jsxs("details",{className:Fe.promptDetails,children:[f.jsx("summary",{children:"System Prompt"}),f.jsx("pre",{className:Fe.promptText,children:K.systemPrompt})]})]},K.id)})})]})}function D6(){return f.jsx(N6,{})}function M6(){const{themeId:n,resolvedThemeId:a,setTheme:i,preferSystem:o,setPreferSystem:r}=lb();return f.jsxs("section",{className:ue.section,children:[f.jsx("h3",{className:ue.sectionTitle,children:"Appearance"}),f.jsx("p",{className:ue.sectionDescription,children:"Choose how Grackle looks across the app."}),f.jsx("div",{className:ue.themeOptions,children:oc.filter(d=>!d.hidden).map(d=>{const u=!!(d.variantLightId&&d.variantDarkId),p=u?n===d.id||n===d.variantLightId||n===d.variantDarkId:n===d.id,m=u&&a===d.variantLightId;return f.jsxs("button",{type:"button",className:`${ue.themeOption} ${p?ue.themeOptionSelected:""}`,"aria-pressed":p,onClick:()=>i(d.id),children:[f.jsxs("span",{className:ue.themeOptionHeader,children:[f.jsxs("span",{children:[f.jsx("span",{className:ue.themeOptionLabel,children:d.label}),f.jsx("span",{className:ue.themeOptionDesc,children:d.description})]}),u&&f.jsxs("span",{className:ue.variantToggle,children:[f.jsx("span",{role:"button",tabIndex:0,className:`${ue.variantButton} ${p&&m?ue.variantActive:""}`,onClick:g=>{g.stopPropagation(),r(!1),i(d.variantLightId)},onKeyDown:g=>{(g.key==="Enter"||g.key===" ")&&(g.preventDefault(),g.stopPropagation(),r(!1),i(d.variantLightId))},"aria-label":"Light variant","aria-pressed":p&&m,children:"☼"}),f.jsx("span",{role:"button",tabIndex:0,className:`${ue.variantButton} ${p&&!m?ue.variantActive:""}`,onClick:g=>{g.stopPropagation(),r(!1),i(d.variantDarkId)},onKeyDown:g=>{(g.key==="Enter"||g.key===" ")&&(g.preventDefault(),g.stopPropagation(),r(!1),i(d.variantDarkId))},"aria-label":"Dark variant","aria-pressed":p&&!m,children:"☾"})]})]}),d.swatches&&f.jsx("span",{className:ue.themeSwatches,children:d.swatches.map((g,y)=>f.jsx("span",{className:ue.themeSwatch,style:{background:g}},y))})]},d.id)})}),f.jsxs("label",{className:ue.systemToggle,children:[f.jsx("input",{type:"checkbox",checked:o,onChange:d=>r(d.target.checked)}),f.jsx("span",{children:"Match system light/dark preference"})]}),f.jsx("p",{className:ue.systemToggleHint,children:"Automatically switches between light and dark variants when available."}),f.jsxs("p",{className:ue.themeActive,children:["Active theme: ",f.jsx("strong",{children:a})]})]})}function R6(){return f.jsx(M6,{})}function O6(){const{connected:n,environments:a,sessions:i}=Ot(),o=a.filter(u=>u.status==="connected").length,r=a.length,d=i.filter(u=>["running","idle"].includes(u.status)).length;return f.jsxs("section",{className:ue.section,"data-testid":"about-panel",children:[f.jsx("h3",{className:ue.sectionTitle,children:"About"}),f.jsx("p",{className:ue.sectionDescription,children:"Connection status and application information."}),f.jsxs("div",{className:ue.aboutGrid,children:[f.jsxs("div",{className:ue.aboutItem,children:[f.jsx("span",{className:ue.aboutLabel,children:"Connection"}),f.jsxs("span",{className:ue.aboutValue,children:[f.jsx("span",{className:`${ue.aboutDot} ${n?ue.aboutDotConnected:ue.aboutDotDisconnected}`}),n?"Connected":"Disconnected"]})]}),f.jsxs("div",{className:ue.aboutItem,children:[f.jsx("span",{className:ue.aboutLabel,children:"Environments"}),f.jsxs("span",{className:ue.aboutValue,children:[o,"/",r," connected"]})]}),f.jsxs("div",{className:ue.aboutItem,children:[f.jsx("span",{className:ue.aboutLabel,children:"Active Sessions"}),f.jsx("span",{className:ue.aboutValue,children:d})]}),f.jsxs("div",{className:ue.aboutItem,children:[f.jsx("span",{className:ue.aboutLabel,children:"Version"}),f.jsx("span",{className:ue.aboutValue,children:"0.50.0"})]})]})]})}function B6(){return f.jsx(O6,{})}const L6="_wizard_1260s_1",I6="_container_1260s_10",U6="_stepContent_1260s_19",z6="_logoArea_1260s_28",V6="_logoImage_1260s_32",H6="_heading_1260s_41",G6="_tagline_1260s_49",P6="_subtitle_1260s_56",F6="_featureList_1260s_64",$6="_runtimeGrid_1260s_89",q6="_runtimeCard_1260s_101",Y6="_runtimeName_1260s_133",K6="_runtimeDescription_1260s_139",Z6="_buttonRow_1260s_144",X6="_primaryButton_1260s_151",Q6="_ghostButton_1260s_185",W6="_dots_1260s_213",J6="_dot_1260s_213",ot={wizard:L6,container:I6,stepContent:U6,logoArea:z6,logoImage:V6,heading:H6,tagline:G6,subtitle:P6,featureList:F6,runtimeGrid:$6,runtimeCard:q6,runtimeName:Y6,runtimeDescription:K6,buttonRow:Z6,primaryButton:X6,ghostButton:Q6,dots:W6,dot:J6};function e5({onNext:n}){return f.jsxs("div",{className:ot.stepContent,"data-testid":"setup-welcome",children:[f.jsx("div",{className:ot.logoArea,children:f.jsx("img",{src:"/grackle-logo.png",alt:"Grackle",className:ot.logoImage})}),f.jsx("h1",{className:ot.heading,children:"Welcome to Grackle"}),f.jsx("p",{className:ot.tagline,children:"Multi-agent orchestration for software teams"}),f.jsx("button",{type:"button",className:ot.primaryButton,onClick:n,"data-testid":"setup-get-started",children:"Get Started"})]})}function t5({onNext:n,onBack:a}){return f.jsxs("div",{className:ot.stepContent,"data-testid":"setup-about",children:[f.jsx("h2",{className:ot.heading,children:"What is Grackle?"}),f.jsxs("ul",{className:ot.featureList,children:[f.jsx("li",{children:"Run Claude, Copilot, and Codex agents side by side"}),f.jsx("li",{children:"Provision and control dev environments — SSH, Codespaces, or local"}),f.jsx("li",{children:"Organize work into workspaces with agent-executable tasks"}),f.jsx("li",{children:"Customize agent behavior with personas, tools, and MCP servers"}),f.jsx("li",{children:"Live-stream agent sessions with full terminal replay"})]}),f.jsxs("div",{className:ot.buttonRow,children:[f.jsx("button",{type:"button",className:ot.ghostButton,onClick:a,children:"Back"}),f.jsx("button",{type:"button",className:ot.primaryButton,onClick:n,"data-testid":"setup-about-next",children:"Next"})]})]})}const n5=[{id:"claude-code",name:"Claude Code",description:"Anthropic's agentic coding tool"},{id:"copilot",name:"Copilot Coding Agent",description:"GitHub's AI pair programmer"},{id:"codex",name:"Codex CLI",description:"OpenAI's coding agent"}];function a5({currentRuntime:n,onFinish:a,onBack:i,finishDisabled:o}){const[r,d]=S.useState(n||"claude-code");return S.useEffect(()=>{n&&d(n)},[n]),f.jsxs("div",{className:ot.stepContent,"data-testid":"setup-runtime",children:[f.jsx("h2",{className:ot.heading,children:"Choose Your Runtime"}),f.jsx("p",{className:ot.subtitle,children:"Select the primary agent runtime for your workspace. You can change this later."}),f.jsx("div",{className:ot.runtimeGrid,children:n5.map(u=>f.jsxs("button",{type:"button",className:ot.runtimeCard,"data-selected":r===u.id,"aria-pressed":r===u.id,"data-testid":`runtime-card-${u.id}`,onClick:()=>d(u.id),children:[f.jsx("span",{className:ot.runtimeName,children:u.name}),f.jsx("span",{className:ot.runtimeDescription,children:u.description})]},u.id))}),f.jsxs("div",{className:ot.buttonRow,children:[f.jsx("button",{type:"button",className:ot.ghostButton,onClick:i,children:"Back"}),f.jsx("button",{type:"button",className:ot.primaryButton,onClick:()=>a(r),disabled:o,"data-testid":"setup-finish",children:"Finish"})]})]})}const s5=3,M0={"claude-code":"sonnet",copilot:"gpt-4o",codex:"o3"};function i5(){const{personas:n,updatePersona:a,completeOnboarding:i,onboardingCompleted:o}=Ot(),r=_n(),[d,u]=S.useState(0),p=n.find(g=>g.id==="claude-code"),m=S.useCallback(g=>{if(p&&g!==p.runtime){const v=M0[g]??"sonnet";a(p.id,void 0,void 0,void 0,g,v)}const y=n.find(v=>v.id===h0);if(y&&g!==y.runtime){const v=M0[g]??"sonnet";a(h0,void 0,void 0,void 0,g,v)}i(),r("/",{replace:!0})},[p,n,a,i,r]);return o===!0?f.jsx(Os,{to:"/",replace:!0}):f.jsx("div",{className:ot.wizard,"data-testid":"setup-wizard",children:f.jsxs("div",{className:ot.container,children:[f.jsx(In,{mode:"wait",children:f.jsxs(Kt.div,{initial:{opacity:0,x:40},animate:{opacity:1,x:0},exit:{opacity:0,x:-40},transition:{duration:.2,ease:"easeInOut"},children:[d===0&&f.jsx(e5,{onNext:()=>u(1)}),d===1&&f.jsx(t5,{onNext:()=>u(2),onBack:()=>u(0)}),d===2&&f.jsx(a5,{currentRuntime:(p==null?void 0:p.runtime)??"claude-code",onFinish:m,onBack:()=>u(1),finishDisabled:!p})]},d)}),f.jsx("div",{className:ot.dots,children:Array.from({length:s5},(g,y)=>f.jsx("span",{className:ot.dot,"data-active":y===d},y))})]})})}const l5="_root_h353j_1",o5="_body_h353j_7",r5="_main_h353j_19",c5="_sidebarWrapper_h353j_26",u5="_overlay_h353j_56",Gl={root:l5,body:o5,main:r5,sidebarWrapper:c5,overlay:u5},d5=typeof window<"u"&&new URLSearchParams(window.location.search).has("mock");function f5(){const{lastSpawnedId:n,environments:a,connected:i,onboardingCompleted:o}=Ot(),{showToast:r}=uo();lM(a,r);const d=_n(),u=Jt(),p=u.pathname.startsWith(Bi),[m,g]=S.useState(!1),y=S.useCallback(()=>g(v=>!v),[]);return S.useEffect(()=>{g(!1)},[u.pathname]),S.useEffect(()=>{if(!m)return;const v=x=>{x.key==="Escape"&&g(!1)};return document.addEventListener("keydown",v),()=>{document.removeEventListener("keydown",v)}},[m]),S.useEffect(()=>{n&&!u.pathname.startsWith("/tasks/")&&d(W0(n),{replace:!0})},[n,d,u.pathname]),i&&o===!1?f.jsx(Os,{to:"/setup",replace:!0}):f.jsxs("div",{className:Gl.root,children:[f.jsx(cC,{onToggleSidebar:p?void 0:y,sidebarOpen:m}),f.jsxs("div",{className:Gl.body,children:[f.jsx("div",{className:Gl.sidebarWrapper,"data-sidebar-open":m,"data-settings":p,children:p?f.jsx(BB,{}):f.jsx(kD,{})}),m&&!p&&f.jsx("div",{className:Gl.overlay,"data-testid":"drawer-overlay",onClick:()=>g(!1)}),f.jsxs("div",{className:Gl.main,children:[f.jsx(Y0,{}),f.jsx(qD,{})]})]}),f.jsx(iM,{})]})}function h5(){return f.jsxs(kT,{children:[f.jsx(ht,{path:"setup",element:f.jsx(i5,{})}),f.jsxs(ht,{element:f.jsx(f5,{}),children:[f.jsx(ht,{index:!0,element:f.jsx(Os,{to:"/chat",replace:!0})}),f.jsx(ht,{path:"chat",element:f.jsx(c3,{})}),f.jsx(ht,{path:"sessions/new",element:f.jsx(v3,{})}),f.jsx(ht,{path:"sessions/:sessionId",element:f.jsx(S3,{})}),f.jsx(ht,{path:"workspaces",element:f.jsx(u3,{})}),f.jsx(ht,{path:"workspaces/:workspaceId",element:f.jsx(zO,{})}),f.jsx(ht,{path:"tasks/new",element:f.jsx(oB,{})}),f.jsx(ht,{path:"tasks/:taskId",element:f.jsx(nf,{})}),f.jsx(ht,{path:"tasks/:taskId/stream",element:f.jsx(nf,{})}),f.jsx(ht,{path:"tasks/:taskId/findings",element:f.jsx(nf,{})}),f.jsx(ht,{path:"tasks/:taskId/edit",element:f.jsx(rB,{})}),f.jsx(ht,{path:"environments/new",element:f.jsx(CB,{})}),f.jsxs(ht,{path:"settings",element:f.jsx(NB,{}),children:[f.jsx(ht,{index:!0,element:f.jsx(Os,{to:"environments",replace:!0})}),f.jsx(ht,{path:"environments",element:f.jsx(y4,{})}),f.jsx(ht,{path:"credentials",element:f.jsx(i6,{})}),f.jsx(ht,{path:"tokens",element:f.jsx(Os,{to:"../credentials",replace:!0})}),f.jsx(ht,{path:"personas",element:f.jsx(D6,{})}),f.jsx(ht,{path:"appearance",element:f.jsx(R6,{})}),f.jsx(ht,{path:"about",element:f.jsx(B6,{})})]}),f.jsx(ht,{path:"*",element:f.jsx(Os,{to:"/",replace:!0})})]})]})}const p5=1e4;function m5(){const{onboardingCompleted:n}=Ot(),[a,i]=S.useState(!1);S.useEffect(()=>{if(n!==void 0)return;const r=setTimeout(()=>i(!0),p5);return()=>clearTimeout(r)},[n]);const o=n===void 0&&!a;return f.jsx(In,{mode:"wait",children:o?f.jsx(Kt.div,{initial:{opacity:1},exit:{opacity:0},transition:{duration:.25},children:f.jsx(TN,{})},"splash"):f.jsx(Kt.div,{initial:{opacity:0},animate:{opacity:1},transition:{duration:.25},style:{minHeight:"100vh"},children:f.jsx(WT,{children:f.jsx(h5,{})})},"app")})}function g5(){const n=d5?YE:UE;return f.jsx(JE,{children:f.jsx(ZE,{children:f.jsx(n,{children:f.jsx(m5,{})})})})}j_.createRoot(document.getElementById("root")).render(f.jsx(S.StrictMode,{children:f.jsx(g5,{})}));

package/dist/index.html

@@ -4,7 +4,7 @@
     <meta charset="UTF-8" />
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
     <title>Grackle</title>
-    <script type="module" crossorigin src="/assets/index-B-4RitDJ.js"></script>
+    <script type="module" crossorigin src="/assets/index-cPFBXn_Y.js"></script>
     <link rel="modulepreload" crossorigin href="/assets/markdown-gcy1Jmzi.js">
     <link rel="modulepreload" crossorigin href="/assets/dagview-EHk2VaeR.js">
     <link rel="stylesheet" crossorigin href="/assets/index-BKJj88Qf.css">

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@grackle-ai/web",
-  "version": "0.50.0",
+  "version": "0.50.1",
   "description": "React web UI for the Grackle multi-agent coordination platform",
   "license": "MIT",
   "repository": {
@@ -31,7 +31,7 @@
     "rehype-prism-plus": "^2.0.0",
     "remark-gfm": "^4.0.0",
     "react-router": "^7.0.0",
-    "@grackle-ai/common": "0.50.0"
+    "@grackle-ai/common": "0.50.1"
   },
   "devDependencies": {
     "@rushstack/heft": "1.2.4",