Composition example
Image preview · Loading and failure
Preview
Code
render: () => (
<Stack>
<p>
Displaying an image adds no click target; the host can provide open or remove actions
separately.
</p>
<ImagePreview src={sample} alt="Evening hills" loading="eager" />
<ImagePreview src="/image-preview-delayed.svg" alt="Delayed-loading image" loading="eager" />
<ImagePreview src="data:image/png,invalid" alt="Image that fails to load" loading="eager" />
<div>
<Button variant="outline">Host action</Button>
</div>
</Stack>
)