<wxs src="./index.wxs" module="this" />
<wxs src="../common/utils.wxs" module="_" />

<view class="{{prefix}}-class {{classPrefix}}" style="{{customStyle}}">
  <swiper
    class="{{classPrefix}}-host"
    autoplay="{{autoplay}}"
    current="{{current}}"
    interval="{{interval}}"
    duration="{{duration}}"
    circular="{{loop}}"
    vertical="{{direction == 'vertical'}}"
    easing-function="{{easingFunction}}"
    previous-margin="{{previousMargin}}"
    next-margin="{{nextMargin}}"
    snap-to-edge="{{snapToEdge}}"
    display-multiple-items="{{displayMultipleItems}}"
    style="height: {{_.addUnit(height)}}"
    bindchange="onChange"
  >
    <swiper-item
      wx:for="{{list}}"
      wx:key="index"
      class="{{_.cls(classPrefix + '__item', [['preview', this.isPrev(current, index, list)], ['next', this.isNext(current, index, list)]])}}"
    >
      <t-image
        class="{{classPrefix}}__image-host"
        t-class="{{prefix}}-class-image {{this.isPrev(current, index, list) ? (prefix + '-class-prev-image') : ''}} {{this.isNext(current, index, list) ? (prefix + '-class-next-image') : ''}} {{classPrefix}}__image"
        custom-style="height: {{_.addUnit(height)}}"
        src="{{item}}"
      />
    </swiper-item>
  </swiper>
  <t-swiper-nav
    wx:if="{{_navigation}}"
    id="swiperNav"
    t-class="{{prefix}}-class-nav"
    type="{{_navigation.type}}"
    minShowNum="{{_navigation.minShowNum}}"
    showControls="{{_navigation.showControls}}"
    bind:navBtnChange="onNavBtnChange"
  />
  <slot name="nav" />
</view>
