vue-files-preview
Version:
A tool for previewing files such as doc, excel, pdf, image, markdown, txt, audio, and video and so on.
1 lines • 1.93 kB
Source Map (JSON)
{"version":3,"file":"index.vue.mjs","sources":["../../../../../../packages/preview/supports/code-preview/index.vue"],"sourcesContent":["<script lang='ts' setup>\nimport {Codemirror} from 'vue-codemirror'\nimport {javascript} from '@codemirror/lang-javascript'\nimport {json} from '@codemirror/lang-json'\nimport {html} from '@codemirror/lang-html'\nimport {oneDark} from '@codemirror/theme-one-dark'\nimport type {PreviewProps} from '../../preview.interface'\nimport {getFileRenderByFile} from '../../utils/utils'\n\nconst props = withDefaults(\n defineProps<PreviewProps>(),\n {\n url: () => null,\n file: () => null,\n },\n)\n\nconst code = ref()\nconst extensions = [javascript(), json(), html(), oneDark]\n// Codemirror EditorView instance ref\nconst codeViewer = shallowRef()\n\nfunction handleReady(payload): void {\n codeViewer.value = payload.view\n}\n\nwatch(\n () => props.file,\n () => {\n getFileRenderByFile(props.file).then((render) => {\n code.value = render\n })\n },\n {\n immediate: true,\n },\n)\n</script>\n\n<template>\n <div class=\"code-preview\">\n <Codemirror\n v-model=\"code\" :autofocus=\"true\" :indent-with-tab=\"true\" :tab-size=\"2\"\n :extensions=\"extensions\" @ready=\"handleReady\"\n />\n </div>\n</template>\n\n<style scoped lang='scss'></style>\n"],"names":["props","__props","code","ref","extensions","javascript","json","html","oneDark","codeViewer","shallowRef","handleReady","payload","watch","getFileRenderByFile","render"],"mappings":";;;;;;;;;;;;;;;AASA,UAAMA,IAAQC,GAQRC,IAAOC,KACPC,IAAa,CAACC,EAAW,GAAGC,KAAQC,EAAA,GAAQC,CAAO,GAEnDC,IAAaC;AAEnB,aAASC,EAAYC,GAAe;AAClC,MAAAH,EAAW,QAAQG,EAAQ;AAAA,IAC7B;AAEA,WAAAC;AAAA,MACI,MAAMb,EAAM;AAAA,MACZ,MAAM;AACJ,QAAAc,EAAoBd,EAAM,IAAI,EAAE,KAAK,CAACe,MAAW;AAC/C,UAAAb,EAAK,QAAQa;AAAA,QAAA,CACd;AAAA,MACH;AAAA,MACA;AAAA,QACE,WAAW;AAAA,MACb;AAAA,IAAA;;;;;;;;;;;;;"}