Editor.Preview

Editor.Preview is the full-document preview dialog. The viewer scrolls vertically through every page at print fidelity - what you see is what Editor.DownloadButton exports.

Usage

<Editor.Root>
    <Editor.Preview />
</Editor.Root>

The dialog mounts portaled at the body level and stays mounted across renders. Editor.PreviewButton (inside Editor.Toolbar) opens it.

Composition

The dialog is a Radix Dialog.Root underneath. It reads its open state from the editor context - actions.openPreview() / actions.closePreview() are the dispatchers if you want to drive it from your own UI.

import { useEditor } from '@docmosaic/react';

function PreviewLink() {
    const { actions } = useEditor();
    return <a onClick={actions.openPreview}>Preview</a>;
}

Examples

Force-open on mount (e.g. shareable preview link)

function PreviewOnly() {
    const { actions } = useEditor();
    useEffect(() => {
        actions.openPreview();
    }, [actions]);
    return null;
}

API Reference

Related

• PreviewButton
• DownloadButton