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

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