Skip to content

feat: HTML widget support (MCP Apps UI)#626

Draft
corinagum wants to merge 9 commits into
mainfrom
cg/widgets
Draft

feat: HTML widget support (MCP Apps UI)#626
corinagum wants to merge 9 commits into
mainfrom
cg/widgets

Conversation

@corinagum

Copy link
Copy Markdown
Collaborator

Summary

Adds HTML widget support to the Teams TypeScript SDK, enabling bots to send rich interactive MCP Apps UI widgets in Teams messages.

What's included

API types (@microsoft/teams.api)

  • IHtmlWidgetPayload, IHtmlWidgetSecurityPolicy, IHtmlWidgetPermissions
  • IMcpUiCallToolResult, IHtmlWidgetCallToolResponse (wire-format wrapper)
  • IHtmlWidgetCallToolInvokeActivity and invoke response mapping
  • extendedmarkdown added to TextFormat

App helpers (@microsoft/teams.apps)

  • buildHtmlWidgetMarkdown - wraps payload in ```html-widget code fence
  • buildHtmlWidgetMessage - builds a ready-to-send message activity
  • injectWidgetProtocol - optional convenience helper that injects the MCP Apps protocol (ui/initialize handshake, size reporting, notification hooks)
  • validateHtmlWidgetPayload - runtime validation (name, html, domain)
  • widget.callTool invoke route

Example bot (examples/html-widgets/)

  • 10 commands demonstrating the full widget contract
  • Typed widget.callTool handler with multi-tool dispatch

Integration tests

  • Send widget, send with toolInput/toolOutput, update widget, delete widget

Preview markers

  • All public APIs marked @experimental with Diagnostic: ExperimentalTeamsHtmlWidget

Design decisions

  • Protocol injection is opt-in: injectWidgetProtocol is called internally by the builders, but widgets that implement the MCP Apps protocol themselves are returned unchanged (detected by presence of ui/initialize)
  • Notification hooks are explicit: only mapped notification names are injected; unknown names are silently ignored
  • Payload validation throws early: prevents silent client-side "Couldn't load widget" failures
  • Default security policy: restrictive defaults per MCP Apps spec (no external network, self+data resources only)

Related

Status

Draft - pending:

  • Python SDK port
  • .NET core port
  • .NET Libraries port
  • Documentation in teams-sdk/teams.md

corinagum and others added 9 commits June 19, 2026 12:09
Add types for the HTML widget contract:
- IHtmlWidgetPayload, IHtmlWidgetSecurityPolicy, IHtmlWidgetPermissions
- ICallToolRequest, IMcpUiCallToolResult
- IHtmlWidgetCallToolInvokeActivity (htmlwidget/calltool invoke)
- Add 'extendedmarkdown' to TextFormat union
- Add htmlwidget/calltool to InvokeResponseBody map

Co-authored-by: Copilot <223556219+Copilot@users.noreply.github.com>
- Add 'htmlwidget/calltool' -> 'widget.callTool' invoke alias
- Add WidgetCallToolRoutes type for typed handler registration
- Add buildHtmlWidgetMarkdown() and buildHtmlWidgetMessage() helpers
- Add unit tests (14 cases including edge cases)

Co-authored-by: Copilot <223556219+Copilot@users.noreply.github.com>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant