suneditor 3.0.0-beta.26 → 3.0.0-beta.28

package/src/core/event/rules/keydown.rule.enter.js

@@ -0,0 +1,144 @@
+import { dom } from '../../../helper';
+import { A } from '../actions';
+
+/**
+ * @this {void}
+ * @description Enter key down rule
+ * @param {__se__EventActions} actions - Action list
+ * @param {__se__EventPorts} ports - Ports for interacting with editor
+ * @param {__se__EventKeydownCtx} ctx - Context object
+ * @returns {boolean} Return false to stop the processing
+ */
+export function reduceEnterDown(actions, ports, ctx) {
+	const { format, char, selection } = ports;
+	const { frameOptions, range, formatEl, selectionNode, shift, e } = ctx;
+	const selectRange = !range.collapsed || range.startContainer !== range.endContainer;
+
+	actions.push(A.componentDeselect());
+
+	const brBlock = format.getBrLine(selectionNode, null);
+	const rangeEl = format.getBlock(formatEl, null);
+
+	if (frameOptions.get('charCounter_type') === 'byte-html') {
+		let enterHTML = '';
+		if ((!shift && brBlock) || shift) {
+			enterHTML = '<br>';
+		} else {
+			enterHTML = '<' + formatEl.nodeName + '><br></' + formatEl.nodeName + '>';
+		}
+
+		if (!char.check(enterHTML)) {
+			actions.push(A.prevent());
+			return false;
+		}
+	}
+
+	if (!shift) {
+		const formatEndEdge = !range.endContainer.nextSibling && format.isEdgeLine(range.endContainer, range.endOffset, 'end');
+		const formatStartEdge = !range.startContainer.previousSibling && format.isEdgeLine(range.startContainer, range.startOffset, 'front');
+
+		// add default format line
+		if (formatEndEdge && (/^H[1-6]$/i.test(formatEl.nodeName) || /^HR$/i.test(formatEl.nodeName))) {
+			ports.enterPrevent(e);
+			actions.push(A.enterLineAddDefault(formatEl));
+			actions.push(A.enterScrollTo(range));
+			return true;
+		} else if (rangeEl && formatEl && !dom.check.isTableCell(rangeEl) && !/^FIGCAPTION$/i.test(rangeEl.nodeName)) {
+			// add default List line
+			const rangeEnt = selection.getRange();
+			if (dom.check.isEdgePoint(rangeEnt.endContainer, rangeEnt.endOffset) && dom.check.isList(selectionNode.nextSibling)) {
+				ports.enterPrevent(e);
+				actions.push(A.enterListAddItem(formatEl, selectionNode));
+				actions.push(A.enterScrollTo(range));
+				return true;
+			}
+
+			if (
+				(rangeEnt.commonAncestorContainer.nodeType === 3 ? !(/** @type {HTMLElement} */ (rangeEnt.commonAncestorContainer).nextElementSibling) : true) &&
+				dom.check.isZeroWidth(formatEl.innerText.trim()) &&
+				!dom.check.isListCell(formatEl.nextElementSibling)
+			) {
+				ports.enterPrevent(e);
+				actions.push(A.enterFormatExitEmpty(formatEl, rangeEl));
+				return true;
+			}
+		}
+
+		// br line | closure block exception
+		if (brBlock || (rangeEl === formatEl && format.isClosureBlock(rangeEl) && format.isLine(formatEl))) {
+			ports.enterPrevent(e);
+
+			const selectionFormat = selectionNode === brBlock;
+			const wSelection = selection.get();
+			const children = selectionNode.childNodes,
+				offset = wSelection.focusOffset,
+				prev = selectionNode.previousElementSibling,
+				next = selectionNode.nextSibling;
+
+			if (
+				!format.isClosureBrLine(brBlock) &&
+				children &&
+				((selectionFormat &&
+					range.collapsed &&
+					children.length - 1 <= offset + 1 &&
+					dom.check.isBreak(children[offset]) &&
+					(!children[offset + 1] || ((!children[offset + 2] || dom.check.isZeroWidth(children[offset + 2].textContent)) && children[offset + 1].nodeType === 3 && dom.check.isZeroWidth(children[offset + 1].textContent))) &&
+					offset > 0 &&
+					dom.check.isBreak(children[offset - 1])) ||
+					(!selectionFormat &&
+						dom.check.isZeroWidth(selectionNode.textContent) &&
+						dom.check.isBreak(prev) &&
+						(dom.check.isBreak(prev.previousSibling) || !dom.check.isZeroWidth(prev.previousSibling?.textContent)) &&
+						(!next || (!dom.check.isBreak(next) && dom.check.isZeroWidth(next.textContent)))))
+			) {
+				actions.push(A.enterFormatCleanBrAndZWS(selectionNode, selectionFormat, brBlock, children, offset));
+				actions.push(A.enterScrollTo(range));
+				return true;
+			}
+
+			if (selectionFormat) {
+				actions.push(A.enterFormatInsertBrHtml(brBlock, range, wSelection, offset));
+			} else {
+				actions.push(A.enterFormatInsertBrNode(wSelection));
+			}
+
+			actions.push(A.enterScrollTo(range));
+			return true;
+		}
+
+		// set format attrs - edge
+		if (range.collapsed && (formatStartEdge || formatEndEdge)) {
+			ports.enterPrevent(e);
+			actions.push(A.enterFormatBreakAtEdge(formatEl, selectionNode, formatStartEdge, formatEndEdge));
+			actions.push(A.enterScrollTo(range));
+			return true;
+		}
+
+		if (formatEl) {
+			actions.push(A.prevent());
+
+			/** @type {HTMLElement} */
+			if (selectRange) {
+				actions.push(A.enterFormatBreakWithSelection(formatEl, range, formatStartEdge, formatEndEdge));
+			} else {
+				actions.push(A.enterFormatBreakAtCursor(formatEl, range));
+			}
+
+			actions.push(A.enterScrollTo(range));
+			return true;
+		}
+	}
+
+	if (selectRange) {
+		actions.push(A.enterScrollTo(range));
+		return true;
+	}
+
+	if (rangeEl && dom.query.getParentElement(rangeEl, 'FIGCAPTION') && dom.query.getParentElement(rangeEl, dom.check.isList)) {
+		ports.enterPrevent(e);
+		actions.push(A.enterFigcaptionExitInList(formatEl));
+		actions.push(A.enterScrollTo(range));
+	}
+
+	return true;
+}

package/src/core/event/rules/keydown.rule.tab.js

@@ -0,0 +1,29 @@
+import { dom } from '../../../helper';
+import { A } from '../actions';
+
+/**
+ * @this {void}
+ * @description Tab key down rule
+ * @param {__se__EventActions} actions - Action list
+ * @param {__se__EventPorts} _ports - Ports for interacting with editor
+ * @param {__se__EventKeydownCtx} ctx - Context object
+ * @returns {boolean} Return false to stop the processing
+ */
+export function reduceTabDown(actions, _ports, ctx) {
+	const { options, selectionNode, range, formatEl, ctrl, alt, shift } = ctx;
+
+	if (options.get('tabDisable')) {
+		return true;
+	}
+
+	actions.push(A.prevent());
+
+	if (ctrl || alt || dom.check.isWysiwygFrame(selectionNode)) {
+		return true;
+	}
+
+	actions.push(A.tabFormatIndent(range, formatEl, shift));
+	actions.push(A.historyPush(false));
+
+	return true;
+}

package/src/core/section/constructor.js

@@ -8,18 +8,48 @@ import { DEFAULTS } from '../config/options';
 const _d = env._d;
 
 /**
- * @typedef {import('../config/options').EditorFrameOptions} EditorFrameOptions
+ * @typedef {import('../config/options').EditorFrameOptions} EditorFrameOptions_constructor
  */
 
 /**
- * @typedef {import('../config/options').EditorInitOptions} EditorInitOptions
+ * @typedef {import('../config/options').EditorInitOptions} EditorInitOptions_constructor
+ */
+
+/**
+ * @typedef {import('../config/options').AllBaseOptions} AllBaseOptions_constructor
+ */
+
+/**
+ * @typedef {import('../config/options').BaseOptionsMap} BaseOptionsMap_constructor
+ */
+
+/**
+ * @typedef {import('../config/options').FrameOptionsMap} FrameOptionsMap_constructor
+ */
+
+/**
+ * @typedef {Object} ConstructorReturnType
+ * @property {__se__Context} context - Editor context object
+ * @property {HTMLElement} carrierWrapper - Carrier wrapper element
+ * @property {__se__BaseOptions} options - Processed editor options (Map)
+ * @property {Object<string, *>} plugins - Loaded plugins
+ * @property {Object<string, string>} icons - Icon set
+ * @property {Object<string, string>} lang - Language pack
+ * @property {string|null} value - Initial editor value
+ * @property {string|null} rootId - Root frame ID
+ * @property {Array<string|null>} rootKeys - Array of frame keys
+ * @property {Map<string|null, ReturnType<import('../config/frameContext').CreateFrameContext>>} frameRoots - Map of frame contexts
+ * @property {Object<string, Array<HTMLElement>>} pluginCallButtons - Plugin toolbar buttons
+ * @property {Array<HTMLElement>} responsiveButtons - Responsive toolbar buttons
+ * @property {Object<string, Array<HTMLElement>>|[]} pluginCallButtons_sub - Sub-toolbar plugin buttons
+ * @property {Array<HTMLElement>} responsiveButtons_sub - Sub-toolbar responsive buttons
  */
 
 /**
  * @description Creates a new SunEditor instance with specified options.
- * @param {Array<{target: Element, key: *, options: EditorFrameOptions}>} editorTargets - Target element or multi-root object.
- * @param {EditorInitOptions} options - Configuration options for the editor.
- * @returns {Object<string, *>} - SunEditor instance with context, options, and DOM elements.
+ * @param {Array<{target: Element, key: *, options: EditorFrameOptions_constructor}>} editorTargets - Target element or multi-root object.
+ * @param {EditorInitOptions_constructor} options - Configuration options for the editor.
+ * @returns {ConstructorReturnType} - SunEditor instance with context, options, and DOM elements.
  */
 function Constructor(editorTargets, options) {
 	if (typeof options !== 'object') options = {};
@@ -339,20 +369,24 @@ function _mergeObject(a, b) {
 	}, {});
 }
 
+/**
+ * @typedef {Object} InitOptionsReturnType
+ * @property {BaseOptionsMap_constructor} o - Processed base options (Map containing {@link AllBaseOptions_constructor} keys)
+ * @property {Object<string, string>} i - Icon set
+ * @property {Object<string, string>} l - Language pack
+ * @property {string|null} v - Initial editor value
+ * @property {Array<string[]|string>} buttons - Toolbar button list (arrays for groups, strings for single buttons)
+ * @property {Array<string[]|string>|null} subButtons - Sub-toolbar button list
+ * @property {Element|null} statusbarContainer - Container element for status bar (if specified)
+ * @property {Map<string|null, FrameOptionsMap_constructor>} frameMap - Map of frame-specific options (frame key => {@link FrameOptionsMap})
+ */
+
 /**
  * @description Initialize options
- * @param {EditorInitOptions} options Configuration options for the editor.
- * @param {Array<{target: Element, key: *, options: EditorFrameOptions}>} editorTargets Target textarea
+ * @param {EditorInitOptions_constructor} options Configuration options for the editor.
+ * @param {Array<{target: Element, key: *, options: EditorFrameOptions_constructor}>} editorTargets Target textarea
  * @param {Object<string, *>} plugins Plugins object
- * @returns {{o: Map<string, *>, i: Object<string, string>, l: Object<string, string>, v: string, buttons: Array<string[]|string>, subButtons: Array<string[]|string>, statusbarContainer: Element|null, frameMap: Map<*, *>}}
- * - o: options
- * - i: icons
- * - l: lang
- * - v: value
- * - buttons: Toolbar button list
- * - subButtons: Sub-Toolbar button list
- * - statusbarContainer: statusbar container
- * - frameMap: converted options map
+ * @returns {InitOptionsReturnType} Initialized options and configuration
  */
 export function InitOptions(options, editorTargets, plugins) {
 	const buttonList = options.buttonList || DEFAULTS.BUTTON_LIST;
@@ -619,12 +653,12 @@ export function InitOptions(options, editorTargets, plugins) {
 					_h3: ['c+s+Digit3|Numpad3+$~formatBlock.applyHeaderByShortcut', '']
 				},
 				options.shortcuts || {}
-		  ].reduce((_default, _new) => {
+			].reduce((_default, _new) => {
 				for (const key in _new) {
 					_default[key] = _new[key];
 				}
 				return _default;
-		  }, {});
+			}, {});
 	o.set('shortcuts', shortcuts);
 
 	/** View */
@@ -665,7 +699,7 @@ export function InitOptions(options, editorTargets, plugins) {
 						_default[key] = _new[key];
 					}
 					return _default;
-			  }, {});
+				}, {});
 	o.set('icons', icons);
 
 	/** Create all used styles  */
@@ -759,9 +793,9 @@ export function CreateStatusbar(targetOptions, statusbar) {
 
 /**
  * @description Initialize options.
- * @param {EditorFrameOptions} o - Target options
- * @param {EditorInitOptions} origin - Full options
- * @returns {Map<string, *>}
+ * @param {EditorFrameOptions_constructor} o - Target options
+ * @param {EditorInitOptions_constructor} origin - Full options
+ * @returns {FrameOptionsMap_constructor} Processed frame options Map
  */
 function InitFrameOptions(o, origin) {
 	const fo = new Map();
@@ -1081,7 +1115,7 @@ function _createButton(className, title, dataCommand, dataType, innerHTML, _disa
 					'data-type': dataType,
 					'aria-label': label.replace(/<span .+<\/span>/, ''),
 					tabindex: '-1'
-			  })
+				})
 	);
 
 	if (!isDiv) {

package/src/editorInjector/_classes.js

@@ -17,6 +17,10 @@ function ClassInjector(editor) {
 	this.format = editor.format;
 	/** @description HTML class instance @type {__se__EditorCore['html']} */
 	this.html = editor.html;
+	/** @description Inline format class instance @type {__se__EditorCore['inline']} */
+	this.inline = editor.inline;
+	/** @description List format class instance @type {__se__EditorCore['listFormat']} */
+	this.listFormat = editor.listFormat;
 	/** @description Menu class instance @type {__se__EditorCore['menu']} */
 	this.menu = editor.menu;
 	/** @description NodeTransform class instance @type {__se__EditorCore['nodeTransform']} */

package/src/editorInjector/index.js

@@ -57,6 +57,10 @@ function EditorInjector(editor) {
 	this.format;
 	/** @type {import('./_classes').default['html']} */
 	this.html;
+	/** @type {import('./_classes').default['inline']} */
+	this.inline;
+	/** @type {import('./_classes').default['listFormat']} */
+	this.listFormat;
 	/** @type {import('./_classes').default['menu']} */
 	this.menu;
 	/** @type {import('./_classes').default['nodeTransform']} */

package/src/helper/clipboard.js

@@ -45,7 +45,6 @@ export async function write(content) {
 	}
 
 	try {
-		/* eslint-disable-next-line compat/compat */
 		await navigator.clipboard.write([
 			/* eslint-disable-next-line compat/compat */
 			new ClipboardItem({

package/src/helper/converter.js

@@ -1,6 +1,5 @@
 import { _d, _w } from './env';
 
-const URLPattern = /https?:\/\/[^\s]+/g;
 const FONT_VALUES_MAP = {
 	'xx-small': 0.5625,
 	'x-small': 0.625,
@@ -200,7 +199,7 @@ export function getValues(obj) {
 		? []
 		: Object.keys(obj).map(function (i) {
 				return obj[i];
-		  });
+			});
 }
 
 /**
@@ -377,6 +376,8 @@ export function getWidthInPercentage(target, parentTarget) {
  * @returns {boolean} Return true if the text node is converted to an anchor node
  */
 export function textToAnchor(node) {
+	const URLPattern = /https?:\/\/[^\s]+/g;
+
 	if (node.nodeType === 3 && URLPattern.test(node.textContent) && !/^A$/i.test(node.parentNode?.nodeName)) {
 		const textContent = node.textContent;
 		const fragment = _d.createDocumentFragment();
@@ -469,16 +470,14 @@ export function addUrlQuery(url, query) {
 }
 
 /**
- * @typedef {Object} OptionStyleResult
- * @property {string} top - Styles applied to the top container (e.g. width, z-index, etc).
- * @property {string} frame - Styles applied to the iframe container (e.g. height, min-height).
- * @property {string} editor - Styles applied to the editable content area.
+ * @typedef {import('../core/config/options').OptionStyleResult} OptionStyleResult_converter
  */
+
 /**
  * @description Converts options-related styles and returns them for each frame.
  * @param {Map<string, *>} fo editor.frameOptions
  * @param {string} cssText Style string
- * @returns {OptionStyleResult}
+ * @returns {OptionStyleResult_converter}
  * @private
  */
 export function _setDefaultOptionStyle(fo, cssText) {

package/src/helper/dom/domCheck.js

@@ -226,7 +226,7 @@ export function isNonEditable(node) {
 export function isSpanWithoutAttr(node) {
 	if (node?.nodeType !== 1) return false;
 	const el = /** @type {HTMLElement} */ (node);
-	return /^SPAN$/i.test(el.nodeName) && !el.className && !el.style.cssText;
+	return /^SPAN$/i.test(el.nodeName) && !el.className && el.style.length === 0;
 }
 
 /**

package/src/helper/dom/domQuery.js

@@ -252,7 +252,7 @@ export function compareElements(a, b) {
 		bNode = bNode.parentElement;
 	}
 
-	if (!aNode || !bNode)
+	if (!aNode?.parentNode || !bNode?.parentNode)
 		return {
 			ancestor: null,
 			a: a,

package/src/helper/dom/domUtils.js

@@ -224,7 +224,7 @@ export function prevIndex(array, item) {
 export function copyTagAttributes(originEl, copyEl, blacklist) {
 	const o = /** @type {HTMLElement} */ (originEl);
 	const c = /** @type {HTMLElement} */ (copyEl);
-	if (c.style.cssText) {
+	if (c.style.length > 0) {
 		const copyStyles = c.style;
 		for (let i = 0, len = copyStyles.length; i < len; i++) {
 			o.style[copyStyles[i]] = copyStyles[copyStyles[i]];
@@ -303,7 +303,7 @@ export function setStyle(elements, styleName, value) {
 	for (let i = 0, len = elements.length, e; i < len; i++) {
 		e = /** @type {HTMLElement} */ (elements[i]);
 		e.style[styleName] = value;
-		if (!e.style.cssText) {
+		if (e.style.length === 0) {
 			e.removeAttribute('style');
 		}
 	}

package/src/helper/dom/index.js

@@ -9,4 +9,8 @@ const dom = {
 	utils
 };
 
+export const domQuery = query;
+export const domCheck = check;
+export const domUtils = utils;
+
 export default dom;

package/src/helper/env.js

@@ -40,13 +40,11 @@ export function getPageStyle(doc) {
 	const sheets = (doc || _d).styleSheets;
 
 	for (let i = 0, len = sheets.length, rules; i < len; i++) {
-		/* eslint-disable @typescript-eslint/no-unused-vars */
 		try {
 			rules = sheets[i].cssRules;
-		} catch (e) {
+		} catch {
 			continue;
 		}
-		/* eslint-disable @typescript-eslint/no-unused-vars */
 
 		if (rules) {
 			for (let c = 0, cLen = rules.length; c < cLen; c++) {
@@ -120,7 +118,6 @@ export const isResizeObserverSupported = (() => {
  * @returns {boolean} Whether support navigator.clipboard or not.
  */
 export const isClipboardSupported = (() => {
-	/* eslint-disable-next-line compat/compat */
 	return typeof navigator.clipboard?.write === 'function';
 })();
 
@@ -177,7 +174,6 @@ export const isSafari = (() => {
  * @type {boolean}
  */
 export const isMobile = (() => {
-	/* eslint-disable-next-line compat/compat */
 	return /Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(userAgent);
 })();
 
@@ -186,7 +182,6 @@ export const isMobile = (() => {
  * @type {boolean}
  */
 export const isTouchDevice = (() => {
-	/* eslint-disable-next-line compat/compat */
 	return navigator.maxTouchPoints > 0 && 'ontouchstart' in _w;
 })();
 

package/src/helper/keyCodeMap.js

@@ -53,7 +53,6 @@ export function isAlt(e) {
  * @returns {boolean}
  */
 export function isComposing(e) {
-	// eslint-disable-next-line @typescript-eslint/ban-ts-comment
 	// @ts-ignore
 	return e.isComposing || e.key === 'Process' || e.keyCode === 229;
 }

package/src/langs/ckb.js

@@ -9,7 +9,7 @@
 						throw new Error('SUNEDITOR_LANG a window with a document');
 					}
 					return factory(w);
-			  };
+				};
 	} else {
 		factory(global);
 	}

package/src/langs/cs.js

@@ -9,7 +9,7 @@
 						throw new Error('SUNEDITOR_LANG a window with a document');
 					}
 					return factory(w);
-			  };
+				};
 	} else {
 		factory(global);
 	}

package/src/langs/da.js

@@ -9,7 +9,7 @@
 						throw new Error('SUNEDITOR_LANG a window with a document');
 					}
 					return factory(w);
-			  };
+				};
 	} else {
 		factory(global);
 	}

package/src/langs/de.js

@@ -9,7 +9,7 @@
 						throw new Error('SUNEDITOR_LANG a window with a document');
 					}
 					return factory(w);
-			  };
+				};
 	} else {
 		factory(global);
 	}

package/src/langs/en.js

@@ -8,7 +8,7 @@
 						throw new Error('SUNEDITOR_LANG a window with a document');
 					}
 					return factory(w);
-			  };
+				};
 	} else {
 		factory(global);
 	}

package/src/langs/es.js

@@ -9,7 +9,7 @@
 						throw new Error('SUNEDITOR_LANG a window with a document');
 					}
 					return factory(w);
-			  };
+				};
 	} else {
 		factory(global);
 	}

package/src/langs/fa.js

@@ -9,7 +9,7 @@
 						throw new Error('SUNEDITOR_LANG a window with a document');
 					}
 					return factory(w);
-			  };
+				};
 	} else {
 		factory(global);
 	}

package/src/langs/fr.js

@@ -9,7 +9,7 @@
 						throw new Error('SUNEDITOR_LANG a window with a document');
 					}
 					return factory(w);
-			  };
+				};
 	} else {
 		factory(global);
 	}

package/src/langs/he.js

@@ -9,7 +9,7 @@
 						throw new Error('SUNEDITOR_LANG a window with a document');
 					}
 					return factory(w);
-			  };
+				};
 	} else {
 		factory(global);
 	}

package/src/langs/hu.js

@@ -9,7 +9,7 @@
 						throw new Error('SUNEDITOR_LANG requires a window with a document');
 					}
 					return factory(w);
-			  };
+				};
 	} else {
 		factory(global);
 	}

package/src/langs/it.js

@@ -9,7 +9,7 @@
 						throw new Error('SUNEDITOR_LANG una finestra con un documento');
 					}
 					return factory(w);
-			  };
+				};
 	} else {
 		factory(global);
 	}

package/src/langs/ja.js

@@ -8,7 +8,7 @@
 						throw new Error('SUNEDITOR_LANG a window with a document');
 					}
 					return factory(w);
-			  };
+				};
 	} else {
 		factory(global);
 	}

package/src/langs/km.js

@@ -8,7 +8,7 @@
 						throw new Error('SUNEDITOR_LANG a window with a document');
 					}
 					return factory(w);
-			  };
+				};
 	} else {
 		factory(global);
 	}

package/src/langs/ko.js

@@ -8,7 +8,7 @@
 						throw new Error('SUNEDITOR_LANG a window with a document');
 					}
 					return factory(w);
-			  };
+				};
 	} else {
 		factory(global);
 	}

package/src/langs/lv.js

@@ -9,7 +9,7 @@
 						throw new Error('SUNEDITOR_LANG a window with a document');
 					}
 					return factory(w);
-			  };
+				};
 	} else {
 		factory(global);
 	}

package/src/langs/nl.js

@@ -9,7 +9,7 @@
 						throw new Error('SUNEDITOR_LANG a window with a document');
 					}
 					return factory(w);
-			  };
+				};
 	} else {
 		factory(global);
 	}

package/src/langs/pl.js

@@ -9,7 +9,7 @@
 						throw new Error('SUNEDITOR_LANG a window with a document');
 					}
 					return factory(w);
-			  };
+				};
 	} else {
 		factory(global);
 	}

package/src/langs/pt_br.js

@@ -9,7 +9,7 @@
 						throw new Error('SUNEDITOR_LANG a window with a document');
 					}
 					return factory(w);
-			  };
+				};
 	} else {
 		factory(global);
 	}