<template><svg aria-hidden="true" :fill="color" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20" width="20px" height="20px"><path fill-rule="evenodd" d="M7.802 5.168a1.75 1.75 0 1 1 1.752-1.75v1.75zm-2.93 8.004a1.75 1.75 0 0 0 .296-.973v-1.752h-1.75a1.75 1.75 0 1 0 1.455 2.725m1.692-2.211a1.75 1.75 0 0 0-.513 1.238v4.384a1.75 1.75 0 0 0 3.501 0v-4.384a1.75 1.75 0 0 0-2.988-1.238M9.04 6.564a1.75 1.75 0 0 0-1.238-.513H3.418a1.75 1.75 0 0 0 0 3.501h4.384A1.75 1.75 0 0 0 9.04 6.564m5.792 1.238a1.751 1.751 0 1 1 1.75 1.752h-1.75zM13.437 9.04a1.75 1.75 0 0 0 .512-1.238V3.418a1.75 1.75 0 1 0-3.501 0v4.384a1.75 1.75 0 0 0 2.989 1.238m-1.238 5.792a1.751 1.751 0 1 1-1.752 1.75v-1.75zm-1.238-1.395a1.75 1.75 0 0 0 1.238.512h4.384a1.75 1.75 0 1 0 0-3.501h-4.384a1.75 1.75 0 0 0-1.238 2.989"/></svg></template>
<script setup lang="ts">
/**
 * SocialSlack20 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>
