{"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,EAAA,GACPC,IAAa,CAACC,EAAA,GAAcC,KAAQC,EAAA,GAAQC,CAAO,GAEnDC,IAAaC,EAAA;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,QACf,CAAC;AAAA,MACH;AAAA,MACA;AAAA,QACE,WAAW;AAAA,MAAA;AAAA,IACb;;;;;;;;;;;;;"}