agent-sh 0.14.11 → 0.15.0

package/examples/extensions/ashi/src/ui.ts

@@ -0,0 +1,88 @@
+import type { ExtensionContext } from "agent-sh/types";
+import type { RenderNode, RenderNodes } from "./renderer.js";
+import type { StatusSegment } from "./status-footer.js";
+import type { SelectOpts, ConfirmOpts } from "./dialogs.js";
+import type { InputOpts } from "./input-prompt.js";
+
+export type { SelectChoice, SelectOpts, ConfirmOpts } from "./dialogs.js";
+export type { InputOpts } from "./input-prompt.js";
+export type { StatusSegment } from "./status-footer.js";
+
+export type NoticeLevel = "info" | "warn" | "error" | "success";
+
+export interface Contribution {
+  /** Re-pull this surface (call after the content it depends on changes). */
+  refresh(): void;
+  remove(): void;
+}
+
+/**
+ * Typed sugar over ashi's UI protocol. Wraps the bus events and named handlers so call
+ * sites read like a UI object, with real types and no magic strings — without a `ui` field
+ * on the kernel context. Request/response surfaces degrade when no frontend answers them
+ * (select/input → undefined, confirm → false, getEditorText → "").
+ */
+export interface Ui {
+  notify(message: string, level?: NoticeLevel): void;
+  select(opts: SelectOpts): Promise<string | undefined>;
+  confirm(opts: ConfirmOpts): Promise<boolean>;
+  input(opts?: InputOpts): Promise<string | undefined>;
+  getEditorText(): string;
+  setEditorText(text: string): void;
+  /** Contribute a status-bar segment. `get` runs on each repaint; return null to show nothing. */
+  status(get: () => StatusSegment | null): Contribution;
+  /** Contribute a pinned widget above the input, built from the renderer's node factory. */
+  dock(build: (nodes: RenderNodes) => RenderNode | null): Contribution;
+}
+
+export function createUi(ctx: ExtensionContext): Ui {
+  const has = (name: string): boolean => ctx.list().includes(name);
+
+  return {
+    notify(message, level) {
+      ctx.bus.emit("ui:notify", { message, level });
+    },
+    select(opts) {
+      if (!has("ui:select")) return Promise.resolve(undefined);
+      return ctx.call("ui:select", opts) as Promise<string | undefined>;
+    },
+    confirm(opts) {
+      if (!has("ui:confirm")) return Promise.resolve(false);
+      return ctx.call("ui:confirm", opts) as Promise<boolean>;
+    },
+    input(opts = {}) {
+      if (!has("ui:input")) return Promise.resolve(undefined);
+      return ctx.call("ui:input", opts) as Promise<string | undefined>;
+    },
+    getEditorText() {
+      return has("ui:editor:get-text") ? (ctx.call("ui:editor:get-text") as string) : "";
+    },
+    setEditorText(text) {
+      if (has("ui:editor:set-text")) ctx.call("ui:editor:set-text", text);
+    },
+    status(get) {
+      const contribute = (p: { segments: StatusSegment[] }): { segments: StatusSegment[] } => {
+        const seg = get();
+        return seg ? { segments: [...p.segments, seg] } : p;
+      };
+      ctx.bus.onPipe("ui:status", contribute);
+      return {
+        refresh: () => ctx.bus.emit("ui:status:invalidate", {}),
+        remove: () => ctx.bus.offPipe("ui:status", contribute),
+      };
+    },
+    dock(build) {
+      const contribute = (
+        p: { nodes: RenderNodes; views: RenderNode[] },
+      ): { nodes: RenderNodes; views: RenderNode[] } => {
+        const view = build(p.nodes);
+        return view ? { ...p, views: [...p.views, view] } : p;
+      };
+      ctx.bus.onPipe("ashi:dock:above-input", contribute);
+      return {
+        refresh: () => ctx.bus.emit("ashi:dock:invalidate", {}),
+        remove: () => ctx.bus.offPipe("ashi:dock:above-input", contribute),
+      };
+    },
+  };
+}

package/examples/extensions/ashi-ink/README.md

@@ -10,6 +10,8 @@ The look follows Claude Code's chat design: a `❯` user prompt on a faint band,
 read & search groups that collapse to `Read N files`, and box-less diffs with a
 line-numbered green/red gutter.
 
+![ashi-ink rendering tool calls, claude-code-style](https://raw.githubusercontent.com/guanyilun/agent-sh/main/assets/ashi-claude-code-style.png)
+
 > Requires `@guanyilun/ashi` ≥ 0.2.0.
 
 ## Use

package/examples/extensions/ashi-scheme-render.ts

@@ -29,16 +29,22 @@ const model: RenderModel<SchemeInit> = {
       { text: "scheme ", style: { bold: true, color: "toolTitle" } },
       { text: env.expanded ? s.source : compact(s.source), highlight: "scheme" },
     ];
+    const summaryOnResult = env.expanded && env.finalized && !failed && !!s.status;
     return {
       titleIcon: "scheme",
       title,
       status: s.status,
-      // Title carries the source; body shows the eval result, not an echo of it.
+      hideTitleStatus: summaryOnResult,
       body: failed
         ? { kind: "text", segments: [
             { text: `✗ ${s.output.trim()}`, style: { color: "error" } },
           ] }
-        : { kind: "stream", text: s.output },
+        : summaryOnResult
+          ? { kind: "text", segments: [
+              { text: "✓", style: { color: "success" } },
+              { text: ` ${s.status!.summary ?? "ok"}`, style: { color: "muted" } },
+            ] }
+          : { kind: "stream", text: s.output },
       expandable: true,
       defaultExpanded: failed,
     };

package/examples/extensions/ashi-ui-demo.ts

@@ -0,0 +1,63 @@
+/**
+ * ashi UI-surface demo — exercises every surface via the typed `@guanyilun/ashi/ui` helper.
+ *
+ * Usage:  ashi -e ashi-ui-demo        (or -e examples/extensions/ashi-ui-demo.ts)
+ *
+ * Adds a pinned dock line and a status segment, plus commands:
+ *   /ui-demo        walk the dialogs (select → confirm → input) + notify
+ *   /ui-demo-bump   bump the status segment and re-pull the footer
+ *   /ui-demo-dock   toggle the dock widget and re-pull the dock
+ */
+import { createUi } from "@guanyilun/ashi/ui";
+import type { ExtensionContext } from "agent-sh/types";
+
+export default function activate(ctx: ExtensionContext): void {
+  const ui = createUi(ctx);
+  let bumps = 0;
+  let dockOn = true;
+
+  const status = ui.status(() => ({ id: "demo", text: `✦ demo ${bumps}`, color: "accent" }));
+  const dock = ui.dock((nodes) => {
+    if (!dockOn) return null;
+    const line = nodes.text({ paddingX: 1 });
+    line.setText("📌 ui-demo: a pinned dock widget");
+    return line.node;
+  });
+
+  ctx.registerCommand("ui-demo-bump", "Bump the demo status segment", () => {
+    bumps++;
+    status.refresh();
+  });
+
+  ctx.registerCommand("ui-demo-dock", "Toggle the demo dock widget", () => {
+    dockOn = !dockOn;
+    dock.refresh();
+  });
+
+  ctx.registerCommand("ui-demo", "Walk the ashi UI dialogs (select/confirm/input)", async () => {
+    ui.notify("ui-demo: starting…");
+
+    const fruit = await ui.select({
+      title: "Pick a fruit",
+      items: [
+        { value: "apple", label: "Apple", description: "crisp" },
+        { value: "banana", label: "Banana", description: "soft" },
+        { value: "cherry", label: "Cherry" },
+      ],
+    });
+    if (!fruit) {
+      ui.notify("ui-demo: cancelled", "warn");
+      return;
+    }
+
+    if (!(await ui.confirm({ title: `Really pick ${fruit}?` }))) {
+      ui.notify("ui-demo: not confirmed", "warn");
+      return;
+    }
+
+    const note = await ui.input({ title: "Add a note — enter to submit, esc to skip" });
+    const summary = `picked ${fruit}${note ? ` — ${note}` : ""}`;
+    ui.setEditorText(`/* ${summary} */`);
+    ui.notify(`ui-demo: ${summary}`, "success");
+  });
+}

package/examples/extensions/latex-images.ts

@@ -96,6 +96,42 @@ function renderEquation(equation: string): Buffer | null {
   }
 }
 
+const equationCache = new Map<string, Buffer | null>();
+function renderEquationCached(equation: string): Buffer | null {
+  if (!equationCache.has(equation)) {
+    equationCache.set(equation, renderEquation(equation));
+  }
+  return equationCache.get(equation) ?? null;
+}
+
+const EQ_DELIM = "$$";
+
+type Block =
+  | { type: "text"; text: string }
+  | { type: "image"; data: Buffer }
+  | { type: "code-block"; language: string; code: string };
+type ContentPipe = { blocks: Block[]; images?: boolean };
+
+function splitEquations(text: string): Block[] {
+  const out: Block[] = [];
+  let i = 0;
+  while (i < text.length) {
+    const open = text.indexOf(EQ_DELIM, i);
+    if (open === -1) {
+      const rest = text.slice(i);
+      if (rest) out.push({ type: "text", text: rest });
+      break;
+    }
+    const close = text.indexOf(EQ_DELIM, open + EQ_DELIM.length);
+    if (close === -1) { out.push({ type: "text", text: text.slice(i) }); break; }
+    if (open > i) out.push({ type: "text", text: text.slice(i, open) });
+    const png = renderEquationCached(text.slice(open + EQ_DELIM.length, close).trim());
+    out.push(png ? { type: "image", data: png } : { type: "text", text: text.slice(open, close + EQ_DELIM.length) });
+    i = close + EQ_DELIM.length;
+  }
+  return out;
+}
+
 // ── Extension entry point ────────────────────────────────────────
 
 export default function activate(ctx: ExtensionContext) {
@@ -115,26 +151,38 @@ export default function activate(ctx: ExtensionContext) {
     return;
   }
 
-  ctx.define("latex:render-equation", (equation: string): Buffer | null => renderEquation(equation));
+  ctx.define("latex:render-equation", (equation: string): Buffer | null => renderEquationCached(equation));
 
-  // Shell-only — ashi has no shell surface; it uses the capability above instead.
   if (ctx.shell) {
+    // Shell streams output, so it buffers $$ spanning chunks; finalized-content
+    // renderers (below) get whole blocks instead.
     ctx.shell.createBlockTransform({
-      open: "$$",
-      close: "$$",
-      transform(latex) {
-        const png = renderEquation(latex);
-        if (!png) return null;
-        return { type: "image", data: png };
+      open: EQ_DELIM,
+      close: EQ_DELIM,
+      transform(latex: string) {
+        const png = renderEquationCached(latex);
+        return png ? { type: "image" as const, data: png } : null;
       },
     });
 
     ctx.advise("render:code-block", (next, language: string, code: string, width: number) => {
       if (language !== "latex" && language !== "tex") return next(language, code, width);
-      const png = renderEquation(code);
+      const png = renderEquationCached(code);
       if (!png) return next(language, code, width);
       ctx.call("render:image", png);
     });
+  } else {
+    (bus.onPipe as unknown as (e: string, fn: (p: ContentPipe) => ContentPipe) => void)(
+      "render:assistant-content",
+      (payload) => {
+        // Can't show images reliably → leave $$…$$ as text.
+        if (!payload.images) return payload;
+        return {
+          ...payload,
+          blocks: payload.blocks.flatMap((b) => (b.type === "text" ? splitEquations(b.text) : [b])),
+        };
+      },
+    );
   }
 
   process.on("exit", () => {

package/examples/extensions/overlay-agent.ts

@@ -22,8 +22,8 @@
  */
 import type { AgentContext, ShellContext, RemoteSession } from "agent-sh/types";
 import type { RenderSurface } from "agent-sh/utils/compositor";
-import { FloatingPanel } from "agent-sh/utils/floating-panel";
-import { formatScreenContext, type TerminalBuffer } from "agent-sh/utils/terminal-buffer";
+import type { FloatingPanel, FloatingPanelConfig } from "agent-sh/utils/floating-panel";
+import type { TerminalBuffer } from "agent-sh/utils/terminal-buffer";
 
 /** Adapt a FloatingPanel to the RenderSurface interface. */
 function createPanelSurface(panel: FloatingPanel): RenderSurface {
@@ -72,11 +72,11 @@ export default function activate(ctx: AgentContext & ShellContext): void {
   const { createRemoteSession } = ctx.shell;
   const terminalBuffer: TerminalBuffer | null = ctx.call("terminal-buffer");
 
-  const panel = new FloatingPanel(bus, {
+  const panel: FloatingPanel = ctx.call("floating-panel:create", {
     trigger: "\x1c", // Ctrl+\
     dimBackground: true,
     terminalBuffer: terminalBuffer ?? undefined,
-  });
+  } satisfies FloatingPanelConfig, bus);
 
   const panelSurface = createPanelSurface(panel);
   let session: RemoteSession | null = null;
@@ -89,7 +89,7 @@ export default function activate(ctx: AgentContext & ShellContext): void {
   // `<shell_events>` already covers the visible scrollback — skip to dedupe.
   ctx.agent.registerContextProducer("terminal-screen", () => {
     if (!session?.active || !terminalBuffer?.altScreen) return null;
-    return formatScreenContext(terminalBuffer.readScreen(), 80);
+    return terminalBuffer.formatScreen(80);
   });
 
   registerInstruction("Interactive Overlay Sessions", [

package/examples/extensions/pi-bridge/index.ts

@@ -331,34 +331,29 @@ export default function activate(ctx: ExtensionContext): void {
       const all = modelRegistry.getAvailable() as Array<{ id: string; provider: string }>;
       const cur = session.model;
       return {
-        models: all.map((m) => ({ model: m.id, provider: m.provider })),
-        active: cur ? { model: cur.id, provider: cur.provider } : null,
+        models: all.map((m) => ({ id: m.id, provider: m.provider })),
+        active: cur ? { id: cur.id, provider: cur.provider } : null,
       };
     };
 
-    // Slash command emits `model@provider` for disambiguation; pi looks up by (provider, id).
-    const onSwitchModel = async ({ model: target }: { model: string }) => {
+    const onSwitchModel = async ({ id, provider }: { id: string; provider: string }) => {
       if (!session || !modelRegistry) return;
-      const atIdx = target.lastIndexOf("@");
-      const modelId = atIdx > 0 ? target.slice(0, atIdx) : target;
-      const providerHint = atIdx > 0 ? target.slice(atIdx + 1) : undefined;
-
       const candidates = (modelRegistry.getAvailable() as Array<{ id: string; provider: string }>)
-        .filter((m) => m.id === modelId && (!providerHint || m.provider === providerHint));
+        .filter((m) => m.id === id && (!provider || m.provider === provider));
 
       if (candidates.length === 0) {
-        bus.emit("ui:error", { message: `Unknown model: ${target}` });
+        bus.emit("ui:error", { message: `Unknown model: ${provider}:${id}` });
         return;
       }
       if (candidates.length > 1) {
         const opts = candidates.map((m) => `${m.id}@${m.provider}`).join(", ");
-        bus.emit("ui:error", { message: `Ambiguous model "${modelId}". Use one of: ${opts}` });
+        bus.emit("ui:error", { message: `Ambiguous model "${id}". Use one of: ${opts}` });
         return;
       }
       const picked = candidates[0]!;
       const full = modelRegistry.find(picked.provider, picked.id);
       if (!full) {
-        bus.emit("ui:error", { message: `Model not found: ${target}` });
+        bus.emit("ui:error", { message: `Model not found: ${picked.provider}:${picked.id}` });
         return;
       }
       try {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "agent-sh",
-  "version": "0.14.11",
+  "version": "0.15.0",
   "description": "A composable agent runtime — pair any frontend with any agent backend over one shared extension layer",
   "type": "module",
   "workspaces": [