<view
  wx:if="{{show}}"
  class="ant-notice-bar {{className || ''}} {{type ? 'ant-notice-bar-' + type : ''}} {{ellipsisRow > 1 ? 'ant-notice-bar-no-height' : ''}}"
  style="{{style}}"
>
  <slot
    name="icon"
    wx:if="{{slotIcon}}"
  ></slot>
  <view
    wx:else
    class="ant-notice-bar-icon"
  >
    <image-icon
      wx:if="{{icon}}"
      image="{{icon}}"
      className="ant-notice-bar-icon-image"
    ></image-icon>
    <ant-icon
      wx:elif="{{type === 'error'}}"
      type="InformationCircleOutline"
    ></ant-icon>
    <ant-icon
      wx:else
      type="SoundOutline"
    ></ant-icon>
  </view>
  <view class="ant-notice-bar-content ant-notice-bar-content{{$id ? '-' + $id : ''}}">
    <view
      class="ant-notice-bar-marquee ant-notice-bar-marquee{{$id ? '-' + $id : ''}} {{ellipsisRow > 1 ? 'ant-notice-bar-ellipsis' : ''}}"
      style="{{marqueeStyle}} display: {{enableMarquee ? 'inline-block' : ellipsisRow > 1 ? '-webkit-box' : 'block'}}; -webkit-line-clamp:{{ellipsisRow}}; white-space: {{ellipsisRow > 1 ? 'wrap' : 'nowrap'}}"
      onTransitionEnd="onTransitionEnd"
    >
      <slot></slot>
    </view>
  </view>
  <view class="ant-notice-bar-operation">
    <slot name="extra"></slot>
    <ant-icon
      wx:if="{{mode === 'link'}}"
      className="ant-notice-bar-operation-icon"
      type="RightOutline"
      bindtap="onTap"
    ></ant-icon>
    <ant-icon
      wx:if="{{mode === 'closeable'}}"
      className="ant-notice-bar-operation-icon"
      type="CloseOutline"
      bindtap="onTap"
    ></ant-icon>
  </view>
</view>