details: add (not working) commands & basic styling

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

@@ -1,4 +1,4 @@
-import { Node, mergeAttributes } from '@tiptap/core'
+import { Node, mergeAttributes, Command } from '@tiptap/core'
 
 export interface DetailsOptions {
   HTMLAttributes: {
@@ -13,6 +13,8 @@ export default Node.create({
 
   group: 'block',
 
+  // defining: true,
+
   defaultOptions: <DetailsOptions>{
     HTMLAttributes: {},
   },
@@ -44,4 +46,30 @@ export default Node.create({
       }
     }
   },
+
+  addCommands() {
+    return {
+      /**
+       * Set a details node
+       */
+      setDetails: (): Command => ({ commands }) => {
+        // TODO: Doesn’t work
+        return commands.wrapIn('details')
+      },
+      /**
+       * Toggle a details node
+       */
+      toggleDetails: (): Command => ({ commands }) => {
+        // TODO: Doesn’t work
+        return commands.toggleWrap('details')
+      },
+      /**
+       * Unset a details node
+       */
+      unsetDetails: (): Command => ({ commands }) => {
+        // TODO: Doesn’t work
+        return commands.lift('details')
+      },
+    }
+  },
 })