@atlaskit/editor-core 187.32.2 → 187.32.3

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.
Files changed (61) hide show
  1. package/CHANGELOG.md +7 -0
  2. package/dist/cjs/labs/next/presets/universal.js +2 -1
  3. package/dist/cjs/plugins/index.js +0 -7
  4. package/dist/cjs/ui/ContentStyles/index.js +13 -12
  5. package/dist/cjs/ui/styles.js +3 -5
  6. package/dist/cjs/version-wrapper.js +1 -1
  7. package/dist/es2019/labs/next/presets/universal.js +2 -1
  8. package/dist/es2019/plugins/index.js +0 -1
  9. package/dist/es2019/ui/ContentStyles/index.js +25 -3
  10. package/dist/es2019/ui/styles.js +0 -3
  11. package/dist/es2019/version-wrapper.js +1 -1
  12. package/dist/esm/labs/next/presets/universal.js +2 -1
  13. package/dist/esm/plugins/index.js +0 -1
  14. package/dist/esm/ui/ContentStyles/index.js +6 -5
  15. package/dist/esm/ui/styles.js +2 -3
  16. package/dist/esm/version-wrapper.js +1 -1
  17. package/dist/types/plugins/index.d.ts +0 -1
  18. package/dist/types/ui/styles.d.ts +0 -1
  19. package/dist/types-ts4.5/plugins/index.d.ts +0 -1
  20. package/dist/types-ts4.5/ui/styles.d.ts +0 -1
  21. package/package.json +2 -2
  22. package/dist/cjs/plugins/emoji/commands/insert-emoji.js +0 -47
  23. package/dist/cjs/plugins/emoji/index.js +0 -409
  24. package/dist/cjs/plugins/emoji/messages.js +0 -15
  25. package/dist/cjs/plugins/emoji/nodeviews/emoji.js +0 -34
  26. package/dist/cjs/plugins/emoji/pm-plugins/ascii-input-rules.js +0 -235
  27. package/dist/cjs/plugins/emoji/styles.js +0 -14
  28. package/dist/cjs/plugins/emoji/types.js +0 -5
  29. package/dist/cjs/plugins/emoji/ui/Emoji/index.js +0 -16
  30. package/dist/es2019/plugins/emoji/commands/insert-emoji.js +0 -40
  31. package/dist/es2019/plugins/emoji/index.js +0 -381
  32. package/dist/es2019/plugins/emoji/messages.js +0 -8
  33. package/dist/es2019/plugins/emoji/nodeviews/emoji.js +0 -29
  34. package/dist/es2019/plugins/emoji/pm-plugins/ascii-input-rules.js +0 -169
  35. package/dist/es2019/plugins/emoji/styles.js +0 -25
  36. package/dist/es2019/plugins/emoji/types.js +0 -1
  37. package/dist/es2019/plugins/emoji/ui/Emoji/index.js +0 -9
  38. package/dist/esm/plugins/emoji/commands/insert-emoji.js +0 -39
  39. package/dist/esm/plugins/emoji/index.js +0 -391
  40. package/dist/esm/plugins/emoji/messages.js +0 -8
  41. package/dist/esm/plugins/emoji/nodeviews/emoji.js +0 -27
  42. package/dist/esm/plugins/emoji/pm-plugins/ascii-input-rules.js +0 -225
  43. package/dist/esm/plugins/emoji/styles.js +0 -6
  44. package/dist/esm/plugins/emoji/types.js +0 -1
  45. package/dist/esm/plugins/emoji/ui/Emoji/index.js +0 -9
  46. package/dist/types/plugins/emoji/commands/insert-emoji.d.ts +0 -4
  47. package/dist/types/plugins/emoji/index.d.ts +0 -40
  48. package/dist/types/plugins/emoji/messages.d.ts +0 -7
  49. package/dist/types/plugins/emoji/nodeviews/emoji.d.ts +0 -7
  50. package/dist/types/plugins/emoji/pm-plugins/ascii-input-rules.d.ts +0 -10
  51. package/dist/types/plugins/emoji/styles.d.ts +0 -1
  52. package/dist/types/plugins/emoji/types.d.ts +0 -1
  53. package/dist/types/plugins/emoji/ui/Emoji/index.d.ts +0 -4
  54. package/dist/types-ts4.5/plugins/emoji/commands/insert-emoji.d.ts +0 -4
  55. package/dist/types-ts4.5/plugins/emoji/index.d.ts +0 -40
  56. package/dist/types-ts4.5/plugins/emoji/messages.d.ts +0 -7
  57. package/dist/types-ts4.5/plugins/emoji/nodeviews/emoji.d.ts +0 -7
  58. package/dist/types-ts4.5/plugins/emoji/pm-plugins/ascii-input-rules.d.ts +0 -10
  59. package/dist/types-ts4.5/plugins/emoji/styles.d.ts +0 -1
  60. package/dist/types-ts4.5/plugins/emoji/types.d.ts +0 -1
  61. package/dist/types-ts4.5/plugins/emoji/ui/Emoji/index.d.ts +0 -4
@@ -1,381 +0,0 @@
1
- import React from 'react';
2
- import { SafePlugin } from '@atlaskit/editor-common/safe-plugin';
3
- import { PluginKey } from '@atlaskit/editor-prosemirror/state';
4
- import { emoji } from '@atlaskit/adf-schema';
5
- import { Fragment } from '@atlaskit/editor-prosemirror/model';
6
- import { TypeAheadAvailableNodes } from '@atlaskit/editor-common/type-ahead';
7
- import { EmojiTypeAheadItem, SearchSort, recordSelectionSucceededSli, recordSelectionFailedSli } from '@atlaskit/emoji';
8
- import { getInlineNodeViewProducer } from '@atlaskit/editor-common/react-node-view';
9
- import { inputRulePlugin as asciiInputRulePlugin } from './pm-plugins/ascii-input-rules';
10
- import { ACTION, ACTION_SUBJECT, ACTION_SUBJECT_ID, EVENT_TYPE, INPUT_METHOD } from '@atlaskit/editor-common/analytics';
11
- import { IconEmoji } from '@atlaskit/editor-common/quick-insert';
12
- import { EmojiNodeView } from './nodeviews/emoji';
13
- import { messages } from '../insert-block/ui/ToolbarInsertBlock/messages';
14
- import { insertEmoji } from './commands/insert-emoji';
15
- export const emojiToTypeaheadItem = (emoji, emojiProvider) => ({
16
- title: emoji.shortName || '',
17
- key: emoji.id || emoji.shortName,
18
- render({
19
- isSelected,
20
- onClick,
21
- onHover
22
- }) {
23
- return /*#__PURE__*/React.createElement(EmojiTypeAheadItem, {
24
- emoji: emoji,
25
- selected: isSelected,
26
- onMouseMove: onHover,
27
- onSelection: onClick,
28
- emojiProvider: emojiProvider
29
- });
30
- },
31
- emoji
32
- });
33
- export function memoize(fn) {
34
- // Cache results here
35
- const seen = new Map();
36
- function memoized(emoji, emojiProvider) {
37
- // Check cache for hits
38
- const hit = seen.get(emoji.id || emoji.shortName);
39
- if (hit) {
40
- return hit;
41
- }
42
-
43
- // Generate new result and cache it
44
- const result = fn(emoji, emojiProvider);
45
- seen.set(emoji.id || emoji.shortName, result);
46
- return result;
47
- }
48
- return {
49
- call: memoized,
50
- clear: seen.clear.bind(seen)
51
- };
52
- }
53
- const memoizedToItem = memoize(emojiToTypeaheadItem);
54
- export const defaultListLimit = 50;
55
- const isFullShortName = query => query && query.length > 1 && query.charAt(0) === ':' && query.charAt(query.length - 1) === ':';
56
- const TRIGGER = ':';
57
- export const emojiPlugin = ({
58
- config: options,
59
- api
60
- }) => {
61
- var _api$analytics5;
62
- const typeAhead = {
63
- id: TypeAheadAvailableNodes.EMOJI,
64
- trigger: TRIGGER,
65
- // Custom regex must have a capture group around trigger
66
- // so it's possible to use it without needing to scan through all triggers again
67
- customRegex: '\\(?(:)',
68
- headless: options ? options.headless : undefined,
69
- getItems({
70
- query,
71
- editorState
72
- }) {
73
- const pluginState = getEmojiPluginState(editorState);
74
- const emojiProvider = pluginState.emojiProvider;
75
- if (!emojiProvider) {
76
- return Promise.resolve([]);
77
- }
78
- return new Promise(resolve => {
79
- const emojiProviderChangeHandler = {
80
- result(emojiResult) {
81
- if (!emojiResult || !emojiResult.emojis) {
82
- resolve([]);
83
- } else {
84
- const emojiItems = emojiResult.emojis.map(emoji => memoizedToItem.call(emoji, emojiProvider));
85
- resolve(emojiItems);
86
- }
87
- emojiProvider.unsubscribe(emojiProviderChangeHandler);
88
- }
89
- };
90
- emojiProvider.subscribe(emojiProviderChangeHandler);
91
- emojiProvider.filter(TRIGGER.concat(query), {
92
- limit: defaultListLimit,
93
- skinTone: emojiProvider.getSelectedTone(),
94
- sort: !query.length ? SearchSort.UsageFrequency : SearchSort.Default
95
- });
96
- });
97
- },
98
- forceSelect({
99
- query,
100
- items,
101
- editorState
102
- }) {
103
- const {
104
- asciiMap
105
- } = emojiPluginKey.getState(editorState) || {};
106
- const normalizedQuery = TRIGGER.concat(query);
107
-
108
- // if the query has space at the end
109
- // check the ascii map for emojis
110
- if (asciiMap && normalizedQuery.length >= 3 && normalizedQuery.endsWith(' ') && asciiMap.has(normalizedQuery.trim())) {
111
- const emoji = asciiMap.get(normalizedQuery.trim());
112
- return {
113
- title: (emoji === null || emoji === void 0 ? void 0 : emoji.name) || '',
114
- emoji
115
- };
116
- }
117
- const matchedItem = isFullShortName(normalizedQuery) ? items.find(item => item.title.toLowerCase() === normalizedQuery) : undefined;
118
- return matchedItem;
119
- },
120
- selectItem(state, item, insert, {
121
- mode
122
- }) {
123
- var _api$analytics3;
124
- const {
125
- id = '',
126
- fallback,
127
- shortName
128
- } = item.emoji;
129
- const text = fallback || shortName;
130
- const emojiPluginState = emojiPluginKey.getState(state);
131
- if (emojiPluginState.emojiProvider && emojiPluginState.emojiProvider.recordSelection && item.emoji) {
132
- var _api$analytics$shared, _api$analytics, _api$analytics$shared2, _api$analytics$shared3, _api$analytics2, _api$analytics2$share;
133
- emojiPluginState.emojiProvider.recordSelection(item.emoji).then(recordSelectionSucceededSli({
134
- createAnalyticsEvent: (_api$analytics$shared = api === null || api === void 0 ? void 0 : (_api$analytics = api.analytics) === null || _api$analytics === void 0 ? void 0 : (_api$analytics$shared2 = _api$analytics.sharedState.currentState()) === null || _api$analytics$shared2 === void 0 ? void 0 : _api$analytics$shared2.createAnalyticsEvent) !== null && _api$analytics$shared !== void 0 ? _api$analytics$shared : undefined
135
- })).catch(recordSelectionFailedSli({
136
- createAnalyticsEvent: (_api$analytics$shared3 = api === null || api === void 0 ? void 0 : (_api$analytics2 = api.analytics) === null || _api$analytics2 === void 0 ? void 0 : (_api$analytics2$share = _api$analytics2.sharedState.currentState()) === null || _api$analytics2$share === void 0 ? void 0 : _api$analytics2$share.createAnalyticsEvent) !== null && _api$analytics$shared3 !== void 0 ? _api$analytics$shared3 : undefined
137
- }));
138
- }
139
- const emojiNode = state.schema.nodes.emoji.createChecked({
140
- shortName,
141
- id,
142
- text
143
- });
144
- const space = state.schema.text(' ');
145
- const tr = insert(Fragment.from([emojiNode, space]));
146
- api === null || api === void 0 ? void 0 : (_api$analytics3 = api.analytics) === null || _api$analytics3 === void 0 ? void 0 : _api$analytics3.actions.attachAnalyticsEvent({
147
- action: ACTION.INSERTED,
148
- actionSubject: ACTION_SUBJECT.DOCUMENT,
149
- actionSubjectId: ACTION_SUBJECT_ID.EMOJI,
150
- attributes: {
151
- inputMethod: INPUT_METHOD.TYPEAHEAD
152
- },
153
- eventType: EVENT_TYPE.TRACK
154
- })(tr);
155
- return tr;
156
- }
157
- };
158
- return {
159
- name: 'emoji',
160
- nodes() {
161
- return [{
162
- name: 'emoji',
163
- node: emoji
164
- }];
165
- },
166
- pmPlugins() {
167
- return [{
168
- name: 'emoji',
169
- plugin: pmPluginFactoryParams => createEmojiPlugin(pmPluginFactoryParams)
170
- }, {
171
- name: 'emojiAsciiInputRule',
172
- plugin: ({
173
- schema,
174
- providerFactory,
175
- featureFlags
176
- }) => {
177
- var _api$analytics4;
178
- return asciiInputRulePlugin(schema, providerFactory, featureFlags, api === null || api === void 0 ? void 0 : (_api$analytics4 = api.analytics) === null || _api$analytics4 === void 0 ? void 0 : _api$analytics4.actions);
179
- }
180
- }];
181
- },
182
- getSharedState(editorState) {
183
- if (!editorState) {
184
- return undefined;
185
- }
186
- return emojiPluginKey.getState(editorState);
187
- },
188
- commands: {
189
- insertEmoji: insertEmoji(api === null || api === void 0 ? void 0 : (_api$analytics5 = api.analytics) === null || _api$analytics5 === void 0 ? void 0 : _api$analytics5.actions)
190
- },
191
- pluginsOptions: {
192
- quickInsert: ({
193
- formatMessage
194
- }) => [{
195
- id: 'emoji',
196
- title: formatMessage(messages.emoji),
197
- description: formatMessage(messages.emojiDescription),
198
- priority: 500,
199
- keyshortcut: ':',
200
- icon: () => /*#__PURE__*/React.createElement(IconEmoji, null),
201
- action(insert, state) {
202
- var _api$analytics6;
203
- const tr = insert(undefined);
204
- api === null || api === void 0 ? void 0 : api.typeAhead.commands.openTypeAheadAtCursor({
205
- triggerHandler: typeAhead,
206
- inputMethod: INPUT_METHOD.QUICK_INSERT
207
- })({
208
- tr
209
- });
210
- api === null || api === void 0 ? void 0 : (_api$analytics6 = api.analytics) === null || _api$analytics6 === void 0 ? void 0 : _api$analytics6.actions.attachAnalyticsEvent({
211
- action: ACTION.INVOKED,
212
- actionSubject: ACTION_SUBJECT.TYPEAHEAD,
213
- actionSubjectId: ACTION_SUBJECT_ID.TYPEAHEAD_EMOJI,
214
- attributes: {
215
- inputMethod: INPUT_METHOD.QUICK_INSERT
216
- },
217
- eventType: EVENT_TYPE.UI
218
- })(tr);
219
- return tr;
220
- }
221
- }],
222
- typeAhead
223
- }
224
- };
225
- };
226
-
227
- /**
228
- * Actions
229
- */
230
-
231
- export const ACTIONS = {
232
- SET_PROVIDER: 'SET_PROVIDER',
233
- SET_RESULTS: 'SET_RESULTS',
234
- SET_ASCII_MAP: 'SET_ASCII_MAP'
235
- };
236
- const setAsciiMap = asciiMap => (state, dispatch) => {
237
- if (dispatch) {
238
- dispatch(state.tr.setMeta(emojiPluginKey, {
239
- action: ACTIONS.SET_ASCII_MAP,
240
- params: {
241
- asciiMap
242
- }
243
- }));
244
- }
245
- return true;
246
- };
247
-
248
- /**
249
- *
250
- * Wrapper to call `onLimitReached` when a specified number of calls of that function
251
- * have been made within a time period.
252
- *
253
- * Note: It does not rate limit
254
- *
255
- * @param fn Function to wrap
256
- * @param limitTime Time limit in milliseconds
257
- * @param limitCount Number of function calls before `onRateReached` is called (per time period)
258
- * @returns Wrapped function
259
- */
260
- export function createRateLimitReachedFunction(fn, limitTime, limitCount, onLimitReached) {
261
- let lastCallTime = 0;
262
- let callCount = 0;
263
- return function wrappedFn(...args) {
264
- const now = Date.now();
265
- if (now - lastCallTime < limitTime) {
266
- if (++callCount > limitCount) {
267
- onLimitReached === null || onLimitReached === void 0 ? void 0 : onLimitReached();
268
- }
269
- } else {
270
- lastCallTime = now;
271
- callCount = 1;
272
- }
273
- return fn(...args);
274
- };
275
- }
276
-
277
- // At this stage console.error only
278
- const logRateWarning = () => {
279
- if (process.env.NODE_ENV === 'development') {
280
- // eslint-disable-next-line no-console
281
- console.error('The emoji provider injected in the Editor is being reloaded frequently, this will cause a slow Editor experience.');
282
- }
283
- };
284
- export const setProvider = createRateLimitReachedFunction(provider => (state, dispatch) => {
285
- if (dispatch) {
286
- dispatch(state.tr.setMeta(emojiPluginKey, {
287
- action: ACTIONS.SET_PROVIDER,
288
- params: {
289
- provider
290
- }
291
- }));
292
- }
293
- return true;
294
- },
295
- // If we change the emoji provider more than three times every 5 seconds we should warn.
296
- // This seems like a really long time but the performance can be that laggy that we don't
297
- // even get 3 events in 3 seconds and miss this indicator.
298
- 5000, 3, logRateWarning);
299
- export const emojiPluginKey = new PluginKey('emojiPlugin');
300
- export function getEmojiPluginState(state) {
301
- return emojiPluginKey.getState(state) || {};
302
- }
303
- export function createEmojiPlugin(pmPluginFactoryParams) {
304
- return new SafePlugin({
305
- key: emojiPluginKey,
306
- state: {
307
- init() {
308
- return {};
309
- },
310
- apply(tr, pluginState) {
311
- const {
312
- action,
313
- params
314
- } = tr.getMeta(emojiPluginKey) || {
315
- action: null,
316
- params: null
317
- };
318
- let newPluginState = pluginState;
319
- switch (action) {
320
- case ACTIONS.SET_PROVIDER:
321
- newPluginState = {
322
- ...pluginState,
323
- emojiProvider: params.provider
324
- };
325
- pmPluginFactoryParams.dispatch(emojiPluginKey, newPluginState);
326
- return newPluginState;
327
- case ACTIONS.SET_ASCII_MAP:
328
- newPluginState = {
329
- ...pluginState,
330
- asciiMap: params.asciiMap
331
- };
332
- pmPluginFactoryParams.dispatch(emojiPluginKey, newPluginState);
333
- return newPluginState;
334
- }
335
- return newPluginState;
336
- }
337
- },
338
- props: {
339
- nodeViews: {
340
- emoji: getInlineNodeViewProducer({
341
- pmPluginFactoryParams,
342
- Component: EmojiNodeView,
343
- extraComponentProps: {
344
- providerFactory: pmPluginFactoryParams.providerFactory
345
- }
346
- })
347
- }
348
- },
349
- view(editorView) {
350
- const providerHandler = (name, providerPromise) => {
351
- switch (name) {
352
- case 'emojiProvider':
353
- if (!providerPromise) {
354
- var _setProvider;
355
- return setProvider === null || setProvider === void 0 ? void 0 : (_setProvider = setProvider(undefined)) === null || _setProvider === void 0 ? void 0 : _setProvider(editorView.state, editorView.dispatch);
356
- }
357
- providerPromise.then(provider => {
358
- var _setProvider2;
359
- setProvider === null || setProvider === void 0 ? void 0 : (_setProvider2 = setProvider(provider)) === null || _setProvider2 === void 0 ? void 0 : _setProvider2(editorView.state, editorView.dispatch);
360
- provider.getAsciiMap().then(asciiMap => {
361
- setAsciiMap(asciiMap)(editorView.state, editorView.dispatch);
362
- });
363
- }).catch(() => {
364
- var _setProvider3;
365
- return setProvider === null || setProvider === void 0 ? void 0 : (_setProvider3 = setProvider(undefined)) === null || _setProvider3 === void 0 ? void 0 : _setProvider3(editorView.state, editorView.dispatch);
366
- });
367
- break;
368
- }
369
- return;
370
- };
371
- pmPluginFactoryParams.providerFactory.subscribe('emojiProvider', providerHandler);
372
- return {
373
- destroy() {
374
- if (pmPluginFactoryParams.providerFactory) {
375
- pmPluginFactoryParams.providerFactory.unsubscribe('emojiProvider', providerHandler);
376
- }
377
- }
378
- };
379
- }
380
- });
381
- }
@@ -1,8 +0,0 @@
1
- import { defineMessages } from 'react-intl-next';
2
- export const messages = defineMessages({
3
- emojiNodeLabel: {
4
- id: 'fabric.emoji.label',
5
- defaultMessage: 'Emoji',
6
- description: 'Label to indicate emoji node to Screen reader users'
7
- }
8
- });
@@ -1,29 +0,0 @@
1
- import React from 'react';
2
- import Emoji from '../ui/Emoji';
3
- import { useIntl } from 'react-intl-next';
4
- import { messages } from '../messages';
5
- const EmojiAssistiveTextComponent = /*#__PURE__*/React.memo(({
6
- emojiShortName
7
- }) => {
8
- const intl = useIntl();
9
- return /*#__PURE__*/React.createElement("span", {
10
- className: 'assistive'
11
- }, `${intl.formatMessage(messages.emojiNodeLabel)} ${emojiShortName}`);
12
- });
13
- export function EmojiNodeView(props) {
14
- const {
15
- shortName,
16
- id,
17
- text
18
- } = props.node.attrs;
19
- return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(EmojiAssistiveTextComponent, {
20
- emojiShortName: shortName
21
- }), /*#__PURE__*/React.createElement("span", {
22
- "aria-hidden": "true"
23
- }, /*#__PURE__*/React.createElement(Emoji, {
24
- providers: props.providerFactory,
25
- id: id,
26
- shortName: shortName,
27
- fallback: text
28
- })));
29
- }
@@ -1,169 +0,0 @@
1
- import _defineProperty from "@babel/runtime/helpers/defineProperty";
2
- import { PluginKey } from '@atlaskit/editor-prosemirror/state';
3
- import { createRule, createPlugin } from '@atlaskit/prosemirror-input-rules';
4
- import { leafNodeReplacementCharacter } from '@atlaskit/prosemirror-input-rules';
5
- import { ACTION, ACTION_SUBJECT, ACTION_SUBJECT_ID, INPUT_METHOD, EVENT_TYPE } from '@atlaskit/editor-common/analytics';
6
- let matcher;
7
- export function inputRulePlugin(schema, providerFactory, featureFlags, editorAnalyticsAPI) {
8
- if (schema.nodes.emoji && providerFactory) {
9
- initMatcher(providerFactory);
10
- const asciiEmojiRule = createRule(AsciiEmojiMatcher.REGEX, inputRuleHandler(editorAnalyticsAPI));
11
- return createPlugin('emoji', [asciiEmojiRule]);
12
- }
13
- return;
14
- }
15
- function initMatcher(providerFactory) {
16
- const handleProvider = (_name, provider) => {
17
- if (!provider) {
18
- return;
19
- }
20
- provider.then(emojiProvider => {
21
- emojiProvider.getAsciiMap().then(map => {
22
- matcher = new RecordingAsciiEmojiMatcher(emojiProvider, map);
23
- });
24
- });
25
- };
26
- providerFactory.subscribe('emojiProvider', handleProvider);
27
- }
28
- const inputRuleHandler = editorAnalyticsAPI => (state, matchParts, start, end) => {
29
- if (!matcher) {
30
- return null;
31
- }
32
- const match = matcher.match(matchParts);
33
- if (match) {
34
- const transactionCreator = new AsciiEmojiTransactionCreator(state, match, start, end, editorAnalyticsAPI);
35
- return transactionCreator.create();
36
- }
37
- return null;
38
- };
39
- const REGEX_LEADING_CAPTURE_INDEX = 1;
40
- const REGEX_EMOJI_LEADING_PARENTHESES = 2;
41
- const REGEX_EMOJI_ASCII_CAPTURE_INDEX = 3;
42
- const REGEX_TRAILING_CAPTURE_INDEX = 4;
43
- const getLeadingString = (match, withParenthesis = true) => match[REGEX_LEADING_CAPTURE_INDEX] + (withParenthesis ? match[REGEX_EMOJI_LEADING_PARENTHESES] : '');
44
- const getLeadingStringWithoutParentheses = match => getLeadingString(match, false);
45
- const getAscii = (match, withParentheses = false) => (withParentheses ? match[REGEX_EMOJI_LEADING_PARENTHESES] : '') + match[REGEX_EMOJI_ASCII_CAPTURE_INDEX].trim();
46
- const getAsciiWithParentheses = matchParts => getAscii(matchParts, true);
47
- const getTrailingString = match => match[REGEX_TRAILING_CAPTURE_INDEX] || '';
48
- class AsciiEmojiMatcher {
49
- constructor(asciiToEmojiMap) {
50
- this.asciiToEmojiMap = asciiToEmojiMap;
51
- }
52
- match(matchParts) {
53
- return this.getAsciiEmojiMatch(getLeadingStringWithoutParentheses(matchParts), getAsciiWithParentheses(matchParts), getTrailingString(matchParts)) || this.getAsciiEmojiMatch(getLeadingString(matchParts), getAscii(matchParts), getTrailingString(matchParts));
54
- }
55
- getAsciiEmojiMatch(leading, ascii, trailing) {
56
- const emoji = this.asciiToEmojiMap.get(ascii);
57
- return emoji ? {
58
- emoji,
59
- leadingString: leading,
60
- trailingString: trailing
61
- } : undefined;
62
- }
63
- }
64
-
65
- /**
66
- * A matcher that will record ascii matches as usages of the matched emoji.
67
- */
68
- /**
69
- * This regex matches 2 scenarios:
70
- * 1. an emoticon starting with a colon character (e.g. :D => 😃)
71
- * 2. an emoticon not starting with a colon character (e.g. 8-D => 😎)
72
- *
73
- * Explanation (${leafNodeReplacementCharacter} is replaced with character \ufffc)
74
- *
75
- * 1st Capturing Group ((?:^|[\s\ufffc])(?:\(*?))
76
- * Non-capturing group (?:^|[\s\ufffc])
77
- * 1st Alternative ^
78
- * ^ asserts position at start of the string
79
- * 2nd Alternative [\s\ufffc]
80
- * matches a single character present in [\s\ufffc]
81
- * Non-capturing group (?:\(*?)
82
- * matches the character ( literally between zero and unlimited times, as few times as possible, expanding as needed (lazy)
83
- * 2nd Capturing Group (\(?)
84
- * matches a single ( if present
85
- * 3rd Capturing Group ([^:\s\ufffc\(]\S{1,3}|:\S{1,3}( ))
86
- * 1st Alternative [^:\s\ufffc\(]\S{1,3}
87
- * matches a single character not present in [^:\s\ufffc\(] between 1 and 3 times, as many times as possible, giving back as needed (greedy)
88
- * 2nd Alternative :\S{1,3}( )
89
- * : matches the character : literally
90
- * \S{1,3} matches any non-whitespace character between 1 and 3 times, as many times as possible, giving back as needed (greedy)
91
- * 4th Capturing Group ( )
92
- *
93
- * See https://regex101.com/r/HRS9O2/4
94
- */
95
- _defineProperty(AsciiEmojiMatcher, "REGEX", new RegExp(`((?:^|[\\s${leafNodeReplacementCharacter}])(?:\\(*?))(\\(?)([^:\\s${leafNodeReplacementCharacter}\\(]\\S{1,3}|:\\S{1,3}( ))$`));
96
- class RecordingAsciiEmojiMatcher extends AsciiEmojiMatcher {
97
- constructor(emojiProvider, asciiToEmojiMap) {
98
- super(asciiToEmojiMap);
99
- this.emojiProvider = emojiProvider;
100
- }
101
- match(matchParts) {
102
- const match = super.match(matchParts);
103
- if (match && this.emojiProvider.recordSelection) {
104
- this.emojiProvider.recordSelection(match.emoji);
105
- }
106
- return match;
107
- }
108
- }
109
- class AsciiEmojiTransactionCreator {
110
- constructor(state, match, start, end, editorAnalyticsAPI) {
111
- this.state = state;
112
- this.match = match;
113
- this.start = start;
114
- this.end = end;
115
- this.editorAnalyticsAPI = editorAnalyticsAPI;
116
- }
117
- create() {
118
- var _this$editorAnalytics;
119
- const tr = this.state.tr.replaceWith(this.from, this.to, this.createNodes());
120
- (_this$editorAnalytics = this.editorAnalyticsAPI) === null || _this$editorAnalytics === void 0 ? void 0 : _this$editorAnalytics.attachAnalyticsEvent({
121
- action: ACTION.INSERTED,
122
- actionSubject: ACTION_SUBJECT.DOCUMENT,
123
- actionSubjectId: ACTION_SUBJECT_ID.EMOJI,
124
- attributes: {
125
- inputMethod: INPUT_METHOD.ASCII
126
- },
127
- eventType: EVENT_TYPE.TRACK
128
- })(tr);
129
- return tr;
130
- }
131
- get from() {
132
- return this.start + this.match.leadingString.length;
133
- }
134
- get to() {
135
- return this.end;
136
- }
137
- createNodes() {
138
- const nodes = [this.createEmojiNode()];
139
- if (this.trailingTextNodeRequired()) {
140
- nodes.push(this.createTrailingTextNode());
141
- }
142
- return nodes;
143
- }
144
- createEmojiNode() {
145
- const {
146
- emoji: emojiTypeNode
147
- } = this.state.schema.nodes;
148
- return emojiTypeNode.create(this.getEmojiNodeAttrs());
149
- }
150
- getEmojiNodeAttrs() {
151
- const emoji = this.match.emoji;
152
- return {
153
- id: emoji.id,
154
- shortName: emoji.shortName,
155
- text: emoji.fallback || emoji.shortName
156
- };
157
- }
158
- trailingTextNodeRequired() {
159
- return this.match.trailingString.length > 0;
160
- }
161
- createTrailingTextNode() {
162
- return this.state.schema.text(this.match.trailingString);
163
- }
164
- }
165
- export const stateKey = new PluginKey('asciiEmojiPlugin');
166
- const plugins = (schema, providerFactory, featureFlags, editorAnalyticsAPI) => {
167
- return [inputRulePlugin(schema, providerFactory, featureFlags, editorAnalyticsAPI)].filter(plugin => !!plugin);
168
- };
169
- export default plugins;
@@ -1,25 +0,0 @@
1
- import { css } from '@emotion/react';
2
- import { EmojiSharedCssClassName } from '@atlaskit/editor-common/emoji';
3
- import { SelectionStyle, getSelectionStyles, akEditorSelectedNodeClassName } from '@atlaskit/editor-shared-styles';
4
- export const emojiStyles = css`
5
- .${EmojiSharedCssClassName.EMOJI_CONTAINER} {
6
- display: inline-block;
7
-
8
- .${EmojiSharedCssClassName.EMOJI_NODE} {
9
- cursor: pointer;
10
-
11
- &.${EmojiSharedCssClassName.EMOJI_IMAGE} > span {
12
- /** needed for selection style to cover custom emoji image properly */
13
- display: flex;
14
- }
15
- }
16
-
17
- &.${akEditorSelectedNodeClassName} {
18
- .${EmojiSharedCssClassName.EMOJI_SPRITE},
19
- .${EmojiSharedCssClassName.EMOJI_IMAGE} {
20
- border-radius: 2px;
21
- ${getSelectionStyles([SelectionStyle.Blanket, SelectionStyle.BoxShadow])}
22
- }
23
- }
24
- }
25
- `;
@@ -1 +0,0 @@
1
- export {};
@@ -1,9 +0,0 @@
1
- /** @jsx jsx */
2
- import { jsx } from '@emotion/react';
3
- import { clickSelectWrapperStyle } from '../../../../ui/styles';
4
- import { Emoji } from '@atlaskit/editor-common/emoji';
5
- export default function EmojiNode(props) {
6
- return jsx("span", {
7
- css: clickSelectWrapperStyle
8
- }, jsx(Emoji, props));
9
- }
@@ -1,39 +0,0 @@
1
- import _defineProperty from "@babel/runtime/helpers/defineProperty";
2
- function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
3
- function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
4
- import { safeInsert } from '@atlaskit/editor-prosemirror/utils';
5
- import { Fragment } from '@atlaskit/editor-prosemirror/model';
6
- import { Selection } from '@atlaskit/editor-prosemirror/state';
7
- import { EVENT_TYPE, ACTION_SUBJECT_ID, ACTION_SUBJECT, ACTION } from '@atlaskit/editor-common/analytics';
8
- export var insertEmoji = function insertEmoji(editorAnalyticsAPI) {
9
- return function (emojiId, inputMethod) {
10
- return function (_ref) {
11
- var tr = _ref.tr;
12
- var doc = tr.doc,
13
- selection = tr.selection;
14
- var emoji = tr.doc.type.schema.nodes.emoji;
15
- if (emoji && emojiId) {
16
- var node = emoji.createChecked(_objectSpread(_objectSpread({}, emojiId), {}, {
17
- text: emojiId.fallback || emojiId.shortName
18
- }));
19
- var textNode = doc.type.schema.text(' ');
20
- var fragment = Fragment.fromArray([node, textNode]);
21
- var newTr = safeInsert(fragment)(tr);
22
- if (inputMethod) {
23
- editorAnalyticsAPI === null || editorAnalyticsAPI === void 0 ? void 0 : editorAnalyticsAPI.attachAnalyticsEvent({
24
- action: ACTION.INSERTED,
25
- actionSubject: ACTION_SUBJECT.DOCUMENT,
26
- actionSubjectId: ACTION_SUBJECT_ID.EMOJI,
27
- attributes: {
28
- inputMethod: inputMethod
29
- },
30
- eventType: EVENT_TYPE.TRACK
31
- })(newTr);
32
- }
33
- newTr.setSelection(Selection.near(newTr.doc.resolve(selection.$from.pos + fragment.size)));
34
- return newTr;
35
- }
36
- return null;
37
- };
38
- };
39
- };