import{template as e}from"@gem-sdk/core";import{getStyle as r}from"./common/styles.js";import{getClass as i}from"./common/classes.js";let CarouselItem=s=>{let{builderAttrs:d,index:m,children:a,id:o}=s,{carouselItemStyle:t,carouselItemInnerStyle:l}=r(s),{carouselItemClass:c,carouselItemInnerClass:u}=i(s);return e`
    <div
      ${{...d}}
      id="${o}"
      class="${c}"
      style="${t}"
      data-index="${m}"
      grid-index="{{forloop.index}}"
      external-id="{{media.external_id}}"
      media-type="{{media.media_type}}"
      media-poster="{{media.preview_image.src}}"
      media-source-url="{{media.sources.first.url}}"
      media-last-source-url="{{mediaSourceUrl}}"
    >
      <div
        class="${u}"
        style="${l}"
      >
      ${a}
      </div>
    </div>
  `};export{CarouselItem as default};
