@dtpr/ui
@dtpr/ui
Framework-neutral helpers, Vue components, and SSR HTML renderer for DTPR content.
@dtpr/ui
@dtpr/ui is the component library for rendering DTPR datachains. It ships three subpath exports so you can pull only the layer you need.
pnpm add @dtpr/ui
| Subpath | For | What's inside |
|---|---|---|
@dtpr/ui/core | Any JavaScript / TypeScript runtime | Framework-neutral helpers (locale projection, category grouping, display derivation, validation). |
@dtpr/ui/vue | Vue 3 apps | 6 Single-File Components (DtprIcon, DtprElement, DtprElementDetail, DtprCategorySection, DtprDatachain, DtprElementGrid). |
@dtpr/ui/html | Any server-side Node runtime | renderDatachainDocument — SSR HTML for MCP Apps iframes. |
In this section
- Core — framework-neutral helpers + types.
- Vue — the 6 Vue components with props, slots, examples.
- HTML (SSR) —
renderDatachainDocumentfor the MCP Apps flow. - Theming — the
dtprcascade layer and CSS custom properties.
Related
- MCP:
render_datachain— the tool that produces the HTML served to iframes. - UI quickstart — minimal Vue 3 app fetching from the REST API.