@atlaskit/share 4.3.1 → 4.4.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 (27) hide show
  1. package/CHANGELOG.md +6 -0
  2. package/dist/cjs/components/CommentField.js +2 -1
  3. package/dist/cjs/components/ShareButton.js +5 -2
  4. package/dist/cjs/components/UserPickerField.js +56 -18
  5. package/dist/cjs/components/analytics/analytics.js +1 -1
  6. package/dist/cjs/i18n/en.js +1 -1
  7. package/dist/cjs/i18n.js +80 -44
  8. package/dist/cjs/version.json +1 -1
  9. package/dist/es2019/components/CommentField.js +2 -1
  10. package/dist/es2019/components/ShareButton.js +4 -1
  11. package/dist/es2019/components/UserPickerField.js +50 -18
  12. package/dist/es2019/components/analytics/analytics.js +1 -1
  13. package/dist/es2019/i18n/en.js +1 -1
  14. package/dist/es2019/i18n.js +80 -44
  15. package/dist/es2019/version.json +1 -1
  16. package/dist/esm/components/CommentField.js +2 -1
  17. package/dist/esm/components/ShareButton.js +5 -2
  18. package/dist/esm/components/UserPickerField.js +56 -18
  19. package/dist/esm/components/analytics/analytics.js +1 -1
  20. package/dist/esm/i18n/en.js +1 -1
  21. package/dist/esm/i18n.js +80 -44
  22. package/dist/esm/version.json +1 -1
  23. package/dist/types/components/ShareButton.d.ts +1 -0
  24. package/dist/types/i18n.d.ts +40 -10
  25. package/dist/types-ts4.5/components/ShareButton.d.ts +1 -0
  26. package/dist/types-ts4.5/i18n.d.ts +40 -10
  27. package/package.json +2 -2
package/CHANGELOG.md CHANGED
@@ -1,5 +1,11 @@
1
1
  # @atlaskit/share
2
2
 
3
+ ## 4.4.0
4
+
5
+ ### Minor Changes
6
+
7
+ - [`b5a13856081`](https://bitbucket.org/atlassian/atlassian-frontend/commits/b5a13856081) - [ux] Better accessibility support and copy for the Share dialog
8
+
3
9
  ## 4.3.1
4
10
 
5
11
  ### Patch Changes
package/dist/cjs/components/CommentField.js CHANGED
@@ -16,7 +16,8 @@ var CommentField = function CommentField(_ref) {
16
16
  var intl = (0, _reactIntlNext.useIntl)();
17
17
  return /*#__PURE__*/_react.default.createElement(_form.Field, {
18
18
  name: "comment",
19
- defaultValue: defaultValue
19
+ defaultValue: defaultValue,
20
+ label: intl.formatMessage(_i18n.messages.commentLabel)
20
21
  }, function (_ref2) {
21
22
  var fieldProps = _ref2.fieldProps;
22
23
  return /*#__PURE__*/_react.default.createElement(_textarea.default, (0, _extends2.default)({}, fieldProps, {
package/dist/cjs/components/ShareButton.js CHANGED
@@ -9,9 +9,12 @@ var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends")
9
9
  var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
10
10
  var _react = _interopRequireDefault(require("react"));
11
11
  var _customThemeButton = _interopRequireDefault(require("@atlaskit/button/custom-theme-button"));
12
- var _excluded = ["text"];
13
- var ShareButton = /*#__PURE__*/_react.default.forwardRef(function ShareButton(_ref, ref) {
12
+ var _excluded = ["text", "aria-haspopup"];
13
+ var ShareButton = /*#__PURE__*/_react.default.forwardRef(
14
+ // Discard aria-haspopup
15
+ function ShareButton(_ref, ref) {
14
16
  var text = _ref.text,
17
+ _ariaHasPopup = _ref['aria-haspopup'],
15
18
  props = (0, _objectWithoutProperties2.default)(_ref, _excluded);
16
19
  return /*#__PURE__*/_react.default.createElement(_customThemeButton.default, (0, _extends2.default)({
17
20
  ref: ref,
package/dist/cjs/components/UserPickerField.js CHANGED
@@ -29,6 +29,9 @@ function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Re
29
29
  var REQUIRED = 'REQUIRED';
30
30
  exports.REQUIRED = REQUIRED;
31
31
  var DEBOUNCE_MS = 150;
32
+ var USER_PICKER_FIELD_LABEL = 'share-user-picker-field-label';
33
+ var USER_PICKER_FIELD_PLACEHOLDER = 'share-user-picker-field-placeholder';
34
+ var USER_PICKER_ARIA_LABEL = "".concat(USER_PICKER_FIELD_LABEL, " ").concat(USER_PICKER_FIELD_PLACEHOLDER);
32
35
  var validate = function validate(value) {
33
36
  return value && value instanceof Array && value.length > 0 ? undefined : REQUIRED;
34
37
  };
@@ -54,34 +57,61 @@ var getPlaceHolderMessageDescriptor = function getPlaceHolderMessageDescriptor()
54
57
  var isBrowseUsersDisabled = arguments.length > 2 ? arguments[2] : undefined;
55
58
  if (!allowEmail) {
56
59
  var _placeholderMessage = {
57
- jira: _i18n.messages.userPickerExistingUserOnlyPlaceholder,
58
- confluence: _i18n.messages.userPickerGenericExistingUserOnlyPlaceholder
60
+ jira: _i18n.messages.userPickerPlaceholderEmailDisabledJira,
61
+ // We can use the same message as when emails are not disabled, since
62
+ // emails are not mentioned in this placeholder as it would be too long
63
+ confluence: _i18n.messages.userPickerPlaceholderConfluence
59
64
  };
60
65
  return _placeholderMessage[product];
61
66
  }
62
67
  if (isBrowseUsersDisabled) {
63
- return _i18n.messages.userPickerGenericEmailOnlyPlaceholder;
68
+ return _i18n.messages.userPickerPlaceholderBrowseUsersDisabled;
64
69
  }
65
70
  var placeholderMessage = {
66
- jira: _i18n.messages.userPickerGenericPlaceholderJira,
67
- confluence: _i18n.messages.userPickerGenericPlaceholder
71
+ jira: _i18n.messages.userPickerPlaceholderJira,
72
+ confluence: _i18n.messages.userPickerPlaceholderConfluence
68
73
  };
69
74
  return placeholderMessage[product];
70
75
  };
71
- var requiredMessagesWithEmail = {
72
- confluence: _i18n.messages.userPickerRequiredMessage,
73
- jira: _i18n.messages.userPickerRequiredMessageJira
74
- };
75
- var requiredMessagesWithoutEmail = {
76
- confluence: _i18n.messages.userPickerRequiredExistingUserOnlyMessage,
77
- jira: _i18n.messages.userPickerRequiredExistingUserOnlyMessageJira
76
+ var getLabelMessageDescriptor = function getLabelMessageDescriptor() {
77
+ var product = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 'confluence';
78
+ var allowEmail = arguments.length > 1 ? arguments[1] : undefined;
79
+ var isBrowseUsersDisabled = arguments.length > 2 ? arguments[2] : undefined;
80
+ if (!allowEmail) {
81
+ var _labelMessage = {
82
+ jira: _i18n.messages.userPickerLabelEmailDisabledJira,
83
+ confluence: _i18n.messages.userPickerLabelEmailDisabledConfluence
84
+ };
85
+ return _labelMessage[product];
86
+ }
87
+ if (isBrowseUsersDisabled) {
88
+ return _i18n.messages.userPickerLabelBrowseUsersDisabled;
89
+ }
90
+ var labelMessage = {
91
+ jira: _i18n.messages.userPickerLabelJira,
92
+ confluence: _i18n.messages.userPickerLabelConfluence
93
+ };
94
+ return labelMessage[product];
78
95
  };
79
- var getRequiredMessage = function getRequiredMessage(product, allowEmail, isBrowseUsersDisabled) {
96
+ var getRequiredMessage = function getRequiredMessage() {
97
+ var product = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 'confluence';
98
+ var allowEmail = arguments.length > 1 ? arguments[1] : undefined;
99
+ var isBrowseUsersDisabled = arguments.length > 2 ? arguments[2] : undefined;
100
+ if (!allowEmail) {
101
+ var _requiredMessage = {
102
+ jira: _i18n.messages.userPickerRequiredMessageEmailDisabledJira,
103
+ confluence: _i18n.messages.userPickerRequiredMessageEmailDisabledConfluence
104
+ };
105
+ return _requiredMessage[product];
106
+ }
80
107
  if (isBrowseUsersDisabled) {
81
- return _i18n.messages.userPickerRequiredMessageEmailOnly;
108
+ return _i18n.messages.userPickerRequiredMessageBrowseUsersDisabled;
82
109
  }
83
- var emailMessages = allowEmail ? requiredMessagesWithEmail : requiredMessagesWithoutEmail;
84
- return emailMessages[product];
110
+ var requiredMessage = {
111
+ jira: _i18n.messages.userPickerRequiredMessageJira,
112
+ confluence: _i18n.messages.userPickerRequiredMessageConfluence
113
+ };
114
+ return requiredMessage[product];
85
115
  };
86
116
 
87
117
  // eslint-disable-next-line @repo/internal/react/no-class-components
@@ -160,7 +190,6 @@ var UserPickerFieldComponent = /*#__PURE__*/function (_React$Component) {
160
190
  loadOptions: this.loadOptions,
161
191
  isMulti: true,
162
192
  width: '100%',
163
- placeholder: /*#__PURE__*/_react.default.createElement(_reactIntlNext.FormattedMessage, getPlaceHolderMessageDescriptor(product, allowEmail, isBrowseUsersDisabled)),
164
193
  allowEmail: allowEmail,
165
194
  noOptionsMessage: getNoOptionsMessage(isPublicLink, allowEmail),
166
195
  isLoading: isLoading,
@@ -171,10 +200,14 @@ var UserPickerFieldComponent = /*#__PURE__*/function (_React$Component) {
171
200
  var UserPickerComponent = enableSmartUserPicker && !isBrowseUsersDisabled ? _smartUserPicker.default : _userPicker.default;
172
201
  var menuPortalTarget = (0, _utils.getMenuPortalTargetCurrentHTML)(selectPortalRef);
173
202
  return /*#__PURE__*/_react.default.createElement(_form.Field, {
203
+ label: /*#__PURE__*/_react.default.createElement("span", {
204
+ id: USER_PICKER_FIELD_LABEL
205
+ }, /*#__PURE__*/_react.default.createElement(_reactIntlNext.FormattedMessage, getLabelMessageDescriptor(product, allowEmail, isBrowseUsersDisabled))),
174
206
  name: "users",
175
207
  validate: validate,
176
208
  defaultValue: defaultValue,
177
- transform: this.handleUserPickerTransform
209
+ transform: this.handleUserPickerTransform,
210
+ isRequired: true
178
211
  }, function (_ref2) {
179
212
  var fieldProps = _ref2.fieldProps,
180
213
  fieldValidationError = _ref2.error,
@@ -183,7 +216,12 @@ var UserPickerFieldComponent = /*#__PURE__*/function (_React$Component) {
183
216
  var addMoreMessage = shareError !== null && shareError !== void 0 && shareError.errorCode ? null : intl.formatMessage(_i18n.messages.userPickerAddMoreMessage);
184
217
  var wasValidationOrShareError = !!fieldValidationError || !!shareError;
185
218
  return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(UserPickerComponent, (0, _extends2.default)({}, fieldProps, commonPickerProps, smartUserPickerProps, {
219
+ "aria-labelledby": USER_PICKER_ARIA_LABEL,
220
+ "aria-required": true,
186
221
  addMoreMessage: addMoreMessage,
222
+ placeholder: /*#__PURE__*/_react.default.createElement("span", {
223
+ id: USER_PICKER_FIELD_PLACEHOLDER
224
+ }, /*#__PURE__*/_react.default.createElement(_reactIntlNext.FormattedMessage, getPlaceHolderMessageDescriptor(product, allowEmail, isBrowseUsersDisabled))),
187
225
  menuPortalTarget: menuPortalTarget
188
226
  })), helperMessage && !wasValidationOrShareError && /*#__PURE__*/_react.default.createElement(_form.HelperMessage, null, helperMessage), !fieldValid && fieldValidationError === REQUIRED && /*#__PURE__*/_react.default.createElement(_form.ErrorMessage, null, /*#__PURE__*/_react.default.createElement(_reactIntlNext.FormattedMessage, requiredMessage)), shareError && shareError.errorCode && /*#__PURE__*/_react.default.createElement(_form.ErrorMessage, null, shareError.message, "\xA0", shareError.helpUrl && /*#__PURE__*/_react.default.createElement("a", {
189
227
  target: "_blank",
package/dist/cjs/components/analytics/analytics.js CHANGED
@@ -13,7 +13,7 @@ var buildAttributes = function buildAttributes() {
13
13
  var attributes = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
14
14
  return _objectSpread({
15
15
  packageName: "@atlaskit/share",
16
- packageVersion: "4.3.1"
16
+ packageVersion: "4.4.0"
17
17
  }, attributes);
18
18
  };
19
19
  var createEvent = function createEvent(eventType, source, action, actionSubject, actionSubjectId) {
package/dist/cjs/i18n/en.js CHANGED
@@ -18,7 +18,7 @@ var _default = {
18
18
  'fabric.elements.share.copypubliclink.button.text': 'Copy public link',
19
19
  'fabric.elements.share.failure.icon.label': 'Error icon',
20
20
  'fabric.elements.share.failure.message': 'Unable to share',
21
- 'fabric.elements.share.form.comment.placeholder': 'Add a message',
21
+ 'fabric.elements.share.form.comment.placeholder': 'Anything they should know?',
22
22
  'fabric.elements.share.form.info.message.no.invite.confluence': 'Recipients will see the name of the page and your message',
23
23
  'fabric.elements.share.form.info.message.no.invite.jira': 'Recipients will see the name of the issue and your message',
24
24
  'fabric.elements.share.form.no-permissions': 'You do not have the ability to share.',
package/dist/cjs/i18n.js CHANGED
@@ -41,36 +41,92 @@ var messages = (0, _reactIntlNext.defineMessages)({
41
41
  defaultMessage: 'You do not have the ability to share.',
42
42
  description: 'Copy to show when a user can not share.'
43
43
  },
44
+ commentLabel: {
45
+ id: 'fabric.elements.share.form.comment.label',
46
+ defaultMessage: 'Message (optional)',
47
+ description: 'Label for the comment field in the Share form.'
48
+ },
44
49
  commentPlaceholder: {
45
50
  id: 'fabric.elements.share.form.comment.placeholder',
46
- defaultMessage: 'Add a message',
51
+ defaultMessage: 'Anything they should know?',
47
52
  description: 'Placeholder for the comment field in Share form.'
48
53
  },
49
- userPickerGenericPlaceholder: {
50
- id: 'fabric.elements.share.form.user-picker.placeholder.generic',
51
- defaultMessage: 'Enter name, group, team or email',
52
- description: 'Generic placeholder for the user picker field in Share form.'
53
- },
54
- userPickerGenericExistingUserOnlyPlaceholder: {
55
- id: 'fabric.elements.share.form.user-picker.placholder.generic.existingUserOnly',
56
- defaultMessage: 'Enter name, group or team',
57
- description: 'Existing user only placeholder for the user picker field in Share form (emails are not an option).'
58
- },
59
- userPickerGenericPlaceholderJira: {
54
+ // Email disabled (Jira)
55
+ userPickerLabelEmailDisabledJira: {
56
+ id: 'fabric.elements.share.form.user-picker.label.email-disabled-jira',
57
+ defaultMessage: 'Names or teams',
58
+ description: 'Label for the user picker field in the Share form in Jira with no email option.'
59
+ },
60
+ userPickerPlaceholderEmailDisabledJira: {
61
+ id: 'fabric.elements.share.form.user-picker.placeholder.email-disabled-jira',
62
+ defaultMessage: 'e.g. Maria, Team Orange',
63
+ description: 'Placeholder for the user picker field in the Share form in Jira with no email option. These examples should be localized.'
64
+ },
65
+ userPickerRequiredMessageEmailDisabledJira: {
66
+ id: 'fabric.elements.share.form.user-picker.validation.required-message.email-disabled-jira',
67
+ defaultMessage: 'Select at least one person or team',
68
+ description: 'Error message for the user picker field in the Share form in Jira with no email option, when no entries are selected.'
69
+ },
70
+ // Email disabled (Confluence)
71
+ userPickerLabelEmailDisabledConfluence: {
72
+ id: 'fabric.elements.share.form.user-picker.label.email-disabled-confluence',
73
+ defaultMessage: 'Names, teams, or groups',
74
+ description: 'Label for the user picker field in the Share form in Confluence with no email option.'
75
+ },
76
+ userPickerRequiredMessageEmailDisabledConfluence: {
77
+ id: 'fabric.elements.share.form.user-picker.validation.required-message.email-disabled-confluence',
78
+ defaultMessage: 'Select at least one person, team, or group',
79
+ description: 'Error message for the user picker field in the Share form in Confluence with no email option, when no entries are selected.'
80
+ },
81
+ // Browse users disabled
82
+ userPickerLabelBrowseUsersDisabled: {
83
+ id: 'fabric.elements.share.form.user-picker.label.email-only',
84
+ defaultMessage: 'Emails',
85
+ description: 'Label for the user picker field in the Share form when browse user permissions are disabled.'
86
+ },
87
+ userPickerPlaceholderBrowseUsersDisabled: {
88
+ id: 'fabric.elements.share.form.user-picker.placeholder.email-only',
89
+ defaultMessage: 'e.g. maria@company.com',
90
+ description: 'Placeholder for the user picker field in the Share form when browse user permissions are disabled. These examples should be localized.'
91
+ },
92
+ userPickerRequiredMessageBrowseUsersDisabled: {
93
+ id: 'fabric.elements.share.form.user-picker.validation.required-message.email-only',
94
+ defaultMessage: 'Select at least one email',
95
+ description: 'Error message for the user picker field in the Share form in when browse user permissions are disabled, when no entries are selected.'
96
+ },
97
+ // Generic (Jira)
98
+ userPickerLabelJira: {
99
+ id: 'fabric.elements.share.form.user-picker.label.jira',
100
+ defaultMessage: 'Names, teams, or emails',
101
+ description: 'Label for the user picker field in the Share form in Jira.'
102
+ },
103
+ userPickerPlaceholderJira: {
60
104
  id: 'fabric.elements.share.form.user-picker.placeholder.jira',
61
- defaultMessage: 'Enter name, team or email',
62
- description: 'Generic placeholder for the user picker field in Share form. ' + 'This message is used only for Jira product because Jira does not have Group concept.'
63
- },
64
- userPickerExistingUserOnlyPlaceholder: {
65
- id: 'fabric.elements.share.form.user-picker.placeholder.existingUserOnly',
66
- defaultMessage: 'Enter name or team',
67
- description: 'Existing user only placeholder for the user picker field in Share form.'
68
- },
69
- userPickerGenericEmailOnlyPlaceholder: {
70
- id: 'fabric.elements.share.form.user-picker.placeholder.emailOnly',
71
- defaultMessage: 'Enter email',
72
- description: 'Email only placeholder for the user picker field in Share form.'
105
+ defaultMessage: 'e.g. Maria, Team Orange, maria@company.com',
106
+ description: 'Placeholder for the user picker field in the Share form in Jira. These examples should be localized.'
73
107
  },
108
+ userPickerRequiredMessageJira: {
109
+ id: 'fabric.elements.share.form.user-picker.validation.required-message.jira',
110
+ defaultMessage: 'Select at least one person, team, or email',
111
+ description: 'Error message for the user picker field in the Share form in Jira, when no entries are selected.'
112
+ },
113
+ // Generic (Confluence)
114
+ userPickerLabelConfluence: {
115
+ id: 'fabric.elements.share.form.user-picker.label.confluence',
116
+ defaultMessage: 'Names, teams, groups, or emails',
117
+ description: 'Label for the user picker field in the Share form in Confluence.'
118
+ },
119
+ userPickerPlaceholderConfluence: {
120
+ id: 'fabric.elements.share.form.user-picker.placeholder.confluence',
121
+ defaultMessage: 'e.g. Maria, Team Orange, group-one',
122
+ description: 'Placeholder for the user picker field in the Share form in Confluence. These examples should be localized.'
123
+ },
124
+ userPickerRequiredMessageConfluence: {
125
+ id: 'fabric.elements.share.form.user-picker.validation.required-message.confluence',
126
+ defaultMessage: 'Select at least one person, team, group, or email',
127
+ description: 'Error message for the user picker field in the Share form in Confluence, when no entries are selected.'
128
+ },
129
+ // Common messages
74
130
  userPickerAddMoreMessage: {
75
131
  id: 'fabric.elements.share.form.user-picker.add-more',
76
132
  defaultMessage: 'Enter more',
@@ -81,26 +137,6 @@ var messages = (0, _reactIntlNext.defineMessages)({
81
137
  defaultMessage: 'Select at least one user, group, team or email.',
82
138
  description: 'Required error message for the user picker field in Share form.'
83
139
  },
84
- userPickerRequiredMessageJira: {
85
- id: 'fabric.elements.share.form.user-picker.validation.required.jira',
86
- defaultMessage: 'Select at least one user, team or email.',
87
- description: 'Required error message for the user picker field in Share form. ' + 'This message is used only for Jira product because Jira does not have Group concept.'
88
- },
89
- userPickerRequiredMessageEmailOnly: {
90
- id: 'fabric.elements.share.form.user-picker.validation.required.email-only',
91
- defaultMessage: 'Select at least one email.',
92
- description: 'Required error message for the user picker field when email only enabled in Share form. ' + 'This message is used for both jira and confluence.'
93
- },
94
- userPickerRequiredExistingUserOnlyMessage: {
95
- id: 'fabric.elements.share.form.user-picker.validation.required.existingUserOnly',
96
- defaultMessage: 'Select at least one user, group or team.',
97
- description: 'Required error message for the user picker field in Share form when email is not allowed.'
98
- },
99
- userPickerRequiredExistingUserOnlyMessageJira: {
100
- id: 'fabric.elements.share.form.user-picker.validation.required.jira.existingUserOnly',
101
- defaultMessage: 'Select at least one user or team.',
102
- description: 'Required error message for the user picker field in Share form when email is not allowed. ' + 'This message is used only for Jira product because Jira does not have Group concept.'
103
- },
104
140
  userPickerExistingUserOnlyNoOptionsMessage: {
105
141
  id: 'fabric.elements.share.form.user-picker.no-options.existingUserOnly',
106
142
  defaultMessage: "We couldn\u2019t find any results for \"{inputValue}\".",
package/dist/cjs/version.json CHANGED
@@ -1,4 +1,4 @@
1
1
  {
2
2
  "name": "@atlaskit/share",
3
- "version": "4.3.1"
3
+ "version": "4.4.0"
4
4
  }
package/dist/es2019/components/CommentField.js CHANGED
@@ -10,7 +10,8 @@ export const CommentField = ({
10
10
  const intl = useIntl();
11
11
  return /*#__PURE__*/React.createElement(Field, {
12
12
  name: "comment",
13
- defaultValue: defaultValue
13
+ defaultValue: defaultValue,
14
+ label: intl.formatMessage(messages.commentLabel)
14
15
  }, ({
15
16
  fieldProps
16
17
  }) => /*#__PURE__*/React.createElement(TextArea, _extends({}, fieldProps, {
package/dist/es2019/components/ShareButton.js CHANGED
@@ -1,8 +1,11 @@
1
1
  import _extends from "@babel/runtime/helpers/extends";
2
2
  import React from 'react';
3
3
  import Button from '@atlaskit/button/custom-theme-button';
4
- export const ShareButton = /*#__PURE__*/React.forwardRef(function ShareButton({
4
+ export const ShareButton = /*#__PURE__*/React.forwardRef(
5
+ // Discard aria-haspopup
6
+ function ShareButton({
5
7
  text,
8
+ 'aria-haspopup': _ariaHasPopup,
6
9
  ...props
7
10
  }, ref) {
8
11
  return /*#__PURE__*/React.createElement(Button, _extends({
package/dist/es2019/components/UserPickerField.js CHANGED
@@ -10,6 +10,9 @@ import { MAX_PICKER_HEIGHT } from './styles';
10
10
  import { allowEmails, getMenuPortalTargetCurrentHTML } from './utils';
11
11
  export const REQUIRED = 'REQUIRED';
12
12
  const DEBOUNCE_MS = 150;
13
+ const USER_PICKER_FIELD_LABEL = 'share-user-picker-field-label';
14
+ const USER_PICKER_FIELD_PLACEHOLDER = 'share-user-picker-field-placeholder';
15
+ const USER_PICKER_ARIA_LABEL = `${USER_PICKER_FIELD_LABEL} ${USER_PICKER_FIELD_PLACEHOLDER}`;
13
16
  const validate = value => {
14
17
  return value && value instanceof Array && value.length > 0 ? undefined : REQUIRED;
15
18
  };
@@ -29,34 +32,55 @@ const getNoOptionsMessage = (isPublicLink, allowEmail) => ({
29
32
  const getPlaceHolderMessageDescriptor = (product = 'confluence', allowEmail, isBrowseUsersDisabled) => {
30
33
  if (!allowEmail) {
31
34
  const placeholderMessage = {
32
- jira: messages.userPickerExistingUserOnlyPlaceholder,
33
- confluence: messages.userPickerGenericExistingUserOnlyPlaceholder
35
+ jira: messages.userPickerPlaceholderEmailDisabledJira,
36
+ // We can use the same message as when emails are not disabled, since
37
+ // emails are not mentioned in this placeholder as it would be too long
38
+ confluence: messages.userPickerPlaceholderConfluence
34
39
  };
35
40
  return placeholderMessage[product];
36
41
  }
37
42
  if (isBrowseUsersDisabled) {
38
- return messages.userPickerGenericEmailOnlyPlaceholder;
43
+ return messages.userPickerPlaceholderBrowseUsersDisabled;
39
44
  }
40
45
  const placeholderMessage = {
41
- jira: messages.userPickerGenericPlaceholderJira,
42
- confluence: messages.userPickerGenericPlaceholder
46
+ jira: messages.userPickerPlaceholderJira,
47
+ confluence: messages.userPickerPlaceholderConfluence
43
48
  };
44
49
  return placeholderMessage[product];
45
50
  };
46
- const requiredMessagesWithEmail = {
47
- confluence: messages.userPickerRequiredMessage,
48
- jira: messages.userPickerRequiredMessageJira
49
- };
50
- const requiredMessagesWithoutEmail = {
51
- confluence: messages.userPickerRequiredExistingUserOnlyMessage,
52
- jira: messages.userPickerRequiredExistingUserOnlyMessageJira
51
+ const getLabelMessageDescriptor = (product = 'confluence', allowEmail, isBrowseUsersDisabled) => {
52
+ if (!allowEmail) {
53
+ const labelMessage = {
54
+ jira: messages.userPickerLabelEmailDisabledJira,
55
+ confluence: messages.userPickerLabelEmailDisabledConfluence
56
+ };
57
+ return labelMessage[product];
58
+ }
59
+ if (isBrowseUsersDisabled) {
60
+ return messages.userPickerLabelBrowseUsersDisabled;
61
+ }
62
+ const labelMessage = {
63
+ jira: messages.userPickerLabelJira,
64
+ confluence: messages.userPickerLabelConfluence
65
+ };
66
+ return labelMessage[product];
53
67
  };
54
- const getRequiredMessage = (product, allowEmail, isBrowseUsersDisabled) => {
68
+ const getRequiredMessage = (product = 'confluence', allowEmail, isBrowseUsersDisabled) => {
69
+ if (!allowEmail) {
70
+ const requiredMessage = {
71
+ jira: messages.userPickerRequiredMessageEmailDisabledJira,
72
+ confluence: messages.userPickerRequiredMessageEmailDisabledConfluence
73
+ };
74
+ return requiredMessage[product];
75
+ }
55
76
  if (isBrowseUsersDisabled) {
56
- return messages.userPickerRequiredMessageEmailOnly;
77
+ return messages.userPickerRequiredMessageBrowseUsersDisabled;
57
78
  }
58
- const emailMessages = allowEmail ? requiredMessagesWithEmail : requiredMessagesWithoutEmail;
59
- return emailMessages[product];
79
+ const requiredMessage = {
80
+ jira: messages.userPickerRequiredMessageJira,
81
+ confluence: messages.userPickerRequiredMessageConfluence
82
+ };
83
+ return requiredMessage[product];
60
84
  };
61
85
 
62
86
  // eslint-disable-next-line @repo/internal/react/no-class-components
@@ -130,7 +154,6 @@ export class UserPickerFieldComponent extends React.Component {
130
154
  loadOptions: this.loadOptions,
131
155
  isMulti: true,
132
156
  width: '100%',
133
- placeholder: /*#__PURE__*/React.createElement(FormattedMessage, getPlaceHolderMessageDescriptor(product, allowEmail, isBrowseUsersDisabled)),
134
157
  allowEmail,
135
158
  noOptionsMessage: getNoOptionsMessage(isPublicLink, allowEmail),
136
159
  isLoading,
@@ -141,10 +164,14 @@ export class UserPickerFieldComponent extends React.Component {
141
164
  const UserPickerComponent = enableSmartUserPicker && !isBrowseUsersDisabled ? SmartUserPicker : UserPicker;
142
165
  const menuPortalTarget = getMenuPortalTargetCurrentHTML(selectPortalRef);
143
166
  return /*#__PURE__*/React.createElement(Field, {
167
+ label: /*#__PURE__*/React.createElement("span", {
168
+ id: USER_PICKER_FIELD_LABEL
169
+ }, /*#__PURE__*/React.createElement(FormattedMessage, getLabelMessageDescriptor(product, allowEmail, isBrowseUsersDisabled))),
144
170
  name: "users",
145
171
  validate: validate,
146
172
  defaultValue: defaultValue,
147
- transform: this.handleUserPickerTransform
173
+ transform: this.handleUserPickerTransform,
174
+ isRequired: true
148
175
  }, ({
149
176
  fieldProps,
150
177
  error: fieldValidationError,
@@ -156,7 +183,12 @@ export class UserPickerFieldComponent extends React.Component {
156
183
  const addMoreMessage = shareError !== null && shareError !== void 0 && shareError.errorCode ? null : intl.formatMessage(messages.userPickerAddMoreMessage);
157
184
  const wasValidationOrShareError = !!fieldValidationError || !!shareError;
158
185
  return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(UserPickerComponent, _extends({}, fieldProps, commonPickerProps, smartUserPickerProps, {
186
+ "aria-labelledby": USER_PICKER_ARIA_LABEL,
187
+ "aria-required": true,
159
188
  addMoreMessage: addMoreMessage,
189
+ placeholder: /*#__PURE__*/React.createElement("span", {
190
+ id: USER_PICKER_FIELD_PLACEHOLDER
191
+ }, /*#__PURE__*/React.createElement(FormattedMessage, getPlaceHolderMessageDescriptor(product, allowEmail, isBrowseUsersDisabled))),
160
192
  menuPortalTarget: menuPortalTarget
161
193
  })), helperMessage && !wasValidationOrShareError && /*#__PURE__*/React.createElement(HelperMessage, null, helperMessage), !fieldValid && fieldValidationError === REQUIRED && /*#__PURE__*/React.createElement(ErrorMessage, null, /*#__PURE__*/React.createElement(FormattedMessage, requiredMessage)), shareError && shareError.errorCode && /*#__PURE__*/React.createElement(ErrorMessage, null, shareError.message, "\xA0", shareError.helpUrl && /*#__PURE__*/React.createElement("a", {
162
194
  target: "_blank",
package/dist/es2019/components/analytics/analytics.js CHANGED
@@ -1,7 +1,7 @@
1
1
  import { isEmail, isTeam, isUser } from '@atlaskit/smart-user-picker';
2
2
  const buildAttributes = (attributes = {}) => ({
3
3
  packageName: "@atlaskit/share",
4
- packageVersion: "4.3.1",
4
+ packageVersion: "4.4.0",
5
5
  ...attributes
6
6
  });
7
7
  const createEvent = (eventType, source, action, actionSubject, actionSubjectId, attributes = {}) => ({
package/dist/es2019/i18n/en.js CHANGED
@@ -12,7 +12,7 @@ export default {
12
12
  'fabric.elements.share.copypubliclink.button.text': 'Copy public link',
13
13
  'fabric.elements.share.failure.icon.label': 'Error icon',
14
14
  'fabric.elements.share.failure.message': 'Unable to share',
15
- 'fabric.elements.share.form.comment.placeholder': 'Add a message',
15
+ 'fabric.elements.share.form.comment.placeholder': 'Anything they should know?',
16
16
  'fabric.elements.share.form.info.message.no.invite.confluence': 'Recipients will see the name of the page and your message',
17
17
  'fabric.elements.share.form.info.message.no.invite.jira': 'Recipients will see the name of the issue and your message',
18
18
  'fabric.elements.share.form.no-permissions': 'You do not have the ability to share.',
package/dist/es2019/i18n.js CHANGED
@@ -35,36 +35,92 @@ export const messages = defineMessages({
35
35
  defaultMessage: 'You do not have the ability to share.',
36
36
  description: 'Copy to show when a user can not share.'
37
37
  },
38
+ commentLabel: {
39
+ id: 'fabric.elements.share.form.comment.label',
40
+ defaultMessage: 'Message (optional)',
41
+ description: 'Label for the comment field in the Share form.'
42
+ },
38
43
  commentPlaceholder: {
39
44
  id: 'fabric.elements.share.form.comment.placeholder',
40
- defaultMessage: 'Add a message',
45
+ defaultMessage: 'Anything they should know?',
41
46
  description: 'Placeholder for the comment field in Share form.'
42
47
  },
43
- userPickerGenericPlaceholder: {
44
- id: 'fabric.elements.share.form.user-picker.placeholder.generic',
45
- defaultMessage: 'Enter name, group, team or email',
46
- description: 'Generic placeholder for the user picker field in Share form.'
47
- },
48
- userPickerGenericExistingUserOnlyPlaceholder: {
49
- id: 'fabric.elements.share.form.user-picker.placholder.generic.existingUserOnly',
50
- defaultMessage: 'Enter name, group or team',
51
- description: 'Existing user only placeholder for the user picker field in Share form (emails are not an option).'
52
- },
53
- userPickerGenericPlaceholderJira: {
48
+ // Email disabled (Jira)
49
+ userPickerLabelEmailDisabledJira: {
50
+ id: 'fabric.elements.share.form.user-picker.label.email-disabled-jira',
51
+ defaultMessage: 'Names or teams',
52
+ description: 'Label for the user picker field in the Share form in Jira with no email option.'
53
+ },
54
+ userPickerPlaceholderEmailDisabledJira: {
55
+ id: 'fabric.elements.share.form.user-picker.placeholder.email-disabled-jira',
56
+ defaultMessage: 'e.g. Maria, Team Orange',
57
+ description: 'Placeholder for the user picker field in the Share form in Jira with no email option. These examples should be localized.'
58
+ },
59
+ userPickerRequiredMessageEmailDisabledJira: {
60
+ id: 'fabric.elements.share.form.user-picker.validation.required-message.email-disabled-jira',
61
+ defaultMessage: 'Select at least one person or team',
62
+ description: 'Error message for the user picker field in the Share form in Jira with no email option, when no entries are selected.'
63
+ },
64
+ // Email disabled (Confluence)
65
+ userPickerLabelEmailDisabledConfluence: {
66
+ id: 'fabric.elements.share.form.user-picker.label.email-disabled-confluence',
67
+ defaultMessage: 'Names, teams, or groups',
68
+ description: 'Label for the user picker field in the Share form in Confluence with no email option.'
69
+ },
70
+ userPickerRequiredMessageEmailDisabledConfluence: {
71
+ id: 'fabric.elements.share.form.user-picker.validation.required-message.email-disabled-confluence',
72
+ defaultMessage: 'Select at least one person, team, or group',
73
+ description: 'Error message for the user picker field in the Share form in Confluence with no email option, when no entries are selected.'
74
+ },
75
+ // Browse users disabled
76
+ userPickerLabelBrowseUsersDisabled: {
77
+ id: 'fabric.elements.share.form.user-picker.label.email-only',
78
+ defaultMessage: 'Emails',
79
+ description: 'Label for the user picker field in the Share form when browse user permissions are disabled.'
80
+ },
81
+ userPickerPlaceholderBrowseUsersDisabled: {
82
+ id: 'fabric.elements.share.form.user-picker.placeholder.email-only',
83
+ defaultMessage: 'e.g. maria@company.com',
84
+ description: 'Placeholder for the user picker field in the Share form when browse user permissions are disabled. These examples should be localized.'
85
+ },
86
+ userPickerRequiredMessageBrowseUsersDisabled: {
87
+ id: 'fabric.elements.share.form.user-picker.validation.required-message.email-only',
88
+ defaultMessage: 'Select at least one email',
89
+ description: 'Error message for the user picker field in the Share form in when browse user permissions are disabled, when no entries are selected.'
90
+ },
91
+ // Generic (Jira)
92
+ userPickerLabelJira: {
93
+ id: 'fabric.elements.share.form.user-picker.label.jira',
94
+ defaultMessage: 'Names, teams, or emails',
95
+ description: 'Label for the user picker field in the Share form in Jira.'
96
+ },
97
+ userPickerPlaceholderJira: {
54
98
  id: 'fabric.elements.share.form.user-picker.placeholder.jira',
55
- defaultMessage: 'Enter name, team or email',
56
- description: 'Generic placeholder for the user picker field in Share form. ' + 'This message is used only for Jira product because Jira does not have Group concept.'
57
- },
58
- userPickerExistingUserOnlyPlaceholder: {
59
- id: 'fabric.elements.share.form.user-picker.placeholder.existingUserOnly',
60
- defaultMessage: 'Enter name or team',
61
- description: 'Existing user only placeholder for the user picker field in Share form.'
62
- },
63
- userPickerGenericEmailOnlyPlaceholder: {
64
- id: 'fabric.elements.share.form.user-picker.placeholder.emailOnly',
65
- defaultMessage: 'Enter email',
66
- description: 'Email only placeholder for the user picker field in Share form.'
99
+ defaultMessage: 'e.g. Maria, Team Orange, maria@company.com',
100
+ description: 'Placeholder for the user picker field in the Share form in Jira. These examples should be localized.'
67
101
  },
102
+ userPickerRequiredMessageJira: {
103
+ id: 'fabric.elements.share.form.user-picker.validation.required-message.jira',
104
+ defaultMessage: 'Select at least one person, team, or email',
105
+ description: 'Error message for the user picker field in the Share form in Jira, when no entries are selected.'
106
+ },
107
+ // Generic (Confluence)
108
+ userPickerLabelConfluence: {
109
+ id: 'fabric.elements.share.form.user-picker.label.confluence',
110
+ defaultMessage: 'Names, teams, groups, or emails',
111
+ description: 'Label for the user picker field in the Share form in Confluence.'
112
+ },
113
+ userPickerPlaceholderConfluence: {
114
+ id: 'fabric.elements.share.form.user-picker.placeholder.confluence',
115
+ defaultMessage: 'e.g. Maria, Team Orange, group-one',
116
+ description: 'Placeholder for the user picker field in the Share form in Confluence. These examples should be localized.'
117
+ },
118
+ userPickerRequiredMessageConfluence: {
119
+ id: 'fabric.elements.share.form.user-picker.validation.required-message.confluence',
120
+ defaultMessage: 'Select at least one person, team, group, or email',
121
+ description: 'Error message for the user picker field in the Share form in Confluence, when no entries are selected.'
122
+ },
123
+ // Common messages
68
124
  userPickerAddMoreMessage: {
69
125
  id: 'fabric.elements.share.form.user-picker.add-more',
70
126
  defaultMessage: 'Enter more',
@@ -75,26 +131,6 @@ export const messages = defineMessages({
75
131
  defaultMessage: 'Select at least one user, group, team or email.',
76
132
  description: 'Required error message for the user picker field in Share form.'
77
133
  },
78
- userPickerRequiredMessageJira: {
79
- id: 'fabric.elements.share.form.user-picker.validation.required.jira',
80
- defaultMessage: 'Select at least one user, team or email.',
81
- description: 'Required error message for the user picker field in Share form. ' + 'This message is used only for Jira product because Jira does not have Group concept.'
82
- },
83
- userPickerRequiredMessageEmailOnly: {
84
- id: 'fabric.elements.share.form.user-picker.validation.required.email-only',
85
- defaultMessage: 'Select at least one email.',
86
- description: 'Required error message for the user picker field when email only enabled in Share form. ' + 'This message is used for both jira and confluence.'
87
- },
88
- userPickerRequiredExistingUserOnlyMessage: {
89
- id: 'fabric.elements.share.form.user-picker.validation.required.existingUserOnly',
90
- defaultMessage: 'Select at least one user, group or team.',
91
- description: 'Required error message for the user picker field in Share form when email is not allowed.'
92
- },
93
- userPickerRequiredExistingUserOnlyMessageJira: {
94
- id: 'fabric.elements.share.form.user-picker.validation.required.jira.existingUserOnly',
95
- defaultMessage: 'Select at least one user or team.',
96
- description: 'Required error message for the user picker field in Share form when email is not allowed. ' + 'This message is used only for Jira product because Jira does not have Group concept.'
97
- },
98
134
  userPickerExistingUserOnlyNoOptionsMessage: {
99
135
  id: 'fabric.elements.share.form.user-picker.no-options.existingUserOnly',
100
136
  defaultMessage: `We couldn’t find any results for "{inputValue}".`,
package/dist/es2019/version.json CHANGED
@@ -1,4 +1,4 @@
1
1
  {
2
2
  "name": "@atlaskit/share",
3
- "version": "4.3.1"
3
+ "version": "4.4.0"
4
4
  }
package/dist/esm/components/CommentField.js CHANGED
@@ -9,7 +9,8 @@ export var CommentField = function CommentField(_ref) {
9
9
  var intl = useIntl();
10
10
  return /*#__PURE__*/React.createElement(Field, {
11
11
  name: "comment",
12
- defaultValue: defaultValue
12
+ defaultValue: defaultValue,
13
+ label: intl.formatMessage(messages.commentLabel)
13
14
  }, function (_ref2) {
14
15
  var fieldProps = _ref2.fieldProps;
15
16
  return /*#__PURE__*/React.createElement(TextArea, _extends({}, fieldProps, {
package/dist/esm/components/ShareButton.js CHANGED
@@ -1,10 +1,13 @@
1
1
  import _extends from "@babel/runtime/helpers/extends";
2
2
  import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
3
- var _excluded = ["text"];
3
+ var _excluded = ["text", "aria-haspopup"];
4
4
  import React from 'react';
5
5
  import Button from '@atlaskit/button/custom-theme-button';
6
- export var ShareButton = /*#__PURE__*/React.forwardRef(function ShareButton(_ref, ref) {
6
+ export var ShareButton = /*#__PURE__*/React.forwardRef(
7
+ // Discard aria-haspopup
8
+ function ShareButton(_ref, ref) {
7
9
  var text = _ref.text,
10
+ _ariaHasPopup = _ref['aria-haspopup'],
8
11
  props = _objectWithoutProperties(_ref, _excluded);
9
12
  return /*#__PURE__*/React.createElement(Button, _extends({
10
13
  ref: ref,
package/dist/esm/components/UserPickerField.js CHANGED
@@ -18,6 +18,9 @@ import { MAX_PICKER_HEIGHT } from './styles';
18
18
  import { allowEmails, getMenuPortalTargetCurrentHTML } from './utils';
19
19
  export var REQUIRED = 'REQUIRED';
20
20
  var DEBOUNCE_MS = 150;
21
+ var USER_PICKER_FIELD_LABEL = 'share-user-picker-field-label';
22
+ var USER_PICKER_FIELD_PLACEHOLDER = 'share-user-picker-field-placeholder';
23
+ var USER_PICKER_ARIA_LABEL = "".concat(USER_PICKER_FIELD_LABEL, " ").concat(USER_PICKER_FIELD_PLACEHOLDER);
21
24
  var validate = function validate(value) {
22
25
  return value && value instanceof Array && value.length > 0 ? undefined : REQUIRED;
23
26
  };
@@ -43,34 +46,61 @@ var getPlaceHolderMessageDescriptor = function getPlaceHolderMessageDescriptor()
43
46
  var isBrowseUsersDisabled = arguments.length > 2 ? arguments[2] : undefined;
44
47
  if (!allowEmail) {
45
48
  var _placeholderMessage = {
46
- jira: messages.userPickerExistingUserOnlyPlaceholder,
47
- confluence: messages.userPickerGenericExistingUserOnlyPlaceholder
49
+ jira: messages.userPickerPlaceholderEmailDisabledJira,
50
+ // We can use the same message as when emails are not disabled, since
51
+ // emails are not mentioned in this placeholder as it would be too long
52
+ confluence: messages.userPickerPlaceholderConfluence
48
53
  };
49
54
  return _placeholderMessage[product];
50
55
  }
51
56
  if (isBrowseUsersDisabled) {
52
- return messages.userPickerGenericEmailOnlyPlaceholder;
57
+ return messages.userPickerPlaceholderBrowseUsersDisabled;
53
58
  }
54
59
  var placeholderMessage = {
55
- jira: messages.userPickerGenericPlaceholderJira,
56
- confluence: messages.userPickerGenericPlaceholder
60
+ jira: messages.userPickerPlaceholderJira,
61
+ confluence: messages.userPickerPlaceholderConfluence
57
62
  };
58
63
  return placeholderMessage[product];
59
64
  };
60
- var requiredMessagesWithEmail = {
61
- confluence: messages.userPickerRequiredMessage,
62
- jira: messages.userPickerRequiredMessageJira
63
- };
64
- var requiredMessagesWithoutEmail = {
65
- confluence: messages.userPickerRequiredExistingUserOnlyMessage,
66
- jira: messages.userPickerRequiredExistingUserOnlyMessageJira
65
+ var getLabelMessageDescriptor = function getLabelMessageDescriptor() {
66
+ var product = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 'confluence';
67
+ var allowEmail = arguments.length > 1 ? arguments[1] : undefined;
68
+ var isBrowseUsersDisabled = arguments.length > 2 ? arguments[2] : undefined;
69
+ if (!allowEmail) {
70
+ var _labelMessage = {
71
+ jira: messages.userPickerLabelEmailDisabledJira,
72
+ confluence: messages.userPickerLabelEmailDisabledConfluence
73
+ };
74
+ return _labelMessage[product];
75
+ }
76
+ if (isBrowseUsersDisabled) {
77
+ return messages.userPickerLabelBrowseUsersDisabled;
78
+ }
79
+ var labelMessage = {
80
+ jira: messages.userPickerLabelJira,
81
+ confluence: messages.userPickerLabelConfluence
82
+ };
83
+ return labelMessage[product];
67
84
  };
68
- var getRequiredMessage = function getRequiredMessage(product, allowEmail, isBrowseUsersDisabled) {
85
+ var getRequiredMessage = function getRequiredMessage() {
86
+ var product = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 'confluence';
87
+ var allowEmail = arguments.length > 1 ? arguments[1] : undefined;
88
+ var isBrowseUsersDisabled = arguments.length > 2 ? arguments[2] : undefined;
89
+ if (!allowEmail) {
90
+ var _requiredMessage = {
91
+ jira: messages.userPickerRequiredMessageEmailDisabledJira,
92
+ confluence: messages.userPickerRequiredMessageEmailDisabledConfluence
93
+ };
94
+ return _requiredMessage[product];
95
+ }
69
96
  if (isBrowseUsersDisabled) {
70
- return messages.userPickerRequiredMessageEmailOnly;
97
+ return messages.userPickerRequiredMessageBrowseUsersDisabled;
71
98
  }
72
- var emailMessages = allowEmail ? requiredMessagesWithEmail : requiredMessagesWithoutEmail;
73
- return emailMessages[product];
99
+ var requiredMessage = {
100
+ jira: messages.userPickerRequiredMessageJira,
101
+ confluence: messages.userPickerRequiredMessageConfluence
102
+ };
103
+ return requiredMessage[product];
74
104
  };
75
105
 
76
106
  // eslint-disable-next-line @repo/internal/react/no-class-components
@@ -149,7 +179,6 @@ export var UserPickerFieldComponent = /*#__PURE__*/function (_React$Component) {
149
179
  loadOptions: this.loadOptions,
150
180
  isMulti: true,
151
181
  width: '100%',
152
- placeholder: /*#__PURE__*/React.createElement(FormattedMessage, getPlaceHolderMessageDescriptor(product, allowEmail, isBrowseUsersDisabled)),
153
182
  allowEmail: allowEmail,
154
183
  noOptionsMessage: getNoOptionsMessage(isPublicLink, allowEmail),
155
184
  isLoading: isLoading,
@@ -160,10 +189,14 @@ export var UserPickerFieldComponent = /*#__PURE__*/function (_React$Component) {
160
189
  var UserPickerComponent = enableSmartUserPicker && !isBrowseUsersDisabled ? SmartUserPicker : UserPicker;
161
190
  var menuPortalTarget = getMenuPortalTargetCurrentHTML(selectPortalRef);
162
191
  return /*#__PURE__*/React.createElement(Field, {
192
+ label: /*#__PURE__*/React.createElement("span", {
193
+ id: USER_PICKER_FIELD_LABEL
194
+ }, /*#__PURE__*/React.createElement(FormattedMessage, getLabelMessageDescriptor(product, allowEmail, isBrowseUsersDisabled))),
163
195
  name: "users",
164
196
  validate: validate,
165
197
  defaultValue: defaultValue,
166
- transform: this.handleUserPickerTransform
198
+ transform: this.handleUserPickerTransform,
199
+ isRequired: true
167
200
  }, function (_ref2) {
168
201
  var fieldProps = _ref2.fieldProps,
169
202
  fieldValidationError = _ref2.error,
@@ -172,7 +205,12 @@ export var UserPickerFieldComponent = /*#__PURE__*/function (_React$Component) {
172
205
  var addMoreMessage = shareError !== null && shareError !== void 0 && shareError.errorCode ? null : intl.formatMessage(messages.userPickerAddMoreMessage);
173
206
  var wasValidationOrShareError = !!fieldValidationError || !!shareError;
174
207
  return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(UserPickerComponent, _extends({}, fieldProps, commonPickerProps, smartUserPickerProps, {
208
+ "aria-labelledby": USER_PICKER_ARIA_LABEL,
209
+ "aria-required": true,
175
210
  addMoreMessage: addMoreMessage,
211
+ placeholder: /*#__PURE__*/React.createElement("span", {
212
+ id: USER_PICKER_FIELD_PLACEHOLDER
213
+ }, /*#__PURE__*/React.createElement(FormattedMessage, getPlaceHolderMessageDescriptor(product, allowEmail, isBrowseUsersDisabled))),
176
214
  menuPortalTarget: menuPortalTarget
177
215
  })), helperMessage && !wasValidationOrShareError && /*#__PURE__*/React.createElement(HelperMessage, null, helperMessage), !fieldValid && fieldValidationError === REQUIRED && /*#__PURE__*/React.createElement(ErrorMessage, null, /*#__PURE__*/React.createElement(FormattedMessage, requiredMessage)), shareError && shareError.errorCode && /*#__PURE__*/React.createElement(ErrorMessage, null, shareError.message, "\xA0", shareError.helpUrl && /*#__PURE__*/React.createElement("a", {
178
216
  target: "_blank",
package/dist/esm/components/analytics/analytics.js CHANGED
@@ -6,7 +6,7 @@ var buildAttributes = function buildAttributes() {
6
6
  var attributes = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
7
7
  return _objectSpread({
8
8
  packageName: "@atlaskit/share",
9
- packageVersion: "4.3.1"
9
+ packageVersion: "4.4.0"
10
10
  }, attributes);
11
11
  };
12
12
  var createEvent = function createEvent(eventType, source, action, actionSubject, actionSubjectId) {
package/dist/esm/i18n/en.js CHANGED
@@ -12,7 +12,7 @@ export default {
12
12
  'fabric.elements.share.copypubliclink.button.text': 'Copy public link',
13
13
  'fabric.elements.share.failure.icon.label': 'Error icon',
14
14
  'fabric.elements.share.failure.message': 'Unable to share',
15
- 'fabric.elements.share.form.comment.placeholder': 'Add a message',
15
+ 'fabric.elements.share.form.comment.placeholder': 'Anything they should know?',
16
16
  'fabric.elements.share.form.info.message.no.invite.confluence': 'Recipients will see the name of the page and your message',
17
17
  'fabric.elements.share.form.info.message.no.invite.jira': 'Recipients will see the name of the issue and your message',
18
18
  'fabric.elements.share.form.no-permissions': 'You do not have the ability to share.',
package/dist/esm/i18n.js CHANGED
@@ -35,36 +35,92 @@ export var messages = defineMessages({
35
35
  defaultMessage: 'You do not have the ability to share.',
36
36
  description: 'Copy to show when a user can not share.'
37
37
  },
38
+ commentLabel: {
39
+ id: 'fabric.elements.share.form.comment.label',
40
+ defaultMessage: 'Message (optional)',
41
+ description: 'Label for the comment field in the Share form.'
42
+ },
38
43
  commentPlaceholder: {
39
44
  id: 'fabric.elements.share.form.comment.placeholder',
40
- defaultMessage: 'Add a message',
45
+ defaultMessage: 'Anything they should know?',
41
46
  description: 'Placeholder for the comment field in Share form.'
42
47
  },
43
- userPickerGenericPlaceholder: {
44
- id: 'fabric.elements.share.form.user-picker.placeholder.generic',
45
- defaultMessage: 'Enter name, group, team or email',
46
- description: 'Generic placeholder for the user picker field in Share form.'
47
- },
48
- userPickerGenericExistingUserOnlyPlaceholder: {
49
- id: 'fabric.elements.share.form.user-picker.placholder.generic.existingUserOnly',
50
- defaultMessage: 'Enter name, group or team',
51
- description: 'Existing user only placeholder for the user picker field in Share form (emails are not an option).'
52
- },
53
- userPickerGenericPlaceholderJira: {
48
+ // Email disabled (Jira)
49
+ userPickerLabelEmailDisabledJira: {
50
+ id: 'fabric.elements.share.form.user-picker.label.email-disabled-jira',
51
+ defaultMessage: 'Names or teams',
52
+ description: 'Label for the user picker field in the Share form in Jira with no email option.'
53
+ },
54
+ userPickerPlaceholderEmailDisabledJira: {
55
+ id: 'fabric.elements.share.form.user-picker.placeholder.email-disabled-jira',
56
+ defaultMessage: 'e.g. Maria, Team Orange',
57
+ description: 'Placeholder for the user picker field in the Share form in Jira with no email option. These examples should be localized.'
58
+ },
59
+ userPickerRequiredMessageEmailDisabledJira: {
60
+ id: 'fabric.elements.share.form.user-picker.validation.required-message.email-disabled-jira',
61
+ defaultMessage: 'Select at least one person or team',
62
+ description: 'Error message for the user picker field in the Share form in Jira with no email option, when no entries are selected.'
63
+ },
64
+ // Email disabled (Confluence)
65
+ userPickerLabelEmailDisabledConfluence: {
66
+ id: 'fabric.elements.share.form.user-picker.label.email-disabled-confluence',
67
+ defaultMessage: 'Names, teams, or groups',
68
+ description: 'Label for the user picker field in the Share form in Confluence with no email option.'
69
+ },
70
+ userPickerRequiredMessageEmailDisabledConfluence: {
71
+ id: 'fabric.elements.share.form.user-picker.validation.required-message.email-disabled-confluence',
72
+ defaultMessage: 'Select at least one person, team, or group',
73
+ description: 'Error message for the user picker field in the Share form in Confluence with no email option, when no entries are selected.'
74
+ },
75
+ // Browse users disabled
76
+ userPickerLabelBrowseUsersDisabled: {
77
+ id: 'fabric.elements.share.form.user-picker.label.email-only',
78
+ defaultMessage: 'Emails',
79
+ description: 'Label for the user picker field in the Share form when browse user permissions are disabled.'
80
+ },
81
+ userPickerPlaceholderBrowseUsersDisabled: {
82
+ id: 'fabric.elements.share.form.user-picker.placeholder.email-only',
83
+ defaultMessage: 'e.g. maria@company.com',
84
+ description: 'Placeholder for the user picker field in the Share form when browse user permissions are disabled. These examples should be localized.'
85
+ },
86
+ userPickerRequiredMessageBrowseUsersDisabled: {
87
+ id: 'fabric.elements.share.form.user-picker.validation.required-message.email-only',
88
+ defaultMessage: 'Select at least one email',
89
+ description: 'Error message for the user picker field in the Share form in when browse user permissions are disabled, when no entries are selected.'
90
+ },
91
+ // Generic (Jira)
92
+ userPickerLabelJira: {
93
+ id: 'fabric.elements.share.form.user-picker.label.jira',
94
+ defaultMessage: 'Names, teams, or emails',
95
+ description: 'Label for the user picker field in the Share form in Jira.'
96
+ },
97
+ userPickerPlaceholderJira: {
54
98
  id: 'fabric.elements.share.form.user-picker.placeholder.jira',
55
- defaultMessage: 'Enter name, team or email',
56
- description: 'Generic placeholder for the user picker field in Share form. ' + 'This message is used only for Jira product because Jira does not have Group concept.'
57
- },
58
- userPickerExistingUserOnlyPlaceholder: {
59
- id: 'fabric.elements.share.form.user-picker.placeholder.existingUserOnly',
60
- defaultMessage: 'Enter name or team',
61
- description: 'Existing user only placeholder for the user picker field in Share form.'
62
- },
63
- userPickerGenericEmailOnlyPlaceholder: {
64
- id: 'fabric.elements.share.form.user-picker.placeholder.emailOnly',
65
- defaultMessage: 'Enter email',
66
- description: 'Email only placeholder for the user picker field in Share form.'
99
+ defaultMessage: 'e.g. Maria, Team Orange, maria@company.com',
100
+ description: 'Placeholder for the user picker field in the Share form in Jira. These examples should be localized.'
67
101
  },
102
+ userPickerRequiredMessageJira: {
103
+ id: 'fabric.elements.share.form.user-picker.validation.required-message.jira',
104
+ defaultMessage: 'Select at least one person, team, or email',
105
+ description: 'Error message for the user picker field in the Share form in Jira, when no entries are selected.'
106
+ },
107
+ // Generic (Confluence)
108
+ userPickerLabelConfluence: {
109
+ id: 'fabric.elements.share.form.user-picker.label.confluence',
110
+ defaultMessage: 'Names, teams, groups, or emails',
111
+ description: 'Label for the user picker field in the Share form in Confluence.'
112
+ },
113
+ userPickerPlaceholderConfluence: {
114
+ id: 'fabric.elements.share.form.user-picker.placeholder.confluence',
115
+ defaultMessage: 'e.g. Maria, Team Orange, group-one',
116
+ description: 'Placeholder for the user picker field in the Share form in Confluence. These examples should be localized.'
117
+ },
118
+ userPickerRequiredMessageConfluence: {
119
+ id: 'fabric.elements.share.form.user-picker.validation.required-message.confluence',
120
+ defaultMessage: 'Select at least one person, team, group, or email',
121
+ description: 'Error message for the user picker field in the Share form in Confluence, when no entries are selected.'
122
+ },
123
+ // Common messages
68
124
  userPickerAddMoreMessage: {
69
125
  id: 'fabric.elements.share.form.user-picker.add-more',
70
126
  defaultMessage: 'Enter more',
@@ -75,26 +131,6 @@ export var messages = defineMessages({
75
131
  defaultMessage: 'Select at least one user, group, team or email.',
76
132
  description: 'Required error message for the user picker field in Share form.'
77
133
  },
78
- userPickerRequiredMessageJira: {
79
- id: 'fabric.elements.share.form.user-picker.validation.required.jira',
80
- defaultMessage: 'Select at least one user, team or email.',
81
- description: 'Required error message for the user picker field in Share form. ' + 'This message is used only for Jira product because Jira does not have Group concept.'
82
- },
83
- userPickerRequiredMessageEmailOnly: {
84
- id: 'fabric.elements.share.form.user-picker.validation.required.email-only',
85
- defaultMessage: 'Select at least one email.',
86
- description: 'Required error message for the user picker field when email only enabled in Share form. ' + 'This message is used for both jira and confluence.'
87
- },
88
- userPickerRequiredExistingUserOnlyMessage: {
89
- id: 'fabric.elements.share.form.user-picker.validation.required.existingUserOnly',
90
- defaultMessage: 'Select at least one user, group or team.',
91
- description: 'Required error message for the user picker field in Share form when email is not allowed.'
92
- },
93
- userPickerRequiredExistingUserOnlyMessageJira: {
94
- id: 'fabric.elements.share.form.user-picker.validation.required.jira.existingUserOnly',
95
- defaultMessage: 'Select at least one user or team.',
96
- description: 'Required error message for the user picker field in Share form when email is not allowed. ' + 'This message is used only for Jira product because Jira does not have Group concept.'
97
- },
98
134
  userPickerExistingUserOnlyNoOptionsMessage: {
99
135
  id: 'fabric.elements.share.form.user-picker.no-options.existingUserOnly',
100
136
  defaultMessage: "We couldn\u2019t find any results for \"{inputValue}\".",
package/dist/esm/version.json CHANGED
@@ -1,4 +1,4 @@
1
1
  {
2
2
  "name": "@atlaskit/share",
3
- "version": "4.3.1"
3
+ "version": "4.4.0"
4
4
  }
package/dist/types/components/ShareButton.d.ts CHANGED
@@ -8,6 +8,7 @@ export type Props = {
8
8
  isDisabled?: boolean;
9
9
  onClick: (e: React.MouseEvent<HTMLElement>) => void;
10
10
  text?: React.ReactNode;
11
+ 'aria-haspopup'?: boolean;
11
12
  };
12
13
  export declare const ShareButton: React.ForwardRefExoticComponent<Props & React.RefAttributes<HTMLElement>>;
13
14
  export default ShareButton;
package/dist/types/i18n.d.ts CHANGED
@@ -34,42 +34,62 @@ export declare const messages: {
34
34
  defaultMessage: string;
35
35
  description: string;
36
36
  };
37
+ commentLabel: {
38
+ id: string;
39
+ defaultMessage: string;
40
+ description: string;
41
+ };
37
42
  commentPlaceholder: {
38
43
  id: string;
39
44
  defaultMessage: string;
40
45
  description: string;
41
46
  };
42
- userPickerGenericPlaceholder: {
47
+ userPickerLabelEmailDisabledJira: {
43
48
  id: string;
44
49
  defaultMessage: string;
45
50
  description: string;
46
51
  };
47
- userPickerGenericExistingUserOnlyPlaceholder: {
52
+ userPickerPlaceholderEmailDisabledJira: {
48
53
  id: string;
49
54
  defaultMessage: string;
50
55
  description: string;
51
56
  };
52
- userPickerGenericPlaceholderJira: {
57
+ userPickerRequiredMessageEmailDisabledJira: {
53
58
  id: string;
54
59
  defaultMessage: string;
55
60
  description: string;
56
61
  };
57
- userPickerExistingUserOnlyPlaceholder: {
62
+ userPickerLabelEmailDisabledConfluence: {
58
63
  id: string;
59
64
  defaultMessage: string;
60
65
  description: string;
61
66
  };
62
- userPickerGenericEmailOnlyPlaceholder: {
67
+ userPickerRequiredMessageEmailDisabledConfluence: {
63
68
  id: string;
64
69
  defaultMessage: string;
65
70
  description: string;
66
71
  };
67
- userPickerAddMoreMessage: {
72
+ userPickerLabelBrowseUsersDisabled: {
68
73
  id: string;
69
74
  defaultMessage: string;
70
75
  description: string;
71
76
  };
72
- userPickerRequiredMessage: {
77
+ userPickerPlaceholderBrowseUsersDisabled: {
78
+ id: string;
79
+ defaultMessage: string;
80
+ description: string;
81
+ };
82
+ userPickerRequiredMessageBrowseUsersDisabled: {
83
+ id: string;
84
+ defaultMessage: string;
85
+ description: string;
86
+ };
87
+ userPickerLabelJira: {
88
+ id: string;
89
+ defaultMessage: string;
90
+ description: string;
91
+ };
92
+ userPickerPlaceholderJira: {
73
93
  id: string;
74
94
  defaultMessage: string;
75
95
  description: string;
@@ -79,17 +99,27 @@ export declare const messages: {
79
99
  defaultMessage: string;
80
100
  description: string;
81
101
  };
82
- userPickerRequiredMessageEmailOnly: {
102
+ userPickerLabelConfluence: {
103
+ id: string;
104
+ defaultMessage: string;
105
+ description: string;
106
+ };
107
+ userPickerPlaceholderConfluence: {
83
108
  id: string;
84
109
  defaultMessage: string;
85
110
  description: string;
86
111
  };
87
- userPickerRequiredExistingUserOnlyMessage: {
112
+ userPickerRequiredMessageConfluence: {
88
113
  id: string;
89
114
  defaultMessage: string;
90
115
  description: string;
91
116
  };
92
- userPickerRequiredExistingUserOnlyMessageJira: {
117
+ userPickerAddMoreMessage: {
118
+ id: string;
119
+ defaultMessage: string;
120
+ description: string;
121
+ };
122
+ userPickerRequiredMessage: {
93
123
  id: string;
94
124
  defaultMessage: string;
95
125
  description: string;
package/dist/types-ts4.5/components/ShareButton.d.ts CHANGED
@@ -8,6 +8,7 @@ export type Props = {
8
8
  isDisabled?: boolean;
9
9
  onClick: (e: React.MouseEvent<HTMLElement>) => void;
10
10
  text?: React.ReactNode;
11
+ 'aria-haspopup'?: boolean;
11
12
  };
12
13
  export declare const ShareButton: React.ForwardRefExoticComponent<Props & React.RefAttributes<HTMLElement>>;
13
14
  export default ShareButton;
package/dist/types-ts4.5/i18n.d.ts CHANGED
@@ -34,42 +34,62 @@ export declare const messages: {
34
34
  defaultMessage: string;
35
35
  description: string;
36
36
  };
37
+ commentLabel: {
38
+ id: string;
39
+ defaultMessage: string;
40
+ description: string;
41
+ };
37
42
  commentPlaceholder: {
38
43
  id: string;
39
44
  defaultMessage: string;
40
45
  description: string;
41
46
  };
42
- userPickerGenericPlaceholder: {
47
+ userPickerLabelEmailDisabledJira: {
43
48
  id: string;
44
49
  defaultMessage: string;
45
50
  description: string;
46
51
  };
47
- userPickerGenericExistingUserOnlyPlaceholder: {
52
+ userPickerPlaceholderEmailDisabledJira: {
48
53
  id: string;
49
54
  defaultMessage: string;
50
55
  description: string;
51
56
  };
52
- userPickerGenericPlaceholderJira: {
57
+ userPickerRequiredMessageEmailDisabledJira: {
53
58
  id: string;
54
59
  defaultMessage: string;
55
60
  description: string;
56
61
  };
57
- userPickerExistingUserOnlyPlaceholder: {
62
+ userPickerLabelEmailDisabledConfluence: {
58
63
  id: string;
59
64
  defaultMessage: string;
60
65
  description: string;
61
66
  };
62
- userPickerGenericEmailOnlyPlaceholder: {
67
+ userPickerRequiredMessageEmailDisabledConfluence: {
63
68
  id: string;
64
69
  defaultMessage: string;
65
70
  description: string;
66
71
  };
67
- userPickerAddMoreMessage: {
72
+ userPickerLabelBrowseUsersDisabled: {
68
73
  id: string;
69
74
  defaultMessage: string;
70
75
  description: string;
71
76
  };
72
- userPickerRequiredMessage: {
77
+ userPickerPlaceholderBrowseUsersDisabled: {
78
+ id: string;
79
+ defaultMessage: string;
80
+ description: string;
81
+ };
82
+ userPickerRequiredMessageBrowseUsersDisabled: {
83
+ id: string;
84
+ defaultMessage: string;
85
+ description: string;
86
+ };
87
+ userPickerLabelJira: {
88
+ id: string;
89
+ defaultMessage: string;
90
+ description: string;
91
+ };
92
+ userPickerPlaceholderJira: {
73
93
  id: string;
74
94
  defaultMessage: string;
75
95
  description: string;
@@ -79,17 +99,27 @@ export declare const messages: {
79
99
  defaultMessage: string;
80
100
  description: string;
81
101
  };
82
- userPickerRequiredMessageEmailOnly: {
102
+ userPickerLabelConfluence: {
103
+ id: string;
104
+ defaultMessage: string;
105
+ description: string;
106
+ };
107
+ userPickerPlaceholderConfluence: {
83
108
  id: string;
84
109
  defaultMessage: string;
85
110
  description: string;
86
111
  };
87
- userPickerRequiredExistingUserOnlyMessage: {
112
+ userPickerRequiredMessageConfluence: {
88
113
  id: string;
89
114
  defaultMessage: string;
90
115
  description: string;
91
116
  };
92
- userPickerRequiredExistingUserOnlyMessageJira: {
117
+ userPickerAddMoreMessage: {
118
+ id: string;
119
+ defaultMessage: string;
120
+ description: string;
121
+ };
122
+ userPickerRequiredMessage: {
93
123
  id: string;
94
124
  defaultMessage: string;
95
125
  description: string;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@atlaskit/share",
3
- "version": "4.3.1",
3
+ "version": "4.4.0",
4
4
  "description": "Fabric Share Element",
5
5
  "publishConfig": {
6
6
  "registry": "https://registry.npmjs.org/"
@@ -50,7 +50,7 @@
50
50
  "@atlaskit/tabs": "^13.4.0",
51
51
  "@atlaskit/textarea": "^4.7.0",
52
52
  "@atlaskit/theme": "^12.5.0",
53
- "@atlaskit/tokens": "^1.8.0",
53
+ "@atlaskit/tokens": "^1.9.0",
54
54
  "@atlaskit/tooltip": "^17.8.0",
55
55
  "@atlaskit/ufo": "^0.2.0",
56
56
  "@atlaskit/user-picker": "^10.4.0",