<template>
  <i :class="_class" v-html="_svg" v-bind="$attrs"></i>
</template>
<script>
  import svgMap from './svg/index.json';

  // console.log(svgMap);
  // console.log(Object.keys(svgMap));
  const name = 'hive-icon';

/* eslint-disable */
svgMap["loading_gradient_disabled"] = svgMap["loading_gradient"]
  .replace(/#fff/g, "#c0c0c0")
  .replace(/loading_gradient/g, "loading_gradient_disabled");
svgMap["loading_gradient_primary"] = svgMap["loading_gradient"]
  .replace(/#fff/g, "#0052D9")
  .replace(/loading_gradient/g, "loading_gradient_primary");
svgMap["loading_gradient_default"] = svgMap["loading_gradient"]
  .replace(/#fff/g, "#333")
  .replace(/loading_gradient/g, "loading_gradient_default");

export default {
  name,
  props: {
    /**
     * 图标类型
     */
    icon: String,
    /**
     * 图标尺寸
     */
    size: String
  },
  computed: {
    _class() {
      return [
        name,
        {
          [`${name}--${this.icon}`]: this.icon,
          [`${name}__${this.size}`]: this.size,
        }
      ];
    },
    _svg() {
      return svgMap[this.icon];
    }
  }
};
</script>
