@rescui/select 0.18.1-RUI-297-Add-react-compiler-to-the-packages-build-dbbefd7b8.10 → 0.18.1-RUI-297-Add-react-compiler-to-the-packages-build-8aaaed4be.39

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 (40) hide show
  1. package/lib/_virtual/check-outline.js +294 -63
  2. package/lib/_virtual/close-outline.js +294 -63
  3. package/lib/_virtual/down-outline.js +294 -63
  4. package/lib/_virtual/index.css.js +12 -12
  5. package/lib/_virtual/loading-outline.js +310 -79
  6. package/lib/hooks/use-a11y.js +121 -33
  7. package/lib/hooks/use-actual-size-from-css.js +46 -17
  8. package/lib/hooks/use-focus.js +54 -10
  9. package/lib/hooks/use-hover.js +54 -10
  10. package/lib/hooks/use-label-focus.js +45 -15
  11. package/lib/hooks/use-multi-handlers.js +114 -36
  12. package/lib/hooks/use-no-memo-getter.d.ts +5 -0
  13. package/lib/hooks/use-no-memo-getter.js +15 -0
  14. package/lib/hooks/use-options.d.ts +2 -1
  15. package/lib/hooks/use-options.js +92 -56
  16. package/lib/hooks/use-primary-contrast-css-var-transfer.js +43 -16
  17. package/lib/hooks/use-safe-id.d.ts +3 -5
  18. package/lib/hooks/use-safe-id.js +7 -12
  19. package/lib/index.css +229 -189
  20. package/lib/multiselect.js +533 -158
  21. package/lib/native-select.js +412 -116
  22. package/lib/parts/form-trigger-wrapper.js +159 -39
  23. package/lib/parts/hidden-select.js +105 -29
  24. package/lib/parts/icons.js +164 -44
  25. package/lib/parts/list-box.js +294 -72
  26. package/lib/parts/multi-trigger.js +106 -43
  27. package/lib/parts/native-select-options-with-groups.js +154 -52
  28. package/lib/parts/popup-content.d.ts +2 -2
  29. package/lib/parts/popup-content.js +145 -45
  30. package/lib/public-api.p.css +5 -0
  31. package/lib/public-api.pcss +5 -0
  32. package/lib/select-basic.js +456 -136
  33. package/lib/select-searchable.js +435 -142
  34. package/lib/select.js +228 -56
  35. package/lib/styles/common.p.module.css.js +29 -29
  36. package/lib/styles/form-trigger.p.module.css.js +12 -12
  37. package/lib/styles/list-box.p.module.css.js +13 -13
  38. package/lib/types.d.ts +5 -0
  39. package/lib/utils/get-text-from-nodes.js +1 -1
  40. package/package.json +9 -8
@@ -1,5 +1,7 @@
1
1
  "use client";
2
- import React, { useMemo, useRef } from 'react';
2
+ import _extends from '@babel/runtime-corejs3/helpers/esm/extends';
3
+ import { c } from 'react-compiler-runtime';
4
+ import React, { useRef } from 'react';
3
5
  import cn from 'classnames';
4
6
  import { useSelect } from 'downshift';
5
7
  import { useThemeWithUndefined } from '@rescui/ui-contexts';
@@ -8,6 +10,7 @@ import { useLabelFocus } from './hooks/use-label-focus.js';
8
10
  import { useOptions } from './hooks/use-options.js';
9
11
  import { useMultiHandlers } from './hooks/use-multi-handlers.js';
10
12
  import { useA11y } from './hooks/use-a11y.js';
13
+ import { useNoMemoGetter } from './hooks/use-no-memo-getter.js';
11
14
  import { Icons } from './parts/icons.js';
12
15
  import { MultiTrigger } from './parts/multi-trigger.js';
13
16
  import { HiddenSelect } from './parts/hidden-select.js';
@@ -57,65 +60,261 @@ const stateReducer = (state, actionAndChanges) => {
57
60
  }; // eslint-disable-next-line complexity
58
61
 
59
62
 
60
- function Multiselect(_ref) {
61
- let {
62
- options = [],
63
- value,
64
- onChange,
65
- error,
66
- label,
67
- note,
68
- size = 'm',
69
- mode = 'classic',
70
- theme: themeFromProps,
71
- placement = 'bottom',
72
- renderInTrigger = false,
73
- disableFlip = false,
74
- isSingleLine = false,
75
- boldLabel = true,
76
- reserveErrorLine = false,
77
- maxVisibleItems = 5,
78
- isClearable = false,
79
- isLoading = false,
80
- isDisabled = false,
81
- name,
82
- noOptionsMessage,
83
- className,
84
- id,
85
- style,
86
- placeholder,
87
- ...rest
88
- } = _ref;
89
- const selectedItems = useMemo(() => value ?? [], [value]);
63
+ function Multiselect(t0) {
64
+ const $ = c(133);
65
+ let className;
66
+ let error;
67
+ let id;
68
+ let label;
69
+ let name;
70
+ let noOptionsMessage;
71
+ let note;
72
+ let onChange;
73
+ let placeholder;
74
+ let rest;
75
+ let style;
76
+ let t1;
77
+ let t10;
78
+ let t11;
79
+ let t12;
80
+ let t13;
81
+ let t2;
82
+ let t3;
83
+ let t4;
84
+ let t5;
85
+ let t6;
86
+ let t7;
87
+ let t8;
88
+ let t9;
89
+ let themeFromProps;
90
+ let value;
91
+
92
+ if ($[0] !== t0) {
93
+ ({
94
+ options: t1,
95
+ value,
96
+ onChange,
97
+ error,
98
+ label,
99
+ note,
100
+ size: t2,
101
+ mode: t3,
102
+ theme: themeFromProps,
103
+ placement: t4,
104
+ renderInTrigger: t5,
105
+ disableFlip: t6,
106
+ isSingleLine: t7,
107
+ boldLabel: t8,
108
+ reserveErrorLine: t9,
109
+ maxVisibleItems: t10,
110
+ isClearable: t11,
111
+ isLoading: t12,
112
+ isDisabled: t13,
113
+ name,
114
+ noOptionsMessage,
115
+ className,
116
+ id,
117
+ style,
118
+ placeholder,
119
+ ...rest
120
+ } = t0);
121
+ $[0] = t0;
122
+ $[1] = className;
123
+ $[2] = error;
124
+ $[3] = id;
125
+ $[4] = label;
126
+ $[5] = name;
127
+ $[6] = noOptionsMessage;
128
+ $[7] = note;
129
+ $[8] = onChange;
130
+ $[9] = placeholder;
131
+ $[10] = rest;
132
+ $[11] = style;
133
+ $[12] = t1;
134
+ $[13] = t10;
135
+ $[14] = t11;
136
+ $[15] = t12;
137
+ $[16] = t13;
138
+ $[17] = t2;
139
+ $[18] = t3;
140
+ $[19] = t4;
141
+ $[20] = t5;
142
+ $[21] = t6;
143
+ $[22] = t7;
144
+ $[23] = t8;
145
+ $[24] = t9;
146
+ $[25] = themeFromProps;
147
+ $[26] = value;
148
+ } else {
149
+ className = $[1];
150
+ error = $[2];
151
+ id = $[3];
152
+ label = $[4];
153
+ name = $[5];
154
+ noOptionsMessage = $[6];
155
+ note = $[7];
156
+ onChange = $[8];
157
+ placeholder = $[9];
158
+ rest = $[10];
159
+ style = $[11];
160
+ t1 = $[12];
161
+ t10 = $[13];
162
+ t11 = $[14];
163
+ t12 = $[15];
164
+ t13 = $[16];
165
+ t2 = $[17];
166
+ t3 = $[18];
167
+ t4 = $[19];
168
+ t5 = $[20];
169
+ t6 = $[21];
170
+ t7 = $[22];
171
+ t8 = $[23];
172
+ t9 = $[24];
173
+ themeFromProps = $[25];
174
+ value = $[26];
175
+ }
176
+
177
+ let t14;
178
+
179
+ if ($[27] !== t1) {
180
+ t14 = t1 === undefined ? [] : t1;
181
+ $[27] = t1;
182
+ $[28] = t14;
183
+ } else {
184
+ t14 = $[28];
185
+ }
186
+
187
+ const options = t14;
188
+ const size = t2 === undefined ? "m" : t2;
189
+ const mode = t3 === undefined ? "classic" : t3;
190
+ const placement = t4 === undefined ? "bottom" : t4;
191
+ const renderInTrigger = t5 === undefined ? false : t5;
192
+ const disableFlip = t6 === undefined ? false : t6;
193
+ const isSingleLine = t7 === undefined ? false : t7;
194
+ const boldLabel = t8 === undefined ? true : t8;
195
+ const reserveErrorLine = t9 === undefined ? false : t9;
196
+ const maxVisibleItems = t10 === undefined ? 5 : t10;
197
+ const isClearable = t11 === undefined ? false : t11;
198
+ const isLoading = t12 === undefined ? false : t12;
199
+ const isDisabled = t13 === undefined ? false : t13;
200
+ let t15;
201
+
202
+ if ($[29] !== value) {
203
+ t15 = value ?? [];
204
+ $[29] = value;
205
+ $[30] = t15;
206
+ } else {
207
+ t15 = $[30];
208
+ }
209
+
210
+ const selectedItems = t15;
90
211
  const theme = useThemeWithUndefined(themeFromProps);
91
212
  const triggerRef = useRef(null);
92
213
  const menuRef = useRef(null);
93
214
  const dropdownRef = useRef(null);
215
+ let t16;
216
+
217
+ if ($[31] !== onChange || $[32] !== selectedItems) {
218
+ t16 = {
219
+ selectedItems,
220
+ onChange
221
+ };
222
+ $[31] = onChange;
223
+ $[32] = selectedItems;
224
+ $[33] = t16;
225
+ } else {
226
+ t16 = $[33];
227
+ }
228
+
94
229
  const {
95
230
  selectedMap,
96
231
  removeItem: removeSelectedItem,
97
232
  addItem: addSelectedItem,
98
233
  removeAllItems: reset
99
- } = useMultiHandlers({
100
- selectedItems,
101
- onChange
102
- });
234
+ } = useMultiHandlers(t16);
103
235
  const {
104
236
  flattenedOptions,
105
237
  listBoxItems
106
238
  } = useOptions(options);
107
- const isListBoxEmpty = getRealItemsCnt(listBoxItems) === 0;
239
+ let t17;
240
+
241
+ if ($[34] !== listBoxItems) {
242
+ t17 = getRealItemsCnt(listBoxItems);
243
+ $[34] = listBoxItems;
244
+ $[35] = t17;
245
+ } else {
246
+ t17 = $[35];
247
+ }
248
+
249
+ const isListBoxEmpty = t17 === 0;
250
+ let t18;
251
+
252
+ if ($[36] !== error || $[37] !== isDisabled || $[38] !== note) {
253
+ t18 = {
254
+ prefix: "multiselect",
255
+ error,
256
+ description: note,
257
+ isDisabled
258
+ };
259
+ $[36] = error;
260
+ $[37] = isDisabled;
261
+ $[38] = note;
262
+ $[39] = t18;
263
+ } else {
264
+ t18 = $[39];
265
+ }
266
+
108
267
  const {
109
268
  fieldProps,
110
269
  errorMessageProps,
111
270
  descriptionProps,
112
271
  baseId
113
- } = useA11y({
114
- prefix: 'multiselect',
115
- error,
116
- description: note,
117
- isDisabled
118
- });
272
+ } = useA11y(t18);
273
+ let t19;
274
+
275
+ if ($[40] === Symbol.for("react.memo_cache_sentinel")) {
276
+ t19 = (listItemEl, listEl) => {
277
+ scrollIntoView(listItemEl, {
278
+ scrollMode: "if-needed",
279
+ block: "nearest",
280
+ boundary: listEl ?? menuRef.current
281
+ });
282
+ };
283
+
284
+ $[40] = t19;
285
+ } else {
286
+ t19 = $[40];
287
+ }
288
+
289
+ let t20;
290
+
291
+ if ($[41] !== addSelectedItem || $[42] !== removeSelectedItem || $[43] !== selectedMap) {
292
+ t20 = t21 => {
293
+ const {
294
+ selectedItem
295
+ } = t21;
296
+
297
+ if (!selectedItem) {
298
+ return;
299
+ }
300
+
301
+ const changedValue = getOptionValue(selectedItem);
302
+
303
+ if (selectedMap.has(changedValue)) {
304
+ removeSelectedItem(selectedItem);
305
+ } else {
306
+ addSelectedItem(selectedItem);
307
+ }
308
+ };
309
+
310
+ $[41] = addSelectedItem;
311
+ $[42] = removeSelectedItem;
312
+ $[43] = selectedMap;
313
+ $[44] = t20;
314
+ } else {
315
+ t20 = $[44];
316
+ }
317
+
119
318
  const {
120
319
  isOpen,
121
320
  getToggleButtonProps,
@@ -123,7 +322,7 @@ function Multiselect(_ref) {
123
322
  getMenuProps,
124
323
  highlightedIndex,
125
324
  getItemProps,
126
- setHighlightedIndex
325
+ setHighlightedIndex: t21
127
326
  } = useSelect({
128
327
  items: flattenedOptions,
129
328
  itemToString,
@@ -132,7 +331,6 @@ function Multiselect(_ref) {
132
331
 
133
332
  onIsOpenChange(newIsOpen) {
134
333
  if (newIsOpen) {
135
- // set the first selected item as a highlighted item if the popup is opened
136
334
  const firstSelectedKey = [...selectedMap.keys()][0];
137
335
 
138
336
  if (firstSelectedKey) {
@@ -142,152 +340,219 @@ function Multiselect(_ref) {
142
340
  },
143
341
 
144
342
  stateReducer,
145
- // there's no actual selection happening in the hook, we're doing it custom via controlled props.
146
343
  selectedItem: null,
147
- // defining our scroll behavior because on the first menu render the hook
148
- // doesn't know menuRef and use page as the scroll boundary
149
- scrollIntoView: (listItemEl, listEl) => {
150
- scrollIntoView(listItemEl, {
151
- scrollMode: 'if-needed',
152
- block: 'nearest',
153
- boundary: listEl ?? menuRef.current
154
- });
155
- },
156
- onSelectedItemChange: _ref2 => {
157
- let {
158
- selectedItem
159
- } = _ref2;
344
+ scrollIntoView: t19,
345
+ onSelectedItemChange: t20,
160
346
 
161
- if (!selectedItem) {
162
- return;
163
- }
347
+ isItemDisabled(item_0) {
348
+ return item_0 && item_0.disabled;
349
+ }
164
350
 
165
- const changedValue = getOptionValue(selectedItem);
351
+ });
352
+ const setHighlightedIndex = t21;
353
+ const t22 = isListBoxEmpty ? undefined : "true";
354
+ let t23;
166
355
 
167
- if (selectedMap.has(changedValue)) {
168
- removeSelectedItem(selectedItem);
169
- } else {
170
- addSelectedItem(selectedItem);
171
- }
172
- },
356
+ if ($[45] !== t22) {
357
+ t23 = {
358
+ ref: menuRef,
359
+ "aria-multiselectable": t22
360
+ };
361
+ $[45] = t22;
362
+ $[46] = t23;
363
+ } else {
364
+ t23 = $[46];
365
+ }
173
366
 
174
- isItemDisabled(item) {
175
- return item && item.disabled;
176
- }
367
+ let t24;
177
368
 
178
- });
179
- const menuProps = getMenuProps({
180
- ref: menuRef,
181
- 'aria-multiselectable': isListBoxEmpty ? undefined : 'true'
182
- }, {
183
- suppressRefError: true
184
- });
185
- const triggerProps = getToggleButtonProps({
186
- ref: triggerRef,
187
- // eslint-disable-next-line complexity
188
- onKeyDown: event => {
189
- // prevent default behavior of Downshift when pressing Ctrl
369
+ if ($[47] === Symbol.for("react.memo_cache_sentinel")) {
370
+ t24 = {
371
+ suppressRefError: true
372
+ };
373
+ $[47] = t24;
374
+ } else {
375
+ t24 = $[47];
376
+ }
377
+
378
+ const menuProps = useNoMemoGetter(getMenuProps, t23, t24);
379
+ let t25;
380
+
381
+ if ($[48] !== addSelectedItem || $[49] !== flattenedOptions || $[50] !== highlightedIndex || $[51] !== isOpen || $[52] !== removeSelectedItem || $[53] !== reset || $[54] !== selectedItems) {
382
+ t25 = event => {
190
383
  if (event.ctrlKey || event.metaKey) {
191
384
  event.preventDownshiftDefault = true;
192
385
  return;
193
- } // shift + arrow up/down selection (when popup is open)
194
-
386
+ }
195
387
 
196
- if (isOpen && event.shiftKey && (event.key === 'ArrowUp' || event.key === 'ArrowDown')) {
197
- const newHighlightedIndex = event.key === 'ArrowUp' ? Math.max(highlightedIndex - 1, 0) : Math.min(highlightedIndex + 1, flattenedOptions.length - 1);
388
+ if (isOpen && event.shiftKey && (event.key === "ArrowUp" || event.key === "ArrowDown")) {
389
+ const newHighlightedIndex = event.key === "ArrowUp" ? Math.max(highlightedIndex - 1, 0) : Math.min(highlightedIndex + 1, flattenedOptions.length - 1);
198
390
 
199
391
  if (newHighlightedIndex === highlightedIndex) {
200
392
  return;
201
393
  }
202
394
 
203
395
  addSelectedItem(flattenedOptions[newHighlightedIndex]);
204
- } // backspace removing the last selected item (when popup is closed)
205
-
396
+ }
206
397
 
207
- if (!isOpen && event.key === 'Backspace') {
398
+ if (!isOpen && event.key === "Backspace") {
208
399
  removeSelectedItem(selectedItems[selectedItems.length - 1]);
209
- } // delete removing all selected items (when popup is closed)
210
-
400
+ }
211
401
 
212
- if (!isOpen && event.key === 'Delete') {
402
+ if (!isOpen && event.key === "Delete") {
213
403
  reset();
214
404
  }
215
- },
216
- // fix screen-reader focus on an opened popup with an empty list
217
- ...(isOpen && isListBoxEmpty ? {
218
- 'aria-activedescendant': menuProps.id
219
- } : {})
220
- });
405
+ };
406
+
407
+ $[48] = addSelectedItem;
408
+ $[49] = flattenedOptions;
409
+ $[50] = highlightedIndex;
410
+ $[51] = isOpen;
411
+ $[52] = removeSelectedItem;
412
+ $[53] = reset;
413
+ $[54] = selectedItems;
414
+ $[55] = t25;
415
+ } else {
416
+ t25 = $[55];
417
+ }
418
+
419
+ let t26;
420
+
421
+ if ($[56] !== isListBoxEmpty || $[57] !== isOpen || $[58] !== menuProps) {
422
+ t26 = isOpen && isListBoxEmpty ? {
423
+ "aria-activedescendant": menuProps.id
424
+ } : {};
425
+ $[56] = isListBoxEmpty;
426
+ $[57] = isOpen;
427
+ $[58] = menuProps;
428
+ $[59] = t26;
429
+ } else {
430
+ t26 = $[59];
431
+ }
432
+
433
+ let t27;
434
+
435
+ if ($[60] !== t25 || $[61] !== t26) {
436
+ t27 = {
437
+ ref: triggerRef,
438
+ onKeyDown: t25,
439
+ ...t26
440
+ };
441
+ $[60] = t25;
442
+ $[61] = t26;
443
+ $[62] = t27;
444
+ } else {
445
+ t27 = $[62];
446
+ }
447
+
448
+ const triggerProps = useNoMemoGetter(getToggleButtonProps, t27);
449
+ useNoMemoGetter(getLabelProps);
221
450
  const {
222
451
  isFocusedByLabel,
223
452
  labelClickProps,
224
453
  triggerFocusProps: labelFocusForTriggerProps
225
454
  } = useLabelFocus();
226
- const emptyListMessage = getEmptyMessage({
227
- isLoading,
228
- isNothingFound: false,
229
- noOptionsMessage
230
- });
231
- const listBoxState = {
232
- selectedMap,
233
- highlightedIndex,
234
- getItemProps,
235
- menuProps
236
- };
237
- return /*#__PURE__*/React.createElement("div", {
238
- className: cn(className, styles.root, THEME_STYLES[theme], SIZE_STYLES[size], MODE_STYLES[mode], isDisabled ? styles.disabled : styles.enabled, Boolean(error) && styles.error),
239
- id: id,
240
- style: style,
241
- "data-test": "multiselect"
242
- }, /*#__PURE__*/React.createElement(FormTriggerWrapper, {
243
- theme: theme,
244
- size: size,
245
- disabled: isDisabled,
246
- label: label,
247
- labelProps: mergeProps(getLabelProps(), labelClickProps),
248
- boldLabel: boldLabel,
249
- error: error,
250
- reserveErrorLine: reserveErrorLine,
251
- errorMessageProps: errorMessageProps,
252
- note: note,
253
- descriptionProps: descriptionProps
254
- }, /*#__PURE__*/React.createElement(HiddenSelect, {
255
- name: name,
256
- value: selectedItems,
257
- isMultiple: true,
258
- options: flattenedOptions
259
- }), /*#__PURE__*/React.createElement(PopupContent, {
260
- theme: theme,
261
- size: size,
262
- mode: mode,
263
- dropdownRef: dropdownRef,
264
- triggerRef: triggerRef,
265
- placement: placement,
266
- renderInTrigger: renderInTrigger,
267
- disableFlip: disableFlip,
268
- isOpen: isOpen,
269
- listBoxState: listBoxState,
270
- maxVisibleItems: maxVisibleItems,
271
- emptyListMessage: emptyListMessage,
272
- listBoxItems: listBoxItems,
273
- dropdownUpdateDeps: [selectedItems],
274
- trigger: _ref3 => {
275
- let {
455
+ let t28;
456
+
457
+ if ($[63] !== isLoading || $[64] !== noOptionsMessage) {
458
+ t28 = getEmptyMessage({
459
+ isLoading,
460
+ isNothingFound: false,
461
+ noOptionsMessage
462
+ });
463
+ $[63] = isLoading;
464
+ $[64] = noOptionsMessage;
465
+ $[65] = t28;
466
+ } else {
467
+ t28 = $[65];
468
+ }
469
+
470
+ const emptyListMessage = t28;
471
+ let t29;
472
+
473
+ if ($[66] !== getItemProps || $[67] !== highlightedIndex || $[68] !== menuProps || $[69] !== selectedMap) {
474
+ t29 = {
475
+ selectedMap,
476
+ highlightedIndex,
477
+ getItemProps,
478
+ menuProps
479
+ };
480
+ $[66] = getItemProps;
481
+ $[67] = highlightedIndex;
482
+ $[68] = menuProps;
483
+ $[69] = selectedMap;
484
+ $[70] = t29;
485
+ } else {
486
+ t29 = $[70];
487
+ }
488
+
489
+ const listBoxState = t29;
490
+ const t30 = THEME_STYLES[theme];
491
+ const t31 = SIZE_STYLES[size];
492
+ const t32 = MODE_STYLES[mode];
493
+ const t33 = isDisabled ? styles.disabled : styles.enabled;
494
+ const t34 = Boolean(error) && styles.error;
495
+ let t35;
496
+
497
+ if ($[71] !== className || $[72] !== t30 || $[73] !== t31 || $[74] !== t32 || $[75] !== t33 || $[76] !== t34) {
498
+ t35 = cn(className, styles.root, t30, t31, t32, t33, t34);
499
+ $[71] = className;
500
+ $[72] = t30;
501
+ $[73] = t31;
502
+ $[74] = t32;
503
+ $[75] = t33;
504
+ $[76] = t34;
505
+ $[77] = t35;
506
+ } else {
507
+ t35 = $[77];
508
+ }
509
+
510
+ let t36;
511
+
512
+ if ($[78] !== getLabelProps || $[79] !== labelClickProps) {
513
+ t36 = mergeProps(getLabelProps(), labelClickProps);
514
+ $[78] = getLabelProps;
515
+ $[79] = labelClickProps;
516
+ $[80] = t36;
517
+ } else {
518
+ t36 = $[80];
519
+ }
520
+
521
+ let t37;
522
+
523
+ if ($[81] !== flattenedOptions || $[82] !== name || $[83] !== selectedItems) {
524
+ t37 = /*#__PURE__*/React.createElement(HiddenSelect, {
525
+ name: name,
526
+ value: selectedItems,
527
+ isMultiple: true,
528
+ options: flattenedOptions
529
+ });
530
+ $[81] = flattenedOptions;
531
+ $[82] = name;
532
+ $[83] = selectedItems;
533
+ $[84] = t37;
534
+ } else {
535
+ t37 = $[84];
536
+ }
537
+
538
+ let t38;
539
+
540
+ if ($[85] !== fieldProps || $[86] !== isClearable || $[87] !== isDisabled || $[88] !== isFocusedByLabel || $[89] !== isLoading || $[90] !== isOpen || $[91] !== isSingleLine || $[92] !== labelFocusForTriggerProps || $[93] !== placeholder || $[94] !== removeSelectedItem || $[95] !== reset || $[96] !== rest || $[97] !== selectedItems || $[98] !== triggerProps) {
541
+ t38 = t39 => {
542
+ const {
276
543
  ref: triggerRefForDropdown
277
- } = _ref3;
544
+ } = t39;
278
545
  return /*#__PURE__*/React.createElement("div", {
279
546
  className: styles.triggerContainer,
280
547
  "data-open": isOpen,
281
548
  "data-label-focused": isFocusedByLabel
282
- }, /*#__PURE__*/React.createElement("div", { ...rest,
283
- ...mergeProps(fieldProps, // aria-invalid & aria-describedby, rest are overridden by triggerProps
284
- triggerProps, labelFocusForTriggerProps, {
285
- ref: triggerRefForDropdown
286
- }),
549
+ }, /*#__PURE__*/React.createElement("div", _extends({}, rest, mergeProps(fieldProps, triggerProps, labelFocusForTriggerProps, {
550
+ ref: triggerRefForDropdown
551
+ }), {
287
552
  tabIndex: isDisabled ? undefined : 0,
288
553
  className: cn(styles.trigger, !isSingleLine && styles.canBeMultiline),
289
554
  "data-test": "multiselect__trigger"
290
- }, /*#__PURE__*/React.createElement(MultiTrigger, {
555
+ }), /*#__PURE__*/React.createElement(MultiTrigger, {
291
556
  selectedItems: selectedItems,
292
557
  valueProps: {},
293
558
  isSingleLine: isSingleLine,
@@ -306,8 +571,118 @@ function Multiselect(_ref) {
306
571
  },
307
572
  triggerId: triggerProps.id
308
573
  })));
309
- }
310
- })));
574
+ };
575
+
576
+ $[85] = fieldProps;
577
+ $[86] = isClearable;
578
+ $[87] = isDisabled;
579
+ $[88] = isFocusedByLabel;
580
+ $[89] = isLoading;
581
+ $[90] = isOpen;
582
+ $[91] = isSingleLine;
583
+ $[92] = labelFocusForTriggerProps;
584
+ $[93] = placeholder;
585
+ $[94] = removeSelectedItem;
586
+ $[95] = reset;
587
+ $[96] = rest;
588
+ $[97] = selectedItems;
589
+ $[98] = triggerProps;
590
+ $[99] = t38;
591
+ } else {
592
+ t38 = $[99];
593
+ }
594
+
595
+ let t39;
596
+
597
+ if ($[100] !== disableFlip || $[101] !== emptyListMessage || $[102] !== isOpen || $[103] !== listBoxItems || $[104] !== listBoxState || $[105] !== maxVisibleItems || $[106] !== mode || $[107] !== placement || $[108] !== renderInTrigger || $[109] !== selectedItems || $[110] !== size || $[111] !== t38 || $[112] !== theme) {
598
+ t39 = /*#__PURE__*/React.createElement(PopupContent, {
599
+ theme: theme,
600
+ size: size,
601
+ mode: mode,
602
+ dropdownRef: dropdownRef,
603
+ triggerRef: triggerRef,
604
+ placement: placement,
605
+ renderInTrigger: renderInTrigger,
606
+ disableFlip: disableFlip,
607
+ isOpen: isOpen,
608
+ listBoxState: listBoxState,
609
+ maxVisibleItems: maxVisibleItems,
610
+ emptyListMessage: emptyListMessage,
611
+ listBoxItems: listBoxItems,
612
+ dropdownUpdateDep: selectedItems,
613
+ trigger: t38
614
+ });
615
+ $[100] = disableFlip;
616
+ $[101] = emptyListMessage;
617
+ $[102] = isOpen;
618
+ $[103] = listBoxItems;
619
+ $[104] = listBoxState;
620
+ $[105] = maxVisibleItems;
621
+ $[106] = mode;
622
+ $[107] = placement;
623
+ $[108] = renderInTrigger;
624
+ $[109] = selectedItems;
625
+ $[110] = size;
626
+ $[111] = t38;
627
+ $[112] = theme;
628
+ $[113] = t39;
629
+ } else {
630
+ t39 = $[113];
631
+ }
632
+
633
+ let t40;
634
+
635
+ if ($[114] !== boldLabel || $[115] !== descriptionProps || $[116] !== error || $[117] !== errorMessageProps || $[118] !== isDisabled || $[119] !== label || $[120] !== note || $[121] !== reserveErrorLine || $[122] !== size || $[123] !== t36 || $[124] !== t37 || $[125] !== t39 || $[126] !== theme) {
636
+ t40 = /*#__PURE__*/React.createElement(FormTriggerWrapper, {
637
+ theme: theme,
638
+ size: size,
639
+ disabled: isDisabled,
640
+ label: label,
641
+ labelProps: t36,
642
+ boldLabel: boldLabel,
643
+ error: error,
644
+ reserveErrorLine: reserveErrorLine,
645
+ errorMessageProps: errorMessageProps,
646
+ note: note,
647
+ descriptionProps: descriptionProps
648
+ }, t37, t39);
649
+ $[114] = boldLabel;
650
+ $[115] = descriptionProps;
651
+ $[116] = error;
652
+ $[117] = errorMessageProps;
653
+ $[118] = isDisabled;
654
+ $[119] = label;
655
+ $[120] = note;
656
+ $[121] = reserveErrorLine;
657
+ $[122] = size;
658
+ $[123] = t36;
659
+ $[124] = t37;
660
+ $[125] = t39;
661
+ $[126] = theme;
662
+ $[127] = t40;
663
+ } else {
664
+ t40 = $[127];
665
+ }
666
+
667
+ let t41;
668
+
669
+ if ($[128] !== id || $[129] !== style || $[130] !== t35 || $[131] !== t40) {
670
+ t41 = /*#__PURE__*/React.createElement("div", {
671
+ className: t35,
672
+ id: id,
673
+ style: style,
674
+ "data-test": "multiselect"
675
+ }, t40);
676
+ $[128] = id;
677
+ $[129] = style;
678
+ $[130] = t35;
679
+ $[131] = t40;
680
+ $[132] = t41;
681
+ } else {
682
+ t41 = $[132];
683
+ }
684
+
685
+ return t41;
311
686
  }
312
687
 
313
688
  export { Multiselect };