@yamada-ui/autocomplete 1.5.3-dev-20240927164847 → 1.5.3-dev-20240927172557

package/dist/chunk-5LPWFWE6.mjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/use-autocomplete-option.ts"],"sourcesContent":["import type { HTMLUIProps, PropGetter } from \"@yamada-ui/core\"\nimport {\n  ariaAttr,\n  dataAttr,\n  handlerAll,\n  isArray,\n  isHTMLElement,\n  mergeRefs,\n  useUpdateEffect,\n} from \"@yamada-ui/utils\"\nimport type { CSSProperties, MouseEvent } from \"react\"\nimport { useCallback, useId, useRef } from \"react\"\nimport {\n  useAutocompleteContext,\n  useAutocompleteDescendant,\n} from \"./autocomplete-context\"\n\nconst isTargetOption = (target: EventTarget | null): boolean =>\n  isHTMLElement(target) && !!target?.getAttribute(\"role\")?.startsWith(\"option\")\n\nexport interface UseAutocompleteOptionProps\n  extends Omit<HTMLUIProps<\"li\">, \"value\" | \"children\"> {\n  /**\n   * The value of the autocomplete option.\n   */\n  value?: string\n  /**\n   * The label of the autocomplete option.\n   */\n  children?: string\n  /**\n   * If `true`, the autocomplete option will be disabled.\n   *\n   * @default false\n   */\n  isDisabled?: boolean\n  /**\n   * If `true`, the autocomplete option will be focusable.\n   *\n   * @default false\n   */\n  isFocusable?: boolean\n  /**\n   * If `true`, the list element will be closed when selected.\n   *\n   * @default false\n   */\n  closeOnSelect?: boolean\n}\n\nexport const useAutocompleteOption = (props: UseAutocompleteOptionProps) => {\n  const {\n    value,\n    omitSelectedValues,\n    onChange,\n    onChangeLabel,\n    focusedIndex,\n    setFocusedIndex,\n    onClose,\n    closeOnSelect: generalCloseOnSelect,\n    optionProps,\n    inputRef,\n    onFocusNext,\n  } = useAutocompleteContext()\n  const id = useId()\n\n  let {\n    icon: customIcon,\n    isDisabled,\n    isFocusable,\n    closeOnSelect: customCloseOnSelect,\n    children,\n    value: optionValue,\n    ...computedProps\n  } = { ...optionProps, ...props }\n\n  const trulyDisabled = !!isDisabled && !isFocusable\n\n  const itemRef = useRef<HTMLLIElement>(null)\n\n  const { index, register, descendants } = useAutocompleteDescendant({\n    disabled: trulyDisabled,\n  })\n\n  const values = descendants.values()\n  const frontValues = values.slice(0, index)\n\n  const isMulti = isArray(value)\n  const isDuplicated = !isMulti\n    ? frontValues.some(({ node }) => node.dataset.value === (optionValue ?? \"\"))\n    : false\n\n  const isSelected =\n    !isDuplicated &&\n    (!isMulti\n      ? (optionValue ?? \"\") === value\n      : value.includes(optionValue ?? \"\"))\n  const isTarget = \"target\" in (itemRef.current?.dataset ?? {})\n  const isFocused = index === focusedIndex\n\n  const onClick = useCallback(\n    (ev: MouseEvent<HTMLLIElement>) => {\n      ev.stopPropagation()\n\n      if (isDisabled) {\n        if (inputRef.current) inputRef.current.focus()\n\n        return\n      }\n\n      if (!isTargetOption(ev.currentTarget)) {\n        if (inputRef.current) inputRef.current.focus()\n\n        return\n      }\n\n      setFocusedIndex(index)\n\n      onChange(optionValue ?? \"\")\n\n      if (inputRef.current) inputRef.current.focus()\n\n      if (customCloseOnSelect ?? generalCloseOnSelect) onClose()\n\n      if (omitSelectedValues) onFocusNext(index)\n    },\n    [\n      onFocusNext,\n      omitSelectedValues,\n      isDisabled,\n      optionValue,\n      setFocusedIndex,\n      index,\n      onChange,\n      customCloseOnSelect,\n      generalCloseOnSelect,\n      onClose,\n      inputRef,\n    ],\n  )\n\n  useUpdateEffect(() => {\n    if (isSelected) onChangeLabel(optionValue ?? \"\", { runOmit: false })\n  }, [optionValue])\n\n  const getOptionProps: PropGetter<\"li\"> = useCallback(\n    (props = {}, ref = null) => {\n      const style: CSSProperties = {\n        border: \"0px\",\n        clip: \"rect(0px, 0px, 0px, 0px)\",\n        height: \"1px\",\n        width: \"1px\",\n        margin: \"-1px\",\n        padding: \"0px\",\n        overflow: \"hidden\",\n        whiteSpace: \"nowrap\",\n        position: \"absolute\",\n      }\n\n      return {\n        ref: mergeRefs(itemRef, ref, register),\n        id,\n        role: \"option\",\n        ...computedProps,\n        ...props,\n        tabIndex: -1,\n        style:\n          !isTarget || (omitSelectedValues && isSelected) ? style : undefined,\n        \"data-target\": dataAttr(true),\n        \"data-value\": optionValue ?? \"\",\n        \"data-focus\": dataAttr(isFocused),\n        \"data-disabled\": dataAttr(isDisabled),\n        \"aria-checked\": isSelected,\n        \"aria-disabled\": ariaAttr(isDisabled),\n        onClick: handlerAll(computedProps.onClick, props.onClick, onClick),\n      }\n    },\n    [\n      id,\n      optionValue,\n      computedProps,\n      isDisabled,\n      isFocused,\n      isSelected,\n      isTarget,\n      omitSelectedValues,\n      onClick,\n      register,\n    ],\n  )\n\n  return {\n    isSelected,\n    isFocused,\n    customIcon,\n    children,\n    getOptionProps,\n  }\n}\n\nexport type UseAutocompleteOptionReturn = ReturnType<\n  typeof useAutocompleteOption\n>\n\nexport const useAutocompleteCreate = () => {\n  const { isHit, onCreate } = useAutocompleteContext()\n\n  const getCreateProps: PropGetter<\"li\"> = useCallback(\n    (props = {}, ref = null) => {\n      const style: CSSProperties = {\n        border: \"0px\",\n        clip: \"rect(0px, 0px, 0px, 0px)\",\n        height: \"1px\",\n        width: \"1px\",\n        margin: \"-1px\",\n        padding: \"0px\",\n        overflow: \"hidden\",\n        whiteSpace: \"nowrap\",\n        position: \"absolute\",\n      }\n\n      return {\n        ref,\n        ...props,\n        tabIndex: -1,\n        style: isHit ? style : undefined,\n        \"data-focus\": dataAttr(!isHit),\n        onClick: handlerAll(props.onClick, onCreate),\n      }\n    },\n    [isHit, onCreate],\n  )\n\n  return { getCreateProps }\n}\n\nexport type UseAutocompleteCreateReturn = ReturnType<\n  typeof useAutocompleteCreate\n>\n\nexport const useAutocompleteEmpty = () => {\n  const { isHit, isEmpty } = useAutocompleteContext()\n\n  const getEmptyProps: PropGetter<\"li\"> = useCallback(\n    (props = {}, ref = null) => {\n      const style: CSSProperties = {\n        border: \"0px\",\n        clip: \"rect(0px, 0px, 0px, 0px)\",\n        height: \"1px\",\n        width: \"1px\",\n        margin: \"-1px\",\n        padding: \"0px\",\n        overflow: \"hidden\",\n        whiteSpace: \"nowrap\",\n        position: \"absolute\",\n      }\n\n      return {\n        ref,\n        ...props,\n        tabIndex: -1,\n        style: isHit && !isEmpty ? style : undefined,\n      }\n    },\n    [isHit, isEmpty],\n  )\n\n  return { getEmptyProps }\n}\n\nexport type UseAutocompleteEmptyReturn = ReturnType<typeof useAutocompleteEmpty>\n"],"mappings":"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","names":["props"]}

package/dist/{chunk-K42L5QVM.mjs → chunk-7OWUOQZD.mjs}

@@ -2,16 +2,16 @@
 import {
   useAutocomplete,
   useAutocompleteInput
-} from "./chunk-YEFQMSJM.mjs";
+} from "./chunk-PCQMCEHL.mjs";
 import {
   AutocompleteCreate
-} from "./chunk-2GOTGBRK.mjs";
+} from "./chunk-E3Y2E2TK.mjs";
 import {
   AutocompleteEmpty
-} from "./chunk-ZTDA3B2B.mjs";
+} from "./chunk-CCOWDDFS.mjs";
 import {
   AutocompleteList
-} from "./chunk-5MMUZ2XQ.mjs";
+} from "./chunk-S53LMDD7.mjs";
 import {
   AutocompleteClearIcon,
   AutocompleteIcon
@@ -268,4 +268,4 @@ MultiAutocompleteField.__ui__ = "MultiAutocompleteField";
 export {
   MultiAutocomplete
 };
-//# sourceMappingURL=chunk-K42L5QVM.mjs.map
+//# sourceMappingURL=chunk-7OWUOQZD.mjs.map

package/dist/{chunk-ZTDA3B2B.mjs → chunk-CCOWDDFS.mjs}

@@ -1,7 +1,7 @@
 "use client"
 import {
   useAutocompleteEmpty
-} from "./chunk-2JAGPELI.mjs";
+} from "./chunk-5LPWFWE6.mjs";
 import {
   AutocompleteItemIcon
 } from "./chunk-7SWSKLSA.mjs";
@@ -61,4 +61,4 @@ MinusIcon.__ui__ = "MinusIcon";
 export {
   AutocompleteEmpty
 };
-//# sourceMappingURL=chunk-ZTDA3B2B.mjs.map
+//# sourceMappingURL=chunk-CCOWDDFS.mjs.map

package/dist/{chunk-2GOTGBRK.mjs → chunk-E3Y2E2TK.mjs}

@@ -1,7 +1,7 @@
 "use client"
 import {
   useAutocompleteCreate
-} from "./chunk-2JAGPELI.mjs";
+} from "./chunk-5LPWFWE6.mjs";
 import {
   AutocompleteItemIcon
 } from "./chunk-7SWSKLSA.mjs";
@@ -60,4 +60,4 @@ PlusIcon.__ui__ = "PlusIcon";
 export {
   AutocompleteCreate
 };
-//# sourceMappingURL=chunk-2GOTGBRK.mjs.map
+//# sourceMappingURL=chunk-E3Y2E2TK.mjs.map

package/dist/{chunk-YEFQMSJM.mjs → chunk-PCQMCEHL.mjs}

@@ -4,7 +4,7 @@ import {
 } from "./chunk-6F3LT7J6.mjs";
 import {
   AutocompleteOption
-} from "./chunk-OTVG42AD.mjs";
+} from "./chunk-2WVIW6HR.mjs";
 import {
   useAutocompleteContext,
   useAutocompleteDescendants,
@@ -956,4 +956,4 @@ export {
   useAutocomplete,
   useAutocompleteInput
 };
-//# sourceMappingURL=chunk-YEFQMSJM.mjs.map
+//# sourceMappingURL=chunk-PCQMCEHL.mjs.map

package/dist/{chunk-QGOCVO2C.mjs → chunk-R76HPAN4.mjs}

@@ -8,6 +8,7 @@ import {
 import { mergeRefs, useUpdateEffect } from "@yamada-ui/utils";
 import { useCallback, useEffect, useId, useRef } from "react";
 var useAutocompleteList = () => {
+  const uuid = useId();
   const { focusedIndex, isOpen, listRef, rebirthOptions } = useAutocompleteContext();
   const descendants = useAutocompleteDescendantsContext();
   const beforeFocusedIndex = useRef(-1);
@@ -45,16 +46,19 @@ var useAutocompleteList = () => {
     if (!isOpen) beforeFocusedIndex.current = -1;
   }, [isOpen]);
   const getListProps = useCallback(
-    (props = {}, ref = null) => ({
-      as: "ul",
-      ref: mergeRefs(listRef, ref),
-      role: "listbox",
-      tabIndex: -1,
-      position: "relative",
-      id: props.id || useId(),
-      ...props
-    }),
-    [listRef]
+    (props = {}, ref = null) => {
+      var _a;
+      return {
+        as: "ul",
+        ref: mergeRefs(listRef, ref),
+        role: "listbox",
+        tabIndex: -1,
+        position: "relative",
+        id: (_a = props.id) != null ? _a : uuid,
+        ...props
+      };
+    },
+    [listRef, uuid]
   );
   return {
     onAnimationComplete,
@@ -65,4 +69,4 @@ var useAutocompleteList = () => {
 export {
   useAutocompleteList
 };
-//# sourceMappingURL=chunk-QGOCVO2C.mjs.map
+//# sourceMappingURL=chunk-R76HPAN4.mjs.map

package/dist/chunk-R76HPAN4.mjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/use-autocomplete-list.ts"],"sourcesContent":["import type { PropGetter } from \"@yamada-ui/core\"\nimport { mergeRefs, useUpdateEffect } from \"@yamada-ui/utils\"\nimport { useCallback, useEffect, useId, useRef } from \"react\"\nimport {\n  useAutocompleteContext,\n  useAutocompleteDescendantsContext,\n} from \"./autocomplete-context\"\n\nexport const useAutocompleteList = () => {\n  const uuid = useId()\n  const { focusedIndex, isOpen, listRef, rebirthOptions } =\n    useAutocompleteContext()\n\n  const descendants = useAutocompleteDescendantsContext()\n\n  const beforeFocusedIndex = useRef<number>(-1)\n  const selectedValue = descendants.value(focusedIndex)\n\n  const onAnimationComplete = useCallback(() => {\n    if (!isOpen) rebirthOptions(false)\n  }, [isOpen, rebirthOptions])\n\n  useEffect(() => {\n    if (!listRef.current || !selectedValue) return\n\n    if (beforeFocusedIndex.current === selectedValue.index) return\n\n    const parent = listRef.current\n    const child = selectedValue.node\n\n    const parentHeight = parent.clientHeight\n    const viewTop = parent.scrollTop\n    const viewBottom = viewTop + parentHeight\n\n    const childHeight = child.clientHeight\n    const childTop = child.offsetTop\n    const childBottom = childTop + childHeight\n\n    const isInView = viewTop <= childTop && childBottom <= viewBottom\n\n    const isScrollBottom = beforeFocusedIndex.current < selectedValue.index\n\n    if (!isInView) {\n      if (childBottom <= parentHeight) {\n        listRef.current.scrollTo({ top: 0 })\n      } else {\n        if (!isScrollBottom) {\n          listRef.current.scrollTo({ top: childTop + 1 })\n        } else {\n          listRef.current.scrollTo({ top: childBottom - parentHeight })\n        }\n      }\n    }\n\n    beforeFocusedIndex.current = selectedValue.index\n  }, [listRef, selectedValue])\n\n  useUpdateEffect(() => {\n    if (!isOpen) beforeFocusedIndex.current = -1\n  }, [isOpen])\n\n  const getListProps: PropGetter<\"ul\"> = useCallback(\n    (props = {}, ref = null) => ({\n      as: \"ul\",\n      ref: mergeRefs(listRef, ref),\n      role: \"listbox\",\n      tabIndex: -1,\n      position: \"relative\",\n      id: props.id ?? uuid,\n      ...props,\n    }),\n    [listRef, uuid],\n  )\n\n  return {\n    onAnimationComplete,\n    getListProps,\n  }\n}\n"],"mappings":";;;;;;;AACA,SAAS,WAAW,uBAAuB;AAC3C,SAAS,aAAa,WAAW,OAAO,cAAc;AAM/C,IAAM,sBAAsB,MAAM;AACvC,QAAM,OAAO,MAAM;AACnB,QAAM,EAAE,cAAc,QAAQ,SAAS,eAAe,IACpD,uBAAuB;AAEzB,QAAM,cAAc,kCAAkC;AAEtD,QAAM,qBAAqB,OAAe,EAAE;AAC5C,QAAM,gBAAgB,YAAY,MAAM,YAAY;AAEpD,QAAM,sBAAsB,YAAY,MAAM;AAC5C,QAAI,CAAC,OAAQ,gBAAe,KAAK;AAAA,EACnC,GAAG,CAAC,QAAQ,cAAc,CAAC;AAE3B,YAAU,MAAM;AACd,QAAI,CAAC,QAAQ,WAAW,CAAC,cAAe;AAExC,QAAI,mBAAmB,YAAY,cAAc,MAAO;AAExD,UAAM,SAAS,QAAQ;AACvB,UAAM,QAAQ,cAAc;AAE5B,UAAM,eAAe,OAAO;AAC5B,UAAM,UAAU,OAAO;AACvB,UAAM,aAAa,UAAU;AAE7B,UAAM,cAAc,MAAM;AAC1B,UAAM,WAAW,MAAM;AACvB,UAAM,cAAc,WAAW;AAE/B,UAAM,WAAW,WAAW,YAAY,eAAe;AAEvD,UAAM,iBAAiB,mBAAmB,UAAU,cAAc;AAElE,QAAI,CAAC,UAAU;AACb,UAAI,eAAe,cAAc;AAC/B,gBAAQ,QAAQ,SAAS,EAAE,KAAK,EAAE,CAAC;AAAA,MACrC,OAAO;AACL,YAAI,CAAC,gBAAgB;AACnB,kBAAQ,QAAQ,SAAS,EAAE,KAAK,WAAW,EAAE,CAAC;AAAA,QAChD,OAAO;AACL,kBAAQ,QAAQ,SAAS,EAAE,KAAK,cAAc,aAAa,CAAC;AAAA,QAC9D;AAAA,MACF;AAAA,IACF;AAEA,uBAAmB,UAAU,cAAc;AAAA,EAC7C,GAAG,CAAC,SAAS,aAAa,CAAC;AAE3B,kBAAgB,MAAM;AACpB,QAAI,CAAC,OAAQ,oBAAmB,UAAU;AAAA,EAC5C,GAAG,CAAC,MAAM,CAAC;AAEX,QAAM,eAAiC;AAAA,IACrC,CAAC,QAAQ,CAAC,GAAG,MAAM,SAAM;AA9D7B;AA8DiC;AAAA,QAC3B,IAAI;AAAA,QACJ,KAAK,UAAU,SAAS,GAAG;AAAA,QAC3B,MAAM;AAAA,QACN,UAAU;AAAA,QACV,UAAU;AAAA,QACV,KAAI,WAAM,OAAN,YAAY;AAAA,QAChB,GAAG;AAAA,MACL;AAAA;AAAA,IACA,CAAC,SAAS,IAAI;AAAA,EAChB;AAEA,SAAO;AAAA,IACL;AAAA,IACA;AAAA,EACF;AACF;","names":[]}

package/dist/{chunk-5MMUZ2XQ.mjs → chunk-S53LMDD7.mjs}

@@ -1,7 +1,7 @@
 "use client"
 import {
   useAutocompleteList
-} from "./chunk-QGOCVO2C.mjs";
+} from "./chunk-R76HPAN4.mjs";
 import {
   useAutocompleteContext
 } from "./chunk-JPUKYLBW.mjs";
@@ -86,4 +86,4 @@ AutocompleteList.__ui__ = "AutocompleteList";
 export {
   AutocompleteList
 };
-//# sourceMappingURL=chunk-5MMUZ2XQ.mjs.map
+//# sourceMappingURL=chunk-S53LMDD7.mjs.map

package/dist/{chunk-ZZSGPNV3.mjs → chunk-UNGOVJSY.mjs}

@@ -2,16 +2,16 @@
 import {
   useAutocomplete,
   useAutocompleteInput
-} from "./chunk-YEFQMSJM.mjs";
+} from "./chunk-PCQMCEHL.mjs";
 import {
   AutocompleteCreate
-} from "./chunk-2GOTGBRK.mjs";
+} from "./chunk-E3Y2E2TK.mjs";
 import {
   AutocompleteEmpty
-} from "./chunk-ZTDA3B2B.mjs";
+} from "./chunk-CCOWDDFS.mjs";
 import {
   AutocompleteList
-} from "./chunk-5MMUZ2XQ.mjs";
+} from "./chunk-S53LMDD7.mjs";
 import {
   AutocompleteIcon
 } from "./chunk-7SWSKLSA.mjs";
@@ -191,4 +191,4 @@ AutocompleteField.__ui__ = "AutocompleteField";
 export {
   Autocomplete
 };
-//# sourceMappingURL=chunk-ZZSGPNV3.mjs.map
+//# sourceMappingURL=chunk-UNGOVJSY.mjs.map

package/dist/index.js

@@ -173,6 +173,7 @@ var useAutocompleteOption = (props) => {
     inputRef,
     onFocusNext
   } = useAutocompleteContext();
+  const id = (0, import_react2.useId)();
   let {
     icon: customIcon,
     isDisabled,
@@ -243,7 +244,7 @@ var useAutocompleteOption = (props) => {
       };
       return {
         ref: (0, import_utils3.mergeRefs)(itemRef, ref, register),
-        id: (0, import_react2.useId)(),
+        id,
         role: "option",
         ...computedProps,
         ...props2,
@@ -259,6 +260,7 @@ var useAutocompleteOption = (props) => {
       };
     },
     [
+      id,
       optionValue,
       computedProps,
       isDisabled,
@@ -437,6 +439,7 @@ var import_utils7 = require("@yamada-ui/utils");
 var import_utils6 = require("@yamada-ui/utils");
 var import_react3 = require("react");
 var useAutocompleteList = () => {
+  const uuid = (0, import_react3.useId)();
   const { focusedIndex, isOpen, listRef, rebirthOptions } = useAutocompleteContext();
   const descendants = useAutocompleteDescendantsContext();
   const beforeFocusedIndex = (0, import_react3.useRef)(-1);
@@ -474,16 +477,19 @@ var useAutocompleteList = () => {
     if (!isOpen) beforeFocusedIndex.current = -1;
   }, [isOpen]);
   const getListProps = (0, import_react3.useCallback)(
-    (props = {}, ref = null) => ({
-      as: "ul",
-      ref: (0, import_utils6.mergeRefs)(listRef, ref),
-      role: "listbox",
-      tabIndex: -1,
-      position: "relative",
-      id: props.id || (0, import_react3.useId)(),
-      ...props
-    }),
-    [listRef]
+    (props = {}, ref = null) => {
+      var _a;
+      return {
+        as: "ul",
+        ref: (0, import_utils6.mergeRefs)(listRef, ref),
+        role: "listbox",
+        tabIndex: -1,
+        position: "relative",
+        id: (_a = props.id) != null ? _a : uuid,
+        ...props
+      };
+    },
+    [listRef, uuid]
   );
   return {
     onAnimationComplete,