it-tools/src/ui/c-markdown/c-markdown.vue

21 lines
587 B
Vue

<script setup lang="ts">
import { marked } from 'marked';
import DomPurify from 'dompurify';
const props = withDefaults(defineProps<{ markdown?: string }>(), { markdown: '' });
const { markdown } = toRefs(props);
marked.use({
renderer: {
link(href, title, text) {
return `<a class="text-primary transition decoration-none hover:underline" href="${href}" target="_blank" rel="noopener">${text}</a>`;
},
},
});
const html = computed(() => DomPurify.sanitize(marked(markdown.value), { ADD_ATTR: ['target'] }));
</script>
<template>
<div v-html="html" />
</template>