@contentful/field-editor-rich-text 3.4.21 → 3.5.0

package/dist/esm/plugins/Paragraph/__tests__/createParagraphPlugin.test.js

@@ -0,0 +1,121 @@
+import { assertOutput, jsx } from '../../../test-utils';
+describe('normalization', ()=>{
+    it('can contain inline entries & hyperlinks', ()=>{
+        const input = jsx("editor", null, jsx("hp", null, "some text before", jsx("hinline", {
+            type: "Entry",
+            id: "inline-entry"
+        }), jsx("hlink", {
+            uri: "https://contentful.com"
+        }), jsx("hlink", {
+            entry: "entry-id"
+        }), jsx("hlink", {
+            asset: "asset-id"
+        }), "some text after"));
+        assertOutput({
+            input,
+            expected: input
+        });
+    });
+    it('wraps orphaned text nodes in a paragraph', ()=>{
+        const input = jsx("editor", null, jsx("hp", null, "valid text"), jsx("hh1", null, "valid text"), jsx("htable", null, jsx("htr", null, jsx("htd", null, "invalid text"))));
+        const expected = jsx("editor", null, jsx("hp", null, "valid text"), jsx("hh1", null, "valid text"), jsx("htable", null, jsx("htr", null, jsx("htd", null, jsx("hp", null, "invalid text")))), jsx("hp", null, jsx("htext", null)));
+        assertOutput({
+            input,
+            expected
+        });
+    });
+    it('unwraps nested paragraphs', ()=>{
+        const input = jsx("editor", null, jsx("hp", null, "some", jsx("hp", null, jsx("htext", {
+            bold: true,
+            italic: true,
+            underline: true
+        }, "paragraph")), "text"));
+        const expected = jsx("editor", null, jsx("hp", null, "some", jsx("htext", {
+            bold: true,
+            italic: true,
+            underline: true
+        }, "paragraph"), "text"));
+        assertOutput({
+            input,
+            expected
+        });
+    });
+    describe('lifts other invalid children', ()=>{
+        it('block void elements', ()=>{
+            const input = jsx("editor", null, jsx("hp", null, jsx("hembed", {
+                type: "Asset",
+                id: "1"
+            }), " start"), jsx("hp", null, "end ", jsx("hembed", {
+                type: "Asset",
+                id: "2"
+            })), jsx("hp", null, "in ", jsx("hembed", {
+                type: "Asset",
+                id: "3"
+            }), " between"), jsx("hp", null, jsx("hembed", {
+                type: "Entry",
+                id: "1"
+            }), " start"), jsx("hp", null, "end ", jsx("hembed", {
+                type: "Entry",
+                id: "2"
+            })), jsx("hp", null, "in ", jsx("hembed", {
+                type: "Entry",
+                id: "3"
+            }), " between"), jsx("hp", null, jsx("hhr", null), " start"), jsx("hp", null, "end ", jsx("hhr", null)), jsx("hp", null, "in ", jsx("hhr", null), " between"));
+            const expected = jsx("editor", null, jsx("hembed", {
+                type: "Asset",
+                id: "1"
+            }), jsx("hp", null, " start"), jsx("hp", null, "end "), jsx("hembed", {
+                type: "Asset",
+                id: "2"
+            }), jsx("hp", null, "in "), jsx("hembed", {
+                type: "Asset",
+                id: "3"
+            }), jsx("hp", null, " between"), jsx("hembed", {
+                type: "Entry",
+                id: "1"
+            }), jsx("hp", null, " start"), jsx("hp", null, "end "), jsx("hembed", {
+                type: "Entry",
+                id: "2"
+            }), jsx("hp", null, "in "), jsx("hembed", {
+                type: "Entry",
+                id: "3"
+            }), jsx("hp", null, " between"), jsx("hhr", null), jsx("hp", null, " start"), jsx("hp", null, "end "), jsx("hhr", null), jsx("hp", null, "in "), jsx("hhr", null), jsx("hp", null, " between"));
+            assertOutput({
+                input,
+                expected
+            });
+        });
+        it('handles heading', ()=>{
+            const input = jsx("editor", null, jsx("hp", null, "some", jsx("hh1", null, "heading"), "text"));
+            const expected = jsx("editor", null, jsx("hp", null, "some"), jsx("hh1", null, "heading"), jsx("hp", null, "text"));
+            assertOutput({
+                input,
+                expected
+            });
+        });
+        it('handles quotes', ()=>{
+            const input = jsx("editor", null, jsx("hp", null, "some", jsx("hquote", null, jsx("hp", null, "quote")), "text"));
+            const expected = jsx("editor", null, jsx("hp", null, "some"), jsx("hquote", null, jsx("hp", null, "quote")), jsx("hp", null, "text"));
+            assertOutput({
+                input,
+                expected
+            });
+        });
+        it('handles lists', ()=>{
+            const input = jsx("editor", null, jsx("hp", null, "some", jsx("hul", null, jsx("hli", null, jsx("hp", null, "list item"))), "text"));
+            const expected = jsx("editor", null, jsx("hp", null, "some"), jsx("hul", null, jsx("hli", null, jsx("hp", null, "list item"))), jsx("hp", null, "text"));
+            assertOutput({
+                input,
+                expected
+            });
+        });
+        it('handles tables', ()=>{
+            const input = jsx("editor", null, jsx("hp", null, "some", jsx("htable", null, jsx("htr", null, jsx("htd", null, jsx("hp", null, "cell 1")), jsx("htd", null, jsx("hp", null, "cell 2")))), "text"));
+            const expected = jsx("editor", null, jsx("hp", null, "some"), jsx("htable", null, jsx("htr", null, jsx("htd", null, jsx("hp", null, "cell 1")), jsx("htd", null, jsx("hp", null, "cell 2")))), jsx("hp", null, "text"));
+            assertOutput({
+                input,
+                expected
+            });
+        });
+    });
+});

package/dist/esm/plugins/Paragraph/createParagraphPlugin.js

@@ -0,0 +1,58 @@
+import { BLOCKS } from '@contentful/rich-text-types';
+import { createParagraphPlugin as createDefaultParagraphPlugin } from '@udecode/plate-paragraph';
+import isHotkey from 'is-hotkey';
+import { isInlineOrText, toggleElement } from '../../helpers/editor';
+import { transformUnwrap, transformLift } from '../../helpers/transformers';
+import { Paragraph } from './Paragraph';
+import { isEmbedElement, isEmptyElement } from './utils';
+const buildParagraphKeyDownHandler = (editor, { options: { hotkey  }  })=>(event)=>{
+        if (editor.selection && hotkey && isHotkey(hotkey, event)) {
+            toggleElement(editor, {
+                activeType: BLOCKS.PARAGRAPH,
+                inactiveType: BLOCKS.PARAGRAPH
+            });
+        }
+    };
+export const createParagraphPlugin = ()=>{
+    const config = {
+        type: BLOCKS.PARAGRAPH,
+        component: Paragraph,
+        options: {
+            hotkey: [
+                'mod+opt+0'
+            ]
+        },
+        handlers: {
+            onKeyDown: buildParagraphKeyDownHandler
+        },
+        softBreak: [
+            {
+                hotkey: 'shift+enter',
+                query: {
+                    allow: BLOCKS.PARAGRAPH
+                }
+            }
+        ],
+        deserializeHtml: {
+            rules: [
+                {
+                    validNodeName: [
+                        'P',
+                        'DIV'
+                    ]
+                }
+            ],
+            query: (el)=>!isEmptyElement(el) && !isEmbedElement(el)
+        },
+        normalizer: [
+            {
+                validChildren: (_, [node])=>isInlineOrText(node),
+                transform: {
+                    [BLOCKS.PARAGRAPH]: transformUnwrap,
+                    default: transformLift
+                }
+            }
+        ]
+    };
+    return createDefaultParagraphPlugin(config);
+};

package/dist/esm/plugins/Paragraph/index.js

@@ -0,0 +1 @@
+export * from './createParagraphPlugin';

package/dist/esm/plugins/Paragraph/utils.js

@@ -0,0 +1,6 @@
+export function isEmbedElement(element) {
+    return element.hasAttribute('data-embedded-entity-inline-id') || element.hasAttribute('data-entity-type');
+}
+export function isEmptyElement(element) {
+    return element.textContent === '';
+}

package/dist/esm/plugins/PasteHTML/createPasteHTMLPlugin.js

@@ -0,0 +1,42 @@
+import { KEY_DESERIALIZE_HTML } from '@udecode/plate-core';
+import { sanitizeHTML } from './utils/sanitizeHTML';
+const catchSlateFragment = /data-slate-fragment="(.+?)"/m;
+export const getSlateFragmentAttribute = (dataTransfer)=>{
+    const htmlData = dataTransfer.getData('text/html');
+    const [, fragment] = htmlData.match(catchSlateFragment) || [];
+    return fragment;
+};
+export const ensureXSlateFragment = (dataTransfer)=>{
+    if (!dataTransfer.getData('application/x-slate-fragment')) {
+        const fragment = getSlateFragmentAttribute(dataTransfer);
+        if (fragment) {
+            const clipboardData = new DataTransfer();
+            dataTransfer.types.forEach((type)=>{
+                clipboardData.setData(type, dataTransfer.getData(type));
+            });
+            clipboardData.setData('application/x-slate-fragment', fragment);
+            return clipboardData;
+        }
+    }
+    return dataTransfer;
+};
+export const createPasteHTMLPlugin = ()=>({
+        key: 'PasteHTMLPlugin',
+        withOverrides: (editor)=>{
+            const { insertData  } = editor;
+            editor.insertData = (data)=>insertData(ensureXSlateFragment(data));
+            return editor;
+        },
+        inject: {
+            pluginsByKey: {
+                [KEY_DESERIALIZE_HTML]: {
+                    editor: {
+                        insertData: {
+                            format: 'text/html',
+                            transformData: sanitizeHTML
+                        }
+                    }
+                }
+            }
+        }
+    });

package/dist/esm/plugins/PasteHTML/index.js

@@ -0,0 +1 @@
+export * from './createPasteHTMLPlugin';

package/dist/esm/plugins/PasteHTML/utils/__tests__/sanitizeHTML.test.js

@@ -0,0 +1,50 @@
+import { sanitizeHTML } from '../sanitizeHTML';
+describe('HTML Sanitization', ()=>{
+    it('removes unsupported elements from <a>', ()=>{
+        const cases = [
+            {
+                input: '<h1><a href="#">Link in h1</a></h1>',
+                output: 'unchanged'
+            },
+            {
+                input: '<div><a href="#">Link in div</a></div>',
+                output: 'unchanged'
+            },
+            {
+                input: '<a href="#"><strong>strong in Link</strong></a>',
+                output: 'unchanged'
+            },
+            {
+                input: '<a href="#"><b>b in Link</b></a>',
+                output: 'unchanged'
+            },
+            {
+                input: '<a href="#"><em>em in Link</em></a>',
+                output: 'unchanged'
+            },
+            {
+                input: '<a href="#"><i>i in Link</i></a>',
+                output: 'unchanged'
+            },
+            {
+                input: '<a href="#"><u>u in Link</u></a>',
+                output: 'unchanged'
+            },
+            {
+                input: '<a href="#"><h1>h1 in Link</h1><h2>this is h2</h2></a>',
+                output: '<a href="#">h1 in Link  this is h2</a>'
+            },
+            {
+                input: '<a href="#"><p>p in Link</p></a>',
+                output: '<a href="#">p in Link</a>'
+            },
+            {
+                input: '<a href="#"><h1>h1 in Link <i>with</i> <b>marks</b></h1></a>',
+                output: '<a href="#">h1 in Link <i>with</i> <b>marks</b></a>'
+            }
+        ];
+        cases.forEach((case_)=>{
+            expect(sanitizeHTML(case_.input)).toBe(case_.output === 'unchanged' ? case_.input : case_.output);
+        });
+    });
+});

package/dist/esm/plugins/PasteHTML/utils/sanitizeAnchors.js

@@ -0,0 +1,33 @@
+const wrapSpaceAround = (el)=>{
+    const spacer = new Text(' ');
+    const parent = el.parentNode;
+    if (!parent) {
+        return;
+    }
+    if (el.previousSibling) {
+        parent.insertBefore(spacer, el);
+    }
+    if (el.nextSibling) {
+        parent.insertBefore(spacer, el.nextSibling);
+    }
+};
+const unwrap = (el)=>{
+    wrapSpaceAround(el);
+    el.replaceWith(...Array.from(el.childNodes));
+};
+export const sanitizeAnchors = (doc)=>{
+    const unsupportedTagSelector = `a :not(${[
+        'b',
+        'strong',
+        'code',
+        'pre',
+        'em',
+        'i',
+        'sub',
+        'sup',
+        'u',
+        'span'
+    ].join(',')})`;
+    doc.querySelectorAll(unsupportedTagSelector).forEach(unwrap);
+    return doc;
+};

package/dist/esm/plugins/PasteHTML/utils/sanitizeHTML.js

@@ -0,0 +1,40 @@
+import { sanitizeAnchors } from './sanitizeAnchors';
+import { sanitizeSheets } from './sanitizeSheets';
+const stripStyleTags = (doc)=>{
+    doc.querySelectorAll('style').forEach((e)=>{
+        e.remove();
+    });
+    return doc;
+};
+const stripMetaTags = (doc)=>{
+    doc.querySelectorAll('meta').forEach((el)=>el.remove());
+    return doc;
+};
+const transformers = [
+    stripStyleTags,
+    sanitizeSheets,
+    stripMetaTags,
+    sanitizeAnchors
+];
+function removeTableWrappers(table) {
+    const parent = table.parentElement;
+    if (parent && parent.tagName === 'DIV' && parent.children.length === 1) {
+        parent.replaceWith(table);
+        removeTableWrappers(table);
+    }
+}
+export const sanitizeHTML = (html)=>{
+    const doc = transformers.reduce((value, cb)=>cb(value), new DOMParser().parseFromString(html, 'text/html'));
+    const replacers = [
+        (innerHtml)=>innerHtml.replace(/<(\/)?(table|thead|tbody|tr|td|th|caption|col|colgroup|ol|ul|li)(.*)>\s+<(\/)?(table|thead|tbody|tr|td|th|caption|col|colgroup|ol|ul|li)/g, '<$1$2$3><$4$5'),
+        (innerHtml)=>innerHtml.replace(/(?:<[^>^/]*>)\s*(?:<\/[^>]*>)<\/(div|p|table|thead|tbody|tr|td|th|caption|col|colgroup|ol|ul|li)/g, '</$1'),
+        (innerHTML)=>innerHTML.replace(/\s*<\/(div|p|table|thead|tbody|tr|td|th|caption|col|colgroup|ol|ul|li)/g, '</$1')
+    ];
+    let previous;
+    do {
+        previous = doc.body.innerHTML;
+        doc.body.innerHTML = replacers.reduce((innerHTML, replacer)=>replacer(innerHTML), doc.body.innerHTML);
+    }while (doc.body.innerHTML !== previous)
+    doc.querySelectorAll('table').forEach(removeTableWrappers);
+    return doc.body.innerHTML;
+};

package/dist/esm/plugins/PasteHTML/utils/sanitizeSheets.js

@@ -0,0 +1,34 @@
+export const sanitizeSheets = (doc)=>{
+    const supported = [
+        'google-sheets-html-origin',
+        'meta[content="Excel.Sheet"]',
+        'meta[content*="Microsoft Excel"]'
+    ];
+    if (!supported.some((selector)=>!!doc.querySelector(selector))) {
+        return doc;
+    }
+    const isEmptyElement = (el)=>{
+        return (el.textContent ?? '').trim() === '';
+    };
+    const tables = Array.from(doc.querySelectorAll('table'));
+    for (const table of tables){
+        table.querySelectorAll('tr').forEach((row)=>{
+            isEmptyElement(row) && row.remove();
+        });
+        const rows = Array.from(table.querySelectorAll('tr'));
+        let colIndex = 1;
+        while(true){
+            const cells = rows.map((row)=>row.querySelector(`th:nth-of-type(${colIndex}), td:nth-of-type(${colIndex})`)).filter((cell)=>!!cell);
+            if (cells.length === 0) {
+                break;
+            }
+            const isEmpty = cells.every((cell)=>isEmptyElement(cell));
+            if (!isEmpty) {
+                colIndex += 1;
+                continue;
+            }
+            cells.forEach((cell)=>cell.remove());
+        }
+    }
+    return doc;
+};

package/dist/esm/plugins/Quote/__test__/createQuotePlugin.test.js

@@ -0,0 +1,74 @@
+import { assertOutput, jsx } from '../../../test-utils';
+describe('normalization', ()=>{
+    it('can contain inline entries & hyperlinks', ()=>{
+        const input = jsx("editor", null, jsx("hquote", null, jsx("hp", null, "some text before", jsx("hinline", {
+            type: "Entry",
+            id: "inline-entry"
+        }), jsx("hlink", {
+            uri: "https://contentful.com"
+        }), jsx("hlink", {
+            entry: "entry-id"
+        }), jsx("hlink", {
+            asset: "asset-id"
+        }), "some text after")));
+        assertOutput({
+            input,
+            expected: input
+        });
+    });
+    it('unwraps nested quotes', ()=>{
+        const input = jsx("editor", null, jsx("hquote", null, jsx("hp", null, "some"), jsx("hquote", null, jsx("hp", null, jsx("htext", {
+            bold: true,
+            italic: true,
+            underline: true
+        }, "paragraph"))), jsx("hp", null, "text")));
+        const expected = jsx("editor", null, jsx("hquote", null, jsx("hp", null, "some"), jsx("hp", null, jsx("htext", {
+            bold: true,
+            italic: true,
+            underline: true
+        }, "paragraph")), jsx("hp", null, "text")), jsx("hp", null, jsx("htext", null)));
+        assertOutput({
+            input,
+            expected
+        });
+    });
+    describe('lifts other invalid children', ()=>{
+        it('block void elements', ()=>{
+            const input = jsx("editor", null, jsx("hquote", null, jsx("hp", null, "this"), jsx("hembed", {
+                type: "Asset",
+                id: "1"
+            }), jsx("hp", null, "is"), jsx("hembed", {
+                type: "Entry",
+                id: "1"
+            }), jsx("hp", null, "a blockquote"), jsx("hhr", null), jsx("hh1", null, "Heading 1")));
+            const expected = jsx("editor", null, jsx("hquote", null, jsx("hp", null, "this")), jsx("hembed", {
+                type: "Asset",
+                id: "1"
+            }), jsx("hquote", null, jsx("hp", null, "is")), jsx("hembed", {
+                type: "Entry",
+                id: "1"
+            }), jsx("hquote", null, jsx("hp", null, "a blockquote")), jsx("hhr", null), jsx("hh1", null, "Heading 1"), jsx("hp", null, jsx("text", null)));
+            assertOutput({
+                input,
+                expected
+            });
+        });
+        it('handles lists', ()=>{
+            const input = jsx("editor", null, jsx("hquote", null, jsx("hp", null, "some", jsx("hul", null, jsx("hli", null, jsx("hp", null, "list item"))), "text")));
+            const expected = jsx("editor", null, jsx("hquote", null, jsx("hp", null, "some")), jsx("hul", null, jsx("hli", null, jsx("hp", null, "list item"))), jsx("hquote", null, jsx("hp", null, "text")), jsx("hp", null, jsx("text", null)));
+            assertOutput({
+                input,
+                expected
+            });
+        });
+        it('handles tables', ()=>{
+            const table = jsx("htable", null, jsx("htr", null, jsx("htd", null, jsx("hp", null, "cell 1")), jsx("htd", null, jsx("hp", null, "cell 2"))));
+            const input = jsx("editor", null, jsx("hquote", null, jsx("hp", null, "some", table, "text")));
+            const expected = jsx("editor", null, jsx("hquote", null, jsx("hp", null, "some")), table, jsx("hquote", null, jsx("hp", null, "text")), jsx("hp", null, jsx("text", null)));
+            assertOutput({
+                input,
+                expected
+            });
+        });
+    });
+});

package/dist/esm/plugins/Quote/components/Quote.js

@@ -0,0 +1,15 @@
+import * as React from 'react';
+import tokens from '@contentful/f36-tokens';
+import { css } from 'emotion';
+const style = css({
+    margin: '0 0 1.3125rem',
+    borderLeft: `6px solid ${tokens.gray200}`,
+    paddingLeft: '0.875rem',
+    fontStyle: 'normal'
+});
+export function Quote(props) {
+    return React.createElement("blockquote", {
+        ...props.attributes,
+        className: style
+    }, props.children);
+}

package/dist/esm/plugins/Quote/components/ToolbarQuoteButton.js

@@ -0,0 +1,23 @@
+import * as React from 'react';
+import { QuoteIcon } from '@contentful/f36-icons';
+import { BLOCKS } from '@contentful/rich-text-types';
+import { useContentfulEditor } from '../../../ContentfulEditorProvider';
+import { isBlockSelected, focus } from '../../../helpers/editor';
+import { ToolbarButton } from '../../shared/ToolbarButton';
+import { toggleQuote } from '../toggleQuote';
+export function ToolbarQuoteButton(props) {
+    const editor = useContentfulEditor();
+    function handleOnClick() {
+        if (!editor) return;
+        toggleQuote(editor, editor.tracking.onToolbarAction);
+        focus(editor);
+    }
+    if (!editor) return null;
+    return React.createElement(ToolbarButton, {
+        title: "Blockquote",
+        onClick: handleOnClick,
+        testId: "quote-toolbar-button",
+        isDisabled: props.isDisabled,
+        isActive: isBlockSelected(editor, BLOCKS.QUOTE)
+    }, React.createElement(QuoteIcon, null));
+}

package/dist/esm/plugins/Quote/createQuotePlugin.js

@@ -0,0 +1,47 @@
+import { BLOCKS, CONTAINERS } from '@contentful/rich-text-types';
+import { transformLift, transformUnwrap } from '../../helpers/transformers';
+import { Quote } from './components/Quote';
+import { shouldResetQuoteOnBackspace } from './shouldResetQuote';
+import { onKeyDownToggleQuote, toggleQuote } from './toggleQuote';
+import { withQuote } from './withQuote';
+export function createQuotePlugin() {
+    return {
+        key: BLOCKS.QUOTE,
+        type: BLOCKS.QUOTE,
+        isElement: true,
+        component: Quote,
+        options: {
+            hotkey: 'mod+shift+1'
+        },
+        handlers: {
+            onKeyDown: onKeyDownToggleQuote
+        },
+        deserializeHtml: {
+            rules: [
+                {
+                    validNodeName: 'BLOCKQUOTE'
+                }
+            ]
+        },
+        resetNode: [
+            {
+                hotkey: 'backspace',
+                types: [
+                    BLOCKS.QUOTE
+                ],
+                predicate: shouldResetQuoteOnBackspace,
+                onReset: toggleQuote
+            }
+        ],
+        normalizer: [
+            {
+                validChildren: CONTAINERS[BLOCKS.QUOTE],
+                transform: {
+                    [BLOCKS.QUOTE]: transformUnwrap,
+                    default: transformLift
+                }
+            }
+        ],
+        withOverrides: withQuote
+    };
+}

package/dist/esm/plugins/Quote/index.js

@@ -0,0 +1,2 @@
+export * from './createQuotePlugin';
+export * from './components/ToolbarQuoteButton';

package/dist/esm/plugins/Quote/shouldResetQuote.js

@@ -0,0 +1,30 @@
+import { BLOCKS, TEXT_CONTAINERS } from '@contentful/rich-text-types';
+import { isLastChild, hasSingleChild } from '@udecode/plate-core';
+import { getAboveNode, getBlockAbove, isAncestorEmpty } from '../../internal/queries';
+export const shouldResetQuoteOnBackspace = (editor)=>{
+    const container = getAboveNode(editor, {
+        match: {
+            type: TEXT_CONTAINERS
+        },
+        mode: 'lowest'
+    });
+    if (!container) {
+        return false;
+    }
+    if (!isAncestorEmpty(editor, container[0])) {
+        return false;
+    }
+    const quote = getBlockAbove(editor, {
+        match: {
+            type: BLOCKS.QUOTE
+        },
+        mode: 'lowest'
+    });
+    if (!quote) {
+        return false;
+    }
+    if (hasSingleChild(quote[0]) && isLastChild(quote, container[1])) {
+        return true;
+    }
+    return false;
+};

package/dist/esm/plugins/Quote/toggleQuote.js

@@ -0,0 +1,33 @@
+import { BLOCKS } from '@contentful/rich-text-types';
+import isHotkey from 'is-hotkey';
+import { isBlockSelected } from '../../helpers/editor';
+import { withoutNormalizing, wrapNodes, unwrapNodes, isElement } from '../../internal';
+export function toggleQuote(editor, logAction) {
+    if (!editor.selection) return;
+    const isActive = isBlockSelected(editor, BLOCKS.QUOTE);
+    logAction?.(isActive ? 'remove' : 'insert', {
+        nodeType: BLOCKS.QUOTE
+    });
+    withoutNormalizing(editor, ()=>{
+        if (!editor.selection) return;
+        unwrapNodes(editor, {
+            match: (node)=>isElement(node) && node.type === BLOCKS.QUOTE,
+            split: true
+        });
+        if (!isActive) {
+            const quote = {
+                type: BLOCKS.QUOTE,
+                data: {},
+                children: []
+            };
+            wrapNodes(editor, quote);
+        }
+    });
+}
+export const onKeyDownToggleQuote = (editor, plugin)=>(event)=>{
+        const { hotkey  } = plugin.options;
+        if (hotkey && isHotkey(hotkey, event)) {
+            event.preventDefault();
+            toggleQuote(editor, editor.tracking.onShortcutAction);
+        }
+    };