@atlaskit/focused-task-close-account 4.0.1 → 4.0.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 CHANGED
@@ -1,5 +1,20 @@
1
1
  # @atlaskit/focused-task-close-account
2
2
 
3
+ ## 4.0.3
4
+
5
+ ### Patch Changes
6
+
7
+ - [`35359015f4b76`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/35359015f4b76) -
8
+ Fix accessibility violation: add aria-label to StatefulInlineDialog trigger button to ensure it
9
+ has a discernible name for screen readers
10
+
11
+ ## 4.0.2
12
+
13
+ ### Patch Changes
14
+
15
+ - [`103f19eae0280`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/103f19eae0280) -
16
+ Accessibility fix
17
+
3
18
  ## 4.0.1
4
19
 
5
20
  ### Patch Changes
@@ -77,6 +77,7 @@ var DeleteUserOverviewScreen = exports.DeleteUserOverviewScreen = /*#__PURE__*/f
77
77
  }
78
78
  })), /*#__PURE__*/_react.default.createElement(Styled.IconHoverWrapper, null, /*#__PURE__*/_react.default.createElement(_StatefulInlineDialog.default, {
79
79
  placement: "auto-start",
80
+ label: "More information",
80
81
  content: /*#__PURE__*/_react.default.createElement(Styled.InlineDialogContent, null, /*#__PURE__*/_react.default.createElement(_reactIntl.FormattedMessage, (0, _extends2.default)({}, _this.selectAdminOrSelfCopy(_messages.overviewMessages.inlineDialogDataWillBeDeletedP1Admin, _messages.overviewMessages.inlineDialogDataWillBeDeletedP1Self), {
81
82
  tagName: "p"
82
83
  })), /*#__PURE__*/_react.default.createElement(_reactIntl.FormattedMessage, (0, _extends2.default)({}, _this.selectAdminOrSelfCopy(_messages.overviewMessages.inlineDialogDataWillBeDeletedLi1Admin, _messages.overviewMessages.inlineDialogDataWillBeDeletedLi1Self), {
@@ -98,6 +99,7 @@ var DeleteUserOverviewScreen = exports.DeleteUserOverviewScreen = /*#__PURE__*/f
98
99
  (0, _defineProperty2.default)(_this, "displayThirdListElement", function () {
99
100
  return /*#__PURE__*/_react.default.createElement("li", null, /*#__PURE__*/_react.default.createElement(_reactIntl.FormattedMessage, _this.selectAdminOrSelfCopy((0, _platformFeatureFlags.fg)('product-terminology-refresh') ? _messages.overviewMessages.paragraphListOfAppsWithPersonalDataAdminAppify : _messages.overviewMessages.paragraphListOfAppsWithPersonalDataAdmin, (0, _platformFeatureFlags.fg)('product-terminology-refresh') ? _messages.overviewMessages.paragraphListOfAppsWithPersonalDataSelfAppify : _messages.overviewMessages.paragraphListOfAppsWithPersonalDataSelf)), /*#__PURE__*/_react.default.createElement(Styled.IconHoverWrapper, null, /*#__PURE__*/_react.default.createElement(_StatefulInlineDialog.default, {
100
101
  placement: "auto-start",
102
+ label: "More information",
101
103
  content: /*#__PURE__*/_react.default.createElement(_reactIntl.FormattedMessage, _this.selectAdminOrSelfCopy((0, _platformFeatureFlags.fg)('product-terminology-refresh') ? _messages.overviewMessages.inlineDialogDataAppsAdminAppify : _messages.overviewMessages.inlineDialogDataAppsAdmin, (0, _platformFeatureFlags.fg)('product-terminology-refresh') ? _messages.overviewMessages.inlineDialogDataAppsSelfAppify : _messages.overviewMessages.inlineDialogDataAppsSelf))
102
104
  }, /*#__PURE__*/_react.default.createElement(_statusInformation.default, {
103
105
  color: "currentColor",
@@ -107,6 +109,7 @@ var DeleteUserOverviewScreen = exports.DeleteUserOverviewScreen = /*#__PURE__*/f
107
109
  (0, _defineProperty2.default)(_this, "displayFourthListElement", function () {
108
110
  return /*#__PURE__*/_react.default.createElement("li", null, /*#__PURE__*/_react.default.createElement(_reactIntl.FormattedMessage, _this.selectAdminOrSelfCopy(_messages.overviewMessages.paragraphContentCreatedAdmin, _messages.overviewMessages.paragraphContentCreatedSelf)), /*#__PURE__*/_react.default.createElement(Styled.IconHoverWrapper, null, /*#__PURE__*/_react.default.createElement(_StatefulInlineDialog.default, {
109
111
  placement: "auto-start",
112
+ label: "More information",
110
113
  content: /*#__PURE__*/_react.default.createElement(_reactIntl.FormattedMessage, _this.selectAdminOrSelfCopy((0, _platformFeatureFlags.fg)('product-terminology-refresh') ? _messages.overviewMessages.inlineDialogContentCreatedAdminissuetermrefreshAppify : _messages.overviewMessages.inlineDialogContentCreatedAdminissuetermrefresh, (0, _platformFeatureFlags.fg)('product-terminology-refresh') ? _messages.overviewMessages.inlineDialogContentCreatedSelfAppify : _messages.overviewMessages.inlineDialogContentCreatedSelf))
111
114
  }, /*#__PURE__*/_react.default.createElement(_statusInformation.default, {
112
115
  color: "currentColor",
@@ -13,6 +13,7 @@ var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits
13
13
  var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
14
14
  var _react = _interopRequireDefault(require("react"));
15
15
  var _inlineDialog = _interopRequireDefault(require("@atlaskit/inline-dialog"));
16
+ var _styled = require("./styled");
16
17
  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)); }
17
18
  function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); } catch (t) {} return (_isNativeReflectConstruct = function _isNativeReflectConstruct() { return !!t; })(); }
18
19
  var StatefulInlineDialog = exports.StatefulInlineDialog = /*#__PURE__*/function (_React$Component) {
@@ -51,14 +52,18 @@ var StatefulInlineDialog = exports.StatefulInlineDialog = /*#__PURE__*/function
51
52
  var _this$props = this.props,
52
53
  children = _this$props.children,
53
54
  content = _this$props.content,
54
- placement = _this$props.placement;
55
+ placement = _this$props.placement,
56
+ label = _this$props.label;
55
57
  return /*#__PURE__*/_react.default.createElement(_inlineDialog.default, {
56
58
  content: content,
57
59
  placement: placement,
58
60
  isOpen: this.state.isOpen
59
- }, /*#__PURE__*/_react.default.createElement("span", {
61
+ }, /*#__PURE__*/_react.default.createElement(_styled.TriggerButton, {
62
+ "aria-label": label,
60
63
  onMouseOver: this.handleMouseOver,
61
- onMouseOut: this.handleMouseOut
64
+ onMouseOut: this.handleMouseOut,
65
+ onFocus: this.openDialog,
66
+ onBlur: this.closeDialog
62
67
  }, children));
63
68
  }
64
69
  }]);
@@ -0,0 +1,17 @@
1
+ "use strict";
2
+
3
+ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
4
+ Object.defineProperty(exports, "__esModule", {
5
+ value: true
6
+ });
7
+ exports.TriggerButton = void 0;
8
+ var _styled = _interopRequireDefault(require("@emotion/styled"));
9
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
10
+
11
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-styled, @atlaskit/ui-styling-standard/no-exported-styles -- Ignored via go/DSP-18766
12
+ var TriggerButton = exports.TriggerButton = _styled.default.button({
13
+ background: 'none',
14
+ border: 'none',
15
+ padding: 0,
16
+ cursor: 'default'
17
+ });
@@ -52,6 +52,7 @@ export class DeleteUserOverviewScreen extends React.Component {
52
52
  }
53
53
  })), /*#__PURE__*/React.createElement(Styled.IconHoverWrapper, null, /*#__PURE__*/React.createElement(StatefulInlineDialog, {
54
54
  placement: "auto-start",
55
+ label: "More information",
55
56
  content: /*#__PURE__*/React.createElement(Styled.InlineDialogContent, null, /*#__PURE__*/React.createElement(FormattedMessage, _extends({}, this.selectAdminOrSelfCopy(overviewMessages.inlineDialogDataWillBeDeletedP1Admin, overviewMessages.inlineDialogDataWillBeDeletedP1Self), {
56
57
  tagName: "p"
57
58
  })), /*#__PURE__*/React.createElement(FormattedMessage, _extends({}, this.selectAdminOrSelfCopy(overviewMessages.inlineDialogDataWillBeDeletedLi1Admin, overviewMessages.inlineDialogDataWillBeDeletedLi1Self), {
@@ -73,6 +74,7 @@ export class DeleteUserOverviewScreen extends React.Component {
73
74
  _defineProperty(this, "displayThirdListElement", () => {
74
75
  return /*#__PURE__*/React.createElement("li", null, /*#__PURE__*/React.createElement(FormattedMessage, this.selectAdminOrSelfCopy(fg('product-terminology-refresh') ? overviewMessages.paragraphListOfAppsWithPersonalDataAdminAppify : overviewMessages.paragraphListOfAppsWithPersonalDataAdmin, fg('product-terminology-refresh') ? overviewMessages.paragraphListOfAppsWithPersonalDataSelfAppify : overviewMessages.paragraphListOfAppsWithPersonalDataSelf)), /*#__PURE__*/React.createElement(Styled.IconHoverWrapper, null, /*#__PURE__*/React.createElement(StatefulInlineDialog, {
75
76
  placement: "auto-start",
77
+ label: "More information",
76
78
  content: /*#__PURE__*/React.createElement(FormattedMessage, this.selectAdminOrSelfCopy(fg('product-terminology-refresh') ? overviewMessages.inlineDialogDataAppsAdminAppify : overviewMessages.inlineDialogDataAppsAdmin, fg('product-terminology-refresh') ? overviewMessages.inlineDialogDataAppsSelfAppify : overviewMessages.inlineDialogDataAppsSelf))
77
79
  }, /*#__PURE__*/React.createElement(InfoIcon, {
78
80
  color: "currentColor",
@@ -82,6 +84,7 @@ export class DeleteUserOverviewScreen extends React.Component {
82
84
  _defineProperty(this, "displayFourthListElement", () => {
83
85
  return /*#__PURE__*/React.createElement("li", null, /*#__PURE__*/React.createElement(FormattedMessage, this.selectAdminOrSelfCopy(overviewMessages.paragraphContentCreatedAdmin, overviewMessages.paragraphContentCreatedSelf)), /*#__PURE__*/React.createElement(Styled.IconHoverWrapper, null, /*#__PURE__*/React.createElement(StatefulInlineDialog, {
84
86
  placement: "auto-start",
87
+ label: "More information",
85
88
  content: /*#__PURE__*/React.createElement(FormattedMessage, this.selectAdminOrSelfCopy(fg('product-terminology-refresh') ? overviewMessages.inlineDialogContentCreatedAdminissuetermrefreshAppify : overviewMessages.inlineDialogContentCreatedAdminissuetermrefresh, fg('product-terminology-refresh') ? overviewMessages.inlineDialogContentCreatedSelfAppify : overviewMessages.inlineDialogContentCreatedSelf))
86
89
  }, /*#__PURE__*/React.createElement(InfoIcon, {
87
90
  color: "currentColor",
@@ -1,6 +1,7 @@
1
1
  import _defineProperty from "@babel/runtime/helpers/defineProperty";
2
2
  import React from 'react';
3
3
  import InlineDialog from '@atlaskit/inline-dialog';
4
+ import { TriggerButton } from './styled';
4
5
  export class StatefulInlineDialog extends React.Component {
5
6
  constructor(...args) {
6
7
  super(...args);
@@ -28,15 +29,19 @@ export class StatefulInlineDialog extends React.Component {
28
29
  const {
29
30
  children,
30
31
  content,
31
- placement
32
+ placement,
33
+ label
32
34
  } = this.props;
33
35
  return /*#__PURE__*/React.createElement(InlineDialog, {
34
36
  content: content,
35
37
  placement: placement,
36
38
  isOpen: this.state.isOpen
37
- }, /*#__PURE__*/React.createElement("span", {
39
+ }, /*#__PURE__*/React.createElement(TriggerButton, {
40
+ "aria-label": label,
38
41
  onMouseOver: this.handleMouseOver,
39
- onMouseOut: this.handleMouseOut
42
+ onMouseOut: this.handleMouseOut,
43
+ onFocus: this.openDialog,
44
+ onBlur: this.closeDialog
40
45
  }, children));
41
46
  }
42
47
  }
@@ -0,0 +1,10 @@
1
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
2
+ import styled from '@emotion/styled';
3
+
4
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-styled, @atlaskit/ui-styling-standard/no-exported-styles -- Ignored via go/DSP-18766
5
+ export const TriggerButton = styled.button({
6
+ background: 'none',
7
+ border: 'none',
8
+ padding: 0,
9
+ cursor: 'default'
10
+ });
@@ -69,6 +69,7 @@ export var DeleteUserOverviewScreen = /*#__PURE__*/function (_React$Component) {
69
69
  }
70
70
  })), /*#__PURE__*/React.createElement(Styled.IconHoverWrapper, null, /*#__PURE__*/React.createElement(StatefulInlineDialog, {
71
71
  placement: "auto-start",
72
+ label: "More information",
72
73
  content: /*#__PURE__*/React.createElement(Styled.InlineDialogContent, null, /*#__PURE__*/React.createElement(FormattedMessage, _extends({}, _this.selectAdminOrSelfCopy(overviewMessages.inlineDialogDataWillBeDeletedP1Admin, overviewMessages.inlineDialogDataWillBeDeletedP1Self), {
73
74
  tagName: "p"
74
75
  })), /*#__PURE__*/React.createElement(FormattedMessage, _extends({}, _this.selectAdminOrSelfCopy(overviewMessages.inlineDialogDataWillBeDeletedLi1Admin, overviewMessages.inlineDialogDataWillBeDeletedLi1Self), {
@@ -90,6 +91,7 @@ export var DeleteUserOverviewScreen = /*#__PURE__*/function (_React$Component) {
90
91
  _defineProperty(_this, "displayThirdListElement", function () {
91
92
  return /*#__PURE__*/React.createElement("li", null, /*#__PURE__*/React.createElement(FormattedMessage, _this.selectAdminOrSelfCopy(fg('product-terminology-refresh') ? overviewMessages.paragraphListOfAppsWithPersonalDataAdminAppify : overviewMessages.paragraphListOfAppsWithPersonalDataAdmin, fg('product-terminology-refresh') ? overviewMessages.paragraphListOfAppsWithPersonalDataSelfAppify : overviewMessages.paragraphListOfAppsWithPersonalDataSelf)), /*#__PURE__*/React.createElement(Styled.IconHoverWrapper, null, /*#__PURE__*/React.createElement(StatefulInlineDialog, {
92
93
  placement: "auto-start",
94
+ label: "More information",
93
95
  content: /*#__PURE__*/React.createElement(FormattedMessage, _this.selectAdminOrSelfCopy(fg('product-terminology-refresh') ? overviewMessages.inlineDialogDataAppsAdminAppify : overviewMessages.inlineDialogDataAppsAdmin, fg('product-terminology-refresh') ? overviewMessages.inlineDialogDataAppsSelfAppify : overviewMessages.inlineDialogDataAppsSelf))
94
96
  }, /*#__PURE__*/React.createElement(InfoIcon, {
95
97
  color: "currentColor",
@@ -99,6 +101,7 @@ export var DeleteUserOverviewScreen = /*#__PURE__*/function (_React$Component) {
99
101
  _defineProperty(_this, "displayFourthListElement", function () {
100
102
  return /*#__PURE__*/React.createElement("li", null, /*#__PURE__*/React.createElement(FormattedMessage, _this.selectAdminOrSelfCopy(overviewMessages.paragraphContentCreatedAdmin, overviewMessages.paragraphContentCreatedSelf)), /*#__PURE__*/React.createElement(Styled.IconHoverWrapper, null, /*#__PURE__*/React.createElement(StatefulInlineDialog, {
101
103
  placement: "auto-start",
104
+ label: "More information",
102
105
  content: /*#__PURE__*/React.createElement(FormattedMessage, _this.selectAdminOrSelfCopy(fg('product-terminology-refresh') ? overviewMessages.inlineDialogContentCreatedAdminissuetermrefreshAppify : overviewMessages.inlineDialogContentCreatedAdminissuetermrefresh, fg('product-terminology-refresh') ? overviewMessages.inlineDialogContentCreatedSelfAppify : overviewMessages.inlineDialogContentCreatedSelf))
103
106
  }, /*#__PURE__*/React.createElement(InfoIcon, {
104
107
  color: "currentColor",
@@ -8,6 +8,7 @@ function _callSuper(t, o, e) { return o = _getPrototypeOf(o), _possibleConstruct
8
8
  function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); } catch (t) {} return (_isNativeReflectConstruct = function _isNativeReflectConstruct() { return !!t; })(); }
9
9
  import React from 'react';
10
10
  import InlineDialog from '@atlaskit/inline-dialog';
11
+ import { TriggerButton } from './styled';
11
12
  export var StatefulInlineDialog = /*#__PURE__*/function (_React$Component) {
12
13
  function StatefulInlineDialog() {
13
14
  var _this;
@@ -44,14 +45,18 @@ export var StatefulInlineDialog = /*#__PURE__*/function (_React$Component) {
44
45
  var _this$props = this.props,
45
46
  children = _this$props.children,
46
47
  content = _this$props.content,
47
- placement = _this$props.placement;
48
+ placement = _this$props.placement,
49
+ label = _this$props.label;
48
50
  return /*#__PURE__*/React.createElement(InlineDialog, {
49
51
  content: content,
50
52
  placement: placement,
51
53
  isOpen: this.state.isOpen
52
- }, /*#__PURE__*/React.createElement("span", {
54
+ }, /*#__PURE__*/React.createElement(TriggerButton, {
55
+ "aria-label": label,
53
56
  onMouseOver: this.handleMouseOver,
54
- onMouseOut: this.handleMouseOut
57
+ onMouseOut: this.handleMouseOut,
58
+ onFocus: this.openDialog,
59
+ onBlur: this.closeDialog
55
60
  }, children));
56
61
  }
57
62
  }]);
@@ -0,0 +1,10 @@
1
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
2
+ import styled from '@emotion/styled';
3
+
4
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-styled, @atlaskit/ui-styling-standard/no-exported-styles -- Ignored via go/DSP-18766
5
+ export var TriggerButton = styled.button({
6
+ background: 'none',
7
+ border: 'none',
8
+ padding: 0,
9
+ cursor: 'default'
10
+ });
@@ -4,6 +4,7 @@ interface Props {
4
4
  children: React.ReactNode;
5
5
  content: React.ReactNode;
6
6
  placement?: Placement;
7
+ label: string;
7
8
  }
8
9
  interface State {
9
10
  isOpen: boolean;
@@ -0,0 +1,4 @@
1
+ export declare const TriggerButton: import("@emotion/styled").StyledComponent<{
2
+ theme?: import("@emotion/react").Theme;
3
+ as?: React.ElementType;
4
+ }, import("react").DetailedHTMLProps<import("react").ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, {}>;
@@ -4,6 +4,7 @@ interface Props {
4
4
  children: React.ReactNode;
5
5
  content: React.ReactNode;
6
6
  placement?: Placement;
7
+ label: string;
7
8
  }
8
9
  interface State {
9
10
  isOpen: boolean;
@@ -0,0 +1,4 @@
1
+ export declare const TriggerButton: import("@emotion/styled").StyledComponent<{
2
+ theme?: import("@emotion/react").Theme;
3
+ as?: React.ElementType;
4
+ }, import("react").DetailedHTMLProps<import("react").ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, {}>;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@atlaskit/focused-task-close-account",
3
- "version": "4.0.1",
3
+ "version": "4.0.3",
4
4
  "description": "This package contains all of the UI components needed to assemble the focused tasks for deactivating and deleting users' accounts in accordance with the GDPR \"Right to be forgotten\".",
5
5
  "deprecated": "⚠️ DEPRECATED: This package is marked for removal. Please avoid new usage.",
6
6
  "publishConfig": {
@@ -40,7 +40,7 @@
40
40
  },
41
41
  "dependencies": {
42
42
  "@atlaskit/afm-i18n-platform-people-and-teams-focused-task-close-account": "2.39.0",
43
- "@atlaskit/avatar": "^25.11.0",
43
+ "@atlaskit/avatar": "^25.12.0",
44
44
  "@atlaskit/button": "^23.11.0",
45
45
  "@atlaskit/drawer": "^12.0.0",
46
46
  "@atlaskit/heading": "^5.4.0",