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

package/dist/cjs/plugins/shared/EmbeddedBlockUtil.js

@@ -0,0 +1,170 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+function _export(target, all) {
+    for(var name in all)Object.defineProperty(target, name, {
+        enumerable: true,
+        get: all[name]
+    });
+}
+_export(exports, {
+    getWithEmbeddedBlockEvents: function() {
+        return getWithEmbeddedBlockEvents;
+    },
+    selectEntityAndInsert: function() {
+        return selectEntityAndInsert;
+    },
+    selectResourceEntityAndInsert: function() {
+        return selectResourceEntityAndInsert;
+    }
+});
+const _richtexttypes = require("@contentful/rich-text-types");
+const _ishotkey = _interop_require_default(require("is-hotkey"));
+const _editor = require("../../helpers/editor");
+const _newEntitySelectorConfigFromRichTextField = _interop_require_default(require("../../helpers/newEntitySelectorConfigFromRichTextField"));
+const _newResourceEntitySelectorConfigFromRichTextField = _interop_require_default(require("../../helpers/newResourceEntitySelectorConfigFromRichTextField"));
+const _sdkNavigatorSlideIn = require("../../helpers/sdkNavigatorSlideIn");
+const _internal = require("../../internal");
+function _interop_require_default(obj) {
+    return obj && obj.__esModule ? obj : {
+        default: obj
+    };
+}
+function getWithEmbeddedBlockEvents(nodeType, sdk) {
+    return (editor, { options: { hotkey  }  })=>(event)=>{
+            const [, pathToSelectedElement] = (0, _editor.getNodeEntryFromSelection)(editor, nodeType);
+            if (pathToSelectedElement) {
+                const isDelete = event.key === 'Delete';
+                const isBackspace = event.key === 'Backspace';
+                if (isDelete || isBackspace) {
+                    event.preventDefault();
+                    (0, _internal.removeNodes)(editor, {
+                        at: pathToSelectedElement
+                    });
+                }
+                return;
+            }
+            if (hotkey && (0, _ishotkey.default)(hotkey, event)) {
+                if (nodeType === _richtexttypes.BLOCKS.EMBEDDED_RESOURCE) {
+                    selectResourceEntityAndInsert(sdk, editor, editor.tracking.onShortcutAction);
+                } else {
+                    selectEntityAndInsert(nodeType, sdk, editor, editor.tracking.onShortcutAction);
+                }
+            }
+        };
+}
+async function selectEntityAndInsert(nodeType, sdk, editor, logAction) {
+    logAction('openCreateEmbedDialog', {
+        nodeType
+    });
+    const { field , dialogs  } = sdk;
+    const baseConfig = (0, _newEntitySelectorConfigFromRichTextField.default)(field, nodeType);
+    const selectEntity = baseConfig.entityType === 'Asset' ? dialogs.selectSingleAsset : dialogs.selectSingleEntry;
+    const config = {
+        ...baseConfig,
+        withCreate: true
+    };
+    const { selection  } = editor;
+    const rteSlide = (0, _sdkNavigatorSlideIn.watchCurrentSlide)(sdk.navigator);
+    const entity = await selectEntity(config);
+    if (!entity) {
+        logAction('cancelCreateEmbedDialog', {
+            nodeType
+        });
+    } else {
+        (0, _internal.select)(editor, selection);
+        insertBlock(editor, nodeType, entity);
+        ensureFollowingParagraph(editor, [
+            _richtexttypes.BLOCKS.EMBEDDED_ASSET,
+            _richtexttypes.BLOCKS.EMBEDDED_ENTRY
+        ]);
+        logAction('insert', {
+            nodeType
+        });
+    }
+    rteSlide.onActive(()=>{
+        rteSlide.unwatch();
+        (0, _editor.focus)(editor);
+    });
+}
+async function selectResourceEntityAndInsert(sdk, editor, logAction) {
+    logAction('openCreateEmbedDialog', {
+        nodeType: _richtexttypes.BLOCKS.EMBEDDED_RESOURCE
+    });
+    const { field , dialogs  } = sdk;
+    const config = (0, _newResourceEntitySelectorConfigFromRichTextField.default)(field, _richtexttypes.BLOCKS.EMBEDDED_RESOURCE);
+    const { selection  } = editor;
+    const entity = await dialogs.selectSingleResourceEntry(config);
+    if (!entity) {
+        logAction('cancelCreateEmbedDialog', {
+            nodeType: _richtexttypes.BLOCKS.EMBEDDED_RESOURCE
+        });
+    } else {
+        (0, _internal.select)(editor, selection);
+        insertBlock(editor, _richtexttypes.BLOCKS.EMBEDDED_RESOURCE, entity);
+        ensureFollowingParagraph(editor, [
+            _richtexttypes.BLOCKS.EMBEDDED_RESOURCE
+        ]);
+        logAction('insert', {
+            nodeType: _richtexttypes.BLOCKS.EMBEDDED_RESOURCE
+        });
+    }
+}
+function ensureFollowingParagraph(editor, nodeTypes) {
+    const entityBlock = (0, _internal.getAboveNode)(editor, {
+        match: {
+            type: nodeTypes
+        }
+    });
+    if (!entityBlock) {
+        return;
+    }
+    const level = entityBlock[1].length - 1;
+    const lastNode = (0, _internal.getLastNodeByLevel)(editor, level);
+    const isTextContainer = _richtexttypes.TEXT_CONTAINERS.includes(lastNode?.[0].type ?? '');
+    if (level !== 0 && !isTextContainer) {
+        (0, _editor.insertEmptyParagraph)(editor);
+    }
+    (0, _editor.moveToTheNextChar)(editor);
+}
+const getLink = (nodeType, entity)=>{
+    if (nodeType === _richtexttypes.BLOCKS.EMBEDDED_RESOURCE) {
+        return {
+            urn: entity.sys.urn,
+            type: 'ResourceLink',
+            linkType: 'Contentful:Entry'
+        };
+    }
+    return {
+        id: entity.sys.id,
+        type: 'Link',
+        linkType: entity.sys.type
+    };
+};
+const createNode = (nodeType, entity)=>{
+    return {
+        type: nodeType,
+        data: {
+            target: {
+                sys: getLink(nodeType, entity)
+            }
+        },
+        children: [
+            {
+                text: ''
+            }
+        ],
+        isVoid: true
+    };
+};
+function insertBlock(editor, nodeType, entity) {
+    if (!editor?.selection) return;
+    const linkedEntityBlock = createNode(nodeType, entity);
+    const hasText = editor.selection && !!(0, _internal.getText)(editor, editor.selection.focus.path);
+    if (hasText) {
+        (0, _internal.insertNodes)(editor, linkedEntityBlock);
+    } else {
+        (0, _internal.setNodes)(editor, linkedEntityBlock);
+    }
+}

package/dist/cjs/plugins/shared/FetchingWrappedResourceCard.js

@@ -0,0 +1,110 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+Object.defineProperty(exports, "FetchingWrappedResourceCard", {
+    enumerable: true,
+    get: function() {
+        return FetchingWrappedResourceCard;
+    }
+});
+const _react = _interop_require_wildcard(require("react"));
+const _f36components = require("@contentful/f36-components");
+const _fieldeditorreference = require("@contentful/field-editor-reference");
+const _fastdeepequal = _interop_require_default(require("fast-deep-equal"));
+function _interop_require_default(obj) {
+    return obj && obj.__esModule ? obj : {
+        default: obj
+    };
+}
+function _getRequireWildcardCache(nodeInterop) {
+    if (typeof WeakMap !== "function") return null;
+    var cacheBabelInterop = new WeakMap();
+    var cacheNodeInterop = new WeakMap();
+    return (_getRequireWildcardCache = function(nodeInterop) {
+        return nodeInterop ? cacheNodeInterop : cacheBabelInterop;
+    })(nodeInterop);
+}
+function _interop_require_wildcard(obj, nodeInterop) {
+    if (!nodeInterop && obj && obj.__esModule) {
+        return obj;
+    }
+    if (obj === null || typeof obj !== "object" && typeof obj !== "function") {
+        return {
+            default: obj
+        };
+    }
+    var cache = _getRequireWildcardCache(nodeInterop);
+    if (cache && cache.has(obj)) {
+        return cache.get(obj);
+    }
+    var newObj = {};
+    var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor;
+    for(var key in obj){
+        if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) {
+            var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null;
+            if (desc && (desc.get || desc.set)) {
+                Object.defineProperty(newObj, key, desc);
+            } else {
+                newObj[key] = obj[key];
+            }
+        }
+    }
+    newObj.default = obj;
+    if (cache) {
+        cache.set(obj, newObj);
+    }
+    return newObj;
+}
+const InternalEntryCard = _react.memo((props)=>{
+    if (props.status === 'loading') {
+        return _react.createElement(_f36components.EntryCard, {
+            isLoading: true
+        });
+    }
+    if (!props.data || props.status === 'error') {
+        return _react.createElement(_fieldeditorreference.MissingEntityCard, {
+            entityType: "Entry",
+            isDisabled: props.isDisabled,
+            onRemove: props.onRemove
+        });
+    }
+    const { contentType , resource: entry , space  } = props.data;
+    return _react.createElement(_fieldeditorreference.WrappedEntryCard, {
+        size: "default",
+        getAsset: ()=>Promise.resolve(),
+        isSelected: props.isSelected,
+        isDisabled: props.isDisabled,
+        localeCode: props.data.defaultLocaleCode,
+        defaultLocaleCode: props.data.defaultLocaleCode,
+        contentType: contentType,
+        spaceName: space?.name,
+        entry: entry,
+        onEdit: props.onEdit,
+        onRemove: props.isDisabled ? undefined : props.onRemove,
+        isClickable: false,
+        getEntityScheduledActions: ()=>Promise.resolve([])
+    });
+}, _fastdeepequal.default);
+InternalEntryCard.displayName = 'ReferenceCard';
+const FetchingWrappedResourceCard = (props)=>{
+    const { link , onEntityFetchComplete  } = props;
+    const { data , status  } = (0, _fieldeditorreference.useResource)(link.linkType, link.urn);
+    _react.useEffect(()=>{
+        if (status === 'success') {
+            onEntityFetchComplete?.();
+        }
+    }, [
+        onEntityFetchComplete,
+        status
+    ]);
+    return _react.createElement(InternalEntryCard, {
+        data: data,
+        status: status,
+        sdk: props.sdk,
+        isDisabled: props.isDisabled,
+        isSelected: props.isSelected,
+        onEdit: props.onEdit,
+        onRemove: props.onRemove
+    });
+};

package/dist/cjs/plugins/shared/LinkedBlockWrapper.js

@@ -0,0 +1,45 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+Object.defineProperty(exports, "LinkedBlockWrapper", {
+    enumerable: true,
+    get: function() {
+        return LinkedBlockWrapper;
+    }
+});
+const _react = _interop_require_default(require("react"));
+const _emotion = require("emotion");
+const _environment = require("../../helpers/environment");
+function _interop_require_default(obj) {
+    return obj && obj.__esModule ? obj : {
+        default: obj
+    };
+}
+const styles = {
+    root: (0, _emotion.css)({
+        marginBottom: '1.25rem !important',
+        display: 'block'
+    }),
+    container: (0, _emotion.css)({
+        display: 'inline-block',
+        verticalAlign: 'text-top',
+        width: '100%'
+    })
+};
+const isResourceLink = (link)=>!!link.urn;
+function LinkedBlockWrapper({ attributes , card , children , element  }) {
+    const link = element.data.target.sys;
+    return _react.default.createElement("div", {
+        ...attributes,
+        className: styles.root,
+        "data-entity-type": link.linkType,
+        "data-entity-id": isResourceLink(link) ? link.urn : link.id,
+        contentEditable: _environment.IS_CHROME ? undefined : false,
+        draggable: _environment.IS_CHROME ? true : undefined
+    }, _react.default.createElement("div", {
+        contentEditable: _environment.IS_CHROME ? false : undefined,
+        draggable: _environment.IS_CHROME ? true : undefined,
+        className: styles.container
+    }, card), children);
+}

package/dist/cjs/useOnValueChanged.js

@@ -28,7 +28,7 @@ const isRelevantOperation = (op)=>{
 const useOnValueChanged = ({ editorId , handler , skip , onSkip  })=>{
     const onChange = (0, _react.useMemo)(()=>(0, _debounce.default)((document)=>{
             const contentfulDocument = (0, _contentfulslatejsadapter.toContentfulDocument)({
-                document,
+                document: document,
                 schema: _Schema.default
             });
             const cleanedDocument = (0, _removeInternalMarks.removeInternalMarks)(contentfulDocument);

package/dist/esm/Toolbar/components/EmbedEntityWidget.js

@@ -3,8 +3,8 @@ import { BLOCKS, INLINES } from '@contentful/rich-text-types';
 import { useContentfulEditor } from '../../ContentfulEditorProvider';
 import { isLinkActive } from '../../helpers/editor';
 import { isNodeTypeEnabled } from '../../helpers/validations';
-import { ToolbarIcon as EmbeddedEntityBlockToolbarIcon } from '../../plugins/EmbeddedEntityBlock';
 import { ToolbarEmbeddedEntityInlineButton } from '../../plugins/EmbeddedEntityInline';
+import { EmbeddedBlockToolbarIcon } from '../../plugins/shared/EmbeddedBlockToolbarIcon';
 import { useSdkContext } from '../../SdkProvider';
 import { EmbeddedEntityDropdownButton } from './EmbeddedEntityDropdownButton';
 export const EmbedEntityWidget = ({ isDisabled , canInsertBlocks  })=>{
@@ -15,15 +15,20 @@ export const EmbedEntityWidget = ({ isDisabled , canInsertBlocks  })=>{
     const onToggleEntityDropdown = ()=>setEmbedDropdownOpen(!isEmbedDropdownOpen);
     const inlineEntryEmbedEnabled = isNodeTypeEnabled(sdk.field, INLINES.EMBEDDED_ENTRY);
     const blockEntryEmbedEnabled = isNodeTypeEnabled(sdk.field, BLOCKS.EMBEDDED_ENTRY) && canInsertBlocks;
+    const blockResourceEmbedEnabled = isNodeTypeEnabled(sdk.field, BLOCKS.EMBEDDED_RESOURCE) && canInsertBlocks;
     const blockAssetEmbedEnabled = isNodeTypeEnabled(sdk.field, BLOCKS.EMBEDDED_ASSET) && canInsertBlocks;
-    const actions = React.createElement(React.Fragment, null, blockEntryEmbedEnabled && React.createElement(EmbeddedEntityBlockToolbarIcon, {
+    const actions = React.createElement(React.Fragment, null, blockEntryEmbedEnabled && React.createElement(EmbeddedBlockToolbarIcon, {
         isDisabled: !!isDisabled,
         nodeType: BLOCKS.EMBEDDED_ENTRY,
         onClose: onCloseEntityDropdown
+    }), blockResourceEmbedEnabled && React.createElement(EmbeddedBlockToolbarIcon, {
+        isDisabled: !!isDisabled,
+        nodeType: BLOCKS.EMBEDDED_RESOURCE,
+        onClose: onCloseEntityDropdown
     }), inlineEntryEmbedEnabled && React.createElement(ToolbarEmbeddedEntityInlineButton, {
         isDisabled: !!isDisabled || isLinkActive(editor),
         onClose: onCloseEntityDropdown
-    }), blockAssetEmbedEnabled && React.createElement(EmbeddedEntityBlockToolbarIcon, {
+    }), blockAssetEmbedEnabled && React.createElement(EmbeddedBlockToolbarIcon, {
         isDisabled: !!isDisabled,
         nodeType: BLOCKS.EMBEDDED_ASSET,
         onClose: onCloseEntityDropdown

package/dist/esm/helpers/__tests__/removeInternalMarks.test.js

@@ -7,36 +7,52 @@ describe('internal mark', ()=>{
         const data = [
             {
                 title: 'Paragraph mark is removed',
-                input: toContentfulDocument(jsx("editor", null, jsx("hp", null, jsx("htext", {
-                    [COMMAND_PROMPT]: true
-                }))).children),
-                expected: toContentfulDocument(jsx("editor", null, jsx("hp", null, jsx("htext", null))).children)
+                input: toContentfulDocument({
+                    document: jsx("editor", null, jsx("hp", null, jsx("htext", {
+                        [COMMAND_PROMPT]: true
+                    }))).children
+                }),
+                expected: toContentfulDocument({
+                    document: jsx("editor", null, jsx("hp", null, jsx("htext", null))).children
+                })
             },
             {
                 title: 'Heading mark is removed',
-                input: toContentfulDocument(jsx("editor", null, jsx("hh1", null, jsx("htext", {
-                    [COMMAND_PROMPT]: true
-                }))).children),
-                expected: toContentfulDocument(jsx("editor", null, jsx("hh1", null, jsx("htext", null))).children)
+                input: toContentfulDocument({
+                    document: jsx("editor", null, jsx("hh1", null, jsx("htext", {
+                        [COMMAND_PROMPT]: true
+                    }))).children
+                }),
+                expected: toContentfulDocument({
+                    document: jsx("editor", null, jsx("hh1", null, jsx("htext", null))).children
+                })
             },
             {
                 title: 'Block quote mark is removed',
-                input: toContentfulDocument(jsx("editor", null, jsx("hquote", null, jsx("hp", null, jsx("htext", {
-                    [COMMAND_PROMPT]: true
-                })))).children),
-                expected: toContentfulDocument(jsx("editor", null, jsx("hquote", null, jsx("hp", null, jsx("htext", null)))).children)
+                input: toContentfulDocument({
+                    document: jsx("editor", null, jsx("hquote", null, jsx("hp", null, jsx("htext", {
+                        [COMMAND_PROMPT]: true
+                    })))).children
+                }),
+                expected: toContentfulDocument({
+                    document: jsx("editor", null, jsx("hquote", null, jsx("hp", null, jsx("htext", null)))).children
+                })
             },
             {
                 title: 'Other marks are not removed',
-                input: toContentfulDocument(jsx("editor", null, jsx("hquote", null, jsx("hp", null, jsx("htext", {
-                    bold: true,
-                    underline: true,
-                    [COMMAND_PROMPT]: true
-                })))).children),
-                expected: toContentfulDocument(jsx("editor", null, jsx("hquote", null, jsx("hp", null, jsx("htext", {
-                    bold: true,
-                    underline: true
-                })))).children)
+                input: toContentfulDocument({
+                    document: jsx("editor", null, jsx("hquote", null, jsx("hp", null, jsx("htext", {
+                        bold: true,
+                        underline: true,
+                        [COMMAND_PROMPT]: true
+                    })))).children
+                }),
+                expected: toContentfulDocument({
+                    document: jsx("editor", null, jsx("hquote", null, jsx("hp", null, jsx("htext", {
+                        bold: true,
+                        underline: true
+                    })))).children
+                })
             }
         ];
         for (const { input , expected , title  } of data){

package/dist/esm/helpers/getAllowedResourcesForNodeType.js

@@ -0,0 +1,10 @@
+import find from 'lodash/find';
+import flow from 'lodash/flow';
+import get from 'lodash/get';
+export default function getAllowedResourcesForNodeType(field, nodeType) {
+    return flow((validations)=>find(validations, 'nodes'), (validations)=>get(validations, [
+            'nodes',
+            nodeType,
+            'allowedResources'
+        ], []))(field.validations);
+}

package/dist/esm/helpers/newResourceEntitySelectorConfigFromRichTextField.js

@@ -0,0 +1,6 @@
+import getAllowedResourcesForNodeType from './getAllowedResourcesForNodeType';
+export default function newResourceEntitySelectorConfigFromRichTextField(field, nodeType) {
+    return {
+        allowedResources: getAllowedResourcesForNodeType(field, nodeType)
+    };
+}

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

@@ -4,6 +4,7 @@ export function createDragAndDropPlugin() {
     const DRAGGABLE_TYPES = [
         BLOCKS.EMBEDDED_ENTRY,
         BLOCKS.EMBEDDED_ASSET,
+        BLOCKS.EMBEDDED_RESOURCE,
         BLOCKS.HR,
         INLINES.EMBEDDED_ENTRY
     ];

package/dist/esm/plugins/EmbeddedEntityBlock/LinkedEntityBlock.js

@@ -1,26 +1,16 @@
 import * as React from 'react';
-import { css } from 'emotion';
 import { useReadOnly, useSelected } from 'slate-react';
 import { useContentfulEditor } from '../../ContentfulEditorProvider';
-import { IS_CHROME } from '../../helpers/environment';
 import { findNodePath } from '../../internal/queries';
 import { removeNodes } from '../../internal/transforms';
 import { useSdkContext } from '../../SdkProvider';
+import { useLinkTracking } from '../links-tracking';
 import { FetchingWrappedAssetCard } from '../shared/FetchingWrappedAssetCard';
 import { FetchingWrappedEntryCard } from '../shared/FetchingWrappedEntryCard';
-const styles = {
-    root: css({
-        marginBottom: '1.25rem !important',
-        display: 'block'
-    }),
-    container: css({
-        display: 'inline-block',
-        verticalAlign: 'text-top',
-        width: '100%'
-    })
-};
+import { LinkedBlockWrapper } from '../shared/LinkedBlockWrapper';
 export function LinkedEntityBlock(props) {
-    const { attributes , children , element , onEntityFetchComplete  } = props;
+    const { attributes , children , element  } = props;
+    const { onEntityFetchComplete  } = useLinkTracking();
     const isSelected = useSelected();
     const editor = useContentfulEditor();
     const sdk = useSdkContext();
@@ -46,34 +36,27 @@ export function LinkedEntityBlock(props) {
         editor,
         element
     ]);
-    return React.createElement("div", {
-        ...attributes,
-        className: styles.root,
-        "data-entity-type": entityType,
-        "data-entity-id": entityId,
-        contentEditable: IS_CHROME ? undefined : false,
-        draggable: IS_CHROME ? true : undefined
-    }, React.createElement("div", {
-        contentEditable: IS_CHROME ? false : undefined,
-        draggable: IS_CHROME ? true : undefined,
-        className: styles.container
-    }, entityType === 'Entry' && React.createElement(FetchingWrappedEntryCard, {
-        sdk: sdk,
-        entryId: entityId,
-        locale: sdk.field.locale,
-        isDisabled: isDisabled,
-        isSelected: isSelected,
-        onRemove: handleRemoveClick,
-        onEdit: handleEditClick,
-        onEntityFetchComplete: onEntityFetchComplete
-    }), entityType === 'Asset' && React.createElement(FetchingWrappedAssetCard, {
-        sdk: sdk,
-        assetId: entityId,
-        locale: sdk.field.locale,
-        isDisabled: isDisabled,
-        isSelected: isSelected,
-        onRemove: handleRemoveClick,
-        onEdit: handleEditClick,
-        onEntityFetchComplete: onEntityFetchComplete
-    })), children);
+    return React.createElement(LinkedBlockWrapper, {
+        attributes: attributes,
+        card: React.createElement(React.Fragment, null, entityType === 'Entry' && React.createElement(FetchingWrappedEntryCard, {
+            sdk: sdk,
+            entryId: entityId,
+            locale: sdk.field.locale,
+            isDisabled: isDisabled,
+            isSelected: isSelected,
+            onRemove: handleRemoveClick,
+            onEdit: handleEditClick,
+            onEntityFetchComplete: onEntityFetchComplete
+        }), entityType === 'Asset' && React.createElement(FetchingWrappedAssetCard, {
+            sdk: sdk,
+            assetId: entityId,
+            locale: sdk.field.locale,
+            isDisabled: isDisabled,
+            isSelected: isSelected,
+            onRemove: handleRemoveClick,
+            onEdit: handleEditClick,
+            onEntityFetchComplete: onEntityFetchComplete
+        })),
+        element: element
+    }, children);
 }

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

@@ -1,45 +1,21 @@
 import { BLOCKS } from '@contentful/rich-text-types';
-import isHotkey from 'is-hotkey';
-import { getNodeEntryFromSelection } from '../../helpers/editor';
-import { removeNodes } from '../../internal/transforms';
-import { withLinkTracking } from '../links-tracking';
+import { getWithEmbeddedBlockEvents } from '../shared/EmbeddedBlockUtil';
 import { LinkedEntityBlock } from './LinkedEntityBlock';
-import { selectEntityAndInsert } from './Util';
-export { EmbeddedEntityBlockToolbarIcon as ToolbarIcon } from './ToolbarIcon';
 const entityTypes = {
     [BLOCKS.EMBEDDED_ENTRY]: 'Entry',
     [BLOCKS.EMBEDDED_ASSET]: 'Asset'
 };
-function getWithEmbeddedEntityEvents(nodeType, sdk) {
-    return (editor, { options: { hotkey  }  })=>(event)=>{
-            const [, pathToSelectedElement] = getNodeEntryFromSelection(editor, nodeType);
-            if (pathToSelectedElement) {
-                const isDelete = event.key === 'Delete';
-                const isBackspace = event.key === 'Backspace';
-                if (isDelete || isBackspace) {
-                    event.preventDefault();
-                    removeNodes(editor, {
-                        at: pathToSelectedElement
-                    });
-                }
-                return;
-            }
-            if (hotkey && isHotkey(hotkey, event)) {
-                selectEntityAndInsert(nodeType, sdk, editor, editor.tracking.onShortcutAction);
-            }
-        };
-}
 const createEmbeddedEntityPlugin = (nodeType, hotkey)=>(sdk)=>({
             key: nodeType,
             type: nodeType,
             isElement: true,
             isVoid: true,
-            component: withLinkTracking(LinkedEntityBlock),
+            component: LinkedEntityBlock,
             options: {
                 hotkey
             },
             handlers: {
-                onKeyDown: getWithEmbeddedEntityEvents(nodeType, sdk)
+                onKeyDown: getWithEmbeddedBlockEvents(nodeType, sdk)
             },
             deserializeHtml: {
                 rules: [

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

@@ -14,7 +14,7 @@ import { watchCurrentSlide } from '../../helpers/sdkNavigatorSlideIn';
 import { findNodePath } from '../../internal/queries';
 import { insertNodes, removeNodes, select } from '../../internal/transforms';
 import { useSdkContext } from '../../SdkProvider';
-import { withLinkTracking } from '../links-tracking';
+import { useLinkTracking } from '../links-tracking';
 import { FetchingWrappedInlineEntryCard } from './FetchingWrappedInlineEntryCard';
 import { createInlineEntryNode } from './Util';
 const styles = {
@@ -36,6 +36,7 @@ function EmbeddedEntityInline(props) {
     const isSelected = useSelected();
     const { id: entryId  } = props.element.data.target.sys;
     const isDisabled = useReadOnly();
+    const { onEntityFetchComplete  } = useLinkTracking();
     function handleEditClick() {
         return sdk.navigator.openEntry(entryId, {
             slideIn: {
@@ -68,7 +69,7 @@ function EmbeddedEntityInline(props) {
         isDisabled: isDisabled,
         onRemove: handleRemoveClick,
         onEdit: handleEditClick,
-        onEntityFetchComplete: props.onEntityFetchComplete
+        onEntityFetchComplete: onEntityFetchComplete
     })), props.children);
 }
 async function selectEntityAndInsert(editor, sdk, logAction) {
@@ -129,7 +130,7 @@ export function createEmbeddedEntityInlinePlugin(sdk) {
         isElement: true,
         isInline: true,
         isVoid: true,
-        component: withLinkTracking(EmbeddedEntityInline),
+        component: EmbeddedEntityInline,
         options: {
             hotkey: 'mod+shift+2'
         },