@atlaskit/editor-plugin-selection 6.0.2 → 6.1.1

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,22 @@
1
1
  # @atlaskit/editor-plugin-selection
2
2
 
3
+ ## 6.1.1
4
+
5
+ ### Patch Changes
6
+
7
+ - Updated dependencies
8
+
9
+ ## 6.1.0
10
+
11
+ ### Minor Changes
12
+
13
+ - [`a3fe38f9b65b1`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/a3fe38f9b65b1) -
14
+ [ux] [EDITOR-1686] hidden cursor while ai is streaming text
15
+
16
+ ### Patch Changes
17
+
18
+ - Updated dependencies
19
+
3
20
  ## 6.0.2
4
21
 
5
22
  ### Patch Changes
@@ -152,7 +169,6 @@
152
169
  shared context or singletons.
153
170
 
154
171
  **HOW TO ADJUST:**
155
-
156
172
  - Consumers must now explicitly install `@atlaskit/editor-common` in their own project if they use
157
173
  any of these editor plugins.
158
174
  - Ensure the version you install matches the version required by the plugins.
@@ -0,0 +1,20 @@
1
+ "use strict";
2
+
3
+ Object.defineProperty(exports, "__esModule", {
4
+ value: true
5
+ });
6
+ exports.createHideCursorDecoration = void 0;
7
+ var _view = require("@atlaskit/editor-prosemirror/view");
8
+ var hideCursorWidgetStyles = "\n\tposition: absolute;\n\tpointer-events: none;\n\twidth: 0;\n\theight: 0;\n";
9
+ var createHideCursorWidget = function createHideCursorWidget() {
10
+ var span = document.createElement('span');
11
+ span.className = 'ProseMirror-hide-cursor';
12
+ span.setAttribute('style', hideCursorWidgetStyles);
13
+ return span;
14
+ };
15
+ var createHideCursorDecoration = exports.createHideCursorDecoration = function createHideCursorDecoration() {
16
+ return _view.Decoration.widget(0, createHideCursorWidget, {
17
+ key: 'hide-cursor-decoration',
18
+ side: -1
19
+ });
20
+ };
@@ -10,6 +10,7 @@ var _state = require("@atlaskit/editor-prosemirror/state");
10
10
  var _utils = require("@atlaskit/editor-prosemirror/utils");
11
11
  var _view2 = require("@atlaskit/editor-prosemirror/view");
12
12
  var _cellSelection = require("@atlaskit/editor-tables/cell-selection");
13
+ var _types = require("../types");
13
14
  var _gapCursorPluginKey = require("./gap-cursor-plugin-key");
14
15
  var _actions = require("./gap-cursor/actions");
15
16
  var _direction = require("./gap-cursor/direction");
@@ -21,17 +22,21 @@ var plugin = new _safePlugin.SafePlugin({
21
22
  init: function init() {
22
23
  return {
23
24
  selectionIsGapCursor: false,
24
- displayGapCursor: true
25
+ displayGapCursor: true,
26
+ hideCursor: false
25
27
  };
26
28
  },
27
29
  apply: function apply(tr, pluginState, _oldState, newState) {
28
- var _meta$displayGapCurso;
30
+ var _meta$displayGapCurso, _selectionMeta$hideCu;
29
31
  var meta = tr.getMeta(_gapCursorPluginKey.gapCursorPluginKey);
32
+ var selectionMeta = tr.getMeta(_types.selectionPluginKey);
30
33
  var selectionIsGapCursor = newState.selection instanceof _selection.GapCursorSelection;
31
34
  return {
32
35
  selectionIsGapCursor: selectionIsGapCursor,
33
36
  // only attempt to hide gap cursor if selection is gap cursor
34
- displayGapCursor: selectionIsGapCursor ? (_meta$displayGapCurso = meta === null || meta === void 0 ? void 0 : meta.displayGapCursor) !== null && _meta$displayGapCurso !== void 0 ? _meta$displayGapCurso : pluginState.displayGapCursor : true
37
+ displayGapCursor: selectionIsGapCursor ? (_meta$displayGapCurso = meta === null || meta === void 0 ? void 0 : meta.displayGapCursor) !== null && _meta$displayGapCurso !== void 0 ? _meta$displayGapCurso : pluginState.displayGapCursor : true,
38
+ // track hideCursor state from selection plugin
39
+ hideCursor: (_selectionMeta$hideCu = selectionMeta === null || selectionMeta === void 0 ? void 0 : selectionMeta.hideCursor) !== null && _selectionMeta$hideCu !== void 0 ? _selectionMeta$hideCu : pluginState.hideCursor
35
40
  };
36
41
  }
37
42
  },
@@ -71,8 +76,9 @@ var plugin = new _safePlugin.SafePlugin({
71
76
  var doc = editorState.doc,
72
77
  selection = editorState.selection;
73
78
  var _gapCursorPluginKey$g2 = _gapCursorPluginKey.gapCursorPluginKey.getState(editorState),
74
- displayGapCursor = _gapCursorPluginKey$g2.displayGapCursor;
75
- if (selection instanceof _selection.GapCursorSelection && displayGapCursor) {
79
+ displayGapCursor = _gapCursorPluginKey$g2.displayGapCursor,
80
+ hideCursor = _gapCursorPluginKey$g2.hideCursor;
81
+ if (selection instanceof _selection.GapCursorSelection && displayGapCursor && !hideCursor) {
76
82
  var $from = selection.$from,
77
83
  side = selection.side;
78
84
 
@@ -7,6 +7,7 @@ exports.getInitialState = exports.createPlugin = void 0;
7
7
  var _safePlugin = require("@atlaskit/editor-common/safe-plugin");
8
8
  var _state = require("@atlaskit/editor-prosemirror/state");
9
9
  var _view = require("@atlaskit/editor-prosemirror/view");
10
+ var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
10
11
  var _expValEquals = require("@atlaskit/tmp-editor-statsig/exp-val-equals");
11
12
  var _experiments = require("@atlaskit/tmp-editor-statsig/experiments");
12
13
  var _types = require("../types");
@@ -24,32 +25,44 @@ var getInitialState = exports.getInitialState = function getInitialState(state)
24
25
  };
25
26
  var createPlugin = exports.createPlugin = function createPlugin(api, dispatch, dispatchAnalyticsEvent) {
26
27
  var options = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : {};
28
+ var cursorHidden = false;
27
29
  return new _safePlugin.SafePlugin({
28
30
  key: _types.selectionPluginKey,
29
31
  state: (0, _pluginFactory.createPluginState)(dispatch, getInitialState),
30
32
  appendTransaction: function appendTransaction(transactions, oldEditorState, newEditorState) {
31
33
  var tr = newEditorState.tr;
32
34
  var manualSelection;
33
- if ((0, _experiments.editorExperiment)('platform_editor_element_drag_and_drop_multiselect', true)) {
34
- // Start at most recent transaction, look for manualSelection meta
35
+ var hideCursorChanged = false;
36
+ var needsHideCursor = (0, _platformFeatureFlags.fg)('platform_editor_ai_aifc_patch_beta');
37
+ var needsManualSelection = (0, _experiments.editorExperiment)('platform_editor_element_drag_and_drop_multiselect', true);
38
+ if (needsHideCursor || needsManualSelection) {
35
39
  for (var i = transactions.length - 1; i >= 0; i--) {
36
- var _transactions$i$getMe;
37
- manualSelection = (_transactions$i$getMe = transactions[i].getMeta(_types.selectionPluginKey)) === null || _transactions$i$getMe === void 0 ? void 0 : _transactions$i$getMe.manualSelection;
38
- if (manualSelection) {
39
- break;
40
+ var meta = transactions[i].getMeta(_types.selectionPluginKey);
41
+ if (needsHideCursor && (meta === null || meta === void 0 ? void 0 : meta.hideCursor) !== undefined) {
42
+ var newHideCursorValue = meta.hideCursor;
43
+ if (cursorHidden !== newHideCursorValue) {
44
+ cursorHidden = newHideCursorValue;
45
+ hideCursorChanged = true;
46
+ }
47
+ }
48
+ if (needsManualSelection && meta !== null && meta !== void 0 && meta.manualSelection && !manualSelection) {
49
+ manualSelection = meta.manualSelection;
50
+ if (!needsHideCursor) {
51
+ break;
52
+ }
40
53
  }
41
54
  }
42
55
  }
43
56
  if (!(0, _utils.shouldRecalcDecorations)({
44
57
  oldEditorState: oldEditorState,
45
58
  newEditorState: newEditorState
46
- }) && !manualSelection) {
59
+ }) && !manualSelection && !hideCursorChanged) {
47
60
  return;
48
61
  }
49
62
  tr.setMeta(_types.selectionPluginKey, {
50
63
  type: _actions.SelectionActionTypes.SET_DECORATIONS,
51
64
  selection: tr.selection,
52
- decorationSet: (0, _utils.getDecorations)(tr, manualSelection)
65
+ decorationSet: (0, _utils.getDecorations)(tr, manualSelection, cursorHidden)
53
66
  });
54
67
  return tr;
55
68
  },
@@ -1,10 +1,12 @@
1
1
  "use strict";
2
2
 
3
+ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
3
4
  Object.defineProperty(exports, "__esModule", {
4
5
  value: true
5
6
  });
6
7
  exports.isSelectionAtStartOfParentNode = exports.isSelectionAtEndOfParentNode = exports.isSelectionAtEndOfLayoutColumn = exports.isSelectableContainerNode = exports.isSelectableChildNode = exports.isListItemWithinContainerNotAtEnd = exports.isLayoutColumnNode = exports.isContainerNode = exports.getNodesToDecorateFromSelection = exports.getDecorations = exports.findTopLevelList = exports.findSelectableContainerParent = exports.findSelectableContainerBefore = exports.findSelectableContainerAfter = exports.findLastChildNodeToSelect = exports.findFirstChildNodeToSelect = void 0;
7
8
  exports.shouldRecalcDecorations = shouldRecalcDecorations;
9
+ var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
8
10
  var _selection = require("@atlaskit/editor-common/selection");
9
11
  var _utils = require("@atlaskit/editor-common/utils");
10
12
  var _state = require("@atlaskit/editor-prosemirror/state");
@@ -13,27 +15,34 @@ var _view = require("@atlaskit/editor-prosemirror/view");
13
15
  var _editorSharedStyles = require("@atlaskit/editor-shared-styles");
14
16
  var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
15
17
  var _types = require("../types");
16
- var getDecorations = exports.getDecorations = function getDecorations(tr, manualSelection) {
18
+ var _hideCursorDecoration = require("./cursor/ui/hide-cursor-decoration");
19
+ var getDecorations = exports.getDecorations = function getDecorations(tr, manualSelection, hideCursor) {
17
20
  var selection = tr.selection;
21
+ var decorations = [];
22
+ if (hideCursor && (0, _platformFeatureFlags.fg)('platform_editor_ai_aifc_patch_beta')) {
23
+ decorations.push((0, _hideCursorDecoration.createHideCursorDecoration)());
24
+ }
18
25
  if (selection instanceof _state.NodeSelection) {
19
- return _view.DecorationSet.create(tr.doc, [_view.Decoration.node(selection.from, selection.to, {
26
+ decorations.push(_view.Decoration.node(selection.from, selection.to, {
20
27
  class: _editorSharedStyles.akEditorSelectedNodeClassName
21
- })]);
28
+ }));
29
+ return _view.DecorationSet.create(tr.doc, decorations);
22
30
  }
23
31
  if (selection instanceof _state.TextSelection || selection instanceof _state.AllSelection) {
24
32
  if (manualSelection && manualSelection.anchor >= 0 && manualSelection.head >= 0 && manualSelection.anchor <= tr.doc.nodeSize && manualSelection.head <= tr.doc.nodeSize) {
25
33
  selection = _state.TextSelection.create(tr.doc, manualSelection.anchor, manualSelection.head);
26
34
  }
27
- var decorations = getNodesToDecorateFromSelection(selection, tr.doc).map(function (_ref) {
35
+ var selectionDecorations = getNodesToDecorateFromSelection(selection, tr.doc).map(function (_ref) {
28
36
  var node = _ref.node,
29
37
  pos = _ref.pos;
30
38
  return _view.Decoration.node(pos, pos + node.nodeSize, {
31
39
  class: _editorSharedStyles.akEditorSelectedNodeClassName
32
40
  });
33
41
  });
42
+ decorations.push.apply(decorations, (0, _toConsumableArray2.default)(selectionDecorations));
34
43
  return _view.DecorationSet.create(tr.doc, decorations);
35
44
  }
36
- return _view.DecorationSet.empty;
45
+ return decorations.length > 0 ? _view.DecorationSet.create(tr.doc, decorations) : _view.DecorationSet.empty;
37
46
  };
38
47
  var topLevelBlockNodesThatHaveSelectionStyles = ['table', 'panel', 'expand', 'layoutSection', 'decisionList', 'decisionItem', 'codeBlock'];
39
48
 
@@ -47,20 +47,30 @@ var setManualSelection = function setManualSelection(anchor, head) {
47
47
  }));
48
48
  };
49
49
  };
50
- var selectionPlugin = exports.selectionPlugin = function selectionPlugin(_ref4) {
51
- var api = _ref4.api,
52
- options = _ref4.config;
50
+ var hideCursor = function hideCursor(hide) {
51
+ return function (_ref4) {
52
+ var tr = _ref4.tr;
53
+ var currMeta = tr.getMeta(_types.selectionPluginKey);
54
+ return tr.setMeta(_types.selectionPluginKey, _objectSpread(_objectSpread({}, currMeta), {}, {
55
+ hideCursor: hide
56
+ }));
57
+ };
58
+ };
59
+ var selectionPlugin = exports.selectionPlugin = function selectionPlugin(_ref5) {
60
+ var api = _ref5.api,
61
+ options = _ref5.config;
53
62
  return {
54
63
  name: 'selection',
55
64
  commands: {
56
65
  displayGapCursor: displayGapCursor,
57
66
  clearManualSelection: clearManualSelection,
67
+ hideCursor: hideCursor,
58
68
  setManualSelection: setManualSelection
59
69
  },
60
70
  actions: {
61
- selectNearNode: function selectNearNode(_ref5) {
62
- var selectionRelativeToNode = _ref5.selectionRelativeToNode,
63
- selection = _ref5.selection;
71
+ selectNearNode: function selectNearNode(_ref6) {
72
+ var selectionRelativeToNode = _ref6.selectionRelativeToNode,
73
+ selection = _ref6.selection;
64
74
  return function (state) {
65
75
  return (0, _commands.selectNearNode)(selectionRelativeToNode, selection)({
66
76
  tr: state.tr
@@ -83,9 +93,9 @@ var selectionPlugin = exports.selectionPlugin = function selectionPlugin(_ref4)
83
93
  pmPlugins: function pmPlugins() {
84
94
  return [{
85
95
  name: 'selection',
86
- plugin: function plugin(_ref6) {
87
- var dispatch = _ref6.dispatch,
88
- dispatchAnalyticsEvent = _ref6.dispatchAnalyticsEvent;
96
+ plugin: function plugin(_ref7) {
97
+ var dispatch = _ref7.dispatch,
98
+ dispatchAnalyticsEvent = _ref7.dispatchAnalyticsEvent;
89
99
  return (0, _selectionMain.createPlugin)(api, dispatch, dispatchAnalyticsEvent, options);
90
100
  }
91
101
  }, {
@@ -0,0 +1,19 @@
1
+ import { Decoration } from '@atlaskit/editor-prosemirror/view';
2
+ const hideCursorWidgetStyles = `
3
+ position: absolute;
4
+ pointer-events: none;
5
+ width: 0;
6
+ height: 0;
7
+ `;
8
+ const createHideCursorWidget = () => {
9
+ const span = document.createElement('span');
10
+ span.className = 'ProseMirror-hide-cursor';
11
+ span.setAttribute('style', hideCursorWidgetStyles);
12
+ return span;
13
+ };
14
+ export const createHideCursorDecoration = () => {
15
+ return Decoration.widget(0, createHideCursorWidget, {
16
+ key: 'hide-cursor-decoration',
17
+ side: -1
18
+ });
19
+ };
@@ -4,6 +4,7 @@ import { NodeSelection } from '@atlaskit/editor-prosemirror/state';
4
4
  import { findPositionOfNodeBefore } from '@atlaskit/editor-prosemirror/utils';
5
5
  import { Decoration, DecorationSet } from '@atlaskit/editor-prosemirror/view';
6
6
  import { CellSelection } from '@atlaskit/editor-tables/cell-selection';
7
+ import { selectionPluginKey } from '../types';
7
8
  import { gapCursorPluginKey } from './gap-cursor-plugin-key';
8
9
  import { deleteNode } from './gap-cursor/actions';
9
10
  import { Direction } from './gap-cursor/direction';
@@ -14,16 +15,20 @@ const plugin = new SafePlugin({
14
15
  state: {
15
16
  init: () => ({
16
17
  selectionIsGapCursor: false,
17
- displayGapCursor: true
18
+ displayGapCursor: true,
19
+ hideCursor: false
18
20
  }),
19
21
  apply: (tr, pluginState, _oldState, newState) => {
20
- var _meta$displayGapCurso;
22
+ var _meta$displayGapCurso, _selectionMeta$hideCu;
21
23
  const meta = tr.getMeta(gapCursorPluginKey);
24
+ const selectionMeta = tr.getMeta(selectionPluginKey);
22
25
  const selectionIsGapCursor = newState.selection instanceof GapCursorSelection;
23
26
  return {
24
27
  selectionIsGapCursor,
25
28
  // only attempt to hide gap cursor if selection is gap cursor
26
- displayGapCursor: selectionIsGapCursor ? (_meta$displayGapCurso = meta === null || meta === void 0 ? void 0 : meta.displayGapCursor) !== null && _meta$displayGapCurso !== void 0 ? _meta$displayGapCurso : pluginState.displayGapCursor : true
29
+ displayGapCursor: selectionIsGapCursor ? (_meta$displayGapCurso = meta === null || meta === void 0 ? void 0 : meta.displayGapCursor) !== null && _meta$displayGapCurso !== void 0 ? _meta$displayGapCurso : pluginState.displayGapCursor : true,
30
+ // track hideCursor state from selection plugin
31
+ hideCursor: (_selectionMeta$hideCu = selectionMeta === null || selectionMeta === void 0 ? void 0 : selectionMeta.hideCursor) !== null && _selectionMeta$hideCu !== void 0 ? _selectionMeta$hideCu : pluginState.hideCursor
27
32
  };
28
33
  }
29
34
  },
@@ -66,9 +71,10 @@ const plugin = new SafePlugin({
66
71
  selection
67
72
  } = editorState;
68
73
  const {
69
- displayGapCursor
74
+ displayGapCursor,
75
+ hideCursor
70
76
  } = gapCursorPluginKey.getState(editorState);
71
- if (selection instanceof GapCursorSelection && displayGapCursor) {
77
+ if (selection instanceof GapCursorSelection && displayGapCursor && !hideCursor) {
72
78
  const {
73
79
  $from,
74
80
  side
@@ -1,6 +1,7 @@
1
1
  import { SafePlugin } from '@atlaskit/editor-common/safe-plugin';
2
2
  import { NodeSelection, TextSelection } from '@atlaskit/editor-prosemirror/state';
3
3
  import { DecorationSet } from '@atlaskit/editor-prosemirror/view';
4
+ import { fg } from '@atlaskit/platform-feature-flags';
4
5
  import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
5
6
  import { editorExperiment } from '@atlaskit/tmp-editor-statsig/experiments';
6
7
  import { selectionPluginKey } from '../types';
@@ -15,6 +16,7 @@ export const getInitialState = state => ({
15
16
  selection: state.selection
16
17
  });
17
18
  export const createPlugin = (api, dispatch, dispatchAnalyticsEvent, options = {}) => {
19
+ let cursorHidden = false;
18
20
  return new SafePlugin({
19
21
  key: selectionPluginKey,
20
22
  state: createPluginState(dispatch, getInitialState),
@@ -23,26 +25,37 @@ export const createPlugin = (api, dispatch, dispatchAnalyticsEvent, options = {}
23
25
  tr
24
26
  } = newEditorState;
25
27
  let manualSelection;
26
- if (editorExperiment('platform_editor_element_drag_and_drop_multiselect', true)) {
27
- // Start at most recent transaction, look for manualSelection meta
28
+ let hideCursorChanged = false;
29
+ const needsHideCursor = fg('platform_editor_ai_aifc_patch_beta');
30
+ const needsManualSelection = editorExperiment('platform_editor_element_drag_and_drop_multiselect', true);
31
+ if (needsHideCursor || needsManualSelection) {
28
32
  for (let i = transactions.length - 1; i >= 0; i--) {
29
- var _transactions$i$getMe;
30
- manualSelection = (_transactions$i$getMe = transactions[i].getMeta(selectionPluginKey)) === null || _transactions$i$getMe === void 0 ? void 0 : _transactions$i$getMe.manualSelection;
31
- if (manualSelection) {
32
- break;
33
+ const meta = transactions[i].getMeta(selectionPluginKey);
34
+ if (needsHideCursor && (meta === null || meta === void 0 ? void 0 : meta.hideCursor) !== undefined) {
35
+ const newHideCursorValue = meta.hideCursor;
36
+ if (cursorHidden !== newHideCursorValue) {
37
+ cursorHidden = newHideCursorValue;
38
+ hideCursorChanged = true;
39
+ }
40
+ }
41
+ if (needsManualSelection && meta !== null && meta !== void 0 && meta.manualSelection && !manualSelection) {
42
+ manualSelection = meta.manualSelection;
43
+ if (!needsHideCursor) {
44
+ break;
45
+ }
33
46
  }
34
47
  }
35
48
  }
36
49
  if (!shouldRecalcDecorations({
37
50
  oldEditorState,
38
51
  newEditorState
39
- }) && !manualSelection) {
52
+ }) && !manualSelection && !hideCursorChanged) {
40
53
  return;
41
54
  }
42
55
  tr.setMeta(selectionPluginKey, {
43
56
  type: SelectionActionTypes.SET_DECORATIONS,
44
57
  selection: tr.selection,
45
- decorationSet: getDecorations(tr, manualSelection)
58
+ decorationSet: getDecorations(tr, manualSelection, cursorHidden)
46
59
  });
47
60
  return tr;
48
61
  },
@@ -6,18 +6,24 @@ import { Decoration, DecorationSet } from '@atlaskit/editor-prosemirror/view';
6
6
  import { akEditorSelectedNodeClassName } from '@atlaskit/editor-shared-styles';
7
7
  import { fg } from '@atlaskit/platform-feature-flags';
8
8
  import { selectionPluginKey } from '../types';
9
- export const getDecorations = (tr, manualSelection) => {
9
+ import { createHideCursorDecoration } from './cursor/ui/hide-cursor-decoration';
10
+ export const getDecorations = (tr, manualSelection, hideCursor) => {
10
11
  let selection = tr.selection;
12
+ const decorations = [];
13
+ if (hideCursor && fg('platform_editor_ai_aifc_patch_beta')) {
14
+ decorations.push(createHideCursorDecoration());
15
+ }
11
16
  if (selection instanceof NodeSelection) {
12
- return DecorationSet.create(tr.doc, [Decoration.node(selection.from, selection.to, {
17
+ decorations.push(Decoration.node(selection.from, selection.to, {
13
18
  class: akEditorSelectedNodeClassName
14
- })]);
19
+ }));
20
+ return DecorationSet.create(tr.doc, decorations);
15
21
  }
16
22
  if (selection instanceof TextSelection || selection instanceof AllSelection) {
17
23
  if (manualSelection && manualSelection.anchor >= 0 && manualSelection.head >= 0 && manualSelection.anchor <= tr.doc.nodeSize && manualSelection.head <= tr.doc.nodeSize) {
18
24
  selection = TextSelection.create(tr.doc, manualSelection.anchor, manualSelection.head);
19
25
  }
20
- const decorations = getNodesToDecorateFromSelection(selection, tr.doc).map(({
26
+ const selectionDecorations = getNodesToDecorateFromSelection(selection, tr.doc).map(({
21
27
  node,
22
28
  pos
23
29
  }) => {
@@ -25,9 +31,10 @@ export const getDecorations = (tr, manualSelection) => {
25
31
  class: akEditorSelectedNodeClassName
26
32
  });
27
33
  });
34
+ decorations.push(...selectionDecorations);
28
35
  return DecorationSet.create(tr.doc, decorations);
29
36
  }
30
- return DecorationSet.empty;
37
+ return decorations.length > 0 ? DecorationSet.create(tr.doc, decorations) : DecorationSet.empty;
31
38
  };
32
39
  const topLevelBlockNodesThatHaveSelectionStyles = ['table', 'panel', 'expand', 'layoutSection', 'decisionList', 'decisionItem', 'codeBlock'];
33
40
 
@@ -36,6 +36,15 @@ const setManualSelection = (anchor, head) => ({
36
36
  }
37
37
  });
38
38
  };
39
+ const hideCursor = hide => ({
40
+ tr
41
+ }) => {
42
+ const currMeta = tr.getMeta(selectionPluginKey);
43
+ return tr.setMeta(selectionPluginKey, {
44
+ ...currMeta,
45
+ hideCursor: hide
46
+ });
47
+ };
39
48
  export const selectionPlugin = ({
40
49
  api,
41
50
  config: options
@@ -44,6 +53,7 @@ export const selectionPlugin = ({
44
53
  commands: {
45
54
  displayGapCursor,
46
55
  clearManualSelection,
56
+ hideCursor,
47
57
  setManualSelection
48
58
  },
49
59
  actions: {
@@ -0,0 +1,14 @@
1
+ import { Decoration } from '@atlaskit/editor-prosemirror/view';
2
+ var hideCursorWidgetStyles = "\n\tposition: absolute;\n\tpointer-events: none;\n\twidth: 0;\n\theight: 0;\n";
3
+ var createHideCursorWidget = function createHideCursorWidget() {
4
+ var span = document.createElement('span');
5
+ span.className = 'ProseMirror-hide-cursor';
6
+ span.setAttribute('style', hideCursorWidgetStyles);
7
+ return span;
8
+ };
9
+ export var createHideCursorDecoration = function createHideCursorDecoration() {
10
+ return Decoration.widget(0, createHideCursorWidget, {
11
+ key: 'hide-cursor-decoration',
12
+ side: -1
13
+ });
14
+ };
@@ -4,6 +4,7 @@ import { NodeSelection } from '@atlaskit/editor-prosemirror/state';
4
4
  import { findPositionOfNodeBefore } from '@atlaskit/editor-prosemirror/utils';
5
5
  import { Decoration, DecorationSet } from '@atlaskit/editor-prosemirror/view';
6
6
  import { CellSelection } from '@atlaskit/editor-tables/cell-selection';
7
+ import { selectionPluginKey } from '../types';
7
8
  import { gapCursorPluginKey } from './gap-cursor-plugin-key';
8
9
  import { deleteNode } from './gap-cursor/actions';
9
10
  import { Direction } from './gap-cursor/direction';
@@ -15,17 +16,21 @@ var plugin = new SafePlugin({
15
16
  init: function init() {
16
17
  return {
17
18
  selectionIsGapCursor: false,
18
- displayGapCursor: true
19
+ displayGapCursor: true,
20
+ hideCursor: false
19
21
  };
20
22
  },
21
23
  apply: function apply(tr, pluginState, _oldState, newState) {
22
- var _meta$displayGapCurso;
24
+ var _meta$displayGapCurso, _selectionMeta$hideCu;
23
25
  var meta = tr.getMeta(gapCursorPluginKey);
26
+ var selectionMeta = tr.getMeta(selectionPluginKey);
24
27
  var selectionIsGapCursor = newState.selection instanceof GapCursorSelection;
25
28
  return {
26
29
  selectionIsGapCursor: selectionIsGapCursor,
27
30
  // only attempt to hide gap cursor if selection is gap cursor
28
- displayGapCursor: selectionIsGapCursor ? (_meta$displayGapCurso = meta === null || meta === void 0 ? void 0 : meta.displayGapCursor) !== null && _meta$displayGapCurso !== void 0 ? _meta$displayGapCurso : pluginState.displayGapCursor : true
31
+ displayGapCursor: selectionIsGapCursor ? (_meta$displayGapCurso = meta === null || meta === void 0 ? void 0 : meta.displayGapCursor) !== null && _meta$displayGapCurso !== void 0 ? _meta$displayGapCurso : pluginState.displayGapCursor : true,
32
+ // track hideCursor state from selection plugin
33
+ hideCursor: (_selectionMeta$hideCu = selectionMeta === null || selectionMeta === void 0 ? void 0 : selectionMeta.hideCursor) !== null && _selectionMeta$hideCu !== void 0 ? _selectionMeta$hideCu : pluginState.hideCursor
29
34
  };
30
35
  }
31
36
  },
@@ -65,8 +70,9 @@ var plugin = new SafePlugin({
65
70
  var doc = editorState.doc,
66
71
  selection = editorState.selection;
67
72
  var _gapCursorPluginKey$g2 = gapCursorPluginKey.getState(editorState),
68
- displayGapCursor = _gapCursorPluginKey$g2.displayGapCursor;
69
- if (selection instanceof GapCursorSelection && displayGapCursor) {
73
+ displayGapCursor = _gapCursorPluginKey$g2.displayGapCursor,
74
+ hideCursor = _gapCursorPluginKey$g2.hideCursor;
75
+ if (selection instanceof GapCursorSelection && displayGapCursor && !hideCursor) {
70
76
  var $from = selection.$from,
71
77
  side = selection.side;
72
78
 
@@ -1,6 +1,7 @@
1
1
  import { SafePlugin } from '@atlaskit/editor-common/safe-plugin';
2
2
  import { NodeSelection, TextSelection } from '@atlaskit/editor-prosemirror/state';
3
3
  import { DecorationSet } from '@atlaskit/editor-prosemirror/view';
4
+ import { fg } from '@atlaskit/platform-feature-flags';
4
5
  import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
5
6
  import { editorExperiment } from '@atlaskit/tmp-editor-statsig/experiments';
6
7
  import { selectionPluginKey } from '../types';
@@ -18,32 +19,44 @@ export var getInitialState = function getInitialState(state) {
18
19
  };
19
20
  export var createPlugin = function createPlugin(api, dispatch, dispatchAnalyticsEvent) {
20
21
  var options = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : {};
22
+ var cursorHidden = false;
21
23
  return new SafePlugin({
22
24
  key: selectionPluginKey,
23
25
  state: createPluginState(dispatch, getInitialState),
24
26
  appendTransaction: function appendTransaction(transactions, oldEditorState, newEditorState) {
25
27
  var tr = newEditorState.tr;
26
28
  var manualSelection;
27
- if (editorExperiment('platform_editor_element_drag_and_drop_multiselect', true)) {
28
- // Start at most recent transaction, look for manualSelection meta
29
+ var hideCursorChanged = false;
30
+ var needsHideCursor = fg('platform_editor_ai_aifc_patch_beta');
31
+ var needsManualSelection = editorExperiment('platform_editor_element_drag_and_drop_multiselect', true);
32
+ if (needsHideCursor || needsManualSelection) {
29
33
  for (var i = transactions.length - 1; i >= 0; i--) {
30
- var _transactions$i$getMe;
31
- manualSelection = (_transactions$i$getMe = transactions[i].getMeta(selectionPluginKey)) === null || _transactions$i$getMe === void 0 ? void 0 : _transactions$i$getMe.manualSelection;
32
- if (manualSelection) {
33
- break;
34
+ var meta = transactions[i].getMeta(selectionPluginKey);
35
+ if (needsHideCursor && (meta === null || meta === void 0 ? void 0 : meta.hideCursor) !== undefined) {
36
+ var newHideCursorValue = meta.hideCursor;
37
+ if (cursorHidden !== newHideCursorValue) {
38
+ cursorHidden = newHideCursorValue;
39
+ hideCursorChanged = true;
40
+ }
41
+ }
42
+ if (needsManualSelection && meta !== null && meta !== void 0 && meta.manualSelection && !manualSelection) {
43
+ manualSelection = meta.manualSelection;
44
+ if (!needsHideCursor) {
45
+ break;
46
+ }
34
47
  }
35
48
  }
36
49
  }
37
50
  if (!shouldRecalcDecorations({
38
51
  oldEditorState: oldEditorState,
39
52
  newEditorState: newEditorState
40
- }) && !manualSelection) {
53
+ }) && !manualSelection && !hideCursorChanged) {
41
54
  return;
42
55
  }
43
56
  tr.setMeta(selectionPluginKey, {
44
57
  type: SelectionActionTypes.SET_DECORATIONS,
45
58
  selection: tr.selection,
46
- decorationSet: getDecorations(tr, manualSelection)
59
+ decorationSet: getDecorations(tr, manualSelection, cursorHidden)
47
60
  });
48
61
  return tr;
49
62
  },
@@ -1,3 +1,4 @@
1
+ import _toConsumableArray from "@babel/runtime/helpers/toConsumableArray";
1
2
  import { isIgnored as isIgnoredByGapCursor, isSelectionAtStartOfNode } from '@atlaskit/editor-common/selection';
2
3
  import { isEmptyParagraph, isListItemNode } from '@atlaskit/editor-common/utils';
3
4
  import { AllSelection, NodeSelection, Selection, TextSelection } from '@atlaskit/editor-prosemirror/state';
@@ -6,27 +7,34 @@ import { Decoration, DecorationSet } from '@atlaskit/editor-prosemirror/view';
6
7
  import { akEditorSelectedNodeClassName } from '@atlaskit/editor-shared-styles';
7
8
  import { fg } from '@atlaskit/platform-feature-flags';
8
9
  import { selectionPluginKey } from '../types';
9
- export var getDecorations = function getDecorations(tr, manualSelection) {
10
+ import { createHideCursorDecoration } from './cursor/ui/hide-cursor-decoration';
11
+ export var getDecorations = function getDecorations(tr, manualSelection, hideCursor) {
10
12
  var selection = tr.selection;
13
+ var decorations = [];
14
+ if (hideCursor && fg('platform_editor_ai_aifc_patch_beta')) {
15
+ decorations.push(createHideCursorDecoration());
16
+ }
11
17
  if (selection instanceof NodeSelection) {
12
- return DecorationSet.create(tr.doc, [Decoration.node(selection.from, selection.to, {
18
+ decorations.push(Decoration.node(selection.from, selection.to, {
13
19
  class: akEditorSelectedNodeClassName
14
- })]);
20
+ }));
21
+ return DecorationSet.create(tr.doc, decorations);
15
22
  }
16
23
  if (selection instanceof TextSelection || selection instanceof AllSelection) {
17
24
  if (manualSelection && manualSelection.anchor >= 0 && manualSelection.head >= 0 && manualSelection.anchor <= tr.doc.nodeSize && manualSelection.head <= tr.doc.nodeSize) {
18
25
  selection = TextSelection.create(tr.doc, manualSelection.anchor, manualSelection.head);
19
26
  }
20
- var decorations = getNodesToDecorateFromSelection(selection, tr.doc).map(function (_ref) {
27
+ var selectionDecorations = getNodesToDecorateFromSelection(selection, tr.doc).map(function (_ref) {
21
28
  var node = _ref.node,
22
29
  pos = _ref.pos;
23
30
  return Decoration.node(pos, pos + node.nodeSize, {
24
31
  class: akEditorSelectedNodeClassName
25
32
  });
26
33
  });
34
+ decorations.push.apply(decorations, _toConsumableArray(selectionDecorations));
27
35
  return DecorationSet.create(tr.doc, decorations);
28
36
  }
29
- return DecorationSet.empty;
37
+ return decorations.length > 0 ? DecorationSet.create(tr.doc, decorations) : DecorationSet.empty;
30
38
  };
31
39
  var topLevelBlockNodesThatHaveSelectionStyles = ['table', 'panel', 'expand', 'layoutSection', 'decisionList', 'decisionItem', 'codeBlock'];
32
40
 
@@ -40,20 +40,30 @@ var setManualSelection = function setManualSelection(anchor, head) {
40
40
  }));
41
41
  };
42
42
  };
43
- export var selectionPlugin = function selectionPlugin(_ref4) {
44
- var api = _ref4.api,
45
- options = _ref4.config;
43
+ var hideCursor = function hideCursor(hide) {
44
+ return function (_ref4) {
45
+ var tr = _ref4.tr;
46
+ var currMeta = tr.getMeta(selectionPluginKey);
47
+ return tr.setMeta(selectionPluginKey, _objectSpread(_objectSpread({}, currMeta), {}, {
48
+ hideCursor: hide
49
+ }));
50
+ };
51
+ };
52
+ export var selectionPlugin = function selectionPlugin(_ref5) {
53
+ var api = _ref5.api,
54
+ options = _ref5.config;
46
55
  return {
47
56
  name: 'selection',
48
57
  commands: {
49
58
  displayGapCursor: displayGapCursor,
50
59
  clearManualSelection: clearManualSelection,
60
+ hideCursor: hideCursor,
51
61
  setManualSelection: setManualSelection
52
62
  },
53
63
  actions: {
54
- selectNearNode: function selectNearNode(_ref5) {
55
- var selectionRelativeToNode = _ref5.selectionRelativeToNode,
56
- selection = _ref5.selection;
64
+ selectNearNode: function selectNearNode(_ref6) {
65
+ var selectionRelativeToNode = _ref6.selectionRelativeToNode,
66
+ selection = _ref6.selection;
57
67
  return function (state) {
58
68
  return _selectNearNode(selectionRelativeToNode, selection)({
59
69
  tr: state.tr
@@ -76,9 +86,9 @@ export var selectionPlugin = function selectionPlugin(_ref4) {
76
86
  pmPlugins: function pmPlugins() {
77
87
  return [{
78
88
  name: 'selection',
79
- plugin: function plugin(_ref6) {
80
- var dispatch = _ref6.dispatch,
81
- dispatchAnalyticsEvent = _ref6.dispatchAnalyticsEvent;
89
+ plugin: function plugin(_ref7) {
90
+ var dispatch = _ref7.dispatch,
91
+ dispatchAnalyticsEvent = _ref7.dispatchAnalyticsEvent;
82
92
  return createPlugin(api, dispatch, dispatchAnalyticsEvent, options);
83
93
  }
84
94
  }, {
@@ -0,0 +1,2 @@
1
+ import { Decoration } from '@atlaskit/editor-prosemirror/view';
2
+ export declare const createHideCursorDecoration: () => Decoration;
@@ -2,5 +2,6 @@ import { SafePlugin } from '@atlaskit/editor-common/safe-plugin';
2
2
  declare const plugin: SafePlugin<{
3
3
  selectionIsGapCursor: boolean;
4
4
  displayGapCursor: boolean;
5
+ hideCursor: boolean;
5
6
  }>;
6
7
  export default plugin;
@@ -6,7 +6,7 @@ import { DecorationSet } from '@atlaskit/editor-prosemirror/view';
6
6
  export declare const getDecorations: (tr: Transaction | ReadonlyTransaction, manualSelection?: {
7
7
  anchor: number;
8
8
  head: number;
9
- }) => DecorationSet;
9
+ }, hideCursor?: boolean) => DecorationSet;
10
10
  /**
11
11
  * Use `getNodesToDecorateFromSelection` to collect and return
12
12
  * a list of nodes within the Selection that should have Selection
@@ -7,6 +7,7 @@ export type SelectionPlugin = NextEditorPlugin<'selection', {
7
7
  commands: {
8
8
  clearManualSelection: () => EditorCommand;
9
9
  displayGapCursor: (toggle: boolean) => EditorCommand;
10
+ hideCursor: (hide: boolean) => EditorCommand;
10
11
  setManualSelection: (anchor: number, head: number) => EditorCommand;
11
12
  };
12
13
  dependencies: [OptionalPlugin<InteractionPlugin>];
@@ -0,0 +1,2 @@
1
+ import { Decoration } from '@atlaskit/editor-prosemirror/view';
2
+ export declare const createHideCursorDecoration: () => Decoration;
@@ -2,5 +2,6 @@ import { SafePlugin } from '@atlaskit/editor-common/safe-plugin';
2
2
  declare const plugin: SafePlugin<{
3
3
  selectionIsGapCursor: boolean;
4
4
  displayGapCursor: boolean;
5
+ hideCursor: boolean;
5
6
  }>;
6
7
  export default plugin;
@@ -6,7 +6,7 @@ import { DecorationSet } from '@atlaskit/editor-prosemirror/view';
6
6
  export declare const getDecorations: (tr: Transaction | ReadonlyTransaction, manualSelection?: {
7
7
  anchor: number;
8
8
  head: number;
9
- }) => DecorationSet;
9
+ }, hideCursor?: boolean) => DecorationSet;
10
10
  /**
11
11
  * Use `getNodesToDecorateFromSelection` to collect and return
12
12
  * a list of nodes within the Selection that should have Selection
@@ -7,6 +7,7 @@ export type SelectionPlugin = NextEditorPlugin<'selection', {
7
7
  commands: {
8
8
  clearManualSelection: () => EditorCommand;
9
9
  displayGapCursor: (toggle: boolean) => EditorCommand;
10
+ hideCursor: (hide: boolean) => EditorCommand;
10
11
  setManualSelection: (anchor: number, head: number) => EditorCommand;
11
12
  };
12
13
  dependencies: [
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@atlaskit/editor-plugin-selection",
3
- "version": "6.0.2",
3
+ "version": "6.1.1",
4
4
  "description": "Selection plugin for @atlaskit/editor-core",
5
5
  "publishConfig": {
6
6
  "registry": "https://registry.npmjs.org/"
@@ -20,17 +20,17 @@
20
20
  },
21
21
  "dependencies": {
22
22
  "@atlaskit/editor-json-transformer": "^8.30.0",
23
- "@atlaskit/editor-plugin-interaction": "^8.0.0",
23
+ "@atlaskit/editor-plugin-interaction": "^9.0.0",
24
24
  "@atlaskit/editor-prosemirror": "7.0.0",
25
- "@atlaskit/editor-shared-styles": "^3.6.0",
25
+ "@atlaskit/editor-shared-styles": "^3.7.0",
26
26
  "@atlaskit/editor-tables": "^2.9.0",
27
27
  "@atlaskit/platform-feature-flags": "^1.1.0",
28
- "@atlaskit/tmp-editor-statsig": "^13.2.0",
29
- "@atlaskit/tokens": "^6.4.0",
28
+ "@atlaskit/tmp-editor-statsig": "^13.13.0",
29
+ "@atlaskit/tokens": "^7.0.0",
30
30
  "@babel/runtime": "^7.0.0"
31
31
  },
32
32
  "peerDependencies": {
33
- "@atlaskit/editor-common": "^110.4.0",
33
+ "@atlaskit/editor-common": "^110.13.0",
34
34
  "react": "^18.2.0"
35
35
  },
36
36
  "techstack": {
@@ -92,6 +92,9 @@
92
92
  },
93
93
  "platform_editor_fix_list_item_nav_bug_in_layout": {
94
94
  "type": "boolean"
95
+ },
96
+ "platform_editor_ai_aifc_patch_beta": {
97
+ "type": "boolean"
95
98
  }
96
99
  }
97
100
  }