@atlaskit/editor-common 118.11.0 → 118.12.0

package/dist/es2019/ui/Mention/mention-with-providers.js

@@ -1,15 +1,54 @@
-import React, { useLayoutEffect, useRef, useState } from 'react';
+import _extends from "@babel/runtime/helpers/extends";
+import React, { useEffect, useLayoutEffect, useMemo, useRef, useState } from 'react';
 import { ResourcedMention } from '@atlaskit/mention/element';
 import ResourcedMentionWithProfilecard from './mention-with-profilecard';
 const GENERIC_USER_IDS = ['HipChat', 'all', 'here'];
+const useMentionNodeData = ({
+  id,
+  mentionNodeDataProvider,
+  userType
+}) => {
+  var _state$data;
+  const mention = useMemo(() => ({
+    id,
+    userType
+  }), [id, userType]);
+  const mentionKey = `${userType !== null && userType !== void 0 ? userType : 'DEFAULT'}:${id}`;
+  const synchronousData = useMemo(() => mentionNodeDataProvider.getMentionDataFromCache(mention), [mention, mentionNodeDataProvider]);
+  const [state, setState] = useState(() => ({
+    data: synchronousData,
+    key: mentionKey
+  }));
+  const data = state.key === mentionKey ? (_state$data = state.data) !== null && _state$data !== void 0 ? _state$data : synchronousData : synchronousData;
+  useEffect(() => {
+    if (synchronousData) {
+      return;
+    }
+    let isActive = true;
+    mentionNodeDataProvider.getMentionData(mention, payload => {
+      if (isActive && payload.data) {
+        setState({
+          data: payload.data,
+          key: mentionKey
+        });
+      }
+    });
+    return () => {
+      isActive = false;
+    };
+  }, [mention, mentionKey, mentionNodeDataProvider, synchronousData]);
+  return data;
+};
 export const MentionWithProviders = /*#__PURE__*/React.memo(({
   accessLevel,
   disabledTooltip,
   eventHandlers,
   id,
   isDisabled,
+  mentionNodeData,
   mentionProvider,
   profilecardProvider: profilecardProviderResolver,
+  renderAvatarSlot = false,
   text,
   localId,
   userType
@@ -49,11 +88,15 @@ export const MentionWithProviders = /*#__PURE__*/React.memo(({
       accessLevel: accessLevel,
       localId: localId,
       mentionProvider: mentionProvider,
+      appType: mentionNodeData === null || mentionNodeData === void 0 ? void 0 : mentionNodeData.appType,
+      avatarUrl: mentionNodeData === null || mentionNodeData === void 0 ? void 0 : mentionNodeData.avatarUrl,
+      isAvatarImagePreShaped: mentionNodeData === null || mentionNodeData === void 0 ? void 0 : mentionNodeData.isAvatarImagePreShaped,
       isDisabled: true,
       disabledTooltip: disabledTooltip,
       onClick: eventHandlers === null || eventHandlers === void 0 ? void 0 : eventHandlers.onClick,
       onMouseEnter: eventHandlers === null || eventHandlers === void 0 ? void 0 : eventHandlers.onMouseEnter,
       onMouseLeave: eventHandlers === null || eventHandlers === void 0 ? void 0 : eventHandlers.onMouseLeave,
+      renderAvatarSlot: renderAvatarSlot,
       ssrPlaceholderId: ssrPlaceholderId
     });
   }
@@ -63,7 +106,10 @@ export const MentionWithProviders = /*#__PURE__*/React.memo(({
     accessLevel: accessLevel,
     localId: localId,
     userType: userType,
-    mentionProvider: mentionProvider
+    mentionProvider: mentionProvider,
+    appType: mentionNodeData === null || mentionNodeData === void 0 ? void 0 : mentionNodeData.appType,
+    avatarUrl: mentionNodeData === null || mentionNodeData === void 0 ? void 0 : mentionNodeData.avatarUrl,
+    isAvatarImagePreShaped: mentionNodeData === null || mentionNodeData === void 0 ? void 0 : mentionNodeData.isAvatarImagePreShaped
     // Ignored via go/ees005
     // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
     ,
@@ -71,6 +117,27 @@ export const MentionWithProviders = /*#__PURE__*/React.memo(({
     onClick: eventHandlers === null || eventHandlers === void 0 ? void 0 : eventHandlers.onClick,
     onMouseEnter: eventHandlers === null || eventHandlers === void 0 ? void 0 : eventHandlers.onMouseEnter,
     onMouseLeave: eventHandlers === null || eventHandlers === void 0 ? void 0 : eventHandlers.onMouseLeave,
+    renderAvatarSlot: renderAvatarSlot,
     ssrPlaceholderId: ssrPlaceholderId
   });
+});
+export const MentionWithAvatarProviders = /*#__PURE__*/React.memo(({
+  id,
+  mentionNodeDataProvider,
+  userType,
+  ...props
+}) => {
+  const mentionNodeData = useMentionNodeData({
+    id,
+    mentionNodeDataProvider,
+    userType
+  });
+  return /*#__PURE__*/React.createElement(MentionWithProviders
+  // eslint-disable-next-line react/jsx-props-no-spreading -- The treatment adds only resolved avatar data to the existing mention props.
+  , _extends({}, props, {
+    id: id,
+    mentionNodeData: mentionNodeData,
+    renderAvatarSlot: true,
+    userType: userType
+  }));
 });

package/dist/esm/core-utils/index.js

@@ -3,5 +3,4 @@
 
 export { insideTable } from './inside';
 export { getDocStructure } from './document-logger';
-export { isSSR } from './is-ssr';
-export { isSSRStreaming } from './is-ssr-streaming';
+export { isSSR } from './is-ssr';

package/dist/esm/extensibility/ExtensionSSRReactContextsProvider.js

@@ -1,11 +1,10 @@
 import React from 'react';
 import { RawIntlProvider } from 'react-intl';
 import { isSSR } from '../core-utils/is-ssr';
-import { isSSRStreaming } from '../core-utils/is-ssr-streaming';
 export function ExtensionSSRReactContextsProvider(_ref) {
   var children = _ref.children,
     intl = _ref.intl;
-  if (!isSSR() || !isSSRStreaming()) {
+  if (!isSSR()) {
     return children;
   }
   if (!intl) {

package/dist/esm/monitoring/error.js

@@ -20,7 +20,7 @@ var NETWORK_FAILURE_REGEX = /^network failure/i;
 var RESIZE_OBSERVER_LOOP_REGEX = /ResizeObserver loop completed with undelivered notifications/;
 var SENTRY_DSN = 'https://0b10c8e02fb44d8796c047b102c9bee8@o55978.ingest.sentry.io/4505129224110080';
 var packageName = 'editor-common'; // Sentry doesn't accept '/' in its releases https://docs.sentry.io/platforms/javascript/configuration/releases/
-var packageVersion = "118.10.3";
+var packageVersion = "118.11.0";
 var sanitiseSentryEvents = function sanitiseSentryEvents(data, _hint) {
   // Remove URL as it has UGC
   // Ignored via go/ees007

package/dist/esm/portal/common.js

@@ -1,7 +1,6 @@
 import React, { memo } from 'react';
 import { createPortal } from 'react-dom';
 import { isSSR } from '../core-utils/is-ssr';
-import { isSSRStreaming } from '../core-utils/is-ssr-streaming';
 import { PortalRenderWrapperInner } from './PortalRenderWrapperInner';
 var PortalRenderWrapper = /*#__PURE__*/memo(PortalRenderWrapperInner);
 PortalRenderWrapper.displayName = 'PortalRenderWrapper';
@@ -39,7 +38,7 @@ export var getPortalProviderAPI = function getPortalProviderAPI(portalManager) {
   return {
     render: function render(children, container, key, onBeforeReactDomRender) {
       var immediate = arguments.length > 4 && arguments[4] !== undefined ? arguments[4] : false;
-      if (isSSR() && isSSRStreaming()) {
+      if (isSSR()) {
         var html = '';
         try {
           var renderToStaticMarkup = getRenderToStaticMarkup();
@@ -72,7 +71,7 @@ export var getPortalProviderAPI = function getPortalProviderAPI(portalManager) {
     },
     remove: function remove(key) {
       var _portalsMap$get;
-      if (isSSR() && isSSRStreaming()) {
+      if (isSSR()) {
         return;
       }
       (_portalsMap$get = portalsMap.get(key)) === null || _portalsMap$get === void 0 || _portalsMap$get();

package/dist/esm/react-node-view/NodeViewContentHole.js

@@ -1,7 +1,6 @@
 import _extends from "@babel/runtime/helpers/extends";
 import React, { forwardRef } from 'react';
 import { isSSR } from '../core-utils/is-ssr';
-import { isSSRStreaming } from '../core-utils/is-ssr-streaming';
 
 /**
  * A component that serves as a placeholder for the content DOM of a ProseMirror NodeView.
@@ -10,6 +9,6 @@ import { isSSRStreaming } from '../core-utils/is-ssr-streaming';
 export var NodeViewContentHole = /*#__PURE__*/forwardRef(function (props, ref) {
   return /*#__PURE__*/React.createElement("div", _extends({}, props, {
     ref: ref,
-    "data-ssr-content-dom-ref": isSSR() && isSSRStreaming() ? '' : undefined
+    "data-ssr-content-dom-ref": isSSR() ? '' : undefined
   }));
 });

package/dist/esm/react-node-view/index.js

@@ -7,7 +7,7 @@ import _defineProperty from "@babel/runtime/helpers/defineProperty";
 
 import React from 'react';
 import { ACTION_SUBJECT, ACTION_SUBJECT_ID } from '../analytics';
-import { isSSR, isSSRStreaming } from '../core-utils';
+import { isSSR } from '../core-utils';
 import { createDispatch } from '../event-dispatcher';
 import { ErrorBoundary } from '../ui/ErrorBoundary';
 import { getPerformanceOptions, startMeasureReactNodeViewRendered, stopMeasureReactNodeViewRendered } from '../utils';
@@ -99,7 +99,7 @@ var ReactNodeView = /*#__PURE__*/function () {
         // contentDOMWrapper that was appended above. The React ref callback
         // (forwardRef) never fires in renderToStaticMarkup, so contentDOM is
         // left detached. Re-attach it by finding the marked SSR ref target.
-        if (isSSR() && isSSRStreaming() && this.domRef) {
+        if (isSSR() && this.domRef) {
           var refTarget = this.domRef.querySelector('[data-ssr-content-dom-ref]');
           if (refTarget) {
             this.handleRef(refTarget);

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

@@ -21,7 +21,7 @@ import withAnalyticsEvents from '@atlaskit/analytics-next/withAnalyticsEvents';
 import { fg } from '@atlaskit/platform-feature-flags';
 import Layer from '../Layer';
 var packageName = "@atlaskit/editor-common";
-var packageVersion = "118.10.3";
+var packageVersion = "118.11.0";
 var halfFocusRing = 1;
 var dropOffset = '0, 8';
 var fadeIn = keyframes({

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

@@ -8,10 +8,12 @@ function _callSuper(t, o, e) { return o = _getPrototypeOf(o), _possibleConstruct
 function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); } catch (t) {} return (_isNativeReflectConstruct = function _isNativeReflectConstruct() { return !!t; })(); }
 /* eslint-disable @repo/internal/react/no-class-components */
 import React, { PureComponent } from 'react';
+import { isExperimentEnabled } from '@atlaskit/platform-feature-experiments/is-experiment-enabled';
 import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
 import { ProviderFactory, WithProviders } from '../../provider-factory';
-import { MentionWithProviders } from './mention-with-providers';
+import { MentionWithAvatarProviders, MentionWithProviders } from './mention-with-providers';
 var MENTION_PROVIDERS = ['mentionProvider', 'profilecardProvider'];
+var GENERIC_MENTION_IDS = ['HipChat', 'all', 'here'];
 var Mention = /*#__PURE__*/function (_PureComponent) {
   function Mention(props) {
     var _this;
@@ -26,9 +28,26 @@ var Mention = /*#__PURE__*/function (_PureComponent) {
         localId = _this$props.localId,
         userType = _this$props.userType,
         isDisabled = _this$props.isDisabled,
-        disabledTooltip = _this$props.disabledTooltip;
+        disabledTooltip = _this$props.disabledTooltip,
+        mentionNodeDataProvider = _this$props.mentionNodeDataProvider;
       var mentionProvider = providers.mentionProvider,
         profilecardProvider = providers.profilecardProvider;
+      var isAvatarEnabled = Boolean(mentionNodeDataProvider) && userType !== 'SPECIAL' && !GENERIC_MENTION_IDS.includes(id) && isExperimentEnabled('platform_editor_mention_node_avatar');
+      if (isAvatarEnabled && mentionNodeDataProvider) {
+        return /*#__PURE__*/React.createElement(MentionWithAvatarProviders, {
+          id: id,
+          text: text,
+          accessLevel: accessLevel,
+          localId: localId,
+          userType: userType,
+          isDisabled: isDisabled,
+          disabledTooltip: disabledTooltip,
+          eventHandlers: eventHandlers,
+          mentionProvider: mentionProvider,
+          mentionNodeDataProvider: mentionNodeDataProvider,
+          profilecardProvider: profilecardProvider
+        });
+      }
       return /*#__PURE__*/React.createElement(MentionWithProviders, {
         id: id,
         text: text,

package/dist/esm/ui/Mention/mention-node-data-provider.js

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

package/dist/esm/ui/Mention/mention-with-profilecard.js

@@ -37,11 +37,15 @@ export default function MentionWithProfileCard(_ref) {
     id = _ref.id,
     text = _ref.text,
     accessLevel = _ref.accessLevel,
+    appType = _ref.appType,
+    avatarUrl = _ref.avatarUrl,
+    isAvatarImagePreShaped = _ref.isAvatarImagePreShaped,
     mentionProvider = _ref.mentionProvider,
     profilecardProvider = _ref.profilecardProvider,
     onClick = _ref.onClick,
     onMouseEnter = _ref.onMouseEnter,
     onMouseLeave = _ref.onMouseLeave,
+    renderAvatarSlot = _ref.renderAvatarSlot,
     localId = _ref.localId,
     ssrPlaceholderId = _ref.ssrPlaceholderId,
     userType = _ref.userType;
@@ -55,11 +59,15 @@ export default function MentionWithProfileCard(_ref) {
     id: id,
     text: text,
     accessLevel: accessLevel,
+    appType: appType,
+    avatarUrl: avatarUrl,
+    isAvatarImagePreShaped: isAvatarImagePreShaped,
     localId: localId,
     mentionProvider: mentionProvider,
     onClick: onClick,
     onMouseEnter: onMouseEnter,
     onMouseLeave: onMouseLeave,
+    renderAvatarSlot: renderAvatarSlot,
     ssrPlaceholderId: ssrPlaceholderId
   });
 

package/dist/esm/ui/Mention/mention-with-providers.js

@@ -1,23 +1,73 @@
+import _extends from "@babel/runtime/helpers/extends";
+import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
 import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
-import React, { useLayoutEffect, useRef, useState } from 'react';
+var _excluded = ["id", "mentionNodeDataProvider", "userType"];
+import React, { useEffect, useLayoutEffect, useMemo, useRef, useState } from 'react';
 import { ResourcedMention } from '@atlaskit/mention/element';
 import ResourcedMentionWithProfilecard from './mention-with-profilecard';
 var GENERIC_USER_IDS = ['HipChat', 'all', 'here'];
-export var MentionWithProviders = /*#__PURE__*/React.memo(function (_ref) {
-  var accessLevel = _ref.accessLevel,
-    disabledTooltip = _ref.disabledTooltip,
-    eventHandlers = _ref.eventHandlers,
-    id = _ref.id,
-    isDisabled = _ref.isDisabled,
-    mentionProvider = _ref.mentionProvider,
-    profilecardProviderResolver = _ref.profilecardProvider,
-    text = _ref.text,
-    localId = _ref.localId,
+var useMentionNodeData = function useMentionNodeData(_ref) {
+  var _state$data;
+  var id = _ref.id,
+    mentionNodeDataProvider = _ref.mentionNodeDataProvider,
     userType = _ref.userType;
-  var _useState = useState(null),
+  var mention = useMemo(function () {
+    return {
+      id: id,
+      userType: userType
+    };
+  }, [id, userType]);
+  var mentionKey = "".concat(userType !== null && userType !== void 0 ? userType : 'DEFAULT', ":").concat(id);
+  var synchronousData = useMemo(function () {
+    return mentionNodeDataProvider.getMentionDataFromCache(mention);
+  }, [mention, mentionNodeDataProvider]);
+  var _useState = useState(function () {
+      return {
+        data: synchronousData,
+        key: mentionKey
+      };
+    }),
     _useState2 = _slicedToArray(_useState, 2),
-    profilecardProvider = _useState2[0],
-    setProfilecardProvider = _useState2[1];
+    state = _useState2[0],
+    setState = _useState2[1];
+  var data = state.key === mentionKey ? (_state$data = state.data) !== null && _state$data !== void 0 ? _state$data : synchronousData : synchronousData;
+  useEffect(function () {
+    if (synchronousData) {
+      return;
+    }
+    var isActive = true;
+    mentionNodeDataProvider.getMentionData(mention, function (payload) {
+      if (isActive && payload.data) {
+        setState({
+          data: payload.data,
+          key: mentionKey
+        });
+      }
+    });
+    return function () {
+      isActive = false;
+    };
+  }, [mention, mentionKey, mentionNodeDataProvider, synchronousData]);
+  return data;
+};
+export var MentionWithProviders = /*#__PURE__*/React.memo(function (_ref2) {
+  var accessLevel = _ref2.accessLevel,
+    disabledTooltip = _ref2.disabledTooltip,
+    eventHandlers = _ref2.eventHandlers,
+    id = _ref2.id,
+    isDisabled = _ref2.isDisabled,
+    mentionNodeData = _ref2.mentionNodeData,
+    mentionProvider = _ref2.mentionProvider,
+    profilecardProviderResolver = _ref2.profilecardProvider,
+    _ref2$renderAvatarSlo = _ref2.renderAvatarSlot,
+    renderAvatarSlot = _ref2$renderAvatarSlo === void 0 ? false : _ref2$renderAvatarSlo,
+    text = _ref2.text,
+    localId = _ref2.localId,
+    userType = _ref2.userType;
+  var _useState3 = useState(null),
+    _useState4 = _slicedToArray(_useState3, 2),
+    profilecardProvider = _useState4[0],
+    setProfilecardProvider = _useState4[1];
   var mountedRef = useRef(true);
   useLayoutEffect(function () {
     mountedRef.current = true;
@@ -52,11 +102,15 @@ export var MentionWithProviders = /*#__PURE__*/React.memo(function (_ref) {
       accessLevel: accessLevel,
       localId: localId,
       mentionProvider: mentionProvider,
+      appType: mentionNodeData === null || mentionNodeData === void 0 ? void 0 : mentionNodeData.appType,
+      avatarUrl: mentionNodeData === null || mentionNodeData === void 0 ? void 0 : mentionNodeData.avatarUrl,
+      isAvatarImagePreShaped: mentionNodeData === null || mentionNodeData === void 0 ? void 0 : mentionNodeData.isAvatarImagePreShaped,
       isDisabled: true,
       disabledTooltip: disabledTooltip,
       onClick: eventHandlers === null || eventHandlers === void 0 ? void 0 : eventHandlers.onClick,
       onMouseEnter: eventHandlers === null || eventHandlers === void 0 ? void 0 : eventHandlers.onMouseEnter,
       onMouseLeave: eventHandlers === null || eventHandlers === void 0 ? void 0 : eventHandlers.onMouseLeave,
+      renderAvatarSlot: renderAvatarSlot,
       ssrPlaceholderId: ssrPlaceholderId
     });
   }
@@ -66,7 +120,10 @@ export var MentionWithProviders = /*#__PURE__*/React.memo(function (_ref) {
     accessLevel: accessLevel,
     localId: localId,
     userType: userType,
-    mentionProvider: mentionProvider
+    mentionProvider: mentionProvider,
+    appType: mentionNodeData === null || mentionNodeData === void 0 ? void 0 : mentionNodeData.appType,
+    avatarUrl: mentionNodeData === null || mentionNodeData === void 0 ? void 0 : mentionNodeData.avatarUrl,
+    isAvatarImagePreShaped: mentionNodeData === null || mentionNodeData === void 0 ? void 0 : mentionNodeData.isAvatarImagePreShaped
     // Ignored via go/ees005
     // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
     ,
@@ -74,6 +131,26 @@ export var MentionWithProviders = /*#__PURE__*/React.memo(function (_ref) {
     onClick: eventHandlers === null || eventHandlers === void 0 ? void 0 : eventHandlers.onClick,
     onMouseEnter: eventHandlers === null || eventHandlers === void 0 ? void 0 : eventHandlers.onMouseEnter,
     onMouseLeave: eventHandlers === null || eventHandlers === void 0 ? void 0 : eventHandlers.onMouseLeave,
+    renderAvatarSlot: renderAvatarSlot,
     ssrPlaceholderId: ssrPlaceholderId
   });
+});
+export var MentionWithAvatarProviders = /*#__PURE__*/React.memo(function (_ref3) {
+  var id = _ref3.id,
+    mentionNodeDataProvider = _ref3.mentionNodeDataProvider,
+    userType = _ref3.userType,
+    props = _objectWithoutProperties(_ref3, _excluded);
+  var mentionNodeData = useMentionNodeData({
+    id: id,
+    mentionNodeDataProvider: mentionNodeDataProvider,
+    userType: userType
+  });
+  return /*#__PURE__*/React.createElement(MentionWithProviders
+  // eslint-disable-next-line react/jsx-props-no-spreading -- The treatment adds only resolved avatar data to the existing mention props.
+  , _extends({}, props, {
+    id: id,
+    mentionNodeData: mentionNodeData,
+    renderAvatarSlot: true,
+    userType: userType
+  }));
 });

package/dist/types/core-utils/index.d.ts

@@ -1,4 +1,3 @@
 export { insideTable } from './inside';
 export { getDocStructure } from './document-logger';
 export { isSSR } from './is-ssr';
-export { isSSRStreaming } from './is-ssr-streaming';

package/dist/types/mention.d.ts

@@ -1,3 +1,4 @@
 export { default as Mention } from './ui/Mention';
+export type { MentionNodeDataCallback, MentionNodeDataIdentifier, MentionNodeDataProvider, MentionNodeDataUserType, } from './ui/Mention/mention-node-data-provider';
 export { MentionSharedCssClassName } from './styles/shared/mention';
 export { default as MentionWithProfileCard } from './ui/Mention/mention-with-profilecard';

package/dist/types/ui/Mention/index.d.ts

@@ -3,6 +3,7 @@ import type { MentionUserType } from '@atlaskit/adf-schema';
 import { ProviderFactory } from '../../provider-factory';
 import type { ProfilecardProvider } from '../../provider-factory/profile-card-provider';
 import type { MentionEventHandlers } from '../EventHandlers';
+import type { MentionNodeDataProvider } from './mention-node-data-provider';
 export interface MentionProps {
     accessLevel?: string;
     disabledTooltip?: string;
@@ -10,6 +11,7 @@ export interface MentionProps {
     id: string;
     isDisabled?: boolean;
     localId?: string;
+    mentionNodeDataProvider?: MentionNodeDataProvider;
     providers?: ProviderFactory;
     text: string;
     userType?: MentionUserType;

package/dist/types/ui/Mention/mention-node-data-provider.d.ts

@@ -0,0 +1,32 @@
+import type { MentionUserType } from '@atlaskit/adf-schema/mention';
+import type { MentionNodeData } from '@atlaskit/mention/types';
+export type MentionNodeDataCallback = (payload: {
+    data: MentionNodeData;
+    error?: undefined;
+} | {
+    data?: undefined;
+    error: Error;
+}) => void;
+/** `AGENT` is emitted by editor agent sources at runtime but is not serialized as an ADF user type. */
+export type MentionNodeDataUserType = MentionUserType | 'AGENT';
+export interface MentionNodeDataIdentifier {
+    id: string;
+    userType?: MentionNodeDataUserType;
+}
+/**
+ * Product-facing bridge between mention data resolution and mention UI.
+ *
+ * Create one provider per renderer or editor instance and pass it through the
+ * renderer props or mentions plugin options. `getMentionDataFromCache` is used
+ * during render, including SSR, so it must never start a network request.
+ * Deterministic products may return data from it synchronously; network-backed
+ * products should return cached data or `undefined`, then resolve through
+ * `getMentionData` on the client.
+ *
+ * The UI depends only on these mention-specific methods to avoid a package
+ * cycle with the reusable implementation in editor-plugin-mentions.
+ */
+export interface MentionNodeDataProvider {
+    getMentionData: (mention: MentionNodeDataIdentifier, callback: MentionNodeDataCallback) => void;
+    getMentionDataFromCache: (mention: MentionNodeDataIdentifier) => MentionNodeData | undefined;
+}

package/dist/types/ui/Mention/mention-with-profilecard.d.ts

@@ -5,14 +5,18 @@ import type { ProfilecardProvider } from '../../provider-factory/profile-card-pr
 import type { MentionEventHandler } from '../EventHandlers';
 export interface Props {
     accessLevel?: string;
+    appType?: string | null;
     autoFocus?: boolean;
+    avatarUrl?: string;
     id: string;
+    isAvatarImagePreShaped?: boolean;
     localId?: string;
     mentionProvider?: Promise<MentionProvider>;
     onClick?: MentionEventHandler;
     onMouseEnter?: MentionEventHandler;
     onMouseLeave?: MentionEventHandler;
     profilecardProvider: ProfilecardProvider;
+    renderAvatarSlot?: boolean;
     ssrPlaceholderId?: string;
     text: string;
     userType?: MentionUserType;
@@ -22,4 +26,4 @@ export interface Props {
  * 1. Agent mentions (`userType === 'APP'`, behind the `rovo_chat_mention_agents` experiment) open the Rovo agent profile card on click.
  * 2. Otherwise renders the person profile card (either via the provider's `renderUserMentionCard`/link fallback or the default user `ProfileCardTrigger`).
  */
-export default function MentionWithProfileCard({ autoFocus, id, text, accessLevel, mentionProvider, profilecardProvider, onClick, onMouseEnter, onMouseLeave, localId, ssrPlaceholderId, userType, }: Props): React.JSX.Element;
+export default function MentionWithProfileCard({ autoFocus, id, text, accessLevel, appType, avatarUrl, isAvatarImagePreShaped, mentionProvider, profilecardProvider, onClick, onMouseEnter, onMouseLeave, renderAvatarSlot, localId, ssrPlaceholderId, userType, }: Props): React.JSX.Element;

package/dist/types/ui/Mention/mention-with-providers.d.ts

@@ -1,8 +1,10 @@
 import React from 'react';
 import type { MentionUserType } from '@atlaskit/adf-schema';
 import type { MentionProvider } from '@atlaskit/mention/resource';
+import type { MentionNodeData } from '@atlaskit/mention/types';
 import type { ProfilecardProvider } from '../../provider-factory/profile-card-provider';
 import type { MentionEventHandlers } from '../EventHandlers';
+import type { MentionNodeDataProvider } from './mention-node-data-provider';
 export interface Props {
     accessLevel?: string;
     disabledTooltip?: string;
@@ -10,12 +12,20 @@ export interface Props {
     id: string;
     isDisabled?: boolean;
     localId?: string;
+    mentionNodeDataProvider?: MentionNodeDataProvider;
     mentionProvider?: Promise<MentionProvider>;
     profilecardProvider?: Promise<ProfilecardProvider>;
     text: string;
     userType?: MentionUserType;
 }
+export interface MentionWithProvidersProps extends Props {
+    mentionNodeData?: MentionNodeData;
+    renderAvatarSlot?: boolean;
+}
 export interface State {
     profilecardProvider: ProfilecardProvider | null;
 }
-export declare const MentionWithProviders: React.MemoExoticComponent<({ accessLevel, eventHandlers, id, mentionProvider, profilecardProvider, text, localId, }: Props) => React.JSX.Element>;
+export declare const MentionWithProviders: React.MemoExoticComponent<(props: MentionWithProvidersProps) => React.JSX.Element>;
+export declare const MentionWithAvatarProviders: React.MemoExoticComponent<(props: Props & {
+    mentionNodeDataProvider: MentionNodeDataProvider;
+}) => React.JSX.Element>;

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@atlaskit/editor-common",
-	"version": "118.11.0",
+	"version": "118.12.0",
 	"description": "A package that contains common classes and components for editor and renderer",
 	"publishConfig": {
 		"registry": "https://registry.npmjs.org/"
@@ -64,7 +64,7 @@
 		"@atlaskit/media-picker": "^72.1.0",
 		"@atlaskit/media-ui": "^30.11.0",
 		"@atlaskit/media-viewer": "^54.5.0",
-		"@atlaskit/mention": "^27.15.0",
+		"@atlaskit/mention": "^27.16.0",
 		"@atlaskit/menu": "^10.0.0",
 		"@atlaskit/object": "^2.2.0",
 		"@atlaskit/onboarding": "^15.1.0",
@@ -84,7 +84,7 @@
 		"@atlaskit/task-decision": "^21.8.0",
 		"@atlaskit/teams-app-config": "^2.2.0",
 		"@atlaskit/textfield": "^10.0.0",
-		"@atlaskit/tmp-editor-statsig": "^147.0.0",
+		"@atlaskit/tmp-editor-statsig": "^147.1.0",
 		"@atlaskit/tokens": "^16.7.0",
 		"@atlaskit/tooltip": "^24.0.0",
 		"@atlaskit/width-detector": "^7.0.0",
@@ -266,5 +266,11 @@
 		"platform_editor_embed_height_only_fallback": {
 			"type": "boolean"
 		}
+	},
+	"platform-experiments": {
+		"platform_editor_mention_node_avatar": {
+			"param": "isEnabled",
+			"defaultValue": false
+		}
 	}
 }

package/dist/cjs/core-utils/is-ssr-streaming.js

@@ -1,22 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.isSSRStreaming = isSSRStreaming;
-var _expValEquals = require("@atlaskit/tmp-editor-statsig/exp-val-equals");
-/** Returns true if React SSR streaming is actually active at runtime. */
-function isSSRStreaming() {
-  try {
-    var _process$env;
-    var isSSRRendered =
-    // In most places there is no document when running on server-side
-    // eslint-disable-next-line @atlaskit/platform/no-direct-document-usage
-    typeof document === 'undefined' || typeof process !== 'undefined' && ((_process$env = process.env) === null || _process$env === void 0 ? void 0 : _process$env.REACT_SSR) || typeof window !== 'undefined' && window.__SSR_RENDERED__ || globalThis.__SSR_RENDERED__;
-    var isSSRReactStreaming = typeof window !== 'undefined' && window.__SSR_REACT_STREAMING__ || globalThis.__SSR_REACT_STREAMING__;
-    return Boolean(isSSRRendered) && (0, _expValEquals.expValEquals)('platform_editor_editor_ssr_streaming', 'isEnabled', true) && Boolean(isSSRReactStreaming);
-  } catch (_unused) {
-    // Catch possible error that might occur and just return false
-    return false;
-  }
-}

package/dist/es2019/core-utils/is-ssr-streaming.js

@@ -1,16 +0,0 @@
-import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
-/** Returns true if React SSR streaming is actually active at runtime. */
-export function isSSRStreaming() {
-  try {
-    var _process$env;
-    const isSSRRendered =
-    // In most places there is no document when running on server-side
-    // eslint-disable-next-line @atlaskit/platform/no-direct-document-usage
-    typeof document === 'undefined' || typeof process !== 'undefined' && ((_process$env = process.env) === null || _process$env === void 0 ? void 0 : _process$env.REACT_SSR) || typeof window !== 'undefined' && window.__SSR_RENDERED__ || globalThis.__SSR_RENDERED__;
-    const isSSRReactStreaming = typeof window !== 'undefined' && window.__SSR_REACT_STREAMING__ || globalThis.__SSR_REACT_STREAMING__;
-    return Boolean(isSSRRendered) && expValEquals('platform_editor_editor_ssr_streaming', 'isEnabled', true) && Boolean(isSSRReactStreaming);
-  } catch {
-    // Catch possible error that might occur and just return false
-    return false;
-  }
-}

package/dist/esm/core-utils/is-ssr-streaming.js

@@ -1,16 +0,0 @@
-import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
-/** Returns true if React SSR streaming is actually active at runtime. */
-export function isSSRStreaming() {
-  try {
-    var _process$env;
-    var isSSRRendered =
-    // In most places there is no document when running on server-side
-    // eslint-disable-next-line @atlaskit/platform/no-direct-document-usage
-    typeof document === 'undefined' || typeof process !== 'undefined' && ((_process$env = process.env) === null || _process$env === void 0 ? void 0 : _process$env.REACT_SSR) || typeof window !== 'undefined' && window.__SSR_RENDERED__ || globalThis.__SSR_RENDERED__;
-    var isSSRReactStreaming = typeof window !== 'undefined' && window.__SSR_REACT_STREAMING__ || globalThis.__SSR_REACT_STREAMING__;
-    return Boolean(isSSRRendered) && expValEquals('platform_editor_editor_ssr_streaming', 'isEnabled', true) && Boolean(isSSRReactStreaming);
-  } catch (_unused) {
-    // Catch possible error that might occur and just return false
-    return false;
-  }
-}