<template><svg aria-hidden="true" :fill="color" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 48 48" width="48px" height="48px"><path d="M24 4.5c10.77 0 19.5 8.731 19.5 19.5S34.77 43.5 24 43.5 4.5 34.77 4.5 24C4.5 13.232 13.231 4.5 24 4.5m0 3C14.888 7.5 7.5 14.889 7.5 24c0 9.113 7.388 16.5 16.5 16.5S40.5 33.113 40.5 24 33.113 7.5 24 7.5m6 9a1.5 1.5 0 0 1 1.5 1.5v12a1.5 1.5 0 0 1-1.5 1.5H18a1.5 1.5 0 0 1-1.5-1.5V18a1.5 1.5 0 0 1 1.5-1.5zm-10.5 12h9v-9h-9z"/></svg></template>
<script setup lang="ts">
/**
 * StopCircle48 is an SVG icon wrapped in a Vue component to make it easier to use.
 */
withDefaults(
  defineProps<{
    /**
     * Define the color of the icon.
     */
    color?: string;
  }>(),
  {
    color: 'currentColor',
  },
);
</script>
