Deployment and assets
Keep local engine assets, separate server-side models from browser rendering and verify production policies.
Browser and SSR
The root @quirekit/text-diagram entry contains pure models and templates. SVG / PNG rendering, CodeMirror and dialogs require a browser. Do not run them in Nuxt server setup. Mount the workbench within ClientOnly or a .client.vue boundary; SSR can display an already saved PNG. Nuxt's ClientOnly documentation describes the client boundary.
This site uses docs-kit's client-only example boundary. Static output still contains the tutorials and API text rather than an empty SPA shell.
Ship the engine assets
Mermaid loads on demand. The official PlantUML JavaScript core and Graphviz WASM are bundled in @quirekit/text-diagram's dist/diagram-frame.iife.js, referenced through new URL(..., import.meta.url) inside the package.
Let the bundler process and publish this file. Copying only browser.mjs loses the engine asset. Do not replace the asset path with a remote rendering service. After a Vite / Nuxt build, check for the asset in static output and actually render a PlantUML and DOT diagram from that output. Initial use still loads site scripts: local rendering does not imply automatic offline caching.
CSP and images
PlantUML / DOT run in a srcdoc sandbox frame with script permission and no allow-same-origin. The frame policy permits the bundled engine's origin, WASM execution and required inline styles, while denying network connections. A stricter parent policy can still block execution.
Verify the host's frame, script origin, WASM and style policies in production. SVG previews use Blob images; PNG uses data:image/png. Do not copy a broad policy that relaxes the entire application. If deployment policy prevents editing, retain source or an existing preview and explain that editing is unavailable.
License artifacts
Both QuireKit packages are MIT. Preserve their LICENSE.md, THIRD_PARTY_NOTICES.md and the renderer's ENGINE_LICENSES.txt when distributing bundled assets. Third-party engines retain their own licenses. This site generates /licenses/engines.txt, /licenses/text-diagram.txt and /licenses/third-party-notices.txt from the original package texts and includes them in static output.
Develop and preview this site
Use Node 22 and pnpm from the repository root:
pnpm --filter @quirekit/text-diagram-docs dev
pnpm --filter @quirekit/text-diagram-docs typecheck
pnpm --filter @quirekit/text-diagram-docs build
pnpm --filter @quirekit/text-diagram-docs test:browser
The fixed preview is http://127.0.0.1:3260/; startup fails if the port is occupied. build writes apps/text-diagram-docs/.output/public, including bilingual pages, raw Markdown, llms.txt, complete example sources and engine assets. The planned domain is text-diagram.quirekit.com; this delivery does not publish the domain or npm packages.