@atlaskit/renderer 110.5.4 → 110.6.0

package/CHANGELOG.md

@@ -1,5 +1,28 @@
 # @atlaskit/renderer
 
+## 110.6.0
+
+### Minor Changes
+
+- [#146966](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/146966)
+  [`ee4562a10804e`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/ee4562a10804e) -
+  cleaned up platform_editor_get_emoji_provider_from_config feature flag
+
+### Patch Changes
+
+- Updated dependencies
+
+## 110.5.5
+
+### Patch Changes
+
+- [#146981](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/146981)
+  [`1bb47674cd3df`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/1bb47674cd3df) -
+  [ED-24683] clean up `confluence.frontend.fabric.editor.comments-on-media-media-inline-bug-fix`
+- [#146246](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/146246)
+  [`2a4fc73d45dfd`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/2a4fc73d45dfd) -
+  Reverting change to add onLoadComplete callback for useLoadAnnotations annotations hook
+
 ## 110.5.4
 
 ### Patch Changes

package/dist/cjs/react/index.js

@@ -100,7 +100,7 @@ var ReactSerializer = exports.default = /*#__PURE__*/function () {
           isMediaLink: true
         });
       }
-      if (_this.isCommentsOnMediaMediaInlineBugFixEnabled && node.type.name === 'mediaInline' && mark.type.name === 'annotation') {
+      if (node.type.name === 'mediaInline' && mark.type.name === 'annotation') {
         return _objectSpread(_objectSpread({}, defaultProps), {}, {
           isMediaInline: true
         });
@@ -190,7 +190,6 @@ var ReactSerializer = exports.default = /*#__PURE__*/function () {
     this.allowWindowedCodeBlock = init.allowWindowedCodeBlock;
     this.isInsideOfInlineExtension = init.isInsideOfInlineExtension;
     this.textHighlighter = init.textHighlighter;
-    this.isCommentsOnMediaMediaInlineBugFixEnabled = init.isCommentsOnMediaMediaInlineBugFixEnabled;
     this.allowTableAlignment = init.allowTableAlignment;
     this.allowTableResizing = init.allowTableResizing;
   }

package/dist/cjs/react/nodes/emoji.js

@@ -1,20 +1,102 @@
 "use strict";
 
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
+var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
+var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
+var _assertThisInitialized2 = _interopRequireDefault(require("@babel/runtime/helpers/assertThisInitialized"));
+var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));
+var _possibleConstructorReturn2 = _interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));
+var _getPrototypeOf2 = _interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
 var _react = require("@emotion/react");
 var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
+var _element = require("@atlaskit/emoji/element");
 var _react2 = require("react");
-var _emoji = require("@atlaskit/editor-common/emoji");
+var _providerFactory = require("@atlaskit/editor-common/provider-factory");
 var _useInlineAnnotationProps = require("../../ui/annotations/element/useInlineAnnotationProps");
-/**
+function _createSuper(t) { var r = _isNativeReflectConstruct(); return function () { var e, o = (0, _getPrototypeOf2.default)(t); if (r) { var s = (0, _getPrototypeOf2.default)(this).constructor; e = Reflect.construct(o, arguments, s); } else e = o.apply(this, arguments); return (0, _possibleConstructorReturn2.default)(this, e); }; }
+function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); } catch (t) {} return (_isNativeReflectConstruct = function _isNativeReflectConstruct() { return !!t; })(); } /**
  * @jsxRuntime classic
  * @jsx jsx
- */
-// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
-
+ */ // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
+// eslint-disable-next-line @repo/internal/react/no-class-components
+var EmojiNode = /*#__PURE__*/function (_PureComponent) {
+  (0, _inherits2.default)(EmojiNode, _PureComponent);
+  var _super = _createSuper(EmojiNode);
+  function EmojiNode(props) {
+    var _this;
+    (0, _classCallCheck2.default)(this, EmojiNode);
+    _this = _super.call(this, props);
+    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "renderWithProvider", function (providers) {
+      var _resourceConfig$optim;
+      var _this$props = _this.props,
+        allowTextFallback = _this$props.allowTextFallback,
+        shortName = _this$props.shortName,
+        id = _this$props.id,
+        fallback = _this$props.fallback,
+        fitToHeight = _this$props.fitToHeight,
+        showTooltip = _this$props.showTooltip,
+        resourceConfig = _this$props.resourceConfig;
+      if (allowTextFallback && !providers.emojiProvider) {
+        return (0, _react.jsx)("span", {
+          "data-emoji-id": id,
+          "data-emoji-short-name": shortName,
+          "data-emoji-text": fallback || shortName
+        }, fallback || shortName);
+      }
+      if (!providers.emojiProvider) {
+        return null;
+      }
+      return (0, _react.jsx)(_element.ResourcedEmoji, {
+        emojiId: {
+          id: id,
+          fallback: fallback,
+          shortName: shortName
+        },
+        emojiProvider: providers.emojiProvider,
+        showTooltip: showTooltip,
+        fitToHeight: fitToHeight,
+        optimistic: true,
+        optimisticImageURL: resourceConfig === null || resourceConfig === void 0 || (_resourceConfig$optim = resourceConfig.optimisticImageApi) === null || _resourceConfig$optim === void 0 ? void 0 : _resourceConfig$optim.getUrl({
+          id: id,
+          fallback: fallback,
+          shortName: shortName
+        }),
+        editorEmoji: true
+      });
+    });
+    _this.providerFactory = props.providers || new _providerFactory.ProviderFactory();
+    return _this;
+  }
+  (0, _createClass2.default)(EmojiNode, [{
+    key: "componentWillUnmount",
+    value: function componentWillUnmount() {
+      if (!this.props.providers) {
+        // new ProviderFactory is created if no `providers` has been set
+        // in this case when component is unmounted it's safe to destroy this providerFactory
+        this.providerFactory.destroy();
+      }
+    }
+  }, {
+    key: "render",
+    value: function render() {
+      return (0, _react.jsx)(_providerFactory.WithProviders, {
+        providers: ['emojiProvider'],
+        providerFactory: this.providerFactory,
+        renderNode: this.renderWithProvider
+      });
+    }
+  }]);
+  return EmojiNode;
+}(_react2.PureComponent);
+(0, _defineProperty2.default)(EmojiNode, "displayName", 'EmojiNode');
+(0, _defineProperty2.default)(EmojiNode, "defaultProps", {
+  showTooltip: true
+});
 function EmojiItem(props) {
   var id = props.id,
     providers = props.providers,
@@ -24,7 +106,7 @@ function EmojiItem(props) {
     resourceConfig = props.resourceConfig;
   var inlineAnnotationProps = (0, _useInlineAnnotationProps.useInlineAnnotationProps)(props);
   if ((0, _platformFeatureFlags.fg)('editor_inline_comments_on_inline_nodes')) {
-    return (0, _react.jsx)("span", inlineAnnotationProps, (0, _react.jsx)(_emoji.Emoji, {
+    return (0, _react.jsx)("span", inlineAnnotationProps, (0, _react.jsx)(EmojiNode, {
       allowTextFallback: true,
       id: id,
       shortName: shortName,
@@ -34,7 +116,7 @@ function EmojiItem(props) {
       resourceConfig: resourceConfig
     }));
   }
-  return (0, _react.jsx)(_emoji.Emoji, {
+  return (0, _react.jsx)(EmojiNode, {
     allowTextFallback: true,
     id: id,
     shortName: shortName,

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

@@ -63,7 +63,7 @@ function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.
 var NORMAL_SEVERITY_THRESHOLD = exports.NORMAL_SEVERITY_THRESHOLD = 2000;
 var DEGRADED_SEVERITY_THRESHOLD = exports.DEGRADED_SEVERITY_THRESHOLD = 3000;
 var packageName = "@atlaskit/renderer";
-var packageVersion = "110.5.4";
+var packageVersion = "110.6.0";
 var defaultNodeComponents = exports.defaultNodeComponents = _nodes.nodeToReact;
 var Renderer = exports.Renderer = /*#__PURE__*/function (_PureComponent) {
   (0, _inherits2.default)(Renderer, _PureComponent);
@@ -290,7 +290,6 @@ var Renderer = exports.Renderer = /*#__PURE__*/function (_PureComponent) {
         allowWindowedCodeBlock: featureFlags === null || featureFlags === void 0 ? void 0 : featureFlags.allowWindowedCodeBlock,
         isInsideOfInlineExtension: (0, _platformFeatureFlags.fg)('platform.editor.inline_extension.extended_lcqdn') && props.isInsideOfInlineExtension,
         textHighlighter: props.UNSTABLE_textHighlighter,
-        isCommentsOnMediaMediaInlineBugFixEnabled: featureFlags === null || featureFlags === void 0 ? void 0 : featureFlags.commentsOnMediaMediaInlineBugFix,
         allowTableAlignment: props.UNSTABLE_allowTableAlignment,
         allowTableResizing: props.UNSTABLE_allowTableResizing
       };

package/dist/cjs/ui/annotations/hooks/use-load-annotations.js

@@ -14,8 +14,7 @@ function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbol
 function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { (0, _defineProperty2.default)(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 var useLoadAnnotations = exports.useLoadAnnotations = function useLoadAnnotations(_ref) {
   var adfDocument = _ref.adfDocument,
-    isNestedRender = _ref.isNestedRender,
-    onLoadComplete = _ref.onLoadComplete;
+    isNestedRender = _ref.isNestedRender;
   var actions = (0, _react.useContext)(_RendererActionsContext.RendererContext);
   var providers = (0, _react.useContext)(_context.ProvidersContext);
   (0, _react.useEffect)(function () {
@@ -28,9 +27,6 @@ var useLoadAnnotations = exports.useLoadAnnotations = function useLoadAnnotation
     var annotations = actions.getAnnotationMarks();
     // we don't want to request integrators for state with an empty list of ids.
     if (!annotations.length) {
-      onLoadComplete && onLoadComplete({
-        numberOfUnresolvedInlineComments: 0
-      });
       return;
     }
     var ids = annotations.map(function (mark) {
@@ -44,12 +40,7 @@ var useLoadAnnotations = exports.useLoadAnnotations = function useLoadAnnotation
         return _objectSpread(_objectSpread({}, acc), {}, (0, _defineProperty2.default)({}, value.id, value));
       }, {});
       updateSubscriberInlineComment.emit(_types.AnnotationUpdateEvent.SET_ANNOTATION_STATE, payload);
-      onLoadComplete && onLoadComplete({
-        numberOfUnresolvedInlineComments: data.filter(function (data) {
-          return data.state === 'active';
-        }).length
-      });
     };
     inlineCommentGetState(ids, isNestedRender).then(cb);
-  }, [actions, providers, adfDocument, isNestedRender, onLoadComplete]);
+  }, [actions, providers, adfDocument, isNestedRender]);
 };

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

@@ -31,12 +31,10 @@ var _draft = require("./draft");
 var _element = require("./element");
 var LoadAnnotations = /*#__PURE__*/_react.default.memo(function (_ref) {
   var adfDocument = _ref.adfDocument,
-    isNestedRender = _ref.isNestedRender,
-    onLoadComplete = _ref.onLoadComplete;
+    isNestedRender = _ref.isNestedRender;
   (0, _useLoadAnnotations.useLoadAnnotations)({
     adfDocument: adfDocument,
-    isNestedRender: isNestedRender,
-    onLoadComplete: onLoadComplete
+    isNestedRender: isNestedRender
   });
   return null;
 });
@@ -46,8 +44,7 @@ var AnnotationsWrapper = exports.AnnotationsWrapper = function AnnotationsWrappe
     annotationProvider = props.annotationProvider,
     rendererRef = props.rendererRef,
     adfDocument = props.adfDocument,
-    isNestedRender = props.isNestedRender,
-    onLoadComplete = props.onLoadComplete;
+    isNestedRender = props.isNestedRender;
   var updateSubscriber = annotationProvider && annotationProvider.inlineComment && annotationProvider.inlineComment.updateSubscriber;
   var inlineCommentAnnotationsState = (0, _useEvents.useAnnotationStateByTypeEvent)({
     type: _adfSchema.AnnotationTypes.INLINE_COMMENT,
@@ -66,8 +63,7 @@ var AnnotationsWrapper = exports.AnnotationsWrapper = function AnnotationsWrappe
     rendererRef: rendererRef
   }, /*#__PURE__*/_react.default.createElement(LoadAnnotations, {
     adfDocument: adfDocument,
-    isNestedRender: isNestedRender,
-    onLoadComplete: onLoadComplete
+    isNestedRender: isNestedRender
   }), /*#__PURE__*/_react.default.createElement(_view.AnnotationView, {
     createAnalyticsEvent: createAnalyticsEvent
   }), children)))));

package/dist/es2019/react/index.js

@@ -82,7 +82,7 @@ export default class ReactSerializer {
           isMediaLink: true
         };
       }
-      if (this.isCommentsOnMediaMediaInlineBugFixEnabled && node.type.name === 'mediaInline' && mark.type.name === 'annotation') {
+      if (node.type.name === 'mediaInline' && mark.type.name === 'annotation') {
         return {
           ...defaultProps,
           isMediaInline: true
@@ -176,7 +176,6 @@ export default class ReactSerializer {
     this.allowWindowedCodeBlock = init.allowWindowedCodeBlock;
     this.isInsideOfInlineExtension = init.isInsideOfInlineExtension;
     this.textHighlighter = init.textHighlighter;
-    this.isCommentsOnMediaMediaInlineBugFixEnabled = init.isCommentsOnMediaMediaInlineBugFixEnabled;
     this.allowTableAlignment = init.allowTableAlignment;
     this.allowTableResizing = init.allowTableResizing;
   }

package/dist/es2019/react/nodes/emoji.js

@@ -1,3 +1,4 @@
+import _defineProperty from "@babel/runtime/helpers/defineProperty";
 /**
  * @jsxRuntime classic
  * @jsx jsx
@@ -5,9 +6,74 @@
 // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
 import { jsx } from '@emotion/react';
 import { fg } from '@atlaskit/platform-feature-flags';
-import { memo } from 'react';
-import { Emoji } from '@atlaskit/editor-common/emoji';
+import { ResourcedEmoji } from '@atlaskit/emoji/element';
+import { PureComponent, memo } from 'react';
+import { ProviderFactory, WithProviders } from '@atlaskit/editor-common/provider-factory';
 import { useInlineAnnotationProps } from '../../ui/annotations/element/useInlineAnnotationProps';
+// eslint-disable-next-line @repo/internal/react/no-class-components
+class EmojiNode extends PureComponent {
+  constructor(props) {
+    super(props);
+    _defineProperty(this, "renderWithProvider", providers => {
+      var _resourceConfig$optim;
+      const {
+        allowTextFallback,
+        shortName,
+        id,
+        fallback,
+        fitToHeight,
+        showTooltip,
+        resourceConfig
+      } = this.props;
+      if (allowTextFallback && !providers.emojiProvider) {
+        return jsx("span", {
+          "data-emoji-id": id,
+          "data-emoji-short-name": shortName,
+          "data-emoji-text": fallback || shortName
+        }, fallback || shortName);
+      }
+      if (!providers.emojiProvider) {
+        return null;
+      }
+      return jsx(ResourcedEmoji, {
+        emojiId: {
+          id,
+          fallback,
+          shortName
+        },
+        emojiProvider: providers.emojiProvider,
+        showTooltip: showTooltip,
+        fitToHeight: fitToHeight,
+        optimistic: true,
+        optimisticImageURL: resourceConfig === null || resourceConfig === void 0 ? void 0 : (_resourceConfig$optim = resourceConfig.optimisticImageApi) === null || _resourceConfig$optim === void 0 ? void 0 : _resourceConfig$optim.getUrl({
+          id,
+          fallback,
+          shortName
+        }),
+        editorEmoji: true
+      });
+    });
+    this.providerFactory = props.providers || new ProviderFactory();
+  }
+  componentWillUnmount() {
+    if (!this.props.providers) {
+      // new ProviderFactory is created if no `providers` has been set
+      // in this case when component is unmounted it's safe to destroy this providerFactory
+      this.providerFactory.destroy();
+    }
+  }
+  render() {
+    return jsx(WithProviders, {
+      providers: ['emojiProvider'],
+      providerFactory: this.providerFactory,
+      renderNode: this.renderWithProvider
+    });
+  }
+}
+_defineProperty(EmojiNode, "displayName", 'EmojiNode');
+_defineProperty(EmojiNode, "defaultProps", {
+  showTooltip: true
+});
 function EmojiItem(props) {
   const {
     id,
@@ -19,7 +85,7 @@ function EmojiItem(props) {
   } = props;
   const inlineAnnotationProps = useInlineAnnotationProps(props);
   if (fg('editor_inline_comments_on_inline_nodes')) {
-    return jsx("span", inlineAnnotationProps, jsx(Emoji, {
+    return jsx("span", inlineAnnotationProps, jsx(EmojiNode, {
       allowTextFallback: true,
       id: id,
       shortName: shortName,
@@ -29,7 +95,7 @@ function EmojiItem(props) {
       resourceConfig: resourceConfig
     }));
   }
-  return jsx(Emoji, {
+  return jsx(EmojiNode, {
     allowTextFallback: true,
     id: id,
     shortName: shortName,

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

@@ -45,7 +45,7 @@ import { nodeToReact } from '../../react/nodes';
 export const NORMAL_SEVERITY_THRESHOLD = 2000;
 export const DEGRADED_SEVERITY_THRESHOLD = 3000;
 const packageName = "@atlaskit/renderer";
-const packageVersion = "110.5.4";
+const packageVersion = "110.6.0";
 export const defaultNodeComponents = nodeToReact;
 export class Renderer extends PureComponent {
   constructor(props) {
@@ -270,7 +270,6 @@ export class Renderer extends PureComponent {
       allowWindowedCodeBlock: featureFlags === null || featureFlags === void 0 ? void 0 : featureFlags.allowWindowedCodeBlock,
       isInsideOfInlineExtension: fg('platform.editor.inline_extension.extended_lcqdn') && props.isInsideOfInlineExtension,
       textHighlighter: props.UNSTABLE_textHighlighter,
-      isCommentsOnMediaMediaInlineBugFixEnabled: featureFlags === null || featureFlags === void 0 ? void 0 : featureFlags.commentsOnMediaMediaInlineBugFix,
       allowTableAlignment: props.UNSTABLE_allowTableAlignment,
       allowTableResizing: props.UNSTABLE_allowTableResizing
     };

package/dist/es2019/ui/annotations/hooks/use-load-annotations.js

@@ -4,8 +4,7 @@ import { ProvidersContext } from '../context';
 import { RendererContext as ActionsContext } from '../../RendererActionsContext';
 export const useLoadAnnotations = ({
   adfDocument,
-  isNestedRender,
-  onLoadComplete
+  isNestedRender
 }) => {
   const actions = useContext(ActionsContext);
   const providers = useContext(ProvidersContext);
@@ -22,9 +21,6 @@ export const useLoadAnnotations = ({
     const annotations = actions.getAnnotationMarks();
     // we don't want to request integrators for state with an empty list of ids.
     if (!annotations.length) {
-      onLoadComplete && onLoadComplete({
-        numberOfUnresolvedInlineComments: 0
-      });
       return;
     }
     const ids = annotations.map(mark => mark.attrs.id);
@@ -37,10 +33,7 @@ export const useLoadAnnotations = ({
         [value.id]: value
       }), {});
       updateSubscriberInlineComment.emit(AnnotationUpdateEvent.SET_ANNOTATION_STATE, payload);
-      onLoadComplete && onLoadComplete({
-        numberOfUnresolvedInlineComments: data.filter(data => data.state === 'active').length
-      });
     };
     inlineCommentGetState(ids, isNestedRender).then(cb);
-  }, [actions, providers, adfDocument, isNestedRender, onLoadComplete]);
+  }, [actions, providers, adfDocument, isNestedRender]);
 };

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

@@ -10,13 +10,11 @@ import { AnnotationRangeProvider } from './contexts/AnnotationRangeContext';
 import { AnnotationHoverContext } from './contexts/AnnotationHoverContext';
 const LoadAnnotations = /*#__PURE__*/React.memo(({
   adfDocument,
-  isNestedRender,
-  onLoadComplete
+  isNestedRender
 }) => {
   useLoadAnnotations({
     adfDocument,
-    isNestedRender,
-    onLoadComplete
+    isNestedRender
   });
   return null;
 });
@@ -27,8 +25,7 @@ export const AnnotationsWrapper = props => {
     annotationProvider,
     rendererRef,
     adfDocument,
-    isNestedRender,
-    onLoadComplete
+    isNestedRender
   } = props;
   const updateSubscriber = annotationProvider && annotationProvider.inlineComment && annotationProvider.inlineComment.updateSubscriber;
   const inlineCommentAnnotationsState = useAnnotationStateByTypeEvent({
@@ -49,8 +46,7 @@ export const AnnotationsWrapper = props => {
     rendererRef: rendererRef
   }, /*#__PURE__*/React.createElement(LoadAnnotations, {
     adfDocument: adfDocument,
-    isNestedRender: isNestedRender,
-    onLoadComplete: onLoadComplete
+    isNestedRender: isNestedRender
   }), /*#__PURE__*/React.createElement(AnnotationView, {
     createAnalyticsEvent: createAnalyticsEvent
   }), children)))));

package/dist/esm/react/index.js

@@ -93,7 +93,7 @@ var ReactSerializer = /*#__PURE__*/function () {
           isMediaLink: true
         });
       }
-      if (_this.isCommentsOnMediaMediaInlineBugFixEnabled && node.type.name === 'mediaInline' && mark.type.name === 'annotation') {
+      if (node.type.name === 'mediaInline' && mark.type.name === 'annotation') {
         return _objectSpread(_objectSpread({}, defaultProps), {}, {
           isMediaInline: true
         });
@@ -183,7 +183,6 @@ var ReactSerializer = /*#__PURE__*/function () {
     this.allowWindowedCodeBlock = init.allowWindowedCodeBlock;
     this.isInsideOfInlineExtension = init.isInsideOfInlineExtension;
     this.textHighlighter = init.textHighlighter;
-    this.isCommentsOnMediaMediaInlineBugFixEnabled = init.isCommentsOnMediaMediaInlineBugFixEnabled;
     this.allowTableAlignment = init.allowTableAlignment;
     this.allowTableResizing = init.allowTableResizing;
   }

package/dist/esm/react/nodes/emoji.js

@@ -1,3 +1,12 @@
+import _classCallCheck from "@babel/runtime/helpers/classCallCheck";
+import _createClass from "@babel/runtime/helpers/createClass";
+import _assertThisInitialized from "@babel/runtime/helpers/assertThisInitialized";
+import _inherits from "@babel/runtime/helpers/inherits";
+import _possibleConstructorReturn from "@babel/runtime/helpers/possibleConstructorReturn";
+import _getPrototypeOf from "@babel/runtime/helpers/getPrototypeOf";
+import _defineProperty from "@babel/runtime/helpers/defineProperty";
+function _createSuper(t) { var r = _isNativeReflectConstruct(); return function () { var e, o = _getPrototypeOf(t); if (r) { var s = _getPrototypeOf(this).constructor; e = Reflect.construct(o, arguments, s); } else e = o.apply(this, arguments); return _possibleConstructorReturn(this, e); }; }
+function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); } catch (t) {} return (_isNativeReflectConstruct = function _isNativeReflectConstruct() { return !!t; })(); }
 /**
  * @jsxRuntime classic
  * @jsx jsx
@@ -5,9 +14,84 @@
 // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
 import { jsx } from '@emotion/react';
 import { fg } from '@atlaskit/platform-feature-flags';
-import { memo } from 'react';
-import { Emoji } from '@atlaskit/editor-common/emoji';
+import { ResourcedEmoji } from '@atlaskit/emoji/element';
+import { PureComponent, memo } from 'react';
+import { ProviderFactory, WithProviders } from '@atlaskit/editor-common/provider-factory';
 import { useInlineAnnotationProps } from '../../ui/annotations/element/useInlineAnnotationProps';
+// eslint-disable-next-line @repo/internal/react/no-class-components
+var EmojiNode = /*#__PURE__*/function (_PureComponent) {
+  _inherits(EmojiNode, _PureComponent);
+  var _super = _createSuper(EmojiNode);
+  function EmojiNode(props) {
+    var _this;
+    _classCallCheck(this, EmojiNode);
+    _this = _super.call(this, props);
+    _defineProperty(_assertThisInitialized(_this), "renderWithProvider", function (providers) {
+      var _resourceConfig$optim;
+      var _this$props = _this.props,
+        allowTextFallback = _this$props.allowTextFallback,
+        shortName = _this$props.shortName,
+        id = _this$props.id,
+        fallback = _this$props.fallback,
+        fitToHeight = _this$props.fitToHeight,
+        showTooltip = _this$props.showTooltip,
+        resourceConfig = _this$props.resourceConfig;
+      if (allowTextFallback && !providers.emojiProvider) {
+        return jsx("span", {
+          "data-emoji-id": id,
+          "data-emoji-short-name": shortName,
+          "data-emoji-text": fallback || shortName
+        }, fallback || shortName);
+      }
+      if (!providers.emojiProvider) {
+        return null;
+      }
+      return jsx(ResourcedEmoji, {
+        emojiId: {
+          id: id,
+          fallback: fallback,
+          shortName: shortName
+        },
+        emojiProvider: providers.emojiProvider,
+        showTooltip: showTooltip,
+        fitToHeight: fitToHeight,
+        optimistic: true,
+        optimisticImageURL: resourceConfig === null || resourceConfig === void 0 || (_resourceConfig$optim = resourceConfig.optimisticImageApi) === null || _resourceConfig$optim === void 0 ? void 0 : _resourceConfig$optim.getUrl({
+          id: id,
+          fallback: fallback,
+          shortName: shortName
+        }),
+        editorEmoji: true
+      });
+    });
+    _this.providerFactory = props.providers || new ProviderFactory();
+    return _this;
+  }
+  _createClass(EmojiNode, [{
+    key: "componentWillUnmount",
+    value: function componentWillUnmount() {
+      if (!this.props.providers) {
+        // new ProviderFactory is created if no `providers` has been set
+        // in this case when component is unmounted it's safe to destroy this providerFactory
+        this.providerFactory.destroy();
+      }
+    }
+  }, {
+    key: "render",
+    value: function render() {
+      return jsx(WithProviders, {
+        providers: ['emojiProvider'],
+        providerFactory: this.providerFactory,
+        renderNode: this.renderWithProvider
+      });
+    }
+  }]);
+  return EmojiNode;
+}(PureComponent);
+_defineProperty(EmojiNode, "displayName", 'EmojiNode');
+_defineProperty(EmojiNode, "defaultProps", {
+  showTooltip: true
+});
 function EmojiItem(props) {
   var id = props.id,
     providers = props.providers,
@@ -17,7 +101,7 @@ function EmojiItem(props) {
     resourceConfig = props.resourceConfig;
   var inlineAnnotationProps = useInlineAnnotationProps(props);
   if (fg('editor_inline_comments_on_inline_nodes')) {
-    return jsx("span", inlineAnnotationProps, jsx(Emoji, {
+    return jsx("span", inlineAnnotationProps, jsx(EmojiNode, {
       allowTextFallback: true,
       id: id,
       shortName: shortName,
@@ -27,7 +111,7 @@ function EmojiItem(props) {
       resourceConfig: resourceConfig
     }));
   }
-  return jsx(Emoji, {
+  return jsx(EmojiNode, {
     allowTextFallback: true,
     id: id,
     shortName: shortName,

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

@@ -55,7 +55,7 @@ import { nodeToReact } from '../../react/nodes';
 export var NORMAL_SEVERITY_THRESHOLD = 2000;
 export var DEGRADED_SEVERITY_THRESHOLD = 3000;
 var packageName = "@atlaskit/renderer";
-var packageVersion = "110.5.4";
+var packageVersion = "110.6.0";
 export var defaultNodeComponents = nodeToReact;
 export var Renderer = /*#__PURE__*/function (_PureComponent) {
   _inherits(Renderer, _PureComponent);
@@ -282,7 +282,6 @@ export var Renderer = /*#__PURE__*/function (_PureComponent) {
         allowWindowedCodeBlock: featureFlags === null || featureFlags === void 0 ? void 0 : featureFlags.allowWindowedCodeBlock,
         isInsideOfInlineExtension: fg('platform.editor.inline_extension.extended_lcqdn') && props.isInsideOfInlineExtension,
         textHighlighter: props.UNSTABLE_textHighlighter,
-        isCommentsOnMediaMediaInlineBugFixEnabled: featureFlags === null || featureFlags === void 0 ? void 0 : featureFlags.commentsOnMediaMediaInlineBugFix,
         allowTableAlignment: props.UNSTABLE_allowTableAlignment,
         allowTableResizing: props.UNSTABLE_allowTableResizing
       };

package/dist/esm/ui/annotations/hooks/use-load-annotations.js

@@ -7,8 +7,7 @@ import { ProvidersContext } from '../context';
 import { RendererContext as ActionsContext } from '../../RendererActionsContext';
 export var useLoadAnnotations = function useLoadAnnotations(_ref) {
   var adfDocument = _ref.adfDocument,
-    isNestedRender = _ref.isNestedRender,
-    onLoadComplete = _ref.onLoadComplete;
+    isNestedRender = _ref.isNestedRender;
   var actions = useContext(ActionsContext);
   var providers = useContext(ProvidersContext);
   useEffect(function () {
@@ -21,9 +20,6 @@ export var useLoadAnnotations = function useLoadAnnotations(_ref) {
     var annotations = actions.getAnnotationMarks();
     // we don't want to request integrators for state with an empty list of ids.
     if (!annotations.length) {
-      onLoadComplete && onLoadComplete({
-        numberOfUnresolvedInlineComments: 0
-      });
       return;
     }
     var ids = annotations.map(function (mark) {
@@ -37,12 +33,7 @@ export var useLoadAnnotations = function useLoadAnnotations(_ref) {
         return _objectSpread(_objectSpread({}, acc), {}, _defineProperty({}, value.id, value));
       }, {});
       updateSubscriberInlineComment.emit(AnnotationUpdateEvent.SET_ANNOTATION_STATE, payload);
-      onLoadComplete && onLoadComplete({
-        numberOfUnresolvedInlineComments: data.filter(function (data) {
-          return data.state === 'active';
-        }).length
-      });
     };
     inlineCommentGetState(ids, isNestedRender).then(cb);
-  }, [actions, providers, adfDocument, isNestedRender, onLoadComplete]);
+  }, [actions, providers, adfDocument, isNestedRender]);
 };

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

@@ -10,12 +10,10 @@ import { AnnotationRangeProvider } from './contexts/AnnotationRangeContext';
 import { AnnotationHoverContext } from './contexts/AnnotationHoverContext';
 var LoadAnnotations = /*#__PURE__*/React.memo(function (_ref) {
   var adfDocument = _ref.adfDocument,
-    isNestedRender = _ref.isNestedRender,
-    onLoadComplete = _ref.onLoadComplete;
+    isNestedRender = _ref.isNestedRender;
   useLoadAnnotations({
     adfDocument: adfDocument,
-    isNestedRender: isNestedRender,
-    onLoadComplete: onLoadComplete
+    isNestedRender: isNestedRender
   });
   return null;
 });
@@ -25,8 +23,7 @@ export var AnnotationsWrapper = function AnnotationsWrapper(props) {
     annotationProvider = props.annotationProvider,
     rendererRef = props.rendererRef,
     adfDocument = props.adfDocument,
-    isNestedRender = props.isNestedRender,
-    onLoadComplete = props.onLoadComplete;
+    isNestedRender = props.isNestedRender;
   var updateSubscriber = annotationProvider && annotationProvider.inlineComment && annotationProvider.inlineComment.updateSubscriber;
   var inlineCommentAnnotationsState = useAnnotationStateByTypeEvent({
     type: AnnotationTypes.INLINE_COMMENT,
@@ -45,8 +42,7 @@ export var AnnotationsWrapper = function AnnotationsWrapper(props) {
     rendererRef: rendererRef
   }, /*#__PURE__*/React.createElement(LoadAnnotations, {
     adfDocument: adfDocument,
-    isNestedRender: isNestedRender,
-    onLoadComplete: onLoadComplete
+    isNestedRender: isNestedRender
   }), /*#__PURE__*/React.createElement(AnnotationView, {
     createAnalyticsEvent: createAnalyticsEvent
   }), children)))));

package/dist/types/react/index.d.ts

@@ -41,7 +41,6 @@ export interface ReactSerializerInit {
     allowWindowedCodeBlock?: boolean;
     isInsideOfInlineExtension?: boolean;
     textHighlighter?: TextHighlighter;
-    isCommentsOnMediaMediaInlineBugFixEnabled?: boolean;
     allowTableAlignment?: boolean;
     allowTableResizing?: boolean;
 }
@@ -90,7 +89,6 @@ export default class ReactSerializer implements Serializer<JSX.Element> {
     private nodeComponents?;
     private allowWindowedCodeBlock?;
     private isInsideOfInlineExtension?;
-    private isCommentsOnMediaMediaInlineBugFixEnabled?;
     private textHighlighter?;
     private allowTableAlignment?;
     private allowTableResizing?;

package/dist/types/react/nodes/emoji.d.ts

@@ -4,14 +4,17 @@
  * @jsx jsx
  */
 import { jsx } from '@emotion/react';
-import { type EmojiAttributes } from '@atlaskit/adf-schema';
 import { type EmojiResourceConfig } from '@atlaskit/emoji/resource';
-import { type ProviderFactory } from '@atlaskit/editor-common/provider-factory';
+import { ProviderFactory } from '@atlaskit/editor-common/provider-factory';
+import type { EmojiId } from '@atlaskit/emoji/types';
 import { type MarkDataAttributes } from '../../ui/annotations/element/useInlineAnnotationProps';
-export interface EmojiProps extends EmojiAttributes, MarkDataAttributes {
+import { type EmojiAttributes } from '@atlaskit/adf-schema';
+export interface EmojiProps extends EmojiId, EmojiAttributes, MarkDataAttributes {
+    allowTextFallback?: boolean;
     providers?: ProviderFactory;
-    resourceConfig?: EmojiResourceConfig;
     fitToHeight?: number;
+    showTooltip?: boolean;
+    resourceConfig?: EmojiResourceConfig;
 }
 declare function EmojiItem(props: EmojiProps): jsx.JSX.Element;
 declare namespace EmojiItem {

package/dist/types/ui/annotations/hooks/use-load-annotations.d.ts

@@ -2,9 +2,6 @@ import type { JSONDocNode } from '@atlaskit/editor-json-transformer';
 type Props = {
     adfDocument: JSONDocNode;
     isNestedRender: boolean;
-    onLoadComplete?: ({ numberOfUnresolvedInlineComments, }: {
-        numberOfUnresolvedInlineComments: number;
-    }) => void;
 };
-export declare const useLoadAnnotations: ({ adfDocument, isNestedRender, onLoadComplete }: Props) => void;
+export declare const useLoadAnnotations: ({ adfDocument, isNestedRender }: Props) => void;
 export {};

package/dist/types/ui/annotations/types.d.ts

@@ -16,9 +16,6 @@ export type AnnotationsWrapperProps = React.PropsWithChildren<{
     annotationProvider: AnnotationProviders | null | undefined;
     rendererRef: React.RefObject<HTMLDivElement>;
     isNestedRender: boolean;
-    onLoadComplete?: ({ numberOfUnresolvedInlineComments, }: {
-        numberOfUnresolvedInlineComments: number;
-    }) => void;
 }>;
 export type TextPosition = {
     start: number;

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

@@ -41,7 +41,6 @@ export interface ReactSerializerInit {
     allowWindowedCodeBlock?: boolean;
     isInsideOfInlineExtension?: boolean;
     textHighlighter?: TextHighlighter;
-    isCommentsOnMediaMediaInlineBugFixEnabled?: boolean;
     allowTableAlignment?: boolean;
     allowTableResizing?: boolean;
 }
@@ -90,7 +89,6 @@ export default class ReactSerializer implements Serializer<JSX.Element> {
     private nodeComponents?;
     private allowWindowedCodeBlock?;
     private isInsideOfInlineExtension?;
-    private isCommentsOnMediaMediaInlineBugFixEnabled?;
     private textHighlighter?;
     private allowTableAlignment?;
     private allowTableResizing?;

package/dist/types-ts4.5/react/nodes/emoji.d.ts

@@ -4,14 +4,17 @@
  * @jsx jsx
  */
 import { jsx } from '@emotion/react';
-import { type EmojiAttributes } from '@atlaskit/adf-schema';
 import { type EmojiResourceConfig } from '@atlaskit/emoji/resource';
-import { type ProviderFactory } from '@atlaskit/editor-common/provider-factory';
+import { ProviderFactory } from '@atlaskit/editor-common/provider-factory';
+import type { EmojiId } from '@atlaskit/emoji/types';
 import { type MarkDataAttributes } from '../../ui/annotations/element/useInlineAnnotationProps';
-export interface EmojiProps extends EmojiAttributes, MarkDataAttributes {
+import { type EmojiAttributes } from '@atlaskit/adf-schema';
+export interface EmojiProps extends EmojiId, EmojiAttributes, MarkDataAttributes {
+    allowTextFallback?: boolean;
     providers?: ProviderFactory;
-    resourceConfig?: EmojiResourceConfig;
     fitToHeight?: number;
+    showTooltip?: boolean;
+    resourceConfig?: EmojiResourceConfig;
 }
 declare function EmojiItem(props: EmojiProps): jsx.JSX.Element;
 declare namespace EmojiItem {

package/dist/types-ts4.5/ui/annotations/hooks/use-load-annotations.d.ts

@@ -2,9 +2,6 @@ import type { JSONDocNode } from '@atlaskit/editor-json-transformer';
 type Props = {
     adfDocument: JSONDocNode;
     isNestedRender: boolean;
-    onLoadComplete?: ({ numberOfUnresolvedInlineComments, }: {
-        numberOfUnresolvedInlineComments: number;
-    }) => void;
 };
-export declare const useLoadAnnotations: ({ adfDocument, isNestedRender, onLoadComplete }: Props) => void;
+export declare const useLoadAnnotations: ({ adfDocument, isNestedRender }: Props) => void;
 export {};

package/dist/types-ts4.5/ui/annotations/types.d.ts

@@ -16,9 +16,6 @@ export type AnnotationsWrapperProps = React.PropsWithChildren<{
     annotationProvider: AnnotationProviders | null | undefined;
     rendererRef: React.RefObject<HTMLDivElement>;
     isNestedRender: boolean;
-    onLoadComplete?: ({ numberOfUnresolvedInlineComments, }: {
-        numberOfUnresolvedInlineComments: number;
-    }) => void;
 }>;
 export type TextPosition = {
     start: number;

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@atlaskit/renderer",
-	"version": "110.5.4",
+	"version": "110.6.0",
 	"description": "Renderer component",
 	"publishConfig": {
 		"registry": "https://registry.npmjs.org/"
@@ -46,7 +46,7 @@
 		"@atlaskit/media-ui": "^25.15.0",
 		"@atlaskit/media-viewer": "^48.10.0",
 		"@atlaskit/platform-feature-flags": "^0.3.0",
-		"@atlaskit/smart-card": "^28.3.0",
+		"@atlaskit/smart-card": "^28.4.0",
 		"@atlaskit/status": "^1.5.0",
 		"@atlaskit/task-decision": "^17.11.0",
 		"@atlaskit/theme": "^13.0.0",