<script setup>
import { computed } from 'vue';
import { iconMarkup } from '../icons';

/** The Vue twin of the <x-icon> Blade component. */
const props = defineProps({
    name: { type: String, default: 'tag' },
    size: { type: [Number, String], default: 18 },
});

const markup = computed(() => iconMarkup(props.name));
</script>

<template>
    <svg class="icon" :width="size" :height="size" viewBox="0 0 24 24"
         fill="none" stroke="currentColor" stroke-width="1.75"
         stroke-linecap="round" stroke-linejoin="round"
         aria-hidden="true" focusable="false" v-html="markup"/>
</template>
