Skip to content

Search

ZoomDialog

ComponentFeedback Source

A full-screen dialog that zooms and pans its content like a photo: pinch, drag, double-tap, or the mouse wheel. For drawings and images too detailed to read at the page's width.

ZoomDialog(props: ZoomDialogProps): Element

Props

openrequiredboolean
titlerequiredstring

Shown in the title bar, and read out as the dialog's name.

onCloserequired() => void

Called when the reader closes it: Close, Escape, or a click outside.

maxScaleoptionalnumber

How far it zooms in. Defaults to 5.

childrenrequiredComponentChildren

What to show, fitted to the width, such as an <img> or <svg>.

design-system is a Ben Hodgson projectGitHub