vue-codemirror6/dist/index.cjs.js

CodeMirror6 Component for vue2 and vue3.

/**
 * 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.22
 * @see {@link https://github.com/logue/vue-codemirror6}
 */

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