<template><svg aria-hidden="true" :fill="color" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="24px" height="24px"><path fill-rule="evenodd" d="M4 12a8 8 0 1 1 16 0 8 8 0 0 1-16 0m8-10C6.477 2 2 6.477 2 12s4.477 10 10 10 10-4.477 10-10S17.523 2 12 2M8.227 13.333a.5.5 0 0 0-.943.334 5.002 5.002 0 0 0 9.431 0 .5.5 0 0 0-.943-.334 4.002 4.002 0 0 1-7.545 0m-.902-2.865a.5.5 0 0 0 .643-.293c.143-.38.54-.675 1.032-.675s.89.296 1.032.676a.5.5 0 0 0 .936-.351C10.674 9.039 9.893 8.5 9 8.5s-1.674.54-1.968 1.325a.5.5 0 0 0 .293.643m6.643-.293a.5.5 0 0 1-.936-.35C13.326 9.039 14.107 8.5 15 8.5s1.674.54 1.968 1.325a.5.5 0 0 1-.936.35c-.143-.38-.54-.675-1.032-.675s-.89.296-1.032.676"/></svg></template>
<script setup lang="ts">
/**
 * FeelingSatisfied24 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>
