<template>
    <view
        :class="'custom-class ' + utils.bem('tag', [type, size, { mark, plain, round }]) + ' ' + (plain ? 'van-hairline--surround' : '')"
        :style="(color && !plain ? 'background-color: ' + color + ';' : '') + (textColor || (color && plain) ? 'color: ' + (textColor || color) : '')"
    >
        <slot />
        <van-icon v-if="closeable" name="cross" custom-class="van-tag__close" @click="onClose" />
    </view>
</template>
<script module="utils" lang="wxs" src="@/node_modules/@vant/weapp/dist/wxs/utils.wxs"></script>
<script>
import { VantComponent } from '../common/component';
export default {
    data() {
        return {};
    },
    props: {
        size: String,
        mark: Boolean,
        color: String,
        plain: Boolean,
        round: Boolean,
        textColor: String,
        type: {
            type: String,
            default: 'default'
        },
        closeable: Boolean
    },
    methods: {
        onClose() {
            this.$emit('close');
        }
    }
};
</script>
<style>
@import './index.css';
</style>
