Merge branch 'master' into feature/suggestions

# Conflicts:
#	examples/Components/App/style.scss
#	examples/Components/Subnavigation/index.vue
#	examples/main.js
#	packages/tiptap-extensions/package.json

packages/tiptap-extensions/package.json

@@ -1,6 +1,6 @@
 {
   "name": "tiptap-extensions",
-  "version": "0.8.0",
+  "version": "0.14.1",
   "description": "Extensions for tiptap",
   "homepage": "https://tiptap.scrumpy.io",
   "license": "MIT",
@@ -8,6 +8,7 @@
   "module": "dist/extensions.esm.js",
   "unpkg": "dist/extensions.js",
   "jsdelivr": "dist/extensions.js",
+  "sideEffects": false,
   "files": [
     "src",
     "dist"
@@ -24,7 +25,7 @@
     "prosemirror-history": "^1.0.2",
     "prosemirror-state": "^1.2.2",
     "prosemirror-view": "^1.5.1",
-    "tiptap": "^0.10.0",
+    "tiptap": "^0.12.1",
     "tiptap-commands": "^0.3.0"
   }
 }

packages/tiptap-extensions/src/extensions/Placeholder.js

@@ -0,0 +1,42 @@
+import { Extension, Plugin } from 'tiptap'
+import { Decoration, DecorationSet } from 'prosemirror-view'
+
+export default class PlaceholderExtension extends Extension {
+
+	get name() {
+		return 'placeholder'
+	}
+
+	get defaultOptions() {
+		return {
+			emptyNodeClass: 'is-empty',
+		}
+	}
+
+	get plugins() {
+		return [
+			new Plugin({
+				props: {
+					decorations: ({ doc }) => {
+						const decorations = []
+						const completelyEmpty = doc.textContent === '' && doc.childCount <= 1 && doc.content.size <= 2
+
+						doc.descendants((node, pos) => {
+							if (!completelyEmpty) {
+								return
+							}
+
+							const decoration = Decoration.node(pos, pos + node.nodeSize, {
+								class: this.options.emptyNodeClass,
+							})
+							decorations.push(decoration)
+						})
+
+						return DecorationSet.create(doc, decorations)
+					},
+				},
+			}),
+		]
+	}
+
+}

packages/tiptap-extensions/src/index.js

@@ -15,5 +15,8 @@ export { default as BoldMark } from './marks/Bold'
 export { default as CodeMark } from './marks/Code'
 export { default as ItalicMark } from './marks/Italic'
 export { default as LinkMark } from './marks/Link'
+export { default as StrikeMark } from './marks/Strike'
+export { default as UnderlineMark } from './marks/Underline'
 
 export { default as HistoryExtension } from './extensions/History'
+export { default as PlaceholderExtension } from './extensions/Placeholder'

packages/tiptap-extensions/src/marks/Link.js

@@ -7,20 +7,6 @@ export default class LinkMark extends Mark {
 		return 'link'
 	}
 
-	get view() {
-		return {
-			props: ['node'],
-			methods: {
-				onClick() {
-					console.log('click on link')
-				},
-			},
-			template: `
-				<a :href="node.attrs.href" rel="noopener noreferrer nofollow" ref="content" @click="onClick"></a>
-			`,
-		}
-	}
-
 	get schema() {
 		return {
 			attrs: {

packages/tiptap-extensions/src/marks/Strike.js

@@ -0,0 +1,47 @@
+import { Mark } from 'tiptap'
+import { toggleMark, markInputRule } from 'tiptap-commands'
+
+export default class StrikeMark extends Mark {
+
+	get name() {
+		return 'strike'
+	}
+
+	get schema() {
+		return {
+			parseDOM: [
+				{
+					tag: 's',
+				},
+				{
+					tag: 'del',
+				},
+				{
+					tag: 'strike',
+				},
+				{
+					style: 'text-decoration',
+					getAttrs: value => value === 'line-through',
+				},
+			],
+			toDOM: () => ['s', 0],
+		}
+	}
+
+	keys({ type }) {
+		return {
+			'Mod-d': toggleMark(type),
+		}
+	}
+
+	command({ type }) {
+		return toggleMark(type)
+	}
+
+	inputRules({ type }) {
+		return [
+			markInputRule(/~([^~]+)~$/, type),
+		]
+	}
+
+}

packages/tiptap-extensions/src/marks/Underline.js

@@ -0,0 +1,35 @@
+import { Mark } from 'tiptap'
+import { toggleMark } from 'tiptap-commands'
+
+export default class UnderlineMark extends Mark {
+
+	get name() {
+		return 'underline'
+	}
+
+	get schema() {
+		return {
+			parseDOM: [
+				{
+					tag: 'u',
+				},
+				{
+					style: 'text-decoration',
+					getAttrs: value => value === 'underline',
+				},
+			],
+			toDOM: () => ['u', 0],
+		}
+	}
+
+	keys({ type }) {
+		return {
+			'Mod-u': toggleMark(type),
+		}
+	}
+
+	command({ type }) {
+		return toggleMark(type)
+	}
+
+}

packages/tiptap-extensions/src/nodes/BulletList.js

@@ -1,5 +1,5 @@
 import { Node } from 'tiptap'
-import { wrappingInputRule, wrapInList, toggleList } from 'tiptap-commands'
+import { wrappingInputRule, toggleList } from 'tiptap-commands'
 
 export default class BulletNode extends Node {
 
@@ -22,9 +22,9 @@ export default class BulletNode extends Node {
 		return toggleList(type, schema.nodes.list_item)
 	}
 
-	keys({ type }) {
+	keys({ type, schema }) {
 		return {
-			'Shift-Ctrl-8': wrapInList(type),
+			'Shift-Ctrl-8': toggleList(type, schema.nodes.list_item),
 		}
 	}
 

packages/tiptap-extensions/src/nodes/ListItem.js

@@ -1,7 +1,7 @@
 import { Node } from 'tiptap'
 import { splitListItem, liftListItem, sinkListItem } from 'tiptap-commands'
 
-export default class OrderedListNode extends Node {
+export default class ListItemNode extends Node {
 
 	get name() {
 		return 'list_item'

packages/tiptap-extensions/src/nodes/OrderedList.js

@@ -1,5 +1,5 @@
 import { Node } from 'tiptap'
-import { wrappingInputRule, wrapInList, toggleList } from 'tiptap-commands'
+import { wrappingInputRule, toggleList } from 'tiptap-commands'
 
 export default class OrderedListNode extends Node {
 
@@ -32,9 +32,9 @@ export default class OrderedListNode extends Node {
 		return toggleList(type, schema.nodes.list_item)
 	}
 
-	keys({ type }) {
+	keys({ type, schema }) {
 		return {
-			'Shift-Ctrl-9': wrapInList(type),
+			'Shift-Ctrl-9': toggleList(type, schema.nodes.list_item),
 		}
 	}