BootstrapIcon.vue

<template>
  <svg
    class="bi bi-bootstrap-fill"
    :width="props.width"
    :height="props.height"
    :fill="props.fill"
  >
    <use v-bind:xlink:href="iconPath + '#' + props.icon" />
  </svg>
</template>

<script setup lang="ts">
import iconPath from "bootstrap-icons/bootstrap-icons.svg";

const props = defineProps({
  icon: { type: String, required: true },
  width: { type: Number, default: 24, required: false },
  height: { type: Number, default: 24, required: false },
  fill: { type: String, default: "black", required: false },
});
</script>

<style scoped></style>