Merge branch 'main' of https://github.com/ueberdosis/tiptap-next into feature/add-hierarchy-to-extensions

# Conflicts: # packages/extension-code-block-lowlight/src/code-block-lowlight.ts
2021-04-15 22:57:04 +02:00
parent b3596582da accceccd09
commit 998356a530
89 changed files with 459 additions and 337 deletions
--- a/docs/src/demos/Examples/Savvy/SmilieReplacer.ts
+++ b/docs/src/demos/Examples/Savvy/SmilieReplacer.ts
@@ -6,128 +6,129 @@ export const SmilieReplacer = Extension.create({

  addInputRules() {
    return [
-      new InputRule(/-___-/, '😑'),
-      new InputRule(/:'-\)/, '😂'),
-      new InputRule(/':-\)/, '😅'),
-      new InputRule(/':-D/, '😅'),
-      new InputRule(/>:-\)/, '😆'),
-      new InputRule(/-__-/, '😑'),
-      new InputRule(/':-\(/, '😓'),
-      new InputRule(/:'-\(/, '😢'),
-      new InputRule(/>:-\(/, '😠'),
-      new InputRule(/O:-\)/, '😇'),
-      new InputRule(/0:-3/, '😇'),
-      new InputRule(/0:-\)/, '😇'),
-      new InputRule(/0;\^\)/, '😇'),
-      new InputRule(/O;-\)/, '😇'),
-      new InputRule(/0;-\)/, '😇'),
-      new InputRule(/O:-3/, '😇'),
-      new InputRule(/:'\)/, '😂'),
-      new InputRule(/:-D/, '😃'),
-      new InputRule(/':\)/, '😅'),
-      new InputRule(/'=\)/, '😅'),
-      new InputRule(/':D/, '😅'),
-      new InputRule(/'=D/, '😅'),
-      new InputRule(/>:\)/, '😆'),
-      new InputRule(/>;\)/, '😆'),
-      new InputRule(/>=\)/, '😆'),
-      new InputRule(/;-\)/, '😉'),
-      new InputRule(/\*-\)/, '😉'),
-      new InputRule(/;-\]/, '😉'),
-      new InputRule(/;\^\)/, '😉'),
-      new InputRule(/B-\)/, '😎'),
-      new InputRule(/8-\)/, '😎'),
-      new InputRule(/B-D/, '😎'),
-      new InputRule(/8-D/, '😎'),
-      new InputRule(/:-\*/, '😘'),
-      new InputRule(/:\^\*/, '😘'),
-      new InputRule(/:-\)/, '🙂'),
-      new InputRule(/-_-/, '😑'),
-      new InputRule(/:-X/, '😶'),
-      new InputRule(/:-#/, '😶'),
-      new InputRule(/:-x/, '😶'),
-      new InputRule(/>.</, '😣'),
-      new InputRule(/:-O/, '😮'),
-      new InputRule(/:-o/, '😮'),
-      new InputRule(/O_O/, '😮'),
-      new InputRule(/>:O/, '😮'),
-      new InputRule(/:-P/, '😛'),
-      new InputRule(/:-p/, '😛'),
-      new InputRule(/:-Þ/, '😛'),
-      new InputRule(/:-þ/, '😛'),
-      new InputRule(/:-b/, '😛'),
-      new InputRule(/>:P/, '😜'),
-      new InputRule(/X-P/, '😜'),
-      new InputRule(/x-p/, '😜'),
-      new InputRule(/':\(/, '😓'),
-      new InputRule(/'=\(/, '😓'),
-      new InputRule(/>:\\/, '😕'),
-      new InputRule(/>:\//, '😕'),
-      new InputRule(/:-\//, '😕'),
-      new InputRule(/:-./, '😕'),
-      new InputRule(/>:\[/, '😞'),
-      new InputRule(/:-\(/, '😞'),
-      new InputRule(/:-\[/, '😞'),
-      new InputRule(/:'\(/, '😢'),
-      new InputRule(/;-\(/, '😢'),
-      new InputRule(/#-\)/, '😵'),
-      new InputRule(/%-\)/, '😵'),
-      new InputRule(/X-\)/, '😵'),
-      new InputRule(/>:\(/, '😠'),
-      new InputRule(/0:3/, '😇'),
-      new InputRule(/0:\)/, '😇'),
-      new InputRule(/O:\)/, '😇'),
-      new InputRule(/O=\)/, '😇'),
-      new InputRule(/O:3/, '😇'),
-      new InputRule(/<\/3/, '💔'),
-      new InputRule(/:D/, '😃'),
-      new InputRule(/=D/, '😃'),
-      new InputRule(/;\)/, '😉'),
-      new InputRule(/\*\)/, '😉'),
-      new InputRule(/;\]/, '😉'),
-      new InputRule(/;D/, '😉'),
-      new InputRule(/B\)/, '😎'),
-      new InputRule(/8\)/, '😎'),
-      new InputRule(/:\*/, '😘'),
-      new InputRule(/=\*/, '😘'),
-      new InputRule(/:\)/, '🙂'),
-      new InputRule(/=\]/, '🙂'),
-      new InputRule(/=\)/, '🙂'),
-      new InputRule(/:\]/, '🙂'),
-      new InputRule(/:X/, '😶'),
-      new InputRule(/:#/, '😶'),
-      new InputRule(/=X/, '😶'),
-      new InputRule(/=x/, '😶'),
-      new InputRule(/:x/, '😶'),
-      new InputRule(/=#/, '😶'),
-      new InputRule(/:O/, '😮'),
-      new InputRule(/:o/, '😮'),
-      new InputRule(/:P/, '😛'),
-      new InputRule(/=P/, '😛'),
-      new InputRule(/:p/, '😛'),
-      new InputRule(/=p/, '😛'),
-      new InputRule(/:Þ/, '😛'),
-      new InputRule(/:þ/, '😛'),
-      new InputRule(/:b/, '😛'),
-      new InputRule(/d:/, '😛'),
-      new InputRule(/:\//, '😕'),
-      new InputRule(/:\\/, '😕'),
-      new InputRule(/=\//, '😕'),
-      new InputRule(/=\\/, '😕'),
-      new InputRule(/:L/, '😕'),
-      new InputRule(/=L/, '😕'),
-      new InputRule(/:\(/, '😞'),
-      new InputRule(/:\[/, '😞'),
-      new InputRule(/=\(/, '😞'),
-      new InputRule(/;\(/, '😢'),
-      new InputRule(/D:/, '😨'),
-      new InputRule(/:\$/, '😳'),
-      new InputRule(/=\$/, '😳'),
-      new InputRule(/#\)/, '😵'),
-      new InputRule(/%\)/, '😵'),
-      new InputRule(/X\)/, '😵'),
-      new InputRule(/:@/, '😠'),
-      new InputRule(/<3/, '❤️'),
+      new InputRule(/-___- /, '😑 '),
+      new InputRule(/:'-\) /, '😂 '),
+      new InputRule(/':-\) /, '😅 '),
+      new InputRule(/':-D /, '😅 '),
+      new InputRule(/>:-\) /, '😆 '),
+      new InputRule(/-__- /, '😑 '),
+      new InputRule(/':-\( /, '😓 '),
+      new InputRule(/:'-\( /, '😢 '),
+      new InputRule(/>:-\( /, '😠 '),
+      new InputRule(/O:-\) /, '😇 '),
+      new InputRule(/0:-3 /, '😇 '),
+      new InputRule(/0:-\) /, '😇 '),
+      new InputRule(/0;\^\) /, '😇 '),
+      new InputRule(/O;-\) /, '😇 '),
+      new InputRule(/0;-\) /, '😇 '),
+      new InputRule(/O:-3 /, '😇 '),
+      new InputRule(/:'\) /, '😂 '),
+      new InputRule(/:-D /, '😃 '),
+      new InputRule(/':\) /, '😅 '),
+      new InputRule(/'=\) /, '😅 '),
+      new InputRule(/':D /, '😅 '),
+      new InputRule(/'=D /, '😅 '),
+      new InputRule(/>:\) /, '😆 '),
+      new InputRule(/>;\) /, '😆 '),
+      new InputRule(/>=\) /, '😆 '),
+      new InputRule(/;-\) /, '😉 '),
+      new InputRule(/\*-\) /, '😉 '),
+      new InputRule(/;-\] /, '😉 '),
+      new InputRule(/;\^\) /, '😉 '),
+      new InputRule(/B-\) /, '😎 '),
+      new InputRule(/8-\) /, '😎 '),
+      new InputRule(/B-D /, '😎 '),
+      new InputRule(/8-D /, '😎 '),
+      new InputRule(/:-\* /, '😘 '),
+      new InputRule(/:\^\* /, '😘 '),
+      new InputRule(/:-\) /, '🙂 '),
+      new InputRule(/-_- /, '😑 '),
+      new InputRule(/:-X /, '😶 '),
+      new InputRule(/:-# /, '😶 '),
+      new InputRule(/:-x /, '😶 '),
+      new InputRule(/>.< /, '😣 '),
+      new InputRule(/:-O /, '😮 '),
+      new InputRule(/:-o /, '😮 '),
+      new InputRule(/O_O /, '😮 '),
+      new InputRule(/>:O /, '😮 '),
+      new InputRule(/:-P /, '😛 '),
+      new InputRule(/:-p /, '😛 '),
+      new InputRule(/:-Þ /, '😛 '),
+      new InputRule(/:-þ /, '😛 '),
+      new InputRule(/:-b /, '😛 '),
+      new InputRule(/>:P /, '😜 '),
+      new InputRule(/X-P /, '😜 '),
+      new InputRule(/x-p /, '😜 '),
+      new InputRule(/':\( /, '😓 '),
+      new InputRule(/'=\( /, '😓 '),
+      new InputRule(/>:\\ /, '😕 '),
+      new InputRule(/>:\/ /, '😕 '),
+      new InputRule(/:-\/ /, '😕 '),
+      new InputRule(/:-. /, '😕 '),
+      new InputRule(/>:\[ /, '😞 '),
+      new InputRule(/:-\( /, '😞 '),
+      new InputRule(/:-\[ /, '😞 '),
+      new InputRule(/:'\( /, '😢 '),
+      new InputRule(/;-\( /, '😢 '),
+      new InputRule(/#-\) /, '😵 '),
+      new InputRule(/%-\) /, '😵 '),
+      new InputRule(/X-\) /, '😵 '),
+      new InputRule(/>:\( /, '😠 '),
+      new InputRule(/0:3 /, '😇 '),
+      new InputRule(/0:\) /, '😇 '),
+      new InputRule(/O:\) /, '😇 '),
+      new InputRule(/O=\) /, '😇 '),
+      new InputRule(/O:3 /, '😇 '),
+      new InputRule(/<\/3 /, '💔 '),
+      new InputRule(/:D /, '😃 '),
+      new InputRule(/=D /, '😃 '),
+      new InputRule(/;\) /, '😉 '),
+      new InputRule(/\*\) /, '😉 '),
+      new InputRule(/;\] /, '😉 '),
+      new InputRule(/;D /, '😉 '),
+      new InputRule(/B\) /, '😎 '),
+      new InputRule(/8\) /, '😎 '),
+      new InputRule(/:\* /, '😘 '),
+      new InputRule(/=\* /, '😘 '),
+      new InputRule(/:\) /, '🙂 '),
+      new InputRule(/=\] /, '🙂 '),
+      new InputRule(/=\) /, '🙂 '),
+      new InputRule(/:\] /, '🙂 '),
+      new InputRule(/:X /, '😶 '),
+      new InputRule(/:# /, '😶 '),
+      new InputRule(/=X /, '😶 '),
+      new InputRule(/=x /, '😶 '),
+      new InputRule(/:x /, '😶 '),
+      new InputRule(/=# /, '😶 '),
+      new InputRule(/:O /, '😮 '),
+      new InputRule(/:o /, '😮 '),
+      new InputRule(/:P /, '😛 '),
+      new InputRule(/=P /, '😛 '),
+      new InputRule(/:p /, '😛  '),
+      new InputRule(/=p /, '😛 '),
+      new InputRule(/:Þ /, '😛 '),
+      new InputRule(/:þ /, '😛 '),
+      new InputRule(/:b /, '😛 '),
+      new InputRule(/d: /, '😛 '),
+      new InputRule(/:\/ /, '😕 '),
+      new InputRule(/:\\ /, '😕 '),
+      new InputRule(/=\/ /, '😕 '),
+      new InputRule(/=\\ /, '😕 '),
+      new InputRule(/:L /, '😕 '),
+      new InputRule(/=L /, '😕 '),
+      new InputRule(/:\( /, '😞 '),
+      new InputRule(/:\[ /, '😞 '),
+      new InputRule(/=\( /, '😞 '),
+      new InputRule(/;\( /, '😢 '),
+      new InputRule(/D: /, '😨 '),
+      new InputRule(/:\$ /, '😳 '),
+      new InputRule(/=\$ /, '😳 '),
+      new InputRule(/#\) /, '😵 '),
+      new InputRule(/%\) /, '😵 '),
+      new InputRule(/X\) /, '😵 '),
+      new InputRule(/:@ /, '😠 '),
+      new InputRule(/<3 /, '❤️ '),
+      new InputRule(/\/shrug/, '¯\\_(ツ)_/¯'),
    ]
  },
 })
--- a/docs/src/demos/Examples/Tasks/index.vue
+++ b/docs/src/demos/Examples/Tasks/index.vue
@@ -17,7 +17,7 @@ const CustomDocument = Document.extend({
 })

 const CustomTaskItem = TaskItem.extend({
-  content: 'text*',
+  content: 'inline*',
 })

 export default {
--- a/docs/src/demos/Experiments/WordBreak/index.vue
+++ b/docs/src/demos/Experiments/WordBreak/index.vue
@@ -0,0 +1,69 @@
+<template>
+  <div v-if="editor">
+    <button @click="editor.chain().focus().setWordBreak().run()" :class="{ 'is-active': editor.isActive('wordBreak') }">
+      wbr
+    </button>
+
+    <editor-content :editor="editor" />
+
+    <h2>HTML</h2>
+    {{ editor.getHTML() }}
+  </div>
+</template>
+
+<script>
+import { Editor, EditorContent } from '@tiptap/vue-2'
+import { defaultExtensions } from '@tiptap/starter-kit'
+import { WordBreak } from './word-break'
+
+export default {
+  components: {
+    EditorContent,
+  },
+
+  data() {
+    return {
+      editor: null,
+    }
+  },
+
+  mounted() {
+    this.editor = new Editor({
+      extensions: [
+        ...defaultExtensions(),
+        WordBreak,
+      ],
+      content: `
+        <p>super<wbr>longword</p>
+      `,
+    })
+  },
+
+  beforeDestroy() {
+    this.editor.destroy()
+  },
+}
+</script>
+
+<style lang="scss" scoped>
+::v-deep {
+  .ProseMirror {
+    > * + * {
+      margin-top: 0.75em;
+    }
+  }
+
+  .word-break {
+    display: inline-block;
+    height: 1em;
+    margin: 0 0.1em;
+    line-height: 1em;
+    border: 1px dashed #868e96;
+    color: #868e96;
+
+    &::before {
+      content: '-';
+    }
+  }
+}
+</style>
--- a/docs/src/demos/Experiments/WordBreak/word-break.ts
+++ b/docs/src/demos/Experiments/WordBreak/word-break.ts
@@ -0,0 +1,71 @@
+import { Command, Node, mergeAttributes } from '@tiptap/core'
+import { exitCode } from 'prosemirror-commands'
+
+export interface WordBreakOptions {
+  HTMLAttributes: {
+    [key: string]: any
+  },
+}
+
+declare module '@tiptap/core' {
+  interface Commands {
+    wordBreak: {
+      /**
+       * Add a hard break
+       */
+      setWordBreak: () => Command,
+    }
+  }
+}
+
+export const WordBreak = Node.create<WordBreakOptions>({
+  name: 'wordBreak',
+
+  defaultOptions: {
+    HTMLAttributes: {},
+  },
+
+  inline: true,
+
+  group: 'inline',
+
+  selectable: false,
+
+  parseHTML() {
+    return [
+      { tag: 'wbr' },
+    ]
+  },
+
+  renderHTML({ HTMLAttributes }) {
+    return ['wbr', mergeAttributes(this.options.HTMLAttributes, HTMLAttributes)]
+  },
+
+  addCommands() {
+    return {
+      setWordBreak: () => ({ commands, state, dispatch }) => {
+        return commands.first([
+          () => exitCode(state, dispatch),
+          () => {
+            if (dispatch) {
+              state.tr.replaceSelectionWith(this.type.create()).scrollIntoView()
+            }
+
+            return true
+          },
+        ])
+      },
+    }
+  },
+
+  addNodeView() {
+    return () => {
+      const dom = document.createElement('span')
+      dom.classList.add('word-break')
+
+      return {
+        dom,
+      }
+    }
+  },
+})