<template><svg aria-hidden="true" :fill="color" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 32 32" width="32px" height="32px"><path fill-rule="evenodd" d="M17 4a1 1 0 1 0-2 0v1.731a7.67 7.67 0 0 0-6.666 7.538l-.657 5.258-.004.029L7.118 23h-.451a1 1 0 1 0 0 2H11.1a5.002 5.002 0 0 0 9.8 0h4.434a1 1 0 0 0 0-2h-.45l-1.217-9.731A7.67 7.67 0 0 0 17 5.73zM9.55 19.667 9.133 23h13.735l-1.193-9.543a1 1 0 0 1-.008-.124 5.667 5.667 0 0 0-11.333 0 1 1 0 0 1-.008.124l-.526 4.21h4.867a1 1 0 1 1 0 2zM16 27a3 3 0 0 1-2.829-2h5.659A3 3 0 0 1 16 27"/></svg></template>
<script setup lang="ts">
/**
 * Notification32 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>
