UNPKG

vue-codemirror6

Version:

CodeMirror6 Component for vue2 and vue3.

14 lines (12 loc) 6.47 kB
/** * vue-codemirror6 * * @description CodeMirror6 Component for vue2 and vue3. * @author Logue <logue@hotmail.co.jp> * @copyright 2022-2025 By Masashi Yoshikawa All rights reserved. * @license MIT * @version 1.3.12 * @see {@link https://github.com/logue/vue-codemirror6} */ var CodeMirror=function(u,V,E,f,i,r,y,l){"use strict";const O={version:"1.3.12",date:"2025-03-31T11:10:32.144Z"},M=e=>e?Object.entries(e).reduce((c,[o,s])=>(o=o.charAt(0).toUpperCase()+o.slice(1),o=`on${o}`,{...c,[o]:s}),{}):{};function b(e,c={},o){if(l.isVue2)return l.h(e,c,o);const{props:s,domProps:t,on:v,...g}=c,h=v?M(v):{};return l.h(e,{...g,...s,...t,...h},o)}const B=e=>typeof e=="function"?e():e;var w=l.defineComponent({name:"CodeMirror",model:{prop:"modelValue",event:"update:modelValue"},props:{modelValue:{type:String,default:""},theme:{type:Object,default:()=>({})},dark:{type:Boolean,default:!1},basic:{type:Boolean,default:!1},minimal:{type:Boolean,default:!1},placeholder:{type:String,default:void 0},wrap:{type:Boolean,default:!1},tab:{type:Boolean,default:!1},indentUnit:{type:String,default:void 0},allowMultipleSelections:{type:Boolean,default:!1},tabSize:{type:Number,default:void 0},lineSeparator:{type:String,default:void 0},readonly:{type:Boolean,default:!1},disabled:{type:Boolean,default:!1},extensions:{type:Array,default:()=>[]},phrases:{type:Object,default:()=>{}},lang:{type:Object,default:()=>{}},linter:{type:Function,default:void 0},linterConfig:{type:Object,default:()=>({})},forceLinting:{type:Boolean,default:!1},gutter:{type:Boolean,default:!1},gutterConfig:{type:Object,default:()=>{}},tag:{type:String,default:"div"},scrollIntoView:{type:Boolean,default:!0}},emits:{"update:modelValue":(e="")=>!0,update:e=>!0,ready:e=>!0,focus:e=>!0,change:e=>!0,destroy:()=>!0},setup(e,c){const o=l.ref(),s=l.ref(e.modelValue),t=l.shallowRef(new r.EditorView),v=l.computed({get:()=>t.value.hasFocus,set:a=>{a&&t.value.focus()}}),g=l.computed({get:()=>t.value.state.selection,set:a=>t.value.dispatch({selection:a})}),h=l.computed({get:()=>t.value.state.selection.main.head,set:a=>t.value.dispatch({selection:{anchor:a}})}),j=l.computed({get:()=>t.value.state.toJSON(),set:a=>t.value.setState(i.EditorState.fromJSON(a))}),C=l.ref(0),m=l.ref(0),S=l.computed(()=>{const a=new i.Compartment,n=new i.Compartment;if(e.basic&&e.minimal)throw"[Vue CodeMirror] Both basic and minimal cannot be specified.";return[e.basic&&!e.minimal?y.basicSetup:void 0,e.minimal&&!e.basic?y.minimalSetup:void 0,r.EditorView.updateListener.of(d=>{c.emit("focus",t.value.hasFocus),C.value=t.value.state.doc?.length,!(d.changes.empty||!d.docChanged)&&(e.linter&&(e.forceLinting&&f.forceLinting(t.value),m.value=e.linter(t.value).length),c.emit("update",d))}),r.EditorView.theme(e.theme,{dark:e.dark}),e.wrap?r.EditorView.lineWrapping:void 0,e.tab?r.keymap.of([V.indentWithTab]):void 0,e.indentUnit?E.indentUnit.of(e.indentUnit):void 0,i.EditorState.allowMultipleSelections.of(e.allowMultipleSelections),e.tabSize?n.of(i.EditorState.tabSize.of(e.tabSize)):void 0,e.phrases?i.EditorState.phrases.of(e.phrases):void 0,i.EditorState.readOnly.of(e.readonly),r.EditorView.editable.of(!e.disabled),e.lineSeparator?i.EditorState.lineSeparator.of(e.lineSeparator):void 0,e.lang?a.of(e.lang):void 0,e.linter?f.linter(e.linter,e.linterConfig):void 0,e.linter&&e.gutter?f.lintGutter(e.gutterConfig):void 0,e.placeholder?r.placeholder(e.placeholder):void 0,...e.extensions].filter(d=>!!d)});l.watch(S,a=>{t.value?.dispatch({effects:i.StateEffect.reconfigure.of(a)})},{immediate:!0}),l.watch(()=>e.modelValue,async a=>{if(t.value.composing||t.value.state.doc.toJSON().join(e.lineSeparator??` `)===a)return;const n=!t.value.state.selection.ranges.every(d=>d.anchor<a.length&&d.head<a.length);t.value.dispatch({changes:{from:0,to:t.value.state.doc.length,insert:a},selection:n?{anchor:0,head:0}:t.value.state.selection,scrollIntoView:e.scrollIntoView})},{immediate:!0}),l.onMounted(async()=>{let a=s.value;o.value&&(o.value.childNodes[0]&&(s.value!==""&&console.warn("[CodeMirror.vue] The <code-mirror> tag contains child elements that overwrite the `v-model` values."),a=o.value.childNodes[0].innerText.trim()),t.value=new r.EditorView({parent:o.value,state:i.EditorState.create({doc:a,extensions:S.value}),dispatch:n=>{t.value.update([n]),!(n.changes.empty||!n.docChanged)&&(c.emit("update:modelValue",n.state.doc.toString()??""),c.emit("change",n.state))}}),await l.nextTick(),c.emit("ready",{view:t.value,state:t.value.state,container:o.value}))}),l.onUnmounted(()=>{t.value.destroy(),c.emit("destroy")});const _=()=>{!e.linter||!t.value||(e.forceLinting&&f.forceLinting(t.value),m.value=f.diagnosticCount(t.value.state))},L=()=>{t.value?.dispatch({effects:i.StateEffect.reconfigure.of([])}),t.value?.dispatch({effects:i.StateEffect.appendConfig.of(S.value)})},N=(a,n)=>t.value.state.sliceDoc(a,n),U=a=>t.value.state.doc.line(a+1).text,z=()=>t.value.state.doc.lines,R=()=>t.value.state.selection.main.head,T=()=>{let a;return(a=t.value.state.selection.ranges)!==null&&a!==void 0?a:[]},F=()=>{let a;return(a=t.value.state.sliceDoc(t.value.state.selection.main.from,t.value.state.selection.main.to))!==null&&a!==void 0?a:""},I=()=>{const a=t.value.state;return a?a.selection.ranges.map(n=>a.sliceDoc(n.from,n.to)):[]},J=()=>t.value.state.selection.ranges.some(a=>!a.empty),x=(a,n,d)=>t.value.dispatch({changes:{from:n,to:d,insert:a}}),A=a=>t.value.dispatch(t.value.state.replaceSelection(a)),P=a=>t.value.dispatch({selection:{anchor:a}}),W=(a,n)=>t.value.dispatch({selection:{anchor:a,head:n}}),G=(a,n)=>t.value.dispatch({selection:i.EditorSelection.create(a,n)}),Z=a=>t.value.dispatch({selection:i.EditorSelection.create(g.value.ranges.map(n=>n.extend(a(n))))}),p={editor:o,view:t,cursor:h,selection:g,focus:v,length:C,json:j,diagnosticCount:m,dom:t.value.contentDOM,lint:_,forceReconfigure:L,getRange:N,getLine:U,lineCount:z,getCursor:R,listSelections:T,getSelection:F,getSelections:I,somethingSelected:J,replaceRange:x,replaceSelection:A,setCursor:P,setSelection:W,setSelections:G,extendSelectionsBy:Z};return c.expose(p),p},render(){return b(this.$props.tag,{ref:"editor",class:"vue-codemirror"},this.$slots.default?b("aside",{style:"display: none;","aria-hidden":"true"},B(this.$slots.default)):void 0)}});const $=e=>e.component("CodeMirror",w);return u.Meta=O,u.default=w,u.install=$,Object.defineProperty(u,"__esModule",{value:!0}),u}({},commands,language,lint,state,view,codemirror,VueDemi);