jodit 3.6.16 → 3.7.2

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "jodit",
-	"version": "3.6.16",
+	"version": "3.7.2",
 	"description": "Jodit is awesome and usefully wysiwyg editor with filebrowser",
 	"main": "build/jodit.min.js",
 	"types": "index.d.ts",
@@ -47,43 +47,43 @@
 		"autobind-decorator": "^2.4.0"
 	},
 	"devDependencies": {
-		"@types/ace": "^0.0.45",
-		"@types/node": "^15.3.0",
-		"@typescript-eslint/eslint-plugin": "^4.23.0",
-		"@typescript-eslint/parser": "^4.23.0",
-		"autoprefixer": "^10.2.5",
+		"@types/ace": "^0.0.46",
+		"@types/node": "^15.12.2",
+		"@typescript-eslint/eslint-plugin": "^4.27.0",
+		"@typescript-eslint/parser": "^4.27.0",
+		"autoprefixer": "^10.2.6",
 		"chai": "^4.3.4",
 		"classlist-polyfill": "^1.2.0",
 		"compression": "^1.7.4",
 		"cross-env": "^7.0.3",
-		"css-loader": "^5.2.4",
-		"css-minimizer-webpack-plugin": "^3.0.0",
-		"cssnano-preset-advanced": "^5.0.1",
+		"css-loader": "^5.2.6",
+		"css-minimizer-webpack-plugin": "^3.0.1",
+		"cssnano-preset-advanced": "^5.1.3",
 		"es6-promise": "^4.2.8",
-		"eslint": "^7.26.0",
+		"eslint": "^7.28.0",
 		"eslint-config-prettier": "^8.3.0",
 		"eslint-plugin-header": "^3.1.1",
 		"eslint-plugin-prettier": "^3.4.0",
 		"express": "^4.17.1",
 		"file-loader": "^6.2.0",
 		"husky": "^6.0.0",
-		"karma": "^6.3.2",
+		"karma": "^6.3.4",
 		"karma-chai": "^0.1.0",
 		"karma-chrome-launcher": "^3.1.0",
-		"karma-firefox-launcher": "^2.1.0",
+		"karma-firefox-launcher": "^2.1.1",
 		"karma-mocha": "^2.0.1",
 		"karma-sourcemap-loader": "^0.3.8",
 		"karma-webpack": "^5.0.0",
 		"less": "^4.1.1",
-		"less-loader": "^9.0.0",
+		"less-loader": "^9.1.0",
 		"lint-staged": "^11.0.0",
 		"merge-stream": "^2.0.0",
 		"mini-css-extract-plugin": "^1.6.0",
-		"mocha": "^8.4.0",
-		"postcss": "^8.2.15",
+		"mocha": "^9.0.0",
+		"postcss": "^8.3.4",
 		"postcss-css-variables": "^0.18.0",
-		"postcss-loader": "^5.3.0",
-		"prettier": "^2.3.0",
+		"postcss-loader": "^6.1.0",
+		"prettier": "^2.3.1",
 		"raw-loader": "^4.0.2",
 		"style-loader": "^2.0.0",
 		"stylelint": "^13.13.1",
@@ -92,15 +92,15 @@
 		"stylelint-config-standard": "^22.0.0",
 		"stylelint-prettier": "^1.2.0",
 		"synchronous-promise": "^2.0.15",
-		"terser-webpack-plugin": "^5.1.2",
-		"ts-loader": "^9.1.2",
+		"terser-webpack-plugin": "^5.1.3",
+		"ts-loader": "^9.2.3",
 		"ts-private-uglifier": "^1.0.2",
-		"tslib": "^2.2.0",
-		"typescript": "^4.2.4",
+		"tslib": "^2.3.0",
+		"typescript": "^4.3.2",
 		"url-loader": "^4.1.1",
-		"webpack": "^5.37.0",
-		"webpack-cli": "^4.7.0",
-		"webpack-dev-middleware": "^4.2.0",
+		"webpack": "^5.39.0",
+		"webpack-cli": "^4.7.2",
+		"webpack-dev-middleware": "^5.0.0",
 		"webpack-dev-server": "^3.11.2",
 		"webpack-hot-middleware": "^2.25.0",
 		"webpack-stream": "^6.1.2",

package/src/core/async.ts

@@ -16,7 +16,9 @@ import {
 	clearTimeout,
 	isFunction,
 	isPlainObject,
-	isPromise
+	isPromise,
+	isString,
+	isNumber
 } from './helpers/';
 
 export class Async implements IAsync {
@@ -33,14 +35,13 @@ export class Async implements IAsync {
 
 		let options: IAsyncParams = {};
 
-		if (typeof timeout !== 'number') {
+		if (!isNumber(timeout)) {
 			options = timeout;
 			timeout = options.timeout || 0;
 		}
 
-		if (options.label && this.timers.has(options.label)) {
-			clearTimeout(this.timers.get(options.label) as number);
-			this.timers.delete(options.label);
+		if (options.label) {
+			this.clearLabel(options.label);
 		}
 
 		const timer = setTimeout(callback, timeout, ...args),
@@ -51,10 +52,22 @@ export class Async implements IAsync {
 		return timer;
 	}
 
-	clearTimeout(timer: number): void {
-		clearTimeout(timer);
+	private clearLabel(label: string) {
+		if (label && this.timers.has(label)) {
+			clearTimeout(this.timers.get(label) as number);
+			this.timers.delete(label);
+		}
+	}
 
-		this.timers.delete(timer);
+	clearTimeout(timer: number): void;
+	clearTimeout(label: string): void;
+	clearTimeout(timerOrLabel: number | string): void {
+		if (isString(timerOrLabel)) {
+			return this.clearLabel(timerOrLabel);
+		}
+
+		clearTimeout(timerOrLabel);
+		this.timers.delete(timerOrLabel);
 	}
 
 	/**
@@ -321,6 +334,7 @@ export class Async implements IAsync {
 	}
 
 	isDestructed: boolean = false;
+
 	destruct(): any {
 		this.clear();
 		this.isDestructed = true;

package/src/core/component/component.ts

@@ -16,8 +16,10 @@ import { kebabCase, get, getClassName, isFunction, isVoid } from '../helpers';
 import { uniqueUid } from '../global';
 import { STATUSES } from './statuses';
 
-const StatusListHandlers: Map<Component, IDictionary<CallableFunction[]>> =
-	new Map();
+const StatusListHandlers: Map<
+	Component,
+	IDictionary<CallableFunction[]>
+> = new Map();
 
 export abstract class Component implements IComponent {
 	static STATUSES = STATUSES;

package/src/core/component/view-component.ts

@@ -49,7 +49,7 @@ export abstract class ViewComponent<T extends IViewBased = IViewBased>
 	}
 
 	/** @override */
-	destruct(): any {
+	override destruct(): any {
 		this.j.components.delete(this);
 		return super.destruct();
 	}

package/src/core/decorators/cache.ts

@@ -12,7 +12,7 @@ export interface CachePropertyDescriptor<T, R> extends PropertyDescriptor {
 }
 
 export function cache<T, R>(
-	target: any,
+	target: object,
 	name: PropertyKey,
 	descriptor: CachePropertyDescriptor<T, R>
 ): void {

package/src/core/decorators/component.ts

@@ -25,7 +25,7 @@ const cn = (elm: ComponentCompatible): string | number => {
  */
 export function component<T extends ComponentCompatible>(
 	constructorFunction: T
-) {
+): T {
 	class newConstructorFunction extends constructorFunction {
 		constructor(...args: any[]) {
 			super(...args);

package/src/core/decorators/debounce.ts

@@ -8,7 +8,8 @@ import type {
 	IDictionary,
 	IViewBased,
 	IViewComponent,
-	IAsyncParams
+	IAsyncParams,
+	DecoratorHandler
 } from '../../types';
 import {
 	error,
@@ -30,7 +31,7 @@ export function debounce<V = IViewComponent | IViewBased>(
 	timeout?: number | ((ctx: V) => number | IAsyncParams) | IAsyncParams,
 	firstCallImmediately: boolean = false,
 	method: 'debounce' | 'throttle' = 'debounce'
-) {
+): DecoratorHandler {
 	return <T extends Component & IDictionary>(
 		target: IDictionary,
 		propertyKey: string
@@ -67,8 +68,8 @@ export function debounce<V = IViewComponent | IViewBased>(
  * @param method
  */
 export function throttle<V = IViewComponent | IViewBased>(
-	timeout?: number | ((ctx: V) => number),
+	timeout?: number | ((ctx: V) => number | IAsyncParams) | IAsyncParams,
 	firstCallImmediately: boolean = false
-) {
+): DecoratorHandler {
 	return debounce<V>(timeout, firstCallImmediately, 'throttle');
 }

package/src/core/decorators/idle.ts

@@ -0,0 +1,40 @@
+/*!
+ * Jodit Editor (https://xdsoft.net/jodit/)
+ * Released under MIT see LICENSE.txt in the project root for license information.
+ * Copyright (c) 2013-2021 Valeriy Chupurnov. All rights reserved. https://xdsoft.net
+ */
+import type {
+	DecoratorHandler,
+	IDictionary,
+	IViewBased,
+	IViewComponent
+} from '../../types';
+import { Component, STATUSES } from '../component';
+import { error, isFunction, isViewObject } from '../helpers';
+
+/**
+ * Wrap function in requestIdleCallback wrapper*
+ */
+export function idle<V = IViewComponent | IViewBased>(): DecoratorHandler {
+	return <T extends Component & IDictionary>(
+		target: IDictionary,
+		propertyKey: string
+	): void => {
+		if (!isFunction(target[propertyKey])) {
+			throw error('Handler must be a Function');
+		}
+
+		target.hookStatus(STATUSES.ready, (component: V) => {
+			const view = isViewObject(component)
+				? component
+				: (component as unknown as IViewComponent).jodit;
+
+			const originalMethod = (component as any)[propertyKey];
+
+			(component as any)[propertyKey] = (...args: unknown[]) =>
+				view.async.requestIdleCallback(
+					originalMethod.bind(component, ...args)
+				);
+		});
+	};
+}

package/src/core/decorators/index.ts

@@ -7,6 +7,7 @@
 export * from './cache';
 export * from './component';
 export * from './debounce';
+export * from './idle';
 export * from './hook';
 export * from './nonenumerable';
 export * from './persistent';

package/src/core/decorators/nonenumerable.ts

@@ -8,7 +8,7 @@
  * @enumerable decorator that sets the enumerable property of a class field to false.
  * @param value true|false
  */
-export const nonenumerable = (target: any, propertyKey: string) => {
+export const nonenumerable = (target: object, propertyKey: string): void => {
 	const descriptor =
 		Object.getOwnPropertyDescriptor(target, propertyKey) || {};
 

package/src/core/decorators/spy.ts

@@ -11,13 +11,12 @@ import {
 	isString
 } from '../helpers/checker';
 import { getClassName } from '../helpers/utils';
-import { type } from '../helpers';
 
 /**
  * Allow spy for the class
  * @param target
  */
-export const spy = function spy(target: Function) {
+export const spy = function spy(target: Function): void {
 	const methods = Reflect.ownKeys(target.prototype);
 
 	methods.forEach(key => {
@@ -46,7 +45,7 @@ export const spy = function spy(target: Function) {
 						isBoolean(a) ||
 						isNumber(a)
 							? JSON.stringify(a)
-							: `[${type(a)}]`
+							: {}.toString.call(a)
 					)})`
 				);
 

package/src/core/decorators/watch.ts

@@ -6,6 +6,7 @@
 
 import type {
 	CanUndef,
+	DecoratorHandler,
 	IComponent,
 	IDictionary,
 	IViewComponent
@@ -21,7 +22,7 @@ import { ObserveObject } from '../events';
 import { Component, STATUSES } from '../component';
 
 export function getPropertyDescriptor(
-	obj: any,
+	obj: unknown,
 	prop: string
 ): CanUndef<PropertyDescriptor> {
 	let desc;
@@ -41,7 +42,7 @@ export function getPropertyDescriptor(
 export function watch(
 	observeFields: string[] | string,
 	context?: object | ((c: IDictionary) => object)
-) {
+): DecoratorHandler {
 	return <T extends Component & IDictionary>(
 		target: T,
 		propertyKey: string
@@ -60,6 +61,7 @@ export function watch(
 			splitArray(observeFields).forEach(field => {
 				if (/:/.test(field)) {
 					const [objectPath, eventName] = field.split(':');
+
 					const view = isViewObject(component)
 						? component
 						: (component as unknown as IViewComponent).jodit;
@@ -73,9 +75,11 @@ export function watch(
 						context = context(component);
 					}
 
-					view.events
-						.on(context || component, eventName, callback)
-						.on(eventName, callback);
+					view.events.on(context || component, eventName, callback);
+
+					if (!context) {
+						view.events.on(eventName, callback);
+					}
 
 					view.hookStatus('beforeDestruct', () => {
 						view.events

package/src/core/events/events-native.ts

@@ -546,7 +546,7 @@ export class EventsNative implements IEventsNative {
 	 *  ```
 	 *
 	 */
-	fire(subjectOrEvents: string, eventsList?: any, ...args: any[]): any;
+	fire(subjectOrEvents: string, ...args: any[]): any;
 	fire(
 		subjectOrEvents: object,
 		eventsList: string | Event,

package/src/core/global.ts

@@ -43,7 +43,7 @@ export const pluginSystem = new PluginSystem();
 export const modules: IDictionary<Function> = {};
 
 export const lang: IDictionary<IDictionary<string>> = {};
-export const extendLang = (langs: IDictionary) => {
+export const extendLang = (langs: IDictionary): void => {
 	Object.keys(langs).forEach(key => {
 		if (lang[key]) {
 			Object.assign(lang[key], langs[key]);
@@ -66,7 +66,7 @@ export function getContainer<T extends HTMLTagNames = HTMLTagNames>(
 	jodit: IViewBased | IViewComponent,
 	classFunc: Function,
 	tag: T = 'div' as T,
-	inside: boolean = false
+	createInsideEditor: boolean = false
 ): HTMLElementTagNameMap[T] {
 	const name = getClassName(classFunc.prototype);
 
@@ -79,7 +79,11 @@ export function getContainer<T extends HTMLTagNames = HTMLTagNames>(
 		let c = view.c,
 			body = jodit.od.body;
 
-		if (inside && isJoditObject(jodit) && jodit.od !== jodit.ed) {
+		if (
+			createInsideEditor &&
+			isJoditObject(jodit) &&
+			jodit.od !== jodit.ed
+		) {
 			c = jodit.createInside;
 			body = tag === 'style' ? jodit.ed.head : jodit.ed.body;
 		}

package/src/core/helpers/checker/is-plain-object.ts

@@ -6,7 +6,6 @@
 
 import type { IDictionary } from '../../../types';
 import { isWindow } from './is-window';
-import { hasOwn } from '../type';
 
 /**
  * Check if element is simple plaint object
@@ -21,6 +20,6 @@ export function isPlainObject<T>(
 
 	return !(
 		obj.constructor &&
-		!hasOwn.call(obj.constructor.prototype, 'isPrototypeOf')
+		!{}.hasOwnProperty.call(obj.constructor.prototype, 'isPrototypeOf')
 	);
 }

package/src/core/helpers/checker/is-url.ts

@@ -19,7 +19,10 @@ export function isURL(str: string): boolean {
 	if (typeof URL !== 'undefined') {
 		try {
 			const url = new URL(str);
-			return ['https:', 'http:', 'ftp:', 'file:'].includes(url.protocol);
+
+			return ['https:', 'http:', 'ftp:', 'file:', 'rtmp:'].includes(
+				url.protocol
+			);
 		} catch (e) {
 			return false;
 		}

package/src/core/helpers/scroll-into-view.ts

@@ -39,7 +39,7 @@ export const scrollIntoViewIfNeeded = (
 	elm: HTMLElement,
 	root: HTMLElement,
 	doc: Document
-) => {
+): void => {
 	if (!inView(elm, root, doc)) {
 		if (root.clientHeight !== root.scrollHeight) {
 			root.scrollTop = elm.offsetTop;

package/src/core/helpers/size/position.ts

@@ -27,29 +27,8 @@ export function position(
 	jodit?: IViewBased,
 	recurse: boolean = false
 ): IBound {
-	// let xPos = 0,
-	// 	yPos = 0,
-	// 	el: HTMLElement | null = elm;
-	//
-	// const doc: Document = elm.ownerDocument || jodit?.od || document;
-	//
-	// while (el) {
-	// 	if (el.tagName == 'BODY') {
-	// 		// deal with browser quirks with body/window/document and page scroll
-	// 		const xScroll = el.scrollLeft || doc.documentElement.scrollLeft,
-	// 			yScroll = el.scrollTop || doc.documentElement.scrollTop;
-	//
-	// 		xPos += el.offsetLeft - xScroll + el.clientLeft;
-	// 		yPos += el.offsetTop - yScroll + el.clientTop;
-	// 	} else {
-	// 		// for all other non-BODY elements
-	// 		xPos += el.offsetLeft - el.scrollLeft + el.clientLeft;
-	// 		yPos += el.offsetTop - el.scrollTop + el.clientTop;
-	// 	}
-	//
-	// 	el = el.offsetParent as HTMLElement;
-	// }
 	const rect = elm.getBoundingClientRect();
+
 	let xPos = rect.left,
 		yPos = rect.top;
 

package/src/core/helpers/string/stringify.ts

@@ -13,14 +13,14 @@ import type { CanUndef } from '../../../types';
  * @param options
  */
 export function stringify(
-	value: any,
+	value: unknown,
 	options: {
 		excludeKeys?: string[];
 		prettify?: string;
 	} = {}
 ): string {
 	if (typeof value !== 'object') {
-		return value.toString ? value.toString() : value;
+		return String(value);
 	}
 
 	const excludeKeys = new Set(options.excludeKeys);

package/src/core/helpers/type.ts

@@ -4,50 +4,6 @@
  * Copyright (c) 2013-2021 Valeriy Chupurnov. All rights reserved. https://xdsoft.net
  */
 
-import type { IDictionary } from '../../types';
-
-const class2type: IDictionary<string> = {};
-const toString = class2type.toString;
-export const hasOwn = class2type.hasOwnProperty;
-
-[
-	'Boolean',
-	'Number',
-	'String',
-	'Function',
-	'Array',
-	'Date',
-	'RegExp',
-	'Object',
-	'Error',
-	'Symbol',
-	'HTMLDocument',
-	'Window',
-	'HTMLElement',
-	'HTMLBodyElement',
-	'Text',
-	'DocumentFragment',
-	'DOMStringList',
-	'HTMLCollection'
-].forEach(name => {
-	class2type['[object ' + name + ']'] = name.toLowerCase();
-});
-
-/**
- * Get name object's type
- * @param obj
- */
-export const type = (obj: any): string => {
-	// eslint-disable-next-line eqeqeq
-	if (obj === null) {
-		return 'null';
-	}
-
-	return typeof obj === 'object' || typeof obj === 'function'
-		? class2type[toString.call(obj)] || 'object'
-		: typeof obj;
-};
-
 /**
  * Helper for create Error object
  * @param message

package/src/core/helpers/utils/utils.ts

@@ -181,7 +181,7 @@ export const keys = (obj: object, own: boolean = true): string[] => {
 		return Object.keys(obj);
 	}
 
-	const props = [];
+	const props: string[] = [];
 
 	for (const key in obj) {
 		props.push(key);

package/src/core/plugin.ts

@@ -13,6 +13,8 @@ export abstract class Plugin<T extends IViewBased = IJodit>
 	extends ViewComponent<T>
 	implements IPlugin<T>
 {
+	requires: string[] = [];
+
 	/** @override */
 	buttons: IPlugin['buttons'] = [];
 
@@ -52,7 +54,7 @@ export abstract class Plugin<T extends IViewBased = IJodit>
 	}
 
 	@autobind
-	destruct(): void {
+	override destruct(): void {
 		if (!this.isInDestruct) {
 			this.setStatus(STATUSES.beforeDestruct);
 

package/src/core/ui/button/button/button.ts

@@ -184,7 +184,7 @@ export class UIButton extends UIElement implements IUIButton {
 	}
 
 	/** @override */
-	protected createContainer(): HTMLElement {
+	protected override createContainer(): HTMLElement {
 		const cn = this.componentName;
 
 		const button = this.j.c.element('button', {
@@ -219,7 +219,7 @@ export class UIButton extends UIElement implements IUIButton {
 		}
 	}
 
-	destruct(): any {
+	override destruct(): any {
 		this.j.e.off(this.container);
 		return super.destruct();
 	}

package/src/core/ui/button/group/group.ts

@@ -18,15 +18,15 @@ import { UIButton } from '../button/button';
 
 @component
 export class UIButtonGroup extends UIGroup {
-	elements!: IUIButton[];
+	override elements!: IUIButton[];
 
 	/** @override */
-	className(): string {
+	override className(): string {
 		return 'UIButtonGroup';
 	}
 
 	/** @override */
-	protected render(options: IDictionary): string {
+	protected override render(options: IDictionary): string {
 		return `<div>
 			<div class="&__label">~${options.label}~</div>
 			<div class="&__options"></div>
@@ -34,7 +34,9 @@ export class UIButtonGroup extends UIGroup {
 	}
 
 	/** @override */
-	protected appendChildToContainer(childContainer: HTMLElement): void {
+	protected override appendChildToContainer(
+		childContainer: HTMLElement
+	): void {
 		this.getElm('options').appendChild(childContainer);
 	}
 

package/src/core/ui/element.ts

@@ -55,7 +55,7 @@ export abstract class UIElement<T extends IViewBased = IViewBased>
 	}
 
 	/** @override */
-	get<T>(chain: string, obj?: IDictionary): Nullable<T> {
+	override get<T>(chain: string, obj?: IDictionary): Nullable<T> {
 		return super.get(chain, obj) || (this.getElm(chain) as unknown as T);
 	}
 
@@ -198,7 +198,7 @@ export abstract class UIElement<T extends IViewBased = IViewBased>
 	}
 
 	/** @override */
-	destruct(): any {
+	override destruct(): any {
 		Dom.safeRemove(this.container);
 		this.parentElement = null;
 		return super.destruct();

package/src/core/ui/form/block/block.ts

@@ -14,7 +14,7 @@ import { component } from '../../../decorators';
 @component
 export class UIBlock extends UIGroup {
 	/** @override */
-	className(): string {
+	override className(): string {
 		return 'UIBlock';
 	}