<template>
    <span 
        :class="[ 'iconfont', ` icon-${type}` ]" 
        :style="[{ fontSize: size + 'px', color: color }]"
        @click="handleClick"
    >
        <h-info v-if="info" :info="info"/>
    </span>
</template>
<script>
import hInfo from '../info/index';
export default {
    name: "h-icon",
    props: {
        type: String,
        size: String,
        color: String,
        info: String
    },
    components: {
        hInfo
    },
    methods: {
        handleClick( e ) {
            this.$emit( 'click', e );
        }
    }
}
</script>
<style lang="less" scoped>
@import './index.less';
</style>