jodit 4.1.16 → 4.2.6

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.1.16
+ * Version: v4.2.6
  * 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.1.16
+ * Version: v4.2.6
  * 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.1.16
+ * Version: v4.2.6
  * 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.1.16
+ * Version: v4.2.6
  * 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.1.16
+ * Version: v4.2.6
  * Url: https://xdsoft.net/jodit/
  * License(s): MIT
  */

package/esm/config.d.ts

@@ -104,6 +104,28 @@ declare class Config implements IViewOptions {
     ownerWindow: Window;
     /**
      * Shadow root if Jodit was created in it
+     *
+     * ```html
+     * <div id="editor"></div>
+     * ```
+     *
+     * ```js
+     * const app = document.getElementById('editor');
+     * app.attachShadow({ mode: 'open' });
+     * const root = app.shadowRoot;
+     *
+     * root.innerHTML = `
+     * <link rel="stylesheet" href="./build/jodit.css"/>
+     * <h1>Jodit example in Shadow DOM</h1>
+     * <div id="edit"></div>
+     * `;
+     *
+     * const editor = Jodit.make(root.getElementById('edit'), {
+     * 	globalFullSize: false,
+     * 	shadowRoot: root
+     * });
+     * editor.value = '<p>start</p>';
+     * ```
      */
     shadowRoot: Nullable<ShadowRoot>;
     /**

package/esm/config.js

@@ -139,6 +139,28 @@ class Config {
             : null);
         /**
          * Shadow root if Jodit was created in it
+         *
+         * ```html
+         * <div id="editor"></div>
+         * ```
+         *
+         * ```js
+         * const app = document.getElementById('editor');
+         * app.attachShadow({ mode: 'open' });
+         * const root = app.shadowRoot;
+         *
+         * root.innerHTML = `
+         * <link rel="stylesheet" href="./build/jodit.css"/>
+         * <h1>Jodit example in Shadow DOM</h1>
+         * <div id="edit"></div>
+         * `;
+         *
+         * const editor = Jodit.make(root.getElementById('edit'), {
+         * 	globalFullSize: false,
+         * 	shadowRoot: root
+         * });
+         * editor.value = '<p>start</p>';
+         * ```
          */
         this.shadowRoot = null;
         /**

package/esm/core/async/async.js

@@ -5,6 +5,7 @@
  */
 import { IS_ES_NEXT } from "jodit/esm/core/constants.js";
 import { clearTimeout, setTimeout } from "jodit/esm/core/helpers/async/index.js";
+import { isAbortError } from "jodit/esm/core/helpers/checker/is-abort-error.js";
 import { isFunction } from "jodit/esm/core/helpers/checker/is-function.js";
 import { isNumber } from "jodit/esm/core/helpers/checker/is-number.js";
 import { isPlainObject } from "jodit/esm/core/helpers/checker/is-plain-object.js";
@@ -132,6 +133,11 @@ export class Async {
             ? (...args) => {
                 const promise = this.promise(res => {
                     promises.push(res);
+                }).catch((e) => {
+                    if (isAbortError(e)) {
+                        return null;
+                    }
+                    throw e;
                 });
                 onFire(...args);
                 return promise;
@@ -203,7 +209,7 @@ export class Async {
     promise(executor) {
         let rejectCallback = () => { };
         const promise = new Promise((resolve, reject) => {
-            rejectCallback = () => reject(abort());
+            rejectCallback = () => reject(abort('Abort async'));
             this.promisesRejections.add(rejectCallback);
             executor(resolve, reject);
         });

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-2024 Valeriy Chupurnov. All rights reserved. https://xdsoft.net
  */
-export const APP_VERSION = "4.1.16";
+export const APP_VERSION = "4.2.6";
 // prettier-ignore
 export const ES = "es2020";
 export const IS_ES_MODERN = true;

package/esm/core/helpers/size/position.js

@@ -21,7 +21,7 @@ export function position(elm, jodit, recurse = false) {
     return {
         left: Math.round(xPos),
         top: Math.round(yPos),
-        width: Math.round(elm.offsetWidth),
-        height: Math.round(elm.offsetHeight)
+        width: Math.round(elm.offsetWidth ?? rect.width),
+        height: Math.round(elm.offsetHeight ?? rect.height)
     };
 }

package/esm/core/helpers/utils/selector.d.ts

@@ -31,7 +31,9 @@ export declare const getXPathByElement: (element: HTMLElement, root: HTMLElement
 /**
  * Find all `ref` or `data-ref` elements inside HTMLElement
  */
-export declare const refs: <T extends HTMLElement>(root: HTMLElement) => IDictionary<T>;
+export declare const refs: <T extends HTMLElement>(root: HTMLElement | {
+    container: HTMLElement;
+}) => IDictionary<T>;
 /**
  * Calculate full CSS selector
  */

package/esm/core/helpers/utils/selector.js

@@ -59,9 +59,9 @@ export const getXPathByElement = (element, root) => {
  * Find all `ref` or `data-ref` elements inside HTMLElement
  */
 export const refs = (root) => {
-    // if (Component.isInstanceOf<UIElement>(root, UIElement)) {
-    // 	root = root.container;
-    // }
+    if ('container' in root) {
+        root = root.container;
+    }
     return $$('[ref],[data-ref]', root).reduce((def, child) => {
         const key = attr(child, '-ref');
         if (key && isString(key)) {

package/esm/core/ui/button/tooltip/tooltip.js

@@ -39,7 +39,7 @@ let UITooltip = UITooltip_1 = class UITooltip extends UIElement {
             view.o.showTooltip &&
             !view.o.useNativeTooltip) {
             view.hookStatus(STATUSES.ready, () => {
-                // TODO Move it inside __open method. Now it is here becous testcase failed with capturing
+                // TODO Move it inside __open method. Now it is here because testcase failed with capturing
                 getContainer(this.j, UITooltip_1).appendChild(this.container);
                 view.e.on(view.container, 'mouseenter.tooltip', this.__onMouseEnter, {
                     capture: true
@@ -55,6 +55,7 @@ let UITooltip = UITooltip_1 = class UITooltip extends UIElement {
         const view = this.j;
         view.e
             .on(view.ow, 'scroll.tooltip', this.__hide)
+            .on(view.ow, 'joditCloseDialog', this.__hide)
             .on(view.container, 'mouseleave.tooltip', this.__hide)
             .on([
             'escape.tooltip',

package/esm/core/ui/popup/popup.js

@@ -116,7 +116,7 @@ export class Popup extends UIGroup {
         }
         let pe = this.parentElement;
         while (pe) {
-            if (checkView(j)) {
+            if (checkView(pe.j)) {
                 return;
             }
             if (pe.container.style.zIndex) {

package/esm/modules/dialog/dialog.js

@@ -129,6 +129,7 @@ let Dialog = Dialog_1 = class Dialog extends ViewWithToolbar {
              * Fired when dialog box is started moving
              */
             this.e.fire(this, 'startMove');
+            this.e.fire('closeAllPopups');
         }
     }
     onMouseMove(e) {

package/esm/modules/file-browser/data-provider.js

@@ -15,7 +15,7 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
 };
 import { IS_PROD } from "jodit/esm/core/constants.js";
 import { autobind } from "jodit/esm/core/decorators/index.js";
-import { ConfigProto, error, isFunction, normalizeRelativePath, set } from "jodit/esm/core/helpers/index.js";
+import { abort, ConfigProto, error, isFunction, normalizeRelativePath, set } from "jodit/esm/core/helpers/index.js";
 import { Ajax } from "jodit/esm/core/request/index.js";
 import { FileBrowserItem } from "jodit/esm/modules/file-browser/builders/item.js";
 export const DEFAULT_SOURCE_NAME = 'default';
@@ -96,6 +96,9 @@ let DataProvider = class DataProvider {
         this.o.permissions.data.source = source;
         if (this.o.permissions.url) {
             return this.get('permissions').then(resp => {
+                if (this.parent.isInDestruct) {
+                    throw abort();
+                }
                 let process = this.o.permissions.process;
                 if (!process) {
                     process = this.o.ajax.process;

package/esm/modules/file-browser/file-browser.js

@@ -153,10 +153,17 @@ let FileBrowser = class FileBrowser extends ViewWithToolbar {
             this.__updateToolbarButtons();
             this._dialog.open(this.browser, header);
             this.e.fire('sort.filebrowser', this.state.sortBy);
-            loadTree(this).then(resolve, reject);
+            loadTree(this)
+                .then(resolve, reject)
+                .finally(() => {
+                if (this.isInDestruct) {
+                    return;
+                }
+                this?.e?.fire('fileBrowserReady.filebrowser');
+            });
         })
             .catch((e) => {
-            if (!IS_PROD) {
+            if (!isAbortError(e) && !IS_PROD) {
                 throw e;
             }
         });

package/esm/modules/image-editor/templates/form.js

@@ -10,11 +10,12 @@ const act = (el, className = 'jodti-image-editor_active') => el ? className : ''
 export const form = (editor, o) => {
     const i = editor.i18n.bind(editor);
     const switcher = (label, ref, active = true) => `<div class="jodit-form__group">
-			<label>${i(label)}</label>
-
-			<label class='jodit-switcher'>
-				<input ${act(active, 'checked')} data-ref="${ref}" type="checkbox"/>
-				<span class="jodit-switcher__slider"></span>
+			<label class="jodit-switcher-wrapper">
+				<span class='jodit-switcher'>
+					<input ${act(active, 'checked')} data-ref="${ref}" type="checkbox"/>
+					<span class="jodit-switcher__slider"></span>
+				</span>
+				<span>${i(label)}</span>
 			</label>
 	</div>`;
     return editor.create.fromHTML(`<form class="${jie} jodit-properties">

package/esm/modules/toolbar/button/button.d.ts

@@ -22,7 +22,7 @@ export declare class ToolbarButton<T extends IViewBased = IViewBased> extends UI
         hasTrigger: boolean;
         size: "small" | "tiny" | "xsmall" | "middle" | "large";
         name: string;
-        value: string | number | boolean; /** @override */
+        value: string | number | boolean;
         variant: import("jodit/esm/types").ButtonVariant;
         type: "button" | "submit";
         disabled: boolean;

package/esm/modules/widget/tabs/tabs.d.ts

@@ -8,13 +8,13 @@
  * @packageDocumentation
  * @module modules/widget/tabs
  */
-import type { IJodit } from "jodit/esm/types";
+import type { IViewBased } from "jodit/esm/types";
 import { UIElement } from "jodit/esm/core/ui";
 
 export interface TabOption {
     icon?: string;
     name: string;
-    content: HTMLElement | ((this: IJodit) => void) | UIElement;
+    content: HTMLElement | ((this: IViewBased) => void) | UIElement;
 }
 /**
  * Build tabs system
@@ -44,6 +44,6 @@ export interface TabOption {
  * ]);
  * ```
  */
-export declare const TabsWidget: (jodit: IJodit, tabs: TabOption[], state?: {
-    __activeTab: string;
+export declare const TabsWidget: (jodit: IViewBased, tabs: TabOption[], state?: {
+    activeTab: string;
 }) => HTMLDivElement;

package/esm/modules/widget/tabs/tabs.js

@@ -46,11 +46,13 @@ export const TabsWidget = (jodit, tabs, state) => {
             return;
         }
         buttonList.forEach(b => {
+            b.state.variant = 'initial';
             b.state.activated = false;
         });
         $$('.jodit-tab', tabBox).forEach(a => {
             a.classList.remove('jodit-tab_active');
         });
+        nameToTab[tab].button.state.variant = 'outline';
         nameToTab[tab].button.state.activated = true;
         nameToTab[tab].tab.classList.add('jodit-tab_active');
     };
@@ -79,7 +81,7 @@ export const TabsWidget = (jodit, tabs, state) => {
                 content.call(jodit);
             }
             if (state) {
-                state.__activeTab = name;
+                state.activeTab = name;
             }
             return false;
         });
@@ -95,20 +97,20 @@ export const TabsWidget = (jodit, tabs, state) => {
     $$('a', buttons).forEach(a => {
         a.style.width = (100 / tabCount).toFixed(10) + '%';
     });
-    const tab = !state || !state.__activeTab || !nameToTab[state.__activeTab]
+    const tab = !state || !state.activeTab || !nameToTab[state.activeTab]
         ? firstTab
-        : state.__activeTab;
+        : state.activeTab;
     setActive(tab);
     if (state) {
-        let __activeTab = state.__activeTab;
-        Object.defineProperty(state, '__activeTab', {
+        let activeTab = state.activeTab;
+        Object.defineProperty(state, 'activeTab', {
             configurable: true,
             enumerable: false,
             get() {
-                return __activeTab;
+                return activeTab;
             },
             set(value) {
-                __activeTab = value;
+                activeTab = value;
                 setActive(value);
             }
         });

package/esm/plugins/ai-assistant/ai-assistant.d.ts

@@ -21,7 +21,7 @@ export declare class aiAssistant extends Plugin {
     private get __container();
     constructor(jodit: IJodit);
     /** @override */
-    afterInit(jodit: IJodit): void;
+    afterInit(): void;
     protected onGenerateAiAssistantForm(prompt: string): void;
     protected onInvokeAiAssistant(prompt: string): void;
     /** @override */

package/esm/plugins/ai-assistant/ai-assistant.js

@@ -20,7 +20,7 @@ import { isAbortError } from "jodit/esm/core/helpers/checker/is-abort-error.js";
 import { Plugin } from "jodit/esm/core/plugin/plugin.js";
 import "./config";
 import { UiAiAssistant } from "./ui/ui-ai-assistant";
-import * as langs from "./langs";
+import * as lang from "./langs";
 /**
  * The plugin inserts content generated by AI into the editor.
  */
@@ -64,10 +64,10 @@ export class aiAssistant extends Plugin {
                 group: 'insert'
             }
         ];
-        extendLang(langs);
+        extendLang(lang);
     }
     /** @override */
-    afterInit(jodit) { }
+    afterInit() { }
     onGenerateAiAssistantForm(prompt) {
         this.__dialog.open(this.__container, 'AI Assistant');
         this.__container.setPrompt(prompt);

package/esm/plugins/image-properties/config.d.ts

@@ -3,90 +3,12 @@
  * Released under MIT see LICENSE.txt in the project root for license information.
  * Copyright (c) 2013-2024 Valeriy Chupurnov. All rights reserved. https://xdsoft.net
  */
+/**
+ * @module plugins/image-properties
+ */
+import type { ImagePropertiesOptions } from "./interface";
 declare module 'jodit/config' {
     interface Config {
-        image: {
-            dialogWidth: number;
-            /**
-             * Open editing dialog after double click on image
-             */
-            openOnDblClick: boolean;
-            /**
-             * Show edit 'src' input
-             */
-            editSrc: boolean;
-            /**
-             * Show crop/resize btn
-             */
-            useImageEditor: boolean;
-            /**
-             * Show edit 'title' input
-             */
-            editTitle: boolean;
-            /**
-             * Show edit 'alt' input
-             */
-            editAlt: boolean;
-            /**
-             * Show edit image link's options
-             */
-            editLink: boolean;
-            /**
-             * Show edit image size's inputs
-             */
-            editSize: boolean;
-            /**
-             * Show edit margin inputs
-             */
-            editMargins: boolean;
-            editBorderRadius: boolean;
-            /**
-             * Show edit classNames input
-             */
-            editClass: boolean;
-            /**
-             * Pre-define available classes to select from
-             *
-             * Classes can be provided as list of strings or as list of tuples
-             * `["classname", "human label"]`.
-             *
-             * @example
-             * ```javascript
-             * new Jodit('#editor', {
-             *    image: {
-             *        availableClasses: [
-             *            "rte-image-width-50",
-             *            ["rte-image-width-75", "75 % width"]
-             *        ]
-             *    }
-             * })
-             * ```
-             */
-            availableClasses: [
-                string,
-                string
-            ][] | string[];
-            /**
-             * Show style edit input
-             */
-            editStyle: boolean;
-            /**
-             * Show edit ID input
-             */
-            editId: boolean;
-            /**
-             * Show Alignment selector
-             */
-            editAlign: boolean;
-            /**
-             * Show preview image
-             */
-            showPreview: boolean;
-            /**
-             * Select image after close dialog
-             */
-            selectImageAfterClose: boolean;
-        };
+        image: ImagePropertiesOptions;
     }
 }
-export {};

package/esm/plugins/image-properties/config.js

@@ -3,9 +3,6 @@
  * Released under MIT see LICENSE.txt in the project root for license information.
  * Copyright (c) 2013-2024 Valeriy Chupurnov. All rights reserved. https://xdsoft.net
  */
-/**
- * @module plugins/image-properties
- */
 import { Config } from "jodit/esm/config.js";
 Config.prototype.image = {
     dialogWidth: 600,

package/esm/plugins/image-properties/image-properties.d.ts

@@ -9,27 +9,34 @@
  * @module plugins/image-properties
  */
 import type { IJodit } from "jodit/esm/types";
-import { Plugin } from "jodit/esm/modules";
+import { Plugin } from "jodit/esm/core/plugin/plugin";
 import "./config";
-
+import type { ImagePropertiesState } from "./interface";
+/**
+ * Plug-in for image editing window
+ *
+ * @example
+ * ```javascript
+ * const editor = Jodit.make('#editor', {
+ *     image: {
+ *         editSrc: false,
+ *         editLink: false
+ *     }
+ * });
+ * ```
+ */
 /**
  * Show dialog with image's options
  */
 export declare class imageProperties extends Plugin {
-    protected state: {
-        image: HTMLImageElement;
-        ratio: number;
-        sizeIsLocked: boolean;
-        marginIsLocked: boolean;
-    };
+    protected state: ImagePropertiesState;
     private activeTabState;
-    protected onChangeMarginIsLocked(): void;
-    protected onChangeSizeIsLocked(): void;
-    private form;
+    private get form();
     /**
      * Dialog for form
      */
-    private dialog;
+    private get dialog();
+    private get __buttons();
     /**
      * Open dialog editing image properties
      *
@@ -45,28 +52,11 @@ export declare class imageProperties extends Plugin {
      * ```
      */
     protected open(): void | false;
-    /**
-     * Create form for edit image properties
-     */
-    private makeForm;
-    /**
-     * Set input values from image
-     */
-    private updateValues;
-    /**
-     * Apply form's values to image
-     */
-    private onApply;
-    /**
-     * Open image editor dialog
-     */
-    private openImageEditor;
-    /**
-     * Open popup with filebrowser/uploader buttons for image
-     */
-    private openImagePopup;
+    private __lock;
+    private __unlock;
     /** @override **/
     protected afterInit(editor: IJodit): void;
+    protected onStateValuesImageSrcChange(): Promise<void>;
     /** @override */
     protected beforeDestruct(editor: IJodit): void;
 }