forked from JiHong88/suneditor
-
Notifications
You must be signed in to change notification settings - Fork 0
Expand file tree
/
Copy pathplugins.js
More file actions
242 lines (214 loc) · 7.04 KB
/
plugins.js
File metadata and controls
242 lines (214 loc) · 7.04 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
/**
* @fileoverview Plugin interface definitions for SunEditor.
* These types define required methods for different plugin types.
*/
import KernelInjector from '../core/kernel/kernelInjector';
/**
* @abstract
* Base class for all plugins - contains common properties
*/
class Base extends KernelInjector {
/** @type {string} - Plugin type (`browser`|`command`|`dropdown`|`field`|`input`|`modal`|`popup`) */
static type = '';
/** @type {string} - Unique plugin identifier */
static key = '';
/** @type {string} - CSS class name for the plugin button */
static className = '';
/**
* Plugin-specific options
* @type {{eventIndex?: number, isInputComponent?: boolean}}
* @property {number} [eventIndex=0] - Plugin event handler execution priority (higher = later)
* @property {boolean} [isInputComponent=false] - Allow keyboard input inside component (e.g., table cells).
* - Prevents auto-selection on arrow keys.
*/
static options = {};
/**
* @constructor
* @param {SunEditor.Kernel} kernel - The Kernel instance
*/
constructor(kernel) {
super(kernel);
// plugin basic properties
/** @type {string}Toolbar button tooltip text (e.g., `this.$.lang.font`) */
this.title = '';
/** @type {string} - Toolbar button icon HTML string (e.g., `this.$.icons.bold`) */
this.icon = '';
/** @type {string|HTMLElement|boolean|null} - Inner content of the toolbar button. HTML string for dropdown text labels, HTMLElement for input fields, or `false` to hide. */
this.inner = null;
/** @type {HTMLElement} - Element inserted before the main toolbar button (e.g., decrease button in fontSize) */
this.beforeItem = null;
/** @type {HTMLElement} - Element inserted after the main toolbar button (e.g., dropdown arrow, increase button) */
this.afterItem = null;
/** @type {HTMLElement} - Replaces the entire default toolbar button with a custom element */
this.replaceButton = null;
}
}
// =====================================================================================================================================================
/**
* @abstract
* @interface
* Base class for Browser plugins
* Child classes MUST implement open(), close(), and onSelectFile() methods
*/
export class PluginBrowser extends Base {
static type = 'browser';
/**
* @abstract
* @description Executes the method that is called when a `Browser` module is opened.
* @param {?(target: Node) => *} [onSelectfunction] - Method to be executed after selecting an item in the gallery
* @returns {void}
*/
open(onSelectfunction) {
throw new Error(`[${this.constructor.name}] Abstract method 'open()' must be implemented`);
}
/**
* @abstract
* @description Executes the method that is called when a `Browser` module is closed.
* @returns {void}
*/
close() {
throw new Error(`[${this.constructor.name}] Abstract method 'close()' must be implemented`);
}
}
/**
* @abstract
* @interface
* Base class for Command plugins
* Child classes MUST implement the action() method
*/
export class PluginCommand extends Base {
static type = 'command';
/**
* @abstract
* @description Executes the main execution method of the plugin.
* - It is executed by clicking a toolbar `command` button or calling an API.
* - MUST be overridden by child classes
* @param {HTMLElement} [target] - The plugin's toolbar button element
* @returns {void | Promise<void>}
*/
action(target) {
throw new Error(`[${this.constructor.name}] Abstract method 'action()' must be implemented`);
}
}
/**
* @abstract
* @interface
* Base class for Dropdown plugins
* Child classes MUST implement the action() method
* Child classes MAY optionally implement on() and off() methods
*/
export class PluginDropdown extends Base {
static type = 'dropdown';
/**
* @optional
* @description Executes the method that is called when a plugin's dropdown menu is opened.
* @param {HTMLElement} [target] - The dropdown target element
* @returns {void}
*/
on(target) {}
/**
* @abstract
* @description Executes the main execution method of the plugin.
* - Called when an item in the `dropdown` menu is clicked.
* - MUST be overridden by child classes
* @param {HTMLElement} target - The clicked dropdown item element
* @returns {void | Promise<void>}
*/
action(target) {
throw new Error(`[${this.constructor.name}] Abstract method 'action()' must be implemented`);
}
}
/**
* @abstract
* @interface
* Base class for Dropdown-Free plugins
* These plugins handle their own event logic without automatic action() calls
* Typically used for complex UI components like ColorPicker or Table
* Child classes MAY optionally implement on() and off() methods
*/
export class PluginDropdownFree extends Base {
static type = 'dropdown-free';
/**
* @optional
* @description Executes the method that is called when a plugin's dropdown menu is opened.
* @param {HTMLElement} [target] - The dropdown target element
* @returns {void}
*/
on(target) {
void target;
}
/**
* @optional
* @description Executes the method that is called when a plugin's dropdown menu is closed.
* @returns {void}
*/
off() {}
}
/**
* @abstract
* @interface
* Base class for Field plugins
* These plugins typically respond to input events in the wysiwyg area
*
* **Commonly used hooks:**
* - `onInput()` - Responds to input events in the editor (See: `autocomplete` plugin)
* - Other event hooks can be used as needed (`onKeydown`, `onClick`, etc.)
*
* Child classes MAY optionally implement event hook methods
* @see {Mention} - Example implementation using onInput hook
*/
export class PluginField extends Base {
static type = 'field';
/**
* @optional
* @description Executes when user inputs text in the editor.
* - Commonly used in field plugins to detect trigger characters or patterns
* @type {SunEditor.Hook.Event.OnInput}
* @type {SunEditor.Hook.Event.OnInputAsync}
*/
// onInput() {}
}
export class PluginInput extends Base {
static type = 'input';
/**
* @optional
* @description Executes the event function of toolbar's input tag - `keydown`.
* @param {SunEditor.HookParams.ToolbarInputKeyDown} params - Input event information
* @returns {void}
*/
toolbarInputKeyDown(params) {
void params;
}
/**
* @optional
* @description Executes the event function of toolbar's input tag - `change`.
* @param {SunEditor.HookParams.ToolbarInputChange} params - Input event information
* @returns {void}
*/
toolbarInputChange(params) {
void params;
}
}
export class PluginModal extends Base {
static type = 'modal';
/**
* @abstract
* Opens the modal window (Plugin's public API called by toolbar/external code)
* @param {HTMLElement} [target] - The plugin's toolbar button element
* @returns {void}
*/
open(target) {
throw new Error(`[${this.constructor.name}] Abstract method 'open()' must be implemented`);
}
}
export class PluginPopup extends Base {
static type = 'popup';
/**
* @abstract
* Called when a popup is shown
* @returns {void}
*/
show() {
throw new Error(`[${this.constructor.name}] Abstract method 'show()' must be implemented`);
}
}