@yamada-ui/autocomplete 0.2.10 → 0.2.12

package/dist/use-autocomplete.js

@@ -77,31 +77,38 @@ var AutocompleteIcon = (0, import_core.forwardRef)(
         }
       })
     );
-    return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_core.ui.div, { ref, className: (0, import_utils.cx)("ui-autocomplete-icon", className), __css: css, ...rest, children: (0, import_utils.isValidElement)(children) ? cloneChildren : /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_icon.ChevronIcon, {}) });
-  }
-);
-var AutocompleteItemIcon = (0, import_core.forwardRef)(
-  ({ className, ...rest }, ref) => {
-    const { styles } = useAutocompleteContext();
-    const css = {
-      flexShrink: 0,
-      display: "inline-flex",
-      justifyContent: "center",
-      alignItems: "center",
-      fontSize: "0.85em",
-      ...styles.itemIcon
-    };
     return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
-      import_core.ui.span,
+      import_core.ui.div,
       {
         ref,
-        className: (0, import_utils.cx)("ui-autocomplete-item-icon", className),
+        className: (0, import_utils.cx)("ui-autocomplete-icon", className),
         __css: css,
-        ...rest
+        ...rest,
+        children: (0, import_utils.isValidElement)(children) ? cloneChildren : /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_icon.ChevronIcon, {})
       }
     );
   }
 );
+var AutocompleteItemIcon = (0, import_core.forwardRef)(({ className, ...rest }, ref) => {
+  const { styles } = useAutocompleteContext();
+  const css = {
+    flexShrink: 0,
+    display: "inline-flex",
+    justifyContent: "center",
+    alignItems: "center",
+    fontSize: "0.85em",
+    ...styles.itemIcon
+  };
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+    import_core.ui.span,
+    {
+      ref,
+      className: (0, import_utils.cx)("ui-autocomplete-item-icon", className),
+      __css: css,
+      ...rest
+    }
+  );
+});
 
 // src/autocomplete-option-group.tsx
 var import_core2 = require("@yamada-ui/core");
@@ -282,7 +289,10 @@ var kanaMap = {
   "\uFF65": "\u30FB"
 };
 var defaultFormat = (value) => {
-  value = value.replace(/[！-～]/g, (v) => String.fromCharCode(v.charCodeAt(0) - 65248));
+  value = value.replace(
+    /[！-～]/g,
+    (v) => String.fromCharCode(v.charCodeAt(0) - 65248)
+  );
   const reg = new RegExp("(" + Object.keys(kanaMap).join("|") + ")", "g");
   value = value.replace(reg, (v) => kanaMap[v]).replace(/ﾞ/g, "\u309B").replace(/ﾟ/g, "\u309C");
   value = value.toUpperCase();
@@ -339,7 +349,14 @@ var useAutocomplete = ({
   const { id } = rest;
   const formControlProps = (0, import_utils4.pickObject)(rest, import_form_control.formControlProperties);
   const [containerProps, inputProps] = (0, import_utils4.splitObject)(
-    (0, import_utils4.omitObject)(rest, ["id", "value", "defaultValue", "onChange", "month", "onChangeMonth"]),
+    (0, import_utils4.omitObject)(rest, [
+      "id",
+      "value",
+      "defaultValue",
+      "onChange",
+      "month",
+      "onChangeMonth"
+    ]),
     import_core4.layoutStylesProperties
   );
   const descendants = useAutocompleteDescendants();
@@ -391,9 +408,17 @@ var useAutocomplete = ({
     if (!(0, import_utils4.isArray)(value2)) {
       return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(AutocompleteOption, { value: value2, ...props, children: label }, i);
     } else {
-      return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(AutocompleteOptionGroup, { label, ...props, children: value2.map(
-        ({ label: label2, value: value3, ...props2 }, i2) => !(0, import_utils4.isArray)(value3) ? /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(AutocompleteOption, { value: value3, ...props2, children: label2 }, i2) : null
-      ) }, i);
+      return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
+        AutocompleteOptionGroup,
+        {
+          label,
+          ...props,
+          children: value2.map(
+            ({ label: label2, value: value3, ...props2 }, i2) => !(0, import_utils4.isArray)(value3) ? /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(AutocompleteOption, { value: value3, ...props2, children: label2 }, i2) : null
+          )
+        },
+        i
+      );
     }
   });
   const isEmpty = !validChildren.length && !(computedChildren == null ? void 0 : computedChildren.length);
@@ -417,7 +442,9 @@ var useAutocomplete = ({
     const id2 = setTimeout(() => {
       if (isEmpty || isAllSelected)
         return;
-      const first = descendants.enabledfirstValue(({ node }) => "target" in node.dataset);
+      const first = descendants.enabledfirstValue(
+        ({ node }) => "target" in node.dataset
+      );
       if (!first)
         return;
       if (!isMulti || !omitSelectedValues) {
@@ -445,7 +472,9 @@ var useAutocomplete = ({
     const id2 = setTimeout(() => {
       if (isEmpty || isAllSelected)
         return;
-      const last = descendants.enabledlastValue(({ node }) => "target" in node.dataset);
+      const last = descendants.enabledlastValue(
+        ({ node }) => "target" in node.dataset
+      );
       if (!last)
         return;
       if (!isMulti || !omitSelectedValues) {
@@ -487,7 +516,10 @@ var useAutocomplete = ({
     (index = focusedIndex) => {
       const id2 = setTimeout(() => {
         var _a;
-        const next = descendants.enabledNextValue(index, ({ node }) => "target" in node.dataset);
+        const next = descendants.enabledNextValue(
+          index,
+          ({ node }) => "target" in node.dataset
+        );
         if (!next)
           return;
         if (!isMulti || !omitSelectedValues) {
@@ -503,13 +535,23 @@ var useAutocomplete = ({
       });
       timeoutIds.current.add(id2);
     },
-    [descendants, enabledValues, focusedIndex, isMulti, omitSelectedValues, selectedIndexes]
+    [
+      descendants,
+      enabledValues,
+      focusedIndex,
+      isMulti,
+      omitSelectedValues,
+      selectedIndexes
+    ]
   );
   const onFocusPrev = (0, import_react2.useCallback)(
     (index = focusedIndex) => {
       const id2 = setTimeout(() => {
         var _a;
-        const prev = descendants.enabledPrevValue(index, ({ node }) => "target" in node.dataset);
+        const prev = descendants.enabledPrevValue(
+          index,
+          ({ node }) => "target" in node.dataset
+        );
         if (!prev)
           return;
         if (!isMulti || !omitSelectedValues) {
@@ -525,7 +567,14 @@ var useAutocomplete = ({
       });
       timeoutIds.current.add(id2);
     },
-    [descendants, enabledValues, focusedIndex, isMulti, omitSelectedValues, selectedIndexes]
+    [
+      descendants,
+      enabledValues,
+      focusedIndex,
+      isMulti,
+      omitSelectedValues,
+      selectedIndexes
+    ]
   );
   const onFocusFirstOrSelected = isEmptyValue || omitSelectedValues ? onFocusFirst : onFocusSelected;
   const onFocusLastOrSelected = isEmptyValue || omitSelectedValues ? onFocusLast : onFocusSelected;
@@ -622,7 +671,15 @@ var useAutocomplete = ({
       onClose();
     if (omitSelectedValues)
       onFocusNext();
-  }, [closeOnSelect, descendants, focusedIndex, omitSelectedValues, onChange, onClose, onFocusNext]);
+  }, [
+    closeOnSelect,
+    descendants,
+    focusedIndex,
+    omitSelectedValues,
+    onChange,
+    onClose,
+    onFocusNext
+  ]);
   const onSearch = (0, import_react2.useCallback)(
     (ev) => {
       var _a;
@@ -659,12 +716,20 @@ var useAutocomplete = ({
     } else if (firstInsertPositionOnCreate === "last") {
       newOptions = [...newOptions, newOption];
     } else {
-      const i = newOptions.findIndex(({ label }) => label === firstInsertPositionOnCreate);
+      const i = newOptions.findIndex(
+        ({ label }) => label === firstInsertPositionOnCreate
+      );
       if (i !== -1 && (0, import_utils4.isArray)(newOptions[i].value)) {
         if (secondInsertPositionOnCreate === "first") {
-          newOptions[i].value = [newOption, ...newOptions[i].value];
+          newOptions[i].value = [
+            newOption,
+            ...newOptions[i].value
+          ];
         } else {
-          newOptions[i].value = [...newOptions[i].value, newOption];
+          newOptions[i].value = [
+            ...newOptions[i].value,
+            newOption
+          ];
         }
       } else {
         console.warn(
@@ -675,7 +740,9 @@ var useAutocomplete = ({
     setOptions(newOptions);
     onChange(inputValue);
     rebirthOptions(false);
-    const index = flattenOptions(newOptions).findIndex(({ value: value2 }) => value2 === inputValue);
+    const index = flattenOptions(newOptions).findIndex(
+      ({ value: value2 }) => value2 === inputValue
+    );
     setFocusedIndex(index);
     (_a = rest.onCreate) == null ? void 0 : _a.call(rest, newOption, newOptions);
   }, [
@@ -794,7 +861,14 @@ var useAutocomplete = ({
     } else {
       setIsAllSelected(false);
     }
-  }, [omitSelectedValues, value, descendants, isMulti, onClose, maxSelectedValues]);
+  }, [
+    omitSelectedValues,
+    value,
+    descendants,
+    isMulti,
+    onClose,
+    maxSelectedValues
+  ]);
   (0, import_utils4.useUpdateEffect)(() => {
     if (isOpen)
       return;
@@ -996,7 +1070,10 @@ var useAutocompleteList = () => {
       role: "select",
       tabIndex: -1,
       ...props,
-      onAnimationComplete: (0, import_utils4.handlerAll)(props.onAnimationComplete, onAnimationComplete)
+      onAnimationComplete: (0, import_utils4.handlerAll)(
+        props.onAnimationComplete,
+        onAnimationComplete
+      )
     }),
     [listRef, onAnimationComplete]
   );
@@ -1004,15 +1081,20 @@ var useAutocompleteList = () => {
     getListProps
   };
 };
-var useAutocompleteOptionGroup = ({ label, ...rest }) => {
+var useAutocompleteOptionGroup = ({
+  label,
+  ...rest
+}) => {
   const { value, omitSelectedValues } = useAutocompleteContext();
   const isMulti = (0, import_utils4.isArray)(value);
   const descendants = useAutocompleteDescendantsContext();
   const values = descendants.values();
-  const selectedValues = isMulti && omitSelectedValues ? descendants.values(({ node }) => {
-    var _a;
-    return value.includes((_a = node.dataset.value) != null ? _a : "");
-  }) : [];
+  const selectedValues = isMulti && omitSelectedValues ? descendants.values(
+    ({ node }) => {
+      var _a;
+      return value.includes((_a = node.dataset.value) != null ? _a : "");
+    }
+  ) : [];
   const selectedIndexes = selectedValues.map(({ index }) => index);
   const childValues = values.filter(
     ({ node, index }) => {
@@ -1087,14 +1169,18 @@ var useAutocompleteOption = (props) => {
   } = { ...optionProps, ...props };
   const trulyDisabled = !!isDisabled && !isFocusable;
   const itemRef = (0, import_react2.useRef)(null);
-  const { index, register, descendants } = useAutocompleteDescendant({ disabled: trulyDisabled });
+  const { index, register, descendants } = useAutocompleteDescendant({
+    disabled: trulyDisabled
+  });
   const values = descendants.values();
   const frontValues = values.slice(0, index);
   const isMulti = (0, import_utils4.isArray)(value);
-  const isDuplicated = !isMulti ? frontValues.some(({ node }) => {
-    var _a2;
-    return node.dataset.value === ((_a2 = computedProps.value) != null ? _a2 : "");
-  }) : false;
+  const isDuplicated = !isMulti ? frontValues.some(
+    ({ node }) => {
+      var _a2;
+      return node.dataset.value === ((_a2 = computedProps.value) != null ? _a2 : "");
+    }
+  ) : false;
   const isSelected = !isDuplicated && (!isMulti ? ((_a = computedProps.value) != null ? _a : "") === value : value.includes((_b = computedProps.value) != null ? _b : ""));
   const isTarget = "target" in ((_d = (_c = itemRef.current) == null ? void 0 : _c.dataset) != null ? _d : {});
   const isFocused = index === focusedIndex;

package/dist/use-autocomplete.mjs

@@ -12,7 +12,7 @@ import {
   useAutocompleteList,
   useAutocompleteOption,
   useAutocompleteOptionGroup
-} from "./chunk-5O3XEEJE.mjs";
+} from "./chunk-ZVZP7IWT.mjs";
 export {
   AutocompleteDescendantsContextProvider,
   AutocompleteProvider,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@yamada-ui/autocomplete",
-  "version": "0.2.10",
+  "version": "0.2.12",
   "description": "Yamada UI autocomplete component",
   "keywords": [
     "yamada",
@@ -36,16 +36,16 @@
     "url": "https://github.com/hirotomoyamada/yamada-ui/issues"
   },
   "dependencies": {
-    "@yamada-ui/core": "0.5.1",
-    "@yamada-ui/utils": "0.1.3",
-    "@yamada-ui/icon": "0.2.6",
-    "@yamada-ui/select": "0.2.10",
-    "@yamada-ui/form-control": "0.2.6",
-    "@yamada-ui/popover": "0.2.9",
-    "@yamada-ui/use-descendant": "0.1.4",
-    "@yamada-ui/use-clickable": "0.2.2",
-    "@yamada-ui/use-outside-click": "0.1.3",
-    "@yamada-ui/use-controllable-state": "0.1.4"
+    "@yamada-ui/core": "0.5.3",
+    "@yamada-ui/utils": "0.1.4",
+    "@yamada-ui/icon": "0.2.8",
+    "@yamada-ui/select": "0.2.12",
+    "@yamada-ui/form-control": "0.2.8",
+    "@yamada-ui/popover": "0.2.11",
+    "@yamada-ui/use-descendant": "0.1.5",
+    "@yamada-ui/use-clickable": "0.2.3",
+    "@yamada-ui/use-outside-click": "0.1.4",
+    "@yamada-ui/use-controllable-state": "0.1.5"
   },
   "devDependencies": {
     "react": "^18.0.0",