Open a dialog

Use openTextDiagramDialog for a button → edit diagram → return to page workflow. It creates an independent Vue root, lazily loads the workbench and provides its own providers. The host still installs the workbench styles.

The example starts with a PlantUML sequence diagram. Saving displays a PNG; reopening reads the newly accepted revision. Cancelling leaves the object unchanged. This example's in-memory session ends when you leave the page.

Theme and lifetime

Pass the actual ownerDocument, locale and host theme. Theme is not persisted in the document: previews retain the engine's or source-defined appearance. The example derives a theme from the page's CSS color-scheme; an application can pass its own QuireKitTheme directly.

The returned TextDiagramDialogHandle is usable immediately. Call close() even before lazy loading completes; repeated calls are safe. Pass signal to close everything when the host unmounts.

The dialog calls request.release() after a successful save, cancellation, external close or loading failure. Release is not a save notification: it also runs on cancellation. A save is accepted only when commit returns saved.

Focus and commit

In the source pane, Esc first handles search or the editor's focus escape. Press Esc then Tab to leave the source pane. Closing restores focus to the trigger. If commit returns conflict, readonly or missing, the workbench explains the outcome and retains the draft.

commit is synchronous local acceptance, not a Promise. Applications with server persistence must define a local transaction and synchronization strategy first. Do not return saved before accepting the object. See persistence and the dialog API.