@atlaskit/editor-common 100.1.0 → 100.1.2
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 +21 -0
- package/dist/cjs/extensibility/ExtensionComponent.js +72 -374
- package/dist/cjs/monitoring/error.js +1 -1
- package/dist/cjs/ui/DropList/index.js +1 -1
- package/dist/cjs/ui/Mention/index.js +1 -13
- package/dist/cjs/ui/Mention/mention-with-providers.js +2 -105
- package/dist/cjs/ui-menu/DropdownMenu/index.js +1 -1
- package/dist/cjs/utils/editor-core-utils.js +6 -1
- package/dist/es2019/extensibility/ExtensionComponent.js +7 -287
- package/dist/es2019/monitoring/error.js +1 -1
- package/dist/es2019/ui/DropList/index.js +1 -1
- package/dist/es2019/ui/Mention/index.js +2 -14
- package/dist/es2019/ui/Mention/mention-with-providers.js +2 -83
- package/dist/es2019/ui-menu/DropdownMenu/index.js +3 -1
- package/dist/es2019/utils/editor-core-utils.js +6 -1
- package/dist/esm/extensibility/ExtensionComponent.js +69 -372
- package/dist/esm/monitoring/error.js +1 -1
- package/dist/esm/ui/DropList/index.js +1 -1
- package/dist/esm/ui/Mention/index.js +2 -14
- package/dist/esm/ui/Mention/mention-with-providers.js +2 -105
- package/dist/esm/ui-menu/DropdownMenu/index.js +3 -1
- package/dist/esm/utils/editor-core-utils.js +6 -1
- package/dist/types/extensibility/ExtensionComponent.d.ts +1 -29
- package/dist/types/ui/Mention/mention-with-providers.d.ts +1 -8
- package/dist/types/ui-menu/DropdownMenu/index.d.ts +0 -4
- package/dist/types-ts4.5/extensibility/ExtensionComponent.d.ts +1 -29
- package/dist/types-ts4.5/ui/Mention/mention-with-providers.d.ts +1 -8
- package/dist/types-ts4.5/ui-menu/DropdownMenu/index.d.ts +0 -4
- package/package.json +9 -12
|
@@ -5,24 +5,14 @@ var _typeof = require("@babel/runtime/helpers/typeof");
|
|
|
5
5
|
Object.defineProperty(exports, "__esModule", {
|
|
6
6
|
value: true
|
|
7
7
|
});
|
|
8
|
-
exports.
|
|
9
|
-
var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
|
|
10
|
-
var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
|
|
11
|
-
var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
|
|
12
|
-
var _possibleConstructorReturn2 = _interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));
|
|
13
|
-
var _getPrototypeOf2 = _interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));
|
|
14
|
-
var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));
|
|
15
|
-
var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
|
|
8
|
+
exports.MentionWithProviders = void 0;
|
|
16
9
|
var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
|
|
17
10
|
var _react = _interopRequireWildcard(require("react"));
|
|
18
11
|
var _element = require("@atlaskit/mention/element");
|
|
19
12
|
var _mentionWithProfilecard = _interopRequireDefault(require("./mention-with-profilecard"));
|
|
20
13
|
function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
|
|
21
14
|
function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
|
|
22
|
-
function _callSuper(t, o, e) { return o = (0, _getPrototypeOf2.default)(o), (0, _possibleConstructorReturn2.default)(t, _isNativeReflectConstruct() ? Reflect.construct(o, e || [], (0, _getPrototypeOf2.default)(t).constructor) : o.apply(t, e)); }
|
|
23
|
-
function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); } catch (t) {} return (_isNativeReflectConstruct = function _isNativeReflectConstruct() { return !!t; })(); }
|
|
24
15
|
var GENERIC_USER_IDS = ['HipChat', 'all', 'here'];
|
|
25
|
-
var noop = function noop() {};
|
|
26
16
|
var MentionWithProviders = exports.MentionWithProviders = function MentionWithProviders(_ref) {
|
|
27
17
|
var accessLevel = _ref.accessLevel,
|
|
28
18
|
eventHandlers = _ref.eventHandlers,
|
|
@@ -72,97 +62,4 @@ var MentionWithProviders = exports.MentionWithProviders = function MentionWithPr
|
|
|
72
62
|
onMouseEnter: eventHandlers === null || eventHandlers === void 0 ? void 0 : eventHandlers.onMouseEnter,
|
|
73
63
|
onMouseLeave: eventHandlers === null || eventHandlers === void 0 ? void 0 : eventHandlers.onMouseLeave
|
|
74
64
|
});
|
|
75
|
-
};
|
|
76
|
-
|
|
77
|
-
// eslint-disable-next-line @repo/internal/react/no-class-components
|
|
78
|
-
var MentionWithProvidersOld = exports.MentionWithProvidersOld = /*#__PURE__*/function (_PureComponent) {
|
|
79
|
-
function MentionWithProvidersOld() {
|
|
80
|
-
var _this;
|
|
81
|
-
(0, _classCallCheck2.default)(this, MentionWithProvidersOld);
|
|
82
|
-
for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
|
|
83
|
-
args[_key] = arguments[_key];
|
|
84
|
-
}
|
|
85
|
-
_this = _callSuper(this, MentionWithProvidersOld, [].concat(args));
|
|
86
|
-
(0, _defineProperty2.default)(_this, "state", {
|
|
87
|
-
profilecardProvider: null
|
|
88
|
-
});
|
|
89
|
-
return _this;
|
|
90
|
-
}
|
|
91
|
-
(0, _inherits2.default)(MentionWithProvidersOld, _PureComponent);
|
|
92
|
-
return (0, _createClass2.default)(MentionWithProvidersOld, [{
|
|
93
|
-
key: "UNSAFE_componentWillMount",
|
|
94
|
-
value:
|
|
95
|
-
// Ignored via go/ees005
|
|
96
|
-
// eslint-disable-next-line react/no-unsafe
|
|
97
|
-
function UNSAFE_componentWillMount() {
|
|
98
|
-
this.updateProfilecardProvider(this.props);
|
|
99
|
-
}
|
|
100
|
-
|
|
101
|
-
// Ignored via go/ees005
|
|
102
|
-
// eslint-disable-next-line react/no-unsafe
|
|
103
|
-
}, {
|
|
104
|
-
key: "UNSAFE_componentWillReceiveProps",
|
|
105
|
-
value: function UNSAFE_componentWillReceiveProps(nextProps) {
|
|
106
|
-
if (nextProps.profilecardProvider !== this.props.profilecardProvider) {
|
|
107
|
-
this.updateProfilecardProvider(nextProps);
|
|
108
|
-
}
|
|
109
|
-
}
|
|
110
|
-
}, {
|
|
111
|
-
key: "updateProfilecardProvider",
|
|
112
|
-
value: function updateProfilecardProvider(props) {
|
|
113
|
-
var _this2 = this;
|
|
114
|
-
// We are not using async/await here to avoid having an intermediate Promise
|
|
115
|
-
// introduced by the transpiler.
|
|
116
|
-
// This will allow consumer to use a SynchronousPromise.resolve and avoid useless
|
|
117
|
-
// rerendering
|
|
118
|
-
if (props.profilecardProvider) {
|
|
119
|
-
props.profilecardProvider.then(function (profilecardProvider) {
|
|
120
|
-
_this2.setState({
|
|
121
|
-
profilecardProvider: profilecardProvider
|
|
122
|
-
});
|
|
123
|
-
}).catch(function () {
|
|
124
|
-
_this2.setState({
|
|
125
|
-
profilecardProvider: null
|
|
126
|
-
});
|
|
127
|
-
});
|
|
128
|
-
} else {
|
|
129
|
-
this.setState({
|
|
130
|
-
profilecardProvider: null
|
|
131
|
-
});
|
|
132
|
-
}
|
|
133
|
-
}
|
|
134
|
-
}, {
|
|
135
|
-
key: "render",
|
|
136
|
-
value: function render() {
|
|
137
|
-
var _this$props = this.props,
|
|
138
|
-
accessLevel = _this$props.accessLevel,
|
|
139
|
-
eventHandlers = _this$props.eventHandlers,
|
|
140
|
-
id = _this$props.id,
|
|
141
|
-
mentionProvider = _this$props.mentionProvider,
|
|
142
|
-
text = _this$props.text,
|
|
143
|
-
localId = _this$props.localId;
|
|
144
|
-
var profilecardProvider = this.state.profilecardProvider;
|
|
145
|
-
|
|
146
|
-
// Ignored via go/ees005
|
|
147
|
-
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
148
|
-
var actionHandlers = {};
|
|
149
|
-
['onClick', 'onMouseEnter', 'onMouseLeave'].forEach(function (handler) {
|
|
150
|
-
actionHandlers[handler] = eventHandlers && eventHandlers[handler] || noop;
|
|
151
|
-
});
|
|
152
|
-
var MentionComponent = profilecardProvider && GENERIC_USER_IDS.indexOf(id) === -1 ? _mentionWithProfilecard.default : _element.ResourcedMention;
|
|
153
|
-
return /*#__PURE__*/_react.default.createElement(MentionComponent, (0, _extends2.default)({
|
|
154
|
-
id: id,
|
|
155
|
-
text: text,
|
|
156
|
-
accessLevel: accessLevel,
|
|
157
|
-
localId: localId,
|
|
158
|
-
mentionProvider: mentionProvider
|
|
159
|
-
// Ignored via go/ees005
|
|
160
|
-
// eslint-disable-next-line @typescript-eslint/no-non-null-assertion
|
|
161
|
-
,
|
|
162
|
-
profilecardProvider: profilecardProvider
|
|
163
|
-
// Ignored via go/ees005
|
|
164
|
-
// eslint-disable-next-line react/jsx-props-no-spreading
|
|
165
|
-
}, actionHandlers));
|
|
166
|
-
}
|
|
167
|
-
}]);
|
|
168
|
-
}(_react.PureComponent);
|
|
65
|
+
};
|
|
@@ -61,7 +61,7 @@ var buttonStyles = function buttonStyles(isActive, submenuActive) {
|
|
|
61
61
|
* Hack for item to imitate old dropdown-menu selected styles
|
|
62
62
|
*/
|
|
63
63
|
// eslint-disable-next-line @atlaskit/design-system/no-css-tagged-template-expression -- needs manual remediation
|
|
64
|
-
return (0, _react2.css)(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n\t\t\t> span,\n\t\t\t> span:hover,\n\t\t\t> span:active {\n\t\t\t\tbackground: ", ";\n\t\t\t\tcolor: ", ";\n\t\t\t}\n\t\t\t:focus > span[aria-disabled='false'] {\n\t\t\t\t", ";\n\t\t\t}\n\t\t\t:focus-visible,\n\t\t\t:focus-visible > span[aria-disabled='false'] {\n\t\t\t\toutline: none;\n\t\t\t}\n\t\t"])), "var(--ds-background-selected, #6c798f)", "var(--ds-text, #
|
|
64
|
+
return (0, _react2.css)(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n\t\t\t> span,\n\t\t\t> span:hover,\n\t\t\t> span:active {\n\t\t\t\tbackground: ", ";\n\t\t\t\tcolor: ", ";\n\t\t\t}\n\t\t\t:focus > span[aria-disabled='false'] {\n\t\t\t\t", ";\n\t\t\t}\n\t\t\t:focus-visible,\n\t\t\t:focus-visible > span[aria-disabled='false'] {\n\t\t\t\toutline: none;\n\t\t\t}\n\t\t"])), "var(--ds-background-selected, #6c798f)", "var(--ds-text-selected, #0C66E4)", focusedMenuItemStyle);
|
|
65
65
|
} else {
|
|
66
66
|
// eslint-disable-next-line @atlaskit/design-system/no-css-tagged-template-expression -- needs manual remediation
|
|
67
67
|
return (0, _react2.css)(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["\n\t\t\t> span:hover[aria-disabled='false'] {\n\t\t\t\tcolor: ", ";\n\t\t\t\tbackground-color: ", ";\n\t\t\t}\n\t\t\t", "\n\t\t\t> span[aria-disabled='true'] {\n\t\t\t\tcolor: ", ";\n\t\t\t}\n\t\t\t:focus > span[aria-disabled='false'] {\n\t\t\t\t", ";\n\t\t\t}\n\t\t\t:focus-visible,\n\t\t\t:focus-visible > span[aria-disabled='false'] {\n\t\t\t\toutline: none;\n\t\t\t}\n\t\t"])), "var(--ds-text, #172B4D)", "var(--ds-background-neutral-subtle-hovered, rgb(244, 245, 247))", !submenuActive && "\n\t\t\t\t\t> span:active[aria-disabled='false'] {\n\t\t\t\t\t\tbackground-color: ".concat("var(--ds-background-neutral-subtle-pressed, rgb(179, 212, 255))", ";\n\t\t\t\t\t}"), "var(--ds-text-disabled, #091E424F)", focusedMenuItemStyle); // The default focus-visible style is removed to ensure consistency across browsers
|
|
@@ -20,6 +20,7 @@ var _state = require("@atlaskit/editor-prosemirror/state");
|
|
|
20
20
|
var _transform = require("@atlaskit/editor-prosemirror/transform");
|
|
21
21
|
var _utils = require("@atlaskit/editor-prosemirror/utils");
|
|
22
22
|
var _cellSelection = require("@atlaskit/editor-tables/cell-selection");
|
|
23
|
+
var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
|
|
23
24
|
var _dom = require("./dom");
|
|
24
25
|
/**
|
|
25
26
|
* Checks if node is an empty paragraph.
|
|
@@ -64,7 +65,11 @@ var isTextSelection = exports.isTextSelection = function isTextSelection(selecti
|
|
|
64
65
|
return selection instanceof _state.TextSelection;
|
|
65
66
|
};
|
|
66
67
|
var isElementInTableCell = exports.isElementInTableCell = function isElementInTableCell(element) {
|
|
67
|
-
|
|
68
|
+
if ((0, _platformFeatureFlags.fg)('platform_editor_nested_tables_column_drag_fix')) {
|
|
69
|
+
return (0, _dom.closest)(element, 'td, th');
|
|
70
|
+
} else {
|
|
71
|
+
return (0, _dom.closest)(element, 'td') || (0, _dom.closest)(element, 'th');
|
|
72
|
+
}
|
|
68
73
|
};
|
|
69
74
|
var isLastItemMediaGroup = exports.isLastItemMediaGroup = function isLastItemMediaGroup(node) {
|
|
70
75
|
var content = node.content;
|
|
@@ -1,10 +1,9 @@
|
|
|
1
|
-
import _extends from "@babel/runtime/helpers/extends";
|
|
2
1
|
import _defineProperty from "@babel/runtime/helpers/defineProperty";
|
|
2
|
+
import _extends from "@babel/runtime/helpers/extends";
|
|
3
3
|
/* eslint-disable @repo/internal/react/no-class-components */
|
|
4
4
|
import React, { Component, useEffect, useLayoutEffect, useRef, useState } from 'react';
|
|
5
5
|
import memoizeOne from 'memoize-one';
|
|
6
6
|
import { NodeSelection } from '@atlaskit/editor-prosemirror/state';
|
|
7
|
-
import { fg } from '@atlaskit/platform-feature-flags';
|
|
8
7
|
import { getExtensionModuleNodePrivateProps, getNodeRenderer } from '../extensions';
|
|
9
8
|
import { getExtensionRenderer, nodeToJSON, toJSON } from '../utils';
|
|
10
9
|
import Extension from './Extension/Extension';
|
|
@@ -23,276 +22,7 @@ const getBodiedExtensionContent = node => {
|
|
|
23
22
|
});
|
|
24
23
|
return !!bodiedExtensionContent.length ? bodiedExtensionContent : node.attrs.text;
|
|
25
24
|
};
|
|
26
|
-
export
|
|
27
|
-
constructor(...args) {
|
|
28
|
-
super(...args);
|
|
29
|
-
_defineProperty(this, "privatePropsParsed", false);
|
|
30
|
-
_defineProperty(this, "state", {});
|
|
31
|
-
_defineProperty(this, "mounted", false);
|
|
32
|
-
// memoized to avoid rerender on extension state changes
|
|
33
|
-
_defineProperty(this, "getNodeRenderer", memoizeOne(getNodeRenderer));
|
|
34
|
-
_defineProperty(this, "getExtensionModuleNodePrivateProps", memoizeOne(getExtensionModuleNodePrivateProps));
|
|
35
|
-
_defineProperty(this, "setIsNodeHovered", isHovered => {
|
|
36
|
-
// Don't want to show hover interactions for live page view mode
|
|
37
|
-
if (!this.props.isLivePageViewMode) {
|
|
38
|
-
this.setState({
|
|
39
|
-
isNodeHovered: isHovered
|
|
40
|
-
});
|
|
41
|
-
}
|
|
42
|
-
});
|
|
43
|
-
_defineProperty(this, "setShowBodiedExtensionRendererView", showRendererView => {
|
|
44
|
-
this.setState({
|
|
45
|
-
showBodiedExtensionRendererView: showRendererView
|
|
46
|
-
});
|
|
47
|
-
});
|
|
48
|
-
// Ignored via go/ees005
|
|
49
|
-
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
50
|
-
_defineProperty(this, "setStateFromPromise", (stateKey, promise) => {
|
|
51
|
-
promise && promise.then(p => {
|
|
52
|
-
if (!this.mounted) {
|
|
53
|
-
return;
|
|
54
|
-
}
|
|
55
|
-
this.setState({
|
|
56
|
-
[stateKey]: p
|
|
57
|
-
});
|
|
58
|
-
});
|
|
59
|
-
});
|
|
60
|
-
/**
|
|
61
|
-
* Parses any private nodes once an extension provider is available.
|
|
62
|
-
*
|
|
63
|
-
* We do this separately from resolving a node renderer component since the
|
|
64
|
-
* private props come from extension provider, rather than an extension
|
|
65
|
-
* handler which only handles `render`/component concerns.
|
|
66
|
-
*/
|
|
67
|
-
_defineProperty(this, "parsePrivateNodePropsIfNeeded", async () => {
|
|
68
|
-
if (this.privatePropsParsed || !this.state.extensionProvider) {
|
|
69
|
-
return;
|
|
70
|
-
}
|
|
71
|
-
this.privatePropsParsed = true;
|
|
72
|
-
const {
|
|
73
|
-
extensionType,
|
|
74
|
-
extensionKey
|
|
75
|
-
} = this.props.node.attrs;
|
|
76
|
-
|
|
77
|
-
/**
|
|
78
|
-
* getExtensionModuleNodePrivateProps can throw if there are issues in the
|
|
79
|
-
* manifest
|
|
80
|
-
*/
|
|
81
|
-
try {
|
|
82
|
-
const privateProps = await this.getExtensionModuleNodePrivateProps(this.state.extensionProvider, extensionType, extensionKey);
|
|
83
|
-
this.setState({
|
|
84
|
-
_privateProps: privateProps
|
|
85
|
-
});
|
|
86
|
-
} catch (e) {
|
|
87
|
-
// eslint-disable-next-line no-console
|
|
88
|
-
console.error('Provided extension handler has thrown an error\n', e);
|
|
89
|
-
/** We don't want this error to block renderer */
|
|
90
|
-
/** We keep rendering the default content */
|
|
91
|
-
}
|
|
92
|
-
});
|
|
93
|
-
_defineProperty(this, "handleExtension", (pmNode, actions) => {
|
|
94
|
-
var _pmNode$marks, _pmNode$marks$find, _pmNode$marks$find$at;
|
|
95
|
-
const {
|
|
96
|
-
extensionHandlers,
|
|
97
|
-
editorView,
|
|
98
|
-
rendererExtensionHandlers
|
|
99
|
-
} = this.props;
|
|
100
|
-
const {
|
|
101
|
-
showBodiedExtensionRendererView
|
|
102
|
-
} = this.state; // State will only be true if the gate is on and meets requirements
|
|
103
|
-
const {
|
|
104
|
-
extensionType,
|
|
105
|
-
extensionKey,
|
|
106
|
-
parameters,
|
|
107
|
-
text
|
|
108
|
-
} = pmNode.attrs;
|
|
109
|
-
const isBodiedExtension = pmNode.type.name === 'bodiedExtension';
|
|
110
|
-
if (isBodiedExtension && !showBodiedExtensionRendererView) {
|
|
111
|
-
return;
|
|
112
|
-
}
|
|
113
|
-
const fragmentLocalId = pmNode === null || pmNode === void 0 ? void 0 : (_pmNode$marks = pmNode.marks) === null || _pmNode$marks === void 0 ? void 0 : (_pmNode$marks$find = _pmNode$marks.find(m => m.type.name === 'fragment')) === null || _pmNode$marks$find === void 0 ? void 0 : (_pmNode$marks$find$at = _pmNode$marks$find.attrs) === null || _pmNode$marks$find$at === void 0 ? void 0 : _pmNode$marks$find$at.localId;
|
|
114
|
-
const content = isBodiedExtension ? getBodiedExtensionContent(pmNode) : text;
|
|
115
|
-
const node = {
|
|
116
|
-
type: pmNode.type.name,
|
|
117
|
-
extensionType,
|
|
118
|
-
extensionKey,
|
|
119
|
-
parameters,
|
|
120
|
-
content,
|
|
121
|
-
localId: pmNode.attrs.localId,
|
|
122
|
-
fragmentLocalId
|
|
123
|
-
};
|
|
124
|
-
if (isBodiedExtension) {
|
|
125
|
-
const rendererExtensionHandler = rendererExtensionHandlers === null || rendererExtensionHandlers === void 0 ? void 0 : rendererExtensionHandlers[extensionType];
|
|
126
|
-
// Forge bodied extensions don't get rendererExtensionHandlers passed in and use extensionHandlerFromProvider from the below logic instead
|
|
127
|
-
if (rendererExtensionHandler) {
|
|
128
|
-
return getExtensionRenderer(rendererExtensionHandler)(node, toJSON(editorView.state.doc));
|
|
129
|
-
}
|
|
130
|
-
}
|
|
131
|
-
let result;
|
|
132
|
-
if (extensionHandlers && extensionHandlers[extensionType]) {
|
|
133
|
-
const render = getExtensionRenderer(extensionHandlers[extensionType]);
|
|
134
|
-
result = render(node, editorView.state.doc, actions);
|
|
135
|
-
}
|
|
136
|
-
if (!result) {
|
|
137
|
-
const extensionHandlerFromProvider = this.state.extensionProvider && this.getNodeRenderer(this.state.extensionProvider, extensionType, extensionKey);
|
|
138
|
-
if (extensionHandlerFromProvider) {
|
|
139
|
-
const NodeRenderer = extensionHandlerFromProvider;
|
|
140
|
-
if (node.type === 'multiBodiedExtension') {
|
|
141
|
-
return /*#__PURE__*/React.createElement(NodeRenderer, {
|
|
142
|
-
node: node,
|
|
143
|
-
references: this.props.references,
|
|
144
|
-
actions: actions
|
|
145
|
-
});
|
|
146
|
-
} else {
|
|
147
|
-
return /*#__PURE__*/React.createElement(NodeRenderer, {
|
|
148
|
-
node: node,
|
|
149
|
-
references: this.props.references
|
|
150
|
-
});
|
|
151
|
-
}
|
|
152
|
-
}
|
|
153
|
-
}
|
|
154
|
-
return result;
|
|
155
|
-
});
|
|
156
|
-
}
|
|
157
|
-
// Ignored via go/ees005
|
|
158
|
-
// eslint-disable-next-line react/no-unsafe
|
|
159
|
-
UNSAFE_componentWillMount() {
|
|
160
|
-
this.mounted = true;
|
|
161
|
-
const {
|
|
162
|
-
node,
|
|
163
|
-
showLivePagesBodiedMacrosRendererView
|
|
164
|
-
} = this.props;
|
|
165
|
-
// We only care about this empty state on first page load or insertion to determine the view
|
|
166
|
-
if (!!(showLivePagesBodiedMacrosRendererView !== null && showLivePagesBodiedMacrosRendererView !== void 0 && showLivePagesBodiedMacrosRendererView(nodeToJSON(node))) && !isEmptyBodiedMacro(node)) {
|
|
167
|
-
this.setState({
|
|
168
|
-
showBodiedExtensionRendererView: true
|
|
169
|
-
});
|
|
170
|
-
}
|
|
171
|
-
}
|
|
172
|
-
componentDidMount() {
|
|
173
|
-
const {
|
|
174
|
-
extensionProvider
|
|
175
|
-
} = this.props;
|
|
176
|
-
if (extensionProvider) {
|
|
177
|
-
this.setStateFromPromise('extensionProvider', extensionProvider);
|
|
178
|
-
}
|
|
179
|
-
}
|
|
180
|
-
componentDidUpdate() {
|
|
181
|
-
this.parsePrivateNodePropsIfNeeded();
|
|
182
|
-
}
|
|
183
|
-
componentWillUnmount() {
|
|
184
|
-
this.mounted = false;
|
|
185
|
-
}
|
|
186
|
-
|
|
187
|
-
// Ignored via go/ees005
|
|
188
|
-
// eslint-disable-next-line react/no-unsafe
|
|
189
|
-
UNSAFE_componentWillReceiveProps(nextProps) {
|
|
190
|
-
const {
|
|
191
|
-
extensionProvider
|
|
192
|
-
} = nextProps;
|
|
193
|
-
if (extensionProvider && this.props.extensionProvider !== extensionProvider) {
|
|
194
|
-
this.setStateFromPromise('extensionProvider', extensionProvider);
|
|
195
|
-
}
|
|
196
|
-
}
|
|
197
|
-
render() {
|
|
198
|
-
var _this$state$_privateP;
|
|
199
|
-
const {
|
|
200
|
-
node,
|
|
201
|
-
handleContentDOMRef,
|
|
202
|
-
editorView,
|
|
203
|
-
references,
|
|
204
|
-
editorAppearance,
|
|
205
|
-
pluginInjectionApi,
|
|
206
|
-
getPos,
|
|
207
|
-
eventDispatcher,
|
|
208
|
-
macroInteractionDesignFeatureFlags,
|
|
209
|
-
showLivePagesBodiedMacrosRendererView,
|
|
210
|
-
showUpdatedLivePages1PBodiedExtensionUI,
|
|
211
|
-
isLivePageViewMode
|
|
212
|
-
} = this.props;
|
|
213
|
-
const {
|
|
214
|
-
selection
|
|
215
|
-
} = editorView.state;
|
|
216
|
-
const selectedNode = selection instanceof NodeSelection && selection.node;
|
|
217
|
-
const position = typeof getPos === 'function' && getPos();
|
|
218
|
-
const resolvedPosition = position && editorView.state.doc.resolve(position);
|
|
219
|
-
const isNodeNested = !!(resolvedPosition && resolvedPosition.depth > 0);
|
|
220
|
-
if (node.type.name === 'multiBodiedExtension') {
|
|
221
|
-
return /*#__PURE__*/React.createElement(MultiBodiedExtension, {
|
|
222
|
-
node: node,
|
|
223
|
-
editorView: editorView,
|
|
224
|
-
getPos: getPos,
|
|
225
|
-
handleContentDOMRef: handleContentDOMRef,
|
|
226
|
-
tryExtensionHandler: this.tryExtensionHandler.bind(this),
|
|
227
|
-
eventDispatcher: eventDispatcher,
|
|
228
|
-
pluginInjectionApi: pluginInjectionApi,
|
|
229
|
-
editorAppearance: editorAppearance,
|
|
230
|
-
macroInteractionDesignFeatureFlags: macroInteractionDesignFeatureFlags,
|
|
231
|
-
isNodeSelected: selectedNode === node,
|
|
232
|
-
isNodeNested: isNodeNested,
|
|
233
|
-
isNodeHovered: this.state.isNodeHovered,
|
|
234
|
-
setIsNodeHovered: this.setIsNodeHovered,
|
|
235
|
-
isLivePageViewMode: isLivePageViewMode
|
|
236
|
-
});
|
|
237
|
-
}
|
|
238
|
-
const extensionHandlerResult = this.tryExtensionHandler(undefined);
|
|
239
|
-
switch (node.type.name) {
|
|
240
|
-
case 'extension':
|
|
241
|
-
case 'bodiedExtension':
|
|
242
|
-
return /*#__PURE__*/React.createElement(Extension, {
|
|
243
|
-
node: node,
|
|
244
|
-
getPos: this.props.getPos,
|
|
245
|
-
references: references,
|
|
246
|
-
extensionProvider: this.state.extensionProvider,
|
|
247
|
-
handleContentDOMRef: handleContentDOMRef,
|
|
248
|
-
view: editorView,
|
|
249
|
-
editorAppearance: editorAppearance,
|
|
250
|
-
hideFrame: (_this$state$_privateP = this.state._privateProps) === null || _this$state$_privateP === void 0 ? void 0 : _this$state$_privateP.__hideFrame,
|
|
251
|
-
pluginInjectionApi: pluginInjectionApi,
|
|
252
|
-
macroInteractionDesignFeatureFlags: macroInteractionDesignFeatureFlags,
|
|
253
|
-
isNodeSelected: selectedNode === node,
|
|
254
|
-
isNodeHovered: this.state.isNodeHovered,
|
|
255
|
-
isNodeNested: isNodeNested,
|
|
256
|
-
setIsNodeHovered: this.setIsNodeHovered,
|
|
257
|
-
showLivePagesBodiedMacrosRendererView: !!(showLivePagesBodiedMacrosRendererView !== null && showLivePagesBodiedMacrosRendererView !== void 0 && showLivePagesBodiedMacrosRendererView(nodeToJSON(node))),
|
|
258
|
-
showUpdatedLivePages1PBodiedExtensionUI: !!(showUpdatedLivePages1PBodiedExtensionUI !== null && showUpdatedLivePages1PBodiedExtensionUI !== void 0 && showUpdatedLivePages1PBodiedExtensionUI(nodeToJSON(node))),
|
|
259
|
-
showBodiedExtensionRendererView: this.state.showBodiedExtensionRendererView,
|
|
260
|
-
setShowBodiedExtensionRendererView: this.setShowBodiedExtensionRendererView,
|
|
261
|
-
isLivePageViewMode: isLivePageViewMode
|
|
262
|
-
}, extensionHandlerResult);
|
|
263
|
-
case 'inlineExtension':
|
|
264
|
-
return /*#__PURE__*/React.createElement(InlineExtension, {
|
|
265
|
-
node: node,
|
|
266
|
-
macroInteractionDesignFeatureFlags: macroInteractionDesignFeatureFlags,
|
|
267
|
-
isNodeSelected: selectedNode === node,
|
|
268
|
-
pluginInjectionApi: pluginInjectionApi,
|
|
269
|
-
isNodeHovered: this.state.isNodeHovered,
|
|
270
|
-
setIsNodeHovered: this.setIsNodeHovered,
|
|
271
|
-
isLivePageViewMode: isLivePageViewMode
|
|
272
|
-
}, extensionHandlerResult);
|
|
273
|
-
default:
|
|
274
|
-
return null;
|
|
275
|
-
}
|
|
276
|
-
}
|
|
277
|
-
tryExtensionHandler(actions) {
|
|
278
|
-
const {
|
|
279
|
-
node
|
|
280
|
-
} = this.props;
|
|
281
|
-
try {
|
|
282
|
-
const extensionContent = this.handleExtension(node, actions);
|
|
283
|
-
if (extensionContent && /*#__PURE__*/React.isValidElement(extensionContent)) {
|
|
284
|
-
return extensionContent;
|
|
285
|
-
}
|
|
286
|
-
} catch (e) {
|
|
287
|
-
// eslint-disable-next-line no-console
|
|
288
|
-
console.error('Provided extension handler has thrown an error\n', e);
|
|
289
|
-
/** We don't want this error to block renderer */
|
|
290
|
-
/** We keep rendering the default content */
|
|
291
|
-
}
|
|
292
|
-
return null;
|
|
293
|
-
}
|
|
294
|
-
}
|
|
295
|
-
export const ExtensionComponentNew = props => {
|
|
25
|
+
export const ExtensionComponent = props => {
|
|
296
26
|
const {
|
|
297
27
|
extensionProvider: extensionProviderResolver,
|
|
298
28
|
showLivePagesBodiedMacrosRendererView,
|
|
@@ -376,7 +106,7 @@ class ExtensionComponentInner extends Component {
|
|
|
376
106
|
}
|
|
377
107
|
});
|
|
378
108
|
_defineProperty(this, "handleExtension", (pmNode, actions) => {
|
|
379
|
-
var _pmNode$
|
|
109
|
+
var _pmNode$marks, _pmNode$marks$find, _pmNode$marks$find$at;
|
|
380
110
|
const {
|
|
381
111
|
extensionHandlers,
|
|
382
112
|
editorView,
|
|
@@ -393,7 +123,7 @@ class ExtensionComponentInner extends Component {
|
|
|
393
123
|
if (isBodiedExtension && !showBodiedExtensionRendererView) {
|
|
394
124
|
return;
|
|
395
125
|
}
|
|
396
|
-
const fragmentLocalId = pmNode === null || pmNode === void 0 ? void 0 : (_pmNode$
|
|
126
|
+
const fragmentLocalId = pmNode === null || pmNode === void 0 ? void 0 : (_pmNode$marks = pmNode.marks) === null || _pmNode$marks === void 0 ? void 0 : (_pmNode$marks$find = _pmNode$marks.find(m => m.type.name === 'fragment')) === null || _pmNode$marks$find === void 0 ? void 0 : (_pmNode$marks$find$at = _pmNode$marks$find.attrs) === null || _pmNode$marks$find$at === void 0 ? void 0 : _pmNode$marks$find$at.localId;
|
|
397
127
|
const content = isBodiedExtension ? getBodiedExtensionContent(pmNode) : text;
|
|
398
128
|
const node = {
|
|
399
129
|
type: pmNode.type.name,
|
|
@@ -441,7 +171,7 @@ class ExtensionComponentInner extends Component {
|
|
|
441
171
|
this.parsePrivateNodePropsIfNeeded();
|
|
442
172
|
}
|
|
443
173
|
render() {
|
|
444
|
-
var _this$state$
|
|
174
|
+
var _this$state$_privateP;
|
|
445
175
|
const {
|
|
446
176
|
node,
|
|
447
177
|
handleContentDOMRef,
|
|
@@ -496,7 +226,7 @@ class ExtensionComponentInner extends Component {
|
|
|
496
226
|
handleContentDOMRef: handleContentDOMRef,
|
|
497
227
|
view: editorView,
|
|
498
228
|
editorAppearance: editorAppearance,
|
|
499
|
-
hideFrame: (_this$state$
|
|
229
|
+
hideFrame: (_this$state$_privateP = this.state._privateProps) === null || _this$state$_privateP === void 0 ? void 0 : _this$state$_privateP.__hideFrame,
|
|
500
230
|
pluginInjectionApi: pluginInjectionApi,
|
|
501
231
|
macroInteractionDesignFeatureFlags: macroInteractionDesignFeatureFlags,
|
|
502
232
|
isNodeSelected: selectedNode === node,
|
|
@@ -540,14 +270,4 @@ class ExtensionComponentInner extends Component {
|
|
|
540
270
|
}
|
|
541
271
|
return null;
|
|
542
272
|
}
|
|
543
|
-
}
|
|
544
|
-
export const ExtensionComponent = props => {
|
|
545
|
-
if (fg('platform_editor_react18_extension_component_v2')) {
|
|
546
|
-
// Ignored via go/ees005
|
|
547
|
-
// eslint-disable-next-line react/jsx-props-no-spreading
|
|
548
|
-
return /*#__PURE__*/React.createElement(ExtensionComponentNew, props);
|
|
549
|
-
}
|
|
550
|
-
// Ignored via go/ees005
|
|
551
|
-
// eslint-disable-next-line react/jsx-props-no-spreading
|
|
552
|
-
return /*#__PURE__*/React.createElement(ExtensionComponentOld, props);
|
|
553
|
-
};
|
|
273
|
+
}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { isFedRamp } from './environment';
|
|
2
2
|
const SENTRY_DSN = 'https://0b10c8e02fb44d8796c047b102c9bee8@o55978.ingest.sentry.io/4505129224110080';
|
|
3
3
|
const packageName = 'editor-common'; // Sentry doesn't accept '/' in its releases https://docs.sentry.io/platforms/javascript/configuration/releases/
|
|
4
|
-
const packageVersion = "100.1.
|
|
4
|
+
const packageVersion = "100.1.2";
|
|
5
5
|
const sanitiseSentryEvents = (data, _hint) => {
|
|
6
6
|
// Remove URL as it has UGC
|
|
7
7
|
// TODO: Sanitise the URL instead of just removing it
|
|
@@ -13,7 +13,7 @@ import withAnalyticsContext from '@atlaskit/analytics-next/withAnalyticsContext'
|
|
|
13
13
|
import withAnalyticsEvents from '@atlaskit/analytics-next/withAnalyticsEvents';
|
|
14
14
|
import Layer from '../Layer';
|
|
15
15
|
const packageName = "@atlaskit/editor-common";
|
|
16
|
-
const packageVersion = "100.1.
|
|
16
|
+
const packageVersion = "100.1.2";
|
|
17
17
|
const halfFocusRing = 1;
|
|
18
18
|
const dropOffset = '0, 8';
|
|
19
19
|
// Ignored via go/ees005
|
|
@@ -1,9 +1,8 @@
|
|
|
1
1
|
import _defineProperty from "@babel/runtime/helpers/defineProperty";
|
|
2
2
|
/* eslint-disable @repo/internal/react/no-class-components */
|
|
3
3
|
import React, { PureComponent } from 'react';
|
|
4
|
-
import { fg } from '@atlaskit/platform-feature-flags';
|
|
5
4
|
import { ProviderFactory, WithProviders } from '../../provider-factory';
|
|
6
|
-
import { MentionWithProviders
|
|
5
|
+
import { MentionWithProviders } from './mention-with-providers';
|
|
7
6
|
export default class Mention extends PureComponent {
|
|
8
7
|
constructor(props) {
|
|
9
8
|
super(props);
|
|
@@ -19,18 +18,7 @@ export default class Mention extends PureComponent {
|
|
|
19
18
|
mentionProvider,
|
|
20
19
|
profilecardProvider
|
|
21
20
|
} = providers;
|
|
22
|
-
|
|
23
|
-
return /*#__PURE__*/React.createElement(MentionWithProviders, {
|
|
24
|
-
id: id,
|
|
25
|
-
text: text,
|
|
26
|
-
accessLevel: accessLevel,
|
|
27
|
-
localId: localId,
|
|
28
|
-
eventHandlers: eventHandlers,
|
|
29
|
-
mentionProvider: mentionProvider,
|
|
30
|
-
profilecardProvider: profilecardProvider
|
|
31
|
-
});
|
|
32
|
-
}
|
|
33
|
-
return /*#__PURE__*/React.createElement(MentionWithProvidersOld, {
|
|
21
|
+
return /*#__PURE__*/React.createElement(MentionWithProviders, {
|
|
34
22
|
id: id,
|
|
35
23
|
text: text,
|
|
36
24
|
accessLevel: accessLevel,
|
|
@@ -1,10 +1,7 @@
|
|
|
1
|
-
import
|
|
2
|
-
import _defineProperty from "@babel/runtime/helpers/defineProperty";
|
|
3
|
-
import React, { PureComponent, useLayoutEffect, useRef, useState } from 'react';
|
|
1
|
+
import React, { useLayoutEffect, useRef, useState } from 'react';
|
|
4
2
|
import { ResourcedMention } from '@atlaskit/mention/element';
|
|
5
3
|
import ResourcedMentionWithProfilecard from './mention-with-profilecard';
|
|
6
4
|
const GENERIC_USER_IDS = ['HipChat', 'all', 'here'];
|
|
7
|
-
const noop = () => {};
|
|
8
5
|
export const MentionWithProviders = ({
|
|
9
6
|
accessLevel,
|
|
10
7
|
eventHandlers,
|
|
@@ -52,82 +49,4 @@ export const MentionWithProviders = ({
|
|
|
52
49
|
onMouseEnter: eventHandlers === null || eventHandlers === void 0 ? void 0 : eventHandlers.onMouseEnter,
|
|
53
50
|
onMouseLeave: eventHandlers === null || eventHandlers === void 0 ? void 0 : eventHandlers.onMouseLeave
|
|
54
51
|
});
|
|
55
|
-
};
|
|
56
|
-
|
|
57
|
-
// eslint-disable-next-line @repo/internal/react/no-class-components
|
|
58
|
-
export class MentionWithProvidersOld extends PureComponent {
|
|
59
|
-
constructor(...args) {
|
|
60
|
-
super(...args);
|
|
61
|
-
_defineProperty(this, "state", {
|
|
62
|
-
profilecardProvider: null
|
|
63
|
-
});
|
|
64
|
-
}
|
|
65
|
-
// Ignored via go/ees005
|
|
66
|
-
// eslint-disable-next-line react/no-unsafe
|
|
67
|
-
UNSAFE_componentWillMount() {
|
|
68
|
-
this.updateProfilecardProvider(this.props);
|
|
69
|
-
}
|
|
70
|
-
|
|
71
|
-
// Ignored via go/ees005
|
|
72
|
-
// eslint-disable-next-line react/no-unsafe
|
|
73
|
-
UNSAFE_componentWillReceiveProps(nextProps) {
|
|
74
|
-
if (nextProps.profilecardProvider !== this.props.profilecardProvider) {
|
|
75
|
-
this.updateProfilecardProvider(nextProps);
|
|
76
|
-
}
|
|
77
|
-
}
|
|
78
|
-
updateProfilecardProvider(props) {
|
|
79
|
-
// We are not using async/await here to avoid having an intermediate Promise
|
|
80
|
-
// introduced by the transpiler.
|
|
81
|
-
// This will allow consumer to use a SynchronousPromise.resolve and avoid useless
|
|
82
|
-
// rerendering
|
|
83
|
-
if (props.profilecardProvider) {
|
|
84
|
-
props.profilecardProvider.then(profilecardProvider => {
|
|
85
|
-
this.setState({
|
|
86
|
-
profilecardProvider
|
|
87
|
-
});
|
|
88
|
-
}).catch(() => {
|
|
89
|
-
this.setState({
|
|
90
|
-
profilecardProvider: null
|
|
91
|
-
});
|
|
92
|
-
});
|
|
93
|
-
} else {
|
|
94
|
-
this.setState({
|
|
95
|
-
profilecardProvider: null
|
|
96
|
-
});
|
|
97
|
-
}
|
|
98
|
-
}
|
|
99
|
-
render() {
|
|
100
|
-
const {
|
|
101
|
-
accessLevel,
|
|
102
|
-
eventHandlers,
|
|
103
|
-
id,
|
|
104
|
-
mentionProvider,
|
|
105
|
-
text,
|
|
106
|
-
localId
|
|
107
|
-
} = this.props;
|
|
108
|
-
const {
|
|
109
|
-
profilecardProvider
|
|
110
|
-
} = this.state;
|
|
111
|
-
|
|
112
|
-
// Ignored via go/ees005
|
|
113
|
-
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
114
|
-
const actionHandlers = {};
|
|
115
|
-
['onClick', 'onMouseEnter', 'onMouseLeave'].forEach(handler => {
|
|
116
|
-
actionHandlers[handler] = eventHandlers && eventHandlers[handler] || noop;
|
|
117
|
-
});
|
|
118
|
-
const MentionComponent = profilecardProvider && GENERIC_USER_IDS.indexOf(id) === -1 ? ResourcedMentionWithProfilecard : ResourcedMention;
|
|
119
|
-
return /*#__PURE__*/React.createElement(MentionComponent, _extends({
|
|
120
|
-
id: id,
|
|
121
|
-
text: text,
|
|
122
|
-
accessLevel: accessLevel,
|
|
123
|
-
localId: localId,
|
|
124
|
-
mentionProvider: mentionProvider
|
|
125
|
-
// Ignored via go/ees005
|
|
126
|
-
// eslint-disable-next-line @typescript-eslint/no-non-null-assertion
|
|
127
|
-
,
|
|
128
|
-
profilecardProvider: profilecardProvider
|
|
129
|
-
// Ignored via go/ees005
|
|
130
|
-
// eslint-disable-next-line react/jsx-props-no-spreading
|
|
131
|
-
}, actionHandlers));
|
|
132
|
-
}
|
|
133
|
-
}
|
|
52
|
+
};
|
|
@@ -5,7 +5,9 @@ import _extends from "@babel/runtime/helpers/extends";
|
|
|
5
5
|
* @jsxRuntime classic
|
|
6
6
|
* @jsx jsx
|
|
7
7
|
*/
|
|
8
|
+
|
|
8
9
|
import React, { PureComponent, useContext } from 'react';
|
|
10
|
+
|
|
9
11
|
// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
|
|
10
12
|
import { css, jsx } from '@emotion/react';
|
|
11
13
|
import { akEditorFloatingPanelZIndex } from '@atlaskit/editor-shared-styles';
|
|
@@ -40,7 +42,7 @@ const buttonStyles = (isActive, submenuActive) => {
|
|
|
40
42
|
> span:hover,
|
|
41
43
|
> span:active {
|
|
42
44
|
background: ${"var(--ds-background-selected, #6c798f)"};
|
|
43
|
-
color: ${"var(--ds-text, #
|
|
45
|
+
color: ${"var(--ds-text-selected, #0C66E4)"};
|
|
44
46
|
}
|
|
45
47
|
:focus > span[aria-disabled='false'] {
|
|
46
48
|
${focusedMenuItemStyle};
|