<template><svg aria-hidden="true" :fill="color" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 32 32" width="32px" height="32px"><g clip-path="url(#ui_eye_32__a)"><path d="M16 7.667c3.504 0 6.573 2.037 8.68 3.92a25.3 25.3 0 0 1 3.222 3.497l.185.249.049.07.013.019.004.006.002.002c-.002.003-.046.033-.821.57l.821.57-.002.002q0 .003-.004.006l-.013.02-.05.069a23 23 0 0 1-.876 1.12 25 25 0 0 1-2.53 2.625c-2.107 1.884-5.176 3.922-8.68 3.922s-6.572-2.038-8.68-3.922a25.3 25.3 0 0 1-3.22-3.495q-.12-.16-.185-.25l-.05-.07-.013-.019-.004-.006-.001-.002h-.001l.822-.57c-.76-.525-.818-.566-.822-.57l.002-.002q0-.003.004-.006l.013-.02.05-.069a22 22 0 0 1 .876-1.12 25 25 0 0 1 2.53-2.625c2.108-1.884 5.176-3.92 8.68-3.921Zm0 2c-2.755 0-5.353 1.63-7.347 3.412A23.3 23.3 0 0 0 5.917 16a23.3 23.3 0 0 0 2.736 2.922c1.994 1.782 4.592 3.412 7.347 3.412s5.354-1.63 7.348-3.412A23.3 23.3 0 0 0 26.083 16a23.3 23.3 0 0 0-2.735-2.92C21.354 11.296 18.755 9.666 16 9.666Zm0 2.666a3.667 3.667 0 1 1-.002 7.334A3.667 3.667 0 0 1 16 12.333m0 2a1.668 1.668 0 0 0 0 3.333 1.666 1.666 0 0 0 0-3.333M4.667 16l-.822.57a1 1 0 0 1 0-1.138zm23.49-.568a1 1 0 0 1 0 1.137L27.333 16l.822-.568Z"/></g><defs><clipPath id="ui_eye_32__a"><path fill="#fff" d="M0 0h32v32H0z"/></clipPath></defs></svg></template>
<script setup lang="ts">
/**
 * Eye32 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>
