@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.
- package/dist/autocomplete-context.d.mts +115 -115
- package/dist/autocomplete-context.d.ts +115 -115
- package/dist/autocomplete-context.js +2 -2
- package/dist/autocomplete-context.js.map +1 -1
- package/dist/autocomplete-context.mjs +1 -1
- package/dist/autocomplete-create.d.mts +4 -4
- package/dist/autocomplete-create.d.ts +4 -4
- package/dist/autocomplete-create.js +32 -32
- package/dist/autocomplete-create.js.map +1 -1
- package/dist/autocomplete-create.mjs +4 -4
- package/dist/autocomplete-empty.d.mts +4 -4
- package/dist/autocomplete-empty.d.ts +4 -4
- package/dist/autocomplete-empty.js +34 -34
- package/dist/autocomplete-empty.js.map +1 -1
- package/dist/autocomplete-empty.mjs +4 -4
- package/dist/autocomplete-icon.js +17 -17
- package/dist/autocomplete-icon.js.map +1 -1
- package/dist/autocomplete-icon.mjs +2 -2
- package/dist/autocomplete-list.d.mts +2 -2
- package/dist/autocomplete-list.d.ts +2 -2
- package/dist/autocomplete-list.js +18 -18
- package/dist/autocomplete-list.js.map +1 -1
- package/dist/autocomplete-list.mjs +3 -3
- package/dist/autocomplete-option-group.js +10 -10
- package/dist/autocomplete-option-group.js.map +1 -1
- package/dist/autocomplete-option-group.mjs +3 -3
- package/dist/autocomplete-option.d.mts +1 -1
- package/dist/autocomplete-option.d.ts +1 -1
- package/dist/autocomplete-option.js +47 -47
- package/dist/autocomplete-option.js.map +1 -1
- package/dist/autocomplete-option.mjs +4 -4
- package/dist/autocomplete.d.mts +31 -31
- package/dist/autocomplete.d.ts +31 -31
- package/dist/autocomplete.js +294 -292
- package/dist/autocomplete.js.map +1 -1
- package/dist/autocomplete.mjs +12 -12
- package/dist/{chunk-6F3LT7J6.mjs → chunk-4SBNPEK7.mjs} +7 -7
- package/dist/{chunk-6F3LT7J6.mjs.map → chunk-4SBNPEK7.mjs.map} +1 -1
- package/dist/{chunk-JMX72TSD.mjs → chunk-67X7JKWL.mjs} +7 -7
- package/dist/{chunk-JMX72TSD.mjs.map → chunk-67X7JKWL.mjs.map} +1 -1
- package/dist/{chunk-HZECQUHV.mjs → chunk-AXC7ILCH.mjs} +40 -40
- package/dist/{chunk-HZECQUHV.mjs.map → chunk-AXC7ILCH.mjs.map} +1 -1
- package/dist/{chunk-OLOU5HFC.mjs → chunk-BGZIX6SN.mjs} +168 -166
- package/dist/chunk-BGZIX6SN.mjs.map +1 -0
- package/dist/{chunk-Q2HZVVOI.mjs → chunk-BKW7XJ6R.mjs} +16 -16
- package/dist/chunk-BKW7XJ6R.mjs.map +1 -0
- package/dist/{chunk-5LPWFWE6.mjs → chunk-DDMSYTKO.mjs} +34 -34
- package/dist/chunk-DDMSYTKO.mjs.map +1 -0
- package/dist/{chunk-QPIWG4ZF.mjs → chunk-EEECVCVW.mjs} +63 -61
- package/dist/chunk-EEECVCVW.mjs.map +1 -0
- package/dist/{chunk-5GKGL6BL.mjs → chunk-KLXMUIGY.mjs} +16 -16
- package/dist/chunk-KLXMUIGY.mjs.map +1 -0
- package/dist/{chunk-R76HPAN4.mjs → chunk-TR4X4EEG.mjs} +7 -7
- package/dist/{chunk-R76HPAN4.mjs.map → chunk-TR4X4EEG.mjs.map} +1 -1
- package/dist/{chunk-7SWSKLSA.mjs → chunk-V6YCG642.mjs} +18 -18
- package/dist/chunk-V6YCG642.mjs.map +1 -0
- package/dist/{chunk-S53LMDD7.mjs → chunk-VTBUO5SK.mjs} +15 -15
- package/dist/chunk-VTBUO5SK.mjs.map +1 -0
- package/dist/{chunk-JPUKYLBW.mjs → chunk-WDQYM4FP.mjs} +5 -5
- package/dist/chunk-WDQYM4FP.mjs.map +1 -0
- package/dist/{chunk-S2HFYJVI.mjs → chunk-WFLZPB35.mjs} +13 -13
- package/dist/chunk-WFLZPB35.mjs.map +1 -0
- package/dist/index.d.mts +4 -4
- package/dist/index.d.ts +4 -4
- package/dist/index.js +347 -343
- package/dist/index.js.map +1 -1
- package/dist/index.mjs +13 -13
- package/dist/multi-autocomplete.d.mts +51 -51
- package/dist/multi-autocomplete.d.ts +51 -51
- package/dist/multi-autocomplete.js +317 -313
- package/dist/multi-autocomplete.js.map +1 -1
- package/dist/multi-autocomplete.mjs +12 -12
- package/dist/use-autocomplete-list.d.mts +1 -1
- package/dist/use-autocomplete-list.d.ts +1 -1
- package/dist/use-autocomplete-list.js +7 -7
- package/dist/use-autocomplete-list.js.map +1 -1
- package/dist/use-autocomplete-list.mjs +2 -2
- package/dist/use-autocomplete-option-group.js +7 -7
- package/dist/use-autocomplete-option-group.js.map +1 -1
- package/dist/use-autocomplete-option-group.mjs +2 -2
- package/dist/use-autocomplete-option.d.mts +12 -12
- package/dist/use-autocomplete-option.d.ts +12 -12
- package/dist/use-autocomplete-option.js +34 -34
- package/dist/use-autocomplete-option.js.map +1 -1
- package/dist/use-autocomplete-option.mjs +2 -2
- package/dist/use-autocomplete.d.mts +86 -86
- package/dist/use-autocomplete.d.ts +86 -86
- package/dist/use-autocomplete.js +216 -214
- package/dist/use-autocomplete.js.map +1 -1
- package/dist/use-autocomplete.mjs +7 -7
- package/package.json +13 -13
- package/dist/chunk-5GKGL6BL.mjs.map +0 -1
- package/dist/chunk-5LPWFWE6.mjs.map +0 -1
- package/dist/chunk-7SWSKLSA.mjs.map +0 -1
- package/dist/chunk-JPUKYLBW.mjs.map +0 -1
- package/dist/chunk-OLOU5HFC.mjs.map +0 -1
- package/dist/chunk-Q2HZVVOI.mjs.map +0 -1
- package/dist/chunk-QPIWG4ZF.mjs.map +0 -1
- package/dist/chunk-S2HFYJVI.mjs.map +0 -1
- 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-
|
4
|
+
} from "./chunk-67X7JKWL.mjs";
|
5
5
|
import {
|
6
6
|
useAutocompleteContext
|
7
|
-
} from "./chunk-
|
7
|
+
} from "./chunk-WDQYM4FP.mjs";
|
8
8
|
|
9
9
|
// src/autocomplete-option-group.tsx
|
10
|
-
import {
|
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: {
|
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-
|
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 {
|
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-
|
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 {
|
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
|
-
({
|
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
|
-
|
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-
|
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 {
|
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-
|
5
|
+
} from "./chunk-BGZIX6SN.mjs";
|
6
6
|
import {
|
7
7
|
AutocompleteCreate
|
8
|
-
} from "./chunk-
|
8
|
+
} from "./chunk-BKW7XJ6R.mjs";
|
9
9
|
import {
|
10
10
|
AutocompleteEmpty
|
11
|
-
} from "./chunk-
|
11
|
+
} from "./chunk-KLXMUIGY.mjs";
|
12
12
|
import {
|
13
13
|
AutocompleteList
|
14
|
-
} from "./chunk-
|
14
|
+
} from "./chunk-VTBUO5SK.mjs";
|
15
15
|
import {
|
16
16
|
AutocompleteIcon
|
17
|
-
} from "./chunk-
|
17
|
+
} from "./chunk-V6YCG642.mjs";
|
18
18
|
import {
|
19
19
|
AutocompleteDescendantsContextProvider,
|
20
20
|
AutocompleteProvider,
|
21
21
|
useAutocompleteContext
|
22
|
-
} from "./chunk-
|
22
|
+
} from "./chunk-WDQYM4FP.mjs";
|
23
23
|
|
24
24
|
// src/autocomplete.tsx
|
25
25
|
import {
|
26
|
-
ui,
|
27
26
|
forwardRef,
|
28
|
-
|
29
|
-
|
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
|
-
|
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
|
-
|
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
|
-
|
62
|
-
|
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
|
-
|
69
|
-
|
70
|
-
inputValue,
|
71
|
-
computedChildren,
|
70
|
+
getPopoverProps,
|
71
|
+
onClose,
|
72
72
|
...rest
|
73
|
-
} = useAutocomplete({ ...computedProps,
|
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 {
|
154
|
+
const { inputValue, label, styles } = useAutocompleteContext();
|
155
155
|
const { getInputProps } = useAutocompleteInput();
|
156
156
|
const css = {
|
157
|
-
|
157
|
+
alignItems: "center",
|
158
|
+
display: "flex",
|
158
159
|
h,
|
159
160
|
minH,
|
160
|
-
|
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-
|
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":[]}
|