[{"data":1,"prerenderedAt":499},["ShallowReactive",2],{"navigation_docs_en":3,"dtpr-schemas-index":287,"-en-ui":295,"-en-ui-surround":494},[4,22,26,30,102,152,174,196,226,278,283],{"title":5,"path":6,"stem":7,"children":8},"Getting started","/en/getting-started","en/1.getting-started/0.index",[9,10,14,18],{"title":5,"path":6,"stem":7},{"title":11,"path":12,"stem":13},"MCP quickstart","/en/getting-started/mcp-quickstart","en/1.getting-started/1.mcp-quickstart",{"title":15,"path":16,"stem":17},"REST quickstart","/en/getting-started/rest-quickstart","en/1.getting-started/2.rest-quickstart",{"title":19,"path":20,"stem":21},"UI quickstart","/en/getting-started/ui-quickstart","en/1.getting-started/3.ui-quickstart",{"title":23,"path":24,"stem":25},"Attribution","/en/attribution","en/10.attribution",{"title":27,"path":28,"stem":29},"Cite DTPR for AI","/en/cite","en/11.cite",{"title":31,"path":32,"stem":33,"children":34},"MCP server","/en/mcp","en/2.mcp/0.index",[35,36,40,44,48,98],{"title":31,"path":32,"stem":33},{"title":37,"path":38,"stem":39},"Connecting","/en/mcp/connection","en/2.mcp/1.connection",{"title":41,"path":42,"stem":43},"Envelope","/en/mcp/envelope","en/2.mcp/2.envelope",{"title":45,"path":46,"stem":47},"Resources","/en/mcp/resources","en/2.mcp/3.resources",{"title":49,"path":50,"stem":51,"children":52},"Tools","/en/mcp/tools","en/2.mcp/4.tools/0.index",[53,54,58,62,66,70,74,78,82,86,90,94],{"title":49,"path":50,"stem":51},{"title":55,"path":56,"stem":57},"list_schema_versions","/en/mcp/tools/list-schema-versions","en/2.mcp/4.tools/1.list-schema-versions",{"title":59,"path":60,"stem":61},"MCP tool: resolve_datachain","/en/mcp/tools/resolve-datachain","en/2.mcp/4.tools/10.resolve-datachain",{"title":63,"path":64,"stem":65},"MCP tool: validate_resolved","/en/mcp/tools/validate-resolved","en/2.mcp/4.tools/11.validate-resolved",{"title":67,"path":68,"stem":69},"get_schema","/en/mcp/tools/get-schema","en/2.mcp/4.tools/2.get-schema",{"title":71,"path":72,"stem":73},"list_categories","/en/mcp/tools/list-categories","en/2.mcp/4.tools/3.list-categories",{"title":75,"path":76,"stem":77},"list_elements","/en/mcp/tools/list-elements","en/2.mcp/4.tools/4.list-elements",{"title":79,"path":80,"stem":81},"get_element","/en/mcp/tools/get-element","en/2.mcp/4.tools/5.get-element",{"title":83,"path":84,"stem":85},"get_elements","/en/mcp/tools/get-elements","en/2.mcp/4.tools/6.get-elements",{"title":87,"path":88,"stem":89},"validate_datachain","/en/mcp/tools/validate-datachain","en/2.mcp/4.tools/7.validate-datachain",{"title":91,"path":92,"stem":93},"render_datachain","/en/mcp/tools/render-datachain","en/2.mcp/4.tools/8.render-datachain",{"title":95,"path":96,"stem":97},"get_icon_url","/en/mcp/tools/get-icon-url","en/2.mcp/4.tools/9.get-icon-url",{"title":99,"path":100,"stem":101},"Prompts","/en/mcp/prompts","en/2.mcp/5.prompts",{"title":103,"path":104,"stem":105,"children":106},"REST API (v2)","/en/rest","en/3.rest/0.index",[107,108,112,116,120,124,128,132,136,140,144,148],{"title":103,"path":104,"stem":105},{"title":109,"path":110,"stem":111},"GET /schemas","/en/rest/schemas","en/3.rest/1.schemas",{"title":113,"path":114,"stem":115},"POST /schemas/:version/resolve","/en/rest/resolve","en/3.rest/10.resolve",{"title":117,"path":118,"stem":119},"POST /schemas/:version/validate_resolved","/en/rest/validate-resolved","en/3.rest/11.validate-resolved",{"title":121,"path":122,"stem":123},"GET /schemas/:version/manifest","/en/rest/manifest","en/3.rest/2.manifest",{"title":125,"path":126,"stem":127},"GET /schemas/:version/categories","/en/rest/categories","en/3.rest/3.categories",{"title":129,"path":130,"stem":131},"GET /schemas/:version/elements","/en/rest/elements-list","en/3.rest/4.elements-list",{"title":133,"path":134,"stem":135},"GET /schemas/:version/elements/:element_id","/en/rest/element-detail","en/3.rest/5.element-detail",{"title":137,"path":138,"stem":139},"POST /schemas/:version/validate","/en/rest/validate","en/3.rest/6.validate",{"title":141,"path":142,"stem":143},"Icon routes","/en/rest/icons","en/3.rest/7.icons",{"title":145,"path":146,"stem":147},"Pagination & fields","/en/rest/pagination-and-fields","en/3.rest/8.pagination-and-fields",{"title":149,"path":150,"stem":151},"Errors","/en/rest/errors","en/3.rest/9.errors",{"title":153,"path":154,"stem":155,"children":156},"Icon composition","/en/icons","en/4.icons/0.index",[157,158,162,166,170],{"title":153,"path":154,"stem":155},{"title":159,"path":160,"stem":161},"Shapes","/en/icons/shapes","en/4.icons/1.shapes",{"title":163,"path":164,"stem":165},"Symbols","/en/icons/symbols","en/4.icons/2.symbols",{"title":167,"path":168,"stem":169},"Composed variants","/en/icons/composed-variants","en/4.icons/3.composed-variants",{"title":171,"path":172,"stem":173},"URLs","/en/icons/urls","en/4.icons/4.urls",{"title":175,"path":176,"stem":177,"children":178},"@dtpr/ui","/en/ui","en/5.ui/0.index",[179,180,184,188,192],{"title":175,"path":176,"stem":177},{"title":181,"path":182,"stem":183},"@dtpr/ui/core","/en/ui/core","en/5.ui/1.core",{"title":185,"path":186,"stem":187},"@dtpr/ui/vue","/en/ui/vue","en/5.ui/2.vue",{"title":189,"path":190,"stem":191},"@dtpr/ui/html","/en/ui/html","en/5.ui/3.html",{"title":193,"path":194,"stem":195},"Theming","/en/ui/theming","en/5.ui/4.theming",{"title":197,"path":198,"stem":199,"children":200},"Concepts","/en/concepts","en/6.concepts/0.index",[201,202,206,210,214,218,222],{"title":197,"path":198,"stem":199},{"title":203,"path":204,"stem":205},"Datachains","/en/concepts/datachains","en/6.concepts/1.datachains",{"title":207,"path":208,"stem":209},"Elements & categories","/en/concepts/elements-categories","en/6.concepts/2.elements-categories",{"title":211,"path":212,"stem":213},"Versions & releases","/en/concepts/versions-and-releases","en/6.concepts/3.versions-and-releases",{"title":215,"path":216,"stem":217},"Content hash","/en/concepts/content-hash","en/6.concepts/4.content-hash",{"title":219,"path":220,"stem":221},"Shape contract","/en/concepts/shape-contract","en/6.concepts/5.shape-contract",{"title":223,"path":224,"stem":225},"Subchains","/en/concepts/subchains","en/6.concepts/6.subchains",{"title":227,"path":228,"stem":229,"children":230},"Claude plugin","/en/plugin","en/7.plugin/0.index",[231,232,236,270,274],{"title":227,"path":228,"stem":229},{"title":233,"path":234,"stem":235},"Install","/en/plugin/install","en/7.plugin/1.install",{"title":237,"path":238,"stem":239,"children":240},"Skills","/en/plugin/skills","en/7.plugin/2.skills/0.index",[241,242,246,250,254,258,262,266],{"title":237,"path":238,"stem":239},{"title":243,"path":244,"stem":245},"dtpr-describe-system","/en/plugin/skills/describe-system","en/7.plugin/2.skills/1.describe-system",{"title":247,"path":248,"stem":249},"dtpr-datachain-structure","/en/plugin/skills/datachain-structure","en/7.plugin/2.skills/2.datachain-structure",{"title":251,"path":252,"stem":253},"dtpr-category-audit","/en/plugin/skills/category-audit","en/7.plugin/2.skills/3.category-audit",{"title":255,"path":256,"stem":257},"dtpr-element-design","/en/plugin/skills/element-design","en/7.plugin/2.skills/4.element-design",{"title":259,"path":260,"stem":261},"dtpr-symbol-design","/en/plugin/skills/symbol-design","en/7.plugin/2.skills/5.symbol-design",{"title":263,"path":264,"stem":265},"dtpr-translate","/en/plugin/skills/translate","en/7.plugin/2.skills/6.translate",{"title":267,"path":268,"stem":269},"dtpr-comprehension-audit","/en/plugin/skills/comprehension-audit","en/7.plugin/2.skills/7.comprehension-audit",{"title":271,"path":272,"stem":273},"Research corpus","/en/plugin/research-corpus","en/7.plugin/3.research-corpus",{"title":275,"path":276,"stem":277},"Comprehension rubric","/en/plugin/comprehension-rubric","en/7.plugin/4.comprehension-rubric",{"title":49,"path":279,"stem":280,"children":281},"/en/tools","en/8.tools/0.index",[282],{"title":49,"path":279,"stem":280},{"title":284,"path":285,"stem":286},"Changelog","/en/changelog","en/9.changelog",{"ok":288,"versions":289},true,[290],{"id":291,"status":292,"created_at":293,"content_hash":294},"ai@2026-05-06-beta","beta","2026-05-06T20:23:42.963Z","sha256-2d208111b0c597ff2b38cb1c24168799b0a5ff9290203ebf46c4f7c16a0fcb24",{"id":296,"title":175,"body":297,"description":488,"extension":489,"links":490,"meta":491,"navigation":288,"path":176,"seo":492,"stem":177,"__hash__":493},"docs_en/en/5.ui/0.index.md",{"type":298,"value":299,"toc":483},"minimark",[300,307,332,414,419,458,462,479],[301,302,303,306],"p",{},[304,305,175],"code",{}," is the component library for rendering DTPR datachains. It ships three subpath exports so you can pull only the layer you need.",[308,309,314],"pre",{"className":310,"code":311,"language":312,"meta":313,"style":313},"language-bash shiki shiki-themes material-theme-lighter material-theme material-theme-palenight","pnpm add @dtpr/ui\n","bash","",[304,315,316],{"__ignoreMap":313},[317,318,321,325,329],"span",{"class":319,"line":320},"line",1,[317,322,324],{"class":323},"sBMFI","pnpm",[317,326,328],{"class":327},"sfazB"," add",[317,330,331],{"class":327}," @dtpr/ui\n",[333,334,335,351],"table",{},[336,337,338],"thead",{},[339,340,341,345,348],"tr",{},[342,343,344],"th",{},"Subpath",[342,346,347],{},"For",[342,349,350],{},"What's inside",[352,353,354,367,399],"tbody",{},[339,355,356,361,364],{},[357,358,359],"td",{},[304,360,181],{},[357,362,363],{},"Any JavaScript / TypeScript runtime",[357,365,366],{},"Framework-neutral helpers (locale projection, category grouping, display derivation, validation).",[339,368,369,373,376],{},[357,370,371],{},[304,372,185],{},[357,374,375],{},"Vue 3 apps",[357,377,378,379,382,383,382,386,382,389,382,392,382,395,398],{},"6 Single-File Components (",[304,380,381],{},"DtprIcon",", ",[304,384,385],{},"DtprElement",[304,387,388],{},"DtprElementDetail",[304,390,391],{},"DtprCategorySection",[304,393,394],{},"DtprDatachain",[304,396,397],{},"DtprElementGrid",").",[339,400,401,405,408],{},[357,402,403],{},[304,404,189],{},[357,406,407],{},"Any server-side Node runtime",[357,409,410,413],{},[304,411,412],{},"renderDatachainDocument"," — SSR HTML for MCP Apps iframes.",[415,416,418],"h2",{"id":417},"in-this-section","In this section",[420,421,422,431,438,448],"ul",{},[423,424,425,430],"li",{},[426,427,429],"a",{"href":428},"/ui/core","Core"," — framework-neutral helpers + types.",[423,432,433,437],{},[426,434,436],{"href":435},"/ui/vue","Vue"," — the 6 Vue components with props, slots, examples.",[423,439,440,444,445,447],{},[426,441,443],{"href":442},"/ui/html","HTML (SSR)"," — ",[304,446,412],{}," for the MCP Apps flow.",[423,449,450,453,454,457],{},[426,451,193],{"href":452},"/ui/theming"," — the ",[304,455,456],{},"dtpr"," cascade layer and CSS custom properties.",[415,459,461],{"id":460},"related","Related",[420,463,464,473],{},[423,465,466,472],{},[426,467,469,470],{"href":468},"/mcp/tools/render-datachain","MCP: ",[304,471,91],{}," — the tool that produces the HTML served to iframes.",[423,474,475,478],{},[426,476,19],{"href":477},"/getting-started/ui-quickstart"," — minimal Vue 3 app fetching from the REST API.",[480,481,482],"style",{},"html pre.shiki code .sBMFI, html code.shiki .sBMFI{--shiki-light:#E2931D;--shiki-default:#FFCB6B;--shiki-dark:#FFCB6B}html pre.shiki code .sfazB, html code.shiki .sfazB{--shiki-light:#91B859;--shiki-default:#C3E88D;--shiki-dark:#C3E88D}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);}",{"title":313,"searchDepth":484,"depth":484,"links":485},2,[486,487],{"id":417,"depth":484,"text":418},{"id":460,"depth":484,"text":461},"Framework-neutral helpers, Vue components, and SSR HTML renderer for DTPR content.","md",null,{},{"title":175,"description":488},"LT6tlw-mwEnotwWoSvQfRvbda80fGesSsHl6FZ3cEeY",[495,497],{"title":171,"path":172,"stem":173,"description":496,"children":-1},"Derive an icon URL from any (version, element, variant) triple.",{"title":181,"path":182,"stem":183,"description":498,"children":-1},"Framework-neutral helpers for locale extraction, interpolation, category grouping, display derivation, and validation.",1779049686948]