@atlaskit/editor-plugin-mentions 15.2.0 → 16.0.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 +6 -0
- package/dist/cjs/mentionsPlugin.js +12 -4
- package/dist/cjs/pm-plugins/main.js +1 -1
- package/dist/cjs/pm-plugins/mentionPlaceholder.js +52 -0
- package/dist/cjs/ui/InlineInviteRecaptchaContainer.js +100 -0
- package/dist/cjs/ui/type-ahead/index.js +11 -20
- package/dist/es2019/mentionsPlugin.js +10 -4
- package/dist/es2019/pm-plugins/main.js +1 -1
- package/dist/es2019/pm-plugins/mentionPlaceholder.js +44 -0
- package/dist/es2019/ui/InlineInviteRecaptchaContainer.js +90 -0
- package/dist/es2019/ui/type-ahead/index.js +13 -20
- package/dist/esm/mentionsPlugin.js +12 -4
- package/dist/esm/pm-plugins/main.js +1 -1
- package/dist/esm/pm-plugins/mentionPlaceholder.js +44 -0
- package/dist/esm/ui/InlineInviteRecaptchaContainer.js +91 -0
- package/dist/esm/ui/type-ahead/index.js +11 -20
- package/dist/types/pm-plugins/mentionPlaceholder.d.ts +11 -0
- package/dist/types/ui/InlineInviteRecaptchaContainer.d.ts +15 -0
- package/package.json +9 -15
- package/dist/cjs/ui/InlineInvitePopupContainer.js +0 -148
- package/dist/es2019/ui/InlineInvitePopupContainer.js +0 -137
- package/dist/esm/ui/InlineInvitePopupContainer.js +0 -139
- package/dist/types/ui/InlineInvitePopupContainer.d.ts +0 -11
|
@@ -0,0 +1,91 @@
|
|
|
1
|
+
/* InlineInviteRecaptchaContainer.tsx generated by @compiled/babel-plugin v2.0.0 */
|
|
2
|
+
import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
|
|
3
|
+
import { ax, ix } from "@compiled/react/runtime";
|
|
4
|
+
import React, { useCallback, useEffect, useState } from 'react';
|
|
5
|
+
import { mentionPlaceholderPluginKey, MENTION_PLACEHOLDER_ACTIONS } from '../pm-plugins/mentionPlaceholder';
|
|
6
|
+
import { MENTION_SOURCE } from '../ui/type-ahead/analytics';
|
|
7
|
+
/**
|
|
8
|
+
* Container that renders the recaptcha component from the mention provider and manages handleSuccess.
|
|
9
|
+
* Does NOT pass email - the provider's component uses useInlineInviteRecaptcha hook internally
|
|
10
|
+
* and wires showRecaptcha to the provider. When user clicks invite item, type-ahead calls
|
|
11
|
+
* mentionProvider.showInlineInviteRecaptcha(email) which passes email to the component.
|
|
12
|
+
*/
|
|
13
|
+
export var InlineInviteRecaptchaContainer = function InlineInviteRecaptchaContainer(_ref) {
|
|
14
|
+
var _api$mention2, _api$core3;
|
|
15
|
+
var mentionProvider = _ref.mentionProvider,
|
|
16
|
+
api = _ref.api;
|
|
17
|
+
var _useState = useState(null),
|
|
18
|
+
_useState2 = _slicedToArray(_useState, 2),
|
|
19
|
+
provider = _useState2[0],
|
|
20
|
+
setProvider = _useState2[1];
|
|
21
|
+
useEffect(function () {
|
|
22
|
+
if (!mentionProvider) {
|
|
23
|
+
return;
|
|
24
|
+
}
|
|
25
|
+
var isMounted = true;
|
|
26
|
+
mentionProvider.then(function (resolvedProvider) {
|
|
27
|
+
if (!isMounted) {
|
|
28
|
+
return;
|
|
29
|
+
}
|
|
30
|
+
setProvider(resolvedProvider);
|
|
31
|
+
}).catch(function () {
|
|
32
|
+
// Silently handle promise rejection
|
|
33
|
+
});
|
|
34
|
+
return function () {
|
|
35
|
+
isMounted = false;
|
|
36
|
+
setProvider(null);
|
|
37
|
+
};
|
|
38
|
+
}, [mentionProvider]);
|
|
39
|
+
var handleSuccess = useCallback(function (userId, email) {
|
|
40
|
+
var _api$mention, _api$core;
|
|
41
|
+
if (!(api !== null && api !== void 0 && (_api$mention = api.mention) !== null && _api$mention !== void 0 && (_api$mention = _api$mention.commands) !== null && _api$mention !== void 0 && _api$mention.insertMention) || !(api !== null && api !== void 0 && (_api$core = api.core) !== null && _api$core !== void 0 && (_api$core = _api$core.actions) !== null && _api$core !== void 0 && _api$core.execute)) {
|
|
42
|
+
return;
|
|
43
|
+
}
|
|
44
|
+
var name = email.split('@')[0] || email;
|
|
45
|
+
api.core.actions.execute(api.mention.commands.insertMention({
|
|
46
|
+
id: userId,
|
|
47
|
+
name: name,
|
|
48
|
+
userType: 'DEFAULT',
|
|
49
|
+
accessLevel: 'CONTAINER'
|
|
50
|
+
}));
|
|
51
|
+
api.core.actions.execute(function (_ref2) {
|
|
52
|
+
var tr = _ref2.tr;
|
|
53
|
+
tr.setMeta(mentionPlaceholderPluginKey, {
|
|
54
|
+
action: MENTION_PLACEHOLDER_ACTIONS.HIDE_PLACEHOLDER
|
|
55
|
+
});
|
|
56
|
+
return tr;
|
|
57
|
+
});
|
|
58
|
+
}, [api]);
|
|
59
|
+
var handleClose = useCallback(function () {
|
|
60
|
+
var _api$core2;
|
|
61
|
+
if (!(api !== null && api !== void 0 && (_api$core2 = api.core) !== null && _api$core2 !== void 0 && (_api$core2 = _api$core2.actions) !== null && _api$core2 !== void 0 && _api$core2.execute)) {
|
|
62
|
+
return;
|
|
63
|
+
}
|
|
64
|
+
api.core.actions.execute(function (_ref3) {
|
|
65
|
+
var tr = _ref3.tr;
|
|
66
|
+
tr.setMeta(mentionPlaceholderPluginKey, {
|
|
67
|
+
action: MENTION_PLACEHOLDER_ACTIONS.HIDE_PLACEHOLDER
|
|
68
|
+
});
|
|
69
|
+
return tr;
|
|
70
|
+
});
|
|
71
|
+
}, [api]);
|
|
72
|
+
var handleReady = useCallback(function (showRecaptcha) {
|
|
73
|
+
if (provider) {
|
|
74
|
+
if (showRecaptcha) {
|
|
75
|
+
provider.showInlineInviteRecaptcha = showRecaptcha;
|
|
76
|
+
} else {
|
|
77
|
+
delete provider.showInlineInviteRecaptcha;
|
|
78
|
+
}
|
|
79
|
+
}
|
|
80
|
+
}, [provider]);
|
|
81
|
+
if (!(provider !== null && provider !== void 0 && provider.InlineInviteRecaptcha) || !(api !== null && api !== void 0 && (_api$mention2 = api.mention) !== null && _api$mention2 !== void 0 && (_api$mention2 = _api$mention2.commands) !== null && _api$mention2 !== void 0 && _api$mention2.insertMention) || !(api !== null && api !== void 0 && (_api$core3 = api.core) !== null && _api$core3 !== void 0 && (_api$core3 = _api$core3.actions) !== null && _api$core3 !== void 0 && _api$core3.execute)) {
|
|
82
|
+
return null;
|
|
83
|
+
}
|
|
84
|
+
var RecaptchaComponent = provider.InlineInviteRecaptcha;
|
|
85
|
+
return /*#__PURE__*/React.createElement(RecaptchaComponent, {
|
|
86
|
+
analyticsSource: MENTION_SOURCE,
|
|
87
|
+
onSuccess: handleSuccess,
|
|
88
|
+
onClose: handleClose,
|
|
89
|
+
onReady: handleReady
|
|
90
|
+
});
|
|
91
|
+
};
|
|
@@ -23,6 +23,7 @@ import { expVal } from '@atlaskit/tmp-editor-statsig/expVal';
|
|
|
23
23
|
import { createSingleMentionFragment } from '../../editor-commands';
|
|
24
24
|
import { mentionPluginKey } from '../../pm-plugins/key';
|
|
25
25
|
import { ACTIONS } from '../../pm-plugins/main';
|
|
26
|
+
import { mentionPlaceholderPluginKey, MENTION_PLACEHOLDER_ACTIONS } from '../../pm-plugins/mentionPlaceholder';
|
|
26
27
|
import { getMentionPluginState } from '../../pm-plugins/utils';
|
|
27
28
|
import InviteItem, { INVITE_ITEM_DESCRIPTION } from '../InviteItem';
|
|
28
29
|
import InviteItemWithEmailDomain from '../InviteItem/InviteItemWithEmailDomain';
|
|
@@ -57,7 +58,7 @@ var createInviteItem = function createInviteItem(_ref) {
|
|
|
57
58
|
var isSelected = _ref2.isSelected,
|
|
58
59
|
onClick = _ref2.onClick,
|
|
59
60
|
onHover = _ref2.onHover;
|
|
60
|
-
return emailDomain && (_mentionProvider$getS = mentionProvider.getShouldEnableInlineInvite) !== null && _mentionProvider$getS !== void 0 && _mentionProvider$getS.call(mentionProvider) && fg('
|
|
61
|
+
return emailDomain && (_mentionProvider$getS = mentionProvider.getShouldEnableInlineInvite) !== null && _mentionProvider$getS !== void 0 && _mentionProvider$getS.call(mentionProvider) && fg('jira_invites_auto_tag_new_user_in_mentions_fg') ? /*#__PURE__*/React.createElement(InviteItemWithEmailDomain, {
|
|
61
62
|
productName: mentionProvider ? mentionProvider.productName : undefined,
|
|
62
63
|
selected: isSelected,
|
|
63
64
|
onMount: onInviteItemMount,
|
|
@@ -480,10 +481,10 @@ export var createTypeAheadConfig = function createTypeAheadConfig(_ref8) {
|
|
|
480
481
|
// Don't fire event and the callback with selection by space press
|
|
481
482
|
if (mode !== 'space') {
|
|
482
483
|
var _mentionProvider$getS3, _mentionProvider$getS4;
|
|
483
|
-
fireEvent(buildTypeAheadInviteItemClickedPayload(pickerElapsedTime, stats.keyCount.arrowUp, stats.keyCount.arrowDown, sessionId, mode, query, contextIdentifierProvider, mentionProvider.userRole, fg('
|
|
484
|
+
fireEvent(buildTypeAheadInviteItemClickedPayload(pickerElapsedTime, stats.keyCount.arrowUp, stats.keyCount.arrowDown, sessionId, mode, query, contextIdentifierProvider, mentionProvider.userRole, fg('jira_invites_auto_tag_new_user_in_mentions_fg') ? {
|
|
484
485
|
isInlineInviteMentionsEnabled: (_mentionProvider$getS3 = mentionProvider.getShouldEnableInlineInvite) === null || _mentionProvider$getS3 === void 0 ? void 0 : _mentionProvider$getS3.call(mentionProvider)
|
|
485
486
|
} : {}));
|
|
486
|
-
if ((_mentionProvider$getS4 = mentionProvider.getShouldEnableInlineInvite) !== null && _mentionProvider$getS4 !== void 0 && _mentionProvider$getS4.call(mentionProvider) && fg('
|
|
487
|
+
if ((_mentionProvider$getS4 = mentionProvider.getShouldEnableInlineInvite) !== null && _mentionProvider$getS4 !== void 0 && _mentionProvider$getS4.call(mentionProvider) && fg('jira_invites_auto_tag_new_user_in_mentions_fg')) {
|
|
487
488
|
// Get the email from query, using the same logic as InviteItemWithEmailDomain
|
|
488
489
|
var emailDomain = mentionProvider.userEmailDomain;
|
|
489
490
|
var email = query || '';
|
|
@@ -492,23 +493,13 @@ export var createTypeAheadConfig = function createTypeAheadConfig(_ref8) {
|
|
|
492
493
|
email = "".concat(email.toLowerCase(), "@").concat(emailDomain);
|
|
493
494
|
}
|
|
494
495
|
// If query already includes @, use it as is
|
|
495
|
-
if (email && mentionProvider.
|
|
496
|
-
|
|
497
|
-
var
|
|
498
|
-
|
|
499
|
-
|
|
500
|
-
|
|
501
|
-
|
|
502
|
-
tr: state.tr,
|
|
503
|
-
sanitizePrivateContent: sanitizePrivateContent
|
|
504
|
-
})({
|
|
505
|
-
name: pendingName,
|
|
506
|
-
id: pendingLocalId,
|
|
507
|
-
userType: 'DEFAULT',
|
|
508
|
-
localId: pendingLocalId,
|
|
509
|
-
accessLevel: 'CONTAINER'
|
|
510
|
-
}));
|
|
511
|
-
mentionProvider.showInlineInvitePopup(email, pendingLocalId);
|
|
496
|
+
if (email && mentionProvider.showInlineInviteRecaptcha) {
|
|
497
|
+
mentionProvider.showInlineInviteRecaptcha(email);
|
|
498
|
+
var _tr = state.tr;
|
|
499
|
+
_tr.setMeta(mentionPlaceholderPluginKey, {
|
|
500
|
+
action: MENTION_PLACEHOLDER_ACTIONS.SHOW_PLACEHOLDER,
|
|
501
|
+
placeholder: "@".concat(query)
|
|
502
|
+
});
|
|
512
503
|
return _tr;
|
|
513
504
|
}
|
|
514
505
|
} else if (mentionProvider.onInviteItemClick) {
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
import { SafePlugin } from '@atlaskit/editor-common/safe-plugin';
|
|
2
|
+
import { PluginKey } from '@atlaskit/editor-prosemirror/state';
|
|
3
|
+
export declare const mentionPlaceholderPluginKey: PluginKey;
|
|
4
|
+
export declare const MENTION_PLACEHOLDER_ACTIONS: {
|
|
5
|
+
SHOW_PLACEHOLDER: string;
|
|
6
|
+
HIDE_PLACEHOLDER: string;
|
|
7
|
+
};
|
|
8
|
+
export type MentionPlaceholderPluginState = {
|
|
9
|
+
placeholder?: string;
|
|
10
|
+
};
|
|
11
|
+
export declare function createMentionPlaceholderPlugin(): SafePlugin<{}>;
|
|
@@ -0,0 +1,15 @@
|
|
|
1
|
+
import type { ExtractInjectionAPI } from '@atlaskit/editor-common/types';
|
|
2
|
+
import type { MentionProvider } from '@atlaskit/mention/resource';
|
|
3
|
+
import type { MentionsPlugin } from '../mentionsPluginType';
|
|
4
|
+
interface Props {
|
|
5
|
+
api: ExtractInjectionAPI<MentionsPlugin> | undefined;
|
|
6
|
+
mentionProvider: Promise<MentionProvider> | undefined;
|
|
7
|
+
}
|
|
8
|
+
/**
|
|
9
|
+
* Container that renders the recaptcha component from the mention provider and manages handleSuccess.
|
|
10
|
+
* Does NOT pass email - the provider's component uses useInlineInviteRecaptcha hook internally
|
|
11
|
+
* and wires showRecaptcha to the provider. When user clicks invite item, type-ahead calls
|
|
12
|
+
* mentionProvider.showInlineInviteRecaptcha(email) which passes email to the component.
|
|
13
|
+
*/
|
|
14
|
+
export declare const InlineInviteRecaptchaContainer: ({ mentionProvider, api, }: Props) => JSX.Element | null;
|
|
15
|
+
export {};
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@atlaskit/editor-plugin-mentions",
|
|
3
|
-
"version": "
|
|
3
|
+
"version": "16.0.0",
|
|
4
4
|
"description": "Mentions plugin for @atlaskit/editor-core",
|
|
5
5
|
"author": "Atlassian Pty Ltd",
|
|
6
6
|
"license": "Apache-2.0",
|
|
@@ -23,11 +23,11 @@
|
|
|
23
23
|
"dependencies": {
|
|
24
24
|
"@atlaskit/adf-schema": "^56.6.0",
|
|
25
25
|
"@atlaskit/css": "^1.0.0",
|
|
26
|
-
"@atlaskit/editor-plugin-analytics": "^
|
|
27
|
-
"@atlaskit/editor-plugin-base": "^
|
|
28
|
-
"@atlaskit/editor-plugin-context-identifier": "^
|
|
29
|
-
"@atlaskit/editor-plugin-selection": "^
|
|
30
|
-
"@atlaskit/editor-plugin-type-ahead": "^
|
|
26
|
+
"@atlaskit/editor-plugin-analytics": "^14.0.0",
|
|
27
|
+
"@atlaskit/editor-plugin-base": "^15.0.0",
|
|
28
|
+
"@atlaskit/editor-plugin-context-identifier": "^14.0.0",
|
|
29
|
+
"@atlaskit/editor-plugin-selection": "^14.0.0",
|
|
30
|
+
"@atlaskit/editor-plugin-type-ahead": "^15.0.0",
|
|
31
31
|
"@atlaskit/editor-prosemirror": "^8.0.0",
|
|
32
32
|
"@atlaskit/feature-gate-js-client": "^6.0.0",
|
|
33
33
|
"@atlaskit/icon": "^37.3.0",
|
|
@@ -37,10 +37,10 @@
|
|
|
37
37
|
"@atlaskit/mention": "^27.13.0",
|
|
38
38
|
"@atlaskit/platform-feature-experiments": "^0.3.0",
|
|
39
39
|
"@atlaskit/platform-feature-flags": "^2.1.0",
|
|
40
|
-
"@atlaskit/popper": "^9.
|
|
40
|
+
"@atlaskit/popper": "^9.1.0",
|
|
41
41
|
"@atlaskit/portal": "^6.2.0",
|
|
42
42
|
"@atlaskit/primitives": "^22.2.0",
|
|
43
|
-
"@atlaskit/profilecard": "^26.
|
|
43
|
+
"@atlaskit/profilecard": "^26.16.0",
|
|
44
44
|
"@atlaskit/teams-app-config": "^2.2.0",
|
|
45
45
|
"@atlaskit/theme": "^27.0.0",
|
|
46
46
|
"@atlaskit/tmp-editor-statsig": "^142.0.0",
|
|
@@ -55,15 +55,12 @@
|
|
|
55
55
|
"uuid": "^3.1.0"
|
|
56
56
|
},
|
|
57
57
|
"peerDependencies": {
|
|
58
|
-
"@atlaskit/editor-common": "^
|
|
58
|
+
"@atlaskit/editor-common": "^118.0.0",
|
|
59
59
|
"react": "^18.2.0 || ^19.2.0",
|
|
60
60
|
"react-dom": "^18.2.0 || ^19.2.0",
|
|
61
61
|
"react-intl": "^5.25.1 || ^6.0.0 || ^7.0.0"
|
|
62
62
|
},
|
|
63
63
|
"devDependencies": {
|
|
64
|
-
"@atlaskit/button": "^25.0.0",
|
|
65
|
-
"@atlaskit/editor-core": "^222.1.0",
|
|
66
|
-
"@atlaskit/popup": "^6.0.0",
|
|
67
64
|
"@testing-library/react": "^16.3.0",
|
|
68
65
|
"react": "^19.2.0",
|
|
69
66
|
"react-dom": "^19.2.0",
|
|
@@ -120,9 +117,6 @@
|
|
|
120
117
|
"jira_invites_auto_tag_new_user_in_mentions_fg": {
|
|
121
118
|
"type": "boolean"
|
|
122
119
|
},
|
|
123
|
-
"inline_invite_from_mentions_kill_switch": {
|
|
124
|
-
"type": "boolean"
|
|
125
|
-
},
|
|
126
120
|
"people-teams_migrate-user-profile-card": {
|
|
127
121
|
"type": "boolean"
|
|
128
122
|
},
|
|
@@ -1,148 +0,0 @@
|
|
|
1
|
-
/* InlineInvitePopupContainer.tsx generated by @compiled/babel-plugin v2.0.0 */
|
|
2
|
-
"use strict";
|
|
3
|
-
|
|
4
|
-
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
5
|
-
var _typeof = require("@babel/runtime/helpers/typeof");
|
|
6
|
-
Object.defineProperty(exports, "__esModule", {
|
|
7
|
-
value: true
|
|
8
|
-
});
|
|
9
|
-
exports.InlineInvitePopupContainer = void 0;
|
|
10
|
-
var _runtime = require("@compiled/react/runtime");
|
|
11
|
-
var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
|
|
12
|
-
var _react = _interopRequireWildcard(require("react"));
|
|
13
|
-
function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function _interopRequireWildcard(e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != _typeof(e) && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (var _t in e) "default" !== _t && {}.hasOwnProperty.call(e, _t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, _t)) && (i.get || i.set) ? o(f, _t, i) : f[_t] = e[_t]); return f; })(e, t); }
|
|
14
|
-
var findMentionRange = function findMentionRange(doc, localId) {
|
|
15
|
-
var range = null;
|
|
16
|
-
doc.descendants(function (node, pos) {
|
|
17
|
-
if (range) {
|
|
18
|
-
return false;
|
|
19
|
-
}
|
|
20
|
-
if (node.type.name === 'mention' && node.attrs.localId === localId) {
|
|
21
|
-
range = {
|
|
22
|
-
from: pos,
|
|
23
|
-
to: pos + node.nodeSize
|
|
24
|
-
};
|
|
25
|
-
return false;
|
|
26
|
-
}
|
|
27
|
-
return true;
|
|
28
|
-
});
|
|
29
|
-
return range;
|
|
30
|
-
};
|
|
31
|
-
var InlineInvitePopupContainer = exports.InlineInvitePopupContainer = function InlineInvitePopupContainer(_ref) {
|
|
32
|
-
var _api$mention2, _api$core3;
|
|
33
|
-
var mentionProvider = _ref.mentionProvider,
|
|
34
|
-
api = _ref.api,
|
|
35
|
-
editorView = _ref.editorView;
|
|
36
|
-
var _useState = (0, _react.useState)(null),
|
|
37
|
-
_useState2 = (0, _slicedToArray2.default)(_useState, 2),
|
|
38
|
-
provider = _useState2[0],
|
|
39
|
-
setProvider = _useState2[1];
|
|
40
|
-
var _useState3 = (0, _react.useState)(null),
|
|
41
|
-
_useState4 = (0, _slicedToArray2.default)(_useState3, 2),
|
|
42
|
-
anchorElement = _useState4[0],
|
|
43
|
-
setAnchorElement = _useState4[1];
|
|
44
|
-
var pendingMentionRef = (0, _react.useRef)(null);
|
|
45
|
-
(0, _react.useEffect)(function () {
|
|
46
|
-
if (!mentionProvider) {
|
|
47
|
-
return;
|
|
48
|
-
}
|
|
49
|
-
var isMounted = true;
|
|
50
|
-
mentionProvider.then(function (resolvedProvider) {
|
|
51
|
-
var _providerWithPopup$ge;
|
|
52
|
-
if (!isMounted) {
|
|
53
|
-
return;
|
|
54
|
-
}
|
|
55
|
-
var providerWithPopup = resolvedProvider;
|
|
56
|
-
var originalGetMentionDisabledState = (_providerWithPopup$ge = providerWithPopup.getMentionDisabledState) === null || _providerWithPopup$ge === void 0 ? void 0 : _providerWithPopup$ge.bind(providerWithPopup);
|
|
57
|
-
providerWithPopup.getMentionDisabledState = function (mention) {
|
|
58
|
-
var _pendingMentionRef$cu;
|
|
59
|
-
if (((_pendingMentionRef$cu = pendingMentionRef.current) === null || _pendingMentionRef$cu === void 0 ? void 0 : _pendingMentionRef$cu.localId) === mention.id) {
|
|
60
|
-
return {
|
|
61
|
-
disabled: true
|
|
62
|
-
};
|
|
63
|
-
}
|
|
64
|
-
return originalGetMentionDisabledState === null || originalGetMentionDisabledState === void 0 ? void 0 : originalGetMentionDisabledState(mention);
|
|
65
|
-
};
|
|
66
|
-
setProvider(providerWithPopup);
|
|
67
|
-
}).catch(function () {});
|
|
68
|
-
return function () {
|
|
69
|
-
isMounted = false;
|
|
70
|
-
setProvider(null);
|
|
71
|
-
};
|
|
72
|
-
}, [mentionProvider]);
|
|
73
|
-
var removePendingMention = (0, _react.useCallback)(function () {
|
|
74
|
-
var _api$core;
|
|
75
|
-
var pending = pendingMentionRef.current;
|
|
76
|
-
if (pending && api !== null && api !== void 0 && (_api$core = api.core) !== null && _api$core !== void 0 && (_api$core = _api$core.actions) !== null && _api$core !== void 0 && _api$core.execute) {
|
|
77
|
-
api.core.actions.execute(function (_ref2) {
|
|
78
|
-
var tr = _ref2.tr;
|
|
79
|
-
var range = findMentionRange(tr.doc, pending.localId);
|
|
80
|
-
return range ? tr.delete(range.from, range.to) : null;
|
|
81
|
-
});
|
|
82
|
-
}
|
|
83
|
-
pendingMentionRef.current = null;
|
|
84
|
-
setAnchorElement(null);
|
|
85
|
-
}, [api]);
|
|
86
|
-
var handleDismiss = (0, _react.useCallback)(function () {
|
|
87
|
-
removePendingMention();
|
|
88
|
-
}, [removePendingMention]);
|
|
89
|
-
var handleInviteComplete = (0, _react.useCallback)(function (result) {
|
|
90
|
-
var _result$invited$, _api$core2, _api$mention;
|
|
91
|
-
var pending = pendingMentionRef.current;
|
|
92
|
-
if (!pending) {
|
|
93
|
-
return;
|
|
94
|
-
}
|
|
95
|
-
var invitedUser = (_result$invited$ = result.invited[0]) !== null && _result$invited$ !== void 0 ? _result$invited$ : result.requested[0];
|
|
96
|
-
if (!invitedUser || !(api !== null && api !== void 0 && (_api$core2 = api.core) !== null && _api$core2 !== void 0 && (_api$core2 = _api$core2.actions) !== null && _api$core2 !== void 0 && _api$core2.execute) || !(api !== null && api !== void 0 && (_api$mention = api.mention) !== null && _api$mention !== void 0 && (_api$mention = _api$mention.commands) !== null && _api$mention !== void 0 && _api$mention.insertMention)) {
|
|
97
|
-
removePendingMention();
|
|
98
|
-
return;
|
|
99
|
-
}
|
|
100
|
-
var userId = invitedUser.id,
|
|
101
|
-
email = invitedUser.email;
|
|
102
|
-
var name = email.split('@')[0] || email;
|
|
103
|
-
api.core.actions.execute(function (_ref3) {
|
|
104
|
-
var tr = _ref3.tr;
|
|
105
|
-
var range = findMentionRange(tr.doc, pending.localId);
|
|
106
|
-
return range ? tr.delete(range.from, range.to) : null;
|
|
107
|
-
});
|
|
108
|
-
api.core.actions.execute(api.mention.commands.insertMention({
|
|
109
|
-
id: userId,
|
|
110
|
-
name: name,
|
|
111
|
-
userType: 'DEFAULT',
|
|
112
|
-
accessLevel: 'CONTAINER'
|
|
113
|
-
}));
|
|
114
|
-
pendingMentionRef.current = null;
|
|
115
|
-
setAnchorElement(null);
|
|
116
|
-
}, [api, removePendingMention]);
|
|
117
|
-
var handleReady = (0, _react.useCallback)(function (show) {
|
|
118
|
-
if (!provider) {
|
|
119
|
-
return;
|
|
120
|
-
}
|
|
121
|
-
if (show) {
|
|
122
|
-
provider.showInlineInvitePopup = function (email, localId) {
|
|
123
|
-
pendingMentionRef.current = {
|
|
124
|
-
email: email,
|
|
125
|
-
localId: localId
|
|
126
|
-
};
|
|
127
|
-
setTimeout(function () {
|
|
128
|
-
var range = findMentionRange(editorView.state.doc, localId);
|
|
129
|
-
var dom = range ? editorView.nodeDOM(range.from) : null;
|
|
130
|
-
setAnchorElement(dom instanceof HTMLElement ? dom : null);
|
|
131
|
-
show(email);
|
|
132
|
-
}, 0);
|
|
133
|
-
};
|
|
134
|
-
} else {
|
|
135
|
-
delete provider.showInlineInvitePopup;
|
|
136
|
-
}
|
|
137
|
-
}, [provider, editorView]);
|
|
138
|
-
if (!(provider !== null && provider !== void 0 && provider.InlineInvitePopup) || !(api !== null && api !== void 0 && (_api$mention2 = api.mention) !== null && _api$mention2 !== void 0 && (_api$mention2 = _api$mention2.commands) !== null && _api$mention2 !== void 0 && _api$mention2.insertMention) || !(api !== null && api !== void 0 && (_api$core3 = api.core) !== null && _api$core3 !== void 0 && (_api$core3 = _api$core3.actions) !== null && _api$core3 !== void 0 && _api$core3.execute)) {
|
|
139
|
-
return null;
|
|
140
|
-
}
|
|
141
|
-
var PopupComponent = provider.InlineInvitePopup;
|
|
142
|
-
return /*#__PURE__*/_react.default.createElement(PopupComponent, {
|
|
143
|
-
anchorElement: anchorElement,
|
|
144
|
-
onInviteComplete: handleInviteComplete,
|
|
145
|
-
onDismiss: handleDismiss,
|
|
146
|
-
onReady: handleReady
|
|
147
|
-
});
|
|
148
|
-
};
|
|
@@ -1,137 +0,0 @@
|
|
|
1
|
-
/* InlineInvitePopupContainer.tsx generated by @compiled/babel-plugin v2.0.0 */
|
|
2
|
-
import { ax, ix } from "@compiled/react/runtime";
|
|
3
|
-
import React, { useCallback, useEffect, useRef, useState } from 'react';
|
|
4
|
-
const findMentionRange = (doc, localId) => {
|
|
5
|
-
let range = null;
|
|
6
|
-
doc.descendants((node, pos) => {
|
|
7
|
-
if (range) {
|
|
8
|
-
return false;
|
|
9
|
-
}
|
|
10
|
-
if (node.type.name === 'mention' && node.attrs.localId === localId) {
|
|
11
|
-
range = {
|
|
12
|
-
from: pos,
|
|
13
|
-
to: pos + node.nodeSize
|
|
14
|
-
};
|
|
15
|
-
return false;
|
|
16
|
-
}
|
|
17
|
-
return true;
|
|
18
|
-
});
|
|
19
|
-
return range;
|
|
20
|
-
};
|
|
21
|
-
export const InlineInvitePopupContainer = ({
|
|
22
|
-
mentionProvider,
|
|
23
|
-
api,
|
|
24
|
-
editorView
|
|
25
|
-
}) => {
|
|
26
|
-
var _api$mention2, _api$mention2$command, _api$core3, _api$core3$actions;
|
|
27
|
-
const [provider, setProvider] = useState(null);
|
|
28
|
-
const [anchorElement, setAnchorElement] = useState(null);
|
|
29
|
-
const pendingMentionRef = useRef(null);
|
|
30
|
-
useEffect(() => {
|
|
31
|
-
if (!mentionProvider) {
|
|
32
|
-
return;
|
|
33
|
-
}
|
|
34
|
-
let isMounted = true;
|
|
35
|
-
mentionProvider.then(resolvedProvider => {
|
|
36
|
-
var _providerWithPopup$ge;
|
|
37
|
-
if (!isMounted) {
|
|
38
|
-
return;
|
|
39
|
-
}
|
|
40
|
-
const providerWithPopup = resolvedProvider;
|
|
41
|
-
const originalGetMentionDisabledState = (_providerWithPopup$ge = providerWithPopup.getMentionDisabledState) === null || _providerWithPopup$ge === void 0 ? void 0 : _providerWithPopup$ge.bind(providerWithPopup);
|
|
42
|
-
providerWithPopup.getMentionDisabledState = mention => {
|
|
43
|
-
var _pendingMentionRef$cu;
|
|
44
|
-
if (((_pendingMentionRef$cu = pendingMentionRef.current) === null || _pendingMentionRef$cu === void 0 ? void 0 : _pendingMentionRef$cu.localId) === mention.id) {
|
|
45
|
-
return {
|
|
46
|
-
disabled: true
|
|
47
|
-
};
|
|
48
|
-
}
|
|
49
|
-
return originalGetMentionDisabledState === null || originalGetMentionDisabledState === void 0 ? void 0 : originalGetMentionDisabledState(mention);
|
|
50
|
-
};
|
|
51
|
-
setProvider(providerWithPopup);
|
|
52
|
-
}).catch(() => {});
|
|
53
|
-
return () => {
|
|
54
|
-
isMounted = false;
|
|
55
|
-
setProvider(null);
|
|
56
|
-
};
|
|
57
|
-
}, [mentionProvider]);
|
|
58
|
-
const removePendingMention = useCallback(() => {
|
|
59
|
-
var _api$core, _api$core$actions;
|
|
60
|
-
const pending = pendingMentionRef.current;
|
|
61
|
-
if (pending && api !== null && api !== void 0 && (_api$core = api.core) !== null && _api$core !== void 0 && (_api$core$actions = _api$core.actions) !== null && _api$core$actions !== void 0 && _api$core$actions.execute) {
|
|
62
|
-
api.core.actions.execute(({
|
|
63
|
-
tr
|
|
64
|
-
}) => {
|
|
65
|
-
const range = findMentionRange(tr.doc, pending.localId);
|
|
66
|
-
return range ? tr.delete(range.from, range.to) : null;
|
|
67
|
-
});
|
|
68
|
-
}
|
|
69
|
-
pendingMentionRef.current = null;
|
|
70
|
-
setAnchorElement(null);
|
|
71
|
-
}, [api]);
|
|
72
|
-
const handleDismiss = useCallback(() => {
|
|
73
|
-
removePendingMention();
|
|
74
|
-
}, [removePendingMention]);
|
|
75
|
-
const handleInviteComplete = useCallback(result => {
|
|
76
|
-
var _result$invited$, _api$core2, _api$core2$actions, _api$mention, _api$mention$commands;
|
|
77
|
-
const pending = pendingMentionRef.current;
|
|
78
|
-
if (!pending) {
|
|
79
|
-
return;
|
|
80
|
-
}
|
|
81
|
-
const invitedUser = (_result$invited$ = result.invited[0]) !== null && _result$invited$ !== void 0 ? _result$invited$ : result.requested[0];
|
|
82
|
-
if (!invitedUser || !(api !== null && api !== void 0 && (_api$core2 = api.core) !== null && _api$core2 !== void 0 && (_api$core2$actions = _api$core2.actions) !== null && _api$core2$actions !== void 0 && _api$core2$actions.execute) || !(api !== null && api !== void 0 && (_api$mention = api.mention) !== null && _api$mention !== void 0 && (_api$mention$commands = _api$mention.commands) !== null && _api$mention$commands !== void 0 && _api$mention$commands.insertMention)) {
|
|
83
|
-
removePendingMention();
|
|
84
|
-
return;
|
|
85
|
-
}
|
|
86
|
-
const {
|
|
87
|
-
id: userId,
|
|
88
|
-
email
|
|
89
|
-
} = invitedUser;
|
|
90
|
-
const name = email.split('@')[0] || email;
|
|
91
|
-
api.core.actions.execute(({
|
|
92
|
-
tr
|
|
93
|
-
}) => {
|
|
94
|
-
const range = findMentionRange(tr.doc, pending.localId);
|
|
95
|
-
return range ? tr.delete(range.from, range.to) : null;
|
|
96
|
-
});
|
|
97
|
-
api.core.actions.execute(api.mention.commands.insertMention({
|
|
98
|
-
id: userId,
|
|
99
|
-
name,
|
|
100
|
-
userType: 'DEFAULT',
|
|
101
|
-
accessLevel: 'CONTAINER'
|
|
102
|
-
}));
|
|
103
|
-
pendingMentionRef.current = null;
|
|
104
|
-
setAnchorElement(null);
|
|
105
|
-
}, [api, removePendingMention]);
|
|
106
|
-
const handleReady = useCallback(show => {
|
|
107
|
-
if (!provider) {
|
|
108
|
-
return;
|
|
109
|
-
}
|
|
110
|
-
if (show) {
|
|
111
|
-
provider.showInlineInvitePopup = (email, localId) => {
|
|
112
|
-
pendingMentionRef.current = {
|
|
113
|
-
email,
|
|
114
|
-
localId
|
|
115
|
-
};
|
|
116
|
-
setTimeout(() => {
|
|
117
|
-
const range = findMentionRange(editorView.state.doc, localId);
|
|
118
|
-
const dom = range ? editorView.nodeDOM(range.from) : null;
|
|
119
|
-
setAnchorElement(dom instanceof HTMLElement ? dom : null);
|
|
120
|
-
show(email);
|
|
121
|
-
}, 0);
|
|
122
|
-
};
|
|
123
|
-
} else {
|
|
124
|
-
delete provider.showInlineInvitePopup;
|
|
125
|
-
}
|
|
126
|
-
}, [provider, editorView]);
|
|
127
|
-
if (!(provider !== null && provider !== void 0 && provider.InlineInvitePopup) || !(api !== null && api !== void 0 && (_api$mention2 = api.mention) !== null && _api$mention2 !== void 0 && (_api$mention2$command = _api$mention2.commands) !== null && _api$mention2$command !== void 0 && _api$mention2$command.insertMention) || !(api !== null && api !== void 0 && (_api$core3 = api.core) !== null && _api$core3 !== void 0 && (_api$core3$actions = _api$core3.actions) !== null && _api$core3$actions !== void 0 && _api$core3$actions.execute)) {
|
|
128
|
-
return null;
|
|
129
|
-
}
|
|
130
|
-
const PopupComponent = provider.InlineInvitePopup;
|
|
131
|
-
return /*#__PURE__*/React.createElement(PopupComponent, {
|
|
132
|
-
anchorElement: anchorElement,
|
|
133
|
-
onInviteComplete: handleInviteComplete,
|
|
134
|
-
onDismiss: handleDismiss,
|
|
135
|
-
onReady: handleReady
|
|
136
|
-
});
|
|
137
|
-
};
|
|
@@ -1,139 +0,0 @@
|
|
|
1
|
-
/* InlineInvitePopupContainer.tsx generated by @compiled/babel-plugin v2.0.0 */
|
|
2
|
-
import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
|
|
3
|
-
import { ax, ix } from "@compiled/react/runtime";
|
|
4
|
-
import React, { useCallback, useEffect, useRef, useState } from 'react';
|
|
5
|
-
var findMentionRange = function findMentionRange(doc, localId) {
|
|
6
|
-
var range = null;
|
|
7
|
-
doc.descendants(function (node, pos) {
|
|
8
|
-
if (range) {
|
|
9
|
-
return false;
|
|
10
|
-
}
|
|
11
|
-
if (node.type.name === 'mention' && node.attrs.localId === localId) {
|
|
12
|
-
range = {
|
|
13
|
-
from: pos,
|
|
14
|
-
to: pos + node.nodeSize
|
|
15
|
-
};
|
|
16
|
-
return false;
|
|
17
|
-
}
|
|
18
|
-
return true;
|
|
19
|
-
});
|
|
20
|
-
return range;
|
|
21
|
-
};
|
|
22
|
-
export var InlineInvitePopupContainer = function InlineInvitePopupContainer(_ref) {
|
|
23
|
-
var _api$mention2, _api$core3;
|
|
24
|
-
var mentionProvider = _ref.mentionProvider,
|
|
25
|
-
api = _ref.api,
|
|
26
|
-
editorView = _ref.editorView;
|
|
27
|
-
var _useState = useState(null),
|
|
28
|
-
_useState2 = _slicedToArray(_useState, 2),
|
|
29
|
-
provider = _useState2[0],
|
|
30
|
-
setProvider = _useState2[1];
|
|
31
|
-
var _useState3 = useState(null),
|
|
32
|
-
_useState4 = _slicedToArray(_useState3, 2),
|
|
33
|
-
anchorElement = _useState4[0],
|
|
34
|
-
setAnchorElement = _useState4[1];
|
|
35
|
-
var pendingMentionRef = useRef(null);
|
|
36
|
-
useEffect(function () {
|
|
37
|
-
if (!mentionProvider) {
|
|
38
|
-
return;
|
|
39
|
-
}
|
|
40
|
-
var isMounted = true;
|
|
41
|
-
mentionProvider.then(function (resolvedProvider) {
|
|
42
|
-
var _providerWithPopup$ge;
|
|
43
|
-
if (!isMounted) {
|
|
44
|
-
return;
|
|
45
|
-
}
|
|
46
|
-
var providerWithPopup = resolvedProvider;
|
|
47
|
-
var originalGetMentionDisabledState = (_providerWithPopup$ge = providerWithPopup.getMentionDisabledState) === null || _providerWithPopup$ge === void 0 ? void 0 : _providerWithPopup$ge.bind(providerWithPopup);
|
|
48
|
-
providerWithPopup.getMentionDisabledState = function (mention) {
|
|
49
|
-
var _pendingMentionRef$cu;
|
|
50
|
-
if (((_pendingMentionRef$cu = pendingMentionRef.current) === null || _pendingMentionRef$cu === void 0 ? void 0 : _pendingMentionRef$cu.localId) === mention.id) {
|
|
51
|
-
return {
|
|
52
|
-
disabled: true
|
|
53
|
-
};
|
|
54
|
-
}
|
|
55
|
-
return originalGetMentionDisabledState === null || originalGetMentionDisabledState === void 0 ? void 0 : originalGetMentionDisabledState(mention);
|
|
56
|
-
};
|
|
57
|
-
setProvider(providerWithPopup);
|
|
58
|
-
}).catch(function () {});
|
|
59
|
-
return function () {
|
|
60
|
-
isMounted = false;
|
|
61
|
-
setProvider(null);
|
|
62
|
-
};
|
|
63
|
-
}, [mentionProvider]);
|
|
64
|
-
var removePendingMention = useCallback(function () {
|
|
65
|
-
var _api$core;
|
|
66
|
-
var pending = pendingMentionRef.current;
|
|
67
|
-
if (pending && api !== null && api !== void 0 && (_api$core = api.core) !== null && _api$core !== void 0 && (_api$core = _api$core.actions) !== null && _api$core !== void 0 && _api$core.execute) {
|
|
68
|
-
api.core.actions.execute(function (_ref2) {
|
|
69
|
-
var tr = _ref2.tr;
|
|
70
|
-
var range = findMentionRange(tr.doc, pending.localId);
|
|
71
|
-
return range ? tr.delete(range.from, range.to) : null;
|
|
72
|
-
});
|
|
73
|
-
}
|
|
74
|
-
pendingMentionRef.current = null;
|
|
75
|
-
setAnchorElement(null);
|
|
76
|
-
}, [api]);
|
|
77
|
-
var handleDismiss = useCallback(function () {
|
|
78
|
-
removePendingMention();
|
|
79
|
-
}, [removePendingMention]);
|
|
80
|
-
var handleInviteComplete = useCallback(function (result) {
|
|
81
|
-
var _result$invited$, _api$core2, _api$mention;
|
|
82
|
-
var pending = pendingMentionRef.current;
|
|
83
|
-
if (!pending) {
|
|
84
|
-
return;
|
|
85
|
-
}
|
|
86
|
-
var invitedUser = (_result$invited$ = result.invited[0]) !== null && _result$invited$ !== void 0 ? _result$invited$ : result.requested[0];
|
|
87
|
-
if (!invitedUser || !(api !== null && api !== void 0 && (_api$core2 = api.core) !== null && _api$core2 !== void 0 && (_api$core2 = _api$core2.actions) !== null && _api$core2 !== void 0 && _api$core2.execute) || !(api !== null && api !== void 0 && (_api$mention = api.mention) !== null && _api$mention !== void 0 && (_api$mention = _api$mention.commands) !== null && _api$mention !== void 0 && _api$mention.insertMention)) {
|
|
88
|
-
removePendingMention();
|
|
89
|
-
return;
|
|
90
|
-
}
|
|
91
|
-
var userId = invitedUser.id,
|
|
92
|
-
email = invitedUser.email;
|
|
93
|
-
var name = email.split('@')[0] || email;
|
|
94
|
-
api.core.actions.execute(function (_ref3) {
|
|
95
|
-
var tr = _ref3.tr;
|
|
96
|
-
var range = findMentionRange(tr.doc, pending.localId);
|
|
97
|
-
return range ? tr.delete(range.from, range.to) : null;
|
|
98
|
-
});
|
|
99
|
-
api.core.actions.execute(api.mention.commands.insertMention({
|
|
100
|
-
id: userId,
|
|
101
|
-
name: name,
|
|
102
|
-
userType: 'DEFAULT',
|
|
103
|
-
accessLevel: 'CONTAINER'
|
|
104
|
-
}));
|
|
105
|
-
pendingMentionRef.current = null;
|
|
106
|
-
setAnchorElement(null);
|
|
107
|
-
}, [api, removePendingMention]);
|
|
108
|
-
var handleReady = useCallback(function (show) {
|
|
109
|
-
if (!provider) {
|
|
110
|
-
return;
|
|
111
|
-
}
|
|
112
|
-
if (show) {
|
|
113
|
-
provider.showInlineInvitePopup = function (email, localId) {
|
|
114
|
-
pendingMentionRef.current = {
|
|
115
|
-
email: email,
|
|
116
|
-
localId: localId
|
|
117
|
-
};
|
|
118
|
-
setTimeout(function () {
|
|
119
|
-
var range = findMentionRange(editorView.state.doc, localId);
|
|
120
|
-
var dom = range ? editorView.nodeDOM(range.from) : null;
|
|
121
|
-
setAnchorElement(dom instanceof HTMLElement ? dom : null);
|
|
122
|
-
show(email);
|
|
123
|
-
}, 0);
|
|
124
|
-
};
|
|
125
|
-
} else {
|
|
126
|
-
delete provider.showInlineInvitePopup;
|
|
127
|
-
}
|
|
128
|
-
}, [provider, editorView]);
|
|
129
|
-
if (!(provider !== null && provider !== void 0 && provider.InlineInvitePopup) || !(api !== null && api !== void 0 && (_api$mention2 = api.mention) !== null && _api$mention2 !== void 0 && (_api$mention2 = _api$mention2.commands) !== null && _api$mention2 !== void 0 && _api$mention2.insertMention) || !(api !== null && api !== void 0 && (_api$core3 = api.core) !== null && _api$core3 !== void 0 && (_api$core3 = _api$core3.actions) !== null && _api$core3 !== void 0 && _api$core3.execute)) {
|
|
130
|
-
return null;
|
|
131
|
-
}
|
|
132
|
-
var PopupComponent = provider.InlineInvitePopup;
|
|
133
|
-
return /*#__PURE__*/React.createElement(PopupComponent, {
|
|
134
|
-
anchorElement: anchorElement,
|
|
135
|
-
onInviteComplete: handleInviteComplete,
|
|
136
|
-
onDismiss: handleDismiss,
|
|
137
|
-
onReady: handleReady
|
|
138
|
-
});
|
|
139
|
-
};
|