@manafishrov/ui 1.2.12 → 1.3.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/components/form/AutoSubmit.d.ts +5 -0
- package/dist/components/form/AutoSubmit.js +21 -0
- package/dist/components/form/AutoSubmit.js.map +1 -0
- package/dist/components/form/ComboboxField.d.ts +5 -3
- package/dist/components/form/ComboboxField.js +62 -63
- package/dist/components/form/ComboboxField.js.map +1 -1
- package/dist/components/form/DatePickerField.d.ts +3 -2
- package/dist/components/form/DatePickerField.js +43 -32
- package/dist/components/form/DatePickerField.js.map +1 -1
- package/dist/components/form/Form.d.ts +99 -84
- package/dist/components/form/Form.js +62 -40
- package/dist/components/form/Form.js.map +1 -1
- package/dist/components/form/NumberInputField.d.ts +3 -3
- package/dist/components/form/NumberInputField.js +18 -19
- package/dist/components/form/NumberInputField.js.map +1 -1
- package/dist/components/form/PasswordInputField.d.ts +1 -0
- package/dist/components/form/PasswordInputField.js +23 -16
- package/dist/components/form/PasswordInputField.js.map +1 -1
- package/dist/components/form/TagsInputField.d.ts +4 -4
- package/dist/components/form/TagsInputField.js +52 -49
- package/dist/components/form/TagsInputField.js.map +1 -1
- package/dist/components/form/index.d.ts +1 -0
- package/dist/components/form/index.js +30 -27
- package/dist/components/form/index.js.map +1 -1
- package/package.json +1 -1
- package/src/components/form/AutoSubmit.tsx +38 -0
- package/src/components/form/ComboboxField.tsx +30 -25
- package/src/components/form/DatePickerField.tsx +30 -17
- package/src/components/form/Form.tsx +29 -1
- package/src/components/form/NumberInputField.tsx +5 -6
- package/src/components/form/PasswordInputField.tsx +7 -3
- package/src/components/form/TagsInputField.tsx +43 -32
- package/src/components/form/index.ts +1 -0
|
@@ -0,0 +1,21 @@
|
|
|
1
|
+
import { createEffect as n, onCleanup as s } from "solid-js";
|
|
2
|
+
import { useFormContext as m } from "./context.js";
|
|
3
|
+
const i = 300, h = (o) => {
|
|
4
|
+
const t = m(), r = t.useStore((e) => e.values), u = t.useStore((e) => e.isTouched);
|
|
5
|
+
return n(() => {
|
|
6
|
+
if (r(), !u())
|
|
7
|
+
return;
|
|
8
|
+
const e = setTimeout(() => {
|
|
9
|
+
t.handleSubmit().catch((c) => {
|
|
10
|
+
throw c;
|
|
11
|
+
});
|
|
12
|
+
}, Math.max(0, o.debounce ?? i));
|
|
13
|
+
s(() => {
|
|
14
|
+
clearTimeout(e);
|
|
15
|
+
});
|
|
16
|
+
}), [];
|
|
17
|
+
};
|
|
18
|
+
export {
|
|
19
|
+
h as AutoSubmit
|
|
20
|
+
};
|
|
21
|
+
//# sourceMappingURL=AutoSubmit.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"AutoSubmit.js","sources":["../../../src/components/form/AutoSubmit.tsx"],"sourcesContent":["import { createEffect, onCleanup, type Component } from 'solid-js';\n\nimport { useFormContext } from './context';\n\nconst DEFAULT_DEBOUNCE_MS = 300;\n\nexport type AutoSubmitProps = {\n debounce?: number;\n};\n\nexport const AutoSubmit: Component<AutoSubmitProps> = (props) => {\n const form = useFormContext();\n const values = form.useStore((state) => state.values);\n const isTouched = form.useStore((state) => state.isTouched);\n\n createEffect(() => {\n values();\n\n if (!isTouched()) {\n return;\n }\n\n const debounceTimer = setTimeout(\n () => {\n form.handleSubmit().catch((error: unknown) => {\n throw error;\n });\n },\n Math.max(0, props.debounce ?? DEFAULT_DEBOUNCE_MS),\n );\n\n onCleanup(() => {\n clearTimeout(debounceTimer);\n });\n });\n\n return <></>;\n};\n"],"names":["DEFAULT_DEBOUNCE_MS","AutoSubmit","props","form","useFormContext","values","useStore","state","isTouched","createEffect","debounceTimer","setTimeout","handleSubmit","catch","error","Math","max","debounce","onCleanup","clearTimeout"],"mappings":";;AAIA,MAAMA,IAAsB,KAMfC,IAA0CC,CAAAA,MAAU;AAC/D,QAAMC,IAAOC,EAAAA,GACPC,IAASF,EAAKG,SAAUC,CAAAA,MAAUA,EAAMF,MAAM,GAC9CG,IAAYL,EAAKG,SAAUC,CAAAA,MAAUA,EAAMC,SAAS;AAE1DC,SAAAA,EAAa,MAAM;AAGjB,QAFAJ,EAAAA,GAEI,CAACG;AACH;AAGF,UAAME,IAAgBC,WACpB,MAAM;AACJR,MAAAA,EAAKS,aAAAA,EAAeC,MAAM,CAACC,MAAmB;AAC5C,cAAMA;AAAAA,MACR,CAAC;AAAA,IACH,GACAC,KAAKC,IAAI,GAAGd,EAAMe,YAAYjB,CAAmB,CACnD;AAEAkB,IAAAA,EAAU,MAAM;AACdC,mBAAaT,CAAa;AAAA,IAC5B,CAAC;AAAA,EACH,CAAC,GAED,CAAA;AACF;"}
|
|
@@ -1,10 +1,12 @@
|
|
|
1
1
|
import { ComboboxRootProps } from '@ark-ui/solid';
|
|
2
|
-
import { Component } from 'solid-js';
|
|
3
|
-
|
|
2
|
+
import { Component, ComponentProps } from 'solid-js';
|
|
3
|
+
import { ComboboxInput } from '../Combobox';
|
|
4
|
+
export type ComboboxFieldProps = ComponentProps<typeof ComboboxInput> & {
|
|
5
|
+
collection: ComboboxRootProps<string>['collection'];
|
|
4
6
|
label?: string;
|
|
5
7
|
description?: string;
|
|
6
8
|
showTrigger?: boolean;
|
|
7
|
-
|
|
9
|
+
showClearTrigger?: boolean;
|
|
8
10
|
} & {
|
|
9
11
|
class?: string;
|
|
10
12
|
};
|
|
@@ -1,66 +1,68 @@
|
|
|
1
|
-
import { createComponent as
|
|
2
|
-
import { Combobox as
|
|
3
|
-
import { Field as
|
|
1
|
+
import { createComponent as e, mergeProps as s, insert as i, memo as g, template as d } from "solid-js/web";
|
|
2
|
+
import { Combobox as u, ComboboxControl as c, ComboboxInput as h, ComboboxClearTrigger as m, ComboboxTrigger as b, ComboboxPositioner as C, ComboboxContent as p, ComboboxList as x } from "../Combobox.js";
|
|
3
|
+
import { Field as f, FieldLabel as T, FieldContent as v, FieldError as w, FieldDescription as O } from "../Field.js";
|
|
4
4
|
import { useFieldContext as F } from "./context.js";
|
|
5
|
-
import { splitProps as
|
|
6
|
-
var _ = /* @__PURE__ */
|
|
7
|
-
const y = (l) =>
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
return r(x, {
|
|
5
|
+
import { splitProps as a } from "solid-js";
|
|
6
|
+
var _ = /* @__PURE__ */ d('<div class="gap-1 flex items-center">');
|
|
7
|
+
const y = (l) => {
|
|
8
|
+
const [t, r] = a(l, ["showTrigger", "showClearTrigger", "children"]);
|
|
9
|
+
return [e(c, {
|
|
10
|
+
get children() {
|
|
11
|
+
return [e(h, r), (() => {
|
|
12
|
+
var o = _();
|
|
13
|
+
return i(o, (() => {
|
|
14
|
+
var n = g(() => t.showClearTrigger === !0);
|
|
15
|
+
return () => n() && e(m, {});
|
|
16
|
+
})(), null), i(o, (() => {
|
|
17
|
+
var n = g(() => t.showTrigger === !0);
|
|
18
|
+
return () => n() && e(b, {});
|
|
19
|
+
})(), null), o;
|
|
20
|
+
})()];
|
|
21
|
+
}
|
|
22
|
+
}), e(C, {
|
|
23
|
+
get children() {
|
|
24
|
+
return e(p, {
|
|
25
|
+
get children() {
|
|
26
|
+
return e(x, {
|
|
27
|
+
get children() {
|
|
28
|
+
return t.children;
|
|
29
|
+
}
|
|
30
|
+
});
|
|
31
|
+
}
|
|
32
|
+
});
|
|
33
|
+
}
|
|
34
|
+
})];
|
|
35
|
+
}, P = ["label", "description", "required", "disabled", "readOnly", "collection", "showTrigger", "showClearTrigger", "children"], D = (l) => {
|
|
36
|
+
const t = F(), [r, o] = a(l, P);
|
|
37
|
+
return e(f, {
|
|
39
38
|
get invalid() {
|
|
40
39
|
return t().state.meta.errors.length > 0;
|
|
41
40
|
},
|
|
42
41
|
get disabled() {
|
|
43
|
-
return
|
|
42
|
+
return r.disabled ?? !1;
|
|
44
43
|
},
|
|
45
44
|
get readOnly() {
|
|
46
|
-
return
|
|
45
|
+
return r.readOnly ?? !1;
|
|
47
46
|
},
|
|
48
47
|
get required() {
|
|
49
|
-
return
|
|
48
|
+
return r.required ?? !1;
|
|
50
49
|
},
|
|
51
50
|
get children() {
|
|
52
|
-
return [
|
|
51
|
+
return [e(T, {
|
|
53
52
|
get children() {
|
|
54
|
-
return
|
|
53
|
+
return r.label;
|
|
55
54
|
}
|
|
56
|
-
}),
|
|
55
|
+
}), e(v, {
|
|
57
56
|
get children() {
|
|
58
|
-
return [
|
|
57
|
+
return [e(u, {
|
|
58
|
+
get collection() {
|
|
59
|
+
return r.collection;
|
|
60
|
+
},
|
|
59
61
|
get value() {
|
|
60
62
|
return t().state.value;
|
|
61
63
|
},
|
|
62
|
-
onValueChange: (
|
|
63
|
-
t().handleChange(
|
|
64
|
+
onValueChange: (n) => {
|
|
65
|
+
t().handleChange(n.value);
|
|
64
66
|
},
|
|
65
67
|
onBlur: () => {
|
|
66
68
|
t().handleBlur();
|
|
@@ -69,35 +71,32 @@ const y = (l) => [r(g, {
|
|
|
69
71
|
return t().state.meta.errors.length > 0;
|
|
70
72
|
},
|
|
71
73
|
get disabled() {
|
|
72
|
-
return
|
|
74
|
+
return r.disabled ?? !1;
|
|
73
75
|
},
|
|
74
76
|
get readOnly() {
|
|
75
|
-
return
|
|
76
|
-
}
|
|
77
|
-
}, i, {
|
|
77
|
+
return r.readOnly ?? !1;
|
|
78
|
+
},
|
|
78
79
|
get children() {
|
|
79
|
-
return
|
|
80
|
-
get placeholder() {
|
|
81
|
-
return e.placeholder;
|
|
82
|
-
},
|
|
80
|
+
return e(y, s({
|
|
83
81
|
get showTrigger() {
|
|
84
|
-
return
|
|
85
|
-
},
|
|
86
|
-
get showClear() {
|
|
87
|
-
return e.showClear;
|
|
82
|
+
return r.showTrigger;
|
|
88
83
|
},
|
|
84
|
+
get showClearTrigger() {
|
|
85
|
+
return r.showClearTrigger;
|
|
86
|
+
}
|
|
87
|
+
}, o, {
|
|
89
88
|
get children() {
|
|
90
|
-
return
|
|
89
|
+
return r.children;
|
|
91
90
|
}
|
|
92
|
-
});
|
|
91
|
+
}));
|
|
93
92
|
}
|
|
94
|
-
})
|
|
93
|
+
}), e(w, {
|
|
95
94
|
get errors() {
|
|
96
95
|
return t().state.meta.errors;
|
|
97
96
|
}
|
|
98
|
-
}),
|
|
97
|
+
}), e(O, {
|
|
99
98
|
get children() {
|
|
100
|
-
return
|
|
99
|
+
return r.description;
|
|
101
100
|
}
|
|
102
101
|
})];
|
|
103
102
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ComboboxField.js","sources":["../../../src/components/form/ComboboxField.tsx"],"sourcesContent":["import type { ComboboxRootProps } from '@ark-ui/solid';\nimport type { Component, ComponentProps } from 'solid-js';\n\nimport {\n Combobox,\n ComboboxContent,\n ComboboxInput,\n ComboboxList,\n ComboboxPositioner,\n ComboboxControl,\n ComboboxTrigger,\n ComboboxClearTrigger,\n} from '@/components/Combobox';\nimport { Field, FieldContent, FieldDescription, FieldError, FieldLabel } from '@/components/Field';\n\nimport { useFieldContext } from './context';\n\nexport type ComboboxFieldProps =
|
|
1
|
+
{"version":3,"file":"ComboboxField.js","sources":["../../../src/components/form/ComboboxField.tsx"],"sourcesContent":["import type { ComboboxRootProps } from '@ark-ui/solid';\nimport type { Component, ComponentProps } from 'solid-js';\n\nimport {\n Combobox,\n ComboboxContent,\n ComboboxInput,\n ComboboxList,\n ComboboxPositioner,\n ComboboxControl,\n ComboboxTrigger,\n ComboboxClearTrigger,\n} from '@/components/Combobox';\nimport { Field, FieldContent, FieldDescription, FieldError, FieldLabel } from '@/components/Field';\n\nimport { useFieldContext } from './context';\n\nexport type ComboboxFieldProps = ComponentProps<typeof ComboboxInput> & {\n collection: ComboboxRootProps<string>['collection'];\n label?: string;\n description?: string;\n showTrigger?: boolean;\n showClearTrigger?: boolean;\n} & { class?: string };\n\nconst ComboboxInputGroup: Component<\n ComponentProps<typeof ComboboxInput> & {\n showTrigger?: boolean | undefined;\n showClearTrigger?: boolean | undefined;\n }\n> = (props) => {\n const [local, others] = splitProps(props, ['showTrigger', 'showClearTrigger', 'children']);\n\n return (\n <>\n <ComboboxControl>\n <ComboboxInput {...others} />\n <div class='gap-1 flex items-center'>\n {local.showClearTrigger === true && <ComboboxClearTrigger />}\n {local.showTrigger === true && <ComboboxTrigger />}\n </div>\n </ComboboxControl>\n <ComboboxPositioner>\n <ComboboxContent>\n <ComboboxList>{local.children}</ComboboxList>\n </ComboboxContent>\n </ComboboxPositioner>\n </>\n );\n};\n\nconst COMBOBOX_FIELD_PROPS = [\n 'label',\n 'description',\n 'required',\n 'disabled',\n 'readOnly',\n 'collection',\n 'showTrigger',\n 'showClearTrigger',\n 'children',\n] as const;\n\nexport const ComboboxField: Component<ComboboxFieldProps> = (props) => {\n const field = useFieldContext<string[]>();\n const [local, others] = splitProps(props, COMBOBOX_FIELD_PROPS);\n\n return (\n <Field\n invalid={field().state.meta.errors.length > 0}\n disabled={local.disabled ?? false}\n readOnly={local.readOnly ?? false}\n required={local.required ?? false}\n >\n <FieldLabel>{local.label}</FieldLabel>\n <FieldContent>\n <Combobox<string>\n collection={local.collection}\n value={field().state.value}\n onValueChange={(details) => {\n field().handleChange(details.value);\n }}\n onBlur={() => {\n field().handleBlur();\n }}\n invalid={field().state.meta.errors.length > 0}\n disabled={local.disabled ?? false}\n readOnly={local.readOnly ?? false}\n >\n <ComboboxInputGroup\n showTrigger={local.showTrigger}\n showClearTrigger={local.showClearTrigger}\n {...others}\n >\n {local.children}\n </ComboboxInputGroup>\n </Combobox>\n <FieldError errors={field().state.meta.errors} />\n <FieldDescription>{local.description}</FieldDescription>\n </FieldContent>\n </Field>\n );\n};\n"],"names":["ComboboxInputGroup","props","local","others","splitProps","_$createComponent","ComboboxControl","children","ComboboxInput","_el$","_tmpl$","_$insert","_c$","_$memo","showClearTrigger","ComboboxClearTrigger","_c$2","showTrigger","ComboboxTrigger","ComboboxPositioner","ComboboxContent","ComboboxList","COMBOBOX_FIELD_PROPS","ComboboxField","field","useFieldContext","Field","invalid","state","meta","errors","length","disabled","readOnly","required","FieldLabel","label","FieldContent","Combobox","collection","value","onValueChange","details","handleChange","onBlur","handleBlur","_$mergeProps","FieldError","FieldDescription","description"],"mappings":"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"}
|
|
@@ -1,7 +1,8 @@
|
|
|
1
|
-
import {
|
|
1
|
+
import { DatePickerInputProps } from '@ark-ui/solid';
|
|
2
2
|
import { Component } from 'solid-js';
|
|
3
|
-
export type DatePickerFieldProps =
|
|
3
|
+
export type DatePickerFieldProps = DatePickerInputProps & {
|
|
4
4
|
label?: string;
|
|
5
5
|
description?: string;
|
|
6
|
+
showTrigger?: boolean;
|
|
6
7
|
};
|
|
7
8
|
export declare const DatePickerField: Component<DatePickerFieldProps>;
|
|
@@ -1,23 +1,33 @@
|
|
|
1
|
-
import { createComponent as e, mergeProps as a } from "solid-js/web";
|
|
2
|
-
import { DatePicker as
|
|
3
|
-
import { Field as
|
|
4
|
-
import { useFieldContext as
|
|
5
|
-
import { splitProps as
|
|
6
|
-
const C = (n) =>
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
}
|
|
19
|
-
|
|
20
|
-
|
|
1
|
+
import { createComponent as e, mergeProps as a, Show as d } from "solid-js/web";
|
|
2
|
+
import { DatePicker as s, DatePickerControl as g, DatePickerInput as u, DatePickerTrigger as c, DatePickerPositioner as h, DatePickerContent as p, DatePickerViews as m } from "../DatePicker.js";
|
|
3
|
+
import { Field as P, FieldLabel as f, FieldContent as D, FieldError as b, FieldDescription as k } from "../Field.js";
|
|
4
|
+
import { useFieldContext as w } from "./context.js";
|
|
5
|
+
import { splitProps as l } from "solid-js";
|
|
6
|
+
const C = (n) => {
|
|
7
|
+
const [t, r] = l(n, ["showTrigger"]);
|
|
8
|
+
return [e(g, {
|
|
9
|
+
get children() {
|
|
10
|
+
return [e(u, r), e(d, {
|
|
11
|
+
get when() {
|
|
12
|
+
return t.showTrigger !== !1;
|
|
13
|
+
},
|
|
14
|
+
get children() {
|
|
15
|
+
return e(c, {});
|
|
16
|
+
}
|
|
17
|
+
})];
|
|
18
|
+
}
|
|
19
|
+
}), e(h, {
|
|
20
|
+
get children() {
|
|
21
|
+
return e(p, {
|
|
22
|
+
get children() {
|
|
23
|
+
return e(m, {});
|
|
24
|
+
}
|
|
25
|
+
});
|
|
26
|
+
}
|
|
27
|
+
})];
|
|
28
|
+
}, F = ["label", "description", "required", "disabled", "readOnly", "placeholder", "showTrigger"], I = (n) => {
|
|
29
|
+
const t = w(), [r, i] = l(n, F);
|
|
30
|
+
return e(P, {
|
|
21
31
|
get invalid() {
|
|
22
32
|
return t().state.meta.errors.length > 0;
|
|
23
33
|
},
|
|
@@ -31,18 +41,18 @@ const C = (n) => [e(o, {
|
|
|
31
41
|
return r.required ?? !1;
|
|
32
42
|
},
|
|
33
43
|
get children() {
|
|
34
|
-
return [e(
|
|
44
|
+
return [e(f, {
|
|
35
45
|
get children() {
|
|
36
46
|
return r.label;
|
|
37
47
|
}
|
|
38
|
-
}), e(
|
|
48
|
+
}), e(D, {
|
|
39
49
|
get children() {
|
|
40
|
-
return [e(
|
|
50
|
+
return [e(s, {
|
|
41
51
|
get value() {
|
|
42
52
|
return t().state.value;
|
|
43
53
|
},
|
|
44
|
-
onValueChange: (
|
|
45
|
-
t().handleChange(
|
|
54
|
+
onValueChange: (o) => {
|
|
55
|
+
t().handleChange(o.value);
|
|
46
56
|
},
|
|
47
57
|
onBlur: () => {
|
|
48
58
|
t().handleBlur();
|
|
@@ -55,20 +65,21 @@ const C = (n) => [e(o, {
|
|
|
55
65
|
},
|
|
56
66
|
get readOnly() {
|
|
57
67
|
return r.readOnly ?? !1;
|
|
58
|
-
}
|
|
59
|
-
}, l, {
|
|
68
|
+
},
|
|
60
69
|
get children() {
|
|
61
|
-
return e(C, {
|
|
70
|
+
return e(C, a(i, {
|
|
62
71
|
get placeholder() {
|
|
63
72
|
return r.placeholder;
|
|
64
73
|
}
|
|
65
|
-
})
|
|
74
|
+
}, () => typeof r.showTrigger == "boolean" && {
|
|
75
|
+
showTrigger: r.showTrigger
|
|
76
|
+
}));
|
|
66
77
|
}
|
|
67
|
-
})
|
|
78
|
+
}), e(b, {
|
|
68
79
|
get errors() {
|
|
69
80
|
return t().state.meta.errors;
|
|
70
81
|
}
|
|
71
|
-
}), e(
|
|
82
|
+
}), e(k, {
|
|
72
83
|
get children() {
|
|
73
84
|
return r.description;
|
|
74
85
|
}
|
|
@@ -79,6 +90,6 @@ const C = (n) => [e(o, {
|
|
|
79
90
|
});
|
|
80
91
|
};
|
|
81
92
|
export {
|
|
82
|
-
|
|
93
|
+
I as DatePickerField
|
|
83
94
|
};
|
|
84
95
|
//# sourceMappingURL=DatePickerField.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"DatePickerField.js","sources":["../../../src/components/form/DatePickerField.tsx"],"sourcesContent":["import type { DatePickerInputProps,
|
|
1
|
+
{"version":3,"file":"DatePickerField.js","sources":["../../../src/components/form/DatePickerField.tsx"],"sourcesContent":["import type { DatePickerInputProps, DateValue } from '@ark-ui/solid';\nimport type { Component } from 'solid-js';\n\nimport {\n DatePicker,\n DatePickerContent,\n DatePickerControl,\n DatePickerInput,\n DatePickerPositioner,\n DatePickerTrigger,\n DatePickerViews,\n} from '@/components/DatePicker';\nimport { Field, FieldContent, FieldDescription, FieldError, FieldLabel } from '@/components/Field';\n\nimport { useFieldContext } from './context';\n\nexport type DatePickerFieldProps = DatePickerInputProps & {\n label?: string;\n description?: string;\n showTrigger?: boolean;\n};\n\nconst DatePickerInputGroup: Component<DatePickerInputProps & { showTrigger?: boolean }> = (\n props,\n) => {\n const [local, others] = splitProps(props, ['showTrigger']);\n\n return (\n <>\n <DatePickerControl>\n <DatePickerInput {...others} />\n <Show when={local.showTrigger !== false}>\n <DatePickerTrigger />\n </Show>\n </DatePickerControl>\n <DatePickerPositioner>\n <DatePickerContent>\n <DatePickerViews />\n </DatePickerContent>\n </DatePickerPositioner>\n </>\n );\n};\n\nconst DATE_PICKER_FIELD_PROPS = [\n 'label',\n 'description',\n 'required',\n 'disabled',\n 'readOnly',\n 'placeholder',\n 'showTrigger',\n] as const;\n\nexport const DatePickerField: Component<DatePickerFieldProps> = (props) => {\n const field = useFieldContext<DateValue[]>();\n const [local, others] = splitProps(props, DATE_PICKER_FIELD_PROPS);\n\n return (\n <Field\n invalid={field().state.meta.errors.length > 0}\n disabled={local.disabled ?? false}\n readOnly={local.readOnly ?? false}\n required={local.required ?? false}\n >\n <FieldLabel>{local.label}</FieldLabel>\n <FieldContent>\n <DatePicker\n value={field().state.value}\n onValueChange={(details) => {\n field().handleChange(details.value);\n }}\n onBlur={() => {\n field().handleBlur();\n }}\n invalid={field().state.meta.errors.length > 0}\n disabled={local.disabled ?? false}\n readOnly={local.readOnly ?? false}\n >\n <DatePickerInputGroup\n {...others}\n placeholder={local.placeholder}\n {...(typeof local.showTrigger === 'boolean' && { showTrigger: local.showTrigger })}\n />\n </DatePicker>\n <FieldError errors={field().state.meta.errors} />\n <FieldDescription>{local.description}</FieldDescription>\n </FieldContent>\n </Field>\n );\n};\n"],"names":["DatePickerInputGroup","props","local","others","splitProps","_$createComponent","DatePickerControl","children","DatePickerInput","_$Show","when","showTrigger","DatePickerTrigger","DatePickerPositioner","DatePickerContent","DatePickerViews","DATE_PICKER_FIELD_PROPS","DatePickerField","field","useFieldContext","Field","invalid","state","meta","errors","length","disabled","readOnly","required","FieldLabel","label","FieldContent","DatePicker","value","onValueChange","details","handleChange","onBlur","handleBlur","_$mergeProps","placeholder","FieldError","FieldDescription","description"],"mappings":";;;;;AAsBA,MAAMA,IACJC,CAAAA,MACG;AACH,QAAM,CAACC,GAAOC,CAAM,IAAIC,EAAWH,GAAO,CAAC,aAAa,CAAC;AAEzD,SAAA,CAAAI,EAEKC,GAAiB;AAAA,IAAA,IAAAC,WAAA;AAAA,aAAA,CAAAF,EACfG,GAAoBL,CAAM,GAAAE,EAC1BI,GAAI;AAAA,QAAA,IAACC,OAAI;AAAA,iBAAER,EAAMS,gBAAgB;AAAA,QAAK;AAAA,QAAA,IAAAJ,WAAA;AAAA,iBAAAF,EACpCO,GAAiB,EAAA;AAAA,QAAA;AAAA,MAAA,CAAA,CAAA;AAAA,IAAA;AAAA,EAAA,CAAA,GAAAP,EAGrBQ,GAAoB;AAAA,IAAA,IAAAN,WAAA;AAAA,aAAAF,EAClBS,GAAiB;AAAA,QAAA,IAAAP,WAAA;AAAA,iBAAAF,EACfU,GAAe,EAAA;AAAA,QAAA;AAAA,MAAA,CAAA;AAAA,IAAA;AAAA,EAAA,CAAA,CAAA;AAK1B,GAEMC,IAA0B,CAC9B,SACA,eACA,YACA,YACA,YACA,eACA,aAAa,GAGFC,IAAoDhB,CAAAA,MAAU;AACzE,QAAMiB,IAAQC,EAAAA,GACR,CAACjB,GAAOC,CAAM,IAAIC,EAAWH,GAAOe,CAAuB;AAEjE,SAAAX,EACGe,GAAK;AAAA,IAAA,IACJC,UAAO;AAAA,aAAEH,EAAAA,EAAQI,MAAMC,KAAKC,OAAOC,SAAS;AAAA,IAAC;AAAA,IAAA,IAC7CC,WAAQ;AAAA,aAAExB,EAAMwB,YAAY;AAAA,IAAK;AAAA,IAAA,IACjCC,WAAQ;AAAA,aAAEzB,EAAMyB,YAAY;AAAA,IAAK;AAAA,IAAA,IACjCC,WAAQ;AAAA,aAAE1B,EAAM0B,YAAY;AAAA,IAAK;AAAA,IAAA,IAAArB,WAAA;AAAA,aAAA,CAAAF,EAEhCwB,GAAU;AAAA,QAAA,IAAAtB,WAAA;AAAA,iBAAEL,EAAM4B;AAAAA,QAAK;AAAA,MAAA,CAAA,GAAAzB,EACvB0B,GAAY;AAAA,QAAA,IAAAxB,WAAA;AAAA,iBAAA,CAAAF,EACV2B,GAAU;AAAA,YAAA,IACTC,QAAK;AAAA,qBAAEf,EAAAA,EAAQI,MAAMW;AAAAA,YAAK;AAAA,YAC1BC,eAAgBC,CAAAA,MAAY;AAC1BjB,cAAAA,IAAQkB,aAAaD,EAAQF,KAAK;AAAA,YACpC;AAAA,YACAI,QAAQA,MAAM;AACZnB,cAAAA,EAAAA,EAAQoB,WAAAA;AAAAA,YACV;AAAA,YAAC,IACDjB,UAAO;AAAA,qBAAEH,EAAAA,EAAQI,MAAMC,KAAKC,OAAOC,SAAS;AAAA,YAAC;AAAA,YAAA,IAC7CC,WAAQ;AAAA,qBAAExB,EAAMwB,YAAY;AAAA,YAAK;AAAA,YAAA,IACjCC,WAAQ;AAAA,qBAAEzB,EAAMyB,YAAY;AAAA,YAAK;AAAA,YAAA,IAAApB,WAAA;AAAA,qBAAAF,EAEhCL,GAAoBuC,EACfpC,GAAM;AAAA,gBAAA,IACVqC,cAAW;AAAA,yBAAEtC,EAAMsC;AAAAA,gBAAW;AAAA,cAAA,GAAA,MACzB,OAAOtC,EAAMS,eAAgB,aAAa;AAAA,gBAAEA,aAAaT,EAAMS;AAAAA,cAAAA,CAAa,CAAA;AAAA,YAAA;AAAA,UAAA,CAAA,GAAAN,EAGpFoC,GAAU;AAAA,YAAA,IAACjB,SAAM;AAAA,qBAAEN,EAAAA,EAAQI,MAAMC,KAAKC;AAAAA,YAAM;AAAA,UAAA,CAAA,GAAAnB,EAC5CqC,GAAgB;AAAA,YAAA,IAAAnC,WAAA;AAAA,qBAAEL,EAAMyC;AAAAA,YAAW;AAAA,UAAA,CAAA,CAAA;AAAA,QAAA;AAAA,MAAA,CAAA,CAAA;AAAA,IAAA;AAAA,EAAA,CAAA;AAI5C;"}
|