@atlaskit/renderer 118.6.5 → 118.6.6

package/CHANGELOG.md

@@ -1,5 +1,14 @@
 # @atlaskit/renderer
 
+## 118.6.6
+
+### Patch Changes
+
+- [#163587](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/pull-requests/163587)
+  [`59a3ee21507aa`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/59a3ee21507aa) -
+  EDITOR-835 - Can not start another draft after starting a draft in renderer
+- Updated dependencies
+
 ## 118.6.5
 
 ### Patch Changes

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

@@ -62,7 +62,7 @@ function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t =
 var NORMAL_SEVERITY_THRESHOLD = exports.NORMAL_SEVERITY_THRESHOLD = 2000;
 var DEGRADED_SEVERITY_THRESHOLD = exports.DEGRADED_SEVERITY_THRESHOLD = 3000;
 var packageName = "@atlaskit/renderer";
-var packageVersion = "118.6.5";
+var packageVersion = "118.6.6";
 var setAsQueryContainerStyles = (0, _react2.css)({
   containerName: 'ak-renderer-wrapper',
   containerType: 'inline-size'

package/dist/cjs/ui/annotations/hooks/user-selection.js

@@ -29,6 +29,9 @@ var useUserSelectionRange = exports.useUserSelectionRange = function useUserSele
         var sel = document.getSelection();
         if (!sel || sel.type !== 'Range' || sel.rangeCount !== 1) {
           lastRangeRef.current = null; // Clear last range if selection is invalid
+          if ((0, _platformFeatureFlags.fg)('platform_editor_comments_api_manager')) {
+            clearSelectionRange();
+          }
           return;
         }
         var _range = sel.getRangeAt(0);
@@ -66,6 +69,9 @@ var useUserSelectionRange = exports.useUserSelectionRange = function useUserSele
       selectionTimeoutRef.current = setTimeout(function () {
         var sel = document.getSelection();
         if (!sel || sel.type !== 'Range' || sel.rangeCount !== 1) {
+          if ((0, _platformFeatureFlags.fg)('platform_editor_comments_api_manager')) {
+            clearSelectionRange();
+          }
           return;
         }
         var _range = sel.getRangeAt(0);
@@ -100,7 +106,7 @@ var useUserSelectionRange = exports.useUserSelectionRange = function useUserSele
         }
       }, 250);
     }
-  }, [rendererDOM, setSelectionRange]);
+  }, [rendererDOM, setSelectionRange, clearSelectionRange]);
   (0, _react.useEffect)(function () {
     if (!document || !rendererDOM) {
       return;

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

@@ -67,6 +67,7 @@ var SelectionInlineCommentMounter = exports.SelectionInlineCommentMounter = /*#_
   var onCreateCallback = (0, _react.useCallback)(function (annotationId) {
     // We want to support creation on a documentPosition if the user is only using ranges
     // but we want to prioritize draft positions if they are being used by consumers
+    // !!! at this point, the documentPosition can be the wrong position if the user select something else
     var positionToAnnotate = selectionDraftDocumentPosition || documentPosition;
     if (!positionToAnnotate || !applyAnnotation) {
       // TODO: EDITOR-595 - This analytic event is temporary and should be removed once the following issue
@@ -169,7 +170,12 @@ var SelectionInlineCommentMounter = exports.SelectionInlineCommentMounter = /*#_
         }
       }
     });
-    var positionToAnnotate = selectionDraftDocumentPosition || documentPosition;
+
+    // at this point, the documentPosition is the position that the user has selected,
+    // not the selectionDraftDocumentPosition
+    // because the documentPosition is not promoted to selectionDraftDocumentPosition yet
+    // use platform_editor_comments_api_manager here so we can clear the code path when the flag is removed
+    var positionToAnnotate = (0, _platformFeatureFlags.fg)('platform_editor_comments_api_manager') ? documentPosition : selectionDraftDocumentPosition || documentPosition;
     if (!positionToAnnotate || !applyAnnotation || !options.annotationId) {
       return false;
     }
@@ -219,12 +225,9 @@ var SelectionInlineCommentMounter = exports.SelectionInlineCommentMounter = /*#_
     if (annotationManager) {
       var startDraft = function startDraft() {
         var _result$inlineNodeTyp;
-        if (isDrafting) {
-          return {
-            success: false,
-            reason: 'draft-in-progress'
-          };
-        }
+        // if there is a draft in progress, we ignore it and start a new draft
+        // this is because clearing the draft will remove the mark node from the DOM, which will cause the selection range to be invalid
+
         var id = (0, _v.default)();
         var result = applyDraftModeCallback({
           annotationId: id,

package/dist/cjs/ui/annotations/selection/range-validator.js

@@ -26,6 +26,8 @@ var SelectionRangeValidator = exports.SelectionRangeValidator = function Selecti
     draftRange = _useUserSelectionRang2[2],
     clearRange = _useUserSelectionRang2[3];
   var selectionRange = type === 'selection' ? range : null;
+
+  // !!! the draft range will become invalid after the mark DOM is inserted
   if (!selectionRange && !draftRange) {
     return null;
   }

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

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

package/dist/es2019/ui/annotations/hooks/user-selection.js

@@ -29,6 +29,9 @@ export const useUserSelectionRange = props => {
         const sel = document.getSelection();
         if (!sel || sel.type !== 'Range' || sel.rangeCount !== 1) {
           lastRangeRef.current = null; // Clear last range if selection is invalid
+          if (fg('platform_editor_comments_api_manager')) {
+            clearSelectionRange();
+          }
           return;
         }
         let _range = sel.getRangeAt(0);
@@ -67,6 +70,9 @@ export const useUserSelectionRange = props => {
       selectionTimeoutRef.current = setTimeout(() => {
         const sel = document.getSelection();
         if (!sel || sel.type !== 'Range' || sel.rangeCount !== 1) {
+          if (fg('platform_editor_comments_api_manager')) {
+            clearSelectionRange();
+          }
           return;
         }
         const _range = sel.getRangeAt(0);
@@ -103,7 +109,7 @@ export const useUserSelectionRange = props => {
         }
       }, 250);
     }
-  }, [rendererDOM, setSelectionRange]);
+  }, [rendererDOM, setSelectionRange, clearSelectionRange]);
   useEffect(() => {
     if (!document || !rendererDOM) {
       return;

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

@@ -64,6 +64,7 @@ export const SelectionInlineCommentMounter = /*#__PURE__*/React.memo(props => {
   const onCreateCallback = useCallback(annotationId => {
     // We want to support creation on a documentPosition if the user is only using ranges
     // but we want to prioritize draft positions if they are being used by consumers
+    // !!! at this point, the documentPosition can be the wrong position if the user select something else
     const positionToAnnotate = selectionDraftDocumentPosition || documentPosition;
     if (!positionToAnnotate || !applyAnnotation) {
       // TODO: EDITOR-595 - This analytic event is temporary and should be removed once the following issue
@@ -166,7 +167,12 @@ export const SelectionInlineCommentMounter = /*#__PURE__*/React.memo(props => {
         }
       }
     });
-    const positionToAnnotate = selectionDraftDocumentPosition || documentPosition;
+
+    // at this point, the documentPosition is the position that the user has selected,
+    // not the selectionDraftDocumentPosition
+    // because the documentPosition is not promoted to selectionDraftDocumentPosition yet
+    // use platform_editor_comments_api_manager here so we can clear the code path when the flag is removed
+    const positionToAnnotate = fg('platform_editor_comments_api_manager') ? documentPosition : selectionDraftDocumentPosition || documentPosition;
     if (!positionToAnnotate || !applyAnnotation || !options.annotationId) {
       return false;
     }
@@ -216,12 +222,9 @@ export const SelectionInlineCommentMounter = /*#__PURE__*/React.memo(props => {
     if (annotationManager) {
       const startDraft = () => {
         var _result$inlineNodeTyp;
-        if (isDrafting) {
-          return {
-            success: false,
-            reason: 'draft-in-progress'
-          };
-        }
+        // if there is a draft in progress, we ignore it and start a new draft
+        // this is because clearing the draft will remove the mark node from the DOM, which will cause the selection range to be invalid
+
         const id = uuid();
         const result = applyDraftModeCallback({
           annotationId: id,

package/dist/es2019/ui/annotations/selection/range-validator.js

@@ -13,6 +13,8 @@ export const SelectionRangeValidator = props => {
     rendererRef
   });
   const selectionRange = type === 'selection' ? range : null;
+
+  // !!! the draft range will become invalid after the mark DOM is inserted
   if (!selectionRange && !draftRange) {
     return null;
   }

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

@@ -53,7 +53,7 @@ import { PortalContext } from './PortalContext';
 export var NORMAL_SEVERITY_THRESHOLD = 2000;
 export var DEGRADED_SEVERITY_THRESHOLD = 3000;
 var packageName = "@atlaskit/renderer";
-var packageVersion = "118.6.5";
+var packageVersion = "118.6.6";
 var setAsQueryContainerStyles = css({
   containerName: 'ak-renderer-wrapper',
   containerType: 'inline-size'

package/dist/esm/ui/annotations/hooks/user-selection.js

@@ -23,6 +23,9 @@ export var useUserSelectionRange = function useUserSelectionRange(props) {
         var sel = document.getSelection();
         if (!sel || sel.type !== 'Range' || sel.rangeCount !== 1) {
           lastRangeRef.current = null; // Clear last range if selection is invalid
+          if (fg('platform_editor_comments_api_manager')) {
+            clearSelectionRange();
+          }
           return;
         }
         var _range = sel.getRangeAt(0);
@@ -60,6 +63,9 @@ export var useUserSelectionRange = function useUserSelectionRange(props) {
       selectionTimeoutRef.current = setTimeout(function () {
         var sel = document.getSelection();
         if (!sel || sel.type !== 'Range' || sel.rangeCount !== 1) {
+          if (fg('platform_editor_comments_api_manager')) {
+            clearSelectionRange();
+          }
           return;
         }
         var _range = sel.getRangeAt(0);
@@ -94,7 +100,7 @@ export var useUserSelectionRange = function useUserSelectionRange(props) {
         }
       }, 250);
     }
-  }, [rendererDOM, setSelectionRange]);
+  }, [rendererDOM, setSelectionRange, clearSelectionRange]);
   useEffect(function () {
     if (!document || !rendererDOM) {
       return;

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

@@ -58,6 +58,7 @@ export var SelectionInlineCommentMounter = /*#__PURE__*/React.memo(function (pro
   var onCreateCallback = useCallback(function (annotationId) {
     // We want to support creation on a documentPosition if the user is only using ranges
     // but we want to prioritize draft positions if they are being used by consumers
+    // !!! at this point, the documentPosition can be the wrong position if the user select something else
     var positionToAnnotate = selectionDraftDocumentPosition || documentPosition;
     if (!positionToAnnotate || !applyAnnotation) {
       // TODO: EDITOR-595 - This analytic event is temporary and should be removed once the following issue
@@ -160,7 +161,12 @@ export var SelectionInlineCommentMounter = /*#__PURE__*/React.memo(function (pro
         }
       }
     });
-    var positionToAnnotate = selectionDraftDocumentPosition || documentPosition;
+
+    // at this point, the documentPosition is the position that the user has selected,
+    // not the selectionDraftDocumentPosition
+    // because the documentPosition is not promoted to selectionDraftDocumentPosition yet
+    // use platform_editor_comments_api_manager here so we can clear the code path when the flag is removed
+    var positionToAnnotate = fg('platform_editor_comments_api_manager') ? documentPosition : selectionDraftDocumentPosition || documentPosition;
     if (!positionToAnnotate || !applyAnnotation || !options.annotationId) {
       return false;
     }
@@ -210,12 +216,9 @@ export var SelectionInlineCommentMounter = /*#__PURE__*/React.memo(function (pro
     if (annotationManager) {
       var startDraft = function startDraft() {
         var _result$inlineNodeTyp;
-        if (isDrafting) {
-          return {
-            success: false,
-            reason: 'draft-in-progress'
-          };
-        }
+        // if there is a draft in progress, we ignore it and start a new draft
+        // this is because clearing the draft will remove the mark node from the DOM, which will cause the selection range to be invalid
+
         var id = uuid();
         var result = applyDraftModeCallback({
           annotationId: id,

package/dist/esm/ui/annotations/selection/range-validator.js

@@ -17,6 +17,8 @@ export var SelectionRangeValidator = function SelectionRangeValidator(props) {
     draftRange = _useUserSelectionRang2[2],
     clearRange = _useUserSelectionRang2[3];
   var selectionRange = type === 'selection' ? range : null;
+
+  // !!! the draft range will become invalid after the mark DOM is inserted
   if (!selectionRange && !draftRange) {
     return null;
   }

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@atlaskit/renderer",
-	"version": "118.6.5",
+	"version": "118.6.6",
 	"description": "Renderer component",
 	"publishConfig": {
 		"registry": "https://registry.npmjs.org/"