codemirror-editor-vue3 - npm Package Compare versions

Comparing version 1.1.0-beta7 to 1.1.0-beta8

dist/codemirror-editor-vue3.es.js

 var __defProp = Object.defineProperty;
+var __defProps = Object.defineProperties;
+var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
 var __getOwnPropSymbols = Object.getOwnPropertySymbols;
@@ -17,5 +19,6 @@ var __hasOwnProp = Object.prototype.hasOwnProperty;
 };
-import { defineComponent, ref, onMounted, createVNode, markRaw, watch, unref, nextTick, getCurrentInstance, onBeforeUnmount, withDirectives, resolveComponent, resolveDirective } from "vue";
+var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
+import _CodeMirror from "codemirror";
+import { defineComponent, ref, onMounted, markRaw, watch, unref, openBlock, createElementBlock, nextTick, getCurrentInstance, onBeforeUnmount, normalizeClass, normalizeStyle, createBlock, resolveDynamicComponent, mergeProps } from "vue";
 import "codemirror/lib/codemirror.css";
-import _CodeMirror from "codemirror";
 import "codemirror/addon/merge/merge.css";
@@ -25,4 +28,11 @@ import "codemirror/addon/merge/merge.js";
 import "codemirror/addon/mode/simple.js";
-const CodeMirror$2 = window.CodeMirror || _CodeMirror;
-var Default = defineComponent({
+var _export_sfc = (sfc, props) => {
+  const target = sfc.__vccOpts || sfc;
+  for (const [key, val] of props) {
+    target[key] = val;
+  }
+  return target;
+};
+const CodeMirror$3 = window.CodeMirror || _CodeMirror;
+const _sfc_main$3 = defineComponent({
   name: "defaultMode",
@@ -59,9 +69,7 @@ props: {
   },
-  setup(props, {
-    emit
-  }) {
+  setup(props, { emit }) {
     const textarea = ref();
     const _cminstance = ref(null);
     const initialize = () => {
-      _cminstance.value = markRaw(CodeMirror$2.fromTextArea(textarea.value, props.options));
+      _cminstance.value = markRaw(CodeMirror$3.fromTextArea(textarea.value, props.options));
       emit("update:cminstance", _cminstance.value);
@@ -73,5 +81,3 @@ let unwatch = watch(() => props.cminstance, (val, oldVal) => {
         unwatch == null ? void 0 : unwatch();
-      }, {
-        deep: true
-      });
+      }, { deep: true });
     };
@@ -81,10 +87,18 @@ onMounted(() => {
     });
-    return () => createVNode("textarea", {
-      "ref": "textarea",
-      "name": "{props.name}",
-      "placeholder": "{props.placeholder}"
-    }, null);
+    return {
+      textarea,
+      initialize
+    };
   }
 });
-const CodeMirror$1 = (window == null ? void 0 : window.CodeMirror) || _CodeMirror;
+const _hoisted_1$2 = ["name", "placeholder"];
+function _sfc_render$3(_ctx, _cache, $props, $setup, $data, $options) {
+  return openBlock(), createElementBlock("textarea", {
+    ref: "textarea",
+    name: _ctx.$props.name,
+    placeholder: _ctx.$props.placeholder
+  }, null, 8, _hoisted_1$2);
+}
+var Default = /* @__PURE__ */ _export_sfc(_sfc_main$3, [["render", _sfc_render$3]]);
+const CodeMirror$2 = (window == null ? void 0 : window.CodeMirror) || _CodeMirror;
 window.diff_match_patch = DiffMatchPatch;
@@ -94,3 +108,3 @@ window.DIFF_DELETE = -1;
 window.DIFF_EQUAL = 0;
-var Merge = defineComponent({
+const _sfc_main$2 = defineComponent({
   name: "mergeMode",
@@ -108,9 +122,7 @@ props: {
   emits: ["update:cminstance", "ready"],
-  setup(props, {
-    emit
-  }) {
+  setup(props, { emit }) {
     const _cminstance = ref();
     const mergeView = ref();
     const initialize = () => {
-      _cminstance.value = markRaw(CodeMirror$1.MergeView(mergeView.value, props.options));
+      _cminstance.value = markRaw(CodeMirror$2.MergeView(mergeView.value, props.options));
       emit("update:cminstance", _cminstance.value);
@@ -122,7 +134,12 @@ emit("ready", _cminstance);
     });
-    return () => createVNode("div", {
-      "ref": "mergeView"
-    }, null);
+    return {
+      initialize
+    };
   }
 });
+const _hoisted_1$1 = { ref: "mergeView" };
+function _sfc_render$2(_ctx, _cache, $props, $setup, $data, $options) {
+  return openBlock(), createElementBlock("div", _hoisted_1$1, null, 512);
+}
+var Merge = /* @__PURE__ */ _export_sfc(_sfc_main$2, [["render", _sfc_render$2]]);
 var errorType;
@@ -278,4 +295,4 @@ (function(errorType2) {
 });
-const CodeMirror = window.CodeMirror || _CodeMirror;
-var FcLog = defineComponent({
+const CodeMirror$1 = window.CodeMirror || _CodeMirror;
+const _sfc_main$1 = defineComponent({
   name: "codemirror-fclog",
@@ -305,5 +322,3 @@ props: {
   emits: ["update:cminstance", "ready"],
-  setup(props, {
-    emit
-  }) {
+  setup(props, { emit }) {
     const textarea = ref();
@@ -318,5 +333,3 @@ const _cminstance = ref(null);
         const mark = linkMarks[_i];
-        cminstance.markText(cminstance.posFromIndex(mark.start), cminstance.posFromIndex(mark.end), {
-          replacedWith: mark.node
-        });
+        cminstance.markText(cminstance.posFromIndex(mark.start), cminstance.posFromIndex(mark.end), { replacedWith: mark.node });
       }
@@ -326,3 +339,3 @@ };
       var _a;
-      _cminstance.value = markRaw(CodeMirror.fromTextArea(textarea.value, props.options));
+      _cminstance.value = markRaw(CodeMirror$1.fromTextArea(textarea.value, props.options));
       emit("update:cminstance", unref(_cminstance));
@@ -338,22 +351,54 @@ (_a = _cminstance.value) == null ? void 0 : _a.on("change", renderTextMark);
       }
-    }, {
-      deep: true,
-      immediate: true
-    });
+    }, { deep: true, immediate: true });
     onMounted(() => {
       initialize();
     });
-    return () => createVNode("textarea", {
-      "ref": "textarea",
-      "name": props.name,
-      "placeholder": props.placeholder
-    }, null);
+    return {
+      initialize,
+      textarea
+    };
   }
 });
+const _hoisted_1 = ["name", "placeholder"];
+function _sfc_render$1(_ctx, _cache, $props, $setup, $data, $options) {
+  return openBlock(), createElementBlock("textarea", {
+    ref: "textarea",
+    name: _ctx.$props.name,
+    placeholder: _ctx.$props.placeholder
+  }, null, 8, _hoisted_1);
+}
+var FcLog = /* @__PURE__ */ _export_sfc(_sfc_main$1, [["render", _sfc_render$1]]);
 const componentsEvts = {
   "update:value": (value) => value,
-  change: (value, cm) => null,
-  input: (value) => "",
+  change: (value, cm) => ({ value, cm }),
+  input: (value) => value,
   ready: (cm) => cm
 };
+const cmEvts = [
+  "changes",
+  "scroll",
+  "beforeChange",
+  "cursorActivity",
+  "keyHandled",
+  "inputRead",
+  "electricInput",
+  "beforeSelectionChange",
+  "viewportChange",
+  "swapDoc",
+  "gutterClick",
+  "gutterContextMenu",
+  "focus",
+  "blur",
+  "refresh",
+  "optionChange",
+  "scrollCursorIntoView",
+  "update"
+];
+const getCmEvts = () => {
+  let result = {};
+  cmEvts.forEach((name) => {
+    result[name] = (...args) => void 0;
+  });
+  return result;
+};
 const DEFAULT_OPTIONS = {
@@ -370,2 +415,50 @@ mode: "text",
 };
+function scrollToEnd(cm) {
+  Promise.resolve().then(() => {
+    let nowScrollInfo = cm.getScrollInfo();
+    cm.scrollTo(nowScrollInfo.left, nowScrollInfo.height);
+  });
+}
+const useEvents = ({
+  props,
+  cminstance,
+  emit,
+  internalInstance,
+  content
+}) => {
+  const getBindEvents = () => {
+    let evts = [];
+    Object.keys(internalInstance == null ? void 0 : internalInstance.vnode.props).forEach((v) => {
+      if (v.startsWith("on")) {
+        let e = v.replace(v[2], v[2].toLowerCase()).slice(2);
+        !componentsEvts[e] && evts.push(e);
+      }
+    });
+    return evts;
+  };
+  const listenerEvents = () => {
+    cminstance.value.on("change", (cm) => {
+      const currentVal = cm.getValue();
+      if (currentVal == content.value)
+        return;
+      content.value = currentVal;
+      emit("update:value", content.value);
+      emit("input", content.value);
+      Promise.resolve().then(() => {
+        emit("change", content.value, cm);
+      });
+      props.KeepCursorInEnd && scrollToEnd(cm);
+    });
+    const tmpEvents = {};
+    const bindEvts = getBindEvents();
+    bindEvts.filter((e) => !tmpEvents[e] && (tmpEvents[e] = true)).forEach((event) => {
+      cminstance.value.on(event, (...args) => {
+        emit(event, ...args);
+      });
+    });
+  };
+  return {
+    listenerEvents
+  };
+};
 function useViewControl({
@@ -380,15 +473,25 @@ props,
     nextTick(() => {
-      cminstance.value.refresh();
+      var _a;
+      (_a = cminstance.value) == null ? void 0 : _a.refresh();
     });
   };
   const resize = (width = props.width, height = props.height) => {
+    var _a;
     containerWidth.value = String(width).replace("px", "");
     containerHeight.value = String(height).replace("px", "");
     let cmHeight = containerHeight.value;
-    cminstance.value.setSize(containerWidth.value, cmHeight);
+    (_a = cminstance.value) == null ? void 0 : _a.setSize(containerWidth.value, cmHeight);
   };
   const destroy = () => {
-    const element = cminstance.value.doc.cm.getWrapperElement();
+    var _a;
+    const element = (_a = cminstance.value) == null ? void 0 : _a.getWrapperElement();
     element == null ? void 0 : element.remove();
   };
+  const reload = () => {
+    var _a, _b, _c;
+    const history = (_a = cminstance.value) == null ? void 0 : _a.getDoc().getHistory();
+    (_b = presetRef.value) == null ? void 0 : _b.initialize();
+    destroy();
+    (_c = cminstance.value) == null ? void 0 : _c.getDoc().setHistory(history);
+  };
   const isStyleChaotic = () => {
@@ -412,2 +515,3 @@ const gutterEl = document.querySelector(".CodeMirror-gutters");
   return {
+    reload,
     refresh,
@@ -443,3 +547,3 @@ resize,
 }
-var Codemirror = defineComponent({
+const _sfc_main = defineComponent({
   name: "CodemirrorEditor",
@@ -455,3 +559,6 @@ props: {
     },
-    unseenLines: Array,
+    unseenLines: {
+      type: Array,
+      default: () => []
+    },
     name: {
@@ -494,3 +601,3 @@ type: String,
   },
-  emits: __spreadValues({}, componentsEvts),
+  emits: __spreadValues(__spreadValues({}, componentsEvts), getCmEvts()),
   components: {
@@ -501,6 +608,4 @@ Default,
   },
-  setup(props, {
-    emit,
-    attrs
-  }) {
+  setup(props, { emit, attrs }) {
+    var _a, _b;
     const cminstance = ref(null);
@@ -512,9 +617,3 @@ const content = ref("");
     const presetRef = ref(null);
-    const {
-      refresh,
-      resize,
-      destroy,
-      containerHeight,
-      reviseStyle
-    } = useViewControl({
+    const { refresh, resize, destroy, containerHeight, reviseStyle } = useViewControl({
       props,
@@ -524,8 +623,15 @@ cminstance,
     });
+    const { listenerEvents } = useEvents({
+      props,
+      cminstance,
+      emit,
+      internalInstance,
+      content
+    });
     const unseenLineMarkers = () => {
       if (props.unseenLines !== void 0 && props.marker !== void 0) {
         props.unseenLines.forEach((line) => {
-          var _a, _b;
-          const info = (_a = cminstance.value) == null ? void 0 : _a.lineInfo(line);
-          (_b = cminstance.value) == null ? void 0 : _b.setGutterMarker(line, "breakpoints", (info == null ? void 0 : info.gutterMarkers) ? null : props.marker());
+          var _a2, _b2;
+          const info = (_a2 = cminstance.value) == null ? void 0 : _a2.lineInfo(line);
+          (_b2 = cminstance.value) == null ? void 0 : _b2.setGutterMarker(line, "breakpoints", (info == null ? void 0 : info.gutterMarkers) ? null : props.marker());
         });
@@ -535,6 +641,6 @@ }
     const onCodeChange = (newVal) => {
-      var _a, _b;
-      const cm_value = (_a = cminstance.value) == null ? void 0 : _a.getValue();
+      var _a2, _b2;
+      const cm_value = (_a2 = cminstance.value) == null ? void 0 : _a2.getValue();
       if (newVal !== cm_value) {
-        (_b = cminstance.value) == null ? void 0 : _b.setValue(newVal);
+        (_b2 = cminstance.value) == null ? void 0 : _b2.setValue(newVal);
         content.value = newVal;
@@ -545,2 +651,11 @@ reviseStyle();
     };
+    const ready = (cm) => {
+      listenerEvents();
+      unseenLineMarkers();
+      resize();
+      emit("ready", cminstance.value);
+      watch([() => props.height, () => props.width], ([height, width]) => {
+        resize(height, width);
+      }, { deep: true });
+    };
     const handlePresetModeName = () => {
@@ -558,9 +673,7 @@ if (props.options.mode == "fclog" || props.options.mode == "log") {
     watch(() => props.options, (val) => {
-      var _a;
+      var _a2;
       for (const key in props.options) {
-        (_a = cminstance.value) == null ? void 0 : _a.setOption(key, val[key]);
+        (_a2 = cminstance.value) == null ? void 0 : _a2.setOption(key, val[key]);
       }
-    }, {
-      deep: true
-    });
+    }, { deep: true });
     watch(() => props.value, (val) => {
@@ -571,42 +684,61 @@ onCodeChange(val);
       handlePresetModeName();
-    }, {
-      immediate: true
-    });
+    }, { immediate: true });
     onBeforeUnmount(() => {
       destroy();
     });
-    return () => {
-      var _a, _b;
-      return createVNode("div", {
-        "class": ["codemirror-container", props.merge && "merge", (props.border || props.merge) && "bordered", (!props.width || props.width == "100%") && "width-auto", (!props.height || props.height == "100%") && "height-auto"],
-        "style": {
-          height: containerHeight + "px"
-        }
-      }, [withDirectives(createVNode(resolveComponent("component"), {
-        "style": "height: 100%",
-        "is": presetModeName,
-        "ref": "presetRef",
-        "cminstance": cminstance,
-        "onUpdate:cminstance": ($event) => cminstance = $event,
-        "options": cmOptions,
-        "name": props.name || ((_b = (_a = internalInstance == null ? void 0 : internalInstance.parent) == null ? void 0 : _a.type) == null ? void 0 : _b.name) || void 0,
-        "content": content
-      }, null), [[resolveDirective("on-ready"), "ready"], [resolveDirective("bind"), props, attrs]])]);
+    return {
+      presetModeName,
+      cmOptions,
+      cminstance,
+      content,
+      ready,
+      resize,
+      refresh,
+      containerHeight,
+      instanceName: props.name || ((_b = (_a = internalInstance == null ? void 0 : internalInstance.parent) == null ? void 0 : _a.type) == null ? void 0 : _b.name) || void 0,
+      presetRef
     };
   }
 });
-var index = "";
-Codemirror.install = (app, config) => {
+function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
+  return openBlock(), createElementBlock("div", {
+    class: normalizeClass(["codemirror-container", {
+      merge: _ctx.$props.merge,
+      bordered: _ctx.$props.border || _ctx.$props.merge,
+      "width-auto": !_ctx.$props.width || _ctx.$props.width == "100%",
+      "height-auto": !_ctx.$props.height || _ctx.$props.height == "100%"
+    }]),
+    style: normalizeStyle({
+      height: _ctx.containerHeight + "px"
+    })
+  }, [
+    (openBlock(), createBlock(resolveDynamicComponent(_ctx.presetModeName), mergeProps({
+      style: { "height": "100%" },
+      ref: "presetRef",
+      cminstance: _ctx.cminstance,
+      "onUpdate:cminstance": _cache[0] || (_cache[0] = ($event) => _ctx.cminstance = $event)
+    }, __spreadProps(__spreadValues(__spreadValues({}, _ctx.$props), _ctx.$attrs), {
+      options: _ctx.cmOptions,
+      name: _ctx.instanceName,
+      content: _ctx.content
+    }), { onReady: _ctx.ready }), null, 16, ["cminstance", "onReady"]))
+  ], 6);
+}
+var codemirror = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render]]);
+var index$1 = "";
+const CodeMirror = window.CodeMirror || _CodeMirror;
+const install = (app, config) => {
   if (config) {
     if (config.options) {
-      Codemirror.props.globalOptions.default = () => config.options;
+      codemirror.props.globalOptions.default = () => config.options;
     }
     if (config.events) {
-      Codemirror.props.globalEvents.default = () => config.events;
+      codemirror.props.globalEvents.default = () => config.events;
     }
   }
-  app.component("Codemirror", Codemirror);
+  app.component("Codemirror", codemirror);
   return app;
 };
+var index = { CodeMirror, codemirror, install };
 function styleInject(css,ref){if(ref===void 0){ref={}}var insertAt=ref.insertAt;if(!css||typeof document==="undefined"){return}var head=document.head||document.getElementsByTagName("head")[0];var style=document.createElement("style");style.type="text/css";if(insertAt==="top"){if(head.firstChild){head.insertBefore(style,head.firstChild)}else{head.appendChild(style)}}else{head.appendChild(style)}if(style.styleSheet){style.styleSheet.cssText=css}else{style.appendChild(document.createTextNode(css))}};styleInject(``);
-export { Codemirror, createLinkMark, createLog, createLogMark, createTitle, Codemirror as default, getLinkMark, getLocalTime, getLogMark };
+export { CodeMirror, codemirror, createLinkMark, createLog, createLogMark, createTitle, index as default, getLinkMark, getLocalTime, getLogMark, install };

dist/codemirror-editor-vue3.umd.js

@@ -1,7 +0,7 @@
-var Q=Object.defineProperty;var D=Object.getOwnPropertySymbols;var X=Object.prototype.hasOwnProperty,Y=Object.prototype.propertyIsEnumerable;var $=(a,t,g)=>t in a?Q(a,t,{enumerable:!0,configurable:!0,writable:!0,value:g}):a[t]=g,j=(a,t)=>{for(var g in t||(t={}))X.call(t,g)&&$(a,g,t[g]);if(D)for(var g of D(t))Y.call(t,g)&&$(a,g,t[g]);return a};(function(a,t){typeof exports=="object"&&typeof module!="undefined"?t(exports,require("vue"),require("codemirror/lib/codemirror.css"),require("codemirror"),require("codemirror/addon/merge/merge.css"),require("codemirror/addon/merge/merge.js"),require("diff-match-patch"),require("codemirror/addon/mode/simple.js")):typeof define=="function"&&define.amd?define(["exports","vue","codemirror/lib/codemirror.css","codemirror","codemirror/addon/merge/merge.css","codemirror/addon/merge/merge.js","diff-match-patch","codemirror/addon/mode/simple.js"],t):(a=typeof globalThis!="undefined"?globalThis:a||self,t(a["codemirror-editor-vue3"]={},a.Vue,null,a.codemirror,null,null,a.DiffMatchPatch))})(this,function(a,t,g,I,ee,te,A){"use strict";function L(e){return e&&typeof e=="object"&&"default"in e?e:{default:e}}var x=L(I),V=L(A);const F=window.CodeMirror||x.default;var R=t.defineComponent({name:"defaultMode",props:{name:{type:String,default:`cm-textarea-${+new Date}`},value:{type:String,default:""},content:{type:String,default:""},options:{type:Object,default:()=>({})},cminstance:{type:Object,default:()=>null},placeholder:{type:String,default:""}},emits:{ready:e=>e,"update:cminstance":e=>e},setup(e,{emit:r}){const l=t.ref(),n=t.ref(null),o=()=>{n.value=t.markRaw(F.fromTextArea(l.value,e.options)),r("update:cminstance",n.value);let i=t.watch(()=>e.cminstance,(c,m)=>{var u;c&&((u=e.cminstance)==null||u.setValue(e.value||e.content)),r("ready",t.unref(n)),i==null||i()},{deep:!0})};return t.onMounted(()=>{o()}),()=>t.createVNode("textarea",{ref:"textarea",name:"{props.name}",placeholder:"{props.placeholder}"},null)}});const q=(window==null?void 0:window.CodeMirror)||x.default;window.diff_match_patch=V.default,window.DIFF_DELETE=-1,window.DIFF_INSERT=1,window.DIFF_EQUAL=0;var H=t.defineComponent({name:"mergeMode",props:{options:{type:Object,default:()=>({})},cminstance:{type:Object,default:()=>({})}},emits:["update:cminstance","ready"],setup(e,{emit:r}){const l=t.ref(),n=t.ref(),o=()=>{l.value=t.markRaw(q.MergeView(n.value,e.options)),r("update:cminstance",l.value),r("ready",l)};return t.onMounted(()=>{o()}),()=>t.createVNode("div",{ref:"mergeView"},null)}}),C;(function(e){e.info="info",e.warning="warning",e.error="error"})(C||(C={}));function T(){const e=new Date,r=e.getHours()<10?"0"+e.getHours():e.getHours(),l=e.getMinutes()<10?"0"+e.getMinutes():e.getMinutes(),n=e.getSeconds()<10?"0"+e.getSeconds():e.getSeconds();return`${r}:${l}:${n}`}function P(e){return`#link#${JSON.stringify(e)}#link#`}function E(e){const r=/#link#(.+)#link#/g;let l=[],n;for(n=r.exec(e);n;){const o=document.createElement("a"),i=JSON.parse(n[1]),c=Object.entries(i);for(let[m,u]of c)o.setAttribute(m,u);o.className="editor_custom_link",o.innerHTML="logDownload",l.push({start:n.index,end:n.index+n[0].length,node:o}),n=r.exec(e)}return l}function z(e="",r="info"){return`#log<${r}>log#${e}#log<${r}>log#`}function N(e){let r=[];function l(){const n=new RegExp(`#log<(\\w*)>log#((.|\r
+var $e=Object.defineProperty,ve=Object.defineProperties;var Me=Object.getOwnPropertyDescriptors;var V=Object.getOwnPropertySymbols;var be=Object.prototype.hasOwnProperty,_e=Object.prototype.propertyIsEnumerable;var F=(i,m,t)=>m in i?$e(i,m,{enumerable:!0,configurable:!0,writable:!0,value:t}):i[m]=t,M=(i,m)=>{for(var t in m||(m={}))be.call(m,t)&&F(i,t,m[t]);if(V)for(var t of V(m))_e.call(m,t)&&F(i,t,m[t]);return i},H=(i,m)=>ve(i,Me(m));(function(i,m){typeof exports=="object"&&typeof module!="undefined"?m(exports,require("codemirror"),require("vue"),require("codemirror/lib/codemirror.css"),require("codemirror/addon/merge/merge.css"),require("codemirror/addon/merge/merge.js"),require("diff-match-patch"),require("codemirror/addon/mode/simple.js")):typeof define=="function"&&define.amd?define(["exports","codemirror","vue","codemirror/lib/codemirror.css","codemirror/addon/merge/merge.css","codemirror/addon/merge/merge.js","diff-match-patch","codemirror/addon/mode/simple.js"],m):(i=typeof globalThis!="undefined"?globalThis:i||self,m(i["codemirror-editor-vue3"]={},i.codemirror,i.Vue,null,null,null,i.DiffMatchPatch))})(this,function(i,m,t,Ce,Ee,Se,P){"use strict";function O(e){return e&&typeof e=="object"&&"default"in e?e:{default:e}}var v=O(m),z=O(P),E=(e,r)=>{const a=e.__vccOpts||e;for(const[n,o]of r)a[n]=o;return a};const q=window.CodeMirror||v.default,U=t.defineComponent({name:"defaultMode",props:{name:{type:String,default:`cm-textarea-${+new Date}`},value:{type:String,default:""},content:{type:String,default:""},options:{type:Object,default:()=>({})},cminstance:{type:Object,default:()=>null},placeholder:{type:String,default:""}},emits:{ready:e=>e,"update:cminstance":e=>e},setup(e,{emit:r}){const a=t.ref(),n=t.ref(null),o=()=>{n.value=t.markRaw(q.fromTextArea(a.value,e.options)),r("update:cminstance",n.value);let l=t.watch(()=>e.cminstance,(c,u)=>{var f;c&&((f=e.cminstance)==null||f.setValue(e.value||e.content)),r("ready",t.unref(n)),l==null||l()},{deep:!0})};return t.onMounted(()=>{o()}),{textarea:a,initialize:o}}}),W=["name","placeholder"];function J(e,r,a,n,o,l){return t.openBlock(),t.createElementBlock("textarea",{ref:"textarea",name:e.$props.name,placeholder:e.$props.placeholder},null,8,W)}var K=E(U,[["render",J]]);const G=(window==null?void 0:window.CodeMirror)||v.default;window.diff_match_patch=z.default,window.DIFF_DELETE=-1,window.DIFF_INSERT=1,window.DIFF_EQUAL=0;const Z=t.defineComponent({name:"mergeMode",props:{options:{type:Object,default:()=>({})},cminstance:{type:Object,default:()=>({})}},emits:["update:cminstance","ready"],setup(e,{emit:r}){const a=t.ref(),n=t.ref(),o=()=>{a.value=t.markRaw(G.MergeView(n.value,e.options)),r("update:cminstance",a.value),r("ready",a)};return t.onMounted(()=>{o()}),{initialize:o}}}),Q={ref:"mergeView"};function X(e,r,a,n,o,l){return t.openBlock(),t.createElementBlock("div",Q,null,512)}var Y=E(Z,[["render",X]]),j;(function(e){e.info="info",e.warning="warning",e.error="error"})(j||(j={}));function L(){const e=new Date,r=e.getHours()<10?"0"+e.getHours():e.getHours(),a=e.getMinutes()<10?"0"+e.getMinutes():e.getMinutes(),n=e.getSeconds()<10?"0"+e.getSeconds():e.getSeconds();return`${r}:${a}:${n}`}function ee(e){return`#link#${JSON.stringify(e)}#link#`}function T(e){const r=/#link#(.+)#link#/g;let a=[],n;for(n=r.exec(e);n;){const o=document.createElement("a"),l=JSON.parse(n[1]),c=Object.entries(l);for(let[u,f]of c)o.setAttribute(u,f);o.className="editor_custom_link",o.innerHTML="logDownload",a.push({start:n.index,end:n.index+n[0].length,node:o}),n=r.exec(e)}return a}function te(e="",r="info"){return`#log<${r}>log#${e}#log<${r}>log#`}function D(e){let r=[];function a(){const n=new RegExp(`#log<(\\w*)>log#((.|\r
 |
 )*?)#log<(\\w*)>log#`,"g");let o;for(o=n.exec(e);o;){let c=o[0].replace(/\r\n/g,`
 `).split(`
-`),u=o[2].replace(/\r\n/g,`
+`),f=o[2].replace(/\r\n/g,`
 `).split(`
-`);const k=document.createElement("span");let d=o[1];k.className=`c-editor--log__${d}`;let s=0;for(let y=0;y<c.length;y++){let S=c[y],O=u[y],_=k.cloneNode(!1);_.innerText=O,r.push({start:o.index+s,end:o.index+s+S.length,node:_}),s=s+S.length+1}o=n.exec(e)}}return l(),r}function B(e,r=""){return`[${T()}] <${r}> ${e}`}function U(e="",r=20,l="="){const n=Math.floor(1.5*e.length/2),i=new Array(Math.max(r-n,5)).join(l);return`${i}${e}${i}`}const b=[{regex:/(\[.*?\])([ \t]*)(<error>[ \t])(.+)/,token:["tag","","error.strong","error.strong"],sol:!0},{regex:/(\[.*?\])([ \t]*)(<info>)(.+)(.?)/,token:["tag","","bracket","bracket","hr"],sol:!0},{regex:/(\[.*?\])([ \t]*)(<warning>)(.+)(.?)/,token:["tag","","comment","comment","hr"],sol:!0}];x.default.defineSimpleMode("fclog",{start:[...b,{regex:/.*/,token:"hr"}],error:[...b,{regex:/.*/,token:"error.strong"}],info:[...b,{regex:/.*/,token:"bracket"}],warning:[...b,{regex:/.*\[/,token:"comment"}]}),x.default.defineSimpleMode("log",{start:[{regex:/^[=]+[^=]*[=]+/,token:"strong"},{regex:/([^\w])([A-Z][\w]*)/,token:["","string"]},{regex:/(^[A-Z][\w]*)/,token:"string"}]});const J=window.CodeMirror||x.default;var W=t.defineComponent({name:"codemirror-fclog",props:{value:{type:String,default:""},name:{type:String,default:`cm-textarea-${+new Date}`},options:{type:Object,default:()=>({})},cminstance:{type:Object,default:()=>({})},placeholder:{type:String,default:""}},emits:["update:cminstance","ready"],setup(e,{emit:r}){const l=t.ref(),n=t.ref(null),o=(c=e.cminstance)=>{c.getAllMarks().forEach(d=>d.clear());const u=c.getValue(),k=[].concat(E(u)).concat(N(u));for(let d=0;d<k.length;d++){const s=k[d];c.markText(c.posFromIndex(s.start),c.posFromIndex(s.end),{replacedWith:s.node})}},i=()=>{var c;n.value=t.markRaw(J.fromTextArea(l.value,e.options)),r("update:cminstance",t.unref(n)),(c=n.value)==null||c.on("change",o)};return t.watch(()=>e.cminstance,c=>{var m;c&&(o(e.cminstance),(m=e.cminstance)==null||m.setValue(e.value),r("ready",n))},{deep:!0,immediate:!0}),t.onMounted(()=>{i()}),()=>t.createVNode("textarea",{ref:"textarea",name:e.name,placeholder:e.placeholder},null)}});const G={"update:value":e=>e,change:(e,r)=>null,input:e=>"",ready:e=>e},v={mode:"text",theme:"default",lineNumbers:!0,smartIndent:!0,indentUnit:2,foldGutter:!0,matchBrackets:!0,autoCloseBrackets:!0,styleActiveLine:!0};function K({props:e,cminstance:r,presetRef:l}){const n=t.ref(null),o=t.ref(null),i=()=>{t.nextTick(()=>{r.value.refresh()})},c=(d=e.width,s=e.height)=>{n.value=String(d).replace("px",""),o.value=String(s).replace("px","");let y=o.value;r.value.setSize(n.value,y)},m=()=>{const d=r.value.doc.cm.getWrapperElement();d==null||d.remove()},u=()=>{const d=document.querySelector(".CodeMirror-gutters");return(d==null?void 0:d.style.left.replace("px",""))!="0"};return{refresh:i,resize:c,destroy:m,containerHeight:o,reviseStyle:()=>{if(i(),!u())return;let d=setInterval(()=>{u()?i():clearInterval(d)},60),s=setTimeout(()=>{clearInterval(d),clearTimeout(s)},400)}}}typeof Object.assign!="function"&&Object.defineProperty(Object,"assign",{value(e,r){if(e==null)throw new TypeError("Cannot convert undefined or null to object");const l=Object(e);for(let n=1;n<arguments.length;n++){const o=arguments[n];if(o!=null)for(const i in o)Object.prototype.hasOwnProperty.call(o,i)&&(l[i]=o[i])}return l},writable:!0,configurable:!0});var w=t.defineComponent({name:"CodemirrorEditor",props:{value:{type:String,default:""},marker:{type:Function,default:()=>null},unseenLines:Array,name:{type:String,default:""},placeholder:{type:String,default:""},merge:{type:Boolean,default:!1},options:{type:Object,default:()=>v},globalOptions:{type:Object,default:()=>v},border:{type:Boolean,default:!1},width:{type:[String,Number],default:null},height:{type:[String,Number],default:null},KeepCursorInEnd:{type:Boolean,default:!1}},emits:j({},G),components:{Default:R,Merge:H,FcLog:W},setup(e,{emit:r,attrs:l}){const n=t.ref(null),o=t.ref(""),i=t.ref("Default"),c=t.ref(Object.assign(j({},v),e.globalOptions,e.options)),m=t.getCurrentInstance(),u=t.ref(null),{refresh:k,resize:d,destroy:s,containerHeight:y,reviseStyle:S}=K({props:e,cminstance:n,presetRef:u}),O=()=>{e.unseenLines!==void 0&&e.marker!==void 0&&e.unseenLines.forEach(f=>{var p,M;const h=(p=n.value)==null?void 0:p.lineInfo(f);(M=n.value)==null||M.setGutterMarker(f,"breakpoints",(h==null?void 0:h.gutterMarkers)?null:e.marker())})},_=f=>{var p,M;const h=(p=n.value)==null?void 0:p.getValue();f!==h&&((M=n.value)==null||M.setValue(f),o.value=f,S()),O()},Z=()=>{if(e.options.mode=="fclog"||e.options.mode=="log"){i.value="FcLog";return}if(e.merge){i.value="Merge";return}i.value="Default"};return t.watch(()=>e.options,f=>{var h;for(const p in e.options)(h=n.value)==null||h.setOption(p,f[p])},{deep:!0}),t.watch(()=>e.value,f=>{_(f)}),t.watch(()=>e.merge,f=>{Z()},{immediate:!0}),t.onBeforeUnmount(()=>{s()}),()=>{var f,h;return t.createVNode("div",{class:["codemirror-container",e.merge&&"merge",(e.border||e.merge)&&"bordered",(!e.width||e.width=="100%")&&"width-auto",(!e.height||e.height=="100%")&&"height-auto"],style:{height:y+"px"}},[t.withDirectives(t.createVNode(t.resolveComponent("component"),{style:"height: 100%",is:i,ref:"presetRef",cminstance:n,"onUpdate:cminstance":p=>n=p,options:c,name:e.name||((h=(f=m==null?void 0:m.parent)==null?void 0:f.type)==null?void 0:h.name)||void 0,content:o},null),[[t.resolveDirective("on-ready"),"ready"],[t.resolveDirective("bind"),e,l]])])}}}),ne="";w.install=(e,r)=>(r&&(r.options&&(w.props.globalOptions.default=()=>r.options),r.events&&(w.props.globalEvents.default=()=>r.events)),e.component("Codemirror",w),e),function styleInject(css,ref){if(ref===void 0){ref={}}var insertAt=ref.insertAt;if(!css||typeof document==="undefined"){return}var head=document.head||document.getElementsByTagName("head")[0];var style=document.createElement("style");style.type="text/css";if(insertAt==="top"){if(head.firstChild){head.insertBefore(style,head.firstChild)}else{head.appendChild(style)}}else{head.appendChild(style)}if(style.styleSheet){style.styleSheet.cssText=css}else{style.appendChild(document.createTextNode(css))}};styleInject(``),a.Codemirror=w,a.createLinkMark=P,a.createLog=B,a.createLogMark=z,a.createTitle=U,a.default=w,a.getLinkMark=E,a.getLocalTime=T,a.getLogMark=N,Object.defineProperty(a,"__esModule",{value:!0}),a[Symbol.toStringTag]="Module"});
+`);const d=document.createElement("span");let g=o[1];d.className=`c-editor--log__${g}`;let s=0;for(let p=0;p<c.length;p++){let w=c[p],$=f[p],_=d.cloneNode(!1);_.innerText=$,r.push({start:o.index+s,end:o.index+s+w.length,node:_}),s=s+w.length+1}o=n.exec(e)}}return a(),r}function re(e,r=""){return`[${L()}] <${r}> ${e}`}function ne(e="",r=20,a="="){const n=Math.floor(1.5*e.length/2),l=new Array(Math.max(r-n,5)).join(a);return`${l}${e}${l}`}const S=[{regex:/(\[.*?\])([ \t]*)(<error>[ \t])(.+)/,token:["tag","","error.strong","error.strong"],sol:!0},{regex:/(\[.*?\])([ \t]*)(<info>)(.+)(.?)/,token:["tag","","bracket","bracket","hr"],sol:!0},{regex:/(\[.*?\])([ \t]*)(<warning>)(.+)(.?)/,token:["tag","","comment","comment","hr"],sol:!0}];v.default.defineSimpleMode("fclog",{start:[...S,{regex:/.*/,token:"hr"}],error:[...S,{regex:/.*/,token:"error.strong"}],info:[...S,{regex:/.*/,token:"bracket"}],warning:[...S,{regex:/.*\[/,token:"comment"}]}),v.default.defineSimpleMode("log",{start:[{regex:/^[=]+[^=]*[=]+/,token:"strong"},{regex:/([^\w])([A-Z][\w]*)/,token:["","string"]},{regex:/(^[A-Z][\w]*)/,token:"string"}]});const oe=window.CodeMirror||v.default,ae=t.defineComponent({name:"codemirror-fclog",props:{value:{type:String,default:""},name:{type:String,default:`cm-textarea-${+new Date}`},options:{type:Object,default:()=>({})},cminstance:{type:Object,default:()=>({})},placeholder:{type:String,default:""}},emits:["update:cminstance","ready"],setup(e,{emit:r}){const a=t.ref(),n=t.ref(null),o=(c=e.cminstance)=>{c.getAllMarks().forEach(g=>g.clear());const f=c.getValue(),d=[].concat(T(f)).concat(D(f));for(let g=0;g<d.length;g++){const s=d[g];c.markText(c.posFromIndex(s.start),c.posFromIndex(s.end),{replacedWith:s.node})}},l=()=>{var c;n.value=t.markRaw(oe.fromTextArea(a.value,e.options)),r("update:cminstance",t.unref(n)),(c=n.value)==null||c.on("change",o)};return t.watch(()=>e.cminstance,c=>{var u;c&&(o(e.cminstance),(u=e.cminstance)==null||u.setValue(e.value),r("ready",n))},{deep:!0,immediate:!0}),t.onMounted(()=>{l()}),{initialize:l,textarea:a}}}),le=["name","placeholder"];function ie(e,r,a,n,o,l){return t.openBlock(),t.createElementBlock("textarea",{ref:"textarea",name:e.$props.name,placeholder:e.$props.placeholder},null,8,le)}var se=E(ae,[["render",ie]]);const B={"update:value":e=>e,change:(e,r)=>({value:e,cm:r}),input:e=>e,ready:e=>e},ce=["changes","scroll","beforeChange","cursorActivity","keyHandled","inputRead","electricInput","beforeSelectionChange","viewportChange","swapDoc","gutterClick","gutterContextMenu","focus","blur","refresh","optionChange","scrollCursorIntoView","update"],de=()=>{let e={};return ce.forEach(r=>{e[r]=(...a)=>{}}),e},x={mode:"text",theme:"default",lineNumbers:!0,smartIndent:!0,indentUnit:2,foldGutter:!0,matchBrackets:!0,autoCloseBrackets:!0,styleActiveLine:!0};function ue(e){Promise.resolve().then(()=>{let r=e.getScrollInfo();e.scrollTo(r.left,r.height)})}const fe=({props:e,cminstance:r,emit:a,internalInstance:n,content:o})=>{const l=()=>{let u=[];return Object.keys(n==null?void 0:n.vnode.props).forEach(f=>{if(f.startsWith("on")){let d=f.replace(f[2],f[2].toLowerCase()).slice(2);!B[d]&&u.push(d)}}),u};return{listenerEvents:()=>{r.value.on("change",d=>{const g=d.getValue();g!=o.value&&(o.value=g,a("update:value",o.value),a("input",o.value),Promise.resolve().then(()=>{a("change",o.value,d)}),e.KeepCursorInEnd&&ue(d))});const u={};l().filter(d=>!u[d]&&(u[d]=!0)).forEach(d=>{r.value.on(d,(...g)=>{a(d,...g)})})}}};function me({props:e,cminstance:r,presetRef:a}){const n=t.ref(null),o=t.ref(null),l=()=>{t.nextTick(()=>{var s;(s=r.value)==null||s.refresh()})},c=(s=e.width,p=e.height)=>{var $;n.value=String(s).replace("px",""),o.value=String(p).replace("px","");let w=o.value;($=r.value)==null||$.setSize(n.value,w)},u=()=>{var p;const s=(p=r.value)==null?void 0:p.getWrapperElement();s==null||s.remove()},f=()=>{var p,w,$;const s=(p=r.value)==null?void 0:p.getDoc().getHistory();(w=a.value)==null||w.initialize(),u(),($=r.value)==null||$.getDoc().setHistory(s)},d=()=>{const s=document.querySelector(".CodeMirror-gutters");return(s==null?void 0:s.style.left.replace("px",""))!="0"};return{reload:f,refresh:l,resize:c,destroy:u,containerHeight:o,reviseStyle:()=>{if(l(),!d())return;let s=setInterval(()=>{d()?l():clearInterval(s)},60),p=setTimeout(()=>{clearInterval(s),clearTimeout(p)},400)}}}typeof Object.assign!="function"&&Object.defineProperty(Object,"assign",{value(e,r){if(e==null)throw new TypeError("Cannot convert undefined or null to object");const a=Object(e);for(let n=1;n<arguments.length;n++){const o=arguments[n];if(o!=null)for(const l in o)Object.prototype.hasOwnProperty.call(o,l)&&(a[l]=o[l])}return a},writable:!0,configurable:!0});const ge=t.defineComponent({name:"CodemirrorEditor",props:{value:{type:String,default:""},marker:{type:Function,default:()=>null},unseenLines:{type:Array,default:()=>[]},name:{type:String,default:""},placeholder:{type:String,default:""},merge:{type:Boolean,default:!1},options:{type:Object,default:()=>x},globalOptions:{type:Object,default:()=>x},border:{type:Boolean,default:!1},width:{type:[String,Number],default:null},height:{type:[String,Number],default:null},KeepCursorInEnd:{type:Boolean,default:!1}},emits:M(M({},B),de()),components:{Default:K,Merge:Y,FcLog:se},setup(e,{emit:r,attrs:a}){var A,R;const n=t.ref(null),o=t.ref(""),l=t.ref("Default"),c=t.ref(Object.assign(M({},x),e.globalOptions,e.options)),u=t.getCurrentInstance(),f=t.ref(null),{refresh:d,resize:g,destroy:s,containerHeight:p,reviseStyle:w}=me({props:e,cminstance:n,presetRef:f}),{listenerEvents:$}=fe({props:e,cminstance:n,emit:r,internalInstance:u,content:o}),_=()=>{e.unseenLines!==void 0&&e.marker!==void 0&&e.unseenLines.forEach(h=>{var k,C;const y=(k=n.value)==null?void 0:k.lineInfo(h);(C=n.value)==null||C.setGutterMarker(h,"breakpoints",(y==null?void 0:y.gutterMarkers)?null:e.marker())})},ye=h=>{var k,C;const y=(k=n.value)==null?void 0:k.getValue();h!==y&&((C=n.value)==null||C.setValue(h),o.value=h,w()),_()},ke=h=>{$(),_(),g(),r("ready",n.value),t.watch([()=>e.height,()=>e.width],([y,k])=>{g(y,k)},{deep:!0})},we=()=>{if(e.options.mode=="fclog"||e.options.mode=="log"){l.value="FcLog";return}if(e.merge){l.value="Merge";return}l.value="Default"};return t.watch(()=>e.options,h=>{var y;for(const k in e.options)(y=n.value)==null||y.setOption(k,h[k])},{deep:!0}),t.watch(()=>e.value,h=>{ye(h)}),t.watch(()=>e.merge,h=>{we()},{immediate:!0}),t.onBeforeUnmount(()=>{s()}),{presetModeName:l,cmOptions:c,cminstance:n,content:o,ready:ke,resize:g,refresh:d,containerHeight:p,instanceName:e.name||((R=(A=u==null?void 0:u.parent)==null?void 0:A.type)==null?void 0:R.name)||void 0,presetRef:f}}});function pe(e,r,a,n,o,l){return t.openBlock(),t.createElementBlock("div",{class:t.normalizeClass(["codemirror-container",{merge:e.$props.merge,bordered:e.$props.border||e.$props.merge,"width-auto":!e.$props.width||e.$props.width=="100%","height-auto":!e.$props.height||e.$props.height=="100%"}]),style:t.normalizeStyle({height:e.containerHeight+"px"})},[(t.openBlock(),t.createBlock(t.resolveDynamicComponent(e.presetModeName),t.mergeProps({style:{height:"100%"},ref:"presetRef",cminstance:e.cminstance,"onUpdate:cminstance":r[0]||(r[0]=c=>e.cminstance=c)},H(M(M({},e.$props),e.$attrs),{options:e.cmOptions,name:e.instanceName,content:e.content}),{onReady:e.ready}),null,16,["cminstance","onReady"]))],6)}var b=E(ge,[["render",pe]]),xe="";const I=window.CodeMirror||v.default,N=(e,r)=>(r&&(r.options&&(b.props.globalOptions.default=()=>r.options),r.events&&(b.props.globalEvents.default=()=>r.events)),e.component("Codemirror",b),e);var he={CodeMirror:I,codemirror:b,install:N};function styleInject(css,ref){if(ref===void 0){ref={}}var insertAt=ref.insertAt;if(!css||typeof document==="undefined"){return}var head=document.head||document.getElementsByTagName("head")[0];var style=document.createElement("style");style.type="text/css";if(insertAt==="top"){if(head.firstChild){head.insertBefore(style,head.firstChild)}else{head.appendChild(style)}}else{head.appendChild(style)}if(style.styleSheet){style.styleSheet.cssText=css}else{style.appendChild(document.createTextNode(css))}};styleInject(``),i.CodeMirror=I,i.codemirror=b,i.createLinkMark=ee,i.createLog=re,i.createLogMark=te,i.createTitle=ne,i.default=he,i.getLinkMark=T,i.getLocalTime=L,i.getLogMark=D,i.install=N,Object.defineProperty(i,"__esModule",{value:!0}),i[Symbol.toStringTag]="Module"});

package.json

 {
   "name": "codemirror-editor-vue3",
   "description": "CodeMirror component for Vue3",
-  "version": "1.1.0-beta7",
+  "version": "1.1.0-beta8",
   "license": "MIT",
@@ -9,4 +9,4 @@ "files": [
   ],
-  "types": "./dist/packages/lib/index.d.ts",
-  "main": "./dist/codemirror-editor-vue3.umd.js",
+  "types": "./dist/packages/index.d.ts",
+  "main": "./packages/index.ts",
   "module": "./dist/codemirror-editor-vue3.es.js",
@@ -53,5 +53,5 @@ "style": "./dist/style.css",
     "publish": "git push && git push --tags && npm publish && npm run deploy-docs",
-    "docs-dev": "vitepress dev packages/docs --open",
-    "docs-build": "vitepress build packages/docs",
-    "docs-serve": "vitepress serve packages/docs",
+    "docs-dev": "vitepress dev docs --open",
+    "docs-build": "vitepress build docs",
+    "docs-serve": "vitepress serve docs",
     "deploy-docs": "bash scripts/deploy-docs.sh"
@@ -58,0 +58,0 @@ },

New alerts

Major refactor

Supply chain risk

Package has recently undergone a major refactor. It may be unstable or indicate significant internal changes. Use caution when updating to versions that include significant changes.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

81953

62.91%

Lines of code

1728

56.52%

Worsened metrics

Number of package files

20

-9.09%

Number of medium supply chain risk alerts

1

Infinity%

No dependency changes