@contentful/field-editor-rich-text 2.0.0-next.23 → 2.0.0-next.26

package/dist/field-editor-rich-text.cjs.development.js

@@ -427,10 +427,12 @@ function isBlockSelected(editor, type) {
 function isRootLevel(path) {
   return path.length === 1;
 }
-function getNodeEntryFromSelection(editor, nodeTypeOrTypes) {
-  if (!editor.selection) return [];
+function getNodeEntryFromSelection(editor, nodeTypeOrTypes, path) {
+  var _path, _editor$selection;
+
+  path = (_path = path) != null ? _path : (_editor$selection = editor.selection) == null ? void 0 : _editor$selection.focus.path;
+  if (!path) return [];
   var nodeTypes = Array.isArray(nodeTypeOrTypes) ? nodeTypeOrTypes : [nodeTypeOrTypes];
-  var path = editor.selection.focus.path;
 
   for (var i = 0; i < path.length; i++) {
     var nodeEntry = slate.Editor.node(editor, path.slice(0, i + 1));
@@ -589,18 +591,18 @@ function getAncestorPathFromSelection(editor) {
   });
 }
 var isAtEndOfTextSelection = function isAtEndOfTextSelection(editor) {
-  var _editor$selection, _editor$selection2;
+  var _editor$selection2, _editor$selection3;
 
-  return ((_editor$selection = editor.selection) == null ? void 0 : _editor$selection.focus.offset) === plateCore.getText(editor, (_editor$selection2 = editor.selection) == null ? void 0 : _editor$selection2.focus.path).length;
+  return ((_editor$selection2 = editor.selection) == null ? void 0 : _editor$selection2.focus.offset) === plateCore.getText(editor, (_editor$selection3 = editor.selection) == null ? void 0 : _editor$selection3.focus.path).length;
 };
 function currentSelectionStartsTableCell(editor) {
-  var _editor$selection3;
+  var _editor$selection4;
 
   var _getNodeEntryFromSele2 = getNodeEntryFromSelection(editor, [Contentful.BLOCKS.TABLE_CELL, Contentful.BLOCKS.TABLE_HEADER_CELL]),
       tableCellNode = _getNodeEntryFromSele2[0],
       path = _getNodeEntryFromSele2[1];
 
-  return !!tableCellNode && (!plateCore.getText(editor, path) || ((_editor$selection3 = editor.selection) == null ? void 0 : _editor$selection3.focus.offset) === 0);
+  return !!tableCellNode && (!plateCore.getText(editor, path) || ((_editor$selection4 = editor.selection) == null ? void 0 : _editor$selection4.focus.offset) === 0);
 }
 /**
  * This traversal strategy is unfortunately necessary because Slate doesn't
@@ -1063,6 +1065,9 @@ function FetchingWrappedEntryCard(props) {
 var styles$3 = {
   root: /*#__PURE__*/emotion.css({
     marginBottom: '1.25rem !important',
+    display: 'block'
+  }),
+  container: /*#__PURE__*/emotion.css({
     // The next 2 properties ensure Entity card won't be aligned above
     // a list item marker (i.e. bullet)
     display: 'inline-block',
@@ -1107,7 +1112,8 @@ function LinkedEntityBlock(props) {
   }), /*#__PURE__*/React__default.createElement("div", {
     // COMPAT: This makes copy & paste work for Chromium/Blink browsers and Safari
     contentEditable: HAS_BEFORE_INPUT_SUPPORT ? false : undefined,
-    draggable: HAS_BEFORE_INPUT_SUPPORT ? true : undefined
+    draggable: HAS_BEFORE_INPUT_SUPPORT ? true : undefined,
+    className: styles$3.container
   }, entityType === 'Entry' && /*#__PURE__*/React__default.createElement(FetchingWrappedEntryCard, {
     sdk: sdk,
     entryId: entityId,
@@ -3210,29 +3216,31 @@ function HyperlinkModal(props) {
     testId: "confirm-cta"
   }, props.linkType ? 'Update' : 'Insert'))));
 }
-function addOrEditLink(_x, _x2, _x3) {
+function addOrEditLink(_x, _x2, _x3, _x4) {
   return _addOrEditLink.apply(this, arguments);
 }
 
 function _addOrEditLink() {
-  _addOrEditLink = _asyncToGenerator( /*#__PURE__*/runtime_1.mark(function _callee3(editor, sdk, logAction) {
+  _addOrEditLink = _asyncToGenerator( /*#__PURE__*/runtime_1.mark(function _callee3(editor, sdk, logAction, targetPath) {
     var _target$sys$linkType;
 
-    var linkType, linkText, linkTarget, linkEntity, _getNodeEntryFromSele, node, path, selectionBeforeBlur, currentLinkText, isEditing, data, text, url, type, target;
+    var selectionBeforeBlur, linkType, linkText, linkTarget, linkEntity, _getNodeEntryFromSele, node, path, selectionAfterFocus, currentLinkText, isEditing, data, text, url, type, target;
 
     return runtime_1.wrap(function _callee3$(_context3) {
       while (1) {
         switch (_context3.prev = _context3.next) {
           case 0:
-            if (editor.selection) {
-              _context3.next = 2;
+            selectionBeforeBlur = editor.selection ? _extends({}, editor.selection) : undefined;
+
+            if (!(!targetPath && !selectionBeforeBlur)) {
+              _context3.next = 3;
               break;
             }
 
             return _context3.abrupt("return");
 
-          case 2:
-            _getNodeEntryFromSele = getNodeEntryFromSelection(editor, LINK_TYPES), node = _getNodeEntryFromSele[0], path = _getNodeEntryFromSele[1];
+          case 3:
+            _getNodeEntryFromSele = getNodeEntryFromSelection(editor, LINK_TYPES, targetPath), node = _getNodeEntryFromSele[0], path = _getNodeEntryFromSele[1];
 
             if (node && path) {
               linkType = node.type;
@@ -3241,11 +3249,11 @@ function _addOrEditLink() {
               linkEntity = node.data.target;
             }
 
-            selectionBeforeBlur = _extends({}, editor.selection);
-            currentLinkText = linkText || slate.Editor.string(editor, editor.selection);
+            selectionAfterFocus = targetPath != null ? targetPath : selectionBeforeBlur;
+            currentLinkText = linkText || (editor.selection ? slate.Editor.string(editor, editor.selection) : '');
             isEditing = Boolean(node && path);
             logAction(isEditing ? 'openEditHyperlinkDialog' : 'openCreateHyperlinkDialog');
-            _context3.next = 10;
+            _context3.next = 11;
             return fieldEditorShared.ModalDialogLauncher.openDialog({
               title: isEditing ? 'Edit hyperlink' : 'Insert hyperlink',
               width: 'large',
@@ -3264,20 +3272,21 @@ function _addOrEditLink() {
               });
             });
 
-          case 10:
+          case 11:
             data = _context3.sent;
+            slate.Transforms.select(editor, selectionAfterFocus);
 
             if (data) {
-              _context3.next = 14;
+              _context3.next = 17;
               break;
             }
 
+            focus(editor);
             logAction(isEditing ? 'cancelEditHyperlinkDialog' : 'cancelCreateHyperlinkDialog');
             return _context3.abrupt("return");
 
-          case 14:
+          case 17:
             text = data.linkText, url = data.linkTarget, type = data.linkType, target = data.linkEntity;
-            slate.Transforms.select(editor, selectionBeforeBlur);
             slate.Editor.withoutNormalizing(editor, function () {
               insertLink(editor, {
                 text: text,
@@ -3293,7 +3302,7 @@ function _addOrEditLink() {
             });
             focus(editor);
 
-          case 19:
+          case 21:
           case "end":
             return _context3.stop();
         }
@@ -3547,7 +3556,11 @@ function EntityHyperlink(props) {
     event.preventDefault();
     event.stopPropagation();
     if (!editor) return;
-    addOrEditLink(editor, sdk, editor.tracking.onViewportAction);
+    var p = Slate.ReactEditor.toSlatePoint(editor, [event.target, 0], {
+      exactMatch: false,
+      suppressThrow: false
+    });
+    addOrEditLink(editor, sdk, editor.tracking.onViewportAction, p.path);
   }
 
   return /*#__PURE__*/React.createElement(f36Components.Tooltip, {
@@ -3575,7 +3588,11 @@ function UrlHyperlink(props) {
     event.preventDefault();
     event.stopPropagation();
     if (!editor) return;
-    addOrEditLink(editor, sdk, editor.tracking.onViewportAction);
+    var p = Slate.ReactEditor.toSlatePoint(editor, [event.target, 0], {
+      exactMatch: false,
+      suppressThrow: false
+    });
+    addOrEditLink(editor, sdk, editor.tracking.onViewportAction, p.path);
   }
 
   return /*#__PURE__*/React.createElement(f36Components.Tooltip, {
@@ -3851,37 +3868,44 @@ var moveListItems = function moveListItems(editor, _temp) {
  * Credit: Modified version of Plate's list plugin
  * See: https://github.com/udecode/plate/blob/main/packages/nodes/list
  */
-var listTypes = [Contentful.BLOCKS.UL_LIST, Contentful.BLOCKS.OL_LIST];
+
+function hasUnliftedListItems(editor, at) {
+  return slate.Editor.nodes(editor, {
+    at: at,
+    match: function match(node, path) {
+      return slate.Element.isElement(node) && node.type === Contentful.BLOCKS.LIST_ITEM && path.length >= 2;
+    }
+  }).next().done;
+}
+
 var unwrapList = function unwrapList(editor, _temp) {
   var _ref = _temp === void 0 ? {} : _temp,
       at = _ref.at;
 
   slate.Editor.withoutNormalizing(editor, function () {
     do {
-      plateCore.unwrapNodes(editor, {
+      // lift list items to the root level
+      slate.Transforms.liftNodes(editor, {
         at: at,
-        match: {
-          type: Contentful.BLOCKS.LIST_ITEM
+        match: function match(node) {
+          return slate.Element.isElement(node) && node.type === Contentful.BLOCKS.LIST_ITEM;
         },
-        split: true
+        mode: 'lowest'
       });
-      plateCore.unwrapNodes(editor, {
-        at: at,
-        match: {
-          type: listTypes
-        },
-        split: true
-      });
-    } while (plateCore.getAbove(editor, {
+    } while (!hasUnliftedListItems(editor, at)); // finally unwrap all lifted items
+
+
+    plateCore.unwrapNodes(editor, {
+      at: at,
       match: {
-        type: listTypes,
-        at: at
-      }
-    }));
+        type: Contentful.BLOCKS.LIST_ITEM
+      },
+      split: false
+    });
   });
 };
 
-var listTypes$1 = [Contentful.BLOCKS.UL_LIST, Contentful.BLOCKS.OL_LIST];
+var listTypes = [Contentful.BLOCKS.UL_LIST, Contentful.BLOCKS.OL_LIST];
 var toggleList = function toggleList(editor, _ref) {
   var type = _ref.type;
   return slate.Editor.withoutNormalizing(editor, function () {
@@ -3902,7 +3926,7 @@ var toggleList = function toggleList(editor, _ref) {
           }, {
             at: editor.selection,
             match: function match(n) {
-              return listTypes$1.includes(n.type);
+              return listTypes.includes(n.type);
             },
             mode: 'lowest'
           });
@@ -3943,19 +3967,25 @@ var toggleList = function toggleList(editor, _ref) {
 
       var commonEntry = slate.Node.common(editor, startPoint.path, endPoint.path);
 
-      if (listTypes$1.includes(commonEntry[0].type) || commonEntry[0].type === Contentful.BLOCKS.LIST_ITEM) {
-        if (commonEntry[0].type !== type) {
+      if (listTypes.includes(commonEntry[0].type) || commonEntry[0].type === Contentful.BLOCKS.LIST_ITEM) {
+        var listType = commonEntry[0].type;
+
+        if (commonEntry[0].type === Contentful.BLOCKS.LIST_ITEM) {
+          listType = slate.Editor.parent(editor, commonEntry[1])[0].type;
+        }
+
+        if (listType !== type) {
           var startList = plateCore.findNode(editor, {
             at: slate.Range.start(editor.selection),
             match: {
-              type: listTypes$1
+              type: listTypes
             },
             mode: 'lowest'
           });
           var endList = plateCore.findNode(editor, {
             at: slate.Range.end(editor.selection),
             match: {
-              type: listTypes$1
+              type: listTypes
             },
             mode: 'lowest'
           });
@@ -3970,7 +4000,7 @@ var toggleList = function toggleList(editor, _ref) {
           }, {
             at: editor.selection,
             match: function match(n, path) {
-              return listTypes$1.includes(n.type) && path.length >= rangeLength;
+              return listTypes.includes(n.type) && path.length >= rangeLength;
             },
             mode: 'all'
           });
@@ -3988,7 +4018,7 @@ var toggleList = function toggleList(editor, _ref) {
         }).reverse();
 
         _nodes.forEach(function (n) {
-          if (listTypes$1.includes(n[0].type)) {
+          if (listTypes.includes(n[0].type)) {
             plateCore.setNodes(editor, {
               type: type
             }, {
@@ -4139,7 +4169,25 @@ var replaceNodeWithListItems = function replaceNodeWithListItems(editor, entry)
   });
 };
 var isListTypeActive = function isListTypeActive(editor, type) {
-  // Lists can be nested. Here, we take the list type at the lowest level
+  var selection = editor.selection;
+
+  if (!selection) {
+    return false;
+  }
+
+  if (slate.Range.isExpanded(selection)) {
+    var _Range$edges = slate.Range.edges(selection),
+        start = _Range$edges[0],
+        end = _Range$edges[1];
+
+    var node = slate.Node.common(editor, start.path, end.path);
+
+    if (node[0].type === type) {
+      return true;
+    }
+  } // Lists can be nested. Here, we take the list type at the lowest level
+
+
   var listNode = plateCore.getBlockAbove(editor, {
     match: {
       type: [Contentful.BLOCKS.OL_LIST, Contentful.BLOCKS.UL_LIST]
@@ -5186,9 +5234,9 @@ var sanitizeHTML = function sanitizeHTML(html) {
   // Parse the HTML string and pipe it through our transformers
   var doc = transformers.reduce(function (value, cb) {
     return cb(value);
-  }, new DOMParser().parseFromString(html, 'text/html')); // Remove whitespace between tags
-
-  return doc.body.innerHTML.replace(/>\s+</g, '><');
+  }, new DOMParser().parseFromString(html, 'text/html'));
+  return doc.body.innerHTML.replace(/>\s+</g, '><') // Remove whitespace between tags
+  .replace(/(.*)<div.*>(<table.*<\/table>)<\/div>(.*)/g, '$1$2$3'); // remove div containers from tables
 };
 
 /**
@@ -5729,6 +5777,9 @@ var isNotEmpty = function isNotEmpty(editor, _ref4) {
   var path = _ref4[1];
   return Array.from(slate.Node.children(editor, path)).length !== 0;
 };
+var isTable = function isTable(node) {
+  return slate.Element.isElement(node) && node.type === Contentful.BLOCKS.TABLE;
+};
 
 var styles$i = {
   topRight: /*#__PURE__*/emotion.css({
@@ -5906,13 +5957,19 @@ var createTablePlugin = function createTablePlugin() {
       var insertFragment = editor.insertFragment;
 
       editor.insertFragment = function (fragments) {
+        var _editor$selection;
+
         // We need to make sure we have a new, empty and clean paragraph in order to paste tables as-is due to how Slate behaves
         // More info: https://github.com/ianstormtaylor/slate/pull/4489 and https://github.com/ianstormtaylor/slate/issues/4542
-        var fragmentHasTable = fragments.some(function (fragment) {
-          return fragment.type === Contentful.BLOCKS.TABLE;
+        var isInsertingTable = fragments.some(function (fragment) {
+          return isTable(fragment);
         });
+        var isTableFirstFragment = fragments.findIndex(function (fragment) {
+          return isTable(fragment);
+        }) === 0;
+        var currentLineHasText = plateCore.getText(editor, (_editor$selection = editor.selection) == null ? void 0 : _editor$selection.focus.path) !== '';
 
-        if (fragmentHasTable) {
+        if (isInsertingTable && isTableFirstFragment && currentLineHasText) {
           insertEmptyParagraph(editor);
         }