<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="M10.53 1.97a.75.75 0 0 0-1.06 0l-7.5 7.5a.75.75 0 1 0 1.06 1.06l.387-.386v6.606H2.5a.75.75 0 0 0 0 1.5h15a.75.75 0 0 0 0-1.5h-.917v-6.606l.387.386a.75.75 0 1 0 1.06-1.06zm4.553 14.78V8.644L10 3.561 4.91 8.65a1 1 0 0 1 .007.099v8h2.916v-3.417a.5.5 0 0 1 .5-.5h3.334a.5.5 0 0 1 .5.5v3.417zm-3.916 0v-2.917H8.833v2.917zm-5-8a.5.5 0 0 1 .5-.5H8.75a.5.5 0 0 1 .5.5v2.083a.5.5 0 0 1-.5.5H6.667a.5.5 0 0 1-.5-.5zm1 .5v1.083H8.25V9.25zm4.083-1a.5.5 0 0 0-.5.5v2.083a.5.5 0 0 0 .5.5h2.083a.5.5 0 0 0 .5-.5V8.75a.5.5 0 0 0-.5-.5zm.5 2.083V9.25h1.083v1.083z"/></svg></template>
<script setup lang="ts">
/**
 * House20 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>
