@atlaskit/renderer 115.0.2 → 115.0.4

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

@@ -12,6 +12,8 @@ var _types = require("@atlaskit/editor-common/types");
 var _adfSchema = require("@atlaskit/adf-schema");
 var _analytics = require("@atlaskit/editor-common/analytics");
 var _types2 = require("@atlaskit/analytics-listeners/types");
+var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
+var _AnnotationManagerContext = require("../contexts/AnnotationManagerContext");
 function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
 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 useAnnotationStateByTypeEvent = exports.useAnnotationStateByTypeEvent = function useAnnotationStateByTypeEvent(_ref) {
@@ -21,6 +23,10 @@ var useAnnotationStateByTypeEvent = exports.useAnnotationStateByTypeEvent = func
     _useState2 = (0, _slicedToArray2.default)(_useState, 2),
     states = _useState2[0],
     setStates = _useState2[1];
+  var _useAnnotationManager = (0, _AnnotationManagerContext.useAnnotationManagerDispatch)(),
+    dispatch = _useAnnotationManager.dispatch;
+  var _useAnnotationManager2 = (0, _AnnotationManagerContext.useAnnotationManagerState)(),
+    annotations = _useAnnotationManager2.annotations;
   (0, _react.useLayoutEffect)(function () {
     if (!updateSubscriber) {
       return;
@@ -39,12 +45,23 @@ var useAnnotationStateByTypeEvent = exports.useAnnotationStateByTypeEvent = func
       }, {});
       setStates(_objectSpread(_objectSpread({}, states), nextStates));
     };
-    updateSubscriber.on(_types.AnnotationUpdateEvent.SET_ANNOTATION_STATE, cb);
-    return function () {
-      updateSubscriber.off(_types.AnnotationUpdateEvent.SET_ANNOTATION_STATE, cb);
-    };
-  }, [states, type, updateSubscriber]);
-  return states;
+    if (!(0, _platformFeatureFlags.fg)('platform_editor_comments_api_manager')) {
+      updateSubscriber.on(_types.AnnotationUpdateEvent.SET_ANNOTATION_STATE, cb);
+      return function () {
+        updateSubscriber.off(_types.AnnotationUpdateEvent.SET_ANNOTATION_STATE, cb);
+      };
+    }
+  }, [states, type, updateSubscriber, dispatch]);
+  var annotationMarkStates = (0, _react.useMemo)(function () {
+    return Object.values(annotations).reduce(function (acc, curr) {
+      return _objectSpread(_objectSpread({}, acc), {}, (0, _defineProperty2.default)({}, curr.id, curr.markState));
+    }, {});
+  }, [annotations]);
+  if ((0, _platformFeatureFlags.fg)('platform_editor_comments_api_manager')) {
+    return annotationMarkStates;
+  } else {
+    return states;
+  }
 };
 var useHasFocusEvent = exports.useHasFocusEvent = function useHasFocusEvent(_ref2) {
   var id = _ref2.id,
@@ -57,6 +74,9 @@ var useHasFocusEvent = exports.useHasFocusEvent = function useHasFocusEvent(_ref
     _useState6 = (0, _slicedToArray2.default)(_useState5, 2),
     isHovered = _useState6[0],
     setIsHovered = _useState6[1];
+  var _useAnnotationManager3 = (0, _AnnotationManagerContext.useAnnotationManagerState)(),
+    currentSelectedAnnotationId = _useAnnotationManager3.currentSelectedAnnotationId,
+    currentHoveredAnnotationId = _useAnnotationManager3.currentHoveredAnnotationId;
   (0, _react.useLayoutEffect)(function () {
     if (!updateSubscriber) {
       return;
@@ -79,21 +99,30 @@ var useHasFocusEvent = exports.useHasFocusEvent = function useHasFocusEvent(_ref
         document.activeElement.blur();
       }
     };
-    updateSubscriber.on(_types.AnnotationUpdateEvent.SET_ANNOTATION_FOCUS, cb);
-    updateSubscriber.on(_types.AnnotationUpdateEvent.SET_ANNOTATION_HOVERED, callbackForHoveredAnnotation);
-    updateSubscriber.on(_types.AnnotationUpdateEvent.REMOVE_ANNOTATION_FOCUS, removeFocus);
-    updateSubscriber.on(_types.AnnotationUpdateEvent.REMOVE_ANNOTATION_HOVERED, removeHoverEffect);
-    return function () {
-      updateSubscriber.off(_types.AnnotationUpdateEvent.SET_ANNOTATION_FOCUS, cb);
-      updateSubscriber.off(_types.AnnotationUpdateEvent.SET_ANNOTATION_HOVERED, callbackForHoveredAnnotation);
-      updateSubscriber.off(_types.AnnotationUpdateEvent.REMOVE_ANNOTATION_FOCUS, removeFocus);
-      updateSubscriber.off(_types.AnnotationUpdateEvent.SET_ANNOTATION_HOVERED, removeHoverEffect);
-    };
+    if (!(0, _platformFeatureFlags.fg)('platform_editor_comments_api_manager')) {
+      updateSubscriber.on(_types.AnnotationUpdateEvent.SET_ANNOTATION_FOCUS, cb);
+      updateSubscriber.on(_types.AnnotationUpdateEvent.SET_ANNOTATION_HOVERED, callbackForHoveredAnnotation);
+      updateSubscriber.on(_types.AnnotationUpdateEvent.REMOVE_ANNOTATION_FOCUS, removeFocus);
+      updateSubscriber.on(_types.AnnotationUpdateEvent.REMOVE_ANNOTATION_HOVERED, removeHoverEffect);
+      return function () {
+        updateSubscriber.off(_types.AnnotationUpdateEvent.SET_ANNOTATION_FOCUS, cb);
+        updateSubscriber.off(_types.AnnotationUpdateEvent.SET_ANNOTATION_HOVERED, callbackForHoveredAnnotation);
+        updateSubscriber.off(_types.AnnotationUpdateEvent.REMOVE_ANNOTATION_FOCUS, removeFocus);
+        updateSubscriber.off(_types.AnnotationUpdateEvent.SET_ANNOTATION_HOVERED, removeHoverEffect);
+      };
+    }
   }, [id, updateSubscriber]);
-  return {
-    hasFocus: hasFocus,
-    isHovered: isHovered
-  };
+  if ((0, _platformFeatureFlags.fg)('platform_editor_comments_api_manager')) {
+    return {
+      hasFocus: currentSelectedAnnotationId === id,
+      isHovered: currentHoveredAnnotationId === id
+    };
+  } else {
+    return {
+      hasFocus: hasFocus,
+      isHovered: isHovered
+    };
+  }
 };
 var useAnnotationClickEvent = exports.useAnnotationClickEvent = function useAnnotationClickEvent(props) {
   var _useState7 = (0, _react.useState)(null),
@@ -103,6 +132,21 @@ var useAnnotationClickEvent = exports.useAnnotationClickEvent = function useAnno
   var updateSubscriber = props.updateSubscriber,
     createAnalyticsEvent = props.createAnalyticsEvent,
     isNestedRender = props.isNestedRender;
+  var _useAnnotationManager4 = (0, _AnnotationManagerContext.useAnnotationManagerState)(),
+    currentSelectedAnnotationId = _useAnnotationManager4.currentSelectedAnnotationId,
+    currentSelectedMarkRef = _useAnnotationManager4.currentSelectedMarkRef;
+  var selectedAnnotation = (0, _react.useMemo)(function () {
+    return currentSelectedAnnotationId && currentSelectedMarkRef ? {
+      annotations: [{
+        id: currentSelectedAnnotationId,
+        type: _adfSchema.AnnotationTypes.INLINE_COMMENT
+      }],
+      clickElementTarget: currentSelectedMarkRef
+    } : {
+      annotations: [],
+      clickElementTarget: undefined
+    };
+  }, [currentSelectedAnnotationId, currentSelectedMarkRef]);
   (0, _react.useLayoutEffect)(function () {
     if (!updateSubscriber || isNestedRender) {
       return;
@@ -147,12 +191,18 @@ var useAnnotationClickEvent = exports.useAnnotationClickEvent = function useAnno
         document.activeElement.blur();
       }
     };
-    updateSubscriber.on(_types.AnnotationUpdateEvent.ON_ANNOTATION_CLICK, clickCb);
-    updateSubscriber.on(_types.AnnotationUpdateEvent.DESELECT_ANNOTATIONS, deselectCb);
-    return function () {
-      updateSubscriber.off(_types.AnnotationUpdateEvent.ON_ANNOTATION_CLICK, clickCb);
-      updateSubscriber.off(_types.AnnotationUpdateEvent.DESELECT_ANNOTATIONS, deselectCb);
-    };
+    if (!(0, _platformFeatureFlags.fg)('platform_editor_comments_api_manager')) {
+      updateSubscriber.on(_types.AnnotationUpdateEvent.ON_ANNOTATION_CLICK, clickCb);
+      updateSubscriber.on(_types.AnnotationUpdateEvent.DESELECT_ANNOTATIONS, deselectCb);
+      return function () {
+        updateSubscriber.off(_types.AnnotationUpdateEvent.ON_ANNOTATION_CLICK, clickCb);
+        updateSubscriber.off(_types.AnnotationUpdateEvent.DESELECT_ANNOTATIONS, deselectCb);
+      };
+    }
   }, [updateSubscriber, createAnalyticsEvent, isNestedRender]);
-  return annotationClickEvent;
+  if ((0, _platformFeatureFlags.fg)('platform_editor_comments_api_manager')) {
+    return selectedAnnotation;
+  } else {
+    return annotationClickEvent;
+  }
 };

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

@@ -11,6 +11,7 @@ var _types = require("@atlaskit/editor-common/types");
 var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
 var _context = require("../context");
 var _RendererActionsContext = require("../../RendererActionsContext");
+var _AnnotationManagerContext = require("../contexts/AnnotationManagerContext");
 function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
 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) {
@@ -19,6 +20,8 @@ var useLoadAnnotations = exports.useLoadAnnotations = function useLoadAnnotation
     onLoadComplete = _ref.onLoadComplete;
   var actions = (0, _react.useContext)(_RendererActionsContext.RendererContext);
   var providers = (0, _react.useContext)(_context.ProvidersContext);
+  var _useAnnotationManager = (0, _AnnotationManagerContext.useAnnotationManagerDispatch)(),
+    dispatch = _useAnnotationManager.dispatch;
   (0, _react.useEffect)(function () {
     if (!providers) {
       return;
@@ -48,7 +51,20 @@ var useLoadAnnotations = exports.useLoadAnnotations = function useLoadAnnotation
       var payload = data.reduce(function (acc, value) {
         return _objectSpread(_objectSpread({}, acc), {}, (0, _defineProperty2.default)({}, value.id, value));
       }, {});
-      updateSubscriberInlineComment.emit(_types.AnnotationUpdateEvent.SET_ANNOTATION_STATE, payload);
+      if ((0, _platformFeatureFlags.fg)('platform_editor_comments_api_manager')) {
+        dispatch({
+          type: 'loadAnnotation',
+          data: Object.keys(payload).map(function (id) {
+            var _payload$id$state;
+            return {
+              id: id,
+              markState: (_payload$id$state = payload[id].state) !== null && _payload$id$state !== void 0 ? _payload$id$state : undefined
+            };
+          })
+        });
+      } else {
+        updateSubscriberInlineComment.emit(_types.AnnotationUpdateEvent.SET_ANNOTATION_STATE, payload);
+      }
       onLoadComplete && onLoadComplete({
         numberOfUnresolvedInlineComments: data.filter(function (data) {
           return data.state === 'active';
@@ -56,5 +72,5 @@ var useLoadAnnotations = exports.useLoadAnnotations = function useLoadAnnotation
       });
     };
     inlineCommentGetState(ids, isNestedRender).then(cb);
-  }, [actions, providers, adfDocument, isNestedRender, onLoadComplete]);
+  }, [actions, providers, adfDocument, isNestedRender, onLoadComplete, dispatch]);
 };

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

@@ -1,12 +1,13 @@
 "use strict";
 
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+var _typeof = require("@babel/runtime/helpers/typeof");
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.AnnotationsWrapper = exports.AnnotationsPositionContext = void 0;
-var _react = _interopRequireDefault(require("react"));
+exports.AnnotationsWrapperInner = exports.AnnotationsWrapper = exports.AnnotationsPositionContext = void 0;
+var _react = _interopRequireWildcard(require("react"));
 var _adfSchema = require("@atlaskit/adf-schema");
+var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
 var _view = require("./view");
 var _wrapper = require("./wrapper");
 var _context = require("./context");
@@ -15,6 +16,9 @@ var _useEvents = require("./hooks/use-events");
 var _analyticsNext = require("@atlaskit/analytics-next");
 var _AnnotationRangeContext = require("./contexts/AnnotationRangeContext");
 var _AnnotationHoverContext = require("./contexts/AnnotationHoverContext");
+var _AnnotationManagerContext = require("./contexts/AnnotationManagerContext");
+function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
+function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
 var LoadAnnotations = /*#__PURE__*/_react.default.memo(function (_ref) {
   var adfDocument = _ref.adfDocument,
     isNestedRender = _ref.isNestedRender,
@@ -34,27 +38,25 @@ var LoadAnnotations = /*#__PURE__*/_react.default.memo(function (_ref) {
 var AnnotationsPositionContext = exports.AnnotationsPositionContext = /*#__PURE__*/_react.default.createContext({
   startPos: 1
 });
-var AnnotationsWrapper = exports.AnnotationsWrapper = function AnnotationsWrapper(props) {
-  var _annotationProvider$i, _annotationProvider$i2;
+var AnnotationsWrapperInner = exports.AnnotationsWrapperInner = function AnnotationsWrapperInner(props) {
+  var _providers$inlineComm, _providers$inlineComm2;
   var children = props.children,
-    annotationProvider = props.annotationProvider,
     rendererRef = props.rendererRef,
     adfDocument = props.adfDocument,
     isNestedRender = props.isNestedRender,
     onLoadComplete = props.onLoadComplete;
-  var updateSubscriber = annotationProvider && annotationProvider.inlineComment && annotationProvider.inlineComment.updateSubscriber;
+  var providers = (0, _react.useContext)(_context.ProvidersContext);
+  var updateSubscriber = providers && providers.inlineComment && providers.inlineComment.updateSubscriber;
   var inlineCommentAnnotationsState = (0, _useEvents.useAnnotationStateByTypeEvent)({
     type: _adfSchema.AnnotationTypes.INLINE_COMMENT,
     updateSubscriber: updateSubscriber || null
   });
   var _useAnalyticsEvents = (0, _analyticsNext.useAnalyticsEvents)(),
     createAnalyticsEvent = _useAnalyticsEvents.createAnalyticsEvent;
-  return /*#__PURE__*/_react.default.createElement(_context.ProvidersContext.Provider, {
-    value: annotationProvider
-  }, /*#__PURE__*/_react.default.createElement(_context.InlineCommentsStateContext.Provider, {
+  return /*#__PURE__*/_react.default.createElement(_context.InlineCommentsStateContext.Provider, {
     value: inlineCommentAnnotationsState
   }, /*#__PURE__*/_react.default.createElement(_AnnotationRangeContext.AnnotationRangeProvider, {
-    allowCommentsOnMedia: (_annotationProvider$i = annotationProvider === null || annotationProvider === void 0 || (_annotationProvider$i2 = annotationProvider.inlineComment) === null || _annotationProvider$i2 === void 0 ? void 0 : _annotationProvider$i2.allowCommentsOnMedia) !== null && _annotationProvider$i !== void 0 ? _annotationProvider$i : false
+    allowCommentsOnMedia: (_providers$inlineComm = providers === null || providers === void 0 || (_providers$inlineComm2 = providers.inlineComment) === null || _providers$inlineComm2 === void 0 ? void 0 : _providers$inlineComm2.allowCommentsOnMedia) !== null && _providers$inlineComm !== void 0 ? _providers$inlineComm : false
   }, /*#__PURE__*/_react.default.createElement(_AnnotationHoverContext.AnnotationHoverContext, null, /*#__PURE__*/_react.default.createElement(_wrapper.AnnotationsContextWrapper, {
     createAnalyticsEvent: createAnalyticsEvent,
     rendererRef: rendererRef,
@@ -66,5 +68,40 @@ var AnnotationsWrapper = exports.AnnotationsWrapper = function AnnotationsWrappe
   }), /*#__PURE__*/_react.default.createElement(_view.AnnotationView, {
     isNestedRender: isNestedRender,
     createAnalyticsEvent: createAnalyticsEvent
-  }), children)))));
+  }), children))));
+};
+var AnnotationsWrapper = exports.AnnotationsWrapper = function AnnotationsWrapper(props) {
+  var children = props.children,
+    annotationProvider = props.annotationProvider,
+    rendererRef = props.rendererRef,
+    adfDocument = props.adfDocument,
+    isNestedRender = props.isNestedRender,
+    onLoadComplete = props.onLoadComplete;
+  if (!isNestedRender && (0, _platformFeatureFlags.fg)('platform_editor_comments_api_manager')) {
+    var _annotationProvider$i, _annotationProvider$i2;
+    // We need to ensure there is a single instance of the annotation manager for the whole document
+    // and that it is the same instance for all annotations.
+    // This is because the annotation manager is responsible for managing the state of ALL annotations.
+    // This includes annotations inside extensions.
+    return /*#__PURE__*/_react.default.createElement(_context.ProvidersContext.Provider, {
+      value: annotationProvider
+    }, /*#__PURE__*/_react.default.createElement(_AnnotationManagerContext.AnnotationManagerProvider, {
+      annotationManager: annotationProvider === null || annotationProvider === void 0 ? void 0 : annotationProvider.annotationManager,
+      updateSubscriber: (_annotationProvider$i = annotationProvider === null || annotationProvider === void 0 || (_annotationProvider$i2 = annotationProvider.inlineComment) === null || _annotationProvider$i2 === void 0 ? void 0 : _annotationProvider$i2.updateSubscriber) !== null && _annotationProvider$i !== void 0 ? _annotationProvider$i : undefined
+    }, /*#__PURE__*/_react.default.createElement(AnnotationsWrapperInner, {
+      rendererRef: rendererRef,
+      adfDocument: adfDocument,
+      isNestedRender: isNestedRender,
+      onLoadComplete: onLoadComplete
+    }, children)));
+  } else {
+    return /*#__PURE__*/_react.default.createElement(_context.ProvidersContext.Provider, {
+      value: annotationProvider
+    }, /*#__PURE__*/_react.default.createElement(AnnotationsWrapperInner, {
+      rendererRef: rendererRef,
+      adfDocument: adfDocument,
+      isNestedRender: isNestedRender,
+      onLoadComplete: onLoadComplete
+    }, children));
+  }
 };

package/dist/cjs/ui/annotations/selection/mounter.js

@@ -8,6 +8,7 @@ Object.defineProperty(exports, "__esModule", {
 exports.SelectionInlineCommentMounter = void 0;
 var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
 var _react = _interopRequireWildcard(require("react"));
+var _v = _interopRequireDefault(require("uuid/v4"));
 var _adfSchema = require("@atlaskit/adf-schema");
 var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
 var _dom = require("../draft/dom");
@@ -15,6 +16,7 @@ var _types = require("@atlaskit/analytics-listeners/types");
 var _analytics = require("@atlaskit/editor-common/analytics");
 var _getRendererRangeInlineNodeNames = require("../../../actions/get-renderer-range-inline-node-names");
 var _RendererActionsContext = require("../../RendererActionsContext");
+var _AnnotationManagerContext = require("../contexts/AnnotationManagerContext");
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
 function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
 var SelectionInlineCommentMounter = exports.SelectionInlineCommentMounter = /*#__PURE__*/_react.default.memo(function (props) {
@@ -35,6 +37,12 @@ var SelectionInlineCommentMounter = exports.SelectionInlineCommentMounter = /*#_
     draftDocumentPosition = _useState2[0],
     setDraftDocumentPosition = _useState2[1];
   var actions = (0, _react.useContext)(_RendererActionsContext.RendererContext);
+  var _useAnnotationManager = (0, _AnnotationManagerContext.useAnnotationManagerState)(),
+    isDrafting = _useAnnotationManager.isDrafting,
+    draftId = _useAnnotationManager.draftId;
+  var _useAnnotationManager2 = (0, _AnnotationManagerContext.useAnnotationManagerDispatch)(),
+    annotationManager = _useAnnotationManager2.annotationManager,
+    dispatch = _useAnnotationManager2.dispatch;
   var inlineNodeTypes = (0, _react.useMemo)(function () {
     if ((0, _platformFeatureFlags.fg)('annotations_defensive_node_name_calculations')) {
       if (!actions.isRangeAnnotatable(range)) {
@@ -187,6 +195,171 @@ var SelectionInlineCommentMounter = exports.SelectionInlineCommentMounter = /*#_
     removeDraftModeCallback();
     onCloseProps();
   }, [onCloseProps, removeDraftModeCallback, createAnalyticsEvent, inlineNodeTypes]);
+  (0, _react.useEffect)(function () {
+    if ((0, _platformFeatureFlags.fg)('platform_editor_comments_api_manager')) {
+      var allowAnnotation = function allowAnnotation() {
+        if (isDrafting) {
+          return false;
+        }
+        return isAnnotationAllowed;
+      };
+      annotationManager === null || annotationManager === void 0 || annotationManager.hook('allowAnnotation', allowAnnotation);
+      return function () {
+        annotationManager === null || annotationManager === void 0 || annotationManager.unhook('allowAnnotation', allowAnnotation);
+      };
+    }
+  }, [annotationManager, isAnnotationAllowed, isDrafting]);
+  (0, _react.useEffect)(function () {
+    if ((0, _platformFeatureFlags.fg)('platform_editor_comments_api_manager')) {
+      var startDraft = function startDraft() {
+        var _result$inlineNodeTyp;
+        if (isDrafting) {
+          return {
+            success: false,
+            reason: 'draft-in-progress'
+          };
+        }
+        if (!actions.isValidAnnotationRange(range)) {
+          return {
+            success: false,
+            reason: 'invalid-range'
+          };
+        }
+        var id = (0, _v.default)();
+        var result = applyDraftModeCallback({
+          annotationId: id,
+          keepNativeSelection: false
+        });
+        if (!result) {
+          return {
+            success: false,
+            reason: 'invalid-range'
+          };
+        }
+        dispatch({
+          type: 'setDrafting',
+          data: {
+            isDrafting: true,
+            draftId: id,
+            draftActionResult: result
+          }
+        });
+        dispatch({
+          type: 'resetSelectedAnnotation'
+        });
+        return {
+          success: true,
+          // We cannot get a ref to the target element here
+          // because the draft is not yet applied to the DOM
+          targetElement: undefined,
+          inlineNodeTypes: (_result$inlineNodeTyp = result.inlineNodeTypes) !== null && _result$inlineNodeTyp !== void 0 ? _result$inlineNodeTyp : [],
+          actionResult: {
+            step: result.step,
+            doc: result.doc,
+            inlineNodeTypes: result.inlineNodeTypes,
+            targetNodeType: result.targetNodeType,
+            originalSelection: result.originalSelection,
+            numMatches: result.numMatches,
+            matchIndex: result.matchIndex,
+            pos: result.pos
+          }
+        };
+      };
+      annotationManager === null || annotationManager === void 0 || annotationManager.hook('startDraft', startDraft);
+      return function () {
+        annotationManager === null || annotationManager === void 0 || annotationManager.unhook('startDraft', startDraft);
+      };
+    }
+  }, [annotationManager, isDrafting, applyDraftModeCallback, actions, range, dispatch]);
+  (0, _react.useEffect)(function () {
+    if ((0, _platformFeatureFlags.fg)('platform_editor_comments_api_manager')) {
+      var clearDraft = function clearDraft() {
+        if (!isDrafting) {
+          return {
+            success: false,
+            reason: 'draft-not-started'
+          };
+        }
+        dispatch({
+          type: 'setDrafting',
+          data: {
+            isDrafting: false,
+            draftId: undefined,
+            draftActionResult: undefined
+          }
+        });
+        onCloseCallback();
+        return {
+          success: true
+        };
+      };
+      annotationManager === null || annotationManager === void 0 || annotationManager.hook('clearDraft', clearDraft);
+      return function () {
+        annotationManager === null || annotationManager === void 0 || annotationManager.unhook('clearDraft', clearDraft);
+      };
+    }
+  }, [annotationManager, onCloseCallback, isDrafting, dispatch]);
+  (0, _react.useEffect)(function () {
+    if ((0, _platformFeatureFlags.fg)('platform_editor_comments_api_manager')) {
+      var applyDraft = function applyDraft(id) {
+        if (!isDrafting || !draftId) {
+          return {
+            success: false,
+            reason: 'draft-not-started'
+          };
+        }
+        var result = onCreateCallback(id);
+        if (!result) {
+          return {
+            success: false,
+            reason: 'range-no-longer-exists'
+          };
+        }
+        onCloseCallback();
+        dispatch({
+          type: 'setDrafting',
+          data: {
+            isDrafting: false,
+            draftId: undefined,
+            draftActionResult: undefined
+          }
+        });
+        dispatch({
+          type: 'updateAnnotation',
+          data: {
+            id: id,
+            selected: true,
+            markState: _adfSchema.AnnotationMarkStates.ACTIVE
+          }
+        });
+        return {
+          success: true,
+          targetElement: undefined,
+          actionResult: id !== draftId ? {
+            step: result.step,
+            doc: result.doc,
+            inlineNodeTypes: result.inlineNodeTypes,
+            targetNodeType: result.targetNodeType,
+            originalSelection: result.originalSelection,
+            numMatches: result.numMatches,
+            matchIndex: result.matchIndex,
+            pos: result.pos
+          } : undefined
+        };
+      };
+      annotationManager === null || annotationManager === void 0 || annotationManager.hook('applyDraft', applyDraft);
+      return function () {
+        annotationManager === null || annotationManager === void 0 || annotationManager.unhook('applyDraft', applyDraft);
+      };
+    }
+  }, [annotationManager, onCreateCallback, onCloseCallback, isDrafting, draftId, dispatch]);
+
+  // Please remove this NOP function when the flag platform_editor_comments_api_manager is removed.
+  var nop = (0, _react.useMemo)(function () {
+    return function () {
+      return false;
+    };
+  }, []);
   return /*#__PURE__*/_react.default.createElement(Component, {
     range: range,
     draftRange: draftRange
@@ -195,11 +368,11 @@ var SelectionInlineCommentMounter = exports.SelectionInlineCommentMounter = /*#_
     ,
     wrapperDOM: wrapperDOM.current,
     isAnnotationAllowed: isAnnotationAllowed,
-    onClose: onCloseCallback,
-    onCreate: onCreateCallback,
+    onClose: (0, _platformFeatureFlags.fg)('platform_editor_comments_api_manager') ? nop : onCloseCallback,
+    onCreate: (0, _platformFeatureFlags.fg)('platform_editor_comments_api_manager') ? nop : onCreateCallback,
     getAnnotationIndexMatch: createIndexCallback,
-    applyDraftMode: applyDraftModeCallback,
-    removeDraftMode: removeDraftModeCallback,
+    applyDraftMode: (0, _platformFeatureFlags.fg)('platform_editor_comments_api_manager') ? nop : applyDraftModeCallback,
+    removeDraftMode: (0, _platformFeatureFlags.fg)('platform_editor_comments_api_manager') ? nop : removeDraftModeCallback,
     inlineNodeTypes: inlineNodeTypes
   });
 });

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

@@ -47,7 +47,7 @@ import { useMemoFromPropsDerivative } from './useMemoFromPropsDerivative';
 export const NORMAL_SEVERITY_THRESHOLD = 2000;
 export const DEGRADED_SEVERITY_THRESHOLD = 3000;
 const packageName = "@atlaskit/renderer";
-const packageVersion = "115.0.2";
+const packageVersion = "115.0.4";
 const setAsQueryContainerStyles = css({
   containerName: 'ak-renderer-wrapper',
   containerType: 'inline-size',