Example source

Extension and
self-learning examples.

A2UI and MCP App examples from the application repository, plus a downloadable project for trying skill drafting, verification, and reuse.

01
pi extension · A2UI

A2UI tool output

a2ui-failing-specs adds one pi tool. When called, it returns an A2UI surface with failing tests and actions — the model chooses the tool, but your extension owns the interface.

  • Uses pi's normal extension API
  • No remote service or custom frontend
  • Actions round-trip into the conversation
View example source
TypeScript · tool-result excerpt
// From examples/a2ui-failing-specs/index.ts
// The tool result includes declarative surface operations.
return {
  content: [{
    type: 'text',
    text: 'Showed the user a table of failing specs…'
  }],
  details: {
    a2ui_operations: failingSpecsSurface(SPECS)
  }
};

Abbreviated tool-result shape, not an application screenshot. The example supplies fixed demo failures; it does not discover your real test results.

Run it locally

Copy the extension into a project

Terminal
mkdir -p /tmp/specs-demo/.pi/extensions
cp -r examples/a2ui-failing-specs \
  /tmp/specs-demo/.pi/extensions/

# Open /tmp/specs-demo in pi-kit, then ask:
“Which e2e specs fail right now?”
02
MCP server · MCP App

MCP App server

mcp-app-server is a zero-dependency stdio server with an issue form delivered as a ui:// resource. The sandboxed app calls its sibling tool and can send context back to pi.

  • Standard MCP Apps postMessage protocol
  • Sandboxed HTML resource
  • Works with direct tool exposure
View example source
Terminal
# From a checkout of the application repository:
node examples/mcp-app-server/server.mjs

# This is a stdio MCP server, not an HTTP website.
# Configure pi-kit to launch it with Node.
# Ask for open_issue_form, then interact with the UI.
# The sample's create_issue tool is a demo,
# not a connection to your production issue tracker.

Run the actual server through MCP to see its sandboxed interface. A verified running-example capture will replace this source panel when available.

Connect it

Add the server to mcp.json

Terminal
{
  "mcpServers": {
    "issues": {
      "command": "node",
      "args": ["/absolute/path/to/server.mjs"],
      "exposure": "direct"
    }
  }
}
03
Self-learning · Node.js

Skill drafting and reuse

The starter project contains a string-normalization function and three Node.js tests. Complete one change, commit its outcome, and request a skill with /learn. Review the generated instructions and replay report, then use the approved skill in a second task.

The example has no dependencies and does not include a preinstalled skill. Draft and replay results depend on the selected model.

Interfaces

Extension APIs
and UI protocols.

pi extensions add agent behavior. A2UI and MCP Apps provide tool interfaces in the transcript. Host plugins use pi-kit's event contracts.

pi extensions

Add tools, commands, event handlers, or composer affordances using pi's package model.

Explore pi

A2UI

Return declarative surfaces from a tool and let pi-kit render them in its native design language.

Explore A2UI

MCP Apps

Ship interactive HTML resources with an MCP server, sandboxed and hosted directly in the transcript.

Explore MCP

pi-kit plugins

Use the documented event contract to request redacted transcripts, outcomes, or capped attendant calls.

See self-learning

Run the examples

Clone the application repository and follow the setup instructions in each example directory.