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

package/dist/{chunk-QPIWG4ZF.mjs → chunk-7LZUXESV.mjs}

@@ -2,32 +2,32 @@
 import {
   useAutocomplete,
   useAutocompleteInput
-} from "./chunk-OLOU5HFC.mjs";
+} from "./chunk-WERCEZNJ.mjs";
 import {
   AutocompleteCreate
-} from "./chunk-Q2HZVVOI.mjs";
+} from "./chunk-K5HCHHCJ.mjs";
 import {
   AutocompleteEmpty
-} from "./chunk-5GKGL6BL.mjs";
+} from "./chunk-2HJUFFCU.mjs";
 import {
   AutocompleteList
-} from "./chunk-S53LMDD7.mjs";
+} from "./chunk-VTBUO5SK.mjs";
 import {
   AutocompleteClearIcon,
   AutocompleteIcon
-} from "./chunk-7SWSKLSA.mjs";
+} from "./chunk-V6YCG642.mjs";
 import {
   AutocompleteDescendantsContextProvider,
   AutocompleteProvider,
   useAutocompleteContext
-} from "./chunk-JPUKYLBW.mjs";
+} from "./chunk-WDQYM4FP.mjs";
 
 // src/multi-autocomplete.tsx
 import {
-  ui,
   forwardRef,
-  useComponentMultiStyle,
-  omitThemeProps
+  omitThemeProps,
+  ui,
+  useComponentMultiStyle
 } from "@yamada-ui/core";
 import { Popover, PopoverTrigger } from "@yamada-ui/popover";
 import { Portal } from "@yamada-ui/portal";
@@ -42,58 +42,58 @@ var MultiAutocomplete = forwardRef(
     );
     let {
       className,
-      defaultValue = [],
-      component,
-      separator,
-      isClearable = true,
+      children,
+      closeOnSelect = false,
       color,
+      component,
+      defaultValue = [],
+      footer,
       h,
+      header,
       height,
+      isClearable = true,
+      keepPlaceholder = false,
       minH,
       minHeight,
-      closeOnSelect = false,
-      keepPlaceholder = false,
+      separator,
+      clearIconProps,
       containerProps,
       contentProps,
-      listProps,
+      createProps,
+      emptyProps,
       fieldProps,
-      inputProps,
       iconProps,
-      clearIconProps,
+      inputProps,
+      listProps,
       portalProps = { isDisabled: true },
-      createProps,
-      emptyProps,
-      header,
-      footer,
-      children,
       ...computedProps
     } = omitThemeProps(mergedProps);
     const {
-      value,
-      onClose,
+      allowCreate,
+      computedChildren,
       descendants,
+      inputValue,
+      isEmpty,
+      value,
       formControlProps,
-      getPopoverProps,
       getContainerProps,
       getFieldProps,
-      allowCreate,
-      isEmpty,
-      inputValue,
-      computedChildren,
+      getPopoverProps,
       onClear,
+      onClose,
       ...rest
     } = useAutocomplete({
       ...computedProps,
-      defaultValue,
+      children,
       closeOnSelect,
-      children
+      defaultValue
     });
     h != null ? h : h = height;
     minH != null ? minH : minH = minHeight;
     const css = {
-      w: "100%",
-      h: "fit-content",
       color,
+      h: "fit-content",
+      w: "100%",
       ...styles.container
     };
     return /* @__PURE__ */ jsx(AutocompleteDescendantsContextProvider, { value: descendants, children: /* @__PURE__ */ jsx(
@@ -101,13 +101,13 @@ var MultiAutocomplete = forwardRef(
       {
         value: {
           ...rest,
-          value,
-          onClose,
-          formControlProps,
-          inputValue,
           allowCreate,
+          inputValue,
           isEmpty,
-          styles
+          styles,
+          value,
+          formControlProps,
+          onClose
         },
         children: /* @__PURE__ */ jsx(Popover, { ...getPopoverProps(), children: /* @__PURE__ */ jsxs(
           ui.div,
@@ -126,10 +126,10 @@ var MultiAutocomplete = forwardRef(
                       MultiAutocompleteField,
                       {
                         component,
-                        separator,
-                        keepPlaceholder,
                         h,
+                        keepPlaceholder,
                         minH,
+                        separator,
                         inputProps,
                         ...getFieldProps(fieldProps, ref)
                       }
@@ -148,8 +148,8 @@ var MultiAutocomplete = forwardRef(
               !isEmpty ? /* @__PURE__ */ jsx(Portal, { ...portalProps, children: /* @__PURE__ */ jsxs(
                 AutocompleteList,
                 {
-                  header: runIfFunc(header, { value, onClose }),
                   footer: runIfFunc(footer, { value, onClose }),
+                  header: runIfFunc(header, { value, onClose }),
                   contentProps,
                   ...listProps,
                   children: [
@@ -160,8 +160,8 @@ var MultiAutocomplete = forwardRef(
               ) }) : /* @__PURE__ */ jsx(Portal, { ...portalProps, children: /* @__PURE__ */ jsx(
                 AutocompleteList,
                 {
-                  header: runIfFunc(header, { value, onClose }),
                   footer: runIfFunc(footer, { value, onClose }),
+                  header: runIfFunc(header, { value, onClose }),
                   contentProps,
                   ...listProps,
                   children: allowCreate && inputValue ? /* @__PURE__ */ jsx(AutocompleteCreate, { ...createProps }) : /* @__PURE__ */ jsx(AutocompleteEmpty, { ...emptyProps })
@@ -180,34 +180,36 @@ var MultiAutocompleteField = forwardRef(
   ({
     className,
     component,
-    separator = ",",
-    keepPlaceholder,
     h,
+    keepPlaceholder,
     minH,
     placeholder,
+    separator = ",",
     inputProps,
     ...rest
   }, ref) => {
-    const { value, label, inputValue, onChange, isOpen, inputRef, styles } = useAutocompleteContext();
+    const { inputRef, inputValue, isOpen, label, styles, value, onChange } = useAutocompleteContext();
     const { getInputProps } = useAutocompleteInput();
     const cloneChildren = useMemo(() => {
       if (!(label == null ? void 0 : label.length)) return null;
       if (component) {
         return label.map((label2, index) => {
+          if (!value[index]) return null;
           const onRemove = (ev) => {
+            if (!value[index]) return;
             ev.stopPropagation();
             onChange(value[index]);
             if (inputRef.current) inputRef.current.focus();
           };
           const el = component({
-            value: value[index],
-            label: label2,
             index,
+            label: label2,
+            value: value[index],
             onRemove
           });
           const style = {
-            marginBlockStart: "0.125rem",
             marginBlockEnd: "0.125rem",
+            marginBlockStart: "0.125rem",
             marginInlineEnd: "0.25rem"
           };
           return el ? cloneElement(el, { key: index, style }) : null;
@@ -223,12 +225,12 @@ var MultiAutocompleteField = forwardRef(
       }
     }, [label, component, value, onChange, isOpen, inputRef, separator]);
     const css = {
-      pe: "2rem",
-      h,
-      minH,
+      alignItems: "center",
       display: "flex",
       flexWrap: "wrap",
-      alignItems: "center",
+      h,
+      minH,
+      pe: "2rem",
       ...styles.field,
       cursor: "text"
     };
@@ -236,25 +238,25 @@ var MultiAutocompleteField = forwardRef(
       ui.div,
       {
         className: cx("ui-multi-autocomplete__field", className),
-        __css: css,
         py: (label == null ? void 0 : label.length) && component ? "0.125rem" : void 0,
+        __css: css,
         ...rest,
         children: [
           cloneChildren,
           /* @__PURE__ */ jsx(
             ui.input,
             {
-              "aria-label": "Input value",
               className: "ui-multi-autocomplete__field__input",
+              "aria-label": "Input value",
+              "aria-multiselectable": "true",
               display: "inline-block",
               flex: "1",
+              marginBlockEnd: "0.125rem",
+              marginBlockStart: "0.125rem",
               minW: "0px",
               overflow: "hidden",
-              marginBlockStart: "0.125rem",
-              marginBlockEnd: "0.125rem",
-              "aria-multiselectable": "true",
-              placeholder: !label || !(label == null ? void 0 : label.length) || keepPlaceholder && isOpen ? placeholder : void 0,
-              ...getInputProps({ ...inputProps, value: inputValue != null ? inputValue : "" }, ref)
+              placeholder: !(label == null ? void 0 : label.length) || keepPlaceholder && isOpen ? placeholder : void 0,
+              ...getInputProps({ ...inputProps, value: inputValue }, ref)
             }
           )
         ]
@@ -268,4 +270,4 @@ MultiAutocompleteField.__ui__ = "MultiAutocompleteField";
 export {
   MultiAutocomplete
 };
-//# sourceMappingURL=chunk-QPIWG4ZF.mjs.map
+//# sourceMappingURL=chunk-7LZUXESV.mjs.map

package/dist/chunk-7LZUXESV.mjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/multi-autocomplete.tsx"],"sourcesContent":["import type { CSSUIObject, HTMLUIProps, ThemeProps } from \"@yamada-ui/core\"\nimport type { MotionProps } from \"@yamada-ui/motion\"\nimport type { PortalProps } from \"@yamada-ui/portal\"\nimport type {\n  CSSProperties,\n  FC,\n  MouseEventHandler,\n  ReactElement,\n  ReactNode,\n} from \"react\"\nimport type { AutocompleteCreateProps } from \"./autocomplete-create\"\nimport type { AutocompleteEmptyProps } from \"./autocomplete-empty\"\nimport type { AutocompleteIconProps } from \"./autocomplete-icon\"\nimport type { AutocompleteListProps } from \"./autocomplete-list\"\nimport type { UseAutocompleteProps } from \"./use-autocomplete\"\nimport {\n  forwardRef,\n  omitThemeProps,\n  ui,\n  useComponentMultiStyle,\n} from \"@yamada-ui/core\"\nimport { Popover, PopoverTrigger } from \"@yamada-ui/popover\"\nimport { Portal } from \"@yamada-ui/portal\"\nimport { cx, handlerAll, runIfFunc } from \"@yamada-ui/utils\"\nimport { cloneElement, useMemo } from \"react\"\nimport {\n  AutocompleteDescendantsContextProvider,\n  AutocompleteProvider,\n  useAutocompleteContext,\n} from \"./autocomplete-context\"\nimport { AutocompleteCreate } from \"./autocomplete-create\"\nimport { AutocompleteEmpty } from \"./autocomplete-empty\"\nimport { AutocompleteClearIcon, AutocompleteIcon } from \"./autocomplete-icon\"\nimport { AutocompleteList } from \"./autocomplete-list\"\nimport { useAutocomplete, useAutocompleteInput } from \"./use-autocomplete\"\n\ninterface MultiAutocompleteOptions {\n  /**\n   * If `true`, the list element will be closed when value is selected.\n   *\n   * @default false\n   */\n  closeOnSelect?: boolean\n  /**\n   * The custom display value to use.\n   */\n  component?: FC<{\n    index: number\n    label: string\n    value: number | string\n    onRemove: MouseEventHandler<HTMLElement>\n  }>\n  /**\n   * The border color when the input is invalid.\n   */\n  errorBorderColor?: string\n  /**\n   * The border color when the input is focused.\n   */\n  focusBorderColor?: string\n  /**\n   * The footer of the autocomplete content element.\n   */\n  footer?: FC<{ value: string[] | undefined; onClose: () => void }> | ReactNode\n  /**\n   * The header of the autocomplete content element.\n   */\n  header?: FC<{ value: string[] | undefined; onClose: () => void }> | ReactNode\n  /**\n   * If `true`, display the select clear icon.\n   *\n   * @default true\n   */\n  isClearable?: boolean\n  /**\n   * If `true`, keep the placeholder.\n   *\n   * @default false\n   */\n  keepPlaceholder?: boolean\n  /**\n   * The visual separator between each value.\n   *\n   * @default ','\n   */\n  separator?: string\n  /**\n   * Props for multi autocomplete clear icon element.\n   */\n  clearIconProps?: AutocompleteIconProps\n  /**\n   * Props for multi autocomplete container element.\n   */\n  containerProps?: Omit<HTMLUIProps, \"children\">\n  /**\n   * Props for multi autocomplete content element.\n   */\n  contentProps?: Omit<MotionProps, \"children\">\n  /**\n   * Props for autocomplete create element.\n   */\n  createProps?: Omit<AutocompleteCreateProps, \"children\">\n  /**\n   * Props for autocomplete empty element.\n   */\n  emptyProps?: Omit<AutocompleteEmptyProps, \"children\">\n  /**\n   * Props for multi autocomplete field element.\n   */\n  fieldProps?: Omit<\n    MultiAutocompleteFieldProps,\n    \"children\" | \"component\" | \"inputProps\" | \"keepPlaceholder\" | \"separator\"\n  >\n  /**\n   * Props for multi autocomplete icon element.\n   */\n  iconProps?: AutocompleteIconProps\n  /**\n   * Props for multi autocomplete input element.\n   */\n  inputProps?: HTMLUIProps<\"input\">\n  /**\n   * Props for multi autocomplete list element.\n   */\n  listProps?: Omit<AutocompleteListProps, \"children\">\n  /**\n   * Props to be forwarded to the portal component.\n   *\n   * @default '{ isDisabled: true }'\n   *\n   */\n  portalProps?: Omit<PortalProps, \"children\">\n}\n\nexport interface MultiAutocompleteProps\n  extends ThemeProps<\"MultiAutocomplete\">,\n    Omit<UseAutocompleteProps<string[]>, \"closeOnSelect\">,\n    MultiAutocompleteOptions {}\n\n/**\n * `MultiAutocomplete` is a component used to display suggestions based on user text input and to obtain multiple values.\n *\n * @see Docs https://yamada-ui.com/components/forms/multi-autocomplete\n */\nexport const MultiAutocomplete = forwardRef<MultiAutocompleteProps, \"input\">(\n  (props, ref) => {\n    const [styles, mergedProps] = useComponentMultiStyle(\n      \"MultiAutocomplete\",\n      props,\n    )\n    let {\n      className,\n      children,\n      closeOnSelect = false,\n      color,\n      component,\n      defaultValue = [],\n      footer,\n      h,\n      header,\n      height,\n      isClearable = true,\n      keepPlaceholder = false,\n      minH,\n      minHeight,\n      separator,\n      clearIconProps,\n      containerProps,\n      contentProps,\n      createProps,\n      emptyProps,\n      fieldProps,\n      iconProps,\n      inputProps,\n      listProps,\n      portalProps = { isDisabled: true },\n      ...computedProps\n    } = omitThemeProps(mergedProps)\n\n    const {\n      allowCreate,\n      computedChildren,\n      descendants,\n      inputValue,\n      isEmpty,\n      value,\n      formControlProps,\n      getContainerProps,\n      getFieldProps,\n      getPopoverProps,\n      onClear,\n      onClose,\n      ...rest\n    } = useAutocomplete<string[]>({\n      ...computedProps,\n      children,\n      closeOnSelect,\n      defaultValue,\n    })\n\n    h ??= height\n    minH ??= minHeight\n\n    const css: CSSUIObject = {\n      color,\n      h: \"fit-content\",\n      w: \"100%\",\n      ...styles.container,\n    }\n\n    return (\n      <AutocompleteDescendantsContextProvider value={descendants}>\n        <AutocompleteProvider\n          value={{\n            ...rest,\n            allowCreate,\n            inputValue,\n            isEmpty,\n            styles,\n            value,\n            formControlProps,\n            onClose,\n          }}\n        >\n          <Popover {...getPopoverProps()}>\n            <ui.div\n              className={cx(\"ui-multi-autocomplete\", className)}\n              __css={css}\n              {...getContainerProps(containerProps)}\n            >\n              <ui.div\n                className=\"ui-multi-autocomplete__inner\"\n                __css={{ position: \"relative\", ...styles.inner }}\n              >\n                <MultiAutocompleteField\n                  component={component}\n                  h={h}\n                  keepPlaceholder={keepPlaceholder}\n                  minH={minH}\n                  separator={separator}\n                  inputProps={inputProps}\n                  {...getFieldProps(fieldProps, ref)}\n                />\n\n                {isClearable && value.length ? (\n                  <AutocompleteClearIcon\n                    {...clearIconProps}\n                    onClick={handlerAll(clearIconProps?.onClick, onClear)}\n                    {...formControlProps}\n                  />\n                ) : (\n                  <AutocompleteIcon {...iconProps} {...formControlProps} />\n                )}\n              </ui.div>\n\n              {!isEmpty ? (\n                <Portal {...portalProps}>\n                  <AutocompleteList\n                    footer={runIfFunc(footer, { value, onClose })}\n                    header={runIfFunc(header, { value, onClose })}\n                    contentProps={contentProps}\n                    {...listProps}\n                  >\n                    {allowCreate ? (\n                      <AutocompleteCreate {...createProps} />\n                    ) : (\n                      <AutocompleteEmpty {...emptyProps} />\n                    )}\n\n                    {children ?? computedChildren}\n                  </AutocompleteList>\n                </Portal>\n              ) : (\n                <Portal {...portalProps}>\n                  <AutocompleteList\n                    footer={runIfFunc(footer, { value, onClose })}\n                    header={runIfFunc(header, { value, onClose })}\n                    contentProps={contentProps}\n                    {...listProps}\n                  >\n                    {allowCreate && inputValue ? (\n                      <AutocompleteCreate {...createProps} />\n                    ) : (\n                      <AutocompleteEmpty {...emptyProps} />\n                    )}\n                  </AutocompleteList>\n                </Portal>\n              )}\n            </ui.div>\n          </Popover>\n        </AutocompleteProvider>\n      </AutocompleteDescendantsContextProvider>\n    )\n  },\n)\n\nMultiAutocomplete.displayName = \"MultiAutocomplete\"\nMultiAutocomplete.__ui__ = \"MultiAutocomplete\"\n\ninterface MultiAutocompleteFieldProps\n  extends HTMLUIProps,\n    Pick<\n      MultiAutocompleteProps,\n      \"component\" | \"inputProps\" | \"keepPlaceholder\" | \"separator\"\n    > {}\n\nconst MultiAutocompleteField = forwardRef<MultiAutocompleteFieldProps, \"input\">(\n  (\n    {\n      className,\n      component,\n      h,\n      keepPlaceholder,\n      minH,\n      placeholder,\n      separator = \",\",\n      inputProps,\n      ...rest\n    },\n    ref,\n  ) => {\n    const { inputRef, inputValue, isOpen, label, styles, value, onChange } =\n      useAutocompleteContext()\n\n    const { getInputProps } = useAutocompleteInput()\n\n    const cloneChildren = useMemo(() => {\n      if (!label?.length) return null\n\n      if (component) {\n        return (label as string[]).map((label, index) => {\n          if (!value[index]) return null\n\n          const onRemove: MouseEventHandler<HTMLElement> = (ev) => {\n            if (!value[index]) return\n\n            ev.stopPropagation()\n\n            onChange(value[index])\n\n            if (inputRef.current) inputRef.current.focus()\n          }\n\n          const el = component({\n            index,\n            label,\n            value: value[index],\n            onRemove,\n          })\n\n          const style: CSSProperties = {\n            marginBlockEnd: \"0.125rem\",\n            marginBlockStart: \"0.125rem\",\n            marginInlineEnd: \"0.25rem\",\n          }\n\n          return el\n            ? cloneElement(el as ReactElement, { key: index, style })\n            : null\n        })\n      } else {\n        return (label as string[]).map((value, index) => {\n          const isLast = label.length === index + 1\n\n          return (\n            <ui.span key={index} display=\"inline-block\" me=\"0.25rem\">\n              {value}\n              {!isLast || isOpen ? separator : null}\n            </ui.span>\n          )\n        })\n      }\n    }, [label, component, value, onChange, isOpen, inputRef, separator])\n\n    const css: CSSUIObject = {\n      alignItems: \"center\",\n      display: \"flex\",\n      flexWrap: \"wrap\",\n      h,\n      minH,\n      pe: \"2rem\",\n      ...styles.field,\n      cursor: \"text\",\n    }\n\n    return (\n      <PopoverTrigger>\n        <ui.div\n          className={cx(\"ui-multi-autocomplete__field\", className)}\n          py={label?.length && component ? \"0.125rem\" : undefined}\n          __css={css}\n          {...rest}\n        >\n          {cloneChildren}\n\n          <ui.input\n            className=\"ui-multi-autocomplete__field__input\"\n            aria-label=\"Input value\"\n            aria-multiselectable=\"true\"\n            display=\"inline-block\"\n            flex=\"1\"\n            marginBlockEnd=\"0.125rem\"\n            marginBlockStart=\"0.125rem\"\n            minW=\"0px\"\n            overflow=\"hidden\"\n            placeholder={\n              !label?.length || (keepPlaceholder && isOpen)\n                ? placeholder\n                : undefined\n            }\n            {...getInputProps({ ...inputProps, value: inputValue }, ref)}\n          />\n        </ui.div>\n      </PopoverTrigger>\n    )\n  },\n)\n\nMultiAutocompleteField.displayName = \"MultiAutocompleteField\"\nMultiAutocompleteField.__ui__ = \"MultiAutocompleteField\"\n"],"mappings":"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","names":["label","value"]}

package/dist/{chunk-S2HFYJVI.mjs → chunk-AIBJWPRA.mjs}

@@ -1,34 +1,34 @@
 "use client"
 import {
   useAutocompleteOption
-} from "./chunk-5LPWFWE6.mjs";
+} from "./chunk-6OLHNK7O.mjs";
 import {
   AutocompleteItemIcon
-} from "./chunk-7SWSKLSA.mjs";
+} from "./chunk-V6YCG642.mjs";
 import {
   useAutocompleteContext
-} from "./chunk-JPUKYLBW.mjs";
+} from "./chunk-WDQYM4FP.mjs";
 
 // src/autocomplete-option.tsx
-import { ui, forwardRef } from "@yamada-ui/core";
+import { forwardRef, ui } from "@yamada-ui/core";
 import { cx } from "@yamada-ui/utils";
 import { jsx, jsxs } from "react/jsx-runtime";
 var AutocompleteOption = forwardRef(
   ({ className, icon, ...rest }, ref) => {
     const { styles } = useAutocompleteContext();
-    const { isSelected, customIcon, children, getOptionProps } = useAutocompleteOption(rest);
+    const { children, customIcon, isSelected, getOptionProps } = useAutocompleteOption(rest);
     icon != null ? icon : icon = customIcon;
     const css = {
-      textDecoration: "none",
+      alignItems: "center",
       color: "inherit",
-      userSelect: "none",
       display: "flex",
-      width: "100%",
-      alignItems: "center",
-      textAlign: "start",
       flex: "0 0 auto",
-      outline: 0,
       gap: "0.75rem",
+      outline: 0,
+      textAlign: "start",
+      textDecoration: "none",
+      userSelect: "none",
+      width: "100%",
       ...styles.item
     };
     return /* @__PURE__ */ jsxs(
@@ -47,7 +47,7 @@ var AutocompleteOption = forwardRef(
 );
 AutocompleteOption.displayName = "AutocompleteOption";
 AutocompleteOption.__ui__ = "AutocompleteOption";
-var AutocompleteCheckIcon = () => /* @__PURE__ */ jsx("svg", { viewBox: "0 0 14 14", width: "1em", height: "1em", children: /* @__PURE__ */ jsx(
+var AutocompleteCheckIcon = () => /* @__PURE__ */ jsx("svg", { height: "1em", viewBox: "0 0 14 14", width: "1em", children: /* @__PURE__ */ jsx(
   "polygon",
   {
     fill: "currentColor",
@@ -60,4 +60,4 @@ AutocompleteCheckIcon.__ui__ = "AutocompleteCheckIcon";
 export {
   AutocompleteOption
 };
-//# sourceMappingURL=chunk-S2HFYJVI.mjs.map
+//# sourceMappingURL=chunk-AIBJWPRA.mjs.map

package/dist/chunk-AIBJWPRA.mjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/autocomplete-option.tsx"],"sourcesContent":["import type { CSSUIObject, FC } from \"@yamada-ui/core\"\nimport type { ReactElement } from \"react\"\nimport type { UseAutocompleteOptionProps } from \"./use-autocomplete-option\"\nimport { forwardRef, ui } from \"@yamada-ui/core\"\nimport { cx } from \"@yamada-ui/utils\"\nimport { useAutocompleteContext } from \"./autocomplete-context\"\nimport { AutocompleteItemIcon } from \"./autocomplete-icon\"\nimport { useAutocompleteOption } from \"./use-autocomplete-option\"\n\ninterface AutocompleteOptionOptions {\n  /**\n   * The autocomplete option icon to use.\n   */\n  icon?: null | ReactElement\n}\n\nexport interface AutocompleteOptionProps\n  extends UseAutocompleteOptionProps,\n    AutocompleteOptionOptions {}\n\nexport const AutocompleteOption = forwardRef<AutocompleteOptionProps, \"li\">(\n  ({ className, icon, ...rest }, ref) => {\n    const { styles } = useAutocompleteContext()\n    const { children, customIcon, isSelected, getOptionProps } =\n      useAutocompleteOption(rest)\n\n    icon ??= customIcon\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.li\n        className={cx(\"ui-autocomplete__item\", className)}\n        __css={css}\n        {...getOptionProps({}, ref)}\n      >\n        {icon !== null ? (\n          <AutocompleteItemIcon opacity={isSelected ? 1 : 0}>\n            {icon || <AutocompleteCheckIcon />}\n          </AutocompleteItemIcon>\n        ) : null}\n\n        <ui.span style={{ flex: 1 }} data-label>\n          {children}\n        </ui.span>\n      </ui.li>\n    )\n  },\n)\n\nAutocompleteOption.displayName = \"AutocompleteOption\"\nAutocompleteOption.__ui__ = \"AutocompleteOption\"\n\nconst AutocompleteCheckIcon: FC = () => (\n  <svg height=\"1em\" viewBox=\"0 0 14 14\" width=\"1em\">\n    <polygon\n      fill=\"currentColor\"\n      points=\"5.5 11.9993304 14 3.49933039 12.5 2 5.5 8.99933039 1.5 4.9968652 0 6.49933039\"\n    />\n  </svg>\n)\n\nAutocompleteCheckIcon.displayName = \"AutocompleteCheckIcon\"\nAutocompleteCheckIcon.__ui__ = \"AutocompleteCheckIcon\"\n"],"mappings":";;;;;;;;;;;;AAGA,SAAS,YAAY,UAAU;AAC/B,SAAS,UAAU;AAuCb,SAOe,KAPf;AAvBC,IAAM,qBAAqB;AAAA,EAChC,CAAC,EAAE,WAAW,MAAM,GAAG,KAAK,GAAG,QAAQ;AACrC,UAAM,EAAE,OAAO,IAAI,uBAAuB;AAC1C,UAAM,EAAE,UAAU,YAAY,YAAY,eAAe,IACvD,sBAAsB,IAAI;AAE5B,iCAAS;AAET,UAAM,MAAmB;AAAA,MACvB,YAAY;AAAA,MACZ,OAAO;AAAA,MACP,SAAS;AAAA,MACT,MAAM;AAAA,MACN,KAAK;AAAA,MACL,SAAS;AAAA,MACT,WAAW;AAAA,MACX,gBAAgB;AAAA,MAChB,YAAY;AAAA,MACZ,OAAO;AAAA,MACP,GAAG,OAAO;AAAA,IACZ;AAEA,WACE;AAAA,MAAC,GAAG;AAAA,MAAH;AAAA,QACC,WAAW,GAAG,yBAAyB,SAAS;AAAA,QAChD,OAAO;AAAA,QACN,GAAG,eAAe,CAAC,GAAG,GAAG;AAAA,QAEzB;AAAA,mBAAS,OACR,oBAAC,wBAAqB,SAAS,aAAa,IAAI,GAC7C,kBAAQ,oBAAC,yBAAsB,GAClC,IACE;AAAA,UAEJ,oBAAC,GAAG,MAAH,EAAQ,OAAO,EAAE,MAAM,EAAE,GAAG,cAAU,MACpC,UACH;AAAA;AAAA;AAAA,IACF;AAAA,EAEJ;AACF;AAEA,mBAAmB,cAAc;AACjC,mBAAmB,SAAS;AAE5B,IAAM,wBAA4B,MAChC,oBAAC,SAAI,QAAO,OAAM,SAAQ,aAAY,OAAM,OAC1C;AAAA,EAAC;AAAA;AAAA,IACC,MAAK;AAAA,IACL,QAAO;AAAA;AACT,GACF;AAGF,sBAAsB,cAAc;AACpC,sBAAsB,SAAS;","names":[]}

package/dist/{chunk-Q2HZVVOI.mjs → chunk-K5HCHHCJ.mjs}

@@ -1,34 +1,34 @@
 "use client"
 import {
   useAutocompleteCreate
-} from "./chunk-5LPWFWE6.mjs";
+} from "./chunk-6OLHNK7O.mjs";
 import {
   AutocompleteItemIcon
-} from "./chunk-7SWSKLSA.mjs";
+} from "./chunk-V6YCG642.mjs";
 import {
   useAutocompleteContext
-} from "./chunk-JPUKYLBW.mjs";
+} from "./chunk-WDQYM4FP.mjs";
 
 // src/autocomplete-create.tsx
-import { ui, forwardRef } from "@yamada-ui/core";
+import { forwardRef, ui } from "@yamada-ui/core";
 import { cx, runIfFunc } from "@yamada-ui/utils";
 import { jsx, jsxs } from "react/jsx-runtime";
 var AutocompleteCreate = forwardRef(
-  ({ className, icon, children, ...rest }, ref) => {
+  ({ className, children, icon, ...rest }, ref) => {
     const { inputValue, styles } = useAutocompleteContext();
     const { getCreateProps } = useAutocompleteCreate();
     children != null ? children : children = inputValue;
     const css = {
-      textDecoration: "none",
+      alignItems: "center",
       color: "inherit",
-      userSelect: "none",
       display: "flex",
-      width: "100%",
-      alignItems: "center",
-      textAlign: "start",
       flex: "0 0 auto",
-      outline: 0,
       gap: "0.75rem",
+      outline: 0,
+      textAlign: "start",
+      textDecoration: "none",
+      userSelect: "none",
+      width: "100%",
       ...styles.item
     };
     return /* @__PURE__ */ jsxs(
@@ -39,7 +39,7 @@ var AutocompleteCreate = forwardRef(
         ...getCreateProps(rest, ref),
         children: [
           icon !== null ? /* @__PURE__ */ jsx(AutocompleteItemIcon, { children: icon || /* @__PURE__ */ jsx(AutocompletePlusIcon, {}) }) : null,
-          icon ? /* @__PURE__ */ jsx(ui.span, { style: { pointerEvents: "none", flex: 1 }, lineClamp: 1, children: runIfFunc(children, inputValue) }) : runIfFunc(children, inputValue)
+          icon ? /* @__PURE__ */ jsx(ui.span, { style: { flex: 1, pointerEvents: "none" }, lineClamp: 1, children: runIfFunc(children, inputValue) }) : runIfFunc(children, inputValue)
         ]
       }
     );
@@ -47,11 +47,11 @@ var AutocompleteCreate = forwardRef(
 );
 AutocompleteCreate.displayName = "AutocompleteCreate";
 AutocompleteCreate.__ui__ = "AutocompleteCreate";
-var AutocompletePlusIcon = () => /* @__PURE__ */ jsx("svg", { viewBox: "0 0 45.402 45.402", width: "1em", height: "1em", children: /* @__PURE__ */ jsx(
+var AutocompletePlusIcon = () => /* @__PURE__ */ jsx("svg", { height: "1em", viewBox: "0 0 45.402 45.402", width: "1em", children: /* @__PURE__ */ jsx(
   "path",
   {
-    fill: "currentColor",
-    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"
+    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",
+    fill: "currentColor"
   }
 ) });
 AutocompletePlusIcon.displayName = "AutocompletePlusIcon";
@@ -60,4 +60,4 @@ AutocompletePlusIcon.__ui__ = "AutocompletePlusIcon";
 export {
   AutocompleteCreate
 };
-//# sourceMappingURL=chunk-Q2HZVVOI.mjs.map
+//# sourceMappingURL=chunk-K5HCHHCJ.mjs.map

package/dist/chunk-K5HCHHCJ.mjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/autocomplete-create.tsx"],"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<\"li\">, \"children\">,\n    AutocompleteCreateOptions {}\n\nexport const AutocompleteCreate = forwardRef<AutocompleteCreateProps, \"li\">(\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.li\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.li>\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"],"mappings":";;;;;;;;;;;;AAEA,SAAS,YAAY,UAAU;AAC/B,SAAS,IAAI,iBAAiB;AA0CxB,SAOe,KAPf;AAtBC,IAAM,qBAAqB;AAAA,EAChC,CAAC,EAAE,WAAW,UAAU,MAAM,GAAG,KAAK,GAAG,QAAQ;AAC/C,UAAM,EAAE,YAAY,OAAO,IAAI,uBAAuB;AACtD,UAAM,EAAE,eAAe,IAAI,sBAAsB;AAEjD,6CAAa;AAEb,UAAM,MAAmB;AAAA,MACvB,YAAY;AAAA,MACZ,OAAO;AAAA,MACP,SAAS;AAAA,MACT,MAAM;AAAA,MACN,KAAK;AAAA,MACL,SAAS;AAAA,MACT,WAAW;AAAA,MACX,gBAAgB;AAAA,MAChB,YAAY;AAAA,MACZ,OAAO;AAAA,MACP,GAAG,OAAO;AAAA,IACZ;AAEA,WACE;AAAA,MAAC,GAAG;AAAA,MAAH;AAAA,QACC,WAAW,GAAG,iCAAiC,SAAS;AAAA,QACxD,OAAO;AAAA,QACN,GAAG,eAAe,MAAM,GAAG;AAAA,QAE3B;AAAA,mBAAS,OACR,oBAAC,wBACE,kBAAQ,oBAAC,wBAAqB,GACjC,IACE;AAAA,UACH,OACC,oBAAC,GAAG,MAAH,EAAQ,OAAO,EAAE,MAAM,GAAG,eAAe,OAAO,GAAG,WAAW,GAC5D,oBAAU,UAAU,UAAU,GACjC,IAEA,UAAU,UAAU,UAAU;AAAA;AAAA;AAAA,IAElC;AAAA,EAEJ;AACF;AAEA,mBAAmB,cAAc;AACjC,mBAAmB,SAAS;AAE5B,IAAM,uBAA2B,MAC/B,oBAAC,SAAI,QAAO,OAAM,SAAQ,qBAAoB,OAAM,OAClD;AAAA,EAAC;AAAA;AAAA,IACC,GAAE;AAAA,IACF,MAAK;AAAA;AACP,GACF;AAGF,qBAAqB,cAAc;AACnC,qBAAqB,SAAS;","names":[]}

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

@@ -2,31 +2,31 @@
 import {
   useAutocomplete,
   useAutocompleteInput
-} from "./chunk-OLOU5HFC.mjs";
+} from "./chunk-WERCEZNJ.mjs";
 import {
   AutocompleteCreate
-} from "./chunk-Q2HZVVOI.mjs";
+} from "./chunk-K5HCHHCJ.mjs";
 import {
   AutocompleteEmpty
-} from "./chunk-5GKGL6BL.mjs";
+} from "./chunk-2HJUFFCU.mjs";
 import {
   AutocompleteList
-} from "./chunk-S53LMDD7.mjs";
+} from "./chunk-VTBUO5SK.mjs";
 import {
   AutocompleteIcon
-} from "./chunk-7SWSKLSA.mjs";
+} from "./chunk-V6YCG642.mjs";
 import {
   AutocompleteDescendantsContextProvider,
   AutocompleteProvider,
   useAutocompleteContext
-} from "./chunk-JPUKYLBW.mjs";
+} from "./chunk-WDQYM4FP.mjs";
 
 // src/autocomplete.tsx
 import {
-  ui,
   forwardRef,
-  useComponentMultiStyle,
-  omitThemeProps
+  omitThemeProps,
+  ui,
+  useComponentMultiStyle
 } from "@yamada-ui/core";
 import { Popover, PopoverTrigger } from "@yamada-ui/popover";
 import { Portal } from "@yamada-ui/portal";
@@ -37,46 +37,46 @@ var Autocomplete = forwardRef(
     const [styles, mergedProps] = useComponentMultiStyle("Autocomplete", props);
     let {
       className,
-      defaultValue = "",
+      children,
       color,
+      defaultValue = "",
+      footer,
       h,
+      header,
       height,
       minH,
       minHeight,
       containerProps,
       contentProps,
-      listProps,
+      createProps,
+      emptyProps,
       fieldProps,
-      inputProps,
       iconProps,
+      inputProps,
+      listProps,
       portalProps = { isDisabled: true },
-      createProps,
-      emptyProps,
-      header,
-      footer,
-      children,
       ...computedProps
     } = omitThemeProps(mergedProps);
     const {
-      value,
-      onClose,
+      allowCreate,
+      computedChildren,
       descendants,
+      inputValue,
+      isEmpty,
+      value,
       formControlProps,
-      getPopoverProps,
       getContainerProps,
       getFieldProps,
-      allowCreate,
-      isEmpty,
-      inputValue,
-      computedChildren,
+      getPopoverProps,
+      onClose,
       ...rest
-    } = useAutocomplete({ ...computedProps, defaultValue, children });
+    } = useAutocomplete({ ...computedProps, children, defaultValue });
     h != null ? h : h = height;
     minH != null ? minH : minH = minHeight;
     const css = {
-      w: "100%",
-      h: "fit-content",
       color,
+      h: "fit-content",
+      w: "100%",
       ...styles.container
     };
     return /* @__PURE__ */ jsx(AutocompleteDescendantsContextProvider, { value: descendants, children: /* @__PURE__ */ jsx(
@@ -84,13 +84,13 @@ var Autocomplete = forwardRef(
       {
         value: {
           ...rest,
-          value,
-          onClose,
-          formControlProps,
-          inputValue,
           allowCreate,
+          inputValue,
           isEmpty,
-          styles
+          styles,
+          value,
+          formControlProps,
+          onClose
         },
         children: /* @__PURE__ */ jsx(Popover, { ...getPopoverProps(), children: /* @__PURE__ */ jsxs(
           ui.div,
@@ -121,8 +121,8 @@ var Autocomplete = forwardRef(
               !isEmpty ? /* @__PURE__ */ jsx(Portal, { ...portalProps, children: /* @__PURE__ */ jsxs(
                 AutocompleteList,
                 {
-                  header: runIfFunc(header, { value, onClose }),
                   footer: runIfFunc(footer, { value, onClose }),
+                  header: runIfFunc(header, { value, onClose }),
                   contentProps,
                   ...listProps,
                   children: [
@@ -133,8 +133,8 @@ var Autocomplete = forwardRef(
               ) }) : /* @__PURE__ */ jsx(Portal, { ...portalProps, children: /* @__PURE__ */ jsx(
                 AutocompleteList,
                 {
-                  header: runIfFunc(header, { value, onClose }),
                   footer: runIfFunc(footer, { value, onClose }),
+                  header: runIfFunc(header, { value, onClose }),
                   contentProps,
                   ...listProps,
                   children: allowCreate && inputValue ? /* @__PURE__ */ jsx(AutocompleteCreate, { ...createProps }) : /* @__PURE__ */ jsx(AutocompleteEmpty, { ...emptyProps })
@@ -151,14 +151,14 @@ Autocomplete.displayName = "Autocomplete";
 Autocomplete.__ui__ = "Autocomplete";
 var AutocompleteField = forwardRef(
   ({ className, h, minH, placeholder, inputProps, ...rest }, ref) => {
-    const { label, inputValue, styles } = useAutocompleteContext();
+    const { inputValue, label, styles } = useAutocompleteContext();
     const { getInputProps } = useAutocompleteInput();
     const css = {
-      pe: "2rem",
+      alignItems: "center",
+      display: "flex",
       h,
       minH,
-      display: "flex",
-      alignItems: "center",
+      pe: "2rem",
       ...styles.field,
       cursor: "text"
     };
@@ -173,8 +173,8 @@ var AutocompleteField = forwardRef(
           {
             className: "ui-autocomplete__field__input",
             display: "inline-block",
-            w: "100%",
             placeholder,
+            w: "100%",
             ...getInputProps(
               { ...inputProps, value: inputValue || label || "" },
               ref
@@ -191,4 +191,4 @@ AutocompleteField.__ui__ = "AutocompleteField";
 export {
   Autocomplete
 };
-//# sourceMappingURL=chunk-HZECQUHV.mjs.map
+//# sourceMappingURL=chunk-Q33EMTO2.mjs.map