@atlaskit/editor-core 188.7.6 → 188.9.0
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 +23 -0
- package/dist/cjs/composable-editor/editor-internal.js +2 -2
- package/dist/cjs/create-editor/ReactEditorView.js +796 -8
- package/dist/cjs/labs/next/presets/universal.js +7 -4
- package/dist/cjs/plugins/index.js +0 -21
- package/dist/cjs/plugins/type-ahead/index.js +4 -372
- package/dist/cjs/plugins/type-ahead/plugin.js +382 -0
- package/dist/cjs/plugins/view-update-subscription/subscribe/toolbarAndPickerUpdates.js +17 -8
- package/dist/cjs/version-wrapper.js +1 -1
- package/dist/es2019/composable-editor/editor-internal.js +1 -1
- package/dist/es2019/create-editor/ReactEditorView.js +753 -2
- package/dist/es2019/labs/next/presets/universal.js +4 -1
- package/dist/es2019/plugins/index.js +0 -3
- package/dist/es2019/plugins/type-ahead/index.js +2 -375
- package/dist/es2019/plugins/type-ahead/plugin.js +381 -0
- package/dist/es2019/plugins/view-update-subscription/subscribe/toolbarAndPickerUpdates.js +17 -8
- package/dist/es2019/version-wrapper.js +1 -1
- package/dist/esm/composable-editor/editor-internal.js +1 -1
- package/dist/esm/create-editor/ReactEditorView.js +797 -8
- package/dist/esm/labs/next/presets/universal.js +4 -1
- package/dist/esm/plugins/index.js +0 -3
- package/dist/esm/plugins/type-ahead/index.js +2 -368
- package/dist/esm/plugins/type-ahead/plugin.js +374 -0
- package/dist/esm/plugins/view-update-subscription/subscribe/toolbarAndPickerUpdates.js +17 -8
- package/dist/esm/version-wrapper.js +1 -1
- package/dist/types/create-editor/ReactEditorView.d.ts +119 -5
- package/dist/types/labs/next/presets/default.d.ts +30 -12
- package/dist/types/plugins/index.d.ts +0 -3
- package/dist/types/plugins/insert-block/types.d.ts +1 -1
- package/dist/types/plugins/type-ahead/index.d.ts +3 -14
- package/dist/types/plugins/type-ahead/plugin.d.ts +10 -0
- package/dist/types/plugins/type-ahead/types.d.ts +51 -6
- package/dist/types/plugins/view-update-subscription/subscribe/toolbarAndPickerUpdates.d.ts +1 -1
- package/dist/types-ts4.5/create-editor/ReactEditorView.d.ts +119 -5
- package/dist/types-ts4.5/labs/next/presets/default.d.ts +30 -12
- package/dist/types-ts4.5/plugins/index.d.ts +0 -3
- package/dist/types-ts4.5/plugins/insert-block/types.d.ts +1 -1
- package/dist/types-ts4.5/plugins/type-ahead/index.d.ts +3 -14
- package/dist/types-ts4.5/plugins/type-ahead/plugin.d.ts +10 -0
- package/dist/types-ts4.5/plugins/type-ahead/types.d.ts +53 -6
- package/dist/types-ts4.5/plugins/view-update-subscription/subscribe/toolbarAndPickerUpdates.d.ts +1 -1
- package/package.json +6 -4
- package/dist/cjs/create-editor/ReactEditorViewInternal.js +0 -812
- package/dist/cjs/create-editor/ReactEditorViewNext.js +0 -15
- package/dist/cjs/plugins/save-on-enter/index.js +0 -70
- package/dist/cjs/plugins/scroll-into-view/index.js +0 -55
- package/dist/cjs/plugins/status/actions.js +0 -158
- package/dist/cjs/plugins/status/analytics.js +0 -31
- package/dist/cjs/plugins/status/index.js +0 -143
- package/dist/cjs/plugins/status/keymap.js +0 -22
- package/dist/cjs/plugins/status/nodeviews/status.js +0 -58
- package/dist/cjs/plugins/status/plugin-key.js +0 -9
- package/dist/cjs/plugins/status/plugin.js +0 -133
- package/dist/cjs/plugins/status/types.js +0 -5
- package/dist/cjs/plugins/status/ui/statusPicker.js +0 -314
- package/dist/cjs/plugins/status/utils.js +0 -22
- package/dist/cjs/plugins/view-update-subscription/subscribe/type-ahead-updates.js +0 -33
- package/dist/es2019/create-editor/ReactEditorViewInternal.js +0 -753
- package/dist/es2019/create-editor/ReactEditorViewNext.js +0 -7
- package/dist/es2019/plugins/save-on-enter/index.js +0 -63
- package/dist/es2019/plugins/scroll-into-view/index.js +0 -44
- package/dist/es2019/plugins/status/actions.js +0 -144
- package/dist/es2019/plugins/status/analytics.js +0 -18
- package/dist/es2019/plugins/status/index.js +0 -135
- package/dist/es2019/plugins/status/keymap.js +0 -13
- package/dist/es2019/plugins/status/nodeviews/status.js +0 -60
- package/dist/es2019/plugins/status/plugin-key.js +0 -3
- package/dist/es2019/plugins/status/plugin.js +0 -113
- package/dist/es2019/plugins/status/types.js +0 -1
- package/dist/es2019/plugins/status/ui/statusPicker.js +0 -293
- package/dist/es2019/plugins/status/utils.js +0 -12
- package/dist/es2019/plugins/view-update-subscription/subscribe/type-ahead-updates.js +0 -28
- package/dist/esm/create-editor/ReactEditorViewInternal.js +0 -806
- package/dist/esm/create-editor/ReactEditorViewNext.js +0 -7
- package/dist/esm/plugins/save-on-enter/index.js +0 -63
- package/dist/esm/plugins/scroll-into-view/index.js +0 -50
- package/dist/esm/plugins/status/actions.js +0 -151
- package/dist/esm/plugins/status/analytics.js +0 -24
- package/dist/esm/plugins/status/index.js +0 -136
- package/dist/esm/plugins/status/keymap.js +0 -15
- package/dist/esm/plugins/status/nodeviews/status.js +0 -51
- package/dist/esm/plugins/status/plugin-key.js +0 -3
- package/dist/esm/plugins/status/plugin.js +0 -115
- package/dist/esm/plugins/status/types.js +0 -1
- package/dist/esm/plugins/status/ui/statusPicker.js +0 -308
- package/dist/esm/plugins/status/utils.js +0 -16
- package/dist/esm/plugins/view-update-subscription/subscribe/type-ahead-updates.js +0 -27
- package/dist/types/create-editor/ReactEditorViewInternal.d.ts +0 -119
- package/dist/types/create-editor/ReactEditorViewNext.d.ts +0 -8
- package/dist/types/plugins/save-on-enter/index.d.ts +0 -10
- package/dist/types/plugins/scroll-into-view/index.d.ts +0 -14
- package/dist/types/plugins/status/actions.d.ts +0 -16
- package/dist/types/plugins/status/analytics.d.ts +0 -4
- package/dist/types/plugins/status/index.d.ts +0 -15
- package/dist/types/plugins/status/keymap.d.ts +0 -3
- package/dist/types/plugins/status/nodeviews/status.d.ts +0 -25
- package/dist/types/plugins/status/plugin-key.d.ts +0 -4
- package/dist/types/plugins/status/plugin.d.ts +0 -7
- package/dist/types/plugins/status/types.d.ts +0 -18
- package/dist/types/plugins/status/ui/statusPicker.d.ts +0 -63
- package/dist/types/plugins/status/utils.d.ts +0 -5
- package/dist/types/plugins/view-update-subscription/subscribe/type-ahead-updates.d.ts +0 -9
- package/dist/types-ts4.5/create-editor/ReactEditorViewInternal.d.ts +0 -119
- package/dist/types-ts4.5/create-editor/ReactEditorViewNext.d.ts +0 -8
- package/dist/types-ts4.5/plugins/save-on-enter/index.d.ts +0 -10
- package/dist/types-ts4.5/plugins/scroll-into-view/index.d.ts +0 -14
- package/dist/types-ts4.5/plugins/status/actions.d.ts +0 -16
- package/dist/types-ts4.5/plugins/status/analytics.d.ts +0 -4
- package/dist/types-ts4.5/plugins/status/index.d.ts +0 -17
- package/dist/types-ts4.5/plugins/status/keymap.d.ts +0 -3
- package/dist/types-ts4.5/plugins/status/nodeviews/status.d.ts +0 -25
- package/dist/types-ts4.5/plugins/status/plugin-key.d.ts +0 -4
- package/dist/types-ts4.5/plugins/status/plugin.d.ts +0 -7
- package/dist/types-ts4.5/plugins/status/types.d.ts +0 -18
- package/dist/types-ts4.5/plugins/status/ui/statusPicker.d.ts +0 -63
- package/dist/types-ts4.5/plugins/status/utils.d.ts +0 -5
- package/dist/types-ts4.5/plugins/view-update-subscription/subscribe/type-ahead-updates.d.ts +0 -9
|
@@ -0,0 +1,374 @@
|
|
|
1
|
+
import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
|
|
2
|
+
/**
|
|
3
|
+
*
|
|
4
|
+
* Revamped typeahead using decorations instead of the `typeAheadQuery` mark
|
|
5
|
+
*
|
|
6
|
+
* https://product-fabric.atlassian.net/wiki/spaces/E/pages/2992177582/Technical+TypeAhead+Data+Flow
|
|
7
|
+
*
|
|
8
|
+
*
|
|
9
|
+
*/
|
|
10
|
+
import React from 'react';
|
|
11
|
+
import { typeAheadQuery } from '@atlaskit/adf-schema';
|
|
12
|
+
import { ACTION, ACTION_SUBJECT, EVENT_TYPE, fireAnalyticsEvent, INPUT_METHOD } from '@atlaskit/editor-common/analytics';
|
|
13
|
+
import { SafePlugin } from '@atlaskit/editor-common/safe-plugin';
|
|
14
|
+
import { SelectItemMode } from '@atlaskit/editor-common/type-ahead';
|
|
15
|
+
import { WithPluginState } from '@atlaskit/editor-common/with-plugin-state';
|
|
16
|
+
import { insertTypeAheadItem } from './commands/insert-type-ahead-item';
|
|
17
|
+
import { updateSelectedIndex } from './commands/update-selected-index';
|
|
18
|
+
import { inputRulePlugin } from './pm-plugins/input-rules';
|
|
19
|
+
import { createPlugin as createInsertItemPlugin } from './pm-plugins/insert-item-plugin';
|
|
20
|
+
import { pluginKey as typeAheadPluginKey } from './pm-plugins/key';
|
|
21
|
+
import { createPlugin } from './pm-plugins/main';
|
|
22
|
+
import { StatsModifier } from './stats-modifier';
|
|
23
|
+
import { closeTypeAhead } from './transforms/close-type-ahead';
|
|
24
|
+
import { openTypeAheadAtCursor } from './transforms/open-typeahead-at-cursor';
|
|
25
|
+
import { useItemInsert } from './ui/hooks/use-item-insert';
|
|
26
|
+
import { TypeAheadPopup } from './ui/TypeAheadPopup';
|
|
27
|
+
import { findHandler, getPluginState, getTypeAheadHandler, getTypeAheadQuery, isTypeAheadAllowed, isTypeAheadOpen } from './utils';
|
|
28
|
+
var TypeAheadMenu = /*#__PURE__*/React.memo(function (_ref) {
|
|
29
|
+
var _popupMountRef$curren, _popupMountRef$curren2, _popupMountRef$curren3;
|
|
30
|
+
var editorView = _ref.editorView,
|
|
31
|
+
popupMountRef = _ref.popupMountRef,
|
|
32
|
+
typeAheadState = _ref.typeAheadState,
|
|
33
|
+
fireAnalyticsCallback = _ref.fireAnalyticsCallback;
|
|
34
|
+
var isOpen = typeAheadState.decorationSet.find().length > 0;
|
|
35
|
+
var triggerHandler = typeAheadState.triggerHandler,
|
|
36
|
+
items = typeAheadState.items,
|
|
37
|
+
selectedIndex = typeAheadState.selectedIndex,
|
|
38
|
+
decorationElement = typeAheadState.decorationElement,
|
|
39
|
+
decorationSet = typeAheadState.decorationSet,
|
|
40
|
+
query = typeAheadState.query;
|
|
41
|
+
var _useItemInsert = useItemInsert(triggerHandler, editorView, items),
|
|
42
|
+
_useItemInsert2 = _slicedToArray(_useItemInsert, 3),
|
|
43
|
+
onItemInsert = _useItemInsert2[0],
|
|
44
|
+
onTextInsert = _useItemInsert2[1],
|
|
45
|
+
onItemMatch = _useItemInsert2[2];
|
|
46
|
+
var setSelectedItem = React.useCallback(function (_ref2) {
|
|
47
|
+
var nextIndex = _ref2.index;
|
|
48
|
+
queueMicrotask(function () {
|
|
49
|
+
updateSelectedIndex(nextIndex)(editorView.state, editorView.dispatch);
|
|
50
|
+
});
|
|
51
|
+
}, [editorView]);
|
|
52
|
+
var insertItem = React.useCallback(function () {
|
|
53
|
+
var mode = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : SelectItemMode.SELECTED;
|
|
54
|
+
var index = arguments.length > 1 ? arguments[1] : undefined;
|
|
55
|
+
queueMicrotask(function () {
|
|
56
|
+
onItemInsert({
|
|
57
|
+
mode: mode,
|
|
58
|
+
index: index,
|
|
59
|
+
query: query
|
|
60
|
+
});
|
|
61
|
+
});
|
|
62
|
+
}, [onItemInsert, query]);
|
|
63
|
+
var cancel = React.useCallback(function (_ref3) {
|
|
64
|
+
var setSelectionAt = _ref3.setSelectionAt,
|
|
65
|
+
addPrefixTrigger = _ref3.addPrefixTrigger,
|
|
66
|
+
forceFocusOnEditor = _ref3.forceFocusOnEditor;
|
|
67
|
+
var fullQuery = addPrefixTrigger ? "".concat(triggerHandler === null || triggerHandler === void 0 ? void 0 : triggerHandler.trigger).concat(query) : query;
|
|
68
|
+
onTextInsert({
|
|
69
|
+
forceFocusOnEditor: forceFocusOnEditor,
|
|
70
|
+
setSelectionAt: setSelectionAt,
|
|
71
|
+
text: fullQuery
|
|
72
|
+
});
|
|
73
|
+
}, [triggerHandler, onTextInsert, query]);
|
|
74
|
+
React.useEffect(function () {
|
|
75
|
+
if (!isOpen || !query) {
|
|
76
|
+
return;
|
|
77
|
+
}
|
|
78
|
+
var isLastCharSpace = query[query.length - 1] === ' ';
|
|
79
|
+
if (!isLastCharSpace) {
|
|
80
|
+
return;
|
|
81
|
+
}
|
|
82
|
+
var result = onItemMatch({
|
|
83
|
+
mode: SelectItemMode.SPACE,
|
|
84
|
+
query: query.trim()
|
|
85
|
+
});
|
|
86
|
+
if (!result) {
|
|
87
|
+
return;
|
|
88
|
+
}
|
|
89
|
+
}, [isOpen, query, onItemMatch]);
|
|
90
|
+
if (!isOpen || !triggerHandler || !(decorationElement instanceof HTMLElement) || items.length === 0) {
|
|
91
|
+
return null;
|
|
92
|
+
}
|
|
93
|
+
return /*#__PURE__*/React.createElement(TypeAheadPopup, {
|
|
94
|
+
editorView: editorView,
|
|
95
|
+
popupsMountPoint: (_popupMountRef$curren = popupMountRef.current) === null || _popupMountRef$curren === void 0 ? void 0 : _popupMountRef$curren.popupsMountPoint,
|
|
96
|
+
popupsBoundariesElement: (_popupMountRef$curren2 = popupMountRef.current) === null || _popupMountRef$curren2 === void 0 ? void 0 : _popupMountRef$curren2.popupsBoundariesElement,
|
|
97
|
+
popupsScrollableElement: (_popupMountRef$curren3 = popupMountRef.current) === null || _popupMountRef$curren3 === void 0 ? void 0 : _popupMountRef$curren3.popupsScrollableElement,
|
|
98
|
+
anchorElement: decorationElement,
|
|
99
|
+
triggerHandler: triggerHandler,
|
|
100
|
+
fireAnalyticsCallback: fireAnalyticsCallback,
|
|
101
|
+
items: items,
|
|
102
|
+
selectedIndex: selectedIndex,
|
|
103
|
+
setSelectedItem: setSelectedItem,
|
|
104
|
+
onItemInsert: insertItem,
|
|
105
|
+
decorationSet: decorationSet,
|
|
106
|
+
isEmptyQuery: !query,
|
|
107
|
+
cancel: cancel
|
|
108
|
+
});
|
|
109
|
+
});
|
|
110
|
+
var createOpenAtTransaction = function createOpenAtTransaction(editorAnalyticsAPI) {
|
|
111
|
+
return function (props) {
|
|
112
|
+
return function (tr) {
|
|
113
|
+
var triggerHandler = props.triggerHandler,
|
|
114
|
+
inputMethod = props.inputMethod;
|
|
115
|
+
openTypeAheadAtCursor({
|
|
116
|
+
triggerHandler: triggerHandler,
|
|
117
|
+
inputMethod: inputMethod
|
|
118
|
+
})({
|
|
119
|
+
tr: tr
|
|
120
|
+
});
|
|
121
|
+
editorAnalyticsAPI === null || editorAnalyticsAPI === void 0 || editorAnalyticsAPI.attachAnalyticsEvent({
|
|
122
|
+
action: ACTION.INVOKED,
|
|
123
|
+
actionSubject: ACTION_SUBJECT.TYPEAHEAD,
|
|
124
|
+
actionSubjectId: triggerHandler.id,
|
|
125
|
+
attributes: {
|
|
126
|
+
inputMethod: inputMethod
|
|
127
|
+
},
|
|
128
|
+
eventType: EVENT_TYPE.UI
|
|
129
|
+
})(tr);
|
|
130
|
+
return true;
|
|
131
|
+
};
|
|
132
|
+
};
|
|
133
|
+
};
|
|
134
|
+
var createOpenTypeAhead = function createOpenTypeAhead(editorViewRef, editorAnalyticsAPI) {
|
|
135
|
+
return function (props) {
|
|
136
|
+
if (!editorViewRef.current) {
|
|
137
|
+
return false;
|
|
138
|
+
}
|
|
139
|
+
var view = editorViewRef.current;
|
|
140
|
+
var tr = view.state.tr;
|
|
141
|
+
createOpenAtTransaction(editorAnalyticsAPI)(props)(tr);
|
|
142
|
+
view.dispatch(tr);
|
|
143
|
+
return true;
|
|
144
|
+
};
|
|
145
|
+
};
|
|
146
|
+
var createInsertTypeAheadItem = function createInsertTypeAheadItem(editorViewRef) {
|
|
147
|
+
return function (props) {
|
|
148
|
+
if (!editorViewRef.current) {
|
|
149
|
+
return false;
|
|
150
|
+
}
|
|
151
|
+
var view = editorViewRef.current;
|
|
152
|
+
var triggerHandler = props.triggerHandler,
|
|
153
|
+
contentItem = props.contentItem,
|
|
154
|
+
query = props.query,
|
|
155
|
+
sourceListItem = props.sourceListItem,
|
|
156
|
+
mode = props.mode;
|
|
157
|
+
insertTypeAheadItem(view)({
|
|
158
|
+
handler: triggerHandler,
|
|
159
|
+
item: contentItem,
|
|
160
|
+
mode: mode || SelectItemMode.SELECTED,
|
|
161
|
+
query: query,
|
|
162
|
+
sourceListItem: sourceListItem
|
|
163
|
+
});
|
|
164
|
+
return true;
|
|
165
|
+
};
|
|
166
|
+
};
|
|
167
|
+
var createFindHandlerByTrigger = function createFindHandlerByTrigger(editorViewRef) {
|
|
168
|
+
return function (trigger) {
|
|
169
|
+
if (!editorViewRef.current) {
|
|
170
|
+
return null;
|
|
171
|
+
}
|
|
172
|
+
var view = editorViewRef.current;
|
|
173
|
+
return findHandler(trigger, view.state);
|
|
174
|
+
};
|
|
175
|
+
};
|
|
176
|
+
var createCloseTypeAhead = function createCloseTypeAhead(editorViewRef) {
|
|
177
|
+
return function (options) {
|
|
178
|
+
if (!editorViewRef.current) {
|
|
179
|
+
return false;
|
|
180
|
+
}
|
|
181
|
+
var view = editorViewRef.current;
|
|
182
|
+
var currentQuery = getTypeAheadQuery(view.state) || '';
|
|
183
|
+
var state = view.state;
|
|
184
|
+
var tr = state.tr;
|
|
185
|
+
if (options.attachCommand) {
|
|
186
|
+
var fakeDispatch = function fakeDispatch(customTr) {
|
|
187
|
+
tr = customTr;
|
|
188
|
+
};
|
|
189
|
+
options.attachCommand(state, fakeDispatch);
|
|
190
|
+
}
|
|
191
|
+
closeTypeAhead(tr);
|
|
192
|
+
if (options.insertCurrentQueryAsRawText && currentQuery && currentQuery.length > 0) {
|
|
193
|
+
var handler = getTypeAheadHandler(state);
|
|
194
|
+
if (!handler) {
|
|
195
|
+
return false;
|
|
196
|
+
}
|
|
197
|
+
var text = handler.trigger.concat(currentQuery);
|
|
198
|
+
tr.replaceSelectionWith(state.schema.text(text));
|
|
199
|
+
}
|
|
200
|
+
view.dispatch(tr);
|
|
201
|
+
if (!view.hasFocus()) {
|
|
202
|
+
view.focus();
|
|
203
|
+
}
|
|
204
|
+
return true;
|
|
205
|
+
};
|
|
206
|
+
};
|
|
207
|
+
|
|
208
|
+
/**
|
|
209
|
+
*
|
|
210
|
+
* Revamped typeahead using decorations instead of the `typeAheadQuery` mark
|
|
211
|
+
*
|
|
212
|
+
* https://product-fabric.atlassian.net/wiki/spaces/E/pages/2992177582/Technical+TypeAhead+Data+Flow
|
|
213
|
+
*
|
|
214
|
+
*
|
|
215
|
+
*/
|
|
216
|
+
export var typeAheadPlugin = function typeAheadPlugin(_ref4) {
|
|
217
|
+
var _api$analytics, _api$analytics2;
|
|
218
|
+
var options = _ref4.config,
|
|
219
|
+
api = _ref4.api;
|
|
220
|
+
var fireAnalyticsCallback = fireAnalyticsEvent(options === null || options === void 0 ? void 0 : options.createAnalyticsEvent);
|
|
221
|
+
var popupMountRef = {
|
|
222
|
+
current: null
|
|
223
|
+
};
|
|
224
|
+
var editorViewRef = {
|
|
225
|
+
current: null
|
|
226
|
+
};
|
|
227
|
+
return {
|
|
228
|
+
name: 'typeAhead',
|
|
229
|
+
marks: function marks() {
|
|
230
|
+
// We need to keep this to make sure
|
|
231
|
+
// All documents with typeahead marks will be loaded normally
|
|
232
|
+
return [{
|
|
233
|
+
name: 'typeAheadQuery',
|
|
234
|
+
mark: typeAheadQuery
|
|
235
|
+
}];
|
|
236
|
+
},
|
|
237
|
+
pmPlugins: function pmPlugins() {
|
|
238
|
+
var typeAhead = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : [];
|
|
239
|
+
return [{
|
|
240
|
+
name: 'typeAhead',
|
|
241
|
+
plugin: function plugin(_ref5) {
|
|
242
|
+
var dispatch = _ref5.dispatch,
|
|
243
|
+
getIntl = _ref5.getIntl;
|
|
244
|
+
return createPlugin({
|
|
245
|
+
getIntl: getIntl,
|
|
246
|
+
popupMountRef: popupMountRef,
|
|
247
|
+
reactDispatch: dispatch,
|
|
248
|
+
typeAheadHandlers: typeAhead,
|
|
249
|
+
createAnalyticsEvent: options === null || options === void 0 ? void 0 : options.createAnalyticsEvent
|
|
250
|
+
});
|
|
251
|
+
}
|
|
252
|
+
}, {
|
|
253
|
+
name: 'typeAheadEditorViewRef',
|
|
254
|
+
plugin: function plugin() {
|
|
255
|
+
return new SafePlugin({
|
|
256
|
+
view: function view(_view) {
|
|
257
|
+
editorViewRef.current = _view;
|
|
258
|
+
return {
|
|
259
|
+
destroy: function destroy() {
|
|
260
|
+
editorViewRef.current = null;
|
|
261
|
+
}
|
|
262
|
+
};
|
|
263
|
+
}
|
|
264
|
+
});
|
|
265
|
+
}
|
|
266
|
+
}, {
|
|
267
|
+
name: 'typeAheadInsertItem',
|
|
268
|
+
plugin: createInsertItemPlugin
|
|
269
|
+
}, {
|
|
270
|
+
name: 'typeAheadInputRule',
|
|
271
|
+
plugin: function plugin(_ref6) {
|
|
272
|
+
var schema = _ref6.schema,
|
|
273
|
+
featureFlags = _ref6.featureFlags;
|
|
274
|
+
return inputRulePlugin(schema, typeAhead, featureFlags);
|
|
275
|
+
}
|
|
276
|
+
}];
|
|
277
|
+
},
|
|
278
|
+
getSharedState: function getSharedState(editorState) {
|
|
279
|
+
if (!editorState) {
|
|
280
|
+
return {
|
|
281
|
+
query: '',
|
|
282
|
+
isOpen: false,
|
|
283
|
+
isAllowed: false,
|
|
284
|
+
currentHandler: undefined
|
|
285
|
+
};
|
|
286
|
+
}
|
|
287
|
+
var isOpen = isTypeAheadOpen(editorState);
|
|
288
|
+
return {
|
|
289
|
+
query: getTypeAheadQuery(editorState) || '',
|
|
290
|
+
currentHandler: getTypeAheadHandler(editorState),
|
|
291
|
+
isOpen: isOpen,
|
|
292
|
+
isAllowed: !isOpen
|
|
293
|
+
};
|
|
294
|
+
},
|
|
295
|
+
actions: {
|
|
296
|
+
isOpen: isTypeAheadOpen,
|
|
297
|
+
isAllowed: isTypeAheadAllowed,
|
|
298
|
+
open: createOpenTypeAhead(editorViewRef, api === null || api === void 0 || (_api$analytics = api.analytics) === null || _api$analytics === void 0 ? void 0 : _api$analytics.actions),
|
|
299
|
+
openAtTransaction: createOpenAtTransaction(api === null || api === void 0 || (_api$analytics2 = api.analytics) === null || _api$analytics2 === void 0 ? void 0 : _api$analytics2.actions),
|
|
300
|
+
findHandlerByTrigger: createFindHandlerByTrigger(editorViewRef),
|
|
301
|
+
insert: createInsertTypeAheadItem(editorViewRef),
|
|
302
|
+
close: createCloseTypeAhead(editorViewRef)
|
|
303
|
+
},
|
|
304
|
+
contentComponent: function contentComponent(_ref7) {
|
|
305
|
+
var editorView = _ref7.editorView,
|
|
306
|
+
containerElement = _ref7.containerElement,
|
|
307
|
+
popupsMountPoint = _ref7.popupsMountPoint,
|
|
308
|
+
popupsBoundariesElement = _ref7.popupsBoundariesElement,
|
|
309
|
+
popupsScrollableElement = _ref7.popupsScrollableElement,
|
|
310
|
+
wrapperElement = _ref7.wrapperElement;
|
|
311
|
+
popupMountRef.current = {
|
|
312
|
+
popupsMountPoint: popupsMountPoint || wrapperElement || undefined,
|
|
313
|
+
popupsBoundariesElement: popupsBoundariesElement,
|
|
314
|
+
popupsScrollableElement: popupsScrollableElement || containerElement || undefined
|
|
315
|
+
};
|
|
316
|
+
return /*#__PURE__*/React.createElement(WithPluginState, {
|
|
317
|
+
plugins: {
|
|
318
|
+
typeAheadState: typeAheadPluginKey
|
|
319
|
+
},
|
|
320
|
+
render: function render(_ref8) {
|
|
321
|
+
var typeAheadState = _ref8.typeAheadState;
|
|
322
|
+
if (!typeAheadState) {
|
|
323
|
+
return null;
|
|
324
|
+
}
|
|
325
|
+
return /*#__PURE__*/React.createElement(TypeAheadMenu, {
|
|
326
|
+
editorView: editorView,
|
|
327
|
+
popupMountRef: popupMountRef,
|
|
328
|
+
typeAheadState: typeAheadState,
|
|
329
|
+
fireAnalyticsCallback: fireAnalyticsCallback
|
|
330
|
+
});
|
|
331
|
+
}
|
|
332
|
+
});
|
|
333
|
+
},
|
|
334
|
+
onEditorViewStateUpdated: function onEditorViewStateUpdated(_ref9) {
|
|
335
|
+
var originalTransaction = _ref9.originalTransaction,
|
|
336
|
+
oldEditorState = _ref9.oldEditorState,
|
|
337
|
+
newEditorState = _ref9.newEditorState;
|
|
338
|
+
var oldPluginState = getPluginState(oldEditorState);
|
|
339
|
+
var newPluginState = getPluginState(newEditorState);
|
|
340
|
+
if (!oldPluginState || !newPluginState) {
|
|
341
|
+
return;
|
|
342
|
+
}
|
|
343
|
+
var oldTriggerHandler = oldPluginState.triggerHandler;
|
|
344
|
+
var newTriggerHandler = newPluginState.triggerHandler;
|
|
345
|
+
var isANewHandler = oldTriggerHandler !== newTriggerHandler;
|
|
346
|
+
if (oldTriggerHandler !== null && oldTriggerHandler !== void 0 && oldTriggerHandler.dismiss && isANewHandler) {
|
|
347
|
+
var typeAheadMessage = originalTransaction.getMeta(typeAheadPluginKey);
|
|
348
|
+
var wasItemInserted = typeAheadMessage && typeAheadMessage.action === 'INSERT_RAW_QUERY';
|
|
349
|
+
oldTriggerHandler.dismiss({
|
|
350
|
+
editorState: newEditorState,
|
|
351
|
+
query: oldPluginState.query,
|
|
352
|
+
stats: (oldPluginState.stats || new StatsModifier()).serialize(),
|
|
353
|
+
wasItemInserted: wasItemInserted
|
|
354
|
+
});
|
|
355
|
+
}
|
|
356
|
+
if (newTriggerHandler !== null && newTriggerHandler !== void 0 && newTriggerHandler.onOpen && isANewHandler) {
|
|
357
|
+
newTriggerHandler.onOpen(newEditorState);
|
|
358
|
+
}
|
|
359
|
+
if (newTriggerHandler && isANewHandler && options !== null && options !== void 0 && options.createAnalyticsEvent) {
|
|
360
|
+
fireAnalyticsCallback({
|
|
361
|
+
payload: {
|
|
362
|
+
action: ACTION.INVOKED,
|
|
363
|
+
actionSubject: ACTION_SUBJECT.TYPEAHEAD,
|
|
364
|
+
actionSubjectId: newTriggerHandler.id || 'not_set',
|
|
365
|
+
attributes: {
|
|
366
|
+
inputMethod: newPluginState.inputMethod || INPUT_METHOD.KEYBOARD
|
|
367
|
+
},
|
|
368
|
+
eventType: EVENT_TYPE.UI
|
|
369
|
+
}
|
|
370
|
+
});
|
|
371
|
+
}
|
|
372
|
+
}
|
|
373
|
+
};
|
|
374
|
+
};
|
|
@@ -1,5 +1,4 @@
|
|
|
1
1
|
import { areSameItems } from '@atlaskit/editor-common/floating-toolbar';
|
|
2
|
-
import { isTypeAheadOpen } from '../../type-ahead/utils';
|
|
3
2
|
import { trackerStore } from '..';
|
|
4
3
|
var areToolbarsSame = function areToolbarsSame(left, right) {
|
|
5
4
|
if (!left && !right) {
|
|
@@ -24,14 +23,13 @@ export var subscribeToToolbarAndPickerUpdates = function subscribeToToolbarAndPi
|
|
|
24
23
|
var lastUpdatedState = null;
|
|
25
24
|
var subscription = function subscription(_ref) {
|
|
26
25
|
var newEditorState = _ref.newEditorState;
|
|
27
|
-
// TypeAhead has priority in the mobile-bridge
|
|
28
|
-
// In case it is open we don't need to send
|
|
29
|
-
// any toolbar updates don't need to be send
|
|
30
|
-
if (isTypeAheadOpen(newEditorState)) {
|
|
31
|
-
return;
|
|
32
|
-
}
|
|
33
|
-
|
|
34
26
|
// Creating fake plugin keys for these plugins for the mean time until all these plugins are extracted.
|
|
27
|
+
var typeAheadPluginKey = {
|
|
28
|
+
key: 'typeAheadPlugin$',
|
|
29
|
+
getState: function getState(state) {
|
|
30
|
+
return state['typeAheadPlugin$'];
|
|
31
|
+
}
|
|
32
|
+
};
|
|
35
33
|
var datePluginKey = {
|
|
36
34
|
key: 'datePlugin$',
|
|
37
35
|
getState: function getState(state) {
|
|
@@ -50,6 +48,17 @@ export var subscribeToToolbarAndPickerUpdates = function subscribeToToolbarAndPi
|
|
|
50
48
|
return state['floatingToolbarPluginKey$'];
|
|
51
49
|
}
|
|
52
50
|
};
|
|
51
|
+
var isTypeAheadOpen = function isTypeAheadOpen(editorState) {
|
|
52
|
+
var _typeAheadState$decor;
|
|
53
|
+
var typeAheadState = typeAheadPluginKey.getState(newEditorState);
|
|
54
|
+
return !!((_typeAheadState$decor = typeAheadState.decorationSet) !== null && _typeAheadState$decor !== void 0 && _typeAheadState$decor.find().length);
|
|
55
|
+
};
|
|
56
|
+
// TypeAhead has priority in the mobile-bridge
|
|
57
|
+
// In case it is open we don't need to send
|
|
58
|
+
// any toolbar updates don't need to be send
|
|
59
|
+
if (isTypeAheadOpen(newEditorState)) {
|
|
60
|
+
return;
|
|
61
|
+
}
|
|
53
62
|
var dateState = datePluginKey.getState(newEditorState);
|
|
54
63
|
var statusState = statusPluginKey.getState(newEditorState);
|
|
55
64
|
var _ref2 = floatingToolbarPluginKey.getState(newEditorState),
|
|
@@ -1,8 +1,122 @@
|
|
|
1
|
-
|
|
2
|
-
import
|
|
3
|
-
|
|
1
|
+
import React from 'react';
|
|
2
|
+
import PropTypes from 'prop-types';
|
|
3
|
+
import { EditorState } from '@atlaskit/editor-prosemirror/state';
|
|
4
|
+
import type { DirectEditorProps } from '@atlaskit/editor-prosemirror/view';
|
|
5
|
+
import { EditorView } from '@atlaskit/editor-prosemirror/view';
|
|
6
|
+
import type { Node as PMNode } from '@atlaskit/editor-prosemirror/model';
|
|
7
|
+
import type { WrappedComponentProps } from 'react-intl-next';
|
|
8
|
+
import type { CreateUIAnalyticsEvent } from '@atlaskit/analytics-next';
|
|
9
|
+
import type { ProviderFactory } from '@atlaskit/editor-common/provider-factory';
|
|
10
|
+
import type { ErrorReporter, SEVERITY } from '@atlaskit/editor-common/utils';
|
|
11
|
+
import { ExperienceStore } from '@atlaskit/editor-common/ufo';
|
|
12
|
+
import type { Transformer, AllEditorPresetPluginTypes } from '@atlaskit/editor-common/types';
|
|
13
|
+
import type { Dispatch } from '../event-dispatcher';
|
|
14
|
+
import { EventDispatcher } from '../event-dispatcher';
|
|
15
|
+
import { FULL_WIDTH_MODE } from '@atlaskit/editor-common/analytics';
|
|
16
|
+
import type { EditorAppearance, EditorConfig, EditorReactContext, EditorPlugin, EditorProps } from '../types';
|
|
17
|
+
import type { EditorNextProps } from '../types/editor-props';
|
|
18
|
+
import type { PortalProviderAPI } from '@atlaskit/editor-common/portal-provider';
|
|
19
|
+
import type { SetEditorAPI } from '../presets/context';
|
|
20
|
+
import { TransactionTracker } from '../utils/performance/track-transactions';
|
|
21
|
+
import type { FireAnalyticsCallback, AnalyticsEventPayload, DispatchAnalyticsEvent } from '@atlaskit/editor-common/analytics';
|
|
22
|
+
import type { EditorPresetBuilder } from '@atlaskit/editor-common/preset';
|
|
23
|
+
export interface EditorViewProps {
|
|
24
|
+
editorProps: EditorProps | EditorNextProps;
|
|
25
|
+
createAnalyticsEvent?: CreateUIAnalyticsEvent;
|
|
26
|
+
providerFactory: ProviderFactory;
|
|
27
|
+
portalProviderAPI: PortalProviderAPI;
|
|
28
|
+
disabled?: boolean;
|
|
29
|
+
experienceStore?: ExperienceStore;
|
|
30
|
+
setEditorApi?: SetEditorAPI;
|
|
31
|
+
render?: (props: {
|
|
32
|
+
editor: JSX.Element;
|
|
33
|
+
view?: EditorView;
|
|
34
|
+
config: EditorConfig;
|
|
35
|
+
eventDispatcher: EventDispatcher;
|
|
36
|
+
transformer?: Transformer<string>;
|
|
37
|
+
dispatchAnalyticsEvent: DispatchAnalyticsEvent;
|
|
38
|
+
editorRef: React.RefObject<HTMLDivElement>;
|
|
39
|
+
}) => JSX.Element;
|
|
40
|
+
onEditorCreated: (instance: {
|
|
41
|
+
view: EditorView;
|
|
42
|
+
config: EditorConfig;
|
|
43
|
+
eventDispatcher: EventDispatcher;
|
|
44
|
+
transformer?: Transformer<string>;
|
|
45
|
+
}) => void;
|
|
46
|
+
onEditorDestroyed: (instance: {
|
|
47
|
+
view: EditorView;
|
|
48
|
+
config: EditorConfig;
|
|
49
|
+
eventDispatcher: EventDispatcher;
|
|
50
|
+
transformer?: Transformer<string>;
|
|
51
|
+
}) => void;
|
|
52
|
+
preset: EditorPresetBuilder<string[], AllEditorPresetPluginTypes[]>;
|
|
4
53
|
}
|
|
5
|
-
|
|
6
|
-
|
|
54
|
+
interface CreateEditorStateOptions {
|
|
55
|
+
props: EditorViewProps;
|
|
56
|
+
context: EditorReactContext;
|
|
57
|
+
doc?: string | Object | PMNode;
|
|
58
|
+
resetting?: boolean;
|
|
59
|
+
selectionAtStart?: boolean;
|
|
60
|
+
}
|
|
61
|
+
export declare class ReactEditorView<T = {}> extends React.Component<EditorViewProps & WrappedComponentProps & T, {}, EditorReactContext> {
|
|
62
|
+
view?: EditorView;
|
|
63
|
+
eventDispatcher: EventDispatcher;
|
|
64
|
+
contentTransformer?: Transformer<string>;
|
|
65
|
+
config: EditorConfig;
|
|
66
|
+
editorState: EditorState;
|
|
67
|
+
errorReporter: ErrorReporter;
|
|
68
|
+
dispatch: Dispatch;
|
|
69
|
+
proseMirrorRenderedSeverity?: SEVERITY;
|
|
70
|
+
transactionTracker: TransactionTracker;
|
|
71
|
+
validTransactionCount: number;
|
|
72
|
+
experienceStore?: ExperienceStore;
|
|
73
|
+
editorRef: React.RefObject<HTMLDivElement>;
|
|
74
|
+
static contextTypes: {
|
|
75
|
+
getAtlaskitAnalyticsEventHandlers: PropTypes.Requireable<(...args: any[]) => any>;
|
|
76
|
+
};
|
|
77
|
+
private canDispatchTransactions;
|
|
78
|
+
private focusTimeoutId?;
|
|
79
|
+
private reliabilityInterval?;
|
|
80
|
+
private pluginPerformanceObserver;
|
|
81
|
+
private featureFlags;
|
|
82
|
+
private pluginInjectionAPI;
|
|
83
|
+
private onPluginObservation;
|
|
84
|
+
get transactionTracking(): import("@atlaskit/editor-common/types").TransactionTracking;
|
|
85
|
+
private getPluginNames;
|
|
86
|
+
private countNodes;
|
|
87
|
+
private isTransactionTrackingExplicitlyDisabled;
|
|
88
|
+
constructor(props: EditorViewProps & WrappedComponentProps & T, context: EditorReactContext);
|
|
89
|
+
getEditorState: () => EditorState | undefined;
|
|
90
|
+
getEditorView: () => EditorView | undefined;
|
|
91
|
+
UNSAFE_componentWillReceiveProps(nextProps: EditorViewProps): void;
|
|
92
|
+
formatFullWidthAppearance: (appearance: EditorAppearance | undefined) => FULL_WIDTH_MODE;
|
|
93
|
+
resetEditorState: ({ doc, shouldScrollToBottom, }: {
|
|
94
|
+
doc: string;
|
|
95
|
+
shouldScrollToBottom: boolean;
|
|
96
|
+
}) => void;
|
|
97
|
+
blur: () => void;
|
|
98
|
+
reconfigureState(props: EditorViewProps): void;
|
|
99
|
+
handleAnalyticsEvent: FireAnalyticsCallback;
|
|
100
|
+
componentDidMount(): void;
|
|
101
|
+
/**
|
|
102
|
+
* Clean up any non-PM resources when the editor is unmounted
|
|
103
|
+
*/
|
|
104
|
+
componentWillUnmount(): void;
|
|
105
|
+
private editorPlugins;
|
|
106
|
+
getPlugins(preset: EditorPresetBuilder<string[], AllEditorPresetPluginTypes[]>): EditorPlugin[];
|
|
107
|
+
createEditorState: (options: CreateEditorStateOptions) => EditorState;
|
|
108
|
+
private onEditorViewStateUpdated;
|
|
109
|
+
private trackValidTransactions;
|
|
110
|
+
private dispatchTransaction;
|
|
111
|
+
getDirectEditorProps: (state?: EditorState) => DirectEditorProps;
|
|
112
|
+
private createEditorView;
|
|
113
|
+
handleEditorViewRef: (node: HTMLDivElement) => void;
|
|
114
|
+
dispatchAnalyticsEvent: (payload: AnalyticsEventPayload) => void;
|
|
115
|
+
private createEditor;
|
|
116
|
+
private editor;
|
|
117
|
+
render(): JSX.Element;
|
|
118
|
+
}
|
|
119
|
+
declare const _default: React.FC<import("react-intl-next").WithIntlProps<EditorViewProps & WrappedComponentProps<"intl">>> & {
|
|
120
|
+
WrappedComponent: React.ComponentType<EditorViewProps & WrappedComponentProps<"intl">>;
|
|
7
121
|
};
|
|
8
122
|
export default _default;
|