@atlaskit/editor-plugin-extension 1.0.1 → 1.0.2

package/CHANGELOG.md

@@ -1,5 +1,12 @@
 # @atlaskit/editor-plugin-extension
 
+## 1.0.2
+
+### Patch Changes
+
+- [#72671](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/72671) [`c446a8ca183b`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/c446a8ca183b) - ED-21912 Adding support for left arrow navigation from within MBE tabs.
+- Updated dependencies
+
 ## 1.0.1
 
 ### Patch Changes

package/dist/cjs/pm-plugins/main.js

@@ -29,7 +29,7 @@ var _asyncToGenerator2 = _interopRequireDefault(require("@babel/runtime/helpers/
 var _typeof2 = _interopRequireDefault(require("@babel/runtime/helpers/typeof"));
 var _extensibility = require("@atlaskit/editor-common/extensibility");
 var _safePlugin = require("@atlaskit/editor-common/safe-plugin");
-var _selection = require("@atlaskit/editor-common/selection");
+var _selection2 = require("@atlaskit/editor-common/selection");
 var _state = require("@atlaskit/editor-prosemirror/state");
 var _utils = require("@atlaskit/editor-prosemirror/utils");
 var _commands = require("../commands");
@@ -238,7 +238,7 @@ var createPlugin = exports.createPlugin = function createPlugin(dispatch, provid
               var maybeBodiedExtension = selection instanceof _state.TextSelection ? (0, _utils.findParentNodeOfTypeClosestToPos)($head, bodiedExtension) : (0, _utils.findSelectedNodeOfType)(bodiedExtension)(selection);
               if (maybeBodiedExtension) {
                 var end = maybeBodiedExtension.pos + maybeBodiedExtension.node.nodeSize;
-                if (event.key === 'ArrowUp' || event.key === 'ArrowLeft' && (0, _selection.isSelectionAtStartOfNode)($head, maybeBodiedExtension)) {
+                if (event.key === 'ArrowUp' || event.key === 'ArrowLeft' && (0, _selection2.isSelectionAtStartOfNode)($head, maybeBodiedExtension)) {
                   var anchor = end + 1;
 
                   // an offset is used here so that left arrow selects the first character before the node (consistent with arrow right)
@@ -248,7 +248,7 @@ var createPlugin = exports.createPlugin = function createPlugin(dispatch, provid
                   view.dispatch(tr.setSelection(newSelection));
                   return true;
                 }
-                if (event.key === 'ArrowDown' || event.key === 'ArrowRight' && (0, _selection.isSelectionAtEndOfNode)($head, maybeBodiedExtension)) {
+                if (event.key === 'ArrowDown' || event.key === 'ArrowRight' && (0, _selection2.isSelectionAtEndOfNode)($head, maybeBodiedExtension)) {
                   var _anchor = maybeBodiedExtension.pos - 1;
                   var _head = end + 1;
                   var _newSelection = _state.TextSelection.create(doc, Math.min(_anchor, selection.anchor), _head);
@@ -258,6 +258,34 @@ var createPlugin = exports.createPlugin = function createPlugin(dispatch, provid
               }
             }
           }
+
+          // Handle non shift key case for MBE
+          if (event instanceof KeyboardEvent && !event.shiftKey && event.key === 'ArrowLeft') {
+            var _view$state2 = view.state,
+              _schema = _view$state2.schema,
+              _selection = _view$state2.selection,
+              _$head = _view$state2.selection.$head,
+              _doc = _view$state2.doc,
+              _tr = _view$state2.tr;
+            var _schema$nodes = _schema.nodes,
+              multiBodiedExtension = _schema$nodes.multiBodiedExtension,
+              extensionFrame = _schema$nodes.extensionFrame,
+              paragraph = _schema$nodes.paragraph;
+            if (_selection instanceof _selection2.GapCursorSelection || _selection instanceof _state.TextSelection && _$head.parent.type === paragraph) {
+              var maybeMultiBodiedExtension = (0, _utils.findParentNodeOfTypeClosestToPos)(_$head, multiBodiedExtension);
+              if (maybeMultiBodiedExtension) {
+                var _tr$doc$nodeAt;
+                /* In case of gap cursor, we need to decrement the position by 1 as we need to check the node at previous position
+                 * In case of text selection, we need to decrement the position by 2 as we need to jump back twice, once from text node and then its parent paragraph node
+                 */
+                var previousPositionDecrement = _selection instanceof _selection2.GapCursorSelection ? 1 : 2;
+                if (((_tr$doc$nodeAt = _tr.doc.nodeAt(_$head.pos - previousPositionDecrement)) === null || _tr$doc$nodeAt === void 0 ? void 0 : _tr$doc$nodeAt.type) === extensionFrame) {
+                  var _newSelection2 = _state.TextSelection.create(_doc, _tr.doc.resolve(_$head.pos - previousPositionDecrement).start(_$head.depth - previousPositionDecrement));
+                  view.dispatch(_tr.setSelection(_newSelection2));
+                }
+              }
+            }
+          }
           return false;
         }
       },
@@ -270,7 +298,7 @@ var createPlugin = exports.createPlugin = function createPlugin(dispatch, provid
         inlineExtension: (0, _extensibility.ExtensionNodeView)(portalProviderAPI, eventDispatcher, providerFactory, extensionHandlers, extensionNodeViewOptions, pluginInjectionApi),
         multiBodiedExtension: (0, _extensibility.ExtensionNodeView)(portalProviderAPI, eventDispatcher, providerFactory, extensionHandlers, extensionNodeViewOptions, pluginInjectionApi)
       },
-      handleClickOn: (0, _selection.createSelectionClickHandler)(['extension', 'bodiedExtension', 'multiBodiedExtension'], function (target) {
+      handleClickOn: (0, _selection2.createSelectionClickHandler)(['extension', 'bodiedExtension', 'multiBodiedExtension'], function (target) {
         return !target.closest('.extension-content');
       }, {
         useLongPressSelection: useLongPressSelection

package/dist/es2019/pm-plugins/main.js

@@ -1,6 +1,6 @@
 import { ExtensionNodeView } from '@atlaskit/editor-common/extensibility';
 import { SafePlugin } from '@atlaskit/editor-common/safe-plugin';
-import { createSelectionClickHandler, isSelectionAtEndOfNode, isSelectionAtStartOfNode } from '@atlaskit/editor-common/selection';
+import { createSelectionClickHandler, GapCursorSelection, isSelectionAtEndOfNode, isSelectionAtStartOfNode } from '@atlaskit/editor-common/selection';
 import { NodeSelection, TextSelection } from '@atlaskit/editor-prosemirror/state';
 import { findParentNodeOfTypeClosestToPos, findSelectedNodeOfType } from '@atlaskit/editor-prosemirror/utils';
 import { clearEditingContext, updateState } from '../commands';
@@ -190,6 +190,38 @@ const createPlugin = (dispatch, providerFactory, extensionHandlers, portalProvid
               }
             }
           }
+
+          // Handle non shift key case for MBE
+          if (event instanceof KeyboardEvent && !event.shiftKey && event.key === 'ArrowLeft') {
+            const {
+              schema,
+              selection,
+              selection: {
+                $head
+              },
+              doc,
+              tr
+            } = view.state;
+            const {
+              multiBodiedExtension,
+              extensionFrame,
+              paragraph
+            } = schema.nodes;
+            if (selection instanceof GapCursorSelection || selection instanceof TextSelection && $head.parent.type === paragraph) {
+              const maybeMultiBodiedExtension = findParentNodeOfTypeClosestToPos($head, multiBodiedExtension);
+              if (maybeMultiBodiedExtension) {
+                var _tr$doc$nodeAt;
+                /* In case of gap cursor, we need to decrement the position by 1 as we need to check the node at previous position
+                 * In case of text selection, we need to decrement the position by 2 as we need to jump back twice, once from text node and then its parent paragraph node
+                 */
+                const previousPositionDecrement = selection instanceof GapCursorSelection ? 1 : 2;
+                if (((_tr$doc$nodeAt = tr.doc.nodeAt($head.pos - previousPositionDecrement)) === null || _tr$doc$nodeAt === void 0 ? void 0 : _tr$doc$nodeAt.type) === extensionFrame) {
+                  const newSelection = TextSelection.create(doc, tr.doc.resolve($head.pos - previousPositionDecrement).start($head.depth - previousPositionDecrement));
+                  view.dispatch(tr.setSelection(newSelection));
+                }
+              }
+            }
+          }
           return false;
         }
       },

package/dist/esm/pm-plugins/main.js

@@ -3,7 +3,7 @@ import _typeof from "@babel/runtime/helpers/typeof";
 import _regeneratorRuntime from "@babel/runtime/regenerator";
 import { ExtensionNodeView } from '@atlaskit/editor-common/extensibility';
 import { SafePlugin } from '@atlaskit/editor-common/safe-plugin';
-import { createSelectionClickHandler, isSelectionAtEndOfNode, isSelectionAtStartOfNode } from '@atlaskit/editor-common/selection';
+import { createSelectionClickHandler, GapCursorSelection, isSelectionAtEndOfNode, isSelectionAtStartOfNode } from '@atlaskit/editor-common/selection';
 import { NodeSelection, TextSelection } from '@atlaskit/editor-prosemirror/state';
 import { findParentNodeOfTypeClosestToPos, findSelectedNodeOfType } from '@atlaskit/editor-prosemirror/utils';
 import { clearEditingContext, updateState } from '../commands';
@@ -232,6 +232,34 @@ var createPlugin = function createPlugin(dispatch, providerFactory, extensionHan
               }
             }
           }
+
+          // Handle non shift key case for MBE
+          if (event instanceof KeyboardEvent && !event.shiftKey && event.key === 'ArrowLeft') {
+            var _view$state2 = view.state,
+              _schema = _view$state2.schema,
+              _selection = _view$state2.selection,
+              _$head = _view$state2.selection.$head,
+              _doc = _view$state2.doc,
+              _tr = _view$state2.tr;
+            var _schema$nodes = _schema.nodes,
+              multiBodiedExtension = _schema$nodes.multiBodiedExtension,
+              extensionFrame = _schema$nodes.extensionFrame,
+              paragraph = _schema$nodes.paragraph;
+            if (_selection instanceof GapCursorSelection || _selection instanceof TextSelection && _$head.parent.type === paragraph) {
+              var maybeMultiBodiedExtension = findParentNodeOfTypeClosestToPos(_$head, multiBodiedExtension);
+              if (maybeMultiBodiedExtension) {
+                var _tr$doc$nodeAt;
+                /* In case of gap cursor, we need to decrement the position by 1 as we need to check the node at previous position
+                 * In case of text selection, we need to decrement the position by 2 as we need to jump back twice, once from text node and then its parent paragraph node
+                 */
+                var previousPositionDecrement = _selection instanceof GapCursorSelection ? 1 : 2;
+                if (((_tr$doc$nodeAt = _tr.doc.nodeAt(_$head.pos - previousPositionDecrement)) === null || _tr$doc$nodeAt === void 0 ? void 0 : _tr$doc$nodeAt.type) === extensionFrame) {
+                  var _newSelection2 = TextSelection.create(_doc, _tr.doc.resolve(_$head.pos - previousPositionDecrement).start(_$head.depth - previousPositionDecrement));
+                  view.dispatch(_tr.setSelection(_newSelection2));
+                }
+              }
+            }
+          }
           return false;
         }
       },

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@atlaskit/editor-plugin-extension",
-  "version": "1.0.1",
+  "version": "1.0.2",
   "description": "editor-plugin-extension plugin for @atlaskit/editor-core",
   "author": "Atlassian Pty Ltd",
   "license": "Apache-2.0",
@@ -31,7 +31,7 @@
     "@atlaskit/button": "^17.4.0",
     "@atlaskit/checkbox": "^13.0.0",
     "@atlaskit/datetime-picker": "^13.0.3",
-    "@atlaskit/editor-common": "^78.0.0",
+    "@atlaskit/editor-common": "^78.1.0",
     "@atlaskit/editor-json-transformer": "^8.10.0",
     "@atlaskit/editor-plugin-analytics": "^1.0.0",
     "@atlaskit/editor-plugin-context-identifier": "^1.0.0",