0
# Commands and Editing
1

2
The commands system provides high-level editing operations that can be bound to keys, triggered by UI elements, or called programmatically. Commands handle text manipulation, selection, and document structure changes.
3

4
## Capabilities
5

6
### Command Definition
7

8
Commands are functions that examine the editor state and optionally perform editing actions.
9

10
```typescript { .api }
11
/**
12
 * A command is a function that takes an editor state and optionally dispatches a transaction
13
 */
14
type Command = (state: EditorState, dispatch?: (tr: Transaction) => void, view?: EditorView) => boolean;
15
```
16

17
### Selection Commands
18

19
Commands for managing and manipulating selections.
20

21
```typescript { .api }
22
/**
23
 * Delete the current selection
24
 */
25
function deleteSelection(state: EditorState, dispatch?: (tr: Transaction) => void): boolean;
26

27
/**
28
 * Select the entire document
29
 */
30
function selectAll(state: EditorState, dispatch?: (tr: Transaction) => void): boolean;
31

32
/**
33
 * Select the parent node of the current selection
34
 */
35
function selectParentNode(state: EditorState, dispatch?: (tr: Transaction) => void): boolean;
36

37
/**
38
 * Select a node backward from the current position
39
 */
40
function selectNodeBackward(state: EditorState, dispatch?: (tr: Transaction) => void): boolean;
41

42
/**
43
 * Select a node forward from the current position
44
 */
45
function selectNodeForward(state: EditorState, dispatch?: (tr: Transaction) => void): boolean;
46

47
/**
48
 * Move selection to the start of the current text block
49
 */
50
function selectTextblockStart(state: EditorState, dispatch?: (tr: Transaction) => void): boolean;
51

52
/**
53
 * Move selection to the end of the current text block
54
 */
55
function selectTextblockEnd(state: EditorState, dispatch?: (tr: Transaction) => void): boolean;
56
```
57

58
### Block Commands
59

60
Commands for manipulating block-level content.
61

62
```typescript { .api }
63
/**
64
 * Join the current block with the previous one
65
 */
66
function joinBackward(state: EditorState, dispatch?: (tr: Transaction) => void): boolean;
67

68
/**
69
 * Join the current block with the next one
70
 */
71
function joinForward(state: EditorState, dispatch?: (tr: Transaction) => void): boolean;
72

73
/**
74
 * Join the current block with the one above
75
 */
76
function joinUp(state: EditorState, dispatch?: (tr: Transaction) => void): boolean;
77

78
/**
79
 * Join the current block with the one below
80
 */
81
function joinDown(state: EditorState, dispatch?: (tr: Transaction) => void): boolean;
82

83
/**
84
 * Lift the content around the selection out of its parent
85
 */
86
function lift(state: EditorState, dispatch?: (tr: Transaction) => void): boolean;
87

88
/**
89
 * Split the current block at the selection
90
 */
91
function splitBlock(state: EditorState, dispatch?: (tr: Transaction) => void): boolean;
92

93
/**
94
 * Split the current block while preserving marks
95
 */
96
function splitBlockKeepMarks(state: EditorState, dispatch?: (tr: Transaction) => void): boolean;
97

98
/**
99
 * Create a paragraph near the current position
100
 */
101
function createParagraphNear(state: EditorState, dispatch?: (tr: Transaction) => void): boolean;
102

103
/**
104
 * Lift an empty block out of its parent
105
 */
106
function liftEmptyBlock(state: EditorState, dispatch?: (tr: Transaction) => void): boolean;
107
```
108

109
### Text Block Commands
110

111
Commands specifically for text block manipulation.
112

113
```typescript { .api }
114
/**
115
 * Join text blocks backward
116
 */
117
function joinTextblockBackward(state: EditorState, dispatch?: (tr: Transaction) => void): boolean;
118

119
/**
120
 * Join text blocks forward
121
 */
122
function joinTextblockForward(state: EditorState, dispatch?: (tr: Transaction) => void): boolean;
123
```
124

125
### Code Block Commands
126

127
Commands for handling code blocks.
128

129
```typescript { .api }
130
/**
131
 * Insert a newline in a code block
132
 */
133
function newlineInCode(state: EditorState, dispatch?: (tr: Transaction) => void): boolean;
134

135
/**
136
 * Exit from a code block
137
 */
138
function exitCode(state: EditorState, dispatch?: (tr: Transaction) => void): boolean;
139
```
140

141
### Mark Commands
142

143
Commands for applying and removing text marks.
144

145
```typescript { .api }
146
/**
147
 * Toggle a mark on the current selection or at the cursor
148
 */
149
function toggleMark(markType: MarkType, attrs?: Attrs): Command;
150
```
151

152
### Node Transformation Commands
153

154
Commands for changing node types and wrapping content.
155

156
```typescript { .api }
157
/**
158
 * Change the type of the selected block(s)
159
 */
160
function setBlockType(nodeType: NodeType, attrs?: Attrs): Command;
161

162
/**
163
 * Wrap the selection in a node of the given type
164
 */
165
function wrapIn(nodeType: NodeType, attrs?: Attrs): Command;
166

167
/**
168
 * Split a block as a specific node type
169
 */
170
function splitBlockAs(nodeType: NodeType, attrs?: Attrs): Command;
171
```
172

173
### Utility Commands
174

175
Helper commands and command combinators.
176

177
```typescript { .api }
178
/**
179
 * Combine multiple commands, trying each in sequence until one succeeds
180
 */
181
function chainCommands(...commands: Command[]): Command;
182

183
/**
184
 * Automatically join nodes when appropriate after running a command
185
 */
186
function autoJoin(command: Command, isJoinable?: (before: Node, after: Node) => boolean): Command;
187
```
188

189
### Keymap Support
190

191
Pre-defined key bindings for common commands.
192

193
```typescript { .api }
194
/**
195
 * Basic keymap for common editing operations
196
 */
197
const baseKeymap: { [key: string]: Command };
198

199
/**
200
 * PC-specific keymap
201
 */
202
const pcBaseKeymap: { [key: string]: Command };
203

204
/**
205
 * Mac-specific keymap
206
 */
207
const macBaseKeymap: { [key: string]: Command };
208
```
209

210
**Usage Examples:**
211

212
```typescript
213
import { 
214
  deleteSelection, 
215
  selectAll, 
216
  toggleMark, 
217
  setBlockType, 
218
  chainCommands,
219
  baseKeymap 
220
} from "@tiptap/pm/commands";
221
import { keymap } from "@tiptap/pm/keymap";
222

223
// Use commands directly
224
const deleteCmd = deleteSelection(state, dispatch);
225

226
// Create a toggle bold command
227
const toggleBold = toggleMark(schema.marks.strong);
228

229
// Create a heading command
230
const makeHeading = setBlockType(schema.nodes.heading, { level: 1 });
231

232
// Chain commands
233
const customEnter = chainCommands(
234
  exitCode,
235
  splitBlockKeepMarks,
236
  createParagraphNear,
237
  splitBlock
238
);
239

240
// Use in keymap
241
const myKeymap = keymap({
242
  ...baseKeymap,
243
  "Mod-b": toggleBold,
244
  "Mod-1": makeHeading,
245
  "Enter": customEnter
246
});
247

248
// Add to editor
249
const state = EditorState.create({
250
  schema: mySchema,
251
  plugins: [myKeymap]
252
});
253
```
254

255
## Command Helpers
256

257
```typescript { .api }
258
/**
259
 * Check if a command can be run in the current state
260
 */
261
function canRunCommand(state: EditorState, command: Command): boolean;
262

263
/**
264
 * Run a command and return the new state if successful
265
 */
266
function runCommand(state: EditorState, command: Command): EditorState | null;
267
```
268

269
## Types
270

271
```typescript { .api }
272
/**
273
 * Function to check if two nodes can be joined
274
 */
275
type JoinPredicate = (before: Node, after: Node) => boolean;
276

277
/**
278
 * Key binding map
279
 */
280
interface Keymap {
281
  [key: string]: Command | false;
282
}
283
```