@atlaskit/editor-core 187.35.4 → 187.36.0

package/dist/es2019/ui/ContentStyles/index.js

@@ -2,7 +2,8 @@
 import React, { useMemo } from 'react';
 import { jsx, css, useTheme } from '@emotion/react';
 import { whitespaceSharedStyles, paragraphSharedStyles, listsSharedStyles, indentationSharedStyles, blockMarksSharedStyles, shadowSharedStyle, dateSharedStyle, tasksAndDecisionsStyles, annotationSharedStyles, smartCardSharedStyles, textColorStyles, resizerStyles, gridStyles, smartCardStyles, embedCardStyles, codeBlockInListSafariFix, unsupportedStyles } from '@atlaskit/editor-common/styles';
-import { akEditorSelectedNodeClassName, blockNodesVerticalMargin, editorFontSize, getSelectionStyles, SelectionStyle } from '@atlaskit/editor-shared-styles';
+import { akEditorSelectedBorderSize, akEditorDeleteBorder, akEditorDeleteBackgroundWithOpacity, akEditorSelectedNodeClassName, blockNodesVerticalMargin, editorFontSize, getSelectionStyles, SelectionStyle } from '@atlaskit/editor-shared-styles';
+import { MentionSharedCssClassName } from '@atlaskit/editor-common/mention';
 import { telepointerStyle } from '../../plugins/collab-edit/styles';
 import { gapCursorStyles } from '../../plugins/selection/gap-cursor/styles';
 import { tableStyles } from '@atlaskit/editor-plugin-table/ui/common-styles';
@@ -14,7 +15,6 @@ import { mediaStyles } from '../../plugins/media/styles';
 import { layoutStyles } from '../../plugins/layout/styles';
 import { panelStyles } from '../../plugins/panel/styles';
 import { fakeCursorStyles } from '../../plugins/fake-text-cursor/styles';
-import { mentionsStyles } from '../../plugins/mentions/styles';
 import { placeholderTextStyles } from '../../plugins/placeholder-text/styles';
 import { extensionStyles } from '../../plugins/extension/ui/styles';
 import { expandStyles } from '../../plugins/expand/ui/styles';
@@ -27,11 +27,37 @@ import { InlineNodeViewSharedStyles } from '../../nodeviews/getInlineNodeViewPro
 import { linkSharedStyle, codeMarkSharedStyles } from '@atlaskit/editor-common/styles';
 import { browser } from '@atlaskit/editor-common/utils';
 import { EmojiSharedCssClassName } from '@atlaskit/editor-common/emoji';
+import { N500, N30A } from '@atlaskit/theme/colors';
 export const linkStyles = css`
   .ProseMirror {
     ${linkSharedStyle}
   }
 `;
+const mentionsStyles = css`
+  .${MentionSharedCssClassName.MENTION_CONTAINER} {
+    &.${akEditorSelectedNodeClassName} [data-mention-id] > span {
+      ${getSelectionStyles([SelectionStyle.BoxShadow, SelectionStyle.Background])}
+
+      /* need to specify dark text colour because personal mentions
+         (in dark blue) have white text by default */
+      color: ${`var(--ds-text-subtle, ${N500})`};
+    }
+  }
+
+  .danger {
+    .${MentionSharedCssClassName.MENTION_CONTAINER}.${akEditorSelectedNodeClassName}
+      > span
+      > span
+      > span {
+      box-shadow: 0 0 0 ${akEditorSelectedBorderSize}px ${akEditorDeleteBorder};
+      background-color: ${`var(--ds-background-danger, ${akEditorDeleteBackgroundWithOpacity})`};
+    }
+    .${MentionSharedCssClassName.MENTION_CONTAINER} > span > span > span {
+      background-color: ${`var(--ds-background-neutral, ${N30A})`};
+      color: ${`var(--ds-text-subtle, ${N500})`};
+    }
+  }
+`;
 const listsStyles = css`
   .ProseMirror {
     li {

package/dist/es2019/version-wrapper.js

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

package/dist/esm/index.js

@@ -16,10 +16,8 @@ export { TeamMentionResource } from '@atlaskit/mention/team-resource';
 export { AnnotationUpdateEmitter } from './plugins/annotation';
 // Used in mobile bridge
 export { stateKey as mediaPluginKey } from './plugins/media/pm-plugins/main';
-export { mentionPluginKey } from './plugins/mentions';
 export { textColorPluginKey } from './plugins/text-color';
 export { changeColor } from './plugins/text-color/commands/change-color';
-export { insertHorizontalRule } from './plugins/rule/commands';
 
 /**
  * @private

package/dist/esm/plugins/insert-block/ui/ToolbarInsertBlock/index.js

@@ -30,7 +30,6 @@ import { ACTION, ACTION_SUBJECT, ACTION_SUBJECT_ID, EVENT_TYPE, INPUT_METHOD } f
 import { messages } from './messages';
 import { createItems } from './create-items';
 import { BlockInsertMenu } from './block-insert-menu';
-import { insertHorizontalRule } from '../../../rule/commands';
 import withOuterListeners from '../../../../ui/with-outer-listeners';
 
 /**
@@ -250,12 +249,13 @@ export var ToolbarInsertBlock = /*#__PURE__*/function (_React$PureComponent) {
       };
     });
     _defineProperty(_assertThisInitialized(_this), "insertHorizontalRule", function (inputMethod) {
+      var _pluginInjectionApi$r, _pluginInjectionApi$r2;
       var _this$props4 = _this.props,
         _this$props4$editorVi = _this$props4.editorView,
         state = _this$props4$editorVi.state,
         dispatch = _this$props4$editorVi.dispatch,
-        featureFlags = _this$props4.featureFlags;
-      return insertHorizontalRule(inputMethod, featureFlags)(state, dispatch);
+        pluginInjectionApi = _this$props4.pluginInjectionApi;
+      return (_pluginInjectionApi$r = pluginInjectionApi === null || pluginInjectionApi === void 0 ? void 0 : (_pluginInjectionApi$r2 = pluginInjectionApi.rule) === null || _pluginInjectionApi$r2 === void 0 ? void 0 : _pluginInjectionApi$r2.actions.insertHorizontalRule(inputMethod)(state, dispatch)) !== null && _pluginInjectionApi$r !== void 0 ? _pluginInjectionApi$r : false;
     });
     _defineProperty(_assertThisInitialized(_this), "insertExpand", function () {
       var _this$props$editorVie2 = _this.props.editorView,

package/dist/esm/plugins/rule/commands.js

@@ -1,13 +1,15 @@
 import { createHorizontalRule } from './pm-plugins/input-rule';
-export var insertHorizontalRule = function insertHorizontalRule(inputMethod, featureFlags) {
-  return function (state, dispatch) {
-    var tr = createHorizontalRule(state, featureFlags, state.selection.from, state.selection.to, inputMethod);
-    if (tr) {
-      if (dispatch) {
-        dispatch(tr);
+export var insertHorizontalRule = function insertHorizontalRule(featureFlags, editorAnalyticsAPI) {
+  return function (inputMethod) {
+    return function (state, dispatch) {
+      var tr = createHorizontalRule(state, featureFlags, state.selection.from, state.selection.to, inputMethod, editorAnalyticsAPI);
+      if (tr) {
+        if (dispatch) {
+          dispatch(tr);
+        }
+        return true;
       }
-      return true;
-    }
-    return false;
+      return false;
+    };
   };
 };

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

@@ -1,12 +1,13 @@
 import React from 'react';
 import { rule } from '@atlaskit/adf-schema';
-import { ACTION, ACTION_SUBJECT, ACTION_SUBJECT_ID, addAnalytics, EVENT_TYPE, INPUT_METHOD } from '../analytics';
-import { messages } from '../insert-block/ui/ToolbarInsertBlock/messages';
+import { ACTION, ACTION_SUBJECT, ACTION_SUBJECT_ID, EVENT_TYPE, INPUT_METHOD } from '@atlaskit/editor-common/analytics';
+import { toolbarInsertBlockMessages as messages } from '@atlaskit/editor-common/messages';
 import { IconDivider } from '@atlaskit/editor-common/quick-insert';
 import inputRulePlugin from './pm-plugins/input-rule';
 import keymapPlugin from './pm-plugins/keymap';
+import { insertHorizontalRule } from './commands';
 var rulePlugin = function rulePlugin(_ref) {
-  var _api$featureFlags;
+  var _api$featureFlags, _api$analytics;
   var api = _ref.api;
   var featureFlags = (api === null || api === void 0 ? void 0 : (_api$featureFlags = api.featureFlags) === null || _api$featureFlags === void 0 ? void 0 : _api$featureFlags.sharedState.currentState()) || {};
   return {
@@ -17,17 +18,22 @@ var rulePlugin = function rulePlugin(_ref) {
         node: rule
       }];
     },
+    actions: {
+      insertHorizontalRule: insertHorizontalRule(featureFlags, api === null || api === void 0 ? void 0 : (_api$analytics = api.analytics) === null || _api$analytics === void 0 ? void 0 : _api$analytics.actions)
+    },
     pmPlugins: function pmPlugins() {
       return [{
         name: 'ruleInputRule',
         plugin: function plugin(_ref2) {
+          var _api$analytics2;
           var schema = _ref2.schema;
-          return inputRulePlugin(schema, featureFlags);
+          return inputRulePlugin(schema, featureFlags, api === null || api === void 0 ? void 0 : (_api$analytics2 = api.analytics) === null || _api$analytics2 === void 0 ? void 0 : _api$analytics2.actions);
         }
       }, {
         name: 'ruleKeymap',
         plugin: function plugin() {
-          return keymapPlugin(featureFlags);
+          var _api$analytics3;
+          return keymapPlugin(featureFlags, api === null || api === void 0 ? void 0 : (_api$analytics3 = api.analytics) === null || _api$analytics3 === void 0 ? void 0 : _api$analytics3.actions);
         }
       }];
     },
@@ -45,8 +51,9 @@ var rulePlugin = function rulePlugin(_ref) {
             return /*#__PURE__*/React.createElement(IconDivider, null);
           },
           action: function action(insert, state) {
+            var _api$analytics4;
             var tr = insert(state.schema.nodes.rule.createChecked());
-            return addAnalytics(state, tr, {
+            api === null || api === void 0 ? void 0 : (_api$analytics4 = api.analytics) === null || _api$analytics4 === void 0 ? void 0 : _api$analytics4.actions.attachAnalyticsEvent({
               action: ACTION.INSERTED,
               actionSubject: ACTION_SUBJECT.DOCUMENT,
               actionSubjectId: ACTION_SUBJECT_ID.DIVIDER,
@@ -54,7 +61,8 @@ var rulePlugin = function rulePlugin(_ref) {
                 inputMethod: INPUT_METHOD.QUICK_INSERT
               },
               eventType: EVENT_TYPE.TRACK
-            });
+            })(tr);
+            return tr;
           }
         }];
       }

package/dist/esm/plugins/rule/pm-plugins/input-rule.js

@@ -1,10 +1,9 @@
 import { Fragment, Slice } from '@atlaskit/editor-prosemirror/model';
-import { createRule, createPlugin } from '@atlaskit/prosemirror-input-rules';
-import { leafNodeReplacementCharacter } from '@atlaskit/prosemirror-input-rules';
+import { createRule, createPlugin, leafNodeReplacementCharacter } from '@atlaskit/prosemirror-input-rules';
 import { safeInsert } from '@atlaskit/editor-common/insert';
 import { hasParentNodeOfType } from '@atlaskit/editor-prosemirror/utils';
-import { ACTION, ACTION_SUBJECT, ACTION_SUBJECT_ID, addAnalytics, EVENT_TYPE, INPUT_METHOD } from '../../analytics';
-export var createHorizontalRule = function createHorizontalRule(state, featureFlags, start, end, inputMethod) {
+import { ACTION, ACTION_SUBJECT, ACTION_SUBJECT_ID, EVENT_TYPE, INPUT_METHOD } from '@atlaskit/editor-common/analytics';
+export var createHorizontalRule = function createHorizontalRule(state, featureFlags, start, end, inputMethod, editorAnalyticsAPI) {
   if (!state.selection.empty) {
     return null;
   }
@@ -23,7 +22,7 @@ export var createHorizontalRule = function createHorizontalRule(state, featureFl
   if (!tr) {
     tr = state.tr.replaceRange(start, end, new Slice(Fragment.from(state.schema.nodes.rule.createChecked()), 0, 0));
   }
-  return addAnalytics(state, tr, {
+  editorAnalyticsAPI === null || editorAnalyticsAPI === void 0 ? void 0 : editorAnalyticsAPI.attachAnalyticsEvent({
     action: ACTION.INSERTED,
     actionSubject: ACTION_SUBJECT.DOCUMENT,
     actionSubjectId: ACTION_SUBJECT_ID.DIVIDER,
@@ -31,21 +30,22 @@ export var createHorizontalRule = function createHorizontalRule(state, featureFl
       inputMethod: inputMethod
     },
     eventType: EVENT_TYPE.TRACK
-  });
+  })(tr);
+  return tr;
 };
-var createHorizontalRuleAutoformat = function createHorizontalRuleAutoformat(state, featureFlags, start, end) {
+var createHorizontalRuleAutoformat = function createHorizontalRuleAutoformat(state, featureFlags, start, end, editorAnalyticsAPI) {
   var listItem = state.schema.nodes.listItem;
   if (hasParentNodeOfType(listItem)(state.selection)) {
     return null;
   }
-  return createHorizontalRule(state, featureFlags, start, end, INPUT_METHOD.FORMATTING);
+  return createHorizontalRule(state, featureFlags, start, end, INPUT_METHOD.FORMATTING, editorAnalyticsAPI);
 };
-export function inputRulePlugin(schema, featureFlags) {
+export function inputRulePlugin(schema, featureFlags, editorAnalyticsAPI) {
   var rules = [];
   if (schema.nodes.rule) {
     // '---' and '***' for hr
     rules.push(createRule(/^(\-\-\-|\*\*\*)$/, function (state, _match, start, end) {
-      return createHorizontalRuleAutoformat(state, featureFlags, start, end);
+      return createHorizontalRuleAutoformat(state, featureFlags, start, end, editorAnalyticsAPI);
     }));
 
     // '---' and '***' after shift+enter for hr
@@ -54,7 +54,7 @@ export function inputRulePlugin(schema, featureFlags) {
       if (state.doc.resolve(start).nodeAfter.type !== hardBreak) {
         return null;
       }
-      return createHorizontalRuleAutoformat(state, featureFlags, start, end);
+      return createHorizontalRuleAutoformat(state, featureFlags, start, end, editorAnalyticsAPI);
     }));
   }
   if (rules.length !== 0) {

package/dist/esm/plugins/rule/pm-plugins/keymap.js

@@ -2,9 +2,9 @@ import { keymap } from '@atlaskit/editor-prosemirror/keymap';
 import { bindKeymapWithCommand, insertRule, escape } from '@atlaskit/editor-common/keymaps';
 import { INPUT_METHOD } from '@atlaskit/editor-common/analytics';
 import { insertHorizontalRule } from '../commands';
-export function keymapPlugin(featureFlags) {
+export function keymapPlugin(featureFlags, editorAnalyticsAPI) {
   var list = {};
-  bindKeymapWithCommand(insertRule.common, insertHorizontalRule(INPUT_METHOD.SHORTCUT, featureFlags), list);
+  bindKeymapWithCommand(insertRule.common, insertHorizontalRule(featureFlags, editorAnalyticsAPI)(INPUT_METHOD.SHORTCUT), list);
   bindKeymapWithCommand(escape.common, function () {
     return true;
   }, list);

package/dist/esm/ui/ContentStyles/index.js

@@ -1,10 +1,11 @@
 import _taggedTemplateLiteral from "@babel/runtime/helpers/taggedTemplateLiteral";
-var _templateObject, _templateObject2, _templateObject3, _templateObject4;
+var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5;
 /** @jsx jsx */
 import React, { useMemo } from 'react';
 import { jsx, css, useTheme } from '@emotion/react';
 import { whitespaceSharedStyles, paragraphSharedStyles, listsSharedStyles, indentationSharedStyles, blockMarksSharedStyles, shadowSharedStyle, dateSharedStyle, tasksAndDecisionsStyles, annotationSharedStyles, smartCardSharedStyles, textColorStyles, resizerStyles, gridStyles, smartCardStyles, embedCardStyles, codeBlockInListSafariFix, unsupportedStyles } from '@atlaskit/editor-common/styles';
-import { akEditorSelectedNodeClassName, blockNodesVerticalMargin, editorFontSize, getSelectionStyles, SelectionStyle } from '@atlaskit/editor-shared-styles';
+import { akEditorSelectedBorderSize, akEditorDeleteBorder, akEditorDeleteBackgroundWithOpacity, akEditorSelectedNodeClassName, blockNodesVerticalMargin, editorFontSize, getSelectionStyles, SelectionStyle } from '@atlaskit/editor-shared-styles';
+import { MentionSharedCssClassName } from '@atlaskit/editor-common/mention';
 import { telepointerStyle } from '../../plugins/collab-edit/styles';
 import { gapCursorStyles } from '../../plugins/selection/gap-cursor/styles';
 import { tableStyles } from '@atlaskit/editor-plugin-table/ui/common-styles';
@@ -16,7 +17,6 @@ import { mediaStyles } from '../../plugins/media/styles';
 import { layoutStyles } from '../../plugins/layout/styles';
 import { panelStyles } from '../../plugins/panel/styles';
 import { fakeCursorStyles } from '../../plugins/fake-text-cursor/styles';
-import { mentionsStyles } from '../../plugins/mentions/styles';
 import { placeholderTextStyles } from '../../plugins/placeholder-text/styles';
 import { extensionStyles } from '../../plugins/extension/ui/styles';
 import { expandStyles } from '../../plugins/expand/ui/styles';
@@ -29,11 +29,13 @@ import { InlineNodeViewSharedStyles } from '../../nodeviews/getInlineNodeViewPro
 import { linkSharedStyle, codeMarkSharedStyles } from '@atlaskit/editor-common/styles';
 import { browser } from '@atlaskit/editor-common/utils';
 import { EmojiSharedCssClassName } from '@atlaskit/editor-common/emoji';
+import { N500, N30A } from '@atlaskit/theme/colors';
 export var linkStyles = css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  .ProseMirror {\n    ", "\n  }\n"])), linkSharedStyle);
-var listsStyles = css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n  .ProseMirror {\n    li {\n      position: relative;\n\n      > p:not(:first-child) {\n        margin: ", " 0 0 0;\n      }\n\n      // In SSR the above rule will apply to all p tags because first-child would be a style tag.\n      // The following rule resets the first p tag back to its original margin\n      // defined in packages/editor/editor-common/src/styles/shared/paragraph.ts\n      > style:first-child + p {\n        margin-top: ", ";\n      }\n    }\n\n    & :not([data-node-type='decisionList']) > li {\n      ", "\n    }\n  }\n"])), "var(--ds-space-050, 4px)", blockNodesVerticalMargin, browser.safari ? codeBlockInListSafariFix : '');
-var emojiStyles = css(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n  .", " {\n    display: inline-block;\n\n    .", " {\n      cursor: pointer;\n\n      &.", " > span {\n        /** needed for selection style to cover custom emoji image properly */\n        display: flex;\n      }\n    }\n\n    &.", " {\n      .", ",\n        .", " {\n        border-radius: 2px;\n        ", "\n      }\n    }\n  }\n"])), EmojiSharedCssClassName.EMOJI_CONTAINER, EmojiSharedCssClassName.EMOJI_NODE, EmojiSharedCssClassName.EMOJI_IMAGE, akEditorSelectedNodeClassName, EmojiSharedCssClassName.EMOJI_SPRITE, EmojiSharedCssClassName.EMOJI_IMAGE, getSelectionStyles([SelectionStyle.Blanket, SelectionStyle.BoxShadow]));
+var mentionsStyles = css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n  .", " {\n    &.", " [data-mention-id] > span {\n      ", "\n\n      /* need to specify dark text colour because personal mentions\n         (in dark blue) have white text by default */\n      color: ", ";\n    }\n  }\n\n  .danger {\n    .", ".", "\n      > span\n      > span\n      > span {\n      box-shadow: 0 0 0 ", "px ", ";\n      background-color: ", ";\n    }\n    .", " > span > span > span {\n      background-color: ", ";\n      color: ", ";\n    }\n  }\n"])), MentionSharedCssClassName.MENTION_CONTAINER, akEditorSelectedNodeClassName, getSelectionStyles([SelectionStyle.BoxShadow, SelectionStyle.Background]), "var(--ds-text-subtle, ".concat(N500, ")"), MentionSharedCssClassName.MENTION_CONTAINER, akEditorSelectedNodeClassName, akEditorSelectedBorderSize, akEditorDeleteBorder, "var(--ds-background-danger, ".concat(akEditorDeleteBackgroundWithOpacity, ")"), MentionSharedCssClassName.MENTION_CONTAINER, "var(--ds-background-neutral, ".concat(N30A, ")"), "var(--ds-text-subtle, ".concat(N500, ")"));
+var listsStyles = css(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n  .ProseMirror {\n    li {\n      position: relative;\n\n      > p:not(:first-child) {\n        margin: ", " 0 0 0;\n      }\n\n      // In SSR the above rule will apply to all p tags because first-child would be a style tag.\n      // The following rule resets the first p tag back to its original margin\n      // defined in packages/editor/editor-common/src/styles/shared/paragraph.ts\n      > style:first-child + p {\n        margin-top: ", ";\n      }\n    }\n\n    & :not([data-node-type='decisionList']) > li {\n      ", "\n    }\n  }\n"])), "var(--ds-space-050, 4px)", blockNodesVerticalMargin, browser.safari ? codeBlockInListSafariFix : '');
+var emojiStyles = css(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n  .", " {\n    display: inline-block;\n\n    .", " {\n      cursor: pointer;\n\n      &.", " > span {\n        /** needed for selection style to cover custom emoji image properly */\n        display: flex;\n      }\n    }\n\n    &.", " {\n      .", ",\n        .", " {\n        border-radius: 2px;\n        ", "\n      }\n    }\n  }\n"])), EmojiSharedCssClassName.EMOJI_CONTAINER, EmojiSharedCssClassName.EMOJI_NODE, EmojiSharedCssClassName.EMOJI_IMAGE, akEditorSelectedNodeClassName, EmojiSharedCssClassName.EMOJI_SPRITE, EmojiSharedCssClassName.EMOJI_IMAGE, getSelectionStyles([SelectionStyle.Blanket, SelectionStyle.BoxShadow]));
 var contentStyles = function contentStyles(props) {
-  return css(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n  .ProseMirror {\n    outline: none;\n    font-size: ", "px;\n    ", ";\n    ", ";\n    ", ";\n    ", ";\n    ", ";\n    ", ";\n  }\n\n  .ProseMirror[contenteditable='false'] .taskItemView-content-wrap {\n    pointer-events: none;\n    opacity: 0.7;\n  }\n\n  .ProseMirror-hideselection *::selection {\n    background: transparent;\n  }\n\n  .ProseMirror-hideselection *::-moz-selection {\n    background: transparent;\n  }\n\n  .ProseMirror-selectednode {\n    outline: none;\n  }\n\n  .ProseMirror-selectednode:empty {\n    outline: 2px solid ", ";\n  }\n\n  ", "\n  ", "\n  ", "\n\n  ", "\n  ", "\n  ", "\n  ", "\n  ", "\n  ", "\n  ", "\n  ", "\n  ", ";\n  ", "\n  ", "\n  ", "\n  ", "\n  ", "\n  ", "\n  ", "\n  ", "\n  ", "\n  ", "\n  ", "\n  ", "\n  ", "\n  ", "\n  ", "\n  ", "\n  ", "\n  ", "\n  ", "\n  ", "\n  ", "\n  ", "\n\n  .panelView-content-wrap {\n    box-sizing: border-box;\n  }\n\n  .mediaGroupView-content-wrap ul {\n    padding: 0;\n  }\n\n  /** Needed to override any cleared floats, e.g. image wrapping */\n\n  div.fabric-editor-block-mark[class^='fabric-editor-align'] {\n    clear: none !important;\n  }\n\n  .fabric-editor-align-end {\n    text-align: right;\n  }\n\n  .fabric-editor-align-start {\n    text-align: left;\n  }\n\n  .fabric-editor-align-center {\n    text-align: center;\n  }\n\n  .pm-table-header-content-wrap :not(.fabric-editor-alignment),\n  .pm-table-header-content-wrap\n    :not(p, .fabric-editor-block-mark)\n    + div.fabric-editor-block-mark,\n  .pm-table-cell-content-wrap\n    :not(p, .fabric-editor-block-mark)\n    + div.fabric-editor-block-mark {\n    p:first-of-type {\n      margin-top: 0;\n    }\n  }\n\n  .hyperlink-floating-toolbar,\n  .", " {\n    padding: 0;\n  }\n\n  /* Link icon in the Atlaskit package\n     is bigger than the others\n  */\n  .hyperlink-open-link {\n    svg {\n      max-width: 18px;\n    }\n    &[href] {\n      padding: 0 4px;\n    }\n  }\n"])), editorFontSize({
+  return css(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral(["\n  .ProseMirror {\n    outline: none;\n    font-size: ", "px;\n    ", ";\n    ", ";\n    ", ";\n    ", ";\n    ", ";\n    ", ";\n  }\n\n  .ProseMirror[contenteditable='false'] .taskItemView-content-wrap {\n    pointer-events: none;\n    opacity: 0.7;\n  }\n\n  .ProseMirror-hideselection *::selection {\n    background: transparent;\n  }\n\n  .ProseMirror-hideselection *::-moz-selection {\n    background: transparent;\n  }\n\n  .ProseMirror-selectednode {\n    outline: none;\n  }\n\n  .ProseMirror-selectednode:empty {\n    outline: 2px solid ", ";\n  }\n\n  ", "\n  ", "\n  ", "\n\n  ", "\n  ", "\n  ", "\n  ", "\n  ", "\n  ", "\n  ", "\n  ", "\n  ", ";\n  ", "\n  ", "\n  ", "\n  ", "\n  ", "\n  ", "\n  ", "\n  ", "\n  ", "\n  ", "\n  ", "\n  ", "\n  ", "\n  ", "\n  ", "\n  ", "\n  ", "\n  ", "\n  ", "\n  ", "\n  ", "\n  ", "\n\n  .panelView-content-wrap {\n    box-sizing: border-box;\n  }\n\n  .mediaGroupView-content-wrap ul {\n    padding: 0;\n  }\n\n  /** Needed to override any cleared floats, e.g. image wrapping */\n\n  div.fabric-editor-block-mark[class^='fabric-editor-align'] {\n    clear: none !important;\n  }\n\n  .fabric-editor-align-end {\n    text-align: right;\n  }\n\n  .fabric-editor-align-start {\n    text-align: left;\n  }\n\n  .fabric-editor-align-center {\n    text-align: center;\n  }\n\n  .pm-table-header-content-wrap :not(.fabric-editor-alignment),\n  .pm-table-header-content-wrap\n    :not(p, .fabric-editor-block-mark)\n    + div.fabric-editor-block-mark,\n  .pm-table-cell-content-wrap\n    :not(p, .fabric-editor-block-mark)\n    + div.fabric-editor-block-mark {\n    p:first-of-type {\n      margin-top: 0;\n    }\n  }\n\n  .hyperlink-floating-toolbar,\n  .", " {\n    padding: 0;\n  }\n\n  /* Link icon in the Atlaskit package\n     is bigger than the others\n  */\n  .hyperlink-open-link {\n    svg {\n      max-width: 18px;\n    }\n    &[href] {\n      padding: 0 4px;\n    }\n  }\n"])), editorFontSize({
     theme: props.theme
   }), whitespaceSharedStyles, paragraphSharedStyles, listsSharedStyles, indentationSharedStyles, shadowSharedStyle, InlineNodeViewSharedStyles, "var(--ds-border-focused, #8cf)", placeholderTextStyles, placeholderStyles, codeBlockStyles(props), blocktypeStyles(props), codeMarkSharedStyles(props), textColorStyles, listsStyles, ruleStyles(props), mediaStyles, layoutStyles(props), telepointerStyle, gapCursorStyles, tableStyles(props), panelStyles(props), fakeCursorStyles, mentionsStyles, emojiStyles, tasksAndDecisionsStyles, gridStyles, linkStyles, blockMarksSharedStyles, dateSharedStyle, extensionStyles, expandStyles(props), findReplaceStyles, taskDecisionStyles, statusStyles, annotationSharedStyles(props), smartCardStyles, smartCardSharedStyles, dateStyles, embedCardStyles, unsupportedStyles, resizerStyles, ClassNames.FLOATING_TOOLBAR_COMPONENT);
 };

package/dist/esm/version-wrapper.js

@@ -1,5 +1,5 @@
 export var name = "@atlaskit/editor-core";
-export var version = "187.35.4";
+export var version = "187.36.0";
 export var nextMajorVersion = function nextMajorVersion() {
   return [Number(version.split('.')[0]) + 1, 0, 0].join('.');
 };

package/dist/types/index.d.ts

@@ -19,11 +19,9 @@ export { TeamMentionResource } from '@atlaskit/mention/team-resource';
 export { AnnotationUpdateEmitter } from './plugins/annotation';
 export type { AnnotationProviders, InlineCommentAnnotationProvider, InlineCommentCreateComponentProps, InlineCommentViewComponentProps, AnnotationInfo, AnnotationState, AnnotationTypeProvider, InlineCommentState, UpdateEvent, } from './plugins/annotation';
 export { stateKey as mediaPluginKey } from './plugins/media/pm-plugins/main';
-export { mentionPluginKey } from './plugins/mentions';
 export { textColorPluginKey } from './plugins/text-color';
 export type { TextColorPluginState } from './plugins/text-color';
 export { changeColor } from './plugins/text-color/commands/change-color';
-export { insertHorizontalRule } from './plugins/rule/commands';
 export type { BlockTypeState } from './plugins/block-type/pm-plugins/main';
 /**
  * @private

package/dist/types/plugins/insert-block/types.d.ts

@@ -11,6 +11,7 @@ import type quickInsertPlugin from '../quick-insert';
 import type blockTypePlugin from '../block-type';
 import type codeBlockPlugin from '../code-block';
 import type panelPlugin from '../panel';
+import type { RulePlugin } from '../rule';
 export type InsertBlockPluginDependencies = [
     FeatureFlagsPlugin,
     OptionalPlugin<typeof tablesPlugin>,
@@ -22,6 +23,7 @@ export type InsertBlockPluginDependencies = [
     OptionalPlugin<typeof mentionsPlugin>,
     OptionalPlugin<EmojiPlugin>,
     OptionalPlugin<typeof quickInsertPlugin>,
+    OptionalPlugin<RulePlugin>,
     OptionalPlugin<typeof codeBlockPlugin>,
     OptionalPlugin<typeof panelPlugin>
 ];

package/dist/types/plugins/rule/commands.d.ts

@@ -1,4 +1,3 @@
-import { FeatureFlags } from '@atlaskit/editor-common/types';
-import { Command } from '../../types';
-import { INPUT_METHOD } from '../analytics';
-export declare const insertHorizontalRule: (inputMethod: INPUT_METHOD.QUICK_INSERT | INPUT_METHOD.TOOLBAR | INPUT_METHOD.INSERT_MENU | INPUT_METHOD.FORMATTING | INPUT_METHOD.SHORTCUT, featureFlags: FeatureFlags) => Command;
+import type { FeatureFlags, Command } from '@atlaskit/editor-common/types';
+import type { INPUT_METHOD, EditorAnalyticsAPI } from '@atlaskit/editor-common/analytics';
+export declare const insertHorizontalRule: (featureFlags: FeatureFlags, editorAnalyticsAPI: EditorAnalyticsAPI | undefined) => (inputMethod: INPUT_METHOD.QUICK_INSERT | INPUT_METHOD.TOOLBAR | INPUT_METHOD.INSERT_MENU | INPUT_METHOD.FORMATTING | INPUT_METHOD.SHORTCUT) => Command;

package/dist/types/plugins/rule/index.d.ts

@@ -1,7 +1,13 @@
-import type { NextEditorPlugin } from '@atlaskit/editor-common/types';
+import type { NextEditorPlugin, OptionalPlugin } from '@atlaskit/editor-common/types';
+import { insertHorizontalRule } from './commands';
 import type { FeatureFlagsPlugin } from '@atlaskit/editor-plugin-feature-flags';
-declare const rulePlugin: NextEditorPlugin<'rule', {
+import type { AnalyticsPlugin } from '@atlaskit/editor-plugin-analytics';
+export type RulePlugin = NextEditorPlugin<'rule', {
     pluginConfiguration: undefined;
-    dependencies: [FeatureFlagsPlugin];
+    dependencies: [FeatureFlagsPlugin, OptionalPlugin<AnalyticsPlugin>];
+    actions: {
+        insertHorizontalRule: ReturnType<typeof insertHorizontalRule>;
+    };
 }>;
+declare const rulePlugin: RulePlugin;
 export default rulePlugin;

package/dist/types/plugins/rule/pm-plugins/input-rule.d.ts

@@ -1,8 +1,9 @@
 import type { Schema } from '@atlaskit/editor-prosemirror/model';
 import type { SafePlugin } from '@atlaskit/editor-common/safe-plugin';
 import type { EditorState, Transaction } from '@atlaskit/editor-prosemirror/state';
-import type { FeatureFlags } from '../../../types/feature-flags';
-import { INPUT_METHOD } from '../../analytics';
-export declare const createHorizontalRule: (state: EditorState, featureFlags: FeatureFlags, start: number, end: number, inputMethod: INPUT_METHOD.QUICK_INSERT | INPUT_METHOD.TOOLBAR | INPUT_METHOD.INSERT_MENU | INPUT_METHOD.FORMATTING | INPUT_METHOD.SHORTCUT) => Transaction | null;
-export declare function inputRulePlugin(schema: Schema, featureFlags: FeatureFlags): SafePlugin | undefined;
+import type { FeatureFlags } from '@atlaskit/editor-common/types';
+import type { EditorAnalyticsAPI } from '@atlaskit/editor-common/analytics';
+import { INPUT_METHOD } from '@atlaskit/editor-common/analytics';
+export declare const createHorizontalRule: (state: EditorState, featureFlags: FeatureFlags, start: number, end: number, inputMethod: INPUT_METHOD.QUICK_INSERT | INPUT_METHOD.TOOLBAR | INPUT_METHOD.INSERT_MENU | INPUT_METHOD.FORMATTING | INPUT_METHOD.SHORTCUT, editorAnalyticsAPI: EditorAnalyticsAPI | undefined) => Transaction | null;
+export declare function inputRulePlugin(schema: Schema, featureFlags: FeatureFlags, editorAnalyticsAPI: EditorAnalyticsAPI | undefined): SafePlugin | undefined;
 export default inputRulePlugin;

package/dist/types/plugins/rule/pm-plugins/keymap.d.ts

@@ -1,4 +1,5 @@
 import type { SafePlugin } from '@atlaskit/editor-common/safe-plugin';
+import type { EditorAnalyticsAPI } from '@atlaskit/editor-common/analytics';
 import type { FeatureFlags } from '@atlaskit/editor-common/types';
-export declare function keymapPlugin(featureFlags: FeatureFlags): SafePlugin;
+export declare function keymapPlugin(featureFlags: FeatureFlags, editorAnalyticsAPI: EditorAnalyticsAPI | undefined): SafePlugin;
 export default keymapPlugin;

package/dist/types-ts4.5/index.d.ts

@@ -19,11 +19,9 @@ export { TeamMentionResource } from '@atlaskit/mention/team-resource';
 export { AnnotationUpdateEmitter } from './plugins/annotation';
 export type { AnnotationProviders, InlineCommentAnnotationProvider, InlineCommentCreateComponentProps, InlineCommentViewComponentProps, AnnotationInfo, AnnotationState, AnnotationTypeProvider, InlineCommentState, UpdateEvent, } from './plugins/annotation';
 export { stateKey as mediaPluginKey } from './plugins/media/pm-plugins/main';
-export { mentionPluginKey } from './plugins/mentions';
 export { textColorPluginKey } from './plugins/text-color';
 export type { TextColorPluginState } from './plugins/text-color';
 export { changeColor } from './plugins/text-color/commands/change-color';
-export { insertHorizontalRule } from './plugins/rule/commands';
 export type { BlockTypeState } from './plugins/block-type/pm-plugins/main';
 /**
  * @private

package/dist/types-ts4.5/plugins/insert-block/types.d.ts

@@ -11,6 +11,7 @@ import type quickInsertPlugin from '../quick-insert';
 import type blockTypePlugin from '../block-type';
 import type codeBlockPlugin from '../code-block';
 import type panelPlugin from '../panel';
+import type { RulePlugin } from '../rule';
 export type InsertBlockPluginDependencies = [
     FeatureFlagsPlugin,
     OptionalPlugin<typeof tablesPlugin>,
@@ -22,6 +23,7 @@ export type InsertBlockPluginDependencies = [
     OptionalPlugin<typeof mentionsPlugin>,
     OptionalPlugin<EmojiPlugin>,
     OptionalPlugin<typeof quickInsertPlugin>,
+    OptionalPlugin<RulePlugin>,
     OptionalPlugin<typeof codeBlockPlugin>,
     OptionalPlugin<typeof panelPlugin>
 ];

package/dist/types-ts4.5/plugins/rule/commands.d.ts

@@ -1,4 +1,3 @@
-import { FeatureFlags } from '@atlaskit/editor-common/types';
-import { Command } from '../../types';
-import { INPUT_METHOD } from '../analytics';
-export declare const insertHorizontalRule: (inputMethod: INPUT_METHOD.QUICK_INSERT | INPUT_METHOD.TOOLBAR | INPUT_METHOD.INSERT_MENU | INPUT_METHOD.FORMATTING | INPUT_METHOD.SHORTCUT, featureFlags: FeatureFlags) => Command;
+import type { FeatureFlags, Command } from '@atlaskit/editor-common/types';
+import type { INPUT_METHOD, EditorAnalyticsAPI } from '@atlaskit/editor-common/analytics';
+export declare const insertHorizontalRule: (featureFlags: FeatureFlags, editorAnalyticsAPI: EditorAnalyticsAPI | undefined) => (inputMethod: INPUT_METHOD.QUICK_INSERT | INPUT_METHOD.TOOLBAR | INPUT_METHOD.INSERT_MENU | INPUT_METHOD.FORMATTING | INPUT_METHOD.SHORTCUT) => Command;

package/dist/types-ts4.5/plugins/rule/index.d.ts

@@ -1,9 +1,16 @@
-import type { NextEditorPlugin } from '@atlaskit/editor-common/types';
+import type { NextEditorPlugin, OptionalPlugin } from '@atlaskit/editor-common/types';
+import { insertHorizontalRule } from './commands';
 import type { FeatureFlagsPlugin } from '@atlaskit/editor-plugin-feature-flags';
-declare const rulePlugin: NextEditorPlugin<'rule', {
+import type { AnalyticsPlugin } from '@atlaskit/editor-plugin-analytics';
+export type RulePlugin = NextEditorPlugin<'rule', {
     pluginConfiguration: undefined;
     dependencies: [
-        FeatureFlagsPlugin
+        FeatureFlagsPlugin,
+        OptionalPlugin<AnalyticsPlugin>
     ];
+    actions: {
+        insertHorizontalRule: ReturnType<typeof insertHorizontalRule>;
+    };
 }>;
+declare const rulePlugin: RulePlugin;
 export default rulePlugin;

package/dist/types-ts4.5/plugins/rule/pm-plugins/input-rule.d.ts

@@ -1,8 +1,9 @@
 import type { Schema } from '@atlaskit/editor-prosemirror/model';
 import type { SafePlugin } from '@atlaskit/editor-common/safe-plugin';
 import type { EditorState, Transaction } from '@atlaskit/editor-prosemirror/state';
-import type { FeatureFlags } from '../../../types/feature-flags';
-import { INPUT_METHOD } from '../../analytics';
-export declare const createHorizontalRule: (state: EditorState, featureFlags: FeatureFlags, start: number, end: number, inputMethod: INPUT_METHOD.QUICK_INSERT | INPUT_METHOD.TOOLBAR | INPUT_METHOD.INSERT_MENU | INPUT_METHOD.FORMATTING | INPUT_METHOD.SHORTCUT) => Transaction | null;
-export declare function inputRulePlugin(schema: Schema, featureFlags: FeatureFlags): SafePlugin | undefined;
+import type { FeatureFlags } from '@atlaskit/editor-common/types';
+import type { EditorAnalyticsAPI } from '@atlaskit/editor-common/analytics';
+import { INPUT_METHOD } from '@atlaskit/editor-common/analytics';
+export declare const createHorizontalRule: (state: EditorState, featureFlags: FeatureFlags, start: number, end: number, inputMethod: INPUT_METHOD.QUICK_INSERT | INPUT_METHOD.TOOLBAR | INPUT_METHOD.INSERT_MENU | INPUT_METHOD.FORMATTING | INPUT_METHOD.SHORTCUT, editorAnalyticsAPI: EditorAnalyticsAPI | undefined) => Transaction | null;
+export declare function inputRulePlugin(schema: Schema, featureFlags: FeatureFlags, editorAnalyticsAPI: EditorAnalyticsAPI | undefined): SafePlugin | undefined;
 export default inputRulePlugin;

package/dist/types-ts4.5/plugins/rule/pm-plugins/keymap.d.ts

@@ -1,4 +1,5 @@
 import type { SafePlugin } from '@atlaskit/editor-common/safe-plugin';
+import type { EditorAnalyticsAPI } from '@atlaskit/editor-common/analytics';
 import type { FeatureFlags } from '@atlaskit/editor-common/types';
-export declare function keymapPlugin(featureFlags: FeatureFlags): SafePlugin;
+export declare function keymapPlugin(featureFlags: FeatureFlags, editorAnalyticsAPI: EditorAnalyticsAPI | undefined): SafePlugin;
 export default keymapPlugin;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@atlaskit/editor-core",
-  "version": "187.35.4",
+  "version": "187.36.0",
   "description": "A package contains Atlassian editor core functionality",
   "publishConfig": {
     "registry": "https://registry.npmjs.org/"
@@ -113,7 +113,7 @@
     "@atlaskit/task-decision": "^17.7.0",
     "@atlaskit/textarea": "^4.7.0",
     "@atlaskit/textfield": "^5.6.0",
-    "@atlaskit/theme": "^12.5.0",
+    "@atlaskit/theme": "^12.6.0",
     "@atlaskit/toggle": "^12.6.0",
     "@atlaskit/tokens": "^1.18.0",
     "@atlaskit/tooltip": "^17.8.0",

package/report.api.md

@@ -1144,17 +1144,6 @@ export const insertDate: (
 // @public (undocumented)
 export const insertExpand: Command;
 
-// @public (undocumented)
-export const insertHorizontalRule: (
-  inputMethod:
-    | INPUT_METHOD.FORMATTING
-    | INPUT_METHOD.INSERT_MENU
-    | INPUT_METHOD.QUICK_INSERT
-    | INPUT_METHOD.SHORTCUT
-    | INPUT_METHOD.TOOLBAR,
-  featureFlags: EditorFeatureFlags,
-) => Command;
-
 // @public (undocumented)
 type InsertItemProps = {
   contentItem: TypeAheadItem;
@@ -1526,9 +1515,6 @@ interface MentionPluginConfig {
   insertDisplayName?: boolean;
 }
 
-// @public (undocumented)
-export const mentionPluginKey: PluginKey<MentionPluginState>;
-
 // @public (undocumented)
 export type MentionPluginState = {
   mentionProvider?: MentionProvider_2;

package/tmp/api-report-tmp.d.ts

@@ -1045,9 +1045,6 @@ export const insertDate: (date?: DateType, inputMethod?: InsertBlockInputMethodT
 // @public (undocumented)
 export const insertExpand: Command;
 
-// @public (undocumented)
-export const insertHorizontalRule: (inputMethod: INPUT_METHOD.FORMATTING | INPUT_METHOD.INSERT_MENU | INPUT_METHOD.QUICK_INSERT | INPUT_METHOD.SHORTCUT | INPUT_METHOD.TOOLBAR, featureFlags: EditorFeatureFlags) => Command;
-
 // @public (undocumented)
 type InsertItemProps = {
     contentItem: TypeAheadItem;
@@ -1362,9 +1359,6 @@ interface MentionPluginConfig {
     insertDisplayName?: boolean;
 }
 
-// @public (undocumented)
-export const mentionPluginKey: PluginKey<MentionPluginState>;
-
 // @public (undocumented)
 export type MentionPluginState = {
     mentionProvider?: MentionProvider_2;

package/dist/cjs/plugins/mentions/styles.js

@@ -1,15 +0,0 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.mentionsStyles = void 0;
-var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
-var _react = require("@emotion/react");
-var _mention = require("@atlaskit/editor-common/mention");
-var _editorSharedStyles = require("@atlaskit/editor-shared-styles");
-var _colors = require("@atlaskit/theme/colors");
-var _templateObject;
-var mentionsStyles = (0, _react.css)(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  .", " {\n    &.", " [data-mention-id] > span {\n      ", "\n\n      /* need to specify dark text colour because personal mentions\n         (in dark blue) have white text by default */\n      color: ", ";\n    }\n  }\n\n  .danger {\n    .", ".", "\n      > span\n      > span\n      > span {\n      box-shadow: 0 0 0 ", "px ", ";\n      background-color: ", ";\n    }\n    .", " > span > span > span {\n      background-color: ", ";\n      color: ", ";\n    }\n  }\n"])), _mention.MentionSharedCssClassName.MENTION_CONTAINER, _editorSharedStyles.akEditorSelectedNodeClassName, (0, _editorSharedStyles.getSelectionStyles)([_editorSharedStyles.SelectionStyle.BoxShadow, _editorSharedStyles.SelectionStyle.Background]), "var(--ds-text-subtle, ".concat(_colors.N500, ")"), _mention.MentionSharedCssClassName.MENTION_CONTAINER, _editorSharedStyles.akEditorSelectedNodeClassName, _editorSharedStyles.akEditorSelectedBorderSize, _editorSharedStyles.akEditorDeleteBorder, "var(--ds-background-danger, ".concat(_editorSharedStyles.akEditorDeleteBackgroundWithOpacity, ")"), _mention.MentionSharedCssClassName.MENTION_CONTAINER, "var(--ds-background-neutral, ".concat(_colors.N30A, ")"), "var(--ds-text-subtle, ".concat(_colors.N500, ")"));
-exports.mentionsStyles = mentionsStyles;

package/dist/es2019/plugins/mentions/styles.js

@@ -1,29 +0,0 @@
-import { css } from '@emotion/react';
-import { MentionSharedCssClassName } from '@atlaskit/editor-common/mention';
-import { SelectionStyle, getSelectionStyles, akEditorSelectedBorderSize, akEditorDeleteBorder, akEditorDeleteBackgroundWithOpacity, akEditorSelectedNodeClassName } from '@atlaskit/editor-shared-styles';
-import { N500, N30A } from '@atlaskit/theme/colors';
-export const mentionsStyles = css`
-  .${MentionSharedCssClassName.MENTION_CONTAINER} {
-    &.${akEditorSelectedNodeClassName} [data-mention-id] > span {
-      ${getSelectionStyles([SelectionStyle.BoxShadow, SelectionStyle.Background])}
-
-      /* need to specify dark text colour because personal mentions
-         (in dark blue) have white text by default */
-      color: ${`var(--ds-text-subtle, ${N500})`};
-    }
-  }
-
-  .danger {
-    .${MentionSharedCssClassName.MENTION_CONTAINER}.${akEditorSelectedNodeClassName}
-      > span
-      > span
-      > span {
-      box-shadow: 0 0 0 ${akEditorSelectedBorderSize}px ${akEditorDeleteBorder};
-      background-color: ${`var(--ds-background-danger, ${akEditorDeleteBackgroundWithOpacity})`};
-    }
-    .${MentionSharedCssClassName.MENTION_CONTAINER} > span > span > span {
-      background-color: ${`var(--ds-background-neutral, ${N30A})`};
-      color: ${`var(--ds-text-subtle, ${N500})`};
-    }
-  }
-`;