MediaRendererProps
Props taken by the for the MediaRenderer component
type MediaRendererProps = { alt?: string; className?: string; controls?: HTMLVideoElement["controls"]; gatewayUrl?: string; height?: string; mimeType?: string; poster?: string | null; requireInteraction?: boolean; src?: string | null; style?: React.CSSProperties; width?: string;};
The alt attributes provides alternative
information for the media, if a user for some reason cannot view it due to slow connection, an error in the src attribute, or if the user is visually impaired.
The default value is "" .
type alt = string;
The className to apply on the rendered element to add custom styling.
type className = string;
A client is the entry point to the thirdweb SDK.
It is required for all other actions.
You can create a client using the createThirdwebClient function. Refer to the Creating a Client documentation for more information.
You must provide a clientId or secretKey in order to initialize a client. Pass clientId if you want for client-side usage and secretKey for server-side usage.
import { createThirdwebClient } from "thirdweb"; const client = createThirdwebClient({ clientId: "<your_client_id>",});
Show the media controls (where applicable)
By default it is set to false
type controls = HTMLVideoElement["controls"];
The IPFS gateway URL to use
type gatewayUrl = string;
The height of the rendered media.
The default value is auto .
type height = string;
Provide the MIME type of the media if it is known
type mimeType = string;
The poster is the image that is shown before the video is played.
The default value is the first frame of the video.
If the src is not a video, this prop is ignored.
type poster = string | null;
Require user interaction to play the media (i.e. disable autoplay).
The default value is false .
type requireInteraction = boolean;
the src attribute specifies the URL of the media.
This can be an IPFS URI or HTTP URL that points to media
type src = string | null;
The style to apply on the rendered element to add custom styling.
type style = React.CSSProperties;
The width of the rendered media.
The default value is auto .
type width = string;