Merge branch 'master' into add-dropcursor

2018-12-20 08:13:37 +01:00
parent fda883ef5b 19163370f5
commit a7fafd5564
12 changed files with 760 additions and 481 deletions
--- a/.eslintrc.js
+++ b/.eslintrc.js
@@ -1,8 +1,8 @@
 module.exports = {
  plugins: ['html'],

-  parser: 'babel-eslint',
  parserOptions: {
+    parser: 'babel-eslint',
    sourceType: 'module',
  },

@@ -25,6 +25,7 @@ module.exports = {
  },

  extends: [
+    'plugin:vue/base',
    'airbnb-base',
  ],

--- a/README.md
+++ b/README.md
@@ -72,8 +72,8 @@ useBuiltInExtensions
 | `extensions` | `Array` | `[]` | A list of extensions used, by the editor. This can be `Nodes`, `Marks` or `Plugins`. |
 | `useBuiltInExtensions` | `Boolean` | `true` | By default tiptap adds a `Doc`, `Paragraph` and `Text` node to the Prosemirror schema. |
 | `onInit` | `Function` | `undefined` | This will return an Object with the current `state` and `view` of Prosemirror on init. |
-| `onFocus` | `Function` | `undefined` | This will return an Object with the current `state` and `view` of Prosemirror on focus. |
-| `onBlur` | `Function` | `undefined` | This will return an Object with the current `state` and `view` of Prosemirror on blur. |
+| `onFocus` | `Function` | `undefined` | This will return an Object with the `event` and current `state` and `view` of Prosemirror on focus. |
+| `onBlur` | `Function` | `undefined` | This will return an Object with the `event` and current `state` and `view` of Prosemirror on blur. |
 | `onUpdate` | `Function` | `undefined` | This will return an Object with the current `state` of Prosemirror, a `getJSON()` and `getHTML()` function on every change. |

 ## Components
--- a/examples/Components/Routes/Placeholder/index.vue
+++ b/examples/Components/Routes/Placeholder/index.vue
@@ -24,6 +24,7 @@ export default {
          new ListItem(),
          new Placeholder({
            emptyClass: 'is-empty',
+            emptyNodeText: 'Write something …',
          }),
        ],
      }),
@@ -37,7 +38,7 @@ export default {

 <style lang="scss">
 .editor p.is-empty:first-child::before {
-  content: 'Start typing…';
+  content: attr(data-empty-text);
  float: left;
  color: #aaa;
  pointer-events: none;
--- a/examples/Components/Routes/ReadOnly/index.vue
+++ b/examples/Components/Routes/ReadOnly/index.vue
@@ -1,5 +1,10 @@
 <template>
  <div class="editor">
+    <div class="checkbox">
+      <input type="checkbox" id="editable" v-model="editable" />
+      <label for="editable">editable</label>
+    </div>
+
    <editor-content class="editor__content" :editor="editor" />
  </div>
 </template>
@@ -40,10 +45,24 @@ export default {
          </p>
        `,
      }),
+      editable: false,
    }
  },
+  watch: {
+    editable() {
+      this.editor.setOptions({
+        editable: this.editable,
+      })
+    },
+  },
  beforeDestroy() {
    this.editor.destroy()
  },
 }
 </script>
+
+<style lang="scss">
+.checkbox {
+  margin-bottom: 1rem;
+}
+</style>
--- a/package.json
+++ b/package.json
@@ -23,15 +23,15 @@
    "ie >= 9"
  ],
  "devDependencies": {
-    "@babel/core": "^7.2.0",
-    "@babel/node": "^7.2.0",
+    "@babel/core": "^7.2.2",
+    "@babel/node": "^7.2.2",
    "@babel/plugin-syntax-dynamic-import": "^7.2.0",
    "@babel/plugin-transform-runtime": "^7.2.0",
    "@babel/polyfill": "^7.0.0",
    "@babel/preset-env": "^7.2.0",
    "@babel/preset-stage-2": "^7.0.0",
    "@babel/runtime": "^7.2.0",
-    "autoprefixer": "^9.4.2",
+    "autoprefixer": "^9.4.3",
    "babel-core": "^7.0.0-bridge.0",
    "babel-eslint": "^10.0.1",
    "babel-jest": "^23.6.0",
@@ -39,8 +39,8 @@
    "browser-sync": "^2.26.3",
    "connect-history-api-fallback": "^1.5.0",
    "copy-webpack-plugin": "^4.6.0",
-    "css-loader": "^2.0.0",
-    "eslint": "^5.8.0",
+    "css-loader": "^2.0.1",
+    "eslint": "^5.10.0",
    "eslint-config-airbnb-base": "^13.0.0",
    "eslint-plugin-html": "^5.0.0",
    "eslint-plugin-import": "^2.13.0",
@@ -53,33 +53,33 @@
    "http-server": "^0.11.1",
    "imagemin-webpack-plugin": "^2.3.0",
    "jest": "^23.6.0",
-    "lerna": "^3.5.1",
+    "lerna": "^3.7.0",
    "mini-css-extract-plugin": "^0.5.0",
    "minimist": "^1.2.0",
-    "node-sass": "^4.10.0",
+    "node-sass": "^4.11.0",
    "optimize-css-assets-webpack-plugin": "^5.0.1",
    "ora": "^3.0.0",
-    "postcss": "^7.0.5",
+    "postcss": "^7.0.7",
    "postcss-loader": "^3.0.0",
    "postcss-scss": "^2.0.0",
    "regenerator-runtime": "^0.13.1",
-    "rollup": "^0.67.4",
-    "rollup-plugin-babel": "^4.0.3",
+    "rollup": "^0.68.0",
+    "rollup-plugin-babel": "^4.1.0",
    "rollup-plugin-commonjs": "^9.2.0",
    "rollup-plugin-flow-no-whitespace": "^1.0.0",
-    "rollup-plugin-node-resolve": "^3.4.0",
+    "rollup-plugin-node-resolve": "^4.0.0",
    "rollup-plugin-replace": "^2.1.0",
    "rollup-plugin-vue": "^4.3.2",
    "sass-loader": "^7.0.3",
    "style-loader": "^0.23.1",
    "tippy.js": "^3.3.0",
    "uglify-js": "^3.4.9",
-    "vue": "^2.5.18",
+    "vue": "^2.5.21",
    "vue-loader": "^15.4.2",
    "vue-router": "^3.0.2",
    "vue-style-loader": "^4.1.0",
-    "vue-template-compiler": "^2.5.18",
-    "webpack": "^4.27.1",
+    "vue-template-compiler": "^2.5.21",
+    "webpack": "^4.28.0",
    "webpack-dev-middleware": "^3.4.0",
    "webpack-hot-middleware": "^2.24.3",
    "webpack-manifest-plugin": "^2.0.4",
--- a/packages/tiptap-commands/package.json
+++ b/packages/tiptap-commands/package.json
@@ -1,6 +1,6 @@
 {
  "name": "tiptap-commands",
-  "version": "1.2.0",
+  "version": "1.3.0",
  "description": "Commands for tiptap",
  "homepage": "https://tiptap.scrumpy.io",
  "license": "MIT",
@@ -24,6 +24,6 @@
    "prosemirror-inputrules": "^1.0.1",
    "prosemirror-schema-list": "^1.0.1",
    "prosemirror-state": "^1.2.2",
-    "tiptap-utils": "^1.0.1"
+    "tiptap-utils": "^1.1.0"
  }
 }
--- a/packages/tiptap-extensions/package.json
+++ b/packages/tiptap-extensions/package.json
@@ -1,6 +1,6 @@
 {
  "name": "tiptap-extensions",
-  "version": "1.4.0",
+  "version": "1.5.0",
  "description": "Extensions for tiptap",
  "homepage": "https://tiptap.scrumpy.io",
  "license": "MIT",
@@ -25,8 +25,8 @@
    "prosemirror-history": "^1.0.3",
    "prosemirror-state": "^1.2.2",
    "prosemirror-view": "^1.6.7",
-    "tiptap": "^1.4.0",
-    "tiptap-commands": "^1.2.0"
+    "tiptap": "^1.5.0",
+    "tiptap-commands": "^1.3.0"
  },
  "peerDependencies": {
    "vue": "^2.5.17",
--- a/packages/tiptap-extensions/src/extensions/Placeholder.js
+++ b/packages/tiptap-extensions/src/extensions/Placeholder.js
@@ -10,6 +10,7 @@ export default class Placeholder extends Extension {
  get defaultOptions() {
    return {
      emptyNodeClass: 'is-empty',
+      emptyNodeText: 'Write something...',
    }
  }

@@ -28,6 +29,7 @@ export default class Placeholder extends Extension {

              const decoration = Decoration.node(pos, pos + node.nodeSize, {
                class: this.options.emptyNodeClass,
+                'data-empty-text': this.options.emptyNodeText,
              })
              decorations.push(decoration)
            })
--- a/packages/tiptap-utils/package.json
+++ b/packages/tiptap-utils/package.json
@@ -1,6 +1,6 @@
 {
  "name": "tiptap-utils",
-  "version": "1.0.1",
+  "version": "1.1.0",
  "description": "Utility functions for tiptap",
  "homepage": "https://tiptap.scrumpy.io",
  "license": "MIT",
@@ -23,6 +23,6 @@
    "prosemirror-model": "^1.6.3",
    "prosemirror-state": "^1.2.2",
    "prosemirror-tables": "^0.7.9",
-    "prosemirror-utils": "^0.7.2"
+    "prosemirror-utils": "^0.7.3"
  }
 }
--- a/packages/tiptap/package.json
+++ b/packages/tiptap/package.json
@@ -1,6 +1,6 @@
 {
  "name": "tiptap",
-  "version": "1.4.0",
+  "version": "1.5.0",
  "description": "A rich-text editor for Vue.js",
  "homepage": "https://tiptap.scrumpy.io",
  "license": "MIT",
@@ -28,8 +28,8 @@
    "prosemirror-model": "^1.6.3",
    "prosemirror-state": "^1.2.1",
    "prosemirror-view": "^1.6.7",
-    "tiptap-commands": "^1.2.0",
-    "tiptap-utils": "^1.0.1"
+    "tiptap-commands": "^1.3.0",
+    "tiptap-utils": "^1.1.0"
  },
  "peerDependencies": {
    "vue": "^2.5.17",
--- a/packages/tiptap/src/Editor.js
+++ b/packages/tiptap/src/Editor.js
@@ -13,11 +13,32 @@ import { Doc, Paragraph, Text } from './Nodes'
 export default class Editor {

  constructor(options = {}) {
+    this.defaultOptions = {
+      editable: true,
+      extensions: [],
+      content: '',
+      emptyDocument: {
+        type: 'doc',
+        content: [{
+          type: 'paragraph',
+        }],
+      },
+      useBuiltInExtensions: true,
+      dropCursor: {},
+      onInit: () => {},
+      onUpdate: () => {},
+      onFocus: () => {},
+      onBlur: () => {},
+    }
+
    this.init(options)
  }

  init(options = {}) {
-    this.setOptions(options)
+    this.setOptions({
+      ...this.defaultOptions,
+      ...options,
+    })
    this.element = document.createElement('div')
    this.extensions = this.createExtensions()
    this.nodes = this.createNodes()
@@ -38,27 +59,13 @@ export default class Editor {
  }

  setOptions(options) {
-    const defaultOptions = {
-      editable: true,
-      extensions: [],
-      content: '',
-      dropCursor: {},
-      emptyDocument: {
-        type: 'doc',
-        content: [{
-          type: 'paragraph',
-        }],
-      },
-      useBuiltInExtensions: true,
-      onInit: () => {},
-      onUpdate: () => {},
-      onFocus: () => {},
-      onBlur: () => {},
+    this.options = {
+      ...this.options,
+      ...options,
    }

-    this.options = {
-      ...defaultOptions,
-      ...options,
+    if (this.view && this.state) {
+      this.view.updateState(this.state)
    }
  }

@@ -181,12 +188,14 @@ export default class Editor {

    view.dom.style.whiteSpace = 'pre-wrap'

-    view.dom.addEventListener('focus', () => this.options.onFocus({
+    view.dom.addEventListener('focus', event => this.options.onFocus({
+      event,
      state: this.state,
      view: this.view,
    }))

-    view.dom.addEventListener('blur', () => this.options.onBlur({
+    view.dom.addEventListener('blur', event => this.options.onBlur({
+      event,
      state: this.state,
      view: this.view,
    }))
--- a/yarn.lock
+++ b/yarn.lock