jodit 3.15.2 → 3.16.2

package/src/core/decorators/debounce/debounce.ts

@@ -34,8 +34,9 @@ export function debounce<V = IViewComponent | IViewBased>(
 	return <T extends Component & IDictionary>(
 		target: IDictionary,
 		propertyKey: string
-	): void => {
-		if (!isFunction(target[propertyKey])) {
+	): PropertyDescriptor => {
+		const fn = target[propertyKey];
+		if (!isFunction(fn)) {
 			throw error('Handler must be a Function');
 		}
 
@@ -48,14 +49,24 @@ export function debounce<V = IViewComponent | IViewBased>(
 				? timeout(component)
 				: timeout;
 
-			(component as any)[propertyKey] = view.async[method](
-				(component as any)[propertyKey].bind(component),
-				isNumber(realTimeout) || isPlainObject(realTimeout)
-					? realTimeout
-					: view.defaultTimeout,
-				firstCallImmediately
-			);
+			Object.defineProperty(component, propertyKey, {
+				configurable: true,
+				value: view.async[method](
+					(component as any)[propertyKey].bind(component),
+					isNumber(realTimeout) || isPlainObject(realTimeout)
+						? realTimeout
+						: view.defaultTimeout,
+					firstCallImmediately
+				)
+			});
 		});
+
+		return {
+			configurable: true,
+			get(): typeof fn {
+				return fn.bind(this);
+			}
+		};
 	};
 }
 

package/src/core/decorators/idle/README.md

@@ -1 +1,15 @@
 Wrap function in [[Async.requestIdleCallback]] wrapper
+
+```ts
+import { component, idle } from 'jodit/src/core/decorators';
+import { UIElement } from 'jodit/src/ui';
+
+@component
+class SomeClass extends UIElement {
+    @idle
+    runIdle(): void {
+		    // Do some havy work
+		    this.runIdle(); // This will work and won't go into stack depth error and break the main thread
+    }
+}
+```

package/src/core/decorators/idle/idle.ts

@@ -35,7 +35,7 @@ export function idle<V = IViewComponent | IViewBased>(): DecoratorHandler {
 
 			const originalMethod = (component as any)[propertyKey];
 
-			(component as any)[propertyKey] = (...args: unknown[]) =>
+			(component as any)[propertyKey] = (...args: unknown[]): number =>
 				view.async.requestIdleCallback(
 					originalMethod.bind(component, ...args)
 				);

package/src/core/decorators/watch/watch.ts

@@ -56,7 +56,7 @@ export function watch(
 			throw error('Handler must be a Function');
 		}
 
-		const process = (component: IComponent) => {
+		const process = (component: IComponent): void => {
 			const callback = (key: string, ...args: any[]): void | any => {
 				if (!component.isInDestruct) {
 					return (component as any)[propertyKey](key, ...args);
@@ -66,6 +66,7 @@ export function watch(
 			splitArray(observeFields).forEach(field => {
 				if (/:/.test(field)) {
 					const [objectPath, eventName] = field.split(':');
+					let ctx = context;
 
 					const view = isViewObject(component)
 						? component
@@ -73,22 +74,22 @@ export function watch(
 
 					if (objectPath.length) {
 						// eslint-disable-next-line @typescript-eslint/no-non-null-assertion
-						context = component.get<CanUndef<object>>(objectPath)!;
+						ctx = component.get<CanUndef<object>>(objectPath)!;
 					}
 
-					if (isFunction(context)) {
-						context = context(component);
+					if (isFunction(ctx)) {
+						ctx = ctx(component);
 					}
 
-					view.events.on(context || component, eventName, callback);
+					view.events.on(ctx || component, eventName, callback);
 
-					if (!context) {
+					if (!ctx) {
 						view.events.on(eventName, callback);
 					}
 
 					view.hookStatus('beforeDestruct', () => {
 						view.events
-							.off(context || component, eventName, callback)
+							.off(ctx || component, eventName, callback)
 							.off(eventName, callback);
 					});
 

package/src/core/dom/README.md

@@ -13,3 +13,45 @@ Dom.before(elm, div);
 The rest of the methods can be found in the [[Dom | documentation]]
 
 > All module methods are static. So you don't need an instance to use them.
+
+The module also includes the [[LazyWalker]] class. It is convenient for cases when it is necessary to go through
+the entire tree of elements, but this must be done without stopping the main thread of execution.
+For example, your plugin can search for some nodes, or text. If each time you run through the entire tree in a loop,
+then the interface will noticeably slow down on large documents. To avoid this, this class is made.
+
+```js
+const walker = new Jodit.modules.LazyWalker(new Jodit.modules.Async(), 100);
+const names = [];
+
+walker
+  .on('visit', node => {
+    names.push(node.nodeName.toLowerCase());
+  })
+  .on('end', () => {
+    expect(names).deep.eq([
+      'div',
+      'ul',
+      'li',
+      'strong',
+      '#text',
+      'span',
+      '#text',
+      'u',
+      '#text',
+      'li',
+      'i',
+      '#text',
+      'b',
+      '#text',
+      'u',
+      '#text',
+      'img'
+    ]);
+    done();
+  });
+
+const div = document.createElement('div');
+div.innerHTML =
+  "<ul><li><strong>test</strong><span>test</span><u>test</u></li><li><i>test</i><b>test</b><u>test</u><img src='' alt=''></li></ul>";
+walker.setWork(div);
+```

package/src/core/dom/dom.ts

@@ -111,29 +111,40 @@ export class Dom {
 		return wrapper as HTMLElement;
 	}
 
-	/**
-	 * Wrap node inside another node
-	 */
 	static wrap<K extends HTMLTagNames>(
-		current: Node,
+		current: Node | Range,
+		tag: HTMLElement,
+		create: ICreate
+	): HTMLElementTagNameMap[K];
+
+	static wrap<K extends HTMLTagNames>(
+		current: Node | Range,
 		tag: K,
 		create: ICreate
 	): HTMLElementTagNameMap[K];
 
+	/**
+	 * Wrap node inside another node
+	 */
 	static wrap(
-		current: Node,
+		current: Node | Range,
 		tag: HTMLElement | HTMLTagNames,
 		create: ICreate
 	): HTMLElement {
 		const wrapper = isString(tag) ? create.element(tag) : tag;
 
-		if (!current.parentNode) {
-			throw error('Element should be in DOM');
-		}
-
-		current.parentNode.insertBefore(wrapper, current);
+		if (Dom.isNode(current)) {
+			if (!current.parentNode) {
+				throw error('Element should be in DOM');
+			}
 
-		wrapper.appendChild(current);
+			current.parentNode.insertBefore(wrapper, current);
+			wrapper.appendChild(current);
+		} else {
+			const fragment = current.extractContents();
+			current.insertNode(wrapper);
+			wrapper.appendChild(fragment);
+		}
 
 		return wrapper;
 	}
@@ -597,10 +608,6 @@ export class Dom {
 		while (stack.length) {
 			const item = <Node>stack.pop();
 
-			if (start !== item) {
-				yield item;
-			}
-
 			if (withChild) {
 				let child = leftToRight ? item.lastChild : item.firstChild;
 
@@ -611,6 +618,10 @@ export class Dom {
 						: child.nextSibling;
 				}
 			}
+
+			if (start !== item) {
+				yield item;
+			}
 		}
 	}
 
@@ -663,7 +674,8 @@ export class Dom {
 	static findSibling(
 		node: Node,
 		left: boolean = true,
-		cond: (n: Node) => boolean = (n: Node) => !Dom.isEmptyTextNode(n)
+		cond: (n: Node) => boolean = (n: Node): boolean =>
+			!Dom.isEmptyTextNode(n)
 	): Nullable<Node> {
 		let sibling = Dom.sibling(node, left);
 
@@ -674,7 +686,7 @@ export class Dom {
 		return sibling && cond(sibling) ? sibling : null;
 	}
 
-	static sibling(node: Node, left: boolean): Nullable<Node> {
+	static sibling(node: Node, left?: boolean): Nullable<Node> {
 		return left ? node.previousSibling : node.nextSibling;
 	}
 
@@ -746,14 +758,16 @@ export class Dom {
 		if (isFunction(tagsOrCondition)) {
 			condition = tagsOrCondition;
 		} else if (isArray(tagsOrCondition)) {
-			condition = (tag: Node | null) =>
-				tag &&
-				tagsOrCondition.includes(
-					tag.nodeName.toLowerCase() as HTMLTagNames
+			condition = (tag: Node | null): boolean =>
+				Boolean(
+					tag &&
+						tagsOrCondition.includes(
+							tag.nodeName.toLowerCase() as HTMLTagNames
+						)
 				);
 		} else {
-			condition = (tag: Node | null) =>
-				tag && tagsOrCondition === tag.nodeName.toLowerCase();
+			condition = (tag: Node | null): boolean =>
+				Boolean(tag && tagsOrCondition === tag.nodeName.toLowerCase());
 		}
 
 		return Dom.up(node, condition, root);

package/src/core/dom/index.ts

@@ -9,3 +9,4 @@
  */
 
 export * from './dom';
+export * from './lazy-walker';

package/src/core/dom/lazy-walker.ts

@@ -0,0 +1,133 @@
+/*!
+ * Jodit Editor (https://xdsoft.net/jodit/)
+ * Released under MIT see LICENSE.txt in the project root for license information.
+ * Copyright (c) 2013-2022 Valeriy Chupurnov. All rights reserved. https://xdsoft.net
+ */
+
+/**
+ * @module dom
+ */
+
+import type { IAsync, IDestructible } from 'jodit/types';
+import type { Nullable, CanUndef } from 'jodit/types';
+import { Eventify } from 'jodit/core/event-emitter/eventify';
+import { autobind } from 'jodit/core/decorators';
+import { Dom } from 'jodit/core/dom/dom';
+
+export class LazyWalker
+	extends Eventify<{
+		visit: (node: Node) => boolean;
+		break: (reason?: string) => void;
+		end: (affect: boolean) => void;
+	}>
+	implements IDestructible
+{
+	private workNodes: Nullable<Generator<Node>> = null;
+
+	setWork(root: Node): this {
+		if (this.isWorked) {
+			this.break();
+		}
+
+		this.workNodes = Dom.eachGen(root, !this.options.reverse);
+
+		this.isFinished = false;
+		this.startIdleRequest();
+		return this;
+	}
+
+	private hadAffect: boolean = false;
+	private isWorked: boolean = false;
+	private isFinished: boolean = false;
+
+	constructor(
+		private readonly async: IAsync,
+		private readonly options: {
+			readonly timeout?: number;
+			readonly whatToShow?: number;
+			readonly reverse?: boolean;
+			readonly timeoutChunkSize?: number;
+		} = {}
+	) {
+		super();
+	}
+
+	private idleId: number = 0;
+
+	private startIdleRequest(): void {
+		this.idleId = this.async.requestIdleCallback(this.workPerform, {
+			timeout: this.options.timeout ?? 10
+		});
+	}
+
+	break(reason?: string): void {
+		if (this.isWorked) {
+			this.stop();
+			this.emit('break', reason);
+		}
+	}
+
+	end(): void {
+		if (this.isWorked) {
+			this.stop();
+			this.emit('end', this.hadAffect);
+			this.hadAffect = false;
+		}
+	}
+
+	private stop(): void {
+		this.isWorked = false;
+		this.isFinished = true;
+		this.workNodes = null;
+		this.async.cancelIdleCallback(this.idleId);
+	}
+
+	destruct(): void {
+		this.stop();
+	}
+
+	@autobind
+	private workPerform(deadline: IdleDeadline): void {
+		if (this.workNodes) {
+			this.isWorked = true;
+
+			let count = 0;
+			const chunkSize = this.options.timeoutChunkSize ?? 50;
+
+			while (
+				!this.isFinished &&
+				(deadline.timeRemaining() > 0 ||
+					(deadline.didTimeout && count <= chunkSize))
+			) {
+				const item = this.workNodes.next();
+				count += 1;
+				if (this.visitNode(item.value)) {
+					this.hadAffect = true;
+				}
+
+				if (item.done) {
+					this.end();
+					return;
+				}
+			}
+		} else {
+			this.end();
+		}
+
+		if (!this.isFinished) {
+			this.startIdleRequest();
+		}
+	}
+
+	private visitNode(nodeElm: CanUndef<Nullable<Element | Node>>): boolean {
+		if (
+			!nodeElm ||
+			(this.options.whatToShow !== undefined &&
+				nodeElm.nodeType !== this.options.whatToShow)
+		) {
+			return false;
+		}
+
+		return this.emit('visit', nodeElm) ?? false;
+	}
+}

package/src/core/event-emitter/event-emitter.ts

@@ -52,7 +52,7 @@ export class EventEmitter implements IEventEmitter {
 	private eachEvent(
 		events: string,
 		callback: (event: string, namespace: string) => void
-	) {
+	): void {
 		const eventParts: string[] = events.split(/[\s,]+/);
 
 		eventParts.forEach((eventNameSpace: string) => {
@@ -82,7 +82,7 @@ export class EventEmitter implements IEventEmitter {
 		return subject[this.__key];
 	}
 
-	private clearStore(subject: any) {
+	private clearStore(subject: any): void {
 		if (subject[this.__key] !== undefined) {
 			delete subject[this.__key];
 		}
@@ -90,7 +90,7 @@ export class EventEmitter implements IEventEmitter {
 
 	private prepareEvent = (
 		event: TouchEvent | MouseEvent | ClipboardEvent
-	) => {
+	): void => {
 		if (event.cancelBubble) {
 			return;
 		}
@@ -133,7 +133,7 @@ export class EventEmitter implements IEventEmitter {
 	private triggerNativeEvent(
 		element: Document | Element | HTMLElement | Window,
 		event: string | Event | MouseEvent
-	) {
+	): void {
 		const evt: Event = this.doc.createEvent('HTMLEvents');
 
 		if (typeof event === 'string') {
@@ -365,7 +365,7 @@ export class EventEmitter implements IEventEmitter {
 			callback = eventsOrCallback as CallbackFunction;
 		}
 
-		const newCallback = (...args: any) => {
+		const newCallback = (...args: any): void => {
 			this.off(subject, events, newCallback);
 			return callback(...args);
 		};
@@ -439,7 +439,7 @@ export class EventEmitter implements IEventEmitter {
 		}
 
 		const isDOMElement = isFunction((subject as any).removeEventListener),
-			removeEventListener = (block: EventHandlerBlock) => {
+			removeEventListener = (block: EventHandlerBlock): void => {
 				if (isDOMElement) {
 					(subject as HTMLElement).removeEventListener(
 						block.event,
@@ -451,7 +451,7 @@ export class EventEmitter implements IEventEmitter {
 			removeCallbackFromNameSpace = (
 				event: string,
 				namespace: string
-			) => {
+			): void => {
 				if (event !== '') {
 					const blocks: EventHandlerBlock[] | void = store.get(
 						event,
@@ -540,7 +540,7 @@ export class EventEmitter implements IEventEmitter {
 
 	private __stopped: EventHandlerBlock[][] = [];
 
-	private removeStop(currentBlocks: EventHandlerBlock[]) {
+	private removeStop(currentBlocks: EventHandlerBlock[]): void {
 		if (currentBlocks) {
 			const index: number = this.__stopped.indexOf(currentBlocks);
 			index !== -1 && this.__stopped.splice(0, index + 1);

package/src/core/event-emitter/eventify.ts

@@ -0,0 +1,73 @@
+/*!
+ * Jodit Editor (https://xdsoft.net/jodit/)
+ * Released under MIT see LICENSE.txt in the project root for license information.
+ * Copyright (c) 2013-2022 Valeriy Chupurnov. All rights reserved. https://xdsoft.net
+ */
+
+/**
+ * @module event-emitter
+ */
+
+import type { CanUndef } from 'jodit/types';
+
+/**
+ * Class for adding event handling capability
+ *
+ * ```ts
+ * class SomeClass extends Eventify<{ start: (node: Node) => boolean; }> {
+ * 	constructor() {
+ * 		super();
+ * 		setTimeout(() => {
+ * 			if (this.emit('start', document.body)) {
+ * 				console.log('yes');
+ * 			};
+ * 		}, 100);
+ * 	}
+ * }
+ *
+ * const sm = new SomeClass();
+ * sm.on('start', (node) => {
+ * 	console.log(node);
+ * 	return true;
+ * })
+ * ```
+ */
+export abstract class Eventify<
+	MAP extends { [key: string]: (...args: any[]) => any },
+	EVENT extends keyof MAP = keyof MAP
+> {
+	private map: Map<keyof MAP, Set<Function>> = new Map();
+
+	on(name: EVENT, func: MAP[EVENT]): this {
+		if (!this.map.has(name)) {
+			this.map.set(name, new Set());
+		}
+
+		this.map.get(name)?.add(func);
+
+		return this;
+	}
+
+	off(name: keyof MAP, func: MAP[EVENT]): this {
+		if (this.map.has(name)) {
+			this.map.get(name)?.delete(func);
+		}
+
+		return this;
+	}
+
+	protected emit(
+		name: EVENT,
+		...args: Parameters<MAP[EVENT]>
+	): CanUndef<ReturnType<MAP[EVENT]>> {
+		let result: CanUndef<ReturnType<MAP[EVENT]>>;
+
+		if (this.map.has(name)) {
+			this.map.get(name)?.forEach(cb => {
+				result = cb(...args);
+			});
+		}
+
+		return result;
+	}
+}

package/src/core/event-emitter/index.ts

@@ -9,5 +9,6 @@
  */
 
 export * from './event-emitter';
+export * from './eventify';
 export * from './observable';
 export * from './store';

package/src/core/helpers/html/apply-styles.ts

@@ -12,7 +12,7 @@ import { Dom } from 'jodit/core/dom';
 import { $$ } from 'jodit/core/helpers/utils';
 import { trim } from '../string';
 
-function normalizeCSS(s: string) {
+function normalizeCSS(s: string): string {
 	return s
 		.replace(/mso-[a-z-]+:[\s]*[^;]+;/gi, '')
 		.replace(/mso-[a-z-]+:[\s]*[^";']+$/gi, '')

package/src/core/helpers/html/strip-tags.ts

@@ -63,8 +63,9 @@ export function safeHTML(
 		return;
 	}
 
-	const removeOnError = (elm: HTMLElement) => attr(elm, 'onerror', null),
-		safeLink = (elm: HTMLElement) => {
+	const removeOnError = (elm: HTMLElement): void =>
+			attr(elm, 'onerror', null),
+		safeLink = (elm: HTMLElement): void => {
 			const href = elm.getAttribute('href');
 
 			if (href && href.trim().indexOf('javascript') === 0) {

package/src/core/helpers/string/fuzzy-search-index.ts

@@ -0,0 +1,58 @@
+/*!
+ * Jodit Editor (https://xdsoft.net/jodit/)
+ * Released under MIT see LICENSE.txt in the project root for license information.
+ * Copyright (c) 2013-2022 Valeriy Chupurnov. All rights reserved. https://xdsoft.net
+ */
+
+/**
+ * @module helpers/string
+ */
+
+import { INVISIBLE_SPACE } from 'jodit/core/constants';
+
+/**
+ * Finds the position of the substring in the string, if any, and returns the length of the found subsequence.
+ * Unlike `indexOf` ignores INVISIBLE_SPACE and may fail at `maxDistance` characters
+ */
+export function fuzzySearchIndex(
+	needle: string,
+	haystack: string,
+	offset: number = 0,
+	maxDistance: number = 1
+): [number, number] {
+	let i = 0,
+		j = 0,
+		startIndex = -1,
+		len = 0,
+		errorDistance = 0;
+
+	for (j = offset; i < needle.length && j < haystack.length; ) {
+		if (needle[i].toLowerCase() === haystack[j].toLowerCase()) {
+			i++;
+			len++;
+			errorDistance = 0;
+
+			if (startIndex === -1) {
+				startIndex = j;
+			}
+		} else if (i > 0) {
+			if (
+				errorDistance >= maxDistance &&
+				haystack[j] !== INVISIBLE_SPACE
+			) {
+				i = 0;
+				startIndex = -1;
+				len = 0;
+				errorDistance = 0;
+				j--;
+			} else {
+				errorDistance++;
+				len++;
+			}
+		}
+
+		j++;
+	}
+
+	return i === needle.length ? [startIndex, len] : [-1, 0];
+}

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

@@ -46,7 +46,7 @@ export const sprintf = (str: string, args?: Array<string | number>): string => {
  * Internationalization method. Uses Jodit.lang object
  * @example
  * ```javascript
- * var editor = new Jodit("#redactor", {
+ * var editor = Jodit.make("#redactor", {
  *      language: 'ru'
  * });
  * console.log(editor.i18n('Cancel')) //Отмена;

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

@@ -9,8 +9,9 @@
  */
 
 export * from './camel-case';
-export * from './stringify';
+export * from './fuzzy-search-index';
+export * from './i18n';
 export * from './kebab-case';
+export * from './stringify';
 export * from './trim';
 export * from './ucfirst';
-export * from './i18n';

package/src/core/helpers/utils/append-script.ts

@@ -88,7 +88,7 @@ export const appendStyleAsync = cacheLoaders(
 			link.media = 'all';
 			link.crossOrigin = 'anonymous';
 
-			const callback = () => resolve(link);
+			const callback = (): void => resolve(link);
 
 			!jodit.isInDestruct &&
 				jodit.e.on(link, 'load', callback).on(link, 'error', reject);

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

@@ -62,7 +62,7 @@ export function css(
 			elm: HTMLElement,
 			_key: string,
 			_value: StyleValue
-		) => {
+		): void => {
 			if (
 				!isVoid(_value) &&
 				numberFieldsReg.test(_key) &&