pantoken / demo

demo ​

@pantoken/demo — die Render-Seite des @demo-Systems.

@pantoken/typedoc-plugin-demo turns a @demo <spec> tag into a fenced demo block whose body is the spec (a bare URL or a <provider>:<ref> pair). This package resolves that spec into an embeddable iframe and renders the surrounding panel — an MDN-style "live sample."

Es liefert drei Dinge: resolveDemo (spec → iframe-Attribute, framework-agnostisch), ein markdown-it-Plugin (demoMarkdownIt), das demo-Fences in das Panel-HTML verwandelt, und einen selbstgehosteten Runner (@pantoken/demo/runner.html) — eine Same-Origin-Seite, die ein nacktes HTML/CSS/JS-Demo lädt und es mit injizierten Token-Stylesheets rendert, sodass self:-Demos kein Konto von Drittanbietern und keine Framing-Workarounds benötigen.

Beispiel ​

ts
import { resolveDemo } from "@pantoken/demo";

resolveDemo("stackblitz:abc123").src; // → "https://stackblitz.com/edit/abc123?embed=1&…"
resolveDemo("self:button", { base: "/docs/", cssUrls: ["/docs/tokens.css"] }).src;

Schnittstellen ​

Variablen ​

Funktionen ​