@atlaskit/task-decision 19.2.4 → 19.2.5

package/CHANGELOG.md

@@ -1,5 +1,13 @@
 # @atlaskit/task-decision
 
+## 19.2.5
+
+### Patch Changes
+
+- [#177773](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/pull-requests/177773)
+  [`7c804d38fecdb`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/7c804d38fecdb) -
+  ENGHEALTH-28090 - fix renderer task a11y label
+
 ## 19.2.4
 
 ### Patch Changes

package/dist/cjs/components/TaskItem.js

@@ -11,8 +11,10 @@ require("./TaskItem.compiled.css");
 var _runtime = require("@compiled/react/runtime");
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
 var _react = _interopRequireWildcard(require("react"));
+var _reactIntlNext = require("react-intl-next");
 var _baseNew = require("@atlaskit/icon/base-new");
 var _checkboxChecked = _interopRequireDefault(require("@atlaskit/icon/core/checkbox-checked"));
+var _i18n = require("./i18n");
 var _Item = _interopRequireDefault(require("./Item"));
 var _analyticsNext = require("@atlaskit/analytics-next");
 var _analytics = require("../analytics");
@@ -52,6 +54,8 @@ var TaskItem = function TaskItem(props) {
     onClick = props.onClick,
     createAnalyticsEvent = props.createAnalyticsEvent,
     inputRefFromProps = props.inputRef;
+  var _useIntl = (0, _reactIntlNext.useIntl)(),
+    formatMessage = _useIntl.formatMessage;
   var checkBoxId = (0, _react.useMemo)(function () {
     return getCheckBoxId(taskId);
   }, [taskId]);
@@ -91,7 +95,7 @@ var TaskItem = function TaskItem(props) {
     }
   }, /*#__PURE__*/_react.default.createElement("input", {
     id: checkBoxId,
-    "aria-labelledby": "".concat(checkBoxId, "-wrapper"),
+    "aria-label": formatMessage(isDone ? _i18n.messages.markTaskAsNotCompleted : _i18n.messages.markTaskAsCompleted),
     name: checkBoxId,
     type: "checkbox",
     onChange: handleOnChange,

package/dist/cjs/components/i18n.js

@@ -10,5 +10,15 @@ var messages = exports.messages = (0, _reactIntlNext.defineMessages)({
     id: 'fabric.editor.fieldsetLabel',
     defaultMessage: 'Action Item List',
     description: 'Label for a list of tasks/ action items'
+  },
+  markTaskAsCompleted: {
+    id: 'platform.taskDecision.markTaskAsCompleted',
+    defaultMessage: 'Mark task as completed',
+    description: 'Button to mark a task as complete in the editor'
+  },
+  markTaskAsNotCompleted: {
+    id: 'platform.taskDecision.markTaskAsNotCompleted',
+    defaultMessage: 'Mark task as not completed',
+    description: 'Button to mark a task as not complete in the editor'
   }
 });

package/dist/es2019/components/TaskItem.js

@@ -3,11 +3,13 @@ import _extends from "@babel/runtime/helpers/extends";
 import "./TaskItem.compiled.css";
 import { ax, ix } from "@compiled/react/runtime";
 import React, { useMemo, useRef } from 'react';
+import { useIntl } from 'react-intl-next';
 // eslint-disable-next-line @atlassian/tangerine/import/entry-points
 import { Icon } from '@atlaskit/icon/base-new';
 // eslint-disable-next-line @atlassian/tangerine/import/entry-points
 
 import CheckboxCheckedIcon from '@atlaskit/icon/core/checkbox-checked';
+import { messages } from './i18n';
 import Item from './Item';
 import { withAnalyticsEvents } from '@atlaskit/analytics-next';
 import { createAndFireEventInElementsChannel } from '../analytics';
@@ -42,6 +44,9 @@ const TaskItem = props => {
     createAnalyticsEvent,
     inputRef: inputRefFromProps
   } = props;
+  const {
+    formatMessage
+  } = useIntl();
   const checkBoxId = useMemo(() => getCheckBoxId(taskId), [taskId]);
   const handleOnChange = useMemo(() => {
     return _evt => {
@@ -74,7 +79,7 @@ const TaskItem = props => {
     className: ax(["_16jlidpf _1o9zidpf _i0dl1tcg _1bsb1tcg _4t3i1tcg _kqswh2mm _1wpzv2br _1snx1r31 _1746glyw _dx3f1o36 _1h5xidpf _sqizidpf _fs2cidpf _1smcidpf _oezm15vq _1l0615vq _1abj1mn3 _18a711so _16np1elr _a27kkb7n _q3p7usvi _qhqx1nu9 _10cr1ssb _zfav1ssb _m7eu1ooe _l9o0n7od _1efjn7od _1u2istnw _32ro1j9a _1wn015vq _den5ugt7 _zh8l1b66 _g5w3stnw _whhepxbi _1stbpxbi _18tob3bt _1awt1ule _haf81ssb _ra781ssb _cr751ooe _1q8r7vkz _9l2s7vkz _1mh7kb7n _s3uktlke _1davidpf _8bo8stnw _psnc1ssb _4k421ssb _1rvv1ooe _13vl73ad _1t711tcg _1nuz1tcg _cs4qstnw _9j2j1ssb _1mwj1ssb _19l51ooe _12yy1d5g _1miy1elr _1umo18hz _tpz25w2r _k6dg18hz _1qduewfl _q8ft1fvw _1y9t5w2r _ut031fvw _gi9hr01l _1qp6muej _wxkgr01l _wo245w2r _c8dpmuej _d2dcsyzs _1eulsyzs _1bc7syzs _16fmsyzs _bhkusyzs _czfesyzs _1gxgsyzs _19w0syzs _1x1y1lg7"])
   }, /*#__PURE__*/React.createElement("input", {
     id: checkBoxId,
-    "aria-labelledby": `${checkBoxId}-wrapper`,
+    "aria-label": formatMessage(isDone ? messages.markTaskAsNotCompleted : messages.markTaskAsCompleted),
     name: checkBoxId,
     type: "checkbox",
     onChange: handleOnChange,

package/dist/es2019/components/i18n.js

@@ -4,5 +4,15 @@ export const messages = defineMessages({
     id: 'fabric.editor.fieldsetLabel',
     defaultMessage: 'Action Item List',
     description: 'Label for a list of tasks/ action items'
+  },
+  markTaskAsCompleted: {
+    id: 'platform.taskDecision.markTaskAsCompleted',
+    defaultMessage: 'Mark task as completed',
+    description: 'Button to mark a task as complete in the editor'
+  },
+  markTaskAsNotCompleted: {
+    id: 'platform.taskDecision.markTaskAsNotCompleted',
+    defaultMessage: 'Mark task as not completed',
+    description: 'Button to mark a task as not complete in the editor'
   }
 });

package/dist/esm/components/TaskItem.js

@@ -3,11 +3,13 @@ import _extends from "@babel/runtime/helpers/extends";
 import "./TaskItem.compiled.css";
 import { ax, ix } from "@compiled/react/runtime";
 import React, { useMemo, useRef } from 'react';
+import { useIntl } from 'react-intl-next';
 // eslint-disable-next-line @atlassian/tangerine/import/entry-points
 import { Icon } from '@atlaskit/icon/base-new';
 // eslint-disable-next-line @atlassian/tangerine/import/entry-points
 
 import CheckboxCheckedIcon from '@atlaskit/icon/core/checkbox-checked';
+import { messages } from './i18n';
 import Item from './Item';
 import { withAnalyticsEvents } from '@atlaskit/analytics-next';
 import { createAndFireEventInElementsChannel } from '../analytics';
@@ -44,6 +46,8 @@ var TaskItem = function TaskItem(props) {
     onClick = props.onClick,
     createAnalyticsEvent = props.createAnalyticsEvent,
     inputRefFromProps = props.inputRef;
+  var _useIntl = useIntl(),
+    formatMessage = _useIntl.formatMessage;
   var checkBoxId = useMemo(function () {
     return getCheckBoxId(taskId);
   }, [taskId]);
@@ -83,7 +87,7 @@ var TaskItem = function TaskItem(props) {
     }
   }, /*#__PURE__*/React.createElement("input", {
     id: checkBoxId,
-    "aria-labelledby": "".concat(checkBoxId, "-wrapper"),
+    "aria-label": formatMessage(isDone ? messages.markTaskAsNotCompleted : messages.markTaskAsCompleted),
     name: checkBoxId,
     type: "checkbox",
     onChange: handleOnChange,

package/dist/esm/components/i18n.js

@@ -4,5 +4,15 @@ export var messages = defineMessages({
     id: 'fabric.editor.fieldsetLabel',
     defaultMessage: 'Action Item List',
     description: 'Label for a list of tasks/ action items'
+  },
+  markTaskAsCompleted: {
+    id: 'platform.taskDecision.markTaskAsCompleted',
+    defaultMessage: 'Mark task as completed',
+    description: 'Button to mark a task as complete in the editor'
+  },
+  markTaskAsNotCompleted: {
+    id: 'platform.taskDecision.markTaskAsNotCompleted',
+    defaultMessage: 'Mark task as not completed',
+    description: 'Button to mark a task as not complete in the editor'
   }
 });

package/dist/types/components/i18n.d.ts

@@ -4,4 +4,14 @@ export declare const messages: {
         defaultMessage: string;
         description: string;
     };
+    markTaskAsCompleted: {
+        id: string;
+        defaultMessage: string;
+        description: string;
+    };
+    markTaskAsNotCompleted: {
+        id: string;
+        defaultMessage: string;
+        description: string;
+    };
 };

package/dist/types-ts4.5/components/i18n.d.ts

@@ -4,4 +4,14 @@ export declare const messages: {
         defaultMessage: string;
         description: string;
     };
+    markTaskAsCompleted: {
+        id: string;
+        defaultMessage: string;
+        description: string;
+    };
+    markTaskAsNotCompleted: {
+        id: string;
+        defaultMessage: string;
+        description: string;
+    };
 };

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@atlaskit/task-decision",
-	"version": "19.2.4",
+	"version": "19.2.5",
 	"description": "Tasks and decisions react components",
 	"publishConfig": {
 		"registry": "https://registry.npmjs.org/"
@@ -43,9 +43,9 @@
 	"dependencies": {
 		"@atlaskit/analytics-namespaced-context": "^7.0.0",
 		"@atlaskit/analytics-next": "^11.1.0",
-		"@atlaskit/icon": "^27.0.0",
+		"@atlaskit/icon": "^27.2.0",
 		"@atlaskit/platform-feature-flags": "^1.1.0",
-		"@atlaskit/tokens": "^5.2.0",
+		"@atlaskit/tokens": "^5.4.0",
 		"@atlaskit/util-service-support": "^6.3.0",
 		"@babel/runtime": "^7.0.0",
 		"@compiled/react": "^0.18.3",