mcp-server-value-picker 1.0.4 → 1.0.5

package/dist/mcp-app.html

@@ -106,7 +106,7 @@ for compatibility with Zod schema generation. Both are functionally equivalent f
 container holding the app. Specify either width or maxWidth, and either height or maxHeight.`),locale:m.string().optional().describe("User's language and region preference in BCP 47 format."),timeZone:m.string().optional().describe("User's timezone in IANA format."),userAgent:m.string().optional().describe("Host application identifier."),platform:m.union([m.literal("web"),m.literal("desktop"),m.literal("mobile")]).optional().describe("Platform type for responsive design decisions."),deviceCapabilities:m.object({touch:m.boolean().optional().describe("Whether the device supports touch input."),hover:m.boolean().optional().describe("Whether the device supports hover interactions.")}).optional().describe("Device input capabilities."),safeAreaInsets:m.object({top:m.number().describe("Top safe area inset in pixels."),right:m.number().describe("Right safe area inset in pixels."),bottom:m.number().describe("Bottom safe area inset in pixels."),left:m.number().describe("Left safe area inset in pixels.")}).optional().describe("Mobile safe area boundaries in pixels.")}).passthrough(),yI=m.object({method:m.literal("ui/notifications/host-context-changed"),params:Ff.describe("Partial context update containing only changed fields.")});m.object({method:m.literal("ui/update-model-context"),params:m.object({content:m.array(At).optional().describe("Context content blocks (text, image, etc.)."),structuredContent:m.record(m.string(),m.unknown().describe("Structured content for machine-readable context data.")).optional().describe("Structured content for machine-readable context data.")})});m.object({method:m.literal("ui/initialize"),params:m.object({appInfo:Rn.describe("App identification (name and version)."),appCapabilities:gI.describe("Features and capabilities this app provides."),protocolVersion:m.string().describe("Protocol version this app supports.")})});var kI=m.object({protocolVersion:m.string().describe('Negotiated protocol version string (e.g., "2025-11-21").'),hostInfo:Rn.describe("Host application identification and version."),hostCapabilities:hI.describe("Features and capabilities provided by the host."),hostContext:Ff.describe("Rich context about the host environment.")}).passthrough();function wI(e){let t=document.documentElement;t.setAttribute("data-theme",e),t.style.colorScheme=e}function II(e,t=document.documentElement){for(let[i,r]of Object.entries(e))r!==void 0&&t.style.setProperty(i,r)}function SI(e){if(document.getElementById("__mcp-host-fonts"))return;let t=document.createElement("style");t.id="__mcp-host-fonts",t.textContent=e,document.head.appendChild(t)}class zI extends Ib{constructor(i,r={},n={autoResize:!0}){super(n);se(this,"_appInfo");se(this,"_capabilities");se(this,"options");se(this,"_hostCapabilities");se(this,"_hostInfo");se(this,"_hostContext");se(this,"sendOpenLink",this.openLink);this._appInfo=i,this._capabilities=r,this.options=n,this.setRequestHandler(An,o=>(console.log("Received ping:",o.params),{})),this.onhostcontextchanged=()=>{}}getHostCapabilities(){return this._hostCapabilities}getHostVersion(){return this._hostInfo}getHostContext(){return this._hostContext}set ontoolinput(i){this.setNotificationHandler(cI,r=>i(r.params))}set ontoolinputpartial(i){this.setNotificationHandler(dI,r=>i(r.params))}set ontoolresult(i){this.setNotificationHandler(bI,r=>i(r.params))}set ontoolcancelled(i){this.setNotificationHandler(mI,r=>i(r.params))}set onhostcontextchanged(i){this.setNotificationHandler(yI,r=>{this._hostContext={...this._hostContext,...r.params},i(r.params)})}set onteardown(i){this.setRequestHandler(vI,(r,n)=>i(r.params,n))}set oncalltool(i){this.setRequestHandler(Qs,(r,n)=>i(r.params,n))}set onlisttools(i){this.setRequestHandler(Ys,(r,n)=>i(r.params,n))}assertCapabilityForMethod(i){}assertRequestHandlerCapability(i){switch(i){case"tools/call":case"tools/list":if(!this._capabilities.tools)throw Error(`Client does not support tool capability (required for ${i})`);return;case"ping":case"ui/resource-teardown":return;default:throw Error(`No handler for method ${i} registered`)}}assertNotificationCapability(i){}assertTaskCapability(i){throw Error("Tasks are not supported in MCP Apps")}assertTaskHandlerCapability(i){throw Error("Task handlers are not supported in MCP Apps")}async callServerTool(i,r){return await this.request({method:"tools/call",params:i},Cn,r)}sendMessage(i,r){return this.request({method:"ui/message",params:i},lI,r)}sendLog(i){return this.notification({method:"notifications/message",params:i})}updateModelContext(i,r){return this.request({method:"ui/update-model-context",params:i},er,r)}openLink(i,r){return this.request({method:"ui/open-link",params:i},uI,r)}requestDisplayMode(i,r){return this.request({method:"ui/request-display-mode",params:i},_I,r)}sendSizeChanged(i){return this.notification({method:"ui/notifications/size-changed",params:i})}setupSizeChangedNotifications(){let i=!1,r=0,n=0,o=()=>{i||(i=!0,requestAnimationFrame(()=>{i=!1;let s=document.documentElement,u=s.style.width,l=s.style.height;s.style.width="fit-content",s.style.height="fit-content";let c=s.getBoundingClientRect();s.style.width=u,s.style.height=l;let d=window.innerWidth-s.clientWidth,f=Math.ceil(c.width+d),h=Math.ceil(c.height);(f!==r||h!==n)&&(r=f,n=h,this.sendSizeChanged({width:f,height:h}))}))};o();let a=new ResizeObserver(o);return a.observe(document.documentElement),a.observe(document.body),()=>a.disconnect()}async connect(i=new zb(window.parent,window.parent),r){var n;await super.connect(i);try{let o=await this.request({method:"ui/initialize",params:{appCapabilities:this._capabilities,appInfo:this._appInfo,protocolVersion:xb}},kI,r);if(o===void 0)throw Error(`Server sent invalid initialize result: ${o}`);this._hostCapabilities=o.hostCapabilities,this._hostInfo=o.hostInfo,this._hostContext=o.hostContext,await this.notification({method:"ui/notifications/initialized"}),(n=this.options)!=null&&n.autoResize&&this.setupSizeChangedNotifications()}catch(o){throw this.close(),o}}}const gn=document.querySelector(".main"),ts=document.getElementById("values-grid"),Ue=document.getElementById("status");let ns=null;function qf(e){var t,i,r;e.theme&&wI(e.theme),(t=e.styles)!=null&&t.variables&&II(e.styles.variables),(r=(i=e.styles)==null?void 0:i.css)!=null&&r.fonts&&SI(e.styles.css.fonts),e.safeAreaInsets&&(gn.style.paddingTop=`${e.safeAreaInsets.top}px`,gn.style.paddingRight=`${e.safeAreaInsets.right}px`,gn.style.paddingBottom=`${e.safeAreaInsets.bottom}px`,gn.style.paddingLeft=`${e.safeAreaInsets.left}px`)}function xI(e){ts.innerHTML="";for(const t of e){const i=document.createElement("button");i.className="value-card",i.dataset.id=t.id,i.innerHTML=`
       <span class="value-label">${t.label}</span>
       <span class="value-desc">${t.description}</span>
-    `,i.addEventListener("click",()=>OI(t)),ts.appendChild(i)}}async function OI(e){ns=e.id,document.querySelectorAll(".value-card").forEach(t=>{t.classList.toggle("selected",t.dataset.id===e.id)}),console.info(`Selection changed to: ${ns}`),Ue.textContent=`Selected: ${e.label} — sending to AI...`,Ue.className="status sending";try{await Pe.updateModelContext({content:[{type:"text",text:`The user selected "${e.label}" (id: ${e.id}). Description: ${e.description}. Please acknowledge their selection and provide relevant information about this choice.`}]}),(await Pe.sendMessage({role:"user",content:[{type:"text",text:`I've selected "${e.label}".`}]})).isError?(Ue.textContent=`Selected: ${e.label} (context updated, message send was rejected)`,Ue.className="status warning"):(Ue.textContent=`Selected: ${e.label} — AI has been notified!`,Ue.className="status success")}catch(t){console.error("Failed to send selection:",t),Ue.textContent=`Selected: ${e.label} — failed to notify AI`,Ue.className="status error"}}const Pe=new zI({name:"Value Picker",version:"1.0.0"});Pe.onteardown=async()=>(console.info("Value Picker app is being torn down"),{});Pe.ontoolinput=e=>{console.info("Received tool input:",e)};Pe.ontoolresult=e=>{console.info("Received tool result:",e);const t=e.structuredContent;t!=null&&t.values&&xI(t.values)};Pe.ontoolcancelled=e=>{console.info("Tool call cancelled:",e.reason),Ue.textContent="Tool call was cancelled",Ue.className="status warning"};Pe.onerror=e=>{console.error("App error:",e)};Pe.onhostcontextchanged=qf;Pe.connect().then(()=>{const e=Pe.getHostContext();e&&qf(e)});</script>
+    `,i.addEventListener("click",()=>OI(t)),ts.appendChild(i)}}async function OI(e){ns=e.id,document.querySelectorAll(".value-card").forEach(t=>{t.classList.toggle("selected",t.dataset.id===e.id)}),console.info(`Selection changed to: ${ns}`),Ue.textContent=`Selected: ${e.label} — sending to AI...`,Ue.className="status sending";try{await Pe.updateModelContext({content:[{type:"text",text:`The user selected "${e.label}" (id: ${e.id}). Description: ${e.description}. Please acknowledge their selection and provide relevant information about this choice.`}]}),(await Pe.sendMessage({role:"user",content:[{type:"text",text:"I have picked a value, can you tell me what it is?"}]})).isError?(Ue.textContent=`Selected: ${e.label} (context updated, message send was rejected)`,Ue.className="status warning"):(Ue.textContent=`Selected: ${e.label} — AI has been notified!`,Ue.className="status success")}catch(t){console.error("Failed to send selection:",t),Ue.textContent=`Selected: ${e.label} — failed to notify AI`,Ue.className="status error"}}const Pe=new zI({name:"Value Picker",version:"1.0.0"});Pe.onteardown=async()=>(console.info("Value Picker app is being torn down"),{});Pe.ontoolinput=e=>{console.info("Received tool input:",e)};Pe.ontoolresult=e=>{console.info("Received tool result:",e);const t=e.structuredContent;t!=null&&t.values&&xI(t.values)};Pe.ontoolcancelled=e=>{console.info("Tool call cancelled:",e.reason),Ue.textContent="Tool call was cancelled",Ue.className="status warning"};Pe.onerror=e=>{console.error("App error:",e)};Pe.onhostcontextchanged=qf;Pe.connect().then(()=>{const e=Pe.getHostContext();e&&qf(e)});</script>
   <style rel="stylesheet" crossorigin>*{margin:0;padding:0;box-sizing:border-box}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;background:var(--host-background, #ffffff);color:var(--host-foreground, #1a1a1a);min-height:100vh}@media(prefers-color-scheme:dark){body{background:var(--host-background, #1a1a1a);color:var(--host-foreground, #e5e5e5)}}.main{padding:1rem;max-width:600px;margin:0 auto}.title{font-size:1.1rem;font-weight:600;margin-bottom:.25rem}.subtitle{font-size:.85rem;opacity:.7;margin-bottom:1rem}.values-grid{display:grid;grid-template-columns:1fr 1fr;gap:.5rem}.value-card{display:flex;flex-direction:column;align-items:flex-start;gap:.2rem;padding:.75rem;border:1.5px solid rgba(128,128,128,.25);border-radius:8px;background:transparent;color:inherit;cursor:pointer;text-align:left;transition:all .15s ease;font-family:inherit}.value-card:hover{border-color:#3b82f680;background:#3b82f60d}.value-card.selected{border-color:#3b82f6;background:#3b82f61a;box-shadow:0 0 0 1px #3b82f6}.value-label{font-weight:600;font-size:.85rem}.value-desc{font-size:.75rem;opacity:.65}.status{margin-top:1rem;padding:.5rem .75rem;border-radius:6px;font-size:.8rem;min-height:2rem}.status:empty{display:none}.status.sending{background:#3b82f61a;color:#3b82f6}.status.success{background:#22c55e1a;color:#16a34a}.status.warning{background:#eab3081a;color:#ca8a04}.status.error{background:#ef44441a;color:#dc2626}</style>
 </head>
 <body>

package/dist/server.js

@@ -35779,7 +35779,7 @@ function createServer() {
   const resourceUri = "ui://pick-value/mcp-app.html";
   hk(server, "pick_value", {
     title: "Pick a Value",
-    description: "Presents 10 values for the user to choose from. The user selects one via the interactive UI, and their choice is communicated to the model via update-model-context.",
+    description: "DEBUG/TEST TOOL: Tests MCP Apps communication between UI and model. The user picks a value in the UI, and you must confirm whether you received it. This validates that ui/update-model-context is working correctly. Do not treat this as a real decision — just report what value you received.",
     inputSchema: {},
     outputSchema: exports_external.object({
       values: exports_external.array(exports_external.object({
@@ -35794,12 +35794,13 @@ function createServer() {
     return {
       content: [{
         type: "text",
-        text: `Here are 10 values available for selection:
+        text: `[MCP Apps Test] This is a debug tool for testing value communication between the UI and the model.
 
-${VALUES.map((v, i) => `${i + 1}. **${v.label}** — ${v.description}`).join(`
-`)}
+The user will select one of 10 test values via the interactive UI. Their selection will be injected into your context via ui/update-model-context. The user will then ask you to confirm which value you received.
 
-The user will select one via the interactive UI. Their selection will be injected into the model context automatically. Wait for the user to make a selection and send a follow-up message.`
+Your job: Simply report back the value you received. This tests whether the MCP Apps context injection is working. Do not provide detailed analysis of the values — just confirm what was selected.
+
+Test values: ${VALUES.map((v) => v.label).join(", ")}`
       }],
       structuredContent: {
         values: VALUES,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "mcp-server-value-picker",
-  "version": "1.0.4",
+  "version": "1.0.5",
   "type": "module",
   "description": "Debug/test MCP App: Validates that values selected in UI are correctly passed to the AI model via ui/update-model-context",
   "main": "dist/server.js",