suneditor 3.1.2 → 3.1.4

package/src/core/section/documentType.js

@@ -162,28 +162,19 @@ class DocumentType {
 
 			// page break
 			let pageBreakHeight = 0;
-			let lastBreakPosition = 0;
-			let additionalPages = 0;
+			const breakPoints = [];
 			if (pageBreaks.length > 0) {
 				pageBreakHeight = pageBreaks[0].offsetHeight;
 				for (let i = 0; i < pageBreaks.length; i++) {
-					const breakPosition = pageBreaks[i].offsetTop;
-					const sectionHeight = breakPosition - lastBreakPosition;
-					if (sectionHeight % A4_PAGE_HEIGHT !== 0) additionalPages++;
-					lastBreakPosition = breakPosition;
+					breakPoints.push({ top: pageBreaks[i].offsetTop, end: pageBreaks[i].offsetTop + pageBreakHeight / 2 });
 				}
-
-				const lastSectionHeight = mirrorHeight - lastBreakPosition;
-				if (lastSectionHeight > 0 && lastSectionHeight % A4_PAGE_HEIGHT !== 0) additionalPages++;
 			}
 
 			const scrollTop = !this.#isScrollable(this.#fc) ? 0 : this._getWWScrollTop();
-			const totalPages = Math.ceil(mirrorHeight / A4_PAGE_HEIGHT) + additionalPages;
-			const wwWidth = this.#wwFrame.offsetWidth + 1;
-			const pages = [];
+			const pages = [{ number: 0, top: 0 }];
 
-			for (let i = 0; i < pageBreaks.length; i++) {
-				pages.push({ number: i, top: pageBreaks[i].offsetTop + pageBreakHeight / 2 });
+			for (let i = 0; i < breakPoints.length; i++) {
+				pages.push({ number: 0, top: breakPoints[i].top + pageBreakHeight / 2, isBreak: true });
 			}
 
 			this.#mirrorCache = 0;
@@ -191,14 +182,27 @@ class DocumentType {
 			const mChr = this.#mirror.children;
 			this._initializeCache(mChr);
 
-			pages.push({ number: 0, top: 0 });
+			// Calculate page positions per section (between page breaks)
+			const sectionStarts = [0, ...breakPoints.map((b) => b.end)];
+			const sectionEnds = [...breakPoints.map((b) => b.top), mirrorHeight];
+
+			for (let s = 0; s < sectionStarts.length; s++) {
+				const sStart = sectionStarts[s];
+				const sEnd = sectionEnds[s];
+				let t = sStart;
+				let isFirst = s === 0;
 
-			for (let i = 1, t = 0; i < totalPages; i++) {
-				t += A4_PAGE_HEIGHT + (i === 1 ? this.#paddingTop + this.#paddingBottom : this.#paddingTop);
-				if (!pages.some((p) => Math.abs(p.top - t) < 3)) {
-					const top = this._calcPageBreakTop(t, chr, mChr);
-					if (top === null) break;
-					pages.push({ number: i, top });
+				while (true) {
+					t += A4_PAGE_HEIGHT + (isFirst ? this.#paddingTop + this.#paddingBottom : this.#paddingTop);
+					isFirst = false;
+
+					if (t >= sEnd) break;
+
+					if (!pages.some((p) => Math.abs(p.top - t) < 3)) {
+						const top = this._calcPageBreakTop(t, chr, mChr, pages);
+						if (top === null) break;
+						pages.push({ number: 0, top });
+					}
 				}
 			}
 
@@ -214,8 +218,8 @@ class DocumentType {
 			this.#page.innerHTML = '';
 			this.#pages = [];
 
-			for (let i = 0, t; i < totalPages; i++) {
-				if (!pages[i]) continue;
+			const wwWidth = this.#wwFrame.offsetWidth + 1;
+			for (let i = 0, t; i < pages.length; i++) {
 				t = pages[i].top;
 				if (mirrorHeight < t) break;
 
@@ -249,10 +253,11 @@ class DocumentType {
 	 * @param {number} t - The initial top position value to be adjusted.
 	 * @param {HTMLCollection} chr - The elements array in the current (main) page.
 	 * @param {HTMLCollection} mChr - The elements array in the mirrored page.
+	 * @param {Array.<{number: number, top: number, isBreak?: boolean}>} [pages] - The pages array containing page break info.
 	 * @returns {number|null} The adjusted top value.
 	 */
-	_calcPageBreakTop(t, chr, mChr) {
-		const { ci } = this._getElementAtPosition(t, mChr);
+	_calcPageBreakTop(t, chr, mChr, pages) {
+		const { ci } = this._getElementAtPosition(t, mChr, pages);
 		const mel = /** @type {HTMLElement} */ (mChr[ci]);
 		const el = /** @type {HTMLElement} */ (chr[ci]);
 		if (!mel || !el) return null;
@@ -290,22 +295,39 @@ class DocumentType {
 	 * @description Retrieves the element at a given position.
 	 * @param {number} pageTop - The vertical position to check.
 	 * @param {HTMLCollection} mChr - List of mirrored elements.
+	 * @param {Array.<{number: number, top: number, isBreak?: boolean}>} [pages] - The pages array containing page break info for skipping break elements.
 	 * @returns {{ci: number, cm: number, ch: number}} The closest element and its related data.
 	 * - ci: The index of the closest element.
 	 * - cm: The distance between the top of the closest element and the given position.
 	 * - ch: The height of the closest element.
 	 */
-	_getElementAtPosition(pageTop, mChr) {
+	_getElementAtPosition(pageTop, mChr, pages) {
 		let start = this.#mirrorCache;
 		let end = mChr.length - 1;
 
+		// Reset cache if target position is before cached position (crossing section boundaries)
+		if (start > 0) {
+			const cachedPos = this.#positionCache.get(start);
+			if (cachedPos && pageTop < cachedPos.top) {
+				start = 0;
+			}
+		}
+
 		while (start <= end) {
 			const mid = Math.floor((start + end) / 2);
 			const { top, height, bottom } = this.#positionCache.get(mid);
 
 			if (pageTop >= top && pageTop <= bottom) {
-				this.#mirrorCache = mid;
-				return { ci: mid, cm: pageTop - bottom, ch: height };
+				let ci = mid;
+				// Skip page break elements — use adjacent content element
+				if (pages && dom.utils.hasClass(mChr[ci], 'se-page-break')) {
+					ci = ci + 1 < mChr.length ? ci + 1 : Math.max(0, ci - 1);
+					const adjPos = this.#positionCache.get(ci);
+					this.#mirrorCache = ci;
+					return { ci, cm: pageTop - adjPos.bottom, ch: adjPos.height };
+				}
+				this.#mirrorCache = ci;
+				return { ci, cm: pageTop - bottom, ch: height };
 			}
 
 			if (pageTop < top) {
@@ -315,7 +337,11 @@ class DocumentType {
 			}
 		}
 
-		const closestIndex = mChr[start] ? start : end;
+		let closestIndex = mChr[start] ? start : end;
+		// Skip page break elements for closest match
+		if (pages && dom.utils.hasClass(mChr[closestIndex], 'se-page-break')) {
+			closestIndex = closestIndex + 1 < mChr.length ? closestIndex + 1 : Math.max(0, closestIndex - 1);
+		}
 		this.#mirrorCache = closestIndex;
 		const iElement = this.#positionCache.get(closestIndex);
 		return { ci: closestIndex, cm: pageTop - iElement.bottom, ch: iElement.height };

package/src/modules/contract/Browser.js

@@ -40,7 +40,7 @@ import ApiManager from '../manager/ApiManager';
  *   ]
  * }
  * ```
- * @property {Object<string, string>} [searchUrlHeader] - File server search http header. Optional. Can be overridden in browser.
+ * @property {Object<string, string>} [searchHeaders] - File server search http header. Optional. Can be overridden in browser.
  * @property {string} [listClass] - Class name of list div. Required. Can be overridden in browser.
  * @property {(item: BrowserFile) => string} [drawItemHandler] - Function that returns HTML string for rendering each file item. Required. Can be overridden in browser.
  * ```js
@@ -114,9 +114,9 @@ class Browser {
 		this.listClass = params.listClass || 'se-preview-list';
 		this.directData = params.data;
 		this.url = params.url;
-		this.urlHeader = params.headers;
+		this.headers = params.headers;
 		this.searchUrl = params.searchUrl;
-		this.searchUrlHeader = params.searchUrlHeader;
+		this.searchHeaders = params.searchHeaders;
 		this.drawItemHandler = (params.drawItemHandler || DrawItems).bind({ thumbnail: params.thumbnail, props: params.props || [] });
 		this.selectorHandler = params.selectorHandler;
 		this.columnSize = params.columnSize || 4;
@@ -151,6 +151,7 @@ class Browser {
 		// init
 		browserFrame.appendChild(dom.utils.createElement('DIV', { class: 'se-browser-back' }));
 		browserFrame.appendChild(content);
+		browserFrame.setAttribute('popover', 'manual');
 		this.#$.contextProvider.carrierWrapper.appendChild(browserFrame);
 
 		this.#$.eventManager.addEvent(this.tagArea, 'click', this.#OnClickTag.bind(this));
@@ -175,7 +176,7 @@ class Browser {
 	 * @param {string} [params.listClass] - Class name of list div. If not, use `this.listClass`.
 	 * @param {string} [params.title] - File browser window title. If not, use `this.title`.
 	 * @param {string} [params.url] - File server url. If not, use `this.url`.
-	 * @param {Object<string, string>} [params.urlHeader] - File server http header. If not, use `this.urlHeader`.
+	 * @param {Object<string, string>} [params.headers] - File server http header. If not, use `this.headers`.
 	 * @example
 	 * // Open with default settings (configured at construction):
 	 * this.browser.open();
@@ -184,7 +185,7 @@ class Browser {
 	 * this.browser.open({
 	 *   title: 'Select a video',
 	 *   url: '/api/videos',
-	 *   urlHeader: { Authorization: 'Bearer token' },
+	 *   headers: { Authorization: 'Bearer token' },
 	 * });
 	 */
 	open(params = {}) {
@@ -197,13 +198,14 @@ class Browser {
 
 		this.titleArea.textContent = params.title || this.title;
 		this.area.style.display = 'block';
+		this.area.showPopover?.();
 		this.#$.ui.opendBrowser = this;
 		this.closeArrow = this.#$.options.get('_rtl') ? this.#$.icons.menu_arrow_left : this.#$.icons.menu_arrow_right;
 
 		if (this.directData) {
 			this.#drowItems(this.directData);
 		} else {
-			this.#drawFileList(params.url || this.url, params.urlHeader || this.urlHeader, false);
+			this.#drawFileList(params.url || this.url, params.headers || this.headers, false);
 		}
 
 		this.body.style.maxHeight = dom.utils.getClientSize().h - (this.#$.offset.getGlobal(this.body).top - _w.scrollY) - 20 + 'px';
@@ -217,6 +219,7 @@ class Browser {
 		this.#removeGlobalEvent();
 		this.apiManager.cancel();
 
+		this.area.hidePopover?.();
 		this.area.style.display = 'none';
 		this.selectedTags = [];
 		this.items = [];
@@ -243,7 +246,8 @@ class Browser {
 	search(keyword) {
 		if (this.searchUrl) {
 			this.keyword = keyword;
-			this.#drawFileList(this.searchUrl + '?keyword=' + keyword, this.searchUrlHeader, false);
+			const sep = this.searchUrl.includes('?') ? '&' : '?';
+			this.#drawFileList(this.searchUrl + sep + 'keyword=' + _w.encodeURIComponent(keyword), this.searchHeaders, false);
 		} else {
 			this.keyword = keyword.toLowerCase();
 			this.#drawListItem(this.#allItems.length > 0 ? this.#allItems : this.items, false);
@@ -299,11 +303,11 @@ class Browser {
 	/**
 	 * @description Fetches the file list from the server.
 	 * @param {string} url - The file server URL.
-	 * @param {Object<string, string>} urlHeader - The HTTP headers for the request.
+	 * @param {Object<string, string>} headers - The HTTP headers for the request.
 	 * @param {boolean} pageLoading - Indicates if this is a paginated request.
 	 */
-	#drawFileList(url, urlHeader, pageLoading) {
-		this.apiManager.call({ method: 'GET', url, headers: urlHeader, callBack: this.#CallBackGet.bind(this), errorCallBack: this.#CallBackError.bind(this) });
+	#drawFileList(url, headers, pageLoading) {
+		this.apiManager.call({ method: 'GET', url, headers, callBack: this.#CallBackGet.bind(this), errorCallBack: this.#CallBackError.bind(this) });
 		if (!pageLoading) {
 			this.sideOpenBtn.style.display = 'none';
 			this.showBrowserLoading();
@@ -598,7 +602,7 @@ class Browser {
 		this.selectedTags = [];
 
 		if (typeof data === 'string') {
-			this.#drawFileList(data, this.urlHeader, true);
+			this.#drawFileList(data, this.headers, true);
 		} else {
 			this.#drawListItem(data, true);
 		}

package/src/modules/contract/Controller.js

@@ -110,6 +110,7 @@ class Controller {
 		}
 
 		// add element
+		this.form.setAttribute('popover', 'manual');
 		this.#$.contextProvider.carrierWrapper.appendChild(element);
 
 		// init
@@ -394,6 +395,7 @@ class Controller {
 	 * @description Hide controller at editor area (link button, image resize button..)
 	 */
 	#controllerOff() {
+		this.form.hidePopover?.();
 		this.form.style.display = 'none';
 		this.#$.ui.opendControllers = this.#$.ui.opendControllers.filter((v) => v.form !== this.form);
 		if (this.#$.ui.currentControllerName !== this.kind && this.#$.ui.opendControllers.length > 0) return;
@@ -464,6 +466,7 @@ class Controller {
 
 		controller.style.zIndex = this.toTop ? INDEX_0 : this.#reserveIndex ? INDEX_S_1 : INDEX_1;
 		controller.style.visibility = '';
+		controller.showPopover?.();
 		return true;
 	}
 

package/src/modules/contract/Figure.js

@@ -282,10 +282,18 @@ class Figure {
 		const cover = dom.query.getParentElement(element, 'FIGURE', 2);
 		const inlineCover = dom.query.getParentElement(element, 'SPAN', 2);
 		const anyCover = cover || inlineCover;
-		const target = dom.query.getParentElement(element, (current) => current.parentElement === anyCover, 0) || /** @type {HTMLElement} */ (element);
+		let target = dom.query.getParentElement(element, (current) => current.parentElement === anyCover, 0) || element;
+
+		// When image is wrapped by anchor, target becomes <a> instead of <img>
+		if (dom.check.isAnchor(target)) {
+			const imgEl = target.querySelector(':scope > img');
+			if (imgEl) {
+				target = imgEl;
+			}
+		}
 
 		return {
-			target,
+			target: /** @type {HTMLElement} */ (target),
 			container: dom.query.getParentElement(target, Figure.is, 3) || cover,
 			cover: cover,
 			inlineCover: dom.utils.hasClass(inlineCover, 'se-inline-component') ? /** @type {HTMLElement} */ (inlineCover) : null,
@@ -734,12 +742,23 @@ class Figure {
 		const { container, inlineCover, target } = Figure.GetContainer(targetNode);
 		const { w, h } = this.getSize(target);
 
+		// Check if target is wrapped by an anchor
+		const anchorEl = dom.check.isAnchor(target.parentNode) ? target.parentNode : null;
+
 		const newTarget = /** @type {HTMLElement} */ (target.cloneNode(false));
 		newTarget.style.width = '';
 		newTarget.style.height = '';
 		newTarget.removeAttribute('width');
 		newTarget.removeAttribute('height');
 
+		// Preserve anchor wrapper if exists
+		let elementToInsert = newTarget;
+		if (anchorEl) {
+			const newAnchor = /** @type {HTMLElement} */ (anchorEl.cloneNode(false));
+			newAnchor.appendChild(newTarget);
+			elementToInsert = newAnchor;
+		}
+
 		switch (formatStyle) {
 			case 'inline': {
 				if (inlineCover) break;
@@ -748,7 +767,7 @@ class Figure {
 				const next = container.nextElementSibling;
 				const parent = container.parentElement;
 
-				const figure = Figure.CreateInlineContainer(newTarget);
+				const figure = Figure.CreateInlineContainer(elementToInsert);
 				dom.utils.addClass(
 					figure.container,
 					container.className
@@ -777,7 +796,7 @@ class Figure {
 					dom.utils.removeItem(s.previousElementSibling);
 				}
 
-				const figure = Figure.CreateContainer(newTarget);
+				const figure = Figure.CreateContainer(elementToInsert);
 				dom.utils.addClass(
 					figure.container,
 					container.className
@@ -1534,6 +1553,7 @@ class Figure {
 		this.setAlign(this._element, value);
 		this.selectMenu_align.close();
 		this.#$.component.select(this._element, this.kind);
+		this.#$.history.push(false);
 	}
 
 	/**
@@ -1542,6 +1562,7 @@ class Figure {
 	#SetMenuAs(value) {
 		this.convertAsFormat(this._element, value);
 		this.selectMenu_as.close();
+		this.#$.history.push(false);
 	}
 
 	/**
@@ -1564,6 +1585,7 @@ class Figure {
 
 		this.selectMenu_resize.close();
 		this.#$.component.select(this._element, this.kind);
+		this.#$.history.push(false);
 	}
 
 	#OffFigureContainer() {

package/src/modules/contract/Modal.js

@@ -10,6 +10,9 @@ const DIRECTION_CURSOR_MAP = { w: 'ns-resize', h: 'ew-resize', c: 'nwse-resize',
 class Modal {
 	#$;
 
+	/** @type {Node} */
+	#targetElement;
+
 	/** @type {HTMLElement} */
 	#modalArea;
 	/** @type {HTMLElement} */
@@ -162,6 +165,7 @@ class Modal {
 
 		dom.utils.addClass(this.#modalArea, 'se-backdrop-show');
 		dom.utils.addClass(this.form, 'se-modal-show');
+		this.#modalArea.showPopover?.();
 
 		if (this.#resizeBody) {
 			const offset = this.#saveOffset();
@@ -174,6 +178,8 @@ class Modal {
 		}
 
 		if (this.focusElement) this.focusElement.focus();
+
+		this.#targetElement = this.#$.component.currentTarget;
 	}
 
 	/**
@@ -197,13 +203,20 @@ class Modal {
 		this.#bindClose &&= this.#$.eventManager.removeGlobalEvent(this.#bindClose);
 
 		// close
+		this.#modalArea.hidePopover?.();
 		dom.utils.removeClass(this.#modalArea, 'se-backdrop-show');
 		dom.utils.removeClass(this.form, 'se-modal-show');
 
 		this.inst.modalInit?.();
 		this.inst.modalOff?.(this.isUpdate);
 
-		if (!this.isUpdate) this.#$.focusManager.focus();
+		if (!this.isUpdate) {
+			this.#$.focusManager.focus();
+		} else if (this.#targetElement) {
+			this.inst.componentSelect?.(this.#targetElement);
+		}
+
+		this.#targetElement = null;
 	}
 
 	/**

package/src/modules/ui/ModalAnchorEditor.js

@@ -209,6 +209,8 @@ class ModalAnchorEditor {
 	/**
 	 * @description Creates an anchor (`<a>`) element with the specified attributes.
 	 * @param {boolean} notText - If `true`, the anchor will not contain text content.
+	 * @param {?string} [urlOverride] - Fallback URL used when the modal's `linkValue` is empty
+	 * - (e.g., when called outside the modal lifecycle such as from `retainFormat`)
 	 * @returns {HTMLElement|null} - The newly created anchor element, or `null` if the URL is empty.
 	 * @example
 	 * // In a link plugin — create anchor with text content:
@@ -221,11 +223,14 @@ class ModalAnchorEditor {
 	 * if (anchor) {
 	 *   anchor.appendChild(imgElement);
 	 * }
+	 *
+	 * // Preserve an existing parent anchor's href when rebuilding outside the modal:
+	 * const anchor = this.anchor.create(true, parentAnchor.href);
 	 */
-	create(notText) {
-		if (this.linkValue.length === 0) return null;
+	create(notText, urlOverride) {
+		const url = this.linkValue || urlOverride || '';
+		if (url.length === 0) return null;
 
-		const url = this.linkValue;
 		const displayText = this.displayInput.value.length === 0 ? url : this.displayInput.value;
 
 		const oA = /** @type {HTMLAnchorElement} */ (this.currentTarget || dom.utils.createElement('A'));

package/src/plugins/browser/audioGallery.js

@@ -19,6 +19,10 @@ import { Browser } from '../../modules/contract';
  * }
  * ```
  * @property {Object<string, string>} [headers] - Server request headers
+ * @property {string} [searchUrl] - Server-side search URL. When set, the keyword is sent to this URL
+ * as `?keyword=<value>` and the server response replaces the list. When not set, search filters the
+ * already-loaded items locally.
+ * @property {Object<string, string>} [searchHeaders] - Server-side search request headers
  * @property {string|((item: SunEditor.Module.Browser.File) => string)} [thumbnail] - Default thumbnail
  */
 
@@ -51,6 +55,8 @@ class AudioGallery extends PluginBrowser {
 			data: pluginOptions.data,
 			url: pluginOptions.url,
 			headers: pluginOptions.headers,
+			searchUrl: pluginOptions.searchUrl,
+			searchHeaders: pluginOptions.searchHeaders,
 			selectorHandler: this.#SetItem.bind(this),
 			columnSize: 4,
 			className: 'se-audio-gallery',

package/src/plugins/browser/fileBrowser.js

@@ -26,6 +26,10 @@ import { Browser } from '../../modules/contract';
  * }
  * ```
  * @property {Object<string, string>} [headers] - Server request headers
+ * @property {string} [searchUrl] - Server-side search URL. When set, the keyword is sent to this URL
+ * as `?keyword=<value>` and the server response replaces the list. When not set, search filters the
+ * already-loaded items locally.
+ * @property {Object<string, string>} [searchHeaders] - Server-side search request headers
  * @property {string|((item: SunEditor.Module.Browser.File) => string)} [thumbnail] - Default thumbnail URL or a function that returns a thumbnail URL per item.
  * @property {number} [expand=1] - Initial folder expand depth. `1` expands the first level, `Infinity` expands all. Default: `1`.
  * @property {Array<string>} [props] - Additional tag names
@@ -64,6 +68,8 @@ class FileBrowser extends PluginBrowser {
 			data: pluginOptions.data,
 			url: pluginOptions.url,
 			headers: pluginOptions.headers,
+			searchUrl: pluginOptions.searchUrl,
+			searchHeaders: pluginOptions.searchHeaders,
 			selectorHandler: this.#SetItem.bind(this),
 			columnSize: 4,
 			className: 'se-file-browser',

package/src/plugins/browser/fileGallery.js

@@ -20,6 +20,10 @@ import { Browser } from '../../modules/contract';
  * }
  * ```
  * @property {Object<string, string>} [headers] - Server request headers
+ * @property {string} [searchUrl] - Server-side search URL. When set, the keyword is sent to this URL
+ * as `?keyword=<value>` and the server response replaces the list. When not set, search filters the
+ * already-loaded items locally.
+ * @property {Object<string, string>} [searchHeaders] - Server-side search request headers
  * @property {string|((item: SunEditor.Module.Browser.File) => string)} [thumbnail] - Default thumbnail
  */
 
@@ -52,6 +56,8 @@ class FileGallery extends PluginBrowser {
 			data: pluginOptions.data,
 			url: pluginOptions.url,
 			headers: pluginOptions.headers,
+			searchUrl: pluginOptions.searchUrl,
+			searchHeaders: pluginOptions.searchHeaders,
 			selectorHandler: this.#SetItem.bind(this),
 			columnSize: 4,
 			className: 'se-file-gallery',

package/src/plugins/browser/imageGallery.js

@@ -20,6 +20,10 @@ import { Browser } from '../../modules/contract';
  * }
  * ```
  * @property {Object<string, string>} [headers] - Server request headers
+ * @property {string} [searchUrl] - Server-side search URL. When set, the keyword is sent to this URL
+ * as `?keyword=<value>` and the server response replaces the list. When not set, search filters the
+ * already-loaded items locally.
+ * @property {Object<string, string>} [searchHeaders] - Server-side search request headers
  */
 
 /**
@@ -50,6 +54,8 @@ class ImageGallery extends PluginBrowser {
 			data: pluginOptions.data,
 			url: pluginOptions.url,
 			headers: pluginOptions.headers,
+			searchUrl: pluginOptions.searchUrl,
+			searchHeaders: pluginOptions.searchHeaders,
 			selectorHandler: this.#SetItem.bind(this),
 			columnSize: 4,
 			className: 'se-image-gallery',

package/src/plugins/browser/videoGallery.js

@@ -20,6 +20,10 @@ import { Browser } from '../../modules/contract';
  * }
  * ```
  * @property {Object<string, string>} [headers] - Server request headers
+ * @property {string} [searchUrl] - Server-side search URL. When set, the keyword is sent to this URL
+ * as `?keyword=<value>` and the server response replaces the list. When not set, search filters the
+ * already-loaded items locally.
+ * @property {Object<string, string>} [searchHeaders] - Server-side search request headers
  * @property {string|((item: SunEditor.Module.Browser.File) => string)} [thumbnail] - Default thumbnail
  */
 
@@ -52,6 +56,8 @@ class VideoGallery extends PluginBrowser {
 			data: pluginOptions.data,
 			url: pluginOptions.url,
 			headers: pluginOptions.headers,
+			searchUrl: pluginOptions.searchUrl,
+			searchHeaders: pluginOptions.searchHeaders,
 			selectorHandler: this.#SetItem.bind(this),
 			columnSize: 4,
 			className: 'se-video-gallery',

package/src/plugins/dropdown/table/services/table.style.js

@@ -598,16 +598,25 @@ export class TableStyleService {
 		this._propsCache = [];
 
 		for (let i = 0, t, isBreak; (t = targets[i]); i++) {
-			// eslint-disable-next-line no-shadow
-			const { cssText, border, backgroundColor, color, textAlign, verticalAlign, fontWeight, textDecoration, fontStyle } = t.style;
-			this._propsCache.push([t, cssText]);
+			const {
+				cssText: t_cssText,
+				border: t_border,
+				backgroundColor: t_backgroundColor,
+				color: t_color,
+				textAlign: t_textAlign,
+				verticalAlign: t_verticalAlign,
+				fontWeight: t_fontWeight,
+				textDecoration: t_textDecoration,
+				fontStyle: t_fontStyle,
+			} = t.style;
+			this._propsCache.push([t, t_cssText]);
 			if (isBreak) continue;
 
-			const { c, s, w } = this.#getBorderStyle(border);
+			const { c, s, w } = this.#getBorderStyle(t_border);
 
 			// use getComputedStyle to normalize any CSS color format to rgb
-			let hexBackColor = backgroundColor;
-			let hexColor = color;
+			let hexBackColor = t_backgroundColor;
+			let hexColor = t_color;
 			if (hexBackColor || hexColor) {
 				const computed = _w.getComputedStyle(t);
 				if (hexBackColor) hexBackColor = computed.backgroundColor;
@@ -619,12 +628,12 @@ export class TableStyleService {
 			if (b_width && cellBorder.w !== w) b_width = '';
 			if (backColor !== converter.rgb2hex(hexBackColor)) backColor = '';
 			if (fontColor !== converter.rgb2hex(hexColor)) fontColor = '';
-			if (align !== (isTable ? this.#state.figureElement?.style.float : textAlign)) align = '';
-			if (align_v && align_v !== verticalAlign) align_v = '';
-			if (bold && bold !== /.+/.test(fontWeight)) bold = false;
-			if (underline && underline !== /underline/i.test(textDecoration)) underline = false;
-			if (strike && strike !== /line-through/i.test(textDecoration)) strike = false;
-			if (italic && italic !== /italic/i.test(fontStyle)) italic = false;
+			if (align !== (isTable ? this.#state.figureElement?.style.float : t_textAlign)) align = '';
+			if (align_v && align_v !== t_verticalAlign) align_v = '';
+			if (bold && bold !== /.+/.test(t_fontWeight)) bold = false;
+			if (underline && underline !== /underline/i.test(t_textDecoration)) underline = false;
+			if (strike && strike !== /line-through/i.test(t_textDecoration)) strike = false;
+			if (italic && italic !== /italic/i.test(t_fontStyle)) italic = false;
 			if (!b_color || !b_style || !b_width || !backColor || !fontColor) {
 				isBreak = true;
 			}

package/src/plugins/modal/embed.js

@@ -39,6 +39,17 @@ const { _w, NO_EVENT } = env;
  * { query_vimeo: 'autoplay=1' }
  * ```
  * @property {Array<RegExp>} [urlPatterns] - Additional URL patterns to recognize as embeddable content.
+ * @property {Array<RegExp|string>} [scriptSrcWhitelist] - Allowed `<script src=...>` patterns for raw embed HTML
+ * - (e.g. Twitter blockquote + `widgets.js`). Each entry is a `RegExp` (tested against the full src) or a `string` (matched via `startsWith`).
+ * - Defaults to `[]` — all script tags are rejected.** Inline scripts (no `src`) are always rejected.
+ * ```js
+ * {
+ *   scriptSrcWhitelist: [
+ *     /^https:\/\/platform\.x\.com\/widgets\.js$/,
+ *     /^https:\/\/www\.instagram\.com\/embed\.js$/,
+ *   ]
+ * }
+ * ```
  * @property {Object<string, {pattern: RegExp, action: (url: string) => string, tag: string}>} [embedQuery] - Custom embed service definitions.
  * Each key is a service name, with `pattern` to match the URL, `action` to transform it into an embed URL, and `tag` for the output element.
  * ```js
@@ -125,6 +136,18 @@ class Embed extends PluginModal {
 		return false;
 	}
 
+	/**
+	 * @description Validate a `<script src>` against the configured whitelist for raw embed HTML.
+	 * Inline scripts (no `src`) are always rejected.
+	 * @param {string} src
+	 * @param {Array<RegExp|string>} whitelist
+	 * @returns {boolean}
+	 */
+	static #isAllowedScriptSrc(src, whitelist) {
+		if (!src) return false;
+		return whitelist.some((p) => (p instanceof RegExp ? p.test(src) : src.startsWith(p)));
+	}
+
 	/** @type {Array<RegExp>} */
 	static #urlPatterns = null;
 
@@ -168,6 +191,7 @@ class Embed extends PluginModal {
 			iframeTagAttributes: pluginOptions.iframeTagAttributes || null,
 			query_youtube: pluginOptions.query_youtube || '',
 			query_vimeo: pluginOptions.query_vimeo || '',
+			scriptSrcWhitelist: Array.isArray(pluginOptions.scriptSrcWhitelist) ? pluginOptions.scriptSrcWhitelist : [],
 			insertBehavior: pluginOptions.insertBehavior,
 		};
 
@@ -446,6 +470,19 @@ class Embed extends PluginModal {
 		if (/^<iframe\s|^<blockquote\s/i.test(src)) {
 			const embedDOM = new DOMParser().parseFromString(src, 'text/html').body.children;
 			if (embedDOM.length === 0) return false;
+
+			// Validate every iframe in the raw HTML against the URL whitelist.
+			for (let i = 0; i < embedDOM.length; i++) {
+				const node = /** @type {Element} */ (embedDOM[i]);
+				if (/^iframe$/i.test(node.nodeName) && !Embed.#checkContentType(node.getAttribute('src') || '')) return false;
+				const nested = node.querySelectorAll?.('iframe');
+				if (nested) {
+					for (let j = 0; j < nested.length; j++) {
+						if (!Embed.#checkContentType(nested[j].getAttribute('src') || '')) return false;
+					}
+				}
+			}
+
 			embedInfo = { children: embedDOM, ...this.#getInfo(), process: null };
 		} else {
 			const processUrl = this.findProcessUrl(src);
@@ -604,9 +641,12 @@ class Embed extends PluginModal {
 				container = figure.container;
 
 				const childNodes = Array.from(children);
+				const scriptWhitelist = this.pluginOptions.scriptSrcWhitelist;
 				for (const chd of childNodes) {
 					if (/^script$/i.test(chd.nodeName)) {
-						scriptTag = dom.utils.createElement('script', { src: /** @type {Element} */ (chd).getAttribute('src'), async: 'true' }, null);
+						const scriptSrc = /** @type {Element} */ (chd).getAttribute('src') || '';
+						if (!Embed.#isAllowedScriptSrc(scriptSrc, scriptWhitelist)) continue;
+						scriptTag = dom.utils.createElement('script', { src: scriptSrc, async: 'true' }, null);
 						continue;
 					}
 					cover.appendChild(chd);