<template><svg aria-hidden="true" :fill="color" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20" width="20px" height="20px"><path fill-rule="evenodd" d="M4.917 8.333a5.083 5.083 0 0 1 10.167 0c0 .613-.29 1.452-.821 2.435-.52.96-1.223 1.97-1.94 2.899A42 42 0 0 1 10 16.407l-.354-.388a42 42 0 0 1-1.969-2.352c-.716-.929-1.419-1.938-1.939-2.9-.532-.982-.821-1.821-.821-2.434m4.548 9.692L10 17.5za.75.75 0 0 0 1.07 0L10 17.5l.536.525.001-.001.004-.004.014-.014.05-.053q.069-.07.191-.2a43.052 43.052 0 0 0 2.714-3.17c.742-.96 1.498-2.041 2.072-3.101.561-1.038 1.002-2.15 1.002-3.149a6.583 6.583 0 0 0-13.167 0c0 .999.44 2.111 1.002 3.149.573 1.06 1.33 2.14 2.071 3.101a43 43 0 0 0 2.905 3.37l.051.053.014.014.003.004zM7.417 7.917a2.583 2.583 0 1 1 5.167 0 2.583 2.583 0 0 1-5.167 0"/></svg></template>
<script setup lang="ts">
/**
 * Location20 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>
