@contentful/field-editor-rich-text 3.4.7 → 3.4.8

package/CHANGELOG.md

@@ -3,6 +3,12 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [3.4.8](https://github.com/contentful/field-editors/compare/@contentful/field-editor-rich-text@3.4.7...@contentful/field-editor-rich-text@3.4.8) (2023-03-01)
+
+### Bug Fixes
+
+- do not focus RTE when another slide is open [TOL-989] ([#1353](https://github.com/contentful/field-editors/issues/1353)) ([db07c18](https://github.com/contentful/field-editors/commit/db07c180ab1e9bbd197f8b4b5eb74c1e0b5e251d))
+
 ## [3.4.7](https://github.com/contentful/field-editors/compare/@contentful/field-editor-rich-text@3.4.6...@contentful/field-editor-rich-text@3.4.7) (2023-02-21)
 
 **Note:** Version bump only for package @contentful/field-editor-rich-text

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

@@ -2758,13 +2758,91 @@ function getEntityTypeFromRichTextNode(nodeType) {
   throw new Error("RichText node type `" + nodeType + "` has no associated `entityType`");
 }
 
+/**
+ * Allows to observe when the current slide-in navigation slide gets e.g.
+ * re-activated after opening another slide on top. This is useful as the sdk
+ * does not give full insights into e.g. whether sdk.dialogs.selectSingleEntry()
+ * with `withCreate: true` option opens the slide-in navigation to edit the
+ * created entry after returning it.
+ */
+
+function watchCurrentSlide(navigator) {
+  var onActiveCallbacks = new Set();
+  var wasSlideClosed = false;
+  var initialSlideLevel;
+  var lastSlideLevel;
+
+  var status = function status() {
+    return {
+      wasClosed: wasSlideClosed,
+      isActive: !wasSlideClosed && lastSlideLevel === initialSlideLevel
+    };
+  };
+
+  var off = navigator.onSlideInNavigation(function (info) {
+    if (initialSlideLevel === undefined) {
+      initialSlideLevel = info.oldSlideLevel;
+    }
+
+    lastSlideLevel = info.newSlideLevel;
+
+    if (info.newSlideLevel < initialSlideLevel) {
+      wasSlideClosed = true;
+      off(); // No more point in watching, slide got closed.
+
+      onActiveCallbacks.clear();
+    }
+
+    if (status().isActive) {
+      onActiveCallbacks.forEach(function (cb) {
+        return cb();
+      });
+    }
+  });
+  /**
+   * Call to unsubscribe from navigator events when the watcher is no longer
+   * needed.
+   */
+
+  function unwatch() {
+    off();
+    onActiveCallbacks.clear();
+  }
+  /**
+   * Fires immediately when the slide is currently active, or at the point when
+   * it becomes active again, if there are slides on top that get closed. Does not
+   * fire when the observed slide gets closed, and then re-opened through browser
+   * back, as this technically opens a new slide and editor instance.
+   */
+
+
+  function onActive(cb) {
+    if (wasSlideClosed) return noop; // Can't re-activate already closed slide.
+
+    if (status().isActive) {
+      cb();
+    }
+
+    onActiveCallbacks.add(cb);
+    return function () {
+      return onActiveCallbacks["delete"](cb);
+    };
+  }
+
+  return {
+    status: status,
+    onActive: onActive,
+    unwatch: unwatch
+  };
+}
+
 function selectEntityAndInsert(_x, _x2, _x3, _x4) {
   return _selectEntityAndInsert.apply(this, arguments);
 } // TODO: incorporate this logic inside the trailingParagraph plugin instead
 
 function _selectEntityAndInsert() {
   _selectEntityAndInsert = _asyncToGenerator( /*#__PURE__*/runtime_1.mark(function _callee(nodeType, sdk, editor, logAction) {
-    var field, dialogs, baseConfig, selectEntity, config, selection, entity;
+    var field, dialogs, baseConfig, selectEntity, config, rteSlide, entity;
     return runtime_1.wrap(function _callee$(_context) {
       while (1) {
         switch (_context.prev = _context.next) {
@@ -2778,32 +2856,33 @@ function _selectEntityAndInsert() {
             config = _extends({}, baseConfig, {
               withCreate: true
             });
-            selection = editor.selection;
+            rteSlide = watchCurrentSlide(sdk.navigator);
             _context.next = 8;
             return selectEntity(config);
 
           case 8:
             entity = _context.sent;
 
-            if (entity) {
-              _context.next = 12;
-              break;
-            }
+            if (!entity) {
+              logAction('cancelCreateEmbedDialog', {
+                nodeType: nodeType
+              });
+            } else {
+              insertBlock$1(editor, nodeType, entity);
+              ensureFollowingParagraph(editor);
+              logAction('insert', {
+                nodeType: nodeType
+              });
+            } // If user chose to create a new entity, this might open slide-in to edit the
+            // entity. In this case, no point in focusing RTE which is now in the slide below.
 
-            logAction('cancelCreateEmbedDialog', {
-              nodeType: nodeType
-            });
-            return _context.abrupt("return");
 
-          case 12:
-            select(editor, selection);
-            insertBlock$1(editor, nodeType, entity);
-            ensureFollowingParagraph(editor);
-            logAction('insert', {
-              nodeType: nodeType
+            rteSlide.onActive(function () {
+              rteSlide.unwatch();
+              focus(editor);
             });
 
-          case 16:
+          case 11:
           case "end":
             return _context.stop();
         }
@@ -2868,8 +2947,6 @@ function insertBlock$1(editor, nodeType, entity) {
   } else {
     setNodes(editor, linkedEntityBlock);
   }
-
-  focus(editor);
 }
 
 var styles$2 = {