43 lines
1.4 KiB
Vue

<script setup>
import { ref, computed } from 'vue'
const props = defineProps({
title: String,
height: Number,
width: Number,
})
// variables
const heightNumber = ref(24)
const widthNumber = ref(24)
if (!Number.isNaN(props.height) && typeof props.height !== "undefined") {
heightNumber.value = Number.parseInt(props.height)
} else if (typeof props.height === "undefined" && (!Number.isNaN(props.width) && typeof props.width !== "undefined")) {
heightNumber.value = Number.parseInt(props.width)
}
if (!Number.isNaN(props.width) && typeof props.width !== "undefined") {
widthNumber.value = Number.parseInt(props.width)
} else if (typeof props.width === "undefined" && (!Number.isNaN(props.height) && typeof props.height !== "undefined")) {
widthNumber.value = Number.parseInt(props.height)
}
// computed
const titleString = computed(() => {
if (typeof props.title === "string" && props.title.trim().length > 0) {
return props.title.trim()
}
return ""
})
</script>
<template>
<svg viewBox="0 0 24 24" :height="heightNumber" :width="widthNumber" stroke="currentColor" stroke-width="2" fill="none" stroke-linecap="round" stroke-linejoin="round" preserveAspectRatio="xMidYMid meet">
<title v-if="titleString.length > 0" v-html="title"></title>
<path d="M18 13v6a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V8a2 2 0 0 1 2-2h6"></path>
<polyline points="15 3 21 3 21 9"></polyline>
<line x1="10" y1="14" x2="21" y2="3"></line>
</svg>
</template>