jodit 4.2.18 → 4.2.21

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

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.2.18";
+export const APP_VERSION = "4.2.21";
 // prettier-ignore
 export const ES = "es2020";
 export const IS_ES_MODERN = true;

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

@@ -36,6 +36,7 @@ export declare class UIButton extends UIElement implements IUIButton {
     protected button: HTMLElement;
     protected onChangeSize(): void;
     protected onChangeType(): void;
+    protected onChangeRole(): void;
     /**
      * Set size from a parent list
      */

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

@@ -25,6 +25,7 @@ import { Icon } from "../../icon.js";
 export const UIButtonState = () => ({
     size: 'middle',
     type: 'button',
+    role: 'button',
     name: '',
     value: '',
     variant: 'initial',
@@ -73,6 +74,9 @@ let UIButton = class UIButton extends UIElement {
     onChangeType() {
         attr(this.container, 'type', this.state.type);
     }
+    onChangeRole() {
+        attr(this.container, 'role', this.state.role);
+    }
     /**
      * Set size from a parent list
      */
@@ -202,6 +206,9 @@ __decorate([
 __decorate([
     watch('state.type', { immediately: false })
 ], UIButton.prototype, "onChangeType", null);
+__decorate([
+    watch('state.role', { immediately: false })
+], UIButton.prototype, "onChangeRole", null);
 __decorate([
     watch('parentElement')
 ], UIButton.prototype, "updateSize", null);

package/esm/core/ui/button/tooltip/tooltip.d.ts

@@ -17,16 +17,15 @@ export declare class UITooltip extends UIElement {
     protected render(): string;
     constructor(view: IViewBased);
     private __listenClose;
-    private __addListenersOnClose;
-    private __removeListenersOnClose;
+    private __addListenersOnEnter;
+    private __removeListenersOnLeave;
     private __currentTarget;
     private __onMouseLeave;
     private __onMouseEnter;
     private __delayShowTimeout;
     private __hideTimeout;
-    private __delayOpen;
     private __open;
-    private __setPosition;
+    private __show;
     private __hide;
     private __hideDelay;
     destruct(): void;

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

@@ -21,6 +21,19 @@ import { getContainer } from "../../../global.js";
 import { position } from "../../../helpers/size/position.js";
 import { attr, css } from "../../../helpers/utils/index.js";
 import { UIElement } from "../../element.js";
+const WINDOW_EVENTS_ON_HIDE = [
+    'scroll.tooltip',
+    'joditCloseDialog',
+    'mouseleave.tooltip'
+];
+const JODIT_EVENTS_ON_HIDE = [
+    'escape.tooltip',
+    'change.tooltip',
+    'changePlace.tooltip',
+    'afterOpenPopup.tooltip',
+    'hidePopup.tooltip',
+    'closeAllPopups.tooltip'
+];
 let UITooltip = UITooltip_1 = class UITooltip extends UIElement {
     className() {
         return 'UITooltip';
@@ -39,7 +52,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 because testcase failed with capturing
+                // TODO Move it inside __show 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
@@ -47,44 +60,28 @@ let UITooltip = UITooltip_1 = class UITooltip extends UIElement {
             });
         }
     }
-    __addListenersOnClose() {
+    __addListenersOnEnter() {
         if (this.__listenClose) {
             return;
         }
         this.__listenClose = true;
         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',
-            'change.tooltip',
-            'changePlace.tooltip',
-            'afterOpenPopup.tooltip',
-            'hidePopup.tooltip',
-            'closeAllPopups.tooltip'
-        ], this.__hide)
-            .on(view.container, 'mouseleave', this.__onMouseLeave, {
+            .on(view.ow, WINDOW_EVENTS_ON_HIDE, this.__hide)
+            .on(JODIT_EVENTS_ON_HIDE, this.__hide)
+            .on(view.container, 'mouseleave.tooltip', this.__onMouseLeave, {
             capture: true
         });
     }
-    __removeListenersOnClose() {
+    __removeListenersOnLeave() {
         if (!this.__listenClose) {
             return;
         }
         this.__listenClose = false;
         const view = this.j;
         view.e
-            .off(view.ow, 'scroll.tooltip', this.__hide)
-            .off([
-            'escape.tooltip',
-            'change.tooltip',
-            'changePlace.tooltip',
-            'afterOpenPopup.tooltip',
-            'hidePopup.tooltip',
-            'closeAllPopups.tooltip'
-        ], this.__hide)
+            .off(view.ow, WINDOW_EVENTS_ON_HIDE, this.__hide)
+            .off(JODIT_EVENTS_ON_HIDE, this.__hide)
             .off(view.container, 'mouseleave.tooltip', this.__onMouseLeave);
     }
     __onMouseLeave(e) {
@@ -110,29 +107,30 @@ let UITooltip = UITooltip_1 = class UITooltip extends UIElement {
             return;
         }
         this.__currentTarget = e.target;
-        const pos = position(e.target);
-        this.__addListenersOnClose();
-        this.__delayOpen(() => ({
-            x: pos.left + pos.width / 2,
-            y: pos.top + pos.height
-        }), tooltip);
+        const target = e.target;
+        this.__open(() => {
+            const pos = position(target);
+            return {
+                x: pos.left + pos.width / 2,
+                y: pos.top + pos.height
+            };
+        }, tooltip);
     }
-    __delayOpen(getPoint, content) {
-        const to = this.j.o.showTooltipDelay || this.j.defaultTimeout;
+    __open(getPoint, content) {
+        this.__addListenersOnEnter();
+        this.__isOpened = true;
         this.j.async.clearTimeout(this.__hideTimeout);
         this.j.async.clearTimeout(this.__delayShowTimeout);
-        this.__delayShowTimeout = this.j.async.setTimeout(() => this.__open(getPoint, content), {
-            timeout: to,
-            label: 'tooltip'
-        });
+        const to = this.j.o.showTooltipDelay || this.j.defaultTimeout;
+        if (!to) {
+            this.__show(getPoint, content);
+            return;
+        }
+        this.__delayShowTimeout = this.j.async.setTimeout(() => this.__show(getPoint, content), to);
     }
-    __open(getPoint, content) {
+    __show(getPoint, content) {
         this.setMod('visible', true);
         this.getElm('content').innerHTML = content;
-        this.__isOpened = true;
-        this.__setPosition(getPoint);
-    }
-    __setPosition(getPoint) {
         const point = getPoint();
         css(this.container, {
             left: point.x,
@@ -142,24 +140,26 @@ let UITooltip = UITooltip_1 = class UITooltip extends UIElement {
     __hide() {
         this.j.async.clearTimeout(this.__delayShowTimeout);
         this.j.async.clearTimeout(this.__hideTimeout);
-        this.__removeListenersOnClose();
+        this.__removeListenersOnLeave();
         if (this.__isOpened) {
             this.__isOpened = false;
             this.setMod('visible', false);
+            this.getElm('content').innerHTML = '';
             css(this.container, {
                 left: -5000
             });
         }
     }
     __hideDelay() {
+        this.j.async.clearTimeout(this.__delayShowTimeout);
+        this.j.async.clearTimeout(this.__hideTimeout);
         if (!this.__isOpened) {
             return;
         }
-        this.j.async.clearTimeout(this.__delayShowTimeout);
         this.__hideTimeout = this.async.setTimeout(this.__hide, this.j.defaultTimeout);
     }
     destruct() {
-        this.j.e.off(this.j.container, 'mouseenter', this.__onMouseEnter);
+        this.j.e.off(this.j.container, 'mouseenter.tooltip', this.__onMouseEnter);
         this.__hide();
         super.destruct();
     }

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

@@ -25,6 +25,7 @@ export declare class ToolbarButton<T extends IViewBased = IViewBased> extends UI
         value: string | number | boolean;
         variant: import("../../../types").ButtonVariant;
         type: "button" | "submit";
+        role: "button" | "tab";
         disabled: boolean;
         activated: boolean;
         icon: import("../../../types").IUIIconState;

package/esm/modules/toolbar/collection/collection.js

@@ -116,7 +116,7 @@ __decorate([
     autobind
 ], ToolbarCollection.prototype, "__immediateUpdate", null);
 __decorate([
-    debounce()
+    debounce(ctx => ctx.j.defaultTimeout, true)
 ], ToolbarCollection.prototype, "update", null);
 __decorate([
     hook('ready')

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

@@ -5,8 +5,8 @@
  */
 import { Component } from "../../../core/component/index.js";
 import { Dom } from "../../../core/dom/dom.js";
-import { $$ } from "../../../core/helpers/index.js";
 import { isFunction } from "../../../core/helpers/checker/is-function.js";
+import { attr } from "../../../core/helpers/utils/attr.js";
 import { Button, UIElement } from "../../../core/ui/index.js";
 /**
  * Build tabs system
@@ -37,8 +37,16 @@ import { Button, UIElement } from "../../../core/ui/index.js";
  * ```
  */
 export const TabsWidget = (jodit, tabs, state) => {
-    const box = jodit.c.div('jodit-tabs'), tabBox = jodit.c.div('jodit-tabs__wrapper'), buttons = jodit.c.div('jodit-tabs__buttons'), nameToTab = {}, buttonList = [];
-    let firstTab = '', tabCount = 0;
+    const box = jodit.c.div('jodit-tabs');
+    const tabBox = jodit.c.div('jodit-tabs__wrapper');
+    const buttons = jodit.c.div('jodit-tabs__buttons');
+    attr(buttons, {
+        role: 'tablist',
+        'aria-orientation': 'horizontal'
+    });
+    const nameToTab = {};
+    const buttonList = [];
+    let firstTab = '';
     box.appendChild(buttons);
     box.appendChild(tabBox);
     const setActive = (tab) => {
@@ -46,20 +54,21 @@ 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';
+        Object.values(nameToTab).forEach(({ tab }) => tab.classList.remove('jodit-tab_active'));
         nameToTab[tab].button.state.activated = true;
         nameToTab[tab].tab.classList.add('jodit-tab_active');
     };
     tabs.forEach(({ icon, name, content }) => {
-        const tab = jodit.c.div('jodit-tab'), button = Button(jodit, icon || name, name);
+        const tab = jodit.c.div('jodit-tab');
+        attr(tab, {
+            role: 'tabpanel'
+        });
+        const button = Button(jodit, icon || name, name);
+        button.state.role = 'tab';
         // Stop lose the focus
-        jodit.e.on(button.container, 'mousedown', (e) => e.preventDefault());
+        jodit.e.on(button.container, 'pointerdown', (e) => e.preventDefault());
         if (!firstTab) {
             firstTab = name;
         }
@@ -89,13 +98,9 @@ export const TabsWidget = (jodit, tabs, state) => {
             button,
             tab
         };
-        tabCount += 1;
     });
-    if (!tabCount) {
-        return box;
-    }
-    $$('a', buttons).forEach(a => {
-        a.style.width = (100 / tabCount).toFixed(10) + '%';
+    Object.values(nameToTab).forEach(({ button }) => {
+        button.container.style.width = (100 / tabs.length).toFixed(10) + '%';
     });
     const tab = !state || !state.activeTab || !nameToTab[state.activeTab]
         ? firstTab

package/esm/types/ui.d.ts

@@ -37,6 +37,7 @@ export interface IUIButtonState {
     value: string | number | boolean;
     variant: ButtonVariant;
     type: 'button' | 'submit';
+    role: 'button' | 'tab';
     disabled: boolean;
     activated: boolean;
     icon: IUIIconState;

package/package.json

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

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

@@ -36,6 +36,7 @@ export declare class UIButton extends UIElement implements IUIButton {
     protected button: HTMLElement;
     protected onChangeSize(): void;
     protected onChangeType(): void;
+    protected onChangeRole(): void;
     /**
      * Set size from a parent list
      */

package/types/core/ui/button/tooltip/tooltip.d.ts

@@ -17,16 +17,15 @@ export declare class UITooltip extends UIElement {
     protected render(): string;
     constructor(view: IViewBased);
     private __listenClose;
-    private __addListenersOnClose;
-    private __removeListenersOnClose;
+    private __addListenersOnEnter;
+    private __removeListenersOnLeave;
     private __currentTarget;
     private __onMouseLeave;
     private __onMouseEnter;
     private __delayShowTimeout;
     private __hideTimeout;
-    private __delayOpen;
     private __open;
-    private __setPosition;
+    private __show;
     private __hide;
     private __hideDelay;
     destruct(): void;

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

@@ -25,6 +25,7 @@ export declare class ToolbarButton<T extends IViewBased = IViewBased> extends UI
         value: string | number | boolean;
         variant: import("../../../types").ButtonVariant;
         type: "button" | "submit";
+        role: "button" | "tab";
         disabled: boolean;
         activated: boolean;
         icon: import("../../../types").IUIIconState;

package/types/types/ui.d.ts

@@ -37,6 +37,7 @@ export interface IUIButtonState {
     value: string | number | boolean;
     variant: ButtonVariant;
     type: 'button' | 'submit';
+    role: 'button' | 'tab';
     disabled: boolean;
     activated: boolean;
     icon: IUIIconState;