Merge branch 'main' of https://github.com/ueberdosis/tiptap-next into feature/remove-inferred-commands

README.md

@@ -33,8 +33,8 @@ To check out some live examples, visit [next.tiptap.dev](https://next.tiptap.dev
 Please see [CONTRIBUTING](CONTRIBUTING.md) for details.
 
 ## Maintainers
-- [Philipp Kühn](https://github.com/philippkuehn) (development)
+- [Philipp Kühn](https://github.com/philippkuehn) (developer)
-- [Hans Pagel](https://github.com/hanspagel) (documentation)
+- [Hans Pagel](https://github.com/hanspagel) (maintainer)
 
 ## Premium Sponsors
 - [überdosis](https://ueberdosis.io/)

docs/src/demos/Experiments/Details/details-summary.ts

@@ -0,0 +1,29 @@
+import { Node } from '@tiptap/core'
+
+export interface DetailsSummaryOptions {
+  HTMLAttributes: {
+    [key: string]: any
+  },
+}
+
+export default Node.create({
+  name: 'detailsSummary',
+
+  content: 'inline*',
+
+  // group: 'block',
+
+  defaultOptions: <DetailsSummaryOptions>{
+    HTMLAttributes: {},
+  },
+
+  parseHTML() {
+    return [{
+      tag: 'summary',
+    }]
+  },
+
+  renderHTML() {
+    return ['summary', 0]
+  },
+})

docs/src/demos/Experiments/Details/details.ts

@@ -0,0 +1,103 @@
+import { Node, mergeAttributes } from '@tiptap/core'
+
+export interface DetailsOptions {
+  HTMLAttributes: {
+    [key: string]: any
+  },
+}
+
+export default Node.create({
+  name: 'details',
+
+  content: 'detailsSummary block+',
+
+  group: 'block',
+
+  defaultOptions: <DetailsOptions>{
+    HTMLAttributes: {},
+  },
+
+  addAttributes() {
+    return {
+      open: {
+        default: true,
+        parseHTML: element => {
+          return {
+            open: element.hasAttribute('open'),
+          }
+        },
+        renderHTML: attributes => {
+          if (!attributes.open) {
+            return null
+          }
+
+          return {
+            open: 'open',
+          }
+        },
+      },
+    }
+  },
+
+  parseHTML() {
+    return [{
+      tag: 'details',
+    }]
+  },
+
+  renderHTML({ HTMLAttributes }) {
+    return ['details', mergeAttributes(this.options.HTMLAttributes, HTMLAttributes), 0]
+  },
+
+  addNodeView() {
+    return ({
+      node,
+      HTMLAttributes,
+      getPos,
+      editor,
+    }) => {
+      const { view } = editor
+      const item = document.createElement('details')
+
+      item.addEventListener('click', event => {
+        // @ts-ignore
+        const { open } = event.target.parentElement as HTMLElement
+        // @ts-ignore
+        const { localName } = event.target
+
+        if (typeof getPos === 'function' && localName === 'summary') {
+          view.dispatch(view.state.tr.setNodeMarkup(getPos(), undefined, {
+            open: !open,
+          }))
+          editor.commands.focus()
+        }
+      })
+
+      if (node.attrs.open) {
+        item.setAttribute('open', 'open')
+      }
+
+      Object.entries(HTMLAttributes).forEach(([key, value]) => {
+        item.setAttribute(key, value)
+      })
+
+      return {
+        dom: item,
+        contentDOM: item,
+        update: updatedNode => {
+          if (updatedNode.type !== this.type) {
+            return false
+          }
+
+          if (updatedNode.attrs.open) {
+            item.setAttribute('open', 'open')
+          } else {
+            item.removeAttribute('open')
+          }
+
+          return true
+        },
+      }
+    }
+  },
+})

docs/src/demos/Experiments/Details/index.vue

@@ -0,0 +1,58 @@
+<template>
+  <div v-if="editor">
+    <editor-content :editor="editor" />
+  </div>
+</template>
+
+<script>
+import {
+  Editor, EditorContent, defaultExtensions,
+} from '@tiptap/vue-starter-kit'
+import Details from './details'
+import DetailsSummary from './details-summary'
+
+export default {
+  components: {
+    EditorContent,
+  },
+
+  data() {
+    return {
+      editor: null,
+    }
+  },
+
+  mounted() {
+    this.editor = new Editor({
+      extensions: [
+        ...defaultExtensions(),
+        Details,
+        DetailsSummary,
+      ],
+      content: `
+        <p>Here is a details list:</p>
+        <details open>
+          <summary>An open details tag</summary>
+          <p>More info about the details.</p>
+        </details>
+        <details>
+          <summary>A closed details tag</summary>
+          <p>More info about the details.</p>
+        </details>
+      `,
+    })
+  },
+
+  beforeDestroy() {
+    this.editor.destroy()
+  },
+}
+</script>
+
+<style lang="scss">
+.ProseMirror {
+  > * + * {
+    margin-top: 0.75em;
+  }
+}
+</style>

docs/src/docPages/api/extensions/character-count.md

@@ -22,4 +22,4 @@ yarn add @tiptap/extension-character-count
 [packages/extension-character-count/](https://github.com/ueberdosis/tiptap-next/blob/main/packages/extension-character-count/)
 
 ## Usage
-<demo name="Extensions/CharacterCount" highlight="" />
+<demo name="Extensions/CharacterCount" />

docs/src/docPages/api/extensions/font-family.md

@@ -31,4 +31,4 @@ yarn add @tiptap/extension-text-style @tiptap/extension-font-family
 [packages/extension-font-family/](https://github.com/ueberdosis/tiptap-next/blob/main/packages/extension-font-family/)
 
 ## Usage
-<demo name="Extensions/FontFamily" highlight="" />
+<demo name="Extensions/FontFamily" />

docs/src/docPages/examples/book.md

@@ -4,4 +4,4 @@ This demo has 150 paragraphs and more than 13,000 words, check the performance y
 
 Most of the processing is needed to check the active state of the buttons for the selection. If you’d like to optimize for really long texts, try to limit these checks in your toolbar. But honestly, we think it’s great already, isn’t it?
 
-<demo name="Examples/Book" highlight="" />
+<demo name="Examples/Book" />

docs/src/docPages/examples/tables.md

@@ -1,3 +1,7 @@
 # Tables
 
+:::pro Commercial use
+Using the collaborative editing commercially? [Become a sponsor](/sponsor) to fund its development!
+:::
+
 <demo name="Examples/Tables" />

docs/src/docPages/examples/todo-app.md

@@ -1,3 +1,3 @@
 # Todo App
 
-<demo name="Examples/TodoApp" highlight="" />
+<demo name="Examples/TodoApp" />

docs/src/docPages/experiments.md

@@ -9,6 +9,7 @@ Congratulations! You’ve found our playground with a list of experiments. Be aw
 * [Commands](/experiments/commands)
 * [Embeds](/experiments/embeds)
 * [Multiple editors](/experiments/multiple-editors)
+* [Details](/experiments/details)
 
 ## Waiting for approval
 * [@tiptap/extension-placeholder](/experiments/placeholder)

docs/src/docPages/experiments/color.md

@@ -2,4 +2,4 @@
 
 ⚠️ Experiment
 
-<demo name="Experiments/Color" highlight="" />
+<demo name="Experiments/Color" />

docs/src/docPages/experiments/commands.md

@@ -2,4 +2,4 @@
 
 ⚠️ Experiment
 
-<demo name="Experiments/Commands" highlight="" />
+<demo name="Experiments/Commands" />

docs/src/docPages/experiments/details.md

@@ -0,0 +1,5 @@
+# Details
+
+⚠️ Experiment
+
+<demo name="Experiments/Details" />

docs/src/docPages/experiments/embeds.md

@@ -2,4 +2,4 @@
 
 ⚠️ Experiment
 
-<demo name="Experiments/Embeds" highlight="" />
+<demo name="Experiments/Embeds" />

docs/src/docPages/experiments/linter.md

@@ -2,4 +2,4 @@
 
 ⚠️ Experiment
 
-<demo name="Experiments/Linter" highlight="" />
+<demo name="Experiments/Linter" />

docs/src/docPages/experiments/placeholder.md

@@ -2,4 +2,4 @@
 
 ⚠️ Experiment
 
-<demo name="Experiments/Placeholder" highlight="" />
+<demo name="Experiments/Placeholder" />

docs/src/links.yaml

@@ -51,7 +51,6 @@
       link: /guide/styling
     - title: Accessibility
       link: /guide/accessibility
-      type: draft
     - title: Export content
       link: /guide/content
     - title: Collaborative editing