skills.rest
tmorrowdev
tmorrowdevCOMMUNITY
Explore all skills by this author →
GitHub

cre8-mcp-ui

Wrap cre8-a2ui schemas or HTML into interactive MCP UI resources with postMessage callbacks.

1|Updated Mar 2, 2026
Search Tags:#mcp#fastmcp#cre8-wc#interactive forms#ui resources#postMessage bridge#python server
One-click install
npx skills add https://github.com/tmorrowdev/tmorrow_ai --skill cre8-mcp-ui
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: cre8-mcp-ui
Source: https://github.com/tmorrowdev/tmorrow_ai/tree/main/cre8/skills/cre8-mcp-ui
Command: npx skills add https://github.com/tmorrowdev/tmorrow_ai --skill cre8-mcp-ui

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes scripts (resource) and references (resource) and assets (resource) components.

What problem does it solve?

cre8-mcp-ui removes the boilerplate required to present CRE8 web components as interactive UI inside MCP-based Python agents, including reliable UI-to-host callbacks.

Core Features & Use Cases

  • FastMCP-ready UI resources: Wrap cre8-a2ui schemas or HTML fragments into UIResource objects that MCP hosts can render.
  • Zero-JavaScript interactivity for most cases: Turn declarative events in the schema into data-cre8-action wiring that calls MCP tools through the page-shell bridge.
  • Built-in Python + shell patterns: Provides the page shell (loads @tmorrow/cre8-wc and implements the postMessage bridge), a Python helper (from_schema, from_html), and consistent URI/title/return-type conventions.
  • Theme token support: Inject brand CSS tokens into the shell so the UI matches an Innovexa/CRE8 design system palette.
  • Charts handled correctly: Guides using cre8-chart with from_html and JS property assignment (.data / .options), including manual wiring for data-click callbacks.

Quick Start

Ask the AI to generate a Python FastMCP server tool that returns an interactive ui:// resource built from a cre8-a2ui schema using the cre8-mcp-ui bridge.

Frequently Asked Questions about cre8-mcp-ui

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I serve interactive web components through a Python MCP server?▼

To serve interactive web components through a Python MCP server, wrap cre8-a2ui schemas or HTML fragments into UIResource objects using a page shell and postMessage bridge that wires UI events to MCP tool calls.

Do I need to write JavaScript to handle MCP UI callbacks from web components?▼

You do not need to write JavaScript for most MCP UI callbacks because declarative schema events are automatically converted into data-cre8-action attributes that trigger MCP tool calls through the postMessage bridge.

How do I pass brand theme tokens into an MCP Python tool's UI resource?▼

Pass brand theme tokens into an MCP Python tool's UI resource by injecting brand CSS tokens directly into the provided page shell, ensuring the UI matches your design system palette.

Can I use cre8-chart components within a FastMCP Python server tool?▼

You can use cre8-chart components within a FastMCP Python server tool by generating HTML with from_html and assigning chart data and options via JavaScript properties, including manual data-click callback wiring.

What are the requirements for returning interactive UI from a FastMCP tool?▼

Requirements for returning interactive UI from a FastMCP tool include using mandatory ui:// URIs, returning a list of UIResource objects, and loading cre8-wc from a CDN to enable MCP host callbacks.

What is the best way to connect MCP host callbacks to interactive forms?▼

The best way to connect MCP host callbacks to interactive forms is using a postMessage tool-callback protocol wrapped in a page shell, enabling UI events to trigger MCP tool calls alongside optional prompt, link, notify, and intent actions.

Related Skills

Explore More Software Engineering Skills→
agentscope-aiagentscope-ai
28.7k

A2UI_response_generator

Retrieve A2UI schemas and template examples to generate valid JSON payloads.

Official
Basic
mcfearsomemcfearsome
1

mcp-executor

Execute multi-tool MCP workflows with retry logic and progress updates.

Community
Advanced
tmorrowdevtmorrowdev

cre8-a2ui

Generate vanilla HTML and Web Components markup using cre8-* custom elements.

Community
Intermediate
tmorrowdevtmorrowdev

cre8-a2ui-react

Generate CRE8 React UI code from agent instructions with validation and DevTools testing.

Community
Intermediate