@atlaskit/editor-plugin-media 1.31.1 → 1.31.2

package/CHANGELOG.md

@@ -1,5 +1,14 @@
 # @atlaskit/editor-plugin-media
 
+## 1.31.2
+
+### Patch Changes
+
+- [#139335](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/139335)
+  [`ac5e66fc71394`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/ac5e66fc71394) -
+  ED-24798 bug-fix: pressing Backspace before media that is nested in a quote should move your
+  selection to the media
+
 ## 1.31.1
 
 ### Patch Changes

package/dist/cjs/plugin.js

@@ -21,7 +21,7 @@ var _lazyMediaSingle = require("./nodeviews/lazy-media-single");
 var _altText = require("./pm-plugins/alt-text");
 var _keymap = _interopRequireDefault(require("./pm-plugins/alt-text/keymap"));
 var _keymap2 = _interopRequireDefault(require("./pm-plugins/keymap"));
-var _keymapMediaSingle = _interopRequireDefault(require("./pm-plugins/keymap-media-single"));
+var _keymapMedia = _interopRequireDefault(require("./pm-plugins/keymap-media"));
 var _linking = _interopRequireDefault(require("./pm-plugins/linking"));
 var _keymap3 = _interopRequireDefault(require("./pm-plugins/linking/keymap"));
 var _main = require("./pm-plugins/main");
@@ -164,7 +164,7 @@ var mediaPlugin = exports.mediaPlugin = function mediaPlugin(_ref2) {
           name: 'mediaSingleKeymap',
           plugin: function plugin(_ref7) {
             var schema = _ref7.schema;
-            return (0, _keymapMediaSingle.default)(schema);
+            return (0, _keymapMedia.default)(schema);
           }
         });
       }

package/dist/cjs/pm-plugins/{keymap-media-single.js → keymap-media.js}

@@ -9,6 +9,7 @@ var _selection = require("@atlaskit/editor-common/selection");
 var _utils = require("@atlaskit/editor-common/utils");
 var _commands = require("@atlaskit/editor-prosemirror/commands");
 var _keymap = require("@atlaskit/editor-prosemirror/keymap");
+var _state = require("@atlaskit/editor-prosemirror/state");
 var _utils2 = require("@atlaskit/editor-prosemirror/utils");
 /**
  * Check if is an empty selection at the start of the node
@@ -121,11 +122,12 @@ function handleSelectionAfterWrapRight(isEmptyNode) {
     return true;
   };
 }
-var maybeRemoveMediaSingleNode = function maybeRemoveMediaSingleNode(schema) {
+var backspaceAfterMediaNode = function backspaceAfterMediaNode(schema) {
   var isEmptyNodeInSchema = (0, _utils.isEmptyNode)(schema);
   return function (state, dispatch) {
     var selection = state.selection,
-      schema = state.schema;
+      schema = state.schema,
+      tr = state.tr;
     var $from = selection.$from;
     if (!isEmptySelectionAtStart(state.selection)) {
       return false;
@@ -134,29 +136,45 @@ var maybeRemoveMediaSingleNode = function maybeRemoveMediaSingleNode(schema) {
       return false;
     }
     var previousSibling = -1;
-    if (!isSiblingOfType(state.selection, schema.nodes.mediaSingle, previousSibling)) {
-      // no media single
+
+    // no media single or media group
+    if (!isSiblingOfType(state.selection, schema.nodes.mediaSingle, previousSibling) && !isSiblingOfType(state.selection, schema.nodes.mediaGroup, previousSibling)) {
       return false;
     }
-    var mediaSingle = getSibling(state.selection, previousSibling);
-    if (mediaSingle.attrs.layout === 'wrap-right') {
-      return handleSelectionAfterWrapRight(isEmptyNodeInSchema)(state, dispatch);
+    var media = getSibling(state.selection, previousSibling);
+
+    // if media single
+    if (media.type === schema.nodes.mediaSingle) {
+      if (media.attrs.layout === 'wrap-right') {
+        return handleSelectionAfterWrapRight(isEmptyNodeInSchema)(state, dispatch);
+      }
+      if (dispatch) {
+        // Select media single, and remove paragraph if it's empty.
+        (0, _commands.selectNodeBackward)(state, function (tr) {
+          if (isEmptyNodeInSchema($from.parent) && !(0, _selection.atTheEndOfDoc)(state)) {
+            tr.replace($from.pos - 1, $from.pos + $from.parent.nodeSize - 1); // Remove node
+          }
+          dispatch(tr);
+        });
+      }
+      return true;
     }
+
+    // if media group
     if (dispatch) {
-      // Select media single, and remove paragraph if it's empty.
-      (0, _commands.selectNodeBackward)(state, function (tr) {
-        if (isEmptyNodeInSchema($from.parent) && !(0, _selection.atTheEndOfDoc)(state)) {
-          tr.replace($from.pos - 1, $from.pos + $from.parent.nodeSize - 1); // Remove node
-        }
-        dispatch(tr);
-      });
+      // select media group, and remove paragraph if it's empty.
+      if (isEmptyNodeInSchema($from.parent)) {
+        tr.replace($from.pos - 1, $from.pos + $from.parent.nodeSize - 1); // remove node
+        tr.setSelection(new _state.NodeSelection(tr.doc.resolve($from.pos - media.nodeSize))).scrollIntoView(); // select media
+      }
+      dispatch(tr);
     }
     return true;
   };
 };
 function keymapPlugin(schema) {
   var list = {};
-  var removeMediaSingleCommand = maybeRemoveMediaSingleNode(schema);
-  (0, _keymaps.bindKeymapWithCommand)(_keymaps.backspace.common, removeMediaSingleCommand, list);
+  var backspaceAfterMediaCommand = backspaceAfterMediaNode(schema);
+  (0, _keymaps.bindKeymapWithCommand)(_keymaps.backspace.common, backspaceAfterMediaCommand, list);
   return (0, _keymap.keymap)(list);
 }

package/dist/es2019/plugin.js

@@ -14,7 +14,7 @@ import { lazyMediaSingleView } from './nodeviews/lazy-media-single';
 import { createPlugin as createMediaAltTextPlugin } from './pm-plugins/alt-text';
 import keymapMediaAltTextPlugin from './pm-plugins/alt-text/keymap';
 import keymapPlugin from './pm-plugins/keymap';
-import keymapMediaSinglePlugin from './pm-plugins/keymap-media-single';
+import keymapMediaSinglePlugin from './pm-plugins/keymap-media';
 import linkingPlugin from './pm-plugins/linking';
 import keymapLinkingPlugin from './pm-plugins/linking/keymap';
 import { createPlugin, stateKey } from './pm-plugins/main';

package/dist/es2019/pm-plugins/{keymap-media-single.js → keymap-media.js}

@@ -3,6 +3,7 @@ import { atTheEndOfDoc } from '@atlaskit/editor-common/selection';
 import { isEmptyNode, isSelectionInsideLastNodeInDocument } from '@atlaskit/editor-common/utils';
 import { selectNodeBackward } from '@atlaskit/editor-prosemirror/commands';
 import { keymap } from '@atlaskit/editor-prosemirror/keymap';
+import { NodeSelection } from '@atlaskit/editor-prosemirror/state';
 import { safeInsert } from '@atlaskit/editor-prosemirror/utils';
 
 /**
@@ -126,12 +127,13 @@ function handleSelectionAfterWrapRight(isEmptyNode) {
     return true;
   };
 }
-const maybeRemoveMediaSingleNode = schema => {
+const backspaceAfterMediaNode = schema => {
   const isEmptyNodeInSchema = isEmptyNode(schema);
   return (state, dispatch) => {
     const {
       selection,
-      schema
+      schema,
+      tr
     } = state;
     const {
       $from
@@ -143,29 +145,45 @@ const maybeRemoveMediaSingleNode = schema => {
       return false;
     }
     const previousSibling = -1;
-    if (!isSiblingOfType(state.selection, schema.nodes.mediaSingle, previousSibling)) {
-      // no media single
+
+    // no media single or media group
+    if (!isSiblingOfType(state.selection, schema.nodes.mediaSingle, previousSibling) && !isSiblingOfType(state.selection, schema.nodes.mediaGroup, previousSibling)) {
       return false;
     }
-    const mediaSingle = getSibling(state.selection, previousSibling);
-    if (mediaSingle.attrs.layout === 'wrap-right') {
-      return handleSelectionAfterWrapRight(isEmptyNodeInSchema)(state, dispatch);
+    const media = getSibling(state.selection, previousSibling);
+
+    // if media single
+    if (media.type === schema.nodes.mediaSingle) {
+      if (media.attrs.layout === 'wrap-right') {
+        return handleSelectionAfterWrapRight(isEmptyNodeInSchema)(state, dispatch);
+      }
+      if (dispatch) {
+        // Select media single, and remove paragraph if it's empty.
+        selectNodeBackward(state, tr => {
+          if (isEmptyNodeInSchema($from.parent) && !atTheEndOfDoc(state)) {
+            tr.replace($from.pos - 1, $from.pos + $from.parent.nodeSize - 1); // Remove node
+          }
+          dispatch(tr);
+        });
+      }
+      return true;
     }
+
+    // if media group
     if (dispatch) {
-      // Select media single, and remove paragraph if it's empty.
-      selectNodeBackward(state, tr => {
-        if (isEmptyNodeInSchema($from.parent) && !atTheEndOfDoc(state)) {
-          tr.replace($from.pos - 1, $from.pos + $from.parent.nodeSize - 1); // Remove node
-        }
-        dispatch(tr);
-      });
+      // select media group, and remove paragraph if it's empty.
+      if (isEmptyNodeInSchema($from.parent)) {
+        tr.replace($from.pos - 1, $from.pos + $from.parent.nodeSize - 1); // remove node
+        tr.setSelection(new NodeSelection(tr.doc.resolve($from.pos - media.nodeSize))).scrollIntoView(); // select media
+      }
+      dispatch(tr);
     }
     return true;
   };
 };
 export default function keymapPlugin(schema) {
   const list = {};
-  const removeMediaSingleCommand = maybeRemoveMediaSingleNode(schema);
-  bindKeymapWithCommand(backspace.common, removeMediaSingleCommand, list);
+  const backspaceAfterMediaCommand = backspaceAfterMediaNode(schema);
+  bindKeymapWithCommand(backspace.common, backspaceAfterMediaCommand, list);
   return keymap(list);
 }

package/dist/esm/plugin.js

@@ -14,7 +14,7 @@ import { lazyMediaSingleView } from './nodeviews/lazy-media-single';
 import { createPlugin as createMediaAltTextPlugin } from './pm-plugins/alt-text';
 import keymapMediaAltTextPlugin from './pm-plugins/alt-text/keymap';
 import keymapPlugin from './pm-plugins/keymap';
-import keymapMediaSinglePlugin from './pm-plugins/keymap-media-single';
+import keymapMediaSinglePlugin from './pm-plugins/keymap-media';
 import linkingPlugin from './pm-plugins/linking';
 import keymapLinkingPlugin from './pm-plugins/linking/keymap';
 import { createPlugin, stateKey } from './pm-plugins/main';

package/dist/esm/pm-plugins/{keymap-media-single.js → keymap-media.js}

@@ -3,6 +3,7 @@ import { atTheEndOfDoc } from '@atlaskit/editor-common/selection';
 import { isEmptyNode, isSelectionInsideLastNodeInDocument } from '@atlaskit/editor-common/utils';
 import { selectNodeBackward } from '@atlaskit/editor-prosemirror/commands';
 import { keymap } from '@atlaskit/editor-prosemirror/keymap';
+import { NodeSelection } from '@atlaskit/editor-prosemirror/state';
 import { safeInsert } from '@atlaskit/editor-prosemirror/utils';
 
 /**
@@ -116,11 +117,12 @@ function handleSelectionAfterWrapRight(isEmptyNode) {
     return true;
   };
 }
-var maybeRemoveMediaSingleNode = function maybeRemoveMediaSingleNode(schema) {
+var backspaceAfterMediaNode = function backspaceAfterMediaNode(schema) {
   var isEmptyNodeInSchema = isEmptyNode(schema);
   return function (state, dispatch) {
     var selection = state.selection,
-      schema = state.schema;
+      schema = state.schema,
+      tr = state.tr;
     var $from = selection.$from;
     if (!isEmptySelectionAtStart(state.selection)) {
       return false;
@@ -129,29 +131,45 @@ var maybeRemoveMediaSingleNode = function maybeRemoveMediaSingleNode(schema) {
       return false;
     }
     var previousSibling = -1;
-    if (!isSiblingOfType(state.selection, schema.nodes.mediaSingle, previousSibling)) {
-      // no media single
+
+    // no media single or media group
+    if (!isSiblingOfType(state.selection, schema.nodes.mediaSingle, previousSibling) && !isSiblingOfType(state.selection, schema.nodes.mediaGroup, previousSibling)) {
       return false;
     }
-    var mediaSingle = getSibling(state.selection, previousSibling);
-    if (mediaSingle.attrs.layout === 'wrap-right') {
-      return handleSelectionAfterWrapRight(isEmptyNodeInSchema)(state, dispatch);
+    var media = getSibling(state.selection, previousSibling);
+
+    // if media single
+    if (media.type === schema.nodes.mediaSingle) {
+      if (media.attrs.layout === 'wrap-right') {
+        return handleSelectionAfterWrapRight(isEmptyNodeInSchema)(state, dispatch);
+      }
+      if (dispatch) {
+        // Select media single, and remove paragraph if it's empty.
+        selectNodeBackward(state, function (tr) {
+          if (isEmptyNodeInSchema($from.parent) && !atTheEndOfDoc(state)) {
+            tr.replace($from.pos - 1, $from.pos + $from.parent.nodeSize - 1); // Remove node
+          }
+          dispatch(tr);
+        });
+      }
+      return true;
     }
+
+    // if media group
     if (dispatch) {
-      // Select media single, and remove paragraph if it's empty.
-      selectNodeBackward(state, function (tr) {
-        if (isEmptyNodeInSchema($from.parent) && !atTheEndOfDoc(state)) {
-          tr.replace($from.pos - 1, $from.pos + $from.parent.nodeSize - 1); // Remove node
-        }
-        dispatch(tr);
-      });
+      // select media group, and remove paragraph if it's empty.
+      if (isEmptyNodeInSchema($from.parent)) {
+        tr.replace($from.pos - 1, $from.pos + $from.parent.nodeSize - 1); // remove node
+        tr.setSelection(new NodeSelection(tr.doc.resolve($from.pos - media.nodeSize))).scrollIntoView(); // select media
+      }
+      dispatch(tr);
     }
     return true;
   };
 };
 export default function keymapPlugin(schema) {
   var list = {};
-  var removeMediaSingleCommand = maybeRemoveMediaSingleNode(schema);
-  bindKeymapWithCommand(backspace.common, removeMediaSingleCommand, list);
+  var backspaceAfterMediaCommand = backspaceAfterMediaNode(schema);
+  bindKeymapWithCommand(backspace.common, backspaceAfterMediaCommand, list);
   return keymap(list);
 }

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@atlaskit/editor-plugin-media",
-	"version": "1.31.1",
+	"version": "1.31.2",
 	"description": "Media plugin for @atlaskit/editor-core",
 	"author": "Atlassian Pty Ltd",
 	"license": "Apache-2.0",