<template><svg aria-hidden="true" :fill="color" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 48 48" width="48px" height="48px"><path fill-rule="evenodd" d="M24 4.5A1.5 1.5 0 0 1 25.5 6v16a1.5 1.5 0 0 1-3 0V6A1.5 1.5 0 0 1 24 4.5m-6.752 6.668a1.5 1.5 0 0 1-.416 2.08C13.995 15.14 9.5 19.245 9.5 26c0 6.828 5.476 14.5 14.5 14.5S38.5 32.828 38.5 26c0-6.755-4.495-10.86-7.332-12.752a1.5 1.5 0 0 1 1.664-2.496C35.995 12.86 41.5 17.755 41.5 26c0 8.172-6.524 17.5-17.5 17.5S6.5 34.173 6.5 26c0-8.245 5.505-13.14 8.668-15.248a1.5 1.5 0 0 1 2.08.416"/></svg></template>
<script setup lang="ts">
/**
 * Connect48 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>
