@yamada-ui/autocomplete 1.6.5-dev-20241119122307 → 1.6.5-dev-20241119150031

package/dist/use-autocomplete-list.js

@@ -43,9 +43,9 @@ var [AutocompleteProvider, useAutocompleteContext] = (0, import_utils.createCont
 
 // src/use-autocomplete-list.ts
 var useAutocompleteList = () => {
-  const { focusedIndex, isOpen, listRef, rebirthOptions, value } = useAutocompleteContext();
+  const { focusedIndex, isOpen, rebirthOptions, value } = useAutocompleteContext();
   const descendants = useAutocompleteDescendantsContext();
-  const uuid = (0, import_react.useId)();
+  const listRef = (0, import_react.useRef)(null);
   const beforeFocusedIndex = (0, import_react.useRef)(-1);
   const selectedValue = descendants.value(focusedIndex);
   const isMulti = (0, import_utils2.isArray)(value);
@@ -81,21 +81,31 @@ var useAutocompleteList = () => {
   (0, import_utils2.useUpdateEffect)(() => {
     if (!isOpen) beforeFocusedIndex.current = -1;
   }, [isOpen]);
+  const getContainerProps = (0, import_react.useCallback)(
+    (props = {}, ref = null) => ({
+      ref,
+      "aria-multiselectable": (0, import_utils2.ariaAttr)(isMulti),
+      role: "listbox",
+      ...props,
+      onAnimationComplete: (0, import_utils2.handlerAll)(
+        props.onAnimationComplete,
+        onAnimationComplete
+      )
+    }),
+    [isMulti, onAnimationComplete]
+  );
   const getListProps = (0, import_react.useCallback)(
-    ({ id, ...props } = {}, ref = null) => ({
-      id: id != null ? id : uuid,
+    (props = {}, ref = null) => ({
       ref: (0, import_utils2.mergeRefs)(listRef, ref),
-      "aria-multiselectable": (0, import_utils2.ariaAttr)(isMulti),
       position: "relative",
-      role: "listbox",
       tabIndex: -1,
       ...props
     }),
-    [listRef, uuid, isMulti]
+    [listRef]
   );
   return {
-    getListProps,
-    onAnimationComplete
+    getContainerProps,
+    getListProps
   };
 };
 // Annotate the CommonJS export names for ESM import in node:

package/dist/use-autocomplete-list.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/use-autocomplete-list.ts","../src/autocomplete-context.ts"],"sourcesContent":["import type { PropGetter } from \"@yamada-ui/core\"\nimport { ariaAttr, isArray, 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 { focusedIndex, isOpen, listRef, rebirthOptions, value } =\n    useAutocompleteContext()\n  const descendants = useAutocompleteDescendantsContext()\n  const uuid = useId()\n  const beforeFocusedIndex = useRef<number>(-1)\n  const selectedValue = descendants.value(focusedIndex)\n  const isMulti = isArray(value)\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 = useCallback(\n    ({ id, ...props } = {}, ref = null) => ({\n      id: id ?? uuid,\n      ref: mergeRefs(listRef, ref),\n      \"aria-multiselectable\": ariaAttr(isMulti),\n      position: \"relative\",\n      role: \"listbox\",\n      tabIndex: -1,\n      ...props,\n    }),\n    [listRef, uuid, isMulti],\n  )\n\n  return {\n    getListProps,\n    onAnimationComplete,\n  }\n}\n","import type { CSSUIObject } from \"@yamada-ui/core\"\nimport type { Dispatch, DOMAttributes, RefObject, SetStateAction } from \"react\"\nimport type { UseAutocompleteProps } from \"./use-autocomplete\"\nimport { createDescendant } from \"@yamada-ui/use-descendant\"\nimport { createContext } from \"@yamada-ui/utils\"\n\nexport const {\n  DescendantsContextProvider: AutocompleteDescendantsContextProvider,\n  useDescendant: useAutocompleteDescendant,\n  useDescendants: useAutocompleteDescendants,\n  useDescendantsContext: useAutocompleteDescendantsContext,\n} = createDescendant()\n\ninterface AutocompleteContext\n  extends Omit<\n    UseAutocompleteProps,\n    \"defaultValue\" | \"onChange\" | \"onCreate\" | \"value\"\n  > {\n  focusedIndex: number\n  inputRef: RefObject<HTMLInputElement>\n  inputValue: string\n  isAllSelected: boolean\n  isEmpty: boolean\n  isHit: boolean\n  isOpen: boolean\n  label: string | string[] | undefined\n  listRef: RefObject<HTMLUListElement>\n  pickOptions: (value: string) => void\n  rebirthOptions: (runFocus?: boolean) => void\n  setFocusedIndex: Dispatch<SetStateAction<number>>\n  styles: { [key: string]: CSSUIObject | undefined }\n  value: string | string[]\n  formControlProps: { [key: string]: any }\n  inputProps: DOMAttributes<HTMLInputElement>\n  onChange: (newValue: string, runRebirth?: boolean) => void\n  onClose: () => void\n  onCreate: () => void\n  onFocusFirst: () => void\n  onFocusLast: () => void\n  onFocusNext: (index?: number) => void\n  onFocusPrev: (index?: number) => void\n  onOpen: () => void\n}\n\nexport const [AutocompleteProvider, useAutocompleteContext] =\n  createContext<AutocompleteContext>({\n    name: \"AutocompleteContext\",\n    errorMessage: `useAutocompleteContext returned is 'undefined'. Seems you forgot to wrap the components in \"<Autocomplete />\" or \"<MultiAutocomplete />\"`,\n  })\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AACA,IAAAA,gBAA8D;AAC9D,mBAAsD;;;ACCtD,4BAAiC;AACjC,mBAA8B;AAEvB,IAAM;AAAA,EACX,4BAA4B;AAAA,EAC5B,eAAe;AAAA,EACf,gBAAgB;AAAA,EAChB,uBAAuB;AACzB,QAAI,wCAAiB;AAiCd,IAAM,CAAC,sBAAsB,sBAAsB,QACxD,4BAAmC;AAAA,EACjC,MAAM;AAAA,EACN,cAAc;AAChB,CAAC;;;ADxCI,IAAM,sBAAsB,MAAM;AACvC,QAAM,EAAE,cAAc,QAAQ,SAAS,gBAAgB,MAAM,IAC3D,uBAAuB;AACzB,QAAM,cAAc,kCAAkC;AACtD,QAAM,WAAO,oBAAM;AACnB,QAAM,yBAAqB,qBAAe,EAAE;AAC5C,QAAM,gBAAgB,YAAY,MAAM,YAAY;AACpD,QAAM,cAAU,uBAAQ,KAAK;AAE7B,QAAM,0BAAsB,0BAAY,MAAM;AAC5C,QAAI,CAAC,OAAQ,gBAAe,KAAK;AAAA,EACnC,GAAG,CAAC,QAAQ,cAAc,CAAC;AAE3B,8BAAU,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,qCAAgB,MAAM;AACpB,QAAI,CAAC,OAAQ,oBAAmB,UAAU;AAAA,EAC5C,GAAG,CAAC,MAAM,CAAC;AAEX,QAAM,mBAA2B;AAAA,IAC/B,CAAC,EAAE,IAAI,GAAG,MAAM,IAAI,CAAC,GAAG,MAAM,UAAU;AAAA,MACtC,IAAI,kBAAM;AAAA,MACV,SAAK,yBAAU,SAAS,GAAG;AAAA,MAC3B,4BAAwB,wBAAS,OAAO;AAAA,MACxC,UAAU;AAAA,MACV,MAAM;AAAA,MACN,UAAU;AAAA,MACV,GAAG;AAAA,IACL;AAAA,IACA,CAAC,SAAS,MAAM,OAAO;AAAA,EACzB;AAEA,SAAO;AAAA,IACL;AAAA,IACA;AAAA,EACF;AACF;","names":["import_utils"]}
+{"version":3,"sources":["../src/use-autocomplete-list.ts","../src/autocomplete-context.ts"],"sourcesContent":["import type { PropGetter } from \"@yamada-ui/core\"\nimport type { MotionProps } from \"@yamada-ui/motion\"\nimport {\n  ariaAttr,\n  handlerAll,\n  isArray,\n  mergeRefs,\n  useUpdateEffect,\n} from \"@yamada-ui/utils\"\nimport { useCallback, useEffect, useRef } from \"react\"\nimport {\n  useAutocompleteContext,\n  useAutocompleteDescendantsContext,\n} from \"./autocomplete-context\"\n\nexport const useAutocompleteList = () => {\n  const { focusedIndex, isOpen, rebirthOptions, value } =\n    useAutocompleteContext()\n  const descendants = useAutocompleteDescendantsContext()\n  const listRef = useRef<HTMLDivElement>(null)\n  const beforeFocusedIndex = useRef<number>(-1)\n  const selectedValue = descendants.value(focusedIndex)\n  const isMulti = isArray(value)\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 getContainerProps: PropGetter<MotionProps, MotionProps> = useCallback(\n    (props = {}, ref = null) => ({\n      ref,\n      \"aria-multiselectable\": ariaAttr(isMulti),\n      role: \"listbox\",\n      ...props,\n      onAnimationComplete: handlerAll(\n        props.onAnimationComplete,\n        onAnimationComplete,\n      ),\n    }),\n    [isMulti, onAnimationComplete],\n  )\n\n  const getListProps: PropGetter = useCallback(\n    (props = {}, ref = null) => ({\n      ref: mergeRefs(listRef, ref),\n      position: \"relative\",\n      tabIndex: -1,\n      ...props,\n    }),\n    [listRef],\n  )\n\n  return {\n    getContainerProps,\n    getListProps,\n  }\n}\n","import type { CSSUIObject } from \"@yamada-ui/core\"\nimport type { Dispatch, DOMAttributes, RefObject, SetStateAction } from \"react\"\nimport type { UseAutocompleteProps } from \"./use-autocomplete\"\nimport { createDescendant } from \"@yamada-ui/use-descendant\"\nimport { createContext } from \"@yamada-ui/utils\"\n\nexport const {\n  DescendantsContextProvider: AutocompleteDescendantsContextProvider,\n  useDescendant: useAutocompleteDescendant,\n  useDescendants: useAutocompleteDescendants,\n  useDescendantsContext: useAutocompleteDescendantsContext,\n} = createDescendant()\n\ninterface AutocompleteContext\n  extends Omit<\n    UseAutocompleteProps,\n    \"defaultValue\" | \"onChange\" | \"onCreate\" | \"value\"\n  > {\n  focusedIndex: number\n  inputRef: RefObject<HTMLInputElement>\n  inputValue: string\n  isAllSelected: boolean\n  isEmpty: boolean\n  isHit: boolean\n  isOpen: boolean\n  label: string | string[] | undefined\n  pickOptions: (value: string) => void\n  rebirthOptions: (runFocus?: boolean) => void\n  setFocusedIndex: Dispatch<SetStateAction<number>>\n  styles: { [key: string]: CSSUIObject | undefined }\n  value: string | string[]\n  formControlProps: { [key: string]: any }\n  inputProps: DOMAttributes<HTMLInputElement>\n  onChange: (newValue: string, runRebirth?: boolean) => void\n  onClose: () => void\n  onCreate: () => void\n  onFocusFirst: () => void\n  onFocusLast: () => void\n  onFocusNext: (index?: number) => void\n  onFocusPrev: (index?: number) => void\n  onOpen: () => void\n}\n\nexport const [AutocompleteProvider, useAutocompleteContext] =\n  createContext<AutocompleteContext>({\n    name: \"AutocompleteContext\",\n    errorMessage: `useAutocompleteContext returned is 'undefined'. Seems you forgot to wrap the components in \"<Autocomplete />\" or \"<MultiAutocomplete />\"`,\n  })\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA,IAAAA,gBAMO;AACP,mBAA+C;;;ACN/C,4BAAiC;AACjC,mBAA8B;AAEvB,IAAM;AAAA,EACX,4BAA4B;AAAA,EAC5B,eAAe;AAAA,EACf,gBAAgB;AAAA,EAChB,uBAAuB;AACzB,QAAI,wCAAiB;AAgCd,IAAM,CAAC,sBAAsB,sBAAsB,QACxD,4BAAmC;AAAA,EACjC,MAAM;AAAA,EACN,cAAc;AAChB,CAAC;;;ADhCI,IAAM,sBAAsB,MAAM;AACvC,QAAM,EAAE,cAAc,QAAQ,gBAAgB,MAAM,IAClD,uBAAuB;AACzB,QAAM,cAAc,kCAAkC;AACtD,QAAM,cAAU,qBAAuB,IAAI;AAC3C,QAAM,yBAAqB,qBAAe,EAAE;AAC5C,QAAM,gBAAgB,YAAY,MAAM,YAAY;AACpD,QAAM,cAAU,uBAAQ,KAAK;AAE7B,QAAM,0BAAsB,0BAAY,MAAM;AAC5C,QAAI,CAAC,OAAQ,gBAAe,KAAK;AAAA,EACnC,GAAG,CAAC,QAAQ,cAAc,CAAC;AAE3B,8BAAU,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,qCAAgB,MAAM;AACpB,QAAI,CAAC,OAAQ,oBAAmB,UAAU;AAAA,EAC5C,GAAG,CAAC,MAAM,CAAC;AAEX,QAAM,wBAA0D;AAAA,IAC9D,CAAC,QAAQ,CAAC,GAAG,MAAM,UAAU;AAAA,MAC3B;AAAA,MACA,4BAAwB,wBAAS,OAAO;AAAA,MACxC,MAAM;AAAA,MACN,GAAG;AAAA,MACH,yBAAqB;AAAA,QACnB,MAAM;AAAA,QACN;AAAA,MACF;AAAA,IACF;AAAA,IACA,CAAC,SAAS,mBAAmB;AAAA,EAC/B;AAEA,QAAM,mBAA2B;AAAA,IAC/B,CAAC,QAAQ,CAAC,GAAG,MAAM,UAAU;AAAA,MAC3B,SAAK,yBAAU,SAAS,GAAG;AAAA,MAC3B,UAAU;AAAA,MACV,UAAU;AAAA,MACV,GAAG;AAAA,IACL;AAAA,IACA,CAAC,OAAO;AAAA,EACV;AAEA,SAAO;AAAA,IACL;AAAA,IACA;AAAA,EACF;AACF;","names":["import_utils"]}

package/dist/use-autocomplete-list.mjs

@@ -1,8 +1,8 @@
 "use client"
 import {
   useAutocompleteList
-} from "./chunk-PTPJFYGI.mjs";
-import "./chunk-ZNO5RUVT.mjs";
+} from "./chunk-4GVV3HBE.mjs";
+import "./chunk-TP5VZFO3.mjs";
 export {
   useAutocompleteList
 };

package/dist/use-autocomplete-option-group.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/use-autocomplete-option-group.ts","../src/autocomplete-context.ts"],"sourcesContent":["import type { HTMLUIProps, PropGetter } from \"@yamada-ui/core\"\nimport type { CSSProperties } from \"react\"\nimport { layoutStyleProperties } from \"@yamada-ui/core\"\nimport { isArray, mergeRefs, splitObject } from \"@yamada-ui/utils\"\nimport { useCallback, useId, useRef } from \"react\"\nimport {\n  useAutocompleteContext,\n  useAutocompleteDescendantsContext,\n} from \"./autocomplete-context\"\n\nexport interface UseAutocompleteOptionGroupProps extends HTMLUIProps {\n  /**\n   * The label of the autocomplete option group.\n   */\n  label: string\n}\n\nexport const useAutocompleteOptionGroup = ({\n  label,\n  ...rest\n}: UseAutocompleteOptionGroupProps) => {\n  const { omitSelectedValues, value } = useAutocompleteContext()\n  const descendants = useAutocompleteDescendantsContext()\n  const labelRef = useRef<HTMLDivElement>(null)\n  const labelId = useId()\n  const values = descendants.values()\n  const isMulti = isArray(value)\n  const selectedValues =\n    isMulti && omitSelectedValues\n      ? descendants.values(({ node }) =>\n          value.includes(node.dataset.value ?? \"\"),\n        )\n      : []\n  const selectedIndexes = selectedValues.map(({ index }) => index)\n  const childValues = values.filter(\n    ({ index, node }) =>\n      node.parentElement?.dataset.label === label &&\n      !selectedIndexes.includes(index) &&\n      \"target\" in node.dataset,\n  )\n  const isEmpty = !childValues.length\n\n  const [containerProps, groupProps] = splitObject(rest, layoutStyleProperties)\n\n  const getContainerProps: 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        margin: \"-1px\",\n        overflow: \"hidden\",\n        padding: \"0px\",\n        position: \"absolute\",\n        whiteSpace: \"nowrap\",\n        width: \"1px\",\n      }\n\n      return {\n        ref,\n        \"aria-labelledby\": labelRef.current?.id,\n        role: \"group\",\n        ...props,\n        ...containerProps,\n        style: isEmpty ? style : undefined,\n      }\n    },\n    [containerProps, isEmpty],\n  )\n\n  const getLabelProps: PropGetter = useCallback(\n    ({ id, ...props } = {}, ref = null) => {\n      return {\n        id: id ?? labelId,\n        ref: mergeRefs(ref, labelRef),\n        role: \"presentation\",\n        ...props,\n      }\n    },\n    [labelId],\n  )\n\n  const getGroupProps: PropGetter = useCallback(\n    (props = {}, ref = null) => ({\n      ref,\n      ...props,\n      ...groupProps,\n      \"data-label\": label,\n    }),\n    [groupProps, label],\n  )\n\n  return {\n    label,\n    getContainerProps,\n    getGroupProps,\n    getLabelProps,\n  }\n}\n\nexport type UseAutocompleteOptionGroupReturn = ReturnType<\n  typeof useAutocompleteOptionGroup\n>\n","import type { CSSUIObject } from \"@yamada-ui/core\"\nimport type { Dispatch, DOMAttributes, RefObject, SetStateAction } from \"react\"\nimport type { UseAutocompleteProps } from \"./use-autocomplete\"\nimport { createDescendant } from \"@yamada-ui/use-descendant\"\nimport { createContext } from \"@yamada-ui/utils\"\n\nexport const {\n  DescendantsContextProvider: AutocompleteDescendantsContextProvider,\n  useDescendant: useAutocompleteDescendant,\n  useDescendants: useAutocompleteDescendants,\n  useDescendantsContext: useAutocompleteDescendantsContext,\n} = createDescendant()\n\ninterface AutocompleteContext\n  extends Omit<\n    UseAutocompleteProps,\n    \"defaultValue\" | \"onChange\" | \"onCreate\" | \"value\"\n  > {\n  focusedIndex: number\n  inputRef: RefObject<HTMLInputElement>\n  inputValue: string\n  isAllSelected: boolean\n  isEmpty: boolean\n  isHit: boolean\n  isOpen: boolean\n  label: string | string[] | undefined\n  listRef: RefObject<HTMLUListElement>\n  pickOptions: (value: string) => void\n  rebirthOptions: (runFocus?: boolean) => void\n  setFocusedIndex: Dispatch<SetStateAction<number>>\n  styles: { [key: string]: CSSUIObject | undefined }\n  value: string | string[]\n  formControlProps: { [key: string]: any }\n  inputProps: DOMAttributes<HTMLInputElement>\n  onChange: (newValue: string, runRebirth?: boolean) => void\n  onClose: () => void\n  onCreate: () => void\n  onFocusFirst: () => void\n  onFocusLast: () => void\n  onFocusNext: (index?: number) => void\n  onFocusPrev: (index?: number) => void\n  onOpen: () => void\n}\n\nexport const [AutocompleteProvider, useAutocompleteContext] =\n  createContext<AutocompleteContext>({\n    name: \"AutocompleteContext\",\n    errorMessage: `useAutocompleteContext returned is 'undefined'. Seems you forgot to wrap the components in \"<Autocomplete />\" or \"<MultiAutocomplete />\"`,\n  })\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA,kBAAsC;AACtC,IAAAA,gBAAgD;AAChD,mBAA2C;;;ACD3C,4BAAiC;AACjC,mBAA8B;AAEvB,IAAM;AAAA,EACX,4BAA4B;AAAA,EAC5B,eAAe;AAAA,EACf,gBAAgB;AAAA,EAChB,uBAAuB;AACzB,QAAI,wCAAiB;AAiCd,IAAM,CAAC,sBAAsB,sBAAsB,QACxD,4BAAmC;AAAA,EACjC,MAAM;AAAA,EACN,cAAc;AAChB,CAAC;;;AD/BI,IAAM,6BAA6B,CAAC;AAAA,EACzC;AAAA,EACA,GAAG;AACL,MAAuC;AACrC,QAAM,EAAE,oBAAoB,MAAM,IAAI,uBAAuB;AAC7D,QAAM,cAAc,kCAAkC;AACtD,QAAM,eAAW,qBAAuB,IAAI;AAC5C,QAAM,cAAU,oBAAM;AACtB,QAAM,SAAS,YAAY,OAAO;AAClC,QAAM,cAAU,uBAAQ,KAAK;AAC7B,QAAM,iBACJ,WAAW,qBACP,YAAY;AAAA,IAAO,CAAC,EAAE,KAAK,MAAG;AA7BtC;AA8BU,mBAAM,UAAS,UAAK,QAAQ,UAAb,YAAsB,EAAE;AAAA;AAAA,EACzC,IACA,CAAC;AACP,QAAM,kBAAkB,eAAe,IAAI,CAAC,EAAE,MAAM,MAAM,KAAK;AAC/D,QAAM,cAAc,OAAO;AAAA,IACzB,CAAC,EAAE,OAAO,KAAK,MAAG;AAnCtB;AAoCM,yBAAK,kBAAL,mBAAoB,QAAQ,WAAU,SACtC,CAAC,gBAAgB,SAAS,KAAK,KAC/B,YAAY,KAAK;AAAA;AAAA,EACrB;AACA,QAAM,UAAU,CAAC,YAAY;AAE7B,QAAM,CAAC,gBAAgB,UAAU,QAAI,2BAAY,MAAM,iCAAqB;AAE5E,QAAM,wBAAsC;AAAA,IAC1C,CAAC,QAAQ,CAAC,GAAG,MAAM,SAAS;AA7ChC;AA8CM,YAAM,QAAuB;AAAA,QAC3B,QAAQ;AAAA,QACR,MAAM;AAAA,QACN,QAAQ;AAAA,QACR,QAAQ;AAAA,QACR,UAAU;AAAA,QACV,SAAS;AAAA,QACT,UAAU;AAAA,QACV,YAAY;AAAA,QACZ,OAAO;AAAA,MACT;AAEA,aAAO;AAAA,QACL;AAAA,QACA,oBAAmB,cAAS,YAAT,mBAAkB;AAAA,QACrC,MAAM;AAAA,QACN,GAAG;AAAA,QACH,GAAG;AAAA,QACH,OAAO,UAAU,QAAQ;AAAA,MAC3B;AAAA,IACF;AAAA,IACA,CAAC,gBAAgB,OAAO;AAAA,EAC1B;AAEA,QAAM,oBAA4B;AAAA,IAChC,CAAC,EAAE,IAAI,GAAG,MAAM,IAAI,CAAC,GAAG,MAAM,SAAS;AACrC,aAAO;AAAA,QACL,IAAI,kBAAM;AAAA,QACV,SAAK,yBAAU,KAAK,QAAQ;AAAA,QAC5B,MAAM;AAAA,QACN,GAAG;AAAA,MACL;AAAA,IACF;AAAA,IACA,CAAC,OAAO;AAAA,EACV;AAEA,QAAM,oBAA4B;AAAA,IAChC,CAAC,QAAQ,CAAC,GAAG,MAAM,UAAU;AAAA,MAC3B;AAAA,MACA,GAAG;AAAA,MACH,GAAG;AAAA,MACH,cAAc;AAAA,IAChB;AAAA,IACA,CAAC,YAAY,KAAK;AAAA,EACpB;AAEA,SAAO;AAAA,IACL;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF;AACF;","names":["import_utils"]}
+{"version":3,"sources":["../src/use-autocomplete-option-group.ts","../src/autocomplete-context.ts"],"sourcesContent":["import type { HTMLUIProps, PropGetter } from \"@yamada-ui/core\"\nimport type { CSSProperties } from \"react\"\nimport { layoutStyleProperties } from \"@yamada-ui/core\"\nimport { isArray, mergeRefs, splitObject } from \"@yamada-ui/utils\"\nimport { useCallback, useId, useRef } from \"react\"\nimport {\n  useAutocompleteContext,\n  useAutocompleteDescendantsContext,\n} from \"./autocomplete-context\"\n\nexport interface UseAutocompleteOptionGroupProps extends HTMLUIProps {\n  /**\n   * The label of the autocomplete option group.\n   */\n  label: string\n}\n\nexport const useAutocompleteOptionGroup = ({\n  label,\n  ...rest\n}: UseAutocompleteOptionGroupProps) => {\n  const { omitSelectedValues, value } = useAutocompleteContext()\n  const descendants = useAutocompleteDescendantsContext()\n  const labelRef = useRef<HTMLDivElement>(null)\n  const labelId = useId()\n  const values = descendants.values()\n  const isMulti = isArray(value)\n  const selectedValues =\n    isMulti && omitSelectedValues\n      ? descendants.values(({ node }) =>\n          value.includes(node.dataset.value ?? \"\"),\n        )\n      : []\n  const selectedIndexes = selectedValues.map(({ index }) => index)\n  const childValues = values.filter(\n    ({ index, node }) =>\n      node.parentElement?.dataset.label === label &&\n      !selectedIndexes.includes(index) &&\n      \"target\" in node.dataset,\n  )\n  const isEmpty = !childValues.length\n\n  const [containerProps, groupProps] = splitObject(rest, layoutStyleProperties)\n\n  const getContainerProps: 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        margin: \"-1px\",\n        overflow: \"hidden\",\n        padding: \"0px\",\n        position: \"absolute\",\n        whiteSpace: \"nowrap\",\n        width: \"1px\",\n      }\n\n      return {\n        ref,\n        \"aria-labelledby\": labelRef.current?.id,\n        role: \"group\",\n        ...props,\n        ...containerProps,\n        style: isEmpty ? style : undefined,\n      }\n    },\n    [containerProps, isEmpty],\n  )\n\n  const getLabelProps: PropGetter = useCallback(\n    ({ id, ...props } = {}, ref = null) => {\n      return {\n        id: id ?? labelId,\n        ref: mergeRefs(ref, labelRef),\n        role: \"presentation\",\n        ...props,\n      }\n    },\n    [labelId],\n  )\n\n  const getGroupProps: PropGetter = useCallback(\n    (props = {}, ref = null) => ({\n      ref,\n      ...props,\n      ...groupProps,\n      \"data-label\": label,\n    }),\n    [groupProps, label],\n  )\n\n  return {\n    label,\n    getContainerProps,\n    getGroupProps,\n    getLabelProps,\n  }\n}\n\nexport type UseAutocompleteOptionGroupReturn = ReturnType<\n  typeof useAutocompleteOptionGroup\n>\n","import type { CSSUIObject } from \"@yamada-ui/core\"\nimport type { Dispatch, DOMAttributes, RefObject, SetStateAction } from \"react\"\nimport type { UseAutocompleteProps } from \"./use-autocomplete\"\nimport { createDescendant } from \"@yamada-ui/use-descendant\"\nimport { createContext } from \"@yamada-ui/utils\"\n\nexport const {\n  DescendantsContextProvider: AutocompleteDescendantsContextProvider,\n  useDescendant: useAutocompleteDescendant,\n  useDescendants: useAutocompleteDescendants,\n  useDescendantsContext: useAutocompleteDescendantsContext,\n} = createDescendant()\n\ninterface AutocompleteContext\n  extends Omit<\n    UseAutocompleteProps,\n    \"defaultValue\" | \"onChange\" | \"onCreate\" | \"value\"\n  > {\n  focusedIndex: number\n  inputRef: RefObject<HTMLInputElement>\n  inputValue: string\n  isAllSelected: boolean\n  isEmpty: boolean\n  isHit: boolean\n  isOpen: boolean\n  label: string | string[] | undefined\n  pickOptions: (value: string) => void\n  rebirthOptions: (runFocus?: boolean) => void\n  setFocusedIndex: Dispatch<SetStateAction<number>>\n  styles: { [key: string]: CSSUIObject | undefined }\n  value: string | string[]\n  formControlProps: { [key: string]: any }\n  inputProps: DOMAttributes<HTMLInputElement>\n  onChange: (newValue: string, runRebirth?: boolean) => void\n  onClose: () => void\n  onCreate: () => void\n  onFocusFirst: () => void\n  onFocusLast: () => void\n  onFocusNext: (index?: number) => void\n  onFocusPrev: (index?: number) => void\n  onOpen: () => void\n}\n\nexport const [AutocompleteProvider, useAutocompleteContext] =\n  createContext<AutocompleteContext>({\n    name: \"AutocompleteContext\",\n    errorMessage: `useAutocompleteContext returned is 'undefined'. Seems you forgot to wrap the components in \"<Autocomplete />\" or \"<MultiAutocomplete />\"`,\n  })\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA,kBAAsC;AACtC,IAAAA,gBAAgD;AAChD,mBAA2C;;;ACD3C,4BAAiC;AACjC,mBAA8B;AAEvB,IAAM;AAAA,EACX,4BAA4B;AAAA,EAC5B,eAAe;AAAA,EACf,gBAAgB;AAAA,EAChB,uBAAuB;AACzB,QAAI,wCAAiB;AAgCd,IAAM,CAAC,sBAAsB,sBAAsB,QACxD,4BAAmC;AAAA,EACjC,MAAM;AAAA,EACN,cAAc;AAChB,CAAC;;;AD9BI,IAAM,6BAA6B,CAAC;AAAA,EACzC;AAAA,EACA,GAAG;AACL,MAAuC;AACrC,QAAM,EAAE,oBAAoB,MAAM,IAAI,uBAAuB;AAC7D,QAAM,cAAc,kCAAkC;AACtD,QAAM,eAAW,qBAAuB,IAAI;AAC5C,QAAM,cAAU,oBAAM;AACtB,QAAM,SAAS,YAAY,OAAO;AAClC,QAAM,cAAU,uBAAQ,KAAK;AAC7B,QAAM,iBACJ,WAAW,qBACP,YAAY;AAAA,IAAO,CAAC,EAAE,KAAK,MAAG;AA7BtC;AA8BU,mBAAM,UAAS,UAAK,QAAQ,UAAb,YAAsB,EAAE;AAAA;AAAA,EACzC,IACA,CAAC;AACP,QAAM,kBAAkB,eAAe,IAAI,CAAC,EAAE,MAAM,MAAM,KAAK;AAC/D,QAAM,cAAc,OAAO;AAAA,IACzB,CAAC,EAAE,OAAO,KAAK,MAAG;AAnCtB;AAoCM,yBAAK,kBAAL,mBAAoB,QAAQ,WAAU,SACtC,CAAC,gBAAgB,SAAS,KAAK,KAC/B,YAAY,KAAK;AAAA;AAAA,EACrB;AACA,QAAM,UAAU,CAAC,YAAY;AAE7B,QAAM,CAAC,gBAAgB,UAAU,QAAI,2BAAY,MAAM,iCAAqB;AAE5E,QAAM,wBAAsC;AAAA,IAC1C,CAAC,QAAQ,CAAC,GAAG,MAAM,SAAS;AA7ChC;AA8CM,YAAM,QAAuB;AAAA,QAC3B,QAAQ;AAAA,QACR,MAAM;AAAA,QACN,QAAQ;AAAA,QACR,QAAQ;AAAA,QACR,UAAU;AAAA,QACV,SAAS;AAAA,QACT,UAAU;AAAA,QACV,YAAY;AAAA,QACZ,OAAO;AAAA,MACT;AAEA,aAAO;AAAA,QACL;AAAA,QACA,oBAAmB,cAAS,YAAT,mBAAkB;AAAA,QACrC,MAAM;AAAA,QACN,GAAG;AAAA,QACH,GAAG;AAAA,QACH,OAAO,UAAU,QAAQ;AAAA,MAC3B;AAAA,IACF;AAAA,IACA,CAAC,gBAAgB,OAAO;AAAA,EAC1B;AAEA,QAAM,oBAA4B;AAAA,IAChC,CAAC,EAAE,IAAI,GAAG,MAAM,IAAI,CAAC,GAAG,MAAM,SAAS;AACrC,aAAO;AAAA,QACL,IAAI,kBAAM;AAAA,QACV,SAAK,yBAAU,KAAK,QAAQ;AAAA,QAC5B,MAAM;AAAA,QACN,GAAG;AAAA,MACL;AAAA,IACF;AAAA,IACA,CAAC,OAAO;AAAA,EACV;AAEA,QAAM,oBAA4B;AAAA,IAChC,CAAC,QAAQ,CAAC,GAAG,MAAM,UAAU;AAAA,MAC3B;AAAA,MACA,GAAG;AAAA,MACH,GAAG;AAAA,MACH,cAAc;AAAA,IAChB;AAAA,IACA,CAAC,YAAY,KAAK;AAAA,EACpB;AAEA,SAAO;AAAA,IACL;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF;AACF;","names":["import_utils"]}

package/dist/use-autocomplete-option-group.mjs

@@ -1,8 +1,8 @@
 "use client"
 import {
   useAutocompleteOptionGroup
-} from "./chunk-CMFJUJJW.mjs";
-import "./chunk-ZNO5RUVT.mjs";
+} from "./chunk-UX5QECNB.mjs";
+import "./chunk-TP5VZFO3.mjs";
 export {
   useAutocompleteOptionGroup
 };

package/dist/use-autocomplete-option.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/use-autocomplete-option.ts","../src/autocomplete-context.ts"],"sourcesContent":["import type { HTMLUIProps, PropGetter } from \"@yamada-ui/core\"\nimport type { CSSProperties, MouseEvent } from \"react\"\nimport {\n  ariaAttr,\n  dataAttr,\n  handlerAll,\n  isArray,\n  isHTMLElement,\n  isNumber,\n  isString,\n  isUndefined,\n  mergeRefs,\n} from \"@yamada-ui/utils\"\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, \"children\" | \"value\"> {\n  /**\n   * The label of the autocomplete option.\n   */\n  children?: string\n  /**\n   * If `true`, the list element will be closed when selected.\n   *\n   * @default false\n   */\n  closeOnSelect?: boolean\n  /**\n   * If `true`, the autocomplete option will be disabled.\n   *\n   * @default false\n   */\n  disabled?: boolean\n  /**\n   * If `true`, the autocomplete option will be focusable.\n   *\n   * @default false\n   */\n  focusable?: boolean\n  /**\n   * If `true`, the autocomplete option will be disabled.\n   *\n   * @default false\n   *\n   * @deprecated Use `disabled` instead.\n   */\n  isDisabled?: boolean\n  /**\n   * If `true`, the autocomplete option will be focusable.\n   *\n   * @default false\n   *\n   * @deprecated Use `focusable` instead.\n   */\n  isFocusable?: boolean\n  /**\n   * The value of the autocomplete option.\n   */\n  value?: string\n}\n\nexport const useAutocompleteOption = (props: UseAutocompleteOptionProps) => {\n  const {\n    closeOnSelect,\n    focusedIndex,\n    inputRef,\n    omitSelectedValues,\n    setFocusedIndex,\n    value,\n    optionProps,\n    onChange,\n    onClose,\n    onFocusNext,\n  } = useAutocompleteContext()\n  const uuid = useId()\n  const itemRef = useRef<HTMLLIElement>(null)\n  let {\n    id,\n    children,\n    closeOnSelect: customCloseOnSelect,\n    disabled,\n    focusable,\n    icon: customIcon,\n    isDisabled,\n    isFocusable,\n    value: optionValue,\n    ...computedProps\n  } = { ...optionProps, ...props }\n  disabled ??= isDisabled\n  focusable ??= isFocusable\n  const trulyDisabled = !!disabled && !focusable\n  const { descendants, index, register } = useAutocompleteDescendant({\n    disabled: trulyDisabled,\n  })\n  const values = descendants.values()\n  const frontValues = values.slice(0, index)\n  const isMulti = isArray(value)\n  const isDuplicated = frontValues.some(\n    ({ node }) => node.dataset.value === (optionValue ?? \"\"),\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  id ??= uuid\n\n  if (isUndefined(optionValue)) {\n    if (isString(children) || isNumber(children)) {\n      optionValue = children.toString()\n    } else {\n      console.warn(\n        `${\n          !isMulti ? \"Autocomplete\" : \"MultiAutocomplete\"\n        }: Cannot infer the option value of complex children. Pass a \\`value\\` prop or use a plain string as children to <Option>.`,\n      )\n    }\n  }\n\n  const onClick = useCallback(\n    (ev: MouseEvent<HTMLDivElement>) => {\n      ev.stopPropagation()\n\n      if (disabled || !isTargetOption(ev.currentTarget)) {\n        if (inputRef.current) inputRef.current.focus()\n\n        return\n      }\n\n      if (!isDuplicated) setFocusedIndex(index)\n\n      onChange(optionValue ?? \"\")\n\n      if (inputRef.current) inputRef.current.focus()\n\n      if (customCloseOnSelect ?? closeOnSelect) onClose()\n\n      if (omitSelectedValues) onFocusNext(index)\n    },\n    [\n      isDuplicated,\n      onFocusNext,\n      omitSelectedValues,\n      disabled,\n      optionValue,\n      setFocusedIndex,\n      index,\n      onChange,\n      customCloseOnSelect,\n      closeOnSelect,\n      onClose,\n      inputRef,\n    ],\n  )\n\n  const getOptionProps: PropGetter = useCallback(\n    (props = {}, ref = null) => {\n      const isHidden = !isTarget || (omitSelectedValues && isSelected)\n\n      const style: CSSProperties = {\n        border: \"0px\",\n        clip: \"rect(0px, 0px, 0px, 0px)\",\n        height: \"1px\",\n        margin: \"-1px\",\n        overflow: \"hidden\",\n        padding: \"0px\",\n        position: \"absolute\",\n        whiteSpace: \"nowrap\",\n        width: \"1px\",\n      }\n\n      return {\n        ref: mergeRefs(itemRef, ref, register),\n        role: \"option\",\n        ...computedProps,\n        ...props,\n        id,\n        style: isHidden ? style : undefined,\n        \"aria-disabled\": ariaAttr(disabled),\n        \"aria-hidden\": ariaAttr(isHidden),\n        \"aria-selected\": isSelected,\n        \"data-disabled\": dataAttr(disabled),\n        \"data-duplicated\": dataAttr(isDuplicated),\n        \"data-focus\": dataAttr(isFocused),\n        \"data-target\": dataAttr(true),\n        \"data-value\": optionValue ?? \"\",\n        tabIndex: -1,\n        onClick: handlerAll(computedProps.onClick, props.onClick, onClick),\n      }\n    },\n    [\n      id,\n      isDuplicated,\n      optionValue,\n      computedProps,\n      disabled,\n      isFocused,\n      isSelected,\n      isTarget,\n      omitSelectedValues,\n      onClick,\n      register,\n    ],\n  )\n\n  return {\n    children,\n    customIcon,\n    isFocused,\n    isSelected,\n    isTarget,\n    omitSelectedValues,\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 = useCallback(\n    (props = {}, ref = null) => {\n      const style: CSSProperties = {\n        border: \"0px\",\n        clip: \"rect(0px, 0px, 0px, 0px)\",\n        height: \"1px\",\n        margin: \"-1px\",\n        overflow: \"hidden\",\n        padding: \"0px\",\n        position: \"absolute\",\n        whiteSpace: \"nowrap\",\n        width: \"1px\",\n      }\n\n      return {\n        ref,\n        role: \"option\",\n        ...props,\n        style: isHit ? style : undefined,\n        \"aria-hidden\": ariaAttr(isHit),\n        \"data-focus\": dataAttr(!isHit),\n        tabIndex: -1,\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 { isEmpty, isHit } = useAutocompleteContext()\n\n  const getEmptyProps: PropGetter = useCallback(\n    (props = {}, ref = null) => {\n      const isHidden = isHit && !isEmpty\n\n      const style: CSSProperties = {\n        border: \"0px\",\n        clip: \"rect(0px, 0px, 0px, 0px)\",\n        height: \"1px\",\n        margin: \"-1px\",\n        overflow: \"hidden\",\n        padding: \"0px\",\n        position: \"absolute\",\n        whiteSpace: \"nowrap\",\n        width: \"1px\",\n      }\n\n      return {\n        ref,\n        role: \"presentation\",\n        ...props,\n        style: isHidden ? style : undefined,\n        \"aria-hidden\": ariaAttr(isHidden),\n        tabIndex: -1,\n      }\n    },\n    [isHit, isEmpty],\n  )\n\n  return { getEmptyProps }\n}\n\nexport type UseAutocompleteEmptyReturn = ReturnType<typeof useAutocompleteEmpty>\n","import type { CSSUIObject } from \"@yamada-ui/core\"\nimport type { Dispatch, DOMAttributes, RefObject, SetStateAction } from \"react\"\nimport type { UseAutocompleteProps } from \"./use-autocomplete\"\nimport { createDescendant } from \"@yamada-ui/use-descendant\"\nimport { createContext } from \"@yamada-ui/utils\"\n\nexport const {\n  DescendantsContextProvider: AutocompleteDescendantsContextProvider,\n  useDescendant: useAutocompleteDescendant,\n  useDescendants: useAutocompleteDescendants,\n  useDescendantsContext: useAutocompleteDescendantsContext,\n} = createDescendant()\n\ninterface AutocompleteContext\n  extends Omit<\n    UseAutocompleteProps,\n    \"defaultValue\" | \"onChange\" | \"onCreate\" | \"value\"\n  > {\n  focusedIndex: number\n  inputRef: RefObject<HTMLInputElement>\n  inputValue: string\n  isAllSelected: boolean\n  isEmpty: boolean\n  isHit: boolean\n  isOpen: boolean\n  label: string | string[] | undefined\n  listRef: RefObject<HTMLUListElement>\n  pickOptions: (value: string) => void\n  rebirthOptions: (runFocus?: boolean) => void\n  setFocusedIndex: Dispatch<SetStateAction<number>>\n  styles: { [key: string]: CSSUIObject | undefined }\n  value: string | string[]\n  formControlProps: { [key: string]: any }\n  inputProps: DOMAttributes<HTMLInputElement>\n  onChange: (newValue: string, runRebirth?: boolean) => void\n  onClose: () => void\n  onCreate: () => void\n  onFocusFirst: () => void\n  onFocusLast: () => void\n  onFocusNext: (index?: number) => void\n  onFocusPrev: (index?: number) => void\n  onOpen: () => void\n}\n\nexport const [AutocompleteProvider, useAutocompleteContext] =\n  createContext<AutocompleteContext>({\n    name: \"AutocompleteContext\",\n    errorMessage: `useAutocompleteContext returned is 'undefined'. Seems you forgot to wrap the components in \"<Autocomplete />\" or \"<MultiAutocomplete />\"`,\n  })\n"],"mappings":"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","names":["import_utils","props"]}
+{"version":3,"sources":["../src/use-autocomplete-option.ts","../src/autocomplete-context.ts"],"sourcesContent":["import type { HTMLUIProps, PropGetter } from \"@yamada-ui/core\"\nimport type { CSSProperties, MouseEvent } from \"react\"\nimport {\n  ariaAttr,\n  dataAttr,\n  handlerAll,\n  isArray,\n  isHTMLElement,\n  isNumber,\n  isString,\n  isUndefined,\n  mergeRefs,\n} from \"@yamada-ui/utils\"\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, \"children\" | \"value\"> {\n  /**\n   * The label of the autocomplete option.\n   */\n  children?: string\n  /**\n   * If `true`, the list element will be closed when selected.\n   *\n   * @default false\n   */\n  closeOnSelect?: boolean\n  /**\n   * If `true`, the autocomplete option will be disabled.\n   *\n   * @default false\n   */\n  disabled?: boolean\n  /**\n   * If `true`, the autocomplete option will be focusable.\n   *\n   * @default false\n   */\n  focusable?: boolean\n  /**\n   * If `true`, the autocomplete option will be disabled.\n   *\n   * @default false\n   *\n   * @deprecated Use `disabled` instead.\n   */\n  isDisabled?: boolean\n  /**\n   * If `true`, the autocomplete option will be focusable.\n   *\n   * @default false\n   *\n   * @deprecated Use `focusable` instead.\n   */\n  isFocusable?: boolean\n  /**\n   * The value of the autocomplete option.\n   */\n  value?: string\n}\n\nexport const useAutocompleteOption = (props: UseAutocompleteOptionProps) => {\n  const {\n    closeOnSelect,\n    focusedIndex,\n    inputRef,\n    omitSelectedValues,\n    setFocusedIndex,\n    value,\n    optionProps,\n    onChange,\n    onClose,\n    onFocusNext,\n  } = useAutocompleteContext()\n  const uuid = useId()\n  const itemRef = useRef<HTMLLIElement>(null)\n  let {\n    id,\n    children,\n    closeOnSelect: customCloseOnSelect,\n    disabled,\n    focusable,\n    icon: customIcon,\n    isDisabled,\n    isFocusable,\n    value: optionValue,\n    ...computedProps\n  } = { ...optionProps, ...props }\n  disabled ??= isDisabled\n  focusable ??= isFocusable\n  const trulyDisabled = !!disabled && !focusable\n  const { descendants, index, register } = useAutocompleteDescendant({\n    disabled: trulyDisabled,\n  })\n  const values = descendants.values()\n  const frontValues = values.slice(0, index)\n  const isMulti = isArray(value)\n  const isDuplicated = frontValues.some(\n    ({ node }) => node.dataset.value === (optionValue ?? \"\"),\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  id ??= uuid\n\n  if (isUndefined(optionValue)) {\n    if (isString(children) || isNumber(children)) {\n      optionValue = children.toString()\n    } else {\n      console.warn(\n        `${\n          !isMulti ? \"Autocomplete\" : \"MultiAutocomplete\"\n        }: Cannot infer the option value of complex children. Pass a \\`value\\` prop or use a plain string as children to <Option>.`,\n      )\n    }\n  }\n\n  const onClick = useCallback(\n    (ev: MouseEvent<HTMLDivElement>) => {\n      ev.stopPropagation()\n\n      if (disabled || !isTargetOption(ev.currentTarget)) {\n        if (inputRef.current) inputRef.current.focus()\n\n        return\n      }\n\n      if (!isDuplicated) setFocusedIndex(index)\n\n      onChange(optionValue ?? \"\")\n\n      if (inputRef.current) inputRef.current.focus()\n\n      if (customCloseOnSelect ?? closeOnSelect) onClose()\n\n      if (omitSelectedValues) onFocusNext(index)\n    },\n    [\n      isDuplicated,\n      onFocusNext,\n      omitSelectedValues,\n      disabled,\n      optionValue,\n      setFocusedIndex,\n      index,\n      onChange,\n      customCloseOnSelect,\n      closeOnSelect,\n      onClose,\n      inputRef,\n    ],\n  )\n\n  const getOptionProps: PropGetter = useCallback(\n    (props = {}, ref = null) => {\n      const isHidden = !isTarget || (omitSelectedValues && isSelected)\n\n      const style: CSSProperties = {\n        border: \"0px\",\n        clip: \"rect(0px, 0px, 0px, 0px)\",\n        height: \"1px\",\n        margin: \"-1px\",\n        overflow: \"hidden\",\n        padding: \"0px\",\n        position: \"absolute\",\n        whiteSpace: \"nowrap\",\n        width: \"1px\",\n      }\n\n      return {\n        ref: mergeRefs(itemRef, ref, register),\n        role: \"option\",\n        ...computedProps,\n        ...props,\n        id,\n        style: isHidden ? style : undefined,\n        \"aria-disabled\": ariaAttr(disabled),\n        \"aria-hidden\": ariaAttr(isHidden),\n        \"aria-selected\": isSelected,\n        \"data-disabled\": dataAttr(disabled),\n        \"data-duplicated\": dataAttr(isDuplicated),\n        \"data-focus\": dataAttr(isFocused),\n        \"data-target\": dataAttr(true),\n        \"data-value\": optionValue ?? \"\",\n        tabIndex: -1,\n        onClick: handlerAll(computedProps.onClick, props.onClick, onClick),\n      }\n    },\n    [\n      id,\n      isDuplicated,\n      optionValue,\n      computedProps,\n      disabled,\n      isFocused,\n      isSelected,\n      isTarget,\n      omitSelectedValues,\n      onClick,\n      register,\n    ],\n  )\n\n  return {\n    children,\n    customIcon,\n    isFocused,\n    isSelected,\n    isTarget,\n    omitSelectedValues,\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 = useCallback(\n    (props = {}, ref = null) => {\n      const style: CSSProperties = {\n        border: \"0px\",\n        clip: \"rect(0px, 0px, 0px, 0px)\",\n        height: \"1px\",\n        margin: \"-1px\",\n        overflow: \"hidden\",\n        padding: \"0px\",\n        position: \"absolute\",\n        whiteSpace: \"nowrap\",\n        width: \"1px\",\n      }\n\n      return {\n        ref,\n        role: \"option\",\n        ...props,\n        style: isHit ? style : undefined,\n        \"aria-hidden\": ariaAttr(isHit),\n        \"data-focus\": dataAttr(!isHit),\n        tabIndex: -1,\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 { isEmpty, isHit } = useAutocompleteContext()\n\n  const getEmptyProps: PropGetter = useCallback(\n    (props = {}, ref = null) => {\n      const isHidden = isHit && !isEmpty\n\n      const style: CSSProperties = {\n        border: \"0px\",\n        clip: \"rect(0px, 0px, 0px, 0px)\",\n        height: \"1px\",\n        margin: \"-1px\",\n        overflow: \"hidden\",\n        padding: \"0px\",\n        position: \"absolute\",\n        whiteSpace: \"nowrap\",\n        width: \"1px\",\n      }\n\n      return {\n        ref,\n        role: \"presentation\",\n        ...props,\n        style: isHidden ? style : undefined,\n        \"aria-hidden\": ariaAttr(isHidden),\n        tabIndex: -1,\n      }\n    },\n    [isHit, isEmpty],\n  )\n\n  return { getEmptyProps }\n}\n\nexport type UseAutocompleteEmptyReturn = ReturnType<typeof useAutocompleteEmpty>\n","import type { CSSUIObject } from \"@yamada-ui/core\"\nimport type { Dispatch, DOMAttributes, RefObject, SetStateAction } from \"react\"\nimport type { UseAutocompleteProps } from \"./use-autocomplete\"\nimport { createDescendant } from \"@yamada-ui/use-descendant\"\nimport { createContext } from \"@yamada-ui/utils\"\n\nexport const {\n  DescendantsContextProvider: AutocompleteDescendantsContextProvider,\n  useDescendant: useAutocompleteDescendant,\n  useDescendants: useAutocompleteDescendants,\n  useDescendantsContext: useAutocompleteDescendantsContext,\n} = createDescendant()\n\ninterface AutocompleteContext\n  extends Omit<\n    UseAutocompleteProps,\n    \"defaultValue\" | \"onChange\" | \"onCreate\" | \"value\"\n  > {\n  focusedIndex: number\n  inputRef: RefObject<HTMLInputElement>\n  inputValue: string\n  isAllSelected: boolean\n  isEmpty: boolean\n  isHit: boolean\n  isOpen: boolean\n  label: string | string[] | undefined\n  pickOptions: (value: string) => void\n  rebirthOptions: (runFocus?: boolean) => void\n  setFocusedIndex: Dispatch<SetStateAction<number>>\n  styles: { [key: string]: CSSUIObject | undefined }\n  value: string | string[]\n  formControlProps: { [key: string]: any }\n  inputProps: DOMAttributes<HTMLInputElement>\n  onChange: (newValue: string, runRebirth?: boolean) => void\n  onClose: () => void\n  onCreate: () => void\n  onFocusFirst: () => void\n  onFocusLast: () => void\n  onFocusNext: (index?: number) => void\n  onFocusPrev: (index?: number) => void\n  onOpen: () => void\n}\n\nexport const [AutocompleteProvider, useAutocompleteContext] =\n  createContext<AutocompleteContext>({\n    name: \"AutocompleteContext\",\n    errorMessage: `useAutocompleteContext returned is 'undefined'. Seems you forgot to wrap the components in \"<Autocomplete />\" or \"<MultiAutocomplete />\"`,\n  })\n"],"mappings":"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","names":["import_utils","props"]}

package/dist/use-autocomplete-option.mjs

@@ -3,8 +3,8 @@ import {
   useAutocompleteCreate,
   useAutocompleteEmpty,
   useAutocompleteOption
-} from "./chunk-LCC3VNZV.mjs";
-import "./chunk-ZNO5RUVT.mjs";
+} from "./chunk-2LP57WVB.mjs";
+import "./chunk-TP5VZFO3.mjs";
 export {
   useAutocompleteCreate,
   useAutocompleteEmpty,

package/dist/use-autocomplete.d.mts

@@ -95,7 +95,6 @@ interface UseAutocompleteBaseProps<T extends MaybeValue = string> extends ComboB
 interface UseAutocompleteProps<T extends MaybeValue = string> extends Omit<HTMLUIProps<"input">, "disabled" | "list" | "readOnly" | "required" | "size" | keyof UseAutocompleteBaseProps>, UseAutocompleteBaseProps<T> {
 }
 declare const useAutocomplete: <T extends MaybeValue = string>(props: UseAutocompleteProps<T>) => {
-    id: string | undefined;
     allowCreate: boolean;
     allowFree: boolean;
     children: string | number | boolean | ReactElement<any, string | react.JSXElementConstructor<any>> | Iterable<react.ReactNode> | undefined;
@@ -134,7 +133,6 @@ declare const useAutocomplete: <T extends MaybeValue = string>(props: UseAutocom
     isHit: boolean;
     isOpen: boolean;
     label: T | undefined;
-    listRef: react.RefObject<HTMLUListElement>;
     omitSelectedValues: boolean;
     pickOptions: (value: string) => void;
     rebirthOptions: (runFocus?: boolean) => void;

package/dist/use-autocomplete.d.ts

@@ -95,7 +95,6 @@ interface UseAutocompleteBaseProps<T extends MaybeValue = string> extends ComboB
 interface UseAutocompleteProps<T extends MaybeValue = string> extends Omit<HTMLUIProps<"input">, "disabled" | "list" | "readOnly" | "required" | "size" | keyof UseAutocompleteBaseProps>, UseAutocompleteBaseProps<T> {
 }
 declare const useAutocomplete: <T extends MaybeValue = string>(props: UseAutocompleteProps<T>) => {
-    id: string | undefined;
     allowCreate: boolean;
     allowFree: boolean;
     children: string | number | boolean | ReactElement<any, string | react.JSXElementConstructor<any>> | Iterable<react.ReactNode> | undefined;
@@ -134,7 +133,6 @@ declare const useAutocomplete: <T extends MaybeValue = string>(props: UseAutocom
     isHit: boolean;
     isOpen: boolean;
     label: T | undefined;
-    listRef: react.RefObject<HTMLUListElement>;
     omitSelectedValues: boolean;
     pickOptions: (value: string) => void;
     rebirthOptions: (runFocus?: boolean) => void;

package/dist/use-autocomplete.js

@@ -600,6 +600,7 @@ var flattenItems = (items) => {
   return filterItems(items).flat(Infinity);
 };
 var useAutocomplete = (props) => {
+  var _a;
   const {
     allowCreate = false,
     allowFree = false,
@@ -643,16 +644,8 @@ var useAutocomplete = (props) => {
     onSearch: onSearchProp,
     ...rest
   } = (0, import_form_control.useFormControlProps)(props);
-  const {
-    "aria-readonly": _ariaReadonly,
-    onFocus: onFocusProp,
-    ...formControlProps
-  } = (0, import_utils7.pickObject)(rest, import_form_control.formControlProperties);
-  const [containerProps, inputProps] = (0, import_utils7.splitObject)(rest, import_core5.layoutStyleProperties);
-  const { id } = rest;
   const descendants = useAutocompleteDescendants();
   const containerRef = (0, import_react4.useRef)(null);
-  const listRef = (0, import_react4.useRef)(null);
   const inputRef = (0, import_react4.useRef)(null);
   const timeoutIds = (0, import_react4.useRef)(/* @__PURE__ */ new Set([]));
   const isComposition = (0, import_react4.useRef)(false);
@@ -678,6 +671,12 @@ var useAutocomplete = (props) => {
     onClose: onCloseProp,
     onOpen: onOpenProp
   });
+  const {
+    "aria-readonly": _ariaReadonly,
+    onFocus: onFocusProp,
+    ...formControlProps
+  } = (0, import_utils7.pickObject)(rest, import_form_control.formControlProperties);
+  const [containerProps, inputProps] = (0, import_utils7.splitObject)(rest, import_core5.layoutStyleProperties);
   const isFocused = focusedIndex > -1;
   const isCreate = focusedIndex === -2 && allowCreate;
   const isMulti = (0, import_utils7.isArray)(value);
@@ -696,14 +695,15 @@ var useAutocomplete = (props) => {
   }
   const selectedValues = descendants.enabledValues(
     ({ node }) => {
-      var _a;
-      return isMulti && value.includes((_a = node.dataset.value) != null ? _a : "");
+      var _a2;
+      return isMulti && value.includes((_a2 = node.dataset.value) != null ? _a2 : "");
     }
   );
   const selectedIndexes = selectedValues.map(({ index }) => index);
   const enabledValues = descendants.enabledValues(
     ({ index, node }) => "target" in node.dataset && !selectedIndexes.includes(index)
   );
+  const activedescendantId = (_a = descendants.value(focusedIndex)) == null ? void 0 : _a.node.id;
   const validChildren = (0, import_utils7.getValidChildren)(children);
   const computedChildren = (0, import_react4.useMemo)(
     () => resolvedItems == null ? void 0 : resolvedItems.map((item, index) => {
@@ -733,8 +733,8 @@ var useAutocomplete = (props) => {
     if (inputRef.current) inputRef.current.focus();
   }, [allowCreate, formControlProps, isAllSelected, isEmpty, onInternalOpen]);
   const onFocusFirst = (0, import_react4.useCallback)(() => {
-    const id2 = setTimeout(() => {
-      var _a;
+    const id = setTimeout(() => {
+      var _a2;
       if (isEmpty || isAllSelected) return;
       const first = descendants.enabledFirstValue(
         ({ node }) => "target" in node.dataset
@@ -745,13 +745,13 @@ var useAutocomplete = (props) => {
       } else {
         if (selectedIndexes.includes(first.index)) {
           const enabledFirst = enabledValues[0];
-          setFocusedIndex((_a = enabledFirst == null ? void 0 : enabledFirst.index) != null ? _a : -1);
+          setFocusedIndex((_a2 = enabledFirst == null ? void 0 : enabledFirst.index) != null ? _a2 : -1);
         } else {
           setFocusedIndex(first.index);
         }
       }
     });
-    timeoutIds.current.add(id2);
+    timeoutIds.current.add(id);
   }, [
     descendants,
     enabledValues,
@@ -762,8 +762,8 @@ var useAutocomplete = (props) => {
     selectedIndexes
   ]);
   const onFocusLast = (0, import_react4.useCallback)(() => {
-    const id2 = setTimeout(() => {
-      var _a;
+    const id = setTimeout(() => {
+      var _a2;
       if (isEmpty || isAllSelected) return;
       const last = descendants.enabledLastValue(
         ({ node }) => "target" in node.dataset
@@ -774,13 +774,13 @@ var useAutocomplete = (props) => {
       } else {
         if (selectedIndexes.includes(last.index)) {
           const enabledLast = enabledValues.reverse()[0];
-          setFocusedIndex((_a = enabledLast == null ? void 0 : enabledLast.index) != null ? _a : -1);
+          setFocusedIndex((_a2 = enabledLast == null ? void 0 : enabledLast.index) != null ? _a2 : -1);
         } else {
           setFocusedIndex(last.index);
         }
       }
     });
-    timeoutIds.current.add(id2);
+    timeoutIds.current.add(id);
   }, [
     descendants,
     enabledValues,
@@ -791,22 +791,22 @@ var useAutocomplete = (props) => {
     selectedIndexes
   ]);
   const onFocusSelected = (0, import_react4.useCallback)(() => {
-    const id2 = setTimeout(() => {
+    const id = setTimeout(() => {
       const values = descendants.enabledValues();
       const selected = values.find(
         ({ node }) => {
-          var _a;
-          return !isMulti ? node.dataset.value === value : value.includes((_a = node.dataset.value) != null ? _a : "");
+          var _a2;
+          return !isMulti ? node.dataset.value === value : value.includes((_a2 = node.dataset.value) != null ? _a2 : "");
         }
       );
       if (selected) setFocusedIndex(selected.index);
     });
-    timeoutIds.current.add(id2);
+    timeoutIds.current.add(id);
   }, [descendants, isMulti, value]);
   const onFocusNext = (0, import_react4.useCallback)(
     (index = focusedIndex) => {
-      const id2 = setTimeout(() => {
-        var _a, _b;
+      const id = setTimeout(() => {
+        var _a2, _b;
         const next = descendants.enabledNextValue(
           index,
           ({ node }) => "target" in node.dataset
@@ -816,14 +816,14 @@ var useAutocomplete = (props) => {
           setFocusedIndex(next.index);
         } else {
           if (selectedIndexes.includes(next.index)) {
-            const enabledNext = (_a = enabledValues.find(({ index: index2 }) => next.index < index2)) != null ? _a : enabledValues[0];
+            const enabledNext = (_a2 = enabledValues.find(({ index: index2 }) => next.index < index2)) != null ? _a2 : enabledValues[0];
             setFocusedIndex((_b = enabledNext == null ? void 0 : enabledNext.index) != null ? _b : -1);
           } else {
             setFocusedIndex(next.index);
           }
         }
       });
-      timeoutIds.current.add(id2);
+      timeoutIds.current.add(id);
     },
     [
       descendants,
@@ -836,8 +836,8 @@ var useAutocomplete = (props) => {
   );
   const onFocusPrev = (0, import_react4.useCallback)(
     (index = focusedIndex) => {
-      const id2 = setTimeout(() => {
-        var _a, _b;
+      const id = setTimeout(() => {
+        var _a2, _b;
         const prev = descendants.enabledPrevValue(
           index,
           ({ node }) => "target" in node.dataset
@@ -847,14 +847,14 @@ var useAutocomplete = (props) => {
           setFocusedIndex(prev.index);
         } else {
           if (selectedIndexes.includes(prev.index)) {
-            const enabledPrev = (_a = enabledValues.reverse().find(({ index: index2 }) => index2 < prev.index)) != null ? _a : enabledValues[0];
+            const enabledPrev = (_a2 = enabledValues.reverse().find(({ index: index2 }) => index2 < prev.index)) != null ? _a2 : enabledValues[0];
             setFocusedIndex((_b = enabledPrev == null ? void 0 : enabledPrev.index) != null ? _b : -1);
           } else {
             setFocusedIndex(prev.index);
           }
         }
       });
-      timeoutIds.current.add(id2);
+      timeoutIds.current.add(id);
     },
     [
       descendants,
@@ -873,8 +873,8 @@ var useAutocomplete = (props) => {
       let isHit2 = false;
       let isFocused2 = false;
       values.forEach(({ index, node }) => {
-        var _a;
-        if (format((_a = node.textContent) != null ? _a : "").includes(value2)) {
+        var _a2;
+        if (format((_a2 = node.textContent) != null ? _a2 : "").includes(value2)) {
           isHit2 = true;
           const isDisabled = "disabled" in node.dataset;
           node.dataset.target = "";
@@ -907,8 +907,8 @@ var useAutocomplete = (props) => {
       if (!values.length) return;
       const resolvedValues = (0, import_utils7.isArray)(newValue) ? newValue : [newValue];
       const selectedLabel = resolvedValues.map((value2) => {
-        var _a, _b;
-        const { node } = (_a = values.find(({ node: node2 }) => node2.dataset.value === value2)) != null ? _a : {};
+        var _a2, _b;
+        const { node } = (_a2 = values.find(({ node: node2 }) => node2.dataset.value === value2)) != null ? _a2 : {};
         if (node) {
           const { textContent } = (_b = Array.from(node.children).find(
             (child) => child.getAttribute("data-label") !== null
@@ -945,9 +945,9 @@ var useAutocomplete = (props) => {
     [isMulti, rebirthOptions, setValue]
   );
   const onSelect = (0, import_react4.useCallback)(() => {
-    var _a, _b;
+    var _a2, _b;
     let enabledValue = descendants.value(focusedIndex);
-    if ("disabled" in ((_a = enabledValue == null ? void 0 : enabledValue.node.dataset) != null ? _a : {}))
+    if ("disabled" in ((_a2 = enabledValue == null ? void 0 : enabledValue.node.dataset) != null ? _a2 : {}))
       enabledValue = void 0;
     if (!enabledValue) return;
     const value2 = (_b = enabledValue.node.dataset.value) != null ? _b : "";
@@ -985,8 +985,7 @@ var useAutocomplete = (props) => {
     isComposition.current = false;
   }, []);
   const onCreate = (0, import_react4.useCallback)(() => {
-    var _a, _b;
-    if (!listRef.current) return;
+    var _a2, _b;
     const newItem = { label: inputValue, value: inputValue };
     let newItems = [];
     if (resolvedItems) newItems = [...resolvedItems];
@@ -1001,7 +1000,7 @@ var useAutocomplete = (props) => {
       const targetItem = newItems[i];
       if (i !== -1 && targetItem && "items" in targetItem) {
         if (secondInsertPositionItem === "first") {
-          targetItem.items = [newItem, ...(_a = targetItem.items) != null ? _a : []];
+          targetItem.items = [newItem, ...(_a2 = targetItem.items) != null ? _a2 : []];
         } else {
           targetItem.items = [...(_b = targetItem.items) != null ? _b : [], newItem];
         }
@@ -1158,7 +1157,7 @@ var useAutocomplete = (props) => {
     setResolvedItems(items ? JSON.parse(JSON.stringify(items)) : void 0);
   }, [items]);
   (0, import_utils7.useUnmountEffect)(() => {
-    timeoutIds.current.forEach((id2) => clearTimeout(id2));
+    timeoutIds.current.forEach((id) => clearTimeout(id));
     timeoutIds.current.clear();
   });
   (0, import_use_outside_click.useOutsideClick)({
@@ -1229,6 +1228,10 @@ var useAutocomplete = (props) => {
   const getFieldProps = (0, import_react4.useCallback)(
     (props2 = {}, ref = null) => ({
       ref,
+      "aria-activedescendant": activedescendantId,
+      "aria-autocomplete": "list",
+      "aria-haspopup": "listbox",
+      role: "combobox",
       tabIndex: -1,
       ...props2,
       ...formControlProps,
@@ -1238,6 +1241,7 @@ var useAutocomplete = (props) => {
       onKeyDown: (0, import_utils7.handlerAll)(props2.onKeyDown, onKeyDownProp, onKeyDown)
     }),
     [
+      activedescendantId,
       formControlProps,
       placeholder,
       isOpen,
@@ -1248,7 +1252,6 @@ var useAutocomplete = (props) => {
     ]
   );
   return {
-    id,
     allowCreate,
     allowFree,
     children: children != null ? children : computedChildren,
@@ -1263,7 +1266,6 @@ var useAutocomplete = (props) => {
     isHit,
     isOpen,
     label,
-    listRef,
     omitSelectedValues,
     pickOptions,
     rebirthOptions,
@@ -1291,23 +1293,15 @@ var useAutocomplete = (props) => {
   };
 };
 var useAutocompleteInput = () => {
-  var _a, _b;
   const {
-    id,
-    focusedIndex,
     inputRef,
     isAllSelected,
-    isOpen,
-    listRef,
     formControlProps,
     inputProps,
     onCompositionEnd,
     onCompositionStart,
     onSearch
   } = useAutocompleteContext();
-  const descendants = useAutocompleteDescendantsContext();
-  const activedescendantId = (_a = descendants.value(focusedIndex)) == null ? void 0 : _a.node.id;
-  const listId = (_b = listRef.current) == null ? void 0 : _b.id;
   (0, import_utils7.useUpdateEffect)(() => {
     if (isAllSelected && inputRef.current) inputRef.current.blur();
   }, [isAllSelected]);
@@ -1316,19 +1310,12 @@ var useAutocompleteInput = () => {
       return {
         ref: (0, import_utils7.mergeRefs)(inputRef, ref),
         ...formControlProps,
-        "aria-activedescendant": activedescendantId,
-        "aria-autocomplete": "list",
-        "aria-controls": listId,
-        "aria-expanded": isOpen,
-        "aria-haspopup": "listbox",
         autoCapitalize: "none",
         autoComplete: "off",
-        role: "combobox",
         spellCheck: "false",
         tabIndex: isAllSelected ? -1 : 0,
         ...inputProps,
         ...props,
-        id,
         cursor: formControlProps.readOnly ? "default" : "text",
         pointerEvents: formControlProps.disabled || isAllSelected ? "none" : "auto",
         onChange: (0, import_utils7.handlerAll)(props.onChange, onSearch),
@@ -1345,13 +1332,9 @@ var useAutocompleteInput = () => {
       };
     },
     [
-      listId,
-      activedescendantId,
-      isOpen,
       inputProps,
       inputRef,
       formControlProps,
-      id,
       isAllSelected,
       onSearch,
       onCompositionStart,