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

# Conflicts:
#	docs/src/demos/Experiments/Annotation/extension/annotation.ts
#	docs/src/demos/Experiments/Color/extension/Color.ts
#	docs/src/demos/Experiments/Details/details.ts

docs/src/docPages/guide/accessibility.md

@@ -1,7 +1,7 @@
 # Accessibility
 
 :::pro Fund the development ♥
-We need your support to maintain, update, support and develop tiptap 2. If you’re waiting for progress here, [become a sponsor and fund open source](/sponsor).
+We need your support to maintain, update, support and develop tiptap 2. If you’re waiting for progress here, [become a sponsor and fund open-source](/sponsor).
 :::
 
 ## toc

docs/src/docPages/guide/configuration.md

@@ -37,8 +37,27 @@ This will do the following:
 5. make the text editable (but that’s the default anyway), and
 6. disable the loading of [the default CSS](https://github.com/ueberdosis/tiptap-next/tree/main/packages/core/src/style.ts) (which is not much anyway).
 
-## Configure extensions
-A lot of the extension can be configured, too. Add an `.configure()` to the extension and pass an object to it. The following example will disable the default heading levels 4, 5 and 6:
+## Nodes, marks and extensions
+Most features are packed into [nodes](/api/nodes), [marks](/api/marks) and [extensions](/api/extensions). Import what you need and pass them as an Array to the editor and you are good to go. Here is the minimal setup with only three extensions:
+
+```js
+import { Editor } from '@tiptap/core'
+import Document from '@tiptap/extension-document'
+import Paragraph from '@tiptap/extension-paragraph'
+import Text from '@tiptap/extension-text'
+
+new Editor({
+  element: document.querySelector('.element'),
+  extensions: [
+    Document,
+    Paragraph,
+    Text,
+  ],
+})
+```
+
+### Configure an extensions
+Most extensions can be configured. Add a `.configure()` to pass an object to it. The following example will disable the default heading levels 4, 5 and 6:
 
 ```js
 import { Editor } from '@tiptap/core'
@@ -60,4 +79,57 @@ new Editor({
 })
 ```
 
-Have a look at the documentation of the extension you’re using to learn more about their settings.
+Have a look at the documentation of the extension you use to learn more about their settings.
+
+### Default extensions
+We have put together a few of the most common extensions and provide a `defaultExtensions()` helper to load them. Here is how you to use that:
+
+```js
+import { Editor, defaultExtensions } from '@tiptap/starter-kit'
+
+new Editor({
+  extensions: defaultExtensions(),
+})
+```
+
+And you can even pass configuration for all default extensions as an object. Just prefix the configuration with the extension name:
+
+```js
+import { Editor, defaultExtensions } from '@tiptap/starter-kit'
+
+new Editor({
+  extensions: defaultExtensions({
+    heading: {
+      levels: [1, 2, 3]
+    },
+  }),
+})
+```
+
+The `defaultExtensions()` function returns an array, so if you want to load them and add some custom extensions you could write it like that:
+
+```js
+import { Editor, defaultExtensions } from '@tiptap/starter-kit'
+import Strike from '@tiptap/extension-strike'
+
+new Editor({
+  extensions: [
+    ...defaultExtensions(),
+    Strike,
+  ],
+})
+```
+
+Don’t want to load a specific extension? Just filter it out:
+
+```js
+import { Editor, defaultExtensions } from '@tiptap/starter-kit'
+
+new Editor({
+  extensions: [
+    ...defaultExtensions().filter(extension => extension.config.name !== 'history'),
+  ]
+})
+```
+
+You’ll probably see something like that in collaborative editing examples. The [`Collaboration`](/api/extensions/collaboration) comes with its own history extension, you need to remove the default [`History`](/api/extensions/history) extension to avoid conflicts.

docs/src/docPages/guide/extend-extensions.md

@@ -6,7 +6,7 @@
 One of the strength of tiptap is it’s extendability. You don’t depend on the provided extensions, it’s intended to extend the editor to your liking. With custom extensions you can add new content types and new functionalities, on top of what already exists or from scratch.
 
 ## Customize existing extensions
-Let’s say you want to change the keyboard shortcuts for the bullet list. You should start by looking at [the source code of the `BulletList` extension](https://github.com/ueberdosis/tiptap-next/blob/main/packages/extension-bullet-list/index.ts) and find the part you would like to change. In that case, the keyboard shortcut, and just that.
+Let’s say you want to change the keyboard shortcuts for the bullet list. You should start by looking at [the source code of the `BulletList` extension](https://github.com/ueberdosis/tiptap-next/blob/main/packages/extension-bullet-list/src/bullet-list.ts) and find the part you would like to change. In that case, the keyboard shortcut, and just that.
 
 Every extension has an `extend()` method, which takes an object with everything you want to change or add to it. For the bespoken example, your code could like that:
 

docs/src/docPages/guide/node-views.md

@@ -146,3 +146,32 @@ export default {
   </node-view-wrapper>
 </template>
 ```
+
+## Reference
+
+### dom: ?⁠dom.Node
+> The outer DOM node that represents the document node. When not given, the default strategy is used to create a DOM node.
+
+### contentDOM: ?⁠dom.Node
+> The DOM node that should hold the node's content. Only meaningful if the node view also defines a dom property and if its node type is not a leaf node type. When this is present, ProseMirror will take care of rendering the node's children into it. When it is not present, the node view itself is responsible for rendering (or deciding not to render) its child nodes.
+
+### update: ?⁠fn(node: Node, decorations: [Decoration]) → bool
+> When given, this will be called when the view is updating itself. It will be given a node (possibly of a different type), and an array of active decorations (which are automatically drawn, and the node view may ignore if it isn't interested in them), and should return true if it was able to update to that node, and false otherwise. If the node view has a contentDOM property (or no dom property), updating its child nodes will be handled by ProseMirror.
+
+### selectNode: ?⁠fn()
+> Can be used to override the way the node's selected status (as a node selection) is displayed.
+
+### deselectNode: ?⁠fn()
+> When defining a selectNode method, you should also provide a deselectNode method to remove the effect again.
+
+### setSelection: ?⁠fn(anchor: number, head: number, root: dom.Document)
+> This will be called to handle setting the selection inside the node. The anchor and head positions are relative to the start of the node. By default, a DOM selection will be created between the DOM positions corresponding to those positions, but if you override it you can do something else.
+
+### stopEvent: ?⁠fn(event: dom.Event) → bool
+> Can be used to prevent the editor view from trying to handle some or all DOM events that bubble up from the node view. Events for which this returns true are not handled by the editor.
+
+### ignoreMutation: ?⁠fn(dom.MutationRecord) → bool
+> Called when a DOM mutation or a selection change happens within the view. When the change is a selection change, the record will have a type property of "selection" (which doesn't occur for native mutation records). Return false if the editor should re-read the selection or re-parse the range around the mutation, true if it can safely be ignored.
+
+### destroy: ?⁠fn()
+> Called when the node view is removed from the editor or the whole editor is destroyed.

docs/src/docPages/guide/toolbar.md

@@ -63,7 +63,7 @@ editor.isActive({ textAlign: 'right' })
 If your selection spans multiple nodes or marks, or only part of the selection has a mark, `isActive()` will return `false` and indicate nothing is active. That is how it is supposed to be, because it allows people to apply a new node or mark to that selection right-away.
 
 ## Icons
-Most editor toolbars use icons for their buttons. In some of our demos, we use the open source icon set [Remix Icon](https://remixicon.com/), that’s free to use. But it’s totally up to you what you use. Here are a few icon sets you can consider:
+Most editor toolbars use icons for their buttons. In some of our demos, we use the open-source icon set [Remix Icon](https://remixicon.com/), that’s free to use. But it’s totally up to you what you use. Here are a few icon sets you can consider:
 
 * [Remix Icon](https://remixicon.com/#editor)
 * [Font Awesome](https://fontawesome.com/icons?c=editors)