@sentientui/mcp 0.5.2 → 0.6.1

package/dist/{chunk-OPMHTLTY.js → chunk-OQ2K3O7A.js}

@@ -215,6 +215,264 @@ function registerProjectTools(server, client) {
 
 // src/tools/components.ts
 import { z as z2 } from "zod";
+
+// src/ui/templates.ts
+var VIZ_TITLES = {
+  "persona-breakdown": "Persona breakdown",
+  "variant-performance": "Variant performance",
+  "goal-funnel": "Goal funnel",
+  "layout-stats": "Layout stats"
+};
+var SHARED_CSS = `
+  :root {
+    --surface: #fcfcfb;
+    --plane: #f9f9f7;
+    --ink: #0b0b0b;
+    --ink-2: #52514e;
+    --muted: #898781;
+    --track: #ecebe6;
+    --border: rgba(11,11,11,0.10);
+    --series-1: #2a78d6;
+    --good: #006300;
+    --critical: #c0392b;
+  }
+  @media (prefers-color-scheme: dark) {
+    :root {
+      --surface: #1a1a19;
+      --plane: #0d0d0d;
+      --ink: #ffffff;
+      --ink-2: #c3c2b7;
+      --muted: #898781;
+      --track: #2c2c2a;
+      --border: rgba(255,255,255,0.10);
+      --series-1: #3987e5;
+      --good: #0ca30c;
+      --critical: #e06a5c;
+    }
+  }
+  * { box-sizing: border-box; }
+  html, body { margin: 0; }
+  body {
+    background: var(--surface);
+    color: var(--ink);
+    font-family: system-ui, -apple-system, "Segoe UI", sans-serif;
+    font-size: 14px;
+    line-height: 1.45;
+    padding: 16px;
+  }
+  h1 { font-size: 15px; font-weight: 650; margin: 0 0 2px; }
+  .sub { color: var(--ink-2); font-size: 12px; margin: 0 0 14px; }
+  .rows { display: flex; flex-direction: column; gap: 10px; }
+  .row { display: grid; grid-template-columns: 1fr; gap: 4px; }
+  .row-head { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; }
+  .label { font-weight: 550; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
+  .val { color: var(--ink); font-variant-numeric: tabular-nums; white-space: nowrap; }
+  .track {
+    position: relative; height: 14px; border-radius: 4px;
+    background: var(--track); overflow: hidden;
+  }
+  .bar {
+    position: absolute; left: 0; top: 0; bottom: 0;
+    background: var(--series-1); border-radius: 4px; min-width: 3px;
+  }
+  .meta { color: var(--ink-2); font-size: 12px; }
+  .chips { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 2px; }
+  .chip {
+    border: 1px solid var(--border); border-radius: 999px;
+    padding: 2px 9px; font-size: 12px; color: var(--ink-2);
+    display: inline-flex; align-items: center; gap: 6px;
+  }
+  .chip .rank { color: var(--muted); font-variant-numeric: tabular-nums; }
+  .delta { font-variant-numeric: tabular-nums; font-weight: 550; white-space: nowrap; }
+  .delta.up { color: var(--good); }
+  .delta.down { color: var(--critical); }
+  .delta.flat { color: var(--muted); }
+  .empty { color: var(--ink-2); padding: 8px 0; }
+  .foot { color: var(--muted); font-size: 11px; margin-top: 14px; }
+`;
+var HELPERS_JS = `
+  function esc(s){ return String(s == null ? '' : s).replace(/[&<>"']/g, function(c){
+    return ({'&':'&amp;','<':'&lt;','>':'&gt;','"':'&quot;',"'":'&#39;'})[c]; }); }
+  function pct1(n){ return (Number(n) || 0).toFixed(1) + '%'; }
+  function clampPct(n){ n = Number(n) || 0; return n < 0 ? 0 : n > 100 ? 100 : n; }
+  function el(id){ return document.getElementById(id); }
+  function barRow(label, valText, widthPct, metaText){
+    return '<div class="row"><div class="row-head"><span class="label">' + esc(label) +
+      '</span><span class="val">' + esc(valText) + '</span></div>' +
+      '<div class="track"><span class="bar" style="width:' + clampPct(widthPct) + '%"></span></div>' +
+      (metaText ? '<div class="meta">' + esc(metaText) + '</div>' : '') + '</div>';
+  }
+  function showEmpty(msg){ el('viz').innerHTML = '<div class="empty">' + esc(msg) + '</div>'; }
+`;
+var BOOTSTRAP_JS = `
+  function __extract(m){
+    if (!m) return null;
+    if (m.structuredContent) return m.structuredContent;
+    if (m.toolOutput) return m.toolOutput;
+    if (m.globals && m.globals.toolOutput) return m.globals.toolOutput;
+    if (m.payload && m.payload.renderData) return __extract(m.payload.renderData);
+    if (m.renderData) return __extract(m.renderData);
+    return m;
+  }
+  function __boot(){
+    try {
+      var g = (window.openai && window.openai.toolOutput) || window.mcpUiRenderData ||
+              (window.__MCP_UI__ && window.__MCP_UI__.toolOutput);
+      if (g) { window.__render(g); return; }
+    } catch (e) {}
+    window.addEventListener('message', function(ev){
+      var data = __extract(ev && ev.data);
+      if (data && typeof data === 'object') { try { window.__render(data); } catch (e) {} }
+    });
+    try {
+      window.parent.postMessage({ type: 'ui-lifecycle-iframe-ready' }, '*');
+      window.parent.postMessage({ type: 'openai:request_globals' }, '*');
+    } catch (e) {}
+  }
+  if (document.readyState === 'loading') document.addEventListener('DOMContentLoaded', __boot);
+  else __boot();
+`;
+var RENDER_JS = {
+  "persona-breakdown": `
+    window.__render = function(data){
+      var clusters = (data && data.clusters) || [];
+      var total = (data && data.totalSessions) || 0;
+      el('sub').textContent = total + ' total sessions across ' + clusters.length + ' persona' + (clusters.length === 1 ? '' : 's');
+      if (!clusters.length) { showEmpty('No persona clusters yet \u2014 more visitor data is needed.'); return; }
+      var sorted = clusters.slice().sort(function(a,b){ return (b.sharePct||0) - (a.sharePct||0); });
+      el('viz').innerHTML = sorted.map(function(c){
+        var rel = Math.round((c.reliability || 0) * 100);
+        return barRow(c.label, pct1(c.sharePct), c.sharePct,
+          c.sessionCount + ' sessions \xB7 reliability ' + rel + '%');
+      }).join('');
+    };
+  `,
+  "variant-performance": `
+    window.__render = function(data){
+      var variants = (data && data.variants) || [];
+      el('sub').textContent = variants.length + ' variant' + (variants.length === 1 ? '' : 's') + ' \xB7 conversion, last 7 days vs prior 7';
+      if (!variants.length) { showEmpty('No variant data available yet.'); return; }
+      var max = variants.reduce(function(m,v){ return Math.max(m, v.currentCvr || 0); }, 0) || 1;
+      var sorted = variants.slice().sort(function(a,b){ return (b.currentCvr||0) - (a.currentCvr||0); });
+      el('viz').innerHTML = sorted.map(function(v){
+        var cur = (v.currentCvr || 0) * 100;
+        var dp = Number(v.deltaPp) || 0;
+        var dir = dp > 0.05 ? 'up' : dp < -0.05 ? 'down' : 'flat';
+        var arrow = dir === 'up' ? '\u25B2' : dir === 'down' ? '\u25BC' : '\u2014';
+        var sign = dp > 0 ? '+' : '';
+        var deltaHtml = '<span class="delta ' + dir + '">' + arrow + ' ' + sign + dp.toFixed(1) + ' pp</span>';
+        var head = '<div class="row-head"><span class="label">' + esc(v.variantId) +
+          '</span><span class="val">' + cur.toFixed(2) + '% ' + deltaHtml + '</span></div>';
+        return '<div class="row">' + head +
+          '<div class="track"><span class="bar" style="width:' + clampPct((v.currentCvr || 0) / max * 100) + '%"></span></div>' +
+          '<div class="meta">prior ' + ((v.priorCvr||0)*100).toFixed(2) + '% \xB7 momentum ' + esc(v.momentum || 'stable') + '</div></div>';
+      }).join('');
+    };
+  `,
+  "goal-funnel": `
+    window.__render = function(data){
+      var goals = (data && data.goals) || [];
+      el('sub').textContent = goals.length + ' goal' + (goals.length === 1 ? '' : 's') + ' \xB7 unique-session conversion';
+      if (!goals.length) { showEmpty('No goals configured for this project.'); return; }
+      el('viz').innerHTML = goals.map(function(g){
+        var cr = (g.conversionRate || 0) * 100;
+        var best = (g.variants || []).slice().sort(function(a,b){ return (b.completionRate||0)-(a.completionRate||0); })[0];
+        var meta = g.hits + ' hits \xB7 ' + g.uniqueSessions + ' unique sessions' +
+          (best ? ' \xB7 best: ' + esc(best.componentId + '/' + best.variantId) + ' ' + ((best.completionRate||0)*100).toFixed(1) + '%' : '');
+        return barRow(g.goalName, pct1(cr), cr, meta);
+      }).join('');
+    };
+  `,
+  "layout-stats": `
+    window.__render = function(data){
+      var layouts = (data && data.layouts) || [];
+      el('sub').textContent = layouts.length + ' persona' + (layouts.length === 1 ? '' : 's') + ' \xB7 section order by reward';
+      if (!layouts.length) { showEmpty('No layout data yet \u2014 more visitor sessions are needed.'); return; }
+      var max = layouts.reduce(function(m,l){ return Math.max(m, l.avgReward || 0); }, 0) || 1;
+      var sorted = layouts.slice().sort(function(a,b){ return (b.avgReward||0)-(a.avgReward||0); });
+      el('viz').innerHTML = sorted.map(function(l){
+        var order = (l.layoutOrder || []).map(function(s, i){
+          return '<span class="chip"><span class="rank">' + (i+1) + '</span>' + esc(s) + '</span>';
+        }).join('');
+        var head = '<div class="row-head"><span class="label">' + esc(l.persona) +
+          '</span><span class="val">reward ' + (Number(l.avgReward)||0).toFixed(2) + '</span></div>';
+        return '<div class="row">' + head +
+          '<div class="track"><span class="bar" style="width:' + clampPct((l.avgReward||0)/max*100) + '%"></span></div>' +
+          '<div class="chips">' + order + '</div>' +
+          '<div class="meta">' + (l.pulls || 0) + ' pulls</div></div>';
+      }).join('');
+    };
+  `
+};
+function buildTemplate(id) {
+  const title = VIZ_TITLES[id];
+  return `<!doctype html>
+<html lang="en">
+<head>
+<meta charset="utf-8">
+<meta name="viewport" content="width=device-width, initial-scale=1">
+<title>${title} \u2014 SentientUI</title>
+<style>${SHARED_CSS}</style>
+</head>
+<body class="viz-root">
+<h1>${title}</h1>
+<p class="sub" id="sub">Waiting for data\u2026</p>
+<div class="rows" id="viz"><div class="empty">Loading\u2026</div></div>
+<p class="foot">SentientUI \xB7 rendered by your agent host</p>
+<script>
+${HELPERS_JS}
+${RENDER_JS[id]}
+${BOOTSTRAP_JS}
+</script>
+</body>
+</html>`;
+}
+
+// src/ui/index.ts
+var RESOURCE_MIME_TYPE = "text/html;profile=mcp-app";
+var UI_TOOL_VIZ = {
+  get_persona_breakdown: "persona-breakdown",
+  get_variant_performance: "variant-performance",
+  get_goal_funnel: "goal-funnel",
+  get_layout_stats: "layout-stats"
+};
+function uiResourceUri(id) {
+  return `ui://sentientui/${id}`;
+}
+function uiMeta(id) {
+  const uri = uiResourceUri(id);
+  return {
+    ui: {
+      resourceUri: uri,
+      preferredFrameSize: ["720px", "480px"]
+    },
+    "openai/outputTemplate": uri
+  };
+}
+function registerUiResources(server) {
+  for (const id of Object.values(UI_TOOL_VIZ)) {
+    server.registerResource(
+      id,
+      uiResourceUri(id),
+      {
+        title: `${VIZ_TITLES[id]} (UI)`,
+        description: `Interactive ${VIZ_TITLES[id]} view for agent hosts that support MCP UI.`,
+        mimeType: RESOURCE_MIME_TYPE
+      },
+      async (uri) => ({
+        contents: [
+          {
+            uri: uri.href,
+            mimeType: RESOURCE_MIME_TYPE,
+            text: buildTemplate(id)
+          }
+        ]
+      })
+    );
+  }
+}
+
+// src/tools/components.ts
 var projectIdSchema2 = z2.string().uuid().describe("The project UUID");
 function registerComponentTools(server, client) {
   server.registerTool(
@@ -268,6 +526,7 @@ function registerComponentTools(server, client) {
       title: "Variant performance",
       description: "Get CVR and momentum for all variants in a project over the last 7 days vs prior 7 days.",
       inputSchema: { projectId: projectIdSchema2 },
+      _meta: uiMeta("variant-performance"),
       outputSchema: {
         variants: z2.array(
           z2.object({
@@ -301,13 +560,14 @@ function registerComponentTools(server, client) {
       if (!data.cvr?.length) {
         return {
           content: [{ type: "text", text: "No variant data available yet." }],
-          structuredContent
+          structuredContent,
+          _meta: uiMeta("variant-performance")
         };
       }
       const text = data.cvr.map(
         (v) => `- ${v.variantId}: CVR ${(v.currentCvr * 100).toFixed(2)}% (prior ${(v.priorCvr * 100).toFixed(2)}%, ${v.deltaPp > 0 ? "+" : ""}${v.deltaPp.toFixed(1)} pp, ${momentumMap.get(v.variantId) ?? "stable"})`
       ).join("\n");
-      return { content: [{ type: "text", text }], structuredContent };
+      return { content: [{ type: "text", text }], structuredContent, _meta: uiMeta("variant-performance") };
     }
   );
 }
@@ -387,6 +647,7 @@ function registerPersonaTools(server, client) {
       title: "Persona breakdown",
       description: "Get the distribution of visitor persona clusters with session counts and reliability scores.",
       inputSchema: { projectId: projectIdSchema4 },
+      _meta: uiMeta("persona-breakdown"),
       outputSchema: {
         totalSessions: z4.number().describe("Total sessions across all clusters"),
         clusters: z4.array(
@@ -419,7 +680,8 @@ function registerPersonaTools(server, client) {
       if (!data.clusters.length) {
         return {
           content: [{ type: "text", text: "No persona clusters yet. More visitor data is needed." }],
-          structuredContent
+          structuredContent,
+          _meta: uiMeta("persona-breakdown")
         };
       }
       const lines = [
@@ -431,7 +693,7 @@ function registerPersonaTools(server, client) {
           return `- ${c.label}: ${c.sessionCount} sessions (${pct.toFixed(1)}% of traffic, reliability ${(c.avgReliability * 100).toFixed(0)}%)`;
         })
       ];
-      return { content: [{ type: "text", text: lines.join("\n") }], structuredContent };
+      return { content: [{ type: "text", text: lines.join("\n") }], structuredContent, _meta: uiMeta("persona-breakdown") };
     }
   );
 }
@@ -446,6 +708,7 @@ function registerGoalTools(server, client) {
       title: "Goal funnel",
       description: "Get goal hit counts, unique-session conversion rates, and per-variant breakdown.",
       inputSchema: { projectId: projectIdSchema5 },
+      _meta: uiMeta("goal-funnel"),
       outputSchema: {
         goals: z5.array(
           z5.object({
@@ -488,7 +751,8 @@ function registerGoalTools(server, client) {
       if (!data.goals.length) {
         return {
           content: [{ type: "text", text: "No goals configured for this project." }],
-          structuredContent
+          structuredContent,
+          _meta: uiMeta("goal-funnel")
         };
       }
       const lines = data.goals.flatMap((g) => [
@@ -496,7 +760,7 @@ function registerGoalTools(server, client) {
         ...g.variants.map((v) => `  ${v.componentId}/${v.variantId}: ${(v.completionRate * 100).toFixed(1)}% per assigned session`),
         ""
       ]);
-      return { content: [{ type: "text", text: lines.join("\n").trim() }], structuredContent };
+      return { content: [{ type: "text", text: lines.join("\n").trim() }], structuredContent, _meta: uiMeta("goal-funnel") };
     }
   );
 }
@@ -560,6 +824,7 @@ function registerLayoutTools(server, client) {
       title: "Layout stats",
       description: "Get per-persona section layout rankings and bandit reward weights.",
       inputSchema: { projectId: projectIdSchema7 },
+      _meta: uiMeta("layout-stats"),
       outputSchema: {
         layouts: z7.array(
           z7.object({
@@ -590,13 +855,14 @@ function registerLayoutTools(server, client) {
       if (!stats.length) {
         return {
           content: [{ type: "text", text: "No layout data yet. More visitor sessions are needed." }],
-          structuredContent
+          structuredContent,
+          _meta: uiMeta("layout-stats")
         };
       }
       const text = stats.map(
         (s) => `- ${s.persona}: [${s.layoutOrder.join(" \u2192 ")}] (avg reward: ${s.avgReward.toFixed(2)}, ${s.pulls} pulls)`
       ).join("\n");
-      return { content: [{ type: "text", text }], structuredContent };
+      return { content: [{ type: "text", text }], structuredContent, _meta: uiMeta("layout-stats") };
     }
   );
 }
@@ -1113,10 +1379,26 @@ function registerIntegrationGuideTools(server) {
 // src/server.ts
 var { version: PKG_VERSION } = createRequire(import.meta.url)("../package.json");
 function createMcpServer(client) {
-  const server = new McpServer({
-    name: "@sentientui/mcp",
-    version: PKG_VERSION
-  });
+  const server = new McpServer(
+    {
+      name: "@sentientui/mcp",
+      version: PKG_VERSION
+    },
+    {
+      // MCP Apps (SEP-1865): advertise the `io.modelcontextprotocol/ui` extension
+      // in the initialize handshake so UI-capable hosts and agent-readiness
+      // scanners negotiate it. Merged with the tools/resources capabilities the
+      // SDK adds as they're registered below.
+      capabilities: {
+        extensions: {
+          "io.modelcontextprotocol/ui": {
+            mimeTypes: [RESOURCE_MIME_TYPE]
+          }
+        }
+      }
+    }
+  );
+  registerUiResources(server);
   registerProjectTools(server, client);
   registerComponentTools(server, client);
   registerInsightTools(server, client);

package/dist/index.cjs

@@ -223,6 +223,264 @@ function registerProjectTools(server, client) {
 
 // src/tools/components.ts
 var import_zod2 = require("zod");
+
+// src/ui/templates.ts
+var VIZ_TITLES = {
+  "persona-breakdown": "Persona breakdown",
+  "variant-performance": "Variant performance",
+  "goal-funnel": "Goal funnel",
+  "layout-stats": "Layout stats"
+};
+var SHARED_CSS = `
+  :root {
+    --surface: #fcfcfb;
+    --plane: #f9f9f7;
+    --ink: #0b0b0b;
+    --ink-2: #52514e;
+    --muted: #898781;
+    --track: #ecebe6;
+    --border: rgba(11,11,11,0.10);
+    --series-1: #2a78d6;
+    --good: #006300;
+    --critical: #c0392b;
+  }
+  @media (prefers-color-scheme: dark) {
+    :root {
+      --surface: #1a1a19;
+      --plane: #0d0d0d;
+      --ink: #ffffff;
+      --ink-2: #c3c2b7;
+      --muted: #898781;
+      --track: #2c2c2a;
+      --border: rgba(255,255,255,0.10);
+      --series-1: #3987e5;
+      --good: #0ca30c;
+      --critical: #e06a5c;
+    }
+  }
+  * { box-sizing: border-box; }
+  html, body { margin: 0; }
+  body {
+    background: var(--surface);
+    color: var(--ink);
+    font-family: system-ui, -apple-system, "Segoe UI", sans-serif;
+    font-size: 14px;
+    line-height: 1.45;
+    padding: 16px;
+  }
+  h1 { font-size: 15px; font-weight: 650; margin: 0 0 2px; }
+  .sub { color: var(--ink-2); font-size: 12px; margin: 0 0 14px; }
+  .rows { display: flex; flex-direction: column; gap: 10px; }
+  .row { display: grid; grid-template-columns: 1fr; gap: 4px; }
+  .row-head { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; }
+  .label { font-weight: 550; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
+  .val { color: var(--ink); font-variant-numeric: tabular-nums; white-space: nowrap; }
+  .track {
+    position: relative; height: 14px; border-radius: 4px;
+    background: var(--track); overflow: hidden;
+  }
+  .bar {
+    position: absolute; left: 0; top: 0; bottom: 0;
+    background: var(--series-1); border-radius: 4px; min-width: 3px;
+  }
+  .meta { color: var(--ink-2); font-size: 12px; }
+  .chips { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 2px; }
+  .chip {
+    border: 1px solid var(--border); border-radius: 999px;
+    padding: 2px 9px; font-size: 12px; color: var(--ink-2);
+    display: inline-flex; align-items: center; gap: 6px;
+  }
+  .chip .rank { color: var(--muted); font-variant-numeric: tabular-nums; }
+  .delta { font-variant-numeric: tabular-nums; font-weight: 550; white-space: nowrap; }
+  .delta.up { color: var(--good); }
+  .delta.down { color: var(--critical); }
+  .delta.flat { color: var(--muted); }
+  .empty { color: var(--ink-2); padding: 8px 0; }
+  .foot { color: var(--muted); font-size: 11px; margin-top: 14px; }
+`;
+var HELPERS_JS = `
+  function esc(s){ return String(s == null ? '' : s).replace(/[&<>"']/g, function(c){
+    return ({'&':'&amp;','<':'&lt;','>':'&gt;','"':'&quot;',"'":'&#39;'})[c]; }); }
+  function pct1(n){ return (Number(n) || 0).toFixed(1) + '%'; }
+  function clampPct(n){ n = Number(n) || 0; return n < 0 ? 0 : n > 100 ? 100 : n; }
+  function el(id){ return document.getElementById(id); }
+  function barRow(label, valText, widthPct, metaText){
+    return '<div class="row"><div class="row-head"><span class="label">' + esc(label) +
+      '</span><span class="val">' + esc(valText) + '</span></div>' +
+      '<div class="track"><span class="bar" style="width:' + clampPct(widthPct) + '%"></span></div>' +
+      (metaText ? '<div class="meta">' + esc(metaText) + '</div>' : '') + '</div>';
+  }
+  function showEmpty(msg){ el('viz').innerHTML = '<div class="empty">' + esc(msg) + '</div>'; }
+`;
+var BOOTSTRAP_JS = `
+  function __extract(m){
+    if (!m) return null;
+    if (m.structuredContent) return m.structuredContent;
+    if (m.toolOutput) return m.toolOutput;
+    if (m.globals && m.globals.toolOutput) return m.globals.toolOutput;
+    if (m.payload && m.payload.renderData) return __extract(m.payload.renderData);
+    if (m.renderData) return __extract(m.renderData);
+    return m;
+  }
+  function __boot(){
+    try {
+      var g = (window.openai && window.openai.toolOutput) || window.mcpUiRenderData ||
+              (window.__MCP_UI__ && window.__MCP_UI__.toolOutput);
+      if (g) { window.__render(g); return; }
+    } catch (e) {}
+    window.addEventListener('message', function(ev){
+      var data = __extract(ev && ev.data);
+      if (data && typeof data === 'object') { try { window.__render(data); } catch (e) {} }
+    });
+    try {
+      window.parent.postMessage({ type: 'ui-lifecycle-iframe-ready' }, '*');
+      window.parent.postMessage({ type: 'openai:request_globals' }, '*');
+    } catch (e) {}
+  }
+  if (document.readyState === 'loading') document.addEventListener('DOMContentLoaded', __boot);
+  else __boot();
+`;
+var RENDER_JS = {
+  "persona-breakdown": `
+    window.__render = function(data){
+      var clusters = (data && data.clusters) || [];
+      var total = (data && data.totalSessions) || 0;
+      el('sub').textContent = total + ' total sessions across ' + clusters.length + ' persona' + (clusters.length === 1 ? '' : 's');
+      if (!clusters.length) { showEmpty('No persona clusters yet \u2014 more visitor data is needed.'); return; }
+      var sorted = clusters.slice().sort(function(a,b){ return (b.sharePct||0) - (a.sharePct||0); });
+      el('viz').innerHTML = sorted.map(function(c){
+        var rel = Math.round((c.reliability || 0) * 100);
+        return barRow(c.label, pct1(c.sharePct), c.sharePct,
+          c.sessionCount + ' sessions \xB7 reliability ' + rel + '%');
+      }).join('');
+    };
+  `,
+  "variant-performance": `
+    window.__render = function(data){
+      var variants = (data && data.variants) || [];
+      el('sub').textContent = variants.length + ' variant' + (variants.length === 1 ? '' : 's') + ' \xB7 conversion, last 7 days vs prior 7';
+      if (!variants.length) { showEmpty('No variant data available yet.'); return; }
+      var max = variants.reduce(function(m,v){ return Math.max(m, v.currentCvr || 0); }, 0) || 1;
+      var sorted = variants.slice().sort(function(a,b){ return (b.currentCvr||0) - (a.currentCvr||0); });
+      el('viz').innerHTML = sorted.map(function(v){
+        var cur = (v.currentCvr || 0) * 100;
+        var dp = Number(v.deltaPp) || 0;
+        var dir = dp > 0.05 ? 'up' : dp < -0.05 ? 'down' : 'flat';
+        var arrow = dir === 'up' ? '\u25B2' : dir === 'down' ? '\u25BC' : '\u2014';
+        var sign = dp > 0 ? '+' : '';
+        var deltaHtml = '<span class="delta ' + dir + '">' + arrow + ' ' + sign + dp.toFixed(1) + ' pp</span>';
+        var head = '<div class="row-head"><span class="label">' + esc(v.variantId) +
+          '</span><span class="val">' + cur.toFixed(2) + '% ' + deltaHtml + '</span></div>';
+        return '<div class="row">' + head +
+          '<div class="track"><span class="bar" style="width:' + clampPct((v.currentCvr || 0) / max * 100) + '%"></span></div>' +
+          '<div class="meta">prior ' + ((v.priorCvr||0)*100).toFixed(2) + '% \xB7 momentum ' + esc(v.momentum || 'stable') + '</div></div>';
+      }).join('');
+    };
+  `,
+  "goal-funnel": `
+    window.__render = function(data){
+      var goals = (data && data.goals) || [];
+      el('sub').textContent = goals.length + ' goal' + (goals.length === 1 ? '' : 's') + ' \xB7 unique-session conversion';
+      if (!goals.length) { showEmpty('No goals configured for this project.'); return; }
+      el('viz').innerHTML = goals.map(function(g){
+        var cr = (g.conversionRate || 0) * 100;
+        var best = (g.variants || []).slice().sort(function(a,b){ return (b.completionRate||0)-(a.completionRate||0); })[0];
+        var meta = g.hits + ' hits \xB7 ' + g.uniqueSessions + ' unique sessions' +
+          (best ? ' \xB7 best: ' + esc(best.componentId + '/' + best.variantId) + ' ' + ((best.completionRate||0)*100).toFixed(1) + '%' : '');
+        return barRow(g.goalName, pct1(cr), cr, meta);
+      }).join('');
+    };
+  `,
+  "layout-stats": `
+    window.__render = function(data){
+      var layouts = (data && data.layouts) || [];
+      el('sub').textContent = layouts.length + ' persona' + (layouts.length === 1 ? '' : 's') + ' \xB7 section order by reward';
+      if (!layouts.length) { showEmpty('No layout data yet \u2014 more visitor sessions are needed.'); return; }
+      var max = layouts.reduce(function(m,l){ return Math.max(m, l.avgReward || 0); }, 0) || 1;
+      var sorted = layouts.slice().sort(function(a,b){ return (b.avgReward||0)-(a.avgReward||0); });
+      el('viz').innerHTML = sorted.map(function(l){
+        var order = (l.layoutOrder || []).map(function(s, i){
+          return '<span class="chip"><span class="rank">' + (i+1) + '</span>' + esc(s) + '</span>';
+        }).join('');
+        var head = '<div class="row-head"><span class="label">' + esc(l.persona) +
+          '</span><span class="val">reward ' + (Number(l.avgReward)||0).toFixed(2) + '</span></div>';
+        return '<div class="row">' + head +
+          '<div class="track"><span class="bar" style="width:' + clampPct((l.avgReward||0)/max*100) + '%"></span></div>' +
+          '<div class="chips">' + order + '</div>' +
+          '<div class="meta">' + (l.pulls || 0) + ' pulls</div></div>';
+      }).join('');
+    };
+  `
+};
+function buildTemplate(id) {
+  const title = VIZ_TITLES[id];
+  return `<!doctype html>
+<html lang="en">
+<head>
+<meta charset="utf-8">
+<meta name="viewport" content="width=device-width, initial-scale=1">
+<title>${title} \u2014 SentientUI</title>
+<style>${SHARED_CSS}</style>
+</head>
+<body class="viz-root">
+<h1>${title}</h1>
+<p class="sub" id="sub">Waiting for data\u2026</p>
+<div class="rows" id="viz"><div class="empty">Loading\u2026</div></div>
+<p class="foot">SentientUI \xB7 rendered by your agent host</p>
+<script>
+${HELPERS_JS}
+${RENDER_JS[id]}
+${BOOTSTRAP_JS}
+</script>
+</body>
+</html>`;
+}
+
+// src/ui/index.ts
+var RESOURCE_MIME_TYPE = "text/html;profile=mcp-app";
+var UI_TOOL_VIZ = {
+  get_persona_breakdown: "persona-breakdown",
+  get_variant_performance: "variant-performance",
+  get_goal_funnel: "goal-funnel",
+  get_layout_stats: "layout-stats"
+};
+function uiResourceUri(id) {
+  return `ui://sentientui/${id}`;
+}
+function uiMeta(id) {
+  const uri = uiResourceUri(id);
+  return {
+    ui: {
+      resourceUri: uri,
+      preferredFrameSize: ["720px", "480px"]
+    },
+    "openai/outputTemplate": uri
+  };
+}
+function registerUiResources(server) {
+  for (const id of Object.values(UI_TOOL_VIZ)) {
+    server.registerResource(
+      id,
+      uiResourceUri(id),
+      {
+        title: `${VIZ_TITLES[id]} (UI)`,
+        description: `Interactive ${VIZ_TITLES[id]} view for agent hosts that support MCP UI.`,
+        mimeType: RESOURCE_MIME_TYPE
+      },
+      async (uri) => ({
+        contents: [
+          {
+            uri: uri.href,
+            mimeType: RESOURCE_MIME_TYPE,
+            text: buildTemplate(id)
+          }
+        ]
+      })
+    );
+  }
+}
+
+// src/tools/components.ts
 var projectIdSchema2 = import_zod2.z.string().uuid().describe("The project UUID");
 function registerComponentTools(server, client) {
   server.registerTool(
@@ -276,6 +534,7 @@ function registerComponentTools(server, client) {
       title: "Variant performance",
       description: "Get CVR and momentum for all variants in a project over the last 7 days vs prior 7 days.",
       inputSchema: { projectId: projectIdSchema2 },
+      _meta: uiMeta("variant-performance"),
       outputSchema: {
         variants: import_zod2.z.array(
           import_zod2.z.object({
@@ -309,13 +568,14 @@ function registerComponentTools(server, client) {
       if (!data.cvr?.length) {
         return {
           content: [{ type: "text", text: "No variant data available yet." }],
-          structuredContent
+          structuredContent,
+          _meta: uiMeta("variant-performance")
         };
       }
       const text = data.cvr.map(
         (v) => `- ${v.variantId}: CVR ${(v.currentCvr * 100).toFixed(2)}% (prior ${(v.priorCvr * 100).toFixed(2)}%, ${v.deltaPp > 0 ? "+" : ""}${v.deltaPp.toFixed(1)} pp, ${momentumMap.get(v.variantId) ?? "stable"})`
       ).join("\n");
-      return { content: [{ type: "text", text }], structuredContent };
+      return { content: [{ type: "text", text }], structuredContent, _meta: uiMeta("variant-performance") };
     }
   );
 }
@@ -395,6 +655,7 @@ function registerPersonaTools(server, client) {
       title: "Persona breakdown",
       description: "Get the distribution of visitor persona clusters with session counts and reliability scores.",
       inputSchema: { projectId: projectIdSchema4 },
+      _meta: uiMeta("persona-breakdown"),
       outputSchema: {
         totalSessions: import_zod4.z.number().describe("Total sessions across all clusters"),
         clusters: import_zod4.z.array(
@@ -427,7 +688,8 @@ function registerPersonaTools(server, client) {
       if (!data.clusters.length) {
         return {
           content: [{ type: "text", text: "No persona clusters yet. More visitor data is needed." }],
-          structuredContent
+          structuredContent,
+          _meta: uiMeta("persona-breakdown")
         };
       }
       const lines = [
@@ -439,7 +701,7 @@ function registerPersonaTools(server, client) {
           return `- ${c.label}: ${c.sessionCount} sessions (${pct.toFixed(1)}% of traffic, reliability ${(c.avgReliability * 100).toFixed(0)}%)`;
         })
       ];
-      return { content: [{ type: "text", text: lines.join("\n") }], structuredContent };
+      return { content: [{ type: "text", text: lines.join("\n") }], structuredContent, _meta: uiMeta("persona-breakdown") };
     }
   );
 }
@@ -454,6 +716,7 @@ function registerGoalTools(server, client) {
       title: "Goal funnel",
       description: "Get goal hit counts, unique-session conversion rates, and per-variant breakdown.",
       inputSchema: { projectId: projectIdSchema5 },
+      _meta: uiMeta("goal-funnel"),
       outputSchema: {
         goals: import_zod5.z.array(
           import_zod5.z.object({
@@ -496,7 +759,8 @@ function registerGoalTools(server, client) {
       if (!data.goals.length) {
         return {
           content: [{ type: "text", text: "No goals configured for this project." }],
-          structuredContent
+          structuredContent,
+          _meta: uiMeta("goal-funnel")
         };
       }
       const lines = data.goals.flatMap((g) => [
@@ -504,7 +768,7 @@ function registerGoalTools(server, client) {
         ...g.variants.map((v) => `  ${v.componentId}/${v.variantId}: ${(v.completionRate * 100).toFixed(1)}% per assigned session`),
         ""
       ]);
-      return { content: [{ type: "text", text: lines.join("\n").trim() }], structuredContent };
+      return { content: [{ type: "text", text: lines.join("\n").trim() }], structuredContent, _meta: uiMeta("goal-funnel") };
     }
   );
 }
@@ -568,6 +832,7 @@ function registerLayoutTools(server, client) {
       title: "Layout stats",
       description: "Get per-persona section layout rankings and bandit reward weights.",
       inputSchema: { projectId: projectIdSchema7 },
+      _meta: uiMeta("layout-stats"),
       outputSchema: {
         layouts: import_zod7.z.array(
           import_zod7.z.object({
@@ -598,13 +863,14 @@ function registerLayoutTools(server, client) {
       if (!stats.length) {
         return {
           content: [{ type: "text", text: "No layout data yet. More visitor sessions are needed." }],
-          structuredContent
+          structuredContent,
+          _meta: uiMeta("layout-stats")
         };
       }
       const text = stats.map(
         (s) => `- ${s.persona}: [${s.layoutOrder.join(" \u2192 ")}] (avg reward: ${s.avgReward.toFixed(2)}, ${s.pulls} pulls)`
       ).join("\n");
-      return { content: [{ type: "text", text }], structuredContent };
+      return { content: [{ type: "text", text }], structuredContent, _meta: uiMeta("layout-stats") };
     }
   );
 }
@@ -1121,10 +1387,26 @@ function registerIntegrationGuideTools(server) {
 // src/server.ts
 var { version: PKG_VERSION } = (0, import_node_module.createRequire)(importMetaUrl)("../package.json");
 function createMcpServer(client) {
-  const server = new import_mcp.McpServer({
-    name: "@sentientui/mcp",
-    version: PKG_VERSION
-  });
+  const server = new import_mcp.McpServer(
+    {
+      name: "@sentientui/mcp",
+      version: PKG_VERSION
+    },
+    {
+      // MCP Apps (SEP-1865): advertise the `io.modelcontextprotocol/ui` extension
+      // in the initialize handshake so UI-capable hosts and agent-readiness
+      // scanners negotiate it. Merged with the tools/resources capabilities the
+      // SDK adds as they're registered below.
+      capabilities: {
+        extensions: {
+          "io.modelcontextprotocol/ui": {
+            mimeTypes: [RESOURCE_MIME_TYPE]
+          }
+        }
+      }
+    }
+  );
+  registerUiResources(server);
   registerProjectTools(server, client);
   registerComponentTools(server, client);
   registerInsightTools(server, client);

package/dist/index.js

@@ -2,7 +2,7 @@
 import {
   ApiClient,
   createMcpServer
-} from "./chunk-OPMHTLTY.js";
+} from "./chunk-OQ2K3O7A.js";
 
 // src/index.ts
 import { StdioServerTransport } from "@modelcontextprotocol/sdk/server/stdio.js";

package/dist/lib.cjs

@@ -248,6 +248,264 @@ function registerProjectTools(server, client) {
 
 // src/tools/components.ts
 var import_zod2 = require("zod");
+
+// src/ui/templates.ts
+var VIZ_TITLES = {
+  "persona-breakdown": "Persona breakdown",
+  "variant-performance": "Variant performance",
+  "goal-funnel": "Goal funnel",
+  "layout-stats": "Layout stats"
+};
+var SHARED_CSS = `
+  :root {
+    --surface: #fcfcfb;
+    --plane: #f9f9f7;
+    --ink: #0b0b0b;
+    --ink-2: #52514e;
+    --muted: #898781;
+    --track: #ecebe6;
+    --border: rgba(11,11,11,0.10);
+    --series-1: #2a78d6;
+    --good: #006300;
+    --critical: #c0392b;
+  }
+  @media (prefers-color-scheme: dark) {
+    :root {
+      --surface: #1a1a19;
+      --plane: #0d0d0d;
+      --ink: #ffffff;
+      --ink-2: #c3c2b7;
+      --muted: #898781;
+      --track: #2c2c2a;
+      --border: rgba(255,255,255,0.10);
+      --series-1: #3987e5;
+      --good: #0ca30c;
+      --critical: #e06a5c;
+    }
+  }
+  * { box-sizing: border-box; }
+  html, body { margin: 0; }
+  body {
+    background: var(--surface);
+    color: var(--ink);
+    font-family: system-ui, -apple-system, "Segoe UI", sans-serif;
+    font-size: 14px;
+    line-height: 1.45;
+    padding: 16px;
+  }
+  h1 { font-size: 15px; font-weight: 650; margin: 0 0 2px; }
+  .sub { color: var(--ink-2); font-size: 12px; margin: 0 0 14px; }
+  .rows { display: flex; flex-direction: column; gap: 10px; }
+  .row { display: grid; grid-template-columns: 1fr; gap: 4px; }
+  .row-head { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; }
+  .label { font-weight: 550; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
+  .val { color: var(--ink); font-variant-numeric: tabular-nums; white-space: nowrap; }
+  .track {
+    position: relative; height: 14px; border-radius: 4px;
+    background: var(--track); overflow: hidden;
+  }
+  .bar {
+    position: absolute; left: 0; top: 0; bottom: 0;
+    background: var(--series-1); border-radius: 4px; min-width: 3px;
+  }
+  .meta { color: var(--ink-2); font-size: 12px; }
+  .chips { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 2px; }
+  .chip {
+    border: 1px solid var(--border); border-radius: 999px;
+    padding: 2px 9px; font-size: 12px; color: var(--ink-2);
+    display: inline-flex; align-items: center; gap: 6px;
+  }
+  .chip .rank { color: var(--muted); font-variant-numeric: tabular-nums; }
+  .delta { font-variant-numeric: tabular-nums; font-weight: 550; white-space: nowrap; }
+  .delta.up { color: var(--good); }
+  .delta.down { color: var(--critical); }
+  .delta.flat { color: var(--muted); }
+  .empty { color: var(--ink-2); padding: 8px 0; }
+  .foot { color: var(--muted); font-size: 11px; margin-top: 14px; }
+`;
+var HELPERS_JS = `
+  function esc(s){ return String(s == null ? '' : s).replace(/[&<>"']/g, function(c){
+    return ({'&':'&amp;','<':'&lt;','>':'&gt;','"':'&quot;',"'":'&#39;'})[c]; }); }
+  function pct1(n){ return (Number(n) || 0).toFixed(1) + '%'; }
+  function clampPct(n){ n = Number(n) || 0; return n < 0 ? 0 : n > 100 ? 100 : n; }
+  function el(id){ return document.getElementById(id); }
+  function barRow(label, valText, widthPct, metaText){
+    return '<div class="row"><div class="row-head"><span class="label">' + esc(label) +
+      '</span><span class="val">' + esc(valText) + '</span></div>' +
+      '<div class="track"><span class="bar" style="width:' + clampPct(widthPct) + '%"></span></div>' +
+      (metaText ? '<div class="meta">' + esc(metaText) + '</div>' : '') + '</div>';
+  }
+  function showEmpty(msg){ el('viz').innerHTML = '<div class="empty">' + esc(msg) + '</div>'; }
+`;
+var BOOTSTRAP_JS = `
+  function __extract(m){
+    if (!m) return null;
+    if (m.structuredContent) return m.structuredContent;
+    if (m.toolOutput) return m.toolOutput;
+    if (m.globals && m.globals.toolOutput) return m.globals.toolOutput;
+    if (m.payload && m.payload.renderData) return __extract(m.payload.renderData);
+    if (m.renderData) return __extract(m.renderData);
+    return m;
+  }
+  function __boot(){
+    try {
+      var g = (window.openai && window.openai.toolOutput) || window.mcpUiRenderData ||
+              (window.__MCP_UI__ && window.__MCP_UI__.toolOutput);
+      if (g) { window.__render(g); return; }
+    } catch (e) {}
+    window.addEventListener('message', function(ev){
+      var data = __extract(ev && ev.data);
+      if (data && typeof data === 'object') { try { window.__render(data); } catch (e) {} }
+    });
+    try {
+      window.parent.postMessage({ type: 'ui-lifecycle-iframe-ready' }, '*');
+      window.parent.postMessage({ type: 'openai:request_globals' }, '*');
+    } catch (e) {}
+  }
+  if (document.readyState === 'loading') document.addEventListener('DOMContentLoaded', __boot);
+  else __boot();
+`;
+var RENDER_JS = {
+  "persona-breakdown": `
+    window.__render = function(data){
+      var clusters = (data && data.clusters) || [];
+      var total = (data && data.totalSessions) || 0;
+      el('sub').textContent = total + ' total sessions across ' + clusters.length + ' persona' + (clusters.length === 1 ? '' : 's');
+      if (!clusters.length) { showEmpty('No persona clusters yet \u2014 more visitor data is needed.'); return; }
+      var sorted = clusters.slice().sort(function(a,b){ return (b.sharePct||0) - (a.sharePct||0); });
+      el('viz').innerHTML = sorted.map(function(c){
+        var rel = Math.round((c.reliability || 0) * 100);
+        return barRow(c.label, pct1(c.sharePct), c.sharePct,
+          c.sessionCount + ' sessions \xB7 reliability ' + rel + '%');
+      }).join('');
+    };
+  `,
+  "variant-performance": `
+    window.__render = function(data){
+      var variants = (data && data.variants) || [];
+      el('sub').textContent = variants.length + ' variant' + (variants.length === 1 ? '' : 's') + ' \xB7 conversion, last 7 days vs prior 7';
+      if (!variants.length) { showEmpty('No variant data available yet.'); return; }
+      var max = variants.reduce(function(m,v){ return Math.max(m, v.currentCvr || 0); }, 0) || 1;
+      var sorted = variants.slice().sort(function(a,b){ return (b.currentCvr||0) - (a.currentCvr||0); });
+      el('viz').innerHTML = sorted.map(function(v){
+        var cur = (v.currentCvr || 0) * 100;
+        var dp = Number(v.deltaPp) || 0;
+        var dir = dp > 0.05 ? 'up' : dp < -0.05 ? 'down' : 'flat';
+        var arrow = dir === 'up' ? '\u25B2' : dir === 'down' ? '\u25BC' : '\u2014';
+        var sign = dp > 0 ? '+' : '';
+        var deltaHtml = '<span class="delta ' + dir + '">' + arrow + ' ' + sign + dp.toFixed(1) + ' pp</span>';
+        var head = '<div class="row-head"><span class="label">' + esc(v.variantId) +
+          '</span><span class="val">' + cur.toFixed(2) + '% ' + deltaHtml + '</span></div>';
+        return '<div class="row">' + head +
+          '<div class="track"><span class="bar" style="width:' + clampPct((v.currentCvr || 0) / max * 100) + '%"></span></div>' +
+          '<div class="meta">prior ' + ((v.priorCvr||0)*100).toFixed(2) + '% \xB7 momentum ' + esc(v.momentum || 'stable') + '</div></div>';
+      }).join('');
+    };
+  `,
+  "goal-funnel": `
+    window.__render = function(data){
+      var goals = (data && data.goals) || [];
+      el('sub').textContent = goals.length + ' goal' + (goals.length === 1 ? '' : 's') + ' \xB7 unique-session conversion';
+      if (!goals.length) { showEmpty('No goals configured for this project.'); return; }
+      el('viz').innerHTML = goals.map(function(g){
+        var cr = (g.conversionRate || 0) * 100;
+        var best = (g.variants || []).slice().sort(function(a,b){ return (b.completionRate||0)-(a.completionRate||0); })[0];
+        var meta = g.hits + ' hits \xB7 ' + g.uniqueSessions + ' unique sessions' +
+          (best ? ' \xB7 best: ' + esc(best.componentId + '/' + best.variantId) + ' ' + ((best.completionRate||0)*100).toFixed(1) + '%' : '');
+        return barRow(g.goalName, pct1(cr), cr, meta);
+      }).join('');
+    };
+  `,
+  "layout-stats": `
+    window.__render = function(data){
+      var layouts = (data && data.layouts) || [];
+      el('sub').textContent = layouts.length + ' persona' + (layouts.length === 1 ? '' : 's') + ' \xB7 section order by reward';
+      if (!layouts.length) { showEmpty('No layout data yet \u2014 more visitor sessions are needed.'); return; }
+      var max = layouts.reduce(function(m,l){ return Math.max(m, l.avgReward || 0); }, 0) || 1;
+      var sorted = layouts.slice().sort(function(a,b){ return (b.avgReward||0)-(a.avgReward||0); });
+      el('viz').innerHTML = sorted.map(function(l){
+        var order = (l.layoutOrder || []).map(function(s, i){
+          return '<span class="chip"><span class="rank">' + (i+1) + '</span>' + esc(s) + '</span>';
+        }).join('');
+        var head = '<div class="row-head"><span class="label">' + esc(l.persona) +
+          '</span><span class="val">reward ' + (Number(l.avgReward)||0).toFixed(2) + '</span></div>';
+        return '<div class="row">' + head +
+          '<div class="track"><span class="bar" style="width:' + clampPct((l.avgReward||0)/max*100) + '%"></span></div>' +
+          '<div class="chips">' + order + '</div>' +
+          '<div class="meta">' + (l.pulls || 0) + ' pulls</div></div>';
+      }).join('');
+    };
+  `
+};
+function buildTemplate(id) {
+  const title = VIZ_TITLES[id];
+  return `<!doctype html>
+<html lang="en">
+<head>
+<meta charset="utf-8">
+<meta name="viewport" content="width=device-width, initial-scale=1">
+<title>${title} \u2014 SentientUI</title>
+<style>${SHARED_CSS}</style>
+</head>
+<body class="viz-root">
+<h1>${title}</h1>
+<p class="sub" id="sub">Waiting for data\u2026</p>
+<div class="rows" id="viz"><div class="empty">Loading\u2026</div></div>
+<p class="foot">SentientUI \xB7 rendered by your agent host</p>
+<script>
+${HELPERS_JS}
+${RENDER_JS[id]}
+${BOOTSTRAP_JS}
+</script>
+</body>
+</html>`;
+}
+
+// src/ui/index.ts
+var RESOURCE_MIME_TYPE = "text/html;profile=mcp-app";
+var UI_TOOL_VIZ = {
+  get_persona_breakdown: "persona-breakdown",
+  get_variant_performance: "variant-performance",
+  get_goal_funnel: "goal-funnel",
+  get_layout_stats: "layout-stats"
+};
+function uiResourceUri(id) {
+  return `ui://sentientui/${id}`;
+}
+function uiMeta(id) {
+  const uri = uiResourceUri(id);
+  return {
+    ui: {
+      resourceUri: uri,
+      preferredFrameSize: ["720px", "480px"]
+    },
+    "openai/outputTemplate": uri
+  };
+}
+function registerUiResources(server) {
+  for (const id of Object.values(UI_TOOL_VIZ)) {
+    server.registerResource(
+      id,
+      uiResourceUri(id),
+      {
+        title: `${VIZ_TITLES[id]} (UI)`,
+        description: `Interactive ${VIZ_TITLES[id]} view for agent hosts that support MCP UI.`,
+        mimeType: RESOURCE_MIME_TYPE
+      },
+      async (uri) => ({
+        contents: [
+          {
+            uri: uri.href,
+            mimeType: RESOURCE_MIME_TYPE,
+            text: buildTemplate(id)
+          }
+        ]
+      })
+    );
+  }
+}
+
+// src/tools/components.ts
 var projectIdSchema2 = import_zod2.z.string().uuid().describe("The project UUID");
 function registerComponentTools(server, client) {
   server.registerTool(
@@ -301,6 +559,7 @@ function registerComponentTools(server, client) {
       title: "Variant performance",
       description: "Get CVR and momentum for all variants in a project over the last 7 days vs prior 7 days.",
       inputSchema: { projectId: projectIdSchema2 },
+      _meta: uiMeta("variant-performance"),
       outputSchema: {
         variants: import_zod2.z.array(
           import_zod2.z.object({
@@ -334,13 +593,14 @@ function registerComponentTools(server, client) {
       if (!data.cvr?.length) {
         return {
           content: [{ type: "text", text: "No variant data available yet." }],
-          structuredContent
+          structuredContent,
+          _meta: uiMeta("variant-performance")
         };
       }
       const text = data.cvr.map(
         (v) => `- ${v.variantId}: CVR ${(v.currentCvr * 100).toFixed(2)}% (prior ${(v.priorCvr * 100).toFixed(2)}%, ${v.deltaPp > 0 ? "+" : ""}${v.deltaPp.toFixed(1)} pp, ${momentumMap.get(v.variantId) ?? "stable"})`
       ).join("\n");
-      return { content: [{ type: "text", text }], structuredContent };
+      return { content: [{ type: "text", text }], structuredContent, _meta: uiMeta("variant-performance") };
     }
   );
 }
@@ -420,6 +680,7 @@ function registerPersonaTools(server, client) {
       title: "Persona breakdown",
       description: "Get the distribution of visitor persona clusters with session counts and reliability scores.",
       inputSchema: { projectId: projectIdSchema4 },
+      _meta: uiMeta("persona-breakdown"),
       outputSchema: {
         totalSessions: import_zod4.z.number().describe("Total sessions across all clusters"),
         clusters: import_zod4.z.array(
@@ -452,7 +713,8 @@ function registerPersonaTools(server, client) {
       if (!data.clusters.length) {
         return {
           content: [{ type: "text", text: "No persona clusters yet. More visitor data is needed." }],
-          structuredContent
+          structuredContent,
+          _meta: uiMeta("persona-breakdown")
         };
       }
       const lines = [
@@ -464,7 +726,7 @@ function registerPersonaTools(server, client) {
           return `- ${c.label}: ${c.sessionCount} sessions (${pct.toFixed(1)}% of traffic, reliability ${(c.avgReliability * 100).toFixed(0)}%)`;
         })
       ];
-      return { content: [{ type: "text", text: lines.join("\n") }], structuredContent };
+      return { content: [{ type: "text", text: lines.join("\n") }], structuredContent, _meta: uiMeta("persona-breakdown") };
     }
   );
 }
@@ -479,6 +741,7 @@ function registerGoalTools(server, client) {
       title: "Goal funnel",
       description: "Get goal hit counts, unique-session conversion rates, and per-variant breakdown.",
       inputSchema: { projectId: projectIdSchema5 },
+      _meta: uiMeta("goal-funnel"),
       outputSchema: {
         goals: import_zod5.z.array(
           import_zod5.z.object({
@@ -521,7 +784,8 @@ function registerGoalTools(server, client) {
       if (!data.goals.length) {
         return {
           content: [{ type: "text", text: "No goals configured for this project." }],
-          structuredContent
+          structuredContent,
+          _meta: uiMeta("goal-funnel")
         };
       }
       const lines = data.goals.flatMap((g) => [
@@ -529,7 +793,7 @@ function registerGoalTools(server, client) {
         ...g.variants.map((v) => `  ${v.componentId}/${v.variantId}: ${(v.completionRate * 100).toFixed(1)}% per assigned session`),
         ""
       ]);
-      return { content: [{ type: "text", text: lines.join("\n").trim() }], structuredContent };
+      return { content: [{ type: "text", text: lines.join("\n").trim() }], structuredContent, _meta: uiMeta("goal-funnel") };
     }
   );
 }
@@ -593,6 +857,7 @@ function registerLayoutTools(server, client) {
       title: "Layout stats",
       description: "Get per-persona section layout rankings and bandit reward weights.",
       inputSchema: { projectId: projectIdSchema7 },
+      _meta: uiMeta("layout-stats"),
       outputSchema: {
         layouts: import_zod7.z.array(
           import_zod7.z.object({
@@ -623,13 +888,14 @@ function registerLayoutTools(server, client) {
       if (!stats.length) {
         return {
           content: [{ type: "text", text: "No layout data yet. More visitor sessions are needed." }],
-          structuredContent
+          structuredContent,
+          _meta: uiMeta("layout-stats")
         };
       }
       const text = stats.map(
         (s) => `- ${s.persona}: [${s.layoutOrder.join(" \u2192 ")}] (avg reward: ${s.avgReward.toFixed(2)}, ${s.pulls} pulls)`
       ).join("\n");
-      return { content: [{ type: "text", text }], structuredContent };
+      return { content: [{ type: "text", text }], structuredContent, _meta: uiMeta("layout-stats") };
     }
   );
 }
@@ -1146,10 +1412,26 @@ function registerIntegrationGuideTools(server) {
 // src/server.ts
 var { version: PKG_VERSION } = (0, import_node_module.createRequire)(importMetaUrl)("../package.json");
 function createMcpServer(client) {
-  const server = new import_mcp.McpServer({
-    name: "@sentientui/mcp",
-    version: PKG_VERSION
-  });
+  const server = new import_mcp.McpServer(
+    {
+      name: "@sentientui/mcp",
+      version: PKG_VERSION
+    },
+    {
+      // MCP Apps (SEP-1865): advertise the `io.modelcontextprotocol/ui` extension
+      // in the initialize handshake so UI-capable hosts and agent-readiness
+      // scanners negotiate it. Merged with the tools/resources capabilities the
+      // SDK adds as they're registered below.
+      capabilities: {
+        extensions: {
+          "io.modelcontextprotocol/ui": {
+            mimeTypes: [RESOURCE_MIME_TYPE]
+          }
+        }
+      }
+    }
+  );
+  registerUiResources(server);
   registerProjectTools(server, client);
   registerComponentTools(server, client);
   registerInsightTools(server, client);

package/dist/lib.js

@@ -3,7 +3,7 @@ import {
   ApiClient,
   ApiError,
   createMcpServer
-} from "./chunk-OPMHTLTY.js";
+} from "./chunk-OQ2K3O7A.js";
 export {
   ApiClient,
   ApiError,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@sentientui/mcp",
-  "version": "0.5.2",
+  "version": "0.6.1",
   "description": "MCP server for SentientUI — exposes project data and actions to AI agents",
   "license": "MIT",
   "homepage": "https://sentient-ui.com",