modelcontextprotocol/ext-apps
Watch
1
0
Fork
You've already forked ext-apps
 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Merge pull request #351 from jonathanhefner/no-onhostcontextchanged-getter

Browse source 
Fix `onhostcontextchanged` handler invocation in examples
This commit is contained in:
Jonathan Hefner 2026-01-25 14:16:32 -06:00 • committed by GitHub
commit d61b5ab4cf
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
2 changed files with 16 additions and 12 deletions
Download patch file Download diff file Expand all files Collapse all files

20
examples/sheet-music-server/src/mcp-app.ts
View file

@ -1,7 +1,7 @@
/**
* @file Sheet Music App - renders ABC notation with abcjs and provides audio playback
*/
import { App } from "@modelcontextprotocol/ext-apps";
import { App, type McpUiHostContext } from "@modelcontextprotocol/ext-apps";
import ABCJS from "abcjs";
import "abcjs/abcjs-audio.css";
import "./global.css";
@ -109,18 +109,20 @@ app.ontoolinput = (params) => {
app.onerror = console.error;
app.onhostcontextchanged = (params) => {
if (params.safeAreaInsets) {
mainEl.style.paddingTop = `${params.safeAreaInsets.top}px`;
mainEl.style.paddingRight = `${params.safeAreaInsets.right}px`;
mainEl.style.paddingBottom = `${params.safeAreaInsets.bottom}px`;
mainEl.style.paddingLeft = `${params.safeAreaInsets.left}px`;
function handleHostContextChanged(ctx: McpUiHostContext) {
if (ctx.safeAreaInsets) {
mainEl.style.paddingTop = `${ctx.safeAreaInsets.top}px`;
mainEl.style.paddingRight = `${ctx.safeAreaInsets.right}px`;
mainEl.style.paddingBottom = `${ctx.safeAreaInsets.bottom}px`;
mainEl.style.paddingLeft = `${ctx.safeAreaInsets.left}px`;
}
};
}
app.onhostcontextchanged = handleHostContextChanged;
app.connect().then(() => {
const ctx = app.getHostContext();
if (ctx) {
app.onhostcontextchanged(ctx);
handleHostContextChanged(ctx);
}
});

8
examples/transcript-server/src/mcp-app.ts
View file

@ -68,7 +68,7 @@ app.onteardown = async () => {
app.onerror = log.error;
app.onhostcontextchanged = (ctx: McpUiHostContext) => {
function handleHostContextChanged(ctx: McpUiHostContext) {
if (ctx.safeAreaInsets) {
mainEl.style.paddingTop = `${ctx.safeAreaInsets.top}px`;
mainEl.style.paddingRight = `${ctx.safeAreaInsets.right}px`;
@ -78,7 +78,9 @@ app.onhostcontextchanged = (ctx: McpUiHostContext) => {
if (ctx.theme) {
applyDocumentTheme(ctx.theme);
}
};
}
app.onhostcontextchanged = handleHostContextChanged;
// ============================================================================
// Audio Capture
@ -546,6 +548,6 @@ app.connect().then(() => {
log.info("Connected to host");
const ctx = app.getHostContext();
if (ctx) {
app.onhostcontextchanged?.(ctx);
handleHostContextChanged(ctx);
}
});