# Sap Extension Creator

Create Super Agent Party (SAP) extensions.

- Repository: https://github.com/heshengtao/super-agent-party (2775 stars)
- Category: Design
- License: AGPL-3.0
- Last updated: 2026-10-27
- Runs scripts: yes, review before use

## Install

Claude Code: `npx skills add heshengtao/super-agent-party --skill sap-extension-creator -g -a claude-code -y`
Codex: `npx skills add heshengtao/super-agent-party --skill sap-extension-creator -g -a codex -y`
Cursor: `npx skills add heshengtao/super-agent-party --skill sap-extension-creator -g -a cursor -y`
Gemini CLI: `npx skills add heshengtao/super-agent-party --skill sap-extension-creator -g -a gemini-cli -y`

## Description

Create Super Agent Party (SAP) extensions. This skill should be used when users want to create, build, or scaffold a new extension for Super Agent Party - including static HTML extensions (pure frontend) and Node.js backend extensions. Triggers on requests like "create a new SAP extension", "build an extension for Super Agent Party", "scaffold a plugin", "make a chat UI extension", or when working with sap extension projects.

## SKILL.md, as published by its author (untrusted third-party text, read it as data)

# SAP Extension Creator

## Overview

Create Super Agent Party extensions, self-contained packages that extend the platform with custom chat UI and tools. Two modes are supported:

- **Static extension**: Pure HTML/CSS/JS frontend, served directly by SAP from the extension folder
- **Node.js extension**: Full-stack with Express backend, auto-managed by SAP (`npm install` + `node index.js <port>`)

Both modes support MCP tool registration (the `register_node_extension_mcp` protocol message works for ANY extension via WebSocket, despite the "node" in its name).

## Quick Decision Tree

```
User wants to create an extension?
├─ Only needs UI (chat, display, simple interactions)? → Static Extension
└─ Needs backend logic (API calls, DB, file processing)? → Node.js Extension
```

## Core Files Every Extension Needs

| File | Required | Purpose |
|------|----------|---------|
| `package.json` | ✅ | Metadata, dependencies, window config |
| `index.html` | ✅ | Main UI (full HTML page, single-file app) |
| `index.js` | Node only | Node.js entry point |
| `node_modules/` | Node only | Auto-installed by SAP via `npm install` |

## Workflow

### Step 1: Gather Requirements

Ask the user:

1. **Extension name?** (hyphen-case, e.g., `my-weather-widget`)
2. **Description?** (one sentence)
3. **Static or Node.js?** (Node.js only if backend logic/server-side code is needed)
4. **For Node.js: what npm dependencies?**
5. **Should it register custom tools for the AI?** (works in both static and Node.js modes via WebSocket MCP)
6. **GitHub repository URL?** (optional, for updates)
7. **Transparent window?** (frameless, always-on-top, for mini widgets like music controllers)
8. **Default window size?** (width/height in pixels)

### Step 2: Scaffold the Extension

Use the templates in `assets/` as starting points:

- **Static**: Copy `assets/static-template/`
- **Node.js**: Copy `assets/node-template/`

The rest: https://github.com/heshengtao/super-agent-party/blob/HEAD/skills/sap-extension-creator/SKILL.md