MediaFile
The MediaFile component renders the media for the Storefront API's
Media object. It renders an Image, a
Video, an ExternalVideo, or a ModelViewer depending on the mediaContentType of the
media provided as a prop.
Example code
Anchor link to section titled "Example code"
| Name | Type | Description |
|---|---|---|
| data | PartialDeep<MediaEdgeType['node']> |
An object with fields that correspond to the Storefront API's Media object. |
| options? | React.ComponentProps<typeof Video>['options'] | React.ComponentProps<typeof ExternalVideo>['options'] | React.ComponentProps<typeof Image>['options'] |
The options for the Image, Video, or ExternalVideo components. |
Component type
Anchor link to section titled "Component type"The MediaFile component is a shared component, which means that it renders on both the server and the client. For more information about component types, refer to React Server Components.
Storefront API data
Anchor link to section titled "Storefront API data"The data prop is an object with fields that correspond to the Storefront API's Media object: