@atlaskit/editor-core 148.0.0 → 149.0.3

package/dist/cjs/ui/ElementBrowser/components/ElementList/ElementList.js

@@ -41,7 +41,7 @@ var _analytics = require("../../../../plugins/analytics");
 
 var _fallback = _interopRequireDefault(require("../../../../plugins/quick-insert/assets/fallback"));
 
-var _TypeAheadItemsList = require("../../../../plugins/type-ahead/ui/TypeAheadItemsList");
+var _TypeAheadListItem = require("../../../../plugins/type-ahead/ui/TypeAheadListItem");
 
 var _styles = require("../../../styles");
 
@@ -76,7 +76,10 @@ function ElementList(_ref) {
       focusedItemIndex = _ref.focusedItemIndex,
       setColumnCount = _ref.setColumnCount,
       createAnalyticsEvent = _ref.createAnalyticsEvent,
-      props = (0, _objectWithoutProperties2.default)(_ref, ["items", "mode", "selectedItemIndex", "focusedItemIndex", "setColumnCount", "createAnalyticsEvent"]);
+      emptyStateHandler = _ref.emptyStateHandler,
+      selectedCategory = _ref.selectedCategory,
+      searchTerm = _ref.searchTerm,
+      props = (0, _objectWithoutProperties2.default)(_ref, ["items", "mode", "selectedItemIndex", "focusedItemIndex", "setColumnCount", "createAnalyticsEvent", "emptyStateHandler", "selectedCategory", "searchTerm"]);
 
   var _useContainerWidth = (0, _useContainerWidth2.default)(),
       containerWidth = _useContainerWidth.containerWidth,
@@ -129,7 +132,11 @@ function ElementList(_ref) {
       }, props)));
     };
   }, [items, fullMode, selectedItemIndex, focusedItemIndex, props]);
-  return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(ContainerWidthMonitor, null), !items.length ? /*#__PURE__*/_react.default.createElement(_EmptyState.default, {
+  return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(ContainerWidthMonitor, null), !items.length ? emptyStateHandler ? emptyStateHandler({
+    mode: mode,
+    selectedCategory: selectedCategory,
+    searchTerm: searchTerm
+  }) : /*#__PURE__*/_react.default.createElement(_EmptyState.default, {
     onExternalLinkClick: onExternalLinkClick
   }) : /*#__PURE__*/_react.default.createElement(ElementItemsWrapper, {
     "data-testid": "element-items"
@@ -314,7 +321,7 @@ var ItemTitle = _styledComponents.default.p(_templateObject9 || (_templateObject
 
 var ItemAfter = _styledComponents.default.div(_templateObject10 || (_templateObject10 = (0, _taggedTemplateLiteral2.default)(["\n  flex: 0 0 auto;\n"])));
 
-var StyledItemIcon = (0, _styledComponents.default)(_TypeAheadItemsList.ItemIcon)(_templateObject11 || (_templateObject11 = (0, _taggedTemplateLiteral2.default)(["\n  img {\n    height: 40px;\n    width: 40px;\n    object-fit: cover;\n  }\n"])));
+var StyledItemIcon = (0, _styledComponents.default)(_TypeAheadListItem.ItemIcon)(_templateObject11 || (_templateObject11 = (0, _taggedTemplateLiteral2.default)(["\n  img {\n    height: 40px;\n    width: 40px;\n    object-fit: cover;\n  }\n"])));
 var MemoizedElementListWithAnalytics = /*#__PURE__*/(0, _react.memo)((0, _analyticsNext.withAnalyticsContext)({
   component: 'ElementList'
 })(ElementList));

package/dist/cjs/ui/ElementBrowser/components/StatelessElementBrowser.js

@@ -156,7 +156,8 @@ function MobileBrowser(_ref) {
       onKeyPress = _ref.onKeyPress,
       onKeyDown = _ref.onKeyDown,
       searchTerm = _ref.searchTerm,
-      createAnalyticsEvent = _ref.createAnalyticsEvent;
+      createAnalyticsEvent = _ref.createAnalyticsEvent,
+      emptyStateHandler = _ref.emptyStateHandler;
   return /*#__PURE__*/_react.default.createElement(MobileElementBrowserContainer, {
     onKeyPress: onKeyPress,
     onKeyDown: onKeyDown,
@@ -183,7 +184,10 @@ function MobileBrowser(_ref) {
     focusedItemIndex: focusedItemIndex,
     setFocusedItemIndex: setFocusedItemIndex,
     setColumnCount: setColumnCount,
-    createAnalyticsEvent: createAnalyticsEvent
+    createAnalyticsEvent: createAnalyticsEvent,
+    emptyStateHandler: emptyStateHandler,
+    selectedCategory: selectedCategory,
+    searchTerm: searchTerm
   })));
 }
 
@@ -206,7 +210,8 @@ function DesktopBrowser(_ref2) {
       onKeyPress = _ref2.onKeyPress,
       onKeyDown = _ref2.onKeyDown,
       searchTerm = _ref2.searchTerm,
-      createAnalyticsEvent = _ref2.createAnalyticsEvent;
+      createAnalyticsEvent = _ref2.createAnalyticsEvent,
+      emptyStateHandler = _ref2.emptyStateHandler;
   return /*#__PURE__*/_react.default.createElement(ElementBrowserContainer, {
     "data-testid": "desktop__element-browser"
   }, showCategories && /*#__PURE__*/_react.default.createElement(SideBar, {
@@ -237,7 +242,10 @@ function DesktopBrowser(_ref2) {
     focusedItemIndex: focusedItemIndex,
     setFocusedItemIndex: setFocusedItemIndex,
     setColumnCount: setColumnCount,
-    createAnalyticsEvent: createAnalyticsEvent
+    createAnalyticsEvent: createAnalyticsEvent,
+    emptyStateHandler: emptyStateHandler,
+    selectedCategory: selectedCategory,
+    searchTerm: searchTerm
   })));
 }
 

package/dist/cjs/ui/PanelTextInput/index.js

@@ -178,9 +178,7 @@ var PanelTextInput = /*#__PURE__*/function (_PureComponent) {
   }, {
     key: "isUndoEvent",
     value: function isUndoEvent(event) {
-      return event.keyCode === KeyZCode && ( // cmd + z for mac
-      _editorCommon.browser.mac && event.metaKey && !event.shiftKey || // ctrl + z for non-mac
-      !_editorCommon.browser.mac && event.ctrlKey);
+      return event.keyCode === KeyZCode && (_editorCommon.browser.mac && event.metaKey && !event.shiftKey || !_editorCommon.browser.mac && event.ctrlKey);
     }
   }, {
     key: "isRedoEvent",

package/dist/cjs/utils/compare.js

@@ -49,13 +49,13 @@ var serializeValue = function serializeValue(value) {
   } // Calling toString of function returns whole function text with body.
   // So, just return function with name.
   else if (valueType === 'function') {
-      return "function:".concat(value.name);
-    } else if (valueType === 'object') {
-      return {
-        type: 'object',
-        keys: Object.keys(value)
-      };
-    }
+    return "function:".concat(value.name);
+  } else if (valueType === 'object') {
+    return {
+      type: 'object',
+      keys: Object.keys(value)
+    };
+  }
 };
 
 exports.serializeValue = serializeValue;

package/dist/cjs/utils/index.js

@@ -533,17 +533,16 @@ function liftSelection(tr, doc, $from, $to) {
   var endPos = $to.end($to.depth);
   var target = Math.max(0, findAncestorPosition(doc, $from).depth - 1);
   tr.doc.nodesBetween(startPos, endPos, function (node, pos) {
-    if (node.isText || // Text node
-    node.isTextblock && !node.textContent // Empty paragraph
+    if (node.isText || node.isTextblock && !node.textContent // Empty paragraph
     ) {
-        var res = tr.doc.resolve(tr.mapping.map(pos));
-        var sel = new _prosemirrorState.NodeSelection(res);
-        var range = sel.$from.blockRange(sel.$to);
+      var res = tr.doc.resolve(tr.mapping.map(pos));
+      var sel = new _prosemirrorState.NodeSelection(res);
+      var range = sel.$from.blockRange(sel.$to);
 
-        if ((0, _prosemirrorTransform.liftTarget)(range) !== undefined) {
-          tr.lift(range, target);
-        }
+      if ((0, _prosemirrorTransform.liftTarget)(range) !== undefined) {
+        tr.lift(range, target);
       }
+    }
   });
   startPos = tr.mapping.map(startPos);
   endPos = tr.mapping.map(endPos);

package/dist/cjs/utils/rich-media-utils.js

@@ -55,8 +55,8 @@ var alignAttributes = function alignAttributes(layout, oldAttrs) {
     // 'full-width' or 'wide' or 'center' -> 'wrap-left' or 'wrap-right' or 'align-end' or 'align-start'
     if (!width || width >= 100 || oldLayout !== 'center' // == 'full-width' or 'wide'
     ) {
-        width = 50;
-      }
+      width = 50;
+    }
   } else if (layout !== oldLayout && ['full-width', 'wide'].indexOf(oldLayout) > -1) {
     // 'full-width' -> 'center' or 'wide'
     // 'wide' -> 'center' or 'full-width'

package/dist/cjs/utils/selection.js

@@ -64,8 +64,11 @@ function setCellSelection(view, anchor, head) {
   dispatch(state.tr.setSelection(_cellSelection.CellSelection.create(state.doc, anchor, head)));
 }
 
-var normaliseNestedLayout = function normaliseNestedLayout(state, node) {
-  if (state.selection.$from.depth > 1) {
+var normaliseNestedLayout = function normaliseNestedLayout(_ref, node) {
+  var selection = _ref.selection,
+      doc = _ref.doc;
+
+  if (selection.$from.depth > 1) {
     if (node.attrs.layout && node.attrs.layout !== 'default') {
       return node.type.createChecked(_objectSpread(_objectSpread({}, node.attrs), {}, {
         layout: 'default'
@@ -74,7 +77,7 @@ var normaliseNestedLayout = function normaliseNestedLayout(state, node) {
     // Since default isn't a valid breakout mode.
 
 
-    var breakoutMark = state.schema.marks.breakout;
+    var breakoutMark = doc.type.schema.marks.breakout;
 
     if (breakoutMark && breakoutMark.isInSet(node.marks)) {
       var newMarks = breakoutMark.removeFromSet(node.marks);

package/dist/cjs/version-wrapper.js

@@ -6,7 +6,7 @@ Object.defineProperty(exports, "__esModule", {
 exports.nextMajorVersion = exports.version = exports.name = void 0;
 var name = "@atlaskit/editor-core";
 exports.name = name;
-var version = "148.0.0";
+var version = "149.0.3";
 exports.version = version;
 
 var nextMajorVersion = function nextMajorVersion() {

package/dist/cjs/version.json

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

package/dist/es2019/create-editor/create-plugins-list.js

@@ -44,6 +44,10 @@ export function getDefaultPresetOptionsFromEditorProps(props, createAnalyticsEve
   const inputTracking = (_props$performanceTra = props.performanceTracking) === null || _props$performanceTra === void 0 ? void 0 : _props$performanceTra.inputTracking;
   return {
     createAnalyticsEvent,
+    typeAhead: {
+      createAnalyticsEvent,
+      isMobile
+    },
     featureFlags: createFeatureFlagsFromProps(props),
     paste: {
       cardOptions: props.smartLinks || props.UNSAFE_cards,
@@ -74,7 +78,8 @@ export function getDefaultPresetOptionsFromEditorProps(props, createAnalyticsEve
       enableElementBrowser: props.elementBrowser && props.elementBrowser.showModal,
       elementBrowserHelpUrl: props.elementBrowser && props.elementBrowser.helpUrl,
       disableDefaultItems: isMobile,
-      headless: isMobile
+      headless: isMobile,
+      emptyStateHandler: props.elementBrowser && props.elementBrowser.emptyStateHandler
     },
     selection: {
       useLongPressSelection: false

package/dist/es2019/editor.js

@@ -125,10 +125,7 @@ export default class Editor extends React.Component {
       quickInsert
     } = this.props;
 
-    if (extensionProviders && extensionProviders !== prevProps.extensionProviders || // Though this will introduce some performance regression related to quick insert
-    // loading but we can remove it soon when Forge will move to new API.
-    // quickInsert={Promise.resolve(consumerQuickInsert)} is one of the main reason behind this performance issue.
-    quickInsert && quickInsert !== prevProps.quickInsert) {
+    if (extensionProviders && extensionProviders !== prevProps.extensionProviders || quickInsert && quickInsert !== prevProps.quickInsert) {
       const extensionProvider = this.prepareExtensionProvider(extensionProviders);
       const quickInsertProvider = this.prepareQuickInsertProvider(extensionProvider, quickInsert);
       this.setState({

package/dist/es2019/index.js

@@ -26,6 +26,7 @@ export { InsertStatus as HyperlinkInsertStatus, stateKey as hyperlinkStateKey }
 export { pluginKey as listStateKey } from './plugins/list/pm-plugins/main';
 export { toggleSuperscript, toggleSuperscriptWithAnalytics, toggleSubscript, toggleSubscriptWithAnalytics, toggleStrike, toggleStrikeWithAnalytics, toggleCode, toggleCodeWithAnalytics, toggleUnderline, toggleUnderlineWithAnalytics, toggleEm, toggleEmWithAnalytics, toggleStrong, toggleStrongWithAnalytics } from './plugins/text-formatting/commands/text-formatting';
 export { subscribeToToolbarAndPickerUpdates } from './plugins/view-update-subscription/subscribe/toolbarAndPickerUpdates';
+export { subscribeTypeAheadUpdates } from './plugins/view-update-subscription/subscribe/type-ahead-updates';
 export { insertBlockType, insertBlockTypesWithAnalytics, setBlockType, setBlockTypeWithAnalytics } from './plugins/block-type/commands';
 export { createTable } from './plugins/table/commands';
 export { insertTaskDecision } from './plugins/tasks-and-decisions/commands';
@@ -37,9 +38,6 @@ export { pluginKey as datePluginKey } from './plugins/date/pm-plugins/plugin-key
 export { commitStatusPicker, setStatusPickerAt, updateStatus, updateStatusWithAnalytics, removeStatus } from './plugins/status/actions';
 export { typeAheadPluginKey } from './plugins/type-ahead';
 export { pluginKey as quickInsertPluginKey, memoProcessItems as processQuickInsertItems } from './plugins/quick-insert';
-export { selectItem } from './plugins/type-ahead/commands/select-item';
-export { insertTypeAheadQuery } from './plugins/type-ahead/commands/insert-query';
-export { dismissCommand } from './plugins/type-ahead/commands/dismiss';
 export { insertLink, insertLinkWithAnalyticsMobileNative, insertLinkWithAnalytics, isTextAtPos, isLinkAtPos, updateLink } from './plugins/hyperlink/commands';
 export { historyPluginKey } from './plugins/history';
 export { INPUT_METHOD, ACTION, ACTION_SUBJECT, ACTION_SUBJECT_ID, EVENT_TYPE } from './plugins/analytics';
@@ -53,12 +51,12 @@ export { default as EditorActions } from './actions'; // Re-export from provider
 
 export { PortalProvider, PortalProviderAPI, PortalRenderer } from './ui/PortalProvider';
 export { GapCursorSelection, Side as GapCursorSide } from './plugins/selection/gap-cursor-selection';
-export { insertMentionQuery } from './plugins/mentions/commands/insert-mention-query';
-export { insertEmojiQuery } from './plugins/emoji/commands/insert-emoji-query';
 export { selectionPluginKey } from './plugins/mobile-selection';
 export { insertExpand } from './plugins/expand/commands';
 export { default as WithPluginState } from './ui/WithPluginState';
 export { pluginKey as floatingToolbarPluginKey } from './plugins/floating-toolbar';
 export { lightModeStatusColorPalette, darkModeStatusColorPalette } from './ui/ColorPalette/Palettes/statusColorPalette';
 export { DEFAULT_BORDER_COLOR } from './ui/ColorPalette/Palettes/common';
-export { default as messages, statusMessages, dateMessages } from './messages';
+export { default as messages, statusMessages, dateMessages } from './messages';
+export { createTypeAheadTools } from './plugins/type-ahead/api';
+export { createQuickInsertTools } from './plugins/quick-insert/api';

package/dist/es2019/labs/next/presets/default.js

@@ -22,7 +22,7 @@ import annotationPlugin from '../../../plugins/annotation';
 import quickInsertPlugin from '../../../plugins/quick-insert';
 import selectionPlugin from '../../../plugins/selection';
 import codeBlockPlugin from '../../../plugins/code-block';
-import undoRedoPlugin from '../../../plugins/undo-redo'; // #endregion
+import undoRedoPlugin from '../../../plugins/undo-redo';
 
 /**
  * Note: The order that presets are added determines
@@ -52,7 +52,7 @@ export function createDefaultPreset(options) {
   preset.add([textFormattingPlugin, options.textFormatting]);
   preset.add(widthPlugin);
   preset.add([quickInsertPlugin, options.quickInsert]);
-  preset.add([typeAheadPlugin, {
+  preset.add([typeAheadPlugin, options.typeAhead || {
     createAnalyticsEvent: options.createAnalyticsEvent
   }]);
   preset.add(unsupportedContentPlugin);

package/dist/es2019/messages.js

@@ -89,6 +89,11 @@ export default defineMessages({
     defaultMessage: 'Remove',
     description: 'Delete the element (image, panel, table, etc.) from your document'
   },
+  hideEmoji: {
+    id: 'fabric.editor.hideEmoji',
+    defaultMessage: 'Hide emoji',
+    description: 'Hide the emoji panel icon from custom panel'
+  },
   visit: {
     id: 'fabric.editor.visit',
     defaultMessage: 'Open link in a new window',

package/dist/es2019/nodeviews/SelectionBasedNodeView.js

@@ -64,8 +64,7 @@ export class SelectionBasedNodeView extends ReactNodeView {
             to
           }
         } = this.view.state;
-        return selection.node === this.node || // If nodes are not the same object, we check if they are referring to the same document node
-        this.pos === from && this.posEnd === to && selection.node.eq(this.node);
+        return selection.node === this.node || this.pos === from && this.posEnd === to && selection.node.eq(this.node);
       }
 
       return false;

package/dist/es2019/plugins/analytics/plugin.js

@@ -17,7 +17,11 @@ function createPlugin(options) {
   return new Plugin({
     key: analyticsPluginKey,
     state: {
-      init: () => options,
+      init: () => {
+        return { ...options,
+          fireAnalytics: fireAnalyticsEvent(options.createAnalyticsEvent)
+        };
+      },
       apply: (tr, pluginState, _, state) => {
         var _getFeatureFlags;
 

package/dist/es2019/plugins/analytics/types/enums.js

@@ -13,6 +13,8 @@ export let ACTION;
   ACTION["ACTIVATED"] = "activated";
   ACTION["ADDED"] = "added";
   ACTION["BROWSER_FREEZE"] = "browserFreeze";
+  ACTION["CHANGED_BACKGROUND_COLOR"] = "changedBackgroundColor";
+  ACTION["CHANGED_ICON"] = "changedIcon";
   ACTION["CHANGED_FULL_WIDTH_MODE"] = "changedFullWidthMode";
   ACTION["CHANGED_LAYOUT"] = "changedLayout";
   ACTION["CHANGED_REPLACEMENT_TEXT"] = "changedReplacementText";
@@ -56,6 +58,7 @@ export let ACTION;
   ACTION["INVOKED"] = "invoked";
   ACTION["LANGUAGE_SELECTED"] = "languageSelected";
   ACTION["LIST_ITEM_JOINED"] = "listItemJoined";
+  ACTION["MATCHED"] = "matched";
   ACTION["NODE_CONTENT_SANITIZED"] = "nodeContentSanitized";
   ACTION["OPENED"] = "opened";
   ACTION["OUTDENTED"] = "outdented";
@@ -91,6 +94,7 @@ export let ACTION;
   ACTION["RENDERED"] = "rendered";
   ACTION["ON_EDITOR_READY_CALLBACK"] = "onEditorReadyCallback";
   ACTION["ON_CHANGE_CALLBACK"] = "onChangeCalled";
+  ACTION["REMOVE_ICON"] = "removedIcon";
 })(ACTION || (ACTION = {}));
 
 export let INPUT_METHOD;
@@ -162,6 +166,7 @@ export let ACTION_SUBJECT;
   ACTION_SUBJECT["PLUS_MENU"] = "plusMenu";
   ACTION_SUBJECT["PLUGIN_SLOT"] = "pluginSlot";
   ACTION_SUBJECT["REACT_NODE_VIEW"] = "reactNodeView";
+  ACTION_SUBJECT["SELECTION"] = "selection";
   ACTION_SUBJECT["SMART_LINK"] = "smartLink";
   ACTION_SUBJECT["HYPERLINK"] = "hyperlink";
   ACTION_SUBJECT["TABLE"] = "table";

package/dist/es2019/plugins/analytics/types/type-ahead.js

@@ -0,0 +1 @@
+export {};

package/dist/es2019/plugins/block-type/messages.js

@@ -135,6 +135,16 @@ export const messages = defineMessages({
     defaultMessage: 'Call out errors in a colored panel',
     description: 'Visually distinguishes your text by adding a error panel'
   },
+  customPanel: {
+    id: 'fabric.editor.customPanel',
+    defaultMessage: 'Custom panel',
+    description: 'Visually distinguishes your panel by adding a emoji icon and background color'
+  },
+  customPanelDescription: {
+    id: 'fabric.editor.customPanel.description',
+    defaultMessage: 'Add a note with an emoji and colored background',
+    description: 'Visually distinguishes your panel by adding a emoji icon and background color '
+  },
   other: {
     id: 'fabric.editor.other',
     defaultMessage: 'Others...',

package/dist/es2019/plugins/card/nodeviews/embedCard.js

@@ -205,9 +205,7 @@ export class EmbedCardComponent extends React.PureComponent {
     // since `heightAlone` is defined only when just height is available.
 
     let heightAlone = liveHeight !== null && liveHeight !== void 0 ? liveHeight : !originalWidth && originalHeight || undefined;
-    const aspectRatio = !heightAlone && ( // No need getting aspectRatio if heightAlone defined already
-    initialAspectRatio || // If we have initialAspectRatio (coming from iframely) we should go with that
-    originalHeight && originalWidth && originalWidth / originalHeight) || // If ADF contains both width and height we get ratio from that
+    const aspectRatio = !heightAlone && (initialAspectRatio || originalHeight && originalWidth && originalWidth / originalHeight) || // If ADF contains both width and height we get ratio from that
     undefined;
     const cardProps = {
       layout,

package/dist/es2019/plugins/collab-edit/participants.js

@@ -33,6 +33,20 @@ export class Participants {
     return new Participants(newSet);
   }
 
+  updateCursorPos(sessionId, cursorPos) {
+    const newSet = new Map(this.participants);
+    const data = newSet.get(sessionId);
+
+    if (!data) {
+      return this;
+    }
+
+    newSet.set(sessionId, { ...data,
+      cursorPos
+    });
+    return new Participants(newSet);
+  }
+
   toArray() {
     return Array.from(this.participants.values());
   }

package/dist/es2019/plugins/collab-edit/plugin-state.js

@@ -3,7 +3,7 @@ import { Selection } from 'prosemirror-state';
 import { DecorationSet } from 'prosemirror-view';
 import { ReplaceStep } from 'prosemirror-transform';
 import { Participants } from './participants';
-import { findPointers, createTelepointers } from './utils';
+import { findPointers, createTelepointers, getPositionOfTelepointer } from './utils';
 
 const isReplaceStep = step => step instanceof ReplaceStep;
 
@@ -198,6 +198,22 @@ export class PluginState {
 
     if (add.length) {
       this.decorationSet = this.decorationSet.add(tr.doc, add);
+    } // This piece needs to be after the decorationSet adjustments,
+    // otherwise it's always one step behind where the cursor is
+
+
+    if (telepointerData) {
+      const {
+        sessionId
+      } = telepointerData;
+
+      if (participants.get(sessionId)) {
+        const positionForScroll = getPositionOfTelepointer(sessionId, this.decorationSet);
+
+        if (positionForScroll) {
+          participants = participants.updateCursorPos(sessionId, positionForScroll);
+        }
+      }
     }
 
     const nextState = new PluginState(this.decorationSet, participants, sid, collabInitialised);

package/dist/es2019/plugins/collab-edit/ui/avatars-with-plugin-state.js

@@ -11,7 +11,8 @@ const AvatarsWithPluginState = props => {
   const {
     isInviteToEditButtonSelected: selected,
     inviteToEditHandler: onClick,
-    inviteToEditComponent: Component
+    inviteToEditComponent: Component,
+    editorView
   } = props;
   const render = React.useCallback(({
     data
@@ -22,20 +23,21 @@ const AvatarsWithPluginState = props => {
 
     return /*#__PURE__*/React.createElement(Avatars, {
       sessionId: data.sessionId,
-      participants: data.activeParticipants
+      participants: data.activeParticipants,
+      editorView: editorView
     }, /*#__PURE__*/React.createElement(InviteToEditButton, {
       title: title,
       selected: selected,
       onClick: onClick,
       Component: Component
     }));
-  }, [selected, onClick, Component, title]);
+  }, [selected, onClick, Component, title, editorView]);
   return /*#__PURE__*/React.createElement(WithPluginState, {
     plugins: {
       data: collabEditPluginKey
     },
     render: render,
-    editorView: props.editorView
+    editorView: editorView
   });
 };
 

package/dist/es2019/plugins/collab-edit/ui/avatars.js

@@ -2,9 +2,12 @@ import React from 'react';
 import AvatarGroup from '@atlaskit/avatar-group';
 import { AvatarContainer } from './styles';
 import toAvatar from './to-avatar';
+import { scrollToCollabCursor } from '../utils';
+import { getFeatureFlags } from '../../feature-flags-context';
 export const Avatars = /*#__PURE__*/React.memo(props => {
   const {
-    sessionId
+    sessionId,
+    editorView
   } = props;
   const participants = props.participants.toArray();
   const avatars = participants.sort(p => p.sessionId === sessionId ? -1 : 1).map(toAvatar);
@@ -17,6 +20,18 @@ export const Avatars = /*#__PURE__*/React.memo(props => {
     appearance: "stack",
     size: "medium",
     data: avatars,
-    maxCount: 3
+    maxCount: 3,
+    onAvatarClick: (_event, _analytics, index) => {
+      if (!editorView) {
+        return;
+      }
+
+      const featureFlags = getFeatureFlags(editorView.state);
+      const allowCollabAvatarScroll = featureFlags === null || featureFlags === void 0 ? void 0 : featureFlags.collabAvatarScroll; // user does not need to scroll to their own position (index 0)
+
+      if (allowCollabAvatarScroll && index > 0) {
+        scrollToCollabCursor(editorView, participants, props.sessionId, index);
+      }
+    }
   }), props.children);
 });

package/dist/es2019/plugins/collab-edit/utils.js

@@ -3,6 +3,8 @@ import { Decoration } from 'prosemirror-view';
 import * as themeColors from '@atlaskit/theme/colors';
 import { hexToRgba } from '@atlaskit/adf-schema';
 import { ZERO_WIDTH_SPACE } from '@atlaskit/editor-common';
+import { addAnalytics } from '../analytics/utils';
+import { EVENT_TYPE, ACTION, ACTION_SUBJECT } from '../analytics/types';
 export const colors = [themeColors.R100, themeColors.R300, themeColors.R500, themeColors.Y100, themeColors.Y300, themeColors.Y500, themeColors.G100, themeColors.G300, themeColors.G500, themeColors.T100, themeColors.T300, themeColors.T500, themeColors.B100, themeColors.B300, themeColors.B500, themeColors.P100, themeColors.P300, themeColors.P500, themeColors.N70, themeColors.N200, themeColors.N800].map(solid => ({
   solid,
   selection: hexToRgba(solid, 0.2)
@@ -99,4 +101,36 @@ export const replaceDocument = (doc, state, version, options, reserveCursor) =>
   }
 
   return tr;
+};
+export const scrollToCollabCursor = (editorView, participants, sessionId, index) => {
+  const selectedUser = participants[index];
+
+  if (selectedUser && selectedUser.cursorPos !== undefined && selectedUser.sessionId !== sessionId) {
+    const {
+      state
+    } = editorView;
+    let tr = state.tr;
+    const analyticsPayload = {
+      action: ACTION.MATCHED,
+      actionSubject: ACTION_SUBJECT.SELECTION,
+      eventType: EVENT_TYPE.TRACK
+    };
+    tr.setSelection(Selection.near(tr.doc.resolve(selectedUser.cursorPos)));
+    tr = addAnalytics(state, tr, analyticsPayload);
+    tr.scrollIntoView();
+    editorView.dispatch(tr);
+
+    if (!editorView.hasFocus()) {
+      editorView.focus();
+    }
+  }
+};
+export const getPositionOfTelepointer = (sessionId, decorationSet) => {
+  let scrollPosition;
+  decorationSet.find().forEach(deco => {
+    if (deco.type.spec.pointer.sessionId === sessionId) {
+      scrollPosition = deco.from;
+    }
+  });
+  return scrollPosition;
 };

package/dist/es2019/plugins/date/actions.js

@@ -5,14 +5,16 @@ import { pluginKey } from './pm-plugins/plugin-key';
 import { withAnalytics, addAnalytics, ACTION, ACTION_SUBJECT, ACTION_SUBJECT_ID, EVENT_TYPE, INPUT_METHOD } from '../analytics';
 import { isToday } from './utils/internal';
 import { canInsert } from 'prosemirror-utils';
-export const createDate = () => (insert, state) => {
+export const createDate = isQuickInsertAction => (insert, state) => {
   const dateNode = state.schema.nodes.date.createChecked({
     timestamp: todayTimestampInUTC()
   });
-  const tr = insert(dateNode, {
+  const space = state.schema.text(' ');
+  const tr = insert(Fragment.from([dateNode, space]), {
     selectInlineNode: true
   });
   const newPluginState = {
+    isQuickInsertAction,
     showDatePickerAt: tr.selection.from,
     isNew: true,
     isDateEmpty: false,

package/dist/es2019/plugins/date/index.js

@@ -137,7 +137,7 @@ const datePlugin = () => ({
       icon: () => /*#__PURE__*/React.createElement(IconDate, null),
 
       action(insert, state) {
-        const tr = createDate()(insert, state);
+        const tr = createDate(true)(insert, state);
         addAnalytics(state, tr, {
           action: ACTION.INSERTED,
           actionSubject: ACTION_SUBJECT.DOCUMENT,

package/dist/es2019/plugins/date/pm-plugins/utils.js

@@ -42,7 +42,12 @@ export function mapping(tr, pluginState) {
   };
 }
 export function onSelectionChanged(tr, pluginState) {
-  if (!isDateNodeSelection(tr.selection)) {
+  if (tr.docChanged && isDateNodeSelection(tr.selection)) {
+    return { ...pluginState,
+      isQuickInsertAction: false,
+      showDatePickerAt: tr.selection.from
+    };
+  } else if (!isDateNodeSelection(tr.selection) && !pluginState.isQuickInsertAction) {
     if (pluginState.showDatePickerAt) {
       return {
         showDatePickerAt: null,