Media File Element

A component for embedded media content with resizing and caption support.

Media Block Context Menu Block Menu Block Menu Items Block Selection Button Caption Color Dropdown Menu Dropdown Menu Input Menu Plate Element Popover Separator Spinner Toolbar Tooltip Turn Into Dropdown Menu

Installation

Install the following dependencies:

npm install @udecode/plate-media @udecode/plate-resizable @udecode/plate-selection @udecode/plate-caption @radix-ui/react-slot @radix-ui/react-tooltip @udecode/plate-ai @udecode/plate-comments @udecode/plate-font @radix-ui/react-toolbar @radix-ui/react-separator @radix-ui/react-dropdown-menu @udecode/plate-block-quote @udecode/plate-callout @udecode/plate-code-block @udecode/plate-heading @udecode/plate-indent-list @udecode/plate-toggle @udecode/plate-date @udecode/plate-layout @udecode/plate-math @udecode/plate-table @ariakit/[email protected] @radix-ui/react-popover

Copy and paste the following code into your project.

Get the code ->

Update the import paths to match your project setup.

Examples

Upload

Get the code ->

Media Embed Element Media Placeholder Element