@atlaskit/renderer 110.5.5 → 111.0.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +27 -0
- package/dist/cjs/react/nodes/emoji.js +89 -7
- package/dist/cjs/ui/Renderer/index.js +1 -1
- package/dist/cjs/ui/annotations/hooks/use-events.js +5 -7
- package/dist/cjs/ui/annotations/view/index.js +1 -3
- package/dist/es2019/react/nodes/emoji.js +70 -4
- package/dist/es2019/ui/Renderer/index.js +1 -1
- package/dist/es2019/ui/annotations/hooks/use-events.js +4 -7
- package/dist/es2019/ui/annotations/view/index.js +1 -3
- package/dist/esm/react/nodes/emoji.js +88 -4
- package/dist/esm/ui/Renderer/index.js +1 -1
- package/dist/esm/ui/annotations/hooks/use-events.js +5 -7
- package/dist/esm/ui/annotations/view/index.js +1 -3
- package/dist/types/react/nodes/emoji.d.ts +7 -4
- package/dist/types/types/smartLinksOptions.d.ts +0 -6
- package/dist/types/ui/annotations/hooks/use-events.d.ts +1 -3
- package/dist/types-ts4.5/react/nodes/emoji.d.ts +7 -4
- package/dist/types-ts4.5/types/smartLinksOptions.d.ts +0 -6
- package/dist/types-ts4.5/ui/annotations/hooks/use-events.d.ts +1 -3
- package/package.json +3 -3
package/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,32 @@
|
|
|
1
1
|
# @atlaskit/renderer
|
|
2
2
|
|
|
3
|
+
## 111.0.0
|
|
4
|
+
|
|
5
|
+
### Major Changes
|
|
6
|
+
|
|
7
|
+
- [#147220](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/147220)
|
|
8
|
+
[`07a9416026f88`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/07a9416026f88) -
|
|
9
|
+
Remove showActions and showServerActions from smart-card
|
|
10
|
+
|
|
11
|
+
### Patch Changes
|
|
12
|
+
|
|
13
|
+
- [#147094](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/147094)
|
|
14
|
+
[`9e12a8f47cfef`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/9e12a8f47cfef) -
|
|
15
|
+
[ED-24721] Clean up FF `confluence.frontend.fabric.editor.comments-on-media-analytics`
|
|
16
|
+
- Updated dependencies
|
|
17
|
+
|
|
18
|
+
## 110.6.0
|
|
19
|
+
|
|
20
|
+
### Minor Changes
|
|
21
|
+
|
|
22
|
+
- [#146966](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/146966)
|
|
23
|
+
[`ee4562a10804e`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/ee4562a10804e) -
|
|
24
|
+
cleaned up platform_editor_get_emoji_provider_from_config feature flag
|
|
25
|
+
|
|
26
|
+
### Patch Changes
|
|
27
|
+
|
|
28
|
+
- Updated dependencies
|
|
29
|
+
|
|
3
30
|
## 110.5.5
|
|
4
31
|
|
|
5
32
|
### Patch Changes
|
|
@@ -1,20 +1,102 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
|
+
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
3
4
|
Object.defineProperty(exports, "__esModule", {
|
|
4
5
|
value: true
|
|
5
6
|
});
|
|
6
7
|
exports.default = void 0;
|
|
8
|
+
var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
|
|
9
|
+
var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
|
|
10
|
+
var _assertThisInitialized2 = _interopRequireDefault(require("@babel/runtime/helpers/assertThisInitialized"));
|
|
11
|
+
var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));
|
|
12
|
+
var _possibleConstructorReturn2 = _interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));
|
|
13
|
+
var _getPrototypeOf2 = _interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));
|
|
14
|
+
var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
|
|
7
15
|
var _react = require("@emotion/react");
|
|
8
16
|
var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
|
|
17
|
+
var _element = require("@atlaskit/emoji/element");
|
|
9
18
|
var _react2 = require("react");
|
|
10
|
-
var
|
|
19
|
+
var _providerFactory = require("@atlaskit/editor-common/provider-factory");
|
|
11
20
|
var _useInlineAnnotationProps = require("../../ui/annotations/element/useInlineAnnotationProps");
|
|
12
|
-
|
|
21
|
+
function _createSuper(t) { var r = _isNativeReflectConstruct(); return function () { var e, o = (0, _getPrototypeOf2.default)(t); if (r) { var s = (0, _getPrototypeOf2.default)(this).constructor; e = Reflect.construct(o, arguments, s); } else e = o.apply(this, arguments); return (0, _possibleConstructorReturn2.default)(this, e); }; }
|
|
22
|
+
function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); } catch (t) {} return (_isNativeReflectConstruct = function _isNativeReflectConstruct() { return !!t; })(); } /**
|
|
13
23
|
* @jsxRuntime classic
|
|
14
24
|
* @jsx jsx
|
|
15
|
-
*/
|
|
16
|
-
// eslint-disable-next-line @
|
|
17
|
-
|
|
25
|
+
*/ // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
|
|
26
|
+
// eslint-disable-next-line @repo/internal/react/no-class-components
|
|
27
|
+
var EmojiNode = /*#__PURE__*/function (_PureComponent) {
|
|
28
|
+
(0, _inherits2.default)(EmojiNode, _PureComponent);
|
|
29
|
+
var _super = _createSuper(EmojiNode);
|
|
30
|
+
function EmojiNode(props) {
|
|
31
|
+
var _this;
|
|
32
|
+
(0, _classCallCheck2.default)(this, EmojiNode);
|
|
33
|
+
_this = _super.call(this, props);
|
|
34
|
+
(0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "renderWithProvider", function (providers) {
|
|
35
|
+
var _resourceConfig$optim;
|
|
36
|
+
var _this$props = _this.props,
|
|
37
|
+
allowTextFallback = _this$props.allowTextFallback,
|
|
38
|
+
shortName = _this$props.shortName,
|
|
39
|
+
id = _this$props.id,
|
|
40
|
+
fallback = _this$props.fallback,
|
|
41
|
+
fitToHeight = _this$props.fitToHeight,
|
|
42
|
+
showTooltip = _this$props.showTooltip,
|
|
43
|
+
resourceConfig = _this$props.resourceConfig;
|
|
44
|
+
if (allowTextFallback && !providers.emojiProvider) {
|
|
45
|
+
return (0, _react.jsx)("span", {
|
|
46
|
+
"data-emoji-id": id,
|
|
47
|
+
"data-emoji-short-name": shortName,
|
|
48
|
+
"data-emoji-text": fallback || shortName
|
|
49
|
+
}, fallback || shortName);
|
|
50
|
+
}
|
|
51
|
+
if (!providers.emojiProvider) {
|
|
52
|
+
return null;
|
|
53
|
+
}
|
|
54
|
+
return (0, _react.jsx)(_element.ResourcedEmoji, {
|
|
55
|
+
emojiId: {
|
|
56
|
+
id: id,
|
|
57
|
+
fallback: fallback,
|
|
58
|
+
shortName: shortName
|
|
59
|
+
},
|
|
60
|
+
emojiProvider: providers.emojiProvider,
|
|
61
|
+
showTooltip: showTooltip,
|
|
62
|
+
fitToHeight: fitToHeight,
|
|
63
|
+
optimistic: true,
|
|
64
|
+
optimisticImageURL: resourceConfig === null || resourceConfig === void 0 || (_resourceConfig$optim = resourceConfig.optimisticImageApi) === null || _resourceConfig$optim === void 0 ? void 0 : _resourceConfig$optim.getUrl({
|
|
65
|
+
id: id,
|
|
66
|
+
fallback: fallback,
|
|
67
|
+
shortName: shortName
|
|
68
|
+
}),
|
|
69
|
+
editorEmoji: true
|
|
70
|
+
});
|
|
71
|
+
});
|
|
72
|
+
_this.providerFactory = props.providers || new _providerFactory.ProviderFactory();
|
|
73
|
+
return _this;
|
|
74
|
+
}
|
|
75
|
+
(0, _createClass2.default)(EmojiNode, [{
|
|
76
|
+
key: "componentWillUnmount",
|
|
77
|
+
value: function componentWillUnmount() {
|
|
78
|
+
if (!this.props.providers) {
|
|
79
|
+
// new ProviderFactory is created if no `providers` has been set
|
|
80
|
+
// in this case when component is unmounted it's safe to destroy this providerFactory
|
|
81
|
+
this.providerFactory.destroy();
|
|
82
|
+
}
|
|
83
|
+
}
|
|
84
|
+
}, {
|
|
85
|
+
key: "render",
|
|
86
|
+
value: function render() {
|
|
87
|
+
return (0, _react.jsx)(_providerFactory.WithProviders, {
|
|
88
|
+
providers: ['emojiProvider'],
|
|
89
|
+
providerFactory: this.providerFactory,
|
|
90
|
+
renderNode: this.renderWithProvider
|
|
91
|
+
});
|
|
92
|
+
}
|
|
93
|
+
}]);
|
|
94
|
+
return EmojiNode;
|
|
95
|
+
}(_react2.PureComponent);
|
|
96
|
+
(0, _defineProperty2.default)(EmojiNode, "displayName", 'EmojiNode');
|
|
97
|
+
(0, _defineProperty2.default)(EmojiNode, "defaultProps", {
|
|
98
|
+
showTooltip: true
|
|
99
|
+
});
|
|
18
100
|
function EmojiItem(props) {
|
|
19
101
|
var id = props.id,
|
|
20
102
|
providers = props.providers,
|
|
@@ -24,7 +106,7 @@ function EmojiItem(props) {
|
|
|
24
106
|
resourceConfig = props.resourceConfig;
|
|
25
107
|
var inlineAnnotationProps = (0, _useInlineAnnotationProps.useInlineAnnotationProps)(props);
|
|
26
108
|
if ((0, _platformFeatureFlags.fg)('editor_inline_comments_on_inline_nodes')) {
|
|
27
|
-
return (0, _react.jsx)("span", inlineAnnotationProps, (0, _react.jsx)(
|
|
109
|
+
return (0, _react.jsx)("span", inlineAnnotationProps, (0, _react.jsx)(EmojiNode, {
|
|
28
110
|
allowTextFallback: true,
|
|
29
111
|
id: id,
|
|
30
112
|
shortName: shortName,
|
|
@@ -34,7 +116,7 @@ function EmojiItem(props) {
|
|
|
34
116
|
resourceConfig: resourceConfig
|
|
35
117
|
}));
|
|
36
118
|
}
|
|
37
|
-
return (0, _react.jsx)(
|
|
119
|
+
return (0, _react.jsx)(EmojiNode, {
|
|
38
120
|
allowTextFallback: true,
|
|
39
121
|
id: id,
|
|
40
122
|
shortName: shortName,
|
|
@@ -63,7 +63,7 @@ function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.
|
|
|
63
63
|
var NORMAL_SEVERITY_THRESHOLD = exports.NORMAL_SEVERITY_THRESHOLD = 2000;
|
|
64
64
|
var DEGRADED_SEVERITY_THRESHOLD = exports.DEGRADED_SEVERITY_THRESHOLD = 3000;
|
|
65
65
|
var packageName = "@atlaskit/renderer";
|
|
66
|
-
var packageVersion = "
|
|
66
|
+
var packageVersion = "111.0.0";
|
|
67
67
|
var defaultNodeComponents = exports.defaultNodeComponents = _nodes.nodeToReact;
|
|
68
68
|
var Renderer = exports.Renderer = /*#__PURE__*/function (_PureComponent) {
|
|
69
69
|
(0, _inherits2.default)(Renderer, _PureComponent);
|
|
@@ -83,8 +83,7 @@ var useAnnotationClickEvent = exports.useAnnotationClickEvent = function useAnno
|
|
|
83
83
|
annotationClickEvent = _useState6[0],
|
|
84
84
|
setAnnotationClickEvent = _useState6[1];
|
|
85
85
|
var updateSubscriber = props.updateSubscriber,
|
|
86
|
-
createAnalyticsEvent = props.createAnalyticsEvent
|
|
87
|
-
isCommentsOnMediaAnalyticsEnabled = props.isCommentsOnMediaAnalyticsEnabled;
|
|
86
|
+
createAnalyticsEvent = props.createAnalyticsEvent;
|
|
88
87
|
var isInlineCommentsKbAccessible = _featureGateJsClient.default.checkGate('inline_comments_keyboard_accessible_renderer');
|
|
89
88
|
(0, _react.useLayoutEffect)(function () {
|
|
90
89
|
if (!updateSubscriber) {
|
|
@@ -109,12 +108,11 @@ var useAnnotationClickEvent = exports.useAnnotationClickEvent = function useAnno
|
|
|
109
108
|
actionSubject: _analytics.ACTION_SUBJECT.ANNOTATION,
|
|
110
109
|
actionSubjectId: _analytics.ACTION_SUBJECT_ID.INLINE_COMMENT,
|
|
111
110
|
eventType: _analytics.EVENT_TYPE.TRACK,
|
|
112
|
-
attributes:
|
|
113
|
-
overlap: annotationsByType.length || 0
|
|
114
|
-
}, isCommentsOnMediaAnalyticsEnabled && {
|
|
111
|
+
attributes: {
|
|
112
|
+
overlap: annotationsByType.length || 0,
|
|
115
113
|
targetNodeType: eventTargetType,
|
|
116
114
|
method: viewMethod
|
|
117
|
-
}
|
|
115
|
+
}
|
|
118
116
|
}).fire(_types2.FabricChannel.editor);
|
|
119
117
|
}
|
|
120
118
|
setAnnotationClickEvent({
|
|
@@ -137,6 +135,6 @@ var useAnnotationClickEvent = exports.useAnnotationClickEvent = function useAnno
|
|
|
137
135
|
updateSubscriber.off(_types.AnnotationUpdateEvent.ON_ANNOTATION_CLICK, clickCb);
|
|
138
136
|
updateSubscriber.off(_types.AnnotationUpdateEvent.DESELECT_ANNOTATIONS, deselectCb);
|
|
139
137
|
};
|
|
140
|
-
}, [updateSubscriber, createAnalyticsEvent,
|
|
138
|
+
}, [updateSubscriber, createAnalyticsEvent, isInlineCommentsKbAccessible]);
|
|
141
139
|
return annotationClickEvent;
|
|
142
140
|
};
|
|
@@ -16,11 +16,9 @@ var AnnotationView = exports.AnnotationView = function AnnotationView(props) {
|
|
|
16
16
|
var actionContext = (0, _react.useContext)(_RendererActionsContext.RendererContext);
|
|
17
17
|
var inlineCommentProvider = providers && providers.inlineComment;
|
|
18
18
|
var updateSubscriber = inlineCommentProvider && inlineCommentProvider.updateSubscriber || null;
|
|
19
|
-
var isCommentsOnMediaAnalyticsEnabled = inlineCommentProvider === null || inlineCommentProvider === void 0 ? void 0 : inlineCommentProvider.isCommentsOnMediaAnalyticsEnabled;
|
|
20
19
|
var viewComponentProps = (0, _hooks.useAnnotationClickEvent)({
|
|
21
20
|
updateSubscriber: updateSubscriber,
|
|
22
|
-
createAnalyticsEvent: props.createAnalyticsEvent
|
|
23
|
-
isCommentsOnMediaAnalyticsEnabled: isCommentsOnMediaAnalyticsEnabled
|
|
21
|
+
createAnalyticsEvent: props.createAnalyticsEvent
|
|
24
22
|
});
|
|
25
23
|
var ViewComponent = inlineCommentProvider && inlineCommentProvider.viewComponent;
|
|
26
24
|
var deleteAnnotation = (0, _react.useMemo)(function () {
|
|
@@ -1,3 +1,4 @@
|
|
|
1
|
+
import _defineProperty from "@babel/runtime/helpers/defineProperty";
|
|
1
2
|
/**
|
|
2
3
|
* @jsxRuntime classic
|
|
3
4
|
* @jsx jsx
|
|
@@ -5,9 +6,74 @@
|
|
|
5
6
|
// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
|
|
6
7
|
import { jsx } from '@emotion/react';
|
|
7
8
|
import { fg } from '@atlaskit/platform-feature-flags';
|
|
8
|
-
import {
|
|
9
|
-
import {
|
|
9
|
+
import { ResourcedEmoji } from '@atlaskit/emoji/element';
|
|
10
|
+
import { PureComponent, memo } from 'react';
|
|
11
|
+
import { ProviderFactory, WithProviders } from '@atlaskit/editor-common/provider-factory';
|
|
10
12
|
import { useInlineAnnotationProps } from '../../ui/annotations/element/useInlineAnnotationProps';
|
|
13
|
+
// eslint-disable-next-line @repo/internal/react/no-class-components
|
|
14
|
+
class EmojiNode extends PureComponent {
|
|
15
|
+
constructor(props) {
|
|
16
|
+
super(props);
|
|
17
|
+
_defineProperty(this, "renderWithProvider", providers => {
|
|
18
|
+
var _resourceConfig$optim;
|
|
19
|
+
const {
|
|
20
|
+
allowTextFallback,
|
|
21
|
+
shortName,
|
|
22
|
+
id,
|
|
23
|
+
fallback,
|
|
24
|
+
fitToHeight,
|
|
25
|
+
showTooltip,
|
|
26
|
+
resourceConfig
|
|
27
|
+
} = this.props;
|
|
28
|
+
if (allowTextFallback && !providers.emojiProvider) {
|
|
29
|
+
return jsx("span", {
|
|
30
|
+
"data-emoji-id": id,
|
|
31
|
+
"data-emoji-short-name": shortName,
|
|
32
|
+
"data-emoji-text": fallback || shortName
|
|
33
|
+
}, fallback || shortName);
|
|
34
|
+
}
|
|
35
|
+
if (!providers.emojiProvider) {
|
|
36
|
+
return null;
|
|
37
|
+
}
|
|
38
|
+
return jsx(ResourcedEmoji, {
|
|
39
|
+
emojiId: {
|
|
40
|
+
id,
|
|
41
|
+
fallback,
|
|
42
|
+
shortName
|
|
43
|
+
},
|
|
44
|
+
emojiProvider: providers.emojiProvider,
|
|
45
|
+
showTooltip: showTooltip,
|
|
46
|
+
fitToHeight: fitToHeight,
|
|
47
|
+
optimistic: true,
|
|
48
|
+
optimisticImageURL: resourceConfig === null || resourceConfig === void 0 ? void 0 : (_resourceConfig$optim = resourceConfig.optimisticImageApi) === null || _resourceConfig$optim === void 0 ? void 0 : _resourceConfig$optim.getUrl({
|
|
49
|
+
id,
|
|
50
|
+
fallback,
|
|
51
|
+
shortName
|
|
52
|
+
}),
|
|
53
|
+
editorEmoji: true
|
|
54
|
+
});
|
|
55
|
+
});
|
|
56
|
+
this.providerFactory = props.providers || new ProviderFactory();
|
|
57
|
+
}
|
|
58
|
+
componentWillUnmount() {
|
|
59
|
+
if (!this.props.providers) {
|
|
60
|
+
// new ProviderFactory is created if no `providers` has been set
|
|
61
|
+
// in this case when component is unmounted it's safe to destroy this providerFactory
|
|
62
|
+
this.providerFactory.destroy();
|
|
63
|
+
}
|
|
64
|
+
}
|
|
65
|
+
render() {
|
|
66
|
+
return jsx(WithProviders, {
|
|
67
|
+
providers: ['emojiProvider'],
|
|
68
|
+
providerFactory: this.providerFactory,
|
|
69
|
+
renderNode: this.renderWithProvider
|
|
70
|
+
});
|
|
71
|
+
}
|
|
72
|
+
}
|
|
73
|
+
_defineProperty(EmojiNode, "displayName", 'EmojiNode');
|
|
74
|
+
_defineProperty(EmojiNode, "defaultProps", {
|
|
75
|
+
showTooltip: true
|
|
76
|
+
});
|
|
11
77
|
function EmojiItem(props) {
|
|
12
78
|
const {
|
|
13
79
|
id,
|
|
@@ -19,7 +85,7 @@ function EmojiItem(props) {
|
|
|
19
85
|
} = props;
|
|
20
86
|
const inlineAnnotationProps = useInlineAnnotationProps(props);
|
|
21
87
|
if (fg('editor_inline_comments_on_inline_nodes')) {
|
|
22
|
-
return jsx("span", inlineAnnotationProps, jsx(
|
|
88
|
+
return jsx("span", inlineAnnotationProps, jsx(EmojiNode, {
|
|
23
89
|
allowTextFallback: true,
|
|
24
90
|
id: id,
|
|
25
91
|
shortName: shortName,
|
|
@@ -29,7 +95,7 @@ function EmojiItem(props) {
|
|
|
29
95
|
resourceConfig: resourceConfig
|
|
30
96
|
}));
|
|
31
97
|
}
|
|
32
|
-
return jsx(
|
|
98
|
+
return jsx(EmojiNode, {
|
|
33
99
|
allowTextFallback: true,
|
|
34
100
|
id: id,
|
|
35
101
|
shortName: shortName,
|
|
@@ -45,7 +45,7 @@ import { nodeToReact } from '../../react/nodes';
|
|
|
45
45
|
export const NORMAL_SEVERITY_THRESHOLD = 2000;
|
|
46
46
|
export const DEGRADED_SEVERITY_THRESHOLD = 3000;
|
|
47
47
|
const packageName = "@atlaskit/renderer";
|
|
48
|
-
const packageVersion = "
|
|
48
|
+
const packageVersion = "111.0.0";
|
|
49
49
|
export const defaultNodeComponents = nodeToReact;
|
|
50
50
|
export class Renderer extends PureComponent {
|
|
51
51
|
constructor(props) {
|
|
@@ -72,8 +72,7 @@ export const useAnnotationClickEvent = props => {
|
|
|
72
72
|
const [annotationClickEvent, setAnnotationClickEvent] = useState(null);
|
|
73
73
|
const {
|
|
74
74
|
updateSubscriber,
|
|
75
|
-
createAnalyticsEvent
|
|
76
|
-
isCommentsOnMediaAnalyticsEnabled
|
|
75
|
+
createAnalyticsEvent
|
|
77
76
|
} = props;
|
|
78
77
|
const isInlineCommentsKbAccessible = FeatureGates.checkGate('inline_comments_keyboard_accessible_renderer');
|
|
79
78
|
useLayoutEffect(() => {
|
|
@@ -98,10 +97,8 @@ export const useAnnotationClickEvent = props => {
|
|
|
98
97
|
eventType: EVENT_TYPE.TRACK,
|
|
99
98
|
attributes: {
|
|
100
99
|
overlap: annotationsByType.length || 0,
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
method: viewMethod
|
|
104
|
-
})
|
|
100
|
+
targetNodeType: eventTargetType,
|
|
101
|
+
method: viewMethod
|
|
105
102
|
}
|
|
106
103
|
}).fire(FabricChannel.editor);
|
|
107
104
|
}
|
|
@@ -125,6 +122,6 @@ export const useAnnotationClickEvent = props => {
|
|
|
125
122
|
updateSubscriber.off(AnnotationUpdateEvent.ON_ANNOTATION_CLICK, clickCb);
|
|
126
123
|
updateSubscriber.off(AnnotationUpdateEvent.DESELECT_ANNOTATIONS, deselectCb);
|
|
127
124
|
};
|
|
128
|
-
}, [updateSubscriber, createAnalyticsEvent,
|
|
125
|
+
}, [updateSubscriber, createAnalyticsEvent, isInlineCommentsKbAccessible]);
|
|
129
126
|
return annotationClickEvent;
|
|
130
127
|
};
|
|
@@ -7,11 +7,9 @@ const AnnotationView = props => {
|
|
|
7
7
|
const actionContext = useContext(RendererContext);
|
|
8
8
|
const inlineCommentProvider = providers && providers.inlineComment;
|
|
9
9
|
const updateSubscriber = inlineCommentProvider && inlineCommentProvider.updateSubscriber || null;
|
|
10
|
-
const isCommentsOnMediaAnalyticsEnabled = inlineCommentProvider === null || inlineCommentProvider === void 0 ? void 0 : inlineCommentProvider.isCommentsOnMediaAnalyticsEnabled;
|
|
11
10
|
const viewComponentProps = useAnnotationClickEvent({
|
|
12
11
|
updateSubscriber,
|
|
13
|
-
createAnalyticsEvent: props.createAnalyticsEvent
|
|
14
|
-
isCommentsOnMediaAnalyticsEnabled
|
|
12
|
+
createAnalyticsEvent: props.createAnalyticsEvent
|
|
15
13
|
});
|
|
16
14
|
const ViewComponent = inlineCommentProvider && inlineCommentProvider.viewComponent;
|
|
17
15
|
const deleteAnnotation = useMemo(() => annotationInfo => actionContext.deleteAnnotation(annotationInfo.id, annotationInfo.type), [actionContext]);
|
|
@@ -1,3 +1,12 @@
|
|
|
1
|
+
import _classCallCheck from "@babel/runtime/helpers/classCallCheck";
|
|
2
|
+
import _createClass from "@babel/runtime/helpers/createClass";
|
|
3
|
+
import _assertThisInitialized from "@babel/runtime/helpers/assertThisInitialized";
|
|
4
|
+
import _inherits from "@babel/runtime/helpers/inherits";
|
|
5
|
+
import _possibleConstructorReturn from "@babel/runtime/helpers/possibleConstructorReturn";
|
|
6
|
+
import _getPrototypeOf from "@babel/runtime/helpers/getPrototypeOf";
|
|
7
|
+
import _defineProperty from "@babel/runtime/helpers/defineProperty";
|
|
8
|
+
function _createSuper(t) { var r = _isNativeReflectConstruct(); return function () { var e, o = _getPrototypeOf(t); if (r) { var s = _getPrototypeOf(this).constructor; e = Reflect.construct(o, arguments, s); } else e = o.apply(this, arguments); return _possibleConstructorReturn(this, e); }; }
|
|
9
|
+
function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); } catch (t) {} return (_isNativeReflectConstruct = function _isNativeReflectConstruct() { return !!t; })(); }
|
|
1
10
|
/**
|
|
2
11
|
* @jsxRuntime classic
|
|
3
12
|
* @jsx jsx
|
|
@@ -5,9 +14,84 @@
|
|
|
5
14
|
// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
|
|
6
15
|
import { jsx } from '@emotion/react';
|
|
7
16
|
import { fg } from '@atlaskit/platform-feature-flags';
|
|
8
|
-
import {
|
|
9
|
-
import {
|
|
17
|
+
import { ResourcedEmoji } from '@atlaskit/emoji/element';
|
|
18
|
+
import { PureComponent, memo } from 'react';
|
|
19
|
+
import { ProviderFactory, WithProviders } from '@atlaskit/editor-common/provider-factory';
|
|
10
20
|
import { useInlineAnnotationProps } from '../../ui/annotations/element/useInlineAnnotationProps';
|
|
21
|
+
// eslint-disable-next-line @repo/internal/react/no-class-components
|
|
22
|
+
var EmojiNode = /*#__PURE__*/function (_PureComponent) {
|
|
23
|
+
_inherits(EmojiNode, _PureComponent);
|
|
24
|
+
var _super = _createSuper(EmojiNode);
|
|
25
|
+
function EmojiNode(props) {
|
|
26
|
+
var _this;
|
|
27
|
+
_classCallCheck(this, EmojiNode);
|
|
28
|
+
_this = _super.call(this, props);
|
|
29
|
+
_defineProperty(_assertThisInitialized(_this), "renderWithProvider", function (providers) {
|
|
30
|
+
var _resourceConfig$optim;
|
|
31
|
+
var _this$props = _this.props,
|
|
32
|
+
allowTextFallback = _this$props.allowTextFallback,
|
|
33
|
+
shortName = _this$props.shortName,
|
|
34
|
+
id = _this$props.id,
|
|
35
|
+
fallback = _this$props.fallback,
|
|
36
|
+
fitToHeight = _this$props.fitToHeight,
|
|
37
|
+
showTooltip = _this$props.showTooltip,
|
|
38
|
+
resourceConfig = _this$props.resourceConfig;
|
|
39
|
+
if (allowTextFallback && !providers.emojiProvider) {
|
|
40
|
+
return jsx("span", {
|
|
41
|
+
"data-emoji-id": id,
|
|
42
|
+
"data-emoji-short-name": shortName,
|
|
43
|
+
"data-emoji-text": fallback || shortName
|
|
44
|
+
}, fallback || shortName);
|
|
45
|
+
}
|
|
46
|
+
if (!providers.emojiProvider) {
|
|
47
|
+
return null;
|
|
48
|
+
}
|
|
49
|
+
return jsx(ResourcedEmoji, {
|
|
50
|
+
emojiId: {
|
|
51
|
+
id: id,
|
|
52
|
+
fallback: fallback,
|
|
53
|
+
shortName: shortName
|
|
54
|
+
},
|
|
55
|
+
emojiProvider: providers.emojiProvider,
|
|
56
|
+
showTooltip: showTooltip,
|
|
57
|
+
fitToHeight: fitToHeight,
|
|
58
|
+
optimistic: true,
|
|
59
|
+
optimisticImageURL: resourceConfig === null || resourceConfig === void 0 || (_resourceConfig$optim = resourceConfig.optimisticImageApi) === null || _resourceConfig$optim === void 0 ? void 0 : _resourceConfig$optim.getUrl({
|
|
60
|
+
id: id,
|
|
61
|
+
fallback: fallback,
|
|
62
|
+
shortName: shortName
|
|
63
|
+
}),
|
|
64
|
+
editorEmoji: true
|
|
65
|
+
});
|
|
66
|
+
});
|
|
67
|
+
_this.providerFactory = props.providers || new ProviderFactory();
|
|
68
|
+
return _this;
|
|
69
|
+
}
|
|
70
|
+
_createClass(EmojiNode, [{
|
|
71
|
+
key: "componentWillUnmount",
|
|
72
|
+
value: function componentWillUnmount() {
|
|
73
|
+
if (!this.props.providers) {
|
|
74
|
+
// new ProviderFactory is created if no `providers` has been set
|
|
75
|
+
// in this case when component is unmounted it's safe to destroy this providerFactory
|
|
76
|
+
this.providerFactory.destroy();
|
|
77
|
+
}
|
|
78
|
+
}
|
|
79
|
+
}, {
|
|
80
|
+
key: "render",
|
|
81
|
+
value: function render() {
|
|
82
|
+
return jsx(WithProviders, {
|
|
83
|
+
providers: ['emojiProvider'],
|
|
84
|
+
providerFactory: this.providerFactory,
|
|
85
|
+
renderNode: this.renderWithProvider
|
|
86
|
+
});
|
|
87
|
+
}
|
|
88
|
+
}]);
|
|
89
|
+
return EmojiNode;
|
|
90
|
+
}(PureComponent);
|
|
91
|
+
_defineProperty(EmojiNode, "displayName", 'EmojiNode');
|
|
92
|
+
_defineProperty(EmojiNode, "defaultProps", {
|
|
93
|
+
showTooltip: true
|
|
94
|
+
});
|
|
11
95
|
function EmojiItem(props) {
|
|
12
96
|
var id = props.id,
|
|
13
97
|
providers = props.providers,
|
|
@@ -17,7 +101,7 @@ function EmojiItem(props) {
|
|
|
17
101
|
resourceConfig = props.resourceConfig;
|
|
18
102
|
var inlineAnnotationProps = useInlineAnnotationProps(props);
|
|
19
103
|
if (fg('editor_inline_comments_on_inline_nodes')) {
|
|
20
|
-
return jsx("span", inlineAnnotationProps, jsx(
|
|
104
|
+
return jsx("span", inlineAnnotationProps, jsx(EmojiNode, {
|
|
21
105
|
allowTextFallback: true,
|
|
22
106
|
id: id,
|
|
23
107
|
shortName: shortName,
|
|
@@ -27,7 +111,7 @@ function EmojiItem(props) {
|
|
|
27
111
|
resourceConfig: resourceConfig
|
|
28
112
|
}));
|
|
29
113
|
}
|
|
30
|
-
return jsx(
|
|
114
|
+
return jsx(EmojiNode, {
|
|
31
115
|
allowTextFallback: true,
|
|
32
116
|
id: id,
|
|
33
117
|
shortName: shortName,
|
|
@@ -55,7 +55,7 @@ import { nodeToReact } from '../../react/nodes';
|
|
|
55
55
|
export var NORMAL_SEVERITY_THRESHOLD = 2000;
|
|
56
56
|
export var DEGRADED_SEVERITY_THRESHOLD = 3000;
|
|
57
57
|
var packageName = "@atlaskit/renderer";
|
|
58
|
-
var packageVersion = "
|
|
58
|
+
var packageVersion = "111.0.0";
|
|
59
59
|
export var defaultNodeComponents = nodeToReact;
|
|
60
60
|
export var Renderer = /*#__PURE__*/function (_PureComponent) {
|
|
61
61
|
_inherits(Renderer, _PureComponent);
|
|
@@ -76,8 +76,7 @@ export var useAnnotationClickEvent = function useAnnotationClickEvent(props) {
|
|
|
76
76
|
annotationClickEvent = _useState6[0],
|
|
77
77
|
setAnnotationClickEvent = _useState6[1];
|
|
78
78
|
var updateSubscriber = props.updateSubscriber,
|
|
79
|
-
createAnalyticsEvent = props.createAnalyticsEvent
|
|
80
|
-
isCommentsOnMediaAnalyticsEnabled = props.isCommentsOnMediaAnalyticsEnabled;
|
|
79
|
+
createAnalyticsEvent = props.createAnalyticsEvent;
|
|
81
80
|
var isInlineCommentsKbAccessible = FeatureGates.checkGate('inline_comments_keyboard_accessible_renderer');
|
|
82
81
|
useLayoutEffect(function () {
|
|
83
82
|
if (!updateSubscriber) {
|
|
@@ -102,12 +101,11 @@ export var useAnnotationClickEvent = function useAnnotationClickEvent(props) {
|
|
|
102
101
|
actionSubject: ACTION_SUBJECT.ANNOTATION,
|
|
103
102
|
actionSubjectId: ACTION_SUBJECT_ID.INLINE_COMMENT,
|
|
104
103
|
eventType: EVENT_TYPE.TRACK,
|
|
105
|
-
attributes:
|
|
106
|
-
overlap: annotationsByType.length || 0
|
|
107
|
-
}, isCommentsOnMediaAnalyticsEnabled && {
|
|
104
|
+
attributes: {
|
|
105
|
+
overlap: annotationsByType.length || 0,
|
|
108
106
|
targetNodeType: eventTargetType,
|
|
109
107
|
method: viewMethod
|
|
110
|
-
}
|
|
108
|
+
}
|
|
111
109
|
}).fire(FabricChannel.editor);
|
|
112
110
|
}
|
|
113
111
|
setAnnotationClickEvent({
|
|
@@ -130,6 +128,6 @@ export var useAnnotationClickEvent = function useAnnotationClickEvent(props) {
|
|
|
130
128
|
updateSubscriber.off(AnnotationUpdateEvent.ON_ANNOTATION_CLICK, clickCb);
|
|
131
129
|
updateSubscriber.off(AnnotationUpdateEvent.DESELECT_ANNOTATIONS, deselectCb);
|
|
132
130
|
};
|
|
133
|
-
}, [updateSubscriber, createAnalyticsEvent,
|
|
131
|
+
}, [updateSubscriber, createAnalyticsEvent, isInlineCommentsKbAccessible]);
|
|
134
132
|
return annotationClickEvent;
|
|
135
133
|
};
|
|
@@ -7,11 +7,9 @@ var AnnotationView = function AnnotationView(props) {
|
|
|
7
7
|
var actionContext = useContext(RendererContext);
|
|
8
8
|
var inlineCommentProvider = providers && providers.inlineComment;
|
|
9
9
|
var updateSubscriber = inlineCommentProvider && inlineCommentProvider.updateSubscriber || null;
|
|
10
|
-
var isCommentsOnMediaAnalyticsEnabled = inlineCommentProvider === null || inlineCommentProvider === void 0 ? void 0 : inlineCommentProvider.isCommentsOnMediaAnalyticsEnabled;
|
|
11
10
|
var viewComponentProps = useAnnotationClickEvent({
|
|
12
11
|
updateSubscriber: updateSubscriber,
|
|
13
|
-
createAnalyticsEvent: props.createAnalyticsEvent
|
|
14
|
-
isCommentsOnMediaAnalyticsEnabled: isCommentsOnMediaAnalyticsEnabled
|
|
12
|
+
createAnalyticsEvent: props.createAnalyticsEvent
|
|
15
13
|
});
|
|
16
14
|
var ViewComponent = inlineCommentProvider && inlineCommentProvider.viewComponent;
|
|
17
15
|
var deleteAnnotation = useMemo(function () {
|
|
@@ -4,14 +4,17 @@
|
|
|
4
4
|
* @jsx jsx
|
|
5
5
|
*/
|
|
6
6
|
import { jsx } from '@emotion/react';
|
|
7
|
-
import { type EmojiAttributes } from '@atlaskit/adf-schema';
|
|
8
7
|
import { type EmojiResourceConfig } from '@atlaskit/emoji/resource';
|
|
9
|
-
import {
|
|
8
|
+
import { ProviderFactory } from '@atlaskit/editor-common/provider-factory';
|
|
9
|
+
import type { EmojiId } from '@atlaskit/emoji/types';
|
|
10
10
|
import { type MarkDataAttributes } from '../../ui/annotations/element/useInlineAnnotationProps';
|
|
11
|
-
|
|
11
|
+
import { type EmojiAttributes } from '@atlaskit/adf-schema';
|
|
12
|
+
export interface EmojiProps extends EmojiId, EmojiAttributes, MarkDataAttributes {
|
|
13
|
+
allowTextFallback?: boolean;
|
|
12
14
|
providers?: ProviderFactory;
|
|
13
|
-
resourceConfig?: EmojiResourceConfig;
|
|
14
15
|
fitToHeight?: number;
|
|
16
|
+
showTooltip?: boolean;
|
|
17
|
+
resourceConfig?: EmojiResourceConfig;
|
|
15
18
|
}
|
|
16
19
|
declare function EmojiItem(props: EmojiProps): jsx.JSX.Element;
|
|
17
20
|
declare namespace EmojiItem {
|
|
@@ -3,12 +3,6 @@ export interface SmartLinksOptions {
|
|
|
3
3
|
ssr?: boolean;
|
|
4
4
|
showAuthTooltip?: boolean;
|
|
5
5
|
hideHoverPreview?: boolean;
|
|
6
|
-
/**
|
|
7
|
-
* @deprecated {@link https://hello.atlassian.net/browse/ENGHEALTH-6348 Internal documentation for deprecation (no external access)}
|
|
8
|
-
*
|
|
9
|
-
* Prefer `actionOptions` prop.
|
|
10
|
-
*/
|
|
11
|
-
showServerActions?: boolean;
|
|
12
6
|
actionOptions?: CardProps['actionOptions'];
|
|
13
7
|
frameStyle?: CardProps['frameStyle'];
|
|
14
8
|
}
|
|
@@ -14,7 +14,5 @@ type UseAnnotationUpdateSatteByEventProps = {
|
|
|
14
14
|
export declare const useAnnotationStateByTypeEvent: ({ type, updateSubscriber, }: UseAnnotationUpdateSatteByEventProps) => Record<string, AnnotationMarkStates | null>;
|
|
15
15
|
export declare const useHasFocusEvent: ({ id, updateSubscriber }: ListenEventProps) => boolean;
|
|
16
16
|
type AnnotationsWithClickTarget = Pick<InlineCommentViewComponentProps, 'annotations' | 'clickElementTarget'> | null;
|
|
17
|
-
export declare const useAnnotationClickEvent: (props: Pick<ListenEventProps,
|
|
18
|
-
isCommentsOnMediaAnalyticsEnabled?: boolean | undefined;
|
|
19
|
-
}) => AnnotationsWithClickTarget;
|
|
17
|
+
export declare const useAnnotationClickEvent: (props: Pick<ListenEventProps, 'updateSubscriber' | 'createAnalyticsEvent'>) => AnnotationsWithClickTarget;
|
|
20
18
|
export {};
|
|
@@ -4,14 +4,17 @@
|
|
|
4
4
|
* @jsx jsx
|
|
5
5
|
*/
|
|
6
6
|
import { jsx } from '@emotion/react';
|
|
7
|
-
import { type EmojiAttributes } from '@atlaskit/adf-schema';
|
|
8
7
|
import { type EmojiResourceConfig } from '@atlaskit/emoji/resource';
|
|
9
|
-
import {
|
|
8
|
+
import { ProviderFactory } from '@atlaskit/editor-common/provider-factory';
|
|
9
|
+
import type { EmojiId } from '@atlaskit/emoji/types';
|
|
10
10
|
import { type MarkDataAttributes } from '../../ui/annotations/element/useInlineAnnotationProps';
|
|
11
|
-
|
|
11
|
+
import { type EmojiAttributes } from '@atlaskit/adf-schema';
|
|
12
|
+
export interface EmojiProps extends EmojiId, EmojiAttributes, MarkDataAttributes {
|
|
13
|
+
allowTextFallback?: boolean;
|
|
12
14
|
providers?: ProviderFactory;
|
|
13
|
-
resourceConfig?: EmojiResourceConfig;
|
|
14
15
|
fitToHeight?: number;
|
|
16
|
+
showTooltip?: boolean;
|
|
17
|
+
resourceConfig?: EmojiResourceConfig;
|
|
15
18
|
}
|
|
16
19
|
declare function EmojiItem(props: EmojiProps): jsx.JSX.Element;
|
|
17
20
|
declare namespace EmojiItem {
|
|
@@ -3,12 +3,6 @@ export interface SmartLinksOptions {
|
|
|
3
3
|
ssr?: boolean;
|
|
4
4
|
showAuthTooltip?: boolean;
|
|
5
5
|
hideHoverPreview?: boolean;
|
|
6
|
-
/**
|
|
7
|
-
* @deprecated {@link https://hello.atlassian.net/browse/ENGHEALTH-6348 Internal documentation for deprecation (no external access)}
|
|
8
|
-
*
|
|
9
|
-
* Prefer `actionOptions` prop.
|
|
10
|
-
*/
|
|
11
|
-
showServerActions?: boolean;
|
|
12
6
|
actionOptions?: CardProps['actionOptions'];
|
|
13
7
|
frameStyle?: CardProps['frameStyle'];
|
|
14
8
|
}
|
|
@@ -14,7 +14,5 @@ type UseAnnotationUpdateSatteByEventProps = {
|
|
|
14
14
|
export declare const useAnnotationStateByTypeEvent: ({ type, updateSubscriber, }: UseAnnotationUpdateSatteByEventProps) => Record<string, AnnotationMarkStates | null>;
|
|
15
15
|
export declare const useHasFocusEvent: ({ id, updateSubscriber }: ListenEventProps) => boolean;
|
|
16
16
|
type AnnotationsWithClickTarget = Pick<InlineCommentViewComponentProps, 'annotations' | 'clickElementTarget'> | null;
|
|
17
|
-
export declare const useAnnotationClickEvent: (props: Pick<ListenEventProps,
|
|
18
|
-
isCommentsOnMediaAnalyticsEnabled?: boolean | undefined;
|
|
19
|
-
}) => AnnotationsWithClickTarget;
|
|
17
|
+
export declare const useAnnotationClickEvent: (props: Pick<ListenEventProps, 'updateSubscriber' | 'createAnalyticsEvent'>) => AnnotationsWithClickTarget;
|
|
20
18
|
export {};
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@atlaskit/renderer",
|
|
3
|
-
"version": "
|
|
3
|
+
"version": "111.0.0",
|
|
4
4
|
"description": "Renderer component",
|
|
5
5
|
"publishConfig": {
|
|
6
6
|
"registry": "https://registry.npmjs.org/"
|
|
@@ -29,7 +29,7 @@
|
|
|
29
29
|
"@atlaskit/analytics-next": "^10.1.0",
|
|
30
30
|
"@atlaskit/button": "^20.2.0",
|
|
31
31
|
"@atlaskit/code": "^15.6.0",
|
|
32
|
-
"@atlaskit/editor-common": "^
|
|
32
|
+
"@atlaskit/editor-common": "^92.0.0",
|
|
33
33
|
"@atlaskit/editor-json-transformer": "^8.18.0",
|
|
34
34
|
"@atlaskit/editor-palette": "1.6.1",
|
|
35
35
|
"@atlaskit/editor-prosemirror": "6.0.0",
|
|
@@ -46,7 +46,7 @@
|
|
|
46
46
|
"@atlaskit/media-ui": "^25.15.0",
|
|
47
47
|
"@atlaskit/media-viewer": "^48.10.0",
|
|
48
48
|
"@atlaskit/platform-feature-flags": "^0.3.0",
|
|
49
|
-
"@atlaskit/smart-card": "^
|
|
49
|
+
"@atlaskit/smart-card": "^29.0.0",
|
|
50
50
|
"@atlaskit/status": "^1.5.0",
|
|
51
51
|
"@atlaskit/task-decision": "^17.11.0",
|
|
52
52
|
"@atlaskit/theme": "^13.0.0",
|