<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="M12.197 1.97a.75.75 0 1 0-1.06 1.06l.303.303-4.25 4.25H5a.75.75 0 0 0-.53.22l-.833.833a.75.75 0 0 0 0 1.061L6.44 12.5l-2.803 2.803a.75.75 0 0 0 1.06 1.06L7.5 13.562l2.803 2.803a.75.75 0 0 0 1.061 0l.833-.834a.75.75 0 0 0 .22-.53v-2.19l4.25-4.25.303.304a.75.75 0 0 0 1.06-1.061l-.833-.833-4.166-4.167zm-4.166 10 2.803 2.803.083-.084V12.5a.75.75 0 0 1 .22-.53l4.47-4.47L12.5 4.394l-4.47 4.47a.75.75 0 0 1-.53.22H5.311l-.083.083z"/></svg></template>
<script setup lang="ts">
/**
 * PushPin20 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>
