Expandable Media
`ExpandableMedia` turns inline article media into a larger inspectable version while preserving preview, expanded media and caption as one object. Use it for diagrams, screenshots and editorial demonstrations.
Live example
Try the interaction before reading the recipe.
real component · keyboard-safe
Purpose
ExpandableMedia turns inline article media into a larger inspectable version while preserving preview, expanded media and caption as one object. Use it for diagrams, screenshots and editorial demonstrations.
Choose it instead of Morph Lightbox when the media belongs to one page section rather than a gallery. Avoid wrapping arbitrary cards, forms or navigation; this is not a renamed Morph Card.
The underlying Morph supplies Escape, backdrop close, focus restoration and scroll lock. Reduced motion expands immediately. Keep the expanded asset optimized and make captions available in both visual and non-visual reading contexts.
Source: packages/skills/media/expandable-media.md