@atlaskit/editor-plugin-placeholder 12.0.33 → 12.0.34

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,13 @@
1
1
  # @atlaskit/editor-plugin-placeholder
2
2
 
3
+ ## 12.0.34
4
+
5
+ ### Patch Changes
6
+
7
+ - [`c5a6973a90849`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/c5a6973a90849) -
8
+ Revert the multi-bodied extension empty frame placeholder.
9
+ - Updated dependencies
10
+
3
11
  ## 12.0.33
4
12
 
5
13
  ### Patch Changes
@@ -3,7 +3,7 @@
3
3
  Object.defineProperty(exports, "__esModule", {
4
4
  value: true
5
5
  });
6
- exports.placeholderTestId = exports.nodeTypesWithSyncBlockPlaceholderText = exports.nodeTypesWithShortPlaceholderText = exports.nodeTypesWithMultiBodiedExtensionPlaceholderText = exports.nodeTypesWithLongPlaceholderText = exports.TYPEWRITER_TYPE_DELAY = exports.TYPEWRITER_TYPED_AND_DELETED_DELAY = exports.TYPEWRITER_PAUSE_BEFORE_ERASE = exports.TYPEWRITER_ERASE_DELAY = exports.TYPEWRITER_CYCLE_DELAY = void 0;
6
+ exports.placeholderTestId = exports.nodeTypesWithSyncBlockPlaceholderText = exports.nodeTypesWithShortPlaceholderText = exports.nodeTypesWithLongPlaceholderText = exports.TYPEWRITER_TYPE_DELAY = exports.TYPEWRITER_TYPED_AND_DELETED_DELAY = exports.TYPEWRITER_PAUSE_BEFORE_ERASE = exports.TYPEWRITER_ERASE_DELAY = exports.TYPEWRITER_CYCLE_DELAY = void 0;
7
7
  var placeholderTestId = exports.placeholderTestId = 'placeholder-test-id';
8
8
 
9
9
  // Typewriter animation timing constants
@@ -15,5 +15,4 @@ var TYPEWRITER_TYPED_AND_DELETED_DELAY = exports.TYPEWRITER_TYPED_AND_DELETED_DE
15
15
 
16
16
  var nodeTypesWithLongPlaceholderText = exports.nodeTypesWithLongPlaceholderText = ['expand', 'panel'];
17
17
  var nodeTypesWithShortPlaceholderText = exports.nodeTypesWithShortPlaceholderText = ['tableCell', 'tableHeader'];
18
- var nodeTypesWithSyncBlockPlaceholderText = exports.nodeTypesWithSyncBlockPlaceholderText = ['bodiedSyncBlock'];
19
- var nodeTypesWithMultiBodiedExtensionPlaceholderText = exports.nodeTypesWithMultiBodiedExtensionPlaceholderText = ['extensionFrame'];
18
+ var nodeTypesWithSyncBlockPlaceholderText = exports.nodeTypesWithSyncBlockPlaceholderText = ['bodiedSyncBlock'];
@@ -5,15 +5,12 @@ Object.defineProperty(exports, "__esModule", {
5
5
  value: true
6
6
  });
7
7
  exports.default = createPlugin;
8
- var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
9
8
  var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
10
9
  var _safePlugin = require("@atlaskit/editor-common/safe-plugin");
11
- var _view = require("@atlaskit/editor-prosemirror/view");
12
10
  var _expVal = require("@atlaskit/tmp-editor-statsig/expVal");
13
11
  var _placeholderPlugin = require("../placeholderPlugin");
14
12
  var _constants = require("./constants");
15
13
  var _decorations = require("./decorations");
16
- var _multiBodiedExtensionPlaceholderDecorations = require("./multi-bodied-extension-placeholder-decorations");
17
14
  var _sourceSyncBlockPlaceholderDecorations = require("./source-sync-block-placeholder-decorations");
18
15
  var _utils = require("./utils");
19
16
  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; }
@@ -51,8 +48,7 @@ function createPlugin(intl, defaultPlaceholderText, bracketPlaceholderText, empt
51
48
  withEmptyParagraph: withEmptyParagraph,
52
49
  isPlaceholderHidden: initialIsPlaceholderHidden
53
50
  })), {}, {
54
- sourceSyncBlockPlaceholderDecorations: (0, _sourceSyncBlockPlaceholderDecorations.createSourceSyncBlockPlaceholderDecorations)(state, intl),
55
- multiBodiedExtensionPlaceholderDecorations: (0, _multiBodiedExtensionPlaceholderDecorations.createMultiBodiedExtensionPlaceholderDecorations)(state, intl)
51
+ sourceSyncBlockPlaceholderDecorations: (0, _sourceSyncBlockPlaceholderDecorations.createSourceSyncBlockPlaceholderDecorations)(state, intl)
56
52
  });
57
53
  },
58
54
  apply: function apply(tr, placeholderState, _oldEditorState, newEditorState) {
@@ -101,12 +97,6 @@ function createPlugin(intl, defaultPlaceholderText, bracketPlaceholderText, empt
101
97
  newEditorState: newEditorState,
102
98
  oldEditorState: _oldEditorState,
103
99
  tr: tr
104
- }),
105
- multiBodiedExtensionPlaceholderDecorations: (0, _multiBodiedExtensionPlaceholderDecorations.updateMultiBodiedExtensionPlaceholderDecorations)({
106
- currentDecorationSet: placeholderState === null || placeholderState === void 0 ? void 0 : placeholderState.multiBodiedExtensionPlaceholderDecorations,
107
- intl: intl,
108
- newEditorState: newEditorState,
109
- tr: tr
110
100
  })
111
101
  });
112
102
 
@@ -119,7 +109,7 @@ function createPlugin(intl, defaultPlaceholderText, bracketPlaceholderText, empt
119
109
  },
120
110
  props: {
121
111
  decorations: function decorations(editorState) {
122
- var _api$composition, _api$showDiff, _syncBlockPlaceholder, _multiBodiedExtension;
112
+ var _api$composition, _api$showDiff;
123
113
  // @ts-ignore quick fix which needs follow up to use standard apis
124
114
  if (editorState.collabEditPlugin$ && editorState.collabEditPlugin$.isReady !== true) {
125
115
  return;
@@ -131,8 +121,7 @@ function createPlugin(intl, defaultPlaceholderText, bracketPlaceholderText, empt
131
121
  typedAndDeleted = _getPlaceholderState.typedAndDeleted,
132
122
  contextPlaceholderADF = _getPlaceholderState.contextPlaceholderADF,
133
123
  showOnEmptyParagraph = _getPlaceholderState.showOnEmptyParagraph,
134
- sourceSyncBlockPlaceholderDecorations = _getPlaceholderState.sourceSyncBlockPlaceholderDecorations,
135
- multiBodiedExtensionPlaceholderDecorations = _getPlaceholderState.multiBodiedExtensionPlaceholderDecorations;
124
+ sourceSyncBlockPlaceholderDecorations = _getPlaceholderState.sourceSyncBlockPlaceholderDecorations;
136
125
 
137
126
  // Decorations is still called after plugin is destroyed
138
127
  // So we need to make sure decorations is not called if plugin has been destroyed to prevent the placeholder animations' setTimeouts called infinitely
@@ -142,25 +131,14 @@ function createPlugin(intl, defaultPlaceholderText, bracketPlaceholderText, empt
142
131
  var compositionPluginState = api === null || api === void 0 || (_api$composition = api.composition) === null || _api$composition === void 0 ? void 0 : _api$composition.sharedState.currentState();
143
132
  var isShowingDiff = Boolean(api === null || api === void 0 || (_api$showDiff = api.showDiff) === null || _api$showDiff === void 0 || (_api$showDiff = _api$showDiff.sharedState.currentState()) === null || _api$showDiff === void 0 ? void 0 : _api$showDiff.isDisplayingChanges);
144
133
  var syncBlockPlaceholderDecorations = !(compositionPluginState !== null && compositionPluginState !== void 0 && compositionPluginState.isComposing) && !isShowingDiff ? sourceSyncBlockPlaceholderDecorations : undefined;
145
- var multiBodiedExtensionDecorations = !(compositionPluginState !== null && compositionPluginState !== void 0 && compositionPluginState.isComposing) && !isShowingDiff ? multiBodiedExtensionPlaceholderDecorations : undefined;
146
- var syncBlockDecorationItems = (_syncBlockPlaceholder = syncBlockPlaceholderDecorations === null || syncBlockPlaceholderDecorations === void 0 ? void 0 : syncBlockPlaceholderDecorations.find()) !== null && _syncBlockPlaceholder !== void 0 ? _syncBlockPlaceholder : [];
147
- var multiBodiedExtensionDecorationItems = (_multiBodiedExtension = multiBodiedExtensionDecorations === null || multiBodiedExtensionDecorations === void 0 ? void 0 : multiBodiedExtensionDecorations.find()) !== null && _multiBodiedExtension !== void 0 ? _multiBodiedExtension : [];
148
134
  if (hasPlaceholder && ((placeholderText !== null && placeholderText !== void 0 ? placeholderText : '') || placeholderPrompts || placeholderADF || contextPlaceholderADF) && pos !== undefined && !(compositionPluginState !== null && compositionPluginState !== void 0 && compositionPluginState.isComposing) && !isShowingDiff) {
135
+ var _syncBlockPlaceholder;
149
136
  var initialDelayWhenUserTypedAndDeleted = typedAndDeleted ? _constants.TYPEWRITER_TYPED_AND_DELETED_DELAY : 0;
150
137
  // contextPlaceholderADF takes precedence over the global placeholderADF
151
138
  var placeholderAdfToUse = contextPlaceholderADF || placeholderADF;
152
- return (0, _decorations.createPlaceholderDecoration)(editorState, placeholderText !== null && placeholderText !== void 0 ? placeholderText : '', placeholderPrompts, activeTypewriterTimeouts, pos, initialDelayWhenUserTypedAndDeleted, placeholderAdfToUse, showOnEmptyParagraph).add(editorState.doc, [].concat((0, _toConsumableArray2.default)(syncBlockDecorationItems), (0, _toConsumableArray2.default)(multiBodiedExtensionDecorationItems)));
153
- }
154
- // These sets are already mapped in plugin state. Return a single
155
- // active set directly, and only rebuild when multiple sets must be merged.
156
- if (syncBlockDecorationItems.length > 0 && multiBodiedExtensionDecorationItems.length === 0) {
157
- return syncBlockPlaceholderDecorations;
158
- }
159
- if (multiBodiedExtensionDecorationItems.length > 0 && syncBlockDecorationItems.length === 0) {
160
- return multiBodiedExtensionDecorations;
139
+ return (0, _decorations.createPlaceholderDecoration)(editorState, placeholderText !== null && placeholderText !== void 0 ? placeholderText : '', placeholderPrompts, activeTypewriterTimeouts, pos, initialDelayWhenUserTypedAndDeleted, placeholderAdfToUse, showOnEmptyParagraph).add(editorState.doc, (_syncBlockPlaceholder = syncBlockPlaceholderDecorations === null || syncBlockPlaceholderDecorations === void 0 ? void 0 : syncBlockPlaceholderDecorations.find()) !== null && _syncBlockPlaceholder !== void 0 ? _syncBlockPlaceholder : []);
161
140
  }
162
- var additionalDecorations = [].concat((0, _toConsumableArray2.default)(syncBlockDecorationItems), (0, _toConsumableArray2.default)(multiBodiedExtensionDecorationItems));
163
- return additionalDecorations.length > 0 ? _view.DecorationSet.create(editorState.doc, additionalDecorations) : undefined;
141
+ return syncBlockPlaceholderDecorations;
164
142
  }
165
143
  },
166
144
  view: function view() {
@@ -9,5 +9,4 @@ export const TYPEWRITER_TYPED_AND_DELETED_DELAY = 1500; // Delay before starting
9
9
 
10
10
  export const nodeTypesWithLongPlaceholderText = ['expand', 'panel'];
11
11
  export const nodeTypesWithShortPlaceholderText = ['tableCell', 'tableHeader'];
12
- export const nodeTypesWithSyncBlockPlaceholderText = ['bodiedSyncBlock'];
13
- export const nodeTypesWithMultiBodiedExtensionPlaceholderText = ['extensionFrame'];
12
+ export const nodeTypesWithSyncBlockPlaceholderText = ['bodiedSyncBlock'];
@@ -1,10 +1,8 @@
1
1
  import { SafePlugin } from '@atlaskit/editor-common/safe-plugin';
2
- import { DecorationSet } from '@atlaskit/editor-prosemirror/view';
3
2
  import { expVal } from '@atlaskit/tmp-editor-statsig/expVal';
4
3
  import { EMPTY_PARAGRAPH_TIMEOUT_DELAY, pluginKey } from '../placeholderPlugin';
5
4
  import { TYPEWRITER_TYPED_AND_DELETED_DELAY } from './constants';
6
5
  import { createPlaceholderDecoration } from './decorations';
7
- import { createMultiBodiedExtensionPlaceholderDecorations, updateMultiBodiedExtensionPlaceholderDecorations } from './multi-bodied-extension-placeholder-decorations';
8
6
  import { createSourceSyncBlockPlaceholderDecorations, updateSourceSyncBlockPlaceholderDecorations } from './source-sync-block-placeholder-decorations';
9
7
  import { calculateUserInteractionState, createPlaceHolderStateFrom, getPlaceholderState } from './utils';
10
8
  export default function createPlugin(intl, defaultPlaceholderText, bracketPlaceholderText, emptyLinePlaceholder, placeholderPrompts, withEmptyParagraph, initialIsPlaceholderHidden, placeholderADF, isRovoLLMEnabled, api) {
@@ -39,8 +37,7 @@ export default function createPlugin(intl, defaultPlaceholderText, bracketPlaceh
39
37
  withEmptyParagraph,
40
38
  isPlaceholderHidden: initialIsPlaceholderHidden
41
39
  }),
42
- sourceSyncBlockPlaceholderDecorations: createSourceSyncBlockPlaceholderDecorations(state, intl),
43
- multiBodiedExtensionPlaceholderDecorations: createMultiBodiedExtensionPlaceholderDecorations(state, intl)
40
+ sourceSyncBlockPlaceholderDecorations: createSourceSyncBlockPlaceholderDecorations(state, intl)
44
41
  };
45
42
  },
46
43
  apply: (tr, placeholderState, _oldEditorState, newEditorState) => {
@@ -91,12 +88,6 @@ export default function createPlugin(intl, defaultPlaceholderText, bracketPlaceh
91
88
  newEditorState,
92
89
  oldEditorState: _oldEditorState,
93
90
  tr
94
- }),
95
- multiBodiedExtensionPlaceholderDecorations: updateMultiBodiedExtensionPlaceholderDecorations({
96
- currentDecorationSet: placeholderState === null || placeholderState === void 0 ? void 0 : placeholderState.multiBodiedExtensionPlaceholderDecorations,
97
- intl,
98
- newEditorState,
99
- tr
100
91
  })
101
92
  };
102
93
 
@@ -109,7 +100,7 @@ export default function createPlugin(intl, defaultPlaceholderText, bracketPlaceh
109
100
  },
110
101
  props: {
111
102
  decorations(editorState) {
112
- var _api$composition, _api$showDiff, _api$showDiff$sharedS, _syncBlockPlaceholder, _multiBodiedExtension;
103
+ var _api$composition, _api$showDiff, _api$showDiff$sharedS;
113
104
  // @ts-ignore quick fix which needs follow up to use standard apis
114
105
  if (editorState.collabEditPlugin$ && editorState.collabEditPlugin$.isReady !== true) {
115
106
  return;
@@ -121,8 +112,7 @@ export default function createPlugin(intl, defaultPlaceholderText, bracketPlaceh
121
112
  typedAndDeleted,
122
113
  contextPlaceholderADF,
123
114
  showOnEmptyParagraph,
124
- sourceSyncBlockPlaceholderDecorations,
125
- multiBodiedExtensionPlaceholderDecorations
115
+ sourceSyncBlockPlaceholderDecorations
126
116
  } = getPlaceholderState(editorState);
127
117
 
128
118
  // Decorations is still called after plugin is destroyed
@@ -133,25 +123,14 @@ export default function createPlugin(intl, defaultPlaceholderText, bracketPlaceh
133
123
  const compositionPluginState = api === null || api === void 0 ? void 0 : (_api$composition = api.composition) === null || _api$composition === void 0 ? void 0 : _api$composition.sharedState.currentState();
134
124
  const isShowingDiff = Boolean(api === null || api === void 0 ? void 0 : (_api$showDiff = api.showDiff) === null || _api$showDiff === void 0 ? void 0 : (_api$showDiff$sharedS = _api$showDiff.sharedState.currentState()) === null || _api$showDiff$sharedS === void 0 ? void 0 : _api$showDiff$sharedS.isDisplayingChanges);
135
125
  const syncBlockPlaceholderDecorations = !(compositionPluginState !== null && compositionPluginState !== void 0 && compositionPluginState.isComposing) && !isShowingDiff ? sourceSyncBlockPlaceholderDecorations : undefined;
136
- const multiBodiedExtensionDecorations = !(compositionPluginState !== null && compositionPluginState !== void 0 && compositionPluginState.isComposing) && !isShowingDiff ? multiBodiedExtensionPlaceholderDecorations : undefined;
137
- const syncBlockDecorationItems = (_syncBlockPlaceholder = syncBlockPlaceholderDecorations === null || syncBlockPlaceholderDecorations === void 0 ? void 0 : syncBlockPlaceholderDecorations.find()) !== null && _syncBlockPlaceholder !== void 0 ? _syncBlockPlaceholder : [];
138
- const multiBodiedExtensionDecorationItems = (_multiBodiedExtension = multiBodiedExtensionDecorations === null || multiBodiedExtensionDecorations === void 0 ? void 0 : multiBodiedExtensionDecorations.find()) !== null && _multiBodiedExtension !== void 0 ? _multiBodiedExtension : [];
139
126
  if (hasPlaceholder && ((placeholderText !== null && placeholderText !== void 0 ? placeholderText : '') || placeholderPrompts || placeholderADF || contextPlaceholderADF) && pos !== undefined && !(compositionPluginState !== null && compositionPluginState !== void 0 && compositionPluginState.isComposing) && !isShowingDiff) {
127
+ var _syncBlockPlaceholder;
140
128
  const initialDelayWhenUserTypedAndDeleted = typedAndDeleted ? TYPEWRITER_TYPED_AND_DELETED_DELAY : 0;
141
129
  // contextPlaceholderADF takes precedence over the global placeholderADF
142
130
  const placeholderAdfToUse = contextPlaceholderADF || placeholderADF;
143
- return createPlaceholderDecoration(editorState, placeholderText !== null && placeholderText !== void 0 ? placeholderText : '', placeholderPrompts, activeTypewriterTimeouts, pos, initialDelayWhenUserTypedAndDeleted, placeholderAdfToUse, showOnEmptyParagraph).add(editorState.doc, [...syncBlockDecorationItems, ...multiBodiedExtensionDecorationItems]);
144
- }
145
- // These sets are already mapped in plugin state. Return a single
146
- // active set directly, and only rebuild when multiple sets must be merged.
147
- if (syncBlockDecorationItems.length > 0 && multiBodiedExtensionDecorationItems.length === 0) {
148
- return syncBlockPlaceholderDecorations;
149
- }
150
- if (multiBodiedExtensionDecorationItems.length > 0 && syncBlockDecorationItems.length === 0) {
151
- return multiBodiedExtensionDecorations;
131
+ return createPlaceholderDecoration(editorState, placeholderText !== null && placeholderText !== void 0 ? placeholderText : '', placeholderPrompts, activeTypewriterTimeouts, pos, initialDelayWhenUserTypedAndDeleted, placeholderAdfToUse, showOnEmptyParagraph).add(editorState.doc, (_syncBlockPlaceholder = syncBlockPlaceholderDecorations === null || syncBlockPlaceholderDecorations === void 0 ? void 0 : syncBlockPlaceholderDecorations.find()) !== null && _syncBlockPlaceholder !== void 0 ? _syncBlockPlaceholder : []);
152
132
  }
153
- const additionalDecorations = [...syncBlockDecorationItems, ...multiBodiedExtensionDecorationItems];
154
- return additionalDecorations.length > 0 ? DecorationSet.create(editorState.doc, additionalDecorations) : undefined;
133
+ return syncBlockPlaceholderDecorations;
155
134
  }
156
135
  },
157
136
  view() {
@@ -9,5 +9,4 @@ export var TYPEWRITER_TYPED_AND_DELETED_DELAY = 1500; // Delay before starting a
9
9
 
10
10
  export var nodeTypesWithLongPlaceholderText = ['expand', 'panel'];
11
11
  export var nodeTypesWithShortPlaceholderText = ['tableCell', 'tableHeader'];
12
- export var nodeTypesWithSyncBlockPlaceholderText = ['bodiedSyncBlock'];
13
- export var nodeTypesWithMultiBodiedExtensionPlaceholderText = ['extensionFrame'];
12
+ export var nodeTypesWithSyncBlockPlaceholderText = ['bodiedSyncBlock'];
@@ -1,14 +1,11 @@
1
- import _toConsumableArray from "@babel/runtime/helpers/toConsumableArray";
2
1
  import _defineProperty from "@babel/runtime/helpers/defineProperty";
3
2
  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; }
4
3
  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) { _defineProperty(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; }
5
4
  import { SafePlugin } from '@atlaskit/editor-common/safe-plugin';
6
- import { DecorationSet } from '@atlaskit/editor-prosemirror/view';
7
5
  import { expVal } from '@atlaskit/tmp-editor-statsig/expVal';
8
6
  import { EMPTY_PARAGRAPH_TIMEOUT_DELAY, pluginKey } from '../placeholderPlugin';
9
7
  import { TYPEWRITER_TYPED_AND_DELETED_DELAY } from './constants';
10
8
  import { createPlaceholderDecoration } from './decorations';
11
- import { createMultiBodiedExtensionPlaceholderDecorations, updateMultiBodiedExtensionPlaceholderDecorations } from './multi-bodied-extension-placeholder-decorations';
12
9
  import { createSourceSyncBlockPlaceholderDecorations, updateSourceSyncBlockPlaceholderDecorations } from './source-sync-block-placeholder-decorations';
13
10
  import { calculateUserInteractionState, createPlaceHolderStateFrom, getPlaceholderState } from './utils';
14
11
  export default function createPlugin(intl, defaultPlaceholderText, bracketPlaceholderText, emptyLinePlaceholder, placeholderPrompts, withEmptyParagraph, initialIsPlaceholderHidden, placeholderADF, isRovoLLMEnabled, api) {
@@ -44,8 +41,7 @@ export default function createPlugin(intl, defaultPlaceholderText, bracketPlaceh
44
41
  withEmptyParagraph: withEmptyParagraph,
45
42
  isPlaceholderHidden: initialIsPlaceholderHidden
46
43
  })), {}, {
47
- sourceSyncBlockPlaceholderDecorations: createSourceSyncBlockPlaceholderDecorations(state, intl),
48
- multiBodiedExtensionPlaceholderDecorations: createMultiBodiedExtensionPlaceholderDecorations(state, intl)
44
+ sourceSyncBlockPlaceholderDecorations: createSourceSyncBlockPlaceholderDecorations(state, intl)
49
45
  });
50
46
  },
51
47
  apply: function apply(tr, placeholderState, _oldEditorState, newEditorState) {
@@ -94,12 +90,6 @@ export default function createPlugin(intl, defaultPlaceholderText, bracketPlaceh
94
90
  newEditorState: newEditorState,
95
91
  oldEditorState: _oldEditorState,
96
92
  tr: tr
97
- }),
98
- multiBodiedExtensionPlaceholderDecorations: updateMultiBodiedExtensionPlaceholderDecorations({
99
- currentDecorationSet: placeholderState === null || placeholderState === void 0 ? void 0 : placeholderState.multiBodiedExtensionPlaceholderDecorations,
100
- intl: intl,
101
- newEditorState: newEditorState,
102
- tr: tr
103
93
  })
104
94
  });
105
95
 
@@ -112,7 +102,7 @@ export default function createPlugin(intl, defaultPlaceholderText, bracketPlaceh
112
102
  },
113
103
  props: {
114
104
  decorations: function decorations(editorState) {
115
- var _api$composition, _api$showDiff, _syncBlockPlaceholder, _multiBodiedExtension;
105
+ var _api$composition, _api$showDiff;
116
106
  // @ts-ignore quick fix which needs follow up to use standard apis
117
107
  if (editorState.collabEditPlugin$ && editorState.collabEditPlugin$.isReady !== true) {
118
108
  return;
@@ -124,8 +114,7 @@ export default function createPlugin(intl, defaultPlaceholderText, bracketPlaceh
124
114
  typedAndDeleted = _getPlaceholderState.typedAndDeleted,
125
115
  contextPlaceholderADF = _getPlaceholderState.contextPlaceholderADF,
126
116
  showOnEmptyParagraph = _getPlaceholderState.showOnEmptyParagraph,
127
- sourceSyncBlockPlaceholderDecorations = _getPlaceholderState.sourceSyncBlockPlaceholderDecorations,
128
- multiBodiedExtensionPlaceholderDecorations = _getPlaceholderState.multiBodiedExtensionPlaceholderDecorations;
117
+ sourceSyncBlockPlaceholderDecorations = _getPlaceholderState.sourceSyncBlockPlaceholderDecorations;
129
118
 
130
119
  // Decorations is still called after plugin is destroyed
131
120
  // So we need to make sure decorations is not called if plugin has been destroyed to prevent the placeholder animations' setTimeouts called infinitely
@@ -135,25 +124,14 @@ export default function createPlugin(intl, defaultPlaceholderText, bracketPlaceh
135
124
  var compositionPluginState = api === null || api === void 0 || (_api$composition = api.composition) === null || _api$composition === void 0 ? void 0 : _api$composition.sharedState.currentState();
136
125
  var isShowingDiff = Boolean(api === null || api === void 0 || (_api$showDiff = api.showDiff) === null || _api$showDiff === void 0 || (_api$showDiff = _api$showDiff.sharedState.currentState()) === null || _api$showDiff === void 0 ? void 0 : _api$showDiff.isDisplayingChanges);
137
126
  var syncBlockPlaceholderDecorations = !(compositionPluginState !== null && compositionPluginState !== void 0 && compositionPluginState.isComposing) && !isShowingDiff ? sourceSyncBlockPlaceholderDecorations : undefined;
138
- var multiBodiedExtensionDecorations = !(compositionPluginState !== null && compositionPluginState !== void 0 && compositionPluginState.isComposing) && !isShowingDiff ? multiBodiedExtensionPlaceholderDecorations : undefined;
139
- var syncBlockDecorationItems = (_syncBlockPlaceholder = syncBlockPlaceholderDecorations === null || syncBlockPlaceholderDecorations === void 0 ? void 0 : syncBlockPlaceholderDecorations.find()) !== null && _syncBlockPlaceholder !== void 0 ? _syncBlockPlaceholder : [];
140
- var multiBodiedExtensionDecorationItems = (_multiBodiedExtension = multiBodiedExtensionDecorations === null || multiBodiedExtensionDecorations === void 0 ? void 0 : multiBodiedExtensionDecorations.find()) !== null && _multiBodiedExtension !== void 0 ? _multiBodiedExtension : [];
141
127
  if (hasPlaceholder && ((placeholderText !== null && placeholderText !== void 0 ? placeholderText : '') || placeholderPrompts || placeholderADF || contextPlaceholderADF) && pos !== undefined && !(compositionPluginState !== null && compositionPluginState !== void 0 && compositionPluginState.isComposing) && !isShowingDiff) {
128
+ var _syncBlockPlaceholder;
142
129
  var initialDelayWhenUserTypedAndDeleted = typedAndDeleted ? TYPEWRITER_TYPED_AND_DELETED_DELAY : 0;
143
130
  // contextPlaceholderADF takes precedence over the global placeholderADF
144
131
  var placeholderAdfToUse = contextPlaceholderADF || placeholderADF;
145
- return createPlaceholderDecoration(editorState, placeholderText !== null && placeholderText !== void 0 ? placeholderText : '', placeholderPrompts, activeTypewriterTimeouts, pos, initialDelayWhenUserTypedAndDeleted, placeholderAdfToUse, showOnEmptyParagraph).add(editorState.doc, [].concat(_toConsumableArray(syncBlockDecorationItems), _toConsumableArray(multiBodiedExtensionDecorationItems)));
146
- }
147
- // These sets are already mapped in plugin state. Return a single
148
- // active set directly, and only rebuild when multiple sets must be merged.
149
- if (syncBlockDecorationItems.length > 0 && multiBodiedExtensionDecorationItems.length === 0) {
150
- return syncBlockPlaceholderDecorations;
151
- }
152
- if (multiBodiedExtensionDecorationItems.length > 0 && syncBlockDecorationItems.length === 0) {
153
- return multiBodiedExtensionDecorations;
132
+ return createPlaceholderDecoration(editorState, placeholderText !== null && placeholderText !== void 0 ? placeholderText : '', placeholderPrompts, activeTypewriterTimeouts, pos, initialDelayWhenUserTypedAndDeleted, placeholderAdfToUse, showOnEmptyParagraph).add(editorState.doc, (_syncBlockPlaceholder = syncBlockPlaceholderDecorations === null || syncBlockPlaceholderDecorations === void 0 ? void 0 : syncBlockPlaceholderDecorations.find()) !== null && _syncBlockPlaceholder !== void 0 ? _syncBlockPlaceholder : []);
154
133
  }
155
- var additionalDecorations = [].concat(_toConsumableArray(syncBlockDecorationItems), _toConsumableArray(multiBodiedExtensionDecorationItems));
156
- return additionalDecorations.length > 0 ? DecorationSet.create(editorState.doc, additionalDecorations) : undefined;
134
+ return syncBlockPlaceholderDecorations;
157
135
  }
158
136
  },
159
137
  view: function view() {
@@ -7,4 +7,3 @@ export declare const TYPEWRITER_TYPED_AND_DELETED_DELAY = 1500;
7
7
  export declare const nodeTypesWithLongPlaceholderText: string[];
8
8
  export declare const nodeTypesWithShortPlaceholderText: string[];
9
9
  export declare const nodeTypesWithSyncBlockPlaceholderText: string[];
10
- export declare const nodeTypesWithMultiBodiedExtensionPlaceholderText: string[];
@@ -7,7 +7,6 @@ export interface PlaceHolderState {
7
7
  contextPlaceholderADF?: DocNode;
8
8
  hasPlaceholder: boolean;
9
9
  isPlaceholderHidden?: boolean;
10
- multiBodiedExtensionPlaceholderDecorations?: DecorationSet;
11
10
  placeholderPrompts?: string[];
12
11
  placeholderText?: string;
13
12
  pos?: number;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@atlaskit/editor-plugin-placeholder",
3
- "version": "12.0.33",
3
+ "version": "12.0.34",
4
4
  "description": "Placeholder plugin for @atlaskit/editor-core.",
5
5
  "author": "Atlassian Pty Ltd",
6
6
  "license": "Apache-2.0",
@@ -29,7 +29,7 @@
29
29
  "@atlaskit/platform-feature-flags": "^2.1.0",
30
30
  "@atlaskit/primitives": "^22.1.0",
31
31
  "@atlaskit/spinner": "^20.1.0",
32
- "@atlaskit/tmp-editor-statsig": "^132.0.0",
32
+ "@atlaskit/tmp-editor-statsig": "^132.2.0",
33
33
  "@atlaskit/tokens": "^16.2.0",
34
34
  "@babel/runtime": "^7.0.0"
35
35
  },
@@ -1,178 +0,0 @@
1
- "use strict";
2
-
3
- Object.defineProperty(exports, "__esModule", {
4
- value: true
5
- });
6
- exports.createMultiBodiedExtensionPlaceholderDecorations = createMultiBodiedExtensionPlaceholderDecorations;
7
- exports.updateMultiBodiedExtensionPlaceholderDecorations = updateMultiBodiedExtensionPlaceholderDecorations;
8
- var _messages = require("@atlaskit/editor-common/messages");
9
- var _view = require("@atlaskit/editor-prosemirror/view");
10
- var _expValEquals = require("@atlaskit/tmp-editor-statsig/exp-val-equals");
11
- var _constants = require("./constants");
12
- var isMultiBodiedExtensionPlaceholderEnabled = function isMultiBodiedExtensionPlaceholderEnabled() {
13
- return (0, _expValEquals.expValEquals)('confluence_native_tabs_experiment', 'isEnabled', true);
14
- };
15
-
16
- // Empty MBE bodies are represented as extensionFrame -> empty paragraph.
17
- // The paragraph gives the cursor a valid textblock, but there is no authored content yet.
18
- var isEmptyExtensionFrame = function isEmptyExtensionFrame(node) {
19
- var _node$firstChild, _node$firstChild2;
20
- return _constants.nodeTypesWithMultiBodiedExtensionPlaceholderText.includes(node.type.name) && node.childCount === 1 && ((_node$firstChild = node.firstChild) === null || _node$firstChild === void 0 ? void 0 : _node$firstChild.content.size) === 0 && ((_node$firstChild2 = node.firstChild) === null || _node$firstChild2 === void 0 ? void 0 : _node$firstChild2.type.name) === 'paragraph';
21
- };
22
-
23
- // Keep this generic for any MBE extension by checking the node shape rather
24
- // than a product-specific extensionKey.
25
- var isExtensionFrameInMultiBodiedExtension = function isExtensionFrameInMultiBodiedExtension(node, parent) {
26
- return _constants.nodeTypesWithMultiBodiedExtensionPlaceholderText.includes(node.type.name) && (parent === null || parent === void 0 ? void 0 : parent.type.name) === 'multiBodiedExtension';
27
- };
28
- var isEmptyExtensionFrameInMultiBodiedExtension = function isEmptyExtensionFrameInMultiBodiedExtension(node, parent) {
29
- return isExtensionFrameInMultiBodiedExtension(node, parent) && isEmptyExtensionFrame(node);
30
- };
31
-
32
- // Widget decorations render UI without adding real content to the document.
33
- var createMultiBodiedExtensionPlaceholderElement = function createMultiBodiedExtensionPlaceholderElement(intl) {
34
- var placeholderDecoration = document.createElement('span');
35
- placeholderDecoration.setAttribute('data-testid', _constants.placeholderTestId);
36
- placeholderDecoration.className = 'placeholder-decoration';
37
- placeholderDecoration.setAttribute('aria-hidden', 'true');
38
- placeholderDecoration.textContent = intl.formatMessage(_messages.placeholderTextMessages.multiBodiedExtensionPlaceholderText);
39
- return placeholderDecoration;
40
- };
41
-
42
- // `pos` is before extensionFrame; `pos + 2` is inside its paragraph, where
43
- // typing starts and where the placeholder should render.
44
- var createMultiBodiedExtensionPlaceholderDecoration = function createMultiBodiedExtensionPlaceholderDecoration(pos, intl) {
45
- return _view.Decoration.widget(pos + 2, function () {
46
- return createMultiBodiedExtensionPlaceholderElement(intl);
47
- }, {
48
- side: 0,
49
- key: "multi-bodied-extension-placeholder-".concat(pos)
50
- });
51
- };
52
- // Convert changed step ranges into final-document positions. A transaction can
53
- // contain multiple steps, and each step can shift positions for later steps.
54
- var getChangedRanges = function getChangedRanges(tr) {
55
- var ranges = [];
56
- tr.mapping.maps.forEach(function (stepMap, index) {
57
- stepMap.forEach(function (_oldStart, _oldEnd, newStart, newEnd) {
58
- var mappingAfterStep = tr.mapping.slice(index + 1);
59
- ranges.push({
60
- from: mappingAfterStep.map(newStart, -1),
61
- to: mappingAfterStep.map(newEnd, 1)
62
- });
63
- });
64
- });
65
- return ranges;
66
- };
67
-
68
- // Walk from a changed position up to its containing MBE frame. The frame may no
69
- // longer be empty after the change, but we still need its range to remove stale decorations.
70
- var getMultiBodiedExtensionFrameRange = function getMultiBodiedExtensionFrameRange(doc, pos) {
71
- var resolvedPos = doc.resolve(Math.max(0, Math.min(pos, doc.content.size)));
72
- for (var depth = resolvedPos.depth; depth > 0; depth--) {
73
- var node = resolvedPos.node(depth);
74
- var parent = depth > 0 ? resolvedPos.node(depth - 1) : undefined;
75
- if (isExtensionFrameInMultiBodiedExtension(node, parent)) {
76
- return {
77
- from: resolvedPos.before(depth),
78
- to: resolvedPos.after(depth)
79
- };
80
- }
81
- }
82
- return;
83
- };
84
-
85
- // Resolve just inside a frame to recover its parent; `doc.nodeAt(framePos)` only
86
- // gives the frame node itself.
87
- var getMultiBodiedExtensionFrameParent = function getMultiBodiedExtensionFrameParent(doc, framePos) {
88
- var resolvedPos = doc.resolve(Math.max(0, Math.min(framePos + 1, doc.content.size)));
89
- for (var depth = resolvedPos.depth; depth > 0; depth--) {
90
- if (resolvedPos.before(depth) === framePos) {
91
- return resolvedPos.node(depth - 1);
92
- }
93
- }
94
- return;
95
- };
96
-
97
- // Only update MBE frames touched by this transaction: either the change happened
98
- // inside a frame, or the transaction inserted/replaced an empty frame.
99
- var getAffectedMultiBodiedExtensionFrameRanges = function getAffectedMultiBodiedExtensionFrameRanges(doc, ranges) {
100
- var affectedRanges = new Map();
101
- ranges.forEach(function (_ref) {
102
- var from = _ref.from,
103
- to = _ref.to;
104
- [from, to].forEach(function (pos) {
105
- var multiBodiedExtensionFrameRange = getMultiBodiedExtensionFrameRange(doc, pos);
106
- if (multiBodiedExtensionFrameRange) {
107
- affectedRanges.set("".concat(multiBodiedExtensionFrameRange.from, "-").concat(multiBodiedExtensionFrameRange.to), multiBodiedExtensionFrameRange);
108
- }
109
- });
110
- doc.nodesBetween(from, to, function (node, pos, parent) {
111
- if (isEmptyExtensionFrameInMultiBodiedExtension(node, parent)) {
112
- var multiBodiedExtensionFrameRange = {
113
- from: pos,
114
- to: pos + node.nodeSize
115
- };
116
- affectedRanges.set("".concat(multiBodiedExtensionFrameRange.from, "-").concat(multiBodiedExtensionFrameRange.to), multiBodiedExtensionFrameRange);
117
- return false;
118
- }
119
- return true;
120
- });
121
- });
122
- return Array.from(affectedRanges.values());
123
- };
124
-
125
- // Initial creation scans the full document once. Later updates use affected
126
- // ranges, and inactive tab frames stay hidden by the MBE renderer.
127
- function createMultiBodiedExtensionPlaceholderDecorations(editorState, intl) {
128
- if (!isMultiBodiedExtensionPlaceholderEnabled()) {
129
- return;
130
- }
131
- var decorations = [];
132
- editorState.doc.descendants(function (node, pos, parent) {
133
- if (isEmptyExtensionFrameInMultiBodiedExtension(node, parent)) {
134
- decorations.push(createMultiBodiedExtensionPlaceholderDecoration(pos, intl));
135
- return false;
136
- }
137
- return true;
138
- });
139
- return decorations.length > 0 ? _view.DecorationSet.create(editorState.doc, decorations) : _view.DecorationSet.empty;
140
- }
141
- function updateMultiBodiedExtensionPlaceholderDecorations(_ref2) {
142
- var currentDecorationSet = _ref2.currentDecorationSet,
143
- intl = _ref2.intl,
144
- newEditorState = _ref2.newEditorState,
145
- tr = _ref2.tr;
146
- if (!isMultiBodiedExtensionPlaceholderEnabled()) {
147
- return;
148
- }
149
- if (!currentDecorationSet) {
150
- return createMultiBodiedExtensionPlaceholderDecorations(newEditorState, intl);
151
- }
152
-
153
- // No document change means no empty/non-empty frame state change; remap
154
- // existing decorations only if ProseMirror reports positional mapping.
155
- if (!tr.docChanged) {
156
- return tr.mapping.maps.length > 0 ? currentDecorationSet.map(tr.mapping, newEditorState.doc) : currentDecorationSet;
157
- }
158
- var mappedDecorationSet = currentDecorationSet.map(tr.mapping, newEditorState.doc);
159
- var affectedRanges = getAffectedMultiBodiedExtensionFrameRanges(newEditorState.doc, getChangedRanges(tr));
160
- if (affectedRanges.length === 0) {
161
- return mappedDecorationSet;
162
- }
163
-
164
- // Remove placeholders in affected frames, then re-add only for frames that
165
- // still have the empty extensionFrame -> paragraph shape.
166
- var decorationsToRemove = affectedRanges.flatMap(function (_ref3) {
167
- var from = _ref3.from,
168
- to = _ref3.to;
169
- return mappedDecorationSet.find(from, to);
170
- });
171
- var decorationsToAdd = affectedRanges.flatMap(function (_ref4) {
172
- var from = _ref4.from;
173
- var node = newEditorState.doc.nodeAt(from);
174
- var parent = getMultiBodiedExtensionFrameParent(newEditorState.doc, from);
175
- return node && isEmptyExtensionFrameInMultiBodiedExtension(node, parent) ? [createMultiBodiedExtensionPlaceholderDecoration(from, intl)] : [];
176
- });
177
- return mappedDecorationSet.remove(decorationsToRemove).add(newEditorState.doc, decorationsToAdd);
178
- }
@@ -1,163 +0,0 @@
1
- import { placeholderTextMessages as messages } from '@atlaskit/editor-common/messages';
2
- import { Decoration, DecorationSet } from '@atlaskit/editor-prosemirror/view';
3
- import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
4
- import { nodeTypesWithMultiBodiedExtensionPlaceholderText, placeholderTestId } from './constants';
5
- const isMultiBodiedExtensionPlaceholderEnabled = () => expValEquals('confluence_native_tabs_experiment', 'isEnabled', true);
6
-
7
- // Empty MBE bodies are represented as extensionFrame -> empty paragraph.
8
- // The paragraph gives the cursor a valid textblock, but there is no authored content yet.
9
- const isEmptyExtensionFrame = node => {
10
- var _node$firstChild, _node$firstChild2;
11
- return nodeTypesWithMultiBodiedExtensionPlaceholderText.includes(node.type.name) && node.childCount === 1 && ((_node$firstChild = node.firstChild) === null || _node$firstChild === void 0 ? void 0 : _node$firstChild.content.size) === 0 && ((_node$firstChild2 = node.firstChild) === null || _node$firstChild2 === void 0 ? void 0 : _node$firstChild2.type.name) === 'paragraph';
12
- };
13
-
14
- // Keep this generic for any MBE extension by checking the node shape rather
15
- // than a product-specific extensionKey.
16
- const isExtensionFrameInMultiBodiedExtension = (node, parent) => nodeTypesWithMultiBodiedExtensionPlaceholderText.includes(node.type.name) && (parent === null || parent === void 0 ? void 0 : parent.type.name) === 'multiBodiedExtension';
17
- const isEmptyExtensionFrameInMultiBodiedExtension = (node, parent) => isExtensionFrameInMultiBodiedExtension(node, parent) && isEmptyExtensionFrame(node);
18
-
19
- // Widget decorations render UI without adding real content to the document.
20
- const createMultiBodiedExtensionPlaceholderElement = intl => {
21
- const placeholderDecoration = document.createElement('span');
22
- placeholderDecoration.setAttribute('data-testid', placeholderTestId);
23
- placeholderDecoration.className = 'placeholder-decoration';
24
- placeholderDecoration.setAttribute('aria-hidden', 'true');
25
- placeholderDecoration.textContent = intl.formatMessage(messages.multiBodiedExtensionPlaceholderText);
26
- return placeholderDecoration;
27
- };
28
-
29
- // `pos` is before extensionFrame; `pos + 2` is inside its paragraph, where
30
- // typing starts and where the placeholder should render.
31
- const createMultiBodiedExtensionPlaceholderDecoration = (pos, intl) => Decoration.widget(pos + 2, () => createMultiBodiedExtensionPlaceholderElement(intl), {
32
- side: 0,
33
- key: `multi-bodied-extension-placeholder-${pos}`
34
- });
35
- // Convert changed step ranges into final-document positions. A transaction can
36
- // contain multiple steps, and each step can shift positions for later steps.
37
- const getChangedRanges = tr => {
38
- const ranges = [];
39
- tr.mapping.maps.forEach((stepMap, index) => {
40
- stepMap.forEach((_oldStart, _oldEnd, newStart, newEnd) => {
41
- const mappingAfterStep = tr.mapping.slice(index + 1);
42
- ranges.push({
43
- from: mappingAfterStep.map(newStart, -1),
44
- to: mappingAfterStep.map(newEnd, 1)
45
- });
46
- });
47
- });
48
- return ranges;
49
- };
50
-
51
- // Walk from a changed position up to its containing MBE frame. The frame may no
52
- // longer be empty after the change, but we still need its range to remove stale decorations.
53
- const getMultiBodiedExtensionFrameRange = (doc, pos) => {
54
- const resolvedPos = doc.resolve(Math.max(0, Math.min(pos, doc.content.size)));
55
- for (let depth = resolvedPos.depth; depth > 0; depth--) {
56
- const node = resolvedPos.node(depth);
57
- const parent = depth > 0 ? resolvedPos.node(depth - 1) : undefined;
58
- if (isExtensionFrameInMultiBodiedExtension(node, parent)) {
59
- return {
60
- from: resolvedPos.before(depth),
61
- to: resolvedPos.after(depth)
62
- };
63
- }
64
- }
65
- return;
66
- };
67
-
68
- // Resolve just inside a frame to recover its parent; `doc.nodeAt(framePos)` only
69
- // gives the frame node itself.
70
- const getMultiBodiedExtensionFrameParent = (doc, framePos) => {
71
- const resolvedPos = doc.resolve(Math.max(0, Math.min(framePos + 1, doc.content.size)));
72
- for (let depth = resolvedPos.depth; depth > 0; depth--) {
73
- if (resolvedPos.before(depth) === framePos) {
74
- return resolvedPos.node(depth - 1);
75
- }
76
- }
77
- return;
78
- };
79
-
80
- // Only update MBE frames touched by this transaction: either the change happened
81
- // inside a frame, or the transaction inserted/replaced an empty frame.
82
- const getAffectedMultiBodiedExtensionFrameRanges = (doc, ranges) => {
83
- const affectedRanges = new Map();
84
- ranges.forEach(({
85
- from,
86
- to
87
- }) => {
88
- [from, to].forEach(pos => {
89
- const multiBodiedExtensionFrameRange = getMultiBodiedExtensionFrameRange(doc, pos);
90
- if (multiBodiedExtensionFrameRange) {
91
- affectedRanges.set(`${multiBodiedExtensionFrameRange.from}-${multiBodiedExtensionFrameRange.to}`, multiBodiedExtensionFrameRange);
92
- }
93
- });
94
- doc.nodesBetween(from, to, (node, pos, parent) => {
95
- if (isEmptyExtensionFrameInMultiBodiedExtension(node, parent)) {
96
- const multiBodiedExtensionFrameRange = {
97
- from: pos,
98
- to: pos + node.nodeSize
99
- };
100
- affectedRanges.set(`${multiBodiedExtensionFrameRange.from}-${multiBodiedExtensionFrameRange.to}`, multiBodiedExtensionFrameRange);
101
- return false;
102
- }
103
- return true;
104
- });
105
- });
106
- return Array.from(affectedRanges.values());
107
- };
108
-
109
- // Initial creation scans the full document once. Later updates use affected
110
- // ranges, and inactive tab frames stay hidden by the MBE renderer.
111
- export function createMultiBodiedExtensionPlaceholderDecorations(editorState, intl) {
112
- if (!isMultiBodiedExtensionPlaceholderEnabled()) {
113
- return;
114
- }
115
- const decorations = [];
116
- editorState.doc.descendants((node, pos, parent) => {
117
- if (isEmptyExtensionFrameInMultiBodiedExtension(node, parent)) {
118
- decorations.push(createMultiBodiedExtensionPlaceholderDecoration(pos, intl));
119
- return false;
120
- }
121
- return true;
122
- });
123
- return decorations.length > 0 ? DecorationSet.create(editorState.doc, decorations) : DecorationSet.empty;
124
- }
125
- export function updateMultiBodiedExtensionPlaceholderDecorations({
126
- currentDecorationSet,
127
- intl,
128
- newEditorState,
129
- tr
130
- }) {
131
- if (!isMultiBodiedExtensionPlaceholderEnabled()) {
132
- return;
133
- }
134
- if (!currentDecorationSet) {
135
- return createMultiBodiedExtensionPlaceholderDecorations(newEditorState, intl);
136
- }
137
-
138
- // No document change means no empty/non-empty frame state change; remap
139
- // existing decorations only if ProseMirror reports positional mapping.
140
- if (!tr.docChanged) {
141
- return tr.mapping.maps.length > 0 ? currentDecorationSet.map(tr.mapping, newEditorState.doc) : currentDecorationSet;
142
- }
143
- const mappedDecorationSet = currentDecorationSet.map(tr.mapping, newEditorState.doc);
144
- const affectedRanges = getAffectedMultiBodiedExtensionFrameRanges(newEditorState.doc, getChangedRanges(tr));
145
- if (affectedRanges.length === 0) {
146
- return mappedDecorationSet;
147
- }
148
-
149
- // Remove placeholders in affected frames, then re-add only for frames that
150
- // still have the empty extensionFrame -> paragraph shape.
151
- const decorationsToRemove = affectedRanges.flatMap(({
152
- from,
153
- to
154
- }) => mappedDecorationSet.find(from, to));
155
- const decorationsToAdd = affectedRanges.flatMap(({
156
- from
157
- }) => {
158
- const node = newEditorState.doc.nodeAt(from);
159
- const parent = getMultiBodiedExtensionFrameParent(newEditorState.doc, from);
160
- return node && isEmptyExtensionFrameInMultiBodiedExtension(node, parent) ? [createMultiBodiedExtensionPlaceholderDecoration(from, intl)] : [];
161
- });
162
- return mappedDecorationSet.remove(decorationsToRemove).add(newEditorState.doc, decorationsToAdd);
163
- }
@@ -1,171 +0,0 @@
1
- import { placeholderTextMessages as messages } from '@atlaskit/editor-common/messages';
2
- import { Decoration, DecorationSet } from '@atlaskit/editor-prosemirror/view';
3
- import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
4
- import { nodeTypesWithMultiBodiedExtensionPlaceholderText, placeholderTestId } from './constants';
5
- var isMultiBodiedExtensionPlaceholderEnabled = function isMultiBodiedExtensionPlaceholderEnabled() {
6
- return expValEquals('confluence_native_tabs_experiment', 'isEnabled', true);
7
- };
8
-
9
- // Empty MBE bodies are represented as extensionFrame -> empty paragraph.
10
- // The paragraph gives the cursor a valid textblock, but there is no authored content yet.
11
- var isEmptyExtensionFrame = function isEmptyExtensionFrame(node) {
12
- var _node$firstChild, _node$firstChild2;
13
- return nodeTypesWithMultiBodiedExtensionPlaceholderText.includes(node.type.name) && node.childCount === 1 && ((_node$firstChild = node.firstChild) === null || _node$firstChild === void 0 ? void 0 : _node$firstChild.content.size) === 0 && ((_node$firstChild2 = node.firstChild) === null || _node$firstChild2 === void 0 ? void 0 : _node$firstChild2.type.name) === 'paragraph';
14
- };
15
-
16
- // Keep this generic for any MBE extension by checking the node shape rather
17
- // than a product-specific extensionKey.
18
- var isExtensionFrameInMultiBodiedExtension = function isExtensionFrameInMultiBodiedExtension(node, parent) {
19
- return nodeTypesWithMultiBodiedExtensionPlaceholderText.includes(node.type.name) && (parent === null || parent === void 0 ? void 0 : parent.type.name) === 'multiBodiedExtension';
20
- };
21
- var isEmptyExtensionFrameInMultiBodiedExtension = function isEmptyExtensionFrameInMultiBodiedExtension(node, parent) {
22
- return isExtensionFrameInMultiBodiedExtension(node, parent) && isEmptyExtensionFrame(node);
23
- };
24
-
25
- // Widget decorations render UI without adding real content to the document.
26
- var createMultiBodiedExtensionPlaceholderElement = function createMultiBodiedExtensionPlaceholderElement(intl) {
27
- var placeholderDecoration = document.createElement('span');
28
- placeholderDecoration.setAttribute('data-testid', placeholderTestId);
29
- placeholderDecoration.className = 'placeholder-decoration';
30
- placeholderDecoration.setAttribute('aria-hidden', 'true');
31
- placeholderDecoration.textContent = intl.formatMessage(messages.multiBodiedExtensionPlaceholderText);
32
- return placeholderDecoration;
33
- };
34
-
35
- // `pos` is before extensionFrame; `pos + 2` is inside its paragraph, where
36
- // typing starts and where the placeholder should render.
37
- var createMultiBodiedExtensionPlaceholderDecoration = function createMultiBodiedExtensionPlaceholderDecoration(pos, intl) {
38
- return Decoration.widget(pos + 2, function () {
39
- return createMultiBodiedExtensionPlaceholderElement(intl);
40
- }, {
41
- side: 0,
42
- key: "multi-bodied-extension-placeholder-".concat(pos)
43
- });
44
- };
45
- // Convert changed step ranges into final-document positions. A transaction can
46
- // contain multiple steps, and each step can shift positions for later steps.
47
- var getChangedRanges = function getChangedRanges(tr) {
48
- var ranges = [];
49
- tr.mapping.maps.forEach(function (stepMap, index) {
50
- stepMap.forEach(function (_oldStart, _oldEnd, newStart, newEnd) {
51
- var mappingAfterStep = tr.mapping.slice(index + 1);
52
- ranges.push({
53
- from: mappingAfterStep.map(newStart, -1),
54
- to: mappingAfterStep.map(newEnd, 1)
55
- });
56
- });
57
- });
58
- return ranges;
59
- };
60
-
61
- // Walk from a changed position up to its containing MBE frame. The frame may no
62
- // longer be empty after the change, but we still need its range to remove stale decorations.
63
- var getMultiBodiedExtensionFrameRange = function getMultiBodiedExtensionFrameRange(doc, pos) {
64
- var resolvedPos = doc.resolve(Math.max(0, Math.min(pos, doc.content.size)));
65
- for (var depth = resolvedPos.depth; depth > 0; depth--) {
66
- var node = resolvedPos.node(depth);
67
- var parent = depth > 0 ? resolvedPos.node(depth - 1) : undefined;
68
- if (isExtensionFrameInMultiBodiedExtension(node, parent)) {
69
- return {
70
- from: resolvedPos.before(depth),
71
- to: resolvedPos.after(depth)
72
- };
73
- }
74
- }
75
- return;
76
- };
77
-
78
- // Resolve just inside a frame to recover its parent; `doc.nodeAt(framePos)` only
79
- // gives the frame node itself.
80
- var getMultiBodiedExtensionFrameParent = function getMultiBodiedExtensionFrameParent(doc, framePos) {
81
- var resolvedPos = doc.resolve(Math.max(0, Math.min(framePos + 1, doc.content.size)));
82
- for (var depth = resolvedPos.depth; depth > 0; depth--) {
83
- if (resolvedPos.before(depth) === framePos) {
84
- return resolvedPos.node(depth - 1);
85
- }
86
- }
87
- return;
88
- };
89
-
90
- // Only update MBE frames touched by this transaction: either the change happened
91
- // inside a frame, or the transaction inserted/replaced an empty frame.
92
- var getAffectedMultiBodiedExtensionFrameRanges = function getAffectedMultiBodiedExtensionFrameRanges(doc, ranges) {
93
- var affectedRanges = new Map();
94
- ranges.forEach(function (_ref) {
95
- var from = _ref.from,
96
- to = _ref.to;
97
- [from, to].forEach(function (pos) {
98
- var multiBodiedExtensionFrameRange = getMultiBodiedExtensionFrameRange(doc, pos);
99
- if (multiBodiedExtensionFrameRange) {
100
- affectedRanges.set("".concat(multiBodiedExtensionFrameRange.from, "-").concat(multiBodiedExtensionFrameRange.to), multiBodiedExtensionFrameRange);
101
- }
102
- });
103
- doc.nodesBetween(from, to, function (node, pos, parent) {
104
- if (isEmptyExtensionFrameInMultiBodiedExtension(node, parent)) {
105
- var multiBodiedExtensionFrameRange = {
106
- from: pos,
107
- to: pos + node.nodeSize
108
- };
109
- affectedRanges.set("".concat(multiBodiedExtensionFrameRange.from, "-").concat(multiBodiedExtensionFrameRange.to), multiBodiedExtensionFrameRange);
110
- return false;
111
- }
112
- return true;
113
- });
114
- });
115
- return Array.from(affectedRanges.values());
116
- };
117
-
118
- // Initial creation scans the full document once. Later updates use affected
119
- // ranges, and inactive tab frames stay hidden by the MBE renderer.
120
- export function createMultiBodiedExtensionPlaceholderDecorations(editorState, intl) {
121
- if (!isMultiBodiedExtensionPlaceholderEnabled()) {
122
- return;
123
- }
124
- var decorations = [];
125
- editorState.doc.descendants(function (node, pos, parent) {
126
- if (isEmptyExtensionFrameInMultiBodiedExtension(node, parent)) {
127
- decorations.push(createMultiBodiedExtensionPlaceholderDecoration(pos, intl));
128
- return false;
129
- }
130
- return true;
131
- });
132
- return decorations.length > 0 ? DecorationSet.create(editorState.doc, decorations) : DecorationSet.empty;
133
- }
134
- export function updateMultiBodiedExtensionPlaceholderDecorations(_ref2) {
135
- var currentDecorationSet = _ref2.currentDecorationSet,
136
- intl = _ref2.intl,
137
- newEditorState = _ref2.newEditorState,
138
- tr = _ref2.tr;
139
- if (!isMultiBodiedExtensionPlaceholderEnabled()) {
140
- return;
141
- }
142
- if (!currentDecorationSet) {
143
- return createMultiBodiedExtensionPlaceholderDecorations(newEditorState, intl);
144
- }
145
-
146
- // No document change means no empty/non-empty frame state change; remap
147
- // existing decorations only if ProseMirror reports positional mapping.
148
- if (!tr.docChanged) {
149
- return tr.mapping.maps.length > 0 ? currentDecorationSet.map(tr.mapping, newEditorState.doc) : currentDecorationSet;
150
- }
151
- var mappedDecorationSet = currentDecorationSet.map(tr.mapping, newEditorState.doc);
152
- var affectedRanges = getAffectedMultiBodiedExtensionFrameRanges(newEditorState.doc, getChangedRanges(tr));
153
- if (affectedRanges.length === 0) {
154
- return mappedDecorationSet;
155
- }
156
-
157
- // Remove placeholders in affected frames, then re-add only for frames that
158
- // still have the empty extensionFrame -> paragraph shape.
159
- var decorationsToRemove = affectedRanges.flatMap(function (_ref3) {
160
- var from = _ref3.from,
161
- to = _ref3.to;
162
- return mappedDecorationSet.find(from, to);
163
- });
164
- var decorationsToAdd = affectedRanges.flatMap(function (_ref4) {
165
- var from = _ref4.from;
166
- var node = newEditorState.doc.nodeAt(from);
167
- var parent = getMultiBodiedExtensionFrameParent(newEditorState.doc, from);
168
- return node && isEmptyExtensionFrameInMultiBodiedExtension(node, parent) ? [createMultiBodiedExtensionPlaceholderDecoration(from, intl)] : [];
169
- });
170
- return mappedDecorationSet.remove(decorationsToRemove).add(newEditorState.doc, decorationsToAdd);
171
- }
@@ -1,16 +0,0 @@
1
- import type { IntlShape } from 'react-intl';
2
- import type { EditorState } from '@atlaskit/editor-prosemirror/state';
3
- import type { Mapping } from '@atlaskit/editor-prosemirror/transform';
4
- import { DecorationSet } from '@atlaskit/editor-prosemirror/view';
5
- type MultiBodiedExtensionPlaceholderTransaction = {
6
- docChanged: boolean;
7
- mapping: Mapping;
8
- };
9
- export declare function createMultiBodiedExtensionPlaceholderDecorations(editorState: EditorState, intl: IntlShape): DecorationSet | undefined;
10
- export declare function updateMultiBodiedExtensionPlaceholderDecorations({ currentDecorationSet, intl, newEditorState, tr, }: {
11
- currentDecorationSet?: DecorationSet;
12
- intl: IntlShape;
13
- newEditorState: EditorState;
14
- tr: MultiBodiedExtensionPlaceholderTransaction;
15
- }): DecorationSet | undefined;
16
- export {};