@ckeditor/ckeditor5-markdown-gfm 40.0.0 → 40.2.0

package/src/markdown.js

@@ -1,29 +1,29 @@
-/**
- * @license Copyright (c) 2003-2023, CKSource Holding sp. z o.o. All rights reserved.
- * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
- */
-/**
- * @module markdown-gfm/markdown
- */
-import { Plugin } from 'ckeditor5/src/core';
-import GFMDataProcessor from './gfmdataprocessor';
-/**
- * The GitHub Flavored Markdown (GFM) plugin.
- *
- * For a detailed overview, check the {@glink features/markdown Markdown feature} guide.
- */
-export default class Markdown extends Plugin {
-    /**
-     * @inheritDoc
-     */
-    constructor(editor) {
-        super(editor);
-        editor.data.processor = new GFMDataProcessor(editor.data.viewDocument);
-    }
-    /**
-     * @inheritDoc
-     */
-    static get pluginName() {
-        return 'Markdown';
-    }
-}
+/**
+ * @license Copyright (c) 2003-2023, CKSource Holding sp. z o.o. All rights reserved.
+ * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
+ */
+/**
+ * @module markdown-gfm/markdown
+ */
+import { Plugin } from 'ckeditor5/src/core';
+import GFMDataProcessor from './gfmdataprocessor';
+/**
+ * The GitHub Flavored Markdown (GFM) plugin.
+ *
+ * For a detailed overview, check the {@glink features/markdown Markdown feature} guide.
+ */
+export default class Markdown extends Plugin {
+    /**
+     * @inheritDoc
+     */
+    constructor(editor) {
+        super(editor);
+        editor.data.processor = new GFMDataProcessor(editor.data.viewDocument);
+    }
+    /**
+     * @inheritDoc
+     */
+    static get pluginName() {
+        return 'Markdown';
+    }
+}

package/src/markdown2html/markdown2html.d.ts

@@ -1,13 +1,13 @@
-/**
- * @license Copyright (c) 2003-2023, CKSource Holding sp. z o.o. All rights reserved.
- * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
- */
-/**
- * @module markdown-gfm/markdown2html/markdown2html
- */
-import { marked } from 'marked';
-/**
- * Parses markdown string to an HTML.
- */
-export default function markdown2html(markdown: string): string;
-export { marked };
+/**
+ * @license Copyright (c) 2003-2023, CKSource Holding sp. z o.o. All rights reserved.
+ * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
+ */
+/**
+ * @module markdown-gfm/markdown2html/markdown2html
+ */
+import { marked } from 'marked';
+/**
+ * Parses markdown string to an HTML.
+ */
+export default function markdown2html(markdown: string): string;
+export { marked };

package/src/markdown2html/markdown2html.js

@@ -1,44 +1,44 @@
-/**
- * @license Copyright (c) 2003-2023, CKSource Holding sp. z o.o. All rights reserved.
- * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
- */
-/**
- * @module markdown-gfm/markdown2html/markdown2html
- */
-import { marked } from 'marked';
-// Overrides.
-marked.use({
-    tokenizer: {
-        // Disable the autolink rule in the lexer.
-        autolink: () => null,
-        url: () => null
-    },
-    renderer: {
-        checkbox(...args) {
-            // Remove bogus space after <input type="checkbox"> because it would be preserved
-            // by DomConverter as it's next to an inline object.
-            return Object.getPrototypeOf(this).checkbox.call(this, ...args).trimRight();
-        },
-        code(...args) {
-            // Since marked v1.2.8, every <code> gets a trailing "\n" whether it originally
-            // ended with one or not (see https://github.com/markedjs/marked/issues/1884 to learn why).
-            // This results in a redundant soft break in the model when loaded into the editor, which
-            // is best prevented at this stage. See https://github.com/ckeditor/ckeditor5/issues/11124.
-            return Object.getPrototypeOf(this).code.call(this, ...args).replace('\n</code>', '</code>');
-        }
-    }
-});
-/**
- * Parses markdown string to an HTML.
- */
-export default function markdown2html(markdown) {
-    const options = {
-        gfm: true,
-        breaks: true,
-        tables: true,
-        xhtml: true,
-        headerIds: false
-    };
-    return marked.parse(markdown, options);
-}
-export { marked };
+/**
+ * @license Copyright (c) 2003-2023, CKSource Holding sp. z o.o. All rights reserved.
+ * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
+ */
+/**
+ * @module markdown-gfm/markdown2html/markdown2html
+ */
+import { marked } from 'marked';
+// Overrides.
+marked.use({
+    tokenizer: {
+        // Disable the autolink rule in the lexer.
+        autolink: () => null,
+        url: () => null
+    },
+    renderer: {
+        checkbox(...args) {
+            // Remove bogus space after <input type="checkbox"> because it would be preserved
+            // by DomConverter as it's next to an inline object.
+            return Object.getPrototypeOf(this).checkbox.call(this, ...args).trimRight();
+        },
+        code(...args) {
+            // Since marked v1.2.8, every <code> gets a trailing "\n" whether it originally
+            // ended with one or not (see https://github.com/markedjs/marked/issues/1884 to learn why).
+            // This results in a redundant soft break in the model when loaded into the editor, which
+            // is best prevented at this stage. See https://github.com/ckeditor/ckeditor5/issues/11124.
+            return Object.getPrototypeOf(this).code.call(this, ...args).replace('\n</code>', '</code>');
+        }
+    }
+});
+/**
+ * Parses markdown string to an HTML.
+ */
+export default function markdown2html(markdown) {
+    const options = {
+        gfm: true,
+        breaks: true,
+        tables: true,
+        xhtml: true,
+        headerIds: false
+    };
+    return marked.parse(markdown, options);
+}
+export { marked };

package/src/pastefrommarkdownexperimental.d.ts

@@ -0,0 +1,74 @@
+/**
+ * @license Copyright (c) 2003-2023, CKSource Holding sp. z o.o. All rights reserved.
+ * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
+ */
+/**
+ * @module markdown-gfm/pastefrommarkdownexperimental
+ */
+import { Plugin, type Editor } from 'ckeditor5/src/core';
+import { ClipboardPipeline } from 'ckeditor5/src/clipboard';
+/**
+ * The GitHub Flavored Markdown (GFM) paste plugin.
+ *
+ * For a detailed overview, check the {@glink features/pasting/paste-markdown Paste Markdown feature} guide.
+ */
+export default class PasteFromMarkdownExperimental extends Plugin {
+    /**
+     * @internal
+     */
+    private _gfmDataProcessor;
+    /**
+     * @inheritDoc
+     */
+    constructor(editor: Editor);
+    /**
+     * @inheritDoc
+     */
+    static get pluginName(): "PasteFromMarkdownExperimental";
+    /**
+     * @inheritDoc
+     */
+    static get requires(): readonly [typeof ClipboardPipeline];
+    /**
+     * @inheritDoc
+     */
+    init(): void;
+    /**
+     * Determines if code copied from a website in `text/html` type can be parsed as markdown.
+     * It removes any OS specific HTML tags e.g. <meta> on Mac OS and <!--StartFragment--> on Windows.
+     * Then removes a single wrapper HTML tag or wrappers for sibling tags, and if there are no more tags left,
+     * returns the remaining text. Returns null, if there are any remaining HTML tags detected.
+     *
+     * @param htmlString Clipboard content in `text/html` type format.
+     */
+    private _parseMarkdownFromHtml;
+    /**
+     * Removes OS specific tags.
+     *
+     * @param htmlString Clipboard content in `text/html` type format.
+     */
+    private _removeOsSpecificTags;
+    /**
+     * If the input HTML string contains any first level formatting tags
+     * like <b>, <strong> or <i>, then we should not treat it as markdown.
+     *
+     * @param htmlString Clipboard content.
+     */
+    private _containsOnlyAllowedFirstLevelTags;
+    /**
+     * Removes multiple HTML wrapper tags from a list of sibling HTML tags.
+     *
+     * @param htmlString Clipboard content without any OS specific tags.
+     */
+    private _removeFirstLevelWrapperTagsAndBrs;
+    /**
+     * Determines if string contains any HTML tags.
+     */
+    private _containsAnyRemainingHtmlTags;
+    /**
+     * Replaces the reserved HTML entities with the actual characters.
+     *
+     * @param htmlString Clipboard content without any tags.
+     */
+    private _replaceHtmlReservedEntitiesWithCharacters;
+}

package/src/pastefrommarkdownexperimental.js

@@ -0,0 +1,147 @@
+/**
+ * @license Copyright (c) 2003-2023, CKSource Holding sp. z o.o. All rights reserved.
+ * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
+ */
+/**
+ * @module markdown-gfm/pastefrommarkdownexperimental
+ */
+import { Plugin } from 'ckeditor5/src/core';
+import { ClipboardPipeline } from 'ckeditor5/src/clipboard';
+import GFMDataProcessor from './gfmdataprocessor';
+const ALLOWED_MARKDOWN_FIRST_LEVEL_TAGS = ['SPAN', 'BR', 'PRE', 'CODE'];
+/**
+ * The GitHub Flavored Markdown (GFM) paste plugin.
+ *
+ * For a detailed overview, check the {@glink features/pasting/paste-markdown Paste Markdown feature} guide.
+ */
+export default class PasteFromMarkdownExperimental extends Plugin {
+    /**
+     * @inheritDoc
+     */
+    constructor(editor) {
+        super(editor);
+        this._gfmDataProcessor = new GFMDataProcessor(editor.data.viewDocument);
+    }
+    /**
+     * @inheritDoc
+     */
+    static get pluginName() {
+        return 'PasteFromMarkdownExperimental';
+    }
+    /**
+     * @inheritDoc
+     */
+    static get requires() {
+        return [ClipboardPipeline];
+    }
+    /**
+     * @inheritDoc
+     */
+    init() {
+        const editor = this.editor;
+        const view = editor.editing.view;
+        const viewDocument = view.document;
+        const clipboardPipeline = editor.plugins.get('ClipboardPipeline');
+        let shiftPressed = false;
+        this.listenTo(viewDocument, 'keydown', (evt, data) => {
+            shiftPressed = data.shiftKey;
+        });
+        this.listenTo(clipboardPipeline, 'inputTransformation', (evt, data) => {
+            if (shiftPressed) {
+                return;
+            }
+            const dataAsTextHtml = data.dataTransfer.getData('text/html');
+            if (!dataAsTextHtml) {
+                const dataAsTextPlain = data.dataTransfer.getData('text/plain');
+                data.content = this._gfmDataProcessor.toView(dataAsTextPlain);
+                return;
+            }
+            const markdownFromHtml = this._parseMarkdownFromHtml(dataAsTextHtml);
+            if (markdownFromHtml) {
+                data.content = this._gfmDataProcessor.toView(markdownFromHtml);
+            }
+        });
+    }
+    /**
+     * Determines if code copied from a website in `text/html` type can be parsed as markdown.
+     * It removes any OS specific HTML tags e.g. <meta> on Mac OS and <!--StartFragment--> on Windows.
+     * Then removes a single wrapper HTML tag or wrappers for sibling tags, and if there are no more tags left,
+     * returns the remaining text. Returns null, if there are any remaining HTML tags detected.
+     *
+     * @param htmlString Clipboard content in `text/html` type format.
+     */
+    _parseMarkdownFromHtml(htmlString) {
+        const withoutOsSpecificTags = this._removeOsSpecificTags(htmlString);
+        if (!this._containsOnlyAllowedFirstLevelTags(withoutOsSpecificTags)) {
+            return null;
+        }
+        const withoutWrapperTag = this._removeFirstLevelWrapperTagsAndBrs(withoutOsSpecificTags);
+        if (this._containsAnyRemainingHtmlTags(withoutWrapperTag)) {
+            return null;
+        }
+        return this._replaceHtmlReservedEntitiesWithCharacters(withoutWrapperTag);
+    }
+    /**
+     * Removes OS specific tags.
+     *
+     * @param htmlString Clipboard content in `text/html` type format.
+     */
+    _removeOsSpecificTags(htmlString) {
+        // Removing <meta> tag present on Mac.
+        const withoutMetaTag = htmlString.replace(/^<meta\b[^>]*>/, '').trim();
+        // Removing <html> tag present on Windows.
+        const withoutHtmlTag = withoutMetaTag.replace(/^<html>/, '').replace(/<\/html>$/, '').trim();
+        // Removing <body> tag present on Windows.
+        const withoutBodyTag = withoutHtmlTag.replace(/^<body>/, '').replace(/<\/body>$/, '').trim();
+        // Removing <!--StartFragment--> tag present on Windows.
+        return withoutBodyTag.replace(/^<!--StartFragment-->/, '').replace(/<!--EndFragment-->$/, '').trim();
+    }
+    /**
+     * If the input HTML string contains any first level formatting tags
+     * like <b>, <strong> or <i>, then we should not treat it as markdown.
+     *
+     * @param htmlString Clipboard content.
+     */
+    _containsOnlyAllowedFirstLevelTags(htmlString) {
+        const parser = new DOMParser();
+        const { body: tempElement } = parser.parseFromString(htmlString, 'text/html');
+        const tagNames = Array.from(tempElement.children).map(el => el.tagName);
+        return tagNames.every(el => ALLOWED_MARKDOWN_FIRST_LEVEL_TAGS.includes(el));
+    }
+    /**
+     * Removes multiple HTML wrapper tags from a list of sibling HTML tags.
+     *
+     * @param htmlString Clipboard content without any OS specific tags.
+     */
+    _removeFirstLevelWrapperTagsAndBrs(htmlString) {
+        const parser = new DOMParser();
+        const { body: tempElement } = parser.parseFromString(htmlString, 'text/html');
+        const brElements = tempElement.querySelectorAll('br');
+        for (const br of brElements) {
+            br.replaceWith('\n');
+        }
+        const outerElements = tempElement.querySelectorAll(':scope > *');
+        for (const element of outerElements) {
+            const elementClone = element.cloneNode(true);
+            element.replaceWith(...elementClone.childNodes);
+        }
+        return tempElement.innerHTML;
+    }
+    /**
+     * Determines if string contains any HTML tags.
+     */
+    _containsAnyRemainingHtmlTags(str) {
+        return str.includes('<');
+    }
+    /**
+     * Replaces the reserved HTML entities with the actual characters.
+     *
+     * @param htmlString Clipboard content without any tags.
+     */
+    _replaceHtmlReservedEntitiesWithCharacters(htmlString) {
+        return htmlString
+            .replace(/&gt;/g, '>')
+            .replace(/&lt;/g, '<')
+            .replace(/&nbsp;/g, ' ');
+    }
+}