diff --git a/docs/patterns.md b/docs/patterns.md index 286b1f6..9e7cc35 100644 --- a/docs/patterns.md +++ b/docs/patterns.md @@ -64,6 +64,12 @@ Use {@link app!App.updateModelContext updateModelContext} to keep the model info {@includeCode ../src/app.examples.ts#App_updateModelContext_appState} +## Sending large follow-up messages + +When you need to send more data than fits in a message, use {@link app!App.updateModelContext updateModelContext} to set the context first, then {@link app!App.sendMessage sendMessage} with a brief prompt to trigger a response: + +{@includeCode ../src/app.examples.ts#App_sendMessage_withLargeContext} + ## Persisting widget state To persist widget state across conversation reloads (e.g., current page in a PDF viewer, camera position in a map), use [`localStorage`](https://developer.mozilla.org/en-US/docs/Web/API/Window/localStorage) with a stable identifier provided by the server. diff --git a/src/app.examples.ts b/src/app.examples.ts index 2c6c62c..5c6a4ce 100644 --- a/src/app.examples.ts +++ b/src/app.examples.ts @@ -81,18 +81,6 @@ async function App_basicUsage() { //#endregion App_basicUsage } -/** - * Example: Sending a message to the host's chat. - */ -async function App_sendMessage(app: App) { - //#region App_sendMessage - await app.sendMessage({ - role: "user", - content: [{ type: "text", text: "Weather updated!" }], - }); - //#endregion App_sendMessage -} - /** * Example: Check host capabilities after connection. */ @@ -329,6 +317,33 @@ async function App_sendMessage_textFromInteraction(app: App) { //#endregion App_sendMessage_textFromInteraction } +/** + * Example: Send follow-up message after offloading large data to model context. + */ +async function App_sendMessage_withLargeContext( + app: App, + fullTranscript: string, + speakerNames: string[], +) { + //#region App_sendMessage_withLargeContext + const markdown = `--- +word-count: ${fullTranscript.split(/\s+/).length} +speaker-names: ${speakerNames.join(", ")} +--- + +${fullTranscript}`; + + // Offload long transcript to model context + await app.updateModelContext({ content: [{ type: "text", text: markdown }] }); + + // Send brief trigger message + await app.sendMessage({ + role: "user", + content: [{ type: "text", text: "Summarize the key points" }], + }); + //#endregion App_sendMessage_withLargeContext +} + /** * Example: Log app state for debugging. */ diff --git a/src/app.ts b/src/app.ts index 9e568be..4fa8776 100644 --- a/src/app.ts +++ b/src/app.ts @@ -156,9 +156,6 @@ type RequestHandlerExtra = Parameters< * * @example Basic usage with PostMessageTransport * {@includeCode ./app.examples.ts#App_basicUsage} - * - * @example Sending a message to the host's chat - * {@includeCode ./app.examples.ts#App_sendMessage} */ export class App extends Protocol { private _hostCapabilities?: McpUiHostCapabilities; @@ -618,6 +615,9 @@ export class App extends Protocol { * @example Send a text message from user interaction * {@includeCode ./app.examples.ts#App_sendMessage_textFromInteraction} * + * @example Send follow-up message after offloading large data to model context + * {@includeCode ./app.examples.ts#App_sendMessage_withLargeContext} + * * @see {@link McpUiMessageRequest} for request structure */ sendMessage(params: McpUiMessageRequest["params"], options?: RequestOptions) {