64 lines
1.5 KiB
JavaScript
Raw Normal View History

2024-08-02 18:19:39 +08:00
import { computed, defineComponent, h, inject, onMounted, ref, toRef, watch } from 'vue';
2024-01-29 09:26:07 +08:00
import { logInjectionKey } from "./context.mjs";
export default defineComponent({
props: {
line: {
type: String,
default: ''
}
},
setup(props) {
const {
trimRef,
highlightRef,
languageRef,
mergedHljsRef
2024-08-02 18:19:39 +08:00
} = inject(logInjectionKey);
2024-01-29 09:26:07 +08:00
const selfRef = ref(null);
const maybeTrimmedLinesRef = computed(() => {
return trimRef.value ? props.line.trim() : props.line;
});
function setInnerHTML() {
if (selfRef.value) {
selfRef.value.innerHTML = generateCodeHTML(languageRef.value, maybeTrimmedLinesRef.value);
}
}
function generateCodeHTML(language, code) {
const {
value: hljs
} = mergedHljsRef;
if (hljs) {
if (language && hljs.getLanguage(language)) {
return hljs.highlight(code, {
language
}).value;
}
}
return code;
}
onMounted(() => {
if (highlightRef.value) {
setInnerHTML();
}
});
watch(toRef(props, 'line'), () => {
if (highlightRef.value) {
setInnerHTML();
}
});
return {
highlight: highlightRef,
selfRef,
maybeTrimmedLines: maybeTrimmedLinesRef
};
},
render() {
const {
highlight,
maybeTrimmedLines
} = this;
return h("pre", {
ref: "selfRef"
}, highlight ? null : maybeTrimmedLines);
}
});