@yamada-ui/autocomplete 0.2.10 → 0.2.12

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 (35) hide show
  1. package/dist/autocomplete-create.js +24 -17
  2. package/dist/autocomplete-create.mjs +1 -1
  3. package/dist/autocomplete-empty.js +24 -17
  4. package/dist/autocomplete-empty.mjs +1 -1
  5. package/dist/autocomplete-icon.js +30 -23
  6. package/dist/autocomplete-icon.mjs +1 -1
  7. package/dist/autocomplete-list.js +4 -1
  8. package/dist/autocomplete-list.mjs +1 -1
  9. package/dist/autocomplete-option-group.d.mts +1 -1
  10. package/dist/autocomplete-option-group.d.ts +1 -1
  11. package/dist/autocomplete-option-group.js +10 -5
  12. package/dist/autocomplete-option-group.mjs +1 -1
  13. package/dist/autocomplete-option.d.mts +1 -1
  14. package/dist/autocomplete-option.d.ts +1 -1
  15. package/dist/autocomplete-option.js +33 -22
  16. package/dist/autocomplete-option.mjs +1 -1
  17. package/dist/autocomplete.d.mts +1 -1
  18. package/dist/autocomplete.d.ts +1 -1
  19. package/dist/autocomplete.js +226 -120
  20. package/dist/autocomplete.mjs +1 -1
  21. package/dist/{chunk-5O3XEEJE.mjs → chunk-ZVZP7IWT.mjs} +352 -229
  22. package/dist/index.d.mts +1 -1
  23. package/dist/index.d.ts +1 -1
  24. package/dist/index.js +345 -229
  25. package/dist/index.mjs +1 -1
  26. package/dist/multi-autocomplete.d.mts +1 -1
  27. package/dist/multi-autocomplete.d.ts +1 -1
  28. package/dist/multi-autocomplete.js +245 -149
  29. package/dist/multi-autocomplete.mjs +1 -1
  30. package/dist/{use-autocomplete-cbe9b443.d.ts → use-autocomplete-2422c1c8.d.ts} +25 -5
  31. package/dist/use-autocomplete.d.mts +1 -1
  32. package/dist/use-autocomplete.d.ts +1 -1
  33. package/dist/use-autocomplete.js +131 -45
  34. package/dist/use-autocomplete.mjs +1 -1
  35. package/package.json +11 -11
package/dist/index.mjs CHANGED
@@ -5,7 +5,7 @@ import {
5
5
  AutocompleteOption,
6
6
  AutocompleteOptionGroup,
7
7
  MultiAutocomplete
8
- } from "./chunk-5O3XEEJE.mjs";
8
+ } from "./chunk-ZVZP7IWT.mjs";
9
9
  export {
10
10
  Autocomplete,
11
11
  AutocompleteCreate,
@@ -3,7 +3,7 @@ import { ThemeProps, HTMLUIProps } from '@yamada-ui/core';
3
3
  import { FC, MouseEventHandler } from 'react';
4
4
  import { AutocompleteIconProps } from './autocomplete-icon.mjs';
5
5
  import { AutocompleteListProps } from './autocomplete-list.mjs';
6
- import { b as UseAutocompleteProps } from './use-autocomplete-cbe9b443.js';
6
+ import { b as UseAutocompleteProps } from './use-autocomplete-2422c1c8.js';
7
7
  import 'react/jsx-runtime';
8
8
  import '@yamada-ui/form-control';
9
9
  import '@yamada-ui/popover';
@@ -3,7 +3,7 @@ import { ThemeProps, HTMLUIProps } from '@yamada-ui/core';
3
3
  import { FC, MouseEventHandler } from 'react';
4
4
  import { AutocompleteIconProps } from './autocomplete-icon.js';
5
5
  import { AutocompleteListProps } from './autocomplete-list.js';
6
- import { b as UseAutocompleteProps } from './use-autocomplete-cbe9b443.js';
6
+ import { b as UseAutocompleteProps } from './use-autocomplete-2422c1c8.js';
7
7
  import 'react/jsx-runtime';
8
8
  import '@yamada-ui/form-control';
9
9
  import '@yamada-ui/popover';
@@ -338,7 +338,10 @@ var kanaMap = {
338
338
  "\uFF65": "\u30FB"
339
339
  };
340
340
  var defaultFormat = (value) => {
341
- value = value.replace(/[!-~]/g, (v) => String.fromCharCode(v.charCodeAt(0) - 65248));
341
+ value = value.replace(
342
+ /[!-~]/g,
343
+ (v) => String.fromCharCode(v.charCodeAt(0) - 65248)
344
+ );
342
345
  const reg = new RegExp("(" + Object.keys(kanaMap).join("|") + ")", "g");
343
346
  value = value.replace(reg, (v) => kanaMap[v]).replace(/゙/g, "\u309B").replace(/゚/g, "\u309C");
344
347
  value = value.toUpperCase();
@@ -395,7 +398,14 @@ var useAutocomplete = ({
395
398
  const { id } = rest;
396
399
  const formControlProps = (0, import_utils6.pickObject)(rest, import_form_control.formControlProperties);
397
400
  const [containerProps, inputProps] = (0, import_utils6.splitObject)(
398
- (0, import_utils6.omitObject)(rest, ["id", "value", "defaultValue", "onChange", "month", "onChangeMonth"]),
401
+ (0, import_utils6.omitObject)(rest, [
402
+ "id",
403
+ "value",
404
+ "defaultValue",
405
+ "onChange",
406
+ "month",
407
+ "onChangeMonth"
408
+ ]),
399
409
  import_core6.layoutStylesProperties
400
410
  );
401
411
  const descendants = useAutocompleteDescendants();
@@ -447,9 +457,17 @@ var useAutocomplete = ({
447
457
  if (!(0, import_utils6.isArray)(value2)) {
448
458
  return /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(AutocompleteOption, { value: value2, ...props, children: label }, i);
449
459
  } else {
450
- return /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(AutocompleteOptionGroup, { label, ...props, children: value2.map(
451
- ({ label: label2, value: value3, ...props2 }, i2) => !(0, import_utils6.isArray)(value3) ? /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(AutocompleteOption, { value: value3, ...props2, children: label2 }, i2) : null
452
- ) }, i);
460
+ return /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
461
+ AutocompleteOptionGroup,
462
+ {
463
+ label,
464
+ ...props,
465
+ children: value2.map(
466
+ ({ label: label2, value: value3, ...props2 }, i2) => !(0, import_utils6.isArray)(value3) ? /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(AutocompleteOption, { value: value3, ...props2, children: label2 }, i2) : null
467
+ )
468
+ },
469
+ i
470
+ );
453
471
  }
454
472
  });
455
473
  const isEmpty = !validChildren.length && !(computedChildren == null ? void 0 : computedChildren.length);
@@ -473,7 +491,9 @@ var useAutocomplete = ({
473
491
  const id2 = setTimeout(() => {
474
492
  if (isEmpty || isAllSelected)
475
493
  return;
476
- const first = descendants.enabledfirstValue(({ node }) => "target" in node.dataset);
494
+ const first = descendants.enabledfirstValue(
495
+ ({ node }) => "target" in node.dataset
496
+ );
477
497
  if (!first)
478
498
  return;
479
499
  if (!isMulti || !omitSelectedValues) {
@@ -501,7 +521,9 @@ var useAutocomplete = ({
501
521
  const id2 = setTimeout(() => {
502
522
  if (isEmpty || isAllSelected)
503
523
  return;
504
- const last = descendants.enabledlastValue(({ node }) => "target" in node.dataset);
524
+ const last = descendants.enabledlastValue(
525
+ ({ node }) => "target" in node.dataset
526
+ );
505
527
  if (!last)
506
528
  return;
507
529
  if (!isMulti || !omitSelectedValues) {
@@ -543,7 +565,10 @@ var useAutocomplete = ({
543
565
  (index = focusedIndex) => {
544
566
  const id2 = setTimeout(() => {
545
567
  var _a;
546
- const next = descendants.enabledNextValue(index, ({ node }) => "target" in node.dataset);
568
+ const next = descendants.enabledNextValue(
569
+ index,
570
+ ({ node }) => "target" in node.dataset
571
+ );
547
572
  if (!next)
548
573
  return;
549
574
  if (!isMulti || !omitSelectedValues) {
@@ -559,13 +584,23 @@ var useAutocomplete = ({
559
584
  });
560
585
  timeoutIds.current.add(id2);
561
586
  },
562
- [descendants, enabledValues, focusedIndex, isMulti, omitSelectedValues, selectedIndexes]
587
+ [
588
+ descendants,
589
+ enabledValues,
590
+ focusedIndex,
591
+ isMulti,
592
+ omitSelectedValues,
593
+ selectedIndexes
594
+ ]
563
595
  );
564
596
  const onFocusPrev = (0, import_react.useCallback)(
565
597
  (index = focusedIndex) => {
566
598
  const id2 = setTimeout(() => {
567
599
  var _a;
568
- const prev = descendants.enabledPrevValue(index, ({ node }) => "target" in node.dataset);
600
+ const prev = descendants.enabledPrevValue(
601
+ index,
602
+ ({ node }) => "target" in node.dataset
603
+ );
569
604
  if (!prev)
570
605
  return;
571
606
  if (!isMulti || !omitSelectedValues) {
@@ -581,7 +616,14 @@ var useAutocomplete = ({
581
616
  });
582
617
  timeoutIds.current.add(id2);
583
618
  },
584
- [descendants, enabledValues, focusedIndex, isMulti, omitSelectedValues, selectedIndexes]
619
+ [
620
+ descendants,
621
+ enabledValues,
622
+ focusedIndex,
623
+ isMulti,
624
+ omitSelectedValues,
625
+ selectedIndexes
626
+ ]
585
627
  );
586
628
  const onFocusFirstOrSelected = isEmptyValue || omitSelectedValues ? onFocusFirst : onFocusSelected;
587
629
  const onFocusLastOrSelected = isEmptyValue || omitSelectedValues ? onFocusLast : onFocusSelected;
@@ -678,7 +720,15 @@ var useAutocomplete = ({
678
720
  onClose();
679
721
  if (omitSelectedValues)
680
722
  onFocusNext();
681
- }, [closeOnSelect, descendants, focusedIndex, omitSelectedValues, onChange, onClose, onFocusNext]);
723
+ }, [
724
+ closeOnSelect,
725
+ descendants,
726
+ focusedIndex,
727
+ omitSelectedValues,
728
+ onChange,
729
+ onClose,
730
+ onFocusNext
731
+ ]);
682
732
  const onSearch = (0, import_react.useCallback)(
683
733
  (ev) => {
684
734
  var _a;
@@ -715,12 +765,20 @@ var useAutocomplete = ({
715
765
  } else if (firstInsertPositionOnCreate === "last") {
716
766
  newOptions = [...newOptions, newOption];
717
767
  } else {
718
- const i = newOptions.findIndex(({ label }) => label === firstInsertPositionOnCreate);
768
+ const i = newOptions.findIndex(
769
+ ({ label }) => label === firstInsertPositionOnCreate
770
+ );
719
771
  if (i !== -1 && (0, import_utils6.isArray)(newOptions[i].value)) {
720
772
  if (secondInsertPositionOnCreate === "first") {
721
- newOptions[i].value = [newOption, ...newOptions[i].value];
773
+ newOptions[i].value = [
774
+ newOption,
775
+ ...newOptions[i].value
776
+ ];
722
777
  } else {
723
- newOptions[i].value = [...newOptions[i].value, newOption];
778
+ newOptions[i].value = [
779
+ ...newOptions[i].value,
780
+ newOption
781
+ ];
724
782
  }
725
783
  } else {
726
784
  console.warn(
@@ -731,7 +789,9 @@ var useAutocomplete = ({
731
789
  setOptions(newOptions);
732
790
  onChange(inputValue);
733
791
  rebirthOptions(false);
734
- const index = flattenOptions(newOptions).findIndex(({ value: value2 }) => value2 === inputValue);
792
+ const index = flattenOptions(newOptions).findIndex(
793
+ ({ value: value2 }) => value2 === inputValue
794
+ );
735
795
  setFocusedIndex(index);
736
796
  (_a = rest.onCreate) == null ? void 0 : _a.call(rest, newOption, newOptions);
737
797
  }, [
@@ -850,7 +910,14 @@ var useAutocomplete = ({
850
910
  } else {
851
911
  setIsAllSelected(false);
852
912
  }
853
- }, [omitSelectedValues, value, descendants, isMulti, onClose, maxSelectedValues]);
913
+ }, [
914
+ omitSelectedValues,
915
+ value,
916
+ descendants,
917
+ isMulti,
918
+ onClose,
919
+ maxSelectedValues
920
+ ]);
854
921
  (0, import_utils6.useUpdateEffect)(() => {
855
922
  if (isOpen)
856
923
  return;
@@ -1052,7 +1119,10 @@ var useAutocompleteList = () => {
1052
1119
  role: "select",
1053
1120
  tabIndex: -1,
1054
1121
  ...props,
1055
- onAnimationComplete: (0, import_utils6.handlerAll)(props.onAnimationComplete, onAnimationComplete)
1122
+ onAnimationComplete: (0, import_utils6.handlerAll)(
1123
+ props.onAnimationComplete,
1124
+ onAnimationComplete
1125
+ )
1056
1126
  }),
1057
1127
  [listRef, onAnimationComplete]
1058
1128
  );
@@ -1060,15 +1130,20 @@ var useAutocompleteList = () => {
1060
1130
  getListProps
1061
1131
  };
1062
1132
  };
1063
- var useAutocompleteOptionGroup = ({ label, ...rest }) => {
1133
+ var useAutocompleteOptionGroup = ({
1134
+ label,
1135
+ ...rest
1136
+ }) => {
1064
1137
  const { value, omitSelectedValues } = useAutocompleteContext();
1065
1138
  const isMulti = (0, import_utils6.isArray)(value);
1066
1139
  const descendants = useAutocompleteDescendantsContext();
1067
1140
  const values = descendants.values();
1068
- const selectedValues = isMulti && omitSelectedValues ? descendants.values(({ node }) => {
1069
- var _a;
1070
- return value.includes((_a = node.dataset.value) != null ? _a : "");
1071
- }) : [];
1141
+ const selectedValues = isMulti && omitSelectedValues ? descendants.values(
1142
+ ({ node }) => {
1143
+ var _a;
1144
+ return value.includes((_a = node.dataset.value) != null ? _a : "");
1145
+ }
1146
+ ) : [];
1072
1147
  const selectedIndexes = selectedValues.map(({ index }) => index);
1073
1148
  const childValues = values.filter(
1074
1149
  ({ node, index }) => {
@@ -1143,14 +1218,18 @@ var useAutocompleteOption = (props) => {
1143
1218
  } = { ...optionProps, ...props };
1144
1219
  const trulyDisabled = !!isDisabled && !isFocusable;
1145
1220
  const itemRef = (0, import_react.useRef)(null);
1146
- const { index, register, descendants } = useAutocompleteDescendant({ disabled: trulyDisabled });
1221
+ const { index, register, descendants } = useAutocompleteDescendant({
1222
+ disabled: trulyDisabled
1223
+ });
1147
1224
  const values = descendants.values();
1148
1225
  const frontValues = values.slice(0, index);
1149
1226
  const isMulti = (0, import_utils6.isArray)(value);
1150
- const isDuplicated = !isMulti ? frontValues.some(({ node }) => {
1151
- var _a2;
1152
- return node.dataset.value === ((_a2 = computedProps.value) != null ? _a2 : "");
1153
- }) : false;
1227
+ const isDuplicated = !isMulti ? frontValues.some(
1228
+ ({ node }) => {
1229
+ var _a2;
1230
+ return node.dataset.value === ((_a2 = computedProps.value) != null ? _a2 : "");
1231
+ }
1232
+ ) : false;
1154
1233
  const isSelected = !isDuplicated && (!isMulti ? ((_a = computedProps.value) != null ? _a : "") === value : value.includes((_b = computedProps.value) != null ? _b : ""));
1155
1234
  const isTarget = "target" in ((_d = (_c = itemRef.current) == null ? void 0 : _c.dataset) != null ? _d : {});
1156
1235
  const isFocused = index === focusedIndex;
@@ -1329,7 +1408,16 @@ var AutocompleteIcon = (0, import_core7.forwardRef)(
1329
1408
  }
1330
1409
  })
1331
1410
  );
1332
- return /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(import_core7.ui.div, { ref, className: (0, import_utils7.cx)("ui-autocomplete-icon", className), __css: css, ...rest, children: (0, import_utils7.isValidElement)(children) ? cloneChildren : /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(import_icon.ChevronIcon, {}) });
1411
+ return /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
1412
+ import_core7.ui.div,
1413
+ {
1414
+ ref,
1415
+ className: (0, import_utils7.cx)("ui-autocomplete-icon", className),
1416
+ __css: css,
1417
+ ...rest,
1418
+ children: (0, import_utils7.isValidElement)(children) ? cloneChildren : /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(import_icon.ChevronIcon, {})
1419
+ }
1420
+ );
1333
1421
  }
1334
1422
  );
1335
1423
  var AutocompleteClearIcon = ({
@@ -1355,131 +1443,131 @@ var AutocompleteClearIcon = ({
1355
1443
  }
1356
1444
  );
1357
1445
  };
1358
- var AutocompleteItemIcon = (0, import_core7.forwardRef)(
1359
- ({ className, ...rest }, ref) => {
1360
- const { styles } = useAutocompleteContext();
1446
+ var AutocompleteItemIcon = (0, import_core7.forwardRef)(({ className, ...rest }, ref) => {
1447
+ const { styles } = useAutocompleteContext();
1448
+ const css = {
1449
+ flexShrink: 0,
1450
+ display: "inline-flex",
1451
+ justifyContent: "center",
1452
+ alignItems: "center",
1453
+ fontSize: "0.85em",
1454
+ ...styles.itemIcon
1455
+ };
1456
+ return /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
1457
+ import_core7.ui.span,
1458
+ {
1459
+ ref,
1460
+ className: (0, import_utils7.cx)("ui-autocomplete-item-icon", className),
1461
+ __css: css,
1462
+ ...rest
1463
+ }
1464
+ );
1465
+ });
1466
+
1467
+ // src/multi-autocomplete.tsx
1468
+ var import_jsx_runtime8 = require("react/jsx-runtime");
1469
+ var MultiAutocomplete = (0, import_core8.forwardRef)(
1470
+ (props, ref) => {
1471
+ const [styles, mergedProps] = (0, import_core8.useMultiComponentStyle)("Select", props);
1472
+ let {
1473
+ className,
1474
+ defaultValue = [],
1475
+ component,
1476
+ separator,
1477
+ isClearable = true,
1478
+ color,
1479
+ h,
1480
+ height,
1481
+ minH,
1482
+ minHeight,
1483
+ closeOnSelect = false,
1484
+ keepPlaceholder = false,
1485
+ containerProps,
1486
+ listProps,
1487
+ inputProps,
1488
+ iconProps,
1489
+ clearIconProps,
1490
+ children,
1491
+ ...computedProps
1492
+ } = (0, import_core8.omitThemeProps)(mergedProps);
1493
+ const {
1494
+ value,
1495
+ descendants,
1496
+ formControlProps,
1497
+ getPopoverProps,
1498
+ getContainerProps,
1499
+ getFieldProps,
1500
+ createOption,
1501
+ isEmpty,
1502
+ inputValue,
1503
+ computedChildren,
1504
+ onClear,
1505
+ ...rest
1506
+ } = useAutocomplete({
1507
+ ...computedProps,
1508
+ defaultValue,
1509
+ closeOnSelect,
1510
+ children
1511
+ });
1512
+ h = h != null ? h : height;
1513
+ minH = minH != null ? minH : minHeight;
1361
1514
  const css = {
1362
- flexShrink: 0,
1363
- display: "inline-flex",
1364
- justifyContent: "center",
1365
- alignItems: "center",
1366
- fontSize: "0.85em",
1367
- ...styles.itemIcon
1515
+ position: "relative",
1516
+ w: "100%",
1517
+ h: "fit-content",
1518
+ color,
1519
+ ...styles.container
1368
1520
  };
1369
- return /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
1370
- import_core7.ui.span,
1521
+ return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(AutocompleteDescendantsContextProvider, { value: descendants, children: /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
1522
+ AutocompleteProvider,
1371
1523
  {
1372
- ref,
1373
- className: (0, import_utils7.cx)("ui-autocomplete-item-icon", className),
1374
- __css: css,
1375
- ...rest
1524
+ value: {
1525
+ ...rest,
1526
+ value,
1527
+ formControlProps,
1528
+ inputValue,
1529
+ createOption,
1530
+ isEmpty,
1531
+ styles
1532
+ },
1533
+ children: /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(import_popover2.Popover, { ...getPopoverProps(), children: /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)(
1534
+ import_core8.ui.div,
1535
+ {
1536
+ className: (0, import_utils8.cx)("ui-autocomplete", className),
1537
+ __css: css,
1538
+ ...getContainerProps(containerProps),
1539
+ children: [
1540
+ /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
1541
+ MultiAutocompleteField,
1542
+ {
1543
+ component,
1544
+ separator,
1545
+ keepPlaceholder,
1546
+ h,
1547
+ minH,
1548
+ inputProps,
1549
+ ...getFieldProps({}, ref)
1550
+ }
1551
+ ),
1552
+ isClearable && value.length ? /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
1553
+ AutocompleteClearIcon,
1554
+ {
1555
+ ...clearIconProps,
1556
+ onClick: (0, import_utils8.handlerAll)(clearIconProps == null ? void 0 : clearIconProps.onClick, onClear),
1557
+ ...formControlProps
1558
+ }
1559
+ ) : /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(AutocompleteIcon, { ...iconProps, ...formControlProps }),
1560
+ !isEmpty ? /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)(AutocompleteList, { ...listProps, children: [
1561
+ createOption ? /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(AutocompleteCreate, {}) : /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(AutocompleteEmpty, {}),
1562
+ children != null ? children : computedChildren
1563
+ ] }) : /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(AutocompleteList, { ...listProps, children: createOption && inputValue ? /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(AutocompleteCreate, {}) : /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(AutocompleteEmpty, {}) })
1564
+ ]
1565
+ }
1566
+ ) })
1376
1567
  }
1377
- );
1568
+ ) });
1378
1569
  }
1379
1570
  );
1380
-
1381
- // src/multi-autocomplete.tsx
1382
- var import_jsx_runtime8 = require("react/jsx-runtime");
1383
- var MultiAutocomplete = (0, import_core8.forwardRef)((props, ref) => {
1384
- const [styles, mergedProps] = (0, import_core8.useMultiComponentStyle)("Select", props);
1385
- let {
1386
- className,
1387
- defaultValue = [],
1388
- component,
1389
- separator,
1390
- isClearable = true,
1391
- color,
1392
- h,
1393
- height,
1394
- minH,
1395
- minHeight,
1396
- closeOnSelect = false,
1397
- keepPlaceholder = false,
1398
- containerProps,
1399
- listProps,
1400
- inputProps,
1401
- iconProps,
1402
- clearIconProps,
1403
- children,
1404
- ...computedProps
1405
- } = (0, import_core8.omitThemeProps)(mergedProps);
1406
- const {
1407
- value,
1408
- descendants,
1409
- formControlProps,
1410
- getPopoverProps,
1411
- getContainerProps,
1412
- getFieldProps,
1413
- createOption,
1414
- isEmpty,
1415
- inputValue,
1416
- computedChildren,
1417
- onClear,
1418
- ...rest
1419
- } = useAutocomplete({
1420
- ...computedProps,
1421
- defaultValue,
1422
- closeOnSelect,
1423
- children
1424
- });
1425
- h = h != null ? h : height;
1426
- minH = minH != null ? minH : minHeight;
1427
- const css = {
1428
- position: "relative",
1429
- w: "100%",
1430
- h: "fit-content",
1431
- color,
1432
- ...styles.container
1433
- };
1434
- return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(AutocompleteDescendantsContextProvider, { value: descendants, children: /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
1435
- AutocompleteProvider,
1436
- {
1437
- value: {
1438
- ...rest,
1439
- value,
1440
- formControlProps,
1441
- inputValue,
1442
- createOption,
1443
- isEmpty,
1444
- styles
1445
- },
1446
- children: /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(import_popover2.Popover, { ...getPopoverProps(), children: /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)(
1447
- import_core8.ui.div,
1448
- {
1449
- className: (0, import_utils8.cx)("ui-autocomplete", className),
1450
- __css: css,
1451
- ...getContainerProps(containerProps),
1452
- children: [
1453
- /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
1454
- MultiAutocompleteField,
1455
- {
1456
- component,
1457
- separator,
1458
- keepPlaceholder,
1459
- h,
1460
- minH,
1461
- inputProps,
1462
- ...getFieldProps({}, ref)
1463
- }
1464
- ),
1465
- isClearable && value.length ? /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
1466
- AutocompleteClearIcon,
1467
- {
1468
- ...clearIconProps,
1469
- onClick: (0, import_utils8.handlerAll)(clearIconProps == null ? void 0 : clearIconProps.onClick, onClear),
1470
- ...formControlProps
1471
- }
1472
- ) : /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(AutocompleteIcon, { ...iconProps, ...formControlProps }),
1473
- !isEmpty ? /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)(AutocompleteList, { ...listProps, children: [
1474
- createOption ? /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(AutocompleteCreate, {}) : /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(AutocompleteEmpty, {}),
1475
- children != null ? children : computedChildren
1476
- ] }) : /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(AutocompleteList, { ...listProps, children: createOption && inputValue ? /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(AutocompleteCreate, {}) : /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(AutocompleteEmpty, {}) })
1477
- ]
1478
- }
1479
- ) })
1480
- }
1481
- ) });
1482
- });
1483
1571
  var MultiAutocompleteField = (0, import_core8.forwardRef)(
1484
1572
  ({
1485
1573
  className,
@@ -1492,7 +1580,15 @@ var MultiAutocompleteField = (0, import_core8.forwardRef)(
1492
1580
  inputProps,
1493
1581
  ...rest
1494
1582
  }, ref) => {
1495
- const { value, displayValue, inputValue, onChange, isOpen, inputRef, styles } = useAutocompleteContext();
1583
+ const {
1584
+ value,
1585
+ displayValue,
1586
+ inputValue,
1587
+ onChange,
1588
+ isOpen,
1589
+ inputRef,
1590
+ styles
1591
+ } = useAutocompleteContext();
1496
1592
  const { getInputProps } = useAutocompleteInput();
1497
1593
  const cloneChildren = (0, import_react3.useMemo)(() => {
1498
1594
  if (!(displayValue == null ? void 0 : displayValue.length))
@@ -1,6 +1,6 @@
1
1
  import {
2
2
  MultiAutocomplete
3
- } from "./chunk-5O3XEEJE.mjs";
3
+ } from "./chunk-ZVZP7IWT.mjs";
4
4
  export {
5
5
  MultiAutocomplete
6
6
  };
@@ -425,7 +425,11 @@ declare const AutocompleteDescendantsContextProvider: react.Provider<{
425
425
  } & {
426
426
  node: HTMLElement;
427
427
  index: number;
428
- }) | undefined;
428
+ }) | undefined; /**
429
+ * The position to be inserted when the autocomplete option is created.
430
+ *
431
+ * @default 'first'
432
+ */
429
433
  enabledIndexOf: (node: HTMLElement | null, filter?: ((value: {
430
434
  disabled?: boolean | undefined;
431
435
  id?: string | undefined;
@@ -1022,7 +1026,11 @@ declare const useAutocompleteDescendantsContext: () => {
1022
1026
  } & {
1023
1027
  node: HTMLElement;
1024
1028
  index: number;
1025
- }) | undefined;
1029
+ }) | undefined; /**
1030
+ * The position to be inserted when the autocomplete option is created.
1031
+ *
1032
+ * @default 'first'
1033
+ */
1026
1034
  enabledIndexOf: (node: HTMLElement | null, filter?: ((value: {
1027
1035
  disabled?: boolean | undefined;
1028
1036
  id?: string | undefined;
@@ -1619,7 +1627,11 @@ declare const useAutocompleteDescendants: () => {
1619
1627
  } & {
1620
1628
  node: HTMLElement;
1621
1629
  index: number;
1622
- }) | undefined;
1630
+ }) | undefined; /**
1631
+ * The position to be inserted when the autocomplete option is created.
1632
+ *
1633
+ * @default 'first'
1634
+ */
1623
1635
  enabledIndexOf: (node: HTMLElement | null, filter?: ((value: {
1624
1636
  disabled?: boolean | undefined;
1625
1637
  id?: string | undefined;
@@ -2847,7 +2859,11 @@ declare const useAutocompleteDescendant: (options?: {
2847
2859
  } & {
2848
2860
  node: HTMLElement;
2849
2861
  index: number;
2850
- }) | undefined;
2862
+ }) | undefined; /**
2863
+ * The position to be inserted when the autocomplete option is created.
2864
+ *
2865
+ * @default 'first'
2866
+ */
2851
2867
  enabledIndexOf: (node: HTMLElement | null, filter?: ((value: {
2852
2868
  disabled?: boolean | undefined;
2853
2869
  id?: string | undefined;
@@ -3828,7 +3844,11 @@ declare const useAutocomplete: <T extends string | string[] = string>({ defaultI
3828
3844
  } & {
3829
3845
  node: HTMLElement;
3830
3846
  index: number;
3831
- }) | undefined;
3847
+ }) | undefined; /**
3848
+ * The position to be inserted when the autocomplete option is created.
3849
+ *
3850
+ * @default 'first'
3851
+ */
3832
3852
  enabledIndexOf: (node: HTMLElement | null, filter?: ((value: {
3833
3853
  disabled?: boolean | undefined;
3834
3854
  id?: string | undefined;
@@ -5,4 +5,4 @@ import '@yamada-ui/form-control';
5
5
  import '@yamada-ui/popover';
6
6
  import '@yamada-ui/select';
7
7
  import '@yamada-ui/utils';
8
- export { c as AutocompleteDescendantsContextProvider, f as AutocompleteProvider, s as UseAutocompleteCreateReturn, v as UseAutocompleteEmptyReturn, k as UseAutocompleteInputReturn, U as UseAutocompleteOptionGroupProps, n as UseAutocompleteOptionGroupReturn, o as UseAutocompleteOptionProps, q as UseAutocompleteOptionReturn, b as UseAutocompleteProps, i as UseAutocompleteReturn, h as useAutocomplete, g as useAutocompleteContext, r as useAutocompleteCreate, e as useAutocompleteDescendant, d as useAutocompleteDescendants, u as useAutocompleteDescendantsContext, t as useAutocompleteEmpty, j as useAutocompleteInput, l as useAutocompleteList, p as useAutocompleteOption, m as useAutocompleteOptionGroup } from './use-autocomplete-cbe9b443.js';
8
+ export { c as AutocompleteDescendantsContextProvider, f as AutocompleteProvider, s as UseAutocompleteCreateReturn, v as UseAutocompleteEmptyReturn, k as UseAutocompleteInputReturn, U as UseAutocompleteOptionGroupProps, n as UseAutocompleteOptionGroupReturn, o as UseAutocompleteOptionProps, q as UseAutocompleteOptionReturn, b as UseAutocompleteProps, i as UseAutocompleteReturn, h as useAutocomplete, g as useAutocompleteContext, r as useAutocompleteCreate, e as useAutocompleteDescendant, d as useAutocompleteDescendants, u as useAutocompleteDescendantsContext, t as useAutocompleteEmpty, j as useAutocompleteInput, l as useAutocompleteList, p as useAutocompleteOption, m as useAutocompleteOptionGroup } from './use-autocomplete-2422c1c8.js';
@@ -5,4 +5,4 @@ import '@yamada-ui/form-control';
5
5
  import '@yamada-ui/popover';
6
6
  import '@yamada-ui/select';
7
7
  import '@yamada-ui/utils';
8
- export { c as AutocompleteDescendantsContextProvider, f as AutocompleteProvider, s as UseAutocompleteCreateReturn, v as UseAutocompleteEmptyReturn, k as UseAutocompleteInputReturn, U as UseAutocompleteOptionGroupProps, n as UseAutocompleteOptionGroupReturn, o as UseAutocompleteOptionProps, q as UseAutocompleteOptionReturn, b as UseAutocompleteProps, i as UseAutocompleteReturn, h as useAutocomplete, g as useAutocompleteContext, r as useAutocompleteCreate, e as useAutocompleteDescendant, d as useAutocompleteDescendants, u as useAutocompleteDescendantsContext, t as useAutocompleteEmpty, j as useAutocompleteInput, l as useAutocompleteList, p as useAutocompleteOption, m as useAutocompleteOptionGroup } from './use-autocomplete-cbe9b443.js';
8
+ export { c as AutocompleteDescendantsContextProvider, f as AutocompleteProvider, s as UseAutocompleteCreateReturn, v as UseAutocompleteEmptyReturn, k as UseAutocompleteInputReturn, U as UseAutocompleteOptionGroupProps, n as UseAutocompleteOptionGroupReturn, o as UseAutocompleteOptionProps, q as UseAutocompleteOptionReturn, b as UseAutocompleteProps, i as UseAutocompleteReturn, h as useAutocomplete, g as useAutocompleteContext, r as useAutocompleteCreate, e as useAutocompleteDescendant, d as useAutocompleteDescendants, u as useAutocompleteDescendantsContext, t as useAutocompleteEmpty, j as useAutocompleteInput, l as useAutocompleteList, p as useAutocompleteOption, m as useAutocompleteOptionGroup } from './use-autocomplete-2422c1c8.js';