Adds attributes to toggleList (#3776)

* Adds attributes to toggleList

When dealing with different variants of bullet lists, I wanted to adopt the same technique I used for different paragraph variants. Since `wrapInList` is capable of receiving attributes, just like `setNode` is, I don't see any reason why `toggleList` should not be capable of the same. 

Here's my bullet list extension in action that is in need of attributes support.

```js
export const CustomBulletList = BulletList.extend({
  content: 'listItem*',

  addAttributes() {
    return {
      variant: {
        default: DEFAULT_LIST,

        renderHTML: attributes => {
          return {
            class: `list-${attributes.variant}`,
          };
        },
      },
    };
  },

  addCommands() {
    return {
      toggleBulletList: attributes => (c) => {
        return c.commands.toggleListCustom(this.name, this.options.itemTypeName, attributes);
      },
    };
  },
});
```

* Update toggle-list.md

* Update toggle-list.md

docs/api/commands/toggle-list.md

@@ -10,6 +10,14 @@ The type of node that should be used for the wrapping list
 
 The type of node that should be used for the list items
 
+`keepMarks?: boolean`
+
+If marks should be kept as list items or not
+
+`attributes?: Record<string, any>`
+
+The attributes that should be applied to the list. **This is optional.**
+
 ## Usage
 ```js
 // toggle a bullet list with list items

packages/core/src/commands/toggleList.ts

@@ -63,12 +63,12 @@ declare module '@tiptap/core' {
       /**
        * Toggle between different list types.
        */
-      toggleList: (listTypeOrName: string | NodeType, itemTypeOrName: string | NodeType, keepMarks?: boolean) => ReturnType;
+      toggleList: (listTypeOrName: string | NodeType, itemTypeOrName: string | NodeType, keepMarks?: boolean, attributes?: Record<string, any>) => ReturnType;
     }
   }
 }
 
-export const toggleList: RawCommands['toggleList'] = (listTypeOrName, itemTypeOrName, keepMarks) => ({
+export const toggleList: RawCommands['toggleList'] = (listTypeOrName, itemTypeOrName, keepMarks, attributes = {}) => ({
   editor, tr, state, dispatch, chain, commands, can,
 }) => {
   const { extensions, splittableMarks } = editor.extensionManager
@@ -114,15 +114,15 @@ export const toggleList: RawCommands['toggleList'] = (listTypeOrName, itemTypeOr
     return chain()
       // try to convert node to default node if needed
       .command(() => {
-        const canWrapInList = can().wrapInList(listType)
+        const canWrapInList = can().wrapInList(listType, attributes)
 
         if (canWrapInList) {
           return true
         }
 
         return commands.clearNodes()
       })
-      .wrapInList(listType)
+      .wrapInList(listType, attributes)
       .command(() => joinListBackwards(tr, listType))
       .command(() => joinListForwards(tr, listType))
       .run()
@@ -132,7 +132,7 @@ export const toggleList: RawCommands['toggleList'] = (listTypeOrName, itemTypeOr
     chain()
     // try to convert node to default node if needed
       .command(() => {
-        const canWrapInList = can().wrapInList(listType)
+        const canWrapInList = can().wrapInList(listType, attributes)
 
         const filteredMarks = marks.filter(mark => splittableMarks.includes(mark.type.name))
 
@@ -144,7 +144,7 @@ export const toggleList: RawCommands['toggleList'] = (listTypeOrName, itemTypeOr
 
         return commands.clearNodes()
       })
-      .wrapInList(listType)
+      .wrapInList(listType, attributes)
       .command(() => joinListBackwards(tr, listType))
       .command(() => joinListForwards(tr, listType))
       .run()