@yamada-ui/autocomplete 1.5.4-next-20241005220055 → 1.5.4-next-20241008193728

Sign up to get free protection for your applications and to get access to all the features.
Files changed (100) hide show
  1. package/dist/autocomplete-context.d.mts +115 -115
  2. package/dist/autocomplete-context.d.ts +115 -115
  3. package/dist/autocomplete-context.js +2 -2
  4. package/dist/autocomplete-context.js.map +1 -1
  5. package/dist/autocomplete-context.mjs +1 -1
  6. package/dist/autocomplete-create.d.mts +4 -4
  7. package/dist/autocomplete-create.d.ts +4 -4
  8. package/dist/autocomplete-create.js +32 -32
  9. package/dist/autocomplete-create.js.map +1 -1
  10. package/dist/autocomplete-create.mjs +4 -4
  11. package/dist/autocomplete-empty.d.mts +4 -4
  12. package/dist/autocomplete-empty.d.ts +4 -4
  13. package/dist/autocomplete-empty.js +34 -34
  14. package/dist/autocomplete-empty.js.map +1 -1
  15. package/dist/autocomplete-empty.mjs +4 -4
  16. package/dist/autocomplete-icon.js +17 -17
  17. package/dist/autocomplete-icon.js.map +1 -1
  18. package/dist/autocomplete-icon.mjs +2 -2
  19. package/dist/autocomplete-list.d.mts +2 -2
  20. package/dist/autocomplete-list.d.ts +2 -2
  21. package/dist/autocomplete-list.js +18 -18
  22. package/dist/autocomplete-list.js.map +1 -1
  23. package/dist/autocomplete-list.mjs +3 -3
  24. package/dist/autocomplete-option-group.js +10 -10
  25. package/dist/autocomplete-option-group.js.map +1 -1
  26. package/dist/autocomplete-option-group.mjs +3 -3
  27. package/dist/autocomplete-option.d.mts +1 -1
  28. package/dist/autocomplete-option.d.ts +1 -1
  29. package/dist/autocomplete-option.js +47 -47
  30. package/dist/autocomplete-option.js.map +1 -1
  31. package/dist/autocomplete-option.mjs +4 -4
  32. package/dist/autocomplete.d.mts +31 -31
  33. package/dist/autocomplete.d.ts +31 -31
  34. package/dist/autocomplete.js +294 -292
  35. package/dist/autocomplete.js.map +1 -1
  36. package/dist/autocomplete.mjs +12 -12
  37. package/dist/{chunk-6F3LT7J6.mjs → chunk-4SBNPEK7.mjs} +7 -7
  38. package/dist/{chunk-6F3LT7J6.mjs.map → chunk-4SBNPEK7.mjs.map} +1 -1
  39. package/dist/{chunk-JMX72TSD.mjs → chunk-67X7JKWL.mjs} +7 -7
  40. package/dist/{chunk-JMX72TSD.mjs.map → chunk-67X7JKWL.mjs.map} +1 -1
  41. package/dist/{chunk-HZECQUHV.mjs → chunk-AXC7ILCH.mjs} +40 -40
  42. package/dist/{chunk-HZECQUHV.mjs.map → chunk-AXC7ILCH.mjs.map} +1 -1
  43. package/dist/{chunk-OLOU5HFC.mjs → chunk-BGZIX6SN.mjs} +168 -166
  44. package/dist/chunk-BGZIX6SN.mjs.map +1 -0
  45. package/dist/{chunk-Q2HZVVOI.mjs → chunk-BKW7XJ6R.mjs} +16 -16
  46. package/dist/chunk-BKW7XJ6R.mjs.map +1 -0
  47. package/dist/{chunk-5LPWFWE6.mjs → chunk-DDMSYTKO.mjs} +34 -34
  48. package/dist/chunk-DDMSYTKO.mjs.map +1 -0
  49. package/dist/{chunk-QPIWG4ZF.mjs → chunk-EEECVCVW.mjs} +63 -61
  50. package/dist/chunk-EEECVCVW.mjs.map +1 -0
  51. package/dist/{chunk-5GKGL6BL.mjs → chunk-KLXMUIGY.mjs} +16 -16
  52. package/dist/chunk-KLXMUIGY.mjs.map +1 -0
  53. package/dist/{chunk-R76HPAN4.mjs → chunk-TR4X4EEG.mjs} +7 -7
  54. package/dist/{chunk-R76HPAN4.mjs.map → chunk-TR4X4EEG.mjs.map} +1 -1
  55. package/dist/{chunk-7SWSKLSA.mjs → chunk-V6YCG642.mjs} +18 -18
  56. package/dist/chunk-V6YCG642.mjs.map +1 -0
  57. package/dist/{chunk-S53LMDD7.mjs → chunk-VTBUO5SK.mjs} +15 -15
  58. package/dist/chunk-VTBUO5SK.mjs.map +1 -0
  59. package/dist/{chunk-JPUKYLBW.mjs → chunk-WDQYM4FP.mjs} +5 -5
  60. package/dist/chunk-WDQYM4FP.mjs.map +1 -0
  61. package/dist/{chunk-S2HFYJVI.mjs → chunk-WFLZPB35.mjs} +13 -13
  62. package/dist/chunk-WFLZPB35.mjs.map +1 -0
  63. package/dist/index.d.mts +4 -4
  64. package/dist/index.d.ts +4 -4
  65. package/dist/index.js +347 -343
  66. package/dist/index.js.map +1 -1
  67. package/dist/index.mjs +13 -13
  68. package/dist/multi-autocomplete.d.mts +51 -51
  69. package/dist/multi-autocomplete.d.ts +51 -51
  70. package/dist/multi-autocomplete.js +317 -313
  71. package/dist/multi-autocomplete.js.map +1 -1
  72. package/dist/multi-autocomplete.mjs +12 -12
  73. package/dist/use-autocomplete-list.d.mts +1 -1
  74. package/dist/use-autocomplete-list.d.ts +1 -1
  75. package/dist/use-autocomplete-list.js +7 -7
  76. package/dist/use-autocomplete-list.js.map +1 -1
  77. package/dist/use-autocomplete-list.mjs +2 -2
  78. package/dist/use-autocomplete-option-group.js +7 -7
  79. package/dist/use-autocomplete-option-group.js.map +1 -1
  80. package/dist/use-autocomplete-option-group.mjs +2 -2
  81. package/dist/use-autocomplete-option.d.mts +12 -12
  82. package/dist/use-autocomplete-option.d.ts +12 -12
  83. package/dist/use-autocomplete-option.js +34 -34
  84. package/dist/use-autocomplete-option.js.map +1 -1
  85. package/dist/use-autocomplete-option.mjs +2 -2
  86. package/dist/use-autocomplete.d.mts +86 -86
  87. package/dist/use-autocomplete.d.ts +86 -86
  88. package/dist/use-autocomplete.js +216 -214
  89. package/dist/use-autocomplete.js.map +1 -1
  90. package/dist/use-autocomplete.mjs +7 -7
  91. package/package.json +13 -13
  92. package/dist/chunk-5GKGL6BL.mjs.map +0 -1
  93. package/dist/chunk-5LPWFWE6.mjs.map +0 -1
  94. package/dist/chunk-7SWSKLSA.mjs.map +0 -1
  95. package/dist/chunk-JPUKYLBW.mjs.map +0 -1
  96. package/dist/chunk-OLOU5HFC.mjs.map +0 -1
  97. package/dist/chunk-Q2HZVVOI.mjs.map +0 -1
  98. package/dist/chunk-QPIWG4ZF.mjs.map +0 -1
  99. package/dist/chunk-S2HFYJVI.mjs.map +0 -1
  100. package/dist/chunk-S53LMDD7.mjs.map +0 -1
@@ -1,24 +1,24 @@
1
1
  "use client"
2
2
  import {
3
3
  useAutocompleteOptionGroup
4
- } from "./chunk-JMX72TSD.mjs";
4
+ } from "./chunk-67X7JKWL.mjs";
5
5
  import {
6
6
  useAutocompleteContext
7
- } from "./chunk-JPUKYLBW.mjs";
7
+ } from "./chunk-WDQYM4FP.mjs";
8
8
 
9
9
  // src/autocomplete-option-group.tsx
10
- import { ui, forwardRef } from "@yamada-ui/core";
10
+ import { forwardRef, ui } from "@yamada-ui/core";
11
11
  import { cx } from "@yamada-ui/utils";
12
12
  import { jsx, jsxs } from "react/jsx-runtime";
13
13
  var AutocompleteOptionGroup = forwardRef(
14
14
  ({
15
15
  className,
16
+ children,
16
17
  color,
17
18
  h,
18
19
  height,
19
20
  minH,
20
21
  minHeight,
21
- children,
22
22
  labelProps,
23
23
  ...rest
24
24
  }, ref) => {
@@ -34,15 +34,15 @@ var AutocompleteOptionGroup = forwardRef(
34
34
  "ui-autocomplete__item--group",
35
35
  className
36
36
  ),
37
- __css: { w: "100%", h: "fit-content", color },
37
+ __css: { color, h: "fit-content", w: "100%" },
38
38
  ...getContainerProps(),
39
39
  children: [
40
40
  /* @__PURE__ */ jsx(
41
41
  ui.span,
42
42
  {
43
43
  className: "ui-autocomplete__item__group-label",
44
- __css: styles.groupLabel,
45
44
  lineClamp: 1,
45
+ __css: styles.groupLabel,
46
46
  ...labelProps,
47
47
  children: label
48
48
  }
@@ -67,4 +67,4 @@ AutocompleteOptionGroup.__ui__ = "AutocompleteOptionGroup";
67
67
  export {
68
68
  AutocompleteOptionGroup
69
69
  };
70
- //# sourceMappingURL=chunk-6F3LT7J6.mjs.map
70
+ //# sourceMappingURL=chunk-4SBNPEK7.mjs.map
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/autocomplete-option-group.tsx"],"sourcesContent":["import type { HTMLUIProps } from \"@yamada-ui/core\"\nimport { ui, forwardRef } from \"@yamada-ui/core\"\nimport { cx } from \"@yamada-ui/utils\"\nimport { useAutocompleteContext } from \"./autocomplete-context\"\nimport type { UseAutocompleteOptionGroupProps } from \"./use-autocomplete-option-group\"\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<\"span\">\n}\n\nexport interface AutocompleteOptionGroupProps\n extends HTMLUIProps<\"ul\">,\n AutocompleteOptionGroupOptions {}\n\nexport const AutocompleteOptionGroup = forwardRef<\n AutocompleteOptionGroupProps,\n \"ul\"\n>(\n (\n {\n className,\n color,\n h,\n height,\n minH,\n minHeight,\n children,\n labelProps,\n ...rest\n },\n ref,\n ) => {\n const { styles } = useAutocompleteContext()\n const { label, getContainerProps, getGroupProps } =\n useAutocompleteOptionGroup(rest)\n\n h ??= height\n minH ??= minHeight\n\n return (\n <ui.li\n className={cx(\n \"ui-autocomplete__item\",\n \"ui-autocomplete__item--group\",\n className,\n )}\n __css={{ w: \"100%\", h: \"fit-content\", color }}\n {...getContainerProps()}\n >\n <ui.span\n className=\"ui-autocomplete__item__group-label\"\n __css={styles.groupLabel}\n lineClamp={1}\n {...labelProps}\n >\n {label}\n </ui.span>\n\n <ui.ul\n {...getGroupProps({}, ref)}\n className=\"ui-autocomplete__item__group\"\n __css={{ h, minH, ...styles.group }}\n >\n {children}\n </ui.ul>\n </ui.li>\n )\n },\n)\n\nAutocompleteOptionGroup.displayName = \"AutocompleteOptionGroup\"\nAutocompleteOptionGroup.__ui__ = \"AutocompleteOptionGroup\"\n"],"mappings":";;;;;;;;;AACA,SAAS,IAAI,kBAAkB;AAC/B,SAAS,UAAU;AA2Cb,SASE,KATF;AA1BC,IAAM,0BAA0B;AAAA,EAIrC,CACE;AAAA,IACE;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,GAAG;AAAA,EACL,GACA,QACG;AACH,UAAM,EAAE,OAAO,IAAI,uBAAuB;AAC1C,UAAM,EAAE,OAAO,mBAAmB,cAAc,IAC9C,2BAA2B,IAAI;AAEjC,wBAAM;AACN,iCAAS;AAET,WACE;AAAA,MAAC,GAAG;AAAA,MAAH;AAAA,QACC,WAAW;AAAA,UACT;AAAA,UACA;AAAA,UACA;AAAA,QACF;AAAA,QACA,OAAO,EAAE,GAAG,QAAQ,GAAG,eAAe,MAAM;AAAA,QAC3C,GAAG,kBAAkB;AAAA,QAEtB;AAAA;AAAA,YAAC,GAAG;AAAA,YAAH;AAAA,cACC,WAAU;AAAA,cACV,OAAO,OAAO;AAAA,cACd,WAAW;AAAA,cACV,GAAG;AAAA,cAEH;AAAA;AAAA,UACH;AAAA,UAEA;AAAA,YAAC,GAAG;AAAA,YAAH;AAAA,cACE,GAAG,cAAc,CAAC,GAAG,GAAG;AAAA,cACzB,WAAU;AAAA,cACV,OAAO,EAAE,GAAG,MAAM,GAAG,OAAO,MAAM;AAAA,cAEjC;AAAA;AAAA,UACH;AAAA;AAAA;AAAA,IACF;AAAA,EAEJ;AACF;AAEA,wBAAwB,cAAc;AACtC,wBAAwB,SAAS;","names":[]}
1
+ {"version":3,"sources":["../src/autocomplete-option-group.tsx"],"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<\"span\">\n}\n\nexport interface AutocompleteOptionGroupProps\n extends HTMLUIProps<\"ul\">,\n AutocompleteOptionGroupOptions {}\n\nexport const AutocompleteOptionGroup = forwardRef<\n AutocompleteOptionGroupProps,\n \"ul\"\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 } =\n useAutocompleteOptionGroup(rest)\n\n h ??= height\n minH ??= minHeight\n\n return (\n <ui.li\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.span\n className=\"ui-autocomplete__item__group-label\"\n lineClamp={1}\n __css={styles.groupLabel}\n {...labelProps}\n >\n {label}\n </ui.span>\n\n <ui.ul\n {...getGroupProps({}, ref)}\n className=\"ui-autocomplete__item__group\"\n __css={{ h, minH, ...styles.group }}\n >\n {children}\n </ui.ul>\n </ui.li>\n )\n },\n)\n\nAutocompleteOptionGroup.displayName = \"AutocompleteOptionGroup\"\nAutocompleteOptionGroup.__ui__ = \"AutocompleteOptionGroup\"\n"],"mappings":";;;;;;;;;AAEA,SAAS,YAAY,UAAU;AAC/B,SAAS,UAAU;AA0Cb,SASE,KATF;AA1BC,IAAM,0BAA0B;AAAA,EAIrC,CACE;AAAA,IACE;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,GAAG;AAAA,EACL,GACA,QACG;AACH,UAAM,EAAE,OAAO,IAAI,uBAAuB;AAC1C,UAAM,EAAE,OAAO,mBAAmB,cAAc,IAC9C,2BAA2B,IAAI;AAEjC,wBAAM;AACN,iCAAS;AAET,WACE;AAAA,MAAC,GAAG;AAAA,MAAH;AAAA,QACC,WAAW;AAAA,UACT;AAAA,UACA;AAAA,UACA;AAAA,QACF;AAAA,QACA,OAAO,EAAE,OAAO,GAAG,eAAe,GAAG,OAAO;AAAA,QAC3C,GAAG,kBAAkB;AAAA,QAEtB;AAAA;AAAA,YAAC,GAAG;AAAA,YAAH;AAAA,cACC,WAAU;AAAA,cACV,WAAW;AAAA,cACX,OAAO,OAAO;AAAA,cACb,GAAG;AAAA,cAEH;AAAA;AAAA,UACH;AAAA,UAEA;AAAA,YAAC,GAAG;AAAA,YAAH;AAAA,cACE,GAAG,cAAc,CAAC,GAAG,GAAG;AAAA,cACzB,WAAU;AAAA,cACV,OAAO,EAAE,GAAG,MAAM,GAAG,OAAO,MAAM;AAAA,cAEjC;AAAA;AAAA,UACH;AAAA;AAAA;AAAA,IACF;AAAA,EAEJ;AACF;AAEA,wBAAwB,cAAc;AACtC,wBAAwB,SAAS;","names":[]}
@@ -2,7 +2,7 @@
2
2
  import {
3
3
  useAutocompleteContext,
4
4
  useAutocompleteDescendantsContext
5
- } from "./chunk-JPUKYLBW.mjs";
5
+ } from "./chunk-WDQYM4FP.mjs";
6
6
 
7
7
  // src/use-autocomplete-option-group.ts
8
8
  import { layoutStyleProperties } from "@yamada-ui/core";
@@ -12,7 +12,7 @@ var useAutocompleteOptionGroup = ({
12
12
  label,
13
13
  ...rest
14
14
  }) => {
15
- const { value, omitSelectedValues } = useAutocompleteContext();
15
+ const { omitSelectedValues, value } = useAutocompleteContext();
16
16
  const isMulti = isArray(value);
17
17
  const descendants = useAutocompleteDescendantsContext();
18
18
  const values = descendants.values();
@@ -24,7 +24,7 @@ var useAutocompleteOptionGroup = ({
24
24
  ) : [];
25
25
  const selectedIndexes = selectedValues.map(({ index }) => index);
26
26
  const childValues = values.filter(
27
- ({ node, index }) => {
27
+ ({ index, node }) => {
28
28
  var _a;
29
29
  return ((_a = node.parentElement) == null ? void 0 : _a.dataset.label) === label && !selectedIndexes.includes(index) && "target" in node.dataset;
30
30
  }
@@ -37,12 +37,12 @@ var useAutocompleteOptionGroup = ({
37
37
  border: "0px",
38
38
  clip: "rect(0px, 0px, 0px, 0px)",
39
39
  height: "1px",
40
- width: "1px",
41
40
  margin: "-1px",
42
- padding: "0px",
43
41
  overflow: "hidden",
42
+ padding: "0px",
43
+ position: "absolute",
44
44
  whiteSpace: "nowrap",
45
- position: "absolute"
45
+ width: "1px"
46
46
  };
47
47
  return {
48
48
  ref,
@@ -75,4 +75,4 @@ var useAutocompleteOptionGroup = ({
75
75
  export {
76
76
  useAutocompleteOptionGroup
77
77
  };
78
- //# sourceMappingURL=chunk-JMX72TSD.mjs.map
78
+ //# sourceMappingURL=chunk-67X7JKWL.mjs.map
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/use-autocomplete-option-group.ts"],"sourcesContent":["import type { HTMLUIProps, PropGetter } from \"@yamada-ui/core\"\nimport { layoutStyleProperties } from \"@yamada-ui/core\"\nimport { isArray, splitObject } from \"@yamada-ui/utils\"\nimport type { CSSProperties } from \"react\"\nimport { useCallback } from \"react\"\nimport {\n useAutocompleteContext,\n useAutocompleteDescendantsContext,\n} from \"./autocomplete-context\"\n\nexport interface UseAutocompleteOptionGroupProps extends HTMLUIProps<\"ul\"> {\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 { value, omitSelectedValues } = useAutocompleteContext()\n\n const isMulti = isArray(value)\n\n const descendants = useAutocompleteDescendantsContext()\n\n const values = descendants.values()\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 ({ node, index }) =>\n node.parentElement?.dataset.label === label &&\n !selectedIndexes.includes(index) &&\n \"target\" in node.dataset,\n )\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 width: \"1px\",\n margin: \"-1px\",\n padding: \"0px\",\n overflow: \"hidden\",\n whiteSpace: \"nowrap\",\n position: \"absolute\",\n }\n\n return {\n ref,\n ...props,\n ...containerProps,\n style: isEmpty ? style : undefined,\n \"data-label\": label,\n role: \"autocomplete-group-container\",\n }\n },\n [containerProps, isEmpty, label],\n )\n\n const getGroupProps: PropGetter<\"ul\"> = useCallback(\n (props = {}, ref = null) => ({\n ref,\n ...props,\n ...groupProps,\n \"data-label\": label,\n role: \"autocomplete-group\",\n }),\n [groupProps, label],\n )\n\n return {\n label,\n getContainerProps,\n getGroupProps,\n }\n}\n\nexport type UseAutocompleteOptionGroupReturn = ReturnType<\n typeof useAutocompleteOptionGroup\n>\n"],"mappings":";;;;;;;AACA,SAAS,6BAA6B;AACtC,SAAS,SAAS,mBAAmB;AAErC,SAAS,mBAAmB;AAarB,IAAM,6BAA6B,CAAC;AAAA,EACzC;AAAA,EACA,GAAG;AACL,MAAuC;AACrC,QAAM,EAAE,OAAO,mBAAmB,IAAI,uBAAuB;AAE7D,QAAM,UAAU,QAAQ,KAAK;AAE7B,QAAM,cAAc,kCAAkC;AAEtD,QAAM,SAAS,YAAY,OAAO;AAClC,QAAM,iBACJ,WAAW,qBACP,YAAY;AAAA,IAAO,CAAC,EAAE,KAAK,MAAG;AA9BtC;AA+BU,mBAAM,UAAS,UAAK,QAAQ,UAAb,YAAsB,EAAE;AAAA;AAAA,EACzC,IACA,CAAC;AACP,QAAM,kBAAkB,eAAe,IAAI,CAAC,EAAE,MAAM,MAAM,KAAK;AAC/D,QAAM,cAAc,OAAO;AAAA,IACzB,CAAC,EAAE,MAAM,MAAM,MAAG;AApCtB;AAqCM,yBAAK,kBAAL,mBAAoB,QAAQ,WAAU,SACtC,CAAC,gBAAgB,SAAS,KAAK,KAC/B,YAAY,KAAK;AAAA;AAAA,EACrB;AAEA,QAAM,UAAU,CAAC,YAAY;AAE7B,QAAM,CAAC,gBAAgB,UAAU,IAAI,YAAY,MAAM,qBAAqB;AAE5E,QAAM,oBAAsC;AAAA,IAC1C,CAAC,QAAQ,CAAC,GAAG,MAAM,SAAS;AAC1B,YAAM,QAAuB;AAAA,QAC3B,QAAQ;AAAA,QACR,MAAM;AAAA,QACN,QAAQ;AAAA,QACR,OAAO;AAAA,QACP,QAAQ;AAAA,QACR,SAAS;AAAA,QACT,UAAU;AAAA,QACV,YAAY;AAAA,QACZ,UAAU;AAAA,MACZ;AAEA,aAAO;AAAA,QACL;AAAA,QACA,GAAG;AAAA,QACH,GAAG;AAAA,QACH,OAAO,UAAU,QAAQ;AAAA,QACzB,cAAc;AAAA,QACd,MAAM;AAAA,MACR;AAAA,IACF;AAAA,IACA,CAAC,gBAAgB,SAAS,KAAK;AAAA,EACjC;AAEA,QAAM,gBAAkC;AAAA,IACtC,CAAC,QAAQ,CAAC,GAAG,MAAM,UAAU;AAAA,MAC3B;AAAA,MACA,GAAG;AAAA,MACH,GAAG;AAAA,MACH,cAAc;AAAA,MACd,MAAM;AAAA,IACR;AAAA,IACA,CAAC,YAAY,KAAK;AAAA,EACpB;AAEA,SAAO;AAAA,IACL;AAAA,IACA;AAAA,IACA;AAAA,EACF;AACF;","names":[]}
1
+ {"version":3,"sources":["../src/use-autocomplete-option-group.ts"],"sourcesContent":["import type { HTMLUIProps, PropGetter } from \"@yamada-ui/core\"\nimport type { CSSProperties } from \"react\"\nimport { layoutStyleProperties } from \"@yamada-ui/core\"\nimport { isArray, splitObject } from \"@yamada-ui/utils\"\nimport { useCallback } from \"react\"\nimport {\n useAutocompleteContext,\n useAutocompleteDescendantsContext,\n} from \"./autocomplete-context\"\n\nexport interface UseAutocompleteOptionGroupProps extends HTMLUIProps<\"ul\"> {\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\n const isMulti = isArray(value)\n\n const descendants = useAutocompleteDescendantsContext()\n\n const values = descendants.values()\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\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 ...props,\n ...containerProps,\n style: isEmpty ? style : undefined,\n \"data-label\": label,\n role: \"autocomplete-group-container\",\n }\n },\n [containerProps, isEmpty, label],\n )\n\n const getGroupProps: PropGetter<\"ul\"> = useCallback(\n (props = {}, ref = null) => ({\n ref,\n ...props,\n ...groupProps,\n \"data-label\": label,\n role: \"autocomplete-group\",\n }),\n [groupProps, label],\n )\n\n return {\n label,\n getContainerProps,\n getGroupProps,\n }\n}\n\nexport type UseAutocompleteOptionGroupReturn = ReturnType<\n typeof useAutocompleteOptionGroup\n>\n"],"mappings":";;;;;;;AAEA,SAAS,6BAA6B;AACtC,SAAS,SAAS,mBAAmB;AACrC,SAAS,mBAAmB;AAarB,IAAM,6BAA6B,CAAC;AAAA,EACzC;AAAA,EACA,GAAG;AACL,MAAuC;AACrC,QAAM,EAAE,oBAAoB,MAAM,IAAI,uBAAuB;AAE7D,QAAM,UAAU,QAAQ,KAAK;AAE7B,QAAM,cAAc,kCAAkC;AAEtD,QAAM,SAAS,YAAY,OAAO;AAClC,QAAM,iBACJ,WAAW,qBACP,YAAY;AAAA,IAAO,CAAC,EAAE,KAAK,MAAG;AA9BtC;AA+BU,mBAAM,UAAS,UAAK,QAAQ,UAAb,YAAsB,EAAE;AAAA;AAAA,EACzC,IACA,CAAC;AACP,QAAM,kBAAkB,eAAe,IAAI,CAAC,EAAE,MAAM,MAAM,KAAK;AAC/D,QAAM,cAAc,OAAO;AAAA,IACzB,CAAC,EAAE,OAAO,KAAK,MAAG;AApCtB;AAqCM,yBAAK,kBAAL,mBAAoB,QAAQ,WAAU,SACtC,CAAC,gBAAgB,SAAS,KAAK,KAC/B,YAAY,KAAK;AAAA;AAAA,EACrB;AAEA,QAAM,UAAU,CAAC,YAAY;AAE7B,QAAM,CAAC,gBAAgB,UAAU,IAAI,YAAY,MAAM,qBAAqB;AAE5E,QAAM,oBAAsC;AAAA,IAC1C,CAAC,QAAQ,CAAC,GAAG,MAAM,SAAS;AAC1B,YAAM,QAAuB;AAAA,QAC3B,QAAQ;AAAA,QACR,MAAM;AAAA,QACN,QAAQ;AAAA,QACR,QAAQ;AAAA,QACR,UAAU;AAAA,QACV,SAAS;AAAA,QACT,UAAU;AAAA,QACV,YAAY;AAAA,QACZ,OAAO;AAAA,MACT;AAEA,aAAO;AAAA,QACL;AAAA,QACA,GAAG;AAAA,QACH,GAAG;AAAA,QACH,OAAO,UAAU,QAAQ;AAAA,QACzB,cAAc;AAAA,QACd,MAAM;AAAA,MACR;AAAA,IACF;AAAA,IACA,CAAC,gBAAgB,SAAS,KAAK;AAAA,EACjC;AAEA,QAAM,gBAAkC;AAAA,IACtC,CAAC,QAAQ,CAAC,GAAG,MAAM,UAAU;AAAA,MAC3B;AAAA,MACA,GAAG;AAAA,MACH,GAAG;AAAA,MACH,cAAc;AAAA,MACd,MAAM;AAAA,IACR;AAAA,IACA,CAAC,YAAY,KAAK;AAAA,EACpB;AAEA,SAAO;AAAA,IACL;AAAA,IACA;AAAA,IACA;AAAA,EACF;AACF;","names":[]}
@@ -2,31 +2,31 @@
2
2
  import {
3
3
  useAutocomplete,
4
4
  useAutocompleteInput
5
- } from "./chunk-OLOU5HFC.mjs";
5
+ } from "./chunk-BGZIX6SN.mjs";
6
6
  import {
7
7
  AutocompleteCreate
8
- } from "./chunk-Q2HZVVOI.mjs";
8
+ } from "./chunk-BKW7XJ6R.mjs";
9
9
  import {
10
10
  AutocompleteEmpty
11
- } from "./chunk-5GKGL6BL.mjs";
11
+ } from "./chunk-KLXMUIGY.mjs";
12
12
  import {
13
13
  AutocompleteList
14
- } from "./chunk-S53LMDD7.mjs";
14
+ } from "./chunk-VTBUO5SK.mjs";
15
15
  import {
16
16
  AutocompleteIcon
17
- } from "./chunk-7SWSKLSA.mjs";
17
+ } from "./chunk-V6YCG642.mjs";
18
18
  import {
19
19
  AutocompleteDescendantsContextProvider,
20
20
  AutocompleteProvider,
21
21
  useAutocompleteContext
22
- } from "./chunk-JPUKYLBW.mjs";
22
+ } from "./chunk-WDQYM4FP.mjs";
23
23
 
24
24
  // src/autocomplete.tsx
25
25
  import {
26
- ui,
27
26
  forwardRef,
28
- useComponentMultiStyle,
29
- omitThemeProps
27
+ omitThemeProps,
28
+ ui,
29
+ useComponentMultiStyle
30
30
  } from "@yamada-ui/core";
31
31
  import { Popover, PopoverTrigger } from "@yamada-ui/popover";
32
32
  import { Portal } from "@yamada-ui/portal";
@@ -37,46 +37,46 @@ var Autocomplete = forwardRef(
37
37
  const [styles, mergedProps] = useComponentMultiStyle("Autocomplete", props);
38
38
  let {
39
39
  className,
40
- defaultValue = "",
40
+ children,
41
41
  color,
42
+ defaultValue = "",
43
+ footer,
42
44
  h,
45
+ header,
43
46
  height,
44
47
  minH,
45
48
  minHeight,
46
49
  containerProps,
47
50
  contentProps,
48
- listProps,
51
+ createProps,
52
+ emptyProps,
49
53
  fieldProps,
50
- inputProps,
51
54
  iconProps,
55
+ inputProps,
56
+ listProps,
52
57
  portalProps = { isDisabled: true },
53
- createProps,
54
- emptyProps,
55
- header,
56
- footer,
57
- children,
58
58
  ...computedProps
59
59
  } = omitThemeProps(mergedProps);
60
60
  const {
61
- value,
62
- onClose,
61
+ allowCreate,
62
+ computedChildren,
63
63
  descendants,
64
+ inputValue,
65
+ isEmpty,
66
+ value,
64
67
  formControlProps,
65
- getPopoverProps,
66
68
  getContainerProps,
67
69
  getFieldProps,
68
- allowCreate,
69
- isEmpty,
70
- inputValue,
71
- computedChildren,
70
+ getPopoverProps,
71
+ onClose,
72
72
  ...rest
73
- } = useAutocomplete({ ...computedProps, defaultValue, children });
73
+ } = useAutocomplete({ ...computedProps, children, defaultValue });
74
74
  h != null ? h : h = height;
75
75
  minH != null ? minH : minH = minHeight;
76
76
  const css = {
77
- w: "100%",
78
- h: "fit-content",
79
77
  color,
78
+ h: "fit-content",
79
+ w: "100%",
80
80
  ...styles.container
81
81
  };
82
82
  return /* @__PURE__ */ jsx(AutocompleteDescendantsContextProvider, { value: descendants, children: /* @__PURE__ */ jsx(
@@ -84,13 +84,13 @@ var Autocomplete = forwardRef(
84
84
  {
85
85
  value: {
86
86
  ...rest,
87
- value,
88
- onClose,
89
- formControlProps,
90
- inputValue,
91
87
  allowCreate,
88
+ inputValue,
92
89
  isEmpty,
93
- styles
90
+ styles,
91
+ value,
92
+ formControlProps,
93
+ onClose
94
94
  },
95
95
  children: /* @__PURE__ */ jsx(Popover, { ...getPopoverProps(), children: /* @__PURE__ */ jsxs(
96
96
  ui.div,
@@ -121,8 +121,8 @@ var Autocomplete = forwardRef(
121
121
  !isEmpty ? /* @__PURE__ */ jsx(Portal, { ...portalProps, children: /* @__PURE__ */ jsxs(
122
122
  AutocompleteList,
123
123
  {
124
- header: runIfFunc(header, { value, onClose }),
125
124
  footer: runIfFunc(footer, { value, onClose }),
125
+ header: runIfFunc(header, { value, onClose }),
126
126
  contentProps,
127
127
  ...listProps,
128
128
  children: [
@@ -133,8 +133,8 @@ var Autocomplete = forwardRef(
133
133
  ) }) : /* @__PURE__ */ jsx(Portal, { ...portalProps, children: /* @__PURE__ */ jsx(
134
134
  AutocompleteList,
135
135
  {
136
- header: runIfFunc(header, { value, onClose }),
137
136
  footer: runIfFunc(footer, { value, onClose }),
137
+ header: runIfFunc(header, { value, onClose }),
138
138
  contentProps,
139
139
  ...listProps,
140
140
  children: allowCreate && inputValue ? /* @__PURE__ */ jsx(AutocompleteCreate, { ...createProps }) : /* @__PURE__ */ jsx(AutocompleteEmpty, { ...emptyProps })
@@ -151,14 +151,14 @@ Autocomplete.displayName = "Autocomplete";
151
151
  Autocomplete.__ui__ = "Autocomplete";
152
152
  var AutocompleteField = forwardRef(
153
153
  ({ className, h, minH, placeholder, inputProps, ...rest }, ref) => {
154
- const { label, inputValue, styles } = useAutocompleteContext();
154
+ const { inputValue, label, styles } = useAutocompleteContext();
155
155
  const { getInputProps } = useAutocompleteInput();
156
156
  const css = {
157
- pe: "2rem",
157
+ alignItems: "center",
158
+ display: "flex",
158
159
  h,
159
160
  minH,
160
- display: "flex",
161
- alignItems: "center",
161
+ pe: "2rem",
162
162
  ...styles.field,
163
163
  cursor: "text"
164
164
  };
@@ -173,8 +173,8 @@ var AutocompleteField = forwardRef(
173
173
  {
174
174
  className: "ui-autocomplete__field__input",
175
175
  display: "inline-block",
176
- w: "100%",
177
176
  placeholder,
177
+ w: "100%",
178
178
  ...getInputProps(
179
179
  { ...inputProps, value: inputValue || label || "" },
180
180
  ref
@@ -191,4 +191,4 @@ AutocompleteField.__ui__ = "AutocompleteField";
191
191
  export {
192
192
  Autocomplete
193
193
  };
194
- //# sourceMappingURL=chunk-HZECQUHV.mjs.map
194
+ //# sourceMappingURL=chunk-AXC7ILCH.mjs.map
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/autocomplete.tsx"],"sourcesContent":["import type { CSSUIObject, HTMLUIProps, ThemeProps } from \"@yamada-ui/core\"\nimport {\n ui,\n forwardRef,\n useComponentMultiStyle,\n omitThemeProps,\n} from \"@yamada-ui/core\"\nimport type { MotionProps } from \"@yamada-ui/motion\"\nimport { Popover, PopoverTrigger } from \"@yamada-ui/popover\"\nimport { Portal } from \"@yamada-ui/portal\"\nimport type { PortalProps } from \"@yamada-ui/portal\"\nimport { cx, runIfFunc } from \"@yamada-ui/utils\"\nimport type { FC, ReactNode } from \"react\"\nimport {\n AutocompleteDescendantsContextProvider,\n AutocompleteProvider,\n useAutocompleteContext,\n} from \"./autocomplete-context\"\nimport { AutocompleteCreate } from \"./autocomplete-create\"\nimport type { AutocompleteCreateProps } from \"./autocomplete-create\"\nimport { AutocompleteEmpty } from \"./autocomplete-empty\"\nimport type { AutocompleteEmptyProps } from \"./autocomplete-empty\"\nimport type { AutocompleteIconProps } from \"./autocomplete-icon\"\nimport { AutocompleteIcon } from \"./autocomplete-icon\"\nimport type { AutocompleteListProps } from \"./autocomplete-list\"\nimport { AutocompleteList } from \"./autocomplete-list\"\nimport type { UseAutocompleteProps } from \"./use-autocomplete\"\nimport { useAutocomplete, useAutocompleteInput } from \"./use-autocomplete\"\n\ninterface AutocompleteOptions {\n /**\n * The border color when the input is focused.\n */\n focusBorderColor?: string\n /**\n * The border color when the input is invalid.\n */\n errorBorderColor?: string\n /**\n * Props for autocomplete container element.\n */\n containerProps?: Omit<HTMLUIProps, \"children\">\n /**\n * Props for autocomplete content element.\n */\n contentProps?: Omit<MotionProps, \"children\">\n /**\n * Props for autocomplete list element.\n */\n listProps?: Omit<AutocompleteListProps, \"children\">\n /**\n * Props for autocomplete field element.\n */\n fieldProps?: Omit<AutocompleteFieldProps, \"inputProps\" | \"children\">\n /**\n * Props for autocomplete input element.\n */\n inputProps?: HTMLUIProps<\"input\">\n /**\n * Props for autocomplete icon element.\n */\n iconProps?: AutocompleteIconProps\n /**\n * Props to be forwarded to the portal component.\n *\n * @default '{ isDisabled: true }'\n */\n portalProps?: Omit<PortalProps, \"children\">\n /**\n * Props for autocomplete create element.\n */\n createProps?: Omit<AutocompleteCreateProps, \"children\">\n /**\n * Props for autocomplete empty element.\n */\n emptyProps?: Omit<AutocompleteEmptyProps, \"children\">\n /**\n * The header of the autocomplete content element.\n */\n header?: ReactNode | FC<{ value: string | undefined; onClose: () => void }>\n /**\n * The footer of the autocomplete content element.\n */\n footer?: ReactNode | FC<{ value: string | undefined; onClose: () => void }>\n}\n\nexport interface AutocompleteProps\n extends ThemeProps<\"Autocomplete\">,\n Omit<UseAutocompleteProps, \"maxSelectValues\" | \"omitSelectedValues\">,\n AutocompleteOptions {}\n\n/**\n * `Autocomplete` is a component used to display suggestions in response to user text input.\n *\n * @see Docs https://yamada-ui.com/components/forms/autocomplete\n */\nexport const Autocomplete = forwardRef<AutocompleteProps, \"input\">(\n (props, ref) => {\n const [styles, mergedProps] = useComponentMultiStyle(\"Autocomplete\", props)\n let {\n className,\n defaultValue = \"\",\n color,\n h,\n height,\n minH,\n minHeight,\n containerProps,\n contentProps,\n listProps,\n fieldProps,\n inputProps,\n iconProps,\n portalProps = { isDisabled: true },\n createProps,\n emptyProps,\n header,\n footer,\n children,\n ...computedProps\n } = omitThemeProps(mergedProps)\n\n const {\n value,\n onClose,\n descendants,\n formControlProps,\n getPopoverProps,\n getContainerProps,\n getFieldProps,\n allowCreate,\n isEmpty,\n inputValue,\n computedChildren,\n ...rest\n } = useAutocomplete({ ...computedProps, defaultValue, children })\n\n h ??= height\n minH ??= minHeight\n\n const css: CSSUIObject = {\n w: \"100%\",\n h: \"fit-content\",\n color,\n ...styles.container,\n }\n\n return (\n <AutocompleteDescendantsContextProvider value={descendants}>\n <AutocompleteProvider\n value={{\n ...rest,\n value,\n onClose,\n formControlProps,\n inputValue,\n allowCreate,\n isEmpty,\n styles,\n }}\n >\n <Popover {...getPopoverProps()}>\n <ui.div\n className={cx(\"ui-autocomplete\", className)}\n __css={css}\n {...getContainerProps(containerProps)}\n >\n <ui.div\n className=\"ui-autocomplete__inner\"\n __css={{ position: \"relative\", ...styles.inner }}\n >\n <AutocompleteField\n h={h}\n minH={minH}\n inputProps={inputProps}\n {...getFieldProps(fieldProps, ref)}\n />\n\n <AutocompleteIcon {...iconProps} {...formControlProps} />\n </ui.div>\n\n {!isEmpty ? (\n <Portal {...portalProps}>\n <AutocompleteList\n header={runIfFunc(header, { value, onClose })}\n footer={runIfFunc(footer, { value, onClose })}\n contentProps={contentProps}\n {...listProps}\n >\n {allowCreate ? (\n <AutocompleteCreate {...createProps} />\n ) : (\n <AutocompleteEmpty {...emptyProps} />\n )}\n\n {children ?? computedChildren}\n </AutocompleteList>\n </Portal>\n ) : (\n <Portal {...portalProps}>\n <AutocompleteList\n header={runIfFunc(header, { value, onClose })}\n footer={runIfFunc(footer, { value, onClose })}\n contentProps={contentProps}\n {...listProps}\n >\n {allowCreate && inputValue ? (\n <AutocompleteCreate {...createProps} />\n ) : (\n <AutocompleteEmpty {...emptyProps} />\n )}\n </AutocompleteList>\n </Portal>\n )}\n </ui.div>\n </Popover>\n </AutocompleteProvider>\n </AutocompleteDescendantsContextProvider>\n )\n },\n)\n\nAutocomplete.displayName = \"Autocomplete\"\nAutocomplete.__ui__ = \"Autocomplete\"\n\ninterface AutocompleteFieldProps\n extends HTMLUIProps,\n Pick<AutocompleteProps, \"inputProps\"> {}\n\nconst AutocompleteField = forwardRef<AutocompleteFieldProps, \"input\">(\n ({ className, h, minH, placeholder, inputProps, ...rest }, ref) => {\n const { label, inputValue, styles } = useAutocompleteContext()\n const { getInputProps } = useAutocompleteInput()\n\n const css: CSSUIObject = {\n pe: \"2rem\",\n h,\n minH,\n display: \"flex\",\n alignItems: \"center\",\n ...styles.field,\n cursor: \"text\",\n }\n\n return (\n <PopoverTrigger>\n <ui.div\n className={cx(\"ui-autocomplete__field\", className)}\n __css={css}\n {...rest}\n >\n <ui.input\n className=\"ui-autocomplete__field__input\"\n display=\"inline-block\"\n w=\"100%\"\n placeholder={placeholder}\n {...getInputProps(\n { ...inputProps, value: inputValue || label || \"\" },\n ref,\n )}\n />\n </ui.div>\n </PopoverTrigger>\n )\n },\n)\n\nAutocompleteField.displayName = \"AutocompleteField\"\nAutocompleteField.__ui__ = \"AutocompleteField\"\n"],"mappings":"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","names":[]}
1
+ {"version":3,"sources":["../src/autocomplete.tsx"],"sourcesContent":["import type { CSSUIObject, HTMLUIProps, ThemeProps } from \"@yamada-ui/core\"\nimport type { MotionProps } from \"@yamada-ui/motion\"\nimport type { PortalProps } from \"@yamada-ui/portal\"\nimport type { FC, ReactNode } from \"react\"\nimport type { AutocompleteCreateProps } from \"./autocomplete-create\"\nimport type { AutocompleteEmptyProps } from \"./autocomplete-empty\"\nimport type { AutocompleteIconProps } from \"./autocomplete-icon\"\nimport type { AutocompleteListProps } from \"./autocomplete-list\"\nimport type { UseAutocompleteProps } from \"./use-autocomplete\"\nimport {\n forwardRef,\n omitThemeProps,\n ui,\n useComponentMultiStyle,\n} from \"@yamada-ui/core\"\nimport { Popover, PopoverTrigger } from \"@yamada-ui/popover\"\nimport { Portal } from \"@yamada-ui/portal\"\nimport { cx, runIfFunc } from \"@yamada-ui/utils\"\nimport {\n AutocompleteDescendantsContextProvider,\n AutocompleteProvider,\n useAutocompleteContext,\n} from \"./autocomplete-context\"\nimport { AutocompleteCreate } from \"./autocomplete-create\"\nimport { AutocompleteEmpty } from \"./autocomplete-empty\"\nimport { AutocompleteIcon } from \"./autocomplete-icon\"\nimport { AutocompleteList } from \"./autocomplete-list\"\nimport { useAutocomplete, useAutocompleteInput } from \"./use-autocomplete\"\n\ninterface AutocompleteOptions {\n /**\n * The border color when the input is invalid.\n */\n errorBorderColor?: string\n /**\n * The border color when the input is focused.\n */\n focusBorderColor?: string\n /**\n * The footer of the autocomplete content element.\n */\n footer?: FC<{ value: string | undefined; onClose: () => void }> | ReactNode\n /**\n * The header of the autocomplete content element.\n */\n header?: FC<{ value: string | undefined; onClose: () => void }> | ReactNode\n /**\n * Props for autocomplete container element.\n */\n containerProps?: Omit<HTMLUIProps, \"children\">\n /**\n * Props for autocomplete content element.\n */\n contentProps?: Omit<MotionProps, \"children\">\n /**\n * Props for autocomplete create element.\n */\n createProps?: Omit<AutocompleteCreateProps, \"children\">\n /**\n * Props for autocomplete empty element.\n */\n emptyProps?: Omit<AutocompleteEmptyProps, \"children\">\n /**\n * Props for autocomplete field element.\n */\n fieldProps?: Omit<AutocompleteFieldProps, \"children\" | \"inputProps\">\n /**\n * Props for autocomplete icon element.\n */\n iconProps?: AutocompleteIconProps\n /**\n * Props for autocomplete input element.\n */\n inputProps?: HTMLUIProps<\"input\">\n /**\n * Props for autocomplete list element.\n */\n listProps?: Omit<AutocompleteListProps, \"children\">\n /**\n * Props to be forwarded to the portal component.\n *\n * @default '{ isDisabled: true }'\n */\n portalProps?: Omit<PortalProps, \"children\">\n}\n\nexport interface AutocompleteProps\n extends ThemeProps<\"Autocomplete\">,\n Omit<UseAutocompleteProps, \"maxSelectValues\" | \"omitSelectedValues\">,\n AutocompleteOptions {}\n\n/**\n * `Autocomplete` is a component used to display suggestions in response to user text input.\n *\n * @see Docs https://yamada-ui.com/components/forms/autocomplete\n */\nexport const Autocomplete = forwardRef<AutocompleteProps, \"input\">(\n (props, ref) => {\n const [styles, mergedProps] = useComponentMultiStyle(\"Autocomplete\", props)\n let {\n className,\n children,\n color,\n defaultValue = \"\",\n footer,\n h,\n header,\n height,\n minH,\n minHeight,\n containerProps,\n contentProps,\n createProps,\n emptyProps,\n fieldProps,\n iconProps,\n inputProps,\n listProps,\n portalProps = { isDisabled: true },\n ...computedProps\n } = omitThemeProps(mergedProps)\n\n const {\n allowCreate,\n computedChildren,\n descendants,\n inputValue,\n isEmpty,\n value,\n formControlProps,\n getContainerProps,\n getFieldProps,\n getPopoverProps,\n onClose,\n ...rest\n } = useAutocomplete({ ...computedProps, children, defaultValue })\n\n h ??= height\n minH ??= minHeight\n\n const css: CSSUIObject = {\n color,\n h: \"fit-content\",\n w: \"100%\",\n ...styles.container,\n }\n\n return (\n <AutocompleteDescendantsContextProvider value={descendants}>\n <AutocompleteProvider\n value={{\n ...rest,\n allowCreate,\n inputValue,\n isEmpty,\n styles,\n value,\n formControlProps,\n onClose,\n }}\n >\n <Popover {...getPopoverProps()}>\n <ui.div\n className={cx(\"ui-autocomplete\", className)}\n __css={css}\n {...getContainerProps(containerProps)}\n >\n <ui.div\n className=\"ui-autocomplete__inner\"\n __css={{ position: \"relative\", ...styles.inner }}\n >\n <AutocompleteField\n h={h}\n minH={minH}\n inputProps={inputProps}\n {...getFieldProps(fieldProps, ref)}\n />\n\n <AutocompleteIcon {...iconProps} {...formControlProps} />\n </ui.div>\n\n {!isEmpty ? (\n <Portal {...portalProps}>\n <AutocompleteList\n footer={runIfFunc(footer, { value, onClose })}\n header={runIfFunc(header, { value, onClose })}\n contentProps={contentProps}\n {...listProps}\n >\n {allowCreate ? (\n <AutocompleteCreate {...createProps} />\n ) : (\n <AutocompleteEmpty {...emptyProps} />\n )}\n\n {children ?? computedChildren}\n </AutocompleteList>\n </Portal>\n ) : (\n <Portal {...portalProps}>\n <AutocompleteList\n footer={runIfFunc(footer, { value, onClose })}\n header={runIfFunc(header, { value, onClose })}\n contentProps={contentProps}\n {...listProps}\n >\n {allowCreate && inputValue ? (\n <AutocompleteCreate {...createProps} />\n ) : (\n <AutocompleteEmpty {...emptyProps} />\n )}\n </AutocompleteList>\n </Portal>\n )}\n </ui.div>\n </Popover>\n </AutocompleteProvider>\n </AutocompleteDescendantsContextProvider>\n )\n },\n)\n\nAutocomplete.displayName = \"Autocomplete\"\nAutocomplete.__ui__ = \"Autocomplete\"\n\ninterface AutocompleteFieldProps\n extends HTMLUIProps,\n Pick<AutocompleteProps, \"inputProps\"> {}\n\nconst AutocompleteField = forwardRef<AutocompleteFieldProps, \"input\">(\n ({ className, h, minH, placeholder, inputProps, ...rest }, ref) => {\n const { inputValue, label, styles } = useAutocompleteContext()\n const { getInputProps } = useAutocompleteInput()\n\n const css: CSSUIObject = {\n alignItems: \"center\",\n display: \"flex\",\n h,\n minH,\n pe: \"2rem\",\n ...styles.field,\n cursor: \"text\",\n }\n\n return (\n <PopoverTrigger>\n <ui.div\n className={cx(\"ui-autocomplete__field\", className)}\n __css={css}\n {...rest}\n >\n <ui.input\n className=\"ui-autocomplete__field__input\"\n display=\"inline-block\"\n placeholder={placeholder}\n w=\"100%\"\n {...getInputProps(\n { ...inputProps, value: inputValue || label || \"\" },\n ref,\n )}\n />\n </ui.div>\n </PopoverTrigger>\n )\n },\n)\n\nAutocompleteField.displayName = \"AutocompleteField\"\nAutocompleteField.__ui__ = \"AutocompleteField\"\n"],"mappings":"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","names":[]}