<template><svg aria-hidden="true" :fill="color" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20" width="20px" height="20px"><path d="M10 4.667c2.237 0 4.184 1.298 5.509 2.482a16 16 0 0 1 2.03 2.204q.076.1.116.158l.032.044q.006.008.01.012l.002.004.001.001v.001l.059.1a.75.75 0 0 1-.059.754L17.084 10l.616.428v.002q-.003 0-.004.004l-.009.012-.032.044-.116.158a16 16 0 0 1-2.03 2.203c-1.325 1.184-3.272 2.483-5.509 2.483-2.236 0-4.183-1.299-5.508-2.482a16 16 0 0 1-2.03-2.204l-.117-.158-.032-.044-.008-.012-.003-.004-.001-.002.616-.428-.616-.427V9.57l.004-.004.008-.012.032-.044a14 14 0 0 1 .553-.707c.375-.45.92-1.051 1.594-1.655C5.817 5.965 7.763 4.667 10 4.667m0 1.5c-1.675 0-3.27.993-4.509 2.1A14.4 14.4 0 0 0 3.857 10a14.5 14.5 0 0 0 1.634 1.732c1.24 1.108 2.834 2.102 4.509 2.102s3.27-.994 4.509-2.102c.607-.542 1.1-1.086 1.442-1.496q.106-.128.192-.236a14.5 14.5 0 0 0-1.634-1.732c-1.24-1.108-2.834-2.1-4.509-2.101m0 1.416a2.417 2.417 0 1 1-.002 4.834A2.417 2.417 0 0 1 10 7.583m0 1.5a.917.917 0 1 0 0 1.832.917.917 0 0 0 0-1.832M2.917 10l-.617.427a.75.75 0 0 1 0-.854z"/></svg></template>
<script setup lang="ts">
/**
 * Eye20 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>
