---
interface Props {
  videoPath: string;
  videoType?: string;

  controls?: boolean;
  autoPlay?: boolean;
  loop?: boolean;
  playsInline?: boolean;
}

const {
  videoPath,
  videoType = "video/mp4",

  controls = true,
  autoPlay = false,
  loop = false,
  playsInline = false,
} = Astro.props;
---

<div class="mx-auto my-auto">
  <video
    class="h-auto w-full"
    controls={controls}
    autoplay={autoPlay}
    loop={loop}
    playsinline={playsInline}
  >
    <source src={videoPath} type={videoType} />
    Your browser does not support the video tag.
  </video>
</div>