Limeplay - Open Source Video Player UI ComponentsLimeplay

Media Element

Native HTML media element (video or audio) connected to the store.

Installation

npx shadcn add @limeplay/media

Requires mediaFeature registered in your createMediaKit.

Usage

Renders a <video> or <audio> element and binds it to the media store automatically.

components/media-player.tsx
import { Media } from "@/components/limeplay/media"

;<Media as="video" className="size-full object-cover" />

Switch to audio:

<Media as="audio" />

Forwarding Refs

const videoRef = React.useRef<HTMLVideoElement>(null)

<Media as="video" ref={videoRef} autoPlay muted />

API Reference

Prop

Type

On this page