@atlaskit/user-picker 10.0.0 → 10.0.2

package/dist/es2019/components/SingleValueContainer.js

@@ -1,5 +1,4 @@
 import _defineProperty from "@babel/runtime/helpers/defineProperty";
-
 /** @jsx jsx */
 import React from 'react';
 import { css, jsx } from '@emotion/react';
@@ -11,13 +10,10 @@ const placeholderIconContainer = css({
   lineHeight: 0,
   gridArea: '1/1/2/2'
 });
-
 const showUserAvatar = (inputValue, value) => value && value.data && inputValue === value.label;
-
 export class SingleValueContainer extends React.Component {
   constructor(...args) {
     super(...args);
-
     _defineProperty(this, "renderAvatar", () => {
       const {
         hasValue,
@@ -28,18 +24,15 @@ export class SingleValueContainer extends React.Component {
           value
         }
       } = this.props;
-
       if (isFocused || !hasValue) {
         return jsx(SizeableAvatar, {
           appearance: appearance,
           src: showUserAvatar(inputValue, value) ? value.data.avatarUrl : undefined
         });
       }
-
       return null;
     });
   }
-
   render() {
     const {
       children,
@@ -49,5 +42,4 @@ export class SingleValueContainer extends React.Component {
       css: placeholderIconContainer
     }, this.renderAvatar()), children);
   }
-
 }

package/dist/es2019/components/SizeableAvatar.js

@@ -17,5 +17,4 @@ export class SizeableAvatar extends React.PureComponent {
       presence: presence
     });
   }
-
 }

package/dist/es2019/components/TeamOption/index.js

@@ -1,7 +1,5 @@
 import React from 'react';
-const AsyncTeamOption = /*#__PURE__*/React.lazy(() => import(
-/* webpackChunkName: "@atlaskit-internal_@atlassian/user-picker/team-option" */
-'./main').then(module => {
+const AsyncTeamOption = /*#__PURE__*/React.lazy(() => import( /* webpackChunkName: "@atlaskit-internal_@atlassian/user-picker/team-option" */'./main').then(module => {
   return {
     default: module.TeamOption
   };

package/dist/es2019/components/TeamOption/main.js

@@ -1,6 +1,5 @@
 import _extends from "@babel/runtime/helpers/extends";
 import _defineProperty from "@babel/runtime/helpers/defineProperty";
-
 /** @jsx jsx */
 import { B400, N800, N200 } from '@atlaskit/theme/colors';
 import { jsx } from '@emotion/react';
@@ -13,7 +12,6 @@ import { SizeableAvatar } from '../SizeableAvatar';
 export class TeamOption extends React.PureComponent {
   constructor(...args) {
     super(...args);
-
     _defineProperty(this, "getPrimaryText", () => {
       const {
         team: {
@@ -28,7 +26,6 @@ export class TeamOption extends React.PureComponent {
         highlights: highlight && highlight.name
       }, name))];
     });
-
     _defineProperty(this, "renderByline", () => {
       const {
         isSelected,
@@ -36,8 +33,9 @@ export class TeamOption extends React.PureComponent {
           memberCount,
           includesYou
         }
-      } = this.props; // if Member count is missing, do not show the byline, regardless of the availability of includesYou
+      } = this.props;
 
+      // if Member count is missing, do not show the byline, regardless of the availability of includesYou
       if (memberCount === null || typeof memberCount === 'undefined') {
         return undefined;
       } else {
@@ -64,11 +62,9 @@ export class TeamOption extends React.PureComponent {
         }
       }
     });
-
     _defineProperty(this, "getBylineComponent", (isSelected, message) => jsx("span", {
       css: textWrapper(isSelected ? `var(--ds-text-selected, ${B400})` : `var(--ds-text-subtlest, ${N200})`)
     }, message));
-
     _defineProperty(this, "renderAvatar", () => {
       const {
         team: {
@@ -82,24 +78,19 @@ export class TeamOption extends React.PureComponent {
         name: name
       });
     });
-
     _defineProperty(this, "getLozengeProps", () => typeof this.props.team.lozenge === 'string' ? {
       text: this.props.team.lozenge
     } : this.props.team.lozenge);
-
     _defineProperty(this, "renderCustomByLine", () => {
       var _this$props$team;
-
       if (!((_this$props$team = this.props.team) !== null && _this$props$team !== void 0 && _this$props$team.byline)) {
         return undefined;
       }
-
       return jsx("span", {
         css: textWrapper(this.props.isSelected ? `var(--ds-text-selected, ${B400})` : `var(--ds-text-subtlest, ${N200})`)
       }, this.props.team.byline);
     });
   }
-
   render() {
     return jsx(AvatarItemOption, {
       avatar: this.renderAvatar(),
@@ -109,5 +100,4 @@ export class TeamOption extends React.PureComponent {
       secondaryText: this.renderCustomByLine() || this.renderByline()
     });
   }
-
 }

package/dist/es2019/components/UserOption.js

@@ -1,5 +1,4 @@
 import _defineProperty from "@babel/runtime/helpers/defineProperty";
-
 /** @jsx jsx */
 import { B400, N800, N200 } from '@atlaskit/theme/colors';
 import { jsx } from '@emotion/react';
@@ -11,7 +10,6 @@ import { hasValue } from './utils';
 export class UserOption extends React.PureComponent {
   constructor(...args) {
     super(...args);
-
     _defineProperty(this, "getPrimaryText", () => {
       const {
         user: {
@@ -26,7 +24,6 @@ export class UserOption extends React.PureComponent {
       }, jsx(HighlightText, {
         highlights: highlight && highlight.name
       }, name))];
-
       if (hasValue(publicName) && name.trim() !== publicName.trim()) {
         result.push(jsx(React.Fragment, {
           key: "publicName"
@@ -36,14 +33,11 @@ export class UserOption extends React.PureComponent {
           highlights: highlight && highlight.publicName
         }, publicName), ")")));
       }
-
       return result;
     });
-
     _defineProperty(this, "renderSecondaryText", () => this.props.user.byline ? jsx("span", {
       css: textWrapper(this.props.isSelected ? `var(--ds-text-selected, ${B400})` : `var(--ds-text-subtlest, ${N200})`)
     }, this.props.user.byline) : undefined);
-
     _defineProperty(this, "renderAvatar", () => {
       const {
         user: {
@@ -59,12 +53,10 @@ export class UserOption extends React.PureComponent {
         name: name
       });
     });
-
     _defineProperty(this, "getLozengeProps", () => typeof this.props.user.lozenge === 'string' ? {
       text: this.props.user.lozenge
     } : this.props.user.lozenge);
   }
-
   render() {
     return jsx(AvatarItemOption, {
       avatar: this.renderAvatar(),
@@ -74,5 +66,4 @@ export class UserOption extends React.PureComponent {
       secondaryText: this.renderSecondaryText()
     });
   }
-
 }

package/dist/es2019/components/UserPicker.js

@@ -20,15 +20,14 @@ export class UserPickerWithoutAnalytics extends React.Component {
     const experienceForId = experience.getInstance(this.ufoId);
     experienceForId.start();
   }
-
   componentDidMount() {
-    const experienceForId = experience.getInstance(this.ufoId); // Send UFO success if the experience is still in progress i.e. hasn't failed
+    const experienceForId = experience.getInstance(this.ufoId);
 
+    // Send UFO success if the experience is still in progress i.e. hasn't failed
     if ([UFOExperienceState.IN_PROGRESS.id, UFOExperienceState.STARTED.id].includes(experienceForId.state.id)) {
       experienceForId.success();
     }
   }
-
   render() {
     const {
       emailLabel,
@@ -54,10 +53,12 @@ export class UserPickerWithoutAnalytics extends React.Component {
       menuShouldBlockScroll,
       captureMenuScroll
     };
-    const pickerProps = allowEmail ? { ...defaultPickerProps,
+    const pickerProps = allowEmail ? {
+      ...defaultPickerProps,
       ...creatableProps,
       emailLabel
-    } : { ...defaultPickerProps
+    } : {
+      ...defaultPickerProps
     };
     return /*#__PURE__*/React.createElement(UfoErrorBoundary, {
       id: this.ufoId
@@ -71,12 +72,9 @@ export class UserPickerWithoutAnalytics extends React.Component {
       pickerProps: pickerProps
     })))));
   }
-
 }
-
 _defineProperty(UserPickerWithoutAnalytics, "defaultProps", {
   width: 350,
   isMulti: false
 });
-
 export const UserPicker = withAnalyticsEvents()(UserPickerWithoutAnalytics);

package/dist/es2019/components/batch.js

@@ -8,7 +8,6 @@ export function batchByKey(callback) {
       });
       calls[key] = [];
     }
-
     calls[key].push(args);
   };
 }

package/dist/es2019/components/components.js

@@ -8,10 +8,10 @@ import { Input } from './Input';
 import { SingleValueContainer } from './SingleValueContainer';
 import { PopupInput } from './PopupInput';
 import { PopupControl } from './PopupControl';
+
 /**
  * Memoize getComponents to avoid rerenders.
  */
-
 export const getComponents = memoizeOne((multi, anchor) => {
   if (anchor) {
     return {
@@ -39,12 +39,11 @@ export const getPopupComponents = memoizeOne(hasPopupTitle => {
     ValueContainer: SingleValueContainer,
     Input: PopupInput
   };
-
   if (hasPopupTitle) {
-    return { ...baseProps,
+    return {
+      ...baseProps,
       Control: PopupControl
     };
   }
-
   return baseProps;
 });

package/dist/es2019/components/creatable.js

@@ -3,9 +3,7 @@ import { EmailType } from '../types';
 import { isValidEmail as defaultIsValidEmail } from './emailValidation';
 import { isEmail } from './utils';
 const validOption = ['VALID', 'POTENTIAL'];
-
 const isValidNewOption = (isValidEmail = defaultIsValidEmail) => inputValue => inputValue && validOption.includes(isValidEmail(inputValue));
-
 const getNewOptionData = inputValue => ({
   label: inputValue,
   value: inputValue,
@@ -15,23 +13,18 @@ const getNewOptionData = inputValue => ({
     type: EmailType
   }
 });
-
 const formatCreateLabel = inputText => {
   if (inputText) {
     return inputText.trim();
   }
-
   return '';
 };
-
 const isOptionDisabled = (isValidEmail = defaultIsValidEmail) => option => {
   if (isEmail(option.data)) {
     return isValidEmail(option.data.id) !== 'VALID';
   }
-
   return !!option.isDisabled;
 };
-
 function creatableProps(isValidEmail) {
   return {
     allowCreateWhileLoading: true,
@@ -41,7 +34,7 @@ function creatableProps(isValidEmail) {
     formatCreateLabel,
     isOptionDisabled: isOptionDisabled(isValidEmail)
   };
-} // ignoring the 'clear' memoizeOne function object property
-
+}
 
+// ignoring the 'clear' memoizeOne function object property
 export const getCreatableProps = memoizeOne(creatableProps);

package/dist/es2019/components/creatableEmailSuggestion.js

@@ -3,15 +3,13 @@ import { EmailType } from '../types';
 import { isValidEmail as defaultIsValidEmail } from './emailValidation';
 import { isEmail } from './utils';
 const validOption = ['VALID', 'POTENTIAL'];
+const isValidNewOption = inputValue => inputValue && inputValue.length > 0;
 
-const isValidNewOption = inputValue => inputValue && inputValue.length > 0; // Generates suggested option data based on user input and validity of the input (if it is an email or not);
-
-
+// Generates suggested option data based on user input and validity of the input (if it is an email or not);
 const getNewOptionData = (isValidEmail = defaultIsValidEmail, emailDomain) => inputValue => {
   if (!inputValue) {
     return null;
   }
-
   const isEmail = inputValue && validOption.includes(isValidEmail(inputValue));
   const value = isEmail ? inputValue : `${inputValue.replace(/\s+/g, '.').toLocaleLowerCase()}@${emailDomain}`;
   return {
@@ -25,26 +23,23 @@ const getNewOptionData = (isValidEmail = defaultIsValidEmail, emailDomain) => in
     }
   };
 };
-
 const formatCreateLabel = inputText => {
   if (inputText) {
     return inputText.trim();
   }
-
   return '';
-}; // Option will not be selectable until the email value is valid and can actually be invited
-
+};
 
+// Option will not be selectable until the email value is valid and can actually be invited
 const isOptionDisabled = (isValidEmail = defaultIsValidEmail) => option => {
   if (isEmail(option.data)) {
     return isValidEmail(option.data.id) !== 'VALID';
   }
-
   return !!option.isDisabled;
-}; // Generates user picker props to always create an email item visible
-// to the user as a suggested option when they are typing in a value
-
+};
 
+// Generates user picker props to always create an email item visible
+// to the user as a suggested option when they are typing in a value
 export const getCreatableSuggestedEmailProps = memoizeOne((emailDomain, isValidEmail) => ({
   allowCreateWhileLoading: true,
   createOptionPosition: 'last',

package/dist/es2019/components/emailValidation.js

@@ -4,10 +4,8 @@ export const isValidEmail = inputText => {
   if (inputText.match(validRegex)) {
     return 'VALID';
   }
-
   if (inputText.match(potentialRegex)) {
     return 'POTENTIAL';
   }
-
   return 'INVALID';
 };

package/dist/es2019/components/styles.js

@@ -7,26 +7,28 @@ export const INDICATOR_WIDTH = 39;
 const TAG_MARGIN_WIDTH = 4;
 export const getStyles = memoizeOne((width, isMulti, isCompact, overrideStyles) => {
   let styles = {
-    menu: (css, state) => ({ ...css,
+    menu: (css, state) => ({
+      ...css,
       width,
       minWidth: state.selectProps.menuMinWidth
     }),
     control: (css, state) => {
       const isMulti = state.selectProps.isMulti;
-      return { ...css,
+      return {
+        ...css,
         width,
         borderColor: state.isFocused ? `var(--ds-border-focused, ${css.borderColor})` : state.selectProps.subtle || state.selectProps.noBorder ? 'transparent' : `var(--ds-border-input, ${N40})`,
         backgroundColor: state.isFocused ? `var(--ds-background-input, ${css['backgroundColor']})` : state.selectProps.subtle ? 'transparent' : state.selectProps.textFieldBackgroundColor ? `var(--ds-background-input, ${N10})` : `var(--ds-background-input, ${N20})`,
         '&:hover .fabric-user-picker__clear-indicator': {
           opacity: 1
         },
-        ':hover': { ...css[':hover'],
+        ':hover': {
+          ...css[':hover'],
           borderColor: state.isFocused ? css[':hover'] ? `var(--ds-border-focused, ${css[':hover'].borderColor})` : `var(--ds-border-focused, ${B100})` : state.selectProps.subtle ? 'transparent' : `var(--ds-border-input, ${N40})`,
           backgroundColor: state.selectProps.subtle && state.selectProps.hoveringClearIndicator ? `var(--ds-background-danger, ${R50})` : state.isFocused ? css[':hover'] ? `var(--ds-background-input, ${css[':hover'].backgroundColor})` : `var(--ds-background-input, ${N0})` : state.isDisabled ? `var(--ds-background-disabled, ${N10})` : `var(--ds-background-input-hovered, ${N30})`
         },
         padding: 0,
         minHeight: isCompact ? 'none' : 44,
-
         /* IE 11 needs to set height explicitly to be vertical align when being in not compact mode */
         height: isCompact || isMulti ? '100%' : 44,
         maxWidth: '100%'
@@ -38,7 +40,8 @@ export const getStyles = memoizeOne((width, isMulti, isCompact, overrideStyles)
       paddingLeft,
       paddingRight,
       ...css
-    }) => ({ ...css,
+    }) => ({
+      ...css,
       // By default show clear indicator, except for on devices where "hover" is supported.
       // This means mobile devices (which do not support hover) will be able to see the clear indicator.
       opacity: 1,
@@ -52,7 +55,8 @@ export const getStyles = memoizeOne((width, isMulti, isCompact, overrideStyles)
         color: `var(--ds-icon-danger, ${R400})`
       }
     }),
-    indicatorsContainer: css => ({ ...css,
+    indicatorsContainer: css => ({
+      ...css,
       paddingRight: 4
     }),
     valueContainer: ({
@@ -62,7 +66,8 @@ export const getStyles = memoizeOne((width, isMulti, isCompact, overrideStyles)
       ...css
     }, state) => {
       const isMulti = state.selectProps.isMulti;
-      return { ...css,
+      return {
+        ...css,
         gridTemplateColumns: 'auto 1fr',
         paddingTop: isCompact ? 0 : `${BORDER_PADDING}px`,
         paddingBottom: isCompact ? 0 : `${BORDER_PADDING}px`,
@@ -77,15 +82,18 @@ export const getStyles = memoizeOne((width, isMulti, isCompact, overrideStyles)
         }
       };
     },
-    multiValue: css => ({ ...css,
+    multiValue: css => ({
+      ...css,
       borderRadius: 24,
       cursor: 'default'
     }),
-    multiValueLabel: css => ({ ...css,
+    multiValueLabel: css => ({
+      ...css,
       fontSize: '100%',
       display: 'flex'
     }),
-    multiValueRemove: css => ({ ...css,
+    multiValueRemove: css => ({
+      ...css,
       borderRadius: 24,
       cursor: 'pointer'
     }),
@@ -96,11 +104,10 @@ export const getStyles = memoizeOne((width, isMulti, isCompact, overrideStyles)
       if (css.position === 'absolute' && !css.left) {
         css.left = `${BORDER_PADDING}px`;
       }
-
-      return { ...css,
+      return {
+        ...css,
         gridArea: '1/2/2/3',
         paddingLeft: state.selectProps.isMulti ? 0 : `${BORDER_PADDING}px`,
-
         /* Margin left right of 2px set by default */
         // margin: `0 ${BORDER_PADDING}px`,
         margin: 0,
@@ -109,16 +116,16 @@ export const getStyles = memoizeOne((width, isMulti, isCompact, overrideStyles)
         textOverflow: 'ellipsis'
       };
     },
-    option: css => ({ ...css,
+    option: css => ({
+      ...css,
       overflow: 'hidden'
     }),
-    input: (css, state) => ({ ...css,
+    input: (css, state) => ({
+      ...css,
       gridArea: '1/2/2/3',
       gridTemplateColumns: isMulti && state.placeholder ? '0 123px' : css.gridTemplateColumns,
-
       /* Necessary to make input height and tag height the same. */
       margin: `${TAG_MARGIN_WIDTH}px 0`,
-
       /* Padding top and bottom of 2 is set by default. */
       paddingTop: 0,
       paddingBottom: 0,
@@ -126,21 +133,22 @@ export const getStyles = memoizeOne((width, isMulti, isCompact, overrideStyles)
       '& input::placeholder': {
         /* Chrome, Firefox, Opera, Safari 10.1+ */
         color: `var(--ds-text-subtlest, ${N100})`,
-        opacity: 1
-        /* Firefox */
-
+        opacity: 1 /* Firefox */
       },
+
       '& input:-ms-input-placeholder': {
         /* Internet Explorer 10-11 */
         color: `var(--ds-text-subtlest, ${N100})`
       }
     }),
-    singleValue: css => ({ ...css,
+    singleValue: css => ({
+      ...css,
       margin: 0,
       gridArea: '1/2/2/3'
     })
   };
   return overrideStyles ? mergeStyles(styles, overrideStyles) : styles;
 });
-export const getPopupStyles = memoizeOne((width, flip, isMulti) => ({ ...getStyles(width, isMulti)
+export const getPopupStyles = memoizeOne((width, flip, isMulti) => ({
+  ...getStyles(width, isMulti)
 }));

package/dist/es2019/components/utils.js

@@ -8,9 +8,7 @@ export const isGroup = option => option.type === GroupType;
 export const isEmail = option => option.type === EmailType;
 export const isCustom = option => option.type === CustomType;
 export const isDefaultValuePopulated = value => value && !Array.isArray(value) || Array.isArray(value) && value.length > 0;
-
 const isOptionData = option => option.name !== undefined;
-
 export const optionToSelectableOption = option => {
   if (isOptionData(option)) {
     return {
@@ -21,7 +19,8 @@ export const optionToSelectableOption = option => {
     };
   } else {
     return {
-      data: { ...option,
+      data: {
+        ...option,
         name: option.id
       },
       isDisabled: option.isDisabled,
@@ -34,13 +33,11 @@ export const extractOptionValue = value => {
   if (!value) {
     return undefined;
   }
-
   if (Array.isArray(value)) {
     return value.map(({
       data: option
     }) => option);
   }
-
   return value.data;
 };
 export const isIterable = a => typeof a[Symbol.iterator] === 'function';
@@ -49,11 +46,9 @@ export const optionToSelectableOptions = memoizeOne(defaultValue => {
   if (!defaultValue) {
     return null;
   }
-
   if (Array.isArray(defaultValue)) {
     return defaultValue.map(optionToSelectableOption);
   }
-
   return optionToSelectableOption(defaultValue);
 });
 export const getAvatarSize = appearance => appearance === 'big' ? 'medium' : appearance === 'multi' ? 'xsmall' : 'small';
@@ -75,7 +70,6 @@ export const getAvatarUrl = optionData => {
   if (isUser(optionData) || isTeam(optionData) || isCustom(optionData)) {
     return optionData.avatarUrl;
   }
-
   return undefined;
 };
 export const isPopupUserPickerByComponent = SelectComponent => SelectComponent === PopupSelect;

package/dist/es2019/i18n/cs.js

@@ -26,6 +26,7 @@ export default {
   'fabric.elements.user-picker.slack.provider': 'Slack',
   'fabric.elements.user-picker.source.confluence': 'Confluence',
   'fabric.elements.user-picker.source.jira': 'Jira',
+  'fabric.elements.user-picker.source.other-atlassian': 'Ostatní produkty Atlassian',
   'fabric.elements.user-picker.team.member.50plus': 'Tým • 50 a více členů',
   'fabric.elements.user-picker.team.member.50plus.including.you': 'Tým • 50 a více členů včetně vás',
   'fabric.elements.user-picker.team.member.count': '{count, plural, one {Tým • {count} člen} few {Tým • {count} členové} many {Tým • {count} člena} other {Tým • {count} členů}}',

package/dist/es2019/i18n/da.js

@@ -26,6 +26,7 @@ export default {
   'fabric.elements.user-picker.slack.provider': 'Slack',
   'fabric.elements.user-picker.source.confluence': 'Confluence',
   'fabric.elements.user-picker.source.jira': 'Jira',
+  'fabric.elements.user-picker.source.other-atlassian': 'Andre Atlassian-produkter',
   'fabric.elements.user-picker.team.member.50plus': 'Team • Over 50 medlemmer',
   'fabric.elements.user-picker.team.member.50plus.including.you': 'Team • Over 50 medlemmer, inklusive dig',
   'fabric.elements.user-picker.team.member.count': '{count, plural, one {Team • {count} medlem} other {Team • {count} medlemmer}}',

package/dist/es2019/i18n/de.js

@@ -26,6 +26,7 @@ export default {
   'fabric.elements.user-picker.slack.provider': 'Slack',
   'fabric.elements.user-picker.source.confluence': 'Confluence',
   'fabric.elements.user-picker.source.jira': 'Jira',
+  'fabric.elements.user-picker.source.other-atlassian': 'Andere Atlassian-Produkte',
   'fabric.elements.user-picker.team.member.50plus': 'Team • über 50 Mitglieder',
   'fabric.elements.user-picker.team.member.50plus.including.you': 'Team • über 50 Mitglieder, einschließlich Ihnen',
   'fabric.elements.user-picker.team.member.count': '{count, plural, one {Team • {count} Mitglied} other {Team • {count} Mitglieder}}',

package/dist/es2019/i18n/en.js

@@ -1,7 +1,34 @@
-// English
+/**
+ * NOTE:
+ *
+ * This file is automatically generated by Traduki 2.0.
+ * DO NOT CHANGE IT BY HAND or your changes will be lost.
+ */
+//
 export default {
-  'fabric.elements.user-picker.placeholder': 'Find a person...',
-  'fabric.elements.user-picker.placeholder.add-more': 'add more people...',
+  'fabric.elements.user-picker.email.add': 'Add user',
+  'fabric.elements.user-picker.email.add.potential': 'Enter an email address',
+  'fabric.elements.user-picker.email.select.to.add': 'Select an email address',
+  'fabric.elements.user-picker.external.sourced.error': "We can't connect you right now.",
+  'fabric.elements.user-picker.external.sourced.from': 'Found in:',
+  'fabric.elements.user-picker.github.provider': 'GitHub',
+  'fabric.elements.user-picker.google.provider': 'Google',
+  'fabric.elements.user-picker.group.byline': 'Admin-managed group',
+  'fabric.elements.user-picker.guest.lozenge.text': 'GUEST',
+  'fabric.elements.user-picker.guest.lozenge.tooltip.group': 'Guest groups can only access certain spaces and have limited access to user info.',
+  'fabric.elements.user-picker.guest.lozenge.tooltip.user': 'Guests can only access certain spaces and have limited access to user info.',
+  'fabric.elements.user-picker.member.lozenge.text': 'MEMBER',
+  'fabric.elements.user-picker.microsoft.provider': 'Microsoft',
   'fabric.elements.user-picker.multi.remove-item': 'Remove',
-  'fabric.elements.user-picker.single.clear': 'Clear'
+  'fabric.elements.user-picker.placeholder': 'Enter people or teams...',
+  'fabric.elements.user-picker.placeholder.add-more': 'add more people...',
+  'fabric.elements.user-picker.single.clear': 'Clear',
+  'fabric.elements.user-picker.slack.provider': 'Slack',
+  'fabric.elements.user-picker.source.confluence': 'Confluence',
+  'fabric.elements.user-picker.source.jira': 'Jira',
+  'fabric.elements.user-picker.source.other-atlassian': 'Other Atlassian products',
+  'fabric.elements.user-picker.team.member.50plus': 'Team • 50+ members',
+  'fabric.elements.user-picker.team.member.50plus.including.you': 'Team • 50+ members, including you',
+  'fabric.elements.user-picker.team.member.count': 'Team • {count} {count, plural, one {member} other {members}}',
+  'fabric.elements.user-picker.team.member.count.including.you': 'Team • {count} {count, plural, one {member} other {members}}, including you'
 };