suneditor 3.0.0-beta.3 → 3.0.0-beta.30

package/types/plugins/dropdown/table.d.ts

@@ -18,6 +18,31 @@ export type TableCtrlProps = {
 	font_italic: HTMLButtonElement;
 	font_strike: HTMLButtonElement;
 };
+export type TablePluginOptions = {
+	/**
+	 * - Scroll type ('x', 'y', 'xy')
+	 */
+	scrollType?: 'x' | 'y' | 'xy';
+	/**
+	 * - Caption position ('top', 'bottom')
+	 */
+	captionPosition?: 'top' | 'bottom';
+	/**
+	 * - Cell controller position ('cell', 'table')
+	 */
+	cellControllerPosition?: 'cell' | 'table';
+	/**
+	 * - Color list, used in cell color picker
+	 */
+	colorList?: any[];
+};
+/**
+ * @typedef {Object} TablePluginOptions
+ * @property {"x"|"y"|"xy"} [scrollType='x'] - Scroll type ('x', 'y', 'xy')
+ * @property {"top"|"bottom"} [captionPosition='bottom'] - Caption position ('top', 'bottom')
+ * @property {"cell"|"table"} [cellControllerPosition='cell'] - Cell controller position ('cell', 'table')
+ * @property {Array} [colorList] - Color list, used in cell color picker
+ */
 /**
  * @class
  * @description Table Plugin
@@ -38,21 +63,9 @@ declare class Table extends EditorInjector {
 	/**
 	 * @constructor
 	 * @param {__se__EditorCore} editor - The root editor instance
-	 * @param {Object} pluginOptions
-	 * @param {"x"|"y"|"xy"} [pluginOptions.scrollType='x'] - Scroll type ('x', 'y', 'xy')
-	 * @param {"top"|"bottom"} [pluginOptions.captionPosition='bottom'] - Caption position ('top', 'bottom')
-	 * @param {"cell"|"table"} [pluginOptions.cellControllerPosition='cell'] - Cell controller position ('cell', 'table')
-	 * @param {Array} [pluginOptions.colorList] - Color list, used in cell color picker
-	 */
-	constructor(
-		editor: __se__EditorCore,
-		pluginOptions: {
-			scrollType?: 'x' | 'y' | 'xy';
-			captionPosition?: 'top' | 'bottom';
-			cellControllerPosition?: 'cell' | 'table';
-			colorList?: any[];
-		}
-	);
+	 * @param {TablePluginOptions} pluginOptions - Plugin options
+	 */
+	constructor(editor: __se__EditorCore, pluginOptions: TablePluginOptions);
 	title: any;
 	icon: string;
 	figureScrollList: string[];
@@ -117,65 +130,11 @@ declare class Table extends EditorInjector {
 	mergeButton: HTMLButtonElement;
 	/** @type {HTMLButtonElement} */
 	unmergeButton: HTMLButtonElement;
-	_resizing: boolean;
-	_resizeLine: any;
-	_resizeLinePrev: any;
-	/** @type {HTMLElement} */
-	_figure: HTMLElement;
 	/**
 	 * @description Same value a "this._selectedTable", but it maintain prev table element
 	 * @type {HTMLTableElement}
 	 */
 	_element: HTMLTableElement;
-	/** @type {HTMLTableCellElement} */
-	_tdElement: HTMLTableCellElement;
-	/** @type {HTMLTableRowElement} */
-	_trElement: HTMLTableRowElement;
-	/** @type {HTMLTableRowElement[]|HTMLCollectionOf<HTMLTableRowElement>} */
-	_trElements: HTMLTableRowElement[] | HTMLCollectionOf<HTMLTableRowElement>;
-	_tableXY: any[];
-	_maxWidth: boolean;
-	_fixedColumn: boolean;
-	_physical_cellCnt: number;
-	_logical_cellCnt: number;
-	_cellCnt: number;
-	_rowCnt: number;
-	_rowIndex: number;
-	_physical_cellIndex: number;
-	_logical_cellIndex: number;
-	_current_colSpan: number;
-	_current_rowSpan: number;
-	/** @type {HTMLTableElement} */
-	_selectedTable: HTMLTableElement;
-	/** @type {HTMLTableCellElement} */
-	_fixedCell: HTMLTableCellElement;
-	/** @type {HTMLTableCellElement} */
-	_selectedCell: HTMLTableCellElement;
-	/** @type {HTMLTableCellElement[]} */
-	_selectedCells: HTMLTableCellElement[];
-	_shift: boolean;
-	__s: boolean;
-	_fixedCellName: string;
-	_ref: {
-		_i: number;
-		cs: any;
-		ce: any;
-		rs: any;
-		re: any;
-	};
-	_bindMultiOn: any;
-	_bindMultiOff: any;
-	_bindShiftOff: any;
-	_bindTouchOff: any;
-	__globalEvents: {
-		on: any;
-		off: any;
-		shiftOff: any;
-		touchOff: any;
-		resize: any;
-		resizeStop: any;
-		resizeKeyDown: any;
-	};
 	/**
 	 * @editorMethod Editor.core
 	 * @description Executes the main execution method of the plugin.
@@ -188,6 +147,13 @@ declare class Table extends EditorInjector {
 	 * @param {HTMLElement} target Target component element
 	 */
 	select(target: HTMLElement): void;
+	/**
+	 * @editorMethod Editor.Component
+	 * @description Method to delete a component of a plugin, called by the "FileManager", "Controller" module.
+	 * @param {HTMLElement} target Target element
+	 * @returns {Promise<void>}
+	 */
+	destroy(target: HTMLElement): Promise<void>;
 	/**
 	 * @editorMethod Editor.component
 	 * @description Executes the method that is called when a component copy is requested.
@@ -368,23 +334,6 @@ declare class Table extends EditorInjector {
 	 * @description Toggles the visibility of the table caption (`<caption>`). If the caption is present, it is removed; if absent, it is added.
 	 */
 	toggleCaption(): void;
-	/**
-	 * @private
-	 * @description Updates table styles.
-	 * @param {string} styles - Styles to update.
-	 * @param {boolean} ondisplay - Whether to update display.
-	 */
-	private _setTableStyle;
-	/**
-	 * @private
-	 * @description Sets the merge/split button visibility.
-	 */
-	private _setMergeSplitButton;
-	/**
-	 * @private
-	 * @description Sets the unmerge button visibility.
-	 */
-	private _setUnMergeButton;
 	/**
 	 * @private
 	 * @description Sets the controller position for a cell.
@@ -409,6 +358,12 @@ declare class Table extends EditorInjector {
 	 * @param {Node} target - The target figure element.
 	 */
 	private _figureOpen;
+	/**
+	 * @private
+	 * @description Converts the width of <col> elements to percentages.
+	 * @param {HTMLTableElement} target - The target table element.
+	 */
+	private _resizePercentCol;
 	/**
 	 * @private
 	 * @description Starts resizing a table cell.

package/types/plugins/dropdown/template.d.ts

@@ -1,4 +1,17 @@
 export default Template;
+export type TemplatePluginOptions = {
+	/**
+	 * - Template list
+	 */
+	items?: Array<{
+		name: string;
+		html: string;
+	}>;
+};
+/**
+ * @typedef {Object} TemplatePluginOptions
+ * @property {Array<{name: string, html: string}>} [items] - Template list
+ */
 /**
  * @class
  * @description Template Plugin, Apply a template to the selection.
@@ -10,18 +23,9 @@ declare class Template extends EditorInjector {
 	/**
 	 * @constructor
 	 * @param {__se__EditorCore} editor - The root editor instance
-	 * @param {Object} pluginOptions
-	 * @param {Array<{name: string, html: string}>} pluginOptions.items - Template list
+	 * @param {TemplatePluginOptions} pluginOptions - Plugin options
 	 */
-	constructor(
-		editor: __se__EditorCore,
-		pluginOptions: {
-			items: Array<{
-				name: string;
-				html: string;
-			}>;
-		}
-	);
+	constructor(editor: __se__EditorCore, pluginOptions: TemplatePluginOptions);
 	title: any;
 	icon: string;
 	selectedIndex: number;

package/types/plugins/dropdown/textStyle.d.ts

@@ -1,4 +1,21 @@
 export default TextStyle;
+export type TextStylePluginOptions = {
+	/**
+	 * - Text style item list
+	 */
+	items: Array<
+		| string
+		| {
+				name: string;
+				class: string;
+				tag: string;
+		  }
+	>;
+};
+/**
+ * @typedef {Object} TextStylePluginOptions
+ * @property {Array<string|{name: string, class: string, tag: string}>} items - Text style item list
+ */
 /**
  * @class
  * @description Text style Plugin, Applies a tag that specifies text styles to a selection.
@@ -10,18 +27,9 @@ declare class TextStyle extends EditorInjector {
 	/**
 	 * @constructor
 	 * @param {__se__EditorCore} editor - The root editor instance
-	 * @param {Object} pluginOptions
-	 * @param {Array<{name: string, html: string}>} pluginOptions.items - Template list
+	 * @param {TextStylePluginOptions} pluginOptions - Plugin options
 	 */
-	constructor(
-		editor: __se__EditorCore,
-		pluginOptions: {
-			items: Array<{
-				name: string;
-				html: string;
-			}>;
-		}
-	);
+	constructor(editor: __se__EditorCore, pluginOptions: TextStylePluginOptions);
 	title: any;
 	icon: string;
 	styleList: NodeListOf<Element>;

package/types/plugins/field/mention.d.ts

@@ -1,4 +1,60 @@
 export default Mention;
+export type MentionPluginOptions = {
+	/**
+	 * - The character that triggers the mention list
+	 */
+	triggerText?: string;
+	/**
+	 * - The number of items to display in the mention list
+	 */
+	limitSize?: number;
+	/**
+	 * - The number of characters to start searching for the mention list
+	 */
+	searchStartLength?: number;
+	/**
+	 * - The time to wait before displaying the mention list
+	 */
+	delayTime?: number;
+	/**
+	 * - Use data without using API
+	 */
+	data?: Array<{
+		key: string;
+		name: string;
+		url: string;
+	}>;
+	/**
+	 * - The URL to call the mention list
+	 */
+	apiUrl?: string;
+	/**
+	 * - The headers to send with the API call
+	 */
+	apiHeaders?: {
+		[x: string]: string;
+	};
+	/**
+	 * - Whether to cache the mention list data
+	 */
+	useCachingData?: boolean;
+	/**
+	 * - Whether to cache the mention list data in the field
+	 */
+	useCachingFieldData?: boolean;
+};
+/**
+ * @typedef {Object} MentionPluginOptions
+ * @property {string} [triggerText="@"] - The character that triggers the mention list
+ * @property {number} [limitSize=5] - The number of items to display in the mention list
+ * @property {number} [searchStartLength=0] - The number of characters to start searching for the mention list
+ * @property {number} [delayTime=200] - The time to wait before displaying the mention list
+ * @property {Array<{key: string, name: string, url: string}>} [data] - Use data without using API
+ * @property {string} [apiUrl] - The URL to call the mention list
+ * @property {Object<string, string>} [apiHeaders] - The headers to send with the API call
+ * @property {boolean} [useCachingData=true] - Whether to cache the mention list data
+ * @property {boolean} [useCachingFieldData=true] - Whether to cache the mention list data in the field
+ */
 /**
  * @class
  * @description Mention Plugin
@@ -14,41 +70,9 @@ declare class Mention extends EditorInjector {
 	/**
 	 * @constructor
 	 * @param {__se__EditorCore} editor - The root editor instance
-	 * @param {Object} pluginOptions
-	 * @param {string=} [pluginOptions.triggerText="@"] The character that triggers the mention list. Default is '@'.
-	 * @param {number=} [pluginOptions.limitSize=5] The number of items to display in the mention list. Default is 5.
-	 * @param {number=} [pluginOptions.searchStartLength=0] The number of characters to start searching for the mention list. Default is 0.
-	 * @param {number=} [pluginOptions.delayTime=200] The time to wait before displaying the mention list. Default is 200ms.
-	 * @param {Array<{key: string, name: string, url: string}>=} pluginOptions.data Use data without using API.
-	 * @param {string=} pluginOptions.apiUrl The URL to call the mention list. Default is ''.
-	 * @param {Object<string, string>=} pluginOptions.apiHeaders The headers to send with the API call. Default is {}.
-	 * @param {boolean=} [pluginOptions.useCachingData=true] Whether to cache the mention list data. Default is true.
-	 * @param {boolean=} [pluginOptions.useCachingFieldData=true] Whether to cache the mention list data in the field. Default is true.
+	 * @param {MentionPluginOptions} pluginOptions
 	 */
-	constructor(
-		editor: __se__EditorCore,
-		pluginOptions: {
-			triggerText?: string | undefined;
-			limitSize?: number | undefined;
-			searchStartLength?: number | undefined;
-			delayTime?: number | undefined;
-			data?:
-				| Array<{
-						key: string;
-						name: string;
-						url: string;
-				  }>
-				| undefined;
-			apiUrl?: string | undefined;
-			apiHeaders?:
-				| {
-						[x: string]: string;
-				  }
-				| undefined;
-			useCachingData?: boolean | undefined;
-			useCachingFieldData?: boolean | undefined;
-		}
-	);
+	constructor(editor: __se__EditorCore, pluginOptions: MentionPluginOptions);
 	title: any;
 	icon: string;
 	triggerText: string;
@@ -61,10 +85,6 @@ declare class Mention extends EditorInjector {
 		url: string;
 	}[];
 	apiUrl: string;
-	_delay: number;
-	_lastAtPos: number;
-	_anchorOffset: number;
-	_anchorNode: Node;
 	apiManager: ApiManager;
 	cachingData: Map<any, any>;
 	cachingFieldData: any[];
@@ -76,24 +96,6 @@ declare class Mention extends EditorInjector {
 	 * @returns {Promise<boolean>}
 	 */
 	onInput(): Promise<boolean>;
-	/**
-	 * @private
-	 * @description Generates the mention list based on user input.
-	 * - Fetches data from cache, direct data, or an API.
-	 * - Creates and opens the mention dropdown.
-	 * - Caches the fetched data for future use.
-	 * @param {string} value - The mention query text.
-	 * @param {Node} targetNode - The node where the mention is triggered.
-	 * @returns {Promise<boolean>} - Returns `true` if the mention list is displayed, `false` otherwise.
-	 */
-	private _createMentionList;
-	/**
-	 * @private
-	 * @description Constructs the API request URL with the mention query.
-	 * @param {string} key - The mention query text.
-	 * @returns {string} - The formatted API request URL.
-	 */
-	private _createUrl;
 	#private;
 }
 import EditorInjector from '../../editorInjector';

package/types/plugins/index.d.ts

@@ -35,73 +35,73 @@ declare namespace _default {
 	export { anchor };
 }
 export default _default;
+import audioGallery from './browser/audioGallery';
+import fileBrowser from './browser/fileBrowser';
+import fileGallery from './browser/fileGallery';
+import imageGallery from './browser/imageGallery';
+import videoGallery from './browser/videoGallery';
 import blockquote from './command/blockquote';
 import exportPDF from './command/exportPDF';
 import fileUpload from './command/fileUpload';
 import list_bulleted from './command/list_bulleted';
 import list_numbered from './command/list_numbered';
-import mention from './field/mention';
 import align from './dropdown/align';
+import backgroundColor from './dropdown/backgroundColor';
 import font from './dropdown/font';
 import fontColor from './dropdown/fontColor';
-import backgroundColor from './dropdown/backgroundColor';
-import list from './dropdown/list';
-import table from './dropdown/table';
 import formatBlock from './dropdown/formatBlock';
 import hr from './dropdown/hr';
 import layout from './dropdown/layout';
 import lineHeight from './dropdown/lineHeight';
-import template from './dropdown/template';
+import list from './dropdown/list';
 import paragraphStyle from './dropdown/paragraphStyle';
+import table from './dropdown/table';
+import template from './dropdown/template';
 import textStyle from './dropdown/textStyle';
-import link from './modal/link';
-import image from './modal/image';
-import video from './modal/video';
+import mention from './field/mention';
+import fontSize from './input/fontSize';
+import pageNavigator from './input/pageNavigator';
 import audio from './modal/audio';
+import drawing from './modal/drawing';
 import embed from './modal/embed';
+import image from './modal/image';
+import link from './modal/link';
 import math from './modal/math';
-import drawing from './modal/drawing';
-import imageGallery from './browser/imageGallery';
-import videoGallery from './browser/videoGallery';
-import audioGallery from './browser/audioGallery';
-import fileGallery from './browser/fileGallery';
-import fileBrowser from './browser/fileBrowser';
-import fontSize from './input/fontSize';
-import pageNavigator from './input/pageNavigator';
+import video from './modal/video';
 import anchor from './popup/anchor';
 export {
+	align,
+	anchor,
+	audio,
+	audioGallery,
+	backgroundColor,
 	blockquote,
+	drawing,
+	embed,
 	exportPDF,
+	fileBrowser,
+	fileGallery,
 	fileUpload,
-	list_bulleted,
-	list_numbered,
-	mention,
-	align,
 	font,
 	fontColor,
-	backgroundColor,
-	list,
-	table,
+	fontSize,
 	formatBlock,
 	hr,
+	image,
+	imageGallery,
 	layout,
 	lineHeight,
-	template,
-	paragraphStyle,
-	textStyle,
 	link,
-	image,
-	video,
-	audio,
-	embed,
+	list,
+	list_bulleted,
+	list_numbered,
 	math,
-	drawing,
-	imageGallery,
-	videoGallery,
-	audioGallery,
-	fileGallery,
-	fileBrowser,
-	fontSize,
+	mention,
 	pageNavigator,
-	anchor
+	paragraphStyle,
+	table,
+	template,
+	textStyle,
+	video,
+	videoGallery
 };

package/types/plugins/input/fontSize.d.ts

@@ -1,4 +1,46 @@
 export default FontSize;
+export type FontSizePluginOptions = {
+	/**
+	 * - The unit for the font size.
+	 * - Accepted values include: 'px', 'pt', 'em', 'rem', 'vw', 'vh', '%' or 'text'.
+	 * - If 'text' is used, a text-based font size list is applied.
+	 */
+	sizeUnit?: string;
+	/**
+	 * - Determines whether the default size label is displayed in the dropdown menu.
+	 */
+	showDefaultSizeLabel?: boolean;
+	/**
+	 * - When true, displays increase and decrease buttons for font size adjustments.
+	 */
+	showIncDecControls?: boolean;
+	/**
+	 * - When true, disables the direct font size input box.
+	 */
+	disableInput?: boolean;
+	/**
+	 * - Optional object to override or extend the default unit mapping for font sizes.
+	 */
+	unitMap?: {
+		[x: string]: {
+			default: number;
+			inc: number;
+			min: number;
+			max: number;
+			list: Array<number>;
+		};
+	};
+};
+/**
+ * @typedef {Object} FontSizePluginOptions
+ * @property {string} [sizeUnit='px'] - The unit for the font size.
+ * - Accepted values include: 'px', 'pt', 'em', 'rem', 'vw', 'vh', '%' or 'text'.
+ * - If 'text' is used, a text-based font size list is applied.
+ * @property {boolean} [showDefaultSizeLabel=true] - Determines whether the default size label is displayed in the dropdown menu.
+ * @property {boolean} [showIncDecControls=false] - When true, displays increase and decrease buttons for font size adjustments.
+ * @property {boolean} [disableInput=true] - When true, disables the direct font size input box.
+ * @property {Object<string, {default: number, inc: number, min: number, max: number, list: Array<number>}>} [unitMap={}] - Optional object to override or extend the default unit mapping for font sizes.
+ */
 /**
  * @class
  * @description FontSize Plugin
@@ -13,33 +55,9 @@ declare class FontSize extends EditorInjector {
 	/**
 	 * @constructor
 	 * @param {__se__EditorCore} editor - The root editor instance
-	 * @param {Object} pluginOptions - Configuration options for the FontSize plugin.
-	 * @param {string=} [pluginOptions.sizeUnit='px'] - The unit for the font size.
-	 * - Accepted values include: 'px', 'pt', 'em', 'rem', 'vw', 'vh', '%' or 'text'.
-	 * - If 'text' is used, a text-based font size list is applied.
-	 * @param {boolean=} [pluginOptions.showDefaultSizeLabel=true] - Determines whether the default size label is displayed in the dropdown menu.
-	 * @param {boolean=} [pluginOptions.showIncDecControls=false] - When true, displays increase and decrease buttons for font size adjustments.
-	 * @param {boolean=} [pluginOptions.disableInput=true] - When true, disables the direct font size input box.
-	 * @param {Object<string, {default: number, inc: number, min: number, max: number, list: Array<number>}>} [pluginOptions.unitMap={}] - Optional object to override or extend the default unit mapping for font sizes.
+	 * @param {FontSizePluginOptions} pluginOptions - Configuration options for the FontSize plugin.
 	 */
-	constructor(
-		editor: __se__EditorCore,
-		pluginOptions: {
-			sizeUnit?: string | undefined;
-			showDefaultSizeLabel?: boolean | undefined;
-			showIncDecControls?: boolean | undefined;
-			disableInput?: boolean | undefined;
-			unitMap?: {
-				[x: string]: {
-					default: number;
-					inc: number;
-					min: number;
-					max: number;
-					list: Array<number>;
-				};
-			};
-		}
-	);
+	constructor(editor: __se__EditorCore, pluginOptions: FontSizePluginOptions);
 	unitMap: {
 		text: {
 			default: string;
@@ -107,13 +125,13 @@ declare class FontSize extends EditorInjector {
 	sizeList: NodeListOf<Element>;
 	hasInputFocus: boolean;
 	isInputActive: boolean;
-	_disableInput: boolean;
 	/**
 	 * @editorMethod Editor.EventManager
 	 * @description Executes the method that is called whenever the cursor position changes.
 	 * @param {?HTMLElement=} element - Node element where the cursor is currently located
 	 * @param {?HTMLElement=} target - The plugin's toolbar button element
 	 * @returns {boolean} - Whether the plugin is active
+	 * - If it returns "undefined", it will no longer be called in this scope.
 	 */
 	active(element?: (HTMLElement | null) | undefined, target?: (HTMLElement | null) | undefined): boolean;
 	/**
@@ -143,28 +161,6 @@ declare class FontSize extends EditorInjector {
 	 * @param {HTMLElement} target - The plugin's toolbar button element
 	 */
 	action(target: HTMLElement): void;
-	/**
-	 * @private
-	 * @description Retrieves the default font size of the editor.
-	 * @returns {string} - The computed font size from the editor.
-	 */
-	private _getDefaultSize;
-	/**
-	 * @private
-	 * @description Extracts the font size and unit from the given element or input value.
-	 * @param {string|Element} target - The target input or element.
-	 * @returns {{ unit: string, value: number|string }} - An object containing:
-	 * - `unit` (string): The detected font size unit.
-	 * - `value` (number|string): The numeric font size value or text-based size.
-	 */
-	private _getSize;
-	/**
-	 * @private
-	 * @description Sets the font size in the toolbar input field or button label.
-	 * @param {HTMLElement} target - The target element in the toolbar.
-	 * @param {string|number} value - The font size value.
-	 * @returns {string|number} - The applied font size.
-	 */
-	private _setSize;
+	#private;
 }
 import EditorInjector from '../../editorInjector';