var __defProp = Object.defineProperty;
var __name = (target, value) => __defProp(target, "name", { value, configurable: true });
import { bq as defineComponent, r as ref, E as computed, w as watch, o as onMounted, c as createElementBlock, d as openBlock, e as createBaseVNode, I as withModifiers } from "./vendor-other-DdEHkzYa.js";
const _hoisted_1 = ["controls", "poster"];
const _hoisted_2 = ["src"];
const _sfc_main = /* @__PURE__ */ defineComponent({
  __name: "MediaVideoTop",
  props: {
    asset: {}
  },
  emits: ["videoPlayingStateChanged", "videoControlsChanged"],
  setup(__props, { emit: __emit }) {
    const emit = __emit;
    const isHovered = ref(false);
    const isPlaying = ref(false);
    const shouldShowControls = computed(() => !isPlaying.value || isHovered.value);
    watch(shouldShowControls, (controlsVisible) => {
      emit("videoControlsChanged", controlsVisible);
    });
    onMounted(() => {
      emit("videoControlsChanged", shouldShowControls.value);
    });
    const onVideoPlay = /* @__PURE__ */ __name(() => {
      isPlaying.value = true;
      emit("videoPlayingStateChanged", true);
    }, "onVideoPlay");
    const onVideoPause = /* @__PURE__ */ __name(() => {
      isPlaying.value = false;
      emit("videoPlayingStateChanged", false);
    }, "onVideoPause");
    const onVideoEnded = /* @__PURE__ */ __name(() => {
      isPlaying.value = false;
      emit("videoPlayingStateChanged", false);
    }, "onVideoEnded");
    return (_ctx, _cache) => {
      return openBlock(), createElementBlock("div", {
        class: "relative size-full overflow-hidden rounded bg-black",
        onMouseenter: _cache[1] || (_cache[1] = ($event) => isHovered.value = true),
        onMouseleave: _cache[2] || (_cache[2] = ($event) => isHovered.value = false)
      }, [
        createBaseVNode("video", {
          controls: shouldShowControls.value,
          preload: "metadata",
          autoplay: "",
          muted: "",
          loop: "",
          playsinline: "",
          poster: _ctx.asset.preview_url,
          class: "relative size-full object-contain transition-transform duration-300 group-hover:scale-105 group-data-[selected=true]:scale-105",
          onClick: _cache[0] || (_cache[0] = withModifiers(() => {
          }, ["stop"])),
          onPlay: onVideoPlay,
          onPause: onVideoPause,
          onEnded: onVideoEnded
        }, [
          createBaseVNode("source", {
            src: _ctx.asset.src || ""
          }, null, 8, _hoisted_2)
        ], 40, _hoisted_1)
      ], 32);
    };
  }
});
export {
  _sfc_main as default
};
//# sourceMappingURL=MediaVideoTop-DrDqLo2M.js.map
