You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 
 
 
 
 

40 lines
1.3 KiB

import html from "html";
import { onMounted, ref } from "vue";
export default {
template: html`<template v-if="name.indexOf('ep-')===0">
<component :is="name" />
</template>
<template v-else>
<g v-html="svg" />
</template> `,
props: {
name: {
default: "file",
},
},
async setup(props) {
const svg = ref(null);
onMounted(async () => {
if (!props.name.startsWith("ep-")) {
try {
const url = `./assets/icons/${props.name}.svg`;
navigator.locks.request(url, async () => {
const response = await fetch(url);
if (response.ok && response.status === 200) {
svg.value = await response.text();
}
});
} catch (error) {
console.error(error);
if (!svg.value) {
svg.value = `<svg viewBox="0 0 1024 1024" xmlns="http://www.w3.org/2000/svg"><path fill="currentColor" d="M764.288 214.592 512 466.88 259.712 214.592a31.936 31.936 0 0 0-45.12 45.12L466.752 512 214.528 764.224a31.936 31.936 0 1 0 45.12 45.184L512 557.184l252.288 252.288a31.936 31.936 0 0 0 45.12-45.12L557.12 512.064l252.288-252.352a31.936 31.936 0 1 0-45.12-45.184z"></path></svg>`;
}
}
}
});
return {
svg,
};
},
};