@jetbrains/ring-ui 5.0.148 → 5.0.150

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 (63) hide show
  1. package/components/select/select.js +1 -1
  2. package/components/tags-input/tags-input.d.ts +2 -0
  3. package/components/tags-input/tags-input.js +2 -1
  4. package/dist/_helpers/card.js +5 -5
  5. package/dist/analytics/analytics__custom-plugin.js +2 -6
  6. package/dist/analytics/analytics__ga-plugin.js +1 -2
  7. package/dist/auth/auth__core.js +63 -100
  8. package/dist/auth/iframe-flow.js +1 -2
  9. package/dist/auth/landing.js +1 -2
  10. package/dist/auth/request-builder.js +1 -2
  11. package/dist/auth/token-validator.js +2 -6
  12. package/dist/auth/window-flow.js +2 -4
  13. package/dist/caret/caret.js +13 -16
  14. package/dist/clipboard/clipboard-fallback.js +3 -3
  15. package/dist/data-list/data-list.js +3 -6
  16. package/dist/data-list/item.js +1 -1
  17. package/dist/date-picker/date-input.js +5 -6
  18. package/dist/date-picker/date-picker.js +6 -7
  19. package/dist/date-picker/date-popup.js +2 -3
  20. package/dist/dialog-ng/dialog-ng.js +2 -3
  21. package/dist/dropdown/dropdown.js +2 -4
  22. package/dist/editable-heading/editable-heading.js +2 -2
  23. package/dist/global/focus-sensor-hoc.js +8 -13
  24. package/dist/global/normalize-indent.js +2 -2
  25. package/dist/global/react-render-adapter.js +1 -4
  26. package/dist/global/rerender-hoc.js +1 -2
  27. package/dist/global/schedule-raf.js +1 -2
  28. package/dist/header/profile.js +6 -6
  29. package/dist/header/smart-profile.js +2 -3
  30. package/dist/header/smart-services.js +3 -6
  31. package/dist/http/http.js +7 -13
  32. package/dist/hub-source/hub-source__user.js +2 -3
  33. package/dist/input/input.js +4 -7
  34. package/dist/island/content.js +1 -2
  35. package/dist/list/list__users-groups-source.js +7 -10
  36. package/dist/loader/loader.js +1 -2
  37. package/dist/loader/loader__core.js +1 -2
  38. package/dist/markdown/code.js +2 -3
  39. package/dist/message/message.js +6 -8
  40. package/dist/old-browsers-message/white-list.js +2 -2
  41. package/dist/pager/pager.js +12 -16
  42. package/dist/permissions/permissions__cache.js +1 -1
  43. package/dist/popup/popup.js +1 -2
  44. package/dist/popup/position.js +1 -1
  45. package/dist/query-assist/query-assist.js +34 -46
  46. package/dist/select/select.js +11 -18
  47. package/dist/select/select__popup.js +3 -10
  48. package/dist/select-ng/select-ng.js +1 -2
  49. package/dist/select-ng/select-ng__lazy.js +1 -2
  50. package/dist/shortcuts/core.js +1 -2
  51. package/dist/style.css +1 -1
  52. package/dist/tab-trap/tab-trap.js +2 -4
  53. package/dist/table/header.js +2 -2
  54. package/dist/table/multitable.js +7 -14
  55. package/dist/table/row-with-focus-sensor.js +4 -8
  56. package/dist/table/selection-shortcuts-hoc.js +11 -11
  57. package/dist/tabs/collapsible-tabs.js +1 -1
  58. package/dist/tag/tag.js +1 -2
  59. package/dist/tags-input/tags-input.d.ts +2 -0
  60. package/dist/tags-input/tags-input.js +16 -24
  61. package/dist/tooltip/tooltip.js +2 -4
  62. package/dist/user-agreement/user-agreement.js +8 -8
  63. package/package.json +34 -34
@@ -91,16 +91,13 @@ class ListUsersGroupsSource extends HubSourceUsersGroups {
91
91
  });
92
92
  }
93
93
  if (filter !== Filter.GROUPS) {
94
- users.forEach(user => {
95
- var _user$profile$avatar;
96
- return items.push({
97
- ...user,
98
- key: user.id,
99
- label: user.name,
100
- avatar: user.profile ? (_user$profile$avatar = user.profile.avatar) === null || _user$profile$avatar === void 0 ? void 0 : _user$profile$avatar.url : null,
101
- description: user.login
102
- });
103
- });
94
+ users.forEach(user => items.push({
95
+ ...user,
96
+ key: user.id,
97
+ label: user.name,
98
+ avatar: user.profile ? user.profile.avatar?.url : null,
99
+ description: user.login
100
+ }));
104
101
  }
105
102
  if (filter === Filter.ALL) {
106
103
  items.push({
@@ -31,8 +31,7 @@ class Loader extends PureComponent {
31
31
  }
32
32
  }
33
33
  componentWillUnmount() {
34
- var _this$loader;
35
- (_this$loader = this.loader) === null || _this$loader === void 0 ? void 0 : _this$loader.destroy();
34
+ this.loader?.destroy();
36
35
  }
37
36
  loader;
38
37
  initLoader = el => {
@@ -108,7 +108,6 @@ class LoaderCore {
108
108
  tick;
109
109
  isRunning;
110
110
  constructor(containerNode, props) {
111
- var _this$ctx;
112
111
  this.props = Object.assign({}, LoaderCore.defaultProps, props);
113
112
  this.canvas = document.createElement('canvas');
114
113
  this.canvas.dataset.test = 'ring-loader';
@@ -127,7 +126,7 @@ class LoaderCore {
127
126
  this.canvas.style.width = `${this.props.size}px`;
128
127
  this.canvas.style.height = `${this.props.size}px`;
129
128
  this.ctx = this.canvas.getContext('2d');
130
- (_this$ctx = this.ctx) === null || _this$ctx === void 0 ? void 0 : _this$ctx.scale(pixelRatio, pixelRatio);
129
+ this.ctx?.scale(pixelRatio, pixelRatio);
131
130
  this.height = this.props.size;
132
131
  this.width = this.props.size;
133
132
  this.particles = [];
@@ -8,7 +8,6 @@ import '../global/trivial-template-tag.js';
8
8
  import '../global/memoize.js';
9
9
 
10
10
  const MarkdownCode = _ref => {
11
- var _className$split$find;
12
11
  let {
13
12
  children,
14
13
  language,
@@ -16,11 +15,11 @@ const MarkdownCode = _ref => {
16
15
  className
17
16
  } = _ref;
18
17
  // Hack for updated react-markdown RG-2193
19
- const lang = language !== null && language !== void 0 ? language : className === null || className === void 0 ? void 0 : (_className$split$find = className.split(' ').find(name => name.startsWith('language-'))) === null || _className$split$find === void 0 ? void 0 : _className$split$find.replace('language-', '');
18
+ const lang = language !== null && language !== void 0 ? language : className?.split(' ').find(name => name.startsWith('language-'))?.replace('language-', '');
20
19
  return /*#__PURE__*/React.createElement(Code, {
21
20
  language: lang,
22
21
  className: className,
23
- code: (children === null || children === void 0 ? void 0 : children.join('')) || '',
22
+ code: children?.join('') || '',
24
23
  inline: inline
25
24
  });
26
25
  };
@@ -120,12 +120,10 @@ class Message extends Component {
120
120
  popup;
121
121
  node;
122
122
  popupRef = el => {
123
- var _this$popup;
124
123
  this.popup = el;
125
- this.node = (_this$popup = this.popup) === null || _this$popup === void 0 ? void 0 : _this$popup.node;
124
+ this.node = this.popup?.node;
126
125
  };
127
126
  getTailOffset() {
128
- var _this$popup2;
129
127
  const DEFAULT_OFFSET = 32;
130
128
  const {
131
129
  popupProps
@@ -133,14 +131,14 @@ class Message extends Component {
133
131
  if (this.props.tailOffset != null) {
134
132
  return this.props.tailOffset;
135
133
  }
136
- const anchor = (popupProps === null || popupProps === void 0 ? void 0 : popupProps.anchorElement) || ((_this$popup2 = this.popup) === null || _this$popup2 === void 0 ? void 0 : _this$popup2.parent);
134
+ const anchor = popupProps?.anchorElement || this.popup?.parent;
137
135
  if (!anchor) {
138
136
  return DEFAULT_OFFSET;
139
137
  }
140
138
  const offset = Math.floor(anchor.offsetWidth / 2);
141
139
  const isOpenedToRight = this.state.direction != null && [Directions.TOP_RIGHT, Directions.BOTTOM_RIGHT].includes(this.state.direction);
142
- if (popupProps !== null && popupProps !== void 0 && popupProps.left && isOpenedToRight) {
143
- return offset - (popupProps === null || popupProps === void 0 ? void 0 : popupProps.left);
140
+ if (popupProps?.left && isOpenedToRight) {
141
+ return offset - popupProps?.left;
144
142
  }
145
143
  return offset;
146
144
  }
@@ -199,10 +197,10 @@ class Message extends Component {
199
197
  className: modules_8b837449.button,
200
198
  onClick: onClose,
201
199
  primary: true
202
- }, buttonProps), (_translations$gotIt = translations === null || translations === void 0 ? void 0 : translations.gotIt) !== null && _translations$gotIt !== void 0 ? _translations$gotIt : translate('gotIt')), onDismiss && /*#__PURE__*/React.createElement(Button, {
200
+ }, buttonProps), (_translations$gotIt = translations?.gotIt) !== null && _translations$gotIt !== void 0 ? _translations$gotIt : translate('gotIt')), onDismiss && /*#__PURE__*/React.createElement(Button, {
203
201
  onClick: onDismiss,
204
202
  text: true
205
- }, (_translations$dismiss = translations === null || translations === void 0 ? void 0 : translations.dismiss) !== null && _translations$dismiss !== void 0 ? _translations$dismiss : translate('dismiss'))));
203
+ }, (_translations$dismiss = translations?.dismiss) !== null && _translations$dismiss !== void 0 ? _translations$dismiss : translate('dismiss'))));
206
204
  });
207
205
  });
208
206
  }
@@ -5,11 +5,11 @@ const MAJOR_VERSION_INDEX = 0;
5
5
  /**
6
6
  * SUPPORTED_BROWSERS are defined by Babel plugin, see babel config
7
7
  */
8
- if (!["and_chr 114", "chrome 113", "chrome 112", "chrome 109", "edge 113", "edge 112", "firefox 113", "ios_saf 16.4", "ios_saf 16.3", "ios_saf 16.1", "opera 98", "safari 16.4", "samsung 20"]) {
8
+ if (!["and_chr 114", "and_uc 13.4", "chrome 114", "chrome 113", "chrome 109", "edge 114", "firefox 114", "ios_saf 16.5", "ios_saf 16.4", "ios_saf 16.3", "ios_saf 16.1", "opera 99", "safari 16.5", "samsung 21"]) {
9
9
  // eslint-disable-next-line no-console
10
10
  console.warn('Ring UI: no SUPPORTED_BROWSERS passed. Please check babel config.');
11
11
  }
12
- const SUPPORTED = ["and_chr 114", "chrome 113", "chrome 112", "chrome 109", "edge 113", "edge 112", "firefox 113", "ios_saf 16.4", "ios_saf 16.3", "ios_saf 16.1", "opera 98", "safari 16.4", "samsung 20"] || [];
12
+ const SUPPORTED = ["and_chr 114", "and_uc 13.4", "chrome 114", "chrome 113", "chrome 109", "edge 114", "firefox 114", "ios_saf 16.5", "ios_saf 16.4", "ios_saf 16.3", "ios_saf 16.1", "opera 99", "safari 16.5", "samsung 21"] || [];
13
13
  const WHITE_LISTED_BROWSERS = ['chrome', 'firefox', 'safari', 'edge'];
14
14
  const WHITE_LIST = SUPPORTED.reduce((acc, item) => {
15
15
  var _item$match;
@@ -115,10 +115,10 @@ class Pager extends PureComponent {
115
115
  translate
116
116
  } = this.context;
117
117
  const data = pageSizes.map(size => {
118
- var _this$props$translati, _this$props$translati2;
118
+ var _this$props$translati;
119
119
  return {
120
120
  key: size,
121
- label: `${size} ${(_this$props$translati = (_this$props$translati2 = this.props.translations) === null || _this$props$translati2 === void 0 ? void 0 : _this$props$translati2.perPage) !== null && _this$props$translati !== void 0 ? _this$props$translati : translate('perPage')}`
121
+ label: `${size} ${(_this$props$translati = this.props.translations?.perPage) !== null && _this$props$translati !== void 0 ? _this$props$translati : translate('perPage')}`
122
122
  };
123
123
  });
124
124
  const selected = data.find(it => it.key === pageSize);
@@ -144,9 +144,8 @@ class Pager extends PureComponent {
144
144
  currentPage
145
145
  } = this.props;
146
146
  if (currentPage !== 1) {
147
- var _this$props$onPageCha, _this$props;
148
147
  const prevPage = currentPage - 1;
149
- (_this$props$onPageCha = (_this$props = this.props).onPageChange) === null || _this$props$onPageCha === void 0 ? void 0 : _this$props$onPageCha.call(_this$props, prevPage);
148
+ this.props.onPageChange?.(prevPage);
150
149
  }
151
150
  };
152
151
  handleNextClick = () => {
@@ -157,15 +156,13 @@ class Pager extends PureComponent {
157
156
  const nextPage = currentPage + 1;
158
157
  const total = this.getTotalPages();
159
158
  if (currentPage !== total) {
160
- var _this$props$onPageCha2, _this$props2;
161
- (_this$props$onPageCha2 = (_this$props2 = this.props).onPageChange) === null || _this$props$onPageCha2 === void 0 ? void 0 : _this$props$onPageCha2.call(_this$props2, nextPage);
159
+ this.props.onPageChange?.(nextPage);
162
160
  } else if (this.props.openTotal) {
163
161
  onLoadPage(nextPage);
164
162
  }
165
163
  };
166
164
  handlePageChange = memoize(i => event => {
167
- var _this$props$onPageCha3, _this$props3;
168
- (_this$props$onPageCha3 = (_this$props3 = this.props).onPageChange) === null || _this$props$onPageCha3 === void 0 ? void 0 : _this$props$onPageCha3.call(_this$props3, i, event);
165
+ this.props.onPageChange?.(i, event);
169
166
  });
170
167
  handleLoadMore = memoize(i => () => {
171
168
  this.props.onLoadPage(i);
@@ -212,7 +209,7 @@ class Pager extends PureComponent {
212
209
  }));
213
210
  }
214
211
  getPagerLinks() {
215
- var _this$props$translati3, _this$props$translati4, _this$props$translati5, _this$props$translati6;
212
+ var _this$props$translati2, _this$props$translati3;
216
213
  const {
217
214
  translate
218
215
  } = this.context;
@@ -226,8 +223,8 @@ class Pager extends PureComponent {
226
223
  glyph: chevronLeftIcon,
227
224
  key: "icon"
228
225
  });
229
- const prevText = (_this$props$translati3 = (_this$props$translati4 = this.props.translations) === null || _this$props$translati4 === void 0 ? void 0 : _this$props$translati4.previousPage) !== null && _this$props$translati3 !== void 0 ? _this$props$translati3 : translate('previousPage');
230
- const nextText = (_this$props$translati5 = (_this$props$translati6 = this.props.translations) === null || _this$props$translati6 === void 0 ? void 0 : _this$props$translati6.nextPage) !== null && _this$props$translati5 !== void 0 ? _this$props$translati5 : translate('nextPage');
226
+ const prevText = (_this$props$translati2 = this.props.translations?.previousPage) !== null && _this$props$translati2 !== void 0 ? _this$props$translati2 : translate('previousPage');
227
+ const nextText = (_this$props$translati3 = this.props.translations?.nextPage) !== null && _this$props$translati3 !== void 0 ? _this$props$translati3 : translate('nextPage');
231
228
  const nextLinkContent = WrapText => [/*#__PURE__*/React.createElement("span", {
232
229
  key: "text"
233
230
  }, /*#__PURE__*/React.createElement(WrapText, null, nextText)), nextIcon];
@@ -266,7 +263,7 @@ class Pager extends PureComponent {
266
263
  return this.props.hrefFunc(page, pageSize);
267
264
  }
268
265
  getPagerContent() {
269
- var _this$props$translati7, _this$props$translati8, _this$props$translati9, _this$props$translati10;
266
+ var _this$props$translati4, _this$props$translati5;
270
267
  const {
271
268
  currentPage,
272
269
  visiblePagesLimit
@@ -276,8 +273,7 @@ class Pager extends PureComponent {
276
273
  translate
277
274
  } = this.context;
278
275
  if (totalPages < this.props.currentPage) {
279
- var _this$props$onPageCha4, _this$props4;
280
- (_this$props$onPageCha4 = (_this$props4 = this.props).onPageChange) === null || _this$props$onPageCha4 === void 0 ? void 0 : _this$props$onPageCha4.call(_this$props4, totalPages);
276
+ this.props.onPageChange?.(totalPages);
281
277
  }
282
278
  let start = 1;
283
279
  let end = totalPages;
@@ -305,10 +301,10 @@ class Pager extends PureComponent {
305
301
  buttons.push(this.getButton(i, i, i, i === currentPage));
306
302
  }
307
303
  const lastPageButtonAvailable = end < totalPages && !this.props.openTotal || this.props.openTotal && this.props.canLoadLastPageWithOpenTotal;
308
- return /*#__PURE__*/React.createElement("div", null, this.getPagerLinks(), /*#__PURE__*/React.createElement(ButtonToolbar, null, start > 1 && this.getButton(1, (_this$props$translati7 = (_this$props$translati8 = this.props.translations) === null || _this$props$translati8 === void 0 ? void 0 : _this$props$translati8.firstPage) !== null && _this$props$translati7 !== void 0 ? _this$props$translati7 : translate('firstPage')), /*#__PURE__*/React.createElement(ButtonGroup, null, start > 1 && this.getButton(start - 1, '...'), buttons, end < totalPages && this.getButton(end + 1, '...'), end === totalPages && this.props.openTotal && /*#__PURE__*/React.createElement(Button, _extends({
304
+ return /*#__PURE__*/React.createElement("div", null, this.getPagerLinks(), /*#__PURE__*/React.createElement(ButtonToolbar, null, start > 1 && this.getButton(1, (_this$props$translati4 = this.props.translations?.firstPage) !== null && _this$props$translati4 !== void 0 ? _this$props$translati4 : translate('firstPage')), /*#__PURE__*/React.createElement(ButtonGroup, null, start > 1 && this.getButton(start - 1, '...'), buttons, end < totalPages && this.getButton(end + 1, '...'), end === totalPages && this.props.openTotal && /*#__PURE__*/React.createElement(Button, _extends({
309
305
  href: this.generateHref(end + 1),
310
306
  disabled: this.props.loader
311
- }, this.getClickProps(this.handleLoadMore(end + 1))), '...')), lastPageButtonAvailable && this.getButton(this.props.openTotal ? -1 : totalPages, (_this$props$translati9 = (_this$props$translati10 = this.props.translations) === null || _this$props$translati10 === void 0 ? void 0 : _this$props$translati10.lastPage) !== null && _this$props$translati9 !== void 0 ? _this$props$translati9 : translate('lastPage'))), this.getPageSizeSelector());
307
+ }, this.getClickProps(this.handleLoadMore(end + 1))), '...')), lastPageButtonAvailable && this.getButton(this.props.openTotal ? -1 : totalPages, (_this$props$translati5 = this.props.translations?.lastPage) !== null && _this$props$translati5 !== void 0 ? _this$props$translati5 : translate('lastPage'))), this.getPageSizeSelector());
312
308
  }
313
309
  render() {
314
310
  const classes = classNames(modules_1a5f0d42.pager, this.props.className);
@@ -205,7 +205,7 @@ class PermissionCache {
205
205
  testPermission(permissionName, projectId) {
206
206
  const permissionCache = this.permissionCache;
207
207
  const convertedName = this.namesConverter(permissionName);
208
- const cachedPermission = (permissionCache === null || permissionCache === void 0 ? void 0 : permissionCache[permissionName]) || convertedName && (permissionCache === null || permissionCache === void 0 ? void 0 : permissionCache[convertedName]);
208
+ const cachedPermission = permissionCache?.[permissionName] || convertedName && permissionCache?.[convertedName];
209
209
  // Hasn't the permission in any project
210
210
  if (!cachedPermission) {
211
211
  return false;
@@ -238,8 +238,7 @@ class Popup extends PureComponent {
238
238
  * @private
239
239
  */
240
240
  _onDocumentClick = evt => {
241
- var _this$_getAnchor;
242
- if (this.container && evt.target instanceof Node && this.container.contains(evt.target) || !this._listenersEnabled || this.props.dontCloseOnAnchorClick && evt.target instanceof Node && (_this$_getAnchor = this._getAnchor()) !== null && _this$_getAnchor !== void 0 && _this$_getAnchor.contains(evt.target)) {
241
+ if (this.container && evt.target instanceof Node && this.container.contains(evt.target) || !this._listenersEnabled || this.props.dontCloseOnAnchorClick && evt.target instanceof Node && this._getAnchor()?.contains(evt.target)) {
243
242
  return;
244
243
  }
245
244
  this.props.onOutsideClick(evt);
@@ -242,7 +242,7 @@ function position(attrs) {
242
242
  anchorRect,
243
243
  maxHeight,
244
244
  direction: chosenDirection,
245
- popupScrollHeight: (_popup$scrollHeight = popup === null || popup === void 0 ? void 0 : popup.scrollHeight) !== null && _popup$scrollHeight !== void 0 ? _popup$scrollHeight : 0,
245
+ popupScrollHeight: (_popup$scrollHeight = popup?.scrollHeight) !== null && _popup$scrollHeight !== void 0 ? _popup$scrollHeight : 0,
246
246
  scroll
247
247
  });
248
248
  }
@@ -287,9 +287,8 @@ class QueryAssist extends Component {
287
287
  }
288
288
  if (typeof query === 'string' && queryChanged && query !== this.immediateState.query) {
289
289
  this.immediateState.query = query;
290
- if (prevProps.autoOpen && (query === null || query === void 0 ? void 0 : query.length) > 0) {
291
- var _this$requestData;
292
- (_this$requestData = this.requestData) === null || _this$requestData === void 0 ? void 0 : _this$requestData.call(this);
290
+ if (prevProps.autoOpen && query?.length > 0) {
291
+ this.requestData?.();
293
292
  } else if (query) {
294
293
  this.requestStyleRanges();
295
294
  }
@@ -351,30 +350,26 @@ class QueryAssist extends Component {
351
350
  }
352
351
  if (_this.immediateState.focus && !_this.props.disabled) {
353
352
  if (typeof _this.immediateState.selection === 'number' && Number.isInteger(_this.immediateState.selection) && _this.immediateState.selection > -1) {
354
- var _this$caret;
355
353
  // Set to end of field value if newCaretPosition is inappropriate
356
- (_this$caret = _this.caret) === null || _this$caret === void 0 ? void 0 : _this$caret.setPosition(newCaretPosition >= 0 ? newCaretPosition : -1);
354
+ _this.caret?.setPosition(newCaretPosition >= 0 ? newCaretPosition : -1);
357
355
  _this.scrollInput();
358
356
  } else if (_this.immediateState.selection && typeof _this.immediateState.selection === 'object' && _this.immediateState.selection.startOffset !== undefined) {
359
- var _this$caret2;
360
- (_this$caret2 = _this.caret) === null || _this$caret2 === void 0 ? void 0 : _this$caret2.setPosition(_this.immediateState.selection);
357
+ _this.caret?.setPosition(_this.immediateState.selection);
361
358
  } else if (_this.immediateState.selection === undefined || params.forceSetCaret) {
362
- var _this$caret3;
363
- (_this$caret3 = _this.caret) === null || _this$caret3 === void 0 ? void 0 : _this$caret3.setPosition(-1);
359
+ _this.caret?.setPosition(-1);
364
360
  }
365
361
  }
366
362
  };
367
363
  })();
368
364
  scrollInput() {
369
- var _this$caret4, _this$input, _this$input2, _this$input3;
370
- const caretOffset = (_this$caret4 = this.caret) === null || _this$caret4 === void 0 ? void 0 : _this$caret4.getOffset();
371
- if (((_this$input = this.input) === null || _this$input === void 0 ? void 0 : _this$input.clientWidth) !== ((_this$input2 = this.input) === null || _this$input2 === void 0 ? void 0 : _this$input2.scrollWidth) && caretOffset != null && ((_this$input3 = this.input) === null || _this$input3 === void 0 ? void 0 : _this$input3.clientWidth) != null && caretOffset > this.input.clientWidth) {
365
+ const caretOffset = this.caret?.getOffset();
366
+ if (this.input?.clientWidth !== this.input?.scrollWidth && caretOffset != null && this.input?.clientWidth != null && caretOffset > this.input.clientWidth) {
372
367
  this.input.scrollLeft += caretOffset;
373
368
  }
374
369
  }
375
370
  getQuery() {
376
- var _this$input$textConte, _this$input4, _this$input4$textCont;
377
- return (_this$input$textConte = (_this$input4 = this.input) === null || _this$input4 === void 0 ? void 0 : (_this$input4$textCont = _this$input4.textContent) === null || _this$input4$textCont === void 0 ? void 0 : _this$input4$textCont.replace(/\s/g, ' ')) !== null && _this$input$textConte !== void 0 ? _this$input$textConte : '';
371
+ var _this$input$textConte;
372
+ return (_this$input$textConte = this.input?.textContent?.replace(/\s/g, ' ')) !== null && _this$input$textConte !== void 0 ? _this$input$textConte : '';
378
373
  }
379
374
  isRenderingGlassOrLoader() {
380
375
  const renderLoader = this.props.loader !== false && this.state.loading;
@@ -392,13 +387,13 @@ class QueryAssist extends Component {
392
387
  };
393
388
  isComposing;
394
389
  handleInput = e => {
395
- var _this$caret5, _currentCaret$positio;
390
+ var _currentCaret$positio;
396
391
  this.togglePlaceholder();
397
- const currentCaret = (_this$caret5 = this.caret) === null || _this$caret5 === void 0 ? void 0 : _this$caret5.getPosition();
392
+ const currentCaret = this.caret?.getPosition();
398
393
  const props = {
399
394
  dirty: true,
400
395
  query: this.getQuery(),
401
- caret: typeof currentCaret === 'number' ? currentCaret : (_currentCaret$positio = currentCaret === null || currentCaret === void 0 ? void 0 : currentCaret.position) !== null && _currentCaret$positio !== void 0 ? _currentCaret$positio : 0,
396
+ caret: typeof currentCaret === 'number' ? currentCaret : (_currentCaret$positio = currentCaret?.position) !== null && _currentCaret$positio !== void 0 ? _currentCaret$positio : 0,
402
397
  focus: true
403
398
  };
404
399
  if (this.immediateState.query === props.query && !this.isComposing) {
@@ -428,8 +423,7 @@ class QueryAssist extends Component {
428
423
  }
429
424
  this.props.onChange(props);
430
425
  if (this.props.autoOpen === 'force' || props.query.length > 0) {
431
- var _this$requestData2;
432
- (_this$requestData2 = this.requestData) === null || _this$requestData2 === void 0 ? void 0 : _this$requestData2.call(this);
426
+ this.requestData?.();
433
427
  }
434
428
  };
435
429
  // It's necessary to prevent new element creation before any other hooks
@@ -457,18 +451,17 @@ class QueryAssist extends Component {
457
451
  setState = (state, resolve) => {
458
452
  super.setState(state, () => {
459
453
  this._pushHistory(state);
460
- resolve === null || resolve === void 0 ? void 0 : resolve();
454
+ resolve?.();
461
455
  });
462
456
  };
463
457
  _pushHistory(state) {
464
- var _this$historyStack$;
465
458
  const queryIsSet = ('query' in state);
466
- const queryIsSame = ((_this$historyStack$ = this.historyStack[0]) === null || _this$historyStack$ === void 0 ? void 0 : _this$historyStack$.query) === state.query;
459
+ const queryIsSame = this.historyStack[0]?.query === state.query;
467
460
  if (queryIsSet && !queryIsSame) {
468
- var _this$caret$getPositi, _this$caret6;
461
+ var _this$caret$getPositi;
469
462
  this.historyStack.unshift({
470
463
  query: state.query,
471
- caret: (_this$caret$getPositi = (_this$caret6 = this.caret) === null || _this$caret6 === void 0 ? void 0 : _this$caret6.getPosition({
464
+ caret: (_this$caret$getPositi = this.caret?.getPosition({
472
465
  avoidFocus: true
473
466
  })) !== null && _this$caret$getPositi !== void 0 ? _this$caret$getPositi : -1
474
467
  });
@@ -482,8 +475,7 @@ class QueryAssist extends Component {
482
475
  this.setState({
483
476
  query: previous.query
484
477
  }, () => {
485
- var _this$caret7;
486
- (_this$caret7 = this.caret) === null || _this$caret7 === void 0 ? void 0 : _this$caret7.setPosition(previous.caret);
478
+ this.caret?.setPosition(previous.caret);
487
479
  this.handleInput(e);
488
480
  });
489
481
  };
@@ -497,19 +489,18 @@ class QueryAssist extends Component {
497
489
  }
498
490
  };
499
491
  handleCaretMove = e => {
500
- var _this$caret8, _currentCaret$positio2;
492
+ var _currentCaret$positio2;
501
493
  if (this.isComposing) {
502
494
  return;
503
495
  }
504
- const currentCaret = (_this$caret8 = this.caret) === null || _this$caret8 === void 0 ? void 0 : _this$caret8.getPosition();
505
- const caret = typeof currentCaret === 'number' ? currentCaret : (_currentCaret$positio2 = currentCaret === null || currentCaret === void 0 ? void 0 : currentCaret.position) !== null && _currentCaret$positio2 !== void 0 ? _currentCaret$positio2 : 0;
496
+ const currentCaret = this.caret?.getPosition();
497
+ const caret = typeof currentCaret === 'number' ? currentCaret : (_currentCaret$positio2 = currentCaret?.position) !== null && _currentCaret$positio2 !== void 0 ? _currentCaret$positio2 : 0;
506
498
  const popupHidden = !this.state.showPopup && e.type === 'click';
507
499
  if (!this.props.disabled && (caret !== this.immediateState.caret || popupHidden)) {
508
500
  this.immediateState.caret = caret;
509
501
  this.scrollInput();
510
502
  if (this.immediateState.query.length > 0) {
511
- var _this$requestData3;
512
- (_this$requestData3 = this.requestData) === null || _this$requestData3 === void 0 ? void 0 : _this$requestData3.call(this);
503
+ this.requestData?.();
513
504
  }
514
505
  }
515
506
  if (this.immediateState.query.length < 1) {
@@ -537,7 +528,6 @@ class QueryAssist extends Component {
537
528
  let afterCompletion = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false;
538
529
  return new Promise((resolve, reject) => {
539
530
  if (query === _this2.getQuery() && (caret === _this2.immediateState.caret || _this2.immediateState.caret === undefined)) {
540
- var _this2$caret;
541
531
  // Do not setState on unmounted component
542
532
  if (!_this2.node) {
543
533
  return;
@@ -555,7 +545,7 @@ class QueryAssist extends Component {
555
545
  if (!deepEqual(_this2.state.styleRanges, styleRanges)) {
556
546
  state.styleRanges = styleRanges;
557
547
  }
558
- _this2.immediateState.selection = (_this2$caret = _this2.caret) === null || _this2$caret === void 0 ? void 0 : _this2$caret.getPosition({
548
+ _this2.immediateState.selection = _this2.caret?.getPosition({
559
549
  avoidFocus: true
560
550
  });
561
551
  _this2.setState(state, resolve);
@@ -577,7 +567,7 @@ class QueryAssist extends Component {
577
567
  return this.props.onApply(this.immediateState);
578
568
  };
579
569
  handleComplete = (data, replace) => {
580
- var _suggestion$caret, _suggestion$caret2, _this$requestData4;
570
+ var _suggestion$caret, _suggestion$caret2;
581
571
  if (!data || !data.data) {
582
572
  this.handleApply();
583
573
  return;
@@ -615,7 +605,7 @@ class QueryAssist extends Component {
615
605
  this.setCaretPosition();
616
606
  }
617
607
  this.closePopup();
618
- (_this$requestData4 = this.requestData) === null || _this$requestData4 === void 0 ? void 0 : _this$requestData4.call(this, true);
608
+ this.requestData?.(true);
619
609
  };
620
610
  requestStyleRanges = () => {
621
611
  const {
@@ -685,8 +675,8 @@ class QueryAssist extends Component {
685
675
  const completionStartNode = inputChildren && typeof completionStart === 'number' && inputChildren[Math.min(completionStart, inputChildren.length - 1)];
686
676
  let offset = completionStartNode && getRect(completionStartNode).right - getRect(this.input).left;
687
677
  if (!offset) {
688
- var _this$caret$getOffset, _this$caret9;
689
- const caret = (_this$caret$getOffset = (_this$caret9 = this.caret) === null || _this$caret9 === void 0 ? void 0 : _this$caret9.getOffset()) !== null && _this$caret$getOffset !== void 0 ? _this$caret$getOffset : 0;
678
+ var _this$caret$getOffset;
679
+ const caret = (_this$caret$getOffset = this.caret?.getOffset()) !== null && _this$caret$getOffset !== void 0 ? _this$caret$getOffset : 0;
690
680
  // Do not compensate caret in the beginning of field
691
681
  if (caret === 0) {
692
682
  return minOffset;
@@ -700,8 +690,7 @@ class QueryAssist extends Component {
700
690
  handleCtrlSpace = e => {
701
691
  preventDefault(e);
702
692
  if (!this.state.showPopup) {
703
- var _this$requestData5;
704
- (_this$requestData5 = this.requestData) === null || _this$requestData5 === void 0 ? void 0 : _this$requestData5.call(this);
693
+ this.requestData?.();
705
694
  }
706
695
  };
707
696
  trackPopupMouseState = e => {
@@ -737,8 +726,7 @@ class QueryAssist extends Component {
737
726
  blurInput() {
738
727
  this.immediateState.selection = null;
739
728
  if (!this.props.focus) {
740
- var _this$caret10;
741
- (_this$caret10 = this.caret) === null || _this$caret10 === void 0 ? void 0 : _this$caret10.target.blur();
729
+ this.caret?.target.blur();
742
730
  }
743
731
  }
744
732
  /**
@@ -885,14 +873,14 @@ class QueryAssist extends Component {
885
873
  actions.push( /*#__PURE__*/React.createElement(I18nContext.Consumer, {
886
874
  key: 'clearAction'
887
875
  }, _ref6 => {
888
- var _this$props$translati, _this$props$translati2;
876
+ var _this$props$translati;
889
877
  let {
890
878
  translate
891
879
  } = _ref6;
892
880
  return /*#__PURE__*/React.createElement(Button, {
893
881
  icon: closeIcon,
894
882
  className: modules_da7ab055.clear,
895
- title: (_this$props$translati = (_this$props$translati2 = this.props.translations) === null || _this$props$translati2 === void 0 ? void 0 : _this$props$translati2.clearTitle) !== null && _this$props$translati !== void 0 ? _this$props$translati : translate('clearTitle'),
883
+ title: (_this$props$translati = this.props.translations?.clearTitle) !== null && _this$props$translati !== void 0 ? _this$props$translati : translate('clearTitle'),
896
884
  ref: this.clearRef,
897
885
  onClick: this.clearQuery,
898
886
  "data-test": "query-assist-clear-icon"
@@ -950,7 +938,7 @@ class QueryAssist extends Component {
950
938
  }), renderGlass && !huge && /*#__PURE__*/React.createElement(Icon, {
951
939
  glyph: searchIcon,
952
940
  className: modules_da7ab055.icon,
953
- title: (_translations$searchT = translations === null || translations === void 0 ? void 0 : translations.searchTitle) !== null && _translations$searchT !== void 0 ? _translations$searchT : translate('searchTitle'),
941
+ title: (_translations$searchT = translations?.searchTitle) !== null && _translations$searchT !== void 0 ? _translations$searchT : translate('searchTitle'),
954
942
  ref: this.glassRef,
955
943
  "data-test": "query-assist-search-icon"
956
944
  }), renderLoader && /*#__PURE__*/React.createElement("div", {
@@ -960,7 +948,7 @@ class QueryAssist extends Component {
960
948
  }),
961
949
  ref: this.loaderRef
962
950
  }, /*#__PURE__*/React.createElement(LoaderInline, null)), /*#__PURE__*/React.createElement(ContentEditable, {
963
- "aria-label": (_translations$searchT2 = translations === null || translations === void 0 ? void 0 : translations.searchTitle) !== null && _translations$searchT2 !== void 0 ? _translations$searchT2 : translate('searchTitle'),
951
+ "aria-label": (_translations$searchT2 = translations?.searchTitle) !== null && _translations$searchT2 !== void 0 ? _translations$searchT2 : translate('searchTitle'),
964
952
  className: inputClasses,
965
953
  "data-test": "ring-query-assist-input",
966
954
  inputRef: this.inputRef,
@@ -1013,7 +1001,7 @@ class QueryAssist extends Component {
1013
1001
  }, /*#__PURE__*/React.createElement(Icon, {
1014
1002
  glyph: searchIcon,
1015
1003
  className: modules_da7ab055.rightSearchIcon,
1016
- title: (_translations$searchT3 = translations === null || translations === void 0 ? void 0 : translations.searchTitle) !== null && _translations$searchT3 !== void 0 ? _translations$searchT3 : translate('searchTitle'),
1004
+ title: (_translations$searchT3 = translations?.searchTitle) !== null && _translations$searchT3 !== void 0 ? _translations$searchT3 : translate('searchTitle'),
1017
1005
  onClick: this.handleApply,
1018
1006
  ref: this.glassRef,
1019
1007
  "data-test": "query-assist-search-icon"
@@ -149,17 +149,15 @@ function getListItems(props, state, rawFilterString) {
149
149
  ...data[i]
150
150
  };
151
151
  if (check(item, lowerCaseString, data)) {
152
- var _state$multipleMap2;
153
152
  exactMatch = item.label === filterString;
154
153
  if (props.multiple && !(typeof props.multiple === 'object' && props.multiple.removeSelectedItems)) {
155
- var _state$multipleMap;
156
- item.checkbox = !!((_state$multipleMap = state.multipleMap) !== null && _state$multipleMap !== void 0 && _state$multipleMap[item.key]);
154
+ item.checkbox = !!state.multipleMap?.[item.key];
157
155
  }
158
156
  if (props.multiple && typeof props.multiple === 'object' && props.multiple.limit && Array.isArray(state.selected)) {
159
157
  item.disabled = props.multiple.limit === state.selected.length && !state.selected.find(selectedItem => selectedItem.key === item.key);
160
158
  }
161
159
  // Ignore item if it's multiple and is already selected
162
- if (!(props.multiple && typeof props.multiple === 'object' && props.multiple.removeSelectedItems && (_state$multipleMap2 = state.multipleMap) !== null && _state$multipleMap2 !== void 0 && _state$multipleMap2[item.key])) {
160
+ if (!(props.multiple && typeof props.multiple === 'object' && props.multiple.removeSelectedItems && state.multipleMap?.[item.key])) {
163
161
  filteredData.push(item);
164
162
  }
165
163
  }
@@ -394,7 +392,6 @@ class Select extends Component {
394
392
  });
395
393
  };
396
394
  _blurHandler = () => {
397
- var _this$_popup;
398
395
  this.props.onBlur();
399
396
  if (this._popup && this._popup.isVisible() && !this._popup.isClickingPopup) {
400
397
  window.setTimeout(() => {
@@ -403,7 +400,7 @@ class Select extends Component {
403
400
  });
404
401
  });
405
402
  }
406
- if (!((_this$_popup = this._popup) !== null && _this$_popup !== void 0 && _this$_popup.isClickingPopup)) {
403
+ if (!this._popup?.isClickingPopup) {
407
404
  this.setState({
408
405
  shortcutsEnabled: false,
409
406
  focused: false
@@ -421,19 +418,17 @@ class Select extends Component {
421
418
  }
422
419
  };
423
420
  _onEnter = () => {
424
- var _this$_popup2;
425
421
  if (this.state.addButton && this.state.shownData.length === 0) {
426
422
  this.addHandler();
427
423
  }
428
424
  this.props.onDone();
429
- if (!((_this$_popup2 = this._popup) !== null && _this$_popup2 !== void 0 && _this$_popup2.isVisible()) && this.props.allowAny) {
425
+ if (!this._popup?.isVisible() && this.props.allowAny) {
430
426
  return true;
431
427
  }
432
428
  return undefined;
433
429
  };
434
430
  _onEsc = event => {
435
- var _this$_popup3;
436
- if (!((_this$_popup3 = this._popup) !== null && _this$_popup3 !== void 0 && _this$_popup3.isVisible())) {
431
+ if (!this._popup?.isVisible()) {
437
432
  return true;
438
433
  } else if (this.props.multiple || !this.props.getInitial) {
439
434
  return false;
@@ -574,7 +569,7 @@ class Select extends Component {
574
569
  }
575
570
  const shownData = this.getListItems(this.filterValue());
576
571
  this.setState({
577
- showPopup: !!shownData.length || this.isInputMode(),
572
+ showPopup: !!shownData.length || !this.props.allowAny,
578
573
  shownData
579
574
  });
580
575
  }
@@ -677,7 +672,6 @@ class Select extends Component {
677
672
  this._setFilter(e.currentTarget.value, e);
678
673
  };
679
674
  _setFilter = (value, event) => {
680
- var _this$_popup4;
681
675
  if (this.isInputMode() && !this.state.focused) {
682
676
  return;
683
677
  }
@@ -699,7 +693,7 @@ class Select extends Component {
699
693
  this.props.onChange(fakeSelected, event);
700
694
  });
701
695
  }
702
- !((_this$_popup4 = this._popup) !== null && _this$_popup4 !== void 0 && _this$_popup4.isVisible()) && this.props.onBeforeOpen();
696
+ !this._popup?.isVisible() && this.props.onBeforeOpen();
703
697
  this.setState({
704
698
  filterValue
705
699
  }, () => {
@@ -905,7 +899,7 @@ class Select extends Component {
905
899
  } = this.props;
906
900
  const icons = [];
907
901
  const height = this.props.height || this.context;
908
- if (!Array.isArray(selected) && selected !== null && selected !== void 0 && selected.icon) {
902
+ if (!Array.isArray(selected) && selected?.icon) {
909
903
  icons.push( /*#__PURE__*/React.createElement("button", {
910
904
  title: "Toggle options popup",
911
905
  type: "button",
@@ -945,8 +939,7 @@ class Select extends Component {
945
939
  return icons;
946
940
  }
947
941
  _getAvatar() {
948
- var _this$state$selected, _this$state$selected2;
949
- return !Array.isArray(this.state.selected) && (((_this$state$selected = this.state.selected) === null || _this$state$selected === void 0 ? void 0 : _this$state$selected.avatar) || ((_this$state$selected2 = this.state.selected) === null || _this$state$selected2 === void 0 ? void 0 : _this$state$selected2.showGeneratedAvatar)) && /*#__PURE__*/React.createElement(Avatar, {
942
+ return !Array.isArray(this.state.selected) && (this.state.selected?.avatar || this.state.selected?.showGeneratedAvatar) && /*#__PURE__*/React.createElement(Avatar, {
950
943
  className: modules_9d0de074.avatar,
951
944
  url: this.state.selected.avatar,
952
945
  username: this.state.selected.username,
@@ -971,7 +964,7 @@ class Select extends Component {
971
964
  };
972
965
  }
973
966
  renderSelect(activeItemId) {
974
- var _this$props$label3, _this$props$label4, _this$_popup5, _this$_popup5$list, _this$props$buttonCla;
967
+ var _this$props$label3, _this$props$label4, _this$props$buttonCla;
975
968
  const dataTest = this.props['data-test'];
976
969
  const {
977
970
  selectedLabel
@@ -1028,7 +1021,7 @@ class Select extends Component {
1028
1021
  "data-test": "ring-select__focus",
1029
1022
  enableShortcuts: shortcutsEnabled ? Object.keys({
1030
1023
  ...this.getShortcutsMap(),
1031
- ...((_this$_popup5 = this._popup) === null || _this$_popup5 === void 0 ? void 0 : (_this$_popup5$list = _this$_popup5.list) === null || _this$_popup5$list === void 0 ? void 0 : _this$_popup5$list.shortcutsMap)
1024
+ ...this._popup?.list?.shortcutsMap
1032
1025
  }) : undefined,
1033
1026
  afterInput: this.props.type === Type.INPUT && iconsNode
1034
1027
  })), this._renderPopup()), this.props.error && /*#__PURE__*/React.createElement("div", {