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

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 +56 -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 +303 -292
  35. package/dist/autocomplete.js.map +1 -1
  36. package/dist/autocomplete.mjs +12 -12
  37. package/dist/{chunk-5GKGL6BL.mjs → chunk-2HJUFFCU.mjs} +16 -16
  38. package/dist/chunk-2HJUFFCU.mjs.map +1 -0
  39. package/dist/{chunk-6F3LT7J6.mjs → chunk-4SBNPEK7.mjs} +7 -7
  40. package/dist/{chunk-6F3LT7J6.mjs.map → chunk-4SBNPEK7.mjs.map} +1 -1
  41. package/dist/{chunk-JMX72TSD.mjs → chunk-67X7JKWL.mjs} +7 -7
  42. package/dist/{chunk-JMX72TSD.mjs.map → chunk-67X7JKWL.mjs.map} +1 -1
  43. package/dist/{chunk-5LPWFWE6.mjs → chunk-6OLHNK7O.mjs} +46 -34
  44. package/dist/chunk-6OLHNK7O.mjs.map +1 -0
  45. package/dist/{chunk-QPIWG4ZF.mjs → chunk-7LZUXESV.mjs} +63 -61
  46. package/dist/chunk-7LZUXESV.mjs.map +1 -0
  47. package/dist/{chunk-S2HFYJVI.mjs → chunk-AIBJWPRA.mjs} +13 -13
  48. package/dist/chunk-AIBJWPRA.mjs.map +1 -0
  49. package/dist/{chunk-Q2HZVVOI.mjs → chunk-K5HCHHCJ.mjs} +16 -16
  50. package/dist/chunk-K5HCHHCJ.mjs.map +1 -0
  51. package/dist/{chunk-HZECQUHV.mjs → chunk-Q33EMTO2.mjs} +40 -40
  52. package/dist/{chunk-HZECQUHV.mjs.map → chunk-Q33EMTO2.mjs.map} +1 -1
  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-OLOU5HFC.mjs → chunk-WERCEZNJ.mjs} +168 -166
  62. package/dist/chunk-WERCEZNJ.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 +356 -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 +326 -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 +43 -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 +225 -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,35 +1,35 @@
1
1
  "use client"
2
2
  import {
3
3
  useAutocompleteEmpty
4
- } from "./chunk-5LPWFWE6.mjs";
4
+ } from "./chunk-6OLHNK7O.mjs";
5
5
  import {
6
6
  AutocompleteItemIcon
7
- } from "./chunk-7SWSKLSA.mjs";
7
+ } from "./chunk-V6YCG642.mjs";
8
8
  import {
9
9
  useAutocompleteContext
10
- } from "./chunk-JPUKYLBW.mjs";
10
+ } from "./chunk-WDQYM4FP.mjs";
11
11
 
12
12
  // src/autocomplete-empty.tsx
13
- import { ui, forwardRef } from "@yamada-ui/core";
13
+ import { forwardRef, ui } from "@yamada-ui/core";
14
14
  import { cx } from "@yamada-ui/utils";
15
15
  import { jsx, jsxs } from "react/jsx-runtime";
16
16
  var AutocompleteEmpty = forwardRef(
17
- ({ className, icon, children, ...rest }, ref) => {
17
+ ({ className, children, icon, ...rest }, ref) => {
18
18
  const { emptyMessage, styles } = useAutocompleteContext();
19
19
  const { getEmptyProps } = useAutocompleteEmpty();
20
20
  children != null ? children : children = emptyMessage;
21
21
  const css = {
22
- textDecoration: "none",
22
+ alignItems: "center",
23
23
  color: "inherit",
24
- userSelect: "none",
25
24
  display: "flex",
26
- width: "100%",
27
- alignItems: "center",
28
- textAlign: "start",
29
25
  flex: "0 0 auto",
30
- outline: 0,
31
26
  gap: "0.75rem",
27
+ outline: 0,
32
28
  pointerEvents: "none",
29
+ textAlign: "start",
30
+ textDecoration: "none",
31
+ userSelect: "none",
32
+ width: "100%",
33
33
  ...styles.item
34
34
  };
35
35
  return /* @__PURE__ */ jsxs(
@@ -40,7 +40,7 @@ var AutocompleteEmpty = forwardRef(
40
40
  ...getEmptyProps(rest, ref),
41
41
  children: [
42
42
  icon !== null ? /* @__PURE__ */ jsx(AutocompleteItemIcon, { children: icon || /* @__PURE__ */ jsx(AutocompleteMinusIcon, {}) }) : null,
43
- icon ? /* @__PURE__ */ jsx(ui.span, { style: { pointerEvents: "none", flex: 1 }, lineClamp: 1, children }) : children
43
+ icon ? /* @__PURE__ */ jsx(ui.span, { style: { flex: 1, pointerEvents: "none" }, lineClamp: 1, children }) : children
44
44
  ]
45
45
  }
46
46
  );
@@ -48,11 +48,11 @@ var AutocompleteEmpty = forwardRef(
48
48
  );
49
49
  AutocompleteEmpty.displayName = "AutocompleteEmpty";
50
50
  AutocompleteEmpty.__ui__ = "AutocompleteEmpty";
51
- var AutocompleteMinusIcon = () => /* @__PURE__ */ jsx("svg", { viewBox: "0 0 448 512", width: "1em", height: "1em", children: /* @__PURE__ */ jsx(
51
+ var AutocompleteMinusIcon = () => /* @__PURE__ */ jsx("svg", { height: "1em", viewBox: "0 0 448 512", width: "1em", children: /* @__PURE__ */ jsx(
52
52
  "path",
53
53
  {
54
- fill: "currentColor",
55
- 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"
54
+ 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",
55
+ fill: "currentColor"
56
56
  }
57
57
  ) });
58
58
  AutocompleteMinusIcon.displayName = "AutocompleteMinusIcon";
@@ -61,4 +61,4 @@ AutocompleteMinusIcon.__ui__ = "AutocompleteMinusIcon";
61
61
  export {
62
62
  AutocompleteEmpty
63
63
  };
64
- //# sourceMappingURL=chunk-5GKGL6BL.mjs.map
64
+ //# sourceMappingURL=chunk-2HJUFFCU.mjs.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../src/autocomplete-empty.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 } 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<\"li\">, \"children\">,\n AutocompleteEmptyOptions {}\n\nexport const AutocompleteEmpty = forwardRef<AutocompleteEmptyProps, \"li\">(\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.li\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.li>\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"],"mappings":";;;;;;;;;;;;AAEA,SAAS,YAAY,UAAU;AAC/B,SAAS,UAAU;AA2Cb,SAOe,KAPf;AAvBC,IAAM,oBAAoB;AAAA,EAC/B,CAAC,EAAE,WAAW,UAAU,MAAM,GAAG,KAAK,GAAG,QAAQ;AAC/C,UAAM,EAAE,cAAc,OAAO,IAAI,uBAAuB;AACxD,UAAM,EAAE,cAAc,IAAI,qBAAqB;AAE/C,6CAAa;AAEb,UAAM,MAAmB;AAAA,MACvB,YAAY;AAAA,MACZ,OAAO;AAAA,MACP,SAAS;AAAA,MACT,MAAM;AAAA,MACN,KAAK;AAAA,MACL,SAAS;AAAA,MACT,eAAe;AAAA,MACf,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,gCAAgC,SAAS;AAAA,QACvD,OAAO;AAAA,QACN,GAAG,cAAc,MAAM,GAAG;AAAA,QAE1B;AAAA,mBAAS,OACR,oBAAC,wBACE,kBAAQ,oBAAC,yBAAsB,GAClC,IACE;AAAA,UAEH,OACC,oBAAC,GAAG,MAAH,EAAQ,OAAO,EAAE,MAAM,GAAG,eAAe,OAAO,GAAG,WAAW,GAC5D,UACH,IAEA;AAAA;AAAA;AAAA,IAEJ;AAAA,EAEJ;AACF;AAEA,kBAAkB,cAAc;AAChC,kBAAkB,SAAS;AAE3B,IAAM,wBAA4B,MAChC,oBAAC,SAAI,QAAO,OAAM,SAAQ,eAAc,OAAM,OAC5C;AAAA,EAAC;AAAA;AAAA,IACC,GAAE;AAAA,IACF,MAAK;AAAA;AACP,GACF;AAGF,sBAAsB,cAAc;AACpC,sBAAsB,SAAS;","names":[]}
@@ -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,7 +2,7 @@
2
2
  import {
3
3
  useAutocompleteContext,
4
4
  useAutocompleteDescendant
5
- } from "./chunk-JPUKYLBW.mjs";
5
+ } from "./chunk-WDQYM4FP.mjs";
6
6
 
7
7
  // src/use-autocomplete-option.ts
8
8
  import {
@@ -11,47 +11,59 @@ import {
11
11
  handlerAll,
12
12
  isArray,
13
13
  isHTMLElement,
14
+ isNumber,
15
+ isString,
16
+ isUndefined,
14
17
  mergeRefs,
15
18
  useUpdateEffect
16
19
  } from "@yamada-ui/utils";
17
20
  import { useCallback, useId, useRef } from "react";
18
21
  var isTargetOption = (target) => {
19
22
  var _a;
20
- return isHTMLElement(target) && !!((_a = target == null ? void 0 : target.getAttribute("role")) == null ? void 0 : _a.startsWith("option"));
23
+ return isHTMLElement(target) && !!((_a = target.getAttribute("role")) == null ? void 0 : _a.startsWith("option"));
21
24
  };
22
25
  var useAutocompleteOption = (props) => {
23
26
  var _a, _b;
24
27
  const {
25
- value,
28
+ closeOnSelect: generalCloseOnSelect,
29
+ focusedIndex,
30
+ inputRef,
26
31
  omitSelectedValues,
32
+ setFocusedIndex,
33
+ value,
34
+ optionProps,
27
35
  onChange,
28
36
  onChangeLabel,
29
- focusedIndex,
30
- setFocusedIndex,
31
37
  onClose,
32
- closeOnSelect: generalCloseOnSelect,
33
- optionProps,
34
- inputRef,
35
38
  onFocusNext
36
39
  } = useAutocompleteContext();
37
40
  const id = useId();
38
41
  let {
42
+ children,
43
+ closeOnSelect: customCloseOnSelect,
39
44
  icon: customIcon,
40
45
  isDisabled,
41
46
  isFocusable,
42
- closeOnSelect: customCloseOnSelect,
43
- children,
44
47
  value: optionValue,
45
48
  ...computedProps
46
49
  } = { ...optionProps, ...props };
47
50
  const trulyDisabled = !!isDisabled && !isFocusable;
48
51
  const itemRef = useRef(null);
49
- const { index, register, descendants } = useAutocompleteDescendant({
52
+ const { descendants, index, register } = useAutocompleteDescendant({
50
53
  disabled: trulyDisabled
51
54
  });
52
55
  const values = descendants.values();
53
56
  const frontValues = values.slice(0, index);
54
57
  const isMulti = isArray(value);
58
+ if (isUndefined(optionValue)) {
59
+ if (isString(children) || isNumber(children)) {
60
+ optionValue = children.toString();
61
+ } else {
62
+ console.warn(
63
+ `${!isMulti ? "Autocomplete" : "MultiAutocomplete"}: Cannot infer the option value of complex children. Pass a \`value\` prop or use a plain string as children to <Option>.`
64
+ );
65
+ }
66
+ }
55
67
  const isDuplicated = !isMulti ? frontValues.some(({ node }) => node.dataset.value === (optionValue != null ? optionValue : "")) : false;
56
68
  const isSelected = !isDuplicated && (!isMulti ? (optionValue != null ? optionValue : "") === value : value.includes(optionValue != null ? optionValue : ""));
57
69
  const isTarget = "target" in ((_b = (_a = itemRef.current) == null ? void 0 : _a.dataset) != null ? _b : {});
@@ -96,27 +108,27 @@ var useAutocompleteOption = (props) => {
96
108
  border: "0px",
97
109
  clip: "rect(0px, 0px, 0px, 0px)",
98
110
  height: "1px",
99
- width: "1px",
100
111
  margin: "-1px",
101
- padding: "0px",
102
112
  overflow: "hidden",
113
+ padding: "0px",
114
+ position: "absolute",
103
115
  whiteSpace: "nowrap",
104
- position: "absolute"
116
+ width: "1px"
105
117
  };
106
118
  return {
107
- ref: mergeRefs(itemRef, ref, register),
108
119
  id,
120
+ ref: mergeRefs(itemRef, ref, register),
109
121
  role: "option",
110
122
  ...computedProps,
111
123
  ...props2,
112
- tabIndex: -1,
113
124
  style: !isTarget || omitSelectedValues && isSelected ? style : void 0,
114
- "data-target": dataAttr(true),
115
- "data-value": optionValue != null ? optionValue : "",
116
- "data-focus": dataAttr(isFocused),
117
- "data-disabled": dataAttr(isDisabled),
118
125
  "aria-checked": isSelected,
119
126
  "aria-disabled": ariaAttr(isDisabled),
127
+ "data-disabled": dataAttr(isDisabled),
128
+ "data-focus": dataAttr(isFocused),
129
+ "data-target": dataAttr(true),
130
+ "data-value": optionValue != null ? optionValue : "",
131
+ tabIndex: -1,
120
132
  onClick: handlerAll(computedProps.onClick, props2.onClick, onClick)
121
133
  };
122
134
  },
@@ -134,10 +146,10 @@ var useAutocompleteOption = (props) => {
134
146
  ]
135
147
  );
136
148
  return {
137
- isSelected,
138
- isFocused,
139
- customIcon,
140
149
  children,
150
+ customIcon,
151
+ isFocused,
152
+ isSelected,
141
153
  getOptionProps
142
154
  };
143
155
  };
@@ -149,19 +161,19 @@ var useAutocompleteCreate = () => {
149
161
  border: "0px",
150
162
  clip: "rect(0px, 0px, 0px, 0px)",
151
163
  height: "1px",
152
- width: "1px",
153
164
  margin: "-1px",
154
- padding: "0px",
155
165
  overflow: "hidden",
166
+ padding: "0px",
167
+ position: "absolute",
156
168
  whiteSpace: "nowrap",
157
- position: "absolute"
169
+ width: "1px"
158
170
  };
159
171
  return {
160
172
  ref,
161
173
  ...props,
162
- tabIndex: -1,
163
174
  style: isHit ? style : void 0,
164
175
  "data-focus": dataAttr(!isHit),
176
+ tabIndex: -1,
165
177
  onClick: handlerAll(props.onClick, onCreate)
166
178
  };
167
179
  },
@@ -170,25 +182,25 @@ var useAutocompleteCreate = () => {
170
182
  return { getCreateProps };
171
183
  };
172
184
  var useAutocompleteEmpty = () => {
173
- const { isHit, isEmpty } = useAutocompleteContext();
185
+ const { isEmpty, isHit } = useAutocompleteContext();
174
186
  const getEmptyProps = useCallback(
175
187
  (props = {}, ref = null) => {
176
188
  const style = {
177
189
  border: "0px",
178
190
  clip: "rect(0px, 0px, 0px, 0px)",
179
191
  height: "1px",
180
- width: "1px",
181
192
  margin: "-1px",
182
- padding: "0px",
183
193
  overflow: "hidden",
194
+ padding: "0px",
195
+ position: "absolute",
184
196
  whiteSpace: "nowrap",
185
- position: "absolute"
197
+ width: "1px"
186
198
  };
187
199
  return {
188
200
  ref,
189
201
  ...props,
190
- tabIndex: -1,
191
- style: isHit && !isEmpty ? style : void 0
202
+ style: isHit && !isEmpty ? style : void 0,
203
+ tabIndex: -1
192
204
  };
193
205
  },
194
206
  [isHit, isEmpty]
@@ -201,4 +213,4 @@ export {
201
213
  useAutocompleteCreate,
202
214
  useAutocompleteEmpty
203
215
  };
204
- //# sourceMappingURL=chunk-5LPWFWE6.mjs.map
216
+ //# sourceMappingURL=chunk-6OLHNK7O.mjs.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../src/use-autocomplete-option.ts"],"sourcesContent":["import type { HTMLUIProps, PropGetter } from \"@yamada-ui/core\"\nimport type { CSSProperties, MouseEvent } from \"react\"\nimport {\n ariaAttr,\n dataAttr,\n handlerAll,\n isArray,\n isHTMLElement,\n isNumber,\n isString,\n isUndefined,\n mergeRefs,\n useUpdateEffect,\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<\"li\">, \"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: generalCloseOnSelect,\n focusedIndex,\n inputRef,\n omitSelectedValues,\n setFocusedIndex,\n value,\n optionProps,\n onChange,\n onChangeLabel,\n onClose,\n onFocusNext,\n } = useAutocompleteContext()\n const id = useId()\n\n let {\n children,\n closeOnSelect: customCloseOnSelect,\n icon: customIcon,\n isDisabled,\n isFocusable,\n value: optionValue,\n ...computedProps\n } = { ...optionProps, ...props }\n\n const trulyDisabled = !!isDisabled && !isFocusable\n\n const itemRef = useRef<HTMLLIElement>(null)\n\n const { descendants, index, register } = useAutocompleteDescendant({\n disabled: trulyDisabled,\n })\n\n const values = descendants.values()\n const frontValues = values.slice(0, index)\n const isMulti = isArray(value)\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 isDuplicated = !isMulti\n ? frontValues.some(({ node }) => node.dataset.value === (optionValue ?? \"\"))\n : false\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 const onClick = useCallback(\n (ev: MouseEvent<HTMLLIElement>) => {\n ev.stopPropagation()\n\n if (isDisabled) {\n if (inputRef.current) inputRef.current.focus()\n\n return\n }\n\n if (!isTargetOption(ev.currentTarget)) {\n if (inputRef.current) inputRef.current.focus()\n\n return\n }\n\n setFocusedIndex(index)\n\n onChange(optionValue ?? \"\")\n\n if (inputRef.current) inputRef.current.focus()\n\n if (customCloseOnSelect ?? generalCloseOnSelect) onClose()\n\n if (omitSelectedValues) onFocusNext(index)\n },\n [\n onFocusNext,\n omitSelectedValues,\n isDisabled,\n optionValue,\n setFocusedIndex,\n index,\n onChange,\n customCloseOnSelect,\n generalCloseOnSelect,\n onClose,\n inputRef,\n ],\n )\n\n useUpdateEffect(() => {\n if (isSelected) onChangeLabel(optionValue ?? \"\", { runOmit: false })\n }, [optionValue])\n\n const getOptionProps: 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 id,\n ref: mergeRefs(itemRef, ref, register),\n role: \"option\",\n ...computedProps,\n ...props,\n style:\n !isTarget || (omitSelectedValues && isSelected) ? style : undefined,\n \"aria-checked\": isSelected,\n \"aria-disabled\": ariaAttr(isDisabled),\n \"data-disabled\": dataAttr(isDisabled),\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 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 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<\"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 style: isHit ? style : undefined,\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<\"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 style: isHit && !isEmpty ? style : undefined,\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":["props"]}