@yamada-ui/autocomplete 1.5.4-next-20241005220055 → 1.6.0-dev-20241011151311

package/dist/{chunk-HZECQUHV.mjs.map → chunk-Q33EMTO2.mjs.map}

@@ -1 +1 @@
-{"version":3,"sources":["../src/autocomplete.tsx"],"sourcesContent":["import type { CSSUIObject, HTMLUIProps, ThemeProps } from \"@yamada-ui/core\"\nimport {\n  ui,\n  forwardRef,\n  useComponentMultiStyle,\n  omitThemeProps,\n} from \"@yamada-ui/core\"\nimport type { MotionProps } from \"@yamada-ui/motion\"\nimport { Popover, PopoverTrigger } from \"@yamada-ui/popover\"\nimport { Portal } from \"@yamada-ui/portal\"\nimport type { PortalProps } from \"@yamada-ui/portal\"\nimport { cx, runIfFunc } from \"@yamada-ui/utils\"\nimport type { FC, ReactNode } from \"react\"\nimport {\n  AutocompleteDescendantsContextProvider,\n  AutocompleteProvider,\n  useAutocompleteContext,\n} from \"./autocomplete-context\"\nimport { AutocompleteCreate } from \"./autocomplete-create\"\nimport type { AutocompleteCreateProps } from \"./autocomplete-create\"\nimport { AutocompleteEmpty } from \"./autocomplete-empty\"\nimport type { AutocompleteEmptyProps } from \"./autocomplete-empty\"\nimport type { AutocompleteIconProps } from \"./autocomplete-icon\"\nimport { AutocompleteIcon } from \"./autocomplete-icon\"\nimport type { AutocompleteListProps } from \"./autocomplete-list\"\nimport { AutocompleteList } from \"./autocomplete-list\"\nimport type { UseAutocompleteProps } from \"./use-autocomplete\"\nimport { useAutocomplete, useAutocompleteInput } from \"./use-autocomplete\"\n\ninterface AutocompleteOptions {\n  /**\n   * The border color when the input is focused.\n   */\n  focusBorderColor?: string\n  /**\n   * The border color when the input is invalid.\n   */\n  errorBorderColor?: string\n  /**\n   * Props for autocomplete container element.\n   */\n  containerProps?: Omit<HTMLUIProps, \"children\">\n  /**\n   * Props for autocomplete content element.\n   */\n  contentProps?: Omit<MotionProps, \"children\">\n  /**\n   * Props for autocomplete list element.\n   */\n  listProps?: Omit<AutocompleteListProps, \"children\">\n  /**\n   * Props for autocomplete field element.\n   */\n  fieldProps?: Omit<AutocompleteFieldProps, \"inputProps\" | \"children\">\n  /**\n   * Props for autocomplete input element.\n   */\n  inputProps?: HTMLUIProps<\"input\">\n  /**\n   * Props for autocomplete icon element.\n   */\n  iconProps?: AutocompleteIconProps\n  /**\n   * Props to be forwarded to the portal component.\n   *\n   * @default '{ isDisabled: true }'\n   */\n  portalProps?: Omit<PortalProps, \"children\">\n  /**\n   * Props for autocomplete create element.\n   */\n  createProps?: Omit<AutocompleteCreateProps, \"children\">\n  /**\n   * Props for autocomplete empty element.\n   */\n  emptyProps?: Omit<AutocompleteEmptyProps, \"children\">\n  /**\n   * The header of the autocomplete content element.\n   */\n  header?: ReactNode | FC<{ value: string | undefined; onClose: () => void }>\n  /**\n   * The footer of the autocomplete content element.\n   */\n  footer?: ReactNode | FC<{ value: string | undefined; onClose: () => void }>\n}\n\nexport interface AutocompleteProps\n  extends ThemeProps<\"Autocomplete\">,\n    Omit<UseAutocompleteProps, \"maxSelectValues\" | \"omitSelectedValues\">,\n    AutocompleteOptions {}\n\n/**\n * `Autocomplete` is a component used to display suggestions in response to user text input.\n *\n * @see Docs https://yamada-ui.com/components/forms/autocomplete\n */\nexport const Autocomplete = forwardRef<AutocompleteProps, \"input\">(\n  (props, ref) => {\n    const [styles, mergedProps] = useComponentMultiStyle(\"Autocomplete\", props)\n    let {\n      className,\n      defaultValue = \"\",\n      color,\n      h,\n      height,\n      minH,\n      minHeight,\n      containerProps,\n      contentProps,\n      listProps,\n      fieldProps,\n      inputProps,\n      iconProps,\n      portalProps = { isDisabled: true },\n      createProps,\n      emptyProps,\n      header,\n      footer,\n      children,\n      ...computedProps\n    } = omitThemeProps(mergedProps)\n\n    const {\n      value,\n      onClose,\n      descendants,\n      formControlProps,\n      getPopoverProps,\n      getContainerProps,\n      getFieldProps,\n      allowCreate,\n      isEmpty,\n      inputValue,\n      computedChildren,\n      ...rest\n    } = useAutocomplete({ ...computedProps, defaultValue, children })\n\n    h ??= height\n    minH ??= minHeight\n\n    const css: CSSUIObject = {\n      w: \"100%\",\n      h: \"fit-content\",\n      color,\n      ...styles.container,\n    }\n\n    return (\n      <AutocompleteDescendantsContextProvider value={descendants}>\n        <AutocompleteProvider\n          value={{\n            ...rest,\n            value,\n            onClose,\n            formControlProps,\n            inputValue,\n            allowCreate,\n            isEmpty,\n            styles,\n          }}\n        >\n          <Popover {...getPopoverProps()}>\n            <ui.div\n              className={cx(\"ui-autocomplete\", className)}\n              __css={css}\n              {...getContainerProps(containerProps)}\n            >\n              <ui.div\n                className=\"ui-autocomplete__inner\"\n                __css={{ position: \"relative\", ...styles.inner }}\n              >\n                <AutocompleteField\n                  h={h}\n                  minH={minH}\n                  inputProps={inputProps}\n                  {...getFieldProps(fieldProps, ref)}\n                />\n\n                <AutocompleteIcon {...iconProps} {...formControlProps} />\n              </ui.div>\n\n              {!isEmpty ? (\n                <Portal {...portalProps}>\n                  <AutocompleteList\n                    header={runIfFunc(header, { value, onClose })}\n                    footer={runIfFunc(footer, { value, onClose })}\n                    contentProps={contentProps}\n                    {...listProps}\n                  >\n                    {allowCreate ? (\n                      <AutocompleteCreate {...createProps} />\n                    ) : (\n                      <AutocompleteEmpty {...emptyProps} />\n                    )}\n\n                    {children ?? computedChildren}\n                  </AutocompleteList>\n                </Portal>\n              ) : (\n                <Portal {...portalProps}>\n                  <AutocompleteList\n                    header={runIfFunc(header, { value, onClose })}\n                    footer={runIfFunc(footer, { value, onClose })}\n                    contentProps={contentProps}\n                    {...listProps}\n                  >\n                    {allowCreate && inputValue ? (\n                      <AutocompleteCreate {...createProps} />\n                    ) : (\n                      <AutocompleteEmpty {...emptyProps} />\n                    )}\n                  </AutocompleteList>\n                </Portal>\n              )}\n            </ui.div>\n          </Popover>\n        </AutocompleteProvider>\n      </AutocompleteDescendantsContextProvider>\n    )\n  },\n)\n\nAutocomplete.displayName = \"Autocomplete\"\nAutocomplete.__ui__ = \"Autocomplete\"\n\ninterface AutocompleteFieldProps\n  extends HTMLUIProps,\n    Pick<AutocompleteProps, \"inputProps\"> {}\n\nconst AutocompleteField = forwardRef<AutocompleteFieldProps, \"input\">(\n  ({ className, h, minH, placeholder, inputProps, ...rest }, ref) => {\n    const { label, inputValue, styles } = useAutocompleteContext()\n    const { getInputProps } = useAutocompleteInput()\n\n    const css: CSSUIObject = {\n      pe: \"2rem\",\n      h,\n      minH,\n      display: \"flex\",\n      alignItems: \"center\",\n      ...styles.field,\n      cursor: \"text\",\n    }\n\n    return (\n      <PopoverTrigger>\n        <ui.div\n          className={cx(\"ui-autocomplete__field\", className)}\n          __css={css}\n          {...rest}\n        >\n          <ui.input\n            className=\"ui-autocomplete__field__input\"\n            display=\"inline-block\"\n            w=\"100%\"\n            placeholder={placeholder}\n            {...getInputProps(\n              { ...inputProps, value: inputValue || label || \"\" },\n              ref,\n            )}\n          />\n        </ui.div>\n      </PopoverTrigger>\n    )\n  },\n)\n\nAutocompleteField.displayName = \"AutocompleteField\"\nAutocompleteField.__ui__ = \"AutocompleteField\"\n"],"mappings":"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","names":[]}
+{"version":3,"sources":["../src/autocomplete.tsx"],"sourcesContent":["import type { CSSUIObject, HTMLUIProps, ThemeProps } from \"@yamada-ui/core\"\nimport type { MotionProps } from \"@yamada-ui/motion\"\nimport type { PortalProps } from \"@yamada-ui/portal\"\nimport type { FC, ReactNode } from \"react\"\nimport type { AutocompleteCreateProps } from \"./autocomplete-create\"\nimport type { AutocompleteEmptyProps } from \"./autocomplete-empty\"\nimport type { AutocompleteIconProps } from \"./autocomplete-icon\"\nimport type { AutocompleteListProps } from \"./autocomplete-list\"\nimport type { UseAutocompleteProps } from \"./use-autocomplete\"\nimport {\n  forwardRef,\n  omitThemeProps,\n  ui,\n  useComponentMultiStyle,\n} from \"@yamada-ui/core\"\nimport { Popover, PopoverTrigger } from \"@yamada-ui/popover\"\nimport { Portal } from \"@yamada-ui/portal\"\nimport { cx, runIfFunc } from \"@yamada-ui/utils\"\nimport {\n  AutocompleteDescendantsContextProvider,\n  AutocompleteProvider,\n  useAutocompleteContext,\n} from \"./autocomplete-context\"\nimport { AutocompleteCreate } from \"./autocomplete-create\"\nimport { AutocompleteEmpty } from \"./autocomplete-empty\"\nimport { AutocompleteIcon } from \"./autocomplete-icon\"\nimport { AutocompleteList } from \"./autocomplete-list\"\nimport { useAutocomplete, useAutocompleteInput } from \"./use-autocomplete\"\n\ninterface AutocompleteOptions {\n  /**\n   * The border color when the input is invalid.\n   */\n  errorBorderColor?: string\n  /**\n   * The border color when the input is focused.\n   */\n  focusBorderColor?: string\n  /**\n   * The footer of the autocomplete content element.\n   */\n  footer?: FC<{ value: string | undefined; onClose: () => void }> | ReactNode\n  /**\n   * The header of the autocomplete content element.\n   */\n  header?: FC<{ value: string | undefined; onClose: () => void }> | ReactNode\n  /**\n   * Props for autocomplete container element.\n   */\n  containerProps?: Omit<HTMLUIProps, \"children\">\n  /**\n   * Props for autocomplete content element.\n   */\n  contentProps?: Omit<MotionProps, \"children\">\n  /**\n   * Props for autocomplete create element.\n   */\n  createProps?: Omit<AutocompleteCreateProps, \"children\">\n  /**\n   * Props for autocomplete empty element.\n   */\n  emptyProps?: Omit<AutocompleteEmptyProps, \"children\">\n  /**\n   * Props for autocomplete field element.\n   */\n  fieldProps?: Omit<AutocompleteFieldProps, \"children\" | \"inputProps\">\n  /**\n   * Props for autocomplete icon element.\n   */\n  iconProps?: AutocompleteIconProps\n  /**\n   * Props for autocomplete input element.\n   */\n  inputProps?: HTMLUIProps<\"input\">\n  /**\n   * Props for autocomplete list element.\n   */\n  listProps?: Omit<AutocompleteListProps, \"children\">\n  /**\n   * Props to be forwarded to the portal component.\n   *\n   * @default '{ isDisabled: true }'\n   */\n  portalProps?: Omit<PortalProps, \"children\">\n}\n\nexport interface AutocompleteProps\n  extends ThemeProps<\"Autocomplete\">,\n    Omit<UseAutocompleteProps, \"maxSelectValues\" | \"omitSelectedValues\">,\n    AutocompleteOptions {}\n\n/**\n * `Autocomplete` is a component used to display suggestions in response to user text input.\n *\n * @see Docs https://yamada-ui.com/components/forms/autocomplete\n */\nexport const Autocomplete = forwardRef<AutocompleteProps, \"input\">(\n  (props, ref) => {\n    const [styles, mergedProps] = useComponentMultiStyle(\"Autocomplete\", props)\n    let {\n      className,\n      children,\n      color,\n      defaultValue = \"\",\n      footer,\n      h,\n      header,\n      height,\n      minH,\n      minHeight,\n      containerProps,\n      contentProps,\n      createProps,\n      emptyProps,\n      fieldProps,\n      iconProps,\n      inputProps,\n      listProps,\n      portalProps = { isDisabled: true },\n      ...computedProps\n    } = omitThemeProps(mergedProps)\n\n    const {\n      allowCreate,\n      computedChildren,\n      descendants,\n      inputValue,\n      isEmpty,\n      value,\n      formControlProps,\n      getContainerProps,\n      getFieldProps,\n      getPopoverProps,\n      onClose,\n      ...rest\n    } = useAutocomplete({ ...computedProps, children, defaultValue })\n\n    h ??= height\n    minH ??= minHeight\n\n    const css: CSSUIObject = {\n      color,\n      h: \"fit-content\",\n      w: \"100%\",\n      ...styles.container,\n    }\n\n    return (\n      <AutocompleteDescendantsContextProvider value={descendants}>\n        <AutocompleteProvider\n          value={{\n            ...rest,\n            allowCreate,\n            inputValue,\n            isEmpty,\n            styles,\n            value,\n            formControlProps,\n            onClose,\n          }}\n        >\n          <Popover {...getPopoverProps()}>\n            <ui.div\n              className={cx(\"ui-autocomplete\", className)}\n              __css={css}\n              {...getContainerProps(containerProps)}\n            >\n              <ui.div\n                className=\"ui-autocomplete__inner\"\n                __css={{ position: \"relative\", ...styles.inner }}\n              >\n                <AutocompleteField\n                  h={h}\n                  minH={minH}\n                  inputProps={inputProps}\n                  {...getFieldProps(fieldProps, ref)}\n                />\n\n                <AutocompleteIcon {...iconProps} {...formControlProps} />\n              </ui.div>\n\n              {!isEmpty ? (\n                <Portal {...portalProps}>\n                  <AutocompleteList\n                    footer={runIfFunc(footer, { value, onClose })}\n                    header={runIfFunc(header, { value, onClose })}\n                    contentProps={contentProps}\n                    {...listProps}\n                  >\n                    {allowCreate ? (\n                      <AutocompleteCreate {...createProps} />\n                    ) : (\n                      <AutocompleteEmpty {...emptyProps} />\n                    )}\n\n                    {children ?? computedChildren}\n                  </AutocompleteList>\n                </Portal>\n              ) : (\n                <Portal {...portalProps}>\n                  <AutocompleteList\n                    footer={runIfFunc(footer, { value, onClose })}\n                    header={runIfFunc(header, { value, onClose })}\n                    contentProps={contentProps}\n                    {...listProps}\n                  >\n                    {allowCreate && inputValue ? (\n                      <AutocompleteCreate {...createProps} />\n                    ) : (\n                      <AutocompleteEmpty {...emptyProps} />\n                    )}\n                  </AutocompleteList>\n                </Portal>\n              )}\n            </ui.div>\n          </Popover>\n        </AutocompleteProvider>\n      </AutocompleteDescendantsContextProvider>\n    )\n  },\n)\n\nAutocomplete.displayName = \"Autocomplete\"\nAutocomplete.__ui__ = \"Autocomplete\"\n\ninterface AutocompleteFieldProps\n  extends HTMLUIProps,\n    Pick<AutocompleteProps, \"inputProps\"> {}\n\nconst AutocompleteField = forwardRef<AutocompleteFieldProps, \"input\">(\n  ({ className, h, minH, placeholder, inputProps, ...rest }, ref) => {\n    const { inputValue, label, styles } = useAutocompleteContext()\n    const { getInputProps } = useAutocompleteInput()\n\n    const css: CSSUIObject = {\n      alignItems: \"center\",\n      display: \"flex\",\n      h,\n      minH,\n      pe: \"2rem\",\n      ...styles.field,\n      cursor: \"text\",\n    }\n\n    return (\n      <PopoverTrigger>\n        <ui.div\n          className={cx(\"ui-autocomplete__field\", className)}\n          __css={css}\n          {...rest}\n        >\n          <ui.input\n            className=\"ui-autocomplete__field__input\"\n            display=\"inline-block\"\n            placeholder={placeholder}\n            w=\"100%\"\n            {...getInputProps(\n              { ...inputProps, value: inputValue || label || \"\" },\n              ref,\n            )}\n          />\n        </ui.div>\n      </PopoverTrigger>\n    )\n  },\n)\n\nAutocompleteField.displayName = \"AutocompleteField\"\nAutocompleteField.__ui__ = \"AutocompleteField\"\n"],"mappings":"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","names":[]}

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

@@ -2,7 +2,7 @@
 import {
   useAutocompleteContext,
   useAutocompleteDescendantsContext
-} from "./chunk-JPUKYLBW.mjs";
+} from "./chunk-WDQYM4FP.mjs";
 
 // src/use-autocomplete-list.ts
 import { mergeRefs, useUpdateEffect } from "@yamada-ui/utils";
@@ -49,24 +49,24 @@ var useAutocompleteList = () => {
     (props = {}, ref = null) => {
       var _a;
       return {
-        as: "ul",
+        id: (_a = props.id) != null ? _a : uuid,
         ref: mergeRefs(listRef, ref),
+        as: "ul",
+        position: "relative",
         role: "listbox",
         tabIndex: -1,
-        position: "relative",
-        id: (_a = props.id) != null ? _a : uuid,
         ...props
       };
     },
     [listRef, uuid]
   );
   return {
-    onAnimationComplete,
-    getListProps
+    getListProps,
+    onAnimationComplete
   };
 };
 
 export {
   useAutocompleteList
 };
-//# sourceMappingURL=chunk-R76HPAN4.mjs.map
+//# sourceMappingURL=chunk-TR4X4EEG.mjs.map

package/dist/{chunk-R76HPAN4.mjs.map → chunk-TR4X4EEG.mjs.map}

@@ -1 +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":[]}
+{"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      id: props.id ?? uuid,\n      ref: mergeRefs(listRef, ref),\n      as: \"ul\",\n      position: \"relative\",\n      role: \"listbox\",\n      tabIndex: -1,\n      ...props,\n    }),\n    [listRef, uuid],\n  )\n\n  return {\n    getListProps,\n    onAnimationComplete,\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,KAAI,WAAM,OAAN,YAAY;AAAA,QAChB,KAAK,UAAU,SAAS,GAAG;AAAA,QAC3B,IAAI;AAAA,QACJ,UAAU;AAAA,QACV,MAAM;AAAA,QACN,UAAU;AAAA,QACV,GAAG;AAAA,MACL;AAAA;AAAA,IACA,CAAC,SAAS,IAAI;AAAA,EAChB;AAEA,SAAO;AAAA,IACL;AAAA,IACA;AAAA,EACF;AACF;","names":[]}

package/dist/{chunk-7SWSKLSA.mjs → chunk-V6YCG642.mjs}

@@ -1,10 +1,10 @@
 "use client"
 import {
   useAutocompleteContext
-} from "./chunk-JPUKYLBW.mjs";
+} from "./chunk-WDQYM4FP.mjs";
 
 // src/autocomplete-icon.tsx
-import { ui, forwardRef } from "@yamada-ui/core";
+import { forwardRef, ui } from "@yamada-ui/core";
 import { ChevronIcon, CloseIcon } from "@yamada-ui/icon";
 import { useClickable } from "@yamada-ui/use-clickable";
 import { cx, getValidChildren, isValidElement } from "@yamada-ui/utils";
@@ -14,27 +14,27 @@ var AutocompleteIcon = forwardRef(
   ({ className, children, __css, ...rest }, ref) => {
     const { styles } = useAutocompleteContext();
     const css = {
-      position: "absolute",
-      top: "50%",
-      transform: "translateY(-50%)",
-      display: "inline-flex",
       alignItems: "center",
+      cursor: "pointer",
+      display: "inline-flex",
       justifyContent: "center",
       pointerEvents: "none",
-      cursor: "pointer",
+      position: "absolute",
+      top: "50%",
+      transform: "translateY(-50%)",
       ...styles.icon,
       ...__css
     };
     const validChildren = getValidChildren(children);
     const cloneChildren = validChildren.map(
       (child) => cloneElement(child, {
-        focusable: false,
-        "aria-hidden": true,
         style: {
-          maxWidth: "1em",
+          color: "currentColor",
           maxHeight: "1em",
-          color: "currentColor"
-        }
+          maxWidth: "1em"
+        },
+        "aria-hidden": true,
+        focusable: false
       })
     );
     return /* @__PURE__ */ jsx(
@@ -67,11 +67,11 @@ var AutocompleteClearIcon = ({
   return /* @__PURE__ */ jsx(
     AutocompleteIcon,
     {
-      "aria-label": "Clear value",
       className: cx("ui-autocomplete__icon--clear", className),
+      "aria-label": "Clear value",
       __css: styles.clearIcon,
       ...rest,
-      children: children != null ? children : /* @__PURE__ */ jsx(CloseIcon, { w: "0.5em", h: "0.5em" })
+      children: children != null ? children : /* @__PURE__ */ jsx(CloseIcon, { h: "0.5em", w: "0.5em" })
     }
   );
 };
@@ -80,11 +80,11 @@ AutocompleteClearIcon.__ui__ = "AutocompleteClearIcon";
 var AutocompleteItemIcon = forwardRef(({ className, ...rest }, ref) => {
   const { styles } = useAutocompleteContext();
   const css = {
-    flexShrink: 0,
-    display: "inline-flex",
-    justifyContent: "center",
     alignItems: "center",
+    display: "inline-flex",
+    flexShrink: 0,
     fontSize: "0.85em",
+    justifyContent: "center",
     ...styles.itemIcon
   };
   return /* @__PURE__ */ jsx(
@@ -105,4 +105,4 @@ export {
   AutocompleteClearIcon,
   AutocompleteItemIcon
 };
-//# sourceMappingURL=chunk-7SWSKLSA.mjs.map
+//# sourceMappingURL=chunk-V6YCG642.mjs.map

package/dist/chunk-V6YCG642.mjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/autocomplete-icon.tsx"],"sourcesContent":["import type { CSSUIObject, FC, HTMLUIProps } from \"@yamada-ui/core\"\nimport type { HTMLAttributes } from \"react\"\nimport { forwardRef, ui } from \"@yamada-ui/core\"\nimport { ChevronIcon, CloseIcon } from \"@yamada-ui/icon\"\nimport { useClickable } from \"@yamada-ui/use-clickable\"\nimport { cx, getValidChildren, isValidElement } from \"@yamada-ui/utils\"\nimport { cloneElement, useRef } from \"react\"\nimport { useAutocompleteContext } from \"./autocomplete-context\"\n\nexport interface AutocompleteIconProps extends HTMLUIProps {}\n\nexport const AutocompleteIcon = forwardRef<AutocompleteIconProps, \"div\">(\n  ({ className, children, __css, ...rest }, ref) => {\n    const { styles } = useAutocompleteContext()\n\n    const css: CSSUIObject = {\n      alignItems: \"center\",\n      cursor: \"pointer\",\n      display: \"inline-flex\",\n      justifyContent: \"center\",\n      pointerEvents: \"none\",\n      position: \"absolute\",\n      top: \"50%\",\n      transform: \"translateY(-50%)\",\n      ...styles.icon,\n      ...__css,\n    }\n\n    const validChildren = getValidChildren(children)\n\n    const cloneChildren = validChildren.map((child) =>\n      cloneElement(child, {\n        style: {\n          color: \"currentColor\",\n          maxHeight: \"1em\",\n          maxWidth: \"1em\",\n        },\n        \"aria-hidden\": true,\n        focusable: false,\n      }),\n    )\n\n    return (\n      <ui.div\n        ref={ref}\n        className={cx(\"ui-autocomplete__icon\", className)}\n        __css={css}\n        {...rest}\n      >\n        {isValidElement(children) ? cloneChildren : <ChevronIcon />}\n      </ui.div>\n    )\n  },\n)\n\nAutocompleteIcon.displayName = \"AutocompleteIcon\"\nAutocompleteIcon.__ui__ = \"AutocompleteIcon\"\n\nexport interface AutocompleteClearIconProps extends AutocompleteIconProps {\n  disabled?: boolean\n}\n\nexport const AutocompleteClearIcon: FC<AutocompleteClearIconProps> = ({\n  className,\n  children,\n  ...props\n}) => {\n  const ref = useRef<HTMLDivElement>(null)\n  const { styles } = useAutocompleteContext()\n\n  const isDisabled = props.disabled\n\n  const rest = useClickable({\n    ref,\n    isDisabled,\n    ...(props as HTMLAttributes<HTMLElement>),\n  })\n\n  return (\n    <AutocompleteIcon\n      className={cx(\"ui-autocomplete__icon--clear\", className)}\n      aria-label=\"Clear value\"\n      __css={styles.clearIcon}\n      {...rest}\n    >\n      {children ?? <CloseIcon h=\"0.5em\" w=\"0.5em\" />}\n    </AutocompleteIcon>\n  )\n}\n\nAutocompleteClearIcon.displayName = \"AutocompleteClearIcon\"\nAutocompleteClearIcon.__ui__ = \"AutocompleteClearIcon\"\n\nexport interface AutocompleteItemIconProps extends HTMLUIProps<\"span\"> {}\n\nexport const AutocompleteItemIcon = forwardRef<\n  AutocompleteItemIconProps,\n  \"span\"\n>(({ className, ...rest }, ref) => {\n  const { styles } = useAutocompleteContext()\n\n  const css: CSSUIObject = {\n    alignItems: \"center\",\n    display: \"inline-flex\",\n    flexShrink: 0,\n    fontSize: \"0.85em\",\n    justifyContent: \"center\",\n    ...styles.itemIcon,\n  }\n\n  return (\n    <ui.span\n      ref={ref}\n      className={cx(\"ui-autocomplete__item__icon\", className)}\n      __css={css}\n      {...rest}\n    />\n  )\n})\n\nAutocompleteItemIcon.displayName = \"AutocompleteItemIcon\"\nAutocompleteItemIcon.__ui__ = \"AutocompleteItemIcon\"\n"],"mappings":";;;;;;AAEA,SAAS,YAAY,UAAU;AAC/B,SAAS,aAAa,iBAAiB;AACvC,SAAS,oBAAoB;AAC7B,SAAS,IAAI,kBAAkB,sBAAsB;AACrD,SAAS,cAAc,cAAc;AA2Ce;AAtC7C,IAAM,mBAAmB;AAAA,EAC9B,CAAC,EAAE,WAAW,UAAU,OAAO,GAAG,KAAK,GAAG,QAAQ;AAChD,UAAM,EAAE,OAAO,IAAI,uBAAuB;AAE1C,UAAM,MAAmB;AAAA,MACvB,YAAY;AAAA,MACZ,QAAQ;AAAA,MACR,SAAS;AAAA,MACT,gBAAgB;AAAA,MAChB,eAAe;AAAA,MACf,UAAU;AAAA,MACV,KAAK;AAAA,MACL,WAAW;AAAA,MACX,GAAG,OAAO;AAAA,MACV,GAAG;AAAA,IACL;AAEA,UAAM,gBAAgB,iBAAiB,QAAQ;AAE/C,UAAM,gBAAgB,cAAc;AAAA,MAAI,CAAC,UACvC,aAAa,OAAO;AAAA,QAClB,OAAO;AAAA,UACL,OAAO;AAAA,UACP,WAAW;AAAA,UACX,UAAU;AAAA,QACZ;AAAA,QACA,eAAe;AAAA,QACf,WAAW;AAAA,MACb,CAAC;AAAA,IACH;AAEA,WACE;AAAA,MAAC,GAAG;AAAA,MAAH;AAAA,QACC;AAAA,QACA,WAAW,GAAG,yBAAyB,SAAS;AAAA,QAChD,OAAO;AAAA,QACN,GAAG;AAAA,QAEH,yBAAe,QAAQ,IAAI,gBAAgB,oBAAC,eAAY;AAAA;AAAA,IAC3D;AAAA,EAEJ;AACF;AAEA,iBAAiB,cAAc;AAC/B,iBAAiB,SAAS;AAMnB,IAAM,wBAAwD,CAAC;AAAA,EACpE;AAAA,EACA;AAAA,EACA,GAAG;AACL,MAAM;AACJ,QAAM,MAAM,OAAuB,IAAI;AACvC,QAAM,EAAE,OAAO,IAAI,uBAAuB;AAE1C,QAAM,aAAa,MAAM;AAEzB,QAAM,OAAO,aAAa;AAAA,IACxB;AAAA,IACA;AAAA,IACA,GAAI;AAAA,EACN,CAAC;AAED,SACE;AAAA,IAAC;AAAA;AAAA,MACC,WAAW,GAAG,gCAAgC,SAAS;AAAA,MACvD,cAAW;AAAA,MACX,OAAO,OAAO;AAAA,MACb,GAAG;AAAA,MAEH,wCAAY,oBAAC,aAAU,GAAE,SAAQ,GAAE,SAAQ;AAAA;AAAA,EAC9C;AAEJ;AAEA,sBAAsB,cAAc;AACpC,sBAAsB,SAAS;AAIxB,IAAM,uBAAuB,WAGlC,CAAC,EAAE,WAAW,GAAG,KAAK,GAAG,QAAQ;AACjC,QAAM,EAAE,OAAO,IAAI,uBAAuB;AAE1C,QAAM,MAAmB;AAAA,IACvB,YAAY;AAAA,IACZ,SAAS;AAAA,IACT,YAAY;AAAA,IACZ,UAAU;AAAA,IACV,gBAAgB;AAAA,IAChB,GAAG,OAAO;AAAA,EACZ;AAEA,SACE;AAAA,IAAC,GAAG;AAAA,IAAH;AAAA,MACC;AAAA,MACA,WAAW,GAAG,+BAA+B,SAAS;AAAA,MACtD,OAAO;AAAA,MACN,GAAG;AAAA;AAAA,EACN;AAEJ,CAAC;AAED,qBAAqB,cAAc;AACnC,qBAAqB,SAAS;","names":[]}

package/dist/{chunk-S53LMDD7.mjs → chunk-VTBUO5SK.mjs}

@@ -1,34 +1,34 @@
 "use client"
 import {
   useAutocompleteList
-} from "./chunk-R76HPAN4.mjs";
+} from "./chunk-TR4X4EEG.mjs";
 import {
   useAutocompleteContext
-} from "./chunk-JPUKYLBW.mjs";
+} from "./chunk-WDQYM4FP.mjs";
 
 // src/autocomplete-list.tsx
-import { ui, forwardRef } from "@yamada-ui/core";
+import { forwardRef, ui } from "@yamada-ui/core";
 import { PopoverContent } from "@yamada-ui/popover";
 import { cx, handlerAll } from "@yamada-ui/utils";
 import { jsx, jsxs } from "react/jsx-runtime";
 var AutocompleteList = forwardRef(
   ({
     className,
-    w,
-    width,
-    minW,
-    minWidth,
+    children,
+    footer,
+    header,
     maxW,
     maxWidth,
+    minW,
+    minWidth,
+    w,
+    width,
     contentProps,
-    header,
-    footer,
-    children,
     ...rest
   }, ref) => {
     var _a, _b, _c, _d, _e, _f, _g, _h, _i;
     const { styles } = useAutocompleteContext();
-    const { onAnimationComplete, getListProps } = useAutocompleteList();
+    const { getListProps, onAnimationComplete } = useAutocompleteList();
     width != null ? width : width = w;
     width != null ? width : width = (_c = (_a = styles.list) == null ? void 0 : _a.width) != null ? _c : (_b = styles.list) == null ? void 0 : _b.w;
     minWidth != null ? minWidth : minWidth = minW;
@@ -40,10 +40,10 @@ var AutocompleteList = forwardRef(
       {
         as: "div",
         className: "ui-autocomplete__popover",
-        width,
-        minWidth,
         maxWidth,
-        __css: { ...styles.content, width, minWidth, maxWidth },
+        minWidth,
+        width,
+        __css: { ...styles.content, maxWidth, minWidth, width },
         ...contentProps,
         onAnimationComplete: handlerAll(
           contentProps == null ? void 0 : contentProps.onAnimationComplete,
@@ -86,4 +86,4 @@ AutocompleteList.__ui__ = "AutocompleteList";
 export {
   AutocompleteList
 };
-//# sourceMappingURL=chunk-S53LMDD7.mjs.map
+//# sourceMappingURL=chunk-VTBUO5SK.mjs.map

package/dist/chunk-VTBUO5SK.mjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/autocomplete-list.tsx"],"sourcesContent":["import type { CSSUIProps, HTMLUIProps } from \"@yamada-ui/core\"\nimport type { MotionPropsWithoutChildren } from \"@yamada-ui/motion\"\nimport type { ReactNode } from \"react\"\nimport { forwardRef, ui } from \"@yamada-ui/core\"\nimport { PopoverContent } from \"@yamada-ui/popover\"\nimport { cx, handlerAll } from \"@yamada-ui/utils\"\nimport { useAutocompleteContext } from \"./autocomplete-context\"\nimport { useAutocompleteList } from \"./use-autocomplete-list\"\n\nexport interface AutocompleteListProps extends HTMLUIProps<\"ul\"> {\n  footer?: ReactNode\n  header?: ReactNode\n  contentProps?: MotionPropsWithoutChildren\n}\n\nexport const AutocompleteList = forwardRef<AutocompleteListProps, \"ul\">(\n  (\n    {\n      className,\n      children,\n      footer,\n      header,\n      maxW,\n      maxWidth,\n      minW,\n      minWidth,\n      w,\n      width,\n      contentProps,\n      ...rest\n    },\n    ref,\n  ) => {\n    const { styles } = useAutocompleteContext()\n    const { getListProps, onAnimationComplete } = useAutocompleteList()\n\n    width ??= w\n    width ??= (styles.list?.width ?? styles.list?.w) as CSSUIProps[\"width\"]\n    minWidth ??= minW\n    minWidth ??= (styles.list?.minWidth ??\n      styles.list?.minW) as CSSUIProps[\"minWidth\"]\n    maxWidth ??= maxW\n    maxWidth ??= (styles.list?.maxWidth ??\n      styles.list?.maxW) as CSSUIProps[\"maxWidth\"]\n\n    return (\n      <PopoverContent\n        as=\"div\"\n        className=\"ui-autocomplete__popover\"\n        maxWidth={maxWidth}\n        minWidth={minWidth}\n        width={width}\n        __css={{ ...styles.content, maxWidth, minWidth, width }}\n        {...contentProps}\n        onAnimationComplete={handlerAll(\n          contentProps?.onAnimationComplete,\n          onAnimationComplete,\n        )}\n      >\n        {header ? (\n          <ui.div\n            className=\"ui-autocomplete__header\"\n            __css={{ ...styles.header }}\n          >\n            {header}\n          </ui.div>\n        ) : null}\n\n        <ui.ul\n          className={cx(\"ui-autocomplete__list\", className)}\n          __css={{ ...styles.list }}\n          {...getListProps(rest, ref)}\n        >\n          {children}\n        </ui.ul>\n\n        {footer ? (\n          <ui.div\n            className=\"ui-autocomplete__footer\"\n            __css={{ ...styles.footer }}\n          >\n            {footer}\n          </ui.div>\n        ) : null}\n      </PopoverContent>\n    )\n  },\n)\n\nAutocompleteList.displayName = \"AutocompleteList\"\nAutocompleteList.__ui__ = \"AutocompleteList\"\n"],"mappings":";;;;;;;;;AAGA,SAAS,YAAY,UAAU;AAC/B,SAAS,sBAAsB;AAC/B,SAAS,IAAI,kBAAkB;AAyCzB,SAcI,KAdJ;AA/BC,IAAM,mBAAmB;AAAA,EAC9B,CACE;AAAA,IACE;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,GAAG;AAAA,EACL,GACA,QACG;AAhCP;AAiCI,UAAM,EAAE,OAAO,IAAI,uBAAuB;AAC1C,UAAM,EAAE,cAAc,oBAAoB,IAAI,oBAAoB;AAElE,oCAAU;AACV,qCAAW,kBAAO,SAAP,mBAAa,UAAb,aAAsB,YAAO,SAAP,mBAAa;AAC9C,6CAAa;AACb,8CAAc,kBAAO,SAAP,mBAAa,aAAb,aACZ,YAAO,SAAP,mBAAa;AACf,6CAAa;AACb,8CAAc,kBAAO,SAAP,mBAAa,aAAb,aACZ,YAAO,SAAP,mBAAa;AAEf,WACE;AAAA,MAAC;AAAA;AAAA,QACC,IAAG;AAAA,QACH,WAAU;AAAA,QACV;AAAA,QACA;AAAA,QACA;AAAA,QACA,OAAO,EAAE,GAAG,OAAO,SAAS,UAAU,UAAU,MAAM;AAAA,QACrD,GAAG;AAAA,QACJ,qBAAqB;AAAA,UACnB,6CAAc;AAAA,UACd;AAAA,QACF;AAAA,QAEC;AAAA,mBACC;AAAA,YAAC,GAAG;AAAA,YAAH;AAAA,cACC,WAAU;AAAA,cACV,OAAO,EAAE,GAAG,OAAO,OAAO;AAAA,cAEzB;AAAA;AAAA,UACH,IACE;AAAA,UAEJ;AAAA,YAAC,GAAG;AAAA,YAAH;AAAA,cACC,WAAW,GAAG,yBAAyB,SAAS;AAAA,cAChD,OAAO,EAAE,GAAG,OAAO,KAAK;AAAA,cACvB,GAAG,aAAa,MAAM,GAAG;AAAA,cAEzB;AAAA;AAAA,UACH;AAAA,UAEC,SACC;AAAA,YAAC,GAAG;AAAA,YAAH;AAAA,cACC,WAAU;AAAA,cACV,OAAO,EAAE,GAAG,OAAO,OAAO;AAAA,cAEzB;AAAA;AAAA,UACH,IACE;AAAA;AAAA;AAAA,IACN;AAAA,EAEJ;AACF;AAEA,iBAAiB,cAAc;AAC/B,iBAAiB,SAAS;","names":[]}

package/dist/{chunk-JPUKYLBW.mjs → chunk-WDQYM4FP.mjs}

@@ -5,9 +5,9 @@ import { createDescendant } from "@yamada-ui/use-descendant";
 import { createContext } from "@yamada-ui/utils";
 var {
   DescendantsContextProvider: AutocompleteDescendantsContextProvider,
-  useDescendantsContext: useAutocompleteDescendantsContext,
+  useDescendant: useAutocompleteDescendant,
   useDescendants: useAutocompleteDescendants,
-  useDescendant: useAutocompleteDescendant
+  useDescendantsContext: useAutocompleteDescendantsContext
 } = createDescendant();
 var [AutocompleteProvider, useAutocompleteContext] = createContext({
   name: "AutocompleteContext",
@@ -16,10 +16,10 @@ var [AutocompleteProvider, useAutocompleteContext] = createContext({
 
 export {
   AutocompleteDescendantsContextProvider,
-  useAutocompleteDescendantsContext,
-  useAutocompleteDescendants,
   useAutocompleteDescendant,
+  useAutocompleteDescendants,
+  useAutocompleteDescendantsContext,
   AutocompleteProvider,
   useAutocompleteContext
 };
-//# sourceMappingURL=chunk-JPUKYLBW.mjs.map
+//# sourceMappingURL=chunk-WDQYM4FP.mjs.map

package/dist/chunk-WDQYM4FP.mjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/autocomplete-context.ts"],"sourcesContent":["import type { CSSUIObject } from \"@yamada-ui/core\"\nimport type { Dispatch, DOMAttributes, RefObject, SetStateAction } from \"react\"\nimport type { ChangeOptions, 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, options?: ChangeOptions) => void\n  onChangeLabel: (newValue: string, options?: ChangeOptions) => 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":";;;AAGA,SAAS,wBAAwB;AACjC,SAAS,qBAAqB;AAEvB,IAAM;AAAA,EACX,4BAA4B;AAAA,EAC5B,eAAe;AAAA,EACf,gBAAgB;AAAA,EAChB,uBAAuB;AACzB,IAAI,iBAAiB;AAkCd,IAAM,CAAC,sBAAsB,sBAAsB,IACxD,cAAmC;AAAA,EACjC,MAAM;AAAA,EACN,cAAc;AAChB,CAAC;","names":[]}