@atlaskit/user-picker 11.21.1 → 11.22.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (24) hide show
  1. package/CHANGELOG.md +13 -0
  2. package/dist/cjs/analytics.js +1 -1
  3. package/dist/cjs/components/BaseUserPicker.js +9 -5
  4. package/dist/es2019/analytics.js +1 -1
  5. package/dist/es2019/components/BaseUserPicker.js +9 -5
  6. package/dist/esm/analytics.js +1 -1
  7. package/dist/esm/components/BaseUserPicker.js +9 -5
  8. package/dist/types/components/AvatarItemOption.d.ts +1 -1
  9. package/dist/types/components/BaseUserPicker.d.ts +2 -0
  10. package/dist/types/components/ExternalUserOption/main.d.ts +2 -2
  11. package/dist/types/components/GroupOption/main.d.ts +1 -1
  12. package/dist/types/components/PopupUserPicker.d.ts +38 -34
  13. package/dist/types/components/UserPicker.d.ts +19 -17
  14. package/dist/types/components/components.d.ts +1 -1
  15. package/dist/types/types.d.ts +4 -0
  16. package/dist/types-ts4.5/components/AvatarItemOption.d.ts +1 -1
  17. package/dist/types-ts4.5/components/BaseUserPicker.d.ts +2 -0
  18. package/dist/types-ts4.5/components/ExternalUserOption/main.d.ts +2 -2
  19. package/dist/types-ts4.5/components/GroupOption/main.d.ts +1 -1
  20. package/dist/types-ts4.5/components/PopupUserPicker.d.ts +38 -34
  21. package/dist/types-ts4.5/components/UserPicker.d.ts +19 -17
  22. package/dist/types-ts4.5/components/components.d.ts +1 -1
  23. package/dist/types-ts4.5/types.d.ts +4 -0
  24. package/package.json +5 -5
package/CHANGELOG.md CHANGED
@@ -1,5 +1,18 @@
1
1
  # @atlaskit/user-picker
2
2
 
3
+ ## 11.22.0
4
+
5
+ ### Minor Changes
6
+
7
+ - [`c474c86e4ed4d`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/c474c86e4ed4d) -
8
+ Add isHeaderFocused prop to enable tabbing through header plugin in user picker.
9
+
10
+ ## 11.21.2
11
+
12
+ ### Patch Changes
13
+
14
+ - Updated dependencies
15
+
3
16
  ## 11.21.1
4
17
 
5
18
  ### Patch Changes
package/dist/cjs/analytics.js CHANGED
@@ -13,7 +13,7 @@ var _utils = require("./components/utils");
13
13
  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; }
14
14
  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 @atlaskit/platform/prefer-crypto-random-uuid -- Use crypto.randomUUID instead
15
15
  var packageName = "@atlaskit/user-picker";
16
- var packageVersion = "0.0.0-development";
16
+ var packageVersion = "11.21.2";
17
17
  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}$/;
18
18
  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}$/;
19
19
  var UUID_REGEXP_NEW_AAID = /^[a-fA-F0-9]{24,24}$/;
package/dist/cjs/components/BaseUserPicker.js CHANGED
@@ -253,7 +253,7 @@ var BaseUserPickerWithoutAnalytics = exports.BaseUserPickerWithoutAnalytics = /*
253
253
  });
254
254
  });
255
255
  (0, _defineProperty2.default)(_this, "handleBlur", function () {
256
- if (_this.isCreateTeamA11yEnabled && _this.props.isFooterFocused) {
256
+ if (_this.isCreateTeamA11yEnabled && (_this.props.isFooterFocused || _this.props.isHeaderFocused)) {
257
257
  return;
258
258
  }
259
259
  (0, _utils.callCallback)(_this.props.onBlur, _this.getSessionId());
@@ -269,7 +269,7 @@ var BaseUserPickerWithoutAnalytics = exports.BaseUserPickerWithoutAnalytics = /*
269
269
  });
270
270
  });
271
271
  (0, _defineProperty2.default)(_this, "handleClose", function () {
272
- if (_this.isCreateTeamA11yEnabled && _this.props.isFooterFocused) {
272
+ if (_this.isCreateTeamA11yEnabled && (_this.props.isFooterFocused || _this.props.isHeaderFocused)) {
273
273
  return;
274
274
  }
275
275
  _this.resetInputState();
@@ -339,10 +339,14 @@ var BaseUserPickerWithoutAnalytics = exports.BaseUserPickerWithoutAnalytics = /*
339
339
  options: []
340
340
  });
341
341
  _this.props.setIsFooterFocused && _this.props.setIsFooterFocused(false);
342
+ _this.props.setIsHeaderFocused && _this.props.setIsHeaderFocused(false);
342
343
  }
343
344
  if (event.key === 'Tab' && _this.props.setIsFooterFocused && _this.props.footer) {
344
345
  _this.props.setIsFooterFocused(true);
345
346
  }
347
+ if (event.key === 'Tab' && _this.props.setIsHeaderFocused && _this.props.header) {
348
+ _this.props.setIsHeaderFocused(true);
349
+ }
346
350
  }
347
351
  });
348
352
  (0, _defineProperty2.default)(_this, "handleClearIndicatorHover", function (hoveringClearIndicator) {
@@ -401,7 +405,7 @@ var BaseUserPickerWithoutAnalytics = exports.BaseUserPickerWithoutAnalytics = /*
401
405
  }
402
406
  });
403
407
  (0, _defineProperty2.default)(_this, "shouldKeepMenuOpen", function () {
404
- return Boolean(!!_this.props.footer) && Boolean(_this.props.isFooterFocused);
408
+ return Boolean(!!_this.props.footer) && Boolean(_this.props.isFooterFocused) || Boolean(!!_this.props.header) && Boolean(_this.props.isHeaderFocused);
405
409
  });
406
410
  _this.state = {
407
411
  options: [],
@@ -466,8 +470,8 @@ var BaseUserPickerWithoutAnalytics = exports.BaseUserPickerWithoutAnalytics = /*
466
470
  count = _this$state2.count,
467
471
  inputValue = _this$state2.inputValue;
468
472
 
469
- // Close menu when isFooterFocused changes from true to false
470
- if (this.isCreateTeamA11yEnabled && menuIsOpen && prevProps.isFooterFocused === true && this.props.isFooterFocused === false && !this.shouldKeepMenuOpen()) {
473
+ // Close menu when isFooterFocused or isHeaderFocused changes from true to false
474
+ if (this.isCreateTeamA11yEnabled && menuIsOpen && (prevProps.isFooterFocused === true && this.props.isFooterFocused === false || prevProps.isHeaderFocused === true && this.props.isHeaderFocused === false) && !this.shouldKeepMenuOpen()) {
471
475
  this.resetInputState();
472
476
  (0, _utils.callCallback)(this.props.onClose, this.getSessionId());
473
477
  this.setState({
package/dist/es2019/analytics.js CHANGED
@@ -4,7 +4,7 @@ import FeatureGates from '@atlaskit/feature-gate-js-client';
4
4
  import { v4 as uuidv4 } from 'uuid';
5
5
  import { isCustom, isExternalUser } from './components/utils';
6
6
  const packageName = "@atlaskit/user-picker";
7
- const packageVersion = "0.0.0-development";
7
+ const packageVersion = "11.21.2";
8
8
  const 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}$/;
9
9
  const 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}$/;
10
10
  const UUID_REGEXP_NEW_AAID = /^[a-fA-F0-9]{24,24}$/;
package/dist/es2019/components/BaseUserPicker.js CHANGED
@@ -243,7 +243,7 @@ export class BaseUserPickerWithoutAnalytics extends React.Component {
243
243
  });
244
244
  });
245
245
  _defineProperty(this, "handleBlur", () => {
246
- if (this.isCreateTeamA11yEnabled && this.props.isFooterFocused) {
246
+ if (this.isCreateTeamA11yEnabled && (this.props.isFooterFocused || this.props.isHeaderFocused)) {
247
247
  return;
248
248
  }
249
249
  callCallback(this.props.onBlur, this.getSessionId());
@@ -259,7 +259,7 @@ export class BaseUserPickerWithoutAnalytics extends React.Component {
259
259
  });
260
260
  });
261
261
  _defineProperty(this, "handleClose", () => {
262
- if (this.isCreateTeamA11yEnabled && this.props.isFooterFocused) {
262
+ if (this.isCreateTeamA11yEnabled && (this.props.isFooterFocused || this.props.isHeaderFocused)) {
263
263
  return;
264
264
  }
265
265
  this.resetInputState();
@@ -329,10 +329,14 @@ export class BaseUserPickerWithoutAnalytics extends React.Component {
329
329
  options: []
330
330
  });
331
331
  this.props.setIsFooterFocused && this.props.setIsFooterFocused(false);
332
+ this.props.setIsHeaderFocused && this.props.setIsHeaderFocused(false);
332
333
  }
333
334
  if (event.key === 'Tab' && this.props.setIsFooterFocused && this.props.footer) {
334
335
  this.props.setIsFooterFocused(true);
335
336
  }
337
+ if (event.key === 'Tab' && this.props.setIsHeaderFocused && this.props.header) {
338
+ this.props.setIsHeaderFocused(true);
339
+ }
336
340
  }
337
341
  });
338
342
  _defineProperty(this, "handleClearIndicatorHover", hoveringClearIndicator => {
@@ -385,7 +389,7 @@ export class BaseUserPickerWithoutAnalytics extends React.Component {
385
389
  }));
386
390
  }
387
391
  });
388
- _defineProperty(this, "shouldKeepMenuOpen", () => Boolean(!!this.props.footer) && Boolean(this.props.isFooterFocused));
392
+ _defineProperty(this, "shouldKeepMenuOpen", () => Boolean(!!this.props.footer) && Boolean(this.props.isFooterFocused) || Boolean(!!this.props.header) && Boolean(this.props.isHeaderFocused));
389
393
  this.state = {
390
394
  options: [],
391
395
  isDefaultSet: false,
@@ -441,8 +445,8 @@ export class BaseUserPickerWithoutAnalytics extends React.Component {
441
445
  inputValue
442
446
  } = this.state;
443
447
 
444
- // Close menu when isFooterFocused changes from true to false
445
- if (this.isCreateTeamA11yEnabled && menuIsOpen && prevProps.isFooterFocused === true && this.props.isFooterFocused === false && !this.shouldKeepMenuOpen()) {
448
+ // Close menu when isFooterFocused or isHeaderFocused changes from true to false
449
+ if (this.isCreateTeamA11yEnabled && menuIsOpen && (prevProps.isFooterFocused === true && this.props.isFooterFocused === false || prevProps.isHeaderFocused === true && this.props.isHeaderFocused === false) && !this.shouldKeepMenuOpen()) {
446
450
  this.resetInputState();
447
451
  callCallback(this.props.onClose, this.getSessionId());
448
452
  this.setState({
package/dist/esm/analytics.js CHANGED
@@ -7,7 +7,7 @@ import FeatureGates from '@atlaskit/feature-gate-js-client';
7
7
  import { v4 as uuidv4 } from 'uuid';
8
8
  import { isCustom, isExternalUser } from './components/utils';
9
9
  var packageName = "@atlaskit/user-picker";
10
- var packageVersion = "0.0.0-development";
10
+ var packageVersion = "11.21.2";
11
11
  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}$/;
12
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}$/;
13
13
  var UUID_REGEXP_NEW_AAID = /^[a-fA-F0-9]{24,24}$/;
package/dist/esm/components/BaseUserPicker.js CHANGED
@@ -247,7 +247,7 @@ export var BaseUserPickerWithoutAnalytics = /*#__PURE__*/function (_React$Compon
247
247
  });
248
248
  });
249
249
  _defineProperty(_this, "handleBlur", function () {
250
- if (_this.isCreateTeamA11yEnabled && _this.props.isFooterFocused) {
250
+ if (_this.isCreateTeamA11yEnabled && (_this.props.isFooterFocused || _this.props.isHeaderFocused)) {
251
251
  return;
252
252
  }
253
253
  callCallback(_this.props.onBlur, _this.getSessionId());
@@ -263,7 +263,7 @@ export var BaseUserPickerWithoutAnalytics = /*#__PURE__*/function (_React$Compon
263
263
  });
264
264
  });
265
265
  _defineProperty(_this, "handleClose", function () {
266
- if (_this.isCreateTeamA11yEnabled && _this.props.isFooterFocused) {
266
+ if (_this.isCreateTeamA11yEnabled && (_this.props.isFooterFocused || _this.props.isHeaderFocused)) {
267
267
  return;
268
268
  }
269
269
  _this.resetInputState();
@@ -333,10 +333,14 @@ export var BaseUserPickerWithoutAnalytics = /*#__PURE__*/function (_React$Compon
333
333
  options: []
334
334
  });
335
335
  _this.props.setIsFooterFocused && _this.props.setIsFooterFocused(false);
336
+ _this.props.setIsHeaderFocused && _this.props.setIsHeaderFocused(false);
336
337
  }
337
338
  if (event.key === 'Tab' && _this.props.setIsFooterFocused && _this.props.footer) {
338
339
  _this.props.setIsFooterFocused(true);
339
340
  }
341
+ if (event.key === 'Tab' && _this.props.setIsHeaderFocused && _this.props.header) {
342
+ _this.props.setIsHeaderFocused(true);
343
+ }
340
344
  }
341
345
  });
342
346
  _defineProperty(_this, "handleClearIndicatorHover", function (hoveringClearIndicator) {
@@ -395,7 +399,7 @@ export var BaseUserPickerWithoutAnalytics = /*#__PURE__*/function (_React$Compon
395
399
  }
396
400
  });
397
401
  _defineProperty(_this, "shouldKeepMenuOpen", function () {
398
- return Boolean(!!_this.props.footer) && Boolean(_this.props.isFooterFocused);
402
+ return Boolean(!!_this.props.footer) && Boolean(_this.props.isFooterFocused) || Boolean(!!_this.props.header) && Boolean(_this.props.isHeaderFocused);
399
403
  });
400
404
  _this.state = {
401
405
  options: [],
@@ -460,8 +464,8 @@ export var BaseUserPickerWithoutAnalytics = /*#__PURE__*/function (_React$Compon
460
464
  count = _this$state2.count,
461
465
  inputValue = _this$state2.inputValue;
462
466
 
463
- // Close menu when isFooterFocused changes from true to false
464
- if (this.isCreateTeamA11yEnabled && menuIsOpen && prevProps.isFooterFocused === true && this.props.isFooterFocused === false && !this.shouldKeepMenuOpen()) {
467
+ // Close menu when isFooterFocused or isHeaderFocused changes from true to false
468
+ if (this.isCreateTeamA11yEnabled && menuIsOpen && (prevProps.isFooterFocused === true && this.props.isFooterFocused === false || prevProps.isHeaderFocused === true && this.props.isHeaderFocused === false) && !this.shouldKeepMenuOpen()) {
465
469
  this.resetInputState();
466
470
  callCallback(this.props.onClose, this.getSessionId());
467
471
  this.setState({
package/dist/types/components/AvatarItemOption.d.ts CHANGED
@@ -5,7 +5,7 @@
5
5
  import { type ReactNode } from 'react';
6
6
  import { jsx } from '@emotion/react';
7
7
  import { type LozengeProps } from '../types';
8
- export declare const textWrapper: (color?: string) => import("@emotion/react").SerializedStyles;
8
+ export declare const textWrapper: (color?: string) => import("@emotion/utils").SerializedStyles;
9
9
  export type AvatarItemOptionProps = {
10
10
  avatar: ReactNode;
11
11
  isDisabled?: boolean;
package/dist/types/components/BaseUserPicker.d.ts CHANGED
@@ -98,6 +98,7 @@ export declare const BaseUserPicker: React.ForwardRefExoticComponent<Pick<Omit<{
98
98
  isClearable?: boolean;
99
99
  isDisabled?: boolean;
100
100
  isFooterFocused?: boolean;
101
+ isHeaderFocused?: boolean;
101
102
  isInvalid?: boolean;
102
103
  isLoading?: boolean;
103
104
  isMulti?: boolean;
@@ -137,6 +138,7 @@ export declare const BaseUserPicker: React.ForwardRefExoticComponent<Pick<Omit<{
137
138
  required?: boolean;
138
139
  search?: string;
139
140
  setIsFooterFocused?: React.Dispatch<React.SetStateAction<boolean>>;
141
+ setIsHeaderFocused?: React.Dispatch<React.SetStateAction<boolean>>;
140
142
  showClearIndicator?: boolean;
141
143
  strategy?: "fixed" | "absolute";
142
144
  styles?: StylesConfig;
package/dist/types/components/ExternalUserOption/main.d.ts CHANGED
@@ -5,8 +5,8 @@
5
5
  import React from 'react';
6
6
  import { type WithAnalyticsEventsProps } from '@atlaskit/analytics-next';
7
7
  import { type ExternalUser } from '../../types';
8
- export declare const imageContainer: import("@emotion/react").SerializedStyles;
9
- export declare const emailDomainWrapper: import("@emotion/react").SerializedStyles;
8
+ export declare const imageContainer: import("@emotion/utils").SerializedStyles;
9
+ export declare const emailDomainWrapper: import("@emotion/utils").SerializedStyles;
10
10
  export type ExternalUserOptionProps = WithAnalyticsEventsProps & {
11
11
  isSelected: boolean;
12
12
  status?: string;
package/dist/types/components/GroupOption/main.d.ts CHANGED
@@ -5,7 +5,7 @@
5
5
  import React from 'react';
6
6
  import { jsx } from '@emotion/react';
7
7
  import { type Group } from '../../types';
8
- export declare const groupOptionIconWrapper: import("@emotion/react").SerializedStyles;
8
+ export declare const groupOptionIconWrapper: import("@emotion/utils").SerializedStyles;
9
9
  export type GroupOptionProps = {
10
10
  group: Group;
11
11
  includeTeamsUpdates?: boolean;
package/dist/types/components/PopupUserPicker.d.ts CHANGED
@@ -23,7 +23,7 @@ export declare const PopupUserPicker: React.ForwardRefExoticComponent<Omit<Pick<
23
23
  addMoreMessage?: string;
24
24
  allowEmail?: boolean;
25
25
  anchor?: React.ComponentType<any>;
26
- appearance?: import("../types").Appearance;
26
+ appearance?: import("..").Appearance;
27
27
  ariaDescribedBy?: string;
28
28
  ariaLabel?: string;
29
29
  ariaLabelledBy?: string;
@@ -32,14 +32,14 @@ export declare const PopupUserPicker: React.ForwardRefExoticComponent<Omit<Pick<
32
32
  captureMenuScroll?: boolean;
33
33
  clearValueLabel?: string;
34
34
  closeMenuOnScroll?: boolean | EventListener;
35
- components?: import("@atlaskit/select").SelectComponentsConfig<import("../types").OptionData, boolean>;
36
- defaultValue?: import("../types").DefaultValue;
35
+ components?: import("@atlaskit/select").SelectComponentsConfig<import("..").OptionData, boolean>;
36
+ defaultValue?: import("..").DefaultValue;
37
37
  disableInput?: boolean;
38
38
  emailLabel?: string;
39
39
  fieldId: string | null;
40
40
  footer?: React.ReactNode;
41
41
  forwardedRef?: React.ForwardedRef<import("../types").UserPickerRef>;
42
- groupByTypeOrder?: NonNullable<import("../types").OptionData["type"]>[];
42
+ groupByTypeOrder?: NonNullable<import("..").OptionData["type"]>[];
43
43
  header?: React.ReactNode;
44
44
  height?: number | string;
45
45
  includeTeamsUpdates?: boolean;
@@ -47,11 +47,12 @@ export declare const PopupUserPicker: React.ForwardRefExoticComponent<Omit<Pick<
47
47
  isClearable?: boolean;
48
48
  isDisabled?: boolean;
49
49
  isFooterFocused?: boolean;
50
+ isHeaderFocused?: boolean;
50
51
  isInvalid?: boolean;
51
52
  isLoading?: boolean;
52
53
  isMulti?: boolean;
53
54
  isValidEmail?: import("./emailValidation").EmailValidator;
54
- loadOptions?: import("../types").LoadOptions;
55
+ loadOptions?: import("..").LoadOptions;
55
56
  loadOptionsErrorMessage?: (value: {
56
57
  inputValue: string;
57
58
  }) => React.ReactNode;
@@ -68,24 +69,25 @@ export declare const PopupUserPicker: React.ForwardRefExoticComponent<Omit<Pick<
68
69
  noOptionsMessage?: ((value: {
69
70
  inputValue: string;
70
71
  }) => string | null | React.ReactNode) | null | React.ReactNode;
71
- onBlur?: import("../types").OnPicker;
72
- onChange?: import("../types").OnChange;
73
- onClear?: import("../types").OnPicker;
74
- onClose?: import("../types").OnPicker;
75
- onFocus?: import("../types").OnPicker;
76
- onInputChange?: import("../types").OnInputChange;
72
+ onBlur?: import("..").OnPicker;
73
+ onChange?: import("..").OnChange;
74
+ onClear?: import("..").OnPicker;
75
+ onClose?: import("..").OnPicker;
76
+ onFocus?: import("..").OnPicker;
77
+ onInputChange?: import("..").OnInputChange;
77
78
  onKeyDown?: (event: React.KeyboardEvent) => void;
78
- onOpen?: import("../types").OnPicker;
79
- onSelection?: import("../types").OnOption;
79
+ onOpen?: import("..").OnPicker;
80
+ onSelection?: import("..").OnOption;
80
81
  open?: boolean;
81
82
  openMenuOnClick?: boolean;
82
- options?: import("../types").OptionData[];
83
+ options?: import("..").OptionData[];
83
84
  placeholder?: React.ReactNode;
84
85
  placeholderAvatar?: "person" | "team";
85
- popupSelectProps?: import("@atlaskit/select").PopupSelectProps<import("../types").OptionData>;
86
+ popupSelectProps?: import("@atlaskit/select").PopupSelectProps<import("..").OptionData>;
86
87
  required?: boolean;
87
88
  search?: string;
88
89
  setIsFooterFocused?: React.Dispatch<React.SetStateAction<boolean>>;
90
+ setIsHeaderFocused?: React.Dispatch<React.SetStateAction<boolean>>;
89
91
  showClearIndicator?: boolean;
90
92
  strategy?: "fixed" | "absolute";
91
93
  styles?: import("@atlaskit/select").StylesConfig;
@@ -93,7 +95,7 @@ export declare const PopupUserPicker: React.ForwardRefExoticComponent<Omit<Pick<
93
95
  suggestEmailsForDomain?: string;
94
96
  textFieldBackgroundColor?: boolean;
95
97
  UNSAFE_hasDraggableParentComponent?: boolean;
96
- value?: import("../types").Value;
98
+ value?: import("..").Value;
97
99
  width?: number | string;
98
100
  } & {
99
101
  boundariesElement?: import("../types").BoundariesElement;
@@ -102,19 +104,19 @@ export declare const PopupUserPicker: React.ForwardRefExoticComponent<Omit<Pick<
102
104
  popupTitle?: string;
103
105
  rootBoundary?: import("../types").RootBoundary;
104
106
  shouldFlip?: boolean;
105
- target: import("../types").Target;
107
+ target: import("..").Target;
106
108
  }, keyof import("@atlaskit/analytics-next").WithAnalyticsEventsProps>, never> & {
107
109
  placeholder?: React.ReactNode;
108
110
  isDisabled?: boolean | undefined;
109
111
  offset?: [number, number] | undefined;
110
- onChange?: import("../types").OnChange | undefined;
111
- onInputChange?: import("../types").OnInputChange | undefined;
112
- value?: import("../types").Value;
113
- appearance?: import("../types").Appearance | undefined;
112
+ onChange?: import("..").OnChange | undefined;
113
+ onInputChange?: import("..").OnInputChange | undefined;
114
+ value?: import("..").Value;
115
+ appearance?: import("..").Appearance | undefined;
114
116
  autoFocus?: boolean | undefined;
115
117
  captureMenuScroll?: boolean | undefined;
116
118
  closeMenuOnScroll?: (boolean | EventListener) | undefined;
117
- components?: import("@atlaskit/select").SelectComponentsConfig<import("../types").OptionData, boolean> | undefined;
119
+ components?: import("@atlaskit/select").SelectComponentsConfig<import("..").OptionData, boolean> | undefined;
118
120
  inputId?: string | undefined;
119
121
  isClearable?: boolean | undefined;
120
122
  isInvalid?: boolean | undefined;
@@ -128,11 +130,11 @@ export declare const PopupUserPicker: React.ForwardRefExoticComponent<Omit<Pick<
128
130
  noOptionsMessage?: React.ReactNode | ((value: {
129
131
  inputValue: string;
130
132
  }) => string | null | React.ReactNode);
131
- onBlur?: import("../types").OnPicker | undefined;
132
- onFocus?: import("../types").OnPicker | undefined;
133
+ onBlur?: import("..").OnPicker | undefined;
134
+ onFocus?: import("..").OnPicker | undefined;
133
135
  onKeyDown?: ((event: React.KeyboardEvent) => void) | undefined;
134
136
  openMenuOnClick?: boolean | undefined;
135
- options?: import("../types").OptionData[] | undefined;
137
+ options?: import("..").OptionData[] | undefined;
136
138
  styles?: import("@atlaskit/select").StylesConfig | undefined;
137
139
  required?: boolean | undefined;
138
140
  search?: string | undefined;
@@ -144,19 +146,20 @@ export declare const PopupUserPicker: React.ForwardRefExoticComponent<Omit<Pick<
144
146
  ariaLabelledBy?: string | undefined;
145
147
  ariaLive?: "polite" | "off" | "assertive" | undefined;
146
148
  clearValueLabel?: string | undefined;
147
- defaultValue?: import("../types").DefaultValue;
149
+ defaultValue?: import("..").DefaultValue;
148
150
  disableInput?: boolean | undefined;
149
151
  emailLabel?: string | undefined;
150
152
  fieldId?: string | null | undefined;
151
153
  footer?: React.ReactNode;
152
154
  forwardedRef?: React.ForwardedRef<import("../types").UserPickerRef> | undefined;
153
- groupByTypeOrder?: NonNullable<import("../types").OptionData["type"]>[] | undefined;
155
+ groupByTypeOrder?: NonNullable<import("..").OptionData["type"]>[] | undefined;
154
156
  header?: React.ReactNode;
155
157
  height?: number | string | undefined;
156
158
  includeTeamsUpdates?: boolean | undefined;
157
159
  isFooterFocused?: boolean | undefined;
160
+ isHeaderFocused?: boolean | undefined;
158
161
  isValidEmail?: import("./emailValidation").EmailValidator | undefined;
159
- loadOptions?: import("../types").LoadOptions | undefined;
162
+ loadOptions?: import("..").LoadOptions | undefined;
160
163
  loadOptionsErrorMessage?: ((value: {
161
164
  inputValue: string;
162
165
  }) => React.ReactNode) | undefined;
@@ -165,14 +168,15 @@ export declare const PopupUserPicker: React.ForwardRefExoticComponent<Omit<Pick<
165
168
  maxPickerHeight?: number | undefined;
166
169
  menuMinWidth?: number | undefined;
167
170
  noBorder?: boolean | undefined;
168
- onClear?: import("../types").OnPicker | undefined;
169
- onClose?: import("../types").OnPicker | undefined;
170
- onOpen?: import("../types").OnPicker | undefined;
171
- onSelection?: import("../types").OnOption | undefined;
171
+ onClear?: import("..").OnPicker | undefined;
172
+ onClose?: import("..").OnPicker | undefined;
173
+ onOpen?: import("..").OnPicker | undefined;
174
+ onSelection?: import("..").OnOption | undefined;
172
175
  open?: boolean | undefined;
173
176
  placeholderAvatar?: "person" | "team" | undefined;
174
- popupSelectProps?: import("@atlaskit/select").PopupSelectProps<import("../types").OptionData> | undefined;
177
+ popupSelectProps?: import("@atlaskit/select").PopupSelectProps<import("..").OptionData> | undefined;
175
178
  setIsFooterFocused?: React.Dispatch<React.SetStateAction<boolean>> | undefined;
179
+ setIsHeaderFocused?: React.Dispatch<React.SetStateAction<boolean>> | undefined;
176
180
  showClearIndicator?: boolean | undefined;
177
181
  strategy?: "fixed" | "absolute" | undefined;
178
182
  subtle?: boolean | undefined;
@@ -180,7 +184,7 @@ export declare const PopupUserPicker: React.ForwardRefExoticComponent<Omit<Pick<
180
184
  textFieldBackgroundColor?: boolean | undefined;
181
185
  UNSAFE_hasDraggableParentComponent?: boolean | undefined;
182
186
  width?: number | string | undefined;
183
- target?: import("../types").Target | undefined;
187
+ target?: import("..").Target | undefined;
184
188
  popupTitle?: string | undefined;
185
189
  placement?: import("@popperjs/core").Placement | undefined;
186
190
  rootBoundary?: import("../types").RootBoundary | undefined;
package/dist/types/components/UserPicker.d.ts CHANGED
@@ -14,7 +14,7 @@ export declare const UserPicker: React.ForwardRefExoticComponent<Pick<Omit<{
14
14
  addMoreMessage?: string;
15
15
  allowEmail?: boolean;
16
16
  anchor?: React.ComponentType<any>;
17
- appearance?: import("../types").Appearance;
17
+ appearance?: import("..").Appearance;
18
18
  ariaDescribedBy?: string;
19
19
  ariaLabel?: string;
20
20
  ariaLabelledBy?: string;
@@ -23,14 +23,14 @@ export declare const UserPicker: React.ForwardRefExoticComponent<Pick<Omit<{
23
23
  captureMenuScroll?: boolean;
24
24
  clearValueLabel?: string;
25
25
  closeMenuOnScroll?: boolean | EventListener;
26
- components?: import("@atlaskit/select").SelectComponentsConfig<import("../types").OptionData, boolean>;
27
- defaultValue?: import("../types").DefaultValue;
26
+ components?: import("@atlaskit/select").SelectComponentsConfig<import("..").OptionData, boolean>;
27
+ defaultValue?: import("..").DefaultValue;
28
28
  disableInput?: boolean;
29
29
  emailLabel?: string;
30
30
  fieldId: string | null;
31
31
  footer?: React.ReactNode;
32
32
  forwardedRef?: React.ForwardedRef<import("../types").UserPickerRef>;
33
- groupByTypeOrder?: NonNullable<import("../types").OptionData["type"]>[];
33
+ groupByTypeOrder?: NonNullable<import("..").OptionData["type"]>[];
34
34
  header?: React.ReactNode;
35
35
  height?: number | string;
36
36
  includeTeamsUpdates?: boolean;
@@ -38,11 +38,12 @@ export declare const UserPicker: React.ForwardRefExoticComponent<Pick<Omit<{
38
38
  isClearable?: boolean;
39
39
  isDisabled?: boolean;
40
40
  isFooterFocused?: boolean;
41
+ isHeaderFocused?: boolean;
41
42
  isInvalid?: boolean;
42
43
  isLoading?: boolean;
43
44
  isMulti?: boolean;
44
45
  isValidEmail?: import("./emailValidation").EmailValidator;
45
- loadOptions?: import("../types").LoadOptions;
46
+ loadOptions?: import("..").LoadOptions;
46
47
  loadOptionsErrorMessage?: (value: {
47
48
  inputValue: string;
48
49
  }) => React.ReactNode;
@@ -59,24 +60,25 @@ export declare const UserPicker: React.ForwardRefExoticComponent<Pick<Omit<{
59
60
  noOptionsMessage?: ((value: {
60
61
  inputValue: string;
61
62
  }) => string | null | React.ReactNode) | null | React.ReactNode;
62
- onBlur?: import("../types").OnPicker;
63
- onChange?: import("../types").OnChange;
64
- onClear?: import("../types").OnPicker;
65
- onClose?: import("../types").OnPicker;
66
- onFocus?: import("../types").OnPicker;
67
- onInputChange?: import("../types").OnInputChange;
63
+ onBlur?: import("..").OnPicker;
64
+ onChange?: import("..").OnChange;
65
+ onClear?: import("..").OnPicker;
66
+ onClose?: import("..").OnPicker;
67
+ onFocus?: import("..").OnPicker;
68
+ onInputChange?: import("..").OnInputChange;
68
69
  onKeyDown?: (event: React.KeyboardEvent) => void;
69
- onOpen?: import("../types").OnPicker;
70
- onSelection?: import("../types").OnOption;
70
+ onOpen?: import("..").OnPicker;
71
+ onSelection?: import("..").OnOption;
71
72
  open?: boolean;
72
73
  openMenuOnClick?: boolean;
73
- options?: import("../types").OptionData[];
74
+ options?: import("..").OptionData[];
74
75
  placeholder?: React.ReactNode;
75
76
  placeholderAvatar?: "person" | "team";
76
- popupSelectProps?: import("@atlaskit/select").PopupSelectProps<import("../types").OptionData>;
77
+ popupSelectProps?: import("@atlaskit/select").PopupSelectProps<import("..").OptionData>;
77
78
  required?: boolean;
78
79
  search?: string;
79
80
  setIsFooterFocused?: React.Dispatch<React.SetStateAction<boolean>>;
81
+ setIsHeaderFocused?: React.Dispatch<React.SetStateAction<boolean>>;
80
82
  showClearIndicator?: boolean;
81
83
  strategy?: "fixed" | "absolute";
82
84
  styles?: import("@atlaskit/select").StylesConfig;
@@ -84,9 +86,9 @@ export declare const UserPicker: React.ForwardRefExoticComponent<Pick<Omit<{
84
86
  suggestEmailsForDomain?: string;
85
87
  textFieldBackgroundColor?: boolean;
86
88
  UNSAFE_hasDraggableParentComponent?: boolean;
87
- value?: import("../types").Value;
89
+ value?: import("..").Value;
88
90
  width?: number | string;
89
- }, keyof import("@atlaskit/analytics-next").WithAnalyticsEventsProps>, "placeholder" | "isDisabled" | "onChange" | "onInputChange" | "value" | "appearance" | "autoFocus" | "captureMenuScroll" | "closeMenuOnScroll" | "components" | "inputId" | "isClearable" | "isInvalid" | "isLoading" | "menuIsOpen" | "menuPosition" | "menuPortalTarget" | "menuShouldBlockScroll" | "name" | "noOptionsMessage" | "onBlur" | "onFocus" | "onKeyDown" | "openMenuOnClick" | "options" | "styles" | "required" | "search" | "anchor" | "addMoreMessage" | "allowEmail" | "ariaDescribedBy" | "ariaLabel" | "ariaLabelledBy" | "ariaLive" | "clearValueLabel" | "defaultValue" | "disableInput" | "emailLabel" | "fieldId" | "footer" | "forwardedRef" | "groupByTypeOrder" | "header" | "height" | "includeTeamsUpdates" | "isFooterFocused" | "isValidEmail" | "loadOptions" | "loadOptionsErrorMessage" | "loadUserSource" | "maxOptions" | "maxPickerHeight" | "menuMinWidth" | "noBorder" | "onClear" | "onClose" | "onOpen" | "onSelection" | "open" | "placeholderAvatar" | "popupSelectProps" | "setIsFooterFocused" | "showClearIndicator" | "strategy" | "subtle" | "suggestEmailsForDomain" | "textFieldBackgroundColor" | "UNSAFE_hasDraggableParentComponent"> & {
91
+ }, keyof import("@atlaskit/analytics-next").WithAnalyticsEventsProps>, "placeholder" | "isDisabled" | "onChange" | "onInputChange" | "value" | "appearance" | "autoFocus" | "captureMenuScroll" | "closeMenuOnScroll" | "components" | "inputId" | "isClearable" | "isInvalid" | "isLoading" | "menuIsOpen" | "menuPosition" | "menuPortalTarget" | "menuShouldBlockScroll" | "name" | "noOptionsMessage" | "onBlur" | "onFocus" | "onKeyDown" | "openMenuOnClick" | "options" | "styles" | "required" | "search" | "anchor" | "addMoreMessage" | "allowEmail" | "ariaDescribedBy" | "ariaLabel" | "ariaLabelledBy" | "ariaLive" | "clearValueLabel" | "defaultValue" | "disableInput" | "emailLabel" | "fieldId" | "footer" | "forwardedRef" | "groupByTypeOrder" | "header" | "height" | "includeTeamsUpdates" | "isFooterFocused" | "isHeaderFocused" | "isValidEmail" | "loadOptions" | "loadOptionsErrorMessage" | "loadUserSource" | "maxOptions" | "maxPickerHeight" | "menuMinWidth" | "noBorder" | "onClear" | "onClose" | "onOpen" | "onSelection" | "open" | "placeholderAvatar" | "popupSelectProps" | "setIsFooterFocused" | "setIsHeaderFocused" | "showClearIndicator" | "strategy" | "subtle" | "suggestEmailsForDomain" | "textFieldBackgroundColor" | "UNSAFE_hasDraggableParentComponent"> & {
90
92
  isMulti?: boolean | undefined;
91
93
  width?: number | string | undefined;
92
94
  } & {} & React.RefAttributes<any>>;
package/dist/types/components/components.d.ts CHANGED
@@ -18,7 +18,7 @@ export declare const getComponents: import("memoize-one").MemoizedFn<(multi?: bo
18
18
  Option: import("react").FC<import("./Option").OptionProps> | import("react").ComponentType<import("packages/design-system/react-select/dist/types").OptionProps<OptionData, boolean, import("@atlaskit/select").GroupType<OptionData>>>;
19
19
  Group?: import("react").ComponentType<import("packages/design-system/react-select/dist/types").GroupProps<OptionData, boolean, import("@atlaskit/select").GroupType<OptionData>>> | undefined;
20
20
  ClearIndicator: typeof ClearIndicator | import("react").ComponentType<import("@atlaskit/select").ClearIndicatorProps<OptionData, boolean, import("@atlaskit/select").GroupType<OptionData>>> | null;
21
- Control: ((props: import("@atlaskit/select").ControlProps<any> & import("../types").UserPickerProps) => JSX.Element) | import("react").ComponentType<import("packages/design-system/react-select/dist/types").ControlProps<OptionData, boolean, import("@atlaskit/select").GroupType<OptionData>>>;
21
+ Control: ((props: import("@atlaskit/select").ControlProps<any> & import("..").UserPickerProps) => JSX.Element) | import("react").ComponentType<import("packages/design-system/react-select/dist/types").ControlProps<OptionData, boolean, import("@atlaskit/select").GroupType<OptionData>>>;
22
22
  DropdownIndicator: import("react").ComponentType<import("@atlaskit/select").DropdownIndicatorProps<OptionData, boolean, import("@atlaskit/select").GroupType<OptionData>>> | null;
23
23
  GroupHeading?: import("react").ComponentType<import("packages/design-system/react-select/dist/types").GroupHeadingProps<OptionData, boolean, import("@atlaskit/select").GroupType<OptionData>>> | undefined;
24
24
  IndicatorsContainer?: import("react").ComponentType<import("@atlaskit/select").IndicatorsContainerProps<OptionData, boolean, import("@atlaskit/select").GroupType<OptionData>>> | undefined;
package/dist/types/types.d.ts CHANGED
@@ -80,6 +80,8 @@ export type UserPickerProps = WithAnalyticsEventsProps & {
80
80
  isDisabled?: boolean;
81
81
  /** Checks if the footer is focused or not. This is needed to keep the menu open when the footer is focused */
82
82
  isFooterFocused?: boolean;
83
+ /** Checks if the header is focused or not. This is needed to keep the menu open when the header is focused */
84
+ isHeaderFocused?: boolean;
83
85
  /** Display the picker with a style to show the value is invalid */
84
86
  isInvalid?: boolean;
85
87
  /** Show the loading indicator. */
@@ -170,6 +172,8 @@ export type UserPickerProps = WithAnalyticsEventsProps & {
170
172
  search?: string;
171
173
  /** Sets if the footer is focused or not. This is needed to keep the menu open when the footer is focused */
172
174
  setIsFooterFocused?: React.Dispatch<React.SetStateAction<boolean>>;
175
+ /** Sets if the header is focused or not. This is needed to keep the menu open when the header is focused */
176
+ setIsHeaderFocused?: React.Dispatch<React.SetStateAction<boolean>>;
173
177
  /** Override default behavior and show the clear indicator. */
174
178
  showClearIndicator?: boolean;
175
179
  /** Positioning strategy for the popper element */
package/dist/types-ts4.5/components/AvatarItemOption.d.ts CHANGED
@@ -5,7 +5,7 @@
5
5
  import { type ReactNode } from 'react';
6
6
  import { jsx } from '@emotion/react';
7
7
  import { type LozengeProps } from '../types';
8
- export declare const textWrapper: (color?: string) => import("@emotion/react").SerializedStyles;
8
+ export declare const textWrapper: (color?: string) => import("@emotion/utils").SerializedStyles;
9
9
  export type AvatarItemOptionProps = {
10
10
  avatar: ReactNode;
11
11
  isDisabled?: boolean;
package/dist/types-ts4.5/components/BaseUserPicker.d.ts CHANGED
@@ -98,6 +98,7 @@ export declare const BaseUserPicker: React.ForwardRefExoticComponent<Pick<Omit<{
98
98
  isClearable?: boolean;
99
99
  isDisabled?: boolean;
100
100
  isFooterFocused?: boolean;
101
+ isHeaderFocused?: boolean;
101
102
  isInvalid?: boolean;
102
103
  isLoading?: boolean;
103
104
  isMulti?: boolean;
@@ -137,6 +138,7 @@ export declare const BaseUserPicker: React.ForwardRefExoticComponent<Pick<Omit<{
137
138
  required?: boolean;
138
139
  search?: string;
139
140
  setIsFooterFocused?: React.Dispatch<React.SetStateAction<boolean>>;
141
+ setIsHeaderFocused?: React.Dispatch<React.SetStateAction<boolean>>;
140
142
  showClearIndicator?: boolean;
141
143
  strategy?: "fixed" | "absolute";
142
144
  styles?: StylesConfig;
package/dist/types-ts4.5/components/ExternalUserOption/main.d.ts CHANGED
@@ -5,8 +5,8 @@
5
5
  import React from 'react';
6
6
  import { type WithAnalyticsEventsProps } from '@atlaskit/analytics-next';
7
7
  import { type ExternalUser } from '../../types';
8
- export declare const imageContainer: import("@emotion/react").SerializedStyles;
9
- export declare const emailDomainWrapper: import("@emotion/react").SerializedStyles;
8
+ export declare const imageContainer: import("@emotion/utils").SerializedStyles;
9
+ export declare const emailDomainWrapper: import("@emotion/utils").SerializedStyles;
10
10
  export type ExternalUserOptionProps = WithAnalyticsEventsProps & {
11
11
  isSelected: boolean;
12
12
  status?: string;
package/dist/types-ts4.5/components/GroupOption/main.d.ts CHANGED
@@ -5,7 +5,7 @@
5
5
  import React from 'react';
6
6
  import { jsx } from '@emotion/react';
7
7
  import { type Group } from '../../types';
8
- export declare const groupOptionIconWrapper: import("@emotion/react").SerializedStyles;
8
+ export declare const groupOptionIconWrapper: import("@emotion/utils").SerializedStyles;
9
9
  export type GroupOptionProps = {
10
10
  group: Group;
11
11
  includeTeamsUpdates?: boolean;
package/dist/types-ts4.5/components/PopupUserPicker.d.ts CHANGED
@@ -23,7 +23,7 @@ export declare const PopupUserPicker: React.ForwardRefExoticComponent<Omit<Pick<
23
23
  addMoreMessage?: string;
24
24
  allowEmail?: boolean;
25
25
  anchor?: React.ComponentType<any>;
26
- appearance?: import("../types").Appearance;
26
+ appearance?: import("..").Appearance;
27
27
  ariaDescribedBy?: string;
28
28
  ariaLabel?: string;
29
29
  ariaLabelledBy?: string;
@@ -32,14 +32,14 @@ export declare const PopupUserPicker: React.ForwardRefExoticComponent<Omit<Pick<
32
32
  captureMenuScroll?: boolean;
33
33
  clearValueLabel?: string;
34
34
  closeMenuOnScroll?: boolean | EventListener;
35
- components?: import("@atlaskit/select").SelectComponentsConfig<import("../types").OptionData, boolean>;
36
- defaultValue?: import("../types").DefaultValue;
35
+ components?: import("@atlaskit/select").SelectComponentsConfig<import("..").OptionData, boolean>;
36
+ defaultValue?: import("..").DefaultValue;
37
37
  disableInput?: boolean;
38
38
  emailLabel?: string;
39
39
  fieldId: string | null;
40
40
  footer?: React.ReactNode;
41
41
  forwardedRef?: React.ForwardedRef<import("../types").UserPickerRef>;
42
- groupByTypeOrder?: NonNullable<import("../types").OptionData["type"]>[];
42
+ groupByTypeOrder?: NonNullable<import("..").OptionData["type"]>[];
43
43
  header?: React.ReactNode;
44
44
  height?: number | string;
45
45
  includeTeamsUpdates?: boolean;
@@ -47,11 +47,12 @@ export declare const PopupUserPicker: React.ForwardRefExoticComponent<Omit<Pick<
47
47
  isClearable?: boolean;
48
48
  isDisabled?: boolean;
49
49
  isFooterFocused?: boolean;
50
+ isHeaderFocused?: boolean;
50
51
  isInvalid?: boolean;
51
52
  isLoading?: boolean;
52
53
  isMulti?: boolean;
53
54
  isValidEmail?: import("./emailValidation").EmailValidator;
54
- loadOptions?: import("../types").LoadOptions;
55
+ loadOptions?: import("..").LoadOptions;
55
56
  loadOptionsErrorMessage?: (value: {
56
57
  inputValue: string;
57
58
  }) => React.ReactNode;
@@ -68,24 +69,25 @@ export declare const PopupUserPicker: React.ForwardRefExoticComponent<Omit<Pick<
68
69
  noOptionsMessage?: ((value: {
69
70
  inputValue: string;
70
71
  }) => string | null | React.ReactNode) | null | React.ReactNode;
71
- onBlur?: import("../types").OnPicker;
72
- onChange?: import("../types").OnChange;
73
- onClear?: import("../types").OnPicker;
74
- onClose?: import("../types").OnPicker;
75
- onFocus?: import("../types").OnPicker;
76
- onInputChange?: import("../types").OnInputChange;
72
+ onBlur?: import("..").OnPicker;
73
+ onChange?: import("..").OnChange;
74
+ onClear?: import("..").OnPicker;
75
+ onClose?: import("..").OnPicker;
76
+ onFocus?: import("..").OnPicker;
77
+ onInputChange?: import("..").OnInputChange;
77
78
  onKeyDown?: (event: React.KeyboardEvent) => void;
78
- onOpen?: import("../types").OnPicker;
79
- onSelection?: import("../types").OnOption;
79
+ onOpen?: import("..").OnPicker;
80
+ onSelection?: import("..").OnOption;
80
81
  open?: boolean;
81
82
  openMenuOnClick?: boolean;
82
- options?: import("../types").OptionData[];
83
+ options?: import("..").OptionData[];
83
84
  placeholder?: React.ReactNode;
84
85
  placeholderAvatar?: "person" | "team";
85
- popupSelectProps?: import("@atlaskit/select").PopupSelectProps<import("../types").OptionData>;
86
+ popupSelectProps?: import("@atlaskit/select").PopupSelectProps<import("..").OptionData>;
86
87
  required?: boolean;
87
88
  search?: string;
88
89
  setIsFooterFocused?: React.Dispatch<React.SetStateAction<boolean>>;
90
+ setIsHeaderFocused?: React.Dispatch<React.SetStateAction<boolean>>;
89
91
  showClearIndicator?: boolean;
90
92
  strategy?: "fixed" | "absolute";
91
93
  styles?: import("@atlaskit/select").StylesConfig;
@@ -93,7 +95,7 @@ export declare const PopupUserPicker: React.ForwardRefExoticComponent<Omit<Pick<
93
95
  suggestEmailsForDomain?: string;
94
96
  textFieldBackgroundColor?: boolean;
95
97
  UNSAFE_hasDraggableParentComponent?: boolean;
96
- value?: import("../types").Value;
98
+ value?: import("..").Value;
97
99
  width?: number | string;
98
100
  } & {
99
101
  boundariesElement?: import("../types").BoundariesElement;
@@ -105,7 +107,7 @@ export declare const PopupUserPicker: React.ForwardRefExoticComponent<Omit<Pick<
105
107
  popupTitle?: string;
106
108
  rootBoundary?: import("../types").RootBoundary;
107
109
  shouldFlip?: boolean;
108
- target: import("../types").Target;
110
+ target: import("..").Target;
109
111
  }, keyof import("@atlaskit/analytics-next").WithAnalyticsEventsProps>, never> & {
110
112
  placeholder?: React.ReactNode;
111
113
  isDisabled?: boolean | undefined;
@@ -113,14 +115,14 @@ export declare const PopupUserPicker: React.ForwardRefExoticComponent<Omit<Pick<
113
115
  number,
114
116
  number
115
117
  ] | undefined;
116
- onChange?: import("../types").OnChange | undefined;
117
- onInputChange?: import("../types").OnInputChange | undefined;
118
- value?: import("../types").Value;
119
- appearance?: import("../types").Appearance | undefined;
118
+ onChange?: import("..").OnChange | undefined;
119
+ onInputChange?: import("..").OnInputChange | undefined;
120
+ value?: import("..").Value;
121
+ appearance?: import("..").Appearance | undefined;
120
122
  autoFocus?: boolean | undefined;
121
123
  captureMenuScroll?: boolean | undefined;
122
124
  closeMenuOnScroll?: (boolean | EventListener) | undefined;
123
- components?: import("@atlaskit/select").SelectComponentsConfig<import("../types").OptionData, boolean> | undefined;
125
+ components?: import("@atlaskit/select").SelectComponentsConfig<import("..").OptionData, boolean> | undefined;
124
126
  inputId?: string | undefined;
125
127
  isClearable?: boolean | undefined;
126
128
  isInvalid?: boolean | undefined;
@@ -134,11 +136,11 @@ export declare const PopupUserPicker: React.ForwardRefExoticComponent<Omit<Pick<
134
136
  noOptionsMessage?: React.ReactNode | ((value: {
135
137
  inputValue: string;
136
138
  }) => string | null | React.ReactNode);
137
- onBlur?: import("../types").OnPicker | undefined;
138
- onFocus?: import("../types").OnPicker | undefined;
139
+ onBlur?: import("..").OnPicker | undefined;
140
+ onFocus?: import("..").OnPicker | undefined;
139
141
  onKeyDown?: ((event: React.KeyboardEvent) => void) | undefined;
140
142
  openMenuOnClick?: boolean | undefined;
141
- options?: import("../types").OptionData[] | undefined;
143
+ options?: import("..").OptionData[] | undefined;
142
144
  styles?: import("@atlaskit/select").StylesConfig | undefined;
143
145
  required?: boolean | undefined;
144
146
  search?: string | undefined;
@@ -150,19 +152,20 @@ export declare const PopupUserPicker: React.ForwardRefExoticComponent<Omit<Pick<
150
152
  ariaLabelledBy?: string | undefined;
151
153
  ariaLive?: "polite" | "off" | "assertive" | undefined;
152
154
  clearValueLabel?: string | undefined;
153
- defaultValue?: import("../types").DefaultValue;
155
+ defaultValue?: import("..").DefaultValue;
154
156
  disableInput?: boolean | undefined;
155
157
  emailLabel?: string | undefined;
156
158
  fieldId?: string | null | undefined;
157
159
  footer?: React.ReactNode;
158
160
  forwardedRef?: React.ForwardedRef<import("../types").UserPickerRef> | undefined;
159
- groupByTypeOrder?: NonNullable<import("../types").OptionData["type"]>[] | undefined;
161
+ groupByTypeOrder?: NonNullable<import("..").OptionData["type"]>[] | undefined;
160
162
  header?: React.ReactNode;
161
163
  height?: number | string | undefined;
162
164
  includeTeamsUpdates?: boolean | undefined;
163
165
  isFooterFocused?: boolean | undefined;
166
+ isHeaderFocused?: boolean | undefined;
164
167
  isValidEmail?: import("./emailValidation").EmailValidator | undefined;
165
- loadOptions?: import("../types").LoadOptions | undefined;
168
+ loadOptions?: import("..").LoadOptions | undefined;
166
169
  loadOptionsErrorMessage?: ((value: {
167
170
  inputValue: string;
168
171
  }) => React.ReactNode) | undefined;
@@ -171,14 +174,15 @@ export declare const PopupUserPicker: React.ForwardRefExoticComponent<Omit<Pick<
171
174
  maxPickerHeight?: number | undefined;
172
175
  menuMinWidth?: number | undefined;
173
176
  noBorder?: boolean | undefined;
174
- onClear?: import("../types").OnPicker | undefined;
175
- onClose?: import("../types").OnPicker | undefined;
176
- onOpen?: import("../types").OnPicker | undefined;
177
- onSelection?: import("../types").OnOption | undefined;
177
+ onClear?: import("..").OnPicker | undefined;
178
+ onClose?: import("..").OnPicker | undefined;
179
+ onOpen?: import("..").OnPicker | undefined;
180
+ onSelection?: import("..").OnOption | undefined;
178
181
  open?: boolean | undefined;
179
182
  placeholderAvatar?: "person" | "team" | undefined;
180
- popupSelectProps?: import("@atlaskit/select").PopupSelectProps<import("../types").OptionData> | undefined;
183
+ popupSelectProps?: import("@atlaskit/select").PopupSelectProps<import("..").OptionData> | undefined;
181
184
  setIsFooterFocused?: React.Dispatch<React.SetStateAction<boolean>> | undefined;
185
+ setIsHeaderFocused?: React.Dispatch<React.SetStateAction<boolean>> | undefined;
182
186
  showClearIndicator?: boolean | undefined;
183
187
  strategy?: "fixed" | "absolute" | undefined;
184
188
  subtle?: boolean | undefined;
@@ -186,7 +190,7 @@ export declare const PopupUserPicker: React.ForwardRefExoticComponent<Omit<Pick<
186
190
  textFieldBackgroundColor?: boolean | undefined;
187
191
  UNSAFE_hasDraggableParentComponent?: boolean | undefined;
188
192
  width?: number | string | undefined;
189
- target?: import("../types").Target | undefined;
193
+ target?: import("..").Target | undefined;
190
194
  popupTitle?: string | undefined;
191
195
  placement?: import("@popperjs/core").Placement | undefined;
192
196
  rootBoundary?: import("../types").RootBoundary | undefined;
package/dist/types-ts4.5/components/UserPicker.d.ts CHANGED
@@ -14,7 +14,7 @@ export declare const UserPicker: React.ForwardRefExoticComponent<Pick<Omit<{
14
14
  addMoreMessage?: string;
15
15
  allowEmail?: boolean;
16
16
  anchor?: React.ComponentType<any>;
17
- appearance?: import("../types").Appearance;
17
+ appearance?: import("..").Appearance;
18
18
  ariaDescribedBy?: string;
19
19
  ariaLabel?: string;
20
20
  ariaLabelledBy?: string;
@@ -23,14 +23,14 @@ export declare const UserPicker: React.ForwardRefExoticComponent<Pick<Omit<{
23
23
  captureMenuScroll?: boolean;
24
24
  clearValueLabel?: string;
25
25
  closeMenuOnScroll?: boolean | EventListener;
26
- components?: import("@atlaskit/select").SelectComponentsConfig<import("../types").OptionData, boolean>;
27
- defaultValue?: import("../types").DefaultValue;
26
+ components?: import("@atlaskit/select").SelectComponentsConfig<import("..").OptionData, boolean>;
27
+ defaultValue?: import("..").DefaultValue;
28
28
  disableInput?: boolean;
29
29
  emailLabel?: string;
30
30
  fieldId: string | null;
31
31
  footer?: React.ReactNode;
32
32
  forwardedRef?: React.ForwardedRef<import("../types").UserPickerRef>;
33
- groupByTypeOrder?: NonNullable<import("../types").OptionData["type"]>[];
33
+ groupByTypeOrder?: NonNullable<import("..").OptionData["type"]>[];
34
34
  header?: React.ReactNode;
35
35
  height?: number | string;
36
36
  includeTeamsUpdates?: boolean;
@@ -38,11 +38,12 @@ export declare const UserPicker: React.ForwardRefExoticComponent<Pick<Omit<{
38
38
  isClearable?: boolean;
39
39
  isDisabled?: boolean;
40
40
  isFooterFocused?: boolean;
41
+ isHeaderFocused?: boolean;
41
42
  isInvalid?: boolean;
42
43
  isLoading?: boolean;
43
44
  isMulti?: boolean;
44
45
  isValidEmail?: import("./emailValidation").EmailValidator;
45
- loadOptions?: import("../types").LoadOptions;
46
+ loadOptions?: import("..").LoadOptions;
46
47
  loadOptionsErrorMessage?: (value: {
47
48
  inputValue: string;
48
49
  }) => React.ReactNode;
@@ -59,24 +60,25 @@ export declare const UserPicker: React.ForwardRefExoticComponent<Pick<Omit<{
59
60
  noOptionsMessage?: ((value: {
60
61
  inputValue: string;
61
62
  }) => string | null | React.ReactNode) | null | React.ReactNode;
62
- onBlur?: import("../types").OnPicker;
63
- onChange?: import("../types").OnChange;
64
- onClear?: import("../types").OnPicker;
65
- onClose?: import("../types").OnPicker;
66
- onFocus?: import("../types").OnPicker;
67
- onInputChange?: import("../types").OnInputChange;
63
+ onBlur?: import("..").OnPicker;
64
+ onChange?: import("..").OnChange;
65
+ onClear?: import("..").OnPicker;
66
+ onClose?: import("..").OnPicker;
67
+ onFocus?: import("..").OnPicker;
68
+ onInputChange?: import("..").OnInputChange;
68
69
  onKeyDown?: (event: React.KeyboardEvent) => void;
69
- onOpen?: import("../types").OnPicker;
70
- onSelection?: import("../types").OnOption;
70
+ onOpen?: import("..").OnPicker;
71
+ onSelection?: import("..").OnOption;
71
72
  open?: boolean;
72
73
  openMenuOnClick?: boolean;
73
- options?: import("../types").OptionData[];
74
+ options?: import("..").OptionData[];
74
75
  placeholder?: React.ReactNode;
75
76
  placeholderAvatar?: "person" | "team";
76
- popupSelectProps?: import("@atlaskit/select").PopupSelectProps<import("../types").OptionData>;
77
+ popupSelectProps?: import("@atlaskit/select").PopupSelectProps<import("..").OptionData>;
77
78
  required?: boolean;
78
79
  search?: string;
79
80
  setIsFooterFocused?: React.Dispatch<React.SetStateAction<boolean>>;
81
+ setIsHeaderFocused?: React.Dispatch<React.SetStateAction<boolean>>;
80
82
  showClearIndicator?: boolean;
81
83
  strategy?: "fixed" | "absolute";
82
84
  styles?: import("@atlaskit/select").StylesConfig;
@@ -84,9 +86,9 @@ export declare const UserPicker: React.ForwardRefExoticComponent<Pick<Omit<{
84
86
  suggestEmailsForDomain?: string;
85
87
  textFieldBackgroundColor?: boolean;
86
88
  UNSAFE_hasDraggableParentComponent?: boolean;
87
- value?: import("../types").Value;
89
+ value?: import("..").Value;
88
90
  width?: number | string;
89
- }, keyof import("@atlaskit/analytics-next").WithAnalyticsEventsProps>, "placeholder" | "isDisabled" | "onChange" | "onInputChange" | "value" | "appearance" | "autoFocus" | "captureMenuScroll" | "closeMenuOnScroll" | "components" | "inputId" | "isClearable" | "isInvalid" | "isLoading" | "menuIsOpen" | "menuPosition" | "menuPortalTarget" | "menuShouldBlockScroll" | "name" | "noOptionsMessage" | "onBlur" | "onFocus" | "onKeyDown" | "openMenuOnClick" | "options" | "styles" | "required" | "search" | "anchor" | "addMoreMessage" | "allowEmail" | "ariaDescribedBy" | "ariaLabel" | "ariaLabelledBy" | "ariaLive" | "clearValueLabel" | "defaultValue" | "disableInput" | "emailLabel" | "fieldId" | "footer" | "forwardedRef" | "groupByTypeOrder" | "header" | "height" | "includeTeamsUpdates" | "isFooterFocused" | "isValidEmail" | "loadOptions" | "loadOptionsErrorMessage" | "loadUserSource" | "maxOptions" | "maxPickerHeight" | "menuMinWidth" | "noBorder" | "onClear" | "onClose" | "onOpen" | "onSelection" | "open" | "placeholderAvatar" | "popupSelectProps" | "setIsFooterFocused" | "showClearIndicator" | "strategy" | "subtle" | "suggestEmailsForDomain" | "textFieldBackgroundColor" | "UNSAFE_hasDraggableParentComponent"> & {
91
+ }, keyof import("@atlaskit/analytics-next").WithAnalyticsEventsProps>, "placeholder" | "isDisabled" | "onChange" | "onInputChange" | "value" | "appearance" | "autoFocus" | "captureMenuScroll" | "closeMenuOnScroll" | "components" | "inputId" | "isClearable" | "isInvalid" | "isLoading" | "menuIsOpen" | "menuPosition" | "menuPortalTarget" | "menuShouldBlockScroll" | "name" | "noOptionsMessage" | "onBlur" | "onFocus" | "onKeyDown" | "openMenuOnClick" | "options" | "styles" | "required" | "search" | "anchor" | "addMoreMessage" | "allowEmail" | "ariaDescribedBy" | "ariaLabel" | "ariaLabelledBy" | "ariaLive" | "clearValueLabel" | "defaultValue" | "disableInput" | "emailLabel" | "fieldId" | "footer" | "forwardedRef" | "groupByTypeOrder" | "header" | "height" | "includeTeamsUpdates" | "isFooterFocused" | "isHeaderFocused" | "isValidEmail" | "loadOptions" | "loadOptionsErrorMessage" | "loadUserSource" | "maxOptions" | "maxPickerHeight" | "menuMinWidth" | "noBorder" | "onClear" | "onClose" | "onOpen" | "onSelection" | "open" | "placeholderAvatar" | "popupSelectProps" | "setIsFooterFocused" | "setIsHeaderFocused" | "showClearIndicator" | "strategy" | "subtle" | "suggestEmailsForDomain" | "textFieldBackgroundColor" | "UNSAFE_hasDraggableParentComponent"> & {
90
92
  isMulti?: boolean | undefined;
91
93
  width?: number | string | undefined;
92
94
  } & {} & React.RefAttributes<any>>;
package/dist/types-ts4.5/components/components.d.ts CHANGED
@@ -18,7 +18,7 @@ export declare const getComponents: import("memoize-one").MemoizedFn<(multi?: bo
18
18
  Option: import("react").FC<import("./Option").OptionProps> | import("react").ComponentType<import("packages/design-system/react-select/dist/types").OptionProps<OptionData, boolean, import("@atlaskit/select").GroupType<OptionData>>>;
19
19
  Group?: import("react").ComponentType<import("packages/design-system/react-select/dist/types").GroupProps<OptionData, boolean, import("@atlaskit/select").GroupType<OptionData>>> | undefined;
20
20
  ClearIndicator: typeof ClearIndicator | import("react").ComponentType<import("@atlaskit/select").ClearIndicatorProps<OptionData, boolean, import("@atlaskit/select").GroupType<OptionData>>> | null;
21
- Control: ((props: import("@atlaskit/select").ControlProps<any> & import("../types").UserPickerProps) => JSX.Element) | import("react").ComponentType<import("packages/design-system/react-select/dist/types").ControlProps<OptionData, boolean, import("@atlaskit/select").GroupType<OptionData>>>;
21
+ Control: ((props: import("@atlaskit/select").ControlProps<any> & import("..").UserPickerProps) => JSX.Element) | import("react").ComponentType<import("packages/design-system/react-select/dist/types").ControlProps<OptionData, boolean, import("@atlaskit/select").GroupType<OptionData>>>;
22
22
  DropdownIndicator: import("react").ComponentType<import("@atlaskit/select").DropdownIndicatorProps<OptionData, boolean, import("@atlaskit/select").GroupType<OptionData>>> | null;
23
23
  GroupHeading?: import("react").ComponentType<import("packages/design-system/react-select/dist/types").GroupHeadingProps<OptionData, boolean, import("@atlaskit/select").GroupType<OptionData>>> | undefined;
24
24
  IndicatorsContainer?: import("react").ComponentType<import("@atlaskit/select").IndicatorsContainerProps<OptionData, boolean, import("@atlaskit/select").GroupType<OptionData>>> | undefined;
package/dist/types-ts4.5/types.d.ts CHANGED
@@ -80,6 +80,8 @@ export type UserPickerProps = WithAnalyticsEventsProps & {
80
80
  isDisabled?: boolean;
81
81
  /** Checks if the footer is focused or not. This is needed to keep the menu open when the footer is focused */
82
82
  isFooterFocused?: boolean;
83
+ /** Checks if the header is focused or not. This is needed to keep the menu open when the header is focused */
84
+ isHeaderFocused?: boolean;
83
85
  /** Display the picker with a style to show the value is invalid */
84
86
  isInvalid?: boolean;
85
87
  /** Show the loading indicator. */
@@ -170,6 +172,8 @@ export type UserPickerProps = WithAnalyticsEventsProps & {
170
172
  search?: string;
171
173
  /** Sets if the footer is focused or not. This is needed to keep the menu open when the footer is focused */
172
174
  setIsFooterFocused?: React.Dispatch<React.SetStateAction<boolean>>;
175
+ /** Sets if the header is focused or not. This is needed to keep the menu open when the header is focused */
176
+ setIsHeaderFocused?: React.Dispatch<React.SetStateAction<boolean>>;
173
177
  /** Override default behavior and show the clear indicator. */
174
178
  showClearIndicator?: boolean;
175
179
  /** Positioning strategy for the popper element */
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@atlaskit/user-picker",
3
- "version": "11.21.1",
3
+ "version": "11.22.0",
4
4
  "description": "Fabric component for display a dropdown to select a user from",
5
5
  "publishConfig": {
6
6
  "registry": "https://registry.npmjs.org/"
@@ -46,9 +46,9 @@
46
46
  "@atlaskit/analytics-next": "^11.1.0",
47
47
  "@atlaskit/avatar": "^25.7.0",
48
48
  "@atlaskit/feature-gate-js-client": "^5.5.0",
49
- "@atlaskit/icon": "^30.0.0",
49
+ "@atlaskit/icon": "^31.0.0",
50
50
  "@atlaskit/logo": "^19.10.0",
51
- "@atlaskit/lozenge": "^13.3.0",
51
+ "@atlaskit/lozenge": "^13.4.0",
52
52
  "@atlaskit/people-teams-ui-public": "^3.7.0",
53
53
  "@atlaskit/platform-feature-flags": "^1.1.0",
54
54
  "@atlaskit/popper": "^7.1.0",
@@ -77,8 +77,8 @@
77
77
  "@af/search-test-utils": "workspace:^",
78
78
  "@af/visual-regression": "workspace:^",
79
79
  "@atlaskit/elements-test-helpers": "workspace:^",
80
- "@atlaskit/heading": "^5.2.0",
81
- "@atlassian/a11y-jest-testing": "^0.8.0",
80
+ "@atlaskit/heading": "^5.3.0",
81
+ "@atlassian/a11y-jest-testing": "^0.10.0",
82
82
  "@atlassian/feature-flags-test-utils": "^1.0.0",
83
83
  "@emotion/styled": "^11.0.0",
84
84
  "@testing-library/dom": "^10.1.0",