@atlaskit/editor-core 185.12.0 → 185.12.2

package/CHANGELOG.md

@@ -1,5 +1,17 @@
 # @atlaskit/editor-core
 
+## 185.12.2
+
+### Patch Changes
+
+- [`a20c7920f82`](https://bitbucket.org/atlassian/atlassian-frontend/commits/a20c7920f82) - [ux] ED-15477 Update insertion behaviour for expands, code blocks and panels to make them consistent
+
+## 185.12.1
+
+### Patch Changes
+
+- [`a9bd271beba`](https://bitbucket.org/atlassian/atlassian-frontend/commits/a9bd271beba) - Fixes link updated linking platform events being dispatched without an updateType
+
 ## 185.12.0
 
 ### Minor Changes

package/dist/cjs/plugins/block-type/commands/block-type.js

@@ -4,6 +4,8 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.cleanUpAtTheStartOfDocument = void 0;
+exports.createInsertCodeBlockTransaction = createInsertCodeBlockTransaction;
+exports.createWrapSelectionTransaction = createWrapSelectionTransaction;
 exports.insertBlockType = insertBlockType;
 exports.insertBlockTypesWithAnalytics = void 0;
 exports.setBlockType = setBlockType;
@@ -225,34 +227,53 @@ var insertBlockTypesWithAnalytics = function insertBlockTypesWithAnalytics(name,
   }
 };
 
+/**
+ * This function creates a new transaction that wraps the current selection
+ * in the specified node type if it results in a valid transaction.
+ * If not valid, it performs a safe insert operation.
+ *
+ * Example of when wrapping might not be valid is when attempting to wrap
+ * content that is already inside a panel with another panel
+ */
+exports.insertBlockTypesWithAnalytics = insertBlockTypesWithAnalytics;
+function createWrapSelectionTransaction(_ref3) {
+  var state = _ref3.state,
+    type = _ref3.type,
+    nodeAttributes = _ref3.nodeAttributes;
+  var tr = state.tr;
+  var _state$selection = state.selection,
+    $from = _state$selection.$from,
+    $to = _state$selection.$to;
+  var _state$schema$marks = state.schema.marks,
+    alignment = _state$schema$marks.alignment,
+    indentation = _state$schema$marks.indentation;
+
+  /** Alignment or Indentation is not valid inside block types */
+  var removeAlignTr = (0, _mark.removeBlockMarks)(state, [alignment, indentation]);
+  tr = removeAlignTr || tr;
+  var range = $from.blockRange($to);
+  var wrapping = range && (0, _prosemirrorTransform.findWrapping)(range, type, nodeAttributes);
+  if (range && wrapping) {
+    tr.wrap(range, wrapping).scrollIntoView();
+  } else {
+    /** We always want to append a block type */
+    (0, _prosemirrorUtils.safeInsert)(type.createAndFill())(tr).scrollIntoView();
+  }
+  return tr;
+}
+
 /**
  * Function will add wrapping node.
  * 1. If currently selected blocks can be wrapped in the wrapper type it will wrap them.
  * 2. If current block can not be wrapped inside wrapping block it will create a new block below selection,
  *  and set selection on it.
  */
-exports.insertBlockTypesWithAnalytics = insertBlockTypesWithAnalytics;
 function wrapSelectionIn(type) {
   return function (state, dispatch) {
-    var tr = state.tr;
-    var _state$selection = state.selection,
-      $from = _state$selection.$from,
-      $to = _state$selection.$to;
-    var _state$schema$marks = state.schema.marks,
-      alignment = _state$schema$marks.alignment,
-      indentation = _state$schema$marks.indentation;
-
-    /** Alignment or Indentation is not valid inside block types */
-    var removeAlignTr = (0, _mark.removeBlockMarks)(state, [alignment, indentation]);
-    tr = removeAlignTr || tr;
-    var range = $from.blockRange($to);
-    var wrapping = range && (0, _prosemirrorTransform.findWrapping)(range, type);
-    if (range && wrapping) {
-      tr.wrap(range, wrapping).scrollIntoView();
-    } else {
-      /** We always want to append a block type */
-      (0, _prosemirrorUtils.safeInsert)(type.createAndFill())(tr).scrollIntoView();
-    }
+    var tr = createWrapSelectionTransaction({
+      state: state,
+      type: type
+    });
     if (dispatch) {
       dispatch(tr);
     }
@@ -260,39 +281,53 @@ function wrapSelectionIn(type) {
   };
 }
 
+/**
+ * This function creates a new transaction that inserts a code block,
+ * if there is text selected it will wrap the current selection if not it will
+ * append the codeblock to the end of the document.
+ */
+function createInsertCodeBlockTransaction(_ref4) {
+  var _state$selection$$fro;
+  var state = _ref4.state;
+  var tr = state.tr;
+  var from = state.selection.from;
+  var codeBlock = state.schema.nodes.codeBlock;
+  var grandParentNodeType = (_state$selection$$fro = state.selection.$from.node(-1)) === null || _state$selection$$fro === void 0 ? void 0 : _state$selection$$fro.type;
+  var parentNodeType = state.selection.$from.parent.type;
+
+  /** We always want to append a codeBlock unless we're inserting into a paragraph
+   * AND it's a valid child of the grandparent node.
+   * Insert the current selection as codeBlock content unless it contains nodes other
+   * than paragraphs and inline.
+   */
+  var canInsertCodeBlock = (0, _insert.shouldSplitSelectedNodeOnNodeInsertion)({
+    parentNodeType: parentNodeType,
+    grandParentNodeType: grandParentNodeType,
+    content: codeBlock.createAndFill()
+  }) && contentAllowedInCodeBlock(state);
+  if (canInsertCodeBlock) {
+    tr = (0, _transformToCodeBlock.transformToCodeBlockAction)(state, from);
+  } else {
+    (0, _prosemirrorUtils.safeInsert)(codeBlock.createAndFill())(tr).scrollIntoView();
+  }
+  return tr;
+}
+
 /**
  * Function will insert code block at current selection if block is empty or below current selection and set focus on it.
  */
 function insertCodeBlock() {
   return function (state, dispatch) {
-    var _state$selection$$fro;
-    var tr = state.tr;
-    var from = state.selection.from;
-    var codeBlock = state.schema.nodes.codeBlock;
-    var grandParentNodeType = (_state$selection$$fro = state.selection.$from.node(-1)) === null || _state$selection$$fro === void 0 ? void 0 : _state$selection$$fro.type;
-    var parentNodeType = state.selection.$from.parent.type;
-
-    /** We always want to append a codeBlock unless we're inserting into a paragraph
-     * AND it's a valid child of the grandparent node.
-     * Insert the current selection as codeBlock content unless it contains nodes other
-     * than paragraphs and inline.
-     */
-    var canInsertCodeBlock = (0, _insert.shouldSplitSelectedNodeOnNodeInsertion)({
-      parentNodeType: parentNodeType,
-      grandParentNodeType: grandParentNodeType,
-      content: codeBlock.createAndFill()
-    }) && contentAllowedInCodeBlock(state);
-    if (canInsertCodeBlock) {
-      tr = (0, _transformToCodeBlock.transformToCodeBlockAction)(state, from);
-    } else {
-      (0, _prosemirrorUtils.safeInsert)(codeBlock.createAndFill())(tr).scrollIntoView();
-    }
+    var tr = createInsertCodeBlockTransaction({
+      state: state
+    });
     if (dispatch) {
       dispatch(tr);
     }
     return true;
   };
 }
+
 /**
  * Check if the current selection contains any nodes that are not permitted
  * as codeBlock child nodes. Note that this allows paragraphs and inline nodes
@@ -312,8 +347,8 @@ function contentAllowedInCodeBlock(state) {
   return isAllowedChild;
 }
 var cleanUpAtTheStartOfDocument = function cleanUpAtTheStartOfDocument(state, dispatch) {
-  var _ref3 = state.selection,
-    $cursor = _ref3.$cursor;
+  var _ref5 = state.selection,
+    $cursor = _ref5.$cursor;
   if ($cursor && !$cursor.nodeBefore && !$cursor.nodeAfter && $cursor.pos === 1) {
     var tr = state.tr,
       schema = state.schema;

package/dist/cjs/plugins/card/ui/EditLinkToolbar.js

@@ -87,10 +87,10 @@ var EditLinkToolbar = /*#__PURE__*/function (_React$Component) {
         ,
         invokeMethod: _analytics.INPUT_METHOD.FLOATING_TB,
         featureFlags: featureFlags,
-        onSubmit: function onSubmit(href, title, displayText, _, analytic) {
+        onSubmit: function onSubmit(href, title, displayText, inputMethod, analytic) {
           _this2.hideLinkToolbar();
           if (_onSubmit) {
-            _onSubmit(href, displayText || title, analytic);
+            _onSubmit(href, displayText || title, inputMethod, analytic);
           }
         }
       });
@@ -142,7 +142,7 @@ var buildEditLinkToolbar = function buildEditLinkToolbar(_ref) {
         node: node,
         featureFlags: featureFlags,
         forceFocusSelector: pluginInjectionApi === null || pluginInjectionApi === void 0 ? void 0 : (_pluginInjectionApi$d = pluginInjectionApi.dependencies.floatingToolbar.actions) === null || _pluginInjectionApi$d === void 0 ? void 0 : _pluginInjectionApi$d.forceFocusSelector,
-        onSubmit: function onSubmit(newHref, newText, analytic) {
+        onSubmit: function onSubmit(newHref, newText, inputMethod, analytic) {
           var urlChanged = newHref !== displayInfo.url;
           var titleChanged = newText !== displayInfo.title;
 
@@ -152,6 +152,7 @@ var buildEditLinkToolbar = function buildEditLinkToolbar(_ref) {
             var _pluginInjectionApi$d2;
             return (0, _card.commandWithMetadata)((0, _doc.changeSelectedCardToLink)(newText, newHref, undefined, undefined, undefined, pluginInjectionApi === null || pluginInjectionApi === void 0 ? void 0 : (_pluginInjectionApi$d2 = pluginInjectionApi.dependencies.analytics) === null || _pluginInjectionApi$d2 === void 0 ? void 0 : _pluginInjectionApi$d2.actions), {
               action: _analytics.ACTION.UPDATED,
+              inputMethod: inputMethod,
               sourceEvent: analytic
             })(view.state, view.dispatch);
           }

package/dist/cjs/plugins/card/ui/EditorSmartCardEventsNext.js

@@ -12,7 +12,6 @@ var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits
 var _possibleConstructorReturn2 = _interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));
 var _getPrototypeOf2 = _interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
-var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
 var _react = _interopRequireWildcard(require("react"));
 var _propTypes = _interopRequireDefault(require("prop-types"));
 var _linkAnalytics = require("@atlaskit/link-analytics");
@@ -21,9 +20,6 @@ var _analyticsNext = require("@atlaskit/analytics-next");
 var _actions = require("../pm-plugins/actions");
 var _utils = require("@atlaskit/editor-common/utils");
 var _state = require("../pm-plugins/util/state");
-var _excluded = ["url", "display", "nodeContext"],
-  _excluded2 = ["url", "display", "previousDisplay", "nodeContext"],
-  _excluded3 = ["url", "display", "nodeContext"];
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
 function _interopRequireWildcard(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; }
 function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = (0, _getPrototypeOf2.default)(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = (0, _getPrototypeOf2.default)(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return (0, _possibleConstructorReturn2.default)(this, result); }; }
@@ -47,14 +43,7 @@ var withHistoryMethod = function withHistoryMethod(fn) {
   };
 };
 var getMethod = withHistoryMethod(function (_ref) {
-  var inputMethod = _ref.inputMethod,
-    sourceEvent = _ref.sourceEvent;
-  /**
-   * If sourceEvent is present, don't provide a custom method
-   */
-  if (sourceEvent) {
-    return;
-  }
+  var inputMethod = _ref.inputMethod;
   switch (inputMethod) {
     case _analytics.INPUT_METHOD.CLIPBOARD:
       return 'editor_paste';
@@ -68,14 +57,7 @@ var getMethod = withHistoryMethod(function (_ref) {
   }
 });
 var getUpdateType = withHistoryMethod(function (_ref2) {
-  var action = _ref2.action,
-    sourceEvent = _ref2.sourceEvent;
-  /**
-   * If sourceEvent is present, don't provide a custom method
-   */
-  if (sourceEvent) {
-    return;
-  }
+  var action = _ref2.action;
   switch (action) {
     case _analytics.ACTION.CHANGED_TYPE:
       return 'display_update';
@@ -124,11 +106,10 @@ var EventsBinding = function EventsBinding(_ref4) {
     linkDeleted = _useSmartLinkLifecycl.linkDeleted;
   var events = (0, _react.useMemo)(function () {
     return {
-      created: function created(_ref5) {
-        var url = _ref5.url,
-          display = _ref5.display,
-          nodeContext = _ref5.nodeContext,
-          metadata = (0, _objectWithoutProperties2.default)(_ref5, _excluded);
+      created: function created(metadata) {
+        var url = metadata.url,
+          display = metadata.display,
+          nodeContext = metadata.nodeContext;
         var displayCategory = displayCategoryFromDisplay(display);
         var sourceEvent = getSourceEventFromMetadata(metadata);
         var creationMethod = getMethod(metadata);
@@ -141,12 +122,11 @@ var EventsBinding = function EventsBinding(_ref4) {
           creationMethod: creationMethod
         });
       },
-      updated: function updated(_ref6) {
-        var url = _ref6.url,
-          display = _ref6.display,
-          previousDisplay = _ref6.previousDisplay,
-          nodeContext = _ref6.nodeContext,
-          metadata = (0, _objectWithoutProperties2.default)(_ref6, _excluded2);
+      updated: function updated(metadata) {
+        var url = metadata.url,
+          display = metadata.display,
+          previousDisplay = metadata.previousDisplay,
+          nodeContext = metadata.nodeContext;
         var displayCategory = displayCategoryFromDisplay(display);
         var sourceEvent = getSourceEventFromMetadata(metadata);
         var updateMethod = getMethod(metadata);
@@ -162,11 +142,10 @@ var EventsBinding = function EventsBinding(_ref4) {
           updateType: updateType
         });
       },
-      deleted: function deleted(_ref7) {
-        var url = _ref7.url,
-          display = _ref7.display,
-          nodeContext = _ref7.nodeContext,
-          metadata = (0, _objectWithoutProperties2.default)(_ref7, _excluded3);
+      deleted: function deleted(metadata) {
+        var url = metadata.url,
+          display = metadata.display,
+          nodeContext = metadata.nodeContext;
         var displayCategory = displayCategoryFromDisplay(display);
         var sourceEvent = getSourceEventFromMetadata(metadata);
         var deleteMethod = getMethod(metadata);

package/dist/cjs/plugins/code-block/index.js

@@ -17,8 +17,11 @@ var _analytics = require("@atlaskit/editor-common/analytics");
 var _assets = require("../quick-insert/assets");
 var _messages = require("../block-type/messages");
 var _refreshBrowserSelection = _interopRequireDefault(require("./refresh-browser-selection"));
+var _blockType = require("../block-type/commands/block-type");
 function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
-function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { (0, _defineProperty2.default)(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { (0, _defineProperty2.default)(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; } // Theres an existing interelationship between these files, where the imported function is being called for code-block
+// Insertions via the drop down menu
+// tslint-ignore-next-line
 var codeBlockPlugin = function codeBlockPlugin(options, api) {
   return {
     name: 'codeBlock',
@@ -76,8 +79,9 @@ var codeBlockPlugin = function codeBlockPlugin(options, api) {
           },
           action: function action(insert, state) {
             var _api$dependencies$ana;
-            var schema = state.schema;
-            var tr = insert(schema.nodes.codeBlock.createChecked());
+            var tr = (0, _blockType.createInsertCodeBlockTransaction)({
+              state: state
+            });
             api === null || api === void 0 ? void 0 : (_api$dependencies$ana = api.dependencies.analytics) === null || _api$dependencies$ana === void 0 ? void 0 : _api$dependencies$ana.actions.attachAnalyticsEvent({
               action: _analytics.ACTION.INSERTED,
               actionSubject: _analytics.ACTION_SUBJECT.DOCUMENT,

package/dist/cjs/plugins/expand/commands.js

@@ -7,12 +7,12 @@ Object.defineProperty(exports, "__esModule", {
 exports.updateExpandTitle = exports.toggleExpandExpanded = exports.setSelectionInsideExpand = exports.setExpandRef = exports.insertExpand = exports.focusTitle = exports.deleteExpandAtPos = exports.deleteExpand = exports.createExpandNode = void 0;
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
 var _prosemirrorState = require("prosemirror-state");
-var _prosemirrorUtils = require("prosemirror-utils");
 var _utils = require("@atlaskit/editor-tables/utils");
 var _analytics = require("../analytics");
 var _gapCursorSelection = require("../selection/gap-cursor-selection");
 var _utils2 = require("./utils");
 var _pluginFactory = require("./pm-plugins/plugin-factory");
+var _blockType = require("../block-type/commands/block-type");
 function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
 function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { (0, _defineProperty2.default)(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
 var setExpandRef = function setExpandRef(ref) {
@@ -118,6 +118,10 @@ var createExpandNode = function createExpandNode(state) {
 exports.createExpandNode = createExpandNode;
 var insertExpand = function insertExpand(state, dispatch) {
   var expandNode = createExpandNode(state);
+  var tr = (0, _blockType.createWrapSelectionTransaction)({
+    state: state,
+    type: state.schema.nodes.expand
+  });
   var payload = {
     action: _analytics.ACTION.INSERTED,
     actionSubject: _analytics.ACTION_SUBJECT.DOCUMENT,
@@ -128,7 +132,7 @@ var insertExpand = function insertExpand(state, dispatch) {
     eventType: _analytics.EVENT_TYPE.TRACK
   };
   if (dispatch && expandNode) {
-    dispatch((0, _analytics.addAnalytics)(state, (0, _prosemirrorUtils.safeInsert)(expandNode)(state.tr).scrollIntoView(), payload));
+    dispatch((0, _analytics.addAnalytics)(state, tr, payload));
   }
   return true;
 };

package/dist/cjs/plugins/expand/index.js

@@ -22,6 +22,7 @@ var _analytics = require("../analytics");
 var _toolbar = require("./toolbar");
 var _commands = require("./commands");
 var _messages = require("../insert-block/ui/ToolbarInsertBlock/messages");
+var _blockType = require("../block-type/commands/block-type");
 var _pluginFactory = require("./pm-plugins/plugin-factory");
 var expandPlugin = function expandPlugin() {
   var _api$dependencies, _api$dependencies$fea;
@@ -73,7 +74,10 @@ var expandPlugin = function expandPlugin() {
             if (!node) {
               return false;
             }
-            var tr = insert(node);
+            var tr = (0, _blockType.createWrapSelectionTransaction)({
+              state: state,
+              type: state.schema.nodes.expand
+            });
             return (0, _analytics.addAnalytics)(state, tr, {
               action: _analytics.ACTION.INSERTED,
               actionSubject: _analytics.ACTION_SUBJECT.DOCUMENT,

package/dist/cjs/plugins/hyperlink/Toolbar.js

@@ -221,6 +221,7 @@ var getToolbarConfig = function getToolbarConfig(options, featureFlags, pluginIn
                       var action = isEdit ? _analytics.ACTION.UPDATED : _analytics.ACTION.INSERTED;
                       var command = isEdit ? (0, _card.commandWithMetadata)((0, _commands.updateLink)(href, displayText || title, activeLinkMark.pos), {
                         action: action,
+                        inputMethod: inputMethod,
                         sourceEvent: analytic
                       }) : (0, _commands.insertLinkWithAnalytics)(inputMethod, activeLinkMark.from, activeLinkMark.to, href, title, displayText, !!(options !== null && options !== void 0 && (_options$cardOptions = options.cardOptions) !== null && _options$cardOptions !== void 0 && _options$cardOptions.provider), analytic);
                       command(view.state, view.dispatch, view);

package/dist/cjs/plugins/panel/index.js

@@ -15,25 +15,10 @@ var _assets = require("../quick-insert/assets");
 var _messages = require("../block-type/messages");
 var _customPanel = _interopRequireDefault(require("../quick-insert/assets/custom-panel"));
 var _colors = require("@atlaskit/theme/colors");
-var insertPanelTypeWithAnalytics = function insertPanelTypeWithAnalytics(panelAttributes, state, insert) {
-  var tr = insert(insertPanelType(panelAttributes, state));
-  if (tr) {
-    (0, _analytics.addAnalytics)(state, tr, {
-      action: _analytics.ACTION.INSERTED,
-      actionSubject: _analytics.ACTION_SUBJECT.DOCUMENT,
-      actionSubjectId: _analytics.ACTION_SUBJECT_ID.PANEL,
-      attributes: {
-        inputMethod: _analytics.INPUT_METHOD.QUICK_INSERT,
-        panelType: panelAttributes.panelType
-      },
-      eventType: _analytics.EVENT_TYPE.TRACK
-    });
-  }
-  return tr;
-};
-var insertPanelType = function insertPanelType(panelAttributes, state) {
-  return state.schema.nodes.panel.createChecked(panelAttributes, state.schema.nodes.paragraph.createChecked());
-};
+var _blockType = require("../block-type/commands/block-type");
+// Theres an existing interelationship between these files, where the imported function is being called for panel
+// Insertions via the drop down menu
+// tslint-ignore-next-line
 var panelPlugin = function panelPlugin() {
   var options = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
   var api = arguments.length > 1 ? arguments[1] : undefined;
@@ -74,9 +59,12 @@ var panelPlugin = function panelPlugin() {
             return /*#__PURE__*/_react.default.createElement(_assets.IconPanel, null);
           },
           action: function action(insert, state) {
-            return insertPanelTypeWithAnalytics({
-              panelType: _adfSchema.PanelType.INFO
-            }, state, insert);
+            return createPanelAction({
+              state: state,
+              attributes: {
+                panelType: _adfSchema.PanelType.INFO
+              }
+            });
           }
         }, {
           id: 'notepanel',
@@ -87,9 +75,12 @@ var panelPlugin = function panelPlugin() {
             return /*#__PURE__*/_react.default.createElement(_assets.IconPanelNote, null);
           },
           action: function action(insert, state) {
-            return insertPanelTypeWithAnalytics({
-              panelType: _adfSchema.PanelType.NOTE
-            }, state, insert);
+            return createPanelAction({
+              state: state,
+              attributes: {
+                panelType: _adfSchema.PanelType.NOTE
+              }
+            });
           }
         }, {
           id: 'successpanel',
@@ -101,9 +92,12 @@ var panelPlugin = function panelPlugin() {
             return /*#__PURE__*/_react.default.createElement(_assets.IconPanelSuccess, null);
           },
           action: function action(insert, state) {
-            return insertPanelTypeWithAnalytics({
-              panelType: _adfSchema.PanelType.SUCCESS
-            }, state, insert);
+            return createPanelAction({
+              state: state,
+              attributes: {
+                panelType: _adfSchema.PanelType.SUCCESS
+              }
+            });
           }
         }, {
           id: 'warningpanel',
@@ -114,9 +108,12 @@ var panelPlugin = function panelPlugin() {
             return /*#__PURE__*/_react.default.createElement(_assets.IconPanelWarning, null);
           },
           action: function action(insert, state) {
-            return insertPanelTypeWithAnalytics({
-              panelType: _adfSchema.PanelType.WARNING
-            }, state, insert);
+            return createPanelAction({
+              state: state,
+              attributes: {
+                panelType: _adfSchema.PanelType.WARNING
+              }
+            });
           }
         }, {
           id: 'errorpanel',
@@ -127,9 +124,12 @@ var panelPlugin = function panelPlugin() {
             return /*#__PURE__*/_react.default.createElement(_assets.IconPanelError, null);
           },
           action: function action(insert, state) {
-            return insertPanelTypeWithAnalytics({
-              panelType: _adfSchema.PanelType.ERROR
-            }, state, insert);
+            return createPanelAction({
+              state: state,
+              attributes: {
+                panelType: _adfSchema.PanelType.ERROR
+              }
+            });
           }
         }];
         if (options.allowCustomPanel && options.allowCustomPanelEdit) {
@@ -142,15 +142,18 @@ var panelPlugin = function panelPlugin() {
               return /*#__PURE__*/_react.default.createElement(_customPanel.default, null);
             },
             action: function action(insert, state) {
-              return insertPanelTypeWithAnalytics({
-                panelType: _adfSchema.PanelType.CUSTOM,
-                panelIcon: ':rainbow:',
-                panelIconId: '1f308',
-                panelIconText: '🌈',
-                // TODO: https://product-fabric.atlassian.net/browse/DSP-7268
-                // eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage
-                panelColor: _colors.T50
-              }, state, insert);
+              return createPanelAction({
+                state: state,
+                attributes: {
+                  panelType: _adfSchema.PanelType.CUSTOM,
+                  panelIcon: ':rainbow:',
+                  panelIconId: '1f308',
+                  panelIconText: '🌈',
+                  // TODO: https://product-fabric.atlassian.net/browse/DSP-7268
+                  // eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage
+                  panelColor: _colors.T50
+                }
+              });
             }
           });
         }
@@ -162,5 +165,40 @@ var panelPlugin = function panelPlugin() {
     }
   };
 };
+
+/**
+ * Creates panel action and wrap selection transaction with analytics for the panel insertion.
+ *
+ * @example
+ * const tr = createPanelAction({
+ *   state: editorState,
+ *   attributes: { panelType: 'info' },
+ * });
+ * if (tr) {
+ *   applyTransaction(tr);
+ * }
+ */
+function createPanelAction(_ref3) {
+  var state = _ref3.state,
+    attributes = _ref3.attributes;
+  var tr = (0, _blockType.createWrapSelectionTransaction)({
+    state: state,
+    type: state.schema.nodes.panel,
+    nodeAttributes: attributes
+  });
+  if (tr) {
+    (0, _analytics.addAnalytics)(state, tr, {
+      action: _analytics.ACTION.INSERTED,
+      actionSubject: _analytics.ACTION_SUBJECT.DOCUMENT,
+      actionSubjectId: _analytics.ACTION_SUBJECT_ID.PANEL,
+      attributes: {
+        inputMethod: _analytics.INPUT_METHOD.QUICK_INSERT,
+        panelType: attributes.panelType
+      },
+      eventType: _analytics.EVENT_TYPE.TRACK
+    });
+  }
+  return tr;
+}
 var _default = panelPlugin;
 exports.default = _default;

package/dist/cjs/plugins/quick-insert/commands.js

@@ -40,6 +40,8 @@ var insertItem = function insertItem(item) {
       return (0, _insert.insertSelectedItem)(maybeNode, opts)(state, state.tr, state.selection.head);
     };
     var tr = item.action(insert, state);
+
+    /** @note There is no transaction when called without a search currently (different insert) */
     if (tr && dispatch) {
       dispatch(tr);
     }

package/dist/cjs/ui/ElementBrowser/InsertMenu.js

@@ -47,6 +47,10 @@ var InsertMenu = function InsertMenu(_ref) {
           name: item.value.name
         }) || item.elemBefore;
       },
+      /**
+       * @note This transformed items action is only used when a quick insert item has been
+       * called from the quick insert menu and a search has not been performed.
+       */
       action: function action() {
         return onInsert({
           item: item
@@ -69,6 +73,12 @@ var InsertMenu = function InsertMenu(_ref) {
   var getItems = (0, _react.useCallback)(function (quickInsertState) {
     return function (query, category) {
       var result;
+      /**
+       * @warning The results if there is a query are not the same as the results if there is no query.
+       * For example: If you have a typed panel and then select the panel item then it will call a different action
+       * than is specified on the editor plugins quick insert
+       * @see above transform function for more details.
+       */
       if (query) {
         result = (0, _search.searchQuickInsertItems)(quickInsertState, {})(query, category);
       } else {

package/dist/cjs/version-wrapper.js

@@ -6,7 +6,7 @@ Object.defineProperty(exports, "__esModule", {
 exports.version = exports.nextMajorVersion = exports.name = void 0;
 var name = "@atlaskit/editor-core";
 exports.name = name;
-var version = "185.12.0";
+var version = "185.12.2";
 exports.version = version;
 var nextMajorVersion = function nextMajorVersion() {
   return [Number(version.split('.')[0]) + 1, 0, 0].join('.');

package/dist/cjs/version.json

@@ -1,5 +1,5 @@
 {
 	"name": "@atlaskit/editor-core",
-	"version": "185.12.0",
+	"version": "185.12.2",
 	"sideEffects": false
 }