4.9 KiB
4.9 KiB
MCP Apps Merged Skill — Changelog
Merge Date: 2026-02-03
Added from Official ext-apps Skill
These sections/content were new from the official skill and did not exist in the custom skill:
| Addition | Location in Merged Doc |
|---|---|
| YAML frontmatter with trigger phrases | Top of file |
| Framework selection table (Vue/Svelte/Preact/Solid) | Quick Start Decision Tree |
| Project context section (adding to existing vs new) | Quick Start Decision Tree |
| Full framework templates table (6 frameworks) | Get Reference Code → Framework Templates |
| API Reference source files table | Get Reference Code → API Reference |
| Additional advanced examples (video-resource, sheet-music, threejs, transcript, basic-host) | Get Reference Code → Advanced Examples |
npm install vs manual versions warning |
Required Packages + MUST DO table |
tsx vs bun compatibility note |
Required Packages |
ontoolinputpartial streaming section with use cases table and code patterns |
New section: Streaming Partial Input |
| Visibility-based resource management (IntersectionObserver) | New section: Visibility-Based Resource Management |
Fullscreen mode (requestDisplayMode()) with CSS patterns |
New section: Fullscreen Mode |
Safe area insets handling (safeAreaInsets) |
New section: Safe Area Insets |
sendLog for debug logging to host |
Client-Side + Debugging Checklist |
| Testing with basic-host example | Testing section |
| Host styling split into Applying / Using subsections | Host CSS Variables |
line-height CSS variable example |
Host CSS Variables |
Kept from Custom Battle-Tested Skill
Everything from the custom skill was preserved as the structural base:
| Content | Status |
|---|---|
| "What MCP Apps Actually Are" explanation | Kept verbatim |
| "How The Data Flows" numbered diagram | Kept verbatim |
| Quick Reference pattern | Kept verbatim |
| Required Packages table | Kept, enhanced with official notes |
| Project Structure tree | Kept verbatim |
| Complete Server Template (annotated) | Kept verbatim |
| Tool Registration quick reference | Kept verbatim |
| Resource Registration snippet | Kept verbatim |
| Tool Visibility Options | Kept (merged — both had same content) |
| Server-Side Action Tools (view vs action) | Kept verbatim |
| Complete HTML Template | Kept verbatim |
| Complete UI Logic template | Kept verbatim |
| Vanilla JS Full Lifecycle pattern | Kept, enhanced with ontoolinputpartial + safe area |
| React Pattern | Kept verbatim |
| Calling Server Tools snippet | Kept verbatim |
| Updating Model Context snippet | Kept verbatim |
| App Lifecycle Handlers table | Kept, added ontoolinputpartial row |
| Host CSS Variables section | Kept, merged with official's richer version |
| Build Configuration (vite, tsconfig, package.json) | Kept verbatim |
| Module Scope Issue (critical gotcha) | Kept verbatim |
| Drag-and-Drop Pattern (complete) | Kept verbatim |
| Edit Modal Pattern (complete) | Kept verbatim |
| CSS for Drag-and-Drop & Modals | Kept verbatim |
| Key Lessons Learned (6 items) | Kept verbatim |
| Data Handling Gotchas (array validation, escaping) | Kept verbatim |
| MUST DO table | Kept, added 4 rows from official |
| MUST NOT table | Kept, added 3 rows from official |
| Host-Specific Notes (Goose, Claude Desktop) | Kept verbatim |
| JSONRPC pipe testing commands | Kept verbatim |
| Debugging Checklist | Kept, added sendLog step |
| Common Errors table (10+ entries) | Kept, added 2 rows from official |
| Summary: The Golden Path | Kept, expanded with new steps |
git clone reference code command |
Kept verbatim |
Reorganization
| Change | Rationale |
|---|---|
| Moved "Get Reference Code" earlier (after Project Structure) | Better flow — see examples before diving into implementation |
| Merged framework templates + advanced examples into one "Get Reference Code" section | Eliminates duplicate reference code sections |
| Added dedicated sections for Streaming, Visibility, Fullscreen, Safe Areas | These were inline in the official skill; standalone sections are more scannable |
| Split Host CSS Variables into "Applying" and "Using" subsections | Clearer separation of setup vs usage |
| Enhanced MUST DO/MUST NOT tables with official skill's requirements | Single authoritative rules table |
Added sendLog to both client-side section and debugging checklist |
Available in two contexts where you'd need it |
| Expanded Golden Path summary from 6 to 10 steps | Covers all new features (streaming, fullscreen, visibility, styling) |
Deduplication
Only literally identical content was deduplicated:
- Tool visibility options (identical in both) → kept once
git clonecommand (identical) → kept once- CSS variable examples (nearly identical) → merged into richer version with
line-height - Handler registration order warning (same in both) → kept custom's more detailed version