arcie 0.1.9 → 0.2.0

package/dist/runner/index.js

@@ -1,8 +1,8 @@
 import {
   runAgent,
   streamAgent
-} from "../chunk-4WSILP75.js";
-import "../chunk-KVSX4MLK.js";
+} from "../chunk-3R65GQAE.js";
+import "../chunk-XZPC3JSU.js";
 import "../chunk-QE46QFID.js";
 import "../chunk-PHTJLJOV.js";
 export {

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "arcie",
   "type": "module",
-  "version": "0.1.9",
+  "version": "0.2.0",
   "description": "The electronic line — build agents at the speed of light.",
   "bin": {
     "arcie": "dist/cli/index.js"

package/templates/web-chat/app/api/agents/route.ts

@@ -0,0 +1,37 @@
+import { NextRequest } from "next/server";
+
+export const runtime = "nodejs";
+export const dynamic = "force-dynamic";
+
+const ARCIE_URL = process.env.ARCIE_URL ?? "http://localhost:3000";
+
+export async function GET(_req: NextRequest) {
+  try {
+    const upstream = await fetch(`${ARCIE_URL}/agents`, {
+      headers: { "Content-Type": "application/json" },
+    });
+    if (!upstream.ok) {
+      return Response.json(
+        { error: `Upstream ${upstream.status}`, agents: [] },
+        { status: upstream.status },
+      );
+    }
+    const agents = (await upstream.json()) as Array<{
+      id: string;
+      name: string;
+      model: string;
+      description: string;
+    }>;
+    return Response.json(agents);
+  } catch (error) {
+    return Response.json(
+      {
+        error: "Could not reach arcie server",
+        detail: error instanceof Error ? error.message : String(error),
+        hint: `Is arcie running at ${ARCIE_URL}? Start it with \`arcie dev\`.`,
+        agents: [],
+      },
+      { status: 502 },
+    );
+  }
+}

package/templates/web-chat/app/api/chat/route.ts

@@ -6,14 +6,22 @@ export const dynamic = "force-dynamic";
 const ARCIE_URL = process.env.ARCIE_URL ?? "http://localhost:3000";
 
 export async function POST(req: NextRequest) {
-  const { message } = (await req.json()) as { message: string };
+  const { message, agentId } = (await req.json()) as {
+    message: string;
+    agentId?: string;
+  };
   if (typeof message !== "string" || message.length === 0) {
     return new Response("message required", { status: 400 });
   }
 
+  const target =
+    typeof agentId === "string" && agentId.length > 0
+      ? `${ARCIE_URL}/agents/${encodeURIComponent(agentId)}`
+      : ARCIE_URL;
+
   let upstream: Response;
   try {
-    upstream = await fetch(ARCIE_URL, {
+    upstream = await fetch(target, {
       method: "POST",
       headers: { "Content-Type": "application/json" },
       body: JSON.stringify({ message, stream: true }),

package/templates/web-chat/components/agent-picker.tsx

@@ -0,0 +1,102 @@
+"use client";
+
+import * as React from "react";
+import { Check, ChevronDown } from "lucide-react";
+import { cn } from "@/lib/utils";
+
+export interface AgentSummary {
+  readonly id: string;
+  readonly name: string;
+  readonly model: string;
+  readonly description: string;
+}
+
+interface AgentPickerProps {
+  agents: readonly AgentSummary[];
+  value: string;
+  onChange(id: string): void;
+}
+
+export function AgentPicker({ agents, value, onChange }: AgentPickerProps) {
+  const [open, setOpen] = React.useState(false);
+  const rootRef = React.useRef<HTMLDivElement>(null);
+
+  React.useEffect(() => {
+    if (!open) return;
+    const onClick = (event: MouseEvent) => {
+      if (rootRef.current !== null && !rootRef.current.contains(event.target as Node)) {
+        setOpen(false);
+      }
+    };
+    document.addEventListener("mousedown", onClick);
+    return () => document.removeEventListener("mousedown", onClick);
+  }, [open]);
+
+  const selected = agents.find((a) => a.id === value) ?? agents[0];
+
+  if (agents.length === 0) return null;
+  if (agents.length === 1) {
+    return (
+      <div className="px-2.5 py-1.5 rounded-xl text-[11px] font-medium bg-card/60 text-foreground truncate max-w-[220px]">
+        {selected?.name ?? value}
+      </div>
+    );
+  }
+
+  return (
+    <div ref={rootRef} className="relative">
+      <button
+        type="button"
+        onClick={() => setOpen((prev) => !prev)}
+        className={cn(
+          "flex items-center gap-1.5 px-2.5 py-1.5 rounded-xl text-[11px] font-medium transition-all cursor-pointer",
+          open ? "bg-primary/15 text-foreground ring-1 ring-primary/30" : "bg-card/60 hover:bg-card/85 text-foreground",
+        )}
+      >
+        <span className="truncate max-w-[160px]">{selected?.name ?? value}</span>
+        <ChevronDown className="h-3 w-3 opacity-70" />
+      </button>
+
+      {open && (
+        <div className="absolute z-50 bottom-full mb-2 left-0 w-72 rounded-2xl border border-border/40 bg-popover shadow-2xl p-1.5 flex flex-col max-h-[320px] overflow-y-auto backdrop-blur-xl animate-in fade-in slide-in-from-bottom-2 duration-150">
+          {agents.map((agent) => {
+            const isSelected = agent.id === value;
+            return (
+              <button
+                key={agent.id}
+                type="button"
+                onClick={() => {
+                  onChange(agent.id);
+                  setOpen(false);
+                }}
+                className={cn(
+                  "w-full flex items-start gap-2 px-2.5 py-2 rounded-lg text-left transition-all hover:bg-muted/50 cursor-pointer",
+                  isSelected && "bg-muted",
+                )}
+              >
+                <div className="min-w-0 flex-1">
+                  <div className="flex items-center gap-1.5">
+                    <span className="text-[11px] font-medium text-foreground truncate">
+                      {agent.name}
+                    </span>
+                    {agent.model.length > 0 && (
+                      <span className="text-[9px] text-muted-foreground/60 truncate font-mono">
+                        {agent.model}
+                      </span>
+                    )}
+                  </div>
+                  {agent.description.length > 0 && (
+                    <div className="text-[10px] text-muted-foreground/70 mt-0.5 leading-relaxed line-clamp-2">
+                      {agent.description}
+                    </div>
+                  )}
+                </div>
+                {isSelected && <Check className="h-3.5 w-3.5 text-primary shrink-0 mt-0.5" />}
+              </button>
+            );
+          })}
+        </div>
+      )}
+    </div>
+  );
+}

package/templates/web-chat/components/chat.tsx

@@ -1,6 +1,7 @@
 "use client";
 
 import * as React from "react";
+import { AgentPicker, type AgentSummary } from "@/components/agent-picker";
 import { InputBar } from "@/components/input-bar";
 import { Message } from "@/components/message";
 import { readArcieStream } from "@/lib/stream";
@@ -10,12 +11,46 @@ function newId(prefix: string): string {
   return `${prefix}-${Date.now()}-${Math.random().toString(36).slice(2, 8)}`;
 }
 
+const AGENT_STORAGE_KEY = "arcie:selected-agent";
+
 export function Chat() {
   const [messages, setMessages] = React.useState<UiMessage[]>([]);
   const [streaming, setStreaming] = React.useState(false);
+  const [agents, setAgents] = React.useState<AgentSummary[]>([]);
+  const [agentId, setAgentId] = React.useState<string>("agent");
   const abortRef = React.useRef<AbortController | undefined>(undefined);
   const containerRef = React.useRef<HTMLDivElement>(null);
 
+  React.useEffect(() => {
+    let cancelled = false;
+    void (async () => {
+      try {
+        const response = await fetch("/api/agents");
+        if (!response.ok) return;
+        const list = (await response.json()) as AgentSummary[];
+        if (cancelled || !Array.isArray(list)) return;
+        setAgents(list);
+        const stored = typeof window !== "undefined" ? localStorage.getItem(AGENT_STORAGE_KEY) : null;
+        if (stored !== null && list.some((a) => a.id === stored)) {
+          setAgentId(stored);
+        } else if (list.length > 0) {
+          setAgentId(list[0]!.id);
+        }
+      } catch {
+        // Non-fatal — chat still works, just posts to primary.
+      }
+    })();
+    return () => {
+      cancelled = true;
+    };
+  }, []);
+
+  const changeAgent = (id: string) => {
+    setAgentId(id);
+    if (typeof window !== "undefined") localStorage.setItem(AGENT_STORAGE_KEY, id);
+    clearAll();
+  };
+
   React.useEffect(() => {
     const el = containerRef.current;
     if (el === null) return;
@@ -66,7 +101,7 @@ export function Chat() {
         const response = await fetch("/api/chat", {
           method: "POST",
           headers: { "Content-Type": "application/json" },
-          body: JSON.stringify({ message: text }),
+          body: JSON.stringify({ message: text, agentId }),
           signal: controller.signal,
         });
         if (!response.ok) {
@@ -175,7 +210,7 @@ export function Chat() {
         abortRef.current = undefined;
       }
     },
-    [messages],
+    [messages, agentId],
   );
 
   const regenerate = () => {
@@ -213,6 +248,11 @@ export function Chat() {
         onClear={clearAll}
         streaming={streaming}
         hasMessages={messages.length > 0}
+        leftSlot={
+          agents.length > 0 ? (
+            <AgentPicker agents={agents} value={agentId} onChange={changeAgent} />
+          ) : undefined
+        }
       />
     </div>
   );

package/templates/web-chat/components/input-bar.tsx

@@ -11,6 +11,8 @@ interface InputBarProps {
   streaming: boolean;
   disabled?: boolean;
   hasMessages?: boolean;
+  /** Optional slot rendered on the left of the footer bar (e.g. an agent picker). */
+  leftSlot?: React.ReactNode;
 }
 
 export function InputBar({
@@ -20,6 +22,7 @@ export function InputBar({
   streaming,
   disabled,
   hasMessages,
+  leftSlot,
 }: InputBarProps) {
   const [value, setValue] = React.useState("");
   const [files, setFiles] = React.useState<File[]>([]);
@@ -134,6 +137,7 @@ export function InputBar({
               >
                 <Paperclip className="h-4 w-4" />
               </button>
+              {leftSlot}
             </div>
 
             <div className="flex items-center gap-2 shrink-0">

package/dist/chunk-KVSX4MLK.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../src/loader.ts"],"sourcesContent":["import { readFileSync, existsSync, readdirSync, statSync } from \"node:fs\";\nimport { resolve, basename, extname } from \"node:path\";\nimport type {\n  AgentManifest,\n  AgentConfig,\n  ToolConfig,\n  SkillConfig,\n  HookConfig,\n  ChannelConfig,\n  ConnectionConfig,\n  ScheduleConfig,\n  SessionConfig,\n  PolicyConfig,\n  SubagentManifest,\n} from \"./types\";\n\nexport interface LoadedAgent {\n  manifest: AgentManifest;\n  agentDir: string;\n}\n\nexport async function loadAgent(agentDir: string): Promise<LoadedAgent> {\n  const absDir = resolve(process.cwd(), agentDir);\n\n  if (!existsSync(absDir)) {\n    throw new Error(`Agent directory not found: ${absDir}`);\n  }\n\n  const agentFile = resolve(absDir, \"agent.ts\");\n  let config: AgentConfig = { model: \"gpt-4o\" };\n\n  if (existsSync(agentFile)) {\n    try {\n      const mod = await import(agentFile);\n      if (mod.default) {\n        config = { ...config, ...mod.default };\n      }\n    } catch (err) {\n      console.warn(`[arcie] Failed to load agent.ts: ${(err as Error).message}. Using defaults.`);\n    }\n  }\n\n  const instructions = loadInstructionsFile(absDir);\n  const tools = await loadDirectory<ToolConfig>(absDir, \"tools\");\n  const skills = await loadDirectory<SkillConfig>(absDir, \"skills\");\n  const hooks = await loadDirectory<HookConfig>(absDir, \"hooks\");\n  const channels = await loadDirectory<ChannelConfig>(absDir, \"channels\");\n  const connections = await loadDirectory<ConnectionConfig>(absDir, \"connections\");\n  const schedules = await loadDirectory<ScheduleConfig>(absDir, \"schedules\");\n  const subagents = await loadSubagents(absDir);\n  const session = await loadSessionConfig(absDir);\n  const policy = await loadPolicyConfig(absDir);\n\n  return {\n    agentDir: absDir,\n    manifest: {\n      config,\n      instructions,\n      tools,\n      skills,\n      hooks,\n      channels,\n      connections,\n      schedules,\n      subagents,\n      session: session ?? undefined,\n      policy: policy ?? undefined,\n    },\n  };\n}\n\n/**\n * Loads each `subagents/<id>/` directory as a self-contained child agent.\n * Unlike the other slots, subagents are *directories* (not flat files): every\n * one is a mini-agent with its own config, instructions, tools, and skills.\n * A subagent must declare a `description` so the orchestrator knows when to\n * delegate to it — a missing one is a hard authoring error.\n */\nasync function loadSubagents(\n  agentDir: string\n): Promise<Record<string, SubagentManifest>> {\n  const dirPath = resolve(agentDir, \"subagents\");\n  if (!existsSync(dirPath)) return {};\n\n  const result: Record<string, SubagentManifest> = {};\n\n  for (const entry of readdirSync(dirPath, { withFileTypes: true })) {\n    if (!entry.isDirectory() || entry.name.startsWith(\".\")) continue;\n    const id = entry.name;\n    const subDir = resolve(dirPath, id);\n\n    const agentFile = resolve(subDir, \"agent.ts\");\n    if (!existsSync(agentFile)) {\n      throw new Error(`Subagent \"${id}\" is missing agent.ts`);\n    }\n\n    let mod: { default?: AgentConfig };\n    try {\n      mod = await import(agentFile);\n    } catch (err) {\n      throw new Error(`Failed to load subagent \"${id}\": ${(err as Error).message}`);\n    }\n\n    const config = mod.default;\n    if (!config) {\n      throw new Error(`Subagent \"${id}\" agent.ts must have a default export`);\n    }\n    if (!config.description) {\n      throw new Error(`Subagent \"${id}\" must declare a description in agent.ts`);\n    }\n\n    result[id] = {\n      config,\n      instructions: loadInstructionsFile(subDir),\n      tools: await loadDirectory<ToolConfig>(subDir, \"tools\"),\n      skills: await loadDirectory<SkillConfig>(subDir, \"skills\"),\n    };\n  }\n\n  return result;\n}\n\nfunction loadInstructionsFile(agentDir: string): string {\n  const mdPath = resolve(agentDir, \"instructions.md\");\n  if (existsSync(mdPath)) {\n    return readFileSync(mdPath, \"utf-8\");\n  }\n  return \"You are a helpful AI agent.\";\n}\n\nasync function loadDirectory<T>(\n  agentDir: string,\n  dirName: string\n): Promise<Record<string, T>> {\n  const dirPath = resolve(agentDir, dirName);\n  if (!existsSync(dirPath)) return {};\n\n  const entries = readdirSync(dirPath).filter(\n    (f) => !f.startsWith(\".\") && (f.endsWith(\".ts\") || f.endsWith(\".js\"))\n  );\n\n  const result: Record<string, T> = {};\n\n  for (const entry of entries) {\n    const name = basename(entry, extname(entry));\n    const filePath = resolve(dirPath, entry);\n\n    if (statSync(filePath).isFile()) {\n      try {\n        const mod = await import(filePath);\n        if (mod.default) {\n          result[name] = mod.default;\n        }\n      } catch {\n        // skip unloadable files\n      }\n    }\n  }\n\n  return result;\n}\n\nasync function loadSessionConfig(agentDir: string): Promise<SessionConfig | null> {\n  const tsPath = resolve(agentDir, \"sessions\", \"config.ts\");\n  if (existsSync(tsPath)) {\n    try {\n      const mod = await import(tsPath);\n      return mod.default ?? null;\n    } catch {\n      return null;\n    }\n  }\n  return null;\n}\n\nasync function loadPolicyConfig(agentDir: string): Promise<PolicyConfig | null> {\n  const tsPath = resolve(agentDir, \"policies\", \"index.ts\");\n  if (existsSync(tsPath)) {\n    try {\n      const mod = await import(tsPath);\n      return mod.default ?? null;\n    } catch {\n      return null;\n    }\n  }\n  return null;\n}\n"],"mappings":"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","names":[]}