vue-cm/dist/cm.js

CodeMirror component for Vue.js

(function (global, factory) {
	typeof exports === 'object' && typeof module !== 'undefined' ? module.exports = factory(require('codemirror')) :
	typeof define === 'function' && define.amd ? define(['codemirror'], factory) :
	(global.VueCodeMirror = factory(global.CodeMirror));
}(this, (function (CodeMirror) { 'use strict';

CodeMirror = CodeMirror && CodeMirror.hasOwnProperty('default') ? CodeMirror['default'] : CodeMirror;

var index = function equal(a, b) {
  if (a === b) { return true; }

  var arrA = Array.isArray(a)
    , arrB = Array.isArray(b)
    , i;

  if (arrA && arrB) {
    if (a.length != b.length) { return false; }
    for (i = 0; i < a.length; i++)
      { if (!equal(a[i], b[i])) { return false; } }
    return true;
  }

  if (arrA != arrB) { return false; }

  if (a && b && typeof a === 'object' && typeof b === 'object') {
    var keys = Object.keys(a);
    if (keys.length !== Object.keys(b).length) { return false; }

    var dateA = a instanceof Date
      , dateB = b instanceof Date;
    if (dateA && dateB) { return a.getTime() == b.getTime(); }
    if (dateA != dateB) { return false; }

    var regexpA = a instanceof RegExp
      , regexpB = b instanceof RegExp;
    if (regexpA && regexpB) { return a.toString() == b.toString(); }
    if (regexpA != regexpB) { return false; }

    for (i = 0; i < keys.length; i++)
      { if (!Object.prototype.hasOwnProperty.call(b, keys[i])) { return false; } }

    for (i = 0; i < keys.length; i++)
      { if(!equal(a[keys[i]], b[keys[i]])) { return false; } }

    return true;
  }

  return false;
};

var CodeMirror$2 = {
  name: 'CodeMirror',

  model: {
    event: 'change'
  },

  props: {
    value: String,
    options: Object,
    preserveScrollPosition: Boolean
  },

  methods: {
    focus: function focus() {
      this.codemirror && this.codemirror.focus();
    },

    getCodeMirror: function getCodeMirror() {
      return this.codemirror
    },

    setOptionIfChanged: function setOptionIfChanged(name, newValue) {
      var oldValue = this.codemirror.getOption(name);
      if (!index(oldValue, newValue)) {
        this.codemirror.setOption(name, newValue);
      }
    }
  },

  watch: {
    value: function value(newValue) {
      if (this.codemirror && newValue !== this.codemirror.getValue()) {
        if (this.preserveScrollPosition) {
          var prevScrollPosition = this.codemirror.getScrollInfo();
          this.codemirror.setValue(newValue);
          this.codemirror.scrollTo(
            prevScrollPosition.left,
            prevScrollPosition.top
          );
        } else {
          this.codemirror.setValue(newValue);
        }
      }
    },

    options: {
      deep: true,
      handler: function handler(newValue) {
        var this$1 = this;

        if (this.codemirror) {
          // eslint-disable-next-line guard-for-in
          for (var name in newValue) {
            this$1.setOptionIfChanged(name, newValue[name]);
          }
        }
      }
    }
  },

  mounted: function mounted() {
    var this$1 = this;

    this.codemirror = CodeMirror.fromTextArea(this.$el, this.options);

    this.codemirror.on('change', function (e) { return this$1.$emit('change', e.getValue()); });
    this.codemirror.on('focus', function () { return this$1.$emit('focus'); });
    this.codemirror.on('blur', function () { return this$1.$emit('blur'); });
    this.codemirror.on('scroll', function (cm) { return this$1.$emit('scroll', cm.getScrollInfo()); });
    this.codemirror.on('cursorActivity', function (cm) { return this$1.$emit('cursorActivity', cm); });
  },

  beforeDestroy: function beforeDestroy() {
    this.codemirror && this.codemirror.toTextArea();
  },

  render: function render(h) {
    return h('textarea', null, [this.value])
  }
};

if (typeof window !== 'undefined' && window.Vue) {
  window.Vue.component(CodeMirror$2.name, CodeMirror$2);
}

return CodeMirror$2;

})));