<import-sjs
  from="./index.sjs"
  name="utils"
></import-sjs>
<view
  a:if="{{!destroyOnClose || visible || closing}}"
  class="ant-popup {{className || ''}}"
  style="{{zIndex ? 'z-index:' + zIndex : ''}};{{style || ''}}"
  hidden="{{!destroyOnClose && !visible && !closing}}"
>
  <view
    a:if="{{showMask}}"
    class="ant-popup-mask {{maskClassName || ''}} {{closing && !visible ? 'ant-popup-mask-closing' : ''}}"
    onTap="onTapMask"
    style="{{animation ? '-webkit-animation-duration:' + duration + 'ms; animation-duration:' + duration + 'ms;' : ''}} {{maskStyle || ''}}"
  >
    <slot name="mask"></slot>
  </view>
  <view
    class="ant-popup-content ant-popup-{{animationType}}-{{position}} {{closing ? 'ant-popup-' + animationType + '-' + position + '-close' : ''}}"
    style="{{utils.getContentStyle(position, animation, duration, width, height)}}"
    onAnimationEnd="onAnimationEnd"
  >
    <view
      a:if="{{backgroundImage}}"
      class="ant-popup-content-bg"
      style="background-image: url({{backgroundImage}});"
    ></view>
    <slot name="header">
      <view
        a:if="{{title || showClose || showBack}}"
        class="ant-popup-content-header"
      >
        <view
          a:if="{{showBack}}"
          class="ant-popup-content-header-icon ant-popup-content-header-icon-back"
          onTap="onClickBack"
        >
          <slot name="header-back">
            <ant-icon type="LeftOutline"></ant-icon>
          </slot>
        </view>
        <view class="ant-popup-content-header-title">
          <slot name="header-title">
            {{title}}
          </slot>
        </view>
        <view
          a:if="{{showClose}}"
          class="ant-popup-content-header-icon ant-popup-content-header-icon-close"
          onTap="onClickCloseIcon"
        >
          <slot name="header-close">
            <ant-icon type="CloseOutline"></ant-icon>
          </slot>
        </view>
      </view>
    </slot>
    <slot></slot>
    <slot
      name="content"
      a:if="{{isOldVersion}}"
    ></slot>
  </view>
</view>