@atlaskit/editor-plugin-annotation 1.10.0 → 1.10.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/CHANGELOG.md CHANGED
@@ -1,5 +1,31 @@
1
1
  # @atlaskit/editor-plugin-annotation
2
2
 
3
+ ## 1.10.2
4
+
5
+ ### Patch Changes
6
+
7
+ - [#111460](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/111460)
8
+ [`c7cfc31d4a7b6`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/c7cfc31d4a7b6) -
9
+ ED-23707 fix issue where comment ui was not triggered on commented node selections.
10
+ - [#110966](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/110966)
11
+ [`31348c335b4b3`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/31348c335b4b3) -
12
+ ED-23690 - add inlineNodeTypes property to AnnotationComponentProps
13
+ - Updated dependencies
14
+
15
+ ## 1.10.1
16
+
17
+ ### Patch Changes
18
+
19
+ - [#109969](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/109969)
20
+ [`52590a0b562ef`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/52590a0b562ef) -
21
+ ED-23690 Adds an attribute to annotation analytic events with the name of nodes inside the
22
+ annotation range
23
+ - [#109932](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/109932)
24
+ [`a973fd903870a`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/a973fd903870a) -
25
+ ED-23649 fixes a variety of issues such as inline nodes not being fully interactive, and missing
26
+ selection visuals when inside an annotation.
27
+ - Updated dependencies
28
+
3
29
  ## 1.10.0
4
30
 
5
31
  ### Minor Changes
@@ -7,18 +7,20 @@ exports.default = void 0;
7
7
  var _adfSchema = require("@atlaskit/adf-schema");
8
8
  var _analytics = require("@atlaskit/editor-common/analytics");
9
9
  var _mark = require("@atlaskit/editor-common/mark");
10
+ var _utils = require("@atlaskit/editor-common/utils");
10
11
  var _state = require("@atlaskit/editor-prosemirror/state");
11
- var _utils = require("../utils");
12
+ var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
13
+ var _utils2 = require("../utils");
12
14
  var addAnnotationMark = function addAnnotationMark(id, supportedBlockNodes) {
13
15
  return function (transaction, state) {
14
- var inlineCommentState = (0, _utils.getPluginState)(state);
16
+ var inlineCommentState = (0, _utils2.getPluginState)(state);
15
17
  var _ref = inlineCommentState || {},
16
18
  bookmark = _ref.bookmark;
17
19
  var annotationMark = state.schema.marks.annotation.create({
18
20
  id: id,
19
21
  type: _adfSchema.AnnotationTypes.INLINE_COMMENT
20
22
  });
21
- var _resolveDraftBookmark = (0, _utils.resolveDraftBookmark)(state, bookmark, supportedBlockNodes),
23
+ var _resolveDraftBookmark = (0, _utils2.resolveDraftBookmark)(state, bookmark, supportedBlockNodes),
22
24
  from = _resolveDraftBookmark.from,
23
25
  to = _resolveDraftBookmark.to,
24
26
  head = _resolveDraftBookmark.head,
@@ -56,7 +58,7 @@ var addOpenCloseAnalytics = function addOpenCloseAnalytics(editorAnalyticsAPI) {
56
58
  return function (drafting) {
57
59
  var method = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : _analytics.INPUT_METHOD.TOOLBAR;
58
60
  return function (transaction, state) {
59
- var draftingPayload = (0, _utils.getDraftCommandAnalyticsPayload)(drafting, method)(state);
61
+ var draftingPayload = (0, _utils2.getDraftCommandAnalyticsPayload)(drafting, method)(state);
60
62
  editorAnalyticsAPI === null || editorAnalyticsAPI === void 0 || editorAnalyticsAPI.attachAnalyticsEvent(draftingPayload)(transaction);
61
63
  return transaction;
62
64
  };
@@ -64,13 +66,26 @@ var addOpenCloseAnalytics = function addOpenCloseAnalytics(editorAnalyticsAPI) {
64
66
  };
65
67
  var addInsertAnalytics = function addInsertAnalytics(editorAnalyticsAPI) {
66
68
  return function (transaction, state) {
67
- editorAnalyticsAPI === null || editorAnalyticsAPI === void 0 || editorAnalyticsAPI.attachAnalyticsEvent({
69
+ var analyticsEvent = {
68
70
  action: _analytics.ACTION.INSERTED,
69
71
  actionSubject: _analytics.ACTION_SUBJECT.ANNOTATION,
70
72
  eventType: _analytics.EVENT_TYPE.TRACK,
71
73
  actionSubjectId: _analytics.ACTION_SUBJECT_ID.INLINE_COMMENT,
72
74
  attributes: {}
73
- })(transaction);
75
+ };
76
+ if ((0, _platformFeatureFlags.getBooleanFF)('platform.editor.allow-inline-comments-for-inline-nodes-round-2_ctuxz')) {
77
+ var _ref2 = (0, _utils2.getPluginState)(state) || {},
78
+ bookmark = _ref2.bookmark;
79
+
80
+ // When this FF is removed we can move the analytics event creation inside of the
81
+ // attachAnalyticsEvent and get type inference for the attributes.
82
+ // @ts-ignore
83
+ analyticsEvent.attributes.inlineNodeNames = (0, _utils.getRangeInlineNodeNames)({
84
+ doc: state.doc,
85
+ pos: (0, _utils2.resolveDraftBookmark)(state, bookmark)
86
+ });
87
+ }
88
+ editorAnalyticsAPI === null || editorAnalyticsAPI === void 0 || editorAnalyticsAPI.attachAnalyticsEvent(analyticsEvent)(transaction);
74
89
  return transaction;
75
90
  };
76
91
  };
@@ -12,6 +12,7 @@ var _adfSchema = require("@atlaskit/adf-schema");
12
12
  var _analytics = require("@atlaskit/editor-common/analytics");
13
13
  var _safePlugin = require("@atlaskit/editor-common/safe-plugin");
14
14
  var _view = require("@atlaskit/editor-prosemirror/view");
15
+ var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
15
16
  var _commands = require("../commands");
16
17
  var _nodeviews = require("../nodeviews");
17
18
  var _utils = require("../utils");
@@ -248,10 +249,25 @@ var inlineCommentPlugin = exports.inlineCommentPlugin = function inlineCommentPl
248
249
  key: _utils.decorationKey.block
249
250
  }));
250
251
  } else {
251
- focusDecorations.push(_view.Decoration.inline(pos, pos + node.nodeSize, {
252
- class: "".concat((0, _nodeviews.getAnnotationViewClassname)(isUnresolved, isSelected), " ").concat(isUnresolved),
253
- nodeName: 'span'
254
- }));
252
+ if ((0, _platformFeatureFlags.getBooleanFF)('platform.editor.allow-inline-comments-for-inline-nodes-round-2_ctuxz')) {
253
+ if (node.isText) {
254
+ focusDecorations.push(_view.Decoration.inline(pos, pos + node.nodeSize, {
255
+ class: "".concat((0, _nodeviews.getAnnotationViewClassname)(isUnresolved, isSelected), " ").concat(isUnresolved),
256
+ nodeName: 'span'
257
+ }));
258
+ } else {
259
+ focusDecorations.push(_view.Decoration.node(pos, pos + node.nodeSize, {
260
+ class: "".concat((0, _nodeviews.getAnnotationViewClassname)(isUnresolved, isSelected), " ").concat(isUnresolved)
261
+ }, {
262
+ key: _utils.decorationKey.block
263
+ }));
264
+ }
265
+ } else {
266
+ focusDecorations.push(_view.Decoration.inline(pos, pos + node.nodeSize, {
267
+ class: "".concat((0, _nodeviews.getAnnotationViewClassname)(isUnresolved, isSelected), " ").concat(isUnresolved),
268
+ nodeName: 'span'
269
+ }));
270
+ }
255
271
  }
256
272
  }
257
273
  });
@@ -9,10 +9,11 @@ var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/de
9
9
  var _react = _interopRequireDefault(require("react"));
10
10
  var _adfSchema = require("@atlaskit/adf-schema");
11
11
  var _analytics = require("@atlaskit/editor-common/analytics");
12
- var _utils = require("@atlaskit/editor-prosemirror/utils");
12
+ var _utils = require("@atlaskit/editor-common/utils");
13
+ var _utils2 = require("@atlaskit/editor-prosemirror/utils");
13
14
  var _commands = require("../commands");
14
15
  var _types = require("../types");
15
- var _utils2 = require("../utils");
16
+ var _utils3 = require("../utils");
16
17
  var _AnnotationViewWrapper = require("./AnnotationViewWrapper");
17
18
  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; }
18
19
  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; }
@@ -44,18 +45,18 @@ function InlineCommentView(_ref) {
44
45
  dispatch = editorView.dispatch;
45
46
  var CreateComponent = inlineCommentProvider.createComponent,
46
47
  ViewComponent = inlineCommentProvider.viewComponent;
47
- var inlineCommentState = (0, _utils2.getPluginState)(state);
48
+ var inlineCommentState = (0, _utils3.getPluginState)(state);
48
49
  var _ref2 = inlineCommentState || {},
49
50
  bookmark = _ref2.bookmark,
50
51
  selectedAnnotations = _ref2.selectedAnnotations,
51
52
  annotations = _ref2.annotations,
52
53
  isInlineCommentViewClosed = _ref2.isInlineCommentViewClosed;
53
- var annotationsList = (0, _utils2.getAllAnnotations)(editorView.state.doc);
54
- var selection = (0, _utils2.getSelectionPositions)(state, inlineCommentState);
54
+ var annotationsList = (0, _utils3.getAllAnnotations)(editorView.state.doc);
55
+ var selection = (0, _utils3.getSelectionPositions)(state, inlineCommentState);
55
56
  var position = findPosForDOM(selection);
56
57
  var dom;
57
58
  try {
58
- dom = (0, _utils.findDomRefAtPos)(position, editorView.domAtPos.bind(editorView));
59
+ dom = (0, _utils2.findDomRefAtPos)(position, editorView.domAtPos.bind(editorView));
59
60
  } catch (error) {
60
61
  // eslint-disable-next-line no-console
61
62
  console.warn(error);
@@ -78,6 +79,10 @@ function InlineCommentView(_ref) {
78
79
  if (!dom) {
79
80
  return null;
80
81
  }
82
+ var inlineNodeTypes = (0, _utils.getRangeInlineNodeNames)({
83
+ doc: state.doc,
84
+ pos: selection
85
+ });
81
86
 
82
87
  // Create Component
83
88
  if (bookmark) {
@@ -100,7 +105,8 @@ function InlineCommentView(_ref) {
100
105
  onClose: function onClose() {
101
106
  (0, _commands.setInlineCommentDraftState)(editorAnalyticsAPI)(false)(editorView.state, editorView.dispatch);
102
107
  !editorView.hasFocus() && editorView.focus();
103
- }
108
+ },
109
+ inlineNodeTypes: inlineNodeTypes
104
110
  }));
105
111
  }
106
112
 
@@ -142,11 +148,12 @@ function InlineCommentView(_ref) {
142
148
  return /*#__PURE__*/_react.default.createElement(_AnnotationViewWrapper.AnnotationViewWrapper, {
143
149
  "data-editor-popup": "true",
144
150
  "data-testid": _types.AnnotationTestIds.floatingComponent,
145
- key: (0, _utils2.getAnnotationViewKey)(activeAnnotations),
151
+ key: (0, _utils3.getAnnotationViewKey)(activeAnnotations),
146
152
  onViewed: onAnnotationViewed
147
153
  }, /*#__PURE__*/_react.default.createElement(ViewComponent, {
148
154
  annotationsList: annotationsList,
149
155
  annotations: activeAnnotations,
156
+ inlineNodeTypes: inlineNodeTypes,
150
157
  dom: dom,
151
158
  onDelete: function onDelete(id) {
152
159
  return (0, _commands.removeInlineCommentNearSelection)(id, inlineCommentProvider.supportedBlockNodes)(state, dispatch);
package/dist/cjs/utils.js CHANGED
@@ -173,7 +173,15 @@ var findAnnotationsInSelection = exports.findAnnotationsInSelection = function f
173
173
  anchor = selection.anchor;
174
174
  // Only detect annotations on caret selection
175
175
  if (!empty || !doc) {
176
- return [];
176
+ if ((0, _platformFeatureFlags.getBooleanFF)('platform.editor.allow-inline-comments-for-inline-nodes-round-2_ctuxz')) {
177
+ if (selection instanceof _state.NodeSelection && ['inlineCard', 'emoji', 'date', 'mention', 'status'].includes(selection.node.type.name)) {
178
+ // Inline comments on these nodes are supported -- so we continue to find annotations
179
+ } else {
180
+ return [];
181
+ }
182
+ } else {
183
+ return [];
184
+ }
177
185
  }
178
186
  var node = doc.nodeAt(anchor);
179
187
  var nodeBefore = $anchor.nodeBefore;
@@ -289,6 +297,14 @@ var getDraftCommandAnalyticsPayload = exports.getDraftCommandAnalyticsPayload =
289
297
  overlap: getAnnotationsInSelectionCount(state)
290
298
  };
291
299
  }
300
+ if ((0, _platformFeatureFlags.getBooleanFF)('platform.editor.allow-inline-comments-for-inline-nodes-round-2_ctuxz')) {
301
+ var _ref3 = getPluginState(state) || {},
302
+ bookmark = _ref3.bookmark;
303
+ attributes.inlineNodeNames = (0, _utils.getRangeInlineNodeNames)({
304
+ doc: state.doc,
305
+ pos: resolveDraftBookmark(state, bookmark)
306
+ });
307
+ }
292
308
  return {
293
309
  action: drafting ? _analytics.ACTION.OPENED : _analytics.ACTION.CLOSED,
294
310
  actionSubject: _analytics.ACTION_SUBJECT.ANNOTATION,
@@ -303,8 +319,8 @@ var isSelectionValid = exports.isSelectionValid = function isSelectionValid(stat
303
319
  var _currentMediaNodeWith;
304
320
  var _supportedNodes = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : [];
305
321
  var selection = state.selection;
306
- var _ref3 = getPluginState(state) || {},
307
- disallowOnWhitespace = _ref3.disallowOnWhitespace;
322
+ var _ref4 = getPluginState(state) || {},
323
+ disallowOnWhitespace = _ref4.disallowOnWhitespace;
308
324
 
309
325
  // Allow media so that it can enter draft mode
310
326
  if (isCommentOnMediaOn && (_currentMediaNodeWith = (0, _mediaSingle.currentMediaNodeWithPos)(state)) !== null && _currentMediaNodeWith !== void 0 && _currentMediaNodeWith.node) {
@@ -1,7 +1,9 @@
1
1
  import { AnnotationTypes } from '@atlaskit/adf-schema';
2
2
  import { ACTION, ACTION_SUBJECT, ACTION_SUBJECT_ID, EVENT_TYPE, INPUT_METHOD } from '@atlaskit/editor-common/analytics';
3
3
  import { applyMarkOnRange } from '@atlaskit/editor-common/mark';
4
+ import { getRangeInlineNodeNames } from '@atlaskit/editor-common/utils';
4
5
  import { NodeSelection, TextSelection } from '@atlaskit/editor-prosemirror/state';
6
+ import { getBooleanFF } from '@atlaskit/platform-feature-flags';
5
7
  import { getDraftCommandAnalyticsPayload, getPluginState, resolveDraftBookmark } from '../utils';
6
8
  const addAnnotationMark = (id, supportedBlockNodes) => (transaction, state) => {
7
9
  const inlineCommentState = getPluginState(state);
@@ -48,13 +50,27 @@ const addOpenCloseAnalytics = editorAnalyticsAPI => (drafting, method = INPUT_ME
48
50
  return transaction;
49
51
  };
50
52
  const addInsertAnalytics = editorAnalyticsAPI => (transaction, state) => {
51
- editorAnalyticsAPI === null || editorAnalyticsAPI === void 0 ? void 0 : editorAnalyticsAPI.attachAnalyticsEvent({
53
+ const analyticsEvent = {
52
54
  action: ACTION.INSERTED,
53
55
  actionSubject: ACTION_SUBJECT.ANNOTATION,
54
56
  eventType: EVENT_TYPE.TRACK,
55
57
  actionSubjectId: ACTION_SUBJECT_ID.INLINE_COMMENT,
56
58
  attributes: {}
57
- })(transaction);
59
+ };
60
+ if (getBooleanFF('platform.editor.allow-inline-comments-for-inline-nodes-round-2_ctuxz')) {
61
+ const {
62
+ bookmark
63
+ } = getPluginState(state) || {};
64
+
65
+ // When this FF is removed we can move the analytics event creation inside of the
66
+ // attachAnalyticsEvent and get type inference for the attributes.
67
+ // @ts-ignore
68
+ analyticsEvent.attributes.inlineNodeNames = getRangeInlineNodeNames({
69
+ doc: state.doc,
70
+ pos: resolveDraftBookmark(state, bookmark)
71
+ });
72
+ }
73
+ editorAnalyticsAPI === null || editorAnalyticsAPI === void 0 ? void 0 : editorAnalyticsAPI.attachAnalyticsEvent(analyticsEvent)(transaction);
58
74
  return transaction;
59
75
  };
60
76
  const addResolveAnalytics = editorAnalyticsAPI => method => (transaction, state) => {
@@ -2,6 +2,7 @@ import { AnnotationTypes } from '@atlaskit/adf-schema';
2
2
  import { RESOLVE_METHOD } from '@atlaskit/editor-common/analytics';
3
3
  import { SafePlugin } from '@atlaskit/editor-common/safe-plugin';
4
4
  import { Decoration, DecorationSet } from '@atlaskit/editor-prosemirror/view';
5
+ import { getBooleanFF } from '@atlaskit/platform-feature-flags';
5
6
  import { clearDirtyMark, closeComponent, setInlineCommentsVisibility, setSelectedAnnotation, updateInlineCommentResolvedState, updateMouseState } from '../commands';
6
7
  import { AnnotationNodeView, getAnnotationViewClassname, getBlockAnnotationViewClassname } from '../nodeviews';
7
8
  import { decorationKey, getAllAnnotations, getPluginState, inlineCommentPluginKey } from '../utils';
@@ -184,10 +185,25 @@ export const inlineCommentPlugin = options => {
184
185
  key: decorationKey.block
185
186
  }));
186
187
  } else {
187
- focusDecorations.push(Decoration.inline(pos, pos + node.nodeSize, {
188
- class: `${getAnnotationViewClassname(isUnresolved, isSelected)} ${isUnresolved}`,
189
- nodeName: 'span'
190
- }));
188
+ if (getBooleanFF('platform.editor.allow-inline-comments-for-inline-nodes-round-2_ctuxz')) {
189
+ if (node.isText) {
190
+ focusDecorations.push(Decoration.inline(pos, pos + node.nodeSize, {
191
+ class: `${getAnnotationViewClassname(isUnresolved, isSelected)} ${isUnresolved}`,
192
+ nodeName: 'span'
193
+ }));
194
+ } else {
195
+ focusDecorations.push(Decoration.node(pos, pos + node.nodeSize, {
196
+ class: `${getAnnotationViewClassname(isUnresolved, isSelected)} ${isUnresolved}`
197
+ }, {
198
+ key: decorationKey.block
199
+ }));
200
+ }
201
+ } else {
202
+ focusDecorations.push(Decoration.inline(pos, pos + node.nodeSize, {
203
+ class: `${getAnnotationViewClassname(isUnresolved, isSelected)} ${isUnresolved}`,
204
+ nodeName: 'span'
205
+ }));
206
+ }
191
207
  }
192
208
  }
193
209
  });
@@ -1,6 +1,7 @@
1
1
  import React from 'react';
2
2
  import { AnnotationTypes } from '@atlaskit/adf-schema';
3
3
  import { ACTION, ACTION_SUBJECT, ACTION_SUBJECT_ID, CONTENT_COMPONENT, EVENT_TYPE, RESOLVE_METHOD } from '@atlaskit/editor-common/analytics';
4
+ import { getRangeInlineNodeNames } from '@atlaskit/editor-common/utils';
4
5
  import { findDomRefAtPos } from '@atlaskit/editor-prosemirror/utils';
5
6
  import { closeComponent, createAnnotation, removeInlineCommentNearSelection, setInlineCommentDraftState, updateInlineCommentResolvedState } from '../commands';
6
7
  import { AnnotationTestIds } from '../types';
@@ -76,6 +77,10 @@ export function InlineCommentView({
76
77
  if (!dom) {
77
78
  return null;
78
79
  }
80
+ const inlineNodeTypes = getRangeInlineNodeNames({
81
+ doc: state.doc,
82
+ pos: selection
83
+ });
79
84
 
80
85
  // Create Component
81
86
  if (bookmark) {
@@ -98,7 +103,8 @@ export function InlineCommentView({
98
103
  onClose: () => {
99
104
  setInlineCommentDraftState(editorAnalyticsAPI)(false)(editorView.state, editorView.dispatch);
100
105
  !editorView.hasFocus() && editorView.focus();
101
- }
106
+ },
107
+ inlineNodeTypes: inlineNodeTypes
102
108
  }));
103
109
  }
104
110
 
@@ -145,6 +151,7 @@ export function InlineCommentView({
145
151
  }, /*#__PURE__*/React.createElement(ViewComponent, {
146
152
  annotationsList: annotationsList,
147
153
  annotations: activeAnnotations,
154
+ inlineNodeTypes: inlineNodeTypes,
148
155
  dom: dom,
149
156
  onDelete: id => removeInlineCommentNearSelection(id, inlineCommentProvider.supportedBlockNodes)(state, dispatch),
150
157
  onResolve: id => updateInlineCommentResolvedState(editorAnalyticsAPI)({
@@ -2,7 +2,7 @@ import { AnnotationTypes } from '@atlaskit/adf-schema';
2
2
  import { ACTION, ACTION_SUBJECT, ACTION_SUBJECT_ID, EVENT_TYPE } from '@atlaskit/editor-common/analytics';
3
3
  import { currentMediaNodeWithPos } from '@atlaskit/editor-common/media-single';
4
4
  import { AnnotationSharedClassNames, BlockAnnotationSharedClassNames } from '@atlaskit/editor-common/styles';
5
- import { canApplyAnnotationOnRange, containsAnyAnnotations, getAnnotationIdsFromRange, hasAnnotationMark, isParagraph, isText } from '@atlaskit/editor-common/utils';
5
+ import { canApplyAnnotationOnRange, containsAnyAnnotations, getAnnotationIdsFromRange, getRangeInlineNodeNames, hasAnnotationMark, isParagraph, isText } from '@atlaskit/editor-common/utils';
6
6
  import { AllSelection, NodeSelection, PluginKey, TextSelection } from '@atlaskit/editor-prosemirror/state';
7
7
  import { Decoration } from '@atlaskit/editor-prosemirror/view';
8
8
  import { getBooleanFF } from '@atlaskit/platform-feature-flags';
@@ -136,7 +136,15 @@ export const findAnnotationsInSelection = (selection, doc, isCommentsOnMediaMedi
136
136
  } = selection;
137
137
  // Only detect annotations on caret selection
138
138
  if (!empty || !doc) {
139
- return [];
139
+ if (getBooleanFF('platform.editor.allow-inline-comments-for-inline-nodes-round-2_ctuxz')) {
140
+ if (selection instanceof NodeSelection && ['inlineCard', 'emoji', 'date', 'mention', 'status'].includes(selection.node.type.name)) {
141
+ // Inline comments on these nodes are supported -- so we continue to find annotations
142
+ } else {
143
+ return [];
144
+ }
145
+ } else {
146
+ return [];
147
+ }
140
148
  }
141
149
  const node = doc.nodeAt(anchor);
142
150
  const nodeBefore = $anchor.nodeBefore;
@@ -251,6 +259,15 @@ export const getDraftCommandAnalyticsPayload = (drafting, inputMethod) => {
251
259
  overlap: getAnnotationsInSelectionCount(state)
252
260
  };
253
261
  }
262
+ if (getBooleanFF('platform.editor.allow-inline-comments-for-inline-nodes-round-2_ctuxz')) {
263
+ const {
264
+ bookmark
265
+ } = getPluginState(state) || {};
266
+ attributes.inlineNodeNames = getRangeInlineNodeNames({
267
+ doc: state.doc,
268
+ pos: resolveDraftBookmark(state, bookmark)
269
+ });
270
+ }
254
271
  return {
255
272
  action: drafting ? ACTION.OPENED : ACTION.CLOSED,
256
273
  actionSubject: ACTION_SUBJECT.ANNOTATION,
@@ -1,7 +1,9 @@
1
1
  import { AnnotationTypes } from '@atlaskit/adf-schema';
2
2
  import { ACTION, ACTION_SUBJECT, ACTION_SUBJECT_ID, EVENT_TYPE, INPUT_METHOD } from '@atlaskit/editor-common/analytics';
3
3
  import { applyMarkOnRange } from '@atlaskit/editor-common/mark';
4
+ import { getRangeInlineNodeNames } from '@atlaskit/editor-common/utils';
4
5
  import { NodeSelection, TextSelection } from '@atlaskit/editor-prosemirror/state';
6
+ import { getBooleanFF } from '@atlaskit/platform-feature-flags';
5
7
  import { getDraftCommandAnalyticsPayload, getPluginState, resolveDraftBookmark } from '../utils';
6
8
  var addAnnotationMark = function addAnnotationMark(id, supportedBlockNodes) {
7
9
  return function (transaction, state) {
@@ -58,13 +60,26 @@ var addOpenCloseAnalytics = function addOpenCloseAnalytics(editorAnalyticsAPI) {
58
60
  };
59
61
  var addInsertAnalytics = function addInsertAnalytics(editorAnalyticsAPI) {
60
62
  return function (transaction, state) {
61
- editorAnalyticsAPI === null || editorAnalyticsAPI === void 0 || editorAnalyticsAPI.attachAnalyticsEvent({
63
+ var analyticsEvent = {
62
64
  action: ACTION.INSERTED,
63
65
  actionSubject: ACTION_SUBJECT.ANNOTATION,
64
66
  eventType: EVENT_TYPE.TRACK,
65
67
  actionSubjectId: ACTION_SUBJECT_ID.INLINE_COMMENT,
66
68
  attributes: {}
67
- })(transaction);
69
+ };
70
+ if (getBooleanFF('platform.editor.allow-inline-comments-for-inline-nodes-round-2_ctuxz')) {
71
+ var _ref2 = getPluginState(state) || {},
72
+ bookmark = _ref2.bookmark;
73
+
74
+ // When this FF is removed we can move the analytics event creation inside of the
75
+ // attachAnalyticsEvent and get type inference for the attributes.
76
+ // @ts-ignore
77
+ analyticsEvent.attributes.inlineNodeNames = getRangeInlineNodeNames({
78
+ doc: state.doc,
79
+ pos: resolveDraftBookmark(state, bookmark)
80
+ });
81
+ }
82
+ editorAnalyticsAPI === null || editorAnalyticsAPI === void 0 || editorAnalyticsAPI.attachAnalyticsEvent(analyticsEvent)(transaction);
68
83
  return transaction;
69
84
  };
70
85
  };
@@ -5,6 +5,7 @@ import { AnnotationTypes } from '@atlaskit/adf-schema';
5
5
  import { RESOLVE_METHOD } from '@atlaskit/editor-common/analytics';
6
6
  import { SafePlugin } from '@atlaskit/editor-common/safe-plugin';
7
7
  import { Decoration, DecorationSet } from '@atlaskit/editor-prosemirror/view';
8
+ import { getBooleanFF } from '@atlaskit/platform-feature-flags';
8
9
  import { clearDirtyMark, closeComponent, setInlineCommentsVisibility, setSelectedAnnotation, updateInlineCommentResolvedState, updateMouseState } from '../commands';
9
10
  import { AnnotationNodeView, getAnnotationViewClassname, getBlockAnnotationViewClassname } from '../nodeviews';
10
11
  import { decorationKey, getAllAnnotations, getPluginState, inlineCommentPluginKey } from '../utils';
@@ -241,10 +242,25 @@ export var inlineCommentPlugin = function inlineCommentPlugin(options) {
241
242
  key: decorationKey.block
242
243
  }));
243
244
  } else {
244
- focusDecorations.push(Decoration.inline(pos, pos + node.nodeSize, {
245
- class: "".concat(getAnnotationViewClassname(isUnresolved, isSelected), " ").concat(isUnresolved),
246
- nodeName: 'span'
247
- }));
245
+ if (getBooleanFF('platform.editor.allow-inline-comments-for-inline-nodes-round-2_ctuxz')) {
246
+ if (node.isText) {
247
+ focusDecorations.push(Decoration.inline(pos, pos + node.nodeSize, {
248
+ class: "".concat(getAnnotationViewClassname(isUnresolved, isSelected), " ").concat(isUnresolved),
249
+ nodeName: 'span'
250
+ }));
251
+ } else {
252
+ focusDecorations.push(Decoration.node(pos, pos + node.nodeSize, {
253
+ class: "".concat(getAnnotationViewClassname(isUnresolved, isSelected), " ").concat(isUnresolved)
254
+ }, {
255
+ key: decorationKey.block
256
+ }));
257
+ }
258
+ } else {
259
+ focusDecorations.push(Decoration.inline(pos, pos + node.nodeSize, {
260
+ class: "".concat(getAnnotationViewClassname(isUnresolved, isSelected), " ").concat(isUnresolved),
261
+ nodeName: 'span'
262
+ }));
263
+ }
248
264
  }
249
265
  }
250
266
  });
@@ -4,6 +4,7 @@ function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t =
4
4
  import React from 'react';
5
5
  import { AnnotationTypes } from '@atlaskit/adf-schema';
6
6
  import { ACTION, ACTION_SUBJECT, ACTION_SUBJECT_ID, CONTENT_COMPONENT, EVENT_TYPE, RESOLVE_METHOD } from '@atlaskit/editor-common/analytics';
7
+ import { getRangeInlineNodeNames } from '@atlaskit/editor-common/utils';
7
8
  import { findDomRefAtPos } from '@atlaskit/editor-prosemirror/utils';
8
9
  import { closeComponent, createAnnotation, removeInlineCommentNearSelection, setInlineCommentDraftState, updateInlineCommentResolvedState } from '../commands';
9
10
  import { AnnotationTestIds } from '../types';
@@ -71,6 +72,10 @@ export function InlineCommentView(_ref) {
71
72
  if (!dom) {
72
73
  return null;
73
74
  }
75
+ var inlineNodeTypes = getRangeInlineNodeNames({
76
+ doc: state.doc,
77
+ pos: selection
78
+ });
74
79
 
75
80
  // Create Component
76
81
  if (bookmark) {
@@ -93,7 +98,8 @@ export function InlineCommentView(_ref) {
93
98
  onClose: function onClose() {
94
99
  setInlineCommentDraftState(editorAnalyticsAPI)(false)(editorView.state, editorView.dispatch);
95
100
  !editorView.hasFocus() && editorView.focus();
96
- }
101
+ },
102
+ inlineNodeTypes: inlineNodeTypes
97
103
  }));
98
104
  }
99
105
 
@@ -140,6 +146,7 @@ export function InlineCommentView(_ref) {
140
146
  }, /*#__PURE__*/React.createElement(ViewComponent, {
141
147
  annotationsList: annotationsList,
142
148
  annotations: activeAnnotations,
149
+ inlineNodeTypes: inlineNodeTypes,
143
150
  dom: dom,
144
151
  onDelete: function onDelete(id) {
145
152
  return removeInlineCommentNearSelection(id, inlineCommentProvider.supportedBlockNodes)(state, dispatch);
package/dist/esm/utils.js CHANGED
@@ -2,7 +2,7 @@ import { AnnotationTypes } from '@atlaskit/adf-schema';
2
2
  import { ACTION, ACTION_SUBJECT, ACTION_SUBJECT_ID, EVENT_TYPE } from '@atlaskit/editor-common/analytics';
3
3
  import { currentMediaNodeWithPos } from '@atlaskit/editor-common/media-single';
4
4
  import { AnnotationSharedClassNames, BlockAnnotationSharedClassNames } from '@atlaskit/editor-common/styles';
5
- import { canApplyAnnotationOnRange, containsAnyAnnotations, getAnnotationIdsFromRange, hasAnnotationMark, isParagraph, isText } from '@atlaskit/editor-common/utils';
5
+ import { canApplyAnnotationOnRange, containsAnyAnnotations, getAnnotationIdsFromRange, getRangeInlineNodeNames, hasAnnotationMark, isParagraph, isText } from '@atlaskit/editor-common/utils';
6
6
  import { AllSelection, NodeSelection, PluginKey, TextSelection } from '@atlaskit/editor-prosemirror/state';
7
7
  import { Decoration } from '@atlaskit/editor-prosemirror/view';
8
8
  import { getBooleanFF } from '@atlaskit/platform-feature-flags';
@@ -146,7 +146,15 @@ export var findAnnotationsInSelection = function findAnnotationsInSelection(sele
146
146
  anchor = selection.anchor;
147
147
  // Only detect annotations on caret selection
148
148
  if (!empty || !doc) {
149
- return [];
149
+ if (getBooleanFF('platform.editor.allow-inline-comments-for-inline-nodes-round-2_ctuxz')) {
150
+ if (selection instanceof NodeSelection && ['inlineCard', 'emoji', 'date', 'mention', 'status'].includes(selection.node.type.name)) {
151
+ // Inline comments on these nodes are supported -- so we continue to find annotations
152
+ } else {
153
+ return [];
154
+ }
155
+ } else {
156
+ return [];
157
+ }
150
158
  }
151
159
  var node = doc.nodeAt(anchor);
152
160
  var nodeBefore = $anchor.nodeBefore;
@@ -262,6 +270,14 @@ export var getDraftCommandAnalyticsPayload = function getDraftCommandAnalyticsPa
262
270
  overlap: getAnnotationsInSelectionCount(state)
263
271
  };
264
272
  }
273
+ if (getBooleanFF('platform.editor.allow-inline-comments-for-inline-nodes-round-2_ctuxz')) {
274
+ var _ref3 = getPluginState(state) || {},
275
+ bookmark = _ref3.bookmark;
276
+ attributes.inlineNodeNames = getRangeInlineNodeNames({
277
+ doc: state.doc,
278
+ pos: resolveDraftBookmark(state, bookmark)
279
+ });
280
+ }
265
281
  return {
266
282
  action: drafting ? ACTION.OPENED : ACTION.CLOSED,
267
283
  actionSubject: ACTION_SUBJECT.ANNOTATION,
@@ -276,8 +292,8 @@ export var isSelectionValid = function isSelectionValid(state, isCommentOnMediaO
276
292
  var _currentMediaNodeWith;
277
293
  var _supportedNodes = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : [];
278
294
  var selection = state.selection;
279
- var _ref3 = getPluginState(state) || {},
280
- disallowOnWhitespace = _ref3.disallowOnWhitespace;
295
+ var _ref4 = getPluginState(state) || {},
296
+ disallowOnWhitespace = _ref4.disallowOnWhitespace;
281
297
 
282
298
  // Allow media so that it can enter draft mode
283
299
  if (isCommentOnMediaOn && (_currentMediaNodeWith = currentMediaNodeWithPos(state)) !== null && _currentMediaNodeWith !== void 0 && _currentMediaNodeWith.node) {
@@ -49,6 +49,10 @@ declare const _default: {
49
49
  to: number;
50
50
  mark: import("prosemirror-model").Mark;
51
51
  }) => boolean;
52
+ addInlineCommentNodeMark: (props: {
53
+ pos: number;
54
+ mark: import("prosemirror-model").Mark;
55
+ }) => boolean;
52
56
  isRemoteReplaceDocumentTransaction: (tr: Transaction) => boolean;
53
57
  };
54
58
  }, import("@atlaskit/editor-plugin-collab-edit").PrivateCollabEditOptions>];
@@ -115,6 +119,10 @@ declare const _default: {
115
119
  to: number;
116
120
  mark: import("prosemirror-model").Mark;
117
121
  }) => boolean;
122
+ addInlineCommentNodeMark: (props: {
123
+ pos: number;
124
+ mark: import("prosemirror-model").Mark;
125
+ }) => boolean;
118
126
  isRemoteReplaceDocumentTransaction: (tr: Transaction) => boolean;
119
127
  };
120
128
  }, import("@atlaskit/editor-plugin-collab-edit").PrivateCollabEditOptions>];
@@ -61,6 +61,8 @@ type AnnotationComponentProps = {
61
61
  * Indicates that a draft comment was discarded/cancelled
62
62
  */
63
63
  onClose?: () => void;
64
+ /** List of inline node types, which are wrapped by the annotation. */
65
+ inlineNodeTypes: string[] | undefined;
64
66
  };
65
67
  export type InlineCommentCreateComponentProps = AnnotationComponentProps & {
66
68
  /**
@@ -60,6 +60,10 @@ declare const _default: {
60
60
  to: number;
61
61
  mark: import("prosemirror-model").Mark;
62
62
  }) => boolean;
63
+ addInlineCommentNodeMark: (props: {
64
+ pos: number;
65
+ mark: import("prosemirror-model").Mark;
66
+ }) => boolean;
63
67
  isRemoteReplaceDocumentTransaction: (tr: Transaction) => boolean;
64
68
  };
65
69
  }, import("@atlaskit/editor-plugin-collab-edit").PrivateCollabEditOptions>
@@ -139,6 +143,10 @@ declare const _default: {
139
143
  to: number;
140
144
  mark: import("prosemirror-model").Mark;
141
145
  }) => boolean;
146
+ addInlineCommentNodeMark: (props: {
147
+ pos: number;
148
+ mark: import("prosemirror-model").Mark;
149
+ }) => boolean;
142
150
  isRemoteReplaceDocumentTransaction: (tr: Transaction) => boolean;
143
151
  };
144
152
  }, import("@atlaskit/editor-plugin-collab-edit").PrivateCollabEditOptions>
@@ -61,6 +61,8 @@ type AnnotationComponentProps = {
61
61
  * Indicates that a draft comment was discarded/cancelled
62
62
  */
63
63
  onClose?: () => void;
64
+ /** List of inline node types, which are wrapped by the annotation. */
65
+ inlineNodeTypes: string[] | undefined;
64
66
  };
65
67
  export type InlineCommentCreateComponentProps = AnnotationComponentProps & {
66
68
  /**
package/package.json CHANGED
@@ -1,106 +1,86 @@
1
1
  {
2
- "name": "@atlaskit/editor-plugin-annotation",
3
- "version": "1.10.0",
4
- "description": "Annotation plugin for @atlaskit/editor-core",
5
- "author": "Atlassian Pty Ltd",
6
- "license": "Apache-2.0",
7
- "publishConfig": {
8
- "registry": "https://registry.npmjs.org/"
9
- },
10
- "atlassian": {
11
- "team": "Editor: AI",
12
- "singleton": true,
13
- "releaseModel": "continuous",
14
- "runReact18": false
15
- },
16
- "repository": "https://bitbucket.org/atlassian/atlassian-frontend-mirror",
17
- "main": "dist/cjs/index.js",
18
- "module": "dist/esm/index.js",
19
- "module:es2019": "dist/es2019/index.js",
20
- "types": "dist/types/index.d.ts",
21
- "typesVersions": {
22
- ">=4.5 <4.9": {
23
- "*": [
24
- "dist/types-ts4.5/*",
25
- "dist/types-ts4.5/index.d.ts"
26
- ]
27
- }
28
- },
29
- "sideEffects": false,
30
- "atlaskit:src": "src/index.ts",
31
- "af:exports": {
32
- ".": "./src/index.ts"
33
- },
34
- "dependencies": {
35
- "@atlaskit/adf-schema": "^36.10.7",
36
- "@atlaskit/editor-common": "^82.1.0",
37
- "@atlaskit/editor-plugin-analytics": "^1.2.0",
38
- "@atlaskit/editor-plugin-editor-viewmode": "^1.1.0",
39
- "@atlaskit/editor-plugin-feature-flags": "^1.1.0",
40
- "@atlaskit/editor-prosemirror": "4.0.1",
41
- "@atlaskit/icon": "^22.3.0",
42
- "@atlaskit/platform-feature-flags": "^0.2.0",
43
- "@babel/runtime": "^7.0.0"
44
- },
45
- "peerDependencies": {
46
- "react": "^16.8.0"
47
- },
48
- "devDependencies": {
49
- "@af/integration-testing": "*",
50
- "@af/visual-regression": "*",
51
- "@atlaskit/ssr": "*",
52
- "@atlaskit/visual-regression": "*",
53
- "@atlassian/feature-flags-test-utils": "^0.2.0",
54
- "@testing-library/react": "^12.1.5",
55
- "react-dom": "^16.8.0",
56
- "typescript": "~5.4.2",
57
- "wait-for-expect": "^1.2.0"
58
- },
59
- "techstack": {
60
- "@atlassian/frontend": {
61
- "import-structure": [
62
- "atlassian-conventions"
63
- ],
64
- "circular-dependencies": [
65
- "file-and-folder-level"
66
- ]
67
- },
68
- "@repo/internal": {
69
- "dom-events": "use-bind-event-listener",
70
- "analytics": [
71
- "analytics-next"
72
- ],
73
- "design-tokens": [
74
- "color"
75
- ],
76
- "theming": [
77
- "react-context"
78
- ],
79
- "ui-components": [
80
- "lite-mode"
81
- ],
82
- "deprecation": "no-deprecated-imports",
83
- "styling": [
84
- "emotion",
85
- "emotion"
86
- ],
87
- "imports": [
88
- "import-no-extraneous-disable-for-examples-and-docs"
89
- ]
90
- }
91
- },
92
- "platform-feature-flags": {
93
- "platform.editor.enable-selection-toolbar_ucdwd": {
94
- "type": "boolean"
95
- },
96
- "platform.editor.allow-inline-comments-for-inline-nodes": {
97
- "type": "boolean"
98
- },
99
- "platform.editor.allow-inline-comments-for-inline-nodes-round-2_ctuxz": {
100
- "type": "boolean"
101
- },
102
- "platform.editor.comments-on-media.bug.preserve-draft_i3vqb": {
103
- "type": "boolean"
104
- }
105
- }
106
- }
2
+ "name": "@atlaskit/editor-plugin-annotation",
3
+ "version": "1.10.2",
4
+ "description": "Annotation plugin for @atlaskit/editor-core",
5
+ "author": "Atlassian Pty Ltd",
6
+ "license": "Apache-2.0",
7
+ "publishConfig": {
8
+ "registry": "https://registry.npmjs.org/"
9
+ },
10
+ "atlassian": {
11
+ "team": "Editor: AI",
12
+ "singleton": true,
13
+ "releaseModel": "continuous",
14
+ "runReact18": false
15
+ },
16
+ "repository": "https://bitbucket.org/atlassian/atlassian-frontend-mirror",
17
+ "main": "dist/cjs/index.js",
18
+ "module": "dist/esm/index.js",
19
+ "module:es2019": "dist/es2019/index.js",
20
+ "types": "dist/types/index.d.ts",
21
+ "typesVersions": {
22
+ ">=4.5 <4.9": {
23
+ "*": ["dist/types-ts4.5/*", "dist/types-ts4.5/index.d.ts"]
24
+ }
25
+ },
26
+ "sideEffects": false,
27
+ "atlaskit:src": "src/index.ts",
28
+ "af:exports": {
29
+ ".": "./src/index.ts"
30
+ },
31
+ "dependencies": {
32
+ "@atlaskit/adf-schema": "^36.10.7",
33
+ "@atlaskit/editor-common": "^82.6.0",
34
+ "@atlaskit/editor-plugin-analytics": "^1.2.0",
35
+ "@atlaskit/editor-plugin-editor-viewmode": "^1.2.0",
36
+ "@atlaskit/editor-plugin-feature-flags": "^1.1.0",
37
+ "@atlaskit/editor-prosemirror": "4.0.1",
38
+ "@atlaskit/icon": "^22.3.0",
39
+ "@atlaskit/platform-feature-flags": "^0.2.0",
40
+ "@babel/runtime": "^7.0.0"
41
+ },
42
+ "peerDependencies": {
43
+ "react": "^16.8.0"
44
+ },
45
+ "devDependencies": {
46
+ "@af/integration-testing": "*",
47
+ "@af/visual-regression": "*",
48
+ "@atlaskit/ssr": "*",
49
+ "@atlaskit/visual-regression": "*",
50
+ "@atlassian/feature-flags-test-utils": "^0.2.0",
51
+ "@testing-library/react": "^12.1.5",
52
+ "react-dom": "^16.8.0",
53
+ "typescript": "~5.4.2",
54
+ "wait-for-expect": "^1.2.0"
55
+ },
56
+ "techstack": {
57
+ "@atlassian/frontend": {
58
+ "import-structure": ["atlassian-conventions"],
59
+ "circular-dependencies": ["file-and-folder-level"]
60
+ },
61
+ "@repo/internal": {
62
+ "dom-events": "use-bind-event-listener",
63
+ "analytics": ["analytics-next"],
64
+ "design-tokens": ["color"],
65
+ "theming": ["react-context"],
66
+ "ui-components": ["lite-mode"],
67
+ "deprecation": "no-deprecated-imports",
68
+ "styling": ["emotion", "emotion"],
69
+ "imports": ["import-no-extraneous-disable-for-examples-and-docs"]
70
+ }
71
+ },
72
+ "platform-feature-flags": {
73
+ "platform.editor.enable-selection-toolbar_ucdwd": {
74
+ "type": "boolean"
75
+ },
76
+ "platform.editor.allow-inline-comments-for-inline-nodes": {
77
+ "type": "boolean"
78
+ },
79
+ "platform.editor.allow-inline-comments-for-inline-nodes-round-2_ctuxz": {
80
+ "type": "boolean"
81
+ },
82
+ "platform.editor.comments-on-media.bug.preserve-draft_i3vqb": {
83
+ "type": "boolean"
84
+ }
85
+ }
86
+ }