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

package/dist/esm/plugins/Hyperlink/useEntityInfo.js

@@ -0,0 +1,85 @@
+import { useEffect, useState } from 'react';
+import { entityHelpers } from '@contentful/field-editor-shared';
+import { getEntityInfo } from './utils';
+async function fetchAllData({ sdk , entityId , entityType , localeCode , defaultLocaleCode  }) {
+    let contentType;
+    const getEntity = entityType === 'Entry' ? sdk.space.getEntry : sdk.space.getAsset;
+    const entity = await getEntity(entityId);
+    if (entity.sys.contentType) {
+        const contentTypeId = entity.sys.contentType.sys.id;
+        contentType = sdk.space.getCachedContentTypes().find((ct)=>ct.sys.id === contentTypeId);
+    }
+    const entityTitle = entityType === 'Entry' ? entityHelpers.getEntryTitle({
+        entry: entity,
+        contentType,
+        localeCode,
+        defaultLocaleCode,
+        defaultTitle: 'Untitled'
+    }) : entityHelpers.getAssetTitle({
+        asset: entity,
+        localeCode,
+        defaultLocaleCode,
+        defaultTitle: 'Untitled'
+    });
+    const entityDescription = entityHelpers.getEntityDescription({
+        entity,
+        contentType,
+        localeCode,
+        defaultLocaleCode
+    });
+    const jobs = await sdk.space.getEntityScheduledActions(entityType, entityId);
+    const entityStatus = entityHelpers.getEntryStatus(entity.sys);
+    return {
+        jobs,
+        entity,
+        entityTitle,
+        entityDescription,
+        entityStatus,
+        contentTypeName: contentType ? contentType.name : ''
+    };
+}
+function useRequestStatus({ sdk , target , onEntityFetchComplete  }) {
+    const [requestStatus, setRequestStatus] = useState({
+        type: 'loading'
+    });
+    useEffect(()=>{
+        if (target) {
+            fetchAllData({
+                sdk,
+                entityId: target?.sys?.id,
+                entityType: target?.sys?.linkType,
+                localeCode: sdk.field.locale,
+                defaultLocaleCode: sdk.locales.default
+            }).then((entityInfo)=>{
+                setRequestStatus({
+                    type: 'success',
+                    data: entityInfo
+                });
+            }).catch((e)=>{
+                console.log(e);
+                setRequestStatus({
+                    type: 'error',
+                    error: e
+                });
+            }).finally(()=>{
+                onEntityFetchComplete?.();
+            });
+        }
+    }, [
+        sdk,
+        target,
+        onEntityFetchComplete
+    ]);
+    return requestStatus;
+}
+export function useEntityInfo(props) {
+    const status = useRequestStatus(props);
+    const { linkType  } = props.target.sys;
+    if (status.type === 'loading') {
+        return `Loading ${linkType.toLowerCase()}...`;
+    }
+    if (status.type === 'error') {
+        return `${linkType} missing or inaccessible`;
+    }
+    return getEntityInfo(status.data);
+}

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

@@ -0,0 +1,25 @@
+import { getScheduleTooltipContent } from '@contentful/field-editor-reference';
+import { isAncestorEmpty } from '@udecode/plate-core';
+import { getText } from '../../internal/queries';
+export const hasText = (editor, entry)=>{
+    const [node, path] = entry;
+    return !isAncestorEmpty(editor, node) && getText(editor, path).trim() !== '';
+};
+function truncate(str, length) {
+    if (typeof str === 'string' && str.length > length) {
+        return str && str.substr(0, length + 1).replace(/(\s+\S(?=\S)|\s*)\.?.$/, '…');
+    }
+    return str;
+}
+export function getEntityInfo(data) {
+    if (!data) {
+        return '';
+    }
+    const { entityTitle , contentTypeName , entityStatus , jobs  } = data;
+    const title = truncate(entityTitle, 60) || 'Untitled';
+    const scheduledActions = jobs.length > 0 ? getScheduleTooltipContent({
+        job: jobs[0],
+        jobsCount: jobs.length
+    }) : '';
+    return `${contentTypeName || 'Asset'} "${title}", ${entityStatus} ${scheduledActions}`;
+}

package/dist/esm/plugins/List/__tests__/createListPlugin.test.js

@@ -0,0 +1,43 @@
+import { assertOutput, jsx } from '../../../test-utils';
+describe('normalization', ()=>{
+    it('wraps orphaned list items in a list', ()=>{
+        const input = jsx("editor", null, jsx("hli", null, jsx("hp", null, "Item")), jsx("hp", null));
+        const expected = jsx("editor", null, jsx("hul", null, jsx("hli", null, jsx("hp", null, "Item"))), jsx("hp", null, jsx("htext", null)));
+        assertOutput({
+            input,
+            expected
+        });
+    });
+    it('adds empty paragraph to empty list items', ()=>{
+        const input = jsx("editor", null, jsx("hul", null, jsx("hli", null)), jsx("hp", null));
+        const expected = jsx("editor", null, jsx("hul", null, jsx("hli", null, jsx("hp", null, jsx("htext", null)))), jsx("hp", null, jsx("htext", null)));
+        assertOutput({
+            input,
+            expected
+        });
+    });
+    it('replaces invalid list items with text', ()=>{
+        const input = jsx("editor", null, jsx("hul", null, jsx("hli", null, jsx("hp", null, "Item"), jsx("htd", null, jsx("hp", null, jsx("htext", {
+            bold: true
+        }, "bold text"))), jsx("htd", null, jsx("hp", null, "Take a look at this ", jsx("hlink", {
+            uri: "https://google.com"
+        }, "link"))))), jsx("hp", null));
+        const expected = jsx("editor", null, jsx("hul", null, jsx("hli", null, jsx("hp", null, "Item"), jsx("hp", null, jsx("htext", {
+            bold: true
+        }, "bold text")), jsx("hp", null, "Take a look at this ", jsx("hlink", {
+            uri: "https://google.com"
+        }, "link"), jsx("htext", null)))), jsx("hp", null, jsx("htext", null)));
+        assertOutput({
+            input,
+            expected
+        });
+    });
+    it('replaces list items with nested lists as a first child', ()=>{
+        const input = jsx("editor", null, jsx("hul", null, jsx("hli", null, jsx("hp", null, "Item 1"), jsx("hul", null, jsx("hli", null, jsx("hp", null, "Item 1.1")))), jsx("hli", null, jsx("hul", null, jsx("hli", null, jsx("hp", null, "Item 2.1"), jsx("hul", null, jsx("hli", null, jsx("hp", null, "Item 2.1.1")))), jsx("hli", null, jsx("hp", null, "Item 2.2"))))), jsx("hp", null, jsx("htext", null)));
+        const expected = jsx("editor", null, jsx("hul", null, jsx("hli", null, jsx("hp", null, "Item 1"), jsx("hul", null, jsx("hli", null, jsx("hp", null, "Item 1.1")))), jsx("hli", null, jsx("hp", null, "Item 2.1"), jsx("hul", null, jsx("hli", null, jsx("hp", null, "Item 2.1.1")))), jsx("hli", null, jsx("hp", null, "Item 2.2"))), jsx("hp", null, jsx("htext", null)));
+        assertOutput({
+            input,
+            expected
+        });
+    });
+});

package/dist/esm/plugins/List/__tests__/insertListBreak.test.js

@@ -0,0 +1,73 @@
+import { jsx, assertOutput, createTestEditor } from '../../../test-utils';
+describe('insert line break', ()=>{
+    const tests = [
+        {
+            title: 'at the start of a li',
+            input: jsx("hul", null, jsx("hli", null, jsx("hp", null, jsx("cursor", null), "p1"))),
+            expected: jsx("hul", null, jsx("hli", null, jsx("hp", null, jsx("cursor", null))), jsx("hli", null, jsx("hp", null, "p1")))
+        },
+        {
+            title: 'at the end of a li',
+            input: jsx("hul", null, jsx("hli", null, jsx("hp", null, "p1", jsx("cursor", null)))),
+            expected: jsx("hul", null, jsx("hli", null, jsx("hp", null, "p1")), jsx("hli", null, jsx("hp", null, jsx("cursor", null))))
+        },
+        {
+            title: 'at the middle of a li',
+            input: jsx("hul", null, jsx("hli", null, jsx("hp", null, "split ", jsx("cursor", null), "me"))),
+            expected: jsx("hul", null, jsx("hli", null, jsx("hp", null, "split ")), jsx("hli", null, jsx("hp", null, jsx("cursor", null), "me")))
+        },
+        {
+            title: 'at the start of a li with multiple p',
+            input: jsx("hul", null, jsx("hli", null, jsx("hp", null, jsx("cursor", null), "p1"), jsx("hp", null, "p2"))),
+            expected: jsx("hul", null, jsx("hli", null, jsx("hp", null, jsx("cursor", null))), jsx("hli", null, jsx("hp", null, "p1"), jsx("hp", null, "p2")))
+        },
+        {
+            title: 'at the start of the second p of a li',
+            input: jsx("hul", null, jsx("hli", null, jsx("hp", null, "p1"), jsx("hp", null, jsx("cursor", null), "p2"))),
+            expected: jsx("hul", null, jsx("hli", null, jsx("hp", null, "p1")), jsx("hli", null, jsx("hp", null, jsx("cursor", null)), jsx("hp", null, "p2")))
+        },
+        {
+            title: 'at the end of a li with multiple p',
+            input: jsx("hul", null, jsx("hli", null, jsx("hp", null, "p1"), jsx("hp", null, "p2", jsx("cursor", null)))),
+            expected: jsx("hul", null, jsx("hli", null, jsx("hp", null, "p1"), jsx("hp", null, "p2")), jsx("hli", null, jsx("hp", null, jsx("cursor", null))))
+        },
+        {
+            title: 'at the middle of a li with multiple p',
+            input: jsx("hul", null, jsx("hli", null, jsx("hp", null, "split ", jsx("cursor", null), "me"), jsx("hp", null, "move me"))),
+            expected: jsx("hul", null, jsx("hli", null, jsx("hp", null, "split ")), jsx("hli", null, jsx("hp", null, jsx("cursor", null), "me"), jsx("hp", null, "move me")))
+        },
+        {
+            title: 'at the start of a li with heading',
+            input: jsx("hul", null, jsx("hli", null, jsx("hh1", null, jsx("cursor", null), "p1"))),
+            expected: jsx("hul", null, jsx("hli", null, jsx("hp", null, jsx("cursor", null))), jsx("hli", null, jsx("hh1", null, "p1")))
+        },
+        {
+            title: 'at the end of a li with heading',
+            input: jsx("hul", null, jsx("hli", null, jsx("hh1", null, "p1", jsx("cursor", null)))),
+            expected: jsx("hul", null, jsx("hli", null, jsx("hh1", null, "p1")), jsx("hli", null, jsx("hp", null, jsx("cursor", null))))
+        },
+        {
+            title: 'at the middle of a li with heading',
+            input: jsx("hul", null, jsx("hli", null, jsx("hh1", null, "split ", jsx("cursor", null), "me"))),
+            expected: jsx("hul", null, jsx("hli", null, jsx("hh1", null, "split ")), jsx("hli", null, jsx("hh1", null, jsx("cursor", null), "me")))
+        },
+        {
+            title: 'at a li with nested list',
+            input: jsx("hul", null, jsx("hli", null, jsx("hp", null, "item 1")), jsx("hli", null, jsx("hp", null, "item 2", jsx("cursor", null)), jsx("hul", null, jsx("hli", null, jsx("hp", null, "sub list"))))),
+            expected: jsx("hul", null, jsx("hli", null, jsx("hp", null, "item 1")), jsx("hli", null, jsx("hp", null, "item 2")), jsx("hli", null, jsx("hp", null, jsx("cursor", null)), jsx("hul", null, jsx("hli", null, jsx("hp", null, "sub list")))))
+        }
+    ];
+    const render = (children)=>jsx("editor", null, children, jsx("hp", null, jsx("htext", null)));
+    for (const t of tests){
+        test(t.title, ()=>{
+            const { editor  } = createTestEditor({
+                input: render(t.input)
+            });
+            editor.insertBreak();
+            assertOutput({
+                editor,
+                expected: render(t.expected)
+            });
+        });
+    }
+});

package/dist/esm/plugins/List/__tests__/insertListFragment.test.js

@@ -0,0 +1,60 @@
+import { jsx, assertOutput, createTestEditor } from '../../../test-utils';
+describe('insert fragment', ()=>{
+    const tests = [
+        {
+            title: 'text wrapped in li > p',
+            input: jsx("hul", null, jsx("hli", null, jsx("hp", null, "hello ", jsx("cursor", null)))),
+            fragment: jsx("fragment", null, jsx("hli", null, jsx("hp", null, "world"))),
+            expected: jsx("hul", null, jsx("hli", null, jsx("hp", null, "hello world")))
+        },
+        {
+            title: 'text wrapped in li > h*',
+            input: jsx("hul", null, jsx("hli", null, jsx("hp", null, "hello ", jsx("cursor", null)))),
+            fragment: jsx("fragment", null, jsx("hli", null, jsx("hh1", null, "world"))),
+            expected: jsx("hul", null, jsx("hli", null, jsx("hp", null, "hello world")))
+        },
+        {
+            title: 'single li with only asset card',
+            input: jsx("hul", null, jsx("hli", null, jsx("hp", null, "hello", jsx("cursor", null), "world"))),
+            fragment: jsx("fragment", null, jsx("hli", null, jsx("hembed", {
+                type: "Asset",
+                id: "asset-id"
+            }))),
+            expected: jsx("hul", null, jsx("hli", null, jsx("hp", null, "hello"), jsx("hembed", {
+                type: "Asset",
+                id: "asset-id"
+            }), jsx("hp", null, "world")))
+        },
+        {
+            title: 'two paragraphs',
+            input: jsx("hul", null, jsx("hli", null, jsx("hp", null, "hello ", jsx("cursor", null)))),
+            fragment: jsx("fragment", null, jsx("hp", null, "world"), jsx("hp", null, "line 2")),
+            expected: jsx("hul", null, jsx("hli", null, jsx("hp", null, "hello world"), jsx("hp", null, "line 2")))
+        },
+        {
+            title: 'two headings',
+            input: jsx("hul", null, jsx("hli", null, jsx("hp", null, "hello ", jsx("cursor", null)))),
+            fragment: jsx("fragment", null, jsx("hh1", null, "world"), jsx("hh1", null, "line 2")),
+            expected: jsx("hul", null, jsx("hli", null, jsx("hp", null, "hello world"), jsx("hh1", null, "line 2")))
+        },
+        {
+            title: 'two paragraphs wrapped in a li',
+            input: jsx("hul", null, jsx("hli", null, jsx("hp", null, "hello ", jsx("cursor", null)))),
+            fragment: jsx("fragment", null, jsx("hli", null, jsx("hp", null, "world"), jsx("hp", null, "line 2"))),
+            expected: jsx("hul", null, jsx("hli", null, jsx("hp", null, "hello "), jsx("hul", null, jsx("hli", null, jsx("hp", null, "world"), jsx("hp", null, "line 2")))))
+        }
+    ];
+    const render = (children)=>jsx("editor", null, children, jsx("hp", null, jsx("htext", null)));
+    for (const t of tests){
+        test(t.title, ()=>{
+            const { editor  } = createTestEditor({
+                input: render(t.input)
+            });
+            editor.insertFragment(t.fragment);
+            assertOutput({
+                editor,
+                expected: render(t.expected)
+            });
+        });
+    }
+});

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

@@ -0,0 +1,46 @@
+import * as React from 'react';
+import tokens from '@contentful/f36-tokens';
+import { BLOCKS } from '@contentful/rich-text-types';
+import { css, cx } from 'emotion';
+const baseStyle = css`
+  padding: 0;
+  margin: 0 0 1.25rem 1.25rem;
+
+  div:first-child {
+    margin: 0;
+    line-height: ${tokens.lineHeightDefault};
+  }
+`;
+const styles = {
+    [BLOCKS.UL_LIST]: css`
+    list-style-type: disc;
+    ul {
+      list-style-type: circle;
+      ul {
+        list-style-type: square;
+      }
+    }
+  `,
+    [BLOCKS.OL_LIST]: css`
+    list-style-type: decimal;
+    ol {
+      list-style-type: upper-alpha;
+      ol {
+        list-style-type: lower-roman;
+        ol {
+          list-style-type: lower-alpha;
+        }
+      }
+    }
+  `
+};
+function createList(Tag, block) {
+    return function List(props) {
+        return React.createElement(Tag, {
+            ...props.attributes,
+            className: cx(baseStyle, styles[block])
+        }, props.children);
+    };
+}
+export const ListUL = createList('ul', BLOCKS.UL_LIST);
+export const ListOL = createList('ol', BLOCKS.OL_LIST);

package/dist/esm/plugins/List/components/ListItem.js

@@ -0,0 +1,19 @@
+import * as React from 'react';
+import tokens from '@contentful/f36-tokens';
+import { css } from 'emotion';
+const style = css`
+  margin: 0;
+  list-style: inherit;
+  margin-top: ${tokens.spacingXs};
+
+  ol,
+  ul {
+    margin: 0 0 0 ${tokens.spacingL};
+  }
+`;
+export function ListItem(props) {
+    return React.createElement("li", {
+        ...props.attributes,
+        className: style
+    }, props.children);
+}

package/dist/esm/plugins/List/components/ToolbarListButton.js

@@ -0,0 +1,37 @@
+import * as React from 'react';
+import { ListBulletedIcon, ListNumberedIcon } from '@contentful/f36-icons';
+import { BLOCKS } from '@contentful/rich-text-types';
+import { useContentfulEditor } from '../../../ContentfulEditorProvider';
+import { focus } from '../../../helpers/editor';
+import { isNodeTypeEnabled } from '../../../helpers/validations';
+import { useSdkContext } from '../../../SdkProvider';
+import { ToolbarButton } from '../../shared/ToolbarButton';
+import { toggleList } from '../transforms/toggleList';
+import { isListTypeActive } from '../utils';
+export function ToolbarListButton(props) {
+    const sdk = useSdkContext();
+    const editor = useContentfulEditor();
+    function handleClick(type) {
+        return ()=>{
+            if (!editor?.selection) return;
+            toggleList(editor, {
+                type
+            });
+            focus(editor);
+        };
+    }
+    if (!editor) return null;
+    return React.createElement(React.Fragment, null, isNodeTypeEnabled(sdk.field, BLOCKS.UL_LIST) && React.createElement(ToolbarButton, {
+        title: "UL",
+        testId: "ul-toolbar-button",
+        onClick: handleClick(BLOCKS.UL_LIST),
+        isActive: isListTypeActive(editor, BLOCKS.UL_LIST),
+        isDisabled: props.isDisabled
+    }, React.createElement(ListBulletedIcon, null)), isNodeTypeEnabled(sdk.field, BLOCKS.OL_LIST) && React.createElement(ToolbarButton, {
+        title: "OL",
+        testId: "ol-toolbar-button",
+        onClick: handleClick(BLOCKS.OL_LIST),
+        isActive: isListTypeActive(editor, BLOCKS.OL_LIST),
+        isDisabled: props.isDisabled
+    }, React.createElement(ListNumberedIcon, null)));
+}

package/dist/esm/plugins/List/createListPlugin.js

@@ -0,0 +1,66 @@
+import { BLOCKS, LIST_ITEM_BLOCKS } from '@contentful/rich-text-types';
+import { createListPlugin as createPlateListPlugin, ELEMENT_LI, ELEMENT_UL, ELEMENT_OL, ELEMENT_LIC } from '@udecode/plate-list';
+import { transformParagraphs, transformWrapIn } from '../../helpers/transformers';
+import { ListOL, ListUL } from './components/List';
+import { ListItem } from './components/ListItem';
+import { onKeyDownList } from './onKeyDownList';
+import { isNonEmptyListItem, hasListAsDirectParent, insertParagraphAsChild, normalizeOrphanedListItem, firstNodeIsNotList, replaceNodeWithListItems } from './utils';
+import { withList } from './withList';
+export const createListPlugin = ()=>createPlateListPlugin({
+        normalizer: [
+            {
+                match: {
+                    type: [
+                        BLOCKS.UL_LIST,
+                        BLOCKS.OL_LIST
+                    ]
+                },
+                validChildren: [
+                    BLOCKS.LIST_ITEM
+                ],
+                transform: transformWrapIn(BLOCKS.LIST_ITEM)
+            }
+        ],
+        overrideByKey: {
+            [ELEMENT_UL]: {
+                type: BLOCKS.UL_LIST,
+                component: ListUL,
+                handlers: {
+                    onKeyDown: onKeyDownList
+                },
+                withOverrides: withList
+            },
+            [ELEMENT_OL]: {
+                type: BLOCKS.OL_LIST,
+                component: ListOL,
+                handlers: {
+                    onKeyDown: onKeyDownList
+                }
+            },
+            [ELEMENT_LIC]: {
+                type: BLOCKS.PARAGRAPH
+            },
+            [ELEMENT_LI]: {
+                type: BLOCKS.LIST_ITEM,
+                component: ListItem,
+                normalizer: [
+                    {
+                        validNode: hasListAsDirectParent,
+                        transform: normalizeOrphanedListItem
+                    },
+                    {
+                        validNode: isNonEmptyListItem,
+                        transform: insertParagraphAsChild
+                    },
+                    {
+                        validChildren: LIST_ITEM_BLOCKS,
+                        transform: transformParagraphs
+                    },
+                    {
+                        validNode: firstNodeIsNotList,
+                        transform: replaceNodeWithListItems
+                    }
+                ]
+            }
+        }
+    });

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

@@ -0,0 +1,2 @@
+export * from './createListPlugin';
+export * from './components/ToolbarListButton';

package/dist/esm/plugins/List/insertListBreak.js

@@ -0,0 +1,50 @@
+import { TEXT_CONTAINERS } from '@contentful/rich-text-types';
+import { ELEMENT_DEFAULT, getPluginType, isBlockAboveEmpty, mockPlugin } from '@udecode/plate-core';
+import { getListItemEntry, moveListItemUp, unwrapList, ELEMENT_LI } from '@udecode/plate-list';
+import { onKeyDownResetNode, SIMULATE_BACKSPACE } from '@udecode/plate-reset-node';
+import { insertListItem } from './transforms/insertListItem';
+const listBreak = (editor)=>{
+    if (!editor.selection) return false;
+    const res = getListItemEntry(editor, {});
+    let moved;
+    if (res) {
+        const { list , listItem  } = res;
+        const childNode = listItem[0].children[0];
+        if (isBlockAboveEmpty(editor) && listItem[0].children.length === 1 && TEXT_CONTAINERS.includes(childNode.type)) {
+            moved = moveListItemUp(editor, {
+                list,
+                listItem
+            });
+            if (moved) return true;
+        }
+    }
+    const didReset = onKeyDownResetNode(editor, mockPlugin({
+        options: {
+            rules: [
+                {
+                    types: [
+                        getPluginType(editor, ELEMENT_LI)
+                    ],
+                    defaultType: getPluginType(editor, ELEMENT_DEFAULT),
+                    predicate: ()=>!moved && isBlockAboveEmpty(editor),
+                    onReset: (_editor)=>unwrapList(_editor)
+                }
+            ]
+        }
+    }))(SIMULATE_BACKSPACE);
+    if (didReset) {
+        return true;
+    }
+    if (!moved) {
+        const inserted = insertListItem(editor);
+        if (inserted) return true;
+    }
+    return false;
+};
+export const insertListBreak = (editor)=>{
+    const { insertBreak  } = editor;
+    return ()=>{
+        if (listBreak(editor)) return;
+        insertBreak();
+    };
+};

package/dist/esm/plugins/List/insertListFragment.js

@@ -0,0 +1,88 @@
+import { TEXT_CONTAINERS, BLOCKS } from '@contentful/rich-text-types';
+import { findNode } from '@udecode/plate-core';
+import { isBlockNode, isAncestorPath, getCommonNode, getNodeTexts, getParentPath, getDescendantNodeByPath } from '../../internal/queries';
+import { insertNodes } from '../../internal/transforms';
+const getFirstAncestorOfType = (root, entry)=>{
+    let ancestor = getParentPath(entry[1]);
+    while(getDescendantNodeByPath(root, ancestor).type !== BLOCKS.LIST_ITEM){
+        ancestor = getParentPath(ancestor);
+    }
+    return [
+        getDescendantNodeByPath(root, ancestor),
+        ancestor
+    ];
+};
+const isListRoot = (node)=>[
+        BLOCKS.UL_LIST,
+        BLOCKS.OL_LIST
+    ].includes(node.type);
+const trimList = (listRoot)=>{
+    if (!isListRoot(listRoot)) {
+        return [
+            listRoot
+        ];
+    }
+    const textEntries = Array.from(getNodeTexts(listRoot));
+    const commonAncestorEntry = textEntries.reduce((commonAncestor, textEntry)=>isAncestorPath(commonAncestor[1], textEntry[1]) ? commonAncestor : getCommonNode(listRoot, textEntry[1], commonAncestor[1]), getFirstAncestorOfType(listRoot, textEntries[0]));
+    return isListRoot(commonAncestorEntry[0]) ? commonAncestorEntry[0].children : [
+        commonAncestorEntry[0]
+    ];
+};
+const trimLiWrapper = (nodes)=>{
+    if (nodes.length !== 1) {
+        return nodes;
+    }
+    const node = nodes[0];
+    if (node.type !== BLOCKS.LIST_ITEM || node.children.length !== 1) {
+        return nodes;
+    }
+    return node.children;
+};
+const unwrapTextContainerAtStart = (nodes)=>{
+    const node = nodes[0];
+    if (TEXT_CONTAINERS.includes(node.type)) {
+        return [
+            ...node.children,
+            ...nodes.slice(1)
+        ];
+    }
+    return nodes;
+};
+export const insertListFragment = (editor)=>{
+    const { insertFragment  } = editor;
+    return (fragment)=>{
+        if (!editor.selection) {
+            return;
+        }
+        const liEntry = findNode(editor, {
+            match: {
+                type: BLOCKS.LIST_ITEM
+            },
+            mode: 'lowest'
+        });
+        if (liEntry) {
+            const nodes = unwrapTextContainerAtStart(trimLiWrapper(fragment.flatMap((node)=>trimList(node))));
+            let firstBlockIndex = nodes.findIndex((node)=>isBlockNode(editor, node));
+            if (firstBlockIndex < 0) {
+                firstBlockIndex = nodes.length;
+            }
+            const inlines = nodes.slice(0, firstBlockIndex);
+            const blocks = nodes.slice(firstBlockIndex);
+            insertNodes(editor, inlines, {
+                at: editor.selection,
+                select: true
+            });
+            return insertNodes(editor, blocks, {
+                at: editor.selection,
+                select: true
+            });
+        }
+        const filtered = isListRoot(fragment[0]) ? [
+            {
+                text: ''
+            },
+            ...fragment
+        ] : fragment;
+        return insertFragment(filtered);
+    };
+};

package/dist/esm/plugins/List/onKeyDownList.js

@@ -0,0 +1,31 @@
+import isHotkey from 'is-hotkey';
+import castArray from 'lodash/castArray';
+import { getAboveNode } from '../../internal/queries';
+import { moveListItems } from './transforms/moveListItems';
+import { toggleList } from './transforms/toggleList';
+export const onKeyDownList = (editor, { type , options: { hotkey  }  })=>(e)=>{
+        if (e.key === 'Tab' && editor.selection) {
+            const listSelected = getAboveNode(editor, {
+                at: editor.selection,
+                match: {
+                    type
+                }
+            });
+            if (listSelected) {
+                e.preventDefault();
+                moveListItems(editor, {
+                    increase: !e.shiftKey
+                });
+                return;
+            }
+        }
+        if (!hotkey) return;
+        const hotkeys = castArray(hotkey);
+        for (const _hotkey of hotkeys){
+            if (isHotkey(_hotkey)(e)) {
+                toggleList(editor, {
+                    type
+                });
+            }
+        }
+    };