@atlaskit/user-picker 10.0.0 → 10.0.2

package/CHANGELOG.md

@@ -1,5 +1,17 @@
 # @atlaskit/user-picker
 
+## 10.0.2
+
+### Patch Changes
+
+- [`edc295b63a2`](https://bitbucket.org/atlassian/atlassian-frontend/commits/edc295b63a2) - [ux] Fixes bug where the user picker opens the menu on click, but doesn't reopen the menu on the second click.
+
+## 10.0.1
+
+### Patch Changes
+
+- Updated dependencies
+
 ## 10.0.0
 
 ### Major Changes

package/dist/cjs/analytics.js

@@ -1,32 +1,22 @@
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.userInfoEvent = exports.startSession = exports.selectEvent = exports.searchedEvent = exports.focusEvent = exports.failedEvent = exports.deleteEvent = exports.createAndFireEventInElementsChannel = exports.clearEvent = exports.cancelEvent = void 0;
-
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
-
 var _analyticsNext = require("@atlaskit/analytics-next");
-
 var _uuid = require("uuid");
-
 var _version = _interopRequireDefault(require("./version.json"));
-
 var _utils = require("./components/utils");
-
 function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
-
 function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { (0, _defineProperty2.default)(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
-
 var packageName = _version.default.name;
 var packageVersion = _version.default.version;
 var UUID_REGEXP_TEAMS_GROUPS = /^[a-fA-F0-9]{8}-[a-fA-F0-9]{4}-[a-fA-F0-9]{4}-[a-fA-F0-9]{4}-[a-fA-F0-9]{12}$/;
 var UUID_REGEXP_OLD_AAID = /^[a-fA-F0-9]{1,8}:[a-fA-F0-9]{8}-[a-fA-F0-9]{4}-[a-fA-F0-9]{4}-[a-fA-F0-9]{4}-[a-fA-F0-9]{12}$/;
 var UUID_REGEXP_NEW_AAID = /^[a-fA-F0-9]{24,24}$/;
-
 var startSession = function startSession() {
   return {
     id: (0, _uuid.v4)(),
@@ -37,11 +27,9 @@ var startSession = function startSession() {
     lastKey: undefined
   };
 };
-
 exports.startSession = startSession;
 var createAndFireEventInElementsChannel = (0, _analyticsNext.createAndFireEvent)('fabric-elements');
 exports.createAndFireEventInElementsChannel = createAndFireEventInElementsChannel;
-
 var createEvent = function createEvent(eventType, action, actionSubject) {
   var attributes = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : {};
   return {
@@ -54,20 +42,17 @@ var createEvent = function createEvent(eventType, action, actionSubject) {
     }, attributes)
   };
 };
-
 var checkValidId = function checkValidId(id) {
   return UUID_REGEXP_NEW_AAID.test(id) || UUID_REGEXP_OLD_AAID.test(id) || UUID_REGEXP_TEAMS_GROUPS.test(id);
 };
-
 var optionData2Analytics = function optionData2Analytics(option) {
   var id = option.id,
-      type = option.type; // id's of email types are emails which is PII
-
+    type = option.type;
+  // id's of email types are emails which is PII
   var validatedData = {
     id: checkValidId(id) ? id : null,
     type: type || null
   };
-
   if ((0, _utils.isExternalUser)(option)) {
     return _objectSpread(_objectSpread({}, validatedData), {}, {
       type: 'external_user',
@@ -75,16 +60,13 @@ var optionData2Analytics = function optionData2Analytics(option) {
       externalUserType: option.externalUserType
     });
   }
-
   if ((0, _utils.isCustom)(option) && option.analyticsType) {
     return _objectSpread(_objectSpread({}, validatedData), {}, {
       type: option.analyticsType
     });
   }
-
   return validatedData;
 };
-
 var buildValueForAnalytics = function buildValueForAnalytics(value) {
   if (value) {
     var valueToConvert = Array.isArray(value) ? value : [value];
@@ -93,10 +75,8 @@ var buildValueForAnalytics = function buildValueForAnalytics(value) {
       return optionData2Analytics(data);
     });
   }
-
   return [];
 };
-
 var createDefaultPickerAttributes = function createDefaultPickerAttributes(props, session, journeyId) {
   return {
     context: props.fieldId,
@@ -105,24 +85,19 @@ var createDefaultPickerAttributes = function createDefaultPickerAttributes(props
     journeyId: journeyId
   };
 };
-
 var focusEvent = function focusEvent(props, state, session, journeyId) {
   return createEvent('ui', 'focused', 'userPicker', _objectSpread(_objectSpread({}, createDefaultPickerAttributes(props, session, journeyId)), {}, {
     values: buildValueForAnalytics(state.value)
   }));
 };
-
 exports.focusEvent = focusEvent;
-
 var clearEvent = function clearEvent(props, state, session, journeyId) {
   return createEvent('ui', 'cleared', 'userPicker', _objectSpread(_objectSpread({}, createDefaultPickerAttributes(props, session, journeyId)), {}, {
     pickerOpen: state.menuIsOpen,
     values: values(state)
   }));
 };
-
 exports.clearEvent = clearEvent;
-
 var deleteEvent = function deleteEvent(props, state, session, journeyId) {
   return createEvent('ui', 'deleted', 'userPickerItem', {
     context: props.fieldId,
@@ -132,9 +107,7 @@ var deleteEvent = function deleteEvent(props, state, session, journeyId) {
     pickerOpen: state.menuIsOpen
   });
 };
-
 exports.deleteEvent = deleteEvent;
-
 var cancelEvent = function cancelEvent(props, _, session, journeyId) {
   return createEvent('ui', 'cancelled', 'userPicker', _objectSpread(_objectSpread({}, createDefaultPickerAttributes(props, session, journeyId)), {}, {
     sessionDuration: sessionDuration(session),
@@ -144,9 +117,7 @@ var cancelEvent = function cancelEvent(props, _, session, journeyId) {
     downKeyCount: downKeyCount(session)
   }));
 };
-
 exports.cancelEvent = cancelEvent;
-
 var selectEvent = function selectEvent(props, state, session, journeyId) {
   return createEvent('ui', selectEventType(session), 'userPicker', _objectSpread(_objectSpread({}, createDefaultPickerAttributes(props, session, journeyId)), {}, {
     sessionDuration: sessionDuration(session),
@@ -159,9 +130,7 @@ var selectEvent = function selectEvent(props, state, session, journeyId) {
     numberOfResults: numberOfResults(state)
   }));
 };
-
 exports.selectEvent = selectEvent;
-
 var searchedEvent = function searchedEvent(props, state, session, journeyId) {
   var searchResults = results(state);
   return createEvent('operational', 'searched', 'userPicker', _objectSpread(_objectSpread({}, createDefaultPickerAttributes(props, session, journeyId)), {}, {
@@ -173,15 +142,11 @@ var searchedEvent = function searchedEvent(props, state, session, journeyId) {
     numberOfResults: searchResults.length
   }));
 };
-
 exports.searchedEvent = searchedEvent;
-
 var failedEvent = function failedEvent(props, _, session, journeyId) {
   return createEvent('operational', 'failed', 'userPicker', _objectSpread({}, createDefaultPickerAttributes(props, session, journeyId)));
 };
-
 exports.failedEvent = failedEvent;
-
 var userInfoEvent = function userInfoEvent(sources, accountId) {
   return createEvent('ui', 'displayed', 'userInfo', {
     sources: sources,
@@ -189,69 +154,53 @@ var userInfoEvent = function userInfoEvent(sources, accountId) {
     accountId: checkValidId(accountId) ? accountId : null
   });
 };
-
 exports.userInfoEvent = userInfoEvent;
-
 function queryLength(state) {
   return state.inputValue.length;
 }
-
 function selectEventType(session) {
   return session && session.lastKey === 13 ? 'pressed' : 'clicked';
 }
-
 function upKeyCount(session) {
   return session ? session.upCount : null;
 }
-
 function downKeyCount(session) {
   return session ? session.downCount : null;
 }
-
 function spaceInQuery(state) {
   return state.inputValue.indexOf(' ') !== -1;
 }
-
 function sessionDuration(session) {
   return session ? Date.now() - session.start : null;
 }
-
 function durationSinceInputChange(session) {
   return session ? Date.now() - session.inputChangeTime : null;
 }
-
 function sessionId(session) {
   return session && session.id;
 }
-
 function position(state, value) {
   return value ? state.options.findIndex(function (option) {
     return option === value.data;
   }) : -1;
 }
-
 function pickerType(props) {
   return props.isMulti ? 'multi' : 'single';
 }
-
 function result(option) {
   return option ? optionData2Analytics(option.data) : null;
 }
-
 function results(state) {
   return (state.options || []).map(optionData2Analytics);
 }
-
 function isLoading(props, state) {
   return state.count > 0 || props.isLoading;
 }
-
 function values(state) {
   return state.value ? Array.isArray(state.value) ? state.value.map(function (option) {
     return optionData2Analytics(option.data);
   }) : [optionData2Analytics(state.value.data)] : [];
 }
-
 function numberOfResults(state) {
   return (state.options || []).length;
 }

package/dist/cjs/clients/UserSourceProvider.js

@@ -1,82 +1,62 @@
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
 var _typeof = require("@babel/runtime/helpers/typeof");
-
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.useUserSource = exports.ExusUserSourceProvider = void 0;
-
 var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
-
 var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
-
 var _react = _interopRequireWildcard(require("react"));
-
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
-
 function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
-
 var ExusUserSourceContext = /*#__PURE__*/(0, _react.createContext)({});
-
 var ExusUserSourceProvider = function ExusUserSourceProvider(_ref) {
   var fetchUserSource = _ref.fetchUserSource,
-      children = _ref.children;
+    children = _ref.children;
   return /*#__PURE__*/_react.default.createElement(ExusUserSourceContext.Provider, {
     value: {
       fetchUserSource: fetchUserSource
     }
   }, children);
 };
-
 exports.ExusUserSourceProvider = ExusUserSourceProvider;
-
 var useUserSource = function useUserSource(accountId, shouldFetchSources, existingSources) {
   var _useContext = (0, _react.useContext)(ExusUserSourceContext),
-      fetchUserSource = _useContext.fetchUserSource;
-
+    fetchUserSource = _useContext.fetchUserSource;
   var _useState = (0, _react.useState)([]),
-      _useState2 = (0, _slicedToArray2.default)(_useState, 2),
-      externalSources = _useState2[0],
-      setExternalSources = _useState2[1];
-
+    _useState2 = (0, _slicedToArray2.default)(_useState, 2),
+    externalSources = _useState2[0],
+    setExternalSources = _useState2[1];
   var _useState3 = (0, _react.useState)(true),
-      _useState4 = (0, _slicedToArray2.default)(_useState3, 2),
-      loading = _useState4[0],
-      setLoading = _useState4[1];
-
+    _useState4 = (0, _slicedToArray2.default)(_useState3, 2),
+    loading = _useState4[0],
+    setLoading = _useState4[1];
   var _useState5 = (0, _react.useState)(null),
-      _useState6 = (0, _slicedToArray2.default)(_useState5, 2),
-      error = _useState6[0],
-      setError = _useState6[1];
-
+    _useState6 = (0, _slicedToArray2.default)(_useState5, 2),
+    error = _useState6[0],
+    setError = _useState6[1];
   var abortController = (0, _react.useMemo)(function () {
     if (typeof AbortController === 'undefined') {
       return;
     }
-
     return new AbortController();
   }, []);
   (0, _react.useEffect)(function () {
     var isMounted = true;
-
     var cleanup = function cleanup() {
       abortController === null || abortController === void 0 ? void 0 : abortController.abort();
       isMounted = false;
     };
-
     if (!fetchUserSource || !shouldFetchSources) {
       setLoading(false);
       return cleanup;
     }
-
     fetchUserSource(accountId, abortController === null || abortController === void 0 ? void 0 : abortController.signal).then(function (externalSources) {
       if (!isMounted) {
         return;
       }
-
       setLoading(false);
       var externalSourceTypes = externalSources.map(function (source) {
         return source.sourceType;
@@ -86,7 +66,6 @@ var useUserSource = function useUserSource(accountId, shouldFetchSources, existi
       if (!isMounted) {
         return;
       }
-
       setLoading(false);
       setError(error);
     });
@@ -100,5 +79,4 @@ var useUserSource = function useUserSource(accountId, shouldFetchSources, existi
     };
   }, [error, existingSources, externalSources, loading]);
 };
-
 exports.useUserSource = useUserSource;

package/dist/cjs/components/AddOptionAvatar.js

@@ -1,21 +1,16 @@
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.AddOptionAvatar = void 0;
-
 var _email = _interopRequireDefault(require("@atlaskit/icon/glyph/email"));
-
 var _colors = require("@atlaskit/theme/colors");
-
 var _react = _interopRequireDefault(require("react"));
-
 var _react2 = require("@emotion/react");
-
 /** @jsx jsx */
+
 var getEmailAvatarWrapperStyle = function getEmailAvatarWrapperStyle(isLozenge) {
   var padding = isLozenge ? 0 : 4;
   return (0, _react2.css)({
@@ -26,10 +21,9 @@ var getEmailAvatarWrapperStyle = function getEmailAvatarWrapperStyle(isLozenge)
     alignItems: 'center'
   });
 };
-
 var AddOptionAvatar = function AddOptionAvatar(_ref) {
   var isLozenge = _ref.isLozenge,
-      label = _ref.label;
+    label = _ref.label;
   return (0, _react2.jsx)("div", {
     css: getEmailAvatarWrapperStyle(isLozenge)
   }, (0, _react2.jsx)(_email.default, {
@@ -38,5 +32,4 @@ var AddOptionAvatar = function AddOptionAvatar(_ref) {
     primaryColor: "var(--ds-text-subtle, ".concat(_colors.N500, ")")
   }));
 };
-
 exports.AddOptionAvatar = AddOptionAvatar;

package/dist/cjs/components/AvatarItemOption.js

@@ -1,34 +1,21 @@
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.textWrapper = exports.AvatarItemOption = void 0;
-
 var _typeof2 = _interopRequireDefault(require("@babel/runtime/helpers/typeof"));
-
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
-
 var _react = _interopRequireDefault(require("react"));
-
 var _constants = require("@atlaskit/theme/constants");
-
 var _react2 = require("@emotion/react");
-
 var _lozenge = _interopRequireDefault(require("@atlaskit/lozenge"));
-
 var _utils = require("./utils");
-
 function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
-
 function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { (0, _defineProperty2.default)(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
-
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
-
 function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || (0, _typeof2.default)(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
-
 var AsyncTooltip = /*#__PURE__*/_react.default.lazy(function () {
   return Promise.resolve().then(function () {
     return _interopRequireWildcard(require('@atlaskit/tooltip'));
@@ -38,7 +25,6 @@ var AsyncTooltip = /*#__PURE__*/_react.default.lazy(function () {
     };
   });
 });
-
 var wrapper = function wrapper(isDisabled) {
   return (0, _react2.css)({
     alignItems: 'center',
@@ -52,7 +38,6 @@ var wrapper = function wrapper(isDisabled) {
     opacity: isDisabled ? "var(--ds-opacity-disabled, 0.4)" : undefined
   });
 };
-
 var optionWrapper = (0, _react2.css)({
   maxWidth: '100%',
   minWidth: 0,
@@ -60,7 +45,6 @@ var optionWrapper = (0, _react2.css)({
   lineHeight: '1.4',
   paddingLeft: "".concat((0, _constants.gridSize)(), "px")
 });
-
 var getTextStyle = function getTextStyle(isSecondary) {
   var secondaryCssArgs = isSecondary ? {
     fontSize: '0.85em'
@@ -72,11 +56,9 @@ var getTextStyle = function getTextStyle(isSecondary) {
     whiteSpace: 'nowrap'
   }, secondaryCssArgs));
 };
-
 var additionalInfo = (0, _react2.css)({
   float: 'right'
 });
-
 var textWrapper = function textWrapper(color) {
   return (0, _react2.css)({
     overflow: 'hidden',
@@ -85,16 +67,13 @@ var textWrapper = function textWrapper(color) {
     color: color
   });
 };
-
 exports.textWrapper = textWrapper;
-
 var AvatarItemOption = function AvatarItemOption(_ref) {
   var avatar = _ref.avatar,
-      isDisabled = _ref.isDisabled,
-      lozenge = _ref.lozenge,
-      primaryText = _ref.primaryText,
-      secondaryText = _ref.secondaryText;
-
+    isDisabled = _ref.isDisabled,
+    lozenge = _ref.lozenge,
+    primaryText = _ref.primaryText,
+    secondaryText = _ref.secondaryText;
   var renderLozenge = function renderLozenge() {
     if ((0, _utils.isLozengeText)(lozenge)) {
       if (lozenge !== null && lozenge !== void 0 && lozenge.tooltip) {
@@ -106,13 +85,10 @@ var AvatarItemOption = function AvatarItemOption(_ref) {
           content: lozenge.tooltip
         }, (0, _react2.jsx)(_lozenge.default, lozenge, lozenge.text)));
       }
-
       return (0, _react2.jsx)(_lozenge.default, lozenge, lozenge.text);
     }
-
     return lozenge;
   };
-
   return (0, _react2.jsx)("span", {
     css: wrapper(isDisabled)
   }, avatar, (0, _react2.jsx)("div", {
@@ -125,5 +101,4 @@ var AvatarItemOption = function AvatarItemOption(_ref) {
     css: additionalInfo
   }, renderLozenge()));
 };
-
 exports.AvatarItemOption = AvatarItemOption;