@atlaskit/editor-plugin-tasks-and-decisions 10.1.28 → 10.2.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.
Files changed (13) hide show
  1. package/CHANGELOG.md +11 -0
  2. package/dist/cjs/nodeviews/DecisionItemNodeView.js +29 -0
  3. package/dist/cjs/nodeviews/decisionItemNodeSpec.js +71 -4
  4. package/dist/cjs/nodeviews/toDOM-fixes/decisionItem.js +0 -1
  5. package/dist/es2019/nodeviews/DecisionItemNodeView.js +25 -0
  6. package/dist/es2019/nodeviews/decisionItemNodeSpec.js +71 -4
  7. package/dist/es2019/nodeviews/toDOM-fixes/decisionItem.js +0 -1
  8. package/dist/esm/nodeviews/DecisionItemNodeView.js +29 -0
  9. package/dist/esm/nodeviews/decisionItemNodeSpec.js +72 -4
  10. package/dist/esm/nodeviews/toDOM-fixes/decisionItem.js +0 -1
  11. package/dist/types/nodeviews/DecisionItemNodeView.d.ts +4 -0
  12. package/dist/types-ts4.5/nodeviews/DecisionItemNodeView.d.ts +4 -0
  13. package/package.json +4 -4
package/CHANGELOG.md CHANGED
@@ -1,5 +1,16 @@
1
1
  # @atlaskit/editor-plugin-tasks-and-decisions
2
2
 
3
+ ## 10.2.0
4
+
5
+ ### Minor Changes
6
+
7
+ - [`d78ff724d3bce`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/d78ff724d3bce) -
8
+ i18n aria labels for decision image icon (either Decision or Undefined decision)
9
+
10
+ ### Patch Changes
11
+
12
+ - Updated dependencies
13
+
3
14
  ## 10.1.28
4
15
 
5
16
  ### Patch Changes
package/dist/cjs/nodeviews/DecisionItemNodeView.js CHANGED
@@ -8,6 +8,7 @@ exports.DecisionItemNodeView = void 0;
8
8
  var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
9
9
  var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
10
10
  var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
11
+ var _messages = require("@atlaskit/editor-common/messages");
11
12
  var _model = require("@atlaskit/editor-prosemirror/model");
12
13
  var _expValEquals = require("@atlaskit/tmp-editor-statsig/exp-val-equals");
13
14
  var _decisionItemNodeSpec = require("./decisionItemNodeSpec");
@@ -27,6 +28,7 @@ var DecisionItemNodeView = exports.DecisionItemNodeView = /*#__PURE__*/function
27
28
  */
28
29
  function DecisionItemNodeView(node, intl) {
29
30
  (0, _classCallCheck2.default)(this, DecisionItemNodeView);
31
+ (0, _defineProperty2.default)(this, "icon", null);
30
32
  (0, _defineProperty2.default)(this, "hasChildren", undefined);
31
33
  var spec = (0, _decisionItemNodeSpec.decisionItemToDOM)(node, intl);
32
34
  var _DOMSerializer$render = _model.DOMSerializer.renderSpec(document, spec),
@@ -34,6 +36,10 @@ var DecisionItemNodeView = exports.DecisionItemNodeView = /*#__PURE__*/function
34
36
  contentDOM = _DOMSerializer$render.contentDOM;
35
37
  this.dom = dom;
36
38
  this.contentDOM = contentDOM;
39
+ if ((0, _expValEquals.expValEquals)('editor_a11y_decision_aria_label', 'isEnabled', true)) {
40
+ this.setIcon(this.dom);
41
+ this.intl = intl;
42
+ }
37
43
  }
38
44
 
39
45
  /**
@@ -58,9 +64,32 @@ var DecisionItemNodeView = exports.DecisionItemNodeView = /*#__PURE__*/function
58
64
  var _this$contentDOM;
59
65
  this.hasChildren = currentlyHasChildren;
60
66
  (_this$contentDOM = this.contentDOM) === null || _this$contentDOM === void 0 || _this$contentDOM.toggleAttribute('data-empty', !currentlyHasChildren);
67
+ if ((0, _expValEquals.expValEquals)('editor_a11y_decision_aria_label', 'isEnabled', true)) {
68
+ this.setIconAriaLabel(!currentlyHasChildren);
69
+ }
61
70
  }
62
71
  return this.hasChildren;
63
72
  }
73
+ }, {
74
+ key: "setIcon",
75
+ value: function setIcon(dom) {
76
+ if (!dom || !(dom instanceof HTMLElement)) {
77
+ return;
78
+ }
79
+ var maybeIcon = dom.querySelector('[data-component="icon"] > [role="img"]');
80
+ if (maybeIcon && maybeIcon instanceof HTMLElement) {
81
+ this.icon = maybeIcon;
82
+ }
83
+ }
84
+ }, {
85
+ key: "setIconAriaLabel",
86
+ value: function setIconAriaLabel(isEmpty) {
87
+ if (!this.icon || !this.intl) {
88
+ return;
89
+ }
90
+ var ariaLabel = isEmpty ? this.intl.formatMessage(_messages.tasksAndDecisionsMessages.undefinedDecisionAriaLabel) : this.intl.formatMessage(_messages.tasksAndDecisionsMessages.decisionAriaLabel);
91
+ this.icon.setAttribute('aria-label', ariaLabel);
92
+ }
64
93
  }, {
65
94
  key: "update",
66
95
  value: function update(node) {
package/dist/cjs/nodeviews/decisionItemNodeSpec.js CHANGED
@@ -7,8 +7,10 @@ Object.defineProperty(exports, "__esModule", {
7
7
  exports.decisionItemToDOM = void 0;
8
8
  var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
9
9
  var _messages = require("@atlaskit/editor-common/messages");
10
+ var _expValEquals = require("@atlaskit/tmp-editor-statsig/exp-val-equals");
10
11
  function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
11
12
  function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { (0, _defineProperty2.default)(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
13
+ // When cleaning up editor_a11y_decision_aria_label remove this iconDOM variable
12
14
  // This value can be a fixed constant as it doesn't depend on runtime values or arguments.
13
15
  var iconDOM = ['span', {
14
16
  contentEditable: false,
@@ -38,10 +40,72 @@ var iconDOM = ['span', {
38
40
  'fill-rule': 'evenodd',
39
41
  d: 'm13.97.97-4.5 4.5 1.06 1.06 4.5-4.5zM3.56 2.5H8V1H1.75a.75.75 0 0 0-.75.75V8h1.5V3.56l4.604 4.604a.5.5 0 0 1 .146.354V15h1.5V8.518a2 2 0 0 0-.586-1.414z'
40
42
  }]]]];
43
+
44
+ /**
45
+ * Determine if the decision item node is empty
46
+ *
47
+ * @param node The decision item node
48
+ * @returns true if the decision item is empty and false otherwise
49
+ */
50
+ var isDecisionItemEmpty = function isDecisionItemEmpty(node) {
51
+ return node.childCount <= 0;
52
+ };
53
+
54
+ /**
55
+ * Creates a DOM element for the decision icon with an accessible aria label.
56
+ *
57
+ * Generates a decision icon DOM structure with an aria label that changes based on whether
58
+ * the decision item is empty. An empty decision item receives the "undefined" aria label,
59
+ * while non-empty decision items receive the standard "decision" aria label.
60
+ *
61
+ * @param node - The ProseMirror node representing the decision item
62
+ * @param intl - The intl object used to format internationalized messages for the aria label
63
+ * @returns A DOMOutputSpec array representing the icon element with nested SVG graphics
64
+ */
65
+ var createIconDOM = function createIconDOM(_ref) {
66
+ var node = _ref.node,
67
+ intl = _ref.intl;
68
+ var ariaLabel = isDecisionItemEmpty(node) ? intl.formatMessage(_messages.tasksAndDecisionsMessages.undefinedDecisionAriaLabel) : intl.formatMessage(_messages.tasksAndDecisionsMessages.decisionAriaLabel);
69
+ return ['span', {
70
+ contentEditable: false,
71
+ 'data-component': 'icon'
72
+ }, ['span', {
73
+ role: 'img',
74
+ 'aria-label': ariaLabel
75
+ }, ['http://www.w3.org/2000/svg svg', {
76
+ viewBox: "0 0 24 24",
77
+ role: 'presentation',
78
+ width: '24',
79
+ height: '24',
80
+ 'data-icon-source': 'legacy'
81
+ }, ['http://www.w3.org/2000/svg path', {
82
+ fill: 'currentcolor',
83
+ 'fill-rule': 'evenodd',
84
+ d: 'm9.414 8 3.293 3.293c.187.187.293.442.293.707v5a1 1 0 0 1-2 0v-4.586l-3-3V10.5a1 1 0 0 1-2 0V7a1 1 0 0 1 1-1h3.5a1 1 0 0 1 0 2zm8.293-1.707a1 1 0 0 1 0 1.414l-2.5 2.5a.997.997 0 0 1-1.414 0 1 1 0 0 1 0-1.414l2.5-2.5a1 1 0 0 1 1.414 0'
85
+ }]], ['http://www.w3.org/2000/svg svg', {
86
+ viewBox: "-4 -4 24 24",
87
+ fill: 'none',
88
+ role: 'presentation',
89
+ width: '24',
90
+ height: '24',
91
+ 'data-icon-source': 'refreshed'
92
+ }, ['http://www.w3.org/2000/svg path', {
93
+ fill: 'currentcolor',
94
+ 'fill-rule': 'evenodd',
95
+ d: 'm13.97.97-4.5 4.5 1.06 1.06 4.5-4.5zM3.56 2.5H8V1H1.75a.75.75 0 0 0-.75.75V8h1.5V3.56l4.604 4.604a.5.5 0 0 1 .146.354V15h1.5V8.518a2 2 0 0 0-.586-1.414z'
96
+ }]]]];
97
+ };
41
98
  var decisionItemToDOM = exports.decisionItemToDOM = function decisionItemToDOM(node, intl) {
42
- var contentDomDataAttrs = node.childCount > 0 ? {} : {
43
- 'data-empty': 'true'
44
- };
99
+ var contentDomDataAttrs;
100
+ if ((0, _expValEquals.expValEquals)('editor_a11y_decision_aria_label', 'isEnabled', true)) {
101
+ contentDomDataAttrs = isDecisionItemEmpty(node) ? {
102
+ 'data-empty': 'true'
103
+ } : {};
104
+ } else {
105
+ contentDomDataAttrs = node.childCount > 0 ? {} : {
106
+ 'data-empty': 'true'
107
+ };
108
+ }
45
109
  return ['li', {
46
110
  'data-decision-local-id': node.attrs.localId || 'local-decision',
47
111
  'data-decision-state': node.attrs.state,
@@ -50,7 +114,10 @@ var decisionItemToDOM = exports.decisionItemToDOM = function decisionItemToDOM(n
50
114
  }, ['div', {
51
115
  'data-testid': 'elements-decision-item',
52
116
  'data-decision-wrapper': true
53
- }, iconDOM,
117
+ }, (0, _expValEquals.expValEquals)('editor_a11y_decision_aria_label', 'isEnabled', true) ? createIconDOM({
118
+ node: node,
119
+ intl: intl
120
+ }) : iconDOM,
54
121
  // renderPlaceholder
55
122
  ['span', {
56
123
  'data-testid': 'task-decision-item-placeholder',
package/dist/cjs/nodeviews/toDOM-fixes/decisionItem.js CHANGED
@@ -53,7 +53,6 @@ var decisionItemSpecWithFixedToDOM = exports.decisionItemSpecWithFixedToDOM = fu
53
53
  'data-component': 'icon'
54
54
  }, ['span', {
55
55
  role: 'img',
56
- 'aria-label': 'Decision',
57
56
  style: (0, _lazyNodeView.convertToInlineCss)({
58
57
  width: '32px',
59
58
  height: '32px'
package/dist/es2019/nodeviews/DecisionItemNodeView.js CHANGED
@@ -1,4 +1,5 @@
1
1
  import _defineProperty from "@babel/runtime/helpers/defineProperty";
2
+ import { tasksAndDecisionsMessages } from '@atlaskit/editor-common/messages';
2
3
  import { DOMSerializer } from '@atlaskit/editor-prosemirror/model';
3
4
  import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
4
5
  import { decisionItemToDOM } from './decisionItemNodeSpec';
@@ -19,9 +20,28 @@ export class DecisionItemNodeView {
19
20
  var _this$contentDOM;
20
21
  this.hasChildren = currentlyHasChildren;
21
22
  (_this$contentDOM = this.contentDOM) === null || _this$contentDOM === void 0 ? void 0 : _this$contentDOM.toggleAttribute('data-empty', !currentlyHasChildren);
23
+ if (expValEquals('editor_a11y_decision_aria_label', 'isEnabled', true)) {
24
+ this.setIconAriaLabel(!currentlyHasChildren);
25
+ }
22
26
  }
23
27
  return this.hasChildren;
24
28
  }
29
+ setIcon(dom) {
30
+ if (!dom || !(dom instanceof HTMLElement)) {
31
+ return;
32
+ }
33
+ const maybeIcon = dom.querySelector('[data-component="icon"] > [role="img"]');
34
+ if (maybeIcon && maybeIcon instanceof HTMLElement) {
35
+ this.icon = maybeIcon;
36
+ }
37
+ }
38
+ setIconAriaLabel(isEmpty) {
39
+ if (!this.icon || !this.intl) {
40
+ return;
41
+ }
42
+ const ariaLabel = isEmpty ? this.intl.formatMessage(tasksAndDecisionsMessages.undefinedDecisionAriaLabel) : this.intl.formatMessage(tasksAndDecisionsMessages.decisionAriaLabel);
43
+ this.icon.setAttribute('aria-label', ariaLabel);
44
+ }
25
45
 
26
46
  /**
27
47
  * Creates a new DecisionItemNodeView.
@@ -33,6 +53,7 @@ export class DecisionItemNodeView {
33
53
  * const decisionItemNodeView = new DecisionItemNodeView(node, getIntl());
34
54
  */
35
55
  constructor(node, intl) {
56
+ _defineProperty(this, "icon", null);
36
57
  _defineProperty(this, "hasChildren", undefined);
37
58
  const spec = decisionItemToDOM(node, intl);
38
59
  const {
@@ -41,6 +62,10 @@ export class DecisionItemNodeView {
41
62
  } = DOMSerializer.renderSpec(document, spec);
42
63
  this.dom = dom;
43
64
  this.contentDOM = contentDOM;
65
+ if (expValEquals('editor_a11y_decision_aria_label', 'isEnabled', true)) {
66
+ this.setIcon(this.dom);
67
+ this.intl = intl;
68
+ }
44
69
  }
45
70
 
46
71
  /**
package/dist/es2019/nodeviews/decisionItemNodeSpec.js CHANGED
@@ -1,4 +1,7 @@
1
1
  import { tasksAndDecisionsMessages } from '@atlaskit/editor-common/messages';
2
+ import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
3
+
4
+ // When cleaning up editor_a11y_decision_aria_label remove this iconDOM variable
2
5
  // This value can be a fixed constant as it doesn't depend on runtime values or arguments.
3
6
  const iconDOM = ['span', {
4
7
  contentEditable: false,
@@ -28,10 +31,71 @@ const iconDOM = ['span', {
28
31
  'fill-rule': 'evenodd',
29
32
  d: 'm13.97.97-4.5 4.5 1.06 1.06 4.5-4.5zM3.56 2.5H8V1H1.75a.75.75 0 0 0-.75.75V8h1.5V3.56l4.604 4.604a.5.5 0 0 1 .146.354V15h1.5V8.518a2 2 0 0 0-.586-1.414z'
30
33
  }]]]];
34
+
35
+ /**
36
+ * Determine if the decision item node is empty
37
+ *
38
+ * @param node The decision item node
39
+ * @returns true if the decision item is empty and false otherwise
40
+ */
41
+ const isDecisionItemEmpty = node => node.childCount <= 0;
42
+
43
+ /**
44
+ * Creates a DOM element for the decision icon with an accessible aria label.
45
+ *
46
+ * Generates a decision icon DOM structure with an aria label that changes based on whether
47
+ * the decision item is empty. An empty decision item receives the "undefined" aria label,
48
+ * while non-empty decision items receive the standard "decision" aria label.
49
+ *
50
+ * @param node - The ProseMirror node representing the decision item
51
+ * @param intl - The intl object used to format internationalized messages for the aria label
52
+ * @returns A DOMOutputSpec array representing the icon element with nested SVG graphics
53
+ */
54
+ const createIconDOM = ({
55
+ node,
56
+ intl
57
+ }) => {
58
+ const ariaLabel = isDecisionItemEmpty(node) ? intl.formatMessage(tasksAndDecisionsMessages.undefinedDecisionAriaLabel) : intl.formatMessage(tasksAndDecisionsMessages.decisionAriaLabel);
59
+ return ['span', {
60
+ contentEditable: false,
61
+ 'data-component': 'icon'
62
+ }, ['span', {
63
+ role: 'img',
64
+ 'aria-label': ariaLabel
65
+ }, ['http://www.w3.org/2000/svg svg', {
66
+ viewBox: `0 0 24 24`,
67
+ role: 'presentation',
68
+ width: '24',
69
+ height: '24',
70
+ 'data-icon-source': 'legacy'
71
+ }, ['http://www.w3.org/2000/svg path', {
72
+ fill: 'currentcolor',
73
+ 'fill-rule': 'evenodd',
74
+ d: 'm9.414 8 3.293 3.293c.187.187.293.442.293.707v5a1 1 0 0 1-2 0v-4.586l-3-3V10.5a1 1 0 0 1-2 0V7a1 1 0 0 1 1-1h3.5a1 1 0 0 1 0 2zm8.293-1.707a1 1 0 0 1 0 1.414l-2.5 2.5a.997.997 0 0 1-1.414 0 1 1 0 0 1 0-1.414l2.5-2.5a1 1 0 0 1 1.414 0'
75
+ }]], ['http://www.w3.org/2000/svg svg', {
76
+ viewBox: `-4 -4 24 24`,
77
+ fill: 'none',
78
+ role: 'presentation',
79
+ width: '24',
80
+ height: '24',
81
+ 'data-icon-source': 'refreshed'
82
+ }, ['http://www.w3.org/2000/svg path', {
83
+ fill: 'currentcolor',
84
+ 'fill-rule': 'evenodd',
85
+ d: 'm13.97.97-4.5 4.5 1.06 1.06 4.5-4.5zM3.56 2.5H8V1H1.75a.75.75 0 0 0-.75.75V8h1.5V3.56l4.604 4.604a.5.5 0 0 1 .146.354V15h1.5V8.518a2 2 0 0 0-.586-1.414z'
86
+ }]]]];
87
+ };
31
88
  export const decisionItemToDOM = (node, intl) => {
32
- const contentDomDataAttrs = node.childCount > 0 ? {} : {
33
- 'data-empty': 'true'
34
- };
89
+ let contentDomDataAttrs;
90
+ if (expValEquals('editor_a11y_decision_aria_label', 'isEnabled', true)) {
91
+ contentDomDataAttrs = isDecisionItemEmpty(node) ? {
92
+ 'data-empty': 'true'
93
+ } : {};
94
+ } else {
95
+ contentDomDataAttrs = node.childCount > 0 ? {} : {
96
+ 'data-empty': 'true'
97
+ };
98
+ }
35
99
  return ['li', {
36
100
  'data-decision-local-id': node.attrs.localId || 'local-decision',
37
101
  'data-decision-state': node.attrs.state,
@@ -40,7 +104,10 @@ export const decisionItemToDOM = (node, intl) => {
40
104
  }, ['div', {
41
105
  'data-testid': 'elements-decision-item',
42
106
  'data-decision-wrapper': true
43
- }, iconDOM,
107
+ }, expValEquals('editor_a11y_decision_aria_label', 'isEnabled', true) ? createIconDOM({
108
+ node,
109
+ intl
110
+ }) : iconDOM,
44
111
  // renderPlaceholder
45
112
  ['span', {
46
113
  'data-testid': 'task-decision-item-placeholder',
package/dist/es2019/nodeviews/toDOM-fixes/decisionItem.js CHANGED
@@ -45,7 +45,6 @@ export const decisionItemSpecWithFixedToDOM = () => {
45
45
  'data-component': 'icon'
46
46
  }, ['span', {
47
47
  role: 'img',
48
- 'aria-label': 'Decision',
49
48
  style: convertToInlineCss({
50
49
  width: '32px',
51
50
  height: '32px'
package/dist/esm/nodeviews/DecisionItemNodeView.js CHANGED
@@ -1,6 +1,7 @@
1
1
  import _classCallCheck from "@babel/runtime/helpers/classCallCheck";
2
2
  import _createClass from "@babel/runtime/helpers/createClass";
3
3
  import _defineProperty from "@babel/runtime/helpers/defineProperty";
4
+ import { tasksAndDecisionsMessages } from '@atlaskit/editor-common/messages';
4
5
  import { DOMSerializer } from '@atlaskit/editor-prosemirror/model';
5
6
  import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
6
7
  import { decisionItemToDOM } from './decisionItemNodeSpec';
@@ -21,6 +22,7 @@ export var DecisionItemNodeView = /*#__PURE__*/function () {
21
22
  */
22
23
  function DecisionItemNodeView(node, intl) {
23
24
  _classCallCheck(this, DecisionItemNodeView);
25
+ _defineProperty(this, "icon", null);
24
26
  _defineProperty(this, "hasChildren", undefined);
25
27
  var spec = decisionItemToDOM(node, intl);
26
28
  var _DOMSerializer$render = DOMSerializer.renderSpec(document, spec),
@@ -28,6 +30,10 @@ export var DecisionItemNodeView = /*#__PURE__*/function () {
28
30
  contentDOM = _DOMSerializer$render.contentDOM;
29
31
  this.dom = dom;
30
32
  this.contentDOM = contentDOM;
33
+ if (expValEquals('editor_a11y_decision_aria_label', 'isEnabled', true)) {
34
+ this.setIcon(this.dom);
35
+ this.intl = intl;
36
+ }
31
37
  }
32
38
 
33
39
  /**
@@ -52,9 +58,32 @@ export var DecisionItemNodeView = /*#__PURE__*/function () {
52
58
  var _this$contentDOM;
53
59
  this.hasChildren = currentlyHasChildren;
54
60
  (_this$contentDOM = this.contentDOM) === null || _this$contentDOM === void 0 || _this$contentDOM.toggleAttribute('data-empty', !currentlyHasChildren);
61
+ if (expValEquals('editor_a11y_decision_aria_label', 'isEnabled', true)) {
62
+ this.setIconAriaLabel(!currentlyHasChildren);
63
+ }
55
64
  }
56
65
  return this.hasChildren;
57
66
  }
67
+ }, {
68
+ key: "setIcon",
69
+ value: function setIcon(dom) {
70
+ if (!dom || !(dom instanceof HTMLElement)) {
71
+ return;
72
+ }
73
+ var maybeIcon = dom.querySelector('[data-component="icon"] > [role="img"]');
74
+ if (maybeIcon && maybeIcon instanceof HTMLElement) {
75
+ this.icon = maybeIcon;
76
+ }
77
+ }
78
+ }, {
79
+ key: "setIconAriaLabel",
80
+ value: function setIconAriaLabel(isEmpty) {
81
+ if (!this.icon || !this.intl) {
82
+ return;
83
+ }
84
+ var ariaLabel = isEmpty ? this.intl.formatMessage(tasksAndDecisionsMessages.undefinedDecisionAriaLabel) : this.intl.formatMessage(tasksAndDecisionsMessages.decisionAriaLabel);
85
+ this.icon.setAttribute('aria-label', ariaLabel);
86
+ }
58
87
  }, {
59
88
  key: "update",
60
89
  value: function update(node) {
package/dist/esm/nodeviews/decisionItemNodeSpec.js CHANGED
@@ -2,6 +2,9 @@ import _defineProperty from "@babel/runtime/helpers/defineProperty";
2
2
  function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
3
3
  function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
4
4
  import { tasksAndDecisionsMessages } from '@atlaskit/editor-common/messages';
5
+ import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
6
+
7
+ // When cleaning up editor_a11y_decision_aria_label remove this iconDOM variable
5
8
  // This value can be a fixed constant as it doesn't depend on runtime values or arguments.
6
9
  var iconDOM = ['span', {
7
10
  contentEditable: false,
@@ -31,10 +34,72 @@ var iconDOM = ['span', {
31
34
  'fill-rule': 'evenodd',
32
35
  d: 'm13.97.97-4.5 4.5 1.06 1.06 4.5-4.5zM3.56 2.5H8V1H1.75a.75.75 0 0 0-.75.75V8h1.5V3.56l4.604 4.604a.5.5 0 0 1 .146.354V15h1.5V8.518a2 2 0 0 0-.586-1.414z'
33
36
  }]]]];
37
+
38
+ /**
39
+ * Determine if the decision item node is empty
40
+ *
41
+ * @param node The decision item node
42
+ * @returns true if the decision item is empty and false otherwise
43
+ */
44
+ var isDecisionItemEmpty = function isDecisionItemEmpty(node) {
45
+ return node.childCount <= 0;
46
+ };
47
+
48
+ /**
49
+ * Creates a DOM element for the decision icon with an accessible aria label.
50
+ *
51
+ * Generates a decision icon DOM structure with an aria label that changes based on whether
52
+ * the decision item is empty. An empty decision item receives the "undefined" aria label,
53
+ * while non-empty decision items receive the standard "decision" aria label.
54
+ *
55
+ * @param node - The ProseMirror node representing the decision item
56
+ * @param intl - The intl object used to format internationalized messages for the aria label
57
+ * @returns A DOMOutputSpec array representing the icon element with nested SVG graphics
58
+ */
59
+ var createIconDOM = function createIconDOM(_ref) {
60
+ var node = _ref.node,
61
+ intl = _ref.intl;
62
+ var ariaLabel = isDecisionItemEmpty(node) ? intl.formatMessage(tasksAndDecisionsMessages.undefinedDecisionAriaLabel) : intl.formatMessage(tasksAndDecisionsMessages.decisionAriaLabel);
63
+ return ['span', {
64
+ contentEditable: false,
65
+ 'data-component': 'icon'
66
+ }, ['span', {
67
+ role: 'img',
68
+ 'aria-label': ariaLabel
69
+ }, ['http://www.w3.org/2000/svg svg', {
70
+ viewBox: "0 0 24 24",
71
+ role: 'presentation',
72
+ width: '24',
73
+ height: '24',
74
+ 'data-icon-source': 'legacy'
75
+ }, ['http://www.w3.org/2000/svg path', {
76
+ fill: 'currentcolor',
77
+ 'fill-rule': 'evenodd',
78
+ d: 'm9.414 8 3.293 3.293c.187.187.293.442.293.707v5a1 1 0 0 1-2 0v-4.586l-3-3V10.5a1 1 0 0 1-2 0V7a1 1 0 0 1 1-1h3.5a1 1 0 0 1 0 2zm8.293-1.707a1 1 0 0 1 0 1.414l-2.5 2.5a.997.997 0 0 1-1.414 0 1 1 0 0 1 0-1.414l2.5-2.5a1 1 0 0 1 1.414 0'
79
+ }]], ['http://www.w3.org/2000/svg svg', {
80
+ viewBox: "-4 -4 24 24",
81
+ fill: 'none',
82
+ role: 'presentation',
83
+ width: '24',
84
+ height: '24',
85
+ 'data-icon-source': 'refreshed'
86
+ }, ['http://www.w3.org/2000/svg path', {
87
+ fill: 'currentcolor',
88
+ 'fill-rule': 'evenodd',
89
+ d: 'm13.97.97-4.5 4.5 1.06 1.06 4.5-4.5zM3.56 2.5H8V1H1.75a.75.75 0 0 0-.75.75V8h1.5V3.56l4.604 4.604a.5.5 0 0 1 .146.354V15h1.5V8.518a2 2 0 0 0-.586-1.414z'
90
+ }]]]];
91
+ };
34
92
  export var decisionItemToDOM = function decisionItemToDOM(node, intl) {
35
- var contentDomDataAttrs = node.childCount > 0 ? {} : {
36
- 'data-empty': 'true'
37
- };
93
+ var contentDomDataAttrs;
94
+ if (expValEquals('editor_a11y_decision_aria_label', 'isEnabled', true)) {
95
+ contentDomDataAttrs = isDecisionItemEmpty(node) ? {
96
+ 'data-empty': 'true'
97
+ } : {};
98
+ } else {
99
+ contentDomDataAttrs = node.childCount > 0 ? {} : {
100
+ 'data-empty': 'true'
101
+ };
102
+ }
38
103
  return ['li', {
39
104
  'data-decision-local-id': node.attrs.localId || 'local-decision',
40
105
  'data-decision-state': node.attrs.state,
@@ -43,7 +108,10 @@ export var decisionItemToDOM = function decisionItemToDOM(node, intl) {
43
108
  }, ['div', {
44
109
  'data-testid': 'elements-decision-item',
45
110
  'data-decision-wrapper': true
46
- }, iconDOM,
111
+ }, expValEquals('editor_a11y_decision_aria_label', 'isEnabled', true) ? createIconDOM({
112
+ node: node,
113
+ intl: intl
114
+ }) : iconDOM,
47
115
  // renderPlaceholder
48
116
  ['span', {
49
117
  'data-testid': 'task-decision-item-placeholder',
package/dist/esm/nodeviews/toDOM-fixes/decisionItem.js CHANGED
@@ -46,7 +46,6 @@ export var decisionItemSpecWithFixedToDOM = function decisionItemSpecWithFixedTo
46
46
  'data-component': 'icon'
47
47
  }, ['span', {
48
48
  role: 'img',
49
- 'aria-label': 'Decision',
50
49
  style: convertToInlineCss({
51
50
  width: '32px',
52
51
  height: '32px'
package/dist/types/nodeviews/DecisionItemNodeView.d.ts CHANGED
@@ -8,6 +8,8 @@ import { type NodeView } from '@atlaskit/editor-prosemirror/view';
8
8
  export declare class DecisionItemNodeView implements NodeView {
9
9
  dom: Node;
10
10
  contentDOM?: HTMLElement;
11
+ private icon;
12
+ private intl;
11
13
  private hasChildren;
12
14
  /**
13
15
  * Updates the hasChildren state based on the node's child count by setting the `data-empty` attribute on the contentDOM.
@@ -15,6 +17,8 @@ export declare class DecisionItemNodeView implements NodeView {
15
17
  * @private
16
18
  */
17
19
  private updateHasChildren;
20
+ private setIcon;
21
+ private setIconAriaLabel;
18
22
  /**
19
23
  * Creates a new DecisionItemNodeView.
20
24
  * @import type {PMNode} from '@atlaskit/editor-prosemirror/model';
package/dist/types-ts4.5/nodeviews/DecisionItemNodeView.d.ts CHANGED
@@ -8,6 +8,8 @@ import { type NodeView } from '@atlaskit/editor-prosemirror/view';
8
8
  export declare class DecisionItemNodeView implements NodeView {
9
9
  dom: Node;
10
10
  contentDOM?: HTMLElement;
11
+ private icon;
12
+ private intl;
11
13
  private hasChildren;
12
14
  /**
13
15
  * Updates the hasChildren state based on the node's child count by setting the `data-empty` attribute on the contentDOM.
@@ -15,6 +17,8 @@ export declare class DecisionItemNodeView implements NodeView {
15
17
  * @private
16
18
  */
17
19
  private updateHasChildren;
20
+ private setIcon;
21
+ private setIconAriaLabel;
18
22
  /**
19
23
  * Creates a new DecisionItemNodeView.
20
24
  * @import type {PMNode} from '@atlaskit/editor-prosemirror/model';
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@atlaskit/editor-plugin-tasks-and-decisions",
3
- "version": "10.1.28",
3
+ "version": "10.2.0",
4
4
  "description": "Tasks and decisions plugin for @atlaskit/editor-core",
5
5
  "author": "Atlassian Pty Ltd",
6
6
  "license": "Apache-2.0",
@@ -48,15 +48,15 @@
48
48
  "@atlaskit/platform-feature-flags": "^1.1.0",
49
49
  "@atlaskit/primitives": "^18.0.0",
50
50
  "@atlaskit/prosemirror-input-rules": "^3.6.0",
51
- "@atlaskit/task-decision": "^19.2.0",
52
- "@atlaskit/tmp-editor-statsig": "^32.3.0",
51
+ "@atlaskit/task-decision": "^19.3.0",
52
+ "@atlaskit/tmp-editor-statsig": "^32.4.0",
53
53
  "@atlaskit/tokens": "^11.0.0",
54
54
  "@babel/runtime": "^7.0.0",
55
55
  "@compiled/react": "^0.18.6",
56
56
  "bind-event-listener": "^3.0.0"
57
57
  },
58
58
  "peerDependencies": {
59
- "@atlaskit/editor-common": "^111.20.0",
59
+ "@atlaskit/editor-common": "^111.21.0",
60
60
  "react": "^18.2.0",
61
61
  "react-dom": "^18.2.0",
62
62
  "react-intl-next": "npm:react-intl@^5.18.1"