<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 0 0-2 0v1.527a2.68 2.68 0 0 0-1.274 1.08L4.165 5.014a1 1 0 1 0-.33 1.972l3.322.554L4.493 15H4a1 1 0 0 0-1 1 5 5 0 0 0 10 0 1 1 0 0 0-1-1h-.493L8.95 7.839l4.447.74c.191.863.8 1.569 1.603 1.894V27H9.333a1 1 0 1 0 0 2h13.334a1 1 0 1 0 0-2H17V10.473a2.68 2.68 0 0 0 1.275-1.08l4.882.814-2.664 7.46H20a1 1 0 0 0-1 1 5 5 0 1 0 10 0 1 1 0 0 0-1-1h-.493l-2.557-7.162 2.886.481a1 1 0 0 0 .329-1.972L18.604 7.42A2.67 2.67 0 0 0 17 5.527zM8 8.153 10.445 15h-4.89zM8 19a3 3 0 0 1-2.83-2h5.66A3 3 0 0 1 8 19m16-8.18 2.445 6.847h-4.89zm0 10.847a3 3 0 0 1-2.83-2h5.66a3 3 0 0 1-2.83 2"/></svg></template>
<script setup lang="ts">
/**
 * Comparator32 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>
