@atlaskit/renderer 114.6.1 → 114.6.3
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 +18 -0
- package/dist/cjs/messages.js +8 -1
- package/dist/cjs/react/nodes/heading-anchor.js +6 -2
- package/dist/cjs/react/nodes/heading.js +2 -1
- package/dist/cjs/react/nodes/status.js +17 -3
- package/dist/cjs/ui/Renderer/index.js +1 -1
- package/dist/es2019/messages.js +7 -0
- package/dist/es2019/react/nodes/heading-anchor.js +4 -1
- package/dist/es2019/react/nodes/heading.js +2 -1
- package/dist/es2019/react/nodes/status.js +16 -3
- package/dist/es2019/ui/Renderer/index.js +1 -1
- package/dist/esm/messages.js +7 -0
- package/dist/esm/react/nodes/heading-anchor.js +6 -2
- package/dist/esm/react/nodes/heading.js +2 -1
- package/dist/esm/react/nodes/status.js +16 -3
- package/dist/esm/ui/Renderer/index.js +1 -1
- package/dist/types/messages.d.ts +7 -0
- package/dist/types/react/nodes/heading-anchor.d.ts +1 -0
- package/dist/types-ts4.5/messages.d.ts +7 -0
- package/dist/types-ts4.5/react/nodes/heading-anchor.d.ts +1 -0
- package/package.json +7 -4
package/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,23 @@
|
|
|
1
1
|
# @atlaskit/renderer
|
|
2
2
|
|
|
3
|
+
## 114.6.3
|
|
4
|
+
|
|
5
|
+
### Patch Changes
|
|
6
|
+
|
|
7
|
+
- [#129599](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/pull-requests/129599)
|
|
8
|
+
[`4498c19bca034`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/4498c19bca034) -
|
|
9
|
+
[ux] [A11Y-20936] Announce status elements in the renderer to screen readers
|
|
10
|
+
- Updated dependencies
|
|
11
|
+
|
|
12
|
+
## 114.6.2
|
|
13
|
+
|
|
14
|
+
### Patch Changes
|
|
15
|
+
|
|
16
|
+
- [#132126](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/pull-requests/132126)
|
|
17
|
+
[`5d45dce9796da`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/5d45dce9796da) -
|
|
18
|
+
Updated dependency json-ld-types to @atlaskit/json-ld-types
|
|
19
|
+
- Updated dependencies
|
|
20
|
+
|
|
3
21
|
## 114.6.1
|
|
4
22
|
|
|
5
23
|
### Patch Changes
|
package/dist/cjs/messages.js
CHANGED
|
@@ -3,7 +3,7 @@
|
|
|
3
3
|
Object.defineProperty(exports, "__esModule", {
|
|
4
4
|
value: true
|
|
5
5
|
});
|
|
6
|
-
exports.tableCellMessages = exports.inlineCommentMessages = exports.headingAnchorLinkMessages = void 0;
|
|
6
|
+
exports.tableCellMessages = exports.statusMessages = exports.inlineCommentMessages = exports.headingAnchorLinkMessages = void 0;
|
|
7
7
|
var _reactIntlNext = require("react-intl-next");
|
|
8
8
|
/* eslint-disable @atlaskit/editor/no-re-export */
|
|
9
9
|
// Entry file in package.json
|
|
@@ -58,4 +58,11 @@ var inlineCommentMessages = exports.inlineCommentMessages = (0, _reactIntlNext.d
|
|
|
58
58
|
defaultMessage: 'inline comment end',
|
|
59
59
|
description: 'Ending marker to indicate that text was highlighted with an inline comment by a screen reader.'
|
|
60
60
|
}
|
|
61
|
+
});
|
|
62
|
+
var statusMessages = exports.statusMessages = (0, _reactIntlNext.defineMessages)({
|
|
63
|
+
accessibilityLabelForStatus: {
|
|
64
|
+
id: 'fabric.editor.status.accessibilityLabel',
|
|
65
|
+
defaultMessage: 'status: ',
|
|
66
|
+
description: 'Accessibility label for status'
|
|
67
|
+
}
|
|
61
68
|
});
|
|
@@ -18,6 +18,7 @@ var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/h
|
|
|
18
18
|
var _react = _interopRequireDefault(require("react"));
|
|
19
19
|
var _react2 = require("@emotion/react");
|
|
20
20
|
var _colors = require("@atlaskit/theme/colors");
|
|
21
|
+
var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
|
|
21
22
|
var _link = _interopRequireDefault(require("@atlaskit/icon/core/migration/link"));
|
|
22
23
|
var _tooltip = _interopRequireDefault(require("@atlaskit/tooltip"));
|
|
23
24
|
var _reactIntlNext = require("react-intl-next");
|
|
@@ -108,8 +109,10 @@ var HeadingAnchor = /*#__PURE__*/function (_React$PureComponent) {
|
|
|
108
109
|
_this.setTooltipState(_messages.headingAnchorLinkMessages.copyHeadingLinkToClipboard);
|
|
109
110
|
});
|
|
110
111
|
(0, _defineProperty2.default)(_this, "renderAnchorButton", function () {
|
|
111
|
-
var _this$props
|
|
112
|
-
|
|
112
|
+
var _this$props = _this.props,
|
|
113
|
+
_this$props$hideFromS = _this$props.hideFromScreenReader,
|
|
114
|
+
hideFromScreenReader = _this$props$hideFromS === void 0 ? false : _this$props$hideFromS,
|
|
115
|
+
headingId = _this$props.headingId;
|
|
113
116
|
return (0, _react2.jsx)("button", {
|
|
114
117
|
"data-testid": "anchor-button",
|
|
115
118
|
css: copyAnchorButtonStyles,
|
|
@@ -118,6 +121,7 @@ var HeadingAnchor = /*#__PURE__*/function (_React$PureComponent) {
|
|
|
118
121
|
"aria-hidden": hideFromScreenReader,
|
|
119
122
|
tabIndex: hideFromScreenReader ? undefined : -1,
|
|
120
123
|
"aria-label": hideFromScreenReader ? undefined : _this.state.tooltipMessage,
|
|
124
|
+
"aria-labelledby": (0, _platformFeatureFlags.fg)('platform_editor_accessible_heading_copy_link') ? hideFromScreenReader ? undefined : headingId : undefined,
|
|
121
125
|
type: "button"
|
|
122
126
|
}, (0, _react2.jsx)(_link.default, {
|
|
123
127
|
label: _this.getCopyAriaLabel(),
|
|
@@ -47,7 +47,8 @@ function WrappedHeadingAnchor(_ref) {
|
|
|
47
47
|
});
|
|
48
48
|
return (0, _clipboard.copyTextToClipboard)(getCurrentUrlWithHash(headingId));
|
|
49
49
|
},
|
|
50
|
-
hideFromScreenReader: hideFromScreenReader
|
|
50
|
+
hideFromScreenReader: hideFromScreenReader,
|
|
51
|
+
headingId: headingId
|
|
51
52
|
});
|
|
52
53
|
});
|
|
53
54
|
}
|
|
@@ -1,5 +1,6 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
|
+
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
3
4
|
var _typeof = require("@babel/runtime/helpers/typeof");
|
|
4
5
|
Object.defineProperty(exports, "__esModule", {
|
|
5
6
|
value: true
|
|
@@ -8,8 +9,11 @@ exports.default = void 0;
|
|
|
8
9
|
var _react = _interopRequireWildcard(require("react"));
|
|
9
10
|
var _element = require("@atlaskit/status/element");
|
|
10
11
|
var _analyticsNamespacedContext = require("@atlaskit/analytics-namespaced-context");
|
|
12
|
+
var _visuallyHidden = _interopRequireDefault(require("@atlaskit/visually-hidden"));
|
|
11
13
|
var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
|
|
14
|
+
var _reactIntlNext = require("react-intl-next");
|
|
12
15
|
var _useInlineAnnotationProps = require("../../ui/annotations/element/useInlineAnnotationProps");
|
|
16
|
+
var _messages = require("../../messages");
|
|
13
17
|
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); }
|
|
14
18
|
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; }
|
|
15
19
|
var _default = exports.default = /*#__PURE__*/(0, _react.memo)(function Status(props) {
|
|
@@ -17,12 +21,15 @@ var _default = exports.default = /*#__PURE__*/(0, _react.memo)(function Status(p
|
|
|
17
21
|
color = props.color,
|
|
18
22
|
localId = props.localId;
|
|
19
23
|
var inlineAnnotationProps = (0, _useInlineAnnotationProps.useInlineAnnotationProps)(props);
|
|
24
|
+
var intl = (0, _reactIntlNext.useIntl)();
|
|
20
25
|
if ((0, _platformFeatureFlags.fg)('editor_inline_comments_on_inline_nodes')) {
|
|
21
26
|
return (
|
|
22
27
|
/*#__PURE__*/
|
|
23
28
|
// Ignored via go/ees005
|
|
24
29
|
// eslint-disable-next-line react/jsx-props-no-spreading
|
|
25
|
-
_react.default.createElement("span", inlineAnnotationProps, /*#__PURE__*/_react.default.createElement(
|
|
30
|
+
_react.default.createElement("span", inlineAnnotationProps, (0, _platformFeatureFlags.fg)('editor_a11y_status_renderer_description') && /*#__PURE__*/_react.default.createElement(_visuallyHidden.default, {
|
|
31
|
+
role: "generic"
|
|
32
|
+
}, intl.formatMessage(_messages.statusMessages.accessibilityLabelForStatus)), /*#__PURE__*/_react.default.createElement(_analyticsNamespacedContext.FabricElementsAnalyticsContext, {
|
|
26
33
|
data: {
|
|
27
34
|
userContext: 'document'
|
|
28
35
|
}
|
|
@@ -30,7 +37,7 @@ var _default = exports.default = /*#__PURE__*/(0, _react.memo)(function Status(p
|
|
|
30
37
|
text: text,
|
|
31
38
|
color: color,
|
|
32
39
|
localId: localId,
|
|
33
|
-
role:
|
|
40
|
+
role: (0, _platformFeatureFlags.fg)('editor_a11y_status_renderer_description') ? undefined : 'presentation',
|
|
34
41
|
isBold: (0, _platformFeatureFlags.fg)('platform-component-visual-refresh')
|
|
35
42
|
})))
|
|
36
43
|
);
|
|
@@ -39,7 +46,14 @@ var _default = exports.default = /*#__PURE__*/(0, _react.memo)(function Status(p
|
|
|
39
46
|
data: {
|
|
40
47
|
userContext: 'document'
|
|
41
48
|
}
|
|
42
|
-
}, /*#__PURE__*/_react.default.createElement(
|
|
49
|
+
}, (0, _platformFeatureFlags.fg)('editor_a11y_status_renderer_description') ? /*#__PURE__*/_react.default.createElement("span", null, /*#__PURE__*/_react.default.createElement("span", null, /*#__PURE__*/_react.default.createElement(_visuallyHidden.default, {
|
|
50
|
+
role: "generic"
|
|
51
|
+
}, intl.formatMessage(_messages.statusMessages.accessibilityLabelForStatus)), /*#__PURE__*/_react.default.createElement(_element.Status, {
|
|
52
|
+
text: text,
|
|
53
|
+
color: color,
|
|
54
|
+
localId: localId,
|
|
55
|
+
isBold: (0, _platformFeatureFlags.fg)('platform-component-visual-refresh')
|
|
56
|
+
}))) : /*#__PURE__*/_react.default.createElement(_element.Status, {
|
|
43
57
|
text: text,
|
|
44
58
|
color: color,
|
|
45
59
|
localId: localId,
|
|
@@ -67,7 +67,7 @@ function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.
|
|
|
67
67
|
var NORMAL_SEVERITY_THRESHOLD = exports.NORMAL_SEVERITY_THRESHOLD = 2000;
|
|
68
68
|
var DEGRADED_SEVERITY_THRESHOLD = exports.DEGRADED_SEVERITY_THRESHOLD = 3000;
|
|
69
69
|
var packageName = "@atlaskit/renderer";
|
|
70
|
-
var packageVersion = "114.6.
|
|
70
|
+
var packageVersion = "114.6.3";
|
|
71
71
|
var setAsQueryContainerStyles = (0, _react2.css)({
|
|
72
72
|
containerName: 'ak-renderer-wrapper',
|
|
73
73
|
containerType: 'inline-size',
|
package/dist/es2019/messages.js
CHANGED
|
@@ -52,4 +52,11 @@ export const inlineCommentMessages = defineMessages({
|
|
|
52
52
|
defaultMessage: 'inline comment end',
|
|
53
53
|
description: 'Ending marker to indicate that text was highlighted with an inline comment by a screen reader.'
|
|
54
54
|
}
|
|
55
|
+
});
|
|
56
|
+
export const statusMessages = defineMessages({
|
|
57
|
+
accessibilityLabelForStatus: {
|
|
58
|
+
id: 'fabric.editor.status.accessibilityLabel',
|
|
59
|
+
defaultMessage: 'status: ',
|
|
60
|
+
description: 'Accessibility label for status'
|
|
61
|
+
}
|
|
55
62
|
});
|
|
@@ -9,6 +9,7 @@ import React from 'react';
|
|
|
9
9
|
// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
|
|
10
10
|
import { css, jsx } from '@emotion/react';
|
|
11
11
|
import { N200, N500, B400 } from '@atlaskit/theme/colors';
|
|
12
|
+
import { fg } from '@atlaskit/platform-feature-flags';
|
|
12
13
|
import LinkIcon from '@atlaskit/icon/core/migration/link';
|
|
13
14
|
import Tooltip from '@atlaskit/tooltip';
|
|
14
15
|
import { injectIntl } from 'react-intl-next';
|
|
@@ -74,7 +75,8 @@ class HeadingAnchor extends React.PureComponent {
|
|
|
74
75
|
});
|
|
75
76
|
_defineProperty(this, "renderAnchorButton", () => {
|
|
76
77
|
const {
|
|
77
|
-
hideFromScreenReader = false
|
|
78
|
+
hideFromScreenReader = false,
|
|
79
|
+
headingId
|
|
78
80
|
} = this.props;
|
|
79
81
|
return jsx("button", {
|
|
80
82
|
"data-testid": "anchor-button",
|
|
@@ -84,6 +86,7 @@ class HeadingAnchor extends React.PureComponent {
|
|
|
84
86
|
"aria-hidden": hideFromScreenReader,
|
|
85
87
|
tabIndex: hideFromScreenReader ? undefined : -1,
|
|
86
88
|
"aria-label": hideFromScreenReader ? undefined : this.state.tooltipMessage,
|
|
89
|
+
"aria-labelledby": fg('platform_editor_accessible_heading_copy_link') ? hideFromScreenReader ? undefined : headingId : undefined,
|
|
87
90
|
type: "button"
|
|
88
91
|
}, jsx(LinkIcon, {
|
|
89
92
|
label: this.getCopyAriaLabel(),
|
|
@@ -38,7 +38,8 @@ function WrappedHeadingAnchor({
|
|
|
38
38
|
});
|
|
39
39
|
return copyTextToClipboard(getCurrentUrlWithHash(headingId));
|
|
40
40
|
},
|
|
41
|
-
hideFromScreenReader: hideFromScreenReader
|
|
41
|
+
hideFromScreenReader: hideFromScreenReader,
|
|
42
|
+
headingId: headingId
|
|
42
43
|
}));
|
|
43
44
|
}
|
|
44
45
|
function Heading(props) {
|
|
@@ -1,8 +1,11 @@
|
|
|
1
1
|
import React, { memo } from 'react';
|
|
2
2
|
import { Status as AkStatus } from '@atlaskit/status/element';
|
|
3
3
|
import { FabricElementsAnalyticsContext } from '@atlaskit/analytics-namespaced-context';
|
|
4
|
+
import VisuallyHidden from '@atlaskit/visually-hidden';
|
|
4
5
|
import { fg } from '@atlaskit/platform-feature-flags';
|
|
6
|
+
import { useIntl } from 'react-intl-next';
|
|
5
7
|
import { useInlineAnnotationProps } from '../../ui/annotations/element/useInlineAnnotationProps';
|
|
8
|
+
import { statusMessages } from '../../messages';
|
|
6
9
|
export default /*#__PURE__*/memo(function Status(props) {
|
|
7
10
|
const {
|
|
8
11
|
text,
|
|
@@ -10,12 +13,15 @@ export default /*#__PURE__*/memo(function Status(props) {
|
|
|
10
13
|
localId
|
|
11
14
|
} = props;
|
|
12
15
|
const inlineAnnotationProps = useInlineAnnotationProps(props);
|
|
16
|
+
const intl = useIntl();
|
|
13
17
|
if (fg('editor_inline_comments_on_inline_nodes')) {
|
|
14
18
|
return (
|
|
15
19
|
/*#__PURE__*/
|
|
16
20
|
// Ignored via go/ees005
|
|
17
21
|
// eslint-disable-next-line react/jsx-props-no-spreading
|
|
18
|
-
React.createElement("span", inlineAnnotationProps, /*#__PURE__*/React.createElement(
|
|
22
|
+
React.createElement("span", inlineAnnotationProps, fg('editor_a11y_status_renderer_description') && /*#__PURE__*/React.createElement(VisuallyHidden, {
|
|
23
|
+
role: "generic"
|
|
24
|
+
}, intl.formatMessage(statusMessages.accessibilityLabelForStatus)), /*#__PURE__*/React.createElement(FabricElementsAnalyticsContext, {
|
|
19
25
|
data: {
|
|
20
26
|
userContext: 'document'
|
|
21
27
|
}
|
|
@@ -23,7 +29,7 @@ export default /*#__PURE__*/memo(function Status(props) {
|
|
|
23
29
|
text: text,
|
|
24
30
|
color: color,
|
|
25
31
|
localId: localId,
|
|
26
|
-
role:
|
|
32
|
+
role: fg('editor_a11y_status_renderer_description') ? undefined : 'presentation',
|
|
27
33
|
isBold: fg('platform-component-visual-refresh')
|
|
28
34
|
})))
|
|
29
35
|
);
|
|
@@ -32,7 +38,14 @@ export default /*#__PURE__*/memo(function Status(props) {
|
|
|
32
38
|
data: {
|
|
33
39
|
userContext: 'document'
|
|
34
40
|
}
|
|
35
|
-
}, /*#__PURE__*/React.createElement(
|
|
41
|
+
}, fg('editor_a11y_status_renderer_description') ? /*#__PURE__*/React.createElement("span", null, /*#__PURE__*/React.createElement("span", null, /*#__PURE__*/React.createElement(VisuallyHidden, {
|
|
42
|
+
role: "generic"
|
|
43
|
+
}, intl.formatMessage(statusMessages.accessibilityLabelForStatus)), /*#__PURE__*/React.createElement(AkStatus, {
|
|
44
|
+
text: text,
|
|
45
|
+
color: color,
|
|
46
|
+
localId: localId,
|
|
47
|
+
isBold: fg('platform-component-visual-refresh')
|
|
48
|
+
}))) : /*#__PURE__*/React.createElement(AkStatus, {
|
|
36
49
|
text: text,
|
|
37
50
|
color: color,
|
|
38
51
|
localId: localId,
|
|
@@ -48,7 +48,7 @@ import { removeEmptySpaceAroundContent } from './rendererHelper';
|
|
|
48
48
|
export const NORMAL_SEVERITY_THRESHOLD = 2000;
|
|
49
49
|
export const DEGRADED_SEVERITY_THRESHOLD = 3000;
|
|
50
50
|
const packageName = "@atlaskit/renderer";
|
|
51
|
-
const packageVersion = "114.6.
|
|
51
|
+
const packageVersion = "114.6.3";
|
|
52
52
|
const setAsQueryContainerStyles = css({
|
|
53
53
|
containerName: 'ak-renderer-wrapper',
|
|
54
54
|
containerType: 'inline-size',
|
package/dist/esm/messages.js
CHANGED
|
@@ -52,4 +52,11 @@ export var inlineCommentMessages = defineMessages({
|
|
|
52
52
|
defaultMessage: 'inline comment end',
|
|
53
53
|
description: 'Ending marker to indicate that text was highlighted with an inline comment by a screen reader.'
|
|
54
54
|
}
|
|
55
|
+
});
|
|
56
|
+
export var statusMessages = defineMessages({
|
|
57
|
+
accessibilityLabelForStatus: {
|
|
58
|
+
id: 'fabric.editor.status.accessibilityLabel',
|
|
59
|
+
defaultMessage: 'status: ',
|
|
60
|
+
description: 'Accessibility label for status'
|
|
61
|
+
}
|
|
55
62
|
});
|
|
@@ -20,6 +20,7 @@ import React from 'react';
|
|
|
20
20
|
// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
|
|
21
21
|
import { css, jsx } from '@emotion/react';
|
|
22
22
|
import { N200, N500, B400 } from '@atlaskit/theme/colors';
|
|
23
|
+
import { fg } from '@atlaskit/platform-feature-flags';
|
|
23
24
|
import LinkIcon from '@atlaskit/icon/core/migration/link';
|
|
24
25
|
import Tooltip from '@atlaskit/tooltip';
|
|
25
26
|
import { injectIntl } from 'react-intl-next';
|
|
@@ -102,8 +103,10 @@ var HeadingAnchor = /*#__PURE__*/function (_React$PureComponent) {
|
|
|
102
103
|
_this.setTooltipState(headingAnchorLinkMessages.copyHeadingLinkToClipboard);
|
|
103
104
|
});
|
|
104
105
|
_defineProperty(_this, "renderAnchorButton", function () {
|
|
105
|
-
var _this$props
|
|
106
|
-
|
|
106
|
+
var _this$props = _this.props,
|
|
107
|
+
_this$props$hideFromS = _this$props.hideFromScreenReader,
|
|
108
|
+
hideFromScreenReader = _this$props$hideFromS === void 0 ? false : _this$props$hideFromS,
|
|
109
|
+
headingId = _this$props.headingId;
|
|
107
110
|
return jsx("button", {
|
|
108
111
|
"data-testid": "anchor-button",
|
|
109
112
|
css: copyAnchorButtonStyles,
|
|
@@ -112,6 +115,7 @@ var HeadingAnchor = /*#__PURE__*/function (_React$PureComponent) {
|
|
|
112
115
|
"aria-hidden": hideFromScreenReader,
|
|
113
116
|
tabIndex: hideFromScreenReader ? undefined : -1,
|
|
114
117
|
"aria-label": hideFromScreenReader ? undefined : _this.state.tooltipMessage,
|
|
118
|
+
"aria-labelledby": fg('platform_editor_accessible_heading_copy_link') ? hideFromScreenReader ? undefined : headingId : undefined,
|
|
115
119
|
type: "button"
|
|
116
120
|
}, jsx(LinkIcon, {
|
|
117
121
|
label: _this.getCopyAriaLabel(),
|
|
@@ -1,19 +1,25 @@
|
|
|
1
1
|
import React, { memo } from 'react';
|
|
2
2
|
import { Status as AkStatus } from '@atlaskit/status/element';
|
|
3
3
|
import { FabricElementsAnalyticsContext } from '@atlaskit/analytics-namespaced-context';
|
|
4
|
+
import VisuallyHidden from '@atlaskit/visually-hidden';
|
|
4
5
|
import { fg } from '@atlaskit/platform-feature-flags';
|
|
6
|
+
import { useIntl } from 'react-intl-next';
|
|
5
7
|
import { useInlineAnnotationProps } from '../../ui/annotations/element/useInlineAnnotationProps';
|
|
8
|
+
import { statusMessages } from '../../messages';
|
|
6
9
|
export default /*#__PURE__*/memo(function Status(props) {
|
|
7
10
|
var text = props.text,
|
|
8
11
|
color = props.color,
|
|
9
12
|
localId = props.localId;
|
|
10
13
|
var inlineAnnotationProps = useInlineAnnotationProps(props);
|
|
14
|
+
var intl = useIntl();
|
|
11
15
|
if (fg('editor_inline_comments_on_inline_nodes')) {
|
|
12
16
|
return (
|
|
13
17
|
/*#__PURE__*/
|
|
14
18
|
// Ignored via go/ees005
|
|
15
19
|
// eslint-disable-next-line react/jsx-props-no-spreading
|
|
16
|
-
React.createElement("span", inlineAnnotationProps, /*#__PURE__*/React.createElement(
|
|
20
|
+
React.createElement("span", inlineAnnotationProps, fg('editor_a11y_status_renderer_description') && /*#__PURE__*/React.createElement(VisuallyHidden, {
|
|
21
|
+
role: "generic"
|
|
22
|
+
}, intl.formatMessage(statusMessages.accessibilityLabelForStatus)), /*#__PURE__*/React.createElement(FabricElementsAnalyticsContext, {
|
|
17
23
|
data: {
|
|
18
24
|
userContext: 'document'
|
|
19
25
|
}
|
|
@@ -21,7 +27,7 @@ export default /*#__PURE__*/memo(function Status(props) {
|
|
|
21
27
|
text: text,
|
|
22
28
|
color: color,
|
|
23
29
|
localId: localId,
|
|
24
|
-
role:
|
|
30
|
+
role: fg('editor_a11y_status_renderer_description') ? undefined : 'presentation',
|
|
25
31
|
isBold: fg('platform-component-visual-refresh')
|
|
26
32
|
})))
|
|
27
33
|
);
|
|
@@ -30,7 +36,14 @@ export default /*#__PURE__*/memo(function Status(props) {
|
|
|
30
36
|
data: {
|
|
31
37
|
userContext: 'document'
|
|
32
38
|
}
|
|
33
|
-
}, /*#__PURE__*/React.createElement(
|
|
39
|
+
}, fg('editor_a11y_status_renderer_description') ? /*#__PURE__*/React.createElement("span", null, /*#__PURE__*/React.createElement("span", null, /*#__PURE__*/React.createElement(VisuallyHidden, {
|
|
40
|
+
role: "generic"
|
|
41
|
+
}, intl.formatMessage(statusMessages.accessibilityLabelForStatus)), /*#__PURE__*/React.createElement(AkStatus, {
|
|
42
|
+
text: text,
|
|
43
|
+
color: color,
|
|
44
|
+
localId: localId,
|
|
45
|
+
isBold: fg('platform-component-visual-refresh')
|
|
46
|
+
}))) : /*#__PURE__*/React.createElement(AkStatus, {
|
|
34
47
|
text: text,
|
|
35
48
|
color: color,
|
|
36
49
|
localId: localId,
|
|
@@ -57,7 +57,7 @@ import { removeEmptySpaceAroundContent } from './rendererHelper';
|
|
|
57
57
|
export var NORMAL_SEVERITY_THRESHOLD = 2000;
|
|
58
58
|
export var DEGRADED_SEVERITY_THRESHOLD = 3000;
|
|
59
59
|
var packageName = "@atlaskit/renderer";
|
|
60
|
-
var packageVersion = "114.6.
|
|
60
|
+
var packageVersion = "114.6.3";
|
|
61
61
|
var setAsQueryContainerStyles = css({
|
|
62
62
|
containerName: 'ak-renderer-wrapper',
|
|
63
63
|
containerType: 'inline-size',
|
package/dist/types/messages.d.ts
CHANGED
|
@@ -6,6 +6,7 @@ type Props = {
|
|
|
6
6
|
enableNestedHeaderLinks?: boolean;
|
|
7
7
|
level: number;
|
|
8
8
|
hideFromScreenReader?: boolean;
|
|
9
|
+
headingId?: string;
|
|
9
10
|
};
|
|
10
11
|
type HeadingAnchorProps = Props & React.PropsWithChildren<unknown> & WrappedComponentProps;
|
|
11
12
|
declare const _default: React.FC<import("react-intl-next").WithIntlProps<HeadingAnchorProps>> & {
|
|
@@ -6,6 +6,7 @@ type Props = {
|
|
|
6
6
|
enableNestedHeaderLinks?: boolean;
|
|
7
7
|
level: number;
|
|
8
8
|
hideFromScreenReader?: boolean;
|
|
9
|
+
headingId?: string;
|
|
9
10
|
};
|
|
10
11
|
type HeadingAnchorProps = Props & React.PropsWithChildren<unknown> & WrappedComponentProps;
|
|
11
12
|
declare const _default: React.FC<import("react-intl-next").WithIntlProps<HeadingAnchorProps>> & {
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@atlaskit/renderer",
|
|
3
|
-
"version": "114.6.
|
|
3
|
+
"version": "114.6.3",
|
|
4
4
|
"description": "Renderer component",
|
|
5
5
|
"publishConfig": {
|
|
6
6
|
"registry": "https://registry.npmjs.org/"
|
|
@@ -31,14 +31,14 @@
|
|
|
31
31
|
"@atlaskit/analytics-next": "^11.0.0",
|
|
32
32
|
"@atlaskit/button": "^22.0.0",
|
|
33
33
|
"@atlaskit/code": "^16.1.0",
|
|
34
|
-
"@atlaskit/editor-common": "^102.
|
|
34
|
+
"@atlaskit/editor-common": "^102.15.0",
|
|
35
35
|
"@atlaskit/editor-json-transformer": "^8.24.0",
|
|
36
36
|
"@atlaskit/editor-palette": "^2.1.0",
|
|
37
37
|
"@atlaskit/editor-prosemirror": "7.0.0",
|
|
38
38
|
"@atlaskit/editor-shared-styles": "^3.4.0",
|
|
39
39
|
"@atlaskit/emoji": "^69.0.0",
|
|
40
40
|
"@atlaskit/feature-gate-js-client": "^5.0.0",
|
|
41
|
-
"@atlaskit/icon": "^25.
|
|
41
|
+
"@atlaskit/icon": "^25.3.0",
|
|
42
42
|
"@atlaskit/link-datasource": "^4.1.0",
|
|
43
43
|
"@atlaskit/media-card": "^79.0.0",
|
|
44
44
|
"@atlaskit/media-client": "^32.0.0",
|
|
@@ -54,7 +54,7 @@
|
|
|
54
54
|
"@atlaskit/status": "^3.0.0",
|
|
55
55
|
"@atlaskit/task-decision": "^19.1.0",
|
|
56
56
|
"@atlaskit/theme": "^18.0.0",
|
|
57
|
-
"@atlaskit/tmp-editor-statsig": "^4.
|
|
57
|
+
"@atlaskit/tmp-editor-statsig": "^4.5.0",
|
|
58
58
|
"@atlaskit/tokens": "^4.5.0",
|
|
59
59
|
"@atlaskit/tooltip": "^20.0.0",
|
|
60
60
|
"@atlaskit/visually-hidden": "^3.0.0",
|
|
@@ -172,6 +172,9 @@
|
|
|
172
172
|
"platform_editor_accessible_heading_copy_link": {
|
|
173
173
|
"type": "boolean"
|
|
174
174
|
},
|
|
175
|
+
"editor_a11y_status_renderer_description": {
|
|
176
|
+
"type": "boolean"
|
|
177
|
+
},
|
|
175
178
|
"use_comments_data_annotation_updater": {
|
|
176
179
|
"type": "boolean"
|
|
177
180
|
},
|