error in addCommands() inside Extension.create()

[piszczu4]

Hi, I wrote the following extension

import { Extension } from "@tiptap/core";
import { Editor } from "@tiptap/react";

import { RawCommands } from "@tiptap/react";


export const CodeIndent = Extension.create({
	name: "codeIndent",

	addKeyboardShortcuts() {
		return {
			Tab: () => {
				if (this.editor.isActive("codeBlock")) {
					return this.editor.commands.insertContent("    ");
				}
				return false;
			},
			Backspace: () => {
				if (this.editor.isActive("codeBlock")) {
					if (this.editor.state.selection.empty) {
						let pos = this.editor.state.selection.from;
						let fragment = this.editor.state.doc.cut(pos - 4, pos).textContent;
						if (fragment === "    ") {
							return this.editor.commands.command(({ tr }) => {
								tr.deleteRange(pos - 4, pos);
								return true;
							});
						}
					}
				}
				return false;
			},
		};
	},

	addCommands() {
		return {
			indentCode: () => {
				if (this.editor.isActive("codeBlock")) {
					return this.editor.commands.insertContent("    ");
				}
				return false;
			},
			outdentCode: () => {
				if (this.editor.isActive("codeBlock")) {
					if (this.editor.state.selection.empty) {
						let pos = this.editor.state.selection.from;
						let fragment = this.editor.state.doc.cut(pos - 4, pos).textContent;
						if (fragment === "    ") {
							return this.editor.commands.command(({ tr }) => {
								tr.deleteRange(pos - 4, pos);
								return true;
							});
						}
					}
				}
				return false;
			},
		};
	},
});

but I got an error:

Type '(this: { name: string; options: any; storage: any; editor: Editor; parent: (() => Partial<RawCommands>) | undefined; }) => { indentCode: () => boolean; outdentCode: () => boolean; }' is not assignable to type '(this: { name: string; options: any; storage: any; editor: Editor; parent: (() => Partial<RawCommands>) | undefined; }) => Partial<RawCommands>'.
  Type '{ indentCode: () => boolean; outdentCode: () => boolean; }' has no properties in common with type 'Partial<RawCommands>'.

What should I change?

[kongweiying2]

I'm getting this error too.

[Flaviogonzalez]

try this code at the top of your extension

import { RawCommands } from "@tiptap/react";

declare module '@tiptap/core' {
  interface Commands<ReturnType> {
    codeIndent: {
      indentCode: () => boolean,
      outdentCode: () => boolean
    }
  }
}

export const CodeIndent = Extension.create({

https://tiptap.dev/docs/guides/typescript#command-type