@yamada-ui/autocomplete 1.6.5-next-20241123050941 → 1.6.6-dev-20241123052407

package/dist/autocomplete-context.d.mts

@@ -129,7 +129,6 @@ interface AutocompleteContext extends Omit<UseAutocompleteProps, "defaultValue"
     isHit: boolean;
     isOpen: boolean;
     label: string | string[] | undefined;
-    listRef: RefObject<HTMLUListElement>;
     pickOptions: (value: string) => void;
     rebirthOptions: (runFocus?: boolean) => void;
     setFocusedIndex: Dispatch<SetStateAction<number>>;

package/dist/autocomplete-context.d.ts

@@ -129,7 +129,6 @@ interface AutocompleteContext extends Omit<UseAutocompleteProps, "defaultValue"
     isHit: boolean;
     isOpen: boolean;
     label: string | string[] | undefined;
-    listRef: RefObject<HTMLUListElement>;
     pickOptions: (value: string) => void;
     rebirthOptions: (runFocus?: boolean) => void;
     setFocusedIndex: Dispatch<SetStateAction<number>>;

package/dist/autocomplete-context.js.map

@@ -1 +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 { 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;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA,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;","names":[]}
+{"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 { 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;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA,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;","names":[]}

package/dist/autocomplete-context.mjs

@@ -6,7 +6,7 @@ import {
   useAutocompleteDescendant,
   useAutocompleteDescendants,
   useAutocompleteDescendantsContext
-} from "./chunk-ZNO5RUVT.mjs";
+} from "./chunk-TP5VZFO3.mjs";
 export {
   AutocompleteDescendantsContextProvider,
   AutocompleteProvider,

package/dist/autocomplete-create.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/autocomplete-create.tsx","../src/autocomplete-context.ts","../src/autocomplete-icon.tsx","../src/use-autocomplete-option.ts"],"sourcesContent":["import type { CSSUIObject, FC, HTMLUIProps } from \"@yamada-ui/core\"\nimport type { ReactElement } from \"react\"\nimport { forwardRef, ui } from \"@yamada-ui/core\"\nimport { cx, runIfFunc } from \"@yamada-ui/utils\"\nimport { useAutocompleteContext } from \"./autocomplete-context\"\nimport { AutocompleteItemIcon } from \"./autocomplete-icon\"\nimport { useAutocompleteCreate } from \"./use-autocomplete-option\"\n\ninterface AutocompleteCreateOptions {\n  /**\n   * The label of the autocomplete create option.\n   */\n  children?: ((inputValue: string) => string) | string\n  /**\n   * The autocomplete create option icon to use.\n   */\n  icon?: null | ReactElement\n}\n\nexport interface AutocompleteCreateProps\n  extends Omit<HTMLUIProps, \"children\">,\n    AutocompleteCreateOptions {}\n\nexport const AutocompleteCreate = forwardRef<AutocompleteCreateProps, \"div\">(\n  ({ className, children, icon, ...rest }, ref) => {\n    const { inputValue, styles } = useAutocompleteContext()\n    const { getCreateProps } = useAutocompleteCreate()\n\n    children ??= inputValue\n\n    const css: CSSUIObject = {\n      alignItems: \"center\",\n      color: \"inherit\",\n      display: \"flex\",\n      flex: \"0 0 auto\",\n      gap: \"0.75rem\",\n      outline: 0,\n      textAlign: \"start\",\n      textDecoration: \"none\",\n      userSelect: \"none\",\n      width: \"100%\",\n      ...styles.item,\n    }\n\n    return (\n      <ui.div\n        className={cx(\"ui-autocomplete__item--create\", className)}\n        __css={css}\n        {...getCreateProps(rest, ref)}\n      >\n        {icon !== null ? (\n          <AutocompleteItemIcon>\n            {icon || <AutocompletePlusIcon />}\n          </AutocompleteItemIcon>\n        ) : null}\n        {icon ? (\n          <ui.span style={{ flex: 1, pointerEvents: \"none\" }} lineClamp={1}>\n            {runIfFunc(children, inputValue)}\n          </ui.span>\n        ) : (\n          runIfFunc(children, inputValue)\n        )}\n      </ui.div>\n    )\n  },\n)\n\nAutocompleteCreate.displayName = \"AutocompleteCreate\"\nAutocompleteCreate.__ui__ = \"AutocompleteCreate\"\n\nconst AutocompletePlusIcon: FC = () => (\n  <svg height=\"1em\" viewBox=\"0 0 45.402 45.402\" width=\"1em\">\n    <path\n      d=\"M41.267,18.557H26.832V4.134C26.832,1.851,24.99,0,22.707,0c-2.283,0-4.124,1.851-4.124,4.135v14.432H4.141   c-2.283,0-4.139,1.851-4.138,4.135c-0.001,1.141,0.46,2.187,1.207,2.934c0.748,0.749,1.78,1.222,2.92,1.222h14.453V41.27   c0,1.142,0.453,2.176,1.201,2.922c0.748,0.748,1.777,1.211,2.919,1.211c2.282,0,4.129-1.851,4.129-4.133V26.857h14.435   c2.283,0,4.134-1.867,4.133-4.15C45.399,20.425,43.548,18.557,41.267,18.557z\"\n      fill=\"currentColor\"\n    />\n  </svg>\n)\n\nAutocompletePlusIcon.displayName = \"AutocompletePlusIcon\"\nAutocompletePlusIcon.__ui__ = \"AutocompletePlusIcon\"\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","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","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  isDisabled?: boolean\n  /**\n   * If `true`, the autocomplete option will be focusable.\n   *\n   * @default false\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    icon: customIcon,\n    isDisabled,\n    isFocusable,\n    value: optionValue,\n    ...computedProps\n  } = { ...optionProps, ...props }\n  const trulyDisabled = !!isDisabled && !isFocusable\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 (isDisabled || !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      isDisabled,\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(isDisabled),\n        \"aria-hidden\": ariaAttr(isHidden),\n        \"aria-selected\": isSelected,\n        \"data-disabled\": dataAttr(isDisabled),\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      isDisabled,\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"],"mappings":"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","names":["import_core","import_utils","import_utils","import_utils","import_react","import_jsx_runtime"]}
+{"version":3,"sources":["../src/autocomplete-create.tsx","../src/autocomplete-context.ts","../src/autocomplete-icon.tsx","../src/use-autocomplete-option.ts"],"sourcesContent":["import type { CSSUIObject, FC, HTMLUIProps } from \"@yamada-ui/core\"\nimport type { ReactElement } from \"react\"\nimport { forwardRef, ui } from \"@yamada-ui/core\"\nimport { cx, runIfFunc } from \"@yamada-ui/utils\"\nimport { useAutocompleteContext } from \"./autocomplete-context\"\nimport { AutocompleteItemIcon } from \"./autocomplete-icon\"\nimport { useAutocompleteCreate } from \"./use-autocomplete-option\"\n\ninterface AutocompleteCreateOptions {\n  /**\n   * The label of the autocomplete create option.\n   */\n  children?: ((inputValue: string) => string) | string\n  /**\n   * The autocomplete create option icon to use.\n   */\n  icon?: null | ReactElement\n}\n\nexport interface AutocompleteCreateProps\n  extends Omit<HTMLUIProps, \"children\">,\n    AutocompleteCreateOptions {}\n\nexport const AutocompleteCreate = forwardRef<AutocompleteCreateProps, \"div\">(\n  ({ className, children, icon, ...rest }, ref) => {\n    const { inputValue, styles } = useAutocompleteContext()\n    const { getCreateProps } = useAutocompleteCreate()\n\n    children ??= inputValue\n\n    const css: CSSUIObject = {\n      alignItems: \"center\",\n      color: \"inherit\",\n      display: \"flex\",\n      flex: \"0 0 auto\",\n      gap: \"0.75rem\",\n      outline: 0,\n      textAlign: \"start\",\n      textDecoration: \"none\",\n      userSelect: \"none\",\n      width: \"100%\",\n      ...styles.item,\n    }\n\n    return (\n      <ui.div\n        className={cx(\"ui-autocomplete__item--create\", className)}\n        __css={css}\n        {...getCreateProps(rest, ref)}\n      >\n        {icon !== null ? (\n          <AutocompleteItemIcon>\n            {icon || <AutocompletePlusIcon />}\n          </AutocompleteItemIcon>\n        ) : null}\n        {icon ? (\n          <ui.span style={{ flex: 1, pointerEvents: \"none\" }} lineClamp={1}>\n            {runIfFunc(children, inputValue)}\n          </ui.span>\n        ) : (\n          runIfFunc(children, inputValue)\n        )}\n      </ui.div>\n    )\n  },\n)\n\nAutocompleteCreate.displayName = \"AutocompleteCreate\"\nAutocompleteCreate.__ui__ = \"AutocompleteCreate\"\n\nconst AutocompletePlusIcon: FC = () => (\n  <svg height=\"1em\" viewBox=\"0 0 45.402 45.402\" width=\"1em\">\n    <path\n      d=\"M41.267,18.557H26.832V4.134C26.832,1.851,24.99,0,22.707,0c-2.283,0-4.124,1.851-4.124,4.135v14.432H4.141   c-2.283,0-4.139,1.851-4.138,4.135c-0.001,1.141,0.46,2.187,1.207,2.934c0.748,0.749,1.78,1.222,2.92,1.222h14.453V41.27   c0,1.142,0.453,2.176,1.201,2.922c0.748,0.748,1.777,1.211,2.919,1.211c2.282,0,4.129-1.851,4.129-4.133V26.857h14.435   c2.283,0,4.134-1.867,4.133-4.15C45.399,20.425,43.548,18.557,41.267,18.557z\"\n      fill=\"currentColor\"\n    />\n  </svg>\n)\n\nAutocompletePlusIcon.displayName = \"AutocompletePlusIcon\"\nAutocompletePlusIcon.__ui__ = \"AutocompletePlusIcon\"\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","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","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"],"mappings":"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","names":["import_core","import_utils","import_utils","import_utils","import_react","import_jsx_runtime"]}

package/dist/autocomplete-create.mjs

@@ -1,10 +1,10 @@
 "use client"
 import {
   AutocompleteCreate
-} from "./chunk-G6SC44LI.mjs";
-import "./chunk-3A2HEULI.mjs";
-import "./chunk-6OTUOEYS.mjs";
-import "./chunk-ZNO5RUVT.mjs";
+} from "./chunk-RK5E5J5E.mjs";
+import "./chunk-2LP57WVB.mjs";
+import "./chunk-7QCZ5NGS.mjs";
+import "./chunk-TP5VZFO3.mjs";
 export {
   AutocompleteCreate
 };

package/dist/autocomplete-empty.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/autocomplete-empty.tsx","../src/autocomplete-context.ts","../src/autocomplete-icon.tsx","../src/use-autocomplete-option.ts"],"sourcesContent":["import type { CSSUIObject, FC, HTMLUIProps } from \"@yamada-ui/core\"\nimport type { ReactElement } from \"react\"\nimport { forwardRef, ui } from \"@yamada-ui/core\"\nimport { cx } from \"@yamada-ui/utils\"\nimport { useAutocompleteContext } from \"./autocomplete-context\"\nimport { AutocompleteItemIcon } from \"./autocomplete-icon\"\nimport { useAutocompleteEmpty } from \"./use-autocomplete-option\"\n\ninterface AutocompleteEmptyOptions {\n  /**\n   * The label of the autocomplete empty option.\n   */\n  children?: string\n  /**\n   * The autocomplete empty option icon to use.\n   */\n  icon?: null | ReactElement\n}\n\nexport interface AutocompleteEmptyProps\n  extends Omit<HTMLUIProps, \"children\">,\n    AutocompleteEmptyOptions {}\n\nexport const AutocompleteEmpty = forwardRef<AutocompleteEmptyProps, \"div\">(\n  ({ className, children, icon, ...rest }, ref) => {\n    const { emptyMessage, styles } = useAutocompleteContext()\n    const { getEmptyProps } = useAutocompleteEmpty()\n\n    children ??= emptyMessage\n\n    const css: CSSUIObject = {\n      alignItems: \"center\",\n      color: \"inherit\",\n      display: \"flex\",\n      flex: \"0 0 auto\",\n      gap: \"0.75rem\",\n      outline: 0,\n      pointerEvents: \"none\",\n      textAlign: \"start\",\n      textDecoration: \"none\",\n      userSelect: \"none\",\n      width: \"100%\",\n      ...styles.item,\n    }\n\n    return (\n      <ui.div\n        className={cx(\"ui-autocomplete__item--empty\", className)}\n        __css={css}\n        {...getEmptyProps(rest, ref)}\n      >\n        {icon !== null ? (\n          <AutocompleteItemIcon>\n            {icon || <AutocompleteMinusIcon />}\n          </AutocompleteItemIcon>\n        ) : null}\n\n        {icon ? (\n          <ui.span style={{ flex: 1, pointerEvents: \"none\" }} lineClamp={1}>\n            {children}\n          </ui.span>\n        ) : (\n          children\n        )}\n      </ui.div>\n    )\n  },\n)\n\nAutocompleteEmpty.displayName = \"AutocompleteEmpty\"\nAutocompleteEmpty.__ui__ = \"AutocompleteEmpty\"\n\nconst AutocompleteMinusIcon: FC = () => (\n  <svg height=\"1em\" viewBox=\"0 0 448 512\" width=\"1em\">\n    <path\n      d=\"M432 256c0 17.7-14.3 32-32 32L48 288c-17.7 0-32-14.3-32-32s14.3-32 32-32l352 0c17.7 0 32 14.3 32 32z\"\n      fill=\"currentColor\"\n    />\n  </svg>\n)\n\nAutocompleteMinusIcon.displayName = \"AutocompleteMinusIcon\"\nAutocompleteMinusIcon.__ui__ = \"AutocompleteMinusIcon\"\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","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","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  isDisabled?: boolean\n  /**\n   * If `true`, the autocomplete option will be focusable.\n   *\n   * @default false\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    icon: customIcon,\n    isDisabled,\n    isFocusable,\n    value: optionValue,\n    ...computedProps\n  } = { ...optionProps, ...props }\n  const trulyDisabled = !!isDisabled && !isFocusable\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 (isDisabled || !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      isDisabled,\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(isDisabled),\n        \"aria-hidden\": ariaAttr(isHidden),\n        \"aria-selected\": isSelected,\n        \"data-disabled\": dataAttr(isDisabled),\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      isDisabled,\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"],"mappings":"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","names":["import_core","import_utils","import_utils","import_utils","import_react","import_jsx_runtime"]}
+{"version":3,"sources":["../src/autocomplete-empty.tsx","../src/autocomplete-context.ts","../src/autocomplete-icon.tsx","../src/use-autocomplete-option.ts"],"sourcesContent":["import type { CSSUIObject, FC, HTMLUIProps } from \"@yamada-ui/core\"\nimport type { ReactElement } from \"react\"\nimport { forwardRef, ui } from \"@yamada-ui/core\"\nimport { cx } from \"@yamada-ui/utils\"\nimport { useAutocompleteContext } from \"./autocomplete-context\"\nimport { AutocompleteItemIcon } from \"./autocomplete-icon\"\nimport { useAutocompleteEmpty } from \"./use-autocomplete-option\"\n\ninterface AutocompleteEmptyOptions {\n  /**\n   * The label of the autocomplete empty option.\n   */\n  children?: string\n  /**\n   * The autocomplete empty option icon to use.\n   */\n  icon?: null | ReactElement\n}\n\nexport interface AutocompleteEmptyProps\n  extends Omit<HTMLUIProps, \"children\">,\n    AutocompleteEmptyOptions {}\n\nexport const AutocompleteEmpty = forwardRef<AutocompleteEmptyProps, \"div\">(\n  ({ className, children, icon, ...rest }, ref) => {\n    const { emptyMessage, styles } = useAutocompleteContext()\n    const { getEmptyProps } = useAutocompleteEmpty()\n\n    children ??= emptyMessage\n\n    const css: CSSUIObject = {\n      alignItems: \"center\",\n      color: \"inherit\",\n      display: \"flex\",\n      flex: \"0 0 auto\",\n      gap: \"0.75rem\",\n      outline: 0,\n      pointerEvents: \"none\",\n      textAlign: \"start\",\n      textDecoration: \"none\",\n      userSelect: \"none\",\n      width: \"100%\",\n      ...styles.item,\n    }\n\n    return (\n      <ui.div\n        className={cx(\"ui-autocomplete__item--empty\", className)}\n        __css={css}\n        {...getEmptyProps(rest, ref)}\n      >\n        {icon !== null ? (\n          <AutocompleteItemIcon>\n            {icon || <AutocompleteMinusIcon />}\n          </AutocompleteItemIcon>\n        ) : null}\n\n        {icon ? (\n          <ui.span style={{ flex: 1, pointerEvents: \"none\" }} lineClamp={1}>\n            {children}\n          </ui.span>\n        ) : (\n          children\n        )}\n      </ui.div>\n    )\n  },\n)\n\nAutocompleteEmpty.displayName = \"AutocompleteEmpty\"\nAutocompleteEmpty.__ui__ = \"AutocompleteEmpty\"\n\nconst AutocompleteMinusIcon: FC = () => (\n  <svg height=\"1em\" viewBox=\"0 0 448 512\" width=\"1em\">\n    <path\n      d=\"M432 256c0 17.7-14.3 32-32 32L48 288c-17.7 0-32-14.3-32-32s14.3-32 32-32l352 0c17.7 0 32 14.3 32 32z\"\n      fill=\"currentColor\"\n    />\n  </svg>\n)\n\nAutocompleteMinusIcon.displayName = \"AutocompleteMinusIcon\"\nAutocompleteMinusIcon.__ui__ = \"AutocompleteMinusIcon\"\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","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","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"],"mappings":"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","names":["import_core","import_utils","import_utils","import_utils","import_react","import_jsx_runtime"]}

package/dist/autocomplete-empty.mjs

@@ -1,10 +1,10 @@
 "use client"
 import {
   AutocompleteEmpty
-} from "./chunk-6II6KCIJ.mjs";
-import "./chunk-3A2HEULI.mjs";
-import "./chunk-6OTUOEYS.mjs";
-import "./chunk-ZNO5RUVT.mjs";
+} from "./chunk-YPKDYYEV.mjs";
+import "./chunk-2LP57WVB.mjs";
+import "./chunk-7QCZ5NGS.mjs";
+import "./chunk-TP5VZFO3.mjs";
 export {
   AutocompleteEmpty
 };

package/dist/autocomplete-icon.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/autocomplete-icon.tsx","../src/autocomplete-context.ts"],"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","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;AAAA;AAAA;AAEA,kBAA+B;AAC/B,kBAAuC;AACvC,2BAA6B;AAC7B,IAAAA,gBAAqD;AACrD,mBAAqC;;;ACHrC,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;;;ADCiD;AAtC7C,IAAM,uBAAmB;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,oBAAgB,gCAAiB,QAAQ;AAE/C,UAAM,gBAAgB,cAAc;AAAA,MAAI,CAAC,cACvC,2BAAa,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,eAAG;AAAA,MAAH;AAAA,QACC;AAAA,QACA,eAAW,kBAAG,yBAAyB,SAAS;AAAA,QAChD,OAAO;AAAA,QACN,GAAG;AAAA,QAEH,4CAAe,QAAQ,IAAI,gBAAgB,4CAAC,2BAAY;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,UAAM,qBAAuB,IAAI;AACvC,QAAM,EAAE,OAAO,IAAI,uBAAuB;AAE1C,QAAM,aAAa,MAAM;AAEzB,QAAM,WAAO,mCAAa;AAAA,IACxB;AAAA,IACA;AAAA,IACA,GAAI;AAAA,EACN,CAAC;AAED,SACE;AAAA,IAAC;AAAA;AAAA,MACC,eAAW,kBAAG,gCAAgC,SAAS;AAAA,MACvD,cAAW;AAAA,MACX,OAAO,OAAO;AAAA,MACb,GAAG;AAAA,MAEH,wCAAY,4CAAC,yBAAU,GAAE,SAAQ,GAAE,SAAQ;AAAA;AAAA,EAC9C;AAEJ;AAEA,sBAAsB,cAAc;AACpC,sBAAsB,SAAS;AAIxB,IAAM,2BAAuB,wBAGlC,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,eAAG;AAAA,IAAH;AAAA,MACC;AAAA,MACA,eAAW,kBAAG,+BAA+B,SAAS;AAAA,MACtD,OAAO;AAAA,MACN,GAAG;AAAA;AAAA,EACN;AAEJ,CAAC;AAED,qBAAqB,cAAc;AACnC,qBAAqB,SAAS;","names":["import_utils"]}
+{"version":3,"sources":["../src/autocomplete-icon.tsx","../src/autocomplete-context.ts"],"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","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;AAAA;AAAA;AAEA,kBAA+B;AAC/B,kBAAuC;AACvC,2BAA6B;AAC7B,IAAAA,gBAAqD;AACrD,mBAAqC;;;ACHrC,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;;;ADEiD;AAtC7C,IAAM,uBAAmB;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,oBAAgB,gCAAiB,QAAQ;AAE/C,UAAM,gBAAgB,cAAc;AAAA,MAAI,CAAC,cACvC,2BAAa,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,eAAG;AAAA,MAAH;AAAA,QACC;AAAA,QACA,eAAW,kBAAG,yBAAyB,SAAS;AAAA,QAChD,OAAO;AAAA,QACN,GAAG;AAAA,QAEH,4CAAe,QAAQ,IAAI,gBAAgB,4CAAC,2BAAY;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,UAAM,qBAAuB,IAAI;AACvC,QAAM,EAAE,OAAO,IAAI,uBAAuB;AAE1C,QAAM,aAAa,MAAM;AAEzB,QAAM,WAAO,mCAAa;AAAA,IACxB;AAAA,IACA;AAAA,IACA,GAAI;AAAA,EACN,CAAC;AAED,SACE;AAAA,IAAC;AAAA;AAAA,MACC,eAAW,kBAAG,gCAAgC,SAAS;AAAA,MACvD,cAAW;AAAA,MACX,OAAO,OAAO;AAAA,MACb,GAAG;AAAA,MAEH,wCAAY,4CAAC,yBAAU,GAAE,SAAQ,GAAE,SAAQ;AAAA;AAAA,EAC9C;AAEJ;AAEA,sBAAsB,cAAc;AACpC,sBAAsB,SAAS;AAIxB,IAAM,2BAAuB,wBAGlC,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,eAAG;AAAA,IAAH;AAAA,MACC;AAAA,MACA,eAAW,kBAAG,+BAA+B,SAAS;AAAA,MACtD,OAAO;AAAA,MACN,GAAG;AAAA;AAAA,EACN;AAEJ,CAAC;AAED,qBAAqB,cAAc;AACnC,qBAAqB,SAAS;","names":["import_utils"]}

package/dist/autocomplete-icon.mjs

@@ -3,8 +3,8 @@ import {
   AutocompleteClearIcon,
   AutocompleteIcon,
   AutocompleteItemIcon
-} from "./chunk-6OTUOEYS.mjs";
-import "./chunk-ZNO5RUVT.mjs";
+} from "./chunk-7QCZ5NGS.mjs";
+import "./chunk-TP5VZFO3.mjs";
 export {
   AutocompleteClearIcon,
   AutocompleteIcon,

package/dist/autocomplete-list.js

@@ -46,9 +46,9 @@ var [AutocompleteProvider, useAutocompleteContext] = (0, import_utils.createCont
 var import_utils2 = require("@yamada-ui/utils");
 var import_react = require("react");
 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);
@@ -84,21 +84,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
   };
 };
 
@@ -121,7 +131,7 @@ var AutocompleteList = (0, import_core.forwardRef)(
   }, ref) => {
     var _a, _b, _c, _d, _e, _f, _g, _h, _i;
     const { styles } = useAutocompleteContext();
-    const { getListProps, onAnimationComplete } = useAutocompleteList();
+    const { getContainerProps, getListProps } = 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;
@@ -131,16 +141,13 @@ var AutocompleteList = (0, import_core.forwardRef)(
     return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
       import_popover.PopoverContent,
       {
+        as: "div",
         className: "ui-autocomplete__popover",
         maxWidth,
         minWidth,
         width,
         __css: { ...styles.content, maxWidth, minWidth, width },
-        ...contentProps,
-        onAnimationComplete: (0, import_utils3.handlerAll)(
-          contentProps == null ? void 0 : contentProps.onAnimationComplete,
-          onAnimationComplete
-        ),
+        ...getContainerProps(contentProps),
         children: [
           header ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
             import_core.ui.header,

package/dist/autocomplete-list.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/autocomplete-list.tsx","../src/autocomplete-context.ts","../src/use-autocomplete-list.ts"],"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 {\n  footer?: ReactNode\n  header?: ReactNode\n  contentProps?: MotionPropsWithoutChildren\n}\n\nexport const AutocompleteList = forwardRef<AutocompleteListProps, \"div\">(\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        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.header\n            className=\"ui-autocomplete__header\"\n            __css={{ ...styles.header }}\n          >\n            {header}\n          </ui.header>\n        ) : null}\n\n        <ui.div\n          className={cx(\"ui-autocomplete__list\", className)}\n          __css={{ ...styles.list }}\n          {...getListProps(rest, ref)}\n        >\n          {children}\n        </ui.div>\n\n        {footer ? (\n          <ui.footer\n            className=\"ui-autocomplete__footer\"\n            __css={{ ...styles.footer }}\n          >\n            {footer}\n          </ui.footer>\n        ) : null}\n      </PopoverContent>\n    )\n  },\n)\n\nAutocompleteList.displayName = \"AutocompleteList\"\nAutocompleteList.__ui__ = \"AutocompleteList\"\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","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"],"mappings":"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","names":["import_utils","import_utils"]}
+{"version":3,"sources":["../src/autocomplete-list.tsx","../src/autocomplete-context.ts","../src/use-autocomplete-list.ts"],"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 } from \"@yamada-ui/utils\"\nimport { useAutocompleteContext } from \"./autocomplete-context\"\nimport { useAutocompleteList } from \"./use-autocomplete-list\"\n\nexport interface AutocompleteListProps extends HTMLUIProps {\n  footer?: ReactNode\n  header?: ReactNode\n  contentProps?: MotionPropsWithoutChildren\n}\n\nexport const AutocompleteList = forwardRef<AutocompleteListProps, \"div\">(\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 { getContainerProps, getListProps } = 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        {...getContainerProps(contentProps)}\n      >\n        {header ? (\n          <ui.header\n            className=\"ui-autocomplete__header\"\n            __css={{ ...styles.header }}\n          >\n            {header}\n          </ui.header>\n        ) : null}\n\n        <ui.div\n          className={cx(\"ui-autocomplete__list\", className)}\n          __css={{ ...styles.list }}\n          {...getListProps(rest, ref)}\n        >\n          {children}\n        </ui.div>\n\n        {footer ? (\n          <ui.footer\n            className=\"ui-autocomplete__footer\"\n            __css={{ ...styles.footer }}\n          >\n            {footer}\n          </ui.footer>\n        ) : null}\n      </PopoverContent>\n    )\n  },\n)\n\nAutocompleteList.displayName = \"AutocompleteList\"\nAutocompleteList.__ui__ = \"AutocompleteList\"\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","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"],"mappings":"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","names":["import_utils","import_utils"]}

package/dist/autocomplete-list.mjs

@@ -1,9 +1,9 @@
 "use client"
 import {
   AutocompleteList
-} from "./chunk-REPBXBG3.mjs";
-import "./chunk-PTPJFYGI.mjs";
-import "./chunk-ZNO5RUVT.mjs";
+} from "./chunk-LIBFONYN.mjs";
+import "./chunk-4GVV3HBE.mjs";
+import "./chunk-TP5VZFO3.mjs";
 export {
   AutocompleteList
 };

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

@@ -1 +1 @@
-{"version":3,"sources":["../src/autocomplete-option-group.tsx","../src/autocomplete-context.ts","../src/use-autocomplete-option-group.ts"],"sourcesContent":["import type { HTMLUIProps } from \"@yamada-ui/core\"\nimport type { UseAutocompleteOptionGroupProps } from \"./use-autocomplete-option-group\"\nimport { forwardRef, ui } from \"@yamada-ui/core\"\nimport { cx } from \"@yamada-ui/utils\"\nimport { useAutocompleteContext } from \"./autocomplete-context\"\nimport { useAutocompleteOptionGroup } from \"./use-autocomplete-option-group\"\n\ninterface AutocompleteOptionGroupOptions\n  extends UseAutocompleteOptionGroupProps {\n  /**\n   * Props for autocomplete option group element.\n   */\n  labelProps?: HTMLUIProps<\"header\">\n}\n\nexport interface AutocompleteOptionGroupProps\n  extends HTMLUIProps,\n    AutocompleteOptionGroupOptions {}\n\nexport const AutocompleteOptionGroup = forwardRef<\n  AutocompleteOptionGroupProps,\n  \"div\"\n>(\n  (\n    {\n      className,\n      children,\n      color,\n      h,\n      height,\n      minH,\n      minHeight,\n      labelProps,\n      ...rest\n    },\n    ref,\n  ) => {\n    const { styles } = useAutocompleteContext()\n    const { label, getContainerProps, getGroupProps, getLabelProps } =\n      useAutocompleteOptionGroup(rest)\n\n    h ??= height\n    minH ??= minHeight\n\n    return (\n      <ui.section\n        className={cx(\n          \"ui-autocomplete__item\",\n          \"ui-autocomplete__item--group\",\n          className,\n        )}\n        __css={{ color, h: \"fit-content\", w: \"100%\" }}\n        {...getContainerProps()}\n      >\n        <ui.header\n          className=\"ui-autocomplete__item__group-label\"\n          lineClamp={1}\n          __css={styles.groupLabel}\n          {...getLabelProps(labelProps)}\n        >\n          {label}\n        </ui.header>\n\n        <ui.div\n          {...getGroupProps({}, ref)}\n          className=\"ui-autocomplete__item__group\"\n          __css={{ h, minH, ...styles.group }}\n        >\n          {children}\n        </ui.div>\n      </ui.section>\n    )\n  },\n)\n\nAutocompleteOptionGroup.displayName = \"AutocompleteOptionGroup\"\nAutocompleteOptionGroup.__ui__ = \"AutocompleteOptionGroup\"\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","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"],"mappings":"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","names":["import_core","import_utils","import_utils"]}
+{"version":3,"sources":["../src/autocomplete-option-group.tsx","../src/autocomplete-context.ts","../src/use-autocomplete-option-group.ts"],"sourcesContent":["import type { HTMLUIProps } from \"@yamada-ui/core\"\nimport type { UseAutocompleteOptionGroupProps } from \"./use-autocomplete-option-group\"\nimport { forwardRef, ui } from \"@yamada-ui/core\"\nimport { cx } from \"@yamada-ui/utils\"\nimport { useAutocompleteContext } from \"./autocomplete-context\"\nimport { useAutocompleteOptionGroup } from \"./use-autocomplete-option-group\"\n\ninterface AutocompleteOptionGroupOptions\n  extends UseAutocompleteOptionGroupProps {\n  /**\n   * Props for autocomplete option group element.\n   */\n  labelProps?: HTMLUIProps<\"header\">\n}\n\nexport interface AutocompleteOptionGroupProps\n  extends HTMLUIProps,\n    AutocompleteOptionGroupOptions {}\n\nexport const AutocompleteOptionGroup = forwardRef<\n  AutocompleteOptionGroupProps,\n  \"div\"\n>(\n  (\n    {\n      className,\n      children,\n      color,\n      h,\n      height,\n      minH,\n      minHeight,\n      labelProps,\n      ...rest\n    },\n    ref,\n  ) => {\n    const { styles } = useAutocompleteContext()\n    const { label, getContainerProps, getGroupProps, getLabelProps } =\n      useAutocompleteOptionGroup(rest)\n\n    h ??= height\n    minH ??= minHeight\n\n    return (\n      <ui.section\n        className={cx(\n          \"ui-autocomplete__item\",\n          \"ui-autocomplete__item--group\",\n          className,\n        )}\n        __css={{ color, h: \"fit-content\", w: \"100%\" }}\n        {...getContainerProps()}\n      >\n        <ui.header\n          className=\"ui-autocomplete__item__group-label\"\n          lineClamp={1}\n          __css={styles.groupLabel}\n          {...getLabelProps(labelProps)}\n        >\n          {label}\n        </ui.header>\n\n        <ui.div\n          {...getGroupProps({}, ref)}\n          className=\"ui-autocomplete__item__group\"\n          __css={{ h, minH, ...styles.group }}\n        >\n          {children}\n        </ui.div>\n      </ui.section>\n    )\n  },\n)\n\nAutocompleteOptionGroup.displayName = \"AutocompleteOptionGroup\"\nAutocompleteOptionGroup.__ui__ = \"AutocompleteOptionGroup\"\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","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"],"mappings":"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","names":["import_core","import_utils","import_utils"]}

package/dist/autocomplete-option-group.mjs

@@ -1,9 +1,9 @@
 "use client"
 import {
   AutocompleteOptionGroup
-} from "./chunk-PU6HFINM.mjs";
-import "./chunk-CMFJUJJW.mjs";
-import "./chunk-ZNO5RUVT.mjs";
+} from "./chunk-ABCTEZN5.mjs";
+import "./chunk-UX5QECNB.mjs";
+import "./chunk-TP5VZFO3.mjs";
 export {
   AutocompleteOptionGroup
 };

package/dist/autocomplete-option.js

@@ -165,13 +165,17 @@ var useAutocompleteOption = (props) => {
     id,
     children,
     closeOnSelect: customCloseOnSelect,
+    disabled,
+    focusable,
     icon: customIcon,
     isDisabled,
     isFocusable,
     value: optionValue,
     ...computedProps
   } = { ...optionProps, ...props };
-  const trulyDisabled = !!isDisabled && !isFocusable;
+  disabled != null ? disabled : disabled = isDisabled;
+  focusable != null ? focusable : focusable = isFocusable;
+  const trulyDisabled = !!disabled && !focusable;
   const { descendants, index, register } = useAutocompleteDescendant({
     disabled: trulyDisabled
   });
@@ -197,7 +201,7 @@ var useAutocompleteOption = (props) => {
   const onClick = (0, import_react2.useCallback)(
     (ev) => {
       ev.stopPropagation();
-      if (isDisabled || !isTargetOption(ev.currentTarget)) {
+      if (disabled || !isTargetOption(ev.currentTarget)) {
         if (inputRef.current) inputRef.current.focus();
         return;
       }
@@ -211,7 +215,7 @@ var useAutocompleteOption = (props) => {
       isDuplicated,
       onFocusNext,
       omitSelectedValues,
-      isDisabled,
+      disabled,
       optionValue,
       setFocusedIndex,
       index,
@@ -243,10 +247,10 @@ var useAutocompleteOption = (props) => {
         ...props2,
         id,
         style: isHidden ? style : void 0,
-        "aria-disabled": (0, import_utils3.ariaAttr)(isDisabled),
+        "aria-disabled": (0, import_utils3.ariaAttr)(disabled),
         "aria-hidden": (0, import_utils3.ariaAttr)(isHidden),
         "aria-selected": isSelected,
-        "data-disabled": (0, import_utils3.dataAttr)(isDisabled),
+        "data-disabled": (0, import_utils3.dataAttr)(disabled),
         "data-duplicated": (0, import_utils3.dataAttr)(isDuplicated),
         "data-focus": (0, import_utils3.dataAttr)(isFocused),
         "data-target": (0, import_utils3.dataAttr)(true),
@@ -260,7 +264,7 @@ var useAutocompleteOption = (props) => {
       isDuplicated,
       optionValue,
       computedProps,
-      isDisabled,
+      disabled,
       isFocused,
       isSelected,
       isTarget,