<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="M6 4.5A1.5 1.5 0 0 0 4.5 6v8a1.5 1.5 0 0 0 3 0V7.5H14a1.5 1.5 0 0 0 0-3zm28 0a1.5 1.5 0 0 0 0 3h6.5V14a1.5 1.5 0 0 0 3 0V6A1.5 1.5 0 0 0 42 4.5zM7.5 34a1.5 1.5 0 0 0-3 0v8A1.5 1.5 0 0 0 6 43.5h8a1.5 1.5 0 0 0 0-3H7.5zm36 0a1.5 1.5 0 0 0-3 0v6.5H34a1.5 1.5 0 0 0 0 3h8a1.5 1.5 0 0 0 1.5-1.5zM23.244 8.704a1.5 1.5 0 0 1 1.512 0l12 7A1.5 1.5 0 0 1 37.5 17v14a1.5 1.5 0 0 1-.744 1.296l-12 7a1.5 1.5 0 0 1-1.512 0l-12-7A1.5 1.5 0 0 1 10.5 31V17a1.5 1.5 0 0 1 .744-1.296zM13.5 30.138V19.033l9.5 5.541V35.68zm21 0L25 35.68V24.574l9.5-5.541zM24 11.737l9.52 5.552L24 22.842l-9.52-5.553z"/></svg></template>
<script setup lang="ts">
/**
 * ViewAr48 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>
