suneditor 3.0.0-rc.2 → 3.0.0-rc.3

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "suneditor",
-	"version": "3.0.0-rc.2",
+	"version": "3.0.0-rc.3",
 	"description": "Vanilla JavaScript based WYSIWYG web editor",
 	"author": "Yi JiHong",
 	"license": "MIT",
@@ -82,7 +82,7 @@
 		"@babel/preset-env": "^7.28.3",
 		"@codemirror/lang-html": "^6.4.10",
 		"@codemirror/lang-javascript": "^6.2.4",
-		"@google-cloud/translate": "^9.2.0",
+		"@google-cloud/translate": "^9.3.0",
 		"@octokit/rest": "^21.1.1",
 		"@playwright/test": "^1.56.0",
 		"@typescript-eslint/eslint-plugin": "^8.45.0",
@@ -97,7 +97,7 @@
 		"codemirror5": "npm:codemirror@5.65.20",
 		"cross-env": "^7.0.3",
 		"css-loader": "^7.1.2",
-		"css-minimizer-webpack-plugin": "^7.0.2",
+		"css-minimizer-webpack-plugin": "^8.0.0",
 		"csstype": "^3.1.3",
 		"dependency-cruiser": "^17.1.0",
 		"eslint": "^9.36.0",
@@ -170,4 +170,4 @@
 		"web editor",
 		"browser editor"
 	]
-}
+}

package/src/core/kernel/coreKernel.js

@@ -111,13 +111,13 @@ class CoreKernel {
 		// L2: Config
 		this.#registerConfig(product, options);
 
-		// $ Phase 1: Config deps (available to Logic constructors via kernel.$)
+		// Deps Phase 1: Config deps added to $ (available to Logic constructors)
 		this.#buildConfigDeps();
 
 		// L3: Logic (dom, shell, ui)
 		this.#registerLogic(product);
 
-		// $ Phase 2: Add Logic deps
+		// Deps Phase 2: Logic deps added to $
 		this.#assignLogicDeps();
 
 		//----------------------------------------------
@@ -145,8 +145,8 @@ class CoreKernel {
 	}
 
 	/**
-	 * @description `$` Phase 1: Build dependency bag with config entries only.
-	 * Logic constructors can access `kernel.$` for configs.
+	 * @description Deps Phase 1: Build Deps bag with config entries only.
+	 * Logic constructors can access the Deps bag via `kernel.$`.
 	 */
 	#buildConfigDeps() {
 		const contextProvider = this.#config.get('contextProvider');
@@ -236,8 +236,8 @@ class CoreKernel {
 	}
 
 	/**
-	 * @description `$` Phase 2: Add logic entries to existing `$` object.
-	 * Called after all logic instances are registered and initialized.
+	 * @description Deps Phase 2: Add logic entries to the Deps bag (`$`).
+	 * Called after all logic instances are registered.
 	 */
 	#assignLogicDeps() {
 		const pluginManager = this.#logic.get('pluginManager');

package/src/core/kernel/kernelInjector.js

@@ -1,8 +1,8 @@
 /**
- * @description Base class for kernel consumers (plugins, modules).
- * - Provides cached access to kernel dependencies via `$` object.
- * - Dependencies are built once in `CoreKernel` and shared across all consumers.
- * - Eliminates circular references by routing through the kernel.
+ * @description Base class for kernel consumers (plugins, event orchestrator).
+ * - Injects `this.$` (Deps bag) — the shared dependency object built by CoreKernel.
+ * - `$` is NOT the kernel itself; it is the dependency context that the kernel provides.
+ * - Eliminates circular references by routing through the Deps bag.
  */
 class KernelInjector {
 	/** @type {SunEditor.Deps} */

package/src/core/logic/dom/inline.js

@@ -34,17 +34,21 @@ class Inline {
 
 	/**
 	 * @description Adds, updates, or deletes style nodes from selected text (a, span, strong, etc.).
-	 * - 1. If `styleNode` is provided, a node with the same tags and attributes is added to the selected text.
+	 * - 1. If `styleNode` is provided, a node with the same tags and attributes is added to the selection.
 	 * - 2. If the same tag already exists, only its attributes are updated.
 	 * - 3. If `styleNode` is `null`, existing nodes are updated or removed without adding new ones.
-	 * - 4. Styles matching those in `stylesToModify` are removed. (Use CSS attribute names, e.g., `background-color`)
+	 * - 4. Styles matching those in `stylesToModify` are removed.
+	 * - (Use CSS attribute names, e.g., `background-color`)
 	 * - 5. Classes matching those in `stylesToModify` (prefixed with `"."`) are removed.
 	 * - 6. `stylesToModify` is used to avoid duplicate property values from `styleNode`.
-	 * - 7. Nodes with all styles and classes removed are deleted if they match `styleNode`, are in `nodesToRemove`, or if `styleNode` is `null`.
+	 * - 7. Nodes with all styles/classes removed are deleted.
+	 * - Applies when they match `styleNode`, are in `nodesToRemove`, or `styleNode` is `null`.
 	 * - 8. Tags matching names in `nodesToRemove` are deleted regardless of their style and class.
-	 * - 9. If `strictRemove` is `true`, nodes in `nodesToRemove` are only removed if all their styles and classes are removed.
+	 * - 9. If `strictRemove` is `true`, nodes in `nodesToRemove` are only removed
+	 * - if all their styles and classes are removed.
 	 * - 10. The function won't modify nodes if the parent has the same class and style values.
-	 * - However, if `nodesToRemove` has values, it will work and separate text nodes even if there's no node to replace.
+	 * - However, if `nodesToRemove` has values, it will work and separate text nodes
+	 * - even if there's no node to replace.
 	 * @param {?Node} styleNode The element to be added to the selection. If `null`, only existing nodes are modified or removed.
 	 * @param {Object} [options] Options
 	 * @param {Array<string>} [options.stylesToModify=null] Array of style or class names to check and modify.

package/src/core/schema/options.js

@@ -118,16 +118,17 @@ export const DEFAULTS = {
  * @property {boolean} [iframe_fullPage=false] - Allows the usage of HTML, HEAD, BODY tags and DOCTYPE declaration on the `iframe`.
  * @property {Object<string, string>} [iframe_attributes={}] - Attributes of the `iframe`. (e.g. {'allow-scripts': 'true'})
  * @property {Array<string>} [iframe_cssFileName=["suneditor"]] - CSS files to apply inside the iframe.
- * - String: Filename pattern to search in document <link> tags (e.g. "suneditor" or "suneditor.[a-z0-9]+" matches "suneditor.abc123.css")
- * - "*": Wildcard to include ALL stylesheets from the page
- * - Array: Multiple patterns (e.g. ["suneditor", "custom", "*"])
- * - Absolute URLs and data URLs (data:text/css,) are also supported
+ * - String: Filename pattern to search in document `<link>` tags.
+ * - (e.g. "suneditor" or "suneditor.[a-z0-9]+" matches "suneditor.abc123.css")
+ * - "*": Wildcard to include ALL stylesheets from the page.
+ * - Array: Multiple patterns (e.g. ["suneditor", "custom", "*"]).
+ * - Absolute URLs and data URLs (data:text/css,) are also supported.
  * ///
  *
  * === Statusbar & Character Counter ===
  * @property {boolean} [statusbar=true] - Enables the status bar.
- * @property {boolean} [statusbar_showPathLabel=true] - Displays the current node structure to status bar.
- * @property {boolean} [statusbar_resizeEnable=true] - Enables resize function of bottom status bar
+ * @property {boolean} [statusbar_showPathLabel=true] - Displays the current node structure in the status bar.
+ * @property {boolean} [statusbar_resizeEnable=true] - Enables resize function of the bottom status bar.
  * @property {boolean} [charCounter=false] - Shows the number of characters in the editor.
  * - If the `maxCharCount` option has a value, it becomes `true`.
  * @property {?number} [charCounter_max=null] - The maximum number of characters allowed to be inserted into the editor.
@@ -198,15 +199,16 @@ export const DEFAULTS = {
  * @property {Object<string, string>} [__tagStyles=CONSTANTS.TAG_STYLES] - The basic tags that serves as the base for `tagStyles`
  * - The default follows {@link DEFAULTS.TAG_STYLES}
  * @property {string} [__defaultElementWhitelist] - A custom string used to construct a list of HTML elements to allow.
- * - The final list of allowed elements (regex pattern) is dynamically generated according to the following rules:
+ * - The final list (regex pattern) is dynamically generated according to the following rules:
  * - A list of required elements, {@link DEFAULTS.REQUIRED_ELEMENT_WHITELIST}, is always included.
- * - If a string value is provided for this option (`__defaultElementWhitelist`):** That string value is used.
- * - If this option is not provided or is not a string: The default constant {@link DEFAULTS.ELEMENT_WHITELIST} is used.
+ * - If this option (`__defaultElementWhitelist`) is provided as a string: That value is used.
+ * - If not provided or not a string: The default {@link DEFAULTS.ELEMENT_WHITELIST} is used.
  * - 1. If no options are given, the final pattern is:
  * - 'a|img|p|div|...' (REQUIRED + DEFAULT)
  * - 2. If options are given directly, the final pattern is:
  * - 'a|img|custom|tags' (REQUIRED + options.__defaultElementWhitelist)
- * @property {string} [__defaultAttributeWhitelist=CONSTANTS.ATTRIBUTE_WHITELIST] - A complete list of attributes that are allowed by default on all tags. Delimiter: "|" (e.g. "href|target").
+ * @property {string} [__defaultAttributeWhitelist=CONSTANTS.ATTRIBUTE_WHITELIST] - A complete list of attributes that are allowed by default on all tags.
+ * - Delimiter: "|" (e.g. "href|target").
  * - The default follows {@link DEFAULTS.ATTRIBUTE_WHITELIST}
  * ///
  *
@@ -225,10 +227,9 @@ export const DEFAULTS = {
  *
  * === Filters & Behavior ===
  * @property {boolean} [__lineFormatFilter=true] - Line format filter configuration.
- * @property {Array<string>} [__listCommonStyle=["fontSize", "color", "fontFamily", "fontWeight", "fontStyle"]] - Defines the list of styles that are applied directly to the `<li>` element
- * - when a text style is applied to the entire list item.
+ * @property {Array<string>} [__listCommonStyle=["fontSize", "color", "fontFamily", "fontWeight", "fontStyle"]] - Defines the styles applied directly to `<li>` when a text style is set on the entire list item.
  * - For example, when changing the font size or color of a list item (`<li>`),
- * - these styles will be applied to the `<li>` tag instead of wrapping the content inside additional tags.
+ * - these styles apply to the `<li>` tag instead of wrapping content in additional tags.
  * @property {{pluginName: string, we: boolean}|boolean} [__pluginRetainFilter=true] - Plugin retain filter configuration. (Internal use primarily)
  * - You can turn it off/on globally with `true`/`false` or set it per plugin. (e.g. { table: false })
  */
@@ -255,7 +256,8 @@ export const DEFAULTS = {
  * @property {Object<string, string>} [lang] - Language configuration. default : EN
  * @property {Object<string, string>} [icons] - Overrides the default icons.
  * @property {"ltr"|"rtl"} [textDirection="ltr"] - Text direction: `ltr` or `rtl`.
- * @property {Array<string>} [reverseButtons=['indent-outdent']] - An array of command pairs whose shortcut icons should be opposite each other, depending on the `textDirection` mode.
+ * @property {Array<string>} [reverseButtons=['indent-outdent']] - An array of command pairs whose shortcut icons should be opposite each other.
+ * - Depends on the `textDirection` mode.
  * ///
  *
  * === Strict & Advanced Filtering ===
@@ -269,6 +271,13 @@ export const DEFAULTS = {
  * 	}} [strictMode=true]  - Enables strict filtering of tags, attributes, and styles.
  * - Use `true` to enable all filters (default), or an object to control individual filters.
  * - Setting `false` is not supported; use the object form to disable specific filters instead.
+ * - :filter description
+ * - `tagFilter`: Filters disallowed HTML tags (`elementWhitelist`/`elementBlacklist`)
+ * - `formatFilter`: Filters format elements (`formatLine`/`formatBlock`)
+ * - `classFilter`: Filters disallowed CSS class names (`allowedClassName`)
+ * - `textStyleTagFilter`: Filters text style tags (b, i, u, span, etc.)
+ * - `attrFilter`: Filters disallowed HTML attributes (`attributeWhitelist`/`attributeBlacklist`)
+ * - `styleFilter`: Filters disallowed inline styles (`spanStyles`/`lineStyles`/`allUsedStyles`)
  * @property {Array<string>} [scopeSelectionTags=CONSTANTS.SCOPE_SELECTION_TAGS] - Tags treated as whole units when selecting all content.
  * - The default follows {@link DEFAULTS.SCOPE_SELECTION_TAGS}
  * ///
@@ -276,21 +285,25 @@ export const DEFAULTS = {
  * === Content Filtering & Formatting ===
  * ==
  * #### 1) Tag & Element Control
- * @property {string} [elementWhitelist=""] - Specifies HTML elements to additionally allow beyond the 'default' allow list. Delimiter: "|" (e.g. "p|div", "*").
- * - The value entered here will be added to the end of the default list determined by the {@link PrivateBaseOptions.__defaultElementWhitelist} logic above.
- * @property {string} [elementBlacklist=""] - Filters by specifying HTML elements that should not be used. Delimiter: "|" (e.g. "script|style").
+ * @property {string} [elementWhitelist=""] - Specifies HTML elements to additionally allow beyond the default allow list.
+ * - Delimiter: "|" (e.g. "p|div", "*").
+ * - Added to the default list determined by {@link PrivateBaseOptions.__defaultElementWhitelist}.
+ * @property {string} [elementBlacklist=""] - Specifies HTML elements that should not be used.
+ * - Delimiter: "|" (e.g. "script|style").
  * - Tags specified here will eventually be removed, even if they are included in other whitelists.
  * @property {string} [allowedEmptyTags=CONSTANTS.ALLOWED_EMPTY_NODE_LIST] - A list of tags that are allowed to be kept even if their values are empty.
  * - The default follows {@link DEFAULTS.ALLOWED_EMPTY_NODE_LIST}
- * - It is concatenated with the value of `ALLOWED_EMPTY_NODE_LIST` to form the final `allowedEmptyTags` list.
+ * - Concatenated with `ALLOWED_EMPTY_NODE_LIST` to form the final `allowedEmptyTags` list.
  * @property {string} [allowedClassName=""] - Allowed class names.
  * - Added the default value {@link DEFAULTS.CLASS_NAME}
  * ///
  *
  * #### 2) Attribute Control
- * @property {{[key: string]: string|undefined}} [attributeWhitelist=null] - Specifies additional attributes to allow for each tag. (e.g. {a: "href|target", img: "src|alt", "*": "id"}).
- * - Rules for objects specified here will be merged into the {@link PrivateBaseOptions.__defaultAttributeWhitelist}.
- * @property {{[key: string]: string|undefined}} [attributeBlacklist=null] - Filter by specifying attributes to disallow by tag. (e.g. {a: "href|target", img: "src|alt", "*": "name"}).
+ * @property {{[key: string]: string|undefined}} [attributeWhitelist=null] - Specifies additional attributes to allow for each tag.
+ * - (e.g. {a: "href|target", img: "src|alt", "*": "id"})
+ * - Rules specified here will be merged into {@link PrivateBaseOptions.__defaultAttributeWhitelist}.
+ * @property {{[key: string]: string|undefined}} [attributeBlacklist=null] - Specifies attributes to disallow by tag.
+ * - (e.g. {a: "href|target", img: "src|alt", "*": "name"})
  * - Attributes specified here will eventually be removed even if they are allowed by other settings.
  * - A list of required elements, {@link DEFAULTS.REQUIRED_FORMAT_LINE}, is always included.
  * ///
@@ -299,7 +312,8 @@ export const DEFAULTS = {
  * @property {string} [textStyleTags=__textStyleTags] - Additional text style tags.
  * - The default follows {@link PrivateBaseOptions.__textStyleTags}
  * @property {Object<string, string>} [convertTextTags={bold: "strong", underline: "u", italic: "em", strike: "del", subscript: "sub", superscript: "sup"}] - Maps text styles to specific HTML tags.
- * @property {string} [allUsedStyles] - Specifies additional styles to the list of allowed styles. Delimiter: "|" (e.g. "color|background-color").
+ * @property {string} [allUsedStyles] - Specifies additional styles to the list of allowed styles.
+ * - Delimiter: "|" (e.g. "color|background-color").
  * @property {Object<string, string>} [tagStyles={}] - Specifies allowed styles for HTML tags.
  * @property {string} [spanStyles=CONSTANTS.SPAN_STYLES] - Specifies allowed styles for the `span` tag.
  * - The default follows {@link DEFAULTS.SPAN_STYLES}
@@ -307,16 +321,18 @@ export const DEFAULTS = {
  * - The default follows {@link DEFAULTS.LINE_STYLES}
  * @property {Array<string>} [fontSizeUnits=CONSTANTS.SIZE_UNITS] - Allowed font size units.
  * - The default follows {@link DEFAULTS.SIZE_UNITS}
- * @property {"repeat"|"always"|"none"} [retainStyleMode="repeat"] - This option determines how inline elements (such as <span>, <strong>, etc.) are handled when deleting text.
- * - `repeat`: Inline styles are retained unless the backspace key is repeatedly pressed. If the user continuously presses backspace, the styles will eventually be removed.
- * - `none`: Inline styles are not retained at all. When deleting text, the associated inline elements are immediately removed along with it.
- * - `always`: Inline styles persist indefinitely unless explicitly removed. Even if all text inside an inline element is deleted, the element itself remains until manually removed.
+ * @property {"repeat"|"always"|"none"} [retainStyleMode="repeat"] - Determines how inline elements (e.g. `<span>`, `<strong>`) are handled when deleting text.
+ * - `repeat`: Styles are retained unless backspace is repeatedly pressed.
+ * - Continuous pressing will eventually remove the styles.
+ * - `none`: Styles are not retained. Inline elements are immediately removed with the text.
+ * - `always`: Styles persist indefinitely unless explicitly removed.
+ * - Even if all text inside an inline element is deleted, the element itself remains.
  * ///
  *
  * #### 4) Line & Block Formatting
  * @property {string} [defaultLine="p"] - Default `line` element when inserting new lines.
  * @property {"line"|"br"} [defaultLineBreakFormat="line"] - Specifies the default line break format.
- * - [Recommended] `line` :  is a line break that is divided into general tags.
+ * - [Recommended] `line` : Line break is divided into general tags.
  * - [Not recommended] `br` : Line breaks are treated as <br> on the same line. (like shift+enter)
  * - Line breaks are handled as <br> within `line`.
  * - You can create a new `line` by entering a line break twice in a row.
@@ -325,26 +341,26 @@ export const DEFAULTS = {
  * - When set to `br`, performance may decrease when editing a lot of data.
  * @property {string} [lineAttrReset=""] - Line properties that should be reset when changing lines (e.g. "id|name").
  * @property {string} [formatLine=__defaultFormatLine] - Additionally allowed `line` elements beyond the default. Delimiter: "|" (e.g. "p|div").
- * It is concatenated with the value of {@link PrivateBaseOptions.__defaultFormatLine} to form the final `line` element list.
- * - `line` element also contain `brLine` element
+ * - Concatenated with {@link PrivateBaseOptions.__defaultFormatLine} to form the final `line` list.
+ * - `line` element also contains `brLine` element.
  * @property {string} [formatBrLine=__defaultFormatBrLine] - Additionally allowed `brLine` elements beyond the default. (e.g. "PRE").
- * - It is concatenated with the value of {@link PrivateBaseOptions.__defaultFormatBrLine} to form the final `brLine` element list.
- * - `brLine` elements is included in the `line` element.
- * - `brLine` elements's line break is `BR` tag.
- * ※ Entering the Enter key in the space on the last line ends `brLine` and appends `line`.
+ * - Concatenated with {@link PrivateBaseOptions.__defaultFormatBrLine} to form the final `brLine` list.
+ * - `brLine` elements are included in the `line` element.
+ * - `brLine` elements' line break is `BR` tag.
+ * - ※ Entering the Enter key on the last line ends `brLine` and appends `line`.
  * @property {string} [formatClosureBrLine=__defaultFormatClosureBrLine] - Additionally allowed `closureBrLine` elements beyond the default.
- * - It is concatenated with the value of {@link PrivateBaseOptions.__defaultFormatClosureBrLine} to form the final `closureBrLine` element list.
- * - `closureBrLine` elements is included in the `brLine`.
- * - `closureBrLine` elements's line break is `BR` tag.
+ * - Concatenated with {@link PrivateBaseOptions.__defaultFormatClosureBrLine} for the final `closureBrLine` list.
+ * - `closureBrLine` elements are included in the `brLine`.
+ * - `closureBrLine` elements' line break is `BR` tag.
  * - ※ You cannot exit this format with the Enter key or Backspace key.
  * - ※ Use it only in special cases. ([ex] format of table cells)
  * @property {string} [formatBlock=__defaultFormatBlock] - Additionally allowed `block` elements beyond the default.
- * - It is concatenated with the value of {@link PrivateBaseOptions.__defaultFormatBlock} to form the final `block` element list.
- * - `block` is wrap the `line` and `component`
+ * - Concatenated with {@link PrivateBaseOptions.__defaultFormatBlock} to form the final `block` list.
+ * - `block` wraps the `line` and `component`.
  * @property {string} [formatClosureBlock=__defaultFormatClosureBlock] - Additionally allowed `closureBlock` elements beyond the default.
- * - It is concatenated with the value of {@link PrivateBaseOptions.__defaultFormatClosureBlock} to form the final `closureBlock` element list.
- * - `closureBlock` elements is included in the `block`.
- * - `closureBlock` element is wrap the `line` and `component`
+ * - Concatenated with {@link PrivateBaseOptions.__defaultFormatClosureBlock} for the final `closureBlock` list.
+ * - `closureBlock` elements are included in the `block`.
+ * - `closureBlock` element wraps the `line` and `component`.
  * - ※ You cannot exit this format with the Enter key or Backspace key.
  * - ※ Use it only in special cases. (e.g. format of table cells)
  * ///
@@ -370,7 +386,7 @@ export const DEFAULTS = {
  * === Advanced Features ===
  * @property {boolean} [copyFormatKeepOn=false] - Keeps the format of the copied content.
  * @property {boolean} [autoLinkify] - Automatically converts URLs into hyperlinks. (`Link` plugin required)
- * - Default value is determined dynamically based on whether the `link` plugin is enabled. (default : `Boolean(plugins.link)`)
+ * - Default: `Boolean(plugins.link)` — determined by whether the `link` plugin is enabled.
  * @property {Array<string>} [autoStyleify=["bold", "underline", "italic", "strike"]] - Styles applied automatically on text input.
  * @property {number} [historyStackDelayTime=400] - Delay time for history stack updates (ms).
  * @property {string} [printClass=""] - Class name for printing.
@@ -378,7 +394,7 @@ export const DEFAULTS = {
  * @property {?string} [previewTemplate=null] - Custom template for preview mode.
  * @property {?string} [printTemplate=null] - Custom template for print mode.
  * @property {SunEditor.ComponentInsertType} [componentInsertBehavior="auto"] - Enables automatic selection of inserted components.
- * - For inline components: places the cursor near the inserted component or selects it if no nearby range is available.
+ * - For inline components: places cursor near the component, or selects if no nearby range.
  * - 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.
@@ -389,7 +405,8 @@ export const DEFAULTS = {
  * @property {boolean} [freeCodeViewMode=false] - Enables free code view mode.
  *
  * === Dynamic Options ===
- * @property {Object<string, *>} [externalLibs] - External libraries like CodeMirror or MathJax. See {@link https://github.com/ARA-developer/suneditor/blob/develop/guide/external-libraries.md External Libraries Guide}
+ * @property {Object<string, *>} [externalLibs] - External libraries like CodeMirror or MathJax.
+ * - See {@link https://github.com/ARA-developer/suneditor/blob/develop/guide/external-libraries.md External Libraries Guide}
  * @property {Object<string, boolean>} [allowedExtraTags=CONSTANTS.EXTRA_TAG_MAP] - Specifies extra allowed or disallowed tags.
  * - The default follows {@link DEFAULTS.EXTRA_TAG_MAP}
  * ///
@@ -458,14 +475,17 @@ export const DEFAULTS = {
  * @property {Set} [buttons] - List of currently used toolbar buttons
  * @property {Set} [buttons_sub] - List of currently used sub-toolbar buttons
  * @property {string} [toolbar_sub_width] - Sub-toolbar width.
- * @property {string[]} [reverseCommands] - Merged reverse command pairs array (includes default `indent-outdent` + user's `reverseButtons`).
+ * @property {string[]} [reverseCommands] - Merged reverse command pairs array.
+ * - Includes default `indent-outdent` + user's `reverseButtons`.
  *
  * @property {*} [codeMirror] - CodeMirror configuration object from `externalLibs.codeMirror`.
- * @property {boolean} [codeMirror6Editor] - Whether CodeMirror 6 is available (base-level flag). Frame-level stores the actual EditorView instance.
+ * @property {boolean} [codeMirror6Editor] - Whether CodeMirror 6 is available (base-level flag).
+ * - Frame-level stores the actual EditorView instance.
  * @property {boolean} [codeMirror5Editor] - Whether CodeMirror 5 is available (base-level flag). Frame-level stores the actual CM5 instance.
  * @property {boolean} [hasCodeMirror] - Uses CodeMirror for code view.
  *
- * @property {Set<string>} [allUsedStyles] - Processed set of all allowed CSS styles. Converted from user's `string` input ("|" delimited) to `Set<string>` in constructor.
+ * @property {Set<string>} [allUsedStyles] - Processed set of all allowed CSS styles.
+ * - Converted from user's `string` input ("|" delimited) to `Set<string>` in constructor.
  */
 
 // ================================================================================================================================
@@ -601,12 +621,12 @@ export const OPTION_FIXED_FLAG = {
 
 /**
  * @typedef {Object} StrictModeOptions
- * @property {boolean} tagFilter
- * @property {boolean} formatFilter
- * @property {boolean} classFilter
- * @property {boolean} textStyleTagFilter
- * @property {boolean} attrFilter
- * @property {boolean} styleFilter
+ * @property {boolean} tagFilter - Filters disallowed HTML tags (`elementWhitelist`/`elementBlacklist`)
+ * @property {boolean} formatFilter - Filters format elements (`formatLine`/`formatBlock`)
+ * @property {boolean} classFilter - Filters disallowed CSS class names (`allowedClassName`)
+ * @property {boolean} textStyleTagFilter - Filters text style tags (b, i, u, span, etc.)
+ * @property {boolean} attrFilter - Filters disallowed HTML attributes (`attributeWhitelist`/`attributeBlacklist`)
+ * @property {boolean} styleFilter - Filters disallowed inline styles (`spanStyles`/`lineStyles`/`allUsedStyles`)
  */
 
 /**

package/src/helper/dom/domCheck.js

@@ -26,7 +26,8 @@ export function isZeroWidth(text) {
  * @description Determine if this offset is the edge offset of container
  * @param {Node} container The node of the selection object. (range.startContainer..)
  * @param {number} offset The offset of the selection object. (core.getRange().startOffset...)
- * @param {?("front"|"end")} [dir] Select check point - Both edge, Front edge or End edge. (`"front"`: Front edge, `"end"`: End edge, `undefined`: Both edge)
+ * @param {?("front"|"end")} [dir] Select check point.
+ * - `"front"`: Front edge, `"end"`: End edge, `undefined`: Both edge.
  * @returns {boolean}
  */
 export function isEdgePoint(container, offset, dir) {

package/src/interfaces/contracts.js

@@ -29,14 +29,14 @@ export class ModuleModal {
 	/**
 	 * @optional
 	 * Executes the method that is called when a plugin's modal is opened.
-	 * @param {boolean} isUpdate - Indicates whether the modal is for editing an existing component (`true`) or registering a new one (`false`).
+	 * @param {boolean} isUpdate - Whether the modal is for editing (`true`) or creating a new one (`false`).
 	 * @returns {void}
 	 */
 	modalOn(isUpdate) {}
 
 	/**
 	 * @optional
-	 * This function is called before the modal window is opened, but before it is closed.
+	 * This function is called before the modal window opens or closes.
 	 * @returns {void}
 	 */
 	modalInit() {}
@@ -44,7 +44,7 @@ export class ModuleModal {
 	/**
 	 * @optional
 	 * Modal off callback.
-	 * @param {boolean} isUpdate - Indicates whether the modal is for editing an existing component (`true`) or registering a new one (`false`).
+	 * @param {boolean} isUpdate - Whether the modal is for editing (`true`) or creating a new one (`false`).
 	 * @returns {void}
 	 */
 	modalOff(isUpdate) {}
@@ -104,7 +104,7 @@ export class ModuleController {
 export class ModuleBrowser {
 	/**
 	 * @optional
-	 * Executes the method that is called when a `Browser` module's is opened.
+	 * Executes the method that is called when a `Browser` module is opened.
 	 * @returns {void}
 	 */
 	browserInit() {}
@@ -123,7 +123,8 @@ export class ModuleColorPicker {
 	/**
 	 * @optional
 	 * Executes the method called when a button of `ColorPicker` module is clicked.
-	 * - This plugin is by applying the `ColorPicker` module globally to the `dropdown` menu, the default `action` method is not called.
+	 * - When applying the `ColorPicker` module globally to the `dropdown` menu,
+	 * - the default `action` method is not called.
 	 * @param {SunEditor.Module.HueSlider.Color} color - Selected color information
 	 * @returns {void}
 	 */

package/src/interfaces/plugins.js

@@ -22,16 +22,17 @@ class Base extends KernelInjector {
 	 * Plugin-specific options
 	 * @type {{eventIndex?: number, isInputComponent?: boolean}}
 	 * @property {number} [eventIndex=0] - Plugin event handler execution priority (higher = later)
-	 * @property {boolean} [isInputComponent=false] - Allow keyboard input inside component (e.g., table cells), prevents auto-selection on arrow keys
+	 * @property {boolean} [isInputComponent=false] - Allow keyboard input inside component (e.g., table cells).
+	 * - Prevents auto-selection on arrow keys.
 	 */
 	static options = {};
 
 	/**
 	 * @constructor
-	 * @param {SunEditor.Kernel} editor - The core kernel
+	 * @param {SunEditor.Kernel} kernel - The Kernel instance
 	 */
-	constructor(editor) {
-		super(editor);
+	constructor(kernel) {
+		super(kernel);
 
 		// plugin basic properties
 		/** @type {string} */
@@ -61,7 +62,7 @@ export class PluginBrowser extends Base {
 
 	/**
 	 * @abstract
-	 * @description Executes the method that is called when a `Browser` module's is opened.
+	 * @description Executes the method that is called when a `Browser` module is opened.
 	 * @param {?(target: Node) => *} [onSelectfunction] - Method to be executed after selecting an item in the gallery
 	 * @returns {void}
 	 */
@@ -71,7 +72,7 @@ export class PluginBrowser extends Base {
 
 	/**
 	 * @abstract
-	 * @description Executes the method that is called when a `Browser` module's is closed.
+	 * @description Executes the method that is called when a `Browser` module is closed.
 	 * @returns {void}
 	 */
 	close() {

package/src/modules/contract/Browser.js

@@ -31,7 +31,8 @@ import ApiManager from '../manager/ApiManager';
  * @property {string} [listClass] - Class name of list div. Required. Can be overridden in browser.
  * @property {(item: BrowserFile) => string} [drawItemHandler] - Function that defines the HTML of a file item. Required. Can be overridden in browser.
  * @property {Array<*>} [props] - `props` argument to `drawItemHandler` function. Optional. Can be overridden in browser.
- * @property {number} [columnSize] - Number of `div.se-file-item-column` to be created. Optional. Can be overridden in browser. Default: 4.
+ * @property {number} [columnSize] - Number of `div.se-file-item-column` to be created.
+ * - Optional. Can be overridden in browser. Default: 4.
  * @property {((item: BrowserFile) => string)} [thumbnail] - Default thumbnail
  */
 
@@ -577,7 +578,7 @@ class Browser {
 }
 
 /**
- * @param {SunEditor.Deps} $ - editor instance
+ * @param {SunEditor.Deps} $ - Kernel dependencies
  * @param {boolean} useSearch - Whether to use the search function
  * @returns {{ html: HTMLElement, header: HTMLElement, titleArea: HTMLElement, tagArea: HTMLElement, body: HTMLElement, list: HTMLElement, side: HTMLElement, wrapper: HTMLElement, _loading: HTMLElement }} HTML
  */
@@ -637,7 +638,8 @@ function CreateHTMLInfos($, useSearch) {
 /**
  * @this {{ thumbnail: ((...args: *) => *), props: Array<*> }}
  * @description Define the HTML of the item to be put in `div.se-file-item-column`.
- * - Format: `[ { src: "image src", name: "name(@option)", alt: "image alt(@option)", tag: "tag name(@option)" } ]`
+ * - Format:
+ * - `[ { src: "image src", name: "name(@option)", alt: "image alt(@option)", tag: "tag name(@option)" } ]`
  * @param {BrowserFile} item Item of the response data's array
  */
 function DrawItems(item) {

package/src/modules/ui/ModalAnchorEditor.js

@@ -549,7 +549,7 @@ class ModalAnchorEditor {
 }
 
 /**
- * @param {SunEditor.Deps} $ - Editor instance
+ * @param {SunEditor.Deps} $ - Kernel dependencies
  * @param {ModalAnchorEditorParams} params - ModalAnchorEditor options
  * @param {Array<string>} relList - REL attribute list
  * @returns {HTMLElement} - Modal form element

package/src/plugins/browser/audioGallery.js

@@ -19,7 +19,7 @@ class AudioGallery extends PluginBrowser {
 
 	/**
 	 * @constructor
-	 * @param {SunEditor.Kernel} kernel - The core kernel
+	 * @param {SunEditor.Kernel} kernel - The Kernel instance
 	 * @param {AudioGalleryPluginOptions} pluginOptions
 	 */
 	constructor(kernel, pluginOptions) {

package/src/plugins/browser/fileBrowser.js

@@ -20,12 +20,12 @@ class FileBrowser extends PluginBrowser {
 
 	/**
 	 * @constructor
-	 * @param {SunEditor.Kernel} editor - The core kernel
+	 * @param {SunEditor.Kernel} kernel - The Kernel instance
 	 * @param {FileBrowserPluginOptions} pluginOptions
 	 */
-	constructor(editor, pluginOptions) {
+	constructor(kernel, pluginOptions) {
 		// plugin bisic properties
-		super(editor);
+		super(kernel);
 		this.title = this.$.lang.fileBrowser;
 		this.icon = 'file_browser';
 

package/src/plugins/browser/fileGallery.js

@@ -19,12 +19,12 @@ class FileGallery extends PluginBrowser {
 
 	/**
 	 * @constructor
-	 * @param {SunEditor.Kernel} editor - The core kernel
+	 * @param {SunEditor.Kernel} kernel - The Kernel instance
 	 * @param {FileGalleryPluginOptions} pluginOptions
 	 */
-	constructor(editor, pluginOptions) {
+	constructor(kernel, pluginOptions) {
 		// plugin bisic properties
-		super(editor);
+		super(kernel);
 		this.title = this.$.lang.fileGallery;
 		this.icon = 'file_gallery';
 

package/src/plugins/browser/imageGallery.js

@@ -18,12 +18,12 @@ class ImageGallery extends PluginBrowser {
 
 	/**
 	 * @constructor
-	 * @param {SunEditor.Kernel} editor - The core kernel
+	 * @param {SunEditor.Kernel} kernel - The Kernel instance
 	 * @param {ImageGalleryPluginOptions} pluginOptions
 	 */
-	constructor(editor, pluginOptions) {
+	constructor(kernel, pluginOptions) {
 		// plugin bisic properties
-		super(editor);
+		super(kernel);
 		this.title = this.$.lang.imageGallery;
 		this.icon = 'image_gallery';
 

package/src/plugins/browser/videoGallery.js

@@ -19,12 +19,12 @@ class VideoGallery extends PluginBrowser {
 
 	/**
 	 * @constructor
-	 * @param {SunEditor.Kernel} editor - The core kernel
+	 * @param {SunEditor.Kernel} kernel - The Kernel instance
 	 * @param {VideoGalleryPluginOptions} pluginOptions
 	 */
-	constructor(editor, pluginOptions) {
+	constructor(kernel, pluginOptions) {
 		// plugin bisic properties
-		super(editor);
+		super(kernel);
 		this.title = this.$.lang.videoGallery;
 		this.icon = 'video_gallery';
 

package/src/plugins/command/blockquote.js

@@ -11,10 +11,10 @@ class Blockquote extends PluginCommand {
 
 	/**
 	 * @constructor
-	 * @param {SunEditor.Kernel} editor - The core kernel
+	 * @param {SunEditor.Kernel} kernel - The Kernel instance
 	 */
-	constructor(editor) {
-		super(editor);
+	constructor(kernel) {
+		super(kernel);
 		// plugin basic properties
 		this.title = this.$.lang.tag_blockquote;
 		this.icon = 'blockquote';

package/src/plugins/command/exportPDF.js

@@ -20,11 +20,11 @@ class ExportPDF extends PluginCommand {
 
 	/**
 	 * @constructor
-	 * @param {SunEditor.Kernel} editor - The core kernel
+	 * @param {SunEditor.Kernel} kernel - The Kernel instance
 	 * @param {ExportPDFPluginOptions} pluginOptions - plugin options
 	 */
-	constructor(editor, pluginOptions) {
-		super(editor);
+	constructor(kernel, pluginOptions) {
+		super(kernel);
 		// plugin basic properties
 		this.title = this.$.lang.exportPDF;
 		this.icon = 'PDF';