@atlaskit/user-picker 10.12.3 → 10.12.4

package/dist/esm/components/ExternalUserOption/SourcesTooltipContent.js

@@ -1,7 +1,6 @@
-/** @jsx jsx */
 import React from 'react';
 import { FormattedMessage } from 'react-intl-next';
-import { css, jsx } from '@emotion/react';
+import { css } from '@emotion/react';
 import { AtlassianIcon, ConfluenceIcon, JiraIcon } from '@atlaskit/logo';
 import Spinner from '@atlaskit/spinner/spinner';
 import { SlackIcon } from '../assets/slack';
@@ -21,37 +20,37 @@ export var sourceWrapper = css({
 });
 var SUPPORTED_SOURCES = [{
   sourceType: 'jira',
-  icon: jsx(JiraIcon, {
+  icon: /*#__PURE__*/React.createElement(JiraIcon, {
     size: 'xsmall'
   }),
   label: messages.jiraSource
 }, {
   sourceType: 'confluence',
-  icon: jsx(ConfluenceIcon, {
+  icon: /*#__PURE__*/React.createElement(ConfluenceIcon, {
     size: 'xsmall'
   }),
   label: messages.confluenceSource
 }, {
   sourceType: 'other-atlassian',
-  icon: jsx(AtlassianIcon, {
+  icon: /*#__PURE__*/React.createElement(AtlassianIcon, {
     size: 'xsmall'
   }),
   label: messages.otherAtlassianSource
 }, {
   sourceType: 'slack',
-  icon: jsx(SlackIcon, null),
+  icon: /*#__PURE__*/React.createElement(SlackIcon, null),
   label: messages.slackProvider
 }, {
   sourceType: 'google',
-  icon: jsx(GoogleIcon, null),
+  icon: /*#__PURE__*/React.createElement(GoogleIcon, null),
   label: messages.googleProvider
 }, {
   sourceType: 'microsoft',
-  icon: jsx(MicrosoftIcon, null),
+  icon: /*#__PURE__*/React.createElement(MicrosoftIcon, null),
   label: messages.microsoftProvider
 }, {
   sourceType: 'github',
-  icon: jsx(GitHubIcon, null),
+  icon: /*#__PURE__*/React.createElement(GitHubIcon, null),
   label: messages.gitHubProvider
 }];
 export var SourcesTooltipContent = function SourcesTooltipContent(_ref) {
@@ -62,20 +61,20 @@ export var SourcesTooltipContent = function SourcesTooltipContent(_ref) {
       return sources.includes(supportedSource.sourceType);
     });
   }, [sources]);
-  return jsx(React.Fragment, null, !sourcesLoading && sources.length === 0 ? jsx("span", null, jsx(FormattedMessage, messages.externalUserSourcesError)) : jsx(React.Fragment, null, jsx("span", null, jsx(FormattedMessage, messages.externalUserSourcesHeading)), jsx("div", {
+  return /*#__PURE__*/React.createElement(React.Fragment, null, !sourcesLoading && sources.length === 0 ? /*#__PURE__*/React.createElement("span", null, /*#__PURE__*/React.createElement(FormattedMessage, messages.externalUserSourcesError)) : /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("span", null, /*#__PURE__*/React.createElement(FormattedMessage, messages.externalUserSourcesHeading)), /*#__PURE__*/React.createElement("div", {
     css: sourcesTooltipContainer
-  }, sourcesLoading && jsx(Spinner, {
+  }, sourcesLoading && /*#__PURE__*/React.createElement(Spinner, {
     size: "small",
     appearance: "invert"
   }), !sourcesLoading && sourcesToRender.map(function (_ref2) {
     var sourceType = _ref2.sourceType,
       icon = _ref2.icon,
       label = _ref2.label;
-    return jsx("div", {
+    return /*#__PURE__*/React.createElement("div", {
       css: sourceWrapper,
       key: sourceType
-    }, jsx("span", {
+    }, /*#__PURE__*/React.createElement("span", {
       css: imageContainer
-    }, icon), jsx("span", null, jsx(FormattedMessage, label)));
+    }, icon), /*#__PURE__*/React.createElement("span", null, /*#__PURE__*/React.createElement(FormattedMessage, label)));
   }))));
 };

package/dist/esm/components/ExternalUserOption/main.js

@@ -8,9 +8,8 @@ import _getPrototypeOf from "@babel/runtime/helpers/getPrototypeOf";
 import _defineProperty from "@babel/runtime/helpers/defineProperty";
 function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
 function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
-/** @jsx jsx */
 import React from 'react';
-import { css, jsx } from '@emotion/react';
+import { css } from '@emotion/react';
 import { B400, N200, N800 } from '@atlaskit/theme/colors';
 import Tooltip from '@atlaskit/tooltip';
 import { withAnalyticsEvents } from '@atlaskit/analytics-next';
@@ -44,7 +43,7 @@ var ExternalUserOptionImpl = /*#__PURE__*/function (_React$PureComponent) {
     _this = _super.call.apply(_super, [this].concat(_args));
     _defineProperty(_assertThisInitialized(_this), "getPrimaryText", function () {
       var name = _this.props.user.name;
-      return jsx("span", {
+      return /*#__PURE__*/React.createElement("span", {
         key: "name",
         css: textWrapper(_this.props.isSelected ? "var(--ds-text-selected, ".concat(B400, ")") : "var(--ds-text, ".concat(N800, ")"))
       }, name);
@@ -59,9 +58,9 @@ var ExternalUserOptionImpl = /*#__PURE__*/function (_React$PureComponent) {
         emailUser = _email$split2[0],
         emailDomain = _email$split2[1];
       var emailDomainWithAt = "@".concat(emailDomain);
-      return jsx("span", {
+      return /*#__PURE__*/React.createElement("span", {
         css: textWrapper(_this.props.isSelected ? "var(--ds-text-selected, ".concat(B400, ")") : "var(--ds-text-subtlest, ".concat(N200, ")"))
-      }, emailUser, jsx("span", {
+      }, emailUser, /*#__PURE__*/React.createElement("span", {
         css: emailDomainWrapper
       }, emailDomainWithAt));
     });
@@ -71,7 +70,7 @@ var ExternalUserOptionImpl = /*#__PURE__*/function (_React$PureComponent) {
         avatarUrl = _this$props$user.avatarUrl,
         name = _this$props$user.name,
         status = _this$props.status;
-      return jsx(SizeableAvatar, {
+      return /*#__PURE__*/React.createElement(SizeableAvatar, {
         appearance: "big",
         src: avatarUrl,
         presence: status,
@@ -92,18 +91,18 @@ var ExternalUserOptionImpl = /*#__PURE__*/function (_React$PureComponent) {
       _this.fireEvent(userInfoEvent, user.sources, user.id);
     });
     _defineProperty(_assertThisInitialized(_this), "getSourcesInfoTooltip", function () {
-      return _this.props.user.isExternal ? jsx(Tooltip, {
+      return _this.props.user.isExternal ? /*#__PURE__*/React.createElement(Tooltip, {
         content: _this.formattedTooltipContent(),
         position: 'right-start',
         onShow: _this.onShow
-      }, jsx(InfoIcon, null)) : undefined;
+      }, /*#__PURE__*/React.createElement(InfoIcon, null)) : undefined;
     });
     return _this;
   }
   _createClass(ExternalUserOptionImpl, [{
     key: "render",
     value: function render() {
-      return jsx(ExternalAvatarItemOption, {
+      return /*#__PURE__*/React.createElement(ExternalAvatarItemOption, {
         avatar: this.renderAvatar(),
         isDisabled: this.props.user.isDisabled,
         primaryText: this.getPrimaryText(),
@@ -118,12 +117,12 @@ var ExternalUserOptionImpl = /*#__PURE__*/function (_React$PureComponent) {
         id = _this$props$user2.id,
         requiresSourceHydration = _this$props$user2.requiresSourceHydration,
         sources = _this$props$user2.sources;
-      return jsx(ExternalUserSourcesContainer, {
+      return /*#__PURE__*/React.createElement(ExternalUserSourcesContainer, {
         accountId: id,
         shouldFetchSources: Boolean(requiresSourceHydration),
         initialSources: sources
       }, function (sourceData) {
-        return jsx(SourcesTooltipContent, sourceData);
+        return /*#__PURE__*/React.createElement(SourcesTooltipContent, sourceData);
       });
     }
   }]);

package/dist/esm/components/GroupOption/main.js

@@ -7,10 +7,9 @@ import _getPrototypeOf from "@babel/runtime/helpers/getPrototypeOf";
 import _defineProperty from "@babel/runtime/helpers/defineProperty";
 function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
 function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
-/** @jsx jsx */
 import React from 'react';
 import { FormattedMessage } from 'react-intl-next';
-import { css, jsx } from '@emotion/react';
+import { css } from '@emotion/react';
 import { N20, B400, N800, N200 } from '@atlaskit/theme/colors';
 import PeopleIcon from '@atlaskit/icon/glyph/people';
 import { AvatarItemOption, textWrapper } from '../AvatarItemOption';
@@ -40,27 +39,27 @@ export var GroupOption = /*#__PURE__*/function (_React$PureComponent) {
         _this$props$group = _this$props.group,
         name = _this$props$group.name,
         highlight = _this$props$group.highlight;
-      return [jsx("span", {
+      return [/*#__PURE__*/React.createElement("span", {
         key: "name",
         css: textWrapper(isSelected ? "var(--ds-text-selected, ".concat(B400, ")") : "var(--ds-text, ".concat(N800, ")"))
-      }, jsx(HighlightText, {
+      }, /*#__PURE__*/React.createElement(HighlightText, {
         highlights: highlight && highlight.name
       }, name))];
     });
     _defineProperty(_assertThisInitialized(_this), "renderAvatar", function () {
-      return jsx("span", {
+      return /*#__PURE__*/React.createElement("span", {
         css: groupOptionIconWrapper
-      }, jsx(PeopleIcon, {
+      }, /*#__PURE__*/React.createElement(PeopleIcon, {
         label: "group-icon",
         size: "medium"
       }));
     });
     _defineProperty(_assertThisInitialized(_this), "renderByline", function () {
       var isSelected = _this.props.isSelected;
-      return jsx("span", {
+      return /*#__PURE__*/React.createElement("span", {
         css: textWrapper(isSelected ? "var(--ds-text-selected, ".concat(B400, ")") : "var(--ds-text-subtlest, ".concat(N200, ")")),
         "data-testid": "user-picker-group-secondary-text"
-      }, jsx(FormattedMessage, messages.groupByline));
+      }, /*#__PURE__*/React.createElement(FormattedMessage, messages.groupByline));
     });
     _defineProperty(_assertThisInitialized(_this), "getLozengeProps", function () {
       return typeof _this.props.group.lozenge === 'string' ? {
@@ -72,7 +71,7 @@ export var GroupOption = /*#__PURE__*/function (_React$PureComponent) {
   _createClass(GroupOption, [{
     key: "render",
     value: function render() {
-      return jsx(AvatarItemOption, {
+      return /*#__PURE__*/React.createElement(AvatarItemOption, {
         avatar: this.renderAvatar(),
         isDisabled: this.props.group.isDisabled,
         lozenge: this.getLozengeProps(),

package/dist/esm/components/Menu.js

@@ -5,10 +5,9 @@ import _possibleConstructorReturn from "@babel/runtime/helpers/possibleConstruct
 import _getPrototypeOf from "@babel/runtime/helpers/getPrototypeOf";
 function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
 function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
-/** @jsx jsx */
 import React from 'react';
 import { components } from '@atlaskit/select';
-import { css, jsx } from '@emotion/react';
+import { css } from '@emotion/react';
 var getFooterStyle = function getFooterStyle() {
   return css({
     padding: "var(--ds-space-100, 8px)".concat(" ", "var(--ds-space-200, 16px)")
@@ -24,7 +23,7 @@ export var Menu = /*#__PURE__*/function (_React$Component) {
   _createClass(Menu, [{
     key: "render",
     value: function render() {
-      return jsx(components.Menu, this.props, this.props.selectProps.header, this.props.children, this.props.selectProps.footer && jsx("div", {
+      return /*#__PURE__*/React.createElement(components.Menu, this.props, this.props.selectProps.header, this.props.children, this.props.selectProps.footer && /*#__PURE__*/React.createElement("div", {
         css: getFooterStyle()
       }, this.props.selectProps.footer));
     }

package/dist/esm/components/MultiValue.js

@@ -10,11 +10,10 @@ import _defineProperty from "@babel/runtime/helpers/defineProperty";
 var _excluded = ["children", "innerProps"];
 function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
 function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
-/** @jsx jsx */
 import React from 'react';
 import { FormattedMessage } from 'react-intl-next';
 import { components } from '@atlaskit/select';
-import { css, jsx } from '@emotion/react';
+import { css } from '@emotion/react';
 import { AddOptionAvatar } from './AddOptionAvatar';
 import { SizeableAvatar } from './SizeableAvatar';
 import { messages } from './i18n';
@@ -53,25 +52,25 @@ export var MultiValue = /*#__PURE__*/function (_React$Component) {
         label = _this$props$data.label,
         selectProps = _this$props.selectProps;
       if (isEmail(data)) {
-        return selectProps.emailLabel ? jsx(AddOptionAvatar, {
+        return selectProps.emailLabel ? /*#__PURE__*/React.createElement(AddOptionAvatar, {
           isLozenge: true,
           label: selectProps.emailLabel
-        }) : jsx(FormattedMessage, messages.addEmail, function (label) {
-          return jsx(AddOptionAvatar, {
+        }) : /*#__PURE__*/React.createElement(FormattedMessage, messages.addEmail, function (label) {
+          return /*#__PURE__*/React.createElement(AddOptionAvatar, {
             isLozenge: true,
             label: label
           });
         });
       }
       if (isGroup(data)) {
-        return jsx("div", {
+        return /*#__PURE__*/React.createElement("div", {
           css: groupTagContainer
-        }, jsx(PeopleIcon, {
+        }, /*#__PURE__*/React.createElement(PeopleIcon, {
           label: "group-icon",
           size: "small"
         }));
       }
-      return jsx(SizeableAvatar, {
+      return /*#__PURE__*/React.createElement(SizeableAvatar, {
         appearance: "multi",
         src: getAvatarUrl(data),
         name: label
@@ -114,12 +113,12 @@ export var MultiValue = /*#__PURE__*/function (_React$Component) {
         children = _this$props3.children,
         innerProps = _this$props3.innerProps,
         rest = _objectWithoutProperties(_this$props3, _excluded);
-      return jsx(components.MultiValue, _extends({}, rest, {
+      return /*#__PURE__*/React.createElement(components.MultiValue, _extends({}, rest, {
         innerProps: {
           ref: this.containerRef
         },
         cropWithEllipsis: false
-      }), this.getElemBefore(), " ", jsx("div", {
+      }), this.getElemBefore(), " ", /*#__PURE__*/React.createElement("div", {
         css: nameWrapper
       }, children));
     }

package/dist/esm/components/PopupControl.js

@@ -5,12 +5,11 @@ import _possibleConstructorReturn from "@babel/runtime/helpers/possibleConstruct
 import _getPrototypeOf from "@babel/runtime/helpers/getPrototypeOf";
 function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
 function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
-/** @jsx jsx */
 import React from 'react';
 import { themed } from '@atlaskit/theme/components';
 import { gridSize } from '@atlaskit/theme/constants';
 import { components } from '@atlaskit/select';
-import { css, jsx } from '@emotion/react';
+import { css } from '@emotion/react';
 import { N200, DN90 } from '@atlaskit/theme/colors';
 var spacing = gridSize();
 var fontSize = 12;
@@ -50,11 +49,11 @@ export var PopupControl = /*#__PURE__*/function (_React$PureComponent) {
     key: "render",
     value: function render() {
       var popupTitle = this.props.selectProps.popupTitle;
-      return jsx("div", {
+      return /*#__PURE__*/React.createElement("div", {
         css: controlWrapper
-      }, jsx("div", {
+      }, /*#__PURE__*/React.createElement("div", {
         css: getLabelStyle()
-      }, popupTitle), jsx(components.Control, this.props));
+      }, popupTitle), /*#__PURE__*/React.createElement(components.Control, this.props));
     }
   }]);
   return PopupControl;

package/dist/esm/components/SingleValue.js

@@ -1,9 +1,8 @@
 import _extends from "@babel/runtime/helpers/extends";
 import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
 var _excluded = ["ref"];
-/** @jsx jsx */
 import { AvatarItem } from '@atlaskit/avatar';
-import { css, jsx } from '@emotion/react';
+import { css } from '@emotion/react';
 import { components } from '@atlaskit/select';
 import { SizeableAvatar } from './SizeableAvatar';
 import { getAvatarUrl } from './utils';
@@ -29,9 +28,9 @@ export var SingleValue = function SingleValue(props) {
     _props$selectProps = props.selectProps,
     appearance = _props$selectProps.appearance,
     isFocused = _props$selectProps.isFocused;
-  return !isFocused ? jsx(components.SingleValue, props, jsx(AvatarItem, {
+  return !isFocused ? /*#__PURE__*/React.createElement(components.SingleValue, props, /*#__PURE__*/React.createElement(AvatarItem, {
     backgroundColor: "transparent",
-    avatar: jsx(SizeableAvatar, {
+    avatar: /*#__PURE__*/React.createElement(SizeableAvatar, {
       src: getAvatarUrl(data),
       appearance: appearance,
       name: label
@@ -40,7 +39,7 @@ export var SingleValue = function SingleValue(props) {
   }, function (_ref) {
     var ref = _ref.ref,
       props = _objectWithoutProperties(_ref, _excluded);
-    return jsx("div", _extends({
+    return /*#__PURE__*/React.createElement("div", _extends({
       css: avatarItemComponent
     }, props));
   })) : null;

package/dist/esm/components/SingleValueContainer.js

@@ -9,9 +9,8 @@ import _defineProperty from "@babel/runtime/helpers/defineProperty";
 var _excluded = ["children"];
 function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
 function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
-/** @jsx jsx */
 import React from 'react';
-import { css, jsx } from '@emotion/react';
+import { css } from '@emotion/react';
 import { components } from '@atlaskit/select';
 import { SizeableAvatar } from './SizeableAvatar';
 import { BORDER_PADDING } from './styles';
@@ -42,7 +41,7 @@ export var SingleValueContainer = /*#__PURE__*/function (_React$Component) {
         inputValue = _this$props$selectPro.inputValue,
         value = _this$props$selectPro.value;
       if (isFocused || !hasValue) {
-        return jsx(SizeableAvatar, {
+        return /*#__PURE__*/React.createElement(SizeableAvatar, {
           appearance: appearance,
           src: showUserAvatar(inputValue, value) ? value.data.avatarUrl : undefined
         });
@@ -57,7 +56,7 @@ export var SingleValueContainer = /*#__PURE__*/function (_React$Component) {
       var _this$props2 = this.props,
         children = _this$props2.children,
         valueContainerProps = _objectWithoutProperties(_this$props2, _excluded);
-      return jsx(components.ValueContainer, valueContainerProps, jsx("div", {
+      return /*#__PURE__*/React.createElement(components.ValueContainer, valueContainerProps, /*#__PURE__*/React.createElement("div", {
         css: placeholderIconContainer
       }, this.renderAvatar()), children);
     }

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

@@ -8,9 +8,7 @@ import _getPrototypeOf from "@babel/runtime/helpers/getPrototypeOf";
 import _defineProperty from "@babel/runtime/helpers/defineProperty";
 function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
 function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
-/** @jsx jsx */
 import { B400, N800, N200 } from '@atlaskit/theme/colors';
-import { jsx } from '@emotion/react';
 import React from 'react';
 import { FormattedMessage } from 'react-intl-next';
 import { AvatarItemOption, textWrapper } from '../AvatarItemOption';
@@ -31,10 +29,10 @@ export var TeamOption = /*#__PURE__*/function (_React$PureComponent) {
       var _this$props$team = _this.props.team,
         name = _this$props$team.name,
         highlight = _this$props$team.highlight;
-      return [jsx("span", {
+      return [/*#__PURE__*/React.createElement("span", {
         key: "name",
         css: textWrapper(_this.props.isSelected ? "var(--ds-text-selected, ".concat(B400, ")") : "var(--ds-text, ".concat(N800, ")"))
-      }, jsx(HighlightText, {
+      }, /*#__PURE__*/React.createElement(HighlightText, {
         highlights: highlight && highlight.name
       }, name))];
     });
@@ -51,9 +49,9 @@ export var TeamOption = /*#__PURE__*/function (_React$PureComponent) {
       } else {
         if (includesYou === true) {
           if (memberCount > 50) {
-            return _this.getBylineComponent(isSelected, jsx(FormattedMessage, messages.plus50MembersWithYou));
+            return _this.getBylineComponent(isSelected, /*#__PURE__*/React.createElement(FormattedMessage, messages.plus50MembersWithYou));
           } else {
-            return _this.getBylineComponent(isSelected, jsx(FormattedMessage, _extends({}, messages.memberCountWithYou, {
+            return _this.getBylineComponent(isSelected, /*#__PURE__*/React.createElement(FormattedMessage, _extends({}, messages.memberCountWithYou, {
               values: {
                 count: memberCount
               }
@@ -61,9 +59,9 @@ export var TeamOption = /*#__PURE__*/function (_React$PureComponent) {
           }
         } else {
           if (memberCount > 50) {
-            return _this.getBylineComponent(isSelected, jsx(FormattedMessage, messages.plus50MembersWithoutYou));
+            return _this.getBylineComponent(isSelected, /*#__PURE__*/React.createElement(FormattedMessage, messages.plus50MembersWithoutYou));
           } else {
-            return _this.getBylineComponent(isSelected, jsx(FormattedMessage, _extends({}, messages.memberCountWithoutYou, {
+            return _this.getBylineComponent(isSelected, /*#__PURE__*/React.createElement(FormattedMessage, _extends({}, messages.memberCountWithoutYou, {
               values: {
                 count: memberCount
               }
@@ -73,7 +71,7 @@ export var TeamOption = /*#__PURE__*/function (_React$PureComponent) {
       }
     });
     _defineProperty(_assertThisInitialized(_this), "getBylineComponent", function (isSelected, message) {
-      return jsx("span", {
+      return /*#__PURE__*/React.createElement("span", {
         css: textWrapper(isSelected ? "var(--ds-text-selected, ".concat(B400, ")") : "var(--ds-text-subtlest, ".concat(N200, ")")),
         "data-testid": "user-picker-team-secondary-text"
       }, message);
@@ -82,7 +80,7 @@ export var TeamOption = /*#__PURE__*/function (_React$PureComponent) {
       var _this$props$team3 = _this.props.team,
         avatarUrl = _this$props$team3.avatarUrl,
         name = _this$props$team3.name;
-      return jsx(SizeableAvatar, {
+      return /*#__PURE__*/React.createElement(SizeableAvatar, {
         appearance: "big",
         src: avatarUrl,
         name: name
@@ -98,7 +96,7 @@ export var TeamOption = /*#__PURE__*/function (_React$PureComponent) {
       if (!((_this$props$team4 = _this.props.team) !== null && _this$props$team4 !== void 0 && _this$props$team4.byline)) {
         return undefined;
       }
-      return jsx("span", {
+      return /*#__PURE__*/React.createElement("span", {
         css: textWrapper(_this.props.isSelected ? "var(--ds-text-selected, ".concat(B400, ")") : "var(--ds-text-subtlest, ".concat(N200, ")"))
       }, _this.props.team.byline);
     });
@@ -107,7 +105,7 @@ export var TeamOption = /*#__PURE__*/function (_React$PureComponent) {
   _createClass(TeamOption, [{
     key: "render",
     value: function render() {
-      return jsx(AvatarItemOption, {
+      return /*#__PURE__*/React.createElement(AvatarItemOption, {
         avatar: this.renderAvatar(),
         isDisabled: this.props.team.isDisabled,
         lozenge: this.getLozengeProps(),

package/dist/esm/components/UserOption.js

@@ -7,9 +7,7 @@ import _getPrototypeOf from "@babel/runtime/helpers/getPrototypeOf";
 import _defineProperty from "@babel/runtime/helpers/defineProperty";
 function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
 function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
-/** @jsx jsx */
 import { B400, N800, N200 } from '@atlaskit/theme/colors';
-import { jsx } from '@emotion/react';
 import React from 'react';
 import { AvatarItemOption, textWrapper } from './AvatarItemOption';
 import { HighlightText } from './HighlightText';
@@ -30,25 +28,25 @@ export var UserOption = /*#__PURE__*/function (_React$PureComponent) {
         name = _this$props$user.name,
         publicName = _this$props$user.publicName,
         highlight = _this$props$user.highlight;
-      var result = [jsx("span", {
+      var result = [/*#__PURE__*/React.createElement("span", {
         key: "name",
         css: textWrapper(_this.props.isSelected ? "var(--ds-text-selected, ".concat(B400, ")") : "var(--ds-text, ".concat(N800, ")"))
-      }, jsx(HighlightText, {
+      }, /*#__PURE__*/React.createElement(HighlightText, {
         highlights: highlight && highlight.name
       }, name))];
       if (hasValue(publicName) && name.trim() !== publicName.trim()) {
-        result.push(jsx(React.Fragment, {
+        result.push( /*#__PURE__*/React.createElement(React.Fragment, {
           key: "publicName"
-        }, ' ', jsx("span", {
+        }, ' ', /*#__PURE__*/React.createElement("span", {
           css: textWrapper(_this.props.isSelected ? "var(--ds-text-selected, ".concat(B400, ")") : "var(--ds-text-subtlest, ".concat(N200, ")"))
-        }, "(", jsx(HighlightText, {
+        }, "(", /*#__PURE__*/React.createElement(HighlightText, {
           highlights: highlight && highlight.publicName
         }, publicName), ")")));
       }
       return result;
     });
     _defineProperty(_assertThisInitialized(_this), "renderSecondaryText", function () {
-      return _this.props.user.byline ? jsx("span", {
+      return _this.props.user.byline ? /*#__PURE__*/React.createElement("span", {
         css: textWrapper(_this.props.isSelected ? "var(--ds-text-selected, ".concat(B400, ")") : "var(--ds-text-subtlest, ".concat(N200, ")"))
       }, _this.props.user.byline) : undefined;
     });
@@ -58,7 +56,7 @@ export var UserOption = /*#__PURE__*/function (_React$PureComponent) {
         avatarUrl = _this$props$user2.avatarUrl,
         name = _this$props$user2.name,
         status = _this$props.status;
-      return jsx(SizeableAvatar, {
+      return /*#__PURE__*/React.createElement(SizeableAvatar, {
         appearance: "big",
         src: avatarUrl,
         presence: status,
@@ -75,7 +73,7 @@ export var UserOption = /*#__PURE__*/function (_React$PureComponent) {
   _createClass(UserOption, [{
     key: "render",
     value: function render() {
-      return jsx(AvatarItemOption, {
+      return /*#__PURE__*/React.createElement(AvatarItemOption, {
         avatar: this.renderAvatar(),
         lozenge: this.getLozengeProps(),
         isDisabled: this.props.user.isDisabled,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@atlaskit/user-picker",
-  "version": "10.12.3",
+  "version": "10.12.4",
   "description": "Fabric component for display a dropdown to select a user from",
   "publishConfig": {
     "registry": "https://registry.npmjs.org/"
@@ -38,13 +38,13 @@
     "@atlaskit/avatar": "^21.4.0",
     "@atlaskit/icon": "^22.0.0",
     "@atlaskit/logo": "^13.14.0",
-    "@atlaskit/lozenge": "^11.4.0",
+    "@atlaskit/lozenge": "^11.5.0",
     "@atlaskit/platform-feature-flags": "^0.2.0",
     "@atlaskit/popper": "^5.5.0",
     "@atlaskit/select": "^17.0.0",
     "@atlaskit/spinner": "^16.0.0",
     "@atlaskit/theme": "^12.6.0",
-    "@atlaskit/tokens": "^1.28.0",
+    "@atlaskit/tokens": "^1.29.0",
     "@atlaskit/tooltip": "^18.0.0",
     "@atlaskit/ufo": "^0.2.0",
     "@babel/runtime": "^7.0.0",