@atlaskit/smart-user-picker 11.4.0 → 11.5.1

package/CHANGELOG.md

@@ -1,5 +1,21 @@
 # @atlassian/smart-user-picker
 
+## 11.5.1
+
+### Patch Changes
+
+- [`6d704062ca749`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/6d704062ca749) -
+  Internal refactor to support tree shaking. No consumer changes.
+
+## 11.5.0
+
+### Minor Changes
+
+- [`30c27895b9040`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/30c27895b9040) -
+  Behind the smart-user-picker-fetch-error-fix gate, a failed user lookup no longer clears the
+  suggestions or fails the UFO experience when the query has already moved on, so a slow or failing
+  request for an earlier keystroke cannot wipe the results of the current one.
+
 ## 11.4.0
 
 ### Minor Changes

package/dist/cjs/UfoErrorBoundary.js

@@ -0,0 +1,34 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.UfoErrorBoundary = void 0;
+var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
+var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
+var _possibleConstructorReturn2 = _interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));
+var _getPrototypeOf2 = _interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));
+var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));
+var _react = _interopRequireDefault(require("react"));
+var _ufoExperiences = require("./ufoExperiences");
+function _callSuper(t, o, e) { return o = (0, _getPrototypeOf2.default)(o), (0, _possibleConstructorReturn2.default)(t, _isNativeReflectConstruct() ? Reflect.construct(o, e || [], (0, _getPrototypeOf2.default)(t).constructor) : o.apply(t, e)); }
+function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); } catch (t) {} return (_isNativeReflectConstruct = function _isNativeReflectConstruct() { return !!t; })(); }
+var UfoErrorBoundary = exports.UfoErrorBoundary = /*#__PURE__*/function (_React$Component) {
+  function UfoErrorBoundary() {
+    (0, _classCallCheck2.default)(this, UfoErrorBoundary);
+    return _callSuper(this, UfoErrorBoundary, arguments);
+  }
+  (0, _inherits2.default)(UfoErrorBoundary, _React$Component);
+  return (0, _createClass2.default)(UfoErrorBoundary, [{
+    key: "componentDidCatch",
+    value: function componentDidCatch() {
+      _ufoExperiences.smartUserPickerRenderedUfoExperience.getInstance(this.props.id).failure();
+    }
+  }, {
+    key: "render",
+    value: function render() {
+      return this.props.children;
+    }
+  }]);
+}(_react.default.Component);

package/dist/cjs/analytics.js

@@ -12,7 +12,7 @@ function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbol
 function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { (0, _defineProperty2.default)(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; } // eslint-disable-next-line @typescript-eslint/consistent-type-imports
 // eslint-disable-next-line @atlaskit/platform/prefer-crypto-random-uuid -- Use crypto.randomUUID instead
 var packageName = "@atlaskit/smart-user-picker";
-var packageVersion = "11.3.3";
+var packageVersion = "11.5.0";
 var startSession = exports.startSession = function startSession() {
   return {
     // eslint-disable-next-line @atlaskit/platform/prefer-crypto-random-uuid -- Use crypto.randomUUID instead

package/dist/cjs/components/SmartUserPicker.js

@@ -343,11 +343,24 @@ var SmartUserPickerWithoutAnalytics = exports.SmartUserPickerWithoutAnalytics =
                 loading: loading
               };
             });
-            _context.next = 23;
+            _context.next = 24;
             break;
           case 15:
             _context.prev = 15;
             _t6 = _context["catch"](1);
+            if (!(_this.state.query !== query && (0, _platformFeatureFlags.fg)('smart-user-picker-fetch-error-fix'))) {
+              _context.next = 16;
+              break;
+            }
+            // The query has moved on since this request was sent, so its results are not the ones
+            // on screen. Applying the failure here would clear the options and fail the UFO
+            // experience that belong to the newer query.
+            _this.fireEvent(_analytics.failedRequestUsersEvent, {
+              elapsedTimeMilli: window.performance.now() - startTime,
+              productAttributes: productAttributes
+            });
+            return _context.abrupt("return");
+          case 16:
             is5xxEvent = checkIf500Event(_t6.statusCode);
             if (!closed && !onError && is5xxEvent) {
               // If the user lookup fails while the menu is open, and the consumer is not providing a
@@ -359,35 +372,35 @@ var SmartUserPickerWithoutAnalytics = exports.SmartUserPickerWithoutAnalytics =
             });
             onErrorProducedError = false;
             defaultUsers = [];
-            _context.prev = 16;
+            _context.prev = 17;
             if (!onError) {
-              _context.next = 19;
+              _context.next = 20;
               break;
             }
-            _context.next = 17;
+            _context.next = 18;
             return onError(_t6, recommendationsRequest);
-          case 17:
+          case 18:
             _t8 = _context.sent;
             if (_t8) {
-              _context.next = 18;
+              _context.next = 19;
               break;
             }
             _t8 = [];
-          case 18:
+          case 19:
             _t7 = _t8;
-            _context.next = 20;
+            _context.next = 21;
             break;
-          case 19:
-            _t7 = [];
           case 20:
+            _t7 = [];
+          case 21:
             defaultUsers = _t7;
-            _context.next = 22;
+            _context.next = 23;
             break;
-          case 21:
-            _context.prev = 21;
-            _t9 = _context["catch"](16);
-            onErrorProducedError = true;
           case 22:
+            _context.prev = 22;
+            _t9 = _context["catch"](17);
+            onErrorProducedError = true;
+          case 23:
             if (onErrorProducedError && is5xxEvent) {
               // Log error from fallback data source `onError` to UFO
               _this.optionsShownUfoExperienceInstance.failure(ufoEndStateConfig(_this.props.fieldId));
@@ -404,11 +417,11 @@ var SmartUserPickerWithoutAnalytics = exports.SmartUserPickerWithoutAnalytics =
               elapsedTimeMilli: _elapsedTimeMilli,
               productAttributes: productAttributes
             });
-          case 23:
+          case 24:
           case "end":
             return _context.stop();
         }
-      }, _callee, null, [[1, 15], [16, 21]]);
+      }, _callee, null, [[1, 15], [17, 22]]);
     })), (_this$props$debounceT = _this.props.debounceTime) !== null && _this$props$debounceT !== void 0 ? _this$props$debounceT : 0));
     (0, _defineProperty2.default)(_this, "onInputChange", function (newQuery, sessionId) {
       var query = newQuery || '';

package/dist/cjs/components/index.js

@@ -6,13 +6,15 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.default = void 0;
 var _react = _interopRequireDefault(require("react"));
-var _SmartUserPicker = require("./SmartUserPicker");
-var _MessagesIntlProvider = _interopRequireDefault(require("./MessagesIntlProvider"));
+var _UfoErrorBoundary = require("../UfoErrorBoundary");
 var _ufoExperiences = require("../ufoExperiences");
+var _useUFOConcurrentExperience = require("../useUFOConcurrentExperience");
+var _MessagesIntlProvider = _interopRequireDefault(require("./MessagesIntlProvider"));
+var _SmartUserPicker = require("./SmartUserPicker");
 var SmartUserPickerWithIntlProvider = function SmartUserPickerWithIntlProvider(props) {
   var ufoId = props.inputId || props.fieldId;
-  (0, _ufoExperiences.useUFOConcurrentExperience)(_ufoExperiences.smartUserPickerRenderedUfoExperience, ufoId);
-  return /*#__PURE__*/_react.default.createElement(_ufoExperiences.UfoErrorBoundary, {
+  (0, _useUFOConcurrentExperience.useUFOConcurrentExperience)(_ufoExperiences.smartUserPickerRenderedUfoExperience, ufoId);
+  return /*#__PURE__*/_react.default.createElement(_UfoErrorBoundary.UfoErrorBoundary, {
     id: ufoId
   }, /*#__PURE__*/_react.default.createElement(_MessagesIntlProvider.default, null, /*#__PURE__*/_react.default.createElement(_SmartUserPicker.SmartUserPicker, props)));
 };

package/dist/cjs/service/users-client.js

@@ -8,9 +8,9 @@ exports.default = void 0;
 var _regenerator = _interopRequireDefault(require("@babel/runtime/regenerator"));
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
 var _asyncToGenerator2 = _interopRequireDefault(require("@babel/runtime/helpers/asyncToGenerator"));
+var _config = require("../config");
 var _constants = require("./constants");
 var _graphqlUtils = require("./graphqlUtils");
-var _config = require("../config");
 function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { (0, _defineProperty2.default)(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 /**

package/dist/cjs/ufoExperiences.js

@@ -1,21 +1,10 @@
 "use strict";
 
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-var _typeof = require("@babel/runtime/helpers/typeof");
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.useUFOConcurrentExperience = exports.smartUserPickerRenderedUfoExperience = exports.smartUserPickerOptionsShownUfoExperience = exports.UfoErrorBoundary = void 0;
-var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
-var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
-var _possibleConstructorReturn2 = _interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));
-var _getPrototypeOf2 = _interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));
-var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));
-var _react = _interopRequireWildcard(require("react"));
+exports.smartUserPickerRenderedUfoExperience = exports.smartUserPickerOptionsShownUfoExperience = void 0;
 var _ufo = require("@atlaskit/ufo");
-function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function _interopRequireWildcard(e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != _typeof(e) && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (var _t in e) "default" !== _t && {}.hasOwnProperty.call(e, _t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, _t)) && (i.get || i.set) ? o(f, _t, i) : f[_t] = e[_t]); return f; })(e, t); }
-function _callSuper(t, o, e) { return o = (0, _getPrototypeOf2.default)(o), (0, _possibleConstructorReturn2.default)(t, _isNativeReflectConstruct() ? Reflect.construct(o, e || [], (0, _getPrototypeOf2.default)(t).constructor) : o.apply(t, e)); }
-function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); } catch (t) {} return (_isNativeReflectConstruct = function _isNativeReflectConstruct() { return !!t; })(); }
 var COMPONENT_NAME = 'smart-user-picker';
 var smartUserPickerRenderedUfoExperience = exports.smartUserPickerRenderedUfoExperience = new _ufo.ConcurrentExperience('smart-user-picker-rendered', {
   platform: {
@@ -30,46 +19,4 @@ var smartUserPickerOptionsShownUfoExperience = exports.smartUserPickerOptionsSho
   },
   type: _ufo.ExperienceTypes.Operation,
   performanceType: _ufo.ExperiencePerformanceTypes.InlineResult
-});
-var useUFOConcurrentExperience = exports.useUFOConcurrentExperience = function useUFOConcurrentExperience(experience, id) {
-  var experienceForId = experience.getInstance(id);
-
-  // Equivalent to componentWillMount - replace with @atlaskit/ufo's
-  // useUFOComponentExperience when it supports ConcurrentExperience.
-  (0, _react.useState)(function () {
-    experienceForId.start();
-  });
-
-  // Replace with @atlaskit/ufo's <ExperienceSuccess> when it supports ConcurrentExperience
-  (0, _react.useEffect)(function () {
-    if (experienceForId.state !== _ufo.UFOExperienceState['FAILED']) {
-      experienceForId.success();
-    }
-    return function () {
-      if ([_ufo.UFOExperienceState['STARTED'], _ufo.UFOExperienceState['IN_PROGRESS']].includes(experienceForId.state)) {
-        experienceForId.abort();
-      }
-    };
-
-    // We only want this useEffect to run once after component mount, so no deps are needed.
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, []);
-};
-var UfoErrorBoundary = exports.UfoErrorBoundary = /*#__PURE__*/function (_React$Component) {
-  function UfoErrorBoundary() {
-    (0, _classCallCheck2.default)(this, UfoErrorBoundary);
-    return _callSuper(this, UfoErrorBoundary, arguments);
-  }
-  (0, _inherits2.default)(UfoErrorBoundary, _React$Component);
-  return (0, _createClass2.default)(UfoErrorBoundary, [{
-    key: "componentDidCatch",
-    value: function componentDidCatch() {
-      smartUserPickerRenderedUfoExperience.getInstance(this.props.id).failure();
-    }
-  }, {
-    key: "render",
-    value: function render() {
-      return this.props.children;
-    }
-  }]);
-}(_react.default.Component);
+});

package/dist/cjs/useUFOConcurrentExperience.js

@@ -0,0 +1,32 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.useUFOConcurrentExperience = void 0;
+var _react = require("react");
+var _ufo = require("@atlaskit/ufo");
+var useUFOConcurrentExperience = exports.useUFOConcurrentExperience = function useUFOConcurrentExperience(experience, id) {
+  var experienceForId = experience.getInstance(id);
+
+  // Equivalent to pre-mount initialization - replace with @atlaskit/ufo's
+  // useUFOComponentExperience when it supports ConcurrentExperience.
+  (0, _react.useState)(function () {
+    experienceForId.start();
+  });
+
+  // Replace with @atlaskit/ufo's <ExperienceSuccess> when it supports ConcurrentExperience
+  (0, _react.useEffect)(function () {
+    if (experienceForId.state !== _ufo.UFOExperienceState['FAILED']) {
+      experienceForId.success();
+    }
+    return function () {
+      if ([_ufo.UFOExperienceState['STARTED'], _ufo.UFOExperienceState['IN_PROGRESS']].includes(experienceForId.state)) {
+        experienceForId.abort();
+      }
+    };
+
+    // We only want this useEffect to run once after component mount, so no deps are needed.
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, []);
+};

package/dist/es2019/UfoErrorBoundary.js

@@ -0,0 +1,10 @@
+import React from 'react';
+import { smartUserPickerRenderedUfoExperience } from './ufoExperiences';
+export class UfoErrorBoundary extends React.Component {
+  componentDidCatch() {
+    smartUserPickerRenderedUfoExperience.getInstance(this.props.id).failure();
+  }
+  render() {
+    return this.props.children;
+  }
+}

package/dist/es2019/analytics.js

@@ -3,7 +3,7 @@ import { createAndFireEvent } from '@atlaskit/analytics-next';
 // eslint-disable-next-line @atlaskit/platform/prefer-crypto-random-uuid -- Use crypto.randomUUID instead
 import { v4 as uuid } from 'uuid';
 const packageName = "@atlaskit/smart-user-picker";
-const packageVersion = "11.3.3";
+const packageVersion = "11.5.0";
 export const startSession = () => ({
   // eslint-disable-next-line @atlaskit/platform/prefer-crypto-random-uuid -- Use crypto.randomUUID instead
   id: uuid(),

package/dist/es2019/components/SmartUserPicker.js

@@ -260,6 +260,16 @@ export class SmartUserPickerWithoutAnalytics extends React.Component {
           };
         });
       } catch (e) {
+        if (this.state.query !== query && fg('smart-user-picker-fetch-error-fix')) {
+          // The query has moved on since this request was sent, so its results are not the ones
+          // on screen. Applying the failure here would clear the options and fail the UFO
+          // experience that belong to the newer query.
+          this.fireEvent(failedRequestUsersEvent, {
+            elapsedTimeMilli: window.performance.now() - startTime,
+            productAttributes
+          });
+          return;
+        }
         const is5xxEvent = checkIf500Event(e.statusCode);
         if (!closed && !onError && is5xxEvent) {
           // If the user lookup fails while the menu is open, and the consumer is not providing a

package/dist/es2019/components/index.js

@@ -1,7 +1,9 @@
 import React from 'react';
-import { SmartUserPicker } from './SmartUserPicker';
+import { UfoErrorBoundary } from '../UfoErrorBoundary';
+import { smartUserPickerRenderedUfoExperience } from '../ufoExperiences';
+import { useUFOConcurrentExperience } from '../useUFOConcurrentExperience';
 import MessagesIntlProvider from './MessagesIntlProvider';
-import { useUFOConcurrentExperience, smartUserPickerRenderedUfoExperience, UfoErrorBoundary } from '../ufoExperiences';
+import { SmartUserPicker } from './SmartUserPicker';
 const SmartUserPickerWithIntlProvider = props => {
   const ufoId = props.inputId || props.fieldId;
   useUFOConcurrentExperience(smartUserPickerRenderedUfoExperience, ufoId);

package/dist/es2019/index.js

@@ -1,3 +1,4 @@
+/* eslint-disable @repo/internal/deprecations/deprecation-ticket-required, @atlaskit/volt-strict-mode/no-re-exports, @atlaskit/editor/no-re-export -- VOLTC-139 tracks removal of these deprecated re-export shims. */
 export { default } from './components';
 export { getUserRecommendations, hydrateDefaultValues } from './service';
 export {

package/dist/es2019/option.js

@@ -1 +1,2 @@
+/* eslint-disable @repo/internal/deprecations/deprecation-ticket-required, @atlaskit/volt-strict-mode/no-re-exports, @atlaskit/editor/no-re-export -- VOLTC-139 tracks removal of these deprecated re-export shims. */
 export { Option, CustomOption, EmailOption, GroupOption, UserOption, TeamOption } from '@atlaskit/user-picker/option';

package/dist/es2019/service/users-client.js

@@ -1,6 +1,6 @@
+import { config } from '../config';
 import { UNKNOWN_USER } from './constants';
 import { graphqlQuery } from './graphqlUtils';
-import { config } from '../config';
 /**
  * @param  {string} accountIds ids to hydrate
  * @return GraphQL Query

package/dist/es2019/ufoExperiences.js

@@ -1,6 +1,4 @@
-import React from 'react';
-import { ExperiencePerformanceTypes, ExperienceTypes, ConcurrentExperience, UFOExperienceState } from '@atlaskit/ufo';
-import { useEffect, useState } from 'react';
+import { ExperiencePerformanceTypes, ExperienceTypes, ConcurrentExperience } from '@atlaskit/ufo';
 const COMPONENT_NAME = 'smart-user-picker';
 export const smartUserPickerRenderedUfoExperience = new ConcurrentExperience('smart-user-picker-rendered', {
   platform: {
@@ -15,36 +13,4 @@ export const smartUserPickerOptionsShownUfoExperience = new ConcurrentExperience
   },
   type: ExperienceTypes.Operation,
   performanceType: ExperiencePerformanceTypes.InlineResult
-});
-export const useUFOConcurrentExperience = (experience, id) => {
-  const experienceForId = experience.getInstance(id);
-
-  // Equivalent to componentWillMount - replace with @atlaskit/ufo's
-  // useUFOComponentExperience when it supports ConcurrentExperience.
-  useState(() => {
-    experienceForId.start();
-  });
-
-  // Replace with @atlaskit/ufo's <ExperienceSuccess> when it supports ConcurrentExperience
-  useEffect(() => {
-    if (experienceForId.state !== UFOExperienceState['FAILED']) {
-      experienceForId.success();
-    }
-    return () => {
-      if ([UFOExperienceState['STARTED'], UFOExperienceState['IN_PROGRESS']].includes(experienceForId.state)) {
-        experienceForId.abort();
-      }
-    };
-
-    // We only want this useEffect to run once after component mount, so no deps are needed.
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, []);
-};
-export class UfoErrorBoundary extends React.Component {
-  componentDidCatch() {
-    smartUserPickerRenderedUfoExperience.getInstance(this.props.id).failure();
-  }
-  render() {
-    return this.props.children;
-  }
-}
+});

package/dist/es2019/useUFOConcurrentExperience.js

@@ -0,0 +1,26 @@
+import { useEffect, useState } from 'react';
+import { UFOExperienceState } from '@atlaskit/ufo';
+export const useUFOConcurrentExperience = (experience, id) => {
+  const experienceForId = experience.getInstance(id);
+
+  // Equivalent to pre-mount initialization - replace with @atlaskit/ufo's
+  // useUFOComponentExperience when it supports ConcurrentExperience.
+  useState(() => {
+    experienceForId.start();
+  });
+
+  // Replace with @atlaskit/ufo's <ExperienceSuccess> when it supports ConcurrentExperience
+  useEffect(() => {
+    if (experienceForId.state !== UFOExperienceState['FAILED']) {
+      experienceForId.success();
+    }
+    return () => {
+      if ([UFOExperienceState['STARTED'], UFOExperienceState['IN_PROGRESS']].includes(experienceForId.state)) {
+        experienceForId.abort();
+      }
+    };
+
+    // We only want this useEffect to run once after component mount, so no deps are needed.
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, []);
+};

package/dist/es2019/userPicker.js

@@ -1,3 +1,4 @@
+/* eslint-disable @repo/internal/deprecations/deprecation-ticket-required, @atlaskit/volt-strict-mode/no-re-exports, @atlaskit/editor/no-re-export -- VOLTC-139 tracks removal of these deprecated re-export shims. */
 export {
 //Utils
 isEmail, isTeam, isUser, isExternalUser, isValidEmail, isGroup,

package/dist/esm/UfoErrorBoundary.js

@@ -0,0 +1,27 @@
+import _classCallCheck from "@babel/runtime/helpers/classCallCheck";
+import _createClass from "@babel/runtime/helpers/createClass";
+import _possibleConstructorReturn from "@babel/runtime/helpers/possibleConstructorReturn";
+import _getPrototypeOf from "@babel/runtime/helpers/getPrototypeOf";
+import _inherits from "@babel/runtime/helpers/inherits";
+function _callSuper(t, o, e) { return o = _getPrototypeOf(o), _possibleConstructorReturn(t, _isNativeReflectConstruct() ? Reflect.construct(o, e || [], _getPrototypeOf(t).constructor) : o.apply(t, e)); }
+function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); } catch (t) {} return (_isNativeReflectConstruct = function _isNativeReflectConstruct() { return !!t; })(); }
+import React from 'react';
+import { smartUserPickerRenderedUfoExperience } from './ufoExperiences';
+export var UfoErrorBoundary = /*#__PURE__*/function (_React$Component) {
+  function UfoErrorBoundary() {
+    _classCallCheck(this, UfoErrorBoundary);
+    return _callSuper(this, UfoErrorBoundary, arguments);
+  }
+  _inherits(UfoErrorBoundary, _React$Component);
+  return _createClass(UfoErrorBoundary, [{
+    key: "componentDidCatch",
+    value: function componentDidCatch() {
+      smartUserPickerRenderedUfoExperience.getInstance(this.props.id).failure();
+    }
+  }, {
+    key: "render",
+    value: function render() {
+      return this.props.children;
+    }
+  }]);
+}(React.Component);

package/dist/esm/analytics.js

@@ -6,7 +6,7 @@ import { createAndFireEvent } from '@atlaskit/analytics-next';
 // eslint-disable-next-line @atlaskit/platform/prefer-crypto-random-uuid -- Use crypto.randomUUID instead
 import { v4 as uuid } from 'uuid';
 var packageName = "@atlaskit/smart-user-picker";
-var packageVersion = "11.3.3";
+var packageVersion = "11.5.0";
 export var startSession = function startSession() {
   return {
     // eslint-disable-next-line @atlaskit/platform/prefer-crypto-random-uuid -- Use crypto.randomUUID instead

package/dist/esm/components/SmartUserPicker.js

@@ -335,11 +335,24 @@ export var SmartUserPickerWithoutAnalytics = /*#__PURE__*/function (_React$Compo
                 loading: loading
               };
             });
-            _context.next = 23;
+            _context.next = 24;
             break;
           case 15:
             _context.prev = 15;
             _t6 = _context["catch"](1);
+            if (!(_this.state.query !== query && fg('smart-user-picker-fetch-error-fix'))) {
+              _context.next = 16;
+              break;
+            }
+            // The query has moved on since this request was sent, so its results are not the ones
+            // on screen. Applying the failure here would clear the options and fail the UFO
+            // experience that belong to the newer query.
+            _this.fireEvent(failedRequestUsersEvent, {
+              elapsedTimeMilli: window.performance.now() - startTime,
+              productAttributes: productAttributes
+            });
+            return _context.abrupt("return");
+          case 16:
             is5xxEvent = checkIf500Event(_t6.statusCode);
             if (!closed && !onError && is5xxEvent) {
               // If the user lookup fails while the menu is open, and the consumer is not providing a
@@ -351,35 +364,35 @@ export var SmartUserPickerWithoutAnalytics = /*#__PURE__*/function (_React$Compo
             });
             onErrorProducedError = false;
             defaultUsers = [];
-            _context.prev = 16;
+            _context.prev = 17;
             if (!onError) {
-              _context.next = 19;
+              _context.next = 20;
               break;
             }
-            _context.next = 17;
+            _context.next = 18;
             return onError(_t6, recommendationsRequest);
-          case 17:
+          case 18:
             _t8 = _context.sent;
             if (_t8) {
-              _context.next = 18;
+              _context.next = 19;
               break;
             }
             _t8 = [];
-          case 18:
+          case 19:
             _t7 = _t8;
-            _context.next = 20;
+            _context.next = 21;
             break;
-          case 19:
-            _t7 = [];
           case 20:
+            _t7 = [];
+          case 21:
             defaultUsers = _t7;
-            _context.next = 22;
+            _context.next = 23;
             break;
-          case 21:
-            _context.prev = 21;
-            _t9 = _context["catch"](16);
-            onErrorProducedError = true;
           case 22:
+            _context.prev = 22;
+            _t9 = _context["catch"](17);
+            onErrorProducedError = true;
+          case 23:
             if (onErrorProducedError && is5xxEvent) {
               // Log error from fallback data source `onError` to UFO
               _this.optionsShownUfoExperienceInstance.failure(ufoEndStateConfig(_this.props.fieldId));
@@ -396,11 +409,11 @@ export var SmartUserPickerWithoutAnalytics = /*#__PURE__*/function (_React$Compo
               elapsedTimeMilli: _elapsedTimeMilli,
               productAttributes: productAttributes
             });
-          case 23:
+          case 24:
           case "end":
             return _context.stop();
         }
-      }, _callee, null, [[1, 15], [16, 21]]);
+      }, _callee, null, [[1, 15], [17, 22]]);
     })), (_this$props$debounceT = _this.props.debounceTime) !== null && _this$props$debounceT !== void 0 ? _this$props$debounceT : 0));
     _defineProperty(_this, "onInputChange", function (newQuery, sessionId) {
       var query = newQuery || '';

package/dist/esm/components/index.js

@@ -1,7 +1,9 @@
 import React from 'react';
-import { SmartUserPicker } from './SmartUserPicker';
+import { UfoErrorBoundary } from '../UfoErrorBoundary';
+import { smartUserPickerRenderedUfoExperience } from '../ufoExperiences';
+import { useUFOConcurrentExperience } from '../useUFOConcurrentExperience';
 import MessagesIntlProvider from './MessagesIntlProvider';
-import { useUFOConcurrentExperience, smartUserPickerRenderedUfoExperience, UfoErrorBoundary } from '../ufoExperiences';
+import { SmartUserPicker } from './SmartUserPicker';
 var SmartUserPickerWithIntlProvider = function SmartUserPickerWithIntlProvider(props) {
   var ufoId = props.inputId || props.fieldId;
   useUFOConcurrentExperience(smartUserPickerRenderedUfoExperience, ufoId);

package/dist/esm/index.js

@@ -1,3 +1,4 @@
+/* eslint-disable @repo/internal/deprecations/deprecation-ticket-required, @atlaskit/volt-strict-mode/no-re-exports, @atlaskit/editor/no-re-export -- VOLTC-139 tracks removal of these deprecated re-export shims. */
 export { default } from './components';
 export { getUserRecommendations, hydrateDefaultValues } from './service';
 export {

package/dist/esm/option.js

@@ -1 +1,2 @@
+/* eslint-disable @repo/internal/deprecations/deprecation-ticket-required, @atlaskit/volt-strict-mode/no-re-exports, @atlaskit/editor/no-re-export -- VOLTC-139 tracks removal of these deprecated re-export shims. */
 export { Option, CustomOption, EmailOption, GroupOption, UserOption, TeamOption } from '@atlaskit/user-picker/option';

package/dist/esm/service/users-client.js

@@ -3,9 +3,9 @@ import _asyncToGenerator from "@babel/runtime/helpers/asyncToGenerator";
 function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 import _regeneratorRuntime from "@babel/runtime/regenerator";
+import { config } from '../config';
 import { UNKNOWN_USER } from './constants';
 import { graphqlQuery } from './graphqlUtils';
-import { config } from '../config';
 /**
  * @param  {string} accountIds ids to hydrate
  * @return GraphQL Query

package/dist/esm/ufoExperiences.js

@@ -1,13 +1,4 @@
-import _classCallCheck from "@babel/runtime/helpers/classCallCheck";
-import _createClass from "@babel/runtime/helpers/createClass";
-import _possibleConstructorReturn from "@babel/runtime/helpers/possibleConstructorReturn";
-import _getPrototypeOf from "@babel/runtime/helpers/getPrototypeOf";
-import _inherits from "@babel/runtime/helpers/inherits";
-function _callSuper(t, o, e) { return o = _getPrototypeOf(o), _possibleConstructorReturn(t, _isNativeReflectConstruct() ? Reflect.construct(o, e || [], _getPrototypeOf(t).constructor) : o.apply(t, e)); }
-function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); } catch (t) {} return (_isNativeReflectConstruct = function _isNativeReflectConstruct() { return !!t; })(); }
-import React from 'react';
-import { ExperiencePerformanceTypes, ExperienceTypes, ConcurrentExperience, UFOExperienceState } from '@atlaskit/ufo';
-import { useEffect, useState } from 'react';
+import { ExperiencePerformanceTypes, ExperienceTypes, ConcurrentExperience } from '@atlaskit/ufo';
 var COMPONENT_NAME = 'smart-user-picker';
 export var smartUserPickerRenderedUfoExperience = new ConcurrentExperience('smart-user-picker-rendered', {
   platform: {
@@ -22,46 +13,4 @@ export var smartUserPickerOptionsShownUfoExperience = new ConcurrentExperience('
   },
   type: ExperienceTypes.Operation,
   performanceType: ExperiencePerformanceTypes.InlineResult
-});
-export var useUFOConcurrentExperience = function useUFOConcurrentExperience(experience, id) {
-  var experienceForId = experience.getInstance(id);
-
-  // Equivalent to componentWillMount - replace with @atlaskit/ufo's
-  // useUFOComponentExperience when it supports ConcurrentExperience.
-  useState(function () {
-    experienceForId.start();
-  });
-
-  // Replace with @atlaskit/ufo's <ExperienceSuccess> when it supports ConcurrentExperience
-  useEffect(function () {
-    if (experienceForId.state !== UFOExperienceState['FAILED']) {
-      experienceForId.success();
-    }
-    return function () {
-      if ([UFOExperienceState['STARTED'], UFOExperienceState['IN_PROGRESS']].includes(experienceForId.state)) {
-        experienceForId.abort();
-      }
-    };
-
-    // We only want this useEffect to run once after component mount, so no deps are needed.
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, []);
-};
-export var UfoErrorBoundary = /*#__PURE__*/function (_React$Component) {
-  function UfoErrorBoundary() {
-    _classCallCheck(this, UfoErrorBoundary);
-    return _callSuper(this, UfoErrorBoundary, arguments);
-  }
-  _inherits(UfoErrorBoundary, _React$Component);
-  return _createClass(UfoErrorBoundary, [{
-    key: "componentDidCatch",
-    value: function componentDidCatch() {
-      smartUserPickerRenderedUfoExperience.getInstance(this.props.id).failure();
-    }
-  }, {
-    key: "render",
-    value: function render() {
-      return this.props.children;
-    }
-  }]);
-}(React.Component);
+});

package/dist/esm/useUFOConcurrentExperience.js

@@ -0,0 +1,26 @@
+import { useEffect, useState } from 'react';
+import { UFOExperienceState } from '@atlaskit/ufo';
+export var useUFOConcurrentExperience = function useUFOConcurrentExperience(experience, id) {
+  var experienceForId = experience.getInstance(id);
+
+  // Equivalent to pre-mount initialization - replace with @atlaskit/ufo's
+  // useUFOComponentExperience when it supports ConcurrentExperience.
+  useState(function () {
+    experienceForId.start();
+  });
+
+  // Replace with @atlaskit/ufo's <ExperienceSuccess> when it supports ConcurrentExperience
+  useEffect(function () {
+    if (experienceForId.state !== UFOExperienceState['FAILED']) {
+      experienceForId.success();
+    }
+    return function () {
+      if ([UFOExperienceState['STARTED'], UFOExperienceState['IN_PROGRESS']].includes(experienceForId.state)) {
+        experienceForId.abort();
+      }
+    };
+
+    // We only want this useEffect to run once after component mount, so no deps are needed.
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, []);
+};

package/dist/esm/userPicker.js

@@ -1,3 +1,4 @@
+/* eslint-disable @repo/internal/deprecations/deprecation-ticket-required, @atlaskit/volt-strict-mode/no-re-exports, @atlaskit/editor/no-re-export -- VOLTC-139 tracks removal of these deprecated re-export shims. */
 export {
 //Utils
 isEmail, isTeam, isUser, isExternalUser, isValidEmail, isGroup,

package/dist/types/UfoErrorBoundary.d.ts

@@ -0,0 +1,7 @@
+import React from 'react';
+export declare class UfoErrorBoundary extends React.Component<React.PropsWithChildren<{
+    id: string;
+}>> {
+    componentDidCatch(): void;
+    render(): React.ReactNode;
+}

package/dist/types/service/graphqlUtils.d.ts

@@ -1,5 +1,4 @@
 import { type AtlAttributionHeaderData } from './atl-attribution';
-export type { AtlAttributionHeaderData } from './atl-attribution';
 interface Query {
     query: string;
     variables: Record<string, string> | Record<string, string[]>;
@@ -14,3 +13,4 @@ export interface GraphQLError {
  * @param {Partial<AtlAttributionHeaderData>} attributionData - Optional attribution data for the atl-attribution header
  */
 export declare function graphqlQuery<D>(serviceUrl: string, query: Query, attributionData?: Partial<AtlAttributionHeaderData>): Promise<D>;
+export {};

package/dist/types/service/users-client.d.ts

@@ -1,5 +1,5 @@
 import { type User } from '@atlaskit/user-picker';
-import { type AtlAttributionHeaderData } from './graphqlUtils';
+import type { AtlAttributionHeaderData } from './atl-attribution';
 interface UserData {
     accountId: string;
     name: string;

package/dist/types/ufoExperiences.d.ts

@@ -1,11 +1,3 @@
-import React from 'react';
 import { ConcurrentExperience } from '@atlaskit/ufo';
 export declare const smartUserPickerRenderedUfoExperience: ConcurrentExperience;
 export declare const smartUserPickerOptionsShownUfoExperience: ConcurrentExperience;
-export declare const useUFOConcurrentExperience: (experience: ConcurrentExperience, id: string) => void;
-export declare class UfoErrorBoundary extends React.Component<React.PropsWithChildren<{
-    id: string;
-}>> {
-    componentDidCatch(): void;
-    render(): React.ReactNode;
-}

package/dist/types/useUFOConcurrentExperience.d.ts

@@ -0,0 +1,2 @@
+import { type ConcurrentExperience } from '@atlaskit/ufo';
+export declare const useUFOConcurrentExperience: (experience: ConcurrentExperience, id: string) => void;

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@atlaskit/smart-user-picker",
-	"version": "11.4.0",
+	"version": "11.5.1",
 	"license": "Apache-2.0",
 	"publishConfig": {
 		"registry": "https://registry.npmjs.org/"
@@ -30,7 +30,7 @@
 		"@atlaskit/analytics-next": "^12.3.0",
 		"@atlaskit/platform-feature-flags": "^2.1.0",
 		"@atlaskit/ufo": "^1.0.0",
-		"@atlaskit/user-picker": "^13.8.0",
+		"@atlaskit/user-picker": "^13.9.0",
 		"@babel/runtime": "^7.0.0",
 		"lodash": "^4.17.21",
 		"memoize-one": "^6.0.0",
@@ -61,6 +61,9 @@
 		"smart_user_picker_suggest_emails_for_domain": {
 			"type": "boolean"
 		},
+		"smart-user-picker-fetch-error-fix": {
+			"type": "boolean"
+		},
 		"smart-user-picker-load-options-gate": {
 			"type": "boolean"
 		},

package/smart-user-picker.docs.tsx

@@ -1,41 +0,0 @@
-import path from 'path';
-
-import type { StructuredContentSource } from '@atlassian/structured-docs-types/types';
-
-import packageJson from './package.json';
-
-const packagePath = path.resolve(__dirname);
-
-const documentation: StructuredContentSource = {
-	components: [
-		{
-			name: 'SmartUserPicker',
-			description:
-				'A user picker component that provides ranked recommendations based on the current context.',
-			status: 'general-availability',
-			import: {
-				name: 'default',
-				package: '@atlaskit/smart-user-picker',
-				type: 'default',
-				packagePath,
-				packageJson,
-			},
-			usageGuidelines: [
-				'Use SmartUserPicker to allow users to select other users or teams.',
-				'Provides intelligent recommendations to help users find the right person quickly.',
-				'Supports searching by name, email, and other criteria.',
-			],
-			examples: [
-				{
-					name: 'Basic',
-					description: 'Standard smart user picker display.',
-					source: path.resolve(packagePath, './examples/00-smart-user-picker.tsx'),
-				},
-			],
-			keywords: ['user', 'picker', 'recommendations', 'search', 'teams'],
-			categories: ['interaction'],
-		},
-	],
-};
-
-export default documentation;