A docs utility that wraps any content in a Preview / Code tab pair. Includes syntax highlighting for JSX/TSX and a one-click copy button.

Usage

PreviewCode

Default (row flex)Copy

Save changesCancel

PreviewCode

Column layout (col)Copy

Primary actionSecondary action

PreviewCode

3-column grid (g3)Copy

XSMDLG

Preview

No code (preview only)

Preview only