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

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.
@@ -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],