@atlaskit/editor-plugin-mentions 12.2.9 → 12.2.11
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 +13 -0
- package/dist/cjs/nodeviews/profileCardRenderer.js +91 -72
- package/dist/cjs/pm-plugins/main.js +1 -1
- package/dist/cjs/ui/InviteItem/InviteItemWithEmailDomain.compiled.css +1 -1
- package/dist/cjs/ui/InviteItem/InviteItemWithEmailDomain.js +1 -1
- package/dist/cjs/ui/ProfileCardComponent.js +95 -36
- package/dist/es2019/nodeviews/profileCardRenderer.js +89 -74
- package/dist/es2019/pm-plugins/main.js +1 -1
- package/dist/es2019/ui/InviteItem/InviteItemWithEmailDomain.compiled.css +1 -1
- package/dist/es2019/ui/InviteItem/InviteItemWithEmailDomain.js +1 -1
- package/dist/es2019/ui/ProfileCardComponent.js +67 -17
- package/dist/esm/nodeviews/profileCardRenderer.js +92 -73
- package/dist/esm/pm-plugins/main.js +1 -1
- package/dist/esm/ui/InviteItem/InviteItemWithEmailDomain.compiled.css +1 -1
- package/dist/esm/ui/InviteItem/InviteItemWithEmailDomain.js +1 -1
- package/dist/esm/ui/ProfileCardComponent.js +91 -34
- package/dist/types/ui/ProfileCardComponent.d.ts +4 -0
- package/dist/types-ts4.5/ui/ProfileCardComponent.d.ts +4 -0
- package/package.json +4 -3
package/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,18 @@
|
|
|
1
1
|
# @atlaskit/editor-plugin-mentions
|
|
2
2
|
|
|
3
|
+
## 12.2.11
|
|
4
|
+
|
|
5
|
+
### Patch Changes
|
|
6
|
+
|
|
7
|
+
- [`8a065eba1d509`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/8a065eba1d509) -
|
|
8
|
+
Show agent profile cards for agent mentions in the editor.
|
|
9
|
+
|
|
10
|
+
## 12.2.10
|
|
11
|
+
|
|
12
|
+
### Patch Changes
|
|
13
|
+
|
|
14
|
+
- Updated dependencies
|
|
15
|
+
|
|
3
16
|
## 12.2.9
|
|
4
17
|
|
|
5
18
|
### Patch Changes
|
|
@@ -11,6 +11,7 @@ var _v = _interopRequireDefault(require("uuid/v4"));
|
|
|
11
11
|
var _state = require("@atlaskit/editor-prosemirror/state");
|
|
12
12
|
var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
|
|
13
13
|
var _navigation = require("@atlaskit/teams-app-config/navigation");
|
|
14
|
+
var _expVal = require("@atlaskit/tmp-editor-statsig/expVal");
|
|
14
15
|
var _ProfileCardComponent = require("../ui/ProfileCardComponent");
|
|
15
16
|
// eslint-disable-next-line @atlaskit/platform/prefer-crypto-random-uuid -- Use crypto.randomUUID instead
|
|
16
17
|
|
|
@@ -34,87 +35,105 @@ var profileCardRenderer = exports.profileCardRenderer = function profileCardRend
|
|
|
34
35
|
renderingProfileCard = false;
|
|
35
36
|
(_cleanupSelection = cleanupSelection) === null || _cleanupSelection === void 0 || _cleanupSelection();
|
|
36
37
|
};
|
|
38
|
+
var renderProfileCardPopup = function renderProfileCardPopup(renderProfileCard) {
|
|
39
|
+
var _api$selection;
|
|
40
|
+
if (!(dom instanceof HTMLElement) || renderingProfileCard) {
|
|
41
|
+
return;
|
|
42
|
+
}
|
|
43
|
+
var referenceElement = dom;
|
|
44
|
+
referenceElement.setAttribute('aria-expanded', 'true');
|
|
45
|
+
renderingProfileCard = true;
|
|
46
|
+
portalProviderAPI.render(function () {
|
|
47
|
+
return renderProfileCard(referenceElement);
|
|
48
|
+
}, referenceElement, key);
|
|
49
|
+
cleanupSelection = api === null || api === void 0 || (_api$selection = api.selection) === null || _api$selection === void 0 ? void 0 : _api$selection.sharedState.onChange(function (_ref2) {
|
|
50
|
+
var nextSharedState = _ref2.nextSharedState;
|
|
51
|
+
var selection = nextSharedState === null || nextSharedState === void 0 ? void 0 : nextSharedState.selection;
|
|
52
|
+
if (selection instanceof _state.NodeSelection ? selection.node === node : false) {
|
|
53
|
+
return;
|
|
54
|
+
}
|
|
55
|
+
removeProfileCard === null || removeProfileCard === void 0 || removeProfileCard();
|
|
56
|
+
});
|
|
57
|
+
};
|
|
58
|
+
var renderEditorProfileCard = function renderEditorProfileCard() {
|
|
59
|
+
renderProfileCardPopup(function (referenceElement) {
|
|
60
|
+
return /*#__PURE__*/_react.default.createElement(_ProfileCardComponent.ProfileCardComponent, {
|
|
61
|
+
activeMention: node,
|
|
62
|
+
profilecardProvider: options === null || options === void 0 ? void 0 : options.profilecardProvider,
|
|
63
|
+
dom: referenceElement,
|
|
64
|
+
closeComponent: removeProfileCard
|
|
65
|
+
});
|
|
66
|
+
});
|
|
67
|
+
};
|
|
68
|
+
var renderUserProfileCard = function renderUserProfileCard(_ref3) {
|
|
69
|
+
var userId = _ref3.userId,
|
|
70
|
+
cloudId = _ref3.cloudId,
|
|
71
|
+
renderUserMentionCard = _ref3.renderUserMentionCard;
|
|
72
|
+
if (!renderUserMentionCard) {
|
|
73
|
+
return false;
|
|
74
|
+
}
|
|
75
|
+
renderProfileCardPopup(function (referenceElement) {
|
|
76
|
+
return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, renderUserMentionCard({
|
|
77
|
+
userId: userId,
|
|
78
|
+
cloudId: cloudId,
|
|
79
|
+
children: null,
|
|
80
|
+
referenceElement: referenceElement
|
|
81
|
+
}));
|
|
82
|
+
});
|
|
83
|
+
return true;
|
|
84
|
+
};
|
|
85
|
+
var navigateToProfile = function navigateToProfile(userId, cloudId) {
|
|
86
|
+
if (navigatingToProfile) {
|
|
87
|
+
return;
|
|
88
|
+
}
|
|
89
|
+
navigatingToProfile = true;
|
|
90
|
+
var _navigateToTeamsApp = (0, _navigation.navigateToTeamsApp)({
|
|
91
|
+
type: 'USER',
|
|
92
|
+
payload: {
|
|
93
|
+
userId: userId
|
|
94
|
+
},
|
|
95
|
+
cloudId: cloudId
|
|
96
|
+
}),
|
|
97
|
+
href = _navigateToTeamsApp.href,
|
|
98
|
+
target = _navigateToTeamsApp.target;
|
|
99
|
+
window.open(href, target, 'noopener,noreferrer');
|
|
100
|
+
};
|
|
101
|
+
var renderDefaultProfileCard = function renderDefaultProfileCard(userId, provider) {
|
|
102
|
+
if (renderUserProfileCard({
|
|
103
|
+
userId: userId,
|
|
104
|
+
cloudId: provider.cloudId,
|
|
105
|
+
renderUserMentionCard: provider.renderUserMentionCard
|
|
106
|
+
})) {
|
|
107
|
+
return;
|
|
108
|
+
}
|
|
109
|
+
navigateToProfile(userId, provider.cloudId);
|
|
110
|
+
};
|
|
37
111
|
var listenerCleanup = (0, _bindEventListener.bind)(dom, {
|
|
38
112
|
type: 'click',
|
|
39
113
|
listener: function listener() {
|
|
40
114
|
if ((0, _platformFeatureFlags.fg)('people-teams_migrate-user-profile-card')) {
|
|
41
|
-
var _node$attrs;
|
|
115
|
+
var _node$attrs, _options$profilecardP;
|
|
42
116
|
var userId = (_node$attrs = node.attrs) === null || _node$attrs === void 0 ? void 0 : _node$attrs.id;
|
|
43
|
-
if (userId) {
|
|
44
|
-
|
|
45
|
-
navigatingToProfile = false;
|
|
46
|
-
options === null || options === void 0 || (_options$profilecardP = options.profilecardProvider) === null || _options$profilecardP === void 0 || _options$profilecardP.then(function (provider) {
|
|
47
|
-
// If a consumer (e.g. Confluence) has supplied a custom profile card
|
|
48
|
-
// renderer, render it into the portal instead of navigating away. The
|
|
49
|
-
// consumer owns its own popup/positioning behavior - subsequent clicks
|
|
50
|
-
// while the card is already open are no-ops here so the card's own
|
|
51
|
-
// outside-click / toggle logic can take over.
|
|
52
|
-
if (provider.renderUserMentionCard) {
|
|
53
|
-
if (dom instanceof HTMLElement && !renderingProfileCard) {
|
|
54
|
-
var _api$selection;
|
|
55
|
-
dom.setAttribute('aria-expanded', 'true');
|
|
56
|
-
renderingProfileCard = true;
|
|
57
|
-
portalProviderAPI.render(function () {
|
|
58
|
-
var _provider$renderUserM;
|
|
59
|
-
return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, (_provider$renderUserM = provider.renderUserMentionCard) === null || _provider$renderUserM === void 0 ? void 0 : _provider$renderUserM.call(provider, {
|
|
60
|
-
userId: userId,
|
|
61
|
-
cloudId: provider.cloudId,
|
|
62
|
-
children: null,
|
|
63
|
-
referenceElement: dom
|
|
64
|
-
}));
|
|
65
|
-
}, dom, key);
|
|
66
|
-
cleanupSelection = api === null || api === void 0 || (_api$selection = api.selection) === null || _api$selection === void 0 ? void 0 : _api$selection.sharedState.onChange(function (_ref2) {
|
|
67
|
-
var nextSharedState = _ref2.nextSharedState;
|
|
68
|
-
var selection = nextSharedState === null || nextSharedState === void 0 ? void 0 : nextSharedState.selection;
|
|
69
|
-
if (selection instanceof _state.NodeSelection ? selection.node === node : false) {
|
|
70
|
-
return;
|
|
71
|
-
}
|
|
72
|
-
removeProfileCard === null || removeProfileCard === void 0 || removeProfileCard();
|
|
73
|
-
});
|
|
74
|
-
}
|
|
75
|
-
return;
|
|
76
|
-
}
|
|
77
|
-
if (navigatingToProfile) {
|
|
78
|
-
return;
|
|
79
|
-
}
|
|
80
|
-
navigatingToProfile = true;
|
|
81
|
-
var _navigateToTeamsApp = (0, _navigation.navigateToTeamsApp)({
|
|
82
|
-
type: 'USER',
|
|
83
|
-
payload: {
|
|
84
|
-
userId: userId
|
|
85
|
-
},
|
|
86
|
-
cloudId: provider.cloudId
|
|
87
|
-
}),
|
|
88
|
-
href = _navigateToTeamsApp.href,
|
|
89
|
-
target = _navigateToTeamsApp.target;
|
|
90
|
-
window.open(href, target, 'noopener,noreferrer');
|
|
91
|
-
});
|
|
117
|
+
if (!userId) {
|
|
118
|
+
return;
|
|
92
119
|
}
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
renderingProfileCard = true;
|
|
99
|
-
portalProviderAPI.render(function () {
|
|
100
|
-
return /*#__PURE__*/_react.default.createElement(_ProfileCardComponent.ProfileCardComponent, {
|
|
101
|
-
activeMention: node,
|
|
102
|
-
profilecardProvider: options === null || options === void 0 ? void 0 : options.profilecardProvider,
|
|
103
|
-
dom: dom,
|
|
104
|
-
closeComponent: removeProfileCard
|
|
105
|
-
});
|
|
106
|
-
}, dom, key);
|
|
107
|
-
// If we change the selection we should also remove the profile card. The "deselectNode"
|
|
108
|
-
// should usually catch this, but it's possible (ie. on triple click) for this not to be called
|
|
109
|
-
// which means the profile card gets stuck open until you click + change selection
|
|
110
|
-
cleanupSelection = api === null || api === void 0 || (_api$selection2 = api.selection) === null || _api$selection2 === void 0 ? void 0 : _api$selection2.sharedState.onChange(function (_ref3) {
|
|
111
|
-
var nextSharedState = _ref3.nextSharedState;
|
|
112
|
-
var selection = nextSharedState === null || nextSharedState === void 0 ? void 0 : nextSharedState.selection;
|
|
113
|
-
if (selection instanceof _state.NodeSelection ? selection.node === node : false) {
|
|
120
|
+
navigatingToProfile = false;
|
|
121
|
+
options === null || options === void 0 || (_options$profilecardP = options.profilecardProvider) === null || _options$profilecardP === void 0 || _options$profilecardP.then(function (provider) {
|
|
122
|
+
var _node$attrs2;
|
|
123
|
+
if (!(0, _expVal.expVal)('platform_editor_agent_mentions', 'isEnabled', false)) {
|
|
124
|
+
renderDefaultProfileCard(userId, provider);
|
|
114
125
|
return;
|
|
115
126
|
}
|
|
116
|
-
|
|
127
|
+
if ((0, _ProfileCardComponent.isAgentMentionType)((_node$attrs2 = node.attrs) === null || _node$attrs2 === void 0 ? void 0 : _node$attrs2.userType)) {
|
|
128
|
+
renderEditorProfileCard();
|
|
129
|
+
} else {
|
|
130
|
+
renderDefaultProfileCard(userId, provider);
|
|
131
|
+
}
|
|
117
132
|
});
|
|
133
|
+
return;
|
|
134
|
+
}
|
|
135
|
+
if (options !== null && options !== void 0 && options.profilecardProvider) {
|
|
136
|
+
renderEditorProfileCard();
|
|
118
137
|
}
|
|
119
138
|
}
|
|
120
139
|
});
|
|
@@ -23,7 +23,7 @@ var ACTIONS = exports.ACTIONS = {
|
|
|
23
23
|
SET_PROVIDER: 'SET_PROVIDER'
|
|
24
24
|
};
|
|
25
25
|
var PACKAGE_NAME = "@atlaskit/editor-plugin-mentions";
|
|
26
|
-
var PACKAGE_VERSION = "12.2.
|
|
26
|
+
var PACKAGE_VERSION = "12.2.10";
|
|
27
27
|
var setProvider = function setProvider(provider) {
|
|
28
28
|
return function (state, dispatch) {
|
|
29
29
|
if (dispatch) {
|
|
@@ -32,7 +32,7 @@
|
|
|
32
32
|
._bfhk1j28{background-color:transparent}
|
|
33
33
|
._bfhksm61{background-color:var(--ds-background-neutral-subtle,#00000000)}
|
|
34
34
|
._ca0q12x7{padding-top:var(--ds-space-075,6px)}
|
|
35
|
-
.
|
|
35
|
+
._cun9187o:disabled{background-color:var(--ds-background-disabled,#0515240f)}
|
|
36
36
|
._i0dl1wug{flex-basis:auto}
|
|
37
37
|
._i0dlf1ug{flex-basis:0%}
|
|
38
38
|
._k48p1wq8{font-weight:var(--ds-font-weight-medium,500)}
|
|
@@ -47,7 +47,7 @@ var style = {
|
|
|
47
47
|
avatar: "_16jlidpf _1o9zkb7n _i0dl1wug _1e0c1txw _4cvr1h6o _1bah1h6o _kqswh2mm _1bsb14no _4t3i14no",
|
|
48
48
|
nameSection: "_16jlkb7n _1o9zkb7n _i0dlf1ug _1ul9idpf _18u0utpp _2hwxu2gc _syazazsu",
|
|
49
49
|
capitalize: "_1p1d1dk0",
|
|
50
|
-
inviteButton: "_2rko12b0 _11c8fhey _1h6d1l7x _1dqonqa1 _189ee4h9 _1e0c116y _4cvr1h6o _1bah1h6o _ca0q12x7 _u5f3utpp _n3td12x7 _19bvutpp _syazazsu _k48p1wq8 _4t3iviql _bfhksm61
|
|
50
|
+
inviteButton: "_2rko12b0 _11c8fhey _1h6d1l7x _1dqonqa1 _189ee4h9 _1e0c116y _4cvr1h6o _1bah1h6o _ca0q12x7 _u5f3utpp _n3td12x7 _19bvutpp _syazazsu _k48p1wq8 _4t3iviql _bfhksm61 _cun9187o _irr31dpa"
|
|
51
51
|
};
|
|
52
52
|
var VALID_OPTION = 'VALID';
|
|
53
53
|
var POTENTIAL_OPTION = 'POTENTIAL';
|
|
@@ -2,37 +2,56 @@
|
|
|
2
2
|
"use strict";
|
|
3
3
|
|
|
4
4
|
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
5
|
-
var _typeof = require("@babel/runtime/helpers/typeof");
|
|
6
5
|
Object.defineProperty(exports, "__esModule", {
|
|
7
6
|
value: true
|
|
8
7
|
});
|
|
9
8
|
exports.ProfileCardComponent = ProfileCardComponent;
|
|
10
|
-
exports.useProfileCardState = void 0;
|
|
9
|
+
exports.useProfileCardState = exports.isAgentMentionType = void 0;
|
|
11
10
|
require("./ProfileCardComponent.compiled.css");
|
|
12
11
|
var _react = _interopRequireWildcard(require("react"));
|
|
13
12
|
var React = _react;
|
|
14
13
|
var _runtime = require("@compiled/react/runtime");
|
|
15
14
|
var _regenerator = _interopRequireDefault(require("@babel/runtime/regenerator"));
|
|
15
|
+
var _typeof2 = _interopRequireDefault(require("@babel/runtime/helpers/typeof"));
|
|
16
16
|
var _asyncToGenerator2 = _interopRequireDefault(require("@babel/runtime/helpers/asyncToGenerator"));
|
|
17
17
|
var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
|
|
18
18
|
var _bindEventListener = require("bind-event-listener");
|
|
19
|
+
var _reactLoadable = _interopRequireDefault(require("react-loadable"));
|
|
19
20
|
var _user = require("@atlaskit/profilecard/user");
|
|
20
21
|
var _expValEquals = require("@atlaskit/tmp-editor-statsig/exp-val-equals");
|
|
22
|
+
var _expVal = require("@atlaskit/tmp-editor-statsig/expVal");
|
|
21
23
|
var _PopperWrapper = require("./PopperWrapper");
|
|
22
|
-
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" !=
|
|
24
|
+
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" != (0, _typeof2.default)(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 _t2 in e) "default" !== _t2 && {}.hasOwnProperty.call(e, _t2) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, _t2)) && (i.get || i.set) ? o(f, _t2, i) : f[_t2] = e[_t2]); return f; })(e, t); }
|
|
25
|
+
var AgentProfileCardResourcedLazy = (0, _reactLoadable.default)({
|
|
26
|
+
loader: function loader() {
|
|
27
|
+
return Promise.resolve().then(function () {
|
|
28
|
+
return _interopRequireWildcard(require( /* webpackChunkName: "@atlaskit-internal_editor-plugin-mentions-agent-profile-card-resourced" */
|
|
29
|
+
'@atlaskit/profilecard/agent-profile-card-resourced'));
|
|
30
|
+
}).then(function (_ref) {
|
|
31
|
+
var AgentProfileCardResourced = _ref.AgentProfileCardResourced;
|
|
32
|
+
return AgentProfileCardResourced;
|
|
33
|
+
});
|
|
34
|
+
},
|
|
35
|
+
loading: function loading() {
|
|
36
|
+
return null;
|
|
37
|
+
}
|
|
38
|
+
});
|
|
23
39
|
var styles = {
|
|
24
40
|
loadingStyles: "_2rko12b0 _16qs130s"
|
|
25
41
|
};
|
|
26
|
-
var LoadingWrapper = function LoadingWrapper(
|
|
27
|
-
var children =
|
|
28
|
-
isLoading =
|
|
42
|
+
var LoadingWrapper = function LoadingWrapper(_ref2) {
|
|
43
|
+
var children = _ref2.children,
|
|
44
|
+
isLoading = _ref2.isLoading;
|
|
29
45
|
return isLoading ? /*#__PURE__*/React.createElement("div", {
|
|
30
46
|
className: (0, _runtime.ax)([styles.loadingStyles])
|
|
31
47
|
}, children) : children;
|
|
32
48
|
};
|
|
33
|
-
var
|
|
34
|
-
|
|
35
|
-
|
|
49
|
+
var isAgentMentionType = exports.isAgentMentionType = function isAgentMentionType(userType) {
|
|
50
|
+
return userType === 'APP' || userType === 'AGENT';
|
|
51
|
+
};
|
|
52
|
+
var useProfileCardState = exports.useProfileCardState = function useProfileCardState(_ref3) {
|
|
53
|
+
var id = _ref3.id,
|
|
54
|
+
provider = _ref3.provider;
|
|
36
55
|
var _useState = (0, _react.useState)(),
|
|
37
56
|
_useState2 = (0, _slicedToArray2.default)(_useState, 2),
|
|
38
57
|
data = _useState2[0],
|
|
@@ -61,7 +80,7 @@ var useProfileCardState = exports.useProfileCardState = function useProfileCardS
|
|
|
61
80
|
// From: packages/people-and-teams/profilecard/src/components/User/ProfileCardTrigger.tsx
|
|
62
81
|
(0, _react.useEffect)(function () {
|
|
63
82
|
var fetchData = /*#__PURE__*/function () {
|
|
64
|
-
var
|
|
83
|
+
var _ref4 = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee() {
|
|
65
84
|
var _yield$Promise$all, _yield$Promise$all2, _data, reportingLines, shouldGiveKudos, _teamCentralBaseUrl, _t;
|
|
66
85
|
return _regenerator.default.wrap(function (_context) {
|
|
67
86
|
while (1) switch (_context.prev = _context.next) {
|
|
@@ -108,7 +127,7 @@ var useProfileCardState = exports.useProfileCardState = function useProfileCardS
|
|
|
108
127
|
}, _callee, null, [[2, 4, 5, 6]]);
|
|
109
128
|
}));
|
|
110
129
|
return function fetchData() {
|
|
111
|
-
return
|
|
130
|
+
return _ref4.apply(this, arguments);
|
|
112
131
|
};
|
|
113
132
|
}();
|
|
114
133
|
fetchData();
|
|
@@ -122,12 +141,16 @@ var useProfileCardState = exports.useProfileCardState = function useProfileCardS
|
|
|
122
141
|
hasError: hasError
|
|
123
142
|
};
|
|
124
143
|
};
|
|
125
|
-
|
|
126
|
-
|
|
127
|
-
|
|
128
|
-
|
|
129
|
-
|
|
130
|
-
|
|
144
|
+
|
|
145
|
+
/**
|
|
146
|
+
* Renders the profile card popup for an editor mention node.
|
|
147
|
+
*/
|
|
148
|
+
function ProfileCardComponent(_ref5) {
|
|
149
|
+
var _ref7;
|
|
150
|
+
var profilecardProvider = _ref5.profilecardProvider,
|
|
151
|
+
activeMention = _ref5.activeMention,
|
|
152
|
+
dom = _ref5.dom,
|
|
153
|
+
closeComponent = _ref5.closeComponent;
|
|
131
154
|
var _useState11 = (0, _react.useState)(undefined),
|
|
132
155
|
_useState12 = (0, _slicedToArray2.default)(_useState11, 2),
|
|
133
156
|
provider = _useState12[0],
|
|
@@ -137,10 +160,58 @@ function ProfileCardComponent(_ref4) {
|
|
|
137
160
|
setProvider(p);
|
|
138
161
|
});
|
|
139
162
|
}, [profilecardProvider]);
|
|
140
|
-
var
|
|
141
|
-
id =
|
|
142
|
-
text =
|
|
143
|
-
accessLevel =
|
|
163
|
+
var _ref6 = (_ref7 = activeMention.attrs) !== null && _ref7 !== void 0 ? _ref7 : {},
|
|
164
|
+
id = _ref6.id,
|
|
165
|
+
text = _ref6.text,
|
|
166
|
+
accessLevel = _ref6.accessLevel,
|
|
167
|
+
userType = _ref6.userType;
|
|
168
|
+
(0, _react.useEffect)(function () {
|
|
169
|
+
return (0, _bindEventListener.bind)(window, {
|
|
170
|
+
type: 'keydown',
|
|
171
|
+
listener: function listener(e) {
|
|
172
|
+
if (e.key === 'Escape') {
|
|
173
|
+
closeComponent();
|
|
174
|
+
}
|
|
175
|
+
}
|
|
176
|
+
});
|
|
177
|
+
});
|
|
178
|
+
if (!(0, _expVal.expVal)('platform_editor_agent_mentions', 'isEnabled', false)) {
|
|
179
|
+
return /*#__PURE__*/React.createElement(_PopperWrapper.Popup, {
|
|
180
|
+
referenceElement: dom
|
|
181
|
+
}, /*#__PURE__*/React.createElement(UserProfileCardContent, {
|
|
182
|
+
accessLevel: accessLevel,
|
|
183
|
+
id: id,
|
|
184
|
+
provider: provider,
|
|
185
|
+
text: text
|
|
186
|
+
}));
|
|
187
|
+
}
|
|
188
|
+
var isAgentMention = isAgentMentionType(userType);
|
|
189
|
+
return /*#__PURE__*/React.createElement(_PopperWrapper.Popup, {
|
|
190
|
+
referenceElement: dom
|
|
191
|
+
}, isAgentMention && provider && id ? /*#__PURE__*/React.createElement(AgentProfileCardContent, {
|
|
192
|
+
accountId: id,
|
|
193
|
+
provider: provider
|
|
194
|
+
}) : /*#__PURE__*/React.createElement(UserProfileCardContent, {
|
|
195
|
+
accessLevel: accessLevel,
|
|
196
|
+
id: id,
|
|
197
|
+
provider: provider,
|
|
198
|
+
text: text
|
|
199
|
+
}));
|
|
200
|
+
}
|
|
201
|
+
var AgentProfileCardContent = function AgentProfileCardContent(_ref8) {
|
|
202
|
+
var accountId = _ref8.accountId,
|
|
203
|
+
provider = _ref8.provider;
|
|
204
|
+
return /*#__PURE__*/React.createElement(AgentProfileCardResourcedLazy, {
|
|
205
|
+
accountId: accountId,
|
|
206
|
+
cloudId: provider.cloudId,
|
|
207
|
+
resourceClient: provider.resourceClient
|
|
208
|
+
});
|
|
209
|
+
};
|
|
210
|
+
var UserProfileCardContent = function UserProfileCardContent(_ref9) {
|
|
211
|
+
var accessLevel = _ref9.accessLevel,
|
|
212
|
+
id = _ref9.id,
|
|
213
|
+
provider = _ref9.provider,
|
|
214
|
+
text = _ref9.text;
|
|
144
215
|
var actions = (0, _react.useMemo)(function () {
|
|
145
216
|
return provider === null || provider === void 0 ? void 0 : provider.getActions(id, text !== null && text !== void 0 ? text : '', accessLevel);
|
|
146
217
|
}, [accessLevel, id, provider, text]);
|
|
@@ -154,19 +225,7 @@ function ProfileCardComponent(_ref4) {
|
|
|
154
225
|
teamCentralBaseUrl = _useProfileCardState.teamCentralBaseUrl,
|
|
155
226
|
isLoading = _useProfileCardState.isLoading,
|
|
156
227
|
hasError = _useProfileCardState.hasError;
|
|
157
|
-
|
|
158
|
-
return (0, _bindEventListener.bind)(window, {
|
|
159
|
-
type: 'keydown',
|
|
160
|
-
listener: function listener(e) {
|
|
161
|
-
if (e.key === 'Escape') {
|
|
162
|
-
closeComponent();
|
|
163
|
-
}
|
|
164
|
-
}
|
|
165
|
-
});
|
|
166
|
-
});
|
|
167
|
-
return /*#__PURE__*/React.createElement(_PopperWrapper.Popup, {
|
|
168
|
-
referenceElement: dom
|
|
169
|
-
}, /*#__PURE__*/React.createElement(LoadingWrapper, {
|
|
228
|
+
return /*#__PURE__*/React.createElement(LoadingWrapper, {
|
|
170
229
|
isLoading: isLoading
|
|
171
230
|
}, /*#__PURE__*/React.createElement(_user.ProfileCardLazy, {
|
|
172
231
|
avatarUrl: data === null || data === void 0 ? void 0 : data.avatarUrl,
|
|
@@ -191,5 +250,5 @@ function ProfileCardComponent(_ref4) {
|
|
|
191
250
|
isKudosEnabled: shouldShowGiveKudos,
|
|
192
251
|
teamCentralBaseUrl: teamCentralBaseUrl,
|
|
193
252
|
isRenderedInPortal: (0, _expValEquals.expValEquals)('editor_a11y_7152_profile_card_tab_order', 'isEnabled', true)
|
|
194
|
-
}))
|
|
195
|
-
}
|
|
253
|
+
}));
|
|
254
|
+
};
|
|
@@ -5,7 +5,8 @@ import uuid from 'uuid/v4';
|
|
|
5
5
|
import { NodeSelection } from '@atlaskit/editor-prosemirror/state';
|
|
6
6
|
import { fg } from '@atlaskit/platform-feature-flags';
|
|
7
7
|
import { navigateToTeamsApp } from '@atlaskit/teams-app-config/navigation';
|
|
8
|
-
import {
|
|
8
|
+
import { expVal } from '@atlaskit/tmp-editor-statsig/expVal';
|
|
9
|
+
import { isAgentMentionType, ProfileCardComponent } from '../ui/ProfileCardComponent';
|
|
9
10
|
export const profileCardRenderer = ({
|
|
10
11
|
dom,
|
|
11
12
|
options,
|
|
@@ -27,88 +28,102 @@ export const profileCardRenderer = ({
|
|
|
27
28
|
renderingProfileCard = false;
|
|
28
29
|
(_cleanupSelection = cleanupSelection) === null || _cleanupSelection === void 0 ? void 0 : _cleanupSelection();
|
|
29
30
|
};
|
|
31
|
+
const renderProfileCardPopup = renderProfileCard => {
|
|
32
|
+
var _api$selection;
|
|
33
|
+
if (!(dom instanceof HTMLElement) || renderingProfileCard) {
|
|
34
|
+
return;
|
|
35
|
+
}
|
|
36
|
+
const referenceElement = dom;
|
|
37
|
+
referenceElement.setAttribute('aria-expanded', 'true');
|
|
38
|
+
renderingProfileCard = true;
|
|
39
|
+
portalProviderAPI.render(() => renderProfileCard(referenceElement), referenceElement, key);
|
|
40
|
+
cleanupSelection = api === null || api === void 0 ? void 0 : (_api$selection = api.selection) === null || _api$selection === void 0 ? void 0 : _api$selection.sharedState.onChange(({
|
|
41
|
+
nextSharedState
|
|
42
|
+
}) => {
|
|
43
|
+
const selection = nextSharedState === null || nextSharedState === void 0 ? void 0 : nextSharedState.selection;
|
|
44
|
+
if (selection instanceof NodeSelection ? selection.node === node : false) {
|
|
45
|
+
return;
|
|
46
|
+
}
|
|
47
|
+
removeProfileCard === null || removeProfileCard === void 0 ? void 0 : removeProfileCard();
|
|
48
|
+
});
|
|
49
|
+
};
|
|
50
|
+
const renderEditorProfileCard = () => {
|
|
51
|
+
renderProfileCardPopup(referenceElement => /*#__PURE__*/React.createElement(ProfileCardComponent, {
|
|
52
|
+
activeMention: node,
|
|
53
|
+
profilecardProvider: options === null || options === void 0 ? void 0 : options.profilecardProvider,
|
|
54
|
+
dom: referenceElement,
|
|
55
|
+
closeComponent: removeProfileCard
|
|
56
|
+
}));
|
|
57
|
+
};
|
|
58
|
+
const renderUserProfileCard = ({
|
|
59
|
+
userId,
|
|
60
|
+
cloudId,
|
|
61
|
+
renderUserMentionCard
|
|
62
|
+
}) => {
|
|
63
|
+
if (!renderUserMentionCard) {
|
|
64
|
+
return false;
|
|
65
|
+
}
|
|
66
|
+
renderProfileCardPopup(referenceElement => /*#__PURE__*/React.createElement(React.Fragment, null, renderUserMentionCard({
|
|
67
|
+
userId,
|
|
68
|
+
cloudId,
|
|
69
|
+
children: null,
|
|
70
|
+
referenceElement
|
|
71
|
+
})));
|
|
72
|
+
return true;
|
|
73
|
+
};
|
|
74
|
+
const navigateToProfile = (userId, cloudId) => {
|
|
75
|
+
if (navigatingToProfile) {
|
|
76
|
+
return;
|
|
77
|
+
}
|
|
78
|
+
navigatingToProfile = true;
|
|
79
|
+
const {
|
|
80
|
+
href,
|
|
81
|
+
target
|
|
82
|
+
} = navigateToTeamsApp({
|
|
83
|
+
type: 'USER',
|
|
84
|
+
payload: {
|
|
85
|
+
userId
|
|
86
|
+
},
|
|
87
|
+
cloudId
|
|
88
|
+
});
|
|
89
|
+
window.open(href, target, 'noopener,noreferrer');
|
|
90
|
+
};
|
|
91
|
+
const renderDefaultProfileCard = (userId, provider) => {
|
|
92
|
+
if (renderUserProfileCard({
|
|
93
|
+
userId,
|
|
94
|
+
cloudId: provider.cloudId,
|
|
95
|
+
renderUserMentionCard: provider.renderUserMentionCard
|
|
96
|
+
})) {
|
|
97
|
+
return;
|
|
98
|
+
}
|
|
99
|
+
navigateToProfile(userId, provider.cloudId);
|
|
100
|
+
};
|
|
30
101
|
const listenerCleanup = bind(dom, {
|
|
31
102
|
type: 'click',
|
|
32
103
|
listener: () => {
|
|
33
104
|
if (fg('people-teams_migrate-user-profile-card')) {
|
|
34
|
-
var _node$attrs;
|
|
105
|
+
var _node$attrs, _options$profilecardP;
|
|
35
106
|
const userId = (_node$attrs = node.attrs) === null || _node$attrs === void 0 ? void 0 : _node$attrs.id;
|
|
36
|
-
if (userId) {
|
|
37
|
-
|
|
38
|
-
navigatingToProfile = false;
|
|
39
|
-
options === null || options === void 0 ? void 0 : (_options$profilecardP = options.profilecardProvider) === null || _options$profilecardP === void 0 ? void 0 : _options$profilecardP.then(provider => {
|
|
40
|
-
// If a consumer (e.g. Confluence) has supplied a custom profile card
|
|
41
|
-
// renderer, render it into the portal instead of navigating away. The
|
|
42
|
-
// consumer owns its own popup/positioning behavior - subsequent clicks
|
|
43
|
-
// while the card is already open are no-ops here so the card's own
|
|
44
|
-
// outside-click / toggle logic can take over.
|
|
45
|
-
if (provider.renderUserMentionCard) {
|
|
46
|
-
if (dom instanceof HTMLElement && !renderingProfileCard) {
|
|
47
|
-
var _api$selection;
|
|
48
|
-
dom.setAttribute('aria-expanded', 'true');
|
|
49
|
-
renderingProfileCard = true;
|
|
50
|
-
portalProviderAPI.render(() => {
|
|
51
|
-
var _provider$renderUserM;
|
|
52
|
-
return /*#__PURE__*/React.createElement(React.Fragment, null, (_provider$renderUserM = provider.renderUserMentionCard) === null || _provider$renderUserM === void 0 ? void 0 : _provider$renderUserM.call(provider, {
|
|
53
|
-
userId,
|
|
54
|
-
cloudId: provider.cloudId,
|
|
55
|
-
children: null,
|
|
56
|
-
referenceElement: dom
|
|
57
|
-
}));
|
|
58
|
-
}, dom, key);
|
|
59
|
-
cleanupSelection = api === null || api === void 0 ? void 0 : (_api$selection = api.selection) === null || _api$selection === void 0 ? void 0 : _api$selection.sharedState.onChange(({
|
|
60
|
-
nextSharedState
|
|
61
|
-
}) => {
|
|
62
|
-
const selection = nextSharedState === null || nextSharedState === void 0 ? void 0 : nextSharedState.selection;
|
|
63
|
-
if (selection instanceof NodeSelection ? selection.node === node : false) {
|
|
64
|
-
return;
|
|
65
|
-
}
|
|
66
|
-
removeProfileCard === null || removeProfileCard === void 0 ? void 0 : removeProfileCard();
|
|
67
|
-
});
|
|
68
|
-
}
|
|
69
|
-
return;
|
|
70
|
-
}
|
|
71
|
-
if (navigatingToProfile) {
|
|
72
|
-
return;
|
|
73
|
-
}
|
|
74
|
-
navigatingToProfile = true;
|
|
75
|
-
const {
|
|
76
|
-
href,
|
|
77
|
-
target
|
|
78
|
-
} = navigateToTeamsApp({
|
|
79
|
-
type: 'USER',
|
|
80
|
-
payload: {
|
|
81
|
-
userId
|
|
82
|
-
},
|
|
83
|
-
cloudId: provider.cloudId
|
|
84
|
-
});
|
|
85
|
-
window.open(href, target, 'noopener,noreferrer');
|
|
86
|
-
});
|
|
107
|
+
if (!userId) {
|
|
108
|
+
return;
|
|
87
109
|
}
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
renderingProfileCard = true;
|
|
94
|
-
portalProviderAPI.render(() => /*#__PURE__*/React.createElement(ProfileCardComponent, {
|
|
95
|
-
activeMention: node,
|
|
96
|
-
profilecardProvider: options === null || options === void 0 ? void 0 : options.profilecardProvider,
|
|
97
|
-
dom: dom,
|
|
98
|
-
closeComponent: removeProfileCard
|
|
99
|
-
}), dom, key);
|
|
100
|
-
// If we change the selection we should also remove the profile card. The "deselectNode"
|
|
101
|
-
// should usually catch this, but it's possible (ie. on triple click) for this not to be called
|
|
102
|
-
// which means the profile card gets stuck open until you click + change selection
|
|
103
|
-
cleanupSelection = api === null || api === void 0 ? void 0 : (_api$selection2 = api.selection) === null || _api$selection2 === void 0 ? void 0 : _api$selection2.sharedState.onChange(({
|
|
104
|
-
nextSharedState
|
|
105
|
-
}) => {
|
|
106
|
-
const selection = nextSharedState === null || nextSharedState === void 0 ? void 0 : nextSharedState.selection;
|
|
107
|
-
if (selection instanceof NodeSelection ? selection.node === node : false) {
|
|
110
|
+
navigatingToProfile = false;
|
|
111
|
+
options === null || options === void 0 ? void 0 : (_options$profilecardP = options.profilecardProvider) === null || _options$profilecardP === void 0 ? void 0 : _options$profilecardP.then(provider => {
|
|
112
|
+
var _node$attrs2;
|
|
113
|
+
if (!expVal('platform_editor_agent_mentions', 'isEnabled', false)) {
|
|
114
|
+
renderDefaultProfileCard(userId, provider);
|
|
108
115
|
return;
|
|
109
116
|
}
|
|
110
|
-
|
|
117
|
+
if (isAgentMentionType((_node$attrs2 = node.attrs) === null || _node$attrs2 === void 0 ? void 0 : _node$attrs2.userType)) {
|
|
118
|
+
renderEditorProfileCard();
|
|
119
|
+
} else {
|
|
120
|
+
renderDefaultProfileCard(userId, provider);
|
|
121
|
+
}
|
|
111
122
|
});
|
|
123
|
+
return;
|
|
124
|
+
}
|
|
125
|
+
if (options !== null && options !== void 0 && options.profilecardProvider) {
|
|
126
|
+
renderEditorProfileCard();
|
|
112
127
|
}
|
|
113
128
|
}
|
|
114
129
|
});
|
|
@@ -12,7 +12,7 @@ export const ACTIONS = {
|
|
|
12
12
|
SET_PROVIDER: 'SET_PROVIDER'
|
|
13
13
|
};
|
|
14
14
|
const PACKAGE_NAME = "@atlaskit/editor-plugin-mentions";
|
|
15
|
-
const PACKAGE_VERSION = "12.2.
|
|
15
|
+
const PACKAGE_VERSION = "12.2.10";
|
|
16
16
|
const setProvider = provider => (state, dispatch) => {
|
|
17
17
|
if (dispatch) {
|
|
18
18
|
dispatch(state.tr.setMeta(mentionPluginKey, {
|
|
@@ -32,7 +32,7 @@
|
|
|
32
32
|
._bfhk1j28{background-color:transparent}
|
|
33
33
|
._bfhksm61{background-color:var(--ds-background-neutral-subtle,#00000000)}
|
|
34
34
|
._ca0q12x7{padding-top:var(--ds-space-075,6px)}
|
|
35
|
-
.
|
|
35
|
+
._cun9187o:disabled{background-color:var(--ds-background-disabled,#0515240f)}
|
|
36
36
|
._i0dl1wug{flex-basis:auto}
|
|
37
37
|
._i0dlf1ug{flex-basis:0%}
|
|
38
38
|
._k48p1wq8{font-weight:var(--ds-font-weight-medium,500)}
|
|
@@ -38,7 +38,7 @@ const style = {
|
|
|
38
38
|
avatar: "_16jlidpf _1o9zkb7n _i0dl1wug _1e0c1txw _4cvr1h6o _1bah1h6o _kqswh2mm _1bsb14no _4t3i14no",
|
|
39
39
|
nameSection: "_16jlkb7n _1o9zkb7n _i0dlf1ug _1ul9idpf _18u0utpp _2hwxu2gc _syazazsu",
|
|
40
40
|
capitalize: "_1p1d1dk0",
|
|
41
|
-
inviteButton: "_2rko12b0 _11c8fhey _1h6d1l7x _1dqonqa1 _189ee4h9 _1e0c116y _4cvr1h6o _1bah1h6o _ca0q12x7 _u5f3utpp _n3td12x7 _19bvutpp _syazazsu _k48p1wq8 _4t3iviql _bfhksm61
|
|
41
|
+
inviteButton: "_2rko12b0 _11c8fhey _1h6d1l7x _1dqonqa1 _189ee4h9 _1e0c116y _4cvr1h6o _1bah1h6o _ca0q12x7 _u5f3utpp _n3td12x7 _19bvutpp _syazazsu _k48p1wq8 _4t3iviql _bfhksm61 _cun9187o _irr31dpa"
|
|
42
42
|
};
|
|
43
43
|
const VALID_OPTION = 'VALID';
|
|
44
44
|
const POTENTIAL_OPTION = 'POTENTIAL';
|
|
@@ -2,11 +2,20 @@
|
|
|
2
2
|
import "./ProfileCardComponent.compiled.css";
|
|
3
3
|
import * as React from 'react';
|
|
4
4
|
import { ax, ix } from "@compiled/react/runtime";
|
|
5
|
-
import { useEffect,
|
|
5
|
+
import { useEffect, useMemo, useState } from 'react';
|
|
6
6
|
import { bind } from 'bind-event-listener';
|
|
7
|
+
import Loadable from 'react-loadable';
|
|
7
8
|
import { ProfileCardLazy } from '@atlaskit/profilecard/user';
|
|
8
9
|
import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
|
|
10
|
+
import { expVal } from '@atlaskit/tmp-editor-statsig/expVal';
|
|
9
11
|
import { Popup } from './PopperWrapper';
|
|
12
|
+
const AgentProfileCardResourcedLazy = Loadable({
|
|
13
|
+
loader: () => import( /* webpackChunkName: "@atlaskit-internal_editor-plugin-mentions-agent-profile-card-resourced" */
|
|
14
|
+
'@atlaskit/profilecard/agent-profile-card-resourced').then(({
|
|
15
|
+
AgentProfileCardResourced
|
|
16
|
+
}) => AgentProfileCardResourced),
|
|
17
|
+
loading: () => null
|
|
18
|
+
});
|
|
10
19
|
const styles = {
|
|
11
20
|
loadingStyles: "_2rko12b0 _16qs130s"
|
|
12
21
|
};
|
|
@@ -16,6 +25,7 @@ const LoadingWrapper = ({
|
|
|
16
25
|
}) => isLoading ? /*#__PURE__*/React.createElement("div", {
|
|
17
26
|
className: ax([styles.loadingStyles])
|
|
18
27
|
}, children) : children;
|
|
28
|
+
export const isAgentMentionType = userType => userType === 'APP' || userType === 'AGENT';
|
|
19
29
|
export const useProfileCardState = ({
|
|
20
30
|
id,
|
|
21
31
|
provider
|
|
@@ -61,6 +71,10 @@ export const useProfileCardState = ({
|
|
|
61
71
|
hasError
|
|
62
72
|
};
|
|
63
73
|
};
|
|
74
|
+
|
|
75
|
+
/**
|
|
76
|
+
* Renders the profile card popup for an editor mention node.
|
|
77
|
+
*/
|
|
64
78
|
export function ProfileCardComponent({
|
|
65
79
|
profilecardProvider,
|
|
66
80
|
activeMention,
|
|
@@ -77,20 +91,9 @@ export function ProfileCardComponent({
|
|
|
77
91
|
const {
|
|
78
92
|
id,
|
|
79
93
|
text,
|
|
80
|
-
accessLevel
|
|
94
|
+
accessLevel,
|
|
95
|
+
userType
|
|
81
96
|
} = (_ref = activeMention.attrs) !== null && _ref !== void 0 ? _ref : {};
|
|
82
|
-
const actions = useMemo(() => provider === null || provider === void 0 ? void 0 : provider.getActions(id, text !== null && text !== void 0 ? text : '', accessLevel), [accessLevel, id, provider, text]);
|
|
83
|
-
const {
|
|
84
|
-
data,
|
|
85
|
-
reportingLinesData,
|
|
86
|
-
shouldShowGiveKudos,
|
|
87
|
-
teamCentralBaseUrl,
|
|
88
|
-
isLoading,
|
|
89
|
-
hasError
|
|
90
|
-
} = useProfileCardState({
|
|
91
|
-
id,
|
|
92
|
-
provider
|
|
93
|
-
});
|
|
94
97
|
useEffect(() => {
|
|
95
98
|
return bind(window, {
|
|
96
99
|
type: 'keydown',
|
|
@@ -101,9 +104,56 @@ export function ProfileCardComponent({
|
|
|
101
104
|
}
|
|
102
105
|
});
|
|
103
106
|
});
|
|
107
|
+
if (!expVal('platform_editor_agent_mentions', 'isEnabled', false)) {
|
|
108
|
+
return /*#__PURE__*/React.createElement(Popup, {
|
|
109
|
+
referenceElement: dom
|
|
110
|
+
}, /*#__PURE__*/React.createElement(UserProfileCardContent, {
|
|
111
|
+
accessLevel: accessLevel,
|
|
112
|
+
id: id,
|
|
113
|
+
provider: provider,
|
|
114
|
+
text: text
|
|
115
|
+
}));
|
|
116
|
+
}
|
|
117
|
+
const isAgentMention = isAgentMentionType(userType);
|
|
104
118
|
return /*#__PURE__*/React.createElement(Popup, {
|
|
105
119
|
referenceElement: dom
|
|
106
|
-
}, /*#__PURE__*/React.createElement(
|
|
120
|
+
}, isAgentMention && provider && id ? /*#__PURE__*/React.createElement(AgentProfileCardContent, {
|
|
121
|
+
accountId: id,
|
|
122
|
+
provider: provider
|
|
123
|
+
}) : /*#__PURE__*/React.createElement(UserProfileCardContent, {
|
|
124
|
+
accessLevel: accessLevel,
|
|
125
|
+
id: id,
|
|
126
|
+
provider: provider,
|
|
127
|
+
text: text
|
|
128
|
+
}));
|
|
129
|
+
}
|
|
130
|
+
const AgentProfileCardContent = ({
|
|
131
|
+
accountId,
|
|
132
|
+
provider
|
|
133
|
+
}) => /*#__PURE__*/React.createElement(AgentProfileCardResourcedLazy, {
|
|
134
|
+
accountId: accountId,
|
|
135
|
+
cloudId: provider.cloudId,
|
|
136
|
+
resourceClient: provider.resourceClient
|
|
137
|
+
});
|
|
138
|
+
const UserProfileCardContent = ({
|
|
139
|
+
accessLevel,
|
|
140
|
+
id,
|
|
141
|
+
provider,
|
|
142
|
+
text
|
|
143
|
+
}) => {
|
|
144
|
+
const actions = useMemo(() => provider === null || provider === void 0 ? void 0 : provider.getActions(id, text !== null && text !== void 0 ? text : '', accessLevel), [accessLevel, id, provider, text]);
|
|
145
|
+
const {
|
|
146
|
+
data,
|
|
147
|
+
reportingLinesData,
|
|
148
|
+
shouldShowGiveKudos,
|
|
149
|
+
teamCentralBaseUrl,
|
|
150
|
+
isLoading,
|
|
151
|
+
hasError
|
|
152
|
+
} = useProfileCardState({
|
|
153
|
+
id,
|
|
154
|
+
provider
|
|
155
|
+
});
|
|
156
|
+
return /*#__PURE__*/React.createElement(LoadingWrapper, {
|
|
107
157
|
isLoading: isLoading
|
|
108
158
|
}, /*#__PURE__*/React.createElement(ProfileCardLazy, {
|
|
109
159
|
avatarUrl: data === null || data === void 0 ? void 0 : data.avatarUrl,
|
|
@@ -128,5 +178,5 @@ export function ProfileCardComponent({
|
|
|
128
178
|
isKudosEnabled: shouldShowGiveKudos,
|
|
129
179
|
teamCentralBaseUrl: teamCentralBaseUrl,
|
|
130
180
|
isRenderedInPortal: expValEquals('editor_a11y_7152_profile_card_tab_order', 'isEnabled', true)
|
|
131
|
-
}))
|
|
132
|
-
}
|
|
181
|
+
}));
|
|
182
|
+
};
|
|
@@ -5,7 +5,8 @@ import uuid from 'uuid/v4';
|
|
|
5
5
|
import { NodeSelection } from '@atlaskit/editor-prosemirror/state';
|
|
6
6
|
import { fg } from '@atlaskit/platform-feature-flags';
|
|
7
7
|
import { navigateToTeamsApp } from '@atlaskit/teams-app-config/navigation';
|
|
8
|
-
import {
|
|
8
|
+
import { expVal } from '@atlaskit/tmp-editor-statsig/expVal';
|
|
9
|
+
import { isAgentMentionType, ProfileCardComponent } from '../ui/ProfileCardComponent';
|
|
9
10
|
export var profileCardRenderer = function profileCardRenderer(_ref) {
|
|
10
11
|
var dom = _ref.dom,
|
|
11
12
|
options = _ref.options,
|
|
@@ -26,87 +27,105 @@ export var profileCardRenderer = function profileCardRenderer(_ref) {
|
|
|
26
27
|
renderingProfileCard = false;
|
|
27
28
|
(_cleanupSelection = cleanupSelection) === null || _cleanupSelection === void 0 || _cleanupSelection();
|
|
28
29
|
};
|
|
30
|
+
var renderProfileCardPopup = function renderProfileCardPopup(renderProfileCard) {
|
|
31
|
+
var _api$selection;
|
|
32
|
+
if (!(dom instanceof HTMLElement) || renderingProfileCard) {
|
|
33
|
+
return;
|
|
34
|
+
}
|
|
35
|
+
var referenceElement = dom;
|
|
36
|
+
referenceElement.setAttribute('aria-expanded', 'true');
|
|
37
|
+
renderingProfileCard = true;
|
|
38
|
+
portalProviderAPI.render(function () {
|
|
39
|
+
return renderProfileCard(referenceElement);
|
|
40
|
+
}, referenceElement, key);
|
|
41
|
+
cleanupSelection = api === null || api === void 0 || (_api$selection = api.selection) === null || _api$selection === void 0 ? void 0 : _api$selection.sharedState.onChange(function (_ref2) {
|
|
42
|
+
var nextSharedState = _ref2.nextSharedState;
|
|
43
|
+
var selection = nextSharedState === null || nextSharedState === void 0 ? void 0 : nextSharedState.selection;
|
|
44
|
+
if (selection instanceof NodeSelection ? selection.node === node : false) {
|
|
45
|
+
return;
|
|
46
|
+
}
|
|
47
|
+
removeProfileCard === null || removeProfileCard === void 0 || removeProfileCard();
|
|
48
|
+
});
|
|
49
|
+
};
|
|
50
|
+
var renderEditorProfileCard = function renderEditorProfileCard() {
|
|
51
|
+
renderProfileCardPopup(function (referenceElement) {
|
|
52
|
+
return /*#__PURE__*/React.createElement(ProfileCardComponent, {
|
|
53
|
+
activeMention: node,
|
|
54
|
+
profilecardProvider: options === null || options === void 0 ? void 0 : options.profilecardProvider,
|
|
55
|
+
dom: referenceElement,
|
|
56
|
+
closeComponent: removeProfileCard
|
|
57
|
+
});
|
|
58
|
+
});
|
|
59
|
+
};
|
|
60
|
+
var renderUserProfileCard = function renderUserProfileCard(_ref3) {
|
|
61
|
+
var userId = _ref3.userId,
|
|
62
|
+
cloudId = _ref3.cloudId,
|
|
63
|
+
renderUserMentionCard = _ref3.renderUserMentionCard;
|
|
64
|
+
if (!renderUserMentionCard) {
|
|
65
|
+
return false;
|
|
66
|
+
}
|
|
67
|
+
renderProfileCardPopup(function (referenceElement) {
|
|
68
|
+
return /*#__PURE__*/React.createElement(React.Fragment, null, renderUserMentionCard({
|
|
69
|
+
userId: userId,
|
|
70
|
+
cloudId: cloudId,
|
|
71
|
+
children: null,
|
|
72
|
+
referenceElement: referenceElement
|
|
73
|
+
}));
|
|
74
|
+
});
|
|
75
|
+
return true;
|
|
76
|
+
};
|
|
77
|
+
var navigateToProfile = function navigateToProfile(userId, cloudId) {
|
|
78
|
+
if (navigatingToProfile) {
|
|
79
|
+
return;
|
|
80
|
+
}
|
|
81
|
+
navigatingToProfile = true;
|
|
82
|
+
var _navigateToTeamsApp = navigateToTeamsApp({
|
|
83
|
+
type: 'USER',
|
|
84
|
+
payload: {
|
|
85
|
+
userId: userId
|
|
86
|
+
},
|
|
87
|
+
cloudId: cloudId
|
|
88
|
+
}),
|
|
89
|
+
href = _navigateToTeamsApp.href,
|
|
90
|
+
target = _navigateToTeamsApp.target;
|
|
91
|
+
window.open(href, target, 'noopener,noreferrer');
|
|
92
|
+
};
|
|
93
|
+
var renderDefaultProfileCard = function renderDefaultProfileCard(userId, provider) {
|
|
94
|
+
if (renderUserProfileCard({
|
|
95
|
+
userId: userId,
|
|
96
|
+
cloudId: provider.cloudId,
|
|
97
|
+
renderUserMentionCard: provider.renderUserMentionCard
|
|
98
|
+
})) {
|
|
99
|
+
return;
|
|
100
|
+
}
|
|
101
|
+
navigateToProfile(userId, provider.cloudId);
|
|
102
|
+
};
|
|
29
103
|
var listenerCleanup = bind(dom, {
|
|
30
104
|
type: 'click',
|
|
31
105
|
listener: function listener() {
|
|
32
106
|
if (fg('people-teams_migrate-user-profile-card')) {
|
|
33
|
-
var _node$attrs;
|
|
107
|
+
var _node$attrs, _options$profilecardP;
|
|
34
108
|
var userId = (_node$attrs = node.attrs) === null || _node$attrs === void 0 ? void 0 : _node$attrs.id;
|
|
35
|
-
if (userId) {
|
|
36
|
-
|
|
37
|
-
navigatingToProfile = false;
|
|
38
|
-
options === null || options === void 0 || (_options$profilecardP = options.profilecardProvider) === null || _options$profilecardP === void 0 || _options$profilecardP.then(function (provider) {
|
|
39
|
-
// If a consumer (e.g. Confluence) has supplied a custom profile card
|
|
40
|
-
// renderer, render it into the portal instead of navigating away. The
|
|
41
|
-
// consumer owns its own popup/positioning behavior - subsequent clicks
|
|
42
|
-
// while the card is already open are no-ops here so the card's own
|
|
43
|
-
// outside-click / toggle logic can take over.
|
|
44
|
-
if (provider.renderUserMentionCard) {
|
|
45
|
-
if (dom instanceof HTMLElement && !renderingProfileCard) {
|
|
46
|
-
var _api$selection;
|
|
47
|
-
dom.setAttribute('aria-expanded', 'true');
|
|
48
|
-
renderingProfileCard = true;
|
|
49
|
-
portalProviderAPI.render(function () {
|
|
50
|
-
var _provider$renderUserM;
|
|
51
|
-
return /*#__PURE__*/React.createElement(React.Fragment, null, (_provider$renderUserM = provider.renderUserMentionCard) === null || _provider$renderUserM === void 0 ? void 0 : _provider$renderUserM.call(provider, {
|
|
52
|
-
userId: userId,
|
|
53
|
-
cloudId: provider.cloudId,
|
|
54
|
-
children: null,
|
|
55
|
-
referenceElement: dom
|
|
56
|
-
}));
|
|
57
|
-
}, dom, key);
|
|
58
|
-
cleanupSelection = api === null || api === void 0 || (_api$selection = api.selection) === null || _api$selection === void 0 ? void 0 : _api$selection.sharedState.onChange(function (_ref2) {
|
|
59
|
-
var nextSharedState = _ref2.nextSharedState;
|
|
60
|
-
var selection = nextSharedState === null || nextSharedState === void 0 ? void 0 : nextSharedState.selection;
|
|
61
|
-
if (selection instanceof NodeSelection ? selection.node === node : false) {
|
|
62
|
-
return;
|
|
63
|
-
}
|
|
64
|
-
removeProfileCard === null || removeProfileCard === void 0 || removeProfileCard();
|
|
65
|
-
});
|
|
66
|
-
}
|
|
67
|
-
return;
|
|
68
|
-
}
|
|
69
|
-
if (navigatingToProfile) {
|
|
70
|
-
return;
|
|
71
|
-
}
|
|
72
|
-
navigatingToProfile = true;
|
|
73
|
-
var _navigateToTeamsApp = navigateToTeamsApp({
|
|
74
|
-
type: 'USER',
|
|
75
|
-
payload: {
|
|
76
|
-
userId: userId
|
|
77
|
-
},
|
|
78
|
-
cloudId: provider.cloudId
|
|
79
|
-
}),
|
|
80
|
-
href = _navigateToTeamsApp.href,
|
|
81
|
-
target = _navigateToTeamsApp.target;
|
|
82
|
-
window.open(href, target, 'noopener,noreferrer');
|
|
83
|
-
});
|
|
109
|
+
if (!userId) {
|
|
110
|
+
return;
|
|
84
111
|
}
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
renderingProfileCard = true;
|
|
91
|
-
portalProviderAPI.render(function () {
|
|
92
|
-
return /*#__PURE__*/React.createElement(ProfileCardComponent, {
|
|
93
|
-
activeMention: node,
|
|
94
|
-
profilecardProvider: options === null || options === void 0 ? void 0 : options.profilecardProvider,
|
|
95
|
-
dom: dom,
|
|
96
|
-
closeComponent: removeProfileCard
|
|
97
|
-
});
|
|
98
|
-
}, dom, key);
|
|
99
|
-
// If we change the selection we should also remove the profile card. The "deselectNode"
|
|
100
|
-
// should usually catch this, but it's possible (ie. on triple click) for this not to be called
|
|
101
|
-
// which means the profile card gets stuck open until you click + change selection
|
|
102
|
-
cleanupSelection = api === null || api === void 0 || (_api$selection2 = api.selection) === null || _api$selection2 === void 0 ? void 0 : _api$selection2.sharedState.onChange(function (_ref3) {
|
|
103
|
-
var nextSharedState = _ref3.nextSharedState;
|
|
104
|
-
var selection = nextSharedState === null || nextSharedState === void 0 ? void 0 : nextSharedState.selection;
|
|
105
|
-
if (selection instanceof NodeSelection ? selection.node === node : false) {
|
|
112
|
+
navigatingToProfile = false;
|
|
113
|
+
options === null || options === void 0 || (_options$profilecardP = options.profilecardProvider) === null || _options$profilecardP === void 0 || _options$profilecardP.then(function (provider) {
|
|
114
|
+
var _node$attrs2;
|
|
115
|
+
if (!expVal('platform_editor_agent_mentions', 'isEnabled', false)) {
|
|
116
|
+
renderDefaultProfileCard(userId, provider);
|
|
106
117
|
return;
|
|
107
118
|
}
|
|
108
|
-
|
|
119
|
+
if (isAgentMentionType((_node$attrs2 = node.attrs) === null || _node$attrs2 === void 0 ? void 0 : _node$attrs2.userType)) {
|
|
120
|
+
renderEditorProfileCard();
|
|
121
|
+
} else {
|
|
122
|
+
renderDefaultProfileCard(userId, provider);
|
|
123
|
+
}
|
|
109
124
|
});
|
|
125
|
+
return;
|
|
126
|
+
}
|
|
127
|
+
if (options !== null && options !== void 0 && options.profilecardProvider) {
|
|
128
|
+
renderEditorProfileCard();
|
|
110
129
|
}
|
|
111
130
|
}
|
|
112
131
|
});
|
|
@@ -15,7 +15,7 @@ export var ACTIONS = {
|
|
|
15
15
|
SET_PROVIDER: 'SET_PROVIDER'
|
|
16
16
|
};
|
|
17
17
|
var PACKAGE_NAME = "@atlaskit/editor-plugin-mentions";
|
|
18
|
-
var PACKAGE_VERSION = "12.2.
|
|
18
|
+
var PACKAGE_VERSION = "12.2.10";
|
|
19
19
|
var setProvider = function setProvider(provider) {
|
|
20
20
|
return function (state, dispatch) {
|
|
21
21
|
if (dispatch) {
|
|
@@ -32,7 +32,7 @@
|
|
|
32
32
|
._bfhk1j28{background-color:transparent}
|
|
33
33
|
._bfhksm61{background-color:var(--ds-background-neutral-subtle,#00000000)}
|
|
34
34
|
._ca0q12x7{padding-top:var(--ds-space-075,6px)}
|
|
35
|
-
.
|
|
35
|
+
._cun9187o:disabled{background-color:var(--ds-background-disabled,#0515240f)}
|
|
36
36
|
._i0dl1wug{flex-basis:auto}
|
|
37
37
|
._i0dlf1ug{flex-basis:0%}
|
|
38
38
|
._k48p1wq8{font-weight:var(--ds-font-weight-medium,500)}
|
|
@@ -38,7 +38,7 @@ var style = {
|
|
|
38
38
|
avatar: "_16jlidpf _1o9zkb7n _i0dl1wug _1e0c1txw _4cvr1h6o _1bah1h6o _kqswh2mm _1bsb14no _4t3i14no",
|
|
39
39
|
nameSection: "_16jlkb7n _1o9zkb7n _i0dlf1ug _1ul9idpf _18u0utpp _2hwxu2gc _syazazsu",
|
|
40
40
|
capitalize: "_1p1d1dk0",
|
|
41
|
-
inviteButton: "_2rko12b0 _11c8fhey _1h6d1l7x _1dqonqa1 _189ee4h9 _1e0c116y _4cvr1h6o _1bah1h6o _ca0q12x7 _u5f3utpp _n3td12x7 _19bvutpp _syazazsu _k48p1wq8 _4t3iviql _bfhksm61
|
|
41
|
+
inviteButton: "_2rko12b0 _11c8fhey _1h6d1l7x _1dqonqa1 _189ee4h9 _1e0c116y _4cvr1h6o _1bah1h6o _ca0q12x7 _u5f3utpp _n3td12x7 _19bvutpp _syazazsu _k48p1wq8 _4t3iviql _bfhksm61 _cun9187o _irr31dpa"
|
|
42
42
|
};
|
|
43
43
|
var VALID_OPTION = 'VALID';
|
|
44
44
|
var POTENTIAL_OPTION = 'POTENTIAL';
|
|
@@ -5,24 +5,41 @@ import "./ProfileCardComponent.compiled.css";
|
|
|
5
5
|
import * as React from 'react';
|
|
6
6
|
import { ax, ix } from "@compiled/react/runtime";
|
|
7
7
|
import _regeneratorRuntime from "@babel/runtime/regenerator";
|
|
8
|
-
import { useEffect,
|
|
8
|
+
import { useEffect, useMemo, useState } from 'react';
|
|
9
9
|
import { bind } from 'bind-event-listener';
|
|
10
|
+
import Loadable from 'react-loadable';
|
|
10
11
|
import { ProfileCardLazy } from '@atlaskit/profilecard/user';
|
|
11
12
|
import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
|
|
13
|
+
import { expVal } from '@atlaskit/tmp-editor-statsig/expVal';
|
|
12
14
|
import { Popup } from './PopperWrapper';
|
|
15
|
+
var AgentProfileCardResourcedLazy = Loadable({
|
|
16
|
+
loader: function loader() {
|
|
17
|
+
return import( /* webpackChunkName: "@atlaskit-internal_editor-plugin-mentions-agent-profile-card-resourced" */
|
|
18
|
+
'@atlaskit/profilecard/agent-profile-card-resourced').then(function (_ref) {
|
|
19
|
+
var AgentProfileCardResourced = _ref.AgentProfileCardResourced;
|
|
20
|
+
return AgentProfileCardResourced;
|
|
21
|
+
});
|
|
22
|
+
},
|
|
23
|
+
loading: function loading() {
|
|
24
|
+
return null;
|
|
25
|
+
}
|
|
26
|
+
});
|
|
13
27
|
var styles = {
|
|
14
28
|
loadingStyles: "_2rko12b0 _16qs130s"
|
|
15
29
|
};
|
|
16
|
-
var LoadingWrapper = function LoadingWrapper(
|
|
17
|
-
var children =
|
|
18
|
-
isLoading =
|
|
30
|
+
var LoadingWrapper = function LoadingWrapper(_ref2) {
|
|
31
|
+
var children = _ref2.children,
|
|
32
|
+
isLoading = _ref2.isLoading;
|
|
19
33
|
return isLoading ? /*#__PURE__*/React.createElement("div", {
|
|
20
34
|
className: ax([styles.loadingStyles])
|
|
21
35
|
}, children) : children;
|
|
22
36
|
};
|
|
23
|
-
export var
|
|
24
|
-
|
|
25
|
-
|
|
37
|
+
export var isAgentMentionType = function isAgentMentionType(userType) {
|
|
38
|
+
return userType === 'APP' || userType === 'AGENT';
|
|
39
|
+
};
|
|
40
|
+
export var useProfileCardState = function useProfileCardState(_ref3) {
|
|
41
|
+
var id = _ref3.id,
|
|
42
|
+
provider = _ref3.provider;
|
|
26
43
|
var _useState = useState(),
|
|
27
44
|
_useState2 = _slicedToArray(_useState, 2),
|
|
28
45
|
data = _useState2[0],
|
|
@@ -51,7 +68,7 @@ export var useProfileCardState = function useProfileCardState(_ref2) {
|
|
|
51
68
|
// From: packages/people-and-teams/profilecard/src/components/User/ProfileCardTrigger.tsx
|
|
52
69
|
useEffect(function () {
|
|
53
70
|
var fetchData = /*#__PURE__*/function () {
|
|
54
|
-
var
|
|
71
|
+
var _ref4 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee() {
|
|
55
72
|
var _yield$Promise$all, _yield$Promise$all2, _data, reportingLines, shouldGiveKudos, _teamCentralBaseUrl, _t;
|
|
56
73
|
return _regeneratorRuntime.wrap(function (_context) {
|
|
57
74
|
while (1) switch (_context.prev = _context.next) {
|
|
@@ -98,7 +115,7 @@ export var useProfileCardState = function useProfileCardState(_ref2) {
|
|
|
98
115
|
}, _callee, null, [[2, 4, 5, 6]]);
|
|
99
116
|
}));
|
|
100
117
|
return function fetchData() {
|
|
101
|
-
return
|
|
118
|
+
return _ref4.apply(this, arguments);
|
|
102
119
|
};
|
|
103
120
|
}();
|
|
104
121
|
fetchData();
|
|
@@ -112,12 +129,16 @@ export var useProfileCardState = function useProfileCardState(_ref2) {
|
|
|
112
129
|
hasError: hasError
|
|
113
130
|
};
|
|
114
131
|
};
|
|
115
|
-
|
|
116
|
-
|
|
117
|
-
|
|
118
|
-
|
|
119
|
-
|
|
120
|
-
|
|
132
|
+
|
|
133
|
+
/**
|
|
134
|
+
* Renders the profile card popup for an editor mention node.
|
|
135
|
+
*/
|
|
136
|
+
export function ProfileCardComponent(_ref5) {
|
|
137
|
+
var _ref7;
|
|
138
|
+
var profilecardProvider = _ref5.profilecardProvider,
|
|
139
|
+
activeMention = _ref5.activeMention,
|
|
140
|
+
dom = _ref5.dom,
|
|
141
|
+
closeComponent = _ref5.closeComponent;
|
|
121
142
|
var _useState11 = useState(undefined),
|
|
122
143
|
_useState12 = _slicedToArray(_useState11, 2),
|
|
123
144
|
provider = _useState12[0],
|
|
@@ -127,10 +148,58 @@ export function ProfileCardComponent(_ref4) {
|
|
|
127
148
|
setProvider(p);
|
|
128
149
|
});
|
|
129
150
|
}, [profilecardProvider]);
|
|
130
|
-
var
|
|
131
|
-
id =
|
|
132
|
-
text =
|
|
133
|
-
accessLevel =
|
|
151
|
+
var _ref6 = (_ref7 = activeMention.attrs) !== null && _ref7 !== void 0 ? _ref7 : {},
|
|
152
|
+
id = _ref6.id,
|
|
153
|
+
text = _ref6.text,
|
|
154
|
+
accessLevel = _ref6.accessLevel,
|
|
155
|
+
userType = _ref6.userType;
|
|
156
|
+
useEffect(function () {
|
|
157
|
+
return bind(window, {
|
|
158
|
+
type: 'keydown',
|
|
159
|
+
listener: function listener(e) {
|
|
160
|
+
if (e.key === 'Escape') {
|
|
161
|
+
closeComponent();
|
|
162
|
+
}
|
|
163
|
+
}
|
|
164
|
+
});
|
|
165
|
+
});
|
|
166
|
+
if (!expVal('platform_editor_agent_mentions', 'isEnabled', false)) {
|
|
167
|
+
return /*#__PURE__*/React.createElement(Popup, {
|
|
168
|
+
referenceElement: dom
|
|
169
|
+
}, /*#__PURE__*/React.createElement(UserProfileCardContent, {
|
|
170
|
+
accessLevel: accessLevel,
|
|
171
|
+
id: id,
|
|
172
|
+
provider: provider,
|
|
173
|
+
text: text
|
|
174
|
+
}));
|
|
175
|
+
}
|
|
176
|
+
var isAgentMention = isAgentMentionType(userType);
|
|
177
|
+
return /*#__PURE__*/React.createElement(Popup, {
|
|
178
|
+
referenceElement: dom
|
|
179
|
+
}, isAgentMention && provider && id ? /*#__PURE__*/React.createElement(AgentProfileCardContent, {
|
|
180
|
+
accountId: id,
|
|
181
|
+
provider: provider
|
|
182
|
+
}) : /*#__PURE__*/React.createElement(UserProfileCardContent, {
|
|
183
|
+
accessLevel: accessLevel,
|
|
184
|
+
id: id,
|
|
185
|
+
provider: provider,
|
|
186
|
+
text: text
|
|
187
|
+
}));
|
|
188
|
+
}
|
|
189
|
+
var AgentProfileCardContent = function AgentProfileCardContent(_ref8) {
|
|
190
|
+
var accountId = _ref8.accountId,
|
|
191
|
+
provider = _ref8.provider;
|
|
192
|
+
return /*#__PURE__*/React.createElement(AgentProfileCardResourcedLazy, {
|
|
193
|
+
accountId: accountId,
|
|
194
|
+
cloudId: provider.cloudId,
|
|
195
|
+
resourceClient: provider.resourceClient
|
|
196
|
+
});
|
|
197
|
+
};
|
|
198
|
+
var UserProfileCardContent = function UserProfileCardContent(_ref9) {
|
|
199
|
+
var accessLevel = _ref9.accessLevel,
|
|
200
|
+
id = _ref9.id,
|
|
201
|
+
provider = _ref9.provider,
|
|
202
|
+
text = _ref9.text;
|
|
134
203
|
var actions = useMemo(function () {
|
|
135
204
|
return provider === null || provider === void 0 ? void 0 : provider.getActions(id, text !== null && text !== void 0 ? text : '', accessLevel);
|
|
136
205
|
}, [accessLevel, id, provider, text]);
|
|
@@ -144,19 +213,7 @@ export function ProfileCardComponent(_ref4) {
|
|
|
144
213
|
teamCentralBaseUrl = _useProfileCardState.teamCentralBaseUrl,
|
|
145
214
|
isLoading = _useProfileCardState.isLoading,
|
|
146
215
|
hasError = _useProfileCardState.hasError;
|
|
147
|
-
|
|
148
|
-
return bind(window, {
|
|
149
|
-
type: 'keydown',
|
|
150
|
-
listener: function listener(e) {
|
|
151
|
-
if (e.key === 'Escape') {
|
|
152
|
-
closeComponent();
|
|
153
|
-
}
|
|
154
|
-
}
|
|
155
|
-
});
|
|
156
|
-
});
|
|
157
|
-
return /*#__PURE__*/React.createElement(Popup, {
|
|
158
|
-
referenceElement: dom
|
|
159
|
-
}, /*#__PURE__*/React.createElement(LoadingWrapper, {
|
|
216
|
+
return /*#__PURE__*/React.createElement(LoadingWrapper, {
|
|
160
217
|
isLoading: isLoading
|
|
161
218
|
}, /*#__PURE__*/React.createElement(ProfileCardLazy, {
|
|
162
219
|
avatarUrl: data === null || data === void 0 ? void 0 : data.avatarUrl,
|
|
@@ -181,5 +238,5 @@ export function ProfileCardComponent(_ref4) {
|
|
|
181
238
|
isKudosEnabled: shouldShowGiveKudos,
|
|
182
239
|
teamCentralBaseUrl: teamCentralBaseUrl,
|
|
183
240
|
isRenderedInPortal: expValEquals('editor_a11y_7152_profile_card_tab_order', 'isEnabled', true)
|
|
184
|
-
}))
|
|
185
|
-
}
|
|
241
|
+
}));
|
|
242
|
+
};
|
|
@@ -5,6 +5,7 @@ interface ProfileCardStateProps {
|
|
|
5
5
|
id: string | undefined;
|
|
6
6
|
provider: ProfilecardProvider | undefined;
|
|
7
7
|
}
|
|
8
|
+
export declare const isAgentMentionType: (userType: unknown) => boolean;
|
|
8
9
|
export declare const useProfileCardState: ({ id, provider, }: ProfileCardStateProps) => {
|
|
9
10
|
data: ProfileCardClientData | undefined;
|
|
10
11
|
hasError: boolean;
|
|
@@ -13,6 +14,9 @@ export declare const useProfileCardState: ({ id, provider, }: ProfileCardStatePr
|
|
|
13
14
|
shouldShowGiveKudos: boolean;
|
|
14
15
|
teamCentralBaseUrl: string | undefined;
|
|
15
16
|
};
|
|
17
|
+
/**
|
|
18
|
+
* Renders the profile card popup for an editor mention node.
|
|
19
|
+
*/
|
|
16
20
|
export declare function ProfileCardComponent({ profilecardProvider, activeMention, dom, closeComponent, }: {
|
|
17
21
|
activeMention: PMNode;
|
|
18
22
|
closeComponent: () => void;
|
|
@@ -5,6 +5,7 @@ interface ProfileCardStateProps {
|
|
|
5
5
|
id: string | undefined;
|
|
6
6
|
provider: ProfilecardProvider | undefined;
|
|
7
7
|
}
|
|
8
|
+
export declare const isAgentMentionType: (userType: unknown) => boolean;
|
|
8
9
|
export declare const useProfileCardState: ({ id, provider, }: ProfileCardStateProps) => {
|
|
9
10
|
data: ProfileCardClientData | undefined;
|
|
10
11
|
hasError: boolean;
|
|
@@ -13,6 +14,9 @@ export declare const useProfileCardState: ({ id, provider, }: ProfileCardStatePr
|
|
|
13
14
|
shouldShowGiveKudos: boolean;
|
|
14
15
|
teamCentralBaseUrl: string | undefined;
|
|
15
16
|
};
|
|
17
|
+
/**
|
|
18
|
+
* Renders the profile card popup for an editor mention node.
|
|
19
|
+
*/
|
|
16
20
|
export declare function ProfileCardComponent({ profilecardProvider, activeMention, dom, closeComponent, }: {
|
|
17
21
|
activeMention: PMNode;
|
|
18
22
|
closeComponent: () => void;
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@atlaskit/editor-plugin-mentions",
|
|
3
|
-
"version": "12.2.
|
|
3
|
+
"version": "12.2.11",
|
|
4
4
|
"description": "Mentions plugin for @atlaskit/editor-core",
|
|
5
5
|
"author": "Atlassian Pty Ltd",
|
|
6
6
|
"license": "Apache-2.0",
|
|
@@ -48,13 +48,14 @@
|
|
|
48
48
|
"@atlaskit/profilecard": "^25.7.0",
|
|
49
49
|
"@atlaskit/teams-app-config": "^1.12.0",
|
|
50
50
|
"@atlaskit/theme": "^25.0.0",
|
|
51
|
-
"@atlaskit/tmp-editor-statsig": "^
|
|
52
|
-
"@atlaskit/tokens": "^13.
|
|
51
|
+
"@atlaskit/tmp-editor-statsig": "^85.0.0",
|
|
52
|
+
"@atlaskit/tokens": "^13.1.0",
|
|
53
53
|
"@atlaskit/user-picker": "^12.1.0",
|
|
54
54
|
"@babel/runtime": "^7.0.0",
|
|
55
55
|
"@compiled/react": "^0.20.0",
|
|
56
56
|
"bind-event-listener": "^3.0.0",
|
|
57
57
|
"focus-trap": "^2.4.5",
|
|
58
|
+
"react-loadable": "^5.1.0",
|
|
58
59
|
"uuid": "^3.1.0"
|
|
59
60
|
},
|
|
60
61
|
"peerDependencies": {
|