0
# Plugin System
1

2
Comprehensive plugin architecture for extending editor functionality with type-safe configuration, lifecycle hooks, and extensibility patterns.
3

4
## Capabilities
5

6
### createSlatePlugin
7

8
Creates a new plugin with comprehensive configuration options and type safety.
9

10
```typescript { .api }
11
/**
12
 * Creates a new Slate plugin with configuration
13
 * @param config - Plugin configuration object
14
 * @returns Configured plugin instance
15
 */
16
function createSlatePlugin<T>(config: PluginConfig<T>): SlatePlugin<T>;
17

18
interface PluginConfig<T = {}> {
19
  /** Unique plugin identifier */
20
  key: string;
21
  /** Node configuration for element/leaf plugins */
22
  node?: NodeConfig;
23
  /** API methods extension */
24
  api?: ApiConfig;
25
  /** Transform functions extension */
26
  transforms?: TransformConfig;
27
  /** Plugin-specific options */
28
  options?: T;
29
  /** Plugin dependencies */
30
  dependencies?: string[];
31
  /** Plugin priority for loading order */
32
  priority?: number;
33
}
34

35
interface NodeConfig {
36
  /** Node type identifier */
37
  type?: string;
38
  /** Whether this is a leaf node */
39
  isLeaf?: boolean;
40
  /** Whether this is a container element */
41
  isContainer?: boolean;
42
  /** Node properties */
43
  props?: Record<string, any>;
44
}
45
```
46

47
**Usage Examples:**
48

49
```typescript
50
import { createSlatePlugin } from "@platejs/core";
51

52
// Basic element plugin
53
const ParagraphPlugin = createSlatePlugin({
54
  key: 'paragraph',
55
  node: { 
56
    type: 'p',
57
    isContainer: true 
58
  }
59
});
60

61
// Plugin with API extension
62
const CustomPlugin = createSlatePlugin({
63
  key: 'custom',
64
  api: {
65
    create: (options: any) => {
66
      // Custom API method
67
    }
68
  },
69
  transforms: {
70
    insert: (editor, options) => {
71
      // Custom transform
72
    }
73
  }
74
});
75
```
76

77
### getSlatePlugin
78

79
Retrieves a plugin instance by key with full type inference.
80

81
```typescript { .api }
82
/**
83
 * Get a plugin instance by key
84
 * @param plugin - Plugin identifier or plugin with key
85
 * @returns Plugin instance with full type information
86
 */
87
function getSlatePlugin<T>(plugin: WithRequiredKey<T>): T;
88
```
89

90
### Plugin Lifecycle
91

92
Plugins support comprehensive lifecycle hooks for editor integration.
93

94
```typescript { .api }
95
interface PluginLifecycle {
96
  /** Called when plugin is initialized */
97
  onInit?: (editor: SlateEditor) => void;
98
  /** Called when editor value changes */
99
  onChange?: (editor: SlateEditor) => void;
100
  /** Called when selection changes */
101
  onSelectionChange?: (editor: SlateEditor) => void;
102
  /** Called before editor operations */
103
  onBeforeOperation?: (editor: SlateEditor, operation: any) => void;
104
}
105
```
106

107
### Plugin API Extensions
108

109
Plugins can extend the editor API with custom methods.
110

111
```typescript { .api }
112
interface ApiConfig {
113
  [methodName: string]: (editor: SlateEditor, ...args: any[]) => any;
114
}
115
```
116

117
**Usage Examples:**
118

119
```typescript
120
const LinkPlugin = createSlatePlugin({
121
  key: 'link',
122
  node: { type: 'a' },
123
  api: {
124
    insert: (editor, { url, text }) => {
125
      editor.insertNode({
126
        type: 'a',
127
        url,
128
        children: [{ text }]
129
      });
130
    },
131
    remove: (editor) => {
132
      // Remove link functionality
133
    }
134
  }
135
});
136

137
// Usage
138
editor.api.link.insert({ url: 'https://example.com', text: 'Link' });
139
```
140

141
### Plugin Transform Extensions
142

143
Plugins can add custom transform functions to the editor.
144

145
```typescript { .api }
146
interface TransformConfig {
147
  [transformName: string]: (editor: SlateEditor, ...args: any[]) => void;
148
}
149
```
150

151
### Plugin Dependencies
152

153
Plugins can declare dependencies on other plugins for proper loading order.
154

155
```typescript { .api }
156
const AdvancedPlugin = createSlatePlugin({
157
  key: 'advanced',
158
  dependencies: ['paragraph', 'history'],
159
  // Plugin will load after its dependencies
160
});
161
```
162

163
## Core Plugin Types
164

165
```typescript { .api }
166
interface SlatePlugin<T = {}> {
167
  key: string;
168
  options: T;
169
  node?: NodeConfig;
170
  api?: Record<string, Function>;
171
  transforms?: Record<string, Function>;
172
  priority: number;
173
  dependencies: string[];
174
}
175

176
type CorePlugin = SlatePlugin<any>;
177
type WithRequiredKey<T> = T & { key: string };
178
```