mirror of
https://github.com/lumehq/lume.git
synced 2025-03-29 11:11:43 +01:00
33 lines
659 B
TypeScript
33 lines
659 B
TypeScript
import {
|
|
MediaControlBar,
|
|
MediaController,
|
|
MediaMuteButton,
|
|
MediaPlayButton,
|
|
MediaTimeDisplay,
|
|
MediaTimeRange,
|
|
MediaVolumeRange,
|
|
} from "media-chrome/dist/react";
|
|
|
|
export function VideoPreview({ url }: { url: string }) {
|
|
return (
|
|
<div className="mt-1 mb-2.5 w-full rounded-xl overflow-hidden">
|
|
<MediaController>
|
|
<video
|
|
slot="media"
|
|
src={url}
|
|
preload="auto"
|
|
muted
|
|
className="w-full h-auto"
|
|
/>
|
|
<MediaControlBar>
|
|
<MediaPlayButton />
|
|
<MediaTimeRange />
|
|
<MediaTimeDisplay showDuration />
|
|
<MediaMuteButton />
|
|
<MediaVolumeRange />
|
|
</MediaControlBar>
|
|
</MediaController>
|
|
</div>
|
|
);
|
|
}
|