@atlaskit/renderer 132.0.4 → 132.1.1
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/react/nodes/blockCard.js +15 -5
- package/dist/cjs/react/nodes/embedCard.js +8 -1
- package/dist/cjs/react/nodes/heading-anchor.js +29 -2
- package/dist/cjs/react/nodes/inlineCard.js +7 -0
- package/dist/cjs/react/nodes/multiBodiedExtension/context.js +36 -7
- package/dist/cjs/react/nodes/multiBodiedExtension.js +2 -0
- package/dist/cjs/react/utils/getCardClickHandler.js +8 -3
- package/dist/cjs/ui/Renderer/index.js +1 -1
- package/dist/es2019/react/nodes/blockCard.js +12 -2
- package/dist/es2019/react/nodes/embedCard.js +8 -1
- package/dist/es2019/react/nodes/heading-anchor.js +28 -0
- package/dist/es2019/react/nodes/inlineCard.js +7 -0
- package/dist/es2019/react/nodes/multiBodiedExtension/context.js +34 -4
- package/dist/es2019/react/nodes/multiBodiedExtension.js +2 -0
- package/dist/es2019/react/utils/getCardClickHandler.js +8 -3
- package/dist/es2019/ui/Renderer/index.js +1 -1
- package/dist/esm/react/nodes/blockCard.js +12 -2
- package/dist/esm/react/nodes/embedCard.js +8 -1
- package/dist/esm/react/nodes/heading-anchor.js +29 -2
- package/dist/esm/react/nodes/inlineCard.js +7 -0
- package/dist/esm/react/nodes/multiBodiedExtension/context.js +36 -7
- package/dist/esm/react/nodes/multiBodiedExtension.js +2 -0
- package/dist/esm/react/utils/getCardClickHandler.js +8 -3
- package/dist/esm/ui/Renderer/index.js +1 -1
- package/dist/types/react/nodes/multiBodiedExtension/context.d.ts +3 -1
- package/dist/types/react/utils/getCardClickHandler.d.ts +2 -1
- package/dist/types-ts4.5/react/nodes/multiBodiedExtension/context.d.ts +3 -1
- package/dist/types-ts4.5/react/utils/getCardClickHandler.d.ts +2 -1
- package/package.json +10 -3
package/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,26 @@
|
|
|
1
1
|
# @atlaskit/renderer
|
|
2
2
|
|
|
3
|
+
## 132.1.1
|
|
4
|
+
|
|
5
|
+
### Patch Changes
|
|
6
|
+
|
|
7
|
+
- [`03ac1a9785ec4`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/03ac1a9785ec4) -
|
|
8
|
+
Use extension handler renderers for multi-bodied extensions.
|
|
9
|
+
- Updated dependencies
|
|
10
|
+
|
|
11
|
+
## 132.1.0
|
|
12
|
+
|
|
13
|
+
### Minor Changes
|
|
14
|
+
|
|
15
|
+
- [`3b2848cddfcb6`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/3b2848cddfcb6) -
|
|
16
|
+
[ux] update heading link focus logic
|
|
17
|
+
|
|
18
|
+
### Patch Changes
|
|
19
|
+
|
|
20
|
+
- [`b108dbe3ff3fa`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/b108dbe3ff3fa) -
|
|
21
|
+
Return destination url from smart link onClick callback.
|
|
22
|
+
- Updated dependencies
|
|
23
|
+
|
|
3
24
|
## 132.0.4
|
|
4
25
|
|
|
5
26
|
### Patch Changes
|
|
@@ -12,13 +12,14 @@ var _ui = require("@atlaskit/editor-common/ui");
|
|
|
12
12
|
var _fallback = require("./fallback");
|
|
13
13
|
var _editorSmartLinkDraggable = require("@atlaskit/editor-smart-link-draggable");
|
|
14
14
|
var _getCardClickHandler = require("../utils/getCardClickHandler");
|
|
15
|
+
var _utils = require("../../utils");
|
|
15
16
|
var _inlineCard = _interopRequireDefault(require("./inlineCard"));
|
|
16
17
|
var _analyticsNext = require("@atlaskit/analytics-next");
|
|
17
18
|
var _linkDatasource = require("@atlaskit/link-datasource");
|
|
18
19
|
var _ssr = require("@atlaskit/smart-card/ssr");
|
|
19
20
|
var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
|
|
20
21
|
var _expValEquals = require("@atlaskit/tmp-editor-statsig/exp-val-equals");
|
|
21
|
-
var
|
|
22
|
+
var _utils2 = require("@atlaskit/editor-common/utils");
|
|
22
23
|
var _PortalContext = require("../../ui/Renderer/PortalContext");
|
|
23
24
|
var _consts = require("../../consts");
|
|
24
25
|
/**
|
|
@@ -66,7 +67,12 @@ function BlockCard(props) {
|
|
|
66
67
|
var portal = (0, _PortalContext.usePortal)(props);
|
|
67
68
|
var _ref = smartLinks || {},
|
|
68
69
|
actionOptions = _ref.actionOptions;
|
|
70
|
+
|
|
71
|
+
// Card/CardSSR's onClick — (e, { destinationUrl?, url? })
|
|
69
72
|
var onClick = (0, _getCardClickHandler.getCardClickHandler)(eventHandlers, url);
|
|
73
|
+
// SmartCardEventClickHandler — (e, url?) => void — for CardErrorBoundary.
|
|
74
|
+
// When the gate is off, fall back to the old behaviour (pass the same onClick as Card).
|
|
75
|
+
var onConsumerClick = (0, _platformFeatureFlags.fg)('platform_smartlink_xpc_url_wrapping') ? (0, _utils.getEventHandler)(eventHandlers, 'smartCard') : onClick;
|
|
70
76
|
var platform = 'web';
|
|
71
77
|
var cardProps = {
|
|
72
78
|
url: url,
|
|
@@ -95,7 +101,7 @@ function BlockCard(props) {
|
|
|
95
101
|
var tableView = views.find(function (view) {
|
|
96
102
|
return view.type === 'table';
|
|
97
103
|
});
|
|
98
|
-
var shouldRenderDatasource = tableView && (0,
|
|
104
|
+
var shouldRenderDatasource = tableView && (0, _utils2.canRenderDatasource)(props.datasource.id);
|
|
99
105
|
if (shouldRenderDatasource) {
|
|
100
106
|
var _tableView$properties;
|
|
101
107
|
var columns = (_tableView$properties = tableView.properties) === null || _tableView$properties === void 0 ? void 0 : _tableView$properties.columns;
|
|
@@ -130,7 +136,9 @@ function BlockCard(props) {
|
|
|
130
136
|
onSetLinkTarget: onSetLinkTarget
|
|
131
137
|
// Ignored via go/ees005
|
|
132
138
|
// eslint-disable-next-line react/jsx-props-no-spreading
|
|
133
|
-
}, cardProps
|
|
139
|
+
}, cardProps, {
|
|
140
|
+
onClick: onConsumerClick
|
|
141
|
+
}), (0, _react.jsx)(_ui.WidthConsumer, null, function (_ref5) {
|
|
134
142
|
var width = _ref5.width;
|
|
135
143
|
var useStickySafeCentering = (0, _expValEquals.expValEquals)('platform_editor_flex_based_centering', 'isEnabled', true);
|
|
136
144
|
var useCenterWrapper = !isNodeNested && useStickySafeCentering;
|
|
@@ -140,7 +148,7 @@ function BlockCard(props) {
|
|
|
140
148
|
"data-local-id": localId,
|
|
141
149
|
style: {
|
|
142
150
|
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
|
|
143
|
-
width: isNodeNested ? '100%' : (0,
|
|
151
|
+
width: isNodeNested ? '100%' : (0, _utils2.calcBreakoutWidth)(layout, width)
|
|
144
152
|
}
|
|
145
153
|
}, (0, _react.jsx)(_linkDatasource.DatasourceTableView, {
|
|
146
154
|
datasourceId: datasource.id,
|
|
@@ -213,5 +221,7 @@ function BlockCard(props) {
|
|
|
213
221
|
onSetLinkTarget: onSetLinkTarget
|
|
214
222
|
// Ignored via go/ees005
|
|
215
223
|
// eslint-disable-next-line react/jsx-props-no-spreading
|
|
216
|
-
}, cardProps
|
|
224
|
+
}, cardProps, {
|
|
225
|
+
onClick: onConsumerClick
|
|
226
|
+
}), cardComponent))));
|
|
217
227
|
}
|
|
@@ -23,6 +23,7 @@ var _editorSmartLinkDraggable = require("@atlaskit/editor-smart-link-draggable")
|
|
|
23
23
|
var _consts = require("../../consts");
|
|
24
24
|
var _style = require("../../ui/Renderer/style");
|
|
25
25
|
var _getCardClickHandler = require("../utils/getCardClickHandler");
|
|
26
|
+
var _utils = require("../../utils");
|
|
26
27
|
var _analyticsNext = require("@atlaskit/analytics-next");
|
|
27
28
|
var _PortalContext = require("../../ui/Renderer/PortalContext");
|
|
28
29
|
var _blockCard = _interopRequireDefault(require("./blockCard"));
|
|
@@ -73,7 +74,11 @@ function EmbedCardInternal(props) {
|
|
|
73
74
|
onSetLinkTarget = props.onSetLinkTarget;
|
|
74
75
|
var portal = (0, _PortalContext.usePortal)(props);
|
|
75
76
|
var embedIframeRef = (0, _react2.useRef)(null);
|
|
77
|
+
// Card/CardSSR's onClick — (e, { destinationUrl?, url? })
|
|
76
78
|
var onClick = (0, _getCardClickHandler.getCardClickHandler)(eventHandlers, url);
|
|
79
|
+
// SmartCardEventClickHandler — (e, url?) => void — for CardErrorBoundary.
|
|
80
|
+
// When the gate is off, fall back to the old behaviour (pass the same onClick as Card).
|
|
81
|
+
var onConsumerClick = (0, _platformFeatureFlags.fg)('platform_smartlink_xpc_url_wrapping') ? (0, _utils.getEventHandler)(eventHandlers, 'smartCard') : onClick;
|
|
77
82
|
var _ref = smartLinks || {},
|
|
78
83
|
actionOptions = _ref.actionOptions;
|
|
79
84
|
var platform = 'web';
|
|
@@ -210,7 +215,9 @@ function EmbedCardInternal(props) {
|
|
|
210
215
|
unsupportedComponent: _ui.UnsupportedBlock,
|
|
211
216
|
onSetLinkTarget: onSetLinkTarget
|
|
212
217
|
// eslint-disable-next-line react/jsx-props-no-spreading
|
|
213
|
-
}, cardProps
|
|
218
|
+
}, cardProps, {
|
|
219
|
+
onClick: onConsumerClick
|
|
220
|
+
}), (0, _react.jsx)(_smartCard.EmbedResizeMessageListener, {
|
|
214
221
|
embedIframeRef: embedIframeRef,
|
|
215
222
|
onHeightUpdate: setLiveHeight
|
|
216
223
|
}, function () {
|
|
@@ -60,12 +60,24 @@ var HeadingAnchor = /*#__PURE__*/function (_React$PureComponent) {
|
|
|
60
60
|
tooltipMessage: '',
|
|
61
61
|
isClicked: false
|
|
62
62
|
});
|
|
63
|
+
// Stable reference for Tooltip content prop to avoid recreating on each render
|
|
64
|
+
(0, _defineProperty2.default)(_this, "renderTooltipContent", function (_ref) {
|
|
65
|
+
var update = _ref.update;
|
|
66
|
+
_this._tooltipUpdate = update;
|
|
67
|
+
return _this.state.tooltipMessage;
|
|
68
|
+
});
|
|
63
69
|
(0, _defineProperty2.default)(_this, "setTooltipState", function (message) {
|
|
64
70
|
var isClicked = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false;
|
|
65
71
|
_this.setState({
|
|
66
72
|
// TODO: ED-14403 - investigate why this does not translate
|
|
67
73
|
tooltipMessage: _this.props.intl.formatMessage(message),
|
|
68
74
|
isClicked: isClicked
|
|
75
|
+
}, function () {
|
|
76
|
+
// Reposition tooltip after content change (replaces the key-based remount)
|
|
77
|
+
if ((0, _expValEquals.expValEquals)('a11y-fixes-week4-may-2026', 'isEnabled', true)) {
|
|
78
|
+
var _this$_tooltipUpdate, _this2;
|
|
79
|
+
(_this$_tooltipUpdate = (_this2 = _this)._tooltipUpdate) === null || _this$_tooltipUpdate === void 0 || _this$_tooltipUpdate.call(_this2);
|
|
80
|
+
}
|
|
69
81
|
});
|
|
70
82
|
});
|
|
71
83
|
(0, _defineProperty2.default)(_this, "getCopyAriaLabel", function () {
|
|
@@ -73,7 +85,7 @@ var HeadingAnchor = /*#__PURE__*/function (_React$PureComponent) {
|
|
|
73
85
|
return _this.props.intl.formatMessage(copyAriaLabel);
|
|
74
86
|
});
|
|
75
87
|
(0, _defineProperty2.default)(_this, "copyToClipboard", /*#__PURE__*/function () {
|
|
76
|
-
var
|
|
88
|
+
var _ref2 = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee(event) {
|
|
77
89
|
var copiedHeadingLinkToClipboard, failedToCopyHeadingLink, _t;
|
|
78
90
|
return _regenerator.default.wrap(function (_context) {
|
|
79
91
|
while (1) switch (_context.prev = _context.next) {
|
|
@@ -98,7 +110,7 @@ var HeadingAnchor = /*#__PURE__*/function (_React$PureComponent) {
|
|
|
98
110
|
}, _callee, null, [[1, 3]]);
|
|
99
111
|
}));
|
|
100
112
|
return function (_x) {
|
|
101
|
-
return
|
|
113
|
+
return _ref2.apply(this, arguments);
|
|
102
114
|
};
|
|
103
115
|
}());
|
|
104
116
|
(0, _defineProperty2.default)(_this, "resetMessage", function () {
|
|
@@ -146,6 +158,21 @@ var HeadingAnchor = /*#__PURE__*/function (_React$PureComponent) {
|
|
|
146
158
|
value: function render() {
|
|
147
159
|
var tooltipMessage = this.state.tooltipMessage;
|
|
148
160
|
if (tooltipMessage) {
|
|
161
|
+
if ((0, _expValEquals.expValEquals)('a11y-fixes-week4-may-2026', 'isEnabled', true)) {
|
|
162
|
+
// Fix for A11Y-30972: Use content as a function with update callback so
|
|
163
|
+
// the Tooltip repositions without unmounting (which caused focus loss).
|
|
164
|
+
// @see https://hello.jira.atlassian.cloud/browse/A11Y-30972
|
|
165
|
+
return (0, _react2.jsx)(_tooltip.default
|
|
166
|
+
// @ts-ignore: [PIT-1685] Fails in post-office due to backwards incompatibility issue with React 18
|
|
167
|
+
, {
|
|
168
|
+
tag: CopyAnchorWrapperWithRef,
|
|
169
|
+
content: this.renderTooltipContent,
|
|
170
|
+
position: "top",
|
|
171
|
+
delay: 0,
|
|
172
|
+
isScreenReaderAnnouncementDisabled: (0, _expValEquals.expValEquals)('platform_editor_copy_link_a11y_inconsistency_fix', 'isEnabled', true) ? true : false
|
|
173
|
+
}, this.renderAnchorButton());
|
|
174
|
+
}
|
|
175
|
+
|
|
149
176
|
// We set the key to the message to ensure it remounts when the message
|
|
150
177
|
// changes, so that it correctly repositions.
|
|
151
178
|
// @see https://ecosystem.atlassian.net/projects/AK/queues/issue/AK-6548
|
|
@@ -26,6 +26,7 @@ var _providerFactory = require("@atlaskit/editor-common/provider-factory");
|
|
|
26
26
|
var _fallback = require("./fallback");
|
|
27
27
|
var _SmartCardStorage = require("../../ui/SmartCardStorage");
|
|
28
28
|
var _getCardClickHandler = require("../utils/getCardClickHandler");
|
|
29
|
+
var _utils2 = require("../../utils");
|
|
29
30
|
var _useInlineAnnotationProps = require("../../ui/annotations/element/useInlineAnnotationProps");
|
|
30
31
|
var _PortalContext = require("../../ui/Renderer/PortalContext");
|
|
31
32
|
var _linkExtractors = require("@atlaskit/link-extractors");
|
|
@@ -174,7 +175,12 @@ var InlineCard = function InlineCard(props) {
|
|
|
174
175
|
isResolvedViewRendered = _useState2[0],
|
|
175
176
|
setIsResolvedViewRendered = _useState2[1];
|
|
176
177
|
var cardState = getSmartlinkState === null || getSmartlinkState === void 0 ? void 0 : getSmartlinkState()[url || ''];
|
|
178
|
+
|
|
179
|
+
// Card/CardSSR's onClick — (e, { destinationUrl?, url? })
|
|
177
180
|
var onClick = (0, _getCardClickHandler.getCardClickHandler)(eventHandlers, url);
|
|
181
|
+
// SmartCardEventClickHandler — (e, url?) => void — for CardErrorBoundary.
|
|
182
|
+
// When the gate is off, fall back to the old behaviour (pass the same onClick as Card).
|
|
183
|
+
var onConsumerClick = (0, _platformFeatureFlags.fg)('platform_smartlink_xpc_url_wrapping') ? (0, _utils2.getEventHandler)(eventHandlers, 'smartCard') : onClick;
|
|
178
184
|
var cardProps = {
|
|
179
185
|
url: url,
|
|
180
186
|
data: data,
|
|
@@ -367,6 +373,7 @@ var InlineCard = function InlineCard(props) {
|
|
|
367
373
|
// Ignored via go/ees005
|
|
368
374
|
// eslint-disable-next-line react/jsx-props-no-spreading
|
|
369
375
|
}, cardProps, {
|
|
376
|
+
onClick: onConsumerClick,
|
|
370
377
|
onSetLinkTarget: onSetLinkTarget
|
|
371
378
|
}), (0, _react2.jsx)(MaybeOverlay, {
|
|
372
379
|
url: url || '',
|
|
@@ -10,9 +10,20 @@ var _react = _interopRequireDefault(require("react"));
|
|
|
10
10
|
var _memoizeOne = _interopRequireDefault(require("memoize-one"));
|
|
11
11
|
var _extensions = require("@atlaskit/editor-common/extensions");
|
|
12
12
|
var _providerFactory = require("@atlaskit/editor-common/provider-factory");
|
|
13
|
-
var
|
|
14
|
-
|
|
15
|
-
|
|
13
|
+
var _utils = require("@atlaskit/editor-common/utils");
|
|
14
|
+
var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
|
|
15
|
+
var getExtensionHandlerNode = function getExtensionHandlerNode(extensionHandler) {
|
|
16
|
+
return function (_ref) {
|
|
17
|
+
var node = _ref.node,
|
|
18
|
+
doc = _ref.doc,
|
|
19
|
+
actions = _ref.actions;
|
|
20
|
+
return extensionHandler(node, doc, actions);
|
|
21
|
+
};
|
|
22
|
+
};
|
|
23
|
+
var useMultiBodiedExtensionContext = exports.useMultiBodiedExtensionContext = function useMultiBodiedExtensionContext(_ref2) {
|
|
24
|
+
var extensionHandlers = _ref2.extensionHandlers,
|
|
25
|
+
extensionType = _ref2.extensionType,
|
|
26
|
+
extensionKey = _ref2.extensionKey;
|
|
16
27
|
var isMounted = _react.default.useRef(true);
|
|
17
28
|
var localGetNodeRenderer = _react.default.useMemo(function () {
|
|
18
29
|
return (0, _memoizeOne.default)(_extensions.getNodeRenderer);
|
|
@@ -27,6 +38,13 @@ var useMultiBodiedExtensionContext = exports.useMultiBodiedExtensionContext = fu
|
|
|
27
38
|
privateProps = _React$useState4[0],
|
|
28
39
|
setPrivateProps = _React$useState4[1];
|
|
29
40
|
var providerPromise = (0, _providerFactory.useProvider)('extensionProvider');
|
|
41
|
+
var ExtensionHandlerNode = _react.default.useMemo(function () {
|
|
42
|
+
var extensionHandler = extensionHandlers && extensionHandlers[extensionType] && (0, _utils.getExtensionRenderer)(extensionHandlers[extensionType]);
|
|
43
|
+
if (extensionHandler) {
|
|
44
|
+
return getExtensionHandlerNode(extensionHandler);
|
|
45
|
+
}
|
|
46
|
+
return null;
|
|
47
|
+
}, [extensionHandlers, extensionType]);
|
|
30
48
|
_react.default.useEffect(function () {
|
|
31
49
|
if (providerPromise) {
|
|
32
50
|
providerPromise.then(function (p) {
|
|
@@ -41,7 +59,7 @@ var useMultiBodiedExtensionContext = exports.useMultiBodiedExtensionContext = fu
|
|
|
41
59
|
});
|
|
42
60
|
}
|
|
43
61
|
}, [providerPromise, extensionType, extensionKey]);
|
|
44
|
-
var
|
|
62
|
+
var ExtensionProviderNode = _react.default.useMemo(function () {
|
|
45
63
|
if (!provider) {
|
|
46
64
|
return null;
|
|
47
65
|
}
|
|
@@ -54,7 +72,18 @@ var useMultiBodiedExtensionContext = exports.useMultiBodiedExtensionContext = fu
|
|
|
54
72
|
};
|
|
55
73
|
}, []);
|
|
56
74
|
return _react.default.useMemo(function () {
|
|
57
|
-
if (
|
|
75
|
+
if (ExtensionHandlerNode && (0, _platformFeatureFlags.fg)('confluence_frontend_native_tabs_extension')) {
|
|
76
|
+
return {
|
|
77
|
+
extensionContext: {
|
|
78
|
+
NodeRenderer: ExtensionHandlerNode,
|
|
79
|
+
privateProps: {
|
|
80
|
+
__allowBodiedOverride: true
|
|
81
|
+
}
|
|
82
|
+
},
|
|
83
|
+
loading: false
|
|
84
|
+
};
|
|
85
|
+
}
|
|
86
|
+
if (!provider || !ExtensionProviderNode || !privateProps) {
|
|
58
87
|
return {
|
|
59
88
|
extensionContext: null,
|
|
60
89
|
loading: true
|
|
@@ -62,10 +91,10 @@ var useMultiBodiedExtensionContext = exports.useMultiBodiedExtensionContext = fu
|
|
|
62
91
|
}
|
|
63
92
|
return {
|
|
64
93
|
extensionContext: {
|
|
65
|
-
NodeRenderer:
|
|
94
|
+
NodeRenderer: ExtensionProviderNode,
|
|
66
95
|
privateProps: privateProps
|
|
67
96
|
},
|
|
68
97
|
loading: false
|
|
69
98
|
};
|
|
70
|
-
}, [provider,
|
|
99
|
+
}, [ExtensionHandlerNode, provider, ExtensionProviderNode, privateProps]);
|
|
71
100
|
};
|
|
@@ -115,6 +115,7 @@ var MultiBodiedExtension = function MultiBodiedExtension(props) {
|
|
|
115
115
|
parameters = props.parameters,
|
|
116
116
|
extensionType = props.extensionType,
|
|
117
117
|
extensionKey = props.extensionKey,
|
|
118
|
+
extensionHandlers = props.extensionHandlers,
|
|
118
119
|
content = props.content,
|
|
119
120
|
marks = props.marks,
|
|
120
121
|
localId = props.localId,
|
|
@@ -124,6 +125,7 @@ var MultiBodiedExtension = function MultiBodiedExtension(props) {
|
|
|
124
125
|
activeChildIndex = _useState2[0],
|
|
125
126
|
setActiveChildIndex = _useState2[1];
|
|
126
127
|
var _useMultiBodiedExtens = (0, _context.useMultiBodiedExtensionContext)({
|
|
128
|
+
extensionHandlers: extensionHandlers,
|
|
127
129
|
extensionType: extensionType,
|
|
128
130
|
extensionKey: extensionKey
|
|
129
131
|
}),
|
|
@@ -4,11 +4,16 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
4
4
|
value: true
|
|
5
5
|
});
|
|
6
6
|
exports.getCardClickHandler = void 0;
|
|
7
|
+
var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
|
|
7
8
|
var _utils = require("../../utils");
|
|
8
|
-
var getCardClickHandler = exports.getCardClickHandler = function getCardClickHandler(eventHandlers, url
|
|
9
|
-
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
10
|
-
) {
|
|
9
|
+
var getCardClickHandler = exports.getCardClickHandler = function getCardClickHandler(eventHandlers, url) {
|
|
11
10
|
var handler = (0, _utils.getEventHandler)(eventHandlers, 'smartCard');
|
|
11
|
+
if ((0, _platformFeatureFlags.fg)('platform_smartlink_xpc_url_wrapping')) {
|
|
12
|
+
return handler ? function (e, data) {
|
|
13
|
+
var _ref, _data$destinationUrl;
|
|
14
|
+
return handler(e, (_ref = (_data$destinationUrl = data === null || data === void 0 ? void 0 : data.destinationUrl) !== null && _data$destinationUrl !== void 0 ? _data$destinationUrl : data === null || data === void 0 ? void 0 : data.url) !== null && _ref !== void 0 ? _ref : url);
|
|
15
|
+
} : undefined;
|
|
16
|
+
}
|
|
12
17
|
return handler ? function (e) {
|
|
13
18
|
return handler(e, url);
|
|
14
19
|
} : undefined;
|
|
@@ -72,7 +72,7 @@ var DEGRADED_SEVERITY_THRESHOLD = exports.DEGRADED_SEVERITY_THRESHOLD = 3000;
|
|
|
72
72
|
var TABLE_INFO_TIMEOUT = 10000;
|
|
73
73
|
var RENDER_EVENT_SAMPLE_RATE = 0.2;
|
|
74
74
|
var packageName = "@atlaskit/renderer";
|
|
75
|
-
var packageVersion = "132.0
|
|
75
|
+
var packageVersion = "132.1.0";
|
|
76
76
|
var setAsQueryContainerStyles = (0, _react2.css)({
|
|
77
77
|
containerName: 'ak-renderer-wrapper',
|
|
78
78
|
containerType: 'inline-size'
|
|
@@ -10,6 +10,7 @@ import { UnsupportedBlock, UnsupportedInline, WidthConsumer } from '@atlaskit/ed
|
|
|
10
10
|
import { CardErrorBoundary } from './fallback';
|
|
11
11
|
import { SmartLinkDraggable, SMART_LINK_DRAG_TYPES, SMART_LINK_APPEARANCE } from '@atlaskit/editor-smart-link-draggable';
|
|
12
12
|
import { getCardClickHandler } from '../utils/getCardClickHandler';
|
|
13
|
+
import { getEventHandler } from '../../utils';
|
|
13
14
|
import InlineCard from './inlineCard';
|
|
14
15
|
import { AnalyticsContext } from '@atlaskit/analytics-next';
|
|
15
16
|
import { DatasourceTableView } from '@atlaskit/link-datasource';
|
|
@@ -61,7 +62,12 @@ export default function BlockCard(props) {
|
|
|
61
62
|
const {
|
|
62
63
|
actionOptions
|
|
63
64
|
} = smartLinks || {};
|
|
65
|
+
|
|
66
|
+
// Card/CardSSR's onClick — (e, { destinationUrl?, url? })
|
|
64
67
|
const onClick = getCardClickHandler(eventHandlers, url);
|
|
68
|
+
// SmartCardEventClickHandler — (e, url?) => void — for CardErrorBoundary.
|
|
69
|
+
// When the gate is off, fall back to the old behaviour (pass the same onClick as Card).
|
|
70
|
+
const onConsumerClick = fg('platform_smartlink_xpc_url_wrapping') ? getEventHandler(eventHandlers, 'smartCard') : onClick;
|
|
65
71
|
const platform = 'web';
|
|
66
72
|
const cardProps = {
|
|
67
73
|
url,
|
|
@@ -118,7 +124,9 @@ export default function BlockCard(props) {
|
|
|
118
124
|
onSetLinkTarget: onSetLinkTarget
|
|
119
125
|
// Ignored via go/ees005
|
|
120
126
|
// eslint-disable-next-line react/jsx-props-no-spreading
|
|
121
|
-
}, cardProps
|
|
127
|
+
}, cardProps, {
|
|
128
|
+
onClick: onConsumerClick
|
|
129
|
+
}), jsx(WidthConsumer, null, ({
|
|
122
130
|
width
|
|
123
131
|
}) => {
|
|
124
132
|
const useStickySafeCentering = expValEquals('platform_editor_flex_based_centering', 'isEnabled', true);
|
|
@@ -202,5 +210,7 @@ export default function BlockCard(props) {
|
|
|
202
210
|
onSetLinkTarget: onSetLinkTarget
|
|
203
211
|
// Ignored via go/ees005
|
|
204
212
|
// eslint-disable-next-line react/jsx-props-no-spreading
|
|
205
|
-
}, cardProps
|
|
213
|
+
}, cardProps, {
|
|
214
|
+
onClick: onConsumerClick
|
|
215
|
+
}), cardComponent))));
|
|
206
216
|
}
|
|
@@ -21,6 +21,7 @@ import { SmartLinkDraggable, SMART_LINK_DRAG_TYPES, SMART_LINK_APPEARANCE } from
|
|
|
21
21
|
import { RendererCssClassName } from '../../consts';
|
|
22
22
|
import { FullPagePadding } from '../../ui/Renderer/style';
|
|
23
23
|
import { getCardClickHandler } from '../utils/getCardClickHandler';
|
|
24
|
+
import { getEventHandler } from '../../utils';
|
|
24
25
|
import { AnalyticsContext } from '@atlaskit/analytics-next';
|
|
25
26
|
import { usePortal } from '../../ui/Renderer/PortalContext';
|
|
26
27
|
import BlockCard from './blockCard';
|
|
@@ -66,7 +67,11 @@ function EmbedCardInternal(props) {
|
|
|
66
67
|
} = props;
|
|
67
68
|
const portal = usePortal(props);
|
|
68
69
|
const embedIframeRef = useRef(null);
|
|
70
|
+
// Card/CardSSR's onClick — (e, { destinationUrl?, url? })
|
|
69
71
|
const onClick = getCardClickHandler(eventHandlers, url);
|
|
72
|
+
// SmartCardEventClickHandler — (e, url?) => void — for CardErrorBoundary.
|
|
73
|
+
// When the gate is off, fall back to the old behaviour (pass the same onClick as Card).
|
|
74
|
+
const onConsumerClick = fg('platform_smartlink_xpc_url_wrapping') ? getEventHandler(eventHandlers, 'smartCard') : onClick;
|
|
70
75
|
const {
|
|
71
76
|
actionOptions
|
|
72
77
|
} = smartLinks || {};
|
|
@@ -198,7 +203,9 @@ function EmbedCardInternal(props) {
|
|
|
198
203
|
unsupportedComponent: UnsupportedBlock,
|
|
199
204
|
onSetLinkTarget: onSetLinkTarget
|
|
200
205
|
// eslint-disable-next-line react/jsx-props-no-spreading
|
|
201
|
-
}, cardProps
|
|
206
|
+
}, cardProps, {
|
|
207
|
+
onClick: onConsumerClick
|
|
208
|
+
}), jsx(EmbedResizeMessageListener, {
|
|
202
209
|
embedIframeRef: embedIframeRef,
|
|
203
210
|
onHeightUpdate: setLiveHeight
|
|
204
211
|
}, (() => {
|
|
@@ -43,11 +43,24 @@ class HeadingAnchor extends React.PureComponent {
|
|
|
43
43
|
tooltipMessage: '',
|
|
44
44
|
isClicked: false
|
|
45
45
|
});
|
|
46
|
+
// Stable reference for Tooltip content prop to avoid recreating on each render
|
|
47
|
+
_defineProperty(this, "renderTooltipContent", ({
|
|
48
|
+
update
|
|
49
|
+
}) => {
|
|
50
|
+
this._tooltipUpdate = update;
|
|
51
|
+
return this.state.tooltipMessage;
|
|
52
|
+
});
|
|
46
53
|
_defineProperty(this, "setTooltipState", (message, isClicked = false) => {
|
|
47
54
|
this.setState({
|
|
48
55
|
// TODO: ED-14403 - investigate why this does not translate
|
|
49
56
|
tooltipMessage: this.props.intl.formatMessage(message),
|
|
50
57
|
isClicked
|
|
58
|
+
}, () => {
|
|
59
|
+
// Reposition tooltip after content change (replaces the key-based remount)
|
|
60
|
+
if (expValEquals('a11y-fixes-week4-may-2026', 'isEnabled', true)) {
|
|
61
|
+
var _this$_tooltipUpdate;
|
|
62
|
+
(_this$_tooltipUpdate = this._tooltipUpdate) === null || _this$_tooltipUpdate === void 0 ? void 0 : _this$_tooltipUpdate.call(this);
|
|
63
|
+
}
|
|
51
64
|
});
|
|
52
65
|
});
|
|
53
66
|
_defineProperty(this, "getCopyAriaLabel", () => {
|
|
@@ -110,6 +123,21 @@ class HeadingAnchor extends React.PureComponent {
|
|
|
110
123
|
tooltipMessage
|
|
111
124
|
} = this.state;
|
|
112
125
|
if (tooltipMessage) {
|
|
126
|
+
if (expValEquals('a11y-fixes-week4-may-2026', 'isEnabled', true)) {
|
|
127
|
+
// Fix for A11Y-30972: Use content as a function with update callback so
|
|
128
|
+
// the Tooltip repositions without unmounting (which caused focus loss).
|
|
129
|
+
// @see https://hello.jira.atlassian.cloud/browse/A11Y-30972
|
|
130
|
+
return jsx(Tooltip
|
|
131
|
+
// @ts-ignore: [PIT-1685] Fails in post-office due to backwards incompatibility issue with React 18
|
|
132
|
+
, {
|
|
133
|
+
tag: CopyAnchorWrapperWithRef,
|
|
134
|
+
content: this.renderTooltipContent,
|
|
135
|
+
position: "top",
|
|
136
|
+
delay: 0,
|
|
137
|
+
isScreenReaderAnnouncementDisabled: expValEquals('platform_editor_copy_link_a11y_inconsistency_fix', 'isEnabled', true) ? true : false
|
|
138
|
+
}, this.renderAnchorButton());
|
|
139
|
+
}
|
|
140
|
+
|
|
113
141
|
// We set the key to the message to ensure it remounts when the message
|
|
114
142
|
// changes, so that it correctly repositions.
|
|
115
143
|
// @see https://ecosystem.atlassian.net/projects/AK/queues/issue/AK-6548
|
|
@@ -24,6 +24,7 @@ import { useProvider } from '@atlaskit/editor-common/provider-factory';
|
|
|
24
24
|
import { CardErrorBoundary } from './fallback';
|
|
25
25
|
import { withSmartCardStorage } from '../../ui/SmartCardStorage';
|
|
26
26
|
import { getCardClickHandler } from '../utils/getCardClickHandler';
|
|
27
|
+
import { getEventHandler } from '../../utils';
|
|
27
28
|
import { useInlineAnnotationProps } from '../../ui/annotations/element/useInlineAnnotationProps';
|
|
28
29
|
import { usePortal } from '../../ui/Renderer/PortalContext';
|
|
29
30
|
import { extractSmartLinkEmbed } from '@atlaskit/link-extractors';
|
|
@@ -157,7 +158,12 @@ const InlineCard = props => {
|
|
|
157
158
|
} = (cardContext === null || cardContext === void 0 ? void 0 : (_cardContext$value5 = cardContext.value) === null || _cardContext$value5 === void 0 ? void 0 : _cardContext$value5.store) || {};
|
|
158
159
|
const [isResolvedViewRendered, setIsResolvedViewRendered] = useState(false);
|
|
159
160
|
const cardState = getSmartlinkState === null || getSmartlinkState === void 0 ? void 0 : getSmartlinkState()[url || ''];
|
|
161
|
+
|
|
162
|
+
// Card/CardSSR's onClick — (e, { destinationUrl?, url? })
|
|
160
163
|
const onClick = getCardClickHandler(eventHandlers, url);
|
|
164
|
+
// SmartCardEventClickHandler — (e, url?) => void — for CardErrorBoundary.
|
|
165
|
+
// When the gate is off, fall back to the old behaviour (pass the same onClick as Card).
|
|
166
|
+
const onConsumerClick = fg('platform_smartlink_xpc_url_wrapping') ? getEventHandler(eventHandlers, 'smartCard') : onClick;
|
|
161
167
|
const cardProps = {
|
|
162
168
|
url,
|
|
163
169
|
data,
|
|
@@ -352,6 +358,7 @@ const InlineCard = props => {
|
|
|
352
358
|
// Ignored via go/ees005
|
|
353
359
|
// eslint-disable-next-line react/jsx-props-no-spreading
|
|
354
360
|
}, cardProps, {
|
|
361
|
+
onClick: onConsumerClick,
|
|
355
362
|
onSetLinkTarget: onSetLinkTarget
|
|
356
363
|
}), jsx(MaybeOverlay, {
|
|
357
364
|
url: url || '',
|
|
@@ -2,7 +2,19 @@ import React from 'react';
|
|
|
2
2
|
import memoizeOne from 'memoize-one';
|
|
3
3
|
import { getExtensionModuleNodePrivateProps, getNodeRenderer } from '@atlaskit/editor-common/extensions';
|
|
4
4
|
import { useProvider } from '@atlaskit/editor-common/provider-factory';
|
|
5
|
+
import { getExtensionRenderer } from '@atlaskit/editor-common/utils';
|
|
6
|
+
import { fg } from '@atlaskit/platform-feature-flags';
|
|
7
|
+
const getExtensionHandlerNode = extensionHandler => {
|
|
8
|
+
return ({
|
|
9
|
+
node,
|
|
10
|
+
doc,
|
|
11
|
+
actions
|
|
12
|
+
}) => {
|
|
13
|
+
return extensionHandler(node, doc, actions);
|
|
14
|
+
};
|
|
15
|
+
};
|
|
5
16
|
export const useMultiBodiedExtensionContext = ({
|
|
17
|
+
extensionHandlers,
|
|
6
18
|
extensionType,
|
|
7
19
|
extensionKey
|
|
8
20
|
}) => {
|
|
@@ -12,6 +24,13 @@ export const useMultiBodiedExtensionContext = ({
|
|
|
12
24
|
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
13
25
|
const [privateProps, setPrivateProps] = React.useState();
|
|
14
26
|
const providerPromise = useProvider('extensionProvider');
|
|
27
|
+
const ExtensionHandlerNode = React.useMemo(() => {
|
|
28
|
+
const extensionHandler = extensionHandlers && extensionHandlers[extensionType] && getExtensionRenderer(extensionHandlers[extensionType]);
|
|
29
|
+
if (extensionHandler) {
|
|
30
|
+
return getExtensionHandlerNode(extensionHandler);
|
|
31
|
+
}
|
|
32
|
+
return null;
|
|
33
|
+
}, [extensionHandlers, extensionType]);
|
|
15
34
|
React.useEffect(() => {
|
|
16
35
|
if (providerPromise) {
|
|
17
36
|
providerPromise.then(p => {
|
|
@@ -26,7 +45,7 @@ export const useMultiBodiedExtensionContext = ({
|
|
|
26
45
|
});
|
|
27
46
|
}
|
|
28
47
|
}, [providerPromise, extensionType, extensionKey]);
|
|
29
|
-
const
|
|
48
|
+
const ExtensionProviderNode = React.useMemo(() => {
|
|
30
49
|
if (!provider) {
|
|
31
50
|
return null;
|
|
32
51
|
}
|
|
@@ -39,7 +58,18 @@ export const useMultiBodiedExtensionContext = ({
|
|
|
39
58
|
};
|
|
40
59
|
}, []);
|
|
41
60
|
return React.useMemo(() => {
|
|
42
|
-
if (
|
|
61
|
+
if (ExtensionHandlerNode && fg('confluence_frontend_native_tabs_extension')) {
|
|
62
|
+
return {
|
|
63
|
+
extensionContext: {
|
|
64
|
+
NodeRenderer: ExtensionHandlerNode,
|
|
65
|
+
privateProps: {
|
|
66
|
+
__allowBodiedOverride: true
|
|
67
|
+
}
|
|
68
|
+
},
|
|
69
|
+
loading: false
|
|
70
|
+
};
|
|
71
|
+
}
|
|
72
|
+
if (!provider || !ExtensionProviderNode || !privateProps) {
|
|
43
73
|
return {
|
|
44
74
|
extensionContext: null,
|
|
45
75
|
loading: true
|
|
@@ -47,10 +77,10 @@ export const useMultiBodiedExtensionContext = ({
|
|
|
47
77
|
}
|
|
48
78
|
return {
|
|
49
79
|
extensionContext: {
|
|
50
|
-
NodeRenderer,
|
|
80
|
+
NodeRenderer: ExtensionProviderNode,
|
|
51
81
|
privateProps
|
|
52
82
|
},
|
|
53
83
|
loading: false
|
|
54
84
|
};
|
|
55
|
-
}, [provider,
|
|
85
|
+
}, [ExtensionHandlerNode, provider, ExtensionProviderNode, privateProps]);
|
|
56
86
|
};
|
|
@@ -107,6 +107,7 @@ const MultiBodiedExtension = props => {
|
|
|
107
107
|
parameters,
|
|
108
108
|
extensionType,
|
|
109
109
|
extensionKey,
|
|
110
|
+
extensionHandlers,
|
|
110
111
|
content,
|
|
111
112
|
marks,
|
|
112
113
|
localId,
|
|
@@ -117,6 +118,7 @@ const MultiBodiedExtension = props => {
|
|
|
117
118
|
loading,
|
|
118
119
|
extensionContext
|
|
119
120
|
} = useMultiBodiedExtensionContext({
|
|
121
|
+
extensionHandlers,
|
|
120
122
|
extensionType,
|
|
121
123
|
extensionKey
|
|
122
124
|
});
|
|
@@ -1,7 +1,12 @@
|
|
|
1
|
+
import { fg } from '@atlaskit/platform-feature-flags';
|
|
1
2
|
import { getEventHandler } from '../../utils';
|
|
2
|
-
export const getCardClickHandler = (eventHandlers, url
|
|
3
|
-
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
4
|
-
) => {
|
|
3
|
+
export const getCardClickHandler = (eventHandlers, url) => {
|
|
5
4
|
const handler = getEventHandler(eventHandlers, 'smartCard');
|
|
5
|
+
if (fg('platform_smartlink_xpc_url_wrapping')) {
|
|
6
|
+
return handler ? (e, data) => {
|
|
7
|
+
var _ref, _data$destinationUrl;
|
|
8
|
+
return handler(e, (_ref = (_data$destinationUrl = data === null || data === void 0 ? void 0 : data.destinationUrl) !== null && _data$destinationUrl !== void 0 ? _data$destinationUrl : data === null || data === void 0 ? void 0 : data.url) !== null && _ref !== void 0 ? _ref : url);
|
|
9
|
+
} : undefined;
|
|
10
|
+
}
|
|
6
11
|
return handler ? e => handler(e, url) : undefined;
|
|
7
12
|
};
|
|
@@ -58,7 +58,7 @@ export const DEGRADED_SEVERITY_THRESHOLD = 3000;
|
|
|
58
58
|
const TABLE_INFO_TIMEOUT = 10000;
|
|
59
59
|
const RENDER_EVENT_SAMPLE_RATE = 0.2;
|
|
60
60
|
const packageName = "@atlaskit/renderer";
|
|
61
|
-
const packageVersion = "132.0
|
|
61
|
+
const packageVersion = "132.1.0";
|
|
62
62
|
const setAsQueryContainerStyles = css({
|
|
63
63
|
containerName: 'ak-renderer-wrapper',
|
|
64
64
|
containerType: 'inline-size'
|
|
@@ -10,6 +10,7 @@ import { UnsupportedBlock, UnsupportedInline, WidthConsumer } from '@atlaskit/ed
|
|
|
10
10
|
import { CardErrorBoundary } from './fallback';
|
|
11
11
|
import { SmartLinkDraggable, SMART_LINK_DRAG_TYPES, SMART_LINK_APPEARANCE } from '@atlaskit/editor-smart-link-draggable';
|
|
12
12
|
import { getCardClickHandler } from '../utils/getCardClickHandler';
|
|
13
|
+
import { getEventHandler } from '../../utils';
|
|
13
14
|
import InlineCard from './inlineCard';
|
|
14
15
|
import { AnalyticsContext } from '@atlaskit/analytics-next';
|
|
15
16
|
import { DatasourceTableView } from '@atlaskit/link-datasource';
|
|
@@ -58,7 +59,12 @@ export default function BlockCard(props) {
|
|
|
58
59
|
var portal = usePortal(props);
|
|
59
60
|
var _ref = smartLinks || {},
|
|
60
61
|
actionOptions = _ref.actionOptions;
|
|
62
|
+
|
|
63
|
+
// Card/CardSSR's onClick — (e, { destinationUrl?, url? })
|
|
61
64
|
var onClick = getCardClickHandler(eventHandlers, url);
|
|
65
|
+
// SmartCardEventClickHandler — (e, url?) => void — for CardErrorBoundary.
|
|
66
|
+
// When the gate is off, fall back to the old behaviour (pass the same onClick as Card).
|
|
67
|
+
var onConsumerClick = fg('platform_smartlink_xpc_url_wrapping') ? getEventHandler(eventHandlers, 'smartCard') : onClick;
|
|
62
68
|
var platform = 'web';
|
|
63
69
|
var cardProps = {
|
|
64
70
|
url: url,
|
|
@@ -122,7 +128,9 @@ export default function BlockCard(props) {
|
|
|
122
128
|
onSetLinkTarget: onSetLinkTarget
|
|
123
129
|
// Ignored via go/ees005
|
|
124
130
|
// eslint-disable-next-line react/jsx-props-no-spreading
|
|
125
|
-
}, cardProps
|
|
131
|
+
}, cardProps, {
|
|
132
|
+
onClick: onConsumerClick
|
|
133
|
+
}), jsx(WidthConsumer, null, function (_ref5) {
|
|
126
134
|
var width = _ref5.width;
|
|
127
135
|
var useStickySafeCentering = expValEquals('platform_editor_flex_based_centering', 'isEnabled', true);
|
|
128
136
|
var useCenterWrapper = !isNodeNested && useStickySafeCentering;
|
|
@@ -205,5 +213,7 @@ export default function BlockCard(props) {
|
|
|
205
213
|
onSetLinkTarget: onSetLinkTarget
|
|
206
214
|
// Ignored via go/ees005
|
|
207
215
|
// eslint-disable-next-line react/jsx-props-no-spreading
|
|
208
|
-
}, cardProps
|
|
216
|
+
}, cardProps, {
|
|
217
|
+
onClick: onConsumerClick
|
|
218
|
+
}), cardComponent))));
|
|
209
219
|
}
|
|
@@ -22,6 +22,7 @@ import { SmartLinkDraggable, SMART_LINK_DRAG_TYPES, SMART_LINK_APPEARANCE } from
|
|
|
22
22
|
import { RendererCssClassName } from '../../consts';
|
|
23
23
|
import { FullPagePadding } from '../../ui/Renderer/style';
|
|
24
24
|
import { getCardClickHandler } from '../utils/getCardClickHandler';
|
|
25
|
+
import { getEventHandler } from '../../utils';
|
|
25
26
|
import { AnalyticsContext } from '@atlaskit/analytics-next';
|
|
26
27
|
import { usePortal } from '../../ui/Renderer/PortalContext';
|
|
27
28
|
import BlockCard from './blockCard';
|
|
@@ -65,7 +66,11 @@ function EmbedCardInternal(props) {
|
|
|
65
66
|
onSetLinkTarget = props.onSetLinkTarget;
|
|
66
67
|
var portal = usePortal(props);
|
|
67
68
|
var embedIframeRef = useRef(null);
|
|
69
|
+
// Card/CardSSR's onClick — (e, { destinationUrl?, url? })
|
|
68
70
|
var onClick = getCardClickHandler(eventHandlers, url);
|
|
71
|
+
// SmartCardEventClickHandler — (e, url?) => void — for CardErrorBoundary.
|
|
72
|
+
// When the gate is off, fall back to the old behaviour (pass the same onClick as Card).
|
|
73
|
+
var onConsumerClick = fg('platform_smartlink_xpc_url_wrapping') ? getEventHandler(eventHandlers, 'smartCard') : onClick;
|
|
69
74
|
var _ref = smartLinks || {},
|
|
70
75
|
actionOptions = _ref.actionOptions;
|
|
71
76
|
var platform = 'web';
|
|
@@ -202,7 +207,9 @@ function EmbedCardInternal(props) {
|
|
|
202
207
|
unsupportedComponent: UnsupportedBlock,
|
|
203
208
|
onSetLinkTarget: onSetLinkTarget
|
|
204
209
|
// eslint-disable-next-line react/jsx-props-no-spreading
|
|
205
|
-
}, cardProps
|
|
210
|
+
}, cardProps, {
|
|
211
|
+
onClick: onConsumerClick
|
|
212
|
+
}), jsx(EmbedResizeMessageListener, {
|
|
206
213
|
embedIframeRef: embedIframeRef,
|
|
207
214
|
onHeightUpdate: setLiveHeight
|
|
208
215
|
}, function () {
|
|
@@ -54,12 +54,24 @@ var HeadingAnchor = /*#__PURE__*/function (_React$PureComponent) {
|
|
|
54
54
|
tooltipMessage: '',
|
|
55
55
|
isClicked: false
|
|
56
56
|
});
|
|
57
|
+
// Stable reference for Tooltip content prop to avoid recreating on each render
|
|
58
|
+
_defineProperty(_this, "renderTooltipContent", function (_ref) {
|
|
59
|
+
var update = _ref.update;
|
|
60
|
+
_this._tooltipUpdate = update;
|
|
61
|
+
return _this.state.tooltipMessage;
|
|
62
|
+
});
|
|
57
63
|
_defineProperty(_this, "setTooltipState", function (message) {
|
|
58
64
|
var isClicked = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false;
|
|
59
65
|
_this.setState({
|
|
60
66
|
// TODO: ED-14403 - investigate why this does not translate
|
|
61
67
|
tooltipMessage: _this.props.intl.formatMessage(message),
|
|
62
68
|
isClicked: isClicked
|
|
69
|
+
}, function () {
|
|
70
|
+
// Reposition tooltip after content change (replaces the key-based remount)
|
|
71
|
+
if (expValEquals('a11y-fixes-week4-may-2026', 'isEnabled', true)) {
|
|
72
|
+
var _this$_tooltipUpdate, _this2;
|
|
73
|
+
(_this$_tooltipUpdate = (_this2 = _this)._tooltipUpdate) === null || _this$_tooltipUpdate === void 0 || _this$_tooltipUpdate.call(_this2);
|
|
74
|
+
}
|
|
63
75
|
});
|
|
64
76
|
});
|
|
65
77
|
_defineProperty(_this, "getCopyAriaLabel", function () {
|
|
@@ -67,7 +79,7 @@ var HeadingAnchor = /*#__PURE__*/function (_React$PureComponent) {
|
|
|
67
79
|
return _this.props.intl.formatMessage(copyAriaLabel);
|
|
68
80
|
});
|
|
69
81
|
_defineProperty(_this, "copyToClipboard", /*#__PURE__*/function () {
|
|
70
|
-
var
|
|
82
|
+
var _ref2 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee(event) {
|
|
71
83
|
var copiedHeadingLinkToClipboard, failedToCopyHeadingLink, _t;
|
|
72
84
|
return _regeneratorRuntime.wrap(function (_context) {
|
|
73
85
|
while (1) switch (_context.prev = _context.next) {
|
|
@@ -92,7 +104,7 @@ var HeadingAnchor = /*#__PURE__*/function (_React$PureComponent) {
|
|
|
92
104
|
}, _callee, null, [[1, 3]]);
|
|
93
105
|
}));
|
|
94
106
|
return function (_x) {
|
|
95
|
-
return
|
|
107
|
+
return _ref2.apply(this, arguments);
|
|
96
108
|
};
|
|
97
109
|
}());
|
|
98
110
|
_defineProperty(_this, "resetMessage", function () {
|
|
@@ -140,6 +152,21 @@ var HeadingAnchor = /*#__PURE__*/function (_React$PureComponent) {
|
|
|
140
152
|
value: function render() {
|
|
141
153
|
var tooltipMessage = this.state.tooltipMessage;
|
|
142
154
|
if (tooltipMessage) {
|
|
155
|
+
if (expValEquals('a11y-fixes-week4-may-2026', 'isEnabled', true)) {
|
|
156
|
+
// Fix for A11Y-30972: Use content as a function with update callback so
|
|
157
|
+
// the Tooltip repositions without unmounting (which caused focus loss).
|
|
158
|
+
// @see https://hello.jira.atlassian.cloud/browse/A11Y-30972
|
|
159
|
+
return jsx(Tooltip
|
|
160
|
+
// @ts-ignore: [PIT-1685] Fails in post-office due to backwards incompatibility issue with React 18
|
|
161
|
+
, {
|
|
162
|
+
tag: CopyAnchorWrapperWithRef,
|
|
163
|
+
content: this.renderTooltipContent,
|
|
164
|
+
position: "top",
|
|
165
|
+
delay: 0,
|
|
166
|
+
isScreenReaderAnnouncementDisabled: expValEquals('platform_editor_copy_link_a11y_inconsistency_fix', 'isEnabled', true) ? true : false
|
|
167
|
+
}, this.renderAnchorButton());
|
|
168
|
+
}
|
|
169
|
+
|
|
143
170
|
// We set the key to the message to ensure it remounts when the message
|
|
144
171
|
// changes, so that it correctly repositions.
|
|
145
172
|
// @see https://ecosystem.atlassian.net/projects/AK/queues/issue/AK-6548
|
|
@@ -25,6 +25,7 @@ import { useProvider } from '@atlaskit/editor-common/provider-factory';
|
|
|
25
25
|
import { CardErrorBoundary } from './fallback';
|
|
26
26
|
import { withSmartCardStorage } from '../../ui/SmartCardStorage';
|
|
27
27
|
import { getCardClickHandler } from '../utils/getCardClickHandler';
|
|
28
|
+
import { getEventHandler } from '../../utils';
|
|
28
29
|
import { useInlineAnnotationProps } from '../../ui/annotations/element/useInlineAnnotationProps';
|
|
29
30
|
import { usePortal } from '../../ui/Renderer/PortalContext';
|
|
30
31
|
import { extractSmartLinkEmbed } from '@atlaskit/link-extractors';
|
|
@@ -165,7 +166,12 @@ var InlineCard = function InlineCard(props) {
|
|
|
165
166
|
isResolvedViewRendered = _useState2[0],
|
|
166
167
|
setIsResolvedViewRendered = _useState2[1];
|
|
167
168
|
var cardState = getSmartlinkState === null || getSmartlinkState === void 0 ? void 0 : getSmartlinkState()[url || ''];
|
|
169
|
+
|
|
170
|
+
// Card/CardSSR's onClick — (e, { destinationUrl?, url? })
|
|
168
171
|
var onClick = getCardClickHandler(eventHandlers, url);
|
|
172
|
+
// SmartCardEventClickHandler — (e, url?) => void — for CardErrorBoundary.
|
|
173
|
+
// When the gate is off, fall back to the old behaviour (pass the same onClick as Card).
|
|
174
|
+
var onConsumerClick = fg('platform_smartlink_xpc_url_wrapping') ? getEventHandler(eventHandlers, 'smartCard') : onClick;
|
|
169
175
|
var cardProps = {
|
|
170
176
|
url: url,
|
|
171
177
|
data: data,
|
|
@@ -358,6 +364,7 @@ var InlineCard = function InlineCard(props) {
|
|
|
358
364
|
// Ignored via go/ees005
|
|
359
365
|
// eslint-disable-next-line react/jsx-props-no-spreading
|
|
360
366
|
}, cardProps, {
|
|
367
|
+
onClick: onConsumerClick,
|
|
361
368
|
onSetLinkTarget: onSetLinkTarget
|
|
362
369
|
}), jsx(MaybeOverlay, {
|
|
363
370
|
url: url || '',
|
|
@@ -3,9 +3,20 @@ import React from 'react';
|
|
|
3
3
|
import memoizeOne from 'memoize-one';
|
|
4
4
|
import { getExtensionModuleNodePrivateProps, getNodeRenderer } from '@atlaskit/editor-common/extensions';
|
|
5
5
|
import { useProvider } from '@atlaskit/editor-common/provider-factory';
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
6
|
+
import { getExtensionRenderer } from '@atlaskit/editor-common/utils';
|
|
7
|
+
import { fg } from '@atlaskit/platform-feature-flags';
|
|
8
|
+
var getExtensionHandlerNode = function getExtensionHandlerNode(extensionHandler) {
|
|
9
|
+
return function (_ref) {
|
|
10
|
+
var node = _ref.node,
|
|
11
|
+
doc = _ref.doc,
|
|
12
|
+
actions = _ref.actions;
|
|
13
|
+
return extensionHandler(node, doc, actions);
|
|
14
|
+
};
|
|
15
|
+
};
|
|
16
|
+
export var useMultiBodiedExtensionContext = function useMultiBodiedExtensionContext(_ref2) {
|
|
17
|
+
var extensionHandlers = _ref2.extensionHandlers,
|
|
18
|
+
extensionType = _ref2.extensionType,
|
|
19
|
+
extensionKey = _ref2.extensionKey;
|
|
9
20
|
var isMounted = React.useRef(true);
|
|
10
21
|
var localGetNodeRenderer = React.useMemo(function () {
|
|
11
22
|
return memoizeOne(getNodeRenderer);
|
|
@@ -20,6 +31,13 @@ export var useMultiBodiedExtensionContext = function useMultiBodiedExtensionCont
|
|
|
20
31
|
privateProps = _React$useState4[0],
|
|
21
32
|
setPrivateProps = _React$useState4[1];
|
|
22
33
|
var providerPromise = useProvider('extensionProvider');
|
|
34
|
+
var ExtensionHandlerNode = React.useMemo(function () {
|
|
35
|
+
var extensionHandler = extensionHandlers && extensionHandlers[extensionType] && getExtensionRenderer(extensionHandlers[extensionType]);
|
|
36
|
+
if (extensionHandler) {
|
|
37
|
+
return getExtensionHandlerNode(extensionHandler);
|
|
38
|
+
}
|
|
39
|
+
return null;
|
|
40
|
+
}, [extensionHandlers, extensionType]);
|
|
23
41
|
React.useEffect(function () {
|
|
24
42
|
if (providerPromise) {
|
|
25
43
|
providerPromise.then(function (p) {
|
|
@@ -34,7 +52,7 @@ export var useMultiBodiedExtensionContext = function useMultiBodiedExtensionCont
|
|
|
34
52
|
});
|
|
35
53
|
}
|
|
36
54
|
}, [providerPromise, extensionType, extensionKey]);
|
|
37
|
-
var
|
|
55
|
+
var ExtensionProviderNode = React.useMemo(function () {
|
|
38
56
|
if (!provider) {
|
|
39
57
|
return null;
|
|
40
58
|
}
|
|
@@ -47,7 +65,18 @@ export var useMultiBodiedExtensionContext = function useMultiBodiedExtensionCont
|
|
|
47
65
|
};
|
|
48
66
|
}, []);
|
|
49
67
|
return React.useMemo(function () {
|
|
50
|
-
if (
|
|
68
|
+
if (ExtensionHandlerNode && fg('confluence_frontend_native_tabs_extension')) {
|
|
69
|
+
return {
|
|
70
|
+
extensionContext: {
|
|
71
|
+
NodeRenderer: ExtensionHandlerNode,
|
|
72
|
+
privateProps: {
|
|
73
|
+
__allowBodiedOverride: true
|
|
74
|
+
}
|
|
75
|
+
},
|
|
76
|
+
loading: false
|
|
77
|
+
};
|
|
78
|
+
}
|
|
79
|
+
if (!provider || !ExtensionProviderNode || !privateProps) {
|
|
51
80
|
return {
|
|
52
81
|
extensionContext: null,
|
|
53
82
|
loading: true
|
|
@@ -55,10 +84,10 @@ export var useMultiBodiedExtensionContext = function useMultiBodiedExtensionCont
|
|
|
55
84
|
}
|
|
56
85
|
return {
|
|
57
86
|
extensionContext: {
|
|
58
|
-
NodeRenderer:
|
|
87
|
+
NodeRenderer: ExtensionProviderNode,
|
|
59
88
|
privateProps: privateProps
|
|
60
89
|
},
|
|
61
90
|
loading: false
|
|
62
91
|
};
|
|
63
|
-
}, [provider,
|
|
92
|
+
}, [ExtensionHandlerNode, provider, ExtensionProviderNode, privateProps]);
|
|
64
93
|
};
|
|
@@ -107,6 +107,7 @@ var MultiBodiedExtension = function MultiBodiedExtension(props) {
|
|
|
107
107
|
parameters = props.parameters,
|
|
108
108
|
extensionType = props.extensionType,
|
|
109
109
|
extensionKey = props.extensionKey,
|
|
110
|
+
extensionHandlers = props.extensionHandlers,
|
|
110
111
|
content = props.content,
|
|
111
112
|
marks = props.marks,
|
|
112
113
|
localId = props.localId,
|
|
@@ -116,6 +117,7 @@ var MultiBodiedExtension = function MultiBodiedExtension(props) {
|
|
|
116
117
|
activeChildIndex = _useState2[0],
|
|
117
118
|
setActiveChildIndex = _useState2[1];
|
|
118
119
|
var _useMultiBodiedExtens = useMultiBodiedExtensionContext({
|
|
120
|
+
extensionHandlers: extensionHandlers,
|
|
119
121
|
extensionType: extensionType,
|
|
120
122
|
extensionKey: extensionKey
|
|
121
123
|
}),
|
|
@@ -1,8 +1,13 @@
|
|
|
1
|
+
import { fg } from '@atlaskit/platform-feature-flags';
|
|
1
2
|
import { getEventHandler } from '../../utils';
|
|
2
|
-
export var getCardClickHandler = function getCardClickHandler(eventHandlers, url
|
|
3
|
-
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
4
|
-
) {
|
|
3
|
+
export var getCardClickHandler = function getCardClickHandler(eventHandlers, url) {
|
|
5
4
|
var handler = getEventHandler(eventHandlers, 'smartCard');
|
|
5
|
+
if (fg('platform_smartlink_xpc_url_wrapping')) {
|
|
6
|
+
return handler ? function (e, data) {
|
|
7
|
+
var _ref, _data$destinationUrl;
|
|
8
|
+
return handler(e, (_ref = (_data$destinationUrl = data === null || data === void 0 ? void 0 : data.destinationUrl) !== null && _data$destinationUrl !== void 0 ? _data$destinationUrl : data === null || data === void 0 ? void 0 : data.url) !== null && _ref !== void 0 ? _ref : url);
|
|
9
|
+
} : undefined;
|
|
10
|
+
}
|
|
6
11
|
return handler ? function (e) {
|
|
7
12
|
return handler(e, url);
|
|
8
13
|
} : undefined;
|
|
@@ -63,7 +63,7 @@ export var DEGRADED_SEVERITY_THRESHOLD = 3000;
|
|
|
63
63
|
var TABLE_INFO_TIMEOUT = 10000;
|
|
64
64
|
var RENDER_EVENT_SAMPLE_RATE = 0.2;
|
|
65
65
|
var packageName = "@atlaskit/renderer";
|
|
66
|
-
var packageVersion = "132.0
|
|
66
|
+
var packageVersion = "132.1.0";
|
|
67
67
|
var setAsQueryContainerStyles = css({
|
|
68
68
|
containerName: 'ak-renderer-wrapper',
|
|
69
69
|
containerType: 'inline-size'
|
|
@@ -1,5 +1,7 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
|
+
import type { ExtensionHandlers } from '@atlaskit/editor-common/extensions';
|
|
2
3
|
type useMultiBodiedExtensionContextProps = {
|
|
4
|
+
extensionHandlers?: ExtensionHandlers;
|
|
3
5
|
extensionKey: string;
|
|
4
6
|
extensionType: string;
|
|
5
7
|
};
|
|
@@ -13,5 +15,5 @@ export type MultiBodiedExtensionContext = {
|
|
|
13
15
|
[prop: string]: any;
|
|
14
16
|
};
|
|
15
17
|
};
|
|
16
|
-
export declare const useMultiBodiedExtensionContext: ({ extensionType, extensionKey, }: useMultiBodiedExtensionContextProps) => MultiBodiedExtensionLoadingContext;
|
|
18
|
+
export declare const useMultiBodiedExtensionContext: ({ extensionHandlers, extensionType, extensionKey, }: useMultiBodiedExtensionContextProps) => MultiBodiedExtensionLoadingContext;
|
|
17
19
|
export {};
|
|
@@ -1,2 +1,3 @@
|
|
|
1
1
|
import type { EventHandlers } from '@atlaskit/editor-common/ui';
|
|
2
|
-
|
|
2
|
+
import type { CardProps } from '@atlaskit/smart-card';
|
|
3
|
+
export declare const getCardClickHandler: (eventHandlers?: EventHandlers, url?: string) => CardProps["onClick"] | undefined;
|
|
@@ -1,5 +1,7 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
|
+
import type { ExtensionHandlers } from '@atlaskit/editor-common/extensions';
|
|
2
3
|
type useMultiBodiedExtensionContextProps = {
|
|
4
|
+
extensionHandlers?: ExtensionHandlers;
|
|
3
5
|
extensionKey: string;
|
|
4
6
|
extensionType: string;
|
|
5
7
|
};
|
|
@@ -13,5 +15,5 @@ export type MultiBodiedExtensionContext = {
|
|
|
13
15
|
[prop: string]: any;
|
|
14
16
|
};
|
|
15
17
|
};
|
|
16
|
-
export declare const useMultiBodiedExtensionContext: ({ extensionType, extensionKey, }: useMultiBodiedExtensionContextProps) => MultiBodiedExtensionLoadingContext;
|
|
18
|
+
export declare const useMultiBodiedExtensionContext: ({ extensionHandlers, extensionType, extensionKey, }: useMultiBodiedExtensionContextProps) => MultiBodiedExtensionLoadingContext;
|
|
17
19
|
export {};
|
|
@@ -1,2 +1,3 @@
|
|
|
1
1
|
import type { EventHandlers } from '@atlaskit/editor-common/ui';
|
|
2
|
-
|
|
2
|
+
import type { CardProps } from '@atlaskit/smart-card';
|
|
3
|
+
export declare const getCardClickHandler: (eventHandlers?: EventHandlers, url?: string) => CardProps["onClick"] | undefined;
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@atlaskit/renderer",
|
|
3
|
-
"version": "132.
|
|
3
|
+
"version": "132.1.1",
|
|
4
4
|
"description": "Renderer component",
|
|
5
5
|
"publishConfig": {
|
|
6
6
|
"registry": "https://registry.npmjs.org/"
|
|
@@ -62,11 +62,11 @@
|
|
|
62
62
|
"@atlaskit/platform-feature-flags-react": "^0.5.0",
|
|
63
63
|
"@atlaskit/pragmatic-drag-and-drop": "^1.8.0",
|
|
64
64
|
"@atlaskit/react-ufo": "^6.7.0",
|
|
65
|
-
"@atlaskit/smart-card": "^44.
|
|
65
|
+
"@atlaskit/smart-card": "^44.24.0",
|
|
66
66
|
"@atlaskit/status": "^4.1.0",
|
|
67
67
|
"@atlaskit/task-decision": "^20.1.0",
|
|
68
68
|
"@atlaskit/theme": "^25.0.0",
|
|
69
|
-
"@atlaskit/tmp-editor-statsig": "^
|
|
69
|
+
"@atlaskit/tmp-editor-statsig": "^92.0.0",
|
|
70
70
|
"@atlaskit/tokens": "^13.3.0",
|
|
71
71
|
"@atlaskit/tooltip": "^22.6.0",
|
|
72
72
|
"@atlaskit/visually-hidden": "^3.1.0",
|
|
@@ -152,6 +152,9 @@
|
|
|
152
152
|
"confluence_frontend_table_scrollbar_ttvc_fix": {
|
|
153
153
|
"type": "boolean"
|
|
154
154
|
},
|
|
155
|
+
"confluence_frontend_native_tabs_extension": {
|
|
156
|
+
"type": "boolean"
|
|
157
|
+
},
|
|
155
158
|
"cc_comments_log_draft_annotation_ancestor_nodes": {
|
|
156
159
|
"type": "boolean"
|
|
157
160
|
},
|
|
@@ -254,6 +257,10 @@
|
|
|
254
257
|
"platform-dst-lozenge-tag-badge-visual-uplifts": {
|
|
255
258
|
"type": "boolean"
|
|
256
259
|
},
|
|
260
|
+
"platform_smartlink_xpc_url_wrapping": {
|
|
261
|
+
"type": "boolean",
|
|
262
|
+
"referenceOnly": true
|
|
263
|
+
},
|
|
257
264
|
"platform_nested_table_style_override": {
|
|
258
265
|
"type": "boolean"
|
|
259
266
|
}
|