import { forwardRef } from "react";

interface VideoPlayerProps {
  src?: string;
  poster?: string;
  className?: string;
}

const VideoPlayer = forwardRef<HTMLVideoElement, VideoPlayerProps>(
  ({ src, poster, className }, ref) => {
    return (
      <div className={`relative h-full w-full bg-black ${className ?? ""}`}>
        <video
          ref={ref}
          src={src}
          poster={poster}
          autoPlay
          playsInline
          className="h-full w-full object-contain"
        />
      </div>
    );
  }
);

VideoPlayer.displayName = "VideoPlayer";

export { VideoPlayer };
export type { VideoPlayerProps };
