import { html } from 'lit';
import { ifDefined } from 'lit/directives/if-defined.js';
export function renderImagePreview(image) {
    const { src } = image;
    return html `
    <div class="max-h-[min(20vw,150px)]">
      <img src="${src}" class="w-full h-full" alt="" />
      <img
        src="${src}"
        class="absolute top-0 left-0 w-full h-full object-cover object-center opacity-30 -z-10"
        style="filter: blur(24px);"
        alt=""
      />
    </div>
  `;
}
export function renderVideoPreview(video) {
    const { src, posterSrc, file } = video;
    return html `
    <div class="max-h-[max(23vw,250px)] w-full">
      <shreddit-player
        autoplay-pref
        ui="desktop"
        src="${src}"
        class="w-full h-full"
        poster="${ifDefined(posterSrc)}"
      >
        <source src="${src}" type="${file.type}" />
      </shreddit-player>
    </div>
  `;
}
export function renderMediaPreview(media) {
    return html `
    <div class="flex relative justify-center align-center w-full h-full items-center flex-col">
      ${media.type === 'video' ? renderVideoPreview(media) : renderImagePreview(media)}
    </div>
  `;
}
//# sourceMappingURL=render-media-preview.js.map