<wxs module="utils" src="../wxs/utils.wxs"/>
<wxs module="computed" src="./index.wxs"/>

<view
        bind:tap="onClick"
        class="custom-class {{ utils.bem('notice-bar', { withicon: mode, wrapable }) }}"
        style="{{ computed.rootStyle({ color, backgroundColor, background }) }}"
        wx:if="{{ show }}"
>
    <van-icon
            class="van-notice-bar__left-icon"
            name="{{ leftIcon }}"
            wx:if="{{ leftIcon }}"
    />
    <slot name="left-icon" wx:else/>

    <view class="van-notice-bar__wrap">
        <view animation="{{ animationData }}"
              class="van-notice-bar__content {{ scrollable === false && !wrapable ? 'van-ellipsis' : '' }}">
            {{ text }}
            <slot wx:if="{{ !text }}"></slot>
        </view>
    </view>

    <van-icon
            catch:tap="onClickIcon"
            class="van-notice-bar__right-icon"
            name="cross"
            wx:if="{{ mode === 'closeable' }}"
    />
    <navigator
            open-type="{{ openType }}"
            url="{{ url }}"
            wx:elif="{{ mode === 'link' }}"
    >
        <van-icon class="van-notice-bar__right-icon" name="arrow"/>
    </navigator>
    <slot name="right-icon" wx:else/>
</view>
