@atlaskit/editor-core 188.13.1 → 188.13.3

package/dist/es2019/plugins/panel/toolbar.js

@@ -48,7 +48,7 @@ export const getToolbarItems = (formatMessage, panelNodeType, isCustomPanelEnabl
     id: 'editor.panel.info',
     type: 'button',
     icon: InfoIcon,
-    onClick: changePanelType(PanelType.INFO),
+    onClick: changePanelType(editorAnalyticsAPI)(PanelType.INFO),
     selected: activePanelType === PanelType.INFO,
     title: formatMessage(messages.info),
     tabIndex: null
@@ -56,7 +56,7 @@ export const getToolbarItems = (formatMessage, panelNodeType, isCustomPanelEnabl
     id: 'editor.panel.note',
     type: 'button',
     icon: NoteIcon,
-    onClick: changePanelType(PanelType.NOTE),
+    onClick: changePanelType(editorAnalyticsAPI)(PanelType.NOTE),
     selected: activePanelType === PanelType.NOTE,
     title: formatMessage(messages.note),
     tabIndex: null
@@ -64,7 +64,7 @@ export const getToolbarItems = (formatMessage, panelNodeType, isCustomPanelEnabl
     id: 'editor.panel.success',
     type: 'button',
     icon: SuccessIcon,
-    onClick: changePanelType(PanelType.SUCCESS),
+    onClick: changePanelType(editorAnalyticsAPI)(PanelType.SUCCESS),
     selected: activePanelType === PanelType.SUCCESS,
     title: formatMessage(messages.success),
     tabIndex: null
@@ -72,7 +72,7 @@ export const getToolbarItems = (formatMessage, panelNodeType, isCustomPanelEnabl
     id: 'editor.panel.warning',
     type: 'button',
     icon: WarningIcon,
-    onClick: changePanelType(PanelType.WARNING),
+    onClick: changePanelType(editorAnalyticsAPI)(PanelType.WARNING),
     selected: activePanelType === PanelType.WARNING,
     title: formatMessage(messages.warning),
     tabIndex: null
@@ -80,7 +80,7 @@ export const getToolbarItems = (formatMessage, panelNodeType, isCustomPanelEnabl
     id: 'editor.panel.error',
     type: 'button',
     icon: ErrorIcon,
-    onClick: changePanelType(PanelType.ERROR),
+    onClick: changePanelType(editorAnalyticsAPI)(PanelType.ERROR),
     selected: activePanelType === PanelType.ERROR,
     title: formatMessage(messages.error),
     tabIndex: null
@@ -99,7 +99,7 @@ export const getToolbarItems = (formatMessage, panelNodeType, isCustomPanelEnabl
         emojiId: panelEmoji.id
       } : {};
       if (previousColor === color) {
-        changePanelType(PanelType.CUSTOM, {
+        changePanelType(editorAnalyticsAPI)(PanelType.CUSTOM, {
           color,
           ...previousEmoji
         }, isCustomPanelEnabled)(state, dispatch);
@@ -115,7 +115,7 @@ export const getToolbarItems = (formatMessage, panelNodeType, isCustomPanelEnabl
         },
         eventType: EVENT_TYPE.TRACK
       };
-      withAnalytics(editorAnalyticsAPI, payload)(changePanelType(PanelType.CUSTOM, {
+      withAnalytics(editorAnalyticsAPI, payload)(changePanelType(editorAnalyticsAPI)(PanelType.CUSTOM, {
         color,
         ...previousEmoji
       }, isCustomPanelEnabled))(state, dispatch);
@@ -128,7 +128,7 @@ export const getToolbarItems = (formatMessage, panelNodeType, isCustomPanelEnabl
       }
       let previousIcon = panelNode.node.attrs.panelIcon || '';
       if (previousIcon === emoji.shortName) {
-        changePanelType(PanelType.CUSTOM, {
+        changePanelType(editorAnalyticsAPI)(PanelType.CUSTOM, {
           emoji: emoji.shortName,
           emojiId: emoji.id,
           emojiText: emoji.fallback
@@ -145,7 +145,7 @@ export const getToolbarItems = (formatMessage, panelNodeType, isCustomPanelEnabl
         },
         eventType: EVENT_TYPE.TRACK
       };
-      withAnalytics(editorAnalyticsAPI, payload)(changePanelType(PanelType.CUSTOM, {
+      withAnalytics(editorAnalyticsAPI, payload)(changePanelType(editorAnalyticsAPI)(PanelType.CUSTOM, {
         emoji: emoji.shortName,
         emojiId: emoji.id,
         emojiText: emoji.fallback
@@ -169,7 +169,7 @@ export const getToolbarItems = (formatMessage, panelNodeType, isCustomPanelEnabl
         },
         eventType: EVENT_TYPE.TRACK
       };
-      withAnalytics(editorAnalyticsAPI, payload)(changePanelType(PanelType.CUSTOM, {
+      withAnalytics(editorAnalyticsAPI, payload)(changePanelType(editorAnalyticsAPI)(PanelType.CUSTOM, {
         emoji: undefined,
         emojiId: undefined,
         emojiText: undefined
@@ -234,7 +234,7 @@ export const getToolbarItems = (formatMessage, panelNodeType, isCustomPanelEnabl
     appearance: 'danger',
     focusEditoronEnter: true,
     icon: RemoveIcon,
-    onClick: removePanel(),
+    onClick: removePanel(editorAnalyticsAPI),
     onMouseEnter: hoverDecoration === null || hoverDecoration === void 0 ? void 0 : hoverDecoration(panelNodeType, true),
     onMouseLeave: hoverDecoration === null || hoverDecoration === void 0 ? void 0 : hoverDecoration(panelNodeType, false),
     onFocus: hoverDecoration === null || hoverDecoration === void 0 ? void 0 : hoverDecoration(panelNodeType, true),

package/dist/es2019/plugins/undo-redo/pm-plugins/keymaps.js

@@ -1,8 +1,17 @@
-import { undo, redo, keymap, bindKeymapWithCommand, findKeyMapForBrowser } from '@atlaskit/editor-common/keymaps';
+import { SafePlugin } from '@atlaskit/editor-common/safe-plugin';
+import { undo, redo, bindKeymapWithCommand, findKeyMapForBrowser, isCapsLockOnAndModifyKeyboardEvent } from '@atlaskit/editor-common/keymaps';
 import { redoFromKeyboard, undoFromKeyboard } from '../commands';
+import { keydownHandler } from '@atlaskit/editor-prosemirror/keymap';
 export function keymapPlugin() {
   const list = {};
   bindKeymapWithCommand(findKeyMapForBrowser(redo), redoFromKeyboard, list);
   bindKeymapWithCommand(undo.common, undoFromKeyboard, list);
-  return keymap(list);
+  return new SafePlugin({
+    props: {
+      handleKeyDown(view, event) {
+        let keyboardEvent = isCapsLockOnAndModifyKeyboardEvent(event);
+        return keydownHandler(list)(view, keyboardEvent);
+      }
+    }
+  });
 }

package/dist/es2019/version-wrapper.js

@@ -1,5 +1,5 @@
 export const name = "@atlaskit/editor-core";
-export const version = "188.13.1";
+export const version = "188.13.3";
 export const nextMajorVersion = () => {
   return [Number(version.split('.')[0]) + 1, 0, 0].join('.');
 };

package/dist/esm/plugins/code-block/actions.js

@@ -4,7 +4,6 @@ import { pluginKey } from './plugin-key';
 import { copySelectionPluginKey } from './pm-plugins/codeBlockCopySelectionPlugin';
 import { ACTIONS } from './pm-plugins/actions';
 import { copyToClipboard } from '../../utils/clipboard';
-import { addAnalytics } from '../analytics/utils';
 import { shouldSplitSelectedNodeOnNodeInsertion } from '@atlaskit/editor-common/insert';
 import { transformToCodeBlockAction } from './transform-to-code-block';
 import { withAnalytics } from '@atlaskit/editor-common/editor-analytics';
@@ -23,30 +22,33 @@ export var removeCodeBlock = function removeCodeBlock(state, dispatch) {
   }
   return true;
 };
-export var changeLanguage = function changeLanguage(language) {
-  return function (state, dispatch) {
-    var _pluginKey$getState;
-    var codeBlock = state.schema.nodes.codeBlock;
-    var pos = (_pluginKey$getState = pluginKey.getState(state)) === null || _pluginKey$getState === void 0 ? void 0 : _pluginKey$getState.pos;
-    if (typeof pos !== 'number') {
-      return false;
-    }
-    var tr = state.tr.setNodeMarkup(pos, codeBlock, {
-      language: language
-    }).setMeta('scrollIntoView', false);
-    var selection = isNodeSelection(state.selection) ? NodeSelection.create(tr.doc, pos) : tr.selection;
-    var result = tr.setSelection(selection);
-    if (dispatch) {
-      dispatch(addAnalytics(state, result, {
-        action: ACTION.LANGUAGE_SELECTED,
-        actionSubject: ACTION_SUBJECT.CODE_BLOCK,
-        attributes: {
-          language: language
-        },
-        eventType: EVENT_TYPE.TRACK
-      }));
-    }
-    return true;
+export var changeLanguage = function changeLanguage(editorAnalyticsAPI) {
+  return function (language) {
+    return function (state, dispatch) {
+      var _pluginKey$getState;
+      var codeBlock = state.schema.nodes.codeBlock;
+      var pos = (_pluginKey$getState = pluginKey.getState(state)) === null || _pluginKey$getState === void 0 ? void 0 : _pluginKey$getState.pos;
+      if (typeof pos !== 'number') {
+        return false;
+      }
+      var tr = state.tr.setNodeMarkup(pos, codeBlock, {
+        language: language
+      }).setMeta('scrollIntoView', false);
+      var selection = isNodeSelection(state.selection) ? NodeSelection.create(tr.doc, pos) : tr.selection;
+      var result = tr.setSelection(selection);
+      if (dispatch) {
+        editorAnalyticsAPI === null || editorAnalyticsAPI === void 0 || editorAnalyticsAPI.attachAnalyticsEvent({
+          action: ACTION.LANGUAGE_SELECTED,
+          actionSubject: ACTION_SUBJECT.CODE_BLOCK,
+          attributes: {
+            language: language
+          },
+          eventType: EVENT_TYPE.TRACK
+        })(result);
+        dispatch(result);
+      }
+      return true;
+    };
   };
 };
 export var copyContentToClipboard = function copyContentToClipboard(state, dispatch) {

package/dist/esm/plugins/code-block/ide-ux/commands.js

@@ -1,6 +1,6 @@
 import { TextSelection } from '@atlaskit/editor-prosemirror/state';
 import { getLinesFromSelection, getLineInfo, forEachLine, getStartOfCurrentLine } from './line-handling';
-import { addAnalytics, ACTION, ACTION_SUBJECT_ID, EVENT_TYPE, INPUT_METHOD, INDENT_DIRECTION, INDENT_TYPE, ACTION_SUBJECT } from '../../analytics';
+import { ACTION, ACTION_SUBJECT_ID, EVENT_TYPE, INPUT_METHOD, INDENT_DIRECTION, INDENT_TYPE, ACTION_SUBJECT } from '@atlaskit/editor-common/analytics';
 /**
  * Return the current indentation level
  * @param indentText - Text in the code block that represent an indentation
@@ -12,55 +12,21 @@ function getIndentLevel(indentText, indentSize) {
   }
   return indentText.length / indentSize;
 }
-export function indent(state, dispatch) {
-  var _getLinesFromSelectio = getLinesFromSelection(state),
-    text = _getLinesFromSelectio.text,
-    start = _getLinesFromSelectio.start;
-  var tr = state.tr,
-    selection = state.selection;
-  forEachLine(text, function (line, offset) {
-    var _getLineInfo = getLineInfo(line),
-      indentText = _getLineInfo.indentText,
-      indentToken = _getLineInfo.indentToken;
-    var indentLevel = getIndentLevel(indentText, indentToken.size);
-    var indentToAdd = indentToken.token.repeat(indentToken.size - indentText.length % indentToken.size || indentToken.size);
-    tr.insertText(indentToAdd, tr.mapping.map(start + offset, -1));
-    addAnalytics(state, tr, {
-      action: ACTION.FORMATTED,
-      actionSubject: ACTION_SUBJECT.TEXT,
-      actionSubjectId: ACTION_SUBJECT_ID.FORMAT_INDENT,
-      eventType: EVENT_TYPE.TRACK,
-      attributes: {
-        inputMethod: INPUT_METHOD.KEYBOARD,
-        previousIndentationLevel: indentLevel,
-        newIndentLevel: indentLevel + 1,
-        direction: INDENT_DIRECTION.INDENT,
-        indentType: INDENT_TYPE.CODE_BLOCK
-      }
-    });
-    if (!selection.empty) {
-      tr.setSelection(TextSelection.create(tr.doc, tr.mapping.map(selection.from, -1), tr.selection.to));
-    }
-  });
-  if (dispatch) {
-    dispatch(tr);
-  }
-  return true;
-}
-export function outdent(state, dispatch) {
-  var _getLinesFromSelectio2 = getLinesFromSelection(state),
-    text = _getLinesFromSelectio2.text,
-    start = _getLinesFromSelectio2.start;
-  var tr = state.tr;
-  forEachLine(text, function (line, offset) {
-    var _getLineInfo2 = getLineInfo(line),
-      indentText = _getLineInfo2.indentText,
-      indentToken = _getLineInfo2.indentToken;
-    if (indentText) {
+export var indent = function indent(editorAnalyticsAPI) {
+  return function (state, dispatch) {
+    var _getLinesFromSelectio = getLinesFromSelection(state),
+      text = _getLinesFromSelectio.text,
+      start = _getLinesFromSelectio.start;
+    var tr = state.tr,
+      selection = state.selection;
+    forEachLine(text, function (line, offset) {
+      var _getLineInfo = getLineInfo(line),
+        indentText = _getLineInfo.indentText,
+        indentToken = _getLineInfo.indentToken;
       var indentLevel = getIndentLevel(indentText, indentToken.size);
-      var unindentLength = indentText.length % indentToken.size || indentToken.size;
-      tr.delete(tr.mapping.map(start + offset), tr.mapping.map(start + offset + unindentLength));
-      addAnalytics(state, tr, {
+      var indentToAdd = indentToken.token.repeat(indentToken.size - indentText.length % indentToken.size || indentToken.size);
+      tr.insertText(indentToAdd, tr.mapping.map(start + offset, -1));
+      editorAnalyticsAPI === null || editorAnalyticsAPI === void 0 || editorAnalyticsAPI.attachAnalyticsEvent({
         action: ACTION.FORMATTED,
         actionSubject: ACTION_SUBJECT.TEXT,
         actionSubjectId: ACTION_SUBJECT_ID.FORMAT_INDENT,
@@ -68,18 +34,56 @@ export function outdent(state, dispatch) {
         attributes: {
           inputMethod: INPUT_METHOD.KEYBOARD,
           previousIndentationLevel: indentLevel,
-          newIndentLevel: indentLevel - 1,
-          direction: INDENT_DIRECTION.OUTDENT,
+          newIndentLevel: indentLevel + 1,
+          direction: INDENT_DIRECTION.INDENT,
           indentType: INDENT_TYPE.CODE_BLOCK
         }
-      });
+      })(tr);
+      if (!selection.empty) {
+        tr.setSelection(TextSelection.create(tr.doc, tr.mapping.map(selection.from, -1), tr.selection.to));
+      }
+    });
+    if (dispatch) {
+      dispatch(tr);
     }
-  });
-  if (dispatch) {
-    dispatch(tr);
-  }
-  return true;
-}
+    return true;
+  };
+};
+export var outdent = function outdent(editorAnalyticsAPI) {
+  return function (state, dispatch) {
+    var _getLinesFromSelectio2 = getLinesFromSelection(state),
+      text = _getLinesFromSelectio2.text,
+      start = _getLinesFromSelectio2.start;
+    var tr = state.tr;
+    forEachLine(text, function (line, offset) {
+      var _getLineInfo2 = getLineInfo(line),
+        indentText = _getLineInfo2.indentText,
+        indentToken = _getLineInfo2.indentToken;
+      if (indentText) {
+        var indentLevel = getIndentLevel(indentText, indentToken.size);
+        var unindentLength = indentText.length % indentToken.size || indentToken.size;
+        tr.delete(tr.mapping.map(start + offset), tr.mapping.map(start + offset + unindentLength));
+        editorAnalyticsAPI === null || editorAnalyticsAPI === void 0 || editorAnalyticsAPI.attachAnalyticsEvent({
+          action: ACTION.FORMATTED,
+          actionSubject: ACTION_SUBJECT.TEXT,
+          actionSubjectId: ACTION_SUBJECT_ID.FORMAT_INDENT,
+          eventType: EVENT_TYPE.TRACK,
+          attributes: {
+            inputMethod: INPUT_METHOD.KEYBOARD,
+            previousIndentationLevel: indentLevel,
+            newIndentLevel: indentLevel - 1,
+            direction: INDENT_DIRECTION.OUTDENT,
+            indentType: INDENT_TYPE.CODE_BLOCK
+          }
+        })(tr);
+      }
+    });
+    if (dispatch) {
+      dispatch(tr);
+    }
+    return true;
+  };
+};
 export function insertIndent(state, dispatch) {
   var _getStartOfCurrentLin = getStartOfCurrentLine(state),
     textAtStartOfLine = _getStartOfCurrentLin.text;

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

@@ -106,7 +106,7 @@ var codeBlockPlugin = function codeBlockPlugin(_ref) {
           }
         }];
       },
-      floatingToolbar: getToolbarConfig(options === null || options === void 0 ? void 0 : options.allowCopyToClipboard, api === null || api === void 0 ? void 0 : api.decorations.actions.hoverDecoration)
+      floatingToolbar: getToolbarConfig(options === null || options === void 0 ? void 0 : options.allowCopyToClipboard, api)
     }
   };
 };

package/dist/esm/plugins/code-block/pm-plugins/ide-ux.js

@@ -10,6 +10,8 @@ import { getAutoClosingQuoteInfo, shouldAutoCloseQuote } from '../ide-ux/quote-h
 import { getEndOfCurrentLine, getStartOfCurrentLine, isCursorInsideCodeBlock, isSelectionEntirelyInsideCodeBlock, getLineInfo } from '../ide-ux/line-handling';
 import { insertIndent, outdent, indent, insertNewlineWithIndent } from '../ide-ux/commands';
 var ideUX = function ideUX(pluginInjectionApi) {
+  var _pluginInjectionApi$a;
+  var editorAnalyticsAPI = pluginInjectionApi === null || pluginInjectionApi === void 0 || (_pluginInjectionApi$a = pluginInjectionApi.analytics) === null || _pluginInjectionApi$a === void 0 ? void 0 : _pluginInjectionApi$a.actions;
   return new SafePlugin({
     props: {
       handleTextInput: function handleTextInput(view, from, to, text) {
@@ -92,8 +94,8 @@ var ideUX = function ideUX(pluginInjectionApi) {
           return false;
         },
         Enter: filter(isSelectionEntirelyInsideCodeBlock, insertNewlineWithIndent),
-        'Mod-]': filter(isSelectionEntirelyInsideCodeBlock, indent),
-        'Mod-[': filter(isSelectionEntirelyInsideCodeBlock, outdent),
+        'Mod-]': filter(isSelectionEntirelyInsideCodeBlock, indent(editorAnalyticsAPI)),
+        'Mod-[': filter(isSelectionEntirelyInsideCodeBlock, outdent(editorAnalyticsAPI)),
         Tab: filter(isSelectionEntirelyInsideCodeBlock, function (state, dispatch) {
           if (!dispatch) {
             return false;
@@ -101,9 +103,9 @@ var ideUX = function ideUX(pluginInjectionApi) {
           if (isCursorInsideCodeBlock(state)) {
             return insertIndent(state, dispatch);
           }
-          return indent(state, dispatch);
+          return indent(editorAnalyticsAPI)(state, dispatch);
         }),
-        'Shift-Tab': filter(isSelectionEntirelyInsideCodeBlock, outdent),
+        'Shift-Tab': filter(isSelectionEntirelyInsideCodeBlock, outdent(editorAnalyticsAPI)),
         'Mod-a': function ModA(state, dispatch) {
           if (isSelectionEntirelyInsideCodeBlock(state)) {
             var _state$selection = state.selection,

package/dist/esm/plugins/code-block/toolbar.js

@@ -18,10 +18,13 @@ export var messages = defineMessages({
 var languageList = createLanguageList(DEFAULT_LANGUAGES);
 export var getToolbarConfig = function getToolbarConfig() {
   var allowCopyToClipboard = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : false;
-  var hoverDecoration = arguments.length > 1 ? arguments[1] : undefined;
+  var api = arguments.length > 1 ? arguments[1] : undefined;
   return function (state, _ref) {
-    var _codeBlockState$pos, _node$attrs;
+    var _api$decorations$acti, _api$analytics, _codeBlockState$pos, _node$attrs;
     var formatMessage = _ref.formatMessage;
+    var _ref2 = (_api$decorations$acti = api === null || api === void 0 ? void 0 : api.decorations.actions) !== null && _api$decorations$acti !== void 0 ? _api$decorations$acti : {},
+      hoverDecoration = _ref2.hoverDecoration;
+    var editorAnalyticsAPI = api === null || api === void 0 || (_api$analytics = api.analytics) === null || _api$analytics === void 0 ? void 0 : _api$analytics.actions;
     var codeBlockState = pluginKey.getState(state);
     var pos = (_codeBlockState$pos = codeBlockState === null || codeBlockState === void 0 ? void 0 : codeBlockState.pos) !== null && _codeBlockState$pos !== void 0 ? _codeBlockState$pos : null;
     if (!codeBlockState || pos === null) {
@@ -52,7 +55,7 @@ export var getToolbarConfig = function getToolbarConfig() {
       type: 'select',
       selectType: 'list',
       onChange: function onChange(option) {
-        return changeLanguage(option.value);
+        return changeLanguage(editorAnalyticsAPI)(option.value);
       },
       defaultValue: defaultValue,
       placeholder: formatMessage(messages.selectLanguage),
@@ -110,8 +113,8 @@ export var getToolbarConfig = function getToolbarConfig() {
  * Filters language list based on both name and alias properties.
  */
 export var languageListFilter = function languageListFilter(option, rawInput) {
-  var _ref2 = option,
-    data = _ref2.data;
+  var _ref3 = option,
+    data = _ref3.data;
   var searchString = rawInput.toLowerCase();
   return data.label.toLowerCase().includes(searchString) || data.alias.some(function (alias) {
     return alias.toLowerCase() === searchString;

package/dist/esm/plugins/layout/actions.js

@@ -7,7 +7,6 @@ import { TextSelection, NodeSelection } from '@atlaskit/editor-prosemirror/state
 import { flatmap, mapChildren } from '../../utils/slice';
 import { getStepRange, isEmptyDocument } from '@atlaskit/editor-common/utils';
 import { ACTION, ACTION_SUBJECT, ACTION_SUBJECT_ID, EVENT_TYPE } from '@atlaskit/editor-common/analytics';
-import { addAnalytics } from '../analytics/utils';
 import { withAnalytics } from '@atlaskit/editor-common/editor-analytics';
 import { LAYOUT_TYPE } from '../analytics/types/node-events';
 import { pluginKey } from './pm-plugins/plugin-key';
@@ -201,36 +200,38 @@ export function forceSectionToPresetLayout(state, node, pos, presetLayout) {
   var selectionPos$ = tr.doc.resolve(selection.$from.pos);
   return tr.setSelection(state.selection instanceof NodeSelection ? new NodeSelection(selectionPos$) : new TextSelection(selectionPos$));
 }
-export var setPresetLayout = function setPresetLayout(layout) {
-  return function (state, dispatch) {
-    var _ref = pluginKey.getState(state),
-      pos = _ref.pos,
-      selectedLayout = _ref.selectedLayout;
-    if (selectedLayout === layout || pos === null) {
-      return false;
-    }
-    var node = state.doc.nodeAt(pos);
-    if (!node) {
-      return false;
-    }
-    var tr = forceSectionToPresetLayout(state, node, pos, layout);
-    if (tr) {
-      tr = addAnalytics(state, tr, {
-        action: ACTION.CHANGED_LAYOUT,
-        actionSubject: ACTION_SUBJECT.LAYOUT,
-        attributes: {
-          previousLayout: formatLayoutName(selectedLayout),
-          newLayout: formatLayoutName(layout)
-        },
-        eventType: EVENT_TYPE.TRACK
-      });
-      tr.setMeta('scrollIntoView', false);
-      if (dispatch) {
-        dispatch(tr);
+export var setPresetLayout = function setPresetLayout(editorAnalyticsAPI) {
+  return function (layout) {
+    return function (state, dispatch) {
+      var _ref = pluginKey.getState(state),
+        pos = _ref.pos,
+        selectedLayout = _ref.selectedLayout;
+      if (selectedLayout === layout || pos === null) {
+        return false;
       }
-      return true;
-    }
-    return false;
+      var node = state.doc.nodeAt(pos);
+      if (!node) {
+        return false;
+      }
+      var tr = forceSectionToPresetLayout(state, node, pos, layout);
+      if (tr) {
+        editorAnalyticsAPI === null || editorAnalyticsAPI === void 0 || editorAnalyticsAPI.attachAnalyticsEvent({
+          action: ACTION.CHANGED_LAYOUT,
+          actionSubject: ACTION_SUBJECT.LAYOUT,
+          attributes: {
+            previousLayout: formatLayoutName(selectedLayout),
+            newLayout: formatLayoutName(layout)
+          },
+          eventType: EVENT_TYPE.TRACK
+        })(tr);
+        tr.setMeta('scrollIntoView', false);
+        if (dispatch) {
+          dispatch(tr);
+        }
+        return true;
+      }
+      return false;
+    };
   };
 };
 function layoutNeedChanges(node) {
@@ -295,27 +296,29 @@ export var fixColumnStructure = function fixColumnStructure(state) {
   }
   return;
 };
-export var deleteActiveLayoutNode = function deleteActiveLayoutNode(state, dispatch) {
-  var _ref3 = pluginKey.getState(state),
-    pos = _ref3.pos,
-    selectedLayout = _ref3.selectedLayout;
-  if (pos !== null) {
-    var node = state.doc.nodeAt(pos);
-    if (dispatch) {
-      var tr = state.tr.delete(pos, pos + node.nodeSize);
-      tr = addAnalytics(state, tr, {
-        action: ACTION.DELETED,
-        actionSubject: ACTION_SUBJECT.LAYOUT,
-        attributes: {
-          layout: formatLayoutName(selectedLayout)
-        },
-        eventType: EVENT_TYPE.TRACK
-      });
-      dispatch(tr);
+export var deleteActiveLayoutNode = function deleteActiveLayoutNode(editorAnalyticsAPI) {
+  return function (state, dispatch) {
+    var _ref3 = pluginKey.getState(state),
+      pos = _ref3.pos,
+      selectedLayout = _ref3.selectedLayout;
+    if (pos !== null) {
+      var node = state.doc.nodeAt(pos);
+      if (dispatch) {
+        var tr = state.tr.delete(pos, pos + node.nodeSize);
+        editorAnalyticsAPI === null || editorAnalyticsAPI === void 0 || editorAnalyticsAPI.attachAnalyticsEvent({
+          action: ACTION.DELETED,
+          actionSubject: ACTION_SUBJECT.LAYOUT,
+          attributes: {
+            layout: formatLayoutName(selectedLayout)
+          },
+          eventType: EVENT_TYPE.TRACK
+        })(tr);
+        dispatch(tr);
+      }
+      return true;
     }
-    return true;
-  }
-  return false;
+    return false;
+  };
 };
 var formatLayoutName = function formatLayoutName(layout) {
   switch (layout) {

package/dist/esm/plugins/layout/index.js

@@ -43,8 +43,7 @@ var layoutPlugin = function layoutPlugin(_ref) {
           addSidebarLayouts = _ref2.addSidebarLayouts,
           allowSingleColumnLayout = _ref2.allowSingleColumnLayout;
         if (pos !== null) {
-          var _api$decorations$acti;
-          return buildToolbar(state, intl, pos, allowBreakout, addSidebarLayouts, allowSingleColumnLayout, api === null || api === void 0 || (_api$decorations$acti = api.decorations.actions) === null || _api$decorations$acti === void 0 ? void 0 : _api$decorations$acti.hoverDecoration);
+          return buildToolbar(state, intl, pos, allowBreakout, addSidebarLayouts, allowSingleColumnLayout, api);
         }
         return undefined;
       },

package/dist/esm/plugins/layout/toolbar.js

@@ -43,20 +43,24 @@ var SIDEBAR_LAYOUT_TYPES = [{
   title: toolbarMessages.threeColumnsWithSidebars,
   icon: LayoutThreeWithSidebarsIcon
 }];
-var buildLayoutButton = function buildLayoutButton(intl, item, currentLayout) {
+var buildLayoutButton = function buildLayoutButton(intl, item, currentLayout, editorAnalyticsAPI) {
   return {
     id: item.id,
     type: 'button',
     icon: item.icon,
     testId: item.title.id,
     title: intl.formatMessage(item.title),
-    onClick: setPresetLayout(item.type),
+    onClick: setPresetLayout(editorAnalyticsAPI)(item.type),
     selected: !!currentLayout && currentLayout === item.type,
     tabIndex: null
   };
 };
 export var layoutToolbarTitle = 'Layout floating controls';
-export var buildToolbar = function buildToolbar(state, intl, pos, _allowBreakout, addSidebarLayouts, allowSingleColumnLayout, hoverDecoration) {
+export var buildToolbar = function buildToolbar(state, intl, pos, _allowBreakout, addSidebarLayouts, allowSingleColumnLayout, api) {
+  var _api$decorations$acti, _api$decorations, _api$analytics;
+  var _ref = (_api$decorations$acti = api === null || api === void 0 || (_api$decorations = api.decorations) === null || _api$decorations === void 0 ? void 0 : _api$decorations.actions) !== null && _api$decorations$acti !== void 0 ? _api$decorations$acti : {},
+    hoverDecoration = _ref.hoverDecoration;
+  var editorAnalyticsAPI = api === null || api === void 0 || (_api$analytics = api.analytics) === null || _api$analytics === void 0 ? void 0 : _api$analytics.actions;
   var node = state.doc.nodeAt(pos);
   if (node) {
     var currentLayout = getPresetLayout(node);
@@ -72,7 +76,7 @@ export var buildToolbar = function buildToolbar(state, intl, pos, _allowBreakout
       icon: RemoveIcon,
       testId: commonMessages.remove.id,
       title: intl.formatMessage(commonMessages.remove),
-      onClick: deleteActiveLayoutNode,
+      onClick: deleteActiveLayoutNode(editorAnalyticsAPI),
       onMouseEnter: hoverDecoration === null || hoverDecoration === void 0 ? void 0 : hoverDecoration(nodeType, true),
       onMouseLeave: hoverDecoration === null || hoverDecoration === void 0 ? void 0 : hoverDecoration(nodeType, false),
       onFocus: hoverDecoration === null || hoverDecoration === void 0 ? void 0 : hoverDecoration(nodeType, true),
@@ -87,9 +91,9 @@ export var buildToolbar = function buildToolbar(state, intl, pos, _allowBreakout
       },
       nodeType: nodeType,
       items: [].concat(_toConsumableArray(layoutTypes.map(function (i) {
-        return buildLayoutButton(intl, i, currentLayout);
+        return buildLayoutButton(intl, i, currentLayout, editorAnalyticsAPI);
       })), _toConsumableArray(addSidebarLayouts ? SIDEBAR_LAYOUT_TYPES.map(function (i) {
-        return buildLayoutButton(intl, i, currentLayout);
+        return buildLayoutButton(intl, i, currentLayout, editorAnalyticsAPI);
       }) : []), [{
         type: 'copy-button',
         items: [separator, {