jodit 4.12.2 → 4.12.3

package/es5/plugins/debug/debug.css

@@ -1,7 +1,7 @@
 /*!
  * jodit - Jodit is an awesome and useful wysiwyg editor with filebrowser
  * Author: Chupurnov <chupurnov@gmail.com> (https://xdsoft.net/jodit/)
- * Version: v4.12.2
+ * Version: v4.12.3
  * Url: https://xdsoft.net/jodit/
  * License(s): MIT
  */

package/es5/plugins/debug/debug.js

@@ -1,7 +1,7 @@
 /*!
  * jodit - Jodit is an awesome and useful wysiwyg editor with filebrowser
  * Author: Chupurnov <chupurnov@gmail.com> (https://xdsoft.net/jodit/)
- * Version: v4.12.2
+ * Version: v4.12.3
  * Url: https://xdsoft.net/jodit/
  * License(s): MIT
  */

package/es5/plugins/debug/debug.min.js

@@ -1,7 +1,7 @@
 /*!
  * jodit - Jodit is an awesome and useful wysiwyg editor with filebrowser
  * Author: Chupurnov <chupurnov@gmail.com> (https://xdsoft.net/jodit/)
- * Version: v4.12.2
+ * Version: v4.12.3
  * Url: https://xdsoft.net/jodit/
  * License(s): MIT
  */

package/es5/plugins/speech-recognize/speech-recognize.css

@@ -1,7 +1,7 @@
 /*!
  * jodit - Jodit is an awesome and useful wysiwyg editor with filebrowser
  * Author: Chupurnov <chupurnov@gmail.com> (https://xdsoft.net/jodit/)
- * Version: v4.12.2
+ * Version: v4.12.3
  * Url: https://xdsoft.net/jodit/
  * License(s): MIT
  */

package/es5/plugins/speech-recognize/speech-recognize.js

@@ -1,7 +1,7 @@
 /*!
  * jodit - Jodit is an awesome and useful wysiwyg editor with filebrowser
  * Author: Chupurnov <chupurnov@gmail.com> (https://xdsoft.net/jodit/)
- * Version: v4.12.2
+ * Version: v4.12.3
  * Url: https://xdsoft.net/jodit/
  * License(s): MIT
  */

package/es5/plugins/speech-recognize/speech-recognize.min.js

@@ -1,7 +1,7 @@
 /*!
  * jodit - Jodit is an awesome and useful wysiwyg editor with filebrowser
  * Author: Chupurnov <chupurnov@gmail.com> (https://xdsoft.net/jodit/)
- * Version: v4.12.2
+ * Version: v4.12.3
  * Url: https://xdsoft.net/jodit/
  * License(s): MIT
  */

package/es5/polyfills.fat.min.js

@@ -1,7 +1,7 @@
 /*!
  * jodit - Jodit is an awesome and useful wysiwyg editor with filebrowser
  * Author: Chupurnov <chupurnov@gmail.com> (https://xdsoft.net/jodit/)
- * Version: v4.12.2
+ * Version: v4.12.3
  * Url: https://xdsoft.net/jodit/
  * License(s): MIT
  */

package/es5/polyfills.js

@@ -1,7 +1,7 @@
 /*!
  * jodit - Jodit is an awesome and useful wysiwyg editor with filebrowser
  * Author: Chupurnov <chupurnov@gmail.com> (https://xdsoft.net/jodit/)
- * Version: v4.12.2
+ * Version: v4.12.3
  * Url: https://xdsoft.net/jodit/
  * License(s): MIT
  */

package/es5/polyfills.min.js

@@ -1,7 +1,7 @@
 /*!
  * jodit - Jodit is an awesome and useful wysiwyg editor with filebrowser
  * Author: Chupurnov <chupurnov@gmail.com> (https://xdsoft.net/jodit/)
- * Version: v4.12.2
+ * Version: v4.12.3
  * Url: https://xdsoft.net/jodit/
  * License(s): MIT
  */

package/esm/config.d.ts

@@ -619,18 +619,62 @@ declare class Config implements IViewOptions {
      */
     disablePlugins: string[] | string;
     /**
-     * Init and download extra plugins
+     * Init and download extra plugins that are **not** already bundled/registered.
+     *
+     * For every name in this list that is not found in the plugin registry, Jodit
+     * loads it **at runtime over the network** from:
+     *
+     * ```text
+     * <basePath>plugins/<name>/<name>(.min).js
+     * ```
+     *
+     * (see {@link Config.basePath} and {@link Config.minified}). If the plugin is
+     * already registered — e.g. you imported it statically, or you use a bundle
+     * that ships it (such as the `jodit-pro` / `jodit-pro-react` "all plugins"
+     * build) — it is **skipped** and no request is made; in that case you don't
+     * need `extraPlugins` at all, just add the plugin's button.
      *
      * ```typescript
-     * var editor = Jodit.make('.editor', {
+     * // Dynamic loading: fetches <basePath>plugins/emoji/emoji.js
+     * const editor = Jodit.make('.editor', {
      *    extraPlugins: ['emoji']
      * });
      * ```
-     * It will try load %SCRIPT_PATH%/plugins/emoji/emoji.js and after load will try init it
+     *
+     * You can also pass an explicit URL to bypass the `basePath` convention:
+     *
+     * ```typescript
+     * const editor = Jodit.make('.editor', {
+     *    extraPlugins: [{ name: 'emoji', url: 'https://cdn.example.com/emoji.js' }]
+     * });
+     * ```
+     *
+     * Note: if you see a request to a malformed URL (e.g. `.../src/main.tsx?t=...plugins/emoji/emoji.js`),
+     * it means `basePath` was auto-detected incorrectly under your bundler — set
+     * {@link Config.basePath} explicitly. See the Plugin System docs for details.
      */
     extraPlugins: Array<string | IExtraPlugin>;
     /**
-     * Base path for download extra plugins
+     * Base path used to build the URL for dynamically loaded {@link Config.extraPlugins}
+     * (and their styles): `<basePath>plugins/<name>/<name>(.min).js`.
+     *
+     * When not set, Jodit auto-detects it from `document.currentScript`, then the
+     * last `<script src>` on the page, then `location.href`. That detection works
+     * for classic `<script>` includes, but **fails under ESM bundlers / dev
+     * servers** (Vite, Webpack dev, etc.) where there is no script tag for the
+     * bundle — it falls back to the entry module URL (e.g. `main.tsx`) and produces
+     * a broken plugin URL.
+     *
+     * Fix: host the plugin files at a public location and point `basePath` there
+     * (note the trailing slash):
+     *
+     * ```typescript
+     * const editor = Jodit.make('.editor', {
+     *    basePath: 'https://your-site.com/jodit-assets/',
+     *    extraPlugins: ['emoji']
+     *    // → loads https://your-site.com/jodit-assets/plugins/emoji/emoji.js
+     * });
+     * ```
      */
     basePath?: string;
     /**

package/esm/config.js

@@ -729,14 +729,39 @@ class Config {
          */
         this.disablePlugins = [];
         /**
-         * Init and download extra plugins
+         * Init and download extra plugins that are **not** already bundled/registered.
+         *
+         * For every name in this list that is not found in the plugin registry, Jodit
+         * loads it **at runtime over the network** from:
+         *
+         * ```text
+         * <basePath>plugins/<name>/<name>(.min).js
+         * ```
+         *
+         * (see {@link Config.basePath} and {@link Config.minified}). If the plugin is
+         * already registered — e.g. you imported it statically, or you use a bundle
+         * that ships it (such as the `jodit-pro` / `jodit-pro-react` "all plugins"
+         * build) — it is **skipped** and no request is made; in that case you don't
+         * need `extraPlugins` at all, just add the plugin's button.
          *
          * ```typescript
-         * var editor = Jodit.make('.editor', {
+         * // Dynamic loading: fetches <basePath>plugins/emoji/emoji.js
+         * const editor = Jodit.make('.editor', {
          *    extraPlugins: ['emoji']
          * });
          * ```
-         * It will try load %SCRIPT_PATH%/plugins/emoji/emoji.js and after load will try init it
+         *
+         * You can also pass an explicit URL to bypass the `basePath` convention:
+         *
+         * ```typescript
+         * const editor = Jodit.make('.editor', {
+         *    extraPlugins: [{ name: 'emoji', url: 'https://cdn.example.com/emoji.js' }]
+         * });
+         * ```
+         *
+         * Note: if you see a request to a malformed URL (e.g. `.../src/main.tsx?t=...plugins/emoji/emoji.js`),
+         * it means `basePath` was auto-detected incorrectly under your bundler — set
+         * {@link Config.basePath} explicitly. See the Plugin System docs for details.
          */
         this.extraPlugins = [];
         /**

package/esm/core/constants.js

@@ -3,7 +3,7 @@
  * Released under MIT see LICENSE.txt in the project root for license information.
  * Copyright (c) 2013-2026 Valerii Chupurnov. All rights reserved. https://xdsoft.net
  */
-export const APP_VERSION = "4.12.2";
+export const APP_VERSION = "4.12.3";
 // prettier-ignore
 export const ES = "es2020";
 export const IS_ES_MODERN = true;

package/esm/core/ui/icon.d.ts

@@ -27,4 +27,14 @@ export declare class Icon {
      * Make icon html element
      */
     static makeIcon(jodit: IViewBased, icon: IUIIconState): CanUndef<Node>;
+    /**
+     * Turn a raw icon string into an element with a `classList`.
+     *
+     * A plain-text icon (e.g. an emoji/text glyph) makes `fromHTML` return a
+     * Text node, which has no `classList`; wrap it in a span so classes/styles
+     * can be applied and `makeIcon` never crashes on `iconElement.classList`.
+     * Note: SVG icons are `SVGElement` (not `HTMLElement`) but are still Element
+     * nodes with a `classList`, so we check `isElement`, not `isHTMLElement`.
+     */
+    private static toIconElement;
 }

package/esm/core/ui/icon.js

@@ -4,6 +4,7 @@
  * Copyright (c) 2013-2026 Valerii Chupurnov. All rights reserved. https://xdsoft.net
  */
 import { IS_PROD } from "../constants.js";
+import { Dom } from "../dom/dom.js";
 import { camelCase, kebabCase } from "../helpers/index.js";
 import { css } from "../helpers/utils/css.js";
 export class Icon {
@@ -71,7 +72,7 @@ export class Icon {
                 Icon.get(name, '') ||
                 ((_d = jodit.o.extraIcons) === null || _d === void 0 ? void 0 : _d[name]);
             if (svg) {
-                iconElement = jodit.c.fromHTML(svg.trim());
+                iconElement = Icon.toIconElement(jodit, svg.trim());
                 if (!/^<svg/i.test(name)) {
                     iconElement.classList.add('jodit-icon_' + clearName);
                 }
@@ -88,6 +89,21 @@ export class Icon {
         }
         return iconElement;
     }
+    /**
+     * Turn a raw icon string into an element with a `classList`.
+     *
+     * A plain-text icon (e.g. an emoji/text glyph) makes `fromHTML` return a
+     * Text node, which has no `classList`; wrap it in a span so classes/styles
+     * can be applied and `makeIcon` never crashes on `iconElement.classList`.
+     * Note: SVG icons are `SVGElement` (not `HTMLElement`) but are still Element
+     * nodes with a `classList`, so we check `isElement`, not `isHTMLElement`.
+     */
+    static toIconElement(jodit, svg) {
+        const node = jodit.c.fromHTML(svg);
+        return Dom.isElement(node)
+            ? node
+            : jodit.c.span('jodit-icon_text', node);
+    }
 }
 Icon.icons = {};
 Icon.__cache = new Map();

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "jodit",
-	"version": "4.12.2",
+	"version": "4.12.3",
 	"description": "Jodit is an awesome and useful wysiwyg editor with filebrowser",
 	"main": "esm/index.js",
 	"types": "types/index.d.ts",

package/types/config.d.ts

@@ -619,18 +619,62 @@ declare class Config implements IViewOptions {
      */
     disablePlugins: string[] | string;
     /**
-     * Init and download extra plugins
+     * Init and download extra plugins that are **not** already bundled/registered.
+     *
+     * For every name in this list that is not found in the plugin registry, Jodit
+     * loads it **at runtime over the network** from:
+     *
+     * ```text
+     * <basePath>plugins/<name>/<name>(.min).js
+     * ```
+     *
+     * (see {@link Config.basePath} and {@link Config.minified}). If the plugin is
+     * already registered — e.g. you imported it statically, or you use a bundle
+     * that ships it (such as the `jodit-pro` / `jodit-pro-react` "all plugins"
+     * build) — it is **skipped** and no request is made; in that case you don't
+     * need `extraPlugins` at all, just add the plugin's button.
      *
      * ```typescript
-     * var editor = Jodit.make('.editor', {
+     * // Dynamic loading: fetches <basePath>plugins/emoji/emoji.js
+     * const editor = Jodit.make('.editor', {
      *    extraPlugins: ['emoji']
      * });
      * ```
-     * It will try load %SCRIPT_PATH%/plugins/emoji/emoji.js and after load will try init it
+     *
+     * You can also pass an explicit URL to bypass the `basePath` convention:
+     *
+     * ```typescript
+     * const editor = Jodit.make('.editor', {
+     *    extraPlugins: [{ name: 'emoji', url: 'https://cdn.example.com/emoji.js' }]
+     * });
+     * ```
+     *
+     * Note: if you see a request to a malformed URL (e.g. `.../src/main.tsx?t=...plugins/emoji/emoji.js`),
+     * it means `basePath` was auto-detected incorrectly under your bundler — set
+     * {@link Config.basePath} explicitly. See the Plugin System docs for details.
      */
     extraPlugins: Array<string | IExtraPlugin>;
     /**
-     * Base path for download extra plugins
+     * Base path used to build the URL for dynamically loaded {@link Config.extraPlugins}
+     * (and their styles): `<basePath>plugins/<name>/<name>(.min).js`.
+     *
+     * When not set, Jodit auto-detects it from `document.currentScript`, then the
+     * last `<script src>` on the page, then `location.href`. That detection works
+     * for classic `<script>` includes, but **fails under ESM bundlers / dev
+     * servers** (Vite, Webpack dev, etc.) where there is no script tag for the
+     * bundle — it falls back to the entry module URL (e.g. `main.tsx`) and produces
+     * a broken plugin URL.
+     *
+     * Fix: host the plugin files at a public location and point `basePath` there
+     * (note the trailing slash):
+     *
+     * ```typescript
+     * const editor = Jodit.make('.editor', {
+     *    basePath: 'https://your-site.com/jodit-assets/',
+     *    extraPlugins: ['emoji']
+     *    // → loads https://your-site.com/jodit-assets/plugins/emoji/emoji.js
+     * });
+     * ```
      */
     basePath?: string;
     /**

package/types/core/ui/icon.d.ts

@@ -27,4 +27,14 @@ export declare class Icon {
      * Make icon html element
      */
     static makeIcon(jodit: IViewBased, icon: IUIIconState): CanUndef<Node>;
+    /**
+     * Turn a raw icon string into an element with a `classList`.
+     *
+     * A plain-text icon (e.g. an emoji/text glyph) makes `fromHTML` return a
+     * Text node, which has no `classList`; wrap it in a span so classes/styles
+     * can be applied and `makeIcon` never crashes on `iconElement.classList`.
+     * Note: SVG icons are `SVGElement` (not `HTMLElement`) but are still Element
+     * nodes with a `classList`, so we check `isElement`, not `isHTMLElement`.
+     */
+    private static toIconElement;
 }