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

package/types/plugins/modal/audio.d.ts

@@ -49,6 +49,14 @@ export type AudioPluginOptions = {
 	audioTagAttributes?: {
 		[x: string]: string;
 	};
+	/**
+	 * - Component insertion behavior for selection and cursor placement. [default: options.get('componentInsertBehavior')]
+	 * - `auto`: Move cursor to the next line if possible, otherwise select the component.
+	 * - `select`: Always select the inserted component.
+	 * - `line`: Move cursor to the next line if possible, or create a new line and move there.
+	 * - `none`: Do nothing.
+	 */
+	insertBehavior?: __se__ComponentInsertBehaviorType;
 };
 /**
  * @typedef {import('../../events').AudioInfo} AudioInfo_audio
@@ -66,6 +74,11 @@ export type AudioPluginOptions = {
  * @property {boolean} [allowMultiple] - Whether to allow multiple file uploads.
  * @property {string} [acceptedFormats="audio/*"] - Accepted file formats (default is "audio/*").
  * @property {Object<string, string>} [audioTagAttributes] - Additional attributes to set on the audio tag.
+ * @property {__se__ComponentInsertBehaviorType} [insertBehavior] - Component insertion behavior for selection and cursor placement. [default: options.get('componentInsertBehavior')]
+ * - `auto`: Move cursor to the next line if possible, otherwise select the component.
+ * - `select`: Always select the inserted component.
+ * - `line`: Move cursor to the next line if possible, or create a new line and move there.
+ * - `none`: Do nothing.
  */
 /**
  * @class
@@ -105,6 +118,7 @@ declare class Audio_ extends EditorInjector {
 		audioTagAttributes: {
 			[x: string]: string;
 		};
+		insertBehavior: __se__ComponentInsertBehaviorType;
 	};
 	modal: Modal;
 	controller: Controller;
@@ -118,11 +132,6 @@ declare class Audio_ extends EditorInjector {
 	audioUrlFile: HTMLInputElement;
 	/** @type {HTMLElement} */
 	preview: HTMLElement;
-	/** @type {HTMLAudioElement} */
-	_element: HTMLAudioElement;
-	defaultWidth: string;
-	defaultHeight: string;
-	urlValue: string;
 	/**
 	 * @editorMethod Modules.Modal
 	 * @description Executes the method that is called when a "Modal" module's is opened.
@@ -182,14 +191,6 @@ declare class Audio_ extends EditorInjector {
 	 * @param {HTMLElement} target Target component element
 	 */
 	select(target: HTMLElement): void;
-	/**
-	 * @private
-	 * @description Prepares the component for selection.
-	 * - Ensures that the controller is properly positioned and initialized.
-	 * - Prevents duplicate event handling if the component is already selected.
-	 * @param {HTMLElement} target - The selected element.
-	 */
-	private _ready;
 	/**
 	 * @editorMethod Editor.Component
 	 * @description Method to delete a component of a plugin, called by the "FileManager", "Controller" module.
@@ -197,14 +198,6 @@ declare class Audio_ extends EditorInjector {
 	 * @returns {Promise<void>}
 	 */
 	destroy(target?: HTMLElement | undefined): Promise<void>;
-	/**
-	 * @private
-	 * @description Registers uploaded audio files and creates the corresponding audio elements.
-	 * - Iterates through the uploaded files and inserts them into the editor.
-	 * @param {AudioInfo_audio} info - Upload metadata, including `isUpdate` flag and `element`.
-	 * @param {Object<string, *>} response - Server response containing uploaded file details.
-	 */
-	private _register;
 	/**
 	 * @description Create an "audio" component using the provided files.
 	 * @param {FileList|File[]} fileList File object list
@@ -218,7 +211,6 @@ declare class Audio_ extends EditorInjector {
 	 */
 	submitURL(url: string): Promise<boolean>;
 	/**
-	 * @private
 	 * @description Creates or updates an audio component within the editor.
 	 * - If `isUpdate` is `true`, updates the existing element's `src`.
 	 * - Otherwise, inserts a new audio component with the given file.
@@ -226,40 +218,18 @@ declare class Audio_ extends EditorInjector {
 	 * @param {string} src - The source URL of the audio file.
 	 * @param {{name: string, size: number}} file - The file metadata (name, size).
 	 * @param {boolean} isUpdate - Whether to update an existing element.
-	 */
-	private _createComp;
-	/**
-	 * @private
-	 * @description Creates a new `<audio>` element with default attributes.
-	 * - Applies width, height, and additional attributes from plugin options.
-	 * @returns {HTMLAudioElement} - The newly created `<audio>` element.
-	 */
-	private _createAudioTag;
-	/**
-	 * @private
-	 * @description Sets attributes on an audio element based on plugin options.
-	 * - Adds the `controls` attribute and applies any custom attributes.
-	 * @param {HTMLElement} element - The `<audio>` element to modify.
-	 */
-	private _setTagAttrs;
-	/**
-	 * @private
-	 * @description Uploads audio files to the server.
-	 * - Sends a request to the configured upload URL and processes the response.
-	 * @param {AudioInfo_audio} info - Upload metadata, including `files` and `isUpdate`.
-	 * @param {FileList|File[]} files - The files to be uploaded.
-	 */
-	private _serverUpload;
-	/**
-	 * @private
-	 * @description Handles errors that occur during the audio upload process.
-	 * - Triggers the `onAudioUploadError` event to allow custom handling of errors.
-	 * - Displays an error message in the editor's UI.
-	 * - Logs the error to the console for debugging.
-	 * @param {Object<string, *>} response - The error response object from the server or upload process.
-	 * @returns {Promise<void>}
-	 */
-	private _error;
+	 * @param {boolean} isLast - Indicates whether this is the last file in the batch (used for scroll and insert actions).
+	 */
+	create(
+		element: HTMLAudioElement,
+		src: string,
+		file: {
+			name: string;
+			size: number;
+		},
+		isUpdate: boolean,
+		isLast: boolean
+	): void;
 	#private;
 }
 import EditorInjector from '../../editorInjector';

package/types/plugins/modal/drawing.d.ts

@@ -139,27 +139,6 @@ declare class Drawing extends EditorInjector {
 	points: any[];
 	paths: any[];
 	resizeObserver: ResizeObserver;
-	__events: {
-		mousedown: any;
-		mousemove: any;
-		mouseup: any;
-		mouseleave: any;
-		mouseenter: any;
-	};
-	__eventsRegister: {
-		mousedown: any;
-		mousemove: any;
-		mouseup: any;
-		mouseleave: any;
-		mouseenter: any;
-	};
-	__eventNameMap: {
-		mousedown: string;
-		mousemove: string;
-		mouseup: string;
-		mouseleave: string;
-		mouseenter: string;
-	};
 	/**
 	 * @editorMethod Modules.Modal
 	 * @description Executes the method that is called when a "Modal" module's is opened.
@@ -176,70 +155,6 @@ declare class Drawing extends EditorInjector {
 	 * @returns {boolean} Success or failure
 	 */
 	modalAction(): boolean;
-	/**
-	 * @private
-	 * @description Initializes the drawing canvas, sets up event listeners, and configures resize handling.
-	 */
-	private _initDrawing;
-	/**
-	 * @private
-	 * @description Destroys the drawing canvas, removes event listeners, and clears stored drawing data.
-	 */
-	private _destroyDrawing;
-	/**
-	 * @private
-	 * @description Configures the drawing context (canvas settings like line width, color, etc.).
-	 */
-	private _setCtx;
-	/**
-	 * @private
-	 * @description Draws the current stroke based on collected points.
-	 */
-	private _draw;
-	/**
-	 * @private
-	 * @description Redraws all stored paths onto the canvas.
-	 */
-	private _drawAll;
-	/**
-	 * @private
-	 * @description Adjusts all stored paths to fit new canvas dimensions after a resize event.
-	 * @param {number} prevWidth - The previous width of the canvas.
-	 * @param {number} prevHeight - The previous height of the canvas.
-	 * @param {number} newWidth - The new width of the canvas.
-	 * @param {number} newHeight - The new height of the canvas.
-	 */
-	private _adjustPathsToNewDimensions;
-	/**
-	 * @private
-	 * @description Clears the canvas and resets stored drawing paths.
-	 */
-	private _clearCanvas;
-	/**
-	 * @private
-	 * @description Generates an SVG representation of the drawn content.
-	 * @returns {*} The generated SVG element.
-	 */
-	private _getSVG;
-	/**
-	 * @private
-	 * @description Converts the SVG element into a downloadable file.
-	 * @returns {FileList} A FileList containing the generated SVG file.
-	 */
-	private _getSVGFileList;
-	/**
-	 * @private
-	 * @description Retrieves touch coordinates relative to the canvas.
-	 * @param {TouchEvent} e - The touch event.
-	 * @returns {{x: number, y: number}} An object containing the x and y coordinates.
-	 */
-	private _getCanvasTouchPointer;
-	/**
-	 * @private
-	 * @description Activates either block or inline format mode for inserted drawings.
-	 * @param {boolean} isInline - Whether the drawing should be inserted as an inline element.
-	 */
-	private _activeAsInline;
 	#private;
 }
 import EditorInjector from '../../editorInjector';

package/types/plugins/modal/embed.d.ts

@@ -90,6 +90,14 @@ export type EmbedPluginOptions = {
 	 * - Figure controls.
 	 */
 	controls?: FigureControls_embed;
+	/**
+	 * - Component insertion behavior for selection and cursor placement. [default: options.get('componentInsertBehavior')]
+	 * - `auto`: Move cursor to the next line if possible, otherwise select the component.
+	 * - `select`: Always select the inserted component.
+	 * - `line`: Move cursor to the next line if possible, or create a new line and move there.
+	 * - `none`: Do nothing.
+	 */
+	insertBehavior?: __se__ComponentInsertBehaviorType;
 };
 /**
  * @typedef {import('../../events').ProcessInfo} ProcessInfo_embed
@@ -132,6 +140,11 @@ export type EmbedPluginOptions = {
  *   // Additional services...
  * }
  * @property {FigureControls_embed} [controls] - Figure controls.
+ * @property {__se__ComponentInsertBehaviorType} [insertBehavior] - Component insertion behavior for selection and cursor placement. [default: options.get('componentInsertBehavior')]
+ * - `auto`: Move cursor to the next line if possible, otherwise select the component.
+ * - `select`: Always select the inserted component.
+ * - `line`: Move cursor to the next line if possible, or create a new line and move there.
+ * - `none`: Do nothing.
  */
 /**
  * @class
@@ -173,6 +186,7 @@ declare class Embed extends EditorInjector {
 		};
 		query_youtube: string;
 		query_vimeo: string;
+		insertBehavior: __se__ComponentInsertBehaviorType;
 	};
 	modal: Modal;
 	figure: Figure;
@@ -180,26 +194,10 @@ declare class Embed extends EditorInjector {
 	embedInput: HTMLInputElement;
 	focusElement: HTMLInputElement;
 	previewSrc: HTMLElement;
-	_linkValue: string;
-	_align: string;
-	_defaultSizeX: string;
-	_defaultSizeY: string;
 	sizeUnit: string;
 	proportion: HTMLInputElement;
 	inputX: HTMLInputElement;
 	inputY: HTMLInputElement;
-	_element: any;
-	_cover: HTMLElement;
-	_container: any;
-	_ratio: {
-		w: number;
-		h: number;
-	};
-	_origin_w: string;
-	_origin_h: string;
-	_resizing: boolean;
-	_onlyPercentage: boolean;
-	_nonResizing: boolean;
 	query: {
 		facebook: {
 			pattern: RegExp;
@@ -286,15 +284,6 @@ declare class Embed extends EditorInjector {
 	 * @param {HTMLElement} target Target component element
 	 */
 	select(target: HTMLElement): void;
-	/**
-	 * @private
-	 * @description Prepares the component for selection.
-	 * - Ensures that the controller is properly positioned and initialized.
-	 * - Prevents duplicate event handling if the component is already selected.
-	 * @param {HTMLElement} target - The selected element.
-	 */
-	private _ready;
-	_caption: HTMLElement;
 	/**
 	 * @editorMethod Editor.Component
 	 * @description Method to delete a component of a plugin, called by the "FileManager", "Controller" module.
@@ -326,60 +315,7 @@ declare class Embed extends EditorInjector {
 	 * @returns {Promise<boolean>} A promise that resolves to true on success or false on failure.
 	 */
 	submitSRC(src?: string): Promise<boolean>;
-	/**
-	 * @private
-	 * @description Creates an iframe element for embedding external content.
-	 * @returns {HTMLIFrameElement} The created iframe element.
-	 */
-	private _createIframeTag;
-	/**
-	 * @private
-	 * @description Creates an blockquote element for embedding external content.
-	 * @returns {HTMLElement} The created iframe element.
-	 */
-	private _createEmbedTag;
-	/**
-	 * @private
-	 * @description Creates an embed component (iframe or blockquote) and inserts it into the editor.
-	 * @param {?ProcessInfo_embed} process - Processed embed information.
-	 * @param {?string} src - The source URL.
-	 * @param {?Node[]} children - The embed elements.
-	 * @param {string} width - The width of the embed component.
-	 * @param {string} height - The height of the embed component.
-	 * @param {string} align - The alignment of the embed component.
-	 * @param {boolean} isUpdate - Whether this is an update to an existing embed component.
-	 */
-	private _create;
-	/**
-	 * @private
-	 * @description Updates an existing embed component within the editor.
-	 * @param {HTMLIFrameElement} oFrame - The existing embed element to be updated.
-	 */
-	private _update;
-	/**
-	 * @private
-	 * @description Applies width and height to the embed component.
-	 * @param {string|number} w - The width to apply.
-	 * @param {string|number} h - The height to apply.
-	 */
-	private _applySize;
-	/**
-	 * @private
-	 * @description Retrieves embed component size and alignment information.
-	 * @returns {{inputWidth: string, inputHeight: string, align: string, isUpdate: boolean, element: Element}} An object containing
-	 * - inputWidth : The width of the embed component.
-	 * - inputHeight : The height of the embed component.
-	 * - align : The alignment of the embed component.
-	 * - isUpdate : Whether the component is being updated.
-	 * - element : The target element.
-	 */
-	private _getInfo;
-	/**
-	 * @private
-	 * @description Sets default attributes for an iframe element.
-	 * @param {HTMLIFrameElement} element - The iframe element to modify.
-	 */
-	private _setIframeAttrs;
+	_caption: HTMLElement;
 	#private;
 }
 import EditorInjector from '../../editorInjector';

package/types/plugins/modal/image.d.ts

@@ -95,6 +95,16 @@ export type ImagePluginOptions = {
 	 * - Figure controls.
 	 */
 	controls?: FigureControls_image;
+	/**
+	 * - Component insertion behavior for selection and cursor placement. [default: options.get('componentInsertBehavior')]
+	 * - For inline components: places the cursor near the inserted component or selects it if no nearby range is available.
+	 * - For block components: executes behavior based on `selectMode`:
+	 * - `auto`: Move cursor to the next line if possible, otherwise select the component.
+	 * - `select`: Always select the inserted component.
+	 * - `line`: Move cursor to the next line if possible, or create a new line and move there.
+	 * - `none`: Do nothing.
+	 */
+	insertBehavior?: __se__ComponentInsertBehaviorType;
 };
 /**
  * @typedef {import('../../events').ImageInfo} ImageInfo_image
@@ -122,6 +132,13 @@ export type ImagePluginOptions = {
  * @property {boolean} [keepFormatType=false] - Whether to retain the chosen format type after image insertion.
  * @property {boolean} [linkEnableFileUpload] - Whether to enable file uploads for linked images.
  * @property {FigureControls_image} [controls] - Figure controls.
+ * @property {__se__ComponentInsertBehaviorType} [insertBehavior] - Component insertion behavior for selection and cursor placement. [default: options.get('componentInsertBehavior')]
+ * - For inline components: places the cursor near the inserted component or selects it if no nearby range is available.
+ * - For block components: executes behavior based on `selectMode`:
+ * - `auto`: Move cursor to the next line if possible, otherwise select the component.
+ * - `select`: Always select the inserted component.
+ * - `line`: Move cursor to the next line if possible, or create a new line and move there.
+ * - `none`: Do nothing.
  */
 /**
  * @class
@@ -165,6 +182,7 @@ declare class Image_ extends EditorInjector {
 		useFormatType: boolean;
 		defaultFormatType: string;
 		keepFormatType: boolean;
+		insertBehavior: __se__ComponentInsertBehaviorType;
 	};
 	alignForm: HTMLElement;
 	anchor: ModalAnchorEditor;
@@ -184,24 +202,7 @@ declare class Image_ extends EditorInjector {
 	proportion: HTMLInputElement;
 	inputX: HTMLInputElement;
 	inputY: HTMLInputElement;
-	_linkElement: any;
-	_linkValue: string;
-	_align: string;
-	_svgDefaultSize: string;
 	_base64RenderIndex: number;
-	_element: any;
-	_cover: any;
-	_container: any;
-	_caption: HTMLElement;
-	_ratio: {
-		w: number;
-		h: number;
-	};
-	_origin_w: string;
-	_origin_h: string;
-	_resizing: boolean;
-	_onlyPercentage: boolean;
-	_nonResizing: boolean;
 	asBlock: HTMLButtonElement;
 	asInline: HTMLButtonElement;
 	/**
@@ -262,14 +263,6 @@ declare class Image_ extends EditorInjector {
 	 * @param {HTMLElement} target Target component element
 	 */
 	select(target: HTMLElement): void;
-	/**
-	 * @private
-	 * @description Prepares the component for selection.
-	 * - Ensures that the controller is properly positioned and initialized.
-	 * - Prevents duplicate event handling if the component is already selected.
-	 * @param {HTMLElement} target - The selected element.
-	 */
-	private _ready;
 	/**
 	 * @editorMethod Editor.Component
 	 * @description Method to delete a component of a plugin, called by the "FileManager", "Controller" module.
@@ -277,18 +270,6 @@ declare class Image_ extends EditorInjector {
 	 * @returns {Promise<void>}
 	 */
 	destroy(target: HTMLElement): Promise<void>;
-	/**
-	 * @private
-	 * @description Retrieves the current image information.
-	 * @returns {*} - The image data.
-	 */
-	private _getInfo;
-	/**
-	 * @private
-	 * @description Toggles between block and inline image format.
-	 * @param {boolean} isInline - Whether the image should be inline.
-	 */
-	private _activeAsInline;
 	/**
 	 * @description Create an "image" component using the provided files.
 	 * @param {FileList|File[]} fileList File object list
@@ -301,39 +282,6 @@ declare class Image_ extends EditorInjector {
 	 * @returns {Promise<boolean>} If return false, the file upload will be canceled
 	 */
 	submitURL(url: string): Promise<boolean>;
-	/**
-	 * @private
-	 * @description Updates the selected image size, alt text, and caption.
-	 * @param {string} width - New image width.
-	 * @param {string} height - New image height.
-	 */
-	private _update;
-	/**
-	 * @private
-	 * @description Validates the image size and applies necessary transformations.
-	 * @param {string} width - The width of the image.
-	 * @param {string} height - The height of the image.
-	 */
-	private _fileCheck;
-	/**
-	 * @private
-	 * @description Creates a new image component based on provided parameters.
-	 * @param {string} src - The image source URL.
-	 * @param {?Node} anchor - Optional anchor wrapping the image.
-	 * @param {string} width - Image width.
-	 * @param {string} height - Image height.
-	 * @param {string} align - Image alignment.
-	 * @param {{name: string, size: number}} file - File metadata.
-	 * @param {string} alt - Alternative text.
-	 */
-	private _produce;
-	/**
-	 * @private
-	 * @description Applies the specified width and height to the image.
-	 * @param {string} w - Image width.
-	 * @param {string} h - Image height.
-	 */
-	private _applySize;
 	/**
 	 * @description Creates a new image component, wraps it in a figure container with an optional anchor,
 	 * - applies size and alignment settings, and inserts it into the editor.
@@ -344,6 +292,7 @@ declare class Image_ extends EditorInjector {
 	 * @param {string} align - The alignment setting for the image (e.g., 'left', 'center', 'right').
 	 * @param {{name: string, size: number}} file - File metadata associated with the image
 	 * @param {string} alt - The alternative text for the image.
+	 * @param {boolean} isLast - Indicates whether this is the last file in the batch (used for scroll and insert actions).
 	 */
 	create(
 		src: string,
@@ -355,7 +304,8 @@ declare class Image_ extends EditorInjector {
 			name: string;
 			size: number;
 		},
-		alt: string
+		alt: string,
+		isLast: boolean
 	): void;
 	/**
 	 * @description Creates a new inline image component, wraps it in an inline figure container with an optional anchor,
@@ -366,6 +316,7 @@ declare class Image_ extends EditorInjector {
 	 * @param {string} height - The height value to be applied to the image.
 	 * @param {{name: string, size: number}} file - File metadata associated with the image
 	 * @param {string} alt - The alternative text for the image.
+	 * @param {boolean} isLast - Indicates whether this is the last file in the batch (used for scroll and insert actions).
 	 */
 	createInline(
 		src: string,
@@ -376,72 +327,9 @@ declare class Image_ extends EditorInjector {
 			name: string;
 			size: number;
 		},
-		alt: string
+		alt: string,
+		isLast: boolean
 	): void;
-	/**
-	 * @private
-	 * @description Updates the image source URL.
-	 * @param {string} src - The new image source.
-	 * @param {HTMLImageElement} element - The image element.
-	 * @param {{ name: string, size: number }} file - File metadata.
-	 */
-	private _updateSrc;
-	/**
-	 * @private
-	 * @description Registers the uploaded image and inserts it into the editor.
-	 * @param {ImageInfo_image} info - Image info.
-	 * @param {Object<string, *>} response - Server response data.
-	 */
-	private _register;
-	/**
-	 * @private
-	 * @description Uploads the image to the server.
-	 * @param {ImageInfo_image} info - Image upload info.
-	 * @param {FileList} files - List of image files.
-	 */
-	private _serverUpload;
-	/**
-	 * @private
-	 * @description Converts an image file to Base64 and inserts it into the editor.
-	 * @param {FileList|File[]} files - List of image files.
-	 * @param {?Node} anchor - Optional anchor wrapping the image.
-	 * @param {string} width - Image width.
-	 * @param {string} height - Image height.
-	 * @param {string} align - Image alignment.
-	 * @param {string} alt - Alternative text.
-	 * @param {boolean} isUpdate - Whether the image is being updated.
-	 */
-	private _setBase64;
-	/**
-	 * @private
-	 * @description Inserts an image using a Base64-encoded string.
-	 * @param {boolean} update - Whether the image is being updated.
-	 * @param {Array<{result: string, file: { name: string, size: number }}>} filesStack - Stack of Base64-encoded files.
-	 * - result: Image url or Base64-encoded string
-	 * - file: File metadata ({ name: string, size: number })
-	 * @param {HTMLImageElement} updateElement - The image element being updated.
-	 * @param {?HTMLAnchorElement} anchor - Optional anchor wrapping the image.
-	 * @param {string} width - Image width.
-	 * @param {string} height - Image height.
-	 * @param {string} align - Image alignment.
-	 * @param {string} alt - Alternative text.
-	 */
-	private _onRenderBase64;
-	/**
-	 * @private
-	 * @description Wraps an image element with an anchor if provided.
-	 * @param {Node} imgTag - The image element to be wrapped.
-	 * @param {?Node} anchor - The anchor element to wrap around the image. If null, returns the image itself.
-	 * @returns {Node} - The wrapped image inside the anchor or the original image element.
-	 */
-	private _setAnchor;
-	/**
-	 * @private
-	 * @description Handles errors during image upload and displays appropriate messages.
-	 * @param {Object<string, *>} response - The error response from the server.
-	 * @returns {Promise<void>}
-	 */
-	private _error;
 	#private;
 }
 import EditorInjector from '../../editorInjector';