[{"data":1,"prerenderedAt":2562},["ShallowReactive",2],{"navigation_docs":3,"-apps-authoring":282,"-apps-authoring-surround":2557},[4,40,70,99,122,156,189,253],{"title":5,"path":6,"stem":7,"children":8,"page":39},"Getting Started","\u002Fgetting-started","1.getting-started",[9,14,19,24,29,34],{"title":10,"path":11,"stem":12,"icon":13},"Introduction","\u002Fgetting-started\u002Fintroduction","1.getting-started\u002F1.introduction","i-lucide-book-open",{"title":15,"path":16,"stem":17,"icon":18},"Installation","\u002Fgetting-started\u002Finstallation","1.getting-started\u002F2.installation","i-lucide-download",{"title":20,"path":21,"stem":22,"icon":23},"Configuration","\u002Fgetting-started\u002Fconfiguration","1.getting-started\u002F3.configuration","i-lucide-settings",{"title":25,"path":26,"stem":27,"icon":28},"Inspector","\u002Fgetting-started\u002Finspector","1.getting-started\u002F4.inspector","i-lucide-circuit-board",{"title":30,"path":31,"stem":32,"icon":33},"Connection","\u002Fgetting-started\u002Fconnection","1.getting-started\u002F5.connection","i-lucide-plug",{"title":35,"path":36,"stem":37,"icon":38},"Agent Skills","\u002Fgetting-started\u002Fagent-skills","1.getting-started\u002F6.agent-skills","i-lucide-sparkles",false,{"title":41,"path":42,"stem":43,"children":44,"page":39},"Tools","\u002Ftools","2.tools",[45,50,55,60,65],{"title":46,"path":47,"stem":48,"icon":49},"Overview","\u002Ftools\u002Foverview","2.tools\u002F0.overview","i-lucide-wrench",{"title":51,"path":52,"stem":53,"icon":54},"Schema, handler & returns","\u002Ftools\u002Fschema-handler","2.tools\u002F1.schema-handler","i-lucide-braces",{"title":56,"path":57,"stem":58,"icon":59},"Annotations & input examples","\u002Ftools\u002Fannotations","2.tools\u002F2.annotations","i-lucide-badge-info",{"title":61,"path":62,"stem":63,"icon":64},"Errors & caching","\u002Ftools\u002Ferrors-caching","2.tools\u002F3.errors-caching","i-lucide-shield",{"title":66,"path":67,"stem":68,"icon":69},"Groups, files & dynamic registration","\u002Ftools\u002Fgroups-organization","2.tools\u002F4.groups-organization","i-lucide-tags",{"title":71,"path":72,"stem":73,"children":74,"page":39},"Resources","\u002Fresources","3.resources",[75,79,84,89,94],{"title":46,"path":76,"stem":77,"icon":78},"\u002Fresources\u002Foverview","3.resources\u002F0.overview","i-lucide-package",{"title":80,"path":81,"stem":82,"icon":83},"Static resources & structure","\u002Fresources\u002Fstatic-and-structure","3.resources\u002F1.static-and-structure","i-lucide-file-stack",{"title":85,"path":86,"stem":87,"icon":88},"Templates & handlers","\u002Fresources\u002Ftemplates-and-handlers","3.resources\u002F2.templates-and-handlers","i-lucide-git-branch",{"title":90,"path":91,"stem":92,"icon":93},"Metadata, content & errors","\u002Fresources\u002Fcontent-metadata-errors","3.resources\u002F3.content-metadata-errors","i-lucide-layers",{"title":95,"path":96,"stem":97,"icon":98},"Groups & organization","\u002Fresources\u002Forganization","3.resources\u002F4.organization","i-lucide-folder-tree",{"title":100,"path":101,"stem":102,"children":103,"page":39},"Prompts","\u002Fprompts","4.prompts",[104,108,113,117],{"title":46,"path":105,"stem":106,"icon":107},"\u002Fprompts\u002Foverview","4.prompts\u002F0.overview","i-lucide-message-square",{"title":109,"path":110,"stem":111,"icon":112},"Authoring & structure","\u002Fprompts\u002Fauthoring","4.prompts\u002F1.authoring","i-lucide-pen-line",{"title":114,"path":115,"stem":116,"icon":93},"Input, handler & messages","\u002Fprompts\u002Finput-handler-messages","4.prompts\u002F2.input-handler-messages",{"title":118,"path":119,"stem":120,"icon":121},"Patterns & advanced","\u002Fprompts\u002Fpatterns-advanced","4.prompts\u002F3.patterns-advanced","i-lucide-line-chart",{"title":123,"path":124,"stem":125,"children":126,"page":39},"Handlers","\u002Fhandlers","5.handlers",[127,131,136,141,146,151],{"title":46,"path":128,"stem":129,"icon":130},"\u002Fhandlers\u002Foverview","5.handlers\u002F0.overview","i-lucide-server",{"title":132,"path":133,"stem":134,"icon":135},"Default & custom handlers","\u002Fhandlers\u002Fdefault-and-custom","5.handlers\u002F1.default-and-custom","i-lucide-toggle-left",{"title":137,"path":138,"stem":139,"icon":140},"Structure & options","\u002Fhandlers\u002Fstructure-and-options","5.handlers\u002F2.structure-and-options","i-lucide-sliders-horizontal",{"title":142,"path":143,"stem":144,"icon":145},"Examples & routing","\u002Fhandlers\u002Fexamples-routing","5.handlers\u002F3.examples-routing","i-lucide-route",{"title":147,"path":148,"stem":149,"icon":150},"Sharing & practices","\u002Fhandlers\u002Fsharing-practices","5.handlers\u002F4.sharing-practices","i-lucide-share-2",{"title":152,"path":153,"stem":154,"icon":155},"Multi-handler organization","\u002Fhandlers\u002Forganization","5.handlers\u002F5.organization","i-lucide-network",{"title":157,"path":158,"stem":159,"children":160,"page":39},"Apps","\u002Fapps","6.apps",[161,165,170,175,179,184],{"title":46,"path":162,"stem":163,"icon":164},"\u002Fapps\u002Foverview","6.apps\u002F0.overview","i-lucide-app-window",{"title":166,"path":167,"stem":168,"icon":169},"Authoring & defineMcpApp","\u002Fapps\u002Fauthoring","6.apps\u002F1.authoring","i-lucide-code-2",{"title":171,"path":172,"stem":173,"icon":174},"useMcpApp() bridge","\u002Fapps\u002Fuse-mcp-app","6.apps\u002F2.use-mcp-app","i-lucide-message-circle",{"title":176,"path":177,"stem":178,"icon":64},"CSP & build pipeline","\u002Fapps\u002Fcsp-and-wiring","6.apps\u002F3.csp-and-wiring",{"title":180,"path":181,"stem":182,"icon":183},"Testing & publishing","\u002Fapps\u002Ftesting-publishing","6.apps\u002F4.testing-publishing","i-lucide-rocket",{"title":185,"path":186,"stem":187,"icon":188},"Patterns & limits","\u002Fapps\u002Fpatterns-reference","6.apps\u002F5.patterns-reference","i-lucide-book-marked",{"title":190,"path":191,"stem":192,"children":193,"page":39},"Advanced Topics","\u002Fadvanced","7.advanced",[194,199,204,209,214,218,223,228,233,238,243,248],{"title":195,"path":196,"stem":197,"icon":198},"Custom Paths","\u002Fadvanced\u002Fcustom-paths","7.advanced\u002F1.custom-paths","i-lucide-folder",{"title":200,"path":201,"stem":202,"icon":203},"Logging","\u002Fadvanced\u002Flogging","7.advanced\u002F10.logging","i-lucide-scroll-text",{"title":205,"path":206,"stem":207,"icon":208},"MCP Apps Internals","\u002Fadvanced\u002Fmcp-apps-internals","7.advanced\u002F11.mcp-apps-internals","i-lucide-cog",{"title":210,"path":211,"stem":212,"icon":213},"Listing Definitions","\u002Fadvanced\u002Flisting-definitions","7.advanced\u002F12.listing-definitions","i-lucide-list",{"title":215,"path":216,"stem":217,"icon":64},"Middleware","\u002Fadvanced\u002Fmiddleware","7.advanced\u002F2.middleware",{"title":219,"path":220,"stem":221,"icon":222},"TypeScript","\u002Fadvanced\u002Ftypescript","7.advanced\u002F3.typescript","i-lucide-type",{"title":224,"path":225,"stem":226,"icon":227},"Hooks","\u002Fadvanced\u002Fhooks","7.advanced\u002F4.hooks","i-lucide-webhook",{"title":229,"path":230,"stem":231,"icon":232},"MCP Evals","\u002Fadvanced\u002Fevals","7.advanced\u002F5.evals","i-lucide-flask-conical",{"title":234,"path":235,"stem":236,"icon":237},"Sessions","\u002Fadvanced\u002Fsessions","7.advanced\u002F6.sessions","i-lucide-database",{"title":239,"path":240,"stem":241,"icon":242},"Dynamic Definitions","\u002Fadvanced\u002Fdynamic-definitions","7.advanced\u002F7.dynamic-definitions","i-lucide-toggle-right",{"title":244,"path":245,"stem":246,"icon":247},"Code Mode","\u002Fadvanced\u002Fcode-mode","7.advanced\u002F8.code-mode","i-lucide-code",{"title":249,"path":250,"stem":251,"icon":252},"Elicitation","\u002Fadvanced\u002Felicitation","7.advanced\u002F9.elicitation","i-lucide-message-square-quote",{"title":254,"path":255,"stem":256,"children":257,"page":39},"Examples","\u002Fexamples","8.examples",[258,263,268,273,278],{"title":259,"path":260,"stem":261,"icon":262},"Authentication","\u002Fexamples\u002Fauthentication","8.examples\u002F1.authentication","i-lucide-shield-check",{"title":264,"path":265,"stem":266,"icon":267},"API Integration","\u002Fexamples\u002Fapi-integration","8.examples\u002F2.api-integration","i-lucide-globe",{"title":269,"path":270,"stem":271,"icon":272},"Common Patterns","\u002Fexamples\u002Fcommon-patterns","8.examples\u002F3.common-patterns","i-lucide-lightbulb",{"title":274,"path":275,"stem":276,"icon":277},"File Operations","\u002Fexamples\u002Ffile-operations","8.examples\u002F4.file-operations","i-lucide-file",{"title":279,"path":280,"stem":281,"icon":107},"Prompt Examples","\u002Fexamples\u002Fprompt-examples","8.examples\u002F5.prompt-examples",{"id":283,"title":166,"body":284,"description":2548,"extension":2549,"links":2550,"meta":2551,"navigation":2552,"path":167,"seo":2553,"stem":168,"__hash__":2556},"docs\u002F6.apps\u002F1.authoring.md",{"type":285,"value":286,"toc":2537},"minimark",[287,292,296,1203,1206,1264,1268,1292,1343,1361,1366,1376,1449,1460,1464,1475,1484,1546,1552,1600,1610,1717,1740,1745,1756,1930,1955,1959,1974,2133,2149,2159,2163,2177,2240,2352,2531,2534],[288,289,291],"h2",{"id":290},"quick-start","Quick Start",[293,294,295],"p",{},"A complete app — schema, server handler, UI — in one file:",[297,298,304],"pre",{"className":299,"code":300,"filename":301,"language":302,"meta":303,"style":303},"language-vue shiki shiki-themes material-theme-lighter material-theme material-theme-palenight","\u003Cscript setup lang=\"ts\">\nimport { z } from 'zod'\n\ninterface PalettePayload {\n  base: string\n  swatches: { name: string, hex: string }[]\n}\n\ndefineMcpApp({\n  description: 'Pick a colour and preview a 5-tone palette.',\n  inputSchema: {\n    base: z.string().describe('Hex colour to anchor the palette, e.g. #2563eb'),\n  },\n  handler: async ({ base }): Promise\u003C{ structuredContent: PalettePayload }> => {\n    const swatches = await $fetch\u003C{ name: string, hex: string }[]>('\u002Fapi\u002Fpalette', {\n      query: { base },\n    })\n    return { structuredContent: { base, swatches } }\n  },\n})\n\nconst { data, loading, sendPrompt } = useMcpApp\u003CPalettePayload>()\n\u003C\u002Fscript>\n\n\u003Ctemplate>\n  \u003Cmain class=\"picker\">\n    \u003Cp v-if=\"loading\">\n      Mixing colours…\n    \u003C\u002Fp>\n    \u003Cul v-else-if=\"data\" class=\"swatches\">\n      \u003Cli v-for=\"s in data.swatches\" :key=\"s.hex\">\n        \u003Cbutton\n          type=\"button\"\n          :style=\"{ background: s.hex }\"\n          @click=\"sendPrompt(`Use ${s.name} (${s.hex}) as the primary colour.`)\"\n        >\n          {{ s.name }}\n        \u003C\u002Fbutton>\n      \u003C\u002Fli>\n    \u003C\u002Ful>\n  \u003C\u002Fmain>\n\u003C\u002Ftemplate>\n\n\u003Cstyle scoped>\n.picker { padding: 16px; font-family: system-ui, sans-serif; }\n.swatches { display: grid; grid-template-columns: repeat(5, 1fr); gap: 8px; padding: 0; list-style: none; }\n.swatches button { width: 100%; aspect-ratio: 1; border-radius: 8px; border: 0; cursor: pointer; }\n\u003C\u002Fstyle>\n","app\u002Fmcp\u002Fcolor-picker.vue","vue","",[305,306,307,342,371,378,391,403,436,442,447,460,479,489,527,533,575,630,645,654,679,684,692,697,735,745,750,760,783,805,811,821,854,889,898,914,929,944,950,956,966,976,985,995,1004,1009,1022,1061,1132,1194],"code",{"__ignoreMap":303},[308,309,312,316,320,324,327,330,333,337,339],"span",{"class":310,"line":311},"line",1,[308,313,315],{"class":314},"sMK4o","\u003C",[308,317,319],{"class":318},"swJcz","script",[308,321,323],{"class":322},"spNyl"," setup",[308,325,326],{"class":322}," lang",[308,328,329],{"class":314},"=",[308,331,332],{"class":314},"\"",[308,334,336],{"class":335},"sfazB","ts",[308,338,332],{"class":314},[308,340,341],{"class":314},">\n",[308,343,345,349,352,356,359,362,365,368],{"class":310,"line":344},2,[308,346,348],{"class":347},"s7zQu","import",[308,350,351],{"class":314}," {",[308,353,355],{"class":354},"sTEyZ"," z",[308,357,358],{"class":314}," }",[308,360,361],{"class":347}," from",[308,363,364],{"class":314}," '",[308,366,367],{"class":335},"zod",[308,369,370],{"class":314},"'\n",[308,372,374],{"class":310,"line":373},3,[308,375,377],{"emptyLinePlaceholder":376},true,"\n",[308,379,381,384,388],{"class":310,"line":380},4,[308,382,383],{"class":322},"interface",[308,385,387],{"class":386},"sBMFI"," PalettePayload",[308,389,390],{"class":314}," {\n",[308,392,394,397,400],{"class":310,"line":393},5,[308,395,396],{"class":318},"  base",[308,398,399],{"class":314},":",[308,401,402],{"class":386}," string\n",[308,404,406,409,411,413,416,418,421,424,427,429,431,433],{"class":310,"line":405},6,[308,407,408],{"class":318},"  swatches",[308,410,399],{"class":314},[308,412,351],{"class":314},[308,414,415],{"class":318}," name",[308,417,399],{"class":314},[308,419,420],{"class":386}," string",[308,422,423],{"class":314},",",[308,425,426],{"class":318}," hex",[308,428,399],{"class":314},[308,430,420],{"class":386},[308,432,358],{"class":314},[308,434,435],{"class":354},"[]\n",[308,437,439],{"class":310,"line":438},7,[308,440,441],{"class":314},"}\n",[308,443,445],{"class":310,"line":444},8,[308,446,377],{"emptyLinePlaceholder":376},[308,448,450,454,457],{"class":310,"line":449},9,[308,451,453],{"class":452},"s2Zo4","defineMcpApp",[308,455,456],{"class":354},"(",[308,458,459],{"class":314},"{\n",[308,461,463,466,468,470,473,476],{"class":310,"line":462},10,[308,464,465],{"class":318},"  description",[308,467,399],{"class":314},[308,469,364],{"class":314},[308,471,472],{"class":335},"Pick a colour and preview a 5-tone palette.",[308,474,475],{"class":314},"'",[308,477,478],{"class":314},",\n",[308,480,482,485,487],{"class":310,"line":481},11,[308,483,484],{"class":318},"  inputSchema",[308,486,399],{"class":314},[308,488,390],{"class":314},[308,490,492,495,497,499,502,505,508,510,513,515,517,520,522,525],{"class":310,"line":491},12,[308,493,494],{"class":318},"    base",[308,496,399],{"class":314},[308,498,355],{"class":354},[308,500,501],{"class":314},".",[308,503,504],{"class":452},"string",[308,506,507],{"class":354},"()",[308,509,501],{"class":314},[308,511,512],{"class":452},"describe",[308,514,456],{"class":354},[308,516,475],{"class":314},[308,518,519],{"class":335},"Hex colour to anchor the palette, e.g. #2563eb",[308,521,475],{"class":314},[308,523,524],{"class":354},")",[308,526,478],{"class":314},[308,528,530],{"class":310,"line":529},13,[308,531,532],{"class":314},"  },\n",[308,534,536,539,541,544,547,551,554,557,560,563,565,567,570,573],{"class":310,"line":535},14,[308,537,538],{"class":452},"  handler",[308,540,399],{"class":314},[308,542,543],{"class":322}," async",[308,545,546],{"class":314}," ({",[308,548,550],{"class":549},"sHdIc"," base",[308,552,553],{"class":314}," }):",[308,555,556],{"class":386}," Promise",[308,558,559],{"class":314},"\u003C{",[308,561,562],{"class":318}," structuredContent",[308,564,399],{"class":314},[308,566,387],{"class":386},[308,568,569],{"class":314}," }>",[308,571,572],{"class":322}," =>",[308,574,390],{"class":314},[308,576,578,581,584,587,590,593,595,597,599,601,603,605,607,609,611,614,617,619,621,624,626,628],{"class":310,"line":577},15,[308,579,580],{"class":322},"    const",[308,582,583],{"class":354}," swatches",[308,585,586],{"class":314}," =",[308,588,589],{"class":347}," await",[308,591,592],{"class":452}," $fetch",[308,594,559],{"class":314},[308,596,415],{"class":318},[308,598,399],{"class":314},[308,600,420],{"class":386},[308,602,423],{"class":314},[308,604,426],{"class":318},[308,606,399],{"class":314},[308,608,420],{"class":386},[308,610,358],{"class":314},[308,612,613],{"class":318},"[]",[308,615,616],{"class":314},">",[308,618,456],{"class":318},[308,620,475],{"class":314},[308,622,623],{"class":335},"\u002Fapi\u002Fpalette",[308,625,475],{"class":314},[308,627,423],{"class":314},[308,629,390],{"class":314},[308,631,633,636,638,640,642],{"class":310,"line":632},16,[308,634,635],{"class":318},"      query",[308,637,399],{"class":314},[308,639,351],{"class":314},[308,641,550],{"class":354},[308,643,644],{"class":314}," },\n",[308,646,648,651],{"class":310,"line":647},17,[308,649,650],{"class":314},"    }",[308,652,653],{"class":318},")\n",[308,655,657,660,662,664,666,668,670,672,674,676],{"class":310,"line":656},18,[308,658,659],{"class":347},"    return",[308,661,351],{"class":314},[308,663,562],{"class":318},[308,665,399],{"class":314},[308,667,351],{"class":314},[308,669,550],{"class":354},[308,671,423],{"class":314},[308,673,583],{"class":354},[308,675,358],{"class":314},[308,677,678],{"class":314}," }\n",[308,680,682],{"class":310,"line":681},19,[308,683,532],{"class":314},[308,685,687,690],{"class":310,"line":686},20,[308,688,689],{"class":314},"}",[308,691,653],{"class":354},[308,693,695],{"class":310,"line":694},21,[308,696,377],{"emptyLinePlaceholder":376},[308,698,700,703,705,708,710,713,715,718,720,722,725,727,730,732],{"class":310,"line":699},22,[308,701,702],{"class":322},"const",[308,704,351],{"class":314},[308,706,707],{"class":354}," data",[308,709,423],{"class":314},[308,711,712],{"class":354}," loading",[308,714,423],{"class":314},[308,716,717],{"class":354}," sendPrompt ",[308,719,689],{"class":314},[308,721,586],{"class":314},[308,723,724],{"class":452}," useMcpApp",[308,726,315],{"class":314},[308,728,729],{"class":386},"PalettePayload",[308,731,616],{"class":314},[308,733,734],{"class":354},"()\n",[308,736,738,741,743],{"class":310,"line":737},23,[308,739,740],{"class":314},"\u003C\u002F",[308,742,319],{"class":318},[308,744,341],{"class":314},[308,746,748],{"class":310,"line":747},24,[308,749,377],{"emptyLinePlaceholder":376},[308,751,753,755,758],{"class":310,"line":752},25,[308,754,315],{"class":314},[308,756,757],{"class":318},"template",[308,759,341],{"class":314},[308,761,763,766,769,772,774,776,779,781],{"class":310,"line":762},26,[308,764,765],{"class":314},"  \u003C",[308,767,768],{"class":318},"main",[308,770,771],{"class":322}," class",[308,773,329],{"class":314},[308,775,332],{"class":314},[308,777,778],{"class":335},"picker",[308,780,332],{"class":314},[308,782,341],{"class":314},[308,784,786,789,791,794,796,798,801,803],{"class":310,"line":785},27,[308,787,788],{"class":314},"    \u003C",[308,790,293],{"class":318},[308,792,793],{"class":322}," v-if",[308,795,329],{"class":314},[308,797,332],{"class":314},[308,799,800],{"class":335},"loading",[308,802,332],{"class":314},[308,804,341],{"class":314},[308,806,808],{"class":310,"line":807},28,[308,809,810],{"class":354},"      Mixing colours…\n",[308,812,814,817,819],{"class":310,"line":813},29,[308,815,816],{"class":314},"    \u003C\u002F",[308,818,293],{"class":318},[308,820,341],{"class":314},[308,822,824,826,829,832,834,836,839,841,843,845,847,850,852],{"class":310,"line":823},30,[308,825,788],{"class":314},[308,827,828],{"class":318},"ul",[308,830,831],{"class":322}," v-else-if",[308,833,329],{"class":314},[308,835,332],{"class":314},[308,837,838],{"class":335},"data",[308,840,332],{"class":314},[308,842,771],{"class":322},[308,844,329],{"class":314},[308,846,332],{"class":314},[308,848,849],{"class":335},"swatches",[308,851,332],{"class":314},[308,853,341],{"class":314},[308,855,857,860,863,866,868,870,873,875,878,880,882,885,887],{"class":310,"line":856},31,[308,858,859],{"class":314},"      \u003C",[308,861,862],{"class":318},"li",[308,864,865],{"class":322}," v-for",[308,867,329],{"class":314},[308,869,332],{"class":314},[308,871,872],{"class":335},"s in data.swatches",[308,874,332],{"class":314},[308,876,877],{"class":322}," :key",[308,879,329],{"class":314},[308,881,332],{"class":314},[308,883,884],{"class":335},"s.hex",[308,886,332],{"class":314},[308,888,341],{"class":314},[308,890,892,895],{"class":310,"line":891},32,[308,893,894],{"class":314},"        \u003C",[308,896,897],{"class":318},"button\n",[308,899,901,904,906,908,911],{"class":310,"line":900},33,[308,902,903],{"class":322},"          type",[308,905,329],{"class":314},[308,907,332],{"class":314},[308,909,910],{"class":335},"button",[308,912,913],{"class":314},"\"\n",[308,915,917,920,922,924,927],{"class":310,"line":916},34,[308,918,919],{"class":322},"          :style",[308,921,329],{"class":314},[308,923,332],{"class":314},[308,925,926],{"class":335},"{ background: s.hex }",[308,928,913],{"class":314},[308,930,932,935,937,939,942],{"class":310,"line":931},35,[308,933,934],{"class":322},"          @click",[308,936,329],{"class":314},[308,938,332],{"class":314},[308,940,941],{"class":335},"sendPrompt(`Use ${s.name} (${s.hex}) as the primary colour.`)",[308,943,913],{"class":314},[308,945,947],{"class":310,"line":946},36,[308,948,949],{"class":314},"        >\n",[308,951,953],{"class":310,"line":952},37,[308,954,955],{"class":354},"          {{ s.name }}\n",[308,957,959,962,964],{"class":310,"line":958},38,[308,960,961],{"class":314},"        \u003C\u002F",[308,963,910],{"class":318},[308,965,341],{"class":314},[308,967,969,972,974],{"class":310,"line":968},39,[308,970,971],{"class":314},"      \u003C\u002F",[308,973,862],{"class":318},[308,975,341],{"class":314},[308,977,979,981,983],{"class":310,"line":978},40,[308,980,816],{"class":314},[308,982,828],{"class":318},[308,984,341],{"class":314},[308,986,988,991,993],{"class":310,"line":987},41,[308,989,990],{"class":314},"  \u003C\u002F",[308,992,768],{"class":318},[308,994,341],{"class":314},[308,996,998,1000,1002],{"class":310,"line":997},42,[308,999,740],{"class":314},[308,1001,757],{"class":318},[308,1003,341],{"class":314},[308,1005,1007],{"class":310,"line":1006},43,[308,1008,377],{"emptyLinePlaceholder":376},[308,1010,1012,1014,1017,1020],{"class":310,"line":1011},44,[308,1013,315],{"class":314},[308,1015,1016],{"class":318},"style",[308,1018,1019],{"class":322}," scoped",[308,1021,341],{"class":314},[308,1023,1025,1027,1029,1031,1035,1037,1041,1044,1047,1049,1052,1054,1057,1059],{"class":310,"line":1024},45,[308,1026,501],{"class":314},[308,1028,778],{"class":386},[308,1030,351],{"class":314},[308,1032,1034],{"class":1033},"sqsOY"," padding",[308,1036,399],{"class":314},[308,1038,1040],{"class":1039},"sbssI"," 16px",[308,1042,1043],{"class":314},";",[308,1045,1046],{"class":1033}," font-family",[308,1048,399],{"class":314},[308,1050,1051],{"class":354}," system-ui",[308,1053,423],{"class":314},[308,1055,1056],{"class":354}," sans-serif",[308,1058,1043],{"class":314},[308,1060,678],{"class":314},[308,1062,1064,1066,1068,1070,1073,1075,1078,1080,1083,1085,1088,1090,1093,1095,1098,1101,1104,1106,1109,1111,1113,1115,1118,1120,1123,1125,1128,1130],{"class":310,"line":1063},46,[308,1065,501],{"class":314},[308,1067,849],{"class":386},[308,1069,351],{"class":314},[308,1071,1072],{"class":1033}," display",[308,1074,399],{"class":314},[308,1076,1077],{"class":354}," grid",[308,1079,1043],{"class":314},[308,1081,1082],{"class":1033}," grid-template-columns",[308,1084,399],{"class":314},[308,1086,1087],{"class":452}," repeat",[308,1089,456],{"class":314},[308,1091,1092],{"class":1039},"5",[308,1094,423],{"class":314},[308,1096,1097],{"class":1039}," 1fr",[308,1099,1100],{"class":314},");",[308,1102,1103],{"class":1033}," gap",[308,1105,399],{"class":314},[308,1107,1108],{"class":1039}," 8px",[308,1110,1043],{"class":314},[308,1112,1034],{"class":1033},[308,1114,399],{"class":314},[308,1116,1117],{"class":1039}," 0",[308,1119,1043],{"class":314},[308,1121,1122],{"class":1033}," list-style",[308,1124,399],{"class":314},[308,1126,1127],{"class":354}," none",[308,1129,1043],{"class":314},[308,1131,678],{"class":314},[308,1133,1135,1137,1139,1142,1144,1147,1149,1152,1154,1157,1159,1162,1164,1167,1169,1171,1173,1176,1178,1180,1182,1185,1187,1190,1192],{"class":310,"line":1134},47,[308,1136,501],{"class":314},[308,1138,849],{"class":386},[308,1140,1141],{"class":386}," button",[308,1143,351],{"class":314},[308,1145,1146],{"class":1033}," width",[308,1148,399],{"class":314},[308,1150,1151],{"class":1039}," 100%",[308,1153,1043],{"class":314},[308,1155,1156],{"class":1033}," aspect-ratio",[308,1158,399],{"class":314},[308,1160,1161],{"class":1039}," 1",[308,1163,1043],{"class":314},[308,1165,1166],{"class":1033}," border-radius",[308,1168,399],{"class":314},[308,1170,1108],{"class":1039},[308,1172,1043],{"class":314},[308,1174,1175],{"class":1033}," border",[308,1177,399],{"class":314},[308,1179,1117],{"class":1039},[308,1181,1043],{"class":314},[308,1183,1184],{"class":1033}," cursor",[308,1186,399],{"class":314},[308,1188,1189],{"class":354}," pointer",[308,1191,1043],{"class":314},[308,1193,678],{"class":314},[308,1195,1197,1199,1201],{"class":310,"line":1196},48,[308,1198,740],{"class":314},[308,1200,1016],{"class":318},[308,1202,341],{"class":314},[293,1204,1205],{},"That's it. The toolkit:",[1207,1208,1209,1224,1238,1250],"ol",{},[862,1210,1211,1212,1214,1215,1219,1220,1223],{},"Detects ",[305,1213,453],{}," and ",[1216,1217,1218],"strong",{},"registers an MCP tool"," named ",[305,1221,1222],{},"color-picker"," (from the filename).",[862,1225,1226,1227,1230,1231,1234,1235,501],{},"Generates a ",[1216,1228,1229],{},"UI resource"," at ",[305,1232,1233],{},"ui:\u002F\u002Fmcp-app\u002Fcolor-picker"," exposing ",[305,1236,1237],{},"text\u002Fhtml;profile=mcp-app",[862,1239,1240,1241,501],{},"Bundles the SFC + assets into a single HTML file with ",[1242,1243,1247],"a",{"href":1244,"rel":1245},"https:\u002F\u002Fgithub.com\u002Frichardtallent\u002Fvite-plugin-singlefile",[1246],"nofollow",[305,1248,1249],{},"vite-plugin-singlefile",[862,1251,1252,1253,1256,1257,1260,1261,501],{},"Wires the ",[305,1254,1255],{},"handler","'s ",[305,1258,1259],{},"structuredContent"," into the iframe so the UI hydrates ",[1216,1262,1263],{},"without a second round-trip",[288,1265,1267],{"id":1266},"file-convention","File Convention",[293,1269,1270,1271,1276,1277,1280,1281,1284,1285,1288,1289,1291],{},"MCP Apps live in ",[1216,1272,1273],{},[305,1274,1275],{},"app\u002Fmcp\u002F"," by default (not ",[305,1278,1279],{},"server\u002Fmcp\u002F","). Change the app-side directory with ",[305,1282,1283],{},"mcp.appsDir"," in ",[305,1286,1287],{},"nuxt.config.ts",". They sit on the client side of Nuxt because they author Vue components — but the ",[305,1290,1255],{}," you declare runs server-side, just like a tool.",[297,1293,1297],{"className":1294,"code":1295,"language":1296,"meta":303,"style":303},"language-bash shiki shiki-themes material-theme-lighter material-theme material-theme-palenight","app\u002F\n└── mcp\u002F\n    ├── color-picker.vue    # → tool: color-picker, resource: ui:\u002F\u002Fmcp-app\u002Fcolor-picker\n    └── admin\u002F\n        └── audit-log.vue   # → tool: audit-log\n","bash",[305,1298,1299,1304,1312,1324,1332],{"__ignoreMap":303},[308,1300,1301],{"class":310,"line":311},[308,1302,1303],{"class":386},"app\u002F\n",[308,1305,1306,1309],{"class":310,"line":344},[308,1307,1308],{"class":386},"└──",[308,1310,1311],{"class":335}," mcp\u002F\n",[308,1313,1314,1317,1320],{"class":310,"line":373},[308,1315,1316],{"class":386},"    ├──",[308,1318,1319],{"class":335}," color-picker.vue",[308,1321,1323],{"class":1322},"sHwdD","    # → tool: color-picker, resource: ui:\u002F\u002Fmcp-app\u002Fcolor-picker\n",[308,1325,1326,1329],{"class":310,"line":380},[308,1327,1328],{"class":386},"    └──",[308,1330,1331],{"class":335}," admin\u002F\n",[308,1333,1334,1337,1340],{"class":310,"line":393},[308,1335,1336],{"class":386},"        └──",[308,1338,1339],{"class":335}," audit-log.vue",[308,1341,1342],{"class":1322},"   # → tool: audit-log\n",[1344,1345,1348,1349,1352,1353,1356,1357,1360],"callout",{"color":1346,"icon":1347},"info","i-lucide-info","Co-locate helpers next to the SFC (e.g. ",[305,1350,1351],{},"format.ts",") — the bundler inlines them. Keep data generation in ",[305,1354,1355],{},"server\u002Fapi\u002F"," and call it via ",[305,1358,1359],{},"$fetch"," from the handler.",[1362,1363,1365],"h3",{"id":1364},"auto-generated-name-title","Auto-Generated Name & Title",[293,1367,1368,1369,1214,1372,1375],{},"Like tools and resources, ",[305,1370,1371],{},"name",[305,1373,1374],{},"title"," are inferred from the filename:",[1377,1378,1379,1395],"table",{},[1380,1381,1382],"thead",{},[1383,1384,1385,1389,1392],"tr",{},[1386,1387,1388],"th",{},"File",[1386,1390,1391],{},"Name",[1386,1393,1394],{},"Title",[1396,1397,1398,1415,1432],"tbody",{},[1383,1399,1400,1406,1410],{},[1401,1402,1403],"td",{},[305,1404,1405],{},"color-picker.vue",[1401,1407,1408],{},[305,1409,1222],{},[1401,1411,1412],{},[305,1413,1414],{},"Color Picker",[1383,1416,1417,1422,1427],{},[1401,1418,1419],{},[305,1420,1421],{},"weather-card.vue",[1401,1423,1424],{},[305,1425,1426],{},"weather-card",[1401,1428,1429],{},[305,1430,1431],{},"Weather Card",[1383,1433,1434,1439,1444],{},[1401,1435,1436],{},[305,1437,1438],{},"admin\u002Faudit-log.vue",[1401,1440,1441],{},[305,1442,1443],{},"audit-log",[1401,1445,1446],{},[305,1447,1448],{},"Audit Log",[293,1450,1451,1452,1454,1455,1457,1458,501],{},"Override either by passing ",[305,1453,1371],{}," \u002F ",[305,1456,1374],{}," to ",[305,1459,453],{},[1362,1461,1463],{"id":1462},"routing-apps-to-a-specific-handler","Routing Apps to a Specific Handler",[293,1465,1466,1467,1470,1471,1474],{},"By default, every app is attached to the implicit ",[305,1468,1469],{},"apps"," handler and only surfaces on ",[305,1472,1473],{},"\u002Fmcp\u002Fapps",". Two ways to route an app to a different named handler:",[293,1476,1477,1480,1481,1483],{},[1216,1478,1479],{},"1. Sub-folder convention"," — the first sub-directory under ",[305,1482,1275],{}," becomes the handler attribution:",[297,1485,1487],{"className":1294,"code":1486,"language":1296,"meta":303,"style":303},"app\u002F\n└── mcp\u002F\n    ├── color-picker.vue          # → \u002Fmcp\u002Fapps (default)\n    ├── finder\u002F\n    │   └── stay-finder.vue       # → \u002Fmcp\u002Ffinder\n    └── checkout\u002F\n        └── stay-checkout.vue     # → \u002Fmcp\u002Fcheckout\n",[305,1488,1489,1493,1499,1508,1515,1529,1536],{"__ignoreMap":303},[308,1490,1491],{"class":310,"line":311},[308,1492,1303],{"class":386},[308,1494,1495,1497],{"class":310,"line":344},[308,1496,1308],{"class":386},[308,1498,1311],{"class":335},[308,1500,1501,1503,1505],{"class":310,"line":373},[308,1502,1316],{"class":386},[308,1504,1319],{"class":335},[308,1506,1507],{"class":1322},"          # → \u002Fmcp\u002Fapps (default)\n",[308,1509,1510,1512],{"class":310,"line":380},[308,1511,1316],{"class":386},[308,1513,1514],{"class":335}," finder\u002F\n",[308,1516,1517,1520,1523,1526],{"class":310,"line":393},[308,1518,1519],{"class":386},"    │",[308,1521,1522],{"class":335},"   └──",[308,1524,1525],{"class":335}," stay-finder.vue",[308,1527,1528],{"class":1322},"       # → \u002Fmcp\u002Ffinder\n",[308,1530,1531,1533],{"class":310,"line":405},[308,1532,1328],{"class":386},[308,1534,1535],{"class":335}," checkout\u002F\n",[308,1537,1538,1540,1543],{"class":310,"line":438},[308,1539,1336],{"class":386},[308,1541,1542],{"class":335}," stay-checkout.vue",[308,1544,1545],{"class":1322},"     # → \u002Fmcp\u002Fcheckout\n",[293,1547,1548,1549,399],{},"Pair each handler folder with ",[305,1550,1551],{},"server\u002Fmcp\u002Fhandlers\u002F\u003Cname>\u002Findex.ts",[297,1553,1557],{"className":1554,"code":1555,"filename":1556,"language":336,"meta":303,"style":303},"language-ts shiki shiki-themes material-theme-lighter material-theme material-theme-palenight","import { defineMcpHandler } from '@nuxtjs\u002Fmcp-toolkit\u002Fserver'\n\nexport default defineMcpHandler({})\n","server\u002Fmcp\u002Fhandlers\u002Ffinder\u002Findex.ts",[305,1558,1559,1579,1583],{"__ignoreMap":303},[308,1560,1561,1563,1565,1568,1570,1572,1574,1577],{"class":310,"line":311},[308,1562,348],{"class":347},[308,1564,351],{"class":314},[308,1566,1567],{"class":354}," defineMcpHandler",[308,1569,358],{"class":314},[308,1571,361],{"class":347},[308,1573,364],{"class":314},[308,1575,1576],{"class":335},"@nuxtjs\u002Fmcp-toolkit\u002Fserver",[308,1578,370],{"class":314},[308,1580,1581],{"class":310,"line":344},[308,1582,377],{"emptyLinePlaceholder":376},[308,1584,1585,1588,1591,1593,1595,1598],{"class":310,"line":373},[308,1586,1587],{"class":347},"export",[308,1589,1590],{"class":347}," default",[308,1592,1567],{"class":452},[308,1594,456],{"class":354},[308,1596,1597],{"class":314},"{}",[308,1599,653],{"class":354},[293,1601,1602,1609],{},[1216,1603,1604,1605,1608],{},"2. Explicit ",[305,1606,1607],{},"attachTo"," override"," — overrides the sub-folder default if both are present:",[297,1611,1614],{"className":299,"code":1612,"filename":1613,"language":302,"meta":303,"style":303},"\u003Cscript setup lang=\"ts\">\ndefineMcpApp({\n  attachTo: 'finder',\n  group: 'stays',\n  tags: ['searchable'],\n  \u002F\u002F ...\n})\n\u003C\u002Fscript>\n","app\u002Fmcp\u002Fstay-finder.vue",[305,1615,1616,1636,1644,1660,1676,1698,1703,1709],{"__ignoreMap":303},[308,1617,1618,1620,1622,1624,1626,1628,1630,1632,1634],{"class":310,"line":311},[308,1619,315],{"class":314},[308,1621,319],{"class":318},[308,1623,323],{"class":322},[308,1625,326],{"class":322},[308,1627,329],{"class":314},[308,1629,332],{"class":314},[308,1631,336],{"class":335},[308,1633,332],{"class":314},[308,1635,341],{"class":314},[308,1637,1638,1640,1642],{"class":310,"line":344},[308,1639,453],{"class":452},[308,1641,456],{"class":354},[308,1643,459],{"class":314},[308,1645,1646,1649,1651,1653,1656,1658],{"class":310,"line":373},[308,1647,1648],{"class":318},"  attachTo",[308,1650,399],{"class":314},[308,1652,364],{"class":314},[308,1654,1655],{"class":335},"finder",[308,1657,475],{"class":314},[308,1659,478],{"class":314},[308,1661,1662,1665,1667,1669,1672,1674],{"class":310,"line":380},[308,1663,1664],{"class":318},"  group",[308,1666,399],{"class":314},[308,1668,364],{"class":314},[308,1670,1671],{"class":335},"stays",[308,1673,475],{"class":314},[308,1675,478],{"class":314},[308,1677,1678,1681,1683,1686,1688,1691,1693,1696],{"class":310,"line":393},[308,1679,1680],{"class":318},"  tags",[308,1682,399],{"class":314},[308,1684,1685],{"class":354}," [",[308,1687,475],{"class":314},[308,1689,1690],{"class":335},"searchable",[308,1692,475],{"class":314},[308,1694,1695],{"class":354},"]",[308,1697,478],{"class":314},[308,1699,1700],{"class":310,"line":405},[308,1701,1702],{"class":1322},"  \u002F\u002F ...\n",[308,1704,1705,1707],{"class":310,"line":438},[308,1706,689],{"class":314},[308,1708,653],{"class":354},[308,1710,1711,1713,1715],{"class":310,"line":444},[308,1712,740],{"class":314},[308,1714,319],{"class":318},[308,1716,341],{"class":314},[293,1718,1719,1720,1723,1724,1727,1728,1731,1732,1735,1736,1739],{},"The generated tool and resource carry ",[305,1721,1722],{},"_meta.handler = 'finder'",", top-level ",[305,1725,1726],{},"group = 'stays'",", and ",[305,1729,1730],{},"tags = ['searchable']",". Filter on them with ",[305,1733,1734],{},"getMcpTools({ handler: 'finder' })",", ",[305,1737,1738],{},"getMcpTools({ tags: ['searchable'] })",", etc.",[288,1741,1743],{"id":1742},"definemcpapp",[305,1744,453],{},[293,1746,1747,1748,1751,1752,1755],{},"A macro — like ",[305,1749,1750],{},"definePageMeta"," — extracted at build time and ",[1216,1753,1754],{},"stripped from the browser bundle",". The fields it accepts:",[297,1757,1759],{"className":1554,"code":1758,"language":336,"meta":303,"style":303},"defineMcpApp({\n  name?: string                          \u002F\u002F Override auto-derived name\n  title?: string                         \u002F\u002F Override auto-derived title\n  description?: string                   \u002F\u002F Shown to the LLM to help it pick this app\n  inputSchema?: ZodRawShape              \u002F\u002F Validates tool input on the server\n  handler?: (args, extra) => Result      \u002F\u002F Runs server-side; defaults to (args) => ({ structuredContent: args })\n  csp?: McpAppCsp | false                \u002F\u002F Tighten or disable iframe CSP\n  attachTo?: string                      \u002F\u002F Named MCP handler this app routes to (default: 'apps' or sub-folder)\n  group?: string                         \u002F\u002F Top-level group label (default: same as attachTo)\n  tags?: string[]                        \u002F\u002F Top-level tags forwarded to the generated tool\n  _meta?: Record\u003Cstring, unknown>        \u002F\u002F Extra _meta fields surfaced to the host\n})\n",[305,1760,1761,1769,1782,1796,1808,1820,1847,1867,1879,1890,1902,1924],{"__ignoreMap":303},[308,1762,1763,1765,1767],{"class":310,"line":311},[308,1764,453],{"class":452},[308,1766,456],{"class":354},[308,1768,459],{"class":314},[308,1770,1771,1774,1776,1779],{"class":310,"line":344},[308,1772,1773],{"class":354},"  name?",[308,1775,399],{"class":314},[308,1777,1778],{"class":354}," string                          ",[308,1780,1781],{"class":1322},"\u002F\u002F Override auto-derived name\n",[308,1783,1784,1787,1790,1793],{"class":310,"line":373},[308,1785,1786],{"class":354},"  title",[308,1788,1789],{"class":314},"?:",[308,1791,1792],{"class":354}," string                         ",[308,1794,1795],{"class":1322},"\u002F\u002F Override auto-derived title\n",[308,1797,1798,1800,1802,1805],{"class":310,"line":380},[308,1799,465],{"class":354},[308,1801,1789],{"class":314},[308,1803,1804],{"class":354}," string                   ",[308,1806,1807],{"class":1322},"\u002F\u002F Shown to the LLM to help it pick this app\n",[308,1809,1810,1812,1814,1817],{"class":310,"line":393},[308,1811,484],{"class":354},[308,1813,1789],{"class":314},[308,1815,1816],{"class":354}," ZodRawShape              ",[308,1818,1819],{"class":1322},"\u002F\u002F Validates tool input on the server\n",[308,1821,1822,1824,1826,1829,1832,1834,1837,1839,1841,1844],{"class":310,"line":405},[308,1823,538],{"class":354},[308,1825,1789],{"class":314},[308,1827,1828],{"class":314}," (",[308,1830,1831],{"class":549},"args",[308,1833,423],{"class":314},[308,1835,1836],{"class":549}," extra",[308,1838,524],{"class":314},[308,1840,572],{"class":322},[308,1842,1843],{"class":354}," Result      ",[308,1845,1846],{"class":1322},"\u002F\u002F Runs server-side; defaults to (args) => ({ structuredContent: args })\n",[308,1848,1849,1852,1854,1857,1860,1864],{"class":310,"line":438},[308,1850,1851],{"class":354},"  csp",[308,1853,1789],{"class":314},[308,1855,1856],{"class":354}," McpAppCsp ",[308,1858,1859],{"class":314},"|",[308,1861,1863],{"class":1862},"sfNiH"," false",[308,1865,1866],{"class":1322},"                \u002F\u002F Tighten or disable iframe CSP\n",[308,1868,1869,1871,1873,1876],{"class":310,"line":444},[308,1870,1648],{"class":354},[308,1872,1789],{"class":314},[308,1874,1875],{"class":354}," string                      ",[308,1877,1878],{"class":1322},"\u002F\u002F Named MCP handler this app routes to (default: 'apps' or sub-folder)\n",[308,1880,1881,1883,1885,1887],{"class":310,"line":449},[308,1882,1664],{"class":354},[308,1884,1789],{"class":314},[308,1886,1792],{"class":354},[308,1888,1889],{"class":1322},"\u002F\u002F Top-level group label (default: same as attachTo)\n",[308,1891,1892,1894,1896,1899],{"class":310,"line":462},[308,1893,1680],{"class":354},[308,1895,1789],{"class":314},[308,1897,1898],{"class":354}," string[]                        ",[308,1900,1901],{"class":1322},"\u002F\u002F Top-level tags forwarded to the generated tool\n",[308,1903,1904,1907,1909,1912,1914,1916,1918,1921],{"class":310,"line":481},[308,1905,1906],{"class":354},"  _meta",[308,1908,1789],{"class":314},[308,1910,1911],{"class":354}," Record",[308,1913,315],{"class":314},[308,1915,504],{"class":354},[308,1917,423],{"class":314},[308,1919,1920],{"class":354}," unknown>        ",[308,1922,1923],{"class":1322},"\u002F\u002F Extra _meta fields surfaced to the host\n",[308,1925,1926,1928],{"class":310,"line":491},[308,1927,689],{"class":314},[308,1929,653],{"class":354},[1344,1931,1932,1735,1934,1727,1937,1940,1941,1828,1944,1735,1947,1950,1951,1954],{"color":1346,"icon":1347},[305,1933,1607],{},[305,1935,1936],{},"group",[305,1938,1939],{},"tags"," must be ",[1216,1942,1943],{},"literals",[305,1945,1946],{},"'finder'",[305,1948,1949],{},"['a', 'b']",") — the toolkit reads them statically at build time to route the generated tool and resource. A dynamic expression (",[305,1952,1953],{},"attachTo: someVar",") fails the build with a clear error.",[1362,1956,1958],{"id":1957},"server-handler","Server Handler",[293,1960,1961,1962,1964,1965,1967,1968,1971,1972,399],{},"The ",[305,1963,1255],{}," runs in your Nitro server, not in the iframe. It receives validated input and returns ",[305,1966,1259],{}," that the UI hydrates from. ",[1216,1969,1970],{},"Treat it like a tool handler"," — call APIs, query a database, hit ",[305,1973,1359],{},[297,1975,1977],{"className":1554,"code":1976,"language":336,"meta":303,"style":303},"defineMcpApp({\n  description: 'Pick a colour and preview a 5-tone palette.',\n  inputSchema: {\n    base: z.string().describe('Hex colour to anchor the palette, e.g. #2563eb'),\n  },\n  handler: async ({ base }) => {\n    const swatches = await $fetch('\u002Fapi\u002Fpalette', { query: { base } })\n    return { structuredContent: { base, swatches } }\n  },\n})\n",[305,1978,1979,1987,2001,2009,2039,2043,2062,2101,2123,2127],{"__ignoreMap":303},[308,1980,1981,1983,1985],{"class":310,"line":311},[308,1982,453],{"class":452},[308,1984,456],{"class":354},[308,1986,459],{"class":314},[308,1988,1989,1991,1993,1995,1997,1999],{"class":310,"line":344},[308,1990,465],{"class":318},[308,1992,399],{"class":314},[308,1994,364],{"class":314},[308,1996,472],{"class":335},[308,1998,475],{"class":314},[308,2000,478],{"class":314},[308,2002,2003,2005,2007],{"class":310,"line":373},[308,2004,484],{"class":318},[308,2006,399],{"class":314},[308,2008,390],{"class":314},[308,2010,2011,2013,2015,2017,2019,2021,2023,2025,2027,2029,2031,2033,2035,2037],{"class":310,"line":380},[308,2012,494],{"class":318},[308,2014,399],{"class":314},[308,2016,355],{"class":354},[308,2018,501],{"class":314},[308,2020,504],{"class":452},[308,2022,507],{"class":354},[308,2024,501],{"class":314},[308,2026,512],{"class":452},[308,2028,456],{"class":354},[308,2030,475],{"class":314},[308,2032,519],{"class":335},[308,2034,475],{"class":314},[308,2036,524],{"class":354},[308,2038,478],{"class":314},[308,2040,2041],{"class":310,"line":393},[308,2042,532],{"class":314},[308,2044,2045,2047,2049,2051,2053,2055,2058,2060],{"class":310,"line":405},[308,2046,538],{"class":452},[308,2048,399],{"class":314},[308,2050,543],{"class":322},[308,2052,546],{"class":314},[308,2054,550],{"class":549},[308,2056,2057],{"class":314}," })",[308,2059,572],{"class":322},[308,2061,390],{"class":314},[308,2063,2064,2066,2068,2070,2072,2074,2076,2078,2080,2082,2084,2086,2089,2091,2093,2095,2097,2099],{"class":310,"line":438},[308,2065,580],{"class":322},[308,2067,583],{"class":354},[308,2069,586],{"class":314},[308,2071,589],{"class":347},[308,2073,592],{"class":452},[308,2075,456],{"class":318},[308,2077,475],{"class":314},[308,2079,623],{"class":335},[308,2081,475],{"class":314},[308,2083,423],{"class":314},[308,2085,351],{"class":314},[308,2087,2088],{"class":318}," query",[308,2090,399],{"class":314},[308,2092,351],{"class":314},[308,2094,550],{"class":354},[308,2096,358],{"class":314},[308,2098,358],{"class":314},[308,2100,653],{"class":318},[308,2102,2103,2105,2107,2109,2111,2113,2115,2117,2119,2121],{"class":310,"line":444},[308,2104,659],{"class":347},[308,2106,351],{"class":314},[308,2108,562],{"class":318},[308,2110,399],{"class":314},[308,2112,351],{"class":314},[308,2114,550],{"class":354},[308,2116,423],{"class":314},[308,2118,583],{"class":354},[308,2120,358],{"class":314},[308,2122,678],{"class":314},[308,2124,2125],{"class":310,"line":449},[308,2126,532],{"class":314},[308,2128,2129,2131],{"class":310,"line":462},[308,2130,689],{"class":314},[308,2132,653],{"class":354},[1344,2134,2137,2138,2140,2141,2144,2145,2148],{"color":2135,"icon":2136},"primary","i-lucide-zap","Returning ",[305,2139,1259],{}," from the handler ",[1216,2142,2143],{},"inlines the data into the HTML"," as a ",[305,2146,2147],{},"\u003Cscript type=\"application\u002Fjson\">",". The iframe boots with full data already present — no extra fetch, no flicker.",[293,2150,2151,2152,2154,2155,2158],{},"If you omit ",[305,2153,1255],{},", the toolkit defaults to ",[305,2156,2157],{},"(args) => ({ structuredContent: args })",". Useful for stateless apps that only need the input echoed back.",[1362,2160,2162],{"id":2161},"sharing-types-between-server-ui","Sharing Types Between Server & UI",[293,2164,2165,2166,2169,2170,2173,2174,2176],{},"Place shared types in Nuxt's ",[305,2167,2168],{},"shared\u002Ftypes\u002F"," directory — they're ",[1216,2171,2172],{},"auto-imported globally"," in both the SFC and your API endpoints, no ",[305,2175,348],{}," statement required:",[297,2178,2181],{"className":1554,"code":2179,"filename":2180,"language":336,"meta":303,"style":303},"export interface Swatch { name: string, hex: string }\nexport interface PalettePayload { base: string, swatches: Swatch[] }\n","shared\u002Ftypes\u002Fpalette.ts",[305,2182,2183,2211],{"__ignoreMap":303},[308,2184,2185,2187,2190,2193,2195,2197,2199,2201,2203,2205,2207,2209],{"class":310,"line":311},[308,2186,1587],{"class":347},[308,2188,2189],{"class":322}," interface",[308,2191,2192],{"class":386}," Swatch",[308,2194,351],{"class":314},[308,2196,415],{"class":318},[308,2198,399],{"class":314},[308,2200,420],{"class":386},[308,2202,423],{"class":314},[308,2204,426],{"class":318},[308,2206,399],{"class":314},[308,2208,420],{"class":386},[308,2210,678],{"class":314},[308,2212,2213,2215,2217,2219,2221,2223,2225,2227,2229,2231,2233,2235,2238],{"class":310,"line":344},[308,2214,1587],{"class":347},[308,2216,2189],{"class":322},[308,2218,387],{"class":386},[308,2220,351],{"class":314},[308,2222,550],{"class":318},[308,2224,399],{"class":314},[308,2226,420],{"class":386},[308,2228,423],{"class":314},[308,2230,583],{"class":318},[308,2232,399],{"class":314},[308,2234,2192],{"class":386},[308,2236,2237],{"class":354},"[] ",[308,2239,441],{"class":314},[297,2241,2244],{"className":1554,"code":2242,"filename":2243,"language":336,"meta":303,"style":303},"export default defineEventHandler(async (event): Promise\u003CPalettePayload> => {\n  const { base } = getQuery(event)\n  return { base: String(base), swatches: buildPalette(String(base)) }\n})\n","server\u002Fapi\u002Fpalette.get.ts",[305,2245,2246,2280,2302,2346],{"__ignoreMap":303},[308,2247,2248,2250,2252,2255,2257,2260,2262,2265,2268,2270,2272,2274,2276,2278],{"class":310,"line":311},[308,2249,1587],{"class":347},[308,2251,1590],{"class":347},[308,2253,2254],{"class":452}," defineEventHandler",[308,2256,456],{"class":354},[308,2258,2259],{"class":322},"async",[308,2261,1828],{"class":314},[308,2263,2264],{"class":549},"event",[308,2266,2267],{"class":314},"):",[308,2269,556],{"class":386},[308,2271,315],{"class":314},[308,2273,729],{"class":386},[308,2275,616],{"class":314},[308,2277,572],{"class":322},[308,2279,390],{"class":314},[308,2281,2282,2285,2287,2289,2291,2293,2296,2298,2300],{"class":310,"line":344},[308,2283,2284],{"class":322},"  const",[308,2286,351],{"class":314},[308,2288,550],{"class":354},[308,2290,358],{"class":314},[308,2292,586],{"class":314},[308,2294,2295],{"class":452}," getQuery",[308,2297,456],{"class":318},[308,2299,2264],{"class":354},[308,2301,653],{"class":318},[308,2303,2304,2307,2309,2311,2313,2316,2318,2321,2323,2325,2327,2329,2332,2334,2337,2339,2341,2344],{"class":310,"line":373},[308,2305,2306],{"class":347},"  return",[308,2308,351],{"class":314},[308,2310,550],{"class":318},[308,2312,399],{"class":314},[308,2314,2315],{"class":452}," String",[308,2317,456],{"class":318},[308,2319,2320],{"class":354},"base",[308,2322,524],{"class":318},[308,2324,423],{"class":314},[308,2326,583],{"class":318},[308,2328,399],{"class":314},[308,2330,2331],{"class":452}," buildPalette",[308,2333,456],{"class":318},[308,2335,2336],{"class":452},"String",[308,2338,456],{"class":318},[308,2340,2320],{"class":354},[308,2342,2343],{"class":318},")) ",[308,2345,441],{"class":314},[308,2347,2348,2350],{"class":310,"line":380},[308,2349,689],{"class":314},[308,2351,653],{"class":354},[297,2353,2355],{"className":299,"code":2354,"filename":301,"language":302,"meta":303,"style":303},"\u003Cscript setup lang=\"ts\">\ndefineMcpApp({\n  inputSchema: { base: z.string() },\n  handler: async ({ base }): Promise\u003C{ structuredContent: PalettePayload }> => ({\n    structuredContent: await $fetch('\u002Fapi\u002Fpalette', { query: { base } }),\n  }),\n})\n\nconst { data } = useMcpApp\u003CPalettePayload>()\n\u003C\u002Fscript>\n",[305,2356,2357,2377,2385,2409,2441,2481,2490,2496,2500,2523],{"__ignoreMap":303},[308,2358,2359,2361,2363,2365,2367,2369,2371,2373,2375],{"class":310,"line":311},[308,2360,315],{"class":314},[308,2362,319],{"class":318},[308,2364,323],{"class":322},[308,2366,326],{"class":322},[308,2368,329],{"class":314},[308,2370,332],{"class":314},[308,2372,336],{"class":335},[308,2374,332],{"class":314},[308,2376,341],{"class":314},[308,2378,2379,2381,2383],{"class":310,"line":344},[308,2380,453],{"class":452},[308,2382,456],{"class":354},[308,2384,459],{"class":314},[308,2386,2387,2389,2391,2393,2395,2397,2399,2401,2403,2406],{"class":310,"line":373},[308,2388,484],{"class":318},[308,2390,399],{"class":314},[308,2392,351],{"class":314},[308,2394,550],{"class":318},[308,2396,399],{"class":314},[308,2398,355],{"class":354},[308,2400,501],{"class":314},[308,2402,504],{"class":452},[308,2404,2405],{"class":354},"() ",[308,2407,2408],{"class":314},"},\n",[308,2410,2411,2413,2415,2417,2419,2421,2423,2425,2427,2429,2431,2433,2435,2437,2439],{"class":310,"line":380},[308,2412,538],{"class":452},[308,2414,399],{"class":314},[308,2416,543],{"class":322},[308,2418,546],{"class":314},[308,2420,550],{"class":549},[308,2422,553],{"class":314},[308,2424,556],{"class":386},[308,2426,559],{"class":314},[308,2428,562],{"class":318},[308,2430,399],{"class":314},[308,2432,387],{"class":386},[308,2434,569],{"class":314},[308,2436,572],{"class":322},[308,2438,1828],{"class":354},[308,2440,459],{"class":314},[308,2442,2443,2446,2448,2450,2452,2454,2456,2458,2460,2462,2464,2466,2468,2470,2473,2475,2477,2479],{"class":310,"line":393},[308,2444,2445],{"class":318},"    structuredContent",[308,2447,399],{"class":314},[308,2449,589],{"class":347},[308,2451,592],{"class":452},[308,2453,456],{"class":354},[308,2455,475],{"class":314},[308,2457,623],{"class":335},[308,2459,475],{"class":314},[308,2461,423],{"class":314},[308,2463,351],{"class":314},[308,2465,2088],{"class":318},[308,2467,399],{"class":314},[308,2469,351],{"class":314},[308,2471,2472],{"class":354}," base ",[308,2474,689],{"class":314},[308,2476,358],{"class":314},[308,2478,524],{"class":354},[308,2480,478],{"class":314},[308,2482,2483,2486,2488],{"class":310,"line":405},[308,2484,2485],{"class":314},"  }",[308,2487,524],{"class":354},[308,2489,478],{"class":314},[308,2491,2492,2494],{"class":310,"line":438},[308,2493,689],{"class":314},[308,2495,653],{"class":354},[308,2497,2498],{"class":310,"line":444},[308,2499,377],{"emptyLinePlaceholder":376},[308,2501,2502,2504,2506,2509,2511,2513,2515,2517,2519,2521],{"class":310,"line":449},[308,2503,702],{"class":322},[308,2505,351],{"class":314},[308,2507,2508],{"class":354}," data ",[308,2510,689],{"class":314},[308,2512,586],{"class":314},[308,2514,724],{"class":452},[308,2516,315],{"class":314},[308,2518,729],{"class":386},[308,2520,616],{"class":314},[308,2522,734],{"class":354},[308,2524,2525,2527,2529],{"class":310,"line":462},[308,2526,740],{"class":314},[308,2528,319],{"class":318},[308,2530,341],{"class":314},[293,2532,2533],{},"Type-only references are stripped from the browser bundle by esbuild — nothing has to resolve inside the iframe at runtime.",[1016,2535,2536],{},"html pre.shiki code .sMK4o, html code.shiki .sMK4o{--shiki-light:#39ADB5;--shiki-default:#89DDFF;--shiki-dark:#89DDFF}html pre.shiki code .swJcz, html code.shiki .swJcz{--shiki-light:#E53935;--shiki-default:#F07178;--shiki-dark:#F07178}html pre.shiki code .spNyl, html code.shiki .spNyl{--shiki-light:#9C3EDA;--shiki-default:#C792EA;--shiki-dark:#C792EA}html pre.shiki code .sfazB, html code.shiki .sfazB{--shiki-light:#91B859;--shiki-default:#C3E88D;--shiki-dark:#C3E88D}html pre.shiki code .s7zQu, html code.shiki .s7zQu{--shiki-light:#39ADB5;--shiki-light-font-style:italic;--shiki-default:#89DDFF;--shiki-default-font-style:italic;--shiki-dark:#89DDFF;--shiki-dark-font-style:italic}html pre.shiki code .sTEyZ, html code.shiki .sTEyZ{--shiki-light:#90A4AE;--shiki-default:#EEFFFF;--shiki-dark:#BABED8}html pre.shiki code .sBMFI, html code.shiki .sBMFI{--shiki-light:#E2931D;--shiki-default:#FFCB6B;--shiki-dark:#FFCB6B}html pre.shiki code .s2Zo4, html code.shiki .s2Zo4{--shiki-light:#6182B8;--shiki-default:#82AAFF;--shiki-dark:#82AAFF}html pre.shiki code .sHdIc, html code.shiki .sHdIc{--shiki-light:#90A4AE;--shiki-light-font-style:italic;--shiki-default:#EEFFFF;--shiki-default-font-style:italic;--shiki-dark:#BABED8;--shiki-dark-font-style:italic}html pre.shiki code .sqsOY, html code.shiki .sqsOY{--shiki-light:#8796B0;--shiki-default:#B2CCD6;--shiki-dark:#B2CCD6}html pre.shiki code .sbssI, html code.shiki .sbssI{--shiki-light:#F76D47;--shiki-default:#F78C6C;--shiki-dark:#F78C6C}html .light .shiki span {color: var(--shiki-light);background: var(--shiki-light-bg);font-style: var(--shiki-light-font-style);font-weight: var(--shiki-light-font-weight);text-decoration: var(--shiki-light-text-decoration);}html.light .shiki span {color: var(--shiki-light);background: var(--shiki-light-bg);font-style: var(--shiki-light-font-style);font-weight: var(--shiki-light-font-weight);text-decoration: var(--shiki-light-text-decoration);}html .default .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html .dark .shiki span {color: var(--shiki-dark);background: var(--shiki-dark-bg);font-style: var(--shiki-dark-font-style);font-weight: var(--shiki-dark-font-weight);text-decoration: var(--shiki-dark-text-decoration);}html.dark .shiki span {color: var(--shiki-dark);background: var(--shiki-dark-bg);font-style: var(--shiki-dark-font-style);font-weight: var(--shiki-dark-font-weight);text-decoration: var(--shiki-dark-text-decoration);}html pre.shiki code .sHwdD, html code.shiki .sHwdD{--shiki-light:#90A4AE;--shiki-light-font-style:italic;--shiki-default:#546E7A;--shiki-default-font-style:italic;--shiki-dark:#676E95;--shiki-dark-font-style:italic}html pre.shiki code .sfNiH, html code.shiki .sfNiH{--shiki-light:#FF5370;--shiki-default:#FF9CAC;--shiki-dark:#FF9CAC}",{"title":303,"searchDepth":344,"depth":344,"links":2538},[2539,2540,2544],{"id":290,"depth":344,"text":291},{"id":1266,"depth":344,"text":1267,"children":2541},[2542,2543],{"id":1364,"depth":373,"text":1365},{"id":1462,"depth":373,"text":1463},{"id":1742,"depth":344,"text":453,"children":2545},[2546,2547],{"id":1957,"depth":373,"text":1958},{"id":2161,"depth":373,"text":2162},"SFC location, quick start, the defineMcpApp macro, server handler, and shared types.","md",null,{},{"icon":169},{"title":2554,"description":2555},"MCP Apps — Authoring","Quick start, file convention, defineMcpApp, and sharing types for MCP UI apps.","7eha_g3Jfe890ANbnrYmz19H9_g18LyaUUsMoZywHbU",[2558,2560],{"title":46,"path":162,"stem":163,"description":2559,"icon":164,"children":-1},"Build interactive UI widgets that AI hosts render alongside chat — written as Vue SFCs, served as MCP UI resources.",{"title":171,"path":172,"stem":173,"description":2561,"icon":174,"children":-1},"data, hostContext, sendPrompt, callTool, and openLink from inside the iframe.",1778486582613]