@atlaskit/editor-core 190.2.2 → 191.0.0

package/dist/esm/create-editor/ReactEditorView.js

@@ -26,13 +26,12 @@ import { ACTION, ACTION_SUBJECT, EVENT_TYPE, fireAnalyticsEvent, FULL_WIDTH_MODE
 import { createFeatureFlagsFromProps } from './feature-flags-from-props';
 import { getEnabledFeatureFlagKeys } from '@atlaskit/editor-common/normalize-feature-flags';
 import { createErrorReporter, createPMPlugins, processPluginsList } from './create-editor';
-import { getDocStructure } from '../utils/document-logger';
+import { getDocStructure } from '@atlaskit/editor-common/core-utils';
 import { isFullPage } from '../utils/is-full-page';
 import measurements from '../utils/performance/measure-enum';
 import { getNodesCount } from '../utils/document';
 import { createSchema } from './create-schema';
 import { PluginPerformanceObserver } from '../utils/performance/plugin-performance-observer';
-import { getParticipantsCount } from '../plugins/collab-edit/get-participants-count';
 import { EVENT_NAME_DISPATCH_TRANSACTION, EVENT_NAME_STATE_APPLY, EVENT_NAME_UPDATE_STATE, EVENT_NAME_VIEW_STATE_UPDATED, EVENT_NAME_ON_CHANGE, TransactionTracker } from '../utils/performance/track-transactions';
 import { countNodes as _countNodes } from '@atlaskit/editor-common/utils';
 import createPluginsList from './create-plugins-list';
@@ -89,14 +88,15 @@ export var ReactEditorView = /*#__PURE__*/function (_React$Component) {
     // ProseMirror is instantiated prior to the initial React render cycle,
     // so we allow transactions by default, to avoid discarding the initial one.
     _defineProperty(_assertThisInitialized(_this), "canDispatchTransactions", true);
-    _defineProperty(_assertThisInitialized(_this), "onPluginObservation", function (report, editorState) {
+    _defineProperty(_assertThisInitialized(_this), "onPluginObservation", function (report) {
+      var _this$pluginInjection;
       _this.dispatchAnalyticsEvent({
         action: ACTION.TRANSACTION_DISPATCHED,
         actionSubject: ACTION_SUBJECT.EDITOR,
         eventType: EVENT_TYPE.OPERATIONAL,
         attributes: {
           report: report,
-          participants: getParticipantsCount(editorState)
+          participants: ((_this$pluginInjection = _this.pluginInjectionAPI.api().collabEdit) === null || _this$pluginInjection === void 0 ? void 0 : _this$pluginInjection.sharedState.currentState().participants.size()) || 1
         }
       });
     });
@@ -395,10 +395,10 @@ export var ReactEditorView = /*#__PURE__*/function (_React$Component) {
         var forceSeverityTracking = typeof proseMirrorRenderedTracking === 'undefined' && shouldForceTracking();
         _this.proseMirrorRenderedSeverity = !!forceSeverityTracking || proseMirrorRenderedTracking !== null && proseMirrorRenderedTracking !== void 0 && proseMirrorRenderedTracking.trackSeverity ? getAnalyticsEventSeverity(duration, (_proseMirrorRenderedT = proseMirrorRenderedTracking === null || proseMirrorRenderedTracking === void 0 ? void 0 : proseMirrorRenderedTracking.severityNormalThreshold) !== null && _proseMirrorRenderedT !== void 0 ? _proseMirrorRenderedT : PROSEMIRROR_RENDERED_NORMAL_SEVERITY_THRESHOLD, (_proseMirrorRenderedT2 = proseMirrorRenderedTracking === null || proseMirrorRenderedTracking === void 0 ? void 0 : proseMirrorRenderedTracking.severityDegradedThreshold) !== null && _proseMirrorRenderedT2 !== void 0 ? _proseMirrorRenderedT2 : PROSEMIRROR_RENDERED_DEGRADED_SEVERITY_THRESHOLD) : undefined;
         if (_this.view) {
-          var _this$pluginInjection, _this$experienceStore10;
+          var _this$pluginInjection2, _this$experienceStore10;
           var nodes = getNodesCount(_this.view.state.doc);
           var ttfb = getResponseEndTime();
-          var contextIdentifier = (_this$pluginInjection = _this.pluginInjectionAPI.api().base) === null || _this$pluginInjection === void 0 ? void 0 : _this$pluginInjection.sharedState.currentState();
+          var contextIdentifier = (_this$pluginInjection2 = _this.pluginInjectionAPI.api().base) === null || _this$pluginInjection2 === void 0 ? void 0 : _this$pluginInjection2.sharedState.currentState();
           _this.dispatchAnalyticsEvent({
             action: ACTION.PROSEMIRROR_RENDERED,
             actionSubject: ACTION_SUBJECT.EDITOR,
@@ -541,7 +541,7 @@ export var ReactEditorView = /*#__PURE__*/function (_React$Component) {
     _this.errorReporter = createErrorReporter(props.editorProps.errorReporterHandler);
     _this.transactionTracker = new TransactionTracker();
     _this.pluginPerformanceObserver = new PluginPerformanceObserver(function (report) {
-      return _this.onPluginObservation(report, _this.editorState);
+      return _this.onPluginObservation(report);
     }).withPlugins(function () {
       return _this.getPluginNames();
     }).withNodeCounts(function () {

package/dist/esm/plugins/avatar-group/index.js

@@ -24,7 +24,8 @@ var avatarGroup = function avatarGroup(_ref) {
         collabEdit: props === null || props === void 0 ? void 0 : props.collabEdit,
         takeFullWidth: props === null || props === void 0 ? void 0 : props.takeFullWidth,
         featureFlags: featureFlags,
-        editorAnalyticsAPI: api === null || api === void 0 || (_api$analytics = api.analytics) === null || _api$analytics === void 0 ? void 0 : _api$analytics.actions
+        editorAnalyticsAPI: api === null || api === void 0 || (_api$analytics = api.analytics) === null || _api$analytics === void 0 ? void 0 : _api$analytics.actions,
+        editorAPI: api
       });
     }
   };

package/dist/esm/plugins/avatar-group/ui/AvatarGroupPluginWrapper.js

@@ -3,7 +3,7 @@ var _templateObject, _templateObject2;
 /** @jsx jsx */
 import { useEffect } from 'react';
 import { css, jsx } from '@emotion/react';
-import AvatarsWithPluginState from '../../collab-edit/ui/avatars-with-plugin-state';
+import AvatarsWithPluginState from './avatars-with-plugin-state';
 import { useIntl } from 'react-intl-next';
 import { avatarGroupMessages } from '../messages';
 import { ACTION, ACTION_SUBJECT, EVENT_TYPE, ACTION_SUBJECT_ID } from '@atlaskit/editor-common/analytics';
@@ -35,7 +35,8 @@ var AvatarGroupPluginWrapper = function AvatarGroupPluginWrapper(props) {
     inviteToEditHandler: props.collabEdit && props.collabEdit.inviteToEditHandler,
     isInviteToEditButtonSelected: props.collabEdit && props.collabEdit.isInviteToEditButtonSelected,
     featureFlags: featureFlags,
-    editorAnalyticsAPI: props.editorAnalyticsAPI
+    editorAnalyticsAPI: props.editorAnalyticsAPI,
+    editorAPI: props.editorAPI
   }));
 };
 export default AvatarGroupPluginWrapper;

package/dist/esm/plugins/{collab-edit → avatar-group}/ui/avatars-with-plugin-state.js

@@ -1,10 +1,9 @@
 import React from 'react';
 import { injectIntl } from 'react-intl-next';
-import WithPluginState from '../../../ui/WithPluginState';
-import { pluginKey as collabEditPluginKey } from '../plugin';
 import messages from '../../../messages';
 import { Avatars } from './avatars';
 import { InviteToEditButton } from './invite-to-edit';
+import { useSharedPluginState } from '@atlaskit/editor-common/hooks';
 var AvatarsWithPluginState = function AvatarsWithPluginState(props) {
   var title = props.intl.formatMessage(messages.inviteToEditButtonTitle);
   var selected = props.isInviteToEditButtonSelected,
@@ -12,7 +11,8 @@ var AvatarsWithPluginState = function AvatarsWithPluginState(props) {
     Component = props.inviteToEditComponent,
     editorView = props.editorView,
     featureFlags = props.featureFlags,
-    editorAnalyticsAPI = props.editorAnalyticsAPI;
+    editorAnalyticsAPI = props.editorAnalyticsAPI,
+    editorAPI = props.editorAPI;
   var render = React.useCallback(function (_ref) {
     var data = _ref.data;
     if (!data) {
@@ -23,20 +23,19 @@ var AvatarsWithPluginState = function AvatarsWithPluginState(props) {
       participants: data.activeParticipants,
       editorView: editorView,
       featureFlags: featureFlags,
-      editorAnalyticsAPI: editorAnalyticsAPI
+      editorAnalyticsAPI: editorAnalyticsAPI,
+      editorAPI: editorAPI
     }, /*#__PURE__*/React.createElement(InviteToEditButton, {
       title: title,
       selected: selected,
       onClick: onClick,
       Component: Component
     }));
-  }, [selected, onClick, Component, title, editorView, featureFlags, editorAnalyticsAPI]);
-  return /*#__PURE__*/React.createElement(WithPluginState, {
-    plugins: {
-      data: collabEditPluginKey
-    },
-    render: render,
-    editorView: editorView
+  }, [selected, onClick, Component, title, editorView, featureFlags, editorAnalyticsAPI, editorAPI]);
+  var _useSharedPluginState = useSharedPluginState(editorAPI, ['collabEdit']),
+    collabEditState = _useSharedPluginState.collabEditState;
+  return render({
+    data: collabEditState
   });
 };
 export default injectIntl(AvatarsWithPluginState);

package/dist/esm/plugins/avatar-group/ui/avatars.js

@@ -0,0 +1,62 @@
+/** @jsx jsx */
+import React from 'react';
+import { jsx } from '@emotion/react';
+import AvatarGroup from '@atlaskit/avatar-group';
+import { Selection } from '@atlaskit/editor-prosemirror/state';
+import { avatarContainer } from './styles';
+import toAvatar from './to-avatar';
+import { ACTION, ACTION_SUBJECT, EVENT_TYPE } from '@atlaskit/editor-common/analytics';
+export var scrollToCollabCursor = function scrollToCollabCursor(editorView, participants, sessionId, index, editorAnalyticsAPI) {
+  var selectedUser = participants[index];
+  if (selectedUser && selectedUser.cursorPos !== undefined && selectedUser.sessionId !== sessionId) {
+    var state = editorView.state;
+    var tr = state.tr;
+    var analyticsPayload = {
+      action: ACTION.MATCHED,
+      actionSubject: ACTION_SUBJECT.SELECTION,
+      eventType: EVENT_TYPE.TRACK
+    };
+    tr.setSelection(Selection.near(tr.doc.resolve(selectedUser.cursorPos)));
+    editorAnalyticsAPI === null || editorAnalyticsAPI === void 0 || editorAnalyticsAPI.attachAnalyticsEvent(analyticsPayload)(tr);
+    tr.scrollIntoView();
+    editorView.dispatch(tr);
+    if (!editorView.hasFocus()) {
+      editorView.focus();
+    }
+  }
+};
+export var Avatars = /*#__PURE__*/React.memo(function (props) {
+  var _props$participants;
+  var sessionId = props.sessionId,
+    editorView = props.editorView,
+    featureFlags = props.featureFlags,
+    editorAPI = props.editorAPI;
+  var participants = (_props$participants = props.participants) === null || _props$participants === void 0 ? void 0 : _props$participants.toArray();
+  var avatars = participants.sort(function (p) {
+    return p.sessionId === sessionId ? -1 : 1;
+  }).map(function (participant) {
+    return toAvatar(participant, editorAPI);
+  });
+  if (!avatars.length) {
+    return null;
+  }
+  return jsx("div", {
+    css: avatarContainer
+  }, jsx(AvatarGroup, {
+    appearance: "stack",
+    size: "medium",
+    data: avatars,
+    maxCount: 3,
+    onAvatarClick: function onAvatarClick(_event, _analytics, index) {
+      if (!editorView) {
+        return;
+      }
+      var 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.editorAnalyticsAPI);
+      }
+    }
+  }), props.children);
+});

package/dist/esm/plugins/avatar-group/ui/colored-avatar-item.js

@@ -0,0 +1,13 @@
+/** @jsx jsx */
+import { jsx } from '@emotion/react';
+import { badge } from './styles';
+import { R100 } from '@atlaskit/theme/colors';
+export var ColoredAvatarItem = function ColoredAvatarItem(props) {
+  var _props$api;
+  var color = (_props$api = props.api) === null || _props$api === void 0 || (_props$api = _props$api.collabEdit) === null || _props$api === void 0 ? void 0 : _props$api.actions.getAvatarColor(props.sessionId).color.solid;
+  var avatar = props.name.substr(0, 1).toUpperCase();
+  return jsx("div", {
+    css: badge(color || R100),
+    "data-testid": "editor-collab-badge"
+  }, avatar);
+};

package/dist/esm/plugins/{collab-edit → avatar-group}/ui/to-avatar.js

@@ -2,12 +2,13 @@ import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
 import React from 'react';
 import memoizeOne from 'memoize-one';
 import { ColoredAvatarItem } from './colored-avatar-item';
-var toAvatar = function toAvatar(participant) {
+var toAvatar = function toAvatar(participant, api) {
   return {
     name: participant.name,
     src: participant.avatar,
     size: 'medium',
     presence: /*#__PURE__*/React.createElement(ColoredAvatarItem, {
+      api: api,
       name: participant.name,
       sessionId: participant.sessionId
     })

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

@@ -150,6 +150,9 @@ var updateExtensionParams = function updateExtensionParams(editorAnalyticsAPI) {
     }();
   };
 };
+
+// This is to decouple extensions from editor core
+// Ideally in the future we completely deprecate `EditorActions`
 export var editSelectedExtension = function editSelectedExtension(editorActions) {
   var editorView = editorActions._privateGetEditorView();
   var _getPluginState = getPluginState(editorView.state),

package/dist/esm/plugins/extension/context-panel.js

@@ -9,7 +9,7 @@ import React from 'react';
 import { getExtensionKeyAndNodeKey } from '@atlaskit/editor-common/extensions';
 import { getPluginState } from './pm-plugins/main';
 import { getSelectedExtension } from './utils';
-import ConfigPanelLoader from '../../ui/ConfigPanel/ConfigPanelLoader';
+import ConfigPanelLoader from './ui/ConfigPanel/ConfigPanelLoader';
 import { clearEditingContext, forceAutoSave, updateState } from './commands';
 import { buildExtensionNode } from './actions';
 import { SaveIndicator } from './ui/SaveIndicator/SaveIndicator';

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

@@ -5,7 +5,7 @@ import { TextSelection, NodeSelection } from '@atlaskit/editor-prosemirror/state
 import { findParentNodeOfTypeClosestToPos, findSelectedNodeOfType } from '@atlaskit/editor-prosemirror/utils';
 import { SafePlugin } from '@atlaskit/editor-common/safe-plugin';
 import { isSelectionAtStartOfNode, isSelectionAtEndOfNode, createSelectionClickHandler } from '@atlaskit/editor-common/selection';
-import ExtensionNodeView from '../nodeviews/extension';
+import { ExtensionNodeView } from '@atlaskit/editor-common/extensibility';
 import { updateState, clearEditingContext } from '../commands';
 import { getSelectedExtension, getSelectedDomElement } from '../utils';
 import { createPluginState, getPluginState, createCommand } from '../plugin-factory';

package/dist/esm/{ui → plugins/extension/ui}/ConfigPanel/ConfigPanel.js

@@ -28,8 +28,8 @@ import { injectIntl } from 'react-intl-next';
 import ButtonGroup from '@atlaskit/button/button-group';
 import Button from '@atlaskit/button/custom-theme-button';
 import { FormFooter } from '@atlaskit/form';
-import { pluginKey as extensionPluginKey } from '../../plugins/extension/plugin-key';
-import WithPluginState from '../WithPluginState';
+import { pluginKey as extensionPluginKey } from '../../plugin-key';
+import { WithPluginState } from '@atlaskit/editor-common/with-plugin-state';
 import FormContent from './FormContent';
 import { messages } from './messages';
 import { FormErrorBoundary } from './FormErrorBoundary';

package/dist/esm/{ui → plugins/extension/ui}/ConfigPanel/ConfigPanelFieldsLoader.js

@@ -1,6 +1,6 @@
 import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
 import React, { useState, useEffect } from 'react';
-import { useStateFromPromise } from '../../utils/react-hooks/use-state-from-promise';
+import { useStateFromPromise } from './use-state-from-promise';
 import ConfigPanel from './ConfigPanel';
 var getFieldsDefinitionFn = function getFieldsDefinitionFn(extensionManifest, nodeKey) {
   if (extensionManifest && extensionManifest.modules.nodes && extensionManifest.modules.nodes[nodeKey] && extensionManifest.modules.nodes[nodeKey].getFieldsDefinition) {

package/dist/esm/plugins/index.js

@@ -1,4 +1,3 @@
-export { default as collabEditPlugin } from './collab-edit';
 export { default as extensionPlugin } from './extension';
 export { default as jiraIssuePlugin } from './jira-issue';
 export { default as findReplacePlugin } from './find-replace';

package/dist/esm/presets/universal.js

@@ -42,7 +42,8 @@ import { alignmentPlugin } from '@atlaskit/editor-plugin-alignment';
 import { dataConsumerPlugin } from '@atlaskit/editor-plugin-data-consumer';
 import { annotationPlugin } from '@atlaskit/editor-plugin-annotation';
 import { getBooleanFF } from '@atlaskit/platform-feature-flags';
-import { avatarGroupPlugin, beforePrimaryToolbarPlugin, collabEditPlugin, extensionPlugin, findReplacePlugin, jiraIssuePlugin } from '../plugins';
+import { collabEditPlugin } from '@atlaskit/editor-plugin-collab-edit';
+import { avatarGroupPlugin, beforePrimaryToolbarPlugin, extensionPlugin, findReplacePlugin, jiraIssuePlugin } from '../plugins';
 import { feedbackDialogPlugin } from '@atlaskit/editor-plugin-feedback-dialog';
 import { shouldForceTracking } from '@atlaskit/editor-common/utils';
 import { isFullPage as fullPageCheck } from '../utils/is-full-page';

package/dist/esm/ui/Appearance/FullPage/FullPageToolbar.js

@@ -4,7 +4,7 @@ import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
 import React, { useState, useEffect } from 'react';
 import { jsx } from '@emotion/react';
 import { injectIntl } from 'react-intl-next';
-import AvatarsWithPluginState from '../../../plugins/collab-edit/ui';
+import AvatarsWithPluginState from '../../../plugins/avatar-group/ui';
 import FindReplaceToolbarButtonWithState from '../../../plugins/find-replace/FindReplaceToolbarButtonWithState';
 import { BeforePrimaryToolbarWrapper } from '../../../plugins/before-primaryToolbar/ui/BeforePrimaryToolbarWrapper';
 import Toolbar from '../../Toolbar';
@@ -59,7 +59,8 @@ export var EditorToolbar = /*#__PURE__*/React.memo(function (props) {
     inviteToEditHandler: (_props$collabEdit2 = props.collabEdit) === null || _props$collabEdit2 === void 0 ? void 0 : _props$collabEdit2.inviteToEditHandler,
     isInviteToEditButtonSelected: (_props$collabEdit3 = props.collabEdit) === null || _props$collabEdit3 === void 0 ? void 0 : _props$collabEdit3.isInviteToEditButtonSelected,
     featureFlags: props.featureFlags || {},
-    editorAnalyticsAPI: editorAPI === null || editorAPI === void 0 || (_editorAPI$analytics = editorAPI.analytics) === null || _editorAPI$analytics === void 0 ? void 0 : _editorAPI$analytics.actions
+    editorAnalyticsAPI: editorAPI === null || editorAPI === void 0 || (_editorAPI$analytics = editorAPI.analytics) === null || _editorAPI$analytics === void 0 ? void 0 : _editorAPI$analytics.actions,
+    editorAPI: editorAPI
   }), editorAPI !== null && editorAPI !== void 0 && editorAPI.findReplace && twoLineEditorToolbar ? jsx(FindReplaceToolbarButtonWithState, {
     popupsBoundariesElement: props.popupsBoundariesElement,
     popupsMountPoint: props.popupsMountPoint,

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

@@ -3,4 +3,4 @@ var _templateObject;
 import { css } from '@emotion/react';
 import { blockNodesVerticalMargin, akEditorSelectedBorderSize, akEditorDeleteBorder, akEditorDeleteBackground, SelectionStyle, getSelectionStyles, akEditorSelectedNodeClassName } from '@atlaskit/editor-shared-styles';
 // eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage
-export var extensionStyles = css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  .multiBodiedExtensionView-content-wrap.", ":not(.danger) {\n    ", "\n  }\n\n  .multiBodiedExtensionView-content-wrap {\n    &.danger > span > .multiBodiedExtension--container {\n      box-shadow: 0 0 0 ", "px\n        ", ";\n      background-color: ", ";\n    }\n    .multiBodiedExtension--container {\n      width: 100%;\n      max-width: 100%; // ensure width can't go over 100%;\n    }\n  }\n\n  .extensionView-content-wrap,\n  .multiBodiedExtensionView-content-wrap,\n  .bodiedExtensionView-content-wrap {\n    margin: ", " 0;\n\n    &:first-of-type {\n      margin-top: 0;\n    }\n\n    &:last-of-type {\n      margin-bottom: 0;\n    }\n\n    &:not(.danger).", " {\n      & > span > .extension-container {\n        ", "\n      }\n    }\n\n    &.danger > span > .extension-container {\n      box-shadow: 0 0 0 ", "px\n        ", ";\n      background-color: ", ";\n    }\n\n    &.inline {\n      word-wrap: break-all;\n    }\n  }\n\n  .extensionView-content-wrap .extension-container {\n    overflow: hidden;\n  }\n\n  .bodiedExtensionView-content-wrap\n    .extensionView-content-wrap\n    .extension-container {\n    width: 100%;\n    max-width: 100%; // ensure width can't go over 100%;\n  }\n\n  [data-mark-type='fragment'] {\n    & > .extensionView-content-wrap,\n    & > .bodiedExtensionView-content-wrap {\n      margin: ", " 0;\n    }\n\n    & > [data-mark-type='dataConsumer'] {\n      & > .extensionView-content-wrap,\n      & > .bodiedExtensionView-content-wrap {\n        margin: ", " 0;\n      }\n    }\n\n    &:first-child {\n      & > .extensionView-content-wrap,\n      & > .bodiedExtensionView-content-wrap {\n        margin-top: 0;\n      }\n\n      & > [data-mark-type='dataConsumer'] {\n        & > .extensionView-content-wrap,\n        & > .bodiedExtensionView-content-wrap {\n          margin-top: 0;\n        }\n      }\n    }\n\n    &:nth-last-of-type(-n + 2):not(:first-of-type) {\n      & > .extensionView-content-wrap,\n      & > .bodiedExtensionView-content-wrap {\n        margin-bottom: 0;\n      }\n\n      & > [data-mark-type='dataConsumer'] {\n        & > .extensionView-content-wrap,\n        & > .bodiedExtensionView-content-wrap {\n          margin-bottom: 0;\n        }\n      }\n    }\n  }\n"])), akEditorSelectedNodeClassName, getSelectionStyles([SelectionStyle.BoxShadow, SelectionStyle.Blanket]), akEditorSelectedBorderSize, "var(--ds-border-danger, ".concat(akEditorDeleteBorder, ")"), "var(--ds-background-danger, ".concat(akEditorDeleteBackground, ")"), blockNodesVerticalMargin, akEditorSelectedNodeClassName, getSelectionStyles([SelectionStyle.BoxShadow]), akEditorSelectedBorderSize, "var(--ds-border-danger, ".concat(akEditorDeleteBorder, ")"), "var(--ds-background-danger, ".concat(akEditorDeleteBackground, ")"), blockNodesVerticalMargin, blockNodesVerticalMargin);
+export var extensionStyles = css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  .multiBodiedExtensionView-content-wrap {\n    &.danger > span > .multiBodiedExtension--container {\n      box-shadow: 0 0 0 ", "px\n        ", ";\n      background-color: ", ";\n    }\n    &:not(.danger).", " {\n      & > span > .multiBodiedExtension--container {\n        ", "\n      }\n    }\n    .multiBodiedExtension--container {\n      width: 100%;\n      max-width: 100%; // ensure width can't go over 100%;\n    }\n  }\n\n  .extensionView-content-wrap,\n  .multiBodiedExtensionView-content-wrap,\n  .bodiedExtensionView-content-wrap {\n    margin: ", " 0;\n\n    &:first-of-type {\n      margin-top: 0;\n    }\n\n    &:last-of-type {\n      margin-bottom: 0;\n    }\n\n    &:not(.danger).", " {\n      & > span > .extension-container {\n        ", "\n      }\n    }\n\n    &.danger > span > .extension-container {\n      box-shadow: 0 0 0 ", "px\n        ", ";\n      background-color: ", ";\n    }\n\n    &.inline {\n      word-wrap: break-all;\n    }\n  }\n\n  .extensionView-content-wrap .extension-container {\n    overflow: hidden;\n  }\n\n  .bodiedExtensionView-content-wrap\n    .extensionView-content-wrap\n    .extension-container {\n    width: 100%;\n    max-width: 100%; // ensure width can't go over 100%;\n  }\n\n  [data-mark-type='fragment'] {\n    & > .extensionView-content-wrap,\n    & > .bodiedExtensionView-content-wrap {\n      margin: ", " 0;\n    }\n\n    & > [data-mark-type='dataConsumer'] {\n      & > .extensionView-content-wrap,\n      & > .bodiedExtensionView-content-wrap {\n        margin: ", " 0;\n      }\n    }\n\n    &:first-child {\n      & > .extensionView-content-wrap,\n      & > .bodiedExtensionView-content-wrap {\n        margin-top: 0;\n      }\n\n      & > [data-mark-type='dataConsumer'] {\n        & > .extensionView-content-wrap,\n        & > .bodiedExtensionView-content-wrap {\n          margin-top: 0;\n        }\n      }\n    }\n\n    &:nth-last-of-type(-n + 2):not(:first-of-type) {\n      & > .extensionView-content-wrap,\n      & > .bodiedExtensionView-content-wrap {\n        margin-bottom: 0;\n      }\n\n      & > [data-mark-type='dataConsumer'] {\n        & > .extensionView-content-wrap,\n        & > .bodiedExtensionView-content-wrap {\n          margin-bottom: 0;\n        }\n      }\n    }\n  }\n"])), akEditorSelectedBorderSize, "var(--ds-border-danger, ".concat(akEditorDeleteBorder, ")"), "var(--ds-background-danger, ".concat(akEditorDeleteBackground, ")"), akEditorSelectedNodeClassName, getSelectionStyles([SelectionStyle.BoxShadow, SelectionStyle.Blanket]), blockNodesVerticalMargin, akEditorSelectedNodeClassName, getSelectionStyles([SelectionStyle.BoxShadow]), akEditorSelectedBorderSize, "var(--ds-border-danger, ".concat(akEditorDeleteBorder, ")"), "var(--ds-background-danger, ".concat(akEditorDeleteBackground, ")"), blockNodesVerticalMargin, blockNodesVerticalMargin);

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

@@ -6,7 +6,7 @@ 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, SmartCardSharedCssClassName } from '@atlaskit/editor-common/styles';
 import { akEditorSelectedBorderSize, akEditorDeleteBorder, akEditorDeleteBackgroundWithOpacity, akEditorSelectedNodeClassName, blockNodesVerticalMargin, editorFontSize, getSelectionStyles, SelectionStyle, akEditorLineHeight, akEditorSelectedBorderColor } from '@atlaskit/editor-shared-styles';
 import { MentionSharedCssClassName } from '@atlaskit/editor-common/mention';
-import { telepointerStyle } from '../../plugins/collab-edit/styles';
+import { telepointerStyle } from '@atlaskit/editor-common/collab';
 import { tableStyles } from '@atlaskit/editor-plugin-table/ui/common-styles';
 import { blocktypeStyles } from '@atlaskit/editor-plugin-block-type/styles';
 import { textHighlightStyle } from '@atlaskit/editor-plugin-paste-options-toolbar/styles';
@@ -39,7 +39,7 @@ export var placeholderStyles = css(_templateObject6 || (_templateObject6 = _tagg
 var contentStyles = function contentStyles(props) {
   return css(_templateObject7 || (_templateObject7 = _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(), blocktypeStyles(), codeMarkSharedStyles(), textColorStyles, listsStyles, ruleStyles(), mediaStyles, layoutStyles(props), telepointerStyle, gapCursorStyles, tableStyles(props), panelStyles(), mentionsStyles, emojiStyles, tasksAndDecisionsStyles, gridStyles, linkStyles, blockMarksSharedStyles, dateSharedStyle, extensionStyles, expandStyles(), findReplaceStyles, textHighlightStyle, taskDecisionStyles, statusStyles, annotationSharedStyles(), smartCardStyles, smartCardSharedStyles, dateStyles, embedCardStyles, unsupportedStyles, resizerStyles, MediaSharedClassNames.FLOATING_TOOLBAR_COMPONENT);
+  }), whitespaceSharedStyles, paragraphSharedStyles, listsSharedStyles, indentationSharedStyles, shadowSharedStyle, InlineNodeViewSharedStyles, "var(--ds-border-focused, #8cf)", placeholderTextStyles, placeholderStyles, codeBlockStyles(), blocktypeStyles(), codeMarkSharedStyles(), textColorStyles, listsStyles, ruleStyles(), mediaStyles, layoutStyles, telepointerStyle, gapCursorStyles, tableStyles(props), panelStyles(), mentionsStyles, emojiStyles, tasksAndDecisionsStyles, gridStyles, linkStyles, blockMarksSharedStyles, dateSharedStyle, extensionStyles, expandStyles(), findReplaceStyles, textHighlightStyle, taskDecisionStyles, statusStyles, annotationSharedStyles(), smartCardStyles, smartCardSharedStyles, dateStyles, embedCardStyles, unsupportedStyles, resizerStyles, MediaSharedClassNames.FLOATING_TOOLBAR_COMPONENT);
 };
 export var createEditorContentStyle = function createEditorContentStyle(styles) {
   return /*#__PURE__*/React.forwardRef(function (props, ref) {

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

@@ -1,23 +1,10 @@
 import _taggedTemplateLiteral from "@babel/runtime/helpers/taggedTemplateLiteral";
 var _templateObject;
 import { css } from '@emotion/react';
-
-// eslint-disable-next-line @atlaskit/design-system/no-deprecated-imports
-import { gridSize } from '@atlaskit/theme/constants';
-import { N40A, N50A, DN70, DN80 } from '@atlaskit/theme/colors';
-// eslint-disable-next-line @atlaskit/design-system/no-deprecated-imports
-import { themed } from '@atlaskit/theme/components';
+import { N40A, N50A } from '@atlaskit/theme/colors';
 import { columnLayoutSharedStyle, LAYOUT_SECTION_MARGIN, LAYOUT_COLUMN_PADDING } from '@atlaskit/editor-common/styles';
 import { gridMediumMaxWidth, akEditorDeleteBackground, akEditorDeleteBorder, akEditorSelectedBorderSize, akLayoutGutterOffset, akEditorSwoopCubicBezier, SelectionStyle, getSelectionStyles, akEditorSelectedNodeClassName } from '@atlaskit/editor-shared-styles';
 import { TableCssClassName } from '@atlaskit/editor-plugin-table/types';
 import { tableMarginFullWidthMode } from '@atlaskit/editor-plugin-table/ui/consts';
 export { LAYOUT_COLUMN_PADDING, LAYOUT_SECTION_MARGIN };
-export var layoutStyles = function layoutStyles(props) {
-  return css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  .ProseMirror {\n    ", " [data-layout-section] {\n      // TODO: Migrate away from gridSize\n      // Recommendation: Replace directly with 7px\n      margin: ", "px -", "px 0;\n      transition: border-color 0.3s ", ";\n      cursor: pointer;\n\n      /* Inner cursor located 26px from left */\n      [data-layout-column] {\n        flex: 1;\n        min-width: 0;\n        border: ", "px solid\n          ", ";\n        border-radius: 4px;\n        padding: ", "px;\n        box-sizing: border-box;\n\n        > div {\n          > :not(style):first-child,\n          > style:first-child + * {\n            margin-top: 0;\n          }\n\n          > .ProseMirror-gapcursor:first-child + *,\n          > style:first-child + .ProseMirror-gapcursor + * {\n            margin-top: 0;\n          }\n\n          > .ProseMirror-gapcursor:first-child + span + *,\n          > style:first-child + .ProseMirror-gapcursor:first-child + span + * {\n            margin-top: 0;\n          }\n\n          > .embedCardView-content-wrap:first-of-type .rich-media-item {\n            margin-top: 0;\n          }\n\n          > .mediaSingleView-content-wrap:first-of-type .rich-media-item {\n            margin-top: 0;\n          }\n\n          > .ProseMirror-gapcursor.-right:first-child\n            + .mediaSingleView-content-wrap\n            .rich-media-item,\n          > style:first-child\n            + .ProseMirror-gapcursor.-right\n            + .mediaSingleView-content-wrap\n            .rich-media-item,\n          > .ProseMirror-gapcursor.-right:first-of-type\n            + .embedCardView-content-wrap\n            .rich-media-item {\n            margin-top: 0;\n          }\n\n          > .ProseMirror-gapcursor:first-child\n            + span\n            + .mediaSingleView-content-wrap\n            .rich-media-item,\n          > style:first-child\n            + .ProseMirror-gapcursor\n            + span\n            + .mediaSingleView-content-wrap\n            .rich-media-item {\n            margin-top: 0;\n          }\n\n          /* Prevent first DecisionWrapper's margin-top: 8px from shifting decisions down\n             and shrinking layout's node selectable area (leniency margin) */\n          > [data-node-type='decisionList'] {\n            li:first-of-type [data-decision-wrapper] {\n              margin-top: 0;\n            }\n          }\n        }\n\n        /* Make the 'content' fill the entire height of the layout column to allow click\n           handler of layout section nodeview to target only data-layout-column */\n        [data-layout-content] {\n          height: 100%;\n          cursor: text;\n        }\n      }\n\n      [data-layout-column] + [data-layout-column] {\n        margin-left: ", "px;\n      }\n\n      @media screen and (max-width: ", "px) {\n        [data-layout-column] + [data-layout-column] {\n          margin-left: 0;\n        }\n      }\n\n      // TODO: Remove the border styles below once design tokens have been enabled and fallbacks are no longer triggered.\n      // This is because the default state already uses the same token and, as such, the hover style won't change anything.\n      // https://product-fabric.atlassian.net/browse/DSP-4441\n      /* Shows the border when cursor is inside a layout */\n      &.selected [data-layout-column],\n      &:hover [data-layout-column] {\n        border: ", "px solid\n          ", ";\n      }\n\n      &.selected.danger > [data-layout-column] {\n        background-color: ", ";\n        border-color: ", ";\n      }\n\n      &.", ":not(.danger) {\n        [data-layout-column] {\n          ", "\n        }\n      }\n    }\n  }\n\n  .fabric-editor--full-width-mode .ProseMirror {\n    [data-layout-section] {\n      .", " {\n        margin: 0 ", "px;\n      }\n    }\n  }\n"])), columnLayoutSharedStyle, gridSize() - 1, akLayoutGutterOffset, akEditorSwoopCubicBezier, akEditorSelectedBorderSize, themed({
-    light: "var(--ds-border, ".concat(N40A, ")"),
-    dark: "var(--ds-border, ".concat(DN70, ")")
-  })(props), LAYOUT_COLUMN_PADDING, LAYOUT_SECTION_MARGIN, gridMediumMaxWidth, akEditorSelectedBorderSize, themed({
-    light: "var(--ds-border, ".concat(N50A, ")"),
-    dark: "var(--ds-border, ".concat(DN80, ")")
-  })(props), "var(--ds-background-danger, ".concat(akEditorDeleteBackground, ")"), "var(--ds-border-danger, ".concat(akEditorDeleteBorder, ")"), akEditorSelectedNodeClassName, getSelectionStyles([SelectionStyle.Border, SelectionStyle.Blanket]), TableCssClassName.TABLE_CONTAINER, tableMarginFullWidthMode);
-};
+export var layoutStyles = css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  .ProseMirror {\n    ", " [data-layout-section] {\n      // TODO: Migrate away from gridSize\n      // Recommendation: Replace directly with 7px\n      margin: ", "px -", "px 0;\n      transition: border-color 0.3s ", ";\n      cursor: pointer;\n\n      /* Inner cursor located 26px from left */\n      [data-layout-column] {\n        flex: 1;\n        min-width: 0;\n        border: ", "px solid\n          ", ";\n        border-radius: 4px;\n        padding: ", "px;\n        box-sizing: border-box;\n\n        > div {\n          > :not(style):first-child,\n          > style:first-child + * {\n            margin-top: 0;\n          }\n\n          > .ProseMirror-gapcursor:first-child + *,\n          > style:first-child + .ProseMirror-gapcursor + * {\n            margin-top: 0;\n          }\n\n          > .ProseMirror-gapcursor:first-child + span + *,\n          > style:first-child + .ProseMirror-gapcursor:first-child + span + * {\n            margin-top: 0;\n          }\n\n          > .embedCardView-content-wrap:first-of-type .rich-media-item {\n            margin-top: 0;\n          }\n\n          > .mediaSingleView-content-wrap:first-of-type .rich-media-item {\n            margin-top: 0;\n          }\n\n          > .ProseMirror-gapcursor.-right:first-child\n            + .mediaSingleView-content-wrap\n            .rich-media-item,\n          > style:first-child\n            + .ProseMirror-gapcursor.-right\n            + .mediaSingleView-content-wrap\n            .rich-media-item,\n          > .ProseMirror-gapcursor.-right:first-of-type\n            + .embedCardView-content-wrap\n            .rich-media-item {\n            margin-top: 0;\n          }\n\n          > .ProseMirror-gapcursor:first-child\n            + span\n            + .mediaSingleView-content-wrap\n            .rich-media-item,\n          > style:first-child\n            + .ProseMirror-gapcursor\n            + span\n            + .mediaSingleView-content-wrap\n            .rich-media-item {\n            margin-top: 0;\n          }\n\n          /* Prevent first DecisionWrapper's margin-top: 8px from shifting decisions down\n             and shrinking layout's node selectable area (leniency margin) */\n          > [data-node-type='decisionList'] {\n            li:first-of-type [data-decision-wrapper] {\n              margin-top: 0;\n            }\n          }\n        }\n\n        /* Make the 'content' fill the entire height of the layout column to allow click\n           handler of layout section nodeview to target only data-layout-column */\n        [data-layout-content] {\n          height: 100%;\n          cursor: text;\n        }\n      }\n\n      [data-layout-column] + [data-layout-column] {\n        margin-left: ", "px;\n      }\n\n      @media screen and (max-width: ", "px) {\n        [data-layout-column] + [data-layout-column] {\n          margin-left: 0;\n        }\n      }\n\n      // TODO: Remove the border styles below once design tokens have been enabled and fallbacks are no longer triggered.\n      // This is because the default state already uses the same token and, as such, the hover style won't change anything.\n      // https://product-fabric.atlassian.net/browse/DSP-4441\n      /* Shows the border when cursor is inside a layout */\n      &.selected [data-layout-column],\n      &:hover [data-layout-column] {\n        border: ", "px solid\n          ", ";\n      }\n\n      &.selected.danger > [data-layout-column] {\n        background-color: ", ";\n        border-color: ", ";\n      }\n\n      &.", ":not(.danger) {\n        [data-layout-column] {\n          ", "\n        }\n      }\n    }\n  }\n\n  .fabric-editor--full-width-mode .ProseMirror {\n    [data-layout-section] {\n      .", " {\n        margin: 0 ", "px;\n      }\n    }\n  }\n"])), columnLayoutSharedStyle, 8 - 1, akLayoutGutterOffset, akEditorSwoopCubicBezier, akEditorSelectedBorderSize, "var(--ds-border, ".concat(N40A, ")"), LAYOUT_COLUMN_PADDING, LAYOUT_SECTION_MARGIN, gridMediumMaxWidth, akEditorSelectedBorderSize, "var(--ds-border, ".concat(N50A, ")"), "var(--ds-background-danger, ".concat(akEditorDeleteBackground, ")"), "var(--ds-border-danger, ".concat(akEditorDeleteBorder, ")"), akEditorSelectedNodeClassName, getSelectionStyles([SelectionStyle.Border, SelectionStyle.Blanket]), TableCssClassName.TABLE_CONTAINER, tableMarginFullWidthMode);

package/dist/esm/version-wrapper.js

@@ -1,2 +1,2 @@
 export var name = "@atlaskit/editor-core";
-export var version = "190.2.2";
+export var version = "191.0.0";

package/dist/types/plugins/avatar-group/index.d.ts

@@ -2,15 +2,18 @@ import type { NextEditorPlugin, OptionalPlugin } from '@atlaskit/editor-common/t
 import type { CollabEditOptions } from '@atlaskit/editor-common/collab';
 import type { FeatureFlagsPlugin } from '@atlaskit/editor-plugin-feature-flags';
 import type { AnalyticsPlugin } from '@atlaskit/editor-plugin-analytics';
+import type { CollabEditPlugin } from '@atlaskit/editor-plugin-collab-edit';
 type Config = {
     collabEdit?: CollabEditOptions;
     takeFullWidth: boolean;
 };
-declare const avatarGroup: NextEditorPlugin<'avatarGroup', {
+export type AvatarGroupPlugin = NextEditorPlugin<'avatarGroup', {
     pluginConfiguration: Config;
     dependencies: [
         OptionalPlugin<FeatureFlagsPlugin>,
-        OptionalPlugin<AnalyticsPlugin>
+        OptionalPlugin<AnalyticsPlugin>,
+        OptionalPlugin<CollabEditPlugin>
     ];
 }>;
+declare const avatarGroup: AvatarGroupPlugin;
 export default avatarGroup;

package/dist/types/plugins/avatar-group/ui/AvatarGroupPluginWrapper.d.ts

@@ -3,7 +3,8 @@ import type { EventDispatcher } from '../../../event-dispatcher';
 import type { EditorView } from '@atlaskit/editor-prosemirror/view';
 import type { CollabEditOptions } from '@atlaskit/editor-common/collab';
 import type { DispatchAnalyticsEvent, EditorAnalyticsAPI } from '@atlaskit/editor-common/analytics';
-import type { FeatureFlags } from '@atlaskit/editor-common/types';
+import type { ExtractInjectionAPI, FeatureFlags } from '@atlaskit/editor-common/types';
+import type { AvatarGroupPlugin } from '..';
 declare const AvatarGroupPluginWrapper: (props: {
     collabEdit?: CollabEditOptions | undefined;
     editorView: EditorView;
@@ -12,5 +13,6 @@ declare const AvatarGroupPluginWrapper: (props: {
     takeFullWidth: boolean;
     featureFlags: FeatureFlags;
     editorAnalyticsAPI: EditorAnalyticsAPI | undefined;
+    editorAPI: ExtractInjectionAPI<AvatarGroupPlugin> | undefined;
 }) => jsx.JSX.Element;
 export default AvatarGroupPluginWrapper;

package/dist/types/plugins/avatar-group/ui/avatars-with-plugin-state.d.ts

@@ -0,0 +1,86 @@
+import React from 'react';
+import type { WrappedComponentProps } from 'react-intl-next';
+import type { EditorView } from '@atlaskit/editor-prosemirror/view';
+import type { EventDispatcher } from '../../../event-dispatcher';
+import type { CollabInviteToEditProps, CollabEditPlugin } from '@atlaskit/editor-plugin-collab-edit';
+import type { FeatureFlags, OptionalPlugin, PublicPluginAPI } from '@atlaskit/editor-common/types';
+import type { EditorAnalyticsAPI } from '@atlaskit/editor-common/analytics';
+export type AvatarsWithPluginStateProps = {
+    editorView?: EditorView;
+    eventDispatcher?: EventDispatcher;
+    featureFlags: FeatureFlags;
+    editorAnalyticsAPI: EditorAnalyticsAPI | undefined;
+    editorAPI: PublicPluginAPI<[OptionalPlugin<CollabEditPlugin>]> | undefined;
+} & CollabInviteToEditProps;
+declare const _default: React.FC<import("react-intl-next").WithIntlProps<{
+    editorView?: EditorView | undefined;
+    eventDispatcher?: EventDispatcher<any> | undefined;
+    featureFlags: FeatureFlags;
+    editorAnalyticsAPI: EditorAnalyticsAPI | undefined;
+    editorAPI: PublicPluginAPI<[OptionalPlugin<import("@atlaskit/editor-common/types").NextEditorPluginFunctionOptionalConfigDefinition<"collabEdit", {
+        pluginConfiguration: import("@atlaskit/editor-plugin-collab-edit").PrivateCollabEditOptions;
+        dependencies: [OptionalPlugin<import("@atlaskit/editor-common/types").NextEditorPluginFunctionOptionalConfigDefinition<"featureFlags", {
+            pluginConfiguration: FeatureFlags;
+            sharedState: FeatureFlags;
+        }, FeatureFlags>>, OptionalPlugin<import("@atlaskit/editor-common/types").NextEditorPluginFunctionOptionalConfigDefinition<"analytics", {
+            pluginConfiguration: import("@atlaskit/editor-plugin-analytics").AnalyticsPluginOptions;
+            sharedState: {
+                createAnalyticsEvent: import("@atlaskit/analytics-next").CreateUIAnalyticsEvent | null;
+                attachAnalyticsEvent: import("@atlaskit/editor-plugin-analytics").CreateAttachPayloadIntoTransaction | null;
+                performanceTracking: import("@atlaskit/editor-common/types").PerformanceTracking | undefined;
+            };
+            dependencies: [OptionalPlugin<import("@atlaskit/editor-common/types").NextEditorPluginFunctionOptionalConfigDefinition<"featureFlags", {
+                pluginConfiguration: FeatureFlags;
+                sharedState: FeatureFlags;
+            }, FeatureFlags>>];
+            actions: EditorAnalyticsAPI;
+        }, import("@atlaskit/editor-plugin-analytics").AnalyticsPluginOptions>>];
+        sharedState: {
+            activeParticipants: import("@atlaskit/editor-plugin-collab-edit").ReadOnlyParticipants | undefined;
+            sessionId: string | undefined;
+        } | undefined;
+        actions: {
+            getAvatarColor: (str: string) => {
+                index: number;
+                color: import("@atlaskit/editor-common/collab").Color;
+            };
+        };
+    }, import("@atlaskit/editor-plugin-collab-edit").PrivateCollabEditOptions>>]> | undefined;
+} & CollabInviteToEditProps & WrappedComponentProps<"intl">>> & {
+    WrappedComponent: React.ComponentType<{
+        editorView?: EditorView | undefined;
+        eventDispatcher?: EventDispatcher<any> | undefined;
+        featureFlags: FeatureFlags;
+        editorAnalyticsAPI: EditorAnalyticsAPI | undefined;
+        editorAPI: PublicPluginAPI<[OptionalPlugin<import("@atlaskit/editor-common/types").NextEditorPluginFunctionOptionalConfigDefinition<"collabEdit", {
+            pluginConfiguration: import("@atlaskit/editor-plugin-collab-edit").PrivateCollabEditOptions;
+            dependencies: [OptionalPlugin<import("@atlaskit/editor-common/types").NextEditorPluginFunctionOptionalConfigDefinition<"featureFlags", {
+                pluginConfiguration: FeatureFlags;
+                sharedState: FeatureFlags;
+            }, FeatureFlags>>, OptionalPlugin<import("@atlaskit/editor-common/types").NextEditorPluginFunctionOptionalConfigDefinition<"analytics", {
+                pluginConfiguration: import("@atlaskit/editor-plugin-analytics").AnalyticsPluginOptions;
+                sharedState: {
+                    createAnalyticsEvent: import("@atlaskit/analytics-next").CreateUIAnalyticsEvent | null;
+                    attachAnalyticsEvent: import("@atlaskit/editor-plugin-analytics").CreateAttachPayloadIntoTransaction | null;
+                    performanceTracking: import("@atlaskit/editor-common/types").PerformanceTracking | undefined;
+                };
+                dependencies: [OptionalPlugin<import("@atlaskit/editor-common/types").NextEditorPluginFunctionOptionalConfigDefinition<"featureFlags", {
+                    pluginConfiguration: FeatureFlags;
+                    sharedState: FeatureFlags;
+                }, FeatureFlags>>];
+                actions: EditorAnalyticsAPI;
+            }, import("@atlaskit/editor-plugin-analytics").AnalyticsPluginOptions>>];
+            sharedState: {
+                activeParticipants: import("@atlaskit/editor-plugin-collab-edit").ReadOnlyParticipants | undefined;
+                sessionId: string | undefined;
+            } | undefined;
+            actions: {
+                getAvatarColor: (str: string) => {
+                    index: number;
+                    color: import("@atlaskit/editor-common/collab").Color;
+                };
+            };
+        }, import("@atlaskit/editor-plugin-collab-edit").PrivateCollabEditOptions>>]> | undefined;
+    } & CollabInviteToEditProps & WrappedComponentProps<"intl">>;
+};
+export default _default;

package/dist/types/plugins/avatar-group/ui/avatars.d.ts

@@ -0,0 +1,17 @@
+/** @jsx jsx */
+import React from 'react';
+import type { EditorView } from '@atlaskit/editor-prosemirror/view';
+import type { CollabEditPlugin, ReadOnlyParticipants } from '@atlaskit/editor-plugin-collab-edit';
+import type { CollabParticipant } from '@atlaskit/editor-common/collab';
+import type { FeatureFlags, OptionalPlugin, PublicPluginAPI } from '@atlaskit/editor-common/types';
+import { type EditorAnalyticsAPI } from '@atlaskit/editor-common/analytics';
+export interface AvatarsProps {
+    sessionId?: string;
+    participants: ReadOnlyParticipants | undefined;
+    editorView?: EditorView;
+    featureFlags: FeatureFlags;
+    editorAnalyticsAPI: EditorAnalyticsAPI | undefined;
+    editorAPI: PublicPluginAPI<[OptionalPlugin<CollabEditPlugin>]> | undefined;
+}
+export declare const scrollToCollabCursor: (editorView: EditorView, participants: CollabParticipant[], sessionId: string | undefined, index: number, editorAnalyticsAPI: EditorAnalyticsAPI | undefined) => void;
+export declare const Avatars: React.FC<AvatarsProps>;

package/dist/types/plugins/avatar-group/ui/colored-avatar-item.d.ts

@@ -0,0 +1,10 @@
+/** @jsx jsx */
+import { jsx } from '@emotion/react';
+import type { OptionalPlugin, PublicPluginAPI } from '@atlaskit/editor-common/types';
+import type { CollabEditPlugin } from '@atlaskit/editor-plugin-collab-edit';
+export interface ColoredAvatarItemProps {
+    sessionId: string;
+    name: string;
+    api: PublicPluginAPI<[OptionalPlugin<CollabEditPlugin>]> | undefined;
+}
+export declare const ColoredAvatarItem: (props: ColoredAvatarItemProps) => jsx.JSX.Element;

package/dist/{types-ts4.5/plugins/collab-edit → types/plugins/avatar-group}/ui/invite-to-edit.d.ts

@@ -1,6 +1,6 @@
 /** @jsx jsx */
 import React from 'react';
-import { InviteToEditComponentProps } from '../types';
+import type { InviteToEditComponentProps } from '@atlaskit/editor-plugin-collab-edit';
 export interface InviteToEditButtonProps {
     onClick?: React.MouseEventHandler;
     selected?: boolean;