@atlaskit/task-decision 19.1.4 → 19.2.1

package/CHANGELOG.md

@@ -1,5 +1,24 @@
 # @atlaskit/task-decision
 
+## 19.2.1
+
+### Patch Changes
+
+- Updated dependencies
+
+## 19.2.0
+
+### Minor Changes
+
+- [#146310](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/pull-requests/146310)
+  [`fb230587c00e2`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/fb230587c00e2) -
+  [ux] [A11Y-9616] Add internationalisation to tasks and descisions plugin, wrap tasks item lists in
+  a fieldset to group them and give them an accessible name
+
+### Patch Changes
+
+- Updated dependencies
+
 ## 19.1.4
 
 ### Patch Changes

package/afm-cc/tsconfig.json

@@ -26,6 +26,9 @@
         {
             "path": "../../../design-system/icon/afm-cc/tsconfig.json"
         },
+        {
+            "path": "../../../platform/feature-flags/afm-cc/tsconfig.json"
+        },
         {
             "path": "../../../platform/feature-flags-react/afm-cc/tsconfig.json"
         },

package/afm-jira/tsconfig.json

@@ -26,6 +26,12 @@
 		{
 			"path": "../../../design-system/icon/afm-jira/tsconfig.json"
 		},
+		{
+			"path": "../../../platform/feature-flags/afm-jira/tsconfig.json"
+		},
+		{
+			"path": "../../../platform/feature-flags-react/afm-jira/tsconfig.json"
+		},
 		{
 			"path": "../../../design-system/tokens/afm-jira/tsconfig.json"
 		},

package/afm-post-office/tsconfig.json

@@ -26,6 +26,9 @@
 		{
 			"path": "../../../design-system/icon/afm-post-office/tsconfig.json"
 		},
+		{
+			"path": "../../../platform/feature-flags-react/afm-post-office/tsconfig.json"
+		},
 		{
 			"path": "../../../design-system/tokens/afm-post-office/tsconfig.json"
 		},

package/dist/cjs/components/TaskList.js

@@ -16,19 +16,52 @@ var _getPrototypeOf2 = _interopRequireDefault(require("@babel/runtime/helpers/ge
 var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));
 var _react = _interopRequireWildcard(require("react"));
 var _analyticsNamespacedContext = require("@atlaskit/analytics-namespaced-context");
+var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
+var _i18n = require("./i18n");
+var _reactIntlNext = require("react-intl-next");
 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); }
 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; }
 function _callSuper(t, o, e) { return o = (0, _getPrototypeOf2.default)(o), (0, _possibleConstructorReturn2.default)(t, _isNativeReflectConstruct() ? Reflect.construct(o, e || [], (0, _getPrototypeOf2.default)(t).constructor) : o.apply(t, e)); }
 function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); } catch (t) {} return (_isNativeReflectConstruct = function _isNativeReflectConstruct() { return !!t; })(); }
 var listStyles = null;
 var taskListStyles = null;
-var TaskList = exports.default = /*#__PURE__*/function (_PureComponent) {
-  function TaskList() {
-    (0, _classCallCheck2.default)(this, TaskList);
-    return _callSuper(this, TaskList, arguments);
+var TaskListNew = function TaskListNew(_ref) {
+  var listId = _ref.listId,
+    children = _ref.children;
+  var listSize = _react.default.Children.count(children);
+  var _useIntl = (0, _reactIntlNext.useIntl)(),
+    formatMessage = _useIntl.formatMessage;
+  if (!children) {
+    return null;
   }
-  (0, _inherits2.default)(TaskList, _PureComponent);
-  return (0, _createClass2.default)(TaskList, [{
+  return /*#__PURE__*/_react.default.createElement("div", {
+    role: "group",
+    "data-task-list-local-id": "",
+    "aria-label": formatMessage(_i18n.messages.fieldsetLabel),
+    className: (0, _runtime.ax)(["_2mzuglyw _19bvidpf"])
+  }, _react.default.Children.map(children, function (child, idx) {
+    var _ref2 = child.props,
+      localId = _ref2.localId;
+    return /*#__PURE__*/_react.default.createElement(_analyticsNamespacedContext.FabricElementsAnalyticsContext, {
+      data: {
+        listLocalId: listId,
+        listSize: listSize,
+        position: idx
+      }
+    }, /*#__PURE__*/_react.default.createElement("div", {
+      key: idx,
+      "data-task-local-id": localId || '',
+      className: (0, _runtime.ax)(["_19pk1b66"])
+    }, child));
+  }));
+};
+var TaskListOld = /*#__PURE__*/function (_PureComponent) {
+  function TaskListOld() {
+    (0, _classCallCheck2.default)(this, TaskListOld);
+    return _callSuper(this, TaskListOld, arguments);
+  }
+  (0, _inherits2.default)(TaskListOld, _PureComponent);
+  return (0, _createClass2.default)(TaskListOld, [{
     key: "render",
     value: function render() {
       var _this$props = this.props,
@@ -49,8 +82,8 @@ var TaskList = exports.default = /*#__PURE__*/function (_PureComponent) {
         "data-task-list-local-id": "",
         className: (0, _runtime.ax)(["_2mzuglyw _19bvidpf"])
       }, _react.default.Children.map(children, function (child, idx) {
-        var _ref = child.props,
-          localId = _ref.localId;
+        var _ref3 = child.props,
+          localId = _ref3.localId;
         return /*#__PURE__*/_react.default.createElement(_analyticsNamespacedContext.FabricElementsAnalyticsContext, {
           data: {
             listLocalId: listId,
@@ -65,4 +98,11 @@ var TaskList = exports.default = /*#__PURE__*/function (_PureComponent) {
       }));
     }
   }]);
-}(_react.PureComponent);
+}(_react.PureComponent);
+var TaskListNext = function TaskListNext(props) {
+  if ((0, _platformFeatureFlags.fg)('editor_a11y_group_around_action_items')) {
+    return /*#__PURE__*/_react.default.createElement(TaskListNew, props);
+  }
+  return /*#__PURE__*/_react.default.createElement(TaskListOld, props);
+};
+var _default = exports.default = TaskListNext;

package/dist/cjs/components/i18n.js

@@ -0,0 +1,14 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.messages = void 0;
+var _reactIntlNext = require("react-intl-next");
+var messages = exports.messages = (0, _reactIntlNext.defineMessages)({
+  fieldsetLabel: {
+    id: 'fabric.editor.fieldsetLabel',
+    defaultMessage: 'Action Item List',
+    description: 'Label for a list of tasks/ action items'
+  }
+});

package/dist/es2019/components/TaskList.js

@@ -1,12 +1,47 @@
 /* TaskList.tsx generated by @compiled/babel-plugin v0.36.1 */
 import "./TaskList.compiled.css";
 import { ax, ix } from "@compiled/react/runtime";
-import React from 'react';
-import { PureComponent } from 'react';
+import React, { PureComponent } from 'react';
 import { FabricElementsAnalyticsContext } from '@atlaskit/analytics-namespaced-context';
+import { fg } from '@atlaskit/platform-feature-flags';
+import { messages } from './i18n';
+import { useIntl } from 'react-intl-next';
 const listStyles = null;
 const taskListStyles = null;
-export default class TaskList extends PureComponent {
+const TaskListNew = ({
+  listId,
+  children
+}) => {
+  const listSize = React.Children.count(children);
+  const {
+    formatMessage
+  } = useIntl();
+  if (!children) {
+    return null;
+  }
+  return /*#__PURE__*/React.createElement("div", {
+    role: "group",
+    "data-task-list-local-id": "",
+    "aria-label": formatMessage(messages.fieldsetLabel),
+    className: ax(["_2mzuglyw _19bvidpf"])
+  }, React.Children.map(children, (child, idx) => {
+    const {
+      localId
+    } = child.props;
+    return /*#__PURE__*/React.createElement(FabricElementsAnalyticsContext, {
+      data: {
+        listLocalId: listId,
+        listSize,
+        position: idx
+      }
+    }, /*#__PURE__*/React.createElement("div", {
+      key: idx,
+      "data-task-local-id": localId || '',
+      className: ax(["_19pk1b66"])
+    }, child));
+  }));
+};
+class TaskListOld extends PureComponent {
   render() {
     const {
       listId,
@@ -43,4 +78,11 @@ export default class TaskList extends PureComponent {
       }, child));
     }));
   }
-}
+}
+const TaskListNext = props => {
+  if (fg('editor_a11y_group_around_action_items')) {
+    return /*#__PURE__*/React.createElement(TaskListNew, props);
+  }
+  return /*#__PURE__*/React.createElement(TaskListOld, props);
+};
+export default TaskListNext;

package/dist/es2019/components/i18n.js

@@ -0,0 +1,8 @@
+import { defineMessages } from 'react-intl-next';
+export const messages = defineMessages({
+  fieldsetLabel: {
+    id: 'fabric.editor.fieldsetLabel',
+    defaultMessage: 'Action Item List',
+    description: 'Label for a list of tasks/ action items'
+  }
+});

package/dist/esm/components/TaskList.js

@@ -8,18 +8,50 @@ import "./TaskList.compiled.css";
 import { ax, ix } from "@compiled/react/runtime";
 function _callSuper(t, o, e) { return o = _getPrototypeOf(o), _possibleConstructorReturn(t, _isNativeReflectConstruct() ? Reflect.construct(o, e || [], _getPrototypeOf(t).constructor) : o.apply(t, e)); }
 function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); } catch (t) {} return (_isNativeReflectConstruct = function _isNativeReflectConstruct() { return !!t; })(); }
-import React from 'react';
-import { PureComponent } from 'react';
+import React, { PureComponent } from 'react';
 import { FabricElementsAnalyticsContext } from '@atlaskit/analytics-namespaced-context';
+import { fg } from '@atlaskit/platform-feature-flags';
+import { messages } from './i18n';
+import { useIntl } from 'react-intl-next';
 var listStyles = null;
 var taskListStyles = null;
-var TaskList = /*#__PURE__*/function (_PureComponent) {
-  function TaskList() {
-    _classCallCheck(this, TaskList);
-    return _callSuper(this, TaskList, arguments);
+var TaskListNew = function TaskListNew(_ref) {
+  var listId = _ref.listId,
+    children = _ref.children;
+  var listSize = React.Children.count(children);
+  var _useIntl = useIntl(),
+    formatMessage = _useIntl.formatMessage;
+  if (!children) {
+    return null;
   }
-  _inherits(TaskList, _PureComponent);
-  return _createClass(TaskList, [{
+  return /*#__PURE__*/React.createElement("div", {
+    role: "group",
+    "data-task-list-local-id": "",
+    "aria-label": formatMessage(messages.fieldsetLabel),
+    className: ax(["_2mzuglyw _19bvidpf"])
+  }, React.Children.map(children, function (child, idx) {
+    var _ref2 = child.props,
+      localId = _ref2.localId;
+    return /*#__PURE__*/React.createElement(FabricElementsAnalyticsContext, {
+      data: {
+        listLocalId: listId,
+        listSize: listSize,
+        position: idx
+      }
+    }, /*#__PURE__*/React.createElement("div", {
+      key: idx,
+      "data-task-local-id": localId || '',
+      className: ax(["_19pk1b66"])
+    }, child));
+  }));
+};
+var TaskListOld = /*#__PURE__*/function (_PureComponent) {
+  function TaskListOld() {
+    _classCallCheck(this, TaskListOld);
+    return _callSuper(this, TaskListOld, arguments);
+  }
+  _inherits(TaskListOld, _PureComponent);
+  return _createClass(TaskListOld, [{
     key: "render",
     value: function render() {
       var _this$props = this.props,
@@ -40,8 +72,8 @@ var TaskList = /*#__PURE__*/function (_PureComponent) {
         "data-task-list-local-id": "",
         className: ax(["_2mzuglyw _19bvidpf"])
       }, React.Children.map(children, function (child, idx) {
-        var _ref = child.props,
-          localId = _ref.localId;
+        var _ref3 = child.props,
+          localId = _ref3.localId;
         return /*#__PURE__*/React.createElement(FabricElementsAnalyticsContext, {
           data: {
             listLocalId: listId,
@@ -57,4 +89,10 @@ var TaskList = /*#__PURE__*/function (_PureComponent) {
     }
   }]);
 }(PureComponent);
-export { TaskList as default };
+var TaskListNext = function TaskListNext(props) {
+  if (fg('editor_a11y_group_around_action_items')) {
+    return /*#__PURE__*/React.createElement(TaskListNew, props);
+  }
+  return /*#__PURE__*/React.createElement(TaskListOld, props);
+};
+export default TaskListNext;

package/dist/esm/components/i18n.js

@@ -0,0 +1,8 @@
+import { defineMessages } from 'react-intl-next';
+export var messages = defineMessages({
+  fieldsetLabel: {
+    id: 'fabric.editor.fieldsetLabel',
+    defaultMessage: 'Action Item List',
+    description: 'Label for a list of tasks/ action items'
+  }
+});

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

@@ -1,8 +1,11 @@
-import { PureComponent, type ReactNode } from 'react';
+/**
+ * @jsxRuntime classic
+ * @jsx jsx
+ */
+import { ReactNode } from 'react';
 export interface Props {
     listId?: string;
     children?: ReactNode;
 }
-export default class TaskList extends PureComponent<Props, {}> {
-    render(): JSX.Element | null;
-}
+declare const TaskListNext: (props: Props) => JSX.Element;
+export default TaskListNext;

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

@@ -0,0 +1,7 @@
+export declare const messages: {
+    fieldsetLabel: {
+        id: string;
+        defaultMessage: string;
+        description: string;
+    };
+};

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

@@ -1,8 +1,11 @@
-import { PureComponent, type ReactNode } from 'react';
+/**
+ * @jsxRuntime classic
+ * @jsx jsx
+ */
+import { ReactNode } from 'react';
 export interface Props {
     listId?: string;
     children?: ReactNode;
 }
-export default class TaskList extends PureComponent<Props, {}> {
-    render(): JSX.Element | null;
-}
+declare const TaskListNext: (props: Props) => JSX.Element;
+export default TaskListNext;

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

@@ -0,0 +1,7 @@
+export declare const messages: {
+    fieldsetLabel: {
+        id: string;
+        defaultMessage: string;
+        description: string;
+    };
+};

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@atlaskit/task-decision",
-	"version": "19.1.4",
+	"version": "19.2.1",
 	"description": "Tasks and decisions react components",
 	"publishConfig": {
 		"registry": "https://registry.npmjs.org/"
@@ -43,12 +43,14 @@
 	"dependencies": {
 		"@atlaskit/analytics-namespaced-context": "^7.0.0",
 		"@atlaskit/analytics-next": "^11.0.0",
-		"@atlaskit/icon": "^25.6.0",
-		"@atlaskit/platform-feature-flags-react": "^0.1.0",
-		"@atlaskit/tokens": "^4.7.0",
+		"@atlaskit/icon": "^25.7.0",
+		"@atlaskit/platform-feature-flags": "^1.1.0",
+		"@atlaskit/platform-feature-flags-react": "^0.2.0",
+		"@atlaskit/tokens": "^4.8.0",
 		"@atlaskit/util-service-support": "^6.3.0",
 		"@babel/runtime": "^7.0.0",
 		"@compiled/react": "^0.18.3",
+		"react-intl-next": "npm:react-intl@^5.18.1",
 		"use-callback-ref": "^1.2.3",
 		"uuid": "^3.1.0"
 	},
@@ -58,10 +60,10 @@
 		"url-search-params": "^0.10.0"
 	},
 	"devDependencies": {
-		"@af/visual-regression": "^1.3.0",
+		"@af/visual-regression": "workspace:^",
 		"@atlaskit/analytics-listeners": "^9.0.0",
-		"@atlaskit/elements-test-helpers": "^0.9.0",
-		"@atlaskit/ssr": "^0.4.0",
+		"@atlaskit/elements-test-helpers": "workspace:^",
+		"@atlaskit/ssr": "workspace:^",
 		"@atlaskit/util-data-test": "^18.0.0",
 		"@testing-library/react": "^13.4.0",
 		"@testing-library/user-event": "^14.4.3",
@@ -86,5 +88,10 @@
 				"compiled"
 			]
 		}
+	},
+	"platform-feature-flags": {
+		"editor_a11y_group_around_action_items": {
+			"type": "boolean"
+		}
 	}
 }