jodit 3.8.8 → 3.9.2

package/src/core/request/config.ts

@@ -0,0 +1,37 @@
+/*!
+ * 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 { AjaxOptions } from '../../types';
+import { Config } from '../../config';
+
+declare module '../../config' {
+	interface Config {
+		/**
+		 * A set of key/value pairs that configure the Ajax request. All settings are optional
+		 */
+		defaultAjaxOptions: AjaxOptions;
+	}
+}
+
+Config.prototype.defaultAjaxOptions = {
+	successStatuses: [200, 201, 202],
+
+	dataType: 'json',
+	method: 'GET',
+	url: '',
+	data: null,
+	contentType: 'application/x-www-form-urlencoded; charset=UTF-8',
+
+	headers: {
+		'X-REQUESTED-WITH': 'XMLHttpRequest' // compatible with jQuery
+	},
+
+	withCredentials: false,
+
+	xhr(): XMLHttpRequest {
+		return new XMLHttpRequest();
+	}
+} as AjaxOptions;

package/{build-system/minimizer/index.js → src/core/request/index.ts}

@@ -4,4 +4,5 @@
  * Copyright (c) 2013-2021 Valeriy Chupurnov. All rights reserved. https://xdsoft.net
  */
 
-module.exports = [require('./js'), require('./css')];
+export * from './ajax';
+export * from './response';

package/src/core/request/response.ts

@@ -0,0 +1,39 @@
+/*!
+ * 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 { IRequest, IResponse } from '../../types';
+
+export class Response<T> implements IResponse<T> {
+	readonly status: number;
+	readonly statusText: string;
+
+	readonly request: IRequest;
+	get url(): string {
+		return this.request.url;
+	}
+
+	private readonly body: string;
+
+	constructor(
+		request: IRequest,
+		status: number,
+		statusText: string,
+		body: string
+	) {
+		this.request = request;
+		this.status = status;
+		this.statusText = statusText;
+		this.body = body;
+	}
+
+	async json(): Promise<T> {
+		return JSON.parse(this.body);
+	}
+
+	text(): Promise<string> {
+		return Promise.resolve(this.body);
+	}
+}

package/src/core/selection/select.ts

@@ -760,42 +760,74 @@ export class Select implements ISelect {
 		if (sel && sel.rangeCount) {
 			const range = sel.getRangeAt(0);
 
+			let root = range.commonAncestorContainer;
+
+			if (!Dom.isHTMLElement(root)) {
+				root = root.parentElement as HTMLElement;
+			}
+
 			const nodes: Node[] = [],
 				startOffset = range.startOffset,
-				length = this.area.childNodes.length,
-				elementOffset = startOffset < length ? startOffset : length - 1,
-				start: Node =
+				length = root.childNodes.length,
+				elementOffset = startOffset < length ? startOffset : length - 1;
+
+			let start: Node =
 					range.startContainer === this.area
-						? this.area.childNodes[elementOffset]
+						? root.childNodes[elementOffset]
 						: range.startContainer,
 				end: Node =
 					range.endContainer === this.area
-						? this.area.childNodes[range.endOffset - 1]
+						? root.childNodes[range.endOffset - 1]
 						: range.endContainer;
 
-			Dom.find(
-				start,
-				(node: Node | null) => {
-					if (
-						node &&
-						node !== this.area &&
-						!Dom.isEmptyTextNode(node) &&
-						!Select.isMarker(node as HTMLElement)
-					) {
-						nodes.push(node);
-					}
+			if (
+				Dom.isText(start) &&
+				start === range.startContainer &&
+				range.startOffset === start.nodeValue?.length &&
+				start.nextSibling
+			) {
+				start = start.nextSibling;
+			}
 
-					// checks parentElement as well because partial selections are not equal to entire element
-					return (
-						node === end ||
-						(node && node.contains && node.contains(end))
-					);
-				},
-				this.area,
-				true,
-				'nextSibling',
-				false
-			);
+			if (
+				Dom.isText(end) &&
+				end === range.endContainer &&
+				range.endOffset === 0 &&
+				end.previousSibling
+			) {
+				end = end.previousSibling;
+			}
+
+			const checkElm = (node: Nullable<Node>) => {
+				if (
+					node &&
+					node !== root &&
+					!Dom.isEmptyTextNode(node) &&
+					!Select.isMarker(node as HTMLElement)
+				) {
+					nodes.push(node);
+				}
+			};
+
+			checkElm(start);
+
+			if (start !== end) {
+				Dom.find(
+					start,
+					node => {
+						checkElm(node);
+
+						// checks parentElement as well because partial selections are not equal to entire element
+						return (
+							node === end ||
+							(node && node.contains && node.contains(end))
+						);
+					},
+					<HTMLElement>root,
+					true,
+					false
+				);
+			}
 
 			const forEvery = (current: Node): void => {
 				if (!Dom.isOrContains(this.j.editor, current, true)) {

package/src/core/selection/style/api/element-has-same-style.ts

@@ -29,3 +29,16 @@ export function elementHasSameStyle(elm: Node, rules: IStyle): boolean {
 			})
 	);
 }
+
+/**
+ * Element has the similar styles
+ */
+export function elementHasSameStyleKeys(elm: Node, rules: IStyle): boolean {
+	return Boolean(
+		!Dom.isTag(elm, 'font') &&
+			Dom.isHTMLElement(elm) &&
+			Object.keys(rules).every(
+				property => !isVoid(css(elm, property, true))
+			)
+	);
+}

package/src/core/selection/style/api/get-suit-parent.ts

@@ -25,7 +25,7 @@ export function getSuitParent(
 	const { parentNode } = node;
 
 	if (
-		parentNode &&
+		Dom.isHTMLElement(parentNode) &&
 		!Dom.next(node, isNormalNode, parentNode) &&
 		!Dom.prev(node, isNormalNode, parentNode) &&
 		isSuitElement(style, parentNode, false) &&

package/src/core/selection/style/api/is-suit-element.ts

@@ -6,7 +6,10 @@
 import type { Nullable } from '../../../../types';
 import type { CommitStyle } from '../commit-style';
 import { isNormalNode } from './is-normal-node';
-import { elementHasSameStyle } from './element-has-same-style';
+import {
+	elementHasSameStyle,
+	elementHasSameStyleKeys
+} from './element-has-same-style';
 import { Dom } from '../../../dom';
 
 /**
@@ -42,9 +45,26 @@ export function isSuitElement(
 		return true;
 	}
 
-	if (!elmIsSame && !strict && elementIsDefault && Dom.isInlineBlock(elm)) {
-		return true;
+	return Boolean(
+		!elmIsSame && !strict && elementIsDefault && Dom.isInlineBlock(elm)
+	);
+}
+
+export function isSameStyleChild(
+	commitStyle: CommitStyle,
+	elm: Nullable<Node>
+): elm is HTMLElement {
+	const { element, options } = commitStyle;
+
+	if (!elm || !isNormalNode(elm)) {
+		return false;
 	}
 
-	return false;
+	const elmIsSame = elm.nodeName.toLowerCase() === element;
+
+	const elmHasSameStyle = Boolean(
+		options.style && elementHasSameStyleKeys(elm, options.style)
+	);
+
+	return elmIsSame && elmHasSameStyle;
 }

package/src/core/selection/style/api/unwrap-children.ts

@@ -6,39 +6,68 @@
 
 import type { CommitStyle } from '../commit-style';
 import { Dom } from '../../../dom';
-import { isSuitElement } from './is-suit-element';
+import { isSameStyleChild, isSuitElement } from './is-suit-element';
+import { attr, css } from '../../../helpers';
+import type { IDictionary } from '../../../../types';
 
 /**
  * Unwrap all suit elements inside
  */
 export function unwrapChildren(style: CommitStyle, font: HTMLElement): boolean {
 	const needUnwrap: Node[] = [];
+	const needChangeStyle: any[] = [];
 
 	let firstElementSuit: boolean | undefined;
 
+	const cssStyle = style.options.style;
+
 	if (font.firstChild) {
-		Dom.find(
-			font.firstChild,
-			(elm: Node | null) => {
-				if (elm && isSuitElement(style, elm as HTMLElement, true)) {
-					if (firstElementSuit === undefined) {
-						firstElementSuit = true;
+		const gen = Dom.eachGen(font);
+
+		let item = gen.next();
+
+		while (!item.done) {
+			const elm = item.value;
+
+			if (isSuitElement(style, elm as HTMLElement, true)) {
+				if (firstElementSuit === undefined) {
+					firstElementSuit = true;
+				}
+
+				needUnwrap.push(elm);
+			} else if (cssStyle && isSameStyleChild(style, elm)) {
+				if (firstElementSuit === undefined) {
+					firstElementSuit = false;
+				}
+
+				needChangeStyle.push(() => {
+					css(
+						elm,
+						Object.keys(cssStyle).reduce((acc, key) => {
+							acc[key] = null;
+							return acc;
+						}, <IDictionary>{})
+					);
+
+					if (!attr(elm, 'style')) {
+						attr(elm, 'style', null);
 					}
 
-					needUnwrap.push(elm);
-				} else {
-					if (firstElementSuit === undefined) {
-						firstElementSuit = false;
+					if (elm.nodeName.toLowerCase() === style.element) {
+						needUnwrap.push(elm);
 					}
+				});
+			} else if (!Dom.isEmptyTextNode(elm)) {
+				if (firstElementSuit === undefined) {
+					firstElementSuit = false;
 				}
+			}
 
-				return false;
-			},
-			font,
-			true
-		);
+			item = gen.next();
+		}
 	}
 
+	needChangeStyle.forEach(clb => clb());
 	needUnwrap.forEach(Dom.unwrap);
 
 	return Boolean(firstElementSuit);

package/src/core/selection/style/api/wrap-unwrapped-text.ts

@@ -4,7 +4,7 @@
  * Copyright (c) 2013-2021 Valeriy Chupurnov. All rights reserved. https://xdsoft.net
  */
 
-import type { ICreate, Nullable } from '../../../../types';
+import type { IJodit, Nullable } from '../../../../types';
 import type { CommitStyle } from '../commit-style';
 import { Dom } from '../../../dom';
 import { postProcessListElement } from './post-process-list-element';
@@ -15,35 +15,40 @@ import { postProcessListElement } from './post-process-list-element';
 export function wrapUnwrappedText(
 	style: CommitStyle,
 	elm: Node,
-	root: HTMLElement,
-	ci: ICreate,
+	jodit: IJodit,
 	getRange: () => Range
 ): HTMLElement {
-	const edge = (n: Node, key: keyof Node = 'previousSibling') => {
-		let edgeNode: Node = n,
-			node: Nullable<Node> = n;
+	const root = jodit.editor,
+		ci = jodit.createInside,
+		edge = (n: Node, key: keyof Node = 'previousSibling') => {
+			let edgeNode: Node = n,
+				node: Nullable<Node> = n;
 
-		while (node) {
-			edgeNode = node;
+			while (node) {
+				if (Dom.isTag(node, jodit.o.enter)) {
+					break;
+				}
 
-			if (node[key]) {
-				node = node[key] as Nullable<Node>;
-			} else {
-				node =
-					node.parentNode &&
-					!Dom.isBlock(node.parentNode) &&
-					node.parentNode !== root
-						? node.parentNode
-						: null;
-			}
+				edgeNode = node;
+
+				if (node[key]) {
+					node = node[key] as Nullable<Node>;
+				} else {
+					node =
+						node.parentNode &&
+						!Dom.isBlock(node.parentNode) &&
+						node.parentNode !== root
+							? node.parentNode
+							: null;
+				}
 
-			if (Dom.isBlock(node)) {
-				break;
+				if (Dom.isBlock(node)) {
+					break;
+				}
 			}
-		}
 
-		return edgeNode;
-	};
+			return edgeNode;
+		};
 
 	const start: Node = edge(elm),
 		end: Node = edge(elm, 'nextSibling');

package/src/core/selection/style/apply-style.ts

@@ -4,7 +4,7 @@
  * Copyright (c) 2013-2021 Valeriy Chupurnov. All rights reserved. https://xdsoft.net
  */
 
-import type { ICreate, IJodit, Nullable } from '../../../types';
+import type { IJodit, Nullable } from '../../../types';
 import type { CommitStyle } from './commit-style';
 import { Dom } from '../../dom';
 import { attr, css, normalizeNode } from '../../helpers';
@@ -23,7 +23,7 @@ import {
  * Apply options to selection
  */
 export function ApplyStyle(jodit: IJodit, style: CommitStyle): void {
-	const { s: sel, editor: root, createInside: ci } = jodit,
+	const { s: sel } = jodit,
 		rng = () => sel.createRange();
 
 	let wrap: Nullable<boolean> = null;
@@ -36,7 +36,7 @@ export function ApplyStyle(jodit: IJodit, style: CommitStyle): void {
 	let font = gen.next();
 
 	while (!font.done) {
-		wrap = applyToElement(style, font.value, root, rng, ci, wrap);
+		wrap = applyToElement(style, font.value, rng, jodit, wrap);
 		font = gen.next();
 	}
 
@@ -50,11 +50,12 @@ export function ApplyStyle(jodit: IJodit, style: CommitStyle): void {
 function applyToElement(
 	style: CommitStyle,
 	font: HTMLElement,
-	root: HTMLElement,
 	range: () => Range,
-	ci: ICreate,
+	jodit: IJodit,
 	wrap: Nullable<boolean>
 ): Nullable<boolean> {
+	const root = jodit.editor;
+
 	if (checkSpecialElements(font, root)) {
 		return wrap;
 	}
@@ -105,16 +106,21 @@ function applyToElement(
 		if (box) {
 			wrapper = box;
 		} else {
-			wrapper = wrapUnwrappedText(style, font, root, ci, range);
+			wrapper = wrapUnwrappedText(style, font, jodit, range);
 		}
 	}
 
-	const newWrapper = Dom.replace(wrapper, style.element, ci, true);
+	const newWrapper = Dom.replace(
+		wrapper,
+		style.element,
+		jodit.createInside,
+		true
+	);
 
 	attr(newWrapper, 'size', null);
 
 	if (style.elementIsBlock) {
-		postProcessListElement(style, newWrapper, ci);
+		postProcessListElement(style, newWrapper, jodit.createInside);
 	}
 
 	if (style.options.style && style.elementIsDefault) {

package/src/core/traits/elms.ts

@@ -9,6 +9,7 @@ import { toArray } from '../helpers/array/to-array';
 
 export abstract class Elms implements IElms {
 	abstract getElm(elementName: string): HTMLElement;
+
 	abstract getElms(elementName: string): HTMLElement[];
 
 	/**

package/src/core/ui/helpers/get-control-type.ts

@@ -23,7 +23,9 @@ export function getControlType(
 ): IControlTypeStrong {
 	let buttonControl: IControlTypeStrong;
 
-	if (!controls) controls = Config.defaultOptions.controls;
+	if (!controls) {
+		controls = Config.defaultOptions.controls;
+	}
 
 	if (!isString(button)) {
 		buttonControl = { name: 'empty', ...ConfigFlatten(button) };

package/src/core/view/view.ts

@@ -29,7 +29,7 @@ import { BASE_PATH } from '../constants';
 import {
 	Component,
 	STATUSES,
-	EventsNative,
+	EventEmitter,
 	ProgressBar,
 	Create,
 	Dom,
@@ -124,7 +124,7 @@ export abstract class View extends Component implements IViewBased, Mods, Elms {
 		this.__container = container;
 	}
 
-	events!: EventsNative;
+	events!: EventEmitter;
 	get e(): this['events'] {
 		return this.events;
 	}
@@ -269,7 +269,7 @@ export abstract class View extends Component implements IViewBased, Mods, Elms {
 		this.initOptions(options);
 		this.initOwners();
 
-		this.events = new EventsNative(this.od);
+		this.events = new EventEmitter(this.od);
 		this.create = new Create(this.od);
 
 		this.container = this.c.div();

package/src/modules/context-menu/context-menu.ts

@@ -37,7 +37,7 @@ export class ContextMenu extends Popup implements IContextMenu {
 		actions: Array<false | IContextMenuAction>
 	): void {
 		const self = this,
-			content = this.j.c.div('jodit-context-menu__actions');
+			content = this.j.c.div(this.getFullElName('actions'));
 
 		if (!isArray(actions)) {
 			return;

package/src/modules/file-browser/README.MD

@@ -97,7 +97,7 @@ Jodit.make('#editor', {
 -   filebrowser.ajax.headers={} An object of additional header key/value pairs toWYSIWYG
     send along with requests using the `XMLHttpRequest` transport. The header `X-Requested-With: XMLHttpRequest`
     is always added, but its default `XMLHttpRequest` value can be changed here.
-    @property {object} filebrowser.resize Settings for AJAX connections toWYSIWYG the server toWYSIWYG resize
+    @property {object} `filebrowser.resize` Settings for AJAX connections toWYSIWYG the server toWYSIWYG resize
     image. By default, the uses {@link Jodit.defaultOptions.filebrowser.ajax|filebrowser.ajax} with argument
     action=create
 -   filebrowser.crop Settings for AJAX connections toWYSIWYG the server toWYSIWYG crop image.

package/src/modules/file-browser/data-provider.ts

@@ -29,7 +29,7 @@ import {
 	normalizeRelativePath,
 	set
 } from '../../core/helpers';
-import { Ajax } from '../../core/ajax';
+import { Ajax } from '../../core/request';
 import { autobind } from '../../core/decorators';
 import { FileBrowserItem } from './builders/item';
 
@@ -66,12 +66,10 @@ export default class DataProvider implements IFileBrowserDataProvider {
 		return this.options;
 	}
 
-	private ajaxInstances: Map<string, IAjax> = new Map();
+	private ajaxInstances: Map<string, IAjax<IFileBrowserAnswer>> = new Map();
 
-	protected get<T = IFileBrowserAnswer>(
-		name: keyof IFileBrowserOptions,
-		success?: (resp: IFileBrowserAnswer) => void,
-		error?: (error: Error) => void
+	protected get<T extends IFileBrowserAnswer = IFileBrowserAnswer>(
+		name: keyof IFileBrowserOptions
 	): Promise<T> {
 		const ai = this.ajaxInstances;
 
@@ -98,33 +96,27 @@ export default class DataProvider implements IFileBrowserDataProvider {
 			opts.data = opts.prepareData.call(this, opts.data as IDictionary);
 		}
 
-		const ajax = new Ajax(this.parent, opts);
-
-		let promise = ajax.send();
-
+		const ajax = new Ajax<T>(this.parent, opts);
 		ai.set(name, ajax);
 
-		promise = promise.then(resp => {
-			if (!this.isSuccess(resp)) {
-				throw new Error(this.getMessage(resp));
-			}
-
-			return resp;
-		});
-
-		if (success) {
-			promise = promise.then(success);
-		}
-
-		if (error) {
-			promise = promise.catch(error);
-		}
+		const promise = ajax.send();
 
-		return promise.finally(() => {
+		promise.finally(() => {
 			ajax.destruct();
 			ai.delete(name);
+
 			this.progressHandler(100);
 		});
+
+		return promise
+			.then(resp => resp.json())
+			.then(resp => {
+				if (resp && !this.isSuccess(resp)) {
+					throw new Error(this.getMessage(resp));
+				}
+
+				return resp;
+			});
 	}
 
 	private progressHandler = (ignore: number): void => {};
@@ -297,7 +289,7 @@ export default class DataProvider implements IFileBrowserDataProvider {
 	getPathByUrl(url: string): Promise<any> {
 		set('options.getLocalFileByUrl.data.url', url, this);
 
-		return this.get('getLocalFileByUrl', resp => {
+		return this.get('getLocalFileByUrl').then(resp => {
 			if (this.isSuccess(resp)) {
 				return resp.data;
 			}
@@ -396,10 +388,6 @@ export default class DataProvider implements IFileBrowserDataProvider {
 				resp = fr.process.call(this, resp);
 			}
 
-			if (!this.isSuccess(resp)) {
-				throw error(this.getMessage(resp));
-			}
-
 			return this.getMessage(resp);
 		});
 	}
@@ -457,10 +445,6 @@ export default class DataProvider implements IFileBrowserDataProvider {
 				resp = fr.process.call(self, resp);
 			}
 
-			if (!this.isSuccess(resp)) {
-				throw error(this.getMessage(resp));
-			}
-
 			return this.getMessage(resp);
 		});
 	}
@@ -496,7 +480,7 @@ export default class DataProvider implements IFileBrowserDataProvider {
 		name: string,
 		newname: string | void,
 		box: ImageBox | void
-	): Promise<boolean> {
+	): Promise<true> {
 		if (!this.o[type]) {
 			this.o[type] = {
 				data: {}
@@ -522,12 +506,8 @@ export default class DataProvider implements IFileBrowserDataProvider {
 		query.data.name = name;
 		query.data.source = source;
 
-		return this.get(type).then(resp => {
-			if (this.isSuccess(resp)) {
-				return true;
-			}
-
-			throw error(this.getMessage(resp));
+		return this.get(type).then(() => {
+			return true;
 		});
 	}