/**

tool: string;

/**

key: string;

/**

pattern: RegExp;

/**

tool: string;

/**

extensions: string[];

/**

mimeTypes: string[];

/**

tool: string;

/**

content: HTMLElement;

/**

event: PasteEvent;

/**

isBlock: boolean;

/** If string`s length is greater than this number we don't check paste patterns */

public static readonly PATTERN_PROCESSING_MAX_LENGTH = 450;

/** Custom EditorJS mime-type to handle in-editor copy/paste actions */

public readonly MIME_TYPE = 'application/x-editor-js';

/**

private toolsTags: {[tag: string]: TagSubstitute} = {};

/**

private tagsByTool: {[tools: string]: string[]} = {};

/** Patterns` substitutions parameters */

private toolsPatterns: PatternSubstitute[] = [];

/** Files` substitutions parameters */

private toolsFiles: {

[tool: string]: FilesSubstitution;

} = {};

/**

private exceptionList: string[] = [];

/**

public async prepare(): Promise<void> {

this.setCallback();

this.processTools();

}

/**

public async processDataTransfer(dataTransfer: DataTransfer, isDragNDrop = false): Promise<void> {

const { Sanitizer } = this.Editor;

const types = dataTransfer.types;

/**

// eslint-disable-next-line @typescript-eslint/no-explicit-any

const includesFiles = types.includes ? types.includes('Files') : (types as any).contains('Files');

if (includesFiles) {

await this.processFiles(dataTransfer.files);

return;

}

const editorJSData = dataTransfer.getData(this.MIME_TYPE);

const plainData = dataTransfer.getData('text/plain');

let htmlData = dataTransfer.getData('text/html');

/**

if (editorJSData) {

try {

this.insertEditorJSData(JSON.parse(editorJSData));

return;

} catch (e) {} // Do nothing and continue execution as usual if error appears

}

/**

if (isDragNDrop && plainData.trim() && htmlData.trim()) {

htmlData = '<p>' + (htmlData.trim() ? htmlData : plainData) + '</p>';

}

/** Add all tags that can be substituted to sanitizer configuration */

const toolsTags = Object.keys(this.toolsTags).reduce((result, tag) => {

result[tag.toLowerCase()] = true;

return result;

}, {});

const customConfig = Object.assign({}, toolsTags, Sanitizer.getAllInlineToolsConfig(), { br: {} });

const cleanData = Sanitizer.clean(htmlData, customConfig);

/** If there is no HTML or HTML string is equal to plain one, process it as plain text */

if (!cleanData.trim() || cleanData.trim() === plainData || !$.isHTMLString(cleanData)) {

await this.processText(plainData);

} else {

await this.processText(cleanData, true);

}

}

/**

public async processText(data: string, isHTML = false): Promise<void> {

const { Caret, BlockManager, Tools } = this.Editor;

const dataToInsert = isHTML ? this.processHTML(data) : this.processPlain(data);

if (!dataToInsert.length) {

return;

}

if (dataToInsert.length === 1) {

if (!dataToInsert[0].isBlock) {

this.processInlinePaste(dataToInsert.pop());

} else {

this.processSingleBlock(dataToInsert.pop());

}

return;

}

const isCurrentBlockInitial = BlockManager.currentBlock && Tools.isInitial(BlockManager.currentBlock.tool);

const needToReplaceCurrentBlock = isCurrentBlockInitial && BlockManager.currentBlock.isEmpty;

dataToInsert.map(

async (content, i) => this.insertBlock(content, i === 0 && needToReplaceCurrentBlock)

);

if (BlockManager.currentBlock) {

Caret.setToBlock(BlockManager.currentBlock, Caret.positions.END);

}

}

/**

private setCallback(): void {

const { Listeners } = this.Editor;

Listeners.on(this.Editor.UI.nodes.holder, 'paste', this.handlePasteEvent);

}

/**

private processTools(): void {

const tools = this.Editor.Tools.blockTools;

Object.entries(tools).forEach(this.processTool);

}

/**

private processTool = ([name, tool]: [string, BlockToolConstructable]): void => {

try {

const toolInstance = new this.Editor.Tools.blockTools[name]({

api: this.Editor.API.methods,

config: {},

data: {},

}) as BlockTool;

if (tool.pasteConfig === false) {

this.exceptionList.push(name);

return;

}

if (typeof toolInstance.onPaste !== 'function') {

return;

}

const toolPasteConfig = tool.pasteConfig || {};

this.getTagsConfig(name, toolPasteConfig);

this.getFilesConfig(name, toolPasteConfig);

this.getPatternsConfig(name, toolPasteConfig);

} catch (e) {

_.log(

`Paste handling for «${name}» Tool hasn't been set up because of the error`,

'warn',

e

);

}

}

/**

private getTagsConfig(name: string, toolPasteConfig: PasteConfig): void {

const tags = toolPasteConfig.tags || [];

tags.forEach((tag) => {

if (Object.prototype.hasOwnProperty.call(this.toolsTags, tag)) {

_.log(

`Paste handler for «${name}» Tool on «${tag}» tag is skipped ` +

`because it is already used by «${this.toolsTags[tag].tool}» Tool.`,

'warn'

);

return;

}

this.toolsTags[tag.toUpperCase()] = {

tool: name,

};

});

this.tagsByTool[name] = tags.map((t) => t.toUpperCase());

}

/**

private getFilesConfig(name: string, toolPasteConfig: PasteConfig): void {

const { files = {} } = toolPasteConfig;

let { extensions, mimeTypes } = files;

if (!extensions && !mimeTypes) {

return;

}

if (extensions && !Array.isArray(extensions)) {

_.log(`«extensions» property of the onDrop config for «${name}» Tool should be an array`);

extensions = [];

}

if (mimeTypes && !Array.isArray(mimeTypes)) {

_.log(`«mimeTypes» property of the onDrop config for «${name}» Tool should be an array`);

mimeTypes = [];

}

if (mimeTypes) {

mimeTypes = mimeTypes.filter((type) => {

if (!_.isValidMimeType(type)) {

_.log(`MIME type value «${type}» for the «${name}» Tool is not a valid MIME type`, 'warn');

return false;

}

return true;

});

}

this.toolsFiles[name] = {

extensions: extensions || [],

mimeTypes: mimeTypes || [],

};

}

/**

private getPatternsConfig(name: string, toolPasteConfig: PasteConfig): void {

if (!toolPasteConfig.patterns || _.isEmpty(toolPasteConfig.patterns)) {

return;

}

Object.entries(toolPasteConfig.patterns).forEach(([key, pattern]: [string, RegExp]) => {

/** Still need to validate pattern as it provided by user */

if (!(pattern instanceof RegExp)) {

_.log(

`Pattern ${pattern} for «${name}» Tool is skipped because it should be a Regexp instance.`,

'warn'

);

}

this.toolsPatterns.push({

key,

pattern,

tool: name,

});

});

}

/**

private isNativeBehaviour(element: EventTarget): boolean {

return $.isNativeInput(element);

}

/**

private handlePasteEvent = async (event: ClipboardEvent): Promise<void> => {

const { BlockManager, Toolbar } = this.Editor;

/** If target is native input or is not Block, use browser behaviour */

if (

!BlockManager.currentBlock || (this.isNativeBehaviour(event.target) && !event.clipboardData.types.includes('Files'))

) {

return;

}

/**

if (BlockManager.currentBlock && this.exceptionList.includes(BlockManager.currentBlock.name)) {

return;

}

event.preventDefault();

this.processDataTransfer(event.clipboardData);

BlockManager.clearFocused();

Toolbar.close();

}

/**

private async processFiles(items: FileList): Promise<void> {

const { BlockManager, Tools } = this.Editor;

let dataToInsert: Array<{type: string; event: PasteEvent}>;

dataToInsert = await Promise.all(

Array

.from(items)

.map((item) => this.processFile(item))

);

dataToInsert = dataToInsert.filter((data) => !!data);

const isCurrentBlockInitial = Tools.isInitial(BlockManager.currentBlock.tool);

const needToReplaceCurrentBlock = isCurrentBlockInitial && BlockManager.currentBlock.isEmpty;

dataToInsert.forEach(

(data, i) => {

BlockManager.paste(data.type, data.event, i === 0 && needToReplaceCurrentBlock);

}

);

}

/**

private async processFile(file: File): Promise<{event: PasteEvent; type: string}> {

const extension = _.getFileExtension(file);

const foundConfig = Object

.entries(this.toolsFiles)

.find(([toolName, { mimeTypes, extensions } ]) => {

const [fileType, fileSubtype] = file.type.split('/');

const foundExt = extensions.find((ext) => ext.toLowerCase() === extension.toLowerCase());

const foundMimeType = mimeTypes.find((mime) => {

const [type, subtype] = mime.split('/');

return type === fileType && (subtype === fileSubtype || subtype === '*');

});

return !!foundExt || !!foundMimeType;

});

if (!foundConfig) {

return;

}

const [ tool ] = foundConfig;

const pasteEvent = this.composePasteEvent('file', {

file,

});

return {

event: pasteEvent,

type: tool,

};

}

/**

private processHTML(innerHTML: string): PasteData[] {

const { Tools, Sanitizer } = this.Editor;

const initialTool = this.config.initialBlock;

const wrapper = $.make('DIV');

wrapper.innerHTML = innerHTML;

const nodes = this.getNodes(wrapper);

return nodes

.map((node) => {

let content, tool = initialTool, isBlock = false;

switch (node.nodeType) {

/** If node is a document fragment, use temp wrapper to get innerHTML */

case Node.DOCUMENT_FRAGMENT_NODE:

content = $.make('div');

content.appendChild(node);

break;

/** If node is an element, then there might be a substitution */

case Node.ELEMENT_NODE:

content = node as HTMLElement;

isBlock = true;

if (this.toolsTags[content.tagName]) {

tool = this.toolsTags[content.tagName].tool;

}

break;

}

const { tags } = Tools.blockTools[tool].pasteConfig as PasteConfig;

const toolTags = tags.reduce((result, tag) => {

result[tag.toLowerCase()] = {};

return result;

}, {});

const customConfig = Object.assign({}, toolTags, Sanitizer.getInlineToolsConfig(tool));

content.innerHTML = Sanitizer.clean(content.innerHTML, customConfig);

const event = this.composePasteEvent('tag', {

data: content,

});

return {

content,

isBlock,

tool,

event,

};

})

.filter((data) => !$.isNodeEmpty(data.content) || $.isSingleTag(data.content));

}

/**

private processPlain(plain: string): PasteData[] {

const { initialBlock } = this.config as {initialBlock: string};

if (!plain) {

return [];

}

const tool = initialBlock;

return plain

.split(/\r?\n/)

.filter((text) => text.trim())

.map((text) => {

const content = $.make('div');

content.textContent = text;

const event = this.composePasteEvent('tag', {

data: content,

});

return {

content,

tool,

isBlock: false,

event,

};

});

}

/**

private async processSingleBlock(dataToInsert: PasteData): Promise<void> {

const { Caret, BlockManager, Tools } = this.Editor;

const { currentBlock } = BlockManager;

/**

if (

!currentBlock ||

dataToInsert.tool !== currentBlock.name ||

!$.containsOnlyInlineElements(dataToInsert.content.innerHTML)

) {

this.insertBlock(dataToInsert, currentBlock && Tools.isInitial(currentBlock.tool) && currentBlock.isEmpty);

return;

}

Caret.insertContentAtCaretPosition(dataToInsert.content.innerHTML);

}

/**

private async processInlinePaste(dataToInsert: PasteData): Promise<void> {

const { BlockManager, Caret, Sanitizer, Tools } = this.Editor;

const { content } = dataToInsert;

const currentBlockIsInitial = BlockManager.currentBlock && Tools.isInitial(BlockManager.currentBlock.tool);

if (currentBlockIsInitial && content.textContent.length < Paste.PATTERN_PROCESSING_MAX_LENGTH) {

const blockData = await this.processPattern(content.textContent);

if (blockData) {

const needToReplaceCurrentBlock = BlockManager.currentBlock &&

Tools.isInitial(BlockManager.currentBlock.tool) &&

BlockManager.currentBlock.isEmpty;

const insertedBlock = BlockManager.paste(blockData.tool, blockData.event, needToReplaceCurrentBlock);

Caret.setToBlock(insertedBlock, Caret.positions.END);

return;

}

}

/** If there is no pattern substitute - insert string as it is */

if (BlockManager.currentBlock && BlockManager.currentBlock.currentInput) {

const currentToolSanitizeConfig = Sanitizer.getInlineToolsConfig(BlockManager.currentBlock.name);

document.execCommand(

'insertHTML',

false,

Sanitizer.clean(content.innerHTML, currentToolSanitizeConfig)

);

} else {

this.insertBlock(dataToInsert);

}

}

/**

private async processPattern(text: string): Promise<{event: PasteEvent; tool: string}> {

const pattern = this.toolsPatterns.find((substitute) => {

const execResult = substitute.pattern.exec(text);

if (!execResult) {

return false;

}

return text === execResult.shift();

});

if (!pattern) {

return;

}

const event = this.composePasteEvent('pattern', {

key: pattern.key,

data: text,

});

return {

event,

tool: pattern.tool,

};

}

/**

private insertBlock(data: PasteData, canReplaceCurrentBlock = false): void {

const { BlockManager, Caret } = this.Editor;

const { currentBlock } = BlockManager;

let block: Block;

if (canReplaceCurrentBlock && currentBlock && currentBlock.isEmpty) {

block = BlockManager.paste(data.tool, data.event, true);

Caret.setToBlock(block, Caret.positions.END);

return;

}

block = BlockManager.paste(data.tool, data.event);

Caret.setToBlock(block, Caret.positions.END);

}

/**

private insertEditorJSData(blocks: Array<{tool: string; data: BlockToolData}>): void {

const { BlockManager, Tools } = this.Editor;

blocks.forEach(({ tool, data }, i) => {

const settings = this.Editor.Tools.getToolSettings(tool);

let needToReplaceCurrentBlock = false;

if (i === 0) {

const isCurrentBlockInitial = BlockManager.currentBlock && Tools.isInitial(BlockManager.currentBlock.tool);

needToReplaceCurrentBlock = isCurrentBlockInitial && BlockManager.currentBlock.isEmpty;

}

if (needToReplaceCurrentBlock) {

BlockManager.replace(tool, data, settings);

} else {

BlockManager.insert(tool, data, settings);

}

});

}

/**

private processElementNode(node: Node, nodes: Node[], destNode: Node): Node[] | void {

const tags = Object.keys(this.toolsTags);

const element = node as HTMLElement;

const { tool = '' } = this.toolsTags[element.tagName] || {};

const toolTags = this.tagsByTool[tool] || [];

const isSubstitutable = tags.includes(element.tagName);

const isBlockElement = $.blockElements.includes(element.tagName.toLowerCase());

const containsAnotherToolTags = Array

.from(element.children)

.some(

({ tagName }) => tags.includes(tagName) && !toolTags.includes(tagName)

);

const containsBlockElements = Array.from(element.children).some(

({ tagName }) => $.blockElements.includes(tagName.toLowerCase())

);

/** Append inline elements to previous fragment */

if (!isBlockElement && !isSubstitutable && !containsAnotherToolTags) {

destNode.appendChild(element);

return [...nodes, destNode];

}

if (

(isSubstitutable && !containsAnotherToolTags) ||

(isBlockElement && !containsBlockElements && !containsAnotherToolTags)

) {

return [...nodes, destNode, element];

}

}

/**

private getNodes(wrapper: Node): Node[] {

const children = Array.from(wrapper.childNodes);

let elementNodeProcessingResult: Node[] | void;

const reducer = (nodes: Node[], node: Node): Node[] => {

if ($.isEmpty(node) && !$.isSingleTag(node as HTMLElement)) {

return nodes;

}

const lastNode = nodes[nodes.length - 1];

let destNode: Node = new DocumentFragment();

if (lastNode && $.isFragment(lastNode)) {

destNode = nodes.pop();

}

switch (node.nodeType) {

/**

case Node.ELEMENT_NODE:

elementNodeProcessingResult = this.processElementNode(node, nodes, destNode);

if (elementNodeProcessingResult) {

return elementNodeProcessingResult;

}

break;

/**

case Node.TEXT_NODE:

destNode.appendChild(node);

return [...nodes, destNode];

default:

return [...nodes, destNode];

}

return [...nodes, ...Array.from(node.childNodes).reduce(reducer, [])];

};

return children.reduce(reducer, []);

}

/**

private composePasteEvent(type: string, detail: PasteEventDetail): PasteEvent {

return new CustomEvent(type, {

detail,

}) as PasteEvent;

}