@yamada-ui/autocomplete 2.0.0-next-20240613232518 → 2.0.0-next-20240615222442

Sign up to get free protection for your applications and to get access to all the features.
@@ -330,8 +330,7 @@ var flattenItems = (items) => {
330
330
  var _a;
331
331
  const { isDisabled, isFocusable } = item;
332
332
  const trulyDisabled = !!isDisabled && !isFocusable;
333
- if (trulyDisabled)
334
- return;
333
+ if (trulyDisabled) return;
335
334
  if ("items" in item) {
336
335
  return filterItems((_a = item.items) != null ? _a : []);
337
336
  } else {
@@ -466,23 +465,18 @@ var useAutocomplete = ({
466
465
  });
467
466
  const isEmpty = !validChildren.length && !(computedChildren == null ? void 0 : computedChildren.length);
468
467
  const onOpen = (0, import_react.useCallback)(() => {
469
- if (formControlProps.disabled || formControlProps.readOnly)
470
- return;
471
- if (!allowCreate && (isEmpty || isAllSelected))
472
- return;
468
+ if (formControlProps.disabled || formControlProps.readOnly) return;
469
+ if (!allowCreate && (isEmpty || isAllSelected)) return;
473
470
  onInternalOpen();
474
- if (inputRef.current)
475
- inputRef.current.focus();
471
+ if (inputRef.current) inputRef.current.focus();
476
472
  }, [allowCreate, formControlProps, isAllSelected, isEmpty, onInternalOpen]);
477
473
  const onFocusFirst = (0, import_react.useCallback)(() => {
478
474
  const id2 = setTimeout(() => {
479
- if (isEmpty || isAllSelected)
480
- return;
475
+ if (isEmpty || isAllSelected) return;
481
476
  const first = descendants.enabledFirstValue(
482
477
  ({ node }) => "target" in node.dataset
483
478
  );
484
- if (!first)
485
- return;
479
+ if (!first) return;
486
480
  if (!isMulti || !omitSelectedValues) {
487
481
  setFocusedIndex(first.index);
488
482
  } else {
@@ -506,13 +500,11 @@ var useAutocomplete = ({
506
500
  ]);
507
501
  const onFocusLast = (0, import_react.useCallback)(() => {
508
502
  const id2 = setTimeout(() => {
509
- if (isEmpty || isAllSelected)
510
- return;
503
+ if (isEmpty || isAllSelected) return;
511
504
  const last = descendants.enabledLastValue(
512
505
  ({ node }) => "target" in node.dataset
513
506
  );
514
- if (!last)
515
- return;
507
+ if (!last) return;
516
508
  if (!isMulti || !omitSelectedValues) {
517
509
  setFocusedIndex(last.index);
518
510
  } else {
@@ -543,8 +535,7 @@ var useAutocomplete = ({
543
535
  return !isMulti ? node.dataset.value === value : value.includes((_a = node.dataset.value) != null ? _a : "");
544
536
  }
545
537
  );
546
- if (selected)
547
- setFocusedIndex(selected.index);
538
+ if (selected) setFocusedIndex(selected.index);
548
539
  });
549
540
  timeoutIds.current.add(id2);
550
541
  }, [descendants, isMulti, value]);
@@ -556,8 +547,7 @@ var useAutocomplete = ({
556
547
  index,
557
548
  ({ node }) => "target" in node.dataset
558
549
  );
559
- if (!next)
560
- return;
550
+ if (!next) return;
561
551
  if (!isMulti || !omitSelectedValues) {
562
552
  setFocusedIndex(next.index);
563
553
  } else {
@@ -588,8 +578,7 @@ var useAutocomplete = ({
588
578
  index,
589
579
  ({ node }) => "target" in node.dataset
590
580
  );
591
- if (!prev)
592
- return;
581
+ if (!prev) return;
593
582
  if (!isMulti || !omitSelectedValues) {
594
583
  setFocusedIndex(prev.index);
595
584
  } else {
@@ -643,8 +632,7 @@ var useAutocomplete = ({
643
632
  values.forEach(({ node }) => {
644
633
  node.dataset.target = "";
645
634
  });
646
- if (runFocus)
647
- onFocusFirst();
635
+ if (runFocus) onFocusFirst();
648
636
  setIsHit(true);
649
637
  },
650
638
  [descendants, onFocusFirst]
@@ -714,10 +702,8 @@ var useAutocomplete = ({
714
702
  }
715
703
  ).length > 0;
716
704
  onChangeLabel(newValue);
717
- if (allowFree || isHit2)
718
- setInputValue("");
719
- if (isMulti && runRebirth)
720
- rebirthOptions(false);
705
+ if (allowFree || isHit2) setInputValue("");
706
+ if (isMulti && runRebirth) rebirthOptions(false);
721
707
  },
722
708
  [
723
709
  allowFree,
@@ -734,14 +720,11 @@ var useAutocomplete = ({
734
720
  let enabledValue = descendants.value(focusedIndex);
735
721
  if ("disabled" in ((_a = enabledValue == null ? void 0 : enabledValue.node.dataset) != null ? _a : {}))
736
722
  enabledValue = void 0;
737
- if (!enabledValue)
738
- return;
723
+ if (!enabledValue) return;
739
724
  const value2 = (_b = enabledValue.node.dataset.value) != null ? _b : "";
740
725
  onChange(value2);
741
- if (closeOnSelect)
742
- onClose();
743
- if (omitSelectedValues)
744
- onFocusNext();
726
+ if (closeOnSelect) onClose();
727
+ if (omitSelectedValues) onFocusNext();
745
728
  }, [
746
729
  closeOnSelect,
747
730
  descendants,
@@ -753,8 +736,7 @@ var useAutocomplete = ({
753
736
  ]);
754
737
  const onSearch = (0, import_react.useCallback)(
755
738
  (ev) => {
756
- if (!isOpen)
757
- onOpen();
739
+ if (!isOpen) onOpen();
758
740
  onSearchProp == null ? void 0 : onSearchProp(ev);
759
741
  const value2 = ev.target.value;
760
742
  const computedValue = format(value2);
@@ -775,12 +757,10 @@ var useAutocomplete = ({
775
757
  }, []);
776
758
  const onCreate = (0, import_react.useCallback)(() => {
777
759
  var _a, _b;
778
- if (!listRef.current)
779
- return;
760
+ if (!listRef.current) return;
780
761
  const newItem = { label: inputValue, value: inputValue };
781
762
  let newItems = [];
782
- if (resolvedItems)
783
- newItems = resolvedItems;
763
+ if (resolvedItems) newItems = resolvedItems;
784
764
  if (firstInsertPositionItem === "first") {
785
765
  newItems = [newItem, ...newItems];
786
766
  } else if (firstInsertPositionItem === "last") {
@@ -823,31 +803,25 @@ var useAutocomplete = ({
823
803
  ]);
824
804
  const onClick = (0, import_react.useCallback)(() => {
825
805
  if (isOpen) {
826
- if (inputRef.current)
827
- inputRef.current.focus();
806
+ if (inputRef.current) inputRef.current.focus();
828
807
  } else {
829
808
  onOpen();
830
809
  onFocusFirstOrSelected();
831
810
  }
832
811
  }, [isOpen, onFocusFirstOrSelected, onOpen]);
833
812
  const onFocus = (0, import_react.useCallback)(() => {
834
- if (isOpen)
835
- return;
813
+ if (isOpen) return;
836
814
  onOpen();
837
815
  onFocusFirstOrSelected();
838
816
  }, [isOpen, onFocusFirstOrSelected, onOpen]);
839
817
  const onBlur = (0, import_react.useCallback)(
840
818
  (ev) => {
841
819
  const relatedTarget = (0, import_utils6.getEventRelatedTarget)(ev);
842
- if ((0, import_utils6.isContains)(containerRef.current, relatedTarget))
843
- return;
844
- if (!closeOnBlur && isHit)
845
- return;
846
- if (allowFree && !!inputValue)
847
- onChange(inputValue, false);
820
+ if ((0, import_utils6.isContains)(containerRef.current, relatedTarget)) return;
821
+ if (!closeOnBlur && isHit) return;
822
+ if (allowFree && !!inputValue) onChange(inputValue, false);
848
823
  setInputValue("");
849
- if (isOpen)
850
- onClose();
824
+ if (isOpen) onClose();
851
825
  },
852
826
  [closeOnBlur, isHit, isOpen, inputValue, allowFree, onClose, onChange]
853
827
  );
@@ -857,8 +831,7 @@ var useAutocomplete = ({
857
831
  } else {
858
832
  onChange(value[value.length - 1]);
859
833
  }
860
- if (!isOpen)
861
- onFocus();
834
+ if (!isOpen) onFocus();
862
835
  }, [isMulti, isOpen, onChange, onFocus, value]);
863
836
  const onClear = (0, import_react.useCallback)(
864
837
  (ev) => {
@@ -868,27 +841,22 @@ var useAutocomplete = ({
868
841
  setLabel(void 0);
869
842
  setInputValue("");
870
843
  rebirthOptions();
871
- if (isOpen && inputRef.current)
872
- inputRef.current.focus();
844
+ if (isOpen && inputRef.current) inputRef.current.focus();
873
845
  },
874
846
  [isOpen, setLabel, setInputValue, setValue, rebirthOptions]
875
847
  );
876
848
  const onKeyDown = (0, import_react.useCallback)(
877
849
  (ev) => {
878
- if (ev.key === " ")
879
- ev.key = ev.code;
880
- if (formControlProps.disabled || formControlProps.readOnly)
881
- return;
882
- if (isComposition.current)
883
- return;
850
+ if (ev.key === " ") ev.key = ev.code;
851
+ if (formControlProps.disabled || formControlProps.readOnly) return;
852
+ if (isComposition.current) return;
884
853
  const enabledDelete = label === inputValue || !inputValue.length;
885
854
  const actions = {
886
855
  ArrowDown: isFocused ? () => onFocusNext() : !isOpen ? (0, import_utils6.funcAll)(onOpen, onFocusFirstOrSelected) : void 0,
887
856
  ArrowUp: isFocused ? () => onFocusPrev() : !isOpen ? (0, import_utils6.funcAll)(onOpen, onFocusLastOrSelected) : void 0,
888
857
  Space: isCreate ? onCreate : isFocused ? onSelect : !isOpen ? (0, import_utils6.funcAll)(onOpen, onFocusFirstOrSelected) : void 0,
889
858
  Enter: isCreate ? onCreate : isFocused ? onSelect : !isOpen ? (0, import_utils6.funcAll)(onOpen, onFocusFirstOrSelected) : allowFree && isMulti ? () => {
890
- if (inputValue)
891
- onChange(inputValue);
859
+ if (inputValue) onChange(inputValue);
892
860
  setFocusedIndex(0);
893
861
  } : void 0,
894
862
  Home: isOpen ? onFocusFirst : void 0,
@@ -897,8 +865,7 @@ var useAutocomplete = ({
897
865
  Backspace: !isEmptyValue && enabledDelete ? onDelete : void 0
898
866
  };
899
867
  const action = actions[ev.key];
900
- if (!action)
901
- return;
868
+ if (!action) return;
902
869
  ev.preventDefault();
903
870
  ev.stopPropagation();
904
871
  action(ev);
@@ -929,10 +896,8 @@ var useAutocomplete = ({
929
896
  ]
930
897
  );
931
898
  (0, import_react.useEffect)(() => {
932
- if (!isMulti)
933
- return;
934
- if (!omitSelectedValues && (0, import_utils6.isUndefined)(maxSelectValues))
935
- return;
899
+ if (!isMulti) return;
900
+ if (!omitSelectedValues && (0, import_utils6.isUndefined)(maxSelectValues)) return;
936
901
  const isAll = value.length > 0 && value.length === descendants.count();
937
902
  const isMax = value.length === maxSelectValues;
938
903
  if (isAll || isMax) {
@@ -957,20 +922,17 @@ var useAutocomplete = ({
957
922
  const label2 = getSelectedValues(value);
958
923
  setLabel(label2);
959
924
  } else {
960
- if (prevValue.current === value)
961
- return;
925
+ if (prevValue.current === value) return;
962
926
  onChangeLabel(value, false);
963
927
  }
964
928
  }, [isMulti, value, onChangeLabel, getSelectedValues]);
965
929
  (0, import_utils6.useUpdateEffect)(() => {
966
- if (isOpen || allowFree)
967
- return;
930
+ if (isOpen || allowFree) return;
968
931
  setFocusedIndex(-1);
969
932
  setInputValue("");
970
933
  }, [isOpen]);
971
934
  (0, import_utils6.useUpdateEffect)(() => {
972
- if (!isHit)
973
- setFocusedIndex(-2);
935
+ if (!isHit) setFocusedIndex(-2);
974
936
  }, [isHit]);
975
937
  (0, import_utils6.useUnmountEffect)(() => {
976
938
  timeoutIds.current.forEach((id2) => clearTimeout(id2));
@@ -1079,8 +1041,7 @@ var useAutocompleteInput = () => {
1079
1041
  isOpen
1080
1042
  } = useAutocompleteContext();
1081
1043
  (0, import_utils6.useUpdateEffect)(() => {
1082
- if (isAllSelected && inputRef.current)
1083
- inputRef.current.blur();
1044
+ if (isAllSelected && inputRef.current) inputRef.current.blur();
1084
1045
  }, [isAllSelected]);
1085
1046
  const getInputProps = (0, import_react.useCallback)(
1086
1047
  (props = {}, ref = null) => ({
@@ -1133,14 +1094,11 @@ var useAutocompleteList = () => {
1133
1094
  const beforeFocusedIndex = (0, import_react.useRef)(-1);
1134
1095
  const selectedValue = descendants.value(focusedIndex);
1135
1096
  const onAnimationComplete = (0, import_react.useCallback)(() => {
1136
- if (!isOpen)
1137
- rebirthOptions(false);
1097
+ if (!isOpen) rebirthOptions(false);
1138
1098
  }, [isOpen, rebirthOptions]);
1139
1099
  (0, import_react.useEffect)(() => {
1140
- if (!listRef.current || !selectedValue)
1141
- return;
1142
- if (beforeFocusedIndex.current === selectedValue.index)
1143
- return;
1100
+ if (!listRef.current || !selectedValue) return;
1101
+ if (beforeFocusedIndex.current === selectedValue.index) return;
1144
1102
  const parent = listRef.current;
1145
1103
  const child = selectedValue.node;
1146
1104
  const parentHeight = parent.clientHeight;
@@ -1165,8 +1123,7 @@ var useAutocompleteList = () => {
1165
1123
  beforeFocusedIndex.current = selectedValue.index;
1166
1124
  }, [listRef, selectedValue]);
1167
1125
  (0, import_utils6.useUpdateEffect)(() => {
1168
- if (!isOpen)
1169
- beforeFocusedIndex.current = -1;
1126
+ if (!isOpen) beforeFocusedIndex.current = -1;
1170
1127
  }, [isOpen]);
1171
1128
  const getListProps = (0, import_react.useCallback)(
1172
1129
  (props = {}, ref = null) => ({
@@ -1289,23 +1246,18 @@ var useAutocompleteOption = (props) => {
1289
1246
  (ev) => {
1290
1247
  ev.stopPropagation();
1291
1248
  if (isDisabled) {
1292
- if (inputRef.current)
1293
- inputRef.current.focus();
1249
+ if (inputRef.current) inputRef.current.focus();
1294
1250
  return;
1295
1251
  }
1296
1252
  if (!isTargetOption(ev.currentTarget)) {
1297
- if (inputRef.current)
1298
- inputRef.current.focus();
1253
+ if (inputRef.current) inputRef.current.focus();
1299
1254
  return;
1300
1255
  }
1301
1256
  setFocusedIndex(index);
1302
1257
  onChange(optionValue != null ? optionValue : "");
1303
- if (inputRef.current)
1304
- inputRef.current.focus();
1305
- if (customCloseOnSelect != null ? customCloseOnSelect : generalCloseOnSelect)
1306
- onClose();
1307
- if (omitSelectedValues)
1308
- onFocusNext(index);
1258
+ if (inputRef.current) inputRef.current.focus();
1259
+ if (customCloseOnSelect != null ? customCloseOnSelect : generalCloseOnSelect) onClose();
1260
+ if (omitSelectedValues) onFocusNext(index);
1309
1261
  },
1310
1262
  [
1311
1263
  onFocusNext,
@@ -1322,8 +1274,7 @@ var useAutocompleteOption = (props) => {
1322
1274
  ]
1323
1275
  );
1324
1276
  (0, import_utils6.useUpdateEffect)(() => {
1325
- if (isSelected)
1326
- onChangeLabel(optionValue != null ? optionValue : "", false);
1277
+ if (isSelected) onChangeLabel(optionValue != null ? optionValue : "", false);
1327
1278
  }, [optionValue]);
1328
1279
  const getOptionProps = (0, import_react.useCallback)(
1329
1280
  (props2 = {}, ref = null) => {
@@ -1631,15 +1582,13 @@ var MultiAutocompleteField = (0, import_core8.forwardRef)(
1631
1582
  const { value, label, inputValue, onChange, isOpen, inputRef, styles } = useAutocompleteContext();
1632
1583
  const { getInputProps } = useAutocompleteInput();
1633
1584
  const cloneChildren = (0, import_react3.useMemo)(() => {
1634
- if (!(label == null ? void 0 : label.length))
1635
- return null;
1585
+ if (!(label == null ? void 0 : label.length)) return null;
1636
1586
  if (component) {
1637
1587
  return label.map((label2, index) => {
1638
1588
  const onRemove = (ev) => {
1639
1589
  ev.stopPropagation();
1640
1590
  onChange(value[index]);
1641
- if (inputRef.current)
1642
- inputRef.current.focus();
1591
+ if (inputRef.current) inputRef.current.focus();
1643
1592
  };
1644
1593
  const el = component({
1645
1594
  value: value[index],