ianhitchman/tiptap
1
0
Fork 0
Code Issues Pull Requests Actions 1 Packages Projects Releases Wiki Activity

Merge branch 'main' of github.com:ueberdosis/tiptap-next into main

Browse Source
This commit is contained in:
Hans Pagel
2020-09-23 09:37:49 +02:00
parent fa2fefcdd3 b0378e593d
commit 5c94dba75a
73 changed files with 805 additions and 599 deletions
Download Patch File Download Diff File Expand all files Collapse all files

36
docs/src/demos/Examples/Basic/index.vue
View File

@@ -1,58 +1,58 @@
<template>
<div>
<div v-if="editor">
<button @click="editor.focus().removeMarks()">
<button @click="editor.chain().focus().removeMarks().run()">
clear format
</button>
<button @click="editor.focus().bold()" :class="{ 'is-active': editor.isActive('bold') }">
<button @click="editor.chain().focus().bold().run()" :class="{ 'is-active': editor.isActive('bold') }">
bold
</button>
<button @click="editor.focus().italic()" :class="{ 'is-active': editor.isActive('italic') }">
<button @click="editor.chain().focus().italic().run()" :class="{ 'is-active': editor.isActive('italic') }">
italic
</button>
<button @click="editor.focus().underline()" :class="{ 'is-active': editor.isActive('underline') }">
<button @click="editor.chain().focus().underline().run()" :class="{ 'is-active': editor.isActive('underline') }">
underline
</button>
<button @click="editor.focus().strike()" :class="{ 'is-active': editor.isActive('strike') }">
<button @click="editor.chain().focus().strike().run()" :class="{ 'is-active': editor.isActive('strike') }">
strike
</button>
<button @click="editor.focus().code()" :class="{ 'is-active': editor.isActive('code') }">
<button @click="editor.chain().focus().code().run()" :class="{ 'is-active': editor.isActive('code') }">
code
</button>
<button @click="editor.focus().codeBlock()" :class="{ 'is-active': editor.isActive('codeBlock') }">
<button @click="editor.chain().focus().codeBlock().run()" :class="{ 'is-active': editor.isActive('codeBlock') }">
code block
</button>
<button @click="editor.focus().heading({ level: 1 })" :class="{ 'is-active': editor.isActive('heading', { level: 1 }) }">
<button @click="editor.chain().focus().heading({ level: 1 }).run()" :class="{ 'is-active': editor.isActive('heading', { level: 1 }) }">
h1
</button>
<button @click="editor.focus().heading({ level: 2 })" :class="{ 'is-active': editor.isActive('heading', { level: 2 }) }">
<button @click="editor.chain().focus().heading({ level: 2 }).run()" :class="{ 'is-active': editor.isActive('heading', { level: 2 }) }">
h2
</button>
<button @click="editor.focus().heading({ level: 3 })" :class="{ 'is-active': editor.isActive('heading', { level: 3 }) }">
<button @click="editor.chain().focus().heading({ level: 3 }).run()" :class="{ 'is-active': editor.isActive('heading', { level: 3 }) }">
h3
</button>
<button @click="editor.focus().heading({ level: 4 })" :class="{ 'is-active': editor.isActive('heading', { level: 4 }) }">
<button @click="editor.chain().focus().heading({ level: 4 }).run()" :class="{ 'is-active': editor.isActive('heading', { level: 4 }) }">
h4
</button>
<button @click="editor.focus().heading({ level: 5 })" :class="{ 'is-active': editor.isActive('heading', { level: 5 }) }">
<button @click="editor.chain().focus().heading({ level: 5 }).run()" :class="{ 'is-active': editor.isActive('heading', { level: 5 }) }">
h5
</button>
<button @click="editor.focus().heading({ level: 6 })" :class="{ 'is-active': editor.isActive('heading', { level: 6 }) }">
<button @click="editor.chain().focus().heading({ level: 6 }).run()" :class="{ 'is-active': editor.isActive('heading', { level: 6 }) }">
h6
</button>
<button @click="editor.focus().blockquote()" :class="{ 'is-active': editor.isActive('blockquote') }">
<button @click="editor.chain().focus().blockquote().run()" :class="{ 'is-active': editor.isActive('blockquote') }">
blockquote
</button>
<button @click="editor.focus().horizontalRule()">
<button @click="editor.chain().focus().horizontalRule().run()">
horizontal rule
</button>
<button @click="editor.focus().hardBreak()">
<button @click="editor.chain().focus().hardBreak().run()">
hard break
</button>
<button @click="editor.focus().undo()">
<button @click="editor.chain().focus().undo().run()">
undo
</button>
<button @click="editor.focus().redo()">
<button @click="editor.chain().focus().redo().run()">
redo
</button>
</div>

4
docs/src/demos/Examples/History/index.vue
View File

@@ -1,10 +1,10 @@
<template>
<div>
<div v-if="editor">
<button @click="editor.focus().undo()">
<button @click="editor.chain().focus().undo().run()">
undo
</button>
<button @click="editor.focus().redo()">
<button @click="editor.chain().focus().redo().run()">
redo
</button>
</div>

2
docs/src/demos/Extensions/Blockquote/index.vue
View File

@@ -1,6 +1,6 @@
<template>
<div v-if="editor">
<button @click="editor.focus().blockquote()" :class="{ 'is-active': editor.isActive('blockquote') }">
<button @click="editor.chain().focus().blockquote().run()" :class="{ 'is-active': editor.isActive('blockquote') }">
blockquote
</button>

2
docs/src/demos/Extensions/Bold/index.vue
View File

@@ -1,6 +1,6 @@
<template>
<div v-if="editor">
<button @click="editor.focus().bold()" :class="{ 'is-active': editor.isActive('bold') }">
<button @click="editor.chain().focus().bold().run()" :class="{ 'is-active': editor.isActive('bold') }">
bold
</button>

2
docs/src/demos/Extensions/BulletList/index.spec.js
View File

@@ -16,7 +16,7 @@ context('/api/extensions/bullet-list', () => {
})
cy.get('.ProseMirror')
.type('* List Item 1{enter}+ List Item 2{enter}- List Item 3')
.type('* List Item 1{enter}{enter}+ List Item 2{enter}{enter}- List Item 3')
cy.get('.ProseMirror')
.find('li:nth-child(1)')

4
docs/src/demos/Extensions/BulletList/index.vue
View File

@@ -1,8 +1,8 @@
<template>
<div v-if="editor">
<!-- <button @click="editor.focus().bulletList()" :class="{ 'is-active': editor.isActive('bulletList') }">
<button @click="editor.chain().focus().bulletList().run()" :class="{ 'is-active': editor.isActive('bulletList') }">
bullet list
</button> -->
</button>
<editor-content :editor="editor" />
</div>

2
docs/src/demos/Extensions/Code/index.vue
View File

@@ -1,6 +1,6 @@
<template>
<div v-if="editor">
<button @click="editor.focus().code()" :class="{ 'is-active': editor.isActive('code') }">
<button @click="editor.chain().focus().code().run()" :class="{ 'is-active': editor.isActive('code') }">
code
</button>

2
docs/src/demos/Extensions/CodeBlock/index.vue
View File

@@ -1,6 +1,6 @@
<template>
<div v-if="editor">
<button @click="editor.focus().codeBlock()" :class="{ 'is-active': editor.isActive('codeBlock') }">
<button @click="editor.chain().focus().codeBlock().run()" :class="{ 'is-active': editor.isActive('codeBlock') }">
code block
</button>

2
docs/src/demos/Extensions/HardBreak/index.vue
View File

@@ -1,6 +1,6 @@
<template>
<div v-if="editor">
<button @click="editor.focus().hardBreak()">
<button @click="editor.chain().focus().hardBreak().run()">
hardBreak
</button>

6
docs/src/demos/Extensions/Heading/index.vue
View File

@@ -1,12 +1,12 @@
<template>
<div v-if="editor">
<button @click="editor.focus().heading({ level: 1 })" :class="{ 'is-active': editor.isActive('heading', { level: 1 }) }">
<button @click="editor.chain().focus().heading({ level: 1 }).run()" :class="{ 'is-active': editor.isActive('heading', { level: 1 }) }">
h1
</button>
<button @click="editor.focus().heading({ level: 2 })" :class="{ 'is-active': editor.isActive('heading', { level: 2 }) }">
<button @click="editor.chain().focus().heading({ level: 2 }).run()" :class="{ 'is-active': editor.isActive('heading', { level: 2 }) }">
h2
</button>
<button @click="editor.focus().heading({ level: 3 })" :class="{ 'is-active': editor.isActive('heading', { level: 3 }) }">
<button @click="editor.chain().focus().heading({ level: 3 }).run()" :class="{ 'is-active': editor.isActive('heading', { level: 3 }) }">
h3
</button>

4
docs/src/demos/Extensions/History/index.vue
View File

@@ -1,9 +1,9 @@
<template>
<div v-if="editor">
<button @click="editor.focus().undo()">
<button @click="editor.chain().focus().undo().run()">
undo
</button>
<button @click="editor.focus().redo()">
<button @click="editor.chain().focus().redo().run()">
redo
</button>

2
docs/src/demos/Extensions/HorizontalRule/index.vue
View File

@@ -1,6 +1,6 @@
<template>
<div v-if="editor">
<button @click="editor.focus().horizontalRule()">
<button @click="editor.chain().focus().horizontalRule().run()">
horizontalRule
</button>

2
docs/src/demos/Extensions/Italic/index.vue
View File

@@ -1,6 +1,6 @@
<template>
<div v-if="editor">
<button @click="editor.focus().italic()" :class="{ 'is-active': editor.isActive('italic') }">
<button @click="editor.chain().focus().italic().run()" :class="{ 'is-active': editor.isActive('italic') }">
italic
</button>

2
docs/src/demos/Extensions/Strike/index.vue
View File

@@ -1,6 +1,6 @@
<template>
<div v-if="editor">
<button @click="editor.focus().strike()" :class="{ 'is-active': editor.isActive('strike') }">
<button @click="editor.chain().focus().strike().run()" :class="{ 'is-active': editor.isActive('strike') }">
strike
</button>

2
docs/src/demos/Extensions/Underline/index.vue
View File

@@ -1,6 +1,6 @@
<template>
<div v-if="editor">
<button @click="editor.focus().underline()" :class="{ 'is-active': editor.isActive('underline') }">
<button @click="editor.chain().focus().underline().run()" :class="{ 'is-active': editor.isActive('underline') }">
underline
</button>

14
docs/src/demos/Guide/BuildYourEditor/index.vue
View File

@@ -1,25 +1,25 @@
<template>
<div>
<div v-if="editor">
<button @click="editor.focus().removeMarks()">
<button @click="editor.chain().focus().removeMarks().run()">
clear formatting
</button>
<button @click="editor.focus().undo()">
<button @click="editor.chain().focus().undo().run()">
undo
</button>
<button @click="editor.focus().redo()">
<button @click="editor.chain().focus().redo().run()">
redo
</button>
<button @click="editor.focus().bold()" :class="{ 'is-active': editor.isActive('bold') }">
<button @click="editor.chain().focus().bold().run()" :class="{ 'is-active': editor.isActive('bold') }">
bold
</button>
<button @click="editor.focus().italic()" :class="{ 'is-active': editor.isActive('italic') }">
<button @click="editor.chain().focus().italic().run()" :class="{ 'is-active': editor.isActive('italic') }">
italic
</button>
<button @click="editor.focus().heading({ level: 1 })" :class="{ 'is-active': editor.isActive('heading', { level: 1 }) }">
<button @click="editor.chain().focus().heading({ level: 1 }).run()" :class="{ 'is-active': editor.isActive('heading', { level: 1 }) }">
h1
</button>
<button @click="editor.focus().heading({ level: 2 })" :class="{ 'is-active': editor.isActive('heading', { level: 2 }) }">
<button @click="editor.chain().focus().heading({ level: 2 }).run()" :class="{ 'is-active': editor.isActive('heading', { level: 2 }) }">
h2
</button>
</div>

4
docs/src/demos/React/index.jsx
View File

@@ -9,12 +9,12 @@ const MenuBar = () => {
return (
<>
<button onClick={() => editor.focus().removeMarks()}>
<button onClick={() => editor.chain().focus().removeMarks().run()}>
Clear formatting
</button>
<button
className={`${editor.isActive('bold') ? 'is-active' : ''}`}
onClick={() => editor.focus().bold()}
onClick={() => editor.chain().focus().bold().run()}
>
Bold
</button>

2
docs/src/demos/SimpleMenuBar/index.vue
View File

@@ -5,7 +5,7 @@
<button
class="menubar__button"
:class="{ 'is-active': editor.isActive('bold') }"
@click="editor.focus().bold()"
@click="editor.chain().focus().bold().run()"
>
Bold
</button>

2
docs/src/docPages/overview/upgrade-guide.md
View File

@@ -100,5 +100,5 @@ Currently, blockquotes must not be nested anymore. That said, we’re working on
We tried to hide the `.focus()` command from you with tiptap 1 and executed that on every other command. That led to issues in specific use cases, where you want to run a command, but don’t want to focus the editor. With tiptap 2.x you have to explicitly call the `focus()` and you probably want to do that in a lot of places. Here is an example:
```js
editor.focus().bold()
editor.chain().focus().bold().run()
```