@trsys-tech/matrix-library 0.4.2 → 0.4.3
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-checkbox/FormCheckbox.d.ts +1 -0
- package/dist/components/form-checkbox/FormCheckbox.d.ts.map +1 -1
- package/dist/components/form-combobox/FormCombobox.d.ts +1 -0
- package/dist/components/form-combobox/FormCombobox.d.ts.map +1 -1
- package/dist/components/form-date-picker/FormDatePicker.d.ts +1 -0
- package/dist/components/form-date-picker/FormDatePicker.d.ts.map +1 -1
- package/dist/components/form-date-range-picker/FormDateRangePicker.d.ts +1 -0
- package/dist/components/form-date-range-picker/FormDateRangePicker.d.ts.map +1 -1
- package/dist/components/form-input/FormInput.d.ts +1 -0
- package/dist/components/form-input/FormInput.d.ts.map +1 -1
- package/dist/components/form-multi-select/FormMultiSelect.d.ts +1 -0
- package/dist/components/form-multi-select/FormMultiSelect.d.ts.map +1 -1
- package/dist/components/form-rating/FormRating.d.ts +1 -0
- package/dist/components/form-rating/FormRating.d.ts.map +1 -1
- package/dist/components/form-select/FormSelect.d.ts +1 -0
- package/dist/components/form-select/FormSelect.d.ts.map +1 -1
- package/dist/components/form-switch/FormSwitch.d.ts +1 -0
- package/dist/components/form-switch/FormSwitch.d.ts.map +1 -1
- package/dist/components/form-textarea/FormTextarea.d.ts +1 -0
- package/dist/components/form-textarea/FormTextarea.d.ts.map +1 -1
- package/dist/components/form-time-picker/FormTimePicker.d.ts +1 -0
- package/dist/components/form-time-picker/FormTimePicker.d.ts.map +1 -1
- package/dist/formcheckbox.es.js +20 -20
- package/dist/formcheckbox.es.js.map +1 -1
- package/dist/formcombobox.es.js +36 -35
- package/dist/formcombobox.es.js.map +1 -1
- package/dist/formdatepicker.es.js +16 -16
- package/dist/formdatepicker.es.js.map +1 -1
- package/dist/formdaterangepicker.es.js +23 -15
- package/dist/formdaterangepicker.es.js.map +1 -1
- package/dist/forminput.es.js +13 -13
- package/dist/forminput.es.js.map +1 -1
- package/dist/formmultiselect.es.js +33 -32
- package/dist/formmultiselect.es.js.map +1 -1
- package/dist/formrating.es.js +40 -39
- package/dist/formrating.es.js.map +1 -1
- package/dist/formselect.es.js +28 -27
- package/dist/formselect.es.js.map +1 -1
- package/dist/formswitch.es.js +16 -16
- package/dist/formswitch.es.js.map +1 -1
- package/dist/formtextarea.es.js +14 -14
- package/dist/formtextarea.es.js.map +1 -1
- package/dist/formtimepicker.es.js +14 -14
- package/dist/formtimepicker.es.js.map +1 -1
- package/package.json +1 -1
package/dist/forminput.es.js
CHANGED
|
@@ -1,28 +1,28 @@
|
|
|
1
1
|
import { jsx as e, jsxs as t } from "react/jsx-runtime";
|
|
2
|
-
import { FormField as
|
|
2
|
+
import { FormField as c, FormItem as f, FormLabel as x, FormControl as b, FormMessage as g } from "./form.es.js";
|
|
3
3
|
import { TextField as h } from "./textfield.es.js";
|
|
4
|
-
const
|
|
5
|
-
const { name: m, control: n, defaultValue:
|
|
4
|
+
const C = (l) => {
|
|
5
|
+
const { name: m, control: n, defaultValue: d, disabled: o, readOnly: i, rules: p, shouldUnregister: a, label: u, slotProps: r, required: s, ...P } = l;
|
|
6
6
|
return /* @__PURE__ */ e(
|
|
7
|
-
|
|
7
|
+
c,
|
|
8
8
|
{
|
|
9
9
|
control: n,
|
|
10
10
|
name: m,
|
|
11
|
-
defaultValue:
|
|
11
|
+
defaultValue: d,
|
|
12
12
|
disabled: o,
|
|
13
13
|
rules: p,
|
|
14
|
-
shouldUnregister:
|
|
15
|
-
render: ({ field:
|
|
16
|
-
/* @__PURE__ */ t(
|
|
17
|
-
|
|
14
|
+
shouldUnregister: a,
|
|
15
|
+
render: ({ field: F }) => /* @__PURE__ */ t(f, { ...P, children: [
|
|
16
|
+
/* @__PURE__ */ t(x, { ...r?.formLabelProps ?? {}, children: [
|
|
17
|
+
u,
|
|
18
18
|
s && /* @__PURE__ */ e("span", { className: "text-danger text-sm leading-4", children: "*" })
|
|
19
19
|
] }),
|
|
20
|
-
/* @__PURE__ */ e(
|
|
20
|
+
/* @__PURE__ */ e(b, { ...r?.formControlProps ?? {}, children: /* @__PURE__ */ e(
|
|
21
21
|
h,
|
|
22
22
|
{
|
|
23
23
|
...r?.textFieldProps ?? {},
|
|
24
|
-
disabled: o,
|
|
25
|
-
slotProps: { inputProps: { ...r?.textFieldProps?.slotProps?.inputProps, ...
|
|
24
|
+
disabled: o || i,
|
|
25
|
+
slotProps: { inputProps: { ...r?.textFieldProps?.slotProps?.inputProps, ...F, "aria-required": s } }
|
|
26
26
|
}
|
|
27
27
|
) }),
|
|
28
28
|
/* @__PURE__ */ e(g, { ...r?.formMessageProps ?? {} })
|
|
@@ -31,6 +31,6 @@ const q = (l) => {
|
|
|
31
31
|
);
|
|
32
32
|
};
|
|
33
33
|
export {
|
|
34
|
-
|
|
34
|
+
C as FormInput
|
|
35
35
|
};
|
|
36
36
|
//# sourceMappingURL=forminput.es.js.map
|
package/dist/forminput.es.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"forminput.es.js","sources":["../src/components/form-input/FormInput.tsx"],"sourcesContent":["\"use client\";\r\n\r\nimport { FormControl, FormField, FormItem, FormLabel, FormMessage } from \"../form/Form\";\r\nimport { SlotProps } from \"@radix-ui/react-slot\";\r\nimport { Control, ControllerProps, FieldPath, FieldValues } from \"react-hook-form\";\r\nimport { TextField, TextFieldProps } from \"../text-field/TextField\";\r\n\r\ntype FormInputProps<TFieldValues extends FieldValues, TName extends FieldPath<TFieldValues>> = Omit<ControllerProps<TFieldValues, TName>, \"render\"> &\r\n React.ComponentProps<typeof FormItem> & {\r\n label: string;\r\n control: Control<TFieldValues>;\r\n required?: boolean;\r\n slotProps?: {\r\n formLabelProps?: React.HTMLAttributes<HTMLLabelElement> & React.RefAttributes<HTMLLabelElement>;\r\n formMessageProps?: React.HTMLAttributes<HTMLParagraphElement> & React.RefAttributes<HTMLParagraphElement>;\r\n formControlProps?: Omit<SlotProps & React.RefAttributes<HTMLElement>, \"ref\"> & React.RefAttributes<HTMLElement>;\r\n textFieldProps?: TextFieldProps & React.RefAttributes<HTMLInputElement>;\r\n };\r\n };\r\n\r\nconst FormInput = <TFieldValues extends FieldValues, TName extends FieldPath<TFieldValues>>(props: FormInputProps<TFieldValues, TName>) => {\r\n const { name, control, defaultValue, disabled, rules, shouldUnregister, label, slotProps, required, ...formItemProps } = props;\r\n\r\n return (\r\n <FormField\r\n control={control}\r\n name={name}\r\n defaultValue={defaultValue}\r\n disabled={disabled}\r\n rules={rules}\r\n shouldUnregister={shouldUnregister}\r\n render={({ field }) => {\r\n return (\r\n <FormItem {...formItemProps}>\r\n <FormLabel {...(slotProps?.formLabelProps ?? {})}>\r\n {label}\r\n {required && <span className=\"text-danger text-sm leading-4\">*</span>}\r\n </FormLabel>\r\n <FormControl {...(slotProps?.formControlProps ?? {})}>\r\n <TextField\r\n {...(slotProps?.textFieldProps ?? {})}\r\n disabled={disabled}\r\n slotProps={{ inputProps: { ...slotProps?.textFieldProps?.slotProps?.inputProps, ...field, \"aria-required\": required } }}\r\n />\r\n </FormControl>\r\n <FormMessage {...(slotProps?.formMessageProps ?? {})} />\r\n </FormItem>\r\n );\r\n }}\r\n />\r\n );\r\n};\r\nexport { FormInput, type FormInputProps };\r\n"],"names":["FormInput","props","name","control","defaultValue","disabled","rules","shouldUnregister","label","slotProps","required","formItemProps","jsx","FormField","field","jsxs","FormItem","FormLabel","FormControl","TextField","FormMessage"],"mappings":";;;
|
|
1
|
+
{"version":3,"file":"forminput.es.js","sources":["../src/components/form-input/FormInput.tsx"],"sourcesContent":["\"use client\";\r\n\r\nimport { FormControl, FormField, FormItem, FormLabel, FormMessage } from \"../form/Form\";\r\nimport { SlotProps } from \"@radix-ui/react-slot\";\r\nimport { Control, ControllerProps, FieldPath, FieldValues } from \"react-hook-form\";\r\nimport { TextField, TextFieldProps } from \"../text-field/TextField\";\r\n\r\ntype FormInputProps<TFieldValues extends FieldValues, TName extends FieldPath<TFieldValues>> = Omit<ControllerProps<TFieldValues, TName>, \"render\"> &\r\n React.ComponentProps<typeof FormItem> & {\r\n label: string;\r\n control: Control<TFieldValues>;\r\n required?: boolean;\r\n readOnly?: boolean;\r\n slotProps?: {\r\n formLabelProps?: React.HTMLAttributes<HTMLLabelElement> & React.RefAttributes<HTMLLabelElement>;\r\n formMessageProps?: React.HTMLAttributes<HTMLParagraphElement> & React.RefAttributes<HTMLParagraphElement>;\r\n formControlProps?: Omit<SlotProps & React.RefAttributes<HTMLElement>, \"ref\"> & React.RefAttributes<HTMLElement>;\r\n textFieldProps?: TextFieldProps & React.RefAttributes<HTMLInputElement>;\r\n };\r\n };\r\n\r\nconst FormInput = <TFieldValues extends FieldValues, TName extends FieldPath<TFieldValues>>(props: FormInputProps<TFieldValues, TName>) => {\r\n const { name, control, defaultValue, disabled, readOnly, rules, shouldUnregister, label, slotProps, required, ...formItemProps } = props;\r\n\r\n return (\r\n <FormField\r\n control={control}\r\n name={name}\r\n defaultValue={defaultValue}\r\n disabled={disabled}\r\n rules={rules}\r\n shouldUnregister={shouldUnregister}\r\n render={({ field }) => {\r\n return (\r\n <FormItem {...formItemProps}>\r\n <FormLabel {...(slotProps?.formLabelProps ?? {})}>\r\n {label}\r\n {required && <span className=\"text-danger text-sm leading-4\">*</span>}\r\n </FormLabel>\r\n <FormControl {...(slotProps?.formControlProps ?? {})}>\r\n <TextField\r\n {...(slotProps?.textFieldProps ?? {})}\r\n disabled={disabled || readOnly}\r\n slotProps={{ inputProps: { ...slotProps?.textFieldProps?.slotProps?.inputProps, ...field, \"aria-required\": required } }}\r\n />\r\n </FormControl>\r\n <FormMessage {...(slotProps?.formMessageProps ?? {})} />\r\n </FormItem>\r\n );\r\n }}\r\n />\r\n );\r\n};\r\nexport { FormInput, type FormInputProps };\r\n"],"names":["FormInput","props","name","control","defaultValue","disabled","readOnly","rules","shouldUnregister","label","slotProps","required","formItemProps","jsx","FormField","field","jsxs","FormItem","FormLabel","FormControl","TextField","FormMessage"],"mappings":";;;AAqBM,MAAAA,IAAY,CAA0EC,MAA+C;AACzI,QAAM,EAAE,MAAAC,GAAM,SAAAC,GAAS,cAAAC,GAAc,UAAAC,GAAU,UAAAC,GAAU,OAAAC,GAAO,kBAAAC,GAAkB,OAAAC,GAAO,WAAAC,GAAW,UAAAC,GAAU,GAAGC,EAAkB,IAAAX;AAGjI,SAAA,gBAAAY;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,SAAAX;AAAA,MACA,MAAAD;AAAA,MACA,cAAAE;AAAA,MACA,UAAAC;AAAA,MACA,OAAAE;AAAA,MACA,kBAAAC;AAAA,MACA,QAAQ,CAAC,EAAE,OAAAO,QAEP,gBAAAC,EAACC,GAAU,EAAA,GAAGL,GACZ,UAAA;AAAA,QAAA,gBAAAI,EAACE,GAAW,EAAA,GAAIR,GAAW,kBAAkB,CAC1C,GAAA,UAAA;AAAA,UAAAD;AAAA,UACAE,KAAY,gBAAAE,EAAC,QAAK,EAAA,WAAU,iCAAgC,UAAC,IAAA,CAAA;AAAA,QAAA,GAChE;AAAA,0BACCM,GAAa,EAAA,GAAIT,GAAW,oBAAoB,CAAA,GAC/C,UAAA,gBAAAG;AAAA,UAACO;AAAA,UAAA;AAAA,YACE,GAAIV,GAAW,kBAAkB,CAAC;AAAA,YACnC,UAAUL,KAAYC;AAAA,YACtB,WAAW,EAAE,YAAY,EAAE,GAAGI,GAAW,gBAAgB,WAAW,YAAY,GAAGK,GAAO,iBAAiBJ,EAAW,EAAA;AAAA,UAAA;AAAA,QAAA,GAE1H;AAAA,0BACCU,GAAa,EAAA,GAAIX,GAAW,oBAAoB,CAAA,EAAK,CAAA;AAAA,MAAA,GACxD;AAAA,IAEJ;AAAA,EACF;AAEJ;"}
|
|
@@ -1,60 +1,61 @@
|
|
|
1
|
-
import { jsx as e, jsxs as
|
|
1
|
+
import { jsx as e, jsxs as m } from "react/jsx-runtime";
|
|
2
2
|
import { useController as P } from "react-hook-form";
|
|
3
|
-
import { FormField as
|
|
4
|
-
import { MultiSelect as
|
|
5
|
-
const
|
|
3
|
+
import { FormField as M, FormItem as S, FormLabel as j, FormControl as q, FormMessage as v } from "./form.es.js";
|
|
4
|
+
import { MultiSelect as I } from "./multiselect.es.js";
|
|
5
|
+
const O = (u) => {
|
|
6
6
|
const {
|
|
7
7
|
name: t,
|
|
8
8
|
control: n,
|
|
9
|
-
defaultValue:
|
|
9
|
+
defaultValue: a,
|
|
10
10
|
disabled: r,
|
|
11
|
-
|
|
11
|
+
readOnly: c,
|
|
12
|
+
rules: s,
|
|
12
13
|
shouldUnregister: i,
|
|
13
|
-
label:
|
|
14
|
-
options:
|
|
15
|
-
loading:
|
|
16
|
-
loadingText:
|
|
17
|
-
placeholder:
|
|
14
|
+
label: p,
|
|
15
|
+
options: f,
|
|
16
|
+
loading: g,
|
|
17
|
+
loadingText: h,
|
|
18
|
+
placeholder: F,
|
|
18
19
|
slotProps: o,
|
|
19
|
-
required:
|
|
20
|
-
...
|
|
21
|
-
} = u, { field:
|
|
22
|
-
|
|
20
|
+
required: d,
|
|
21
|
+
...x
|
|
22
|
+
} = u, { field: b } = P({ name: t, control: n, rules: s, defaultValue: a, disabled: r, shouldUnregister: i }), C = (l) => {
|
|
23
|
+
b.onChange(l);
|
|
23
24
|
};
|
|
24
25
|
return /* @__PURE__ */ e(
|
|
25
|
-
|
|
26
|
+
M,
|
|
26
27
|
{
|
|
27
28
|
control: n,
|
|
28
29
|
name: t,
|
|
29
|
-
defaultValue:
|
|
30
|
+
defaultValue: a,
|
|
30
31
|
disabled: r,
|
|
31
|
-
rules:
|
|
32
|
+
rules: s,
|
|
32
33
|
shouldUnregister: i,
|
|
33
|
-
render: ({ field: l }) => /* @__PURE__ */
|
|
34
|
-
/* @__PURE__ */
|
|
35
|
-
|
|
36
|
-
|
|
34
|
+
render: ({ field: l }) => /* @__PURE__ */ m(S, { ...x, children: [
|
|
35
|
+
/* @__PURE__ */ m(j, { ...o?.formLabelProps ?? {}, children: [
|
|
36
|
+
p,
|
|
37
|
+
d && /* @__PURE__ */ e("span", { className: "text-danger text-sm leading-4", children: "*" })
|
|
37
38
|
] }),
|
|
38
|
-
/* @__PURE__ */ e(
|
|
39
|
-
|
|
39
|
+
/* @__PURE__ */ e(q, { children: /* @__PURE__ */ e(
|
|
40
|
+
I,
|
|
40
41
|
{
|
|
41
|
-
"aria-required":
|
|
42
|
-
options:
|
|
42
|
+
"aria-required": d,
|
|
43
|
+
options: f,
|
|
43
44
|
onValueChange: C,
|
|
44
|
-
placeholder:
|
|
45
|
+
placeholder: F,
|
|
45
46
|
value: l.value,
|
|
46
|
-
loading:
|
|
47
|
-
loadingText:
|
|
48
|
-
disabled: r,
|
|
47
|
+
loading: g,
|
|
48
|
+
loadingText: h,
|
|
49
|
+
disabled: r || c,
|
|
49
50
|
...o?.multiSelectProps ?? {}
|
|
50
51
|
}
|
|
51
52
|
) }),
|
|
52
|
-
/* @__PURE__ */ e(
|
|
53
|
+
/* @__PURE__ */ e(v, { ...o?.formMessageProps ?? {} })
|
|
53
54
|
] })
|
|
54
55
|
}
|
|
55
56
|
);
|
|
56
57
|
};
|
|
57
58
|
export {
|
|
58
|
-
|
|
59
|
+
O as FormMultiSelect
|
|
59
60
|
};
|
|
60
61
|
//# sourceMappingURL=formmultiselect.es.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"formmultiselect.es.js","sources":["../src/components/form-multi-select/FormMultiSelect.tsx"],"sourcesContent":["\"use client\";\r\n\r\nimport { ControllerProps, FieldPath, FieldValues, useController } from \"react-hook-form\";\r\n\r\nimport { FormControl, FormField, FormItem, FormLabel, FormMessage } from \"../form/Form\";\r\nimport { MultiSelect, MultiSelectProps } from \"../multi-select/MultiSelect\";\r\n\r\ntype FormMultiSelectProps<TFieldValues extends FieldValues, TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>> = Omit<\r\n ControllerProps<TFieldValues, TName>,\r\n \"render\"\r\n> &\r\n React.ComponentProps<typeof FormItem> & {\r\n label: string;\r\n loading?: boolean;\r\n loadingText?: string;\r\n options: MultiSelectProps[\"options\"];\r\n placeholder?: string;\r\n required?: boolean;\r\n slotProps?: {\r\n multiSelectProps?: Partial<MultiSelectProps>;\r\n formLabelProps?: React.HTMLAttributes<HTMLLabelElement> & React.RefAttributes<HTMLLabelElement>;\r\n formMessageProps?: React.HTMLAttributes<HTMLParagraphElement> & React.RefAttributes<HTMLParagraphElement>;\r\n };\r\n };\r\n\r\nconst FormMultiSelect = <TFieldValues extends FieldValues, TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>>(\r\n props: FormMultiSelectProps<TFieldValues, TName>,\r\n) => {\r\n const {\r\n name,\r\n control,\r\n defaultValue,\r\n disabled,\r\n rules,\r\n shouldUnregister,\r\n label,\r\n options,\r\n loading,\r\n loadingText,\r\n placeholder,\r\n slotProps,\r\n required,\r\n ...formItemProps\r\n } = props;\r\n\r\n const { field } = useController({ name, control, rules, defaultValue, disabled, shouldUnregister });\r\n\r\n const handleChange = (value: string[]) => {\r\n field.onChange(value);\r\n };\r\n\r\n return (\r\n <FormField\r\n control={control}\r\n name={name}\r\n defaultValue={defaultValue}\r\n disabled={disabled}\r\n rules={rules}\r\n shouldUnregister={shouldUnregister}\r\n render={({ field }) => {\r\n return (\r\n <FormItem {...formItemProps}>\r\n <FormLabel {...(slotProps?.formLabelProps ?? {})}>\r\n {label}\r\n {required && <span className=\"text-danger text-sm leading-4\">*</span>}\r\n </FormLabel>\r\n <FormControl>\r\n <MultiSelect\r\n aria-required={required}\r\n options={options}\r\n onValueChange={handleChange}\r\n placeholder={placeholder}\r\n value={field.value}\r\n loading={loading}\r\n loadingText={loadingText}\r\n disabled={disabled}\r\n {...(slotProps?.multiSelectProps ?? {})}\r\n />\r\n </FormControl>\r\n\r\n <FormMessage {...(slotProps?.formMessageProps ?? {})} />\r\n </FormItem>\r\n );\r\n }}\r\n />\r\n );\r\n};\r\nexport { FormMultiSelect, type FormMultiSelectProps };\r\n"],"names":["FormMultiSelect","props","name","control","defaultValue","disabled","rules","shouldUnregister","label","options","loading","loadingText","placeholder","slotProps","required","formItemProps","field","useController","handleChange","value","jsx","FormField","jsxs","FormItem","FormLabel","FormControl","MultiSelect","FormMessage"],"mappings":";;;;
|
|
1
|
+
{"version":3,"file":"formmultiselect.es.js","sources":["../src/components/form-multi-select/FormMultiSelect.tsx"],"sourcesContent":["\"use client\";\r\n\r\nimport { ControllerProps, FieldPath, FieldValues, useController } from \"react-hook-form\";\r\n\r\nimport { FormControl, FormField, FormItem, FormLabel, FormMessage } from \"../form/Form\";\r\nimport { MultiSelect, MultiSelectProps } from \"../multi-select/MultiSelect\";\r\n\r\ntype FormMultiSelectProps<TFieldValues extends FieldValues, TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>> = Omit<\r\n ControllerProps<TFieldValues, TName>,\r\n \"render\"\r\n> &\r\n React.ComponentProps<typeof FormItem> & {\r\n label: string;\r\n loading?: boolean;\r\n loadingText?: string;\r\n options: MultiSelectProps[\"options\"];\r\n placeholder?: string;\r\n required?: boolean;\r\n readOnly?: boolean;\r\n slotProps?: {\r\n multiSelectProps?: Partial<MultiSelectProps>;\r\n formLabelProps?: React.HTMLAttributes<HTMLLabelElement> & React.RefAttributes<HTMLLabelElement>;\r\n formMessageProps?: React.HTMLAttributes<HTMLParagraphElement> & React.RefAttributes<HTMLParagraphElement>;\r\n };\r\n };\r\n\r\nconst FormMultiSelect = <TFieldValues extends FieldValues, TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>>(\r\n props: FormMultiSelectProps<TFieldValues, TName>,\r\n) => {\r\n const {\r\n name,\r\n control,\r\n defaultValue,\r\n disabled,\r\n readOnly,\r\n rules,\r\n shouldUnregister,\r\n label,\r\n options,\r\n loading,\r\n loadingText,\r\n placeholder,\r\n slotProps,\r\n required,\r\n ...formItemProps\r\n } = props;\r\n\r\n const { field } = useController({ name, control, rules, defaultValue, disabled, shouldUnregister });\r\n\r\n const handleChange = (value: string[]) => {\r\n field.onChange(value);\r\n };\r\n\r\n return (\r\n <FormField\r\n control={control}\r\n name={name}\r\n defaultValue={defaultValue}\r\n disabled={disabled}\r\n rules={rules}\r\n shouldUnregister={shouldUnregister}\r\n render={({ field }) => {\r\n return (\r\n <FormItem {...formItemProps}>\r\n <FormLabel {...(slotProps?.formLabelProps ?? {})}>\r\n {label}\r\n {required && <span className=\"text-danger text-sm leading-4\">*</span>}\r\n </FormLabel>\r\n <FormControl>\r\n <MultiSelect\r\n aria-required={required}\r\n options={options}\r\n onValueChange={handleChange}\r\n placeholder={placeholder}\r\n value={field.value}\r\n loading={loading}\r\n loadingText={loadingText}\r\n disabled={disabled || readOnly}\r\n {...(slotProps?.multiSelectProps ?? {})}\r\n />\r\n </FormControl>\r\n\r\n <FormMessage {...(slotProps?.formMessageProps ?? {})} />\r\n </FormItem>\r\n );\r\n }}\r\n />\r\n );\r\n};\r\nexport { FormMultiSelect, type FormMultiSelectProps };\r\n"],"names":["FormMultiSelect","props","name","control","defaultValue","disabled","readOnly","rules","shouldUnregister","label","options","loading","loadingText","placeholder","slotProps","required","formItemProps","field","useController","handleChange","value","jsx","FormField","jsxs","FormItem","FormLabel","FormControl","MultiSelect","FormMessage"],"mappings":";;;;AA0BM,MAAAA,IAAkB,CACtBC,MACG;AACG,QAAA;AAAA,IACJ,MAAAC;AAAA,IACA,SAAAC;AAAA,IACA,cAAAC;AAAA,IACA,UAAAC;AAAA,IACA,UAAAC;AAAA,IACA,OAAAC;AAAA,IACA,kBAAAC;AAAA,IACA,OAAAC;AAAA,IACA,SAAAC;AAAA,IACA,SAAAC;AAAA,IACA,aAAAC;AAAA,IACA,aAAAC;AAAA,IACA,WAAAC;AAAA,IACA,UAAAC;AAAA,IACA,GAAGC;AAAA,EAAA,IACDf,GAEE,EAAE,OAAAgB,EAAM,IAAIC,EAAc,EAAE,MAAAhB,GAAM,SAAAC,GAAS,OAAAI,GAAO,cAAAH,GAAc,UAAAC,GAAU,kBAAAG,GAAkB,GAE5FW,IAAe,CAACC,MAAoB;AACxC,IAAAH,EAAM,SAASG,CAAK;AAAA,EACtB;AAGE,SAAA,gBAAAC;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,SAAAnB;AAAA,MACA,MAAAD;AAAA,MACA,cAAAE;AAAA,MACA,UAAAC;AAAA,MACA,OAAAE;AAAA,MACA,kBAAAC;AAAA,MACA,QAAQ,CAAC,EAAE,OAAAS,QAEP,gBAAAM,EAACC,GAAU,EAAA,GAAGR,GACZ,UAAA;AAAA,QAAA,gBAAAO,EAACE,GAAW,EAAA,GAAIX,GAAW,kBAAkB,CAC1C,GAAA,UAAA;AAAA,UAAAL;AAAA,UACAM,KAAY,gBAAAM,EAAC,QAAK,EAAA,WAAU,iCAAgC,UAAC,IAAA,CAAA;AAAA,QAAA,GAChE;AAAA,0BACCK,GACC,EAAA,UAAA,gBAAAL;AAAA,UAACM;AAAA,UAAA;AAAA,YACC,iBAAeZ;AAAA,YACf,SAAAL;AAAA,YACA,eAAeS;AAAA,YACf,aAAAN;AAAA,YACA,OAAOI,EAAM;AAAA,YACb,SAAAN;AAAA,YACA,aAAAC;AAAA,YACA,UAAUP,KAAYC;AAAA,YACrB,GAAIQ,GAAW,oBAAoB,CAAA;AAAA,UAAC;AAAA,QAAA,GAEzC;AAAA,0BAECc,GAAa,EAAA,GAAId,GAAW,oBAAoB,CAAA,EAAK,CAAA;AAAA,MAAA,GACxD;AAAA,IAEJ;AAAA,EACF;AAEJ;"}
|
package/dist/formrating.es.js
CHANGED
|
@@ -1,53 +1,54 @@
|
|
|
1
|
-
import { jsx as r, jsxs as
|
|
2
|
-
import { Star as
|
|
3
|
-
import { Rating as
|
|
4
|
-
import { FormField as
|
|
5
|
-
const
|
|
1
|
+
import { jsx as r, jsxs as n } from "react/jsx-runtime";
|
|
2
|
+
import { Star as F } from "@trsys-tech/matrix-icons";
|
|
3
|
+
import { Rating as x } from "./rating.es.js";
|
|
4
|
+
import { FormField as P, FormItem as b, FormLabel as C, FormControl as I, FormMessage as j } from "./form.es.js";
|
|
5
|
+
const V = (s) => {
|
|
6
6
|
const {
|
|
7
|
-
name:
|
|
8
|
-
control:
|
|
9
|
-
defaultValue:
|
|
10
|
-
disabled:
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
7
|
+
name: t,
|
|
8
|
+
control: l,
|
|
9
|
+
defaultValue: m,
|
|
10
|
+
disabled: o,
|
|
11
|
+
readOnly: i,
|
|
12
|
+
rules: d,
|
|
13
|
+
shouldUnregister: p,
|
|
14
|
+
label: g,
|
|
15
|
+
slotProps: e,
|
|
16
|
+
required: u,
|
|
17
|
+
Icon: c = F,
|
|
18
|
+
max: f = 5,
|
|
19
|
+
...h
|
|
20
|
+
} = s;
|
|
20
21
|
return /* @__PURE__ */ r(
|
|
21
|
-
|
|
22
|
+
P,
|
|
22
23
|
{
|
|
23
|
-
control:
|
|
24
|
-
name:
|
|
25
|
-
defaultValue:
|
|
26
|
-
disabled:
|
|
27
|
-
rules:
|
|
28
|
-
shouldUnregister:
|
|
29
|
-
render: ({ field:
|
|
30
|
-
/* @__PURE__ */
|
|
31
|
-
|
|
32
|
-
|
|
24
|
+
control: l,
|
|
25
|
+
name: t,
|
|
26
|
+
defaultValue: m,
|
|
27
|
+
disabled: o,
|
|
28
|
+
rules: d,
|
|
29
|
+
shouldUnregister: p,
|
|
30
|
+
render: ({ field: a }) => /* @__PURE__ */ n(b, { ...h, children: [
|
|
31
|
+
/* @__PURE__ */ n(C, { ...e?.formLabelProps ?? {}, children: [
|
|
32
|
+
g,
|
|
33
|
+
u && /* @__PURE__ */ r("span", { className: "text-danger text-sm leading-4", children: "*" })
|
|
33
34
|
] }),
|
|
34
|
-
/* @__PURE__ */ r(
|
|
35
|
-
|
|
35
|
+
/* @__PURE__ */ r(I, { ...e?.formControlProps ?? {}, children: /* @__PURE__ */ r(
|
|
36
|
+
x,
|
|
36
37
|
{
|
|
37
|
-
...
|
|
38
|
-
value:
|
|
39
|
-
max:
|
|
40
|
-
Icon:
|
|
41
|
-
onValueChange:
|
|
42
|
-
disabled:
|
|
38
|
+
...e?.ratingProps ?? {},
|
|
39
|
+
value: a.value,
|
|
40
|
+
max: f,
|
|
41
|
+
Icon: c,
|
|
42
|
+
onValueChange: a.onChange,
|
|
43
|
+
disabled: o || i
|
|
43
44
|
}
|
|
44
45
|
) }),
|
|
45
|
-
/* @__PURE__ */ r(
|
|
46
|
+
/* @__PURE__ */ r(j, { ...e?.formMessageProps ?? {} })
|
|
46
47
|
] })
|
|
47
48
|
}
|
|
48
49
|
);
|
|
49
50
|
};
|
|
50
51
|
export {
|
|
51
|
-
|
|
52
|
+
V as FormRating
|
|
52
53
|
};
|
|
53
54
|
//# sourceMappingURL=formrating.es.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"formrating.es.js","sources":["../src/components/form-rating/FormRating.tsx"],"sourcesContent":["\"use client\";\r\n\r\nimport { Star } from \"@trsys-tech/matrix-icons\";\r\nimport { SlotProps } from \"@radix-ui/react-slot\";\r\nimport { Control, ControllerProps, FieldPath, FieldValues } from \"react-hook-form\";\r\n\r\nimport { Rating, RatingProps } from \"../rating/Rating\";\r\nimport { FormControl, FormField, FormItem, FormLabel, FormMessage } from \"../form/Form\";\r\n\r\ntype FormRatingProps<TFieldValues extends FieldValues, TName extends FieldPath<TFieldValues>> = Omit<ControllerProps<TFieldValues, TName>, \"render\"> &\r\n React.ComponentProps<typeof FormItem> & {\r\n label: string;\r\n control: Control<TFieldValues>;\r\n required?: boolean;\r\n Icon?: React.JSXElementConstructor<React.SVGProps<SVGSVGElement>>;\r\n max?: number;\r\n slotProps?: {\r\n formLabelProps?: React.HTMLAttributes<HTMLLabelElement> & React.RefAttributes<HTMLLabelElement>;\r\n formMessageProps?: React.HTMLAttributes<HTMLParagraphElement> & React.RefAttributes<HTMLParagraphElement>;\r\n formControlProps?: Omit<SlotProps & React.RefAttributes<HTMLElement>, \"ref\"> & React.RefAttributes<HTMLElement>;\r\n ratingProps?: RatingProps;\r\n };\r\n };\r\n\r\nconst FormRating = <TFieldValues extends FieldValues, TName extends FieldPath<TFieldValues>>(props: FormRatingProps<TFieldValues, TName>) => {\r\n const {\r\n name,\r\n control,\r\n defaultValue,\r\n disabled,\r\n rules,\r\n shouldUnregister,\r\n label,\r\n slotProps,\r\n required,\r\n Icon = Star,\r\n max = 5,\r\n ...formItemProps\r\n } = props;\r\n\r\n return (\r\n <FormField\r\n control={control}\r\n name={name}\r\n defaultValue={defaultValue}\r\n disabled={disabled}\r\n rules={rules}\r\n shouldUnregister={shouldUnregister}\r\n render={({ field }) => {\r\n return (\r\n <FormItem {...formItemProps}>\r\n <FormLabel {...(slotProps?.formLabelProps ?? {})}>\r\n {label}\r\n {required && <span className=\"text-danger text-sm leading-4\">*</span>}\r\n </FormLabel>\r\n <FormControl {...(slotProps?.formControlProps ?? {})}>\r\n <Rating\r\n {...(slotProps?.ratingProps ?? {})}\r\n value={field.value}\r\n max={max}\r\n Icon={Icon}\r\n onValueChange={field.onChange}\r\n disabled={disabled}\r\n ></Rating>\r\n </FormControl>\r\n <FormMessage {...(slotProps?.formMessageProps ?? {})} />\r\n </FormItem>\r\n );\r\n }}\r\n />\r\n );\r\n};\r\nexport { FormRating, type FormRatingProps };\r\n"],"names":["FormRating","props","name","control","defaultValue","disabled","rules","shouldUnregister","label","slotProps","required","Icon","Star","max","formItemProps","jsx","FormField","field","jsxs","FormItem","FormLabel","FormControl","Rating","FormMessage"],"mappings":";;;;
|
|
1
|
+
{"version":3,"file":"formrating.es.js","sources":["../src/components/form-rating/FormRating.tsx"],"sourcesContent":["\"use client\";\r\n\r\nimport { Star } from \"@trsys-tech/matrix-icons\";\r\nimport { SlotProps } from \"@radix-ui/react-slot\";\r\nimport { Control, ControllerProps, FieldPath, FieldValues } from \"react-hook-form\";\r\n\r\nimport { Rating, RatingProps } from \"../rating/Rating\";\r\nimport { FormControl, FormField, FormItem, FormLabel, FormMessage } from \"../form/Form\";\r\n\r\ntype FormRatingProps<TFieldValues extends FieldValues, TName extends FieldPath<TFieldValues>> = Omit<ControllerProps<TFieldValues, TName>, \"render\"> &\r\n React.ComponentProps<typeof FormItem> & {\r\n label: string;\r\n control: Control<TFieldValues>;\r\n required?: boolean;\r\n Icon?: React.JSXElementConstructor<React.SVGProps<SVGSVGElement>>;\r\n max?: number;\r\n readOnly?: boolean;\r\n slotProps?: {\r\n formLabelProps?: React.HTMLAttributes<HTMLLabelElement> & React.RefAttributes<HTMLLabelElement>;\r\n formMessageProps?: React.HTMLAttributes<HTMLParagraphElement> & React.RefAttributes<HTMLParagraphElement>;\r\n formControlProps?: Omit<SlotProps & React.RefAttributes<HTMLElement>, \"ref\"> & React.RefAttributes<HTMLElement>;\r\n ratingProps?: RatingProps;\r\n };\r\n };\r\n\r\nconst FormRating = <TFieldValues extends FieldValues, TName extends FieldPath<TFieldValues>>(props: FormRatingProps<TFieldValues, TName>) => {\r\n const {\r\n name,\r\n control,\r\n defaultValue,\r\n disabled,\r\n readOnly,\r\n rules,\r\n shouldUnregister,\r\n label,\r\n slotProps,\r\n required,\r\n Icon = Star,\r\n max = 5,\r\n ...formItemProps\r\n } = props;\r\n\r\n return (\r\n <FormField\r\n control={control}\r\n name={name}\r\n defaultValue={defaultValue}\r\n disabled={disabled}\r\n rules={rules}\r\n shouldUnregister={shouldUnregister}\r\n render={({ field }) => {\r\n return (\r\n <FormItem {...formItemProps}>\r\n <FormLabel {...(slotProps?.formLabelProps ?? {})}>\r\n {label}\r\n {required && <span className=\"text-danger text-sm leading-4\">*</span>}\r\n </FormLabel>\r\n <FormControl {...(slotProps?.formControlProps ?? {})}>\r\n <Rating\r\n {...(slotProps?.ratingProps ?? {})}\r\n value={field.value}\r\n max={max}\r\n Icon={Icon}\r\n onValueChange={field.onChange}\r\n disabled={disabled || readOnly}\r\n ></Rating>\r\n </FormControl>\r\n <FormMessage {...(slotProps?.formMessageProps ?? {})} />\r\n </FormItem>\r\n );\r\n }}\r\n />\r\n );\r\n};\r\nexport { FormRating, type FormRatingProps };\r\n"],"names":["FormRating","props","name","control","defaultValue","disabled","readOnly","rules","shouldUnregister","label","slotProps","required","Icon","Star","max","formItemProps","jsx","FormField","field","jsxs","FormItem","FormLabel","FormControl","Rating","FormMessage"],"mappings":";;;;AAyBM,MAAAA,IAAa,CAA0EC,MAAgD;AACrI,QAAA;AAAA,IACJ,MAAAC;AAAA,IACA,SAAAC;AAAA,IACA,cAAAC;AAAA,IACA,UAAAC;AAAA,IACA,UAAAC;AAAA,IACA,OAAAC;AAAA,IACA,kBAAAC;AAAA,IACA,OAAAC;AAAA,IACA,WAAAC;AAAA,IACA,UAAAC;AAAA,IACA,MAAAC,IAAOC;AAAA,IACP,KAAAC,IAAM;AAAA,IACN,GAAGC;AAAA,EAAA,IACDd;AAGF,SAAA,gBAAAe;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,SAAAd;AAAA,MACA,MAAAD;AAAA,MACA,cAAAE;AAAA,MACA,UAAAC;AAAA,MACA,OAAAE;AAAA,MACA,kBAAAC;AAAA,MACA,QAAQ,CAAC,EAAE,OAAAU,QAEP,gBAAAC,EAACC,GAAU,EAAA,GAAGL,GACZ,UAAA;AAAA,QAAA,gBAAAI,EAACE,GAAW,EAAA,GAAIX,GAAW,kBAAkB,CAC1C,GAAA,UAAA;AAAA,UAAAD;AAAA,UACAE,KAAY,gBAAAK,EAAC,QAAK,EAAA,WAAU,iCAAgC,UAAC,IAAA,CAAA;AAAA,QAAA,GAChE;AAAA,0BACCM,GAAa,EAAA,GAAIZ,GAAW,oBAAoB,CAAA,GAC/C,UAAA,gBAAAM;AAAA,UAACO;AAAA,UAAA;AAAA,YACE,GAAIb,GAAW,eAAe,CAAC;AAAA,YAChC,OAAOQ,EAAM;AAAA,YACb,KAAAJ;AAAA,YACA,MAAAF;AAAA,YACA,eAAeM,EAAM;AAAA,YACrB,UAAUb,KAAYC;AAAA,UAAA;AAAA,QAAA,GAE1B;AAAA,0BACCkB,GAAa,EAAA,GAAId,GAAW,oBAAoB,CAAA,EAAK,CAAA;AAAA,MAAA,GACxD;AAAA,IAEJ;AAAA,EACF;AAEJ;"}
|
package/dist/formselect.es.js
CHANGED
|
@@ -1,32 +1,33 @@
|
|
|
1
1
|
import { jsx as r, jsxs as o } from "react/jsx-runtime";
|
|
2
|
-
import { createElement as
|
|
3
|
-
import { Spinner as
|
|
4
|
-
import { useController as
|
|
2
|
+
import { createElement as T } from "react";
|
|
3
|
+
import { Spinner as V } from "@trsys-tech/matrix-icons";
|
|
4
|
+
import { useController as y } from "react-hook-form";
|
|
5
5
|
import { cn as k } from "./utils.es.js";
|
|
6
|
-
import { FormField as
|
|
7
|
-
import { Select as E, SelectTrigger as
|
|
8
|
-
const
|
|
6
|
+
import { FormField as L, FormItem as j, FormLabel as q, FormControl as M, FormMessage as O } from "./form.es.js";
|
|
7
|
+
import { Select as E, SelectTrigger as U, SelectValue as _, SelectContent as w, SelectItem as s } from "./select.es.js";
|
|
8
|
+
const K = (b) => {
|
|
9
9
|
const {
|
|
10
10
|
name: c,
|
|
11
11
|
control: i,
|
|
12
12
|
defaultValue: m,
|
|
13
13
|
disabled: t,
|
|
14
|
+
readOnly: P,
|
|
14
15
|
rules: d,
|
|
15
16
|
shouldUnregister: p,
|
|
16
17
|
label: a,
|
|
17
18
|
options: n,
|
|
18
19
|
loading: u,
|
|
19
|
-
loadingText:
|
|
20
|
-
emptyOptionsText:
|
|
21
|
-
placeholder:
|
|
20
|
+
loadingText: v,
|
|
21
|
+
emptyOptionsText: S,
|
|
22
|
+
placeholder: C,
|
|
22
23
|
slotProps: e,
|
|
23
24
|
required: g,
|
|
24
|
-
...
|
|
25
|
-
} = b, { field: h } =
|
|
26
|
-
|
|
25
|
+
...x
|
|
26
|
+
} = b, { field: h } = y({ name: c, control: i, rules: d, defaultValue: m, disabled: t, shouldUnregister: p }), F = typeof n[0]?.value == "number", I = (l) => {
|
|
27
|
+
F ? h.onChange(Number(l)) : h.onChange(l);
|
|
27
28
|
};
|
|
28
29
|
return /* @__PURE__ */ r(
|
|
29
|
-
|
|
30
|
+
L,
|
|
30
31
|
{
|
|
31
32
|
control: i,
|
|
32
33
|
name: c,
|
|
@@ -34,8 +35,8 @@ const J = (b) => {
|
|
|
34
35
|
disabled: t,
|
|
35
36
|
rules: d,
|
|
36
37
|
shouldUnregister: p,
|
|
37
|
-
render: ({ field: l }) => /* @__PURE__ */ o(
|
|
38
|
-
/* @__PURE__ */ o(
|
|
38
|
+
render: ({ field: l }) => /* @__PURE__ */ o(j, { ...x, children: [
|
|
39
|
+
/* @__PURE__ */ o(q, { ...e?.formLabelProps ?? {}, children: [
|
|
39
40
|
a,
|
|
40
41
|
g && /* @__PURE__ */ r("span", { className: "text-danger text-sm leading-4", children: "*" })
|
|
41
42
|
] }),
|
|
@@ -43,25 +44,25 @@ const J = (b) => {
|
|
|
43
44
|
E,
|
|
44
45
|
{
|
|
45
46
|
...e?.selectProps ?? {},
|
|
46
|
-
disabled: t,
|
|
47
|
-
onValueChange:
|
|
47
|
+
disabled: t || P,
|
|
48
|
+
onValueChange: I,
|
|
48
49
|
value: l.value !== void 0 ? String(l.value) : void 0,
|
|
49
50
|
children: [
|
|
50
|
-
/* @__PURE__ */ r(
|
|
51
|
-
|
|
51
|
+
/* @__PURE__ */ r(M, { children: /* @__PURE__ */ r(
|
|
52
|
+
U,
|
|
52
53
|
{
|
|
53
54
|
"aria-required": g,
|
|
54
55
|
disabled: t,
|
|
55
56
|
...e?.selectTriggerProps ?? {},
|
|
56
57
|
className: k("*:truncate [&>span]:inline-block", e?.selectTriggerProps?.className),
|
|
57
|
-
children: /* @__PURE__ */ r(
|
|
58
|
+
children: /* @__PURE__ */ r(_, { ...e?.selectValueProps ?? {}, placeholder: C ?? a })
|
|
58
59
|
}
|
|
59
60
|
) }),
|
|
60
|
-
/* @__PURE__ */ o(
|
|
61
|
+
/* @__PURE__ */ o(w, { ...e?.selectContentProps ?? {}, children: [
|
|
61
62
|
u && /* @__PURE__ */ o(s, { ...e?.selectItemProps ?? {}, value: "-1", disabled: !0, children: [
|
|
62
|
-
/* @__PURE__ */ r(
|
|
63
|
+
/* @__PURE__ */ r(V, { className: "inline-block mb-0.5" }),
|
|
63
64
|
" ",
|
|
64
|
-
|
|
65
|
+
v || "Loading..."
|
|
65
66
|
] }),
|
|
66
67
|
!u && !n.length ? /* @__PURE__ */ r(
|
|
67
68
|
s,
|
|
@@ -69,20 +70,20 @@ const J = (b) => {
|
|
|
69
70
|
...e?.selectItemProps ?? {},
|
|
70
71
|
value: "8fdcaeb67c8ad943c80fe54c3b1059b700d9254389a38a4a1fc39a6eee728623",
|
|
71
72
|
disabled: !0,
|
|
72
|
-
children:
|
|
73
|
+
children: S || "No Items"
|
|
73
74
|
}
|
|
74
75
|
) : null,
|
|
75
|
-
n?.map((f,
|
|
76
|
+
n?.map((f, N) => /* @__PURE__ */ T(s, { ...e?.selectItemProps ?? {}, value: String(f.value), key: N + "_" + a }, f.label))
|
|
76
77
|
] })
|
|
77
78
|
]
|
|
78
79
|
}
|
|
79
80
|
),
|
|
80
|
-
/* @__PURE__ */ r(
|
|
81
|
+
/* @__PURE__ */ r(O, { ...e?.formMessageProps ?? {} })
|
|
81
82
|
] })
|
|
82
83
|
}
|
|
83
84
|
);
|
|
84
85
|
};
|
|
85
86
|
export {
|
|
86
|
-
|
|
87
|
+
K as FormSelect
|
|
87
88
|
};
|
|
88
89
|
//# sourceMappingURL=formselect.es.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"formselect.es.js","sources":["../src/components/form-select/FormSelect.tsx"],"sourcesContent":["\"use client\";\r\n\r\nimport { Spinner } from \"@trsys-tech/matrix-icons\";\r\nimport { ControllerProps, FieldPath, FieldValues, useController } from \"react-hook-form\";\r\nimport { SelectContentProps, SelectItemProps, SelectProps, SelectTriggerProps, SelectValueProps } from \"@radix-ui/react-select\";\r\n\r\nimport { cn } from \"../../lib/utils\";\r\n\r\nimport { FormControl, FormField, FormItem, FormLabel, FormMessage } from \"../form/Form\";\r\nimport { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from \"../select/Select\";\r\n\r\ntype FormSelectProps<TFieldValues extends FieldValues, TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>> = Omit<\r\n ControllerProps<TFieldValues, TName>,\r\n \"render\"\r\n> &\r\n React.ComponentProps<typeof FormItem> & {\r\n label: string;\r\n options: { value: string | number; label: string | number }[];\r\n loading?: boolean;\r\n loadingText?: string;\r\n emptyOptionsText?: string;\r\n placeholder?: string;\r\n required?: boolean;\r\n slotProps?: {\r\n formLabelProps?: React.HTMLAttributes<HTMLLabelElement> & React.RefAttributes<HTMLLabelElement>;\r\n formMessageProps?: React.HTMLAttributes<HTMLParagraphElement> & React.RefAttributes<HTMLParagraphElement>;\r\n selectProps?: SelectProps;\r\n selectTriggerProps?: SelectTriggerProps;\r\n selectValueProps?: Omit<SelectValueProps, \"placeholder\">;\r\n selectContentProps?: SelectContentProps;\r\n selectItemProps?: SelectItemProps;\r\n };\r\n };\r\n\r\nconst FormSelect = <TFieldValues extends FieldValues, TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>>(\r\n props: FormSelectProps<TFieldValues, TName>,\r\n) => {\r\n const {\r\n name,\r\n control,\r\n defaultValue,\r\n disabled,\r\n rules,\r\n shouldUnregister,\r\n label,\r\n options,\r\n loading,\r\n loadingText,\r\n emptyOptionsText,\r\n placeholder,\r\n slotProps,\r\n required,\r\n ...formItemProps\r\n } = props;\r\n\r\n const { field } = useController({ name, control, rules, defaultValue, disabled, shouldUnregister });\r\n\r\n const isNumericValue = typeof options[0]?.value === \"number\";\r\n\r\n const handleChange = (value: string) => {\r\n if (isNumericValue) {\r\n field.onChange(Number(value));\r\n } else {\r\n field.onChange(value);\r\n }\r\n };\r\n\r\n return (\r\n <FormField\r\n control={control}\r\n name={name}\r\n defaultValue={defaultValue}\r\n disabled={disabled}\r\n rules={rules}\r\n shouldUnregister={shouldUnregister}\r\n render={({ field }) => {\r\n return (\r\n <FormItem {...formItemProps}>\r\n <FormLabel {...(slotProps?.formLabelProps ?? {})}>\r\n {label}\r\n {required && <span className=\"text-danger text-sm leading-4\">*</span>}\r\n </FormLabel>\r\n <Select\r\n {...(slotProps?.selectProps ?? {})}\r\n disabled={disabled}\r\n onValueChange={handleChange}\r\n value={field.value !== undefined ? String(field.value) : undefined}\r\n >\r\n <FormControl>\r\n <SelectTrigger\r\n aria-required={required}\r\n disabled={disabled}\r\n {...(slotProps?.selectTriggerProps ?? {})}\r\n className={cn(\"*:truncate [&>span]:inline-block\", slotProps?.selectTriggerProps?.className)}\r\n >\r\n <SelectValue {...(slotProps?.selectValueProps ?? {})} placeholder={placeholder ?? label} />\r\n </SelectTrigger>\r\n </FormControl>\r\n <SelectContent {...(slotProps?.selectContentProps ?? {})}>\r\n {loading && (\r\n <SelectItem {...(slotProps?.selectItemProps ?? {})} value=\"-1\" disabled>\r\n <Spinner className=\"inline-block mb-0.5\" /> {loadingText || \"Loading...\"}\r\n </SelectItem>\r\n )}\r\n {!loading && !options.length ? (\r\n <SelectItem\r\n {...(slotProps?.selectItemProps ?? {})}\r\n value=\"8fdcaeb67c8ad943c80fe54c3b1059b700d9254389a38a4a1fc39a6eee728623\"\r\n disabled\r\n >\r\n {emptyOptionsText || \"No Items\"}\r\n </SelectItem>\r\n ) : null}\r\n {options?.map((option, index) => (\r\n <SelectItem {...(slotProps?.selectItemProps ?? {})} value={String(option.value)} key={index + \"_\" + label}>\r\n {option.label}\r\n </SelectItem>\r\n ))}\r\n </SelectContent>\r\n </Select>\r\n <FormMessage {...(slotProps?.formMessageProps ?? {})} />\r\n </FormItem>\r\n );\r\n }}\r\n />\r\n );\r\n};\r\nexport { FormSelect, type FormSelectProps };\r\n"],"names":["FormSelect","props","name","control","defaultValue","disabled","rules","shouldUnregister","label","options","loading","loadingText","emptyOptionsText","placeholder","slotProps","required","formItemProps","field","useController","isNumericValue","handleChange","value","jsx","FormField","jsxs","FormItem","FormLabel","Select","FormControl","SelectTrigger","cn","SelectValue","SelectContent","SelectItem","Spinner","option","index","createElement","FormMessage"],"mappings":";;;;;;;
|
|
1
|
+
{"version":3,"file":"formselect.es.js","sources":["../src/components/form-select/FormSelect.tsx"],"sourcesContent":["\"use client\";\r\n\r\nimport { Spinner } from \"@trsys-tech/matrix-icons\";\r\nimport { ControllerProps, FieldPath, FieldValues, useController } from \"react-hook-form\";\r\nimport { SelectContentProps, SelectItemProps, SelectProps, SelectTriggerProps, SelectValueProps } from \"@radix-ui/react-select\";\r\n\r\nimport { cn } from \"../../lib/utils\";\r\n\r\nimport { FormControl, FormField, FormItem, FormLabel, FormMessage } from \"../form/Form\";\r\nimport { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from \"../select/Select\";\r\n\r\ntype FormSelectProps<TFieldValues extends FieldValues, TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>> = Omit<\r\n ControllerProps<TFieldValues, TName>,\r\n \"render\"\r\n> &\r\n React.ComponentProps<typeof FormItem> & {\r\n label: string;\r\n options: { value: string | number; label: string | number }[];\r\n loading?: boolean;\r\n loadingText?: string;\r\n emptyOptionsText?: string;\r\n placeholder?: string;\r\n required?: boolean;\r\n readOnly?: boolean;\r\n slotProps?: {\r\n formLabelProps?: React.HTMLAttributes<HTMLLabelElement> & React.RefAttributes<HTMLLabelElement>;\r\n formMessageProps?: React.HTMLAttributes<HTMLParagraphElement> & React.RefAttributes<HTMLParagraphElement>;\r\n selectProps?: SelectProps;\r\n selectTriggerProps?: SelectTriggerProps;\r\n selectValueProps?: Omit<SelectValueProps, \"placeholder\">;\r\n selectContentProps?: SelectContentProps;\r\n selectItemProps?: SelectItemProps;\r\n };\r\n };\r\n\r\nconst FormSelect = <TFieldValues extends FieldValues, TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>>(\r\n props: FormSelectProps<TFieldValues, TName>,\r\n) => {\r\n const {\r\n name,\r\n control,\r\n defaultValue,\r\n disabled,\r\n readOnly,\r\n rules,\r\n shouldUnregister,\r\n label,\r\n options,\r\n loading,\r\n loadingText,\r\n emptyOptionsText,\r\n placeholder,\r\n slotProps,\r\n required,\r\n ...formItemProps\r\n } = props;\r\n\r\n const { field } = useController({ name, control, rules, defaultValue, disabled, shouldUnregister });\r\n\r\n const isNumericValue = typeof options[0]?.value === \"number\";\r\n\r\n const handleChange = (value: string) => {\r\n if (isNumericValue) {\r\n field.onChange(Number(value));\r\n } else {\r\n field.onChange(value);\r\n }\r\n };\r\n\r\n return (\r\n <FormField\r\n control={control}\r\n name={name}\r\n defaultValue={defaultValue}\r\n disabled={disabled}\r\n rules={rules}\r\n shouldUnregister={shouldUnregister}\r\n render={({ field }) => {\r\n return (\r\n <FormItem {...formItemProps}>\r\n <FormLabel {...(slotProps?.formLabelProps ?? {})}>\r\n {label}\r\n {required && <span className=\"text-danger text-sm leading-4\">*</span>}\r\n </FormLabel>\r\n <Select\r\n {...(slotProps?.selectProps ?? {})}\r\n disabled={disabled || readOnly}\r\n onValueChange={handleChange}\r\n value={field.value !== undefined ? String(field.value) : undefined}\r\n >\r\n <FormControl>\r\n <SelectTrigger\r\n aria-required={required}\r\n disabled={disabled}\r\n {...(slotProps?.selectTriggerProps ?? {})}\r\n className={cn(\"*:truncate [&>span]:inline-block\", slotProps?.selectTriggerProps?.className)}\r\n >\r\n <SelectValue {...(slotProps?.selectValueProps ?? {})} placeholder={placeholder ?? label} />\r\n </SelectTrigger>\r\n </FormControl>\r\n <SelectContent {...(slotProps?.selectContentProps ?? {})}>\r\n {loading && (\r\n <SelectItem {...(slotProps?.selectItemProps ?? {})} value=\"-1\" disabled>\r\n <Spinner className=\"inline-block mb-0.5\" /> {loadingText || \"Loading...\"}\r\n </SelectItem>\r\n )}\r\n {!loading && !options.length ? (\r\n <SelectItem\r\n {...(slotProps?.selectItemProps ?? {})}\r\n value=\"8fdcaeb67c8ad943c80fe54c3b1059b700d9254389a38a4a1fc39a6eee728623\"\r\n disabled\r\n >\r\n {emptyOptionsText || \"No Items\"}\r\n </SelectItem>\r\n ) : null}\r\n {options?.map((option, index) => (\r\n <SelectItem {...(slotProps?.selectItemProps ?? {})} value={String(option.value)} key={index + \"_\" + label}>\r\n {option.label}\r\n </SelectItem>\r\n ))}\r\n </SelectContent>\r\n </Select>\r\n <FormMessage {...(slotProps?.formMessageProps ?? {})} />\r\n </FormItem>\r\n );\r\n }}\r\n />\r\n );\r\n};\r\nexport { FormSelect, type FormSelectProps };\r\n"],"names":["FormSelect","props","name","control","defaultValue","disabled","readOnly","rules","shouldUnregister","label","options","loading","loadingText","emptyOptionsText","placeholder","slotProps","required","formItemProps","field","useController","isNumericValue","handleChange","value","jsx","FormField","jsxs","FormItem","FormLabel","Select","FormControl","SelectTrigger","cn","SelectValue","SelectContent","SelectItem","Spinner","option","index","createElement","FormMessage"],"mappings":";;;;;;;AAmCM,MAAAA,IAAa,CACjBC,MACG;AACG,QAAA;AAAA,IACJ,MAAAC;AAAA,IACA,SAAAC;AAAA,IACA,cAAAC;AAAA,IACA,UAAAC;AAAA,IACA,UAAAC;AAAA,IACA,OAAAC;AAAA,IACA,kBAAAC;AAAA,IACA,OAAAC;AAAA,IACA,SAAAC;AAAA,IACA,SAAAC;AAAA,IACA,aAAAC;AAAA,IACA,kBAAAC;AAAA,IACA,aAAAC;AAAA,IACA,WAAAC;AAAA,IACA,UAAAC;AAAA,IACA,GAAGC;AAAA,EAAA,IACDhB,GAEE,EAAE,OAAAiB,EAAM,IAAIC,EAAc,EAAE,MAAAjB,GAAM,SAAAC,GAAS,OAAAI,GAAO,cAAAH,GAAc,UAAAC,GAAU,kBAAAG,GAAkB,GAE5FY,IAAiB,OAAOV,EAAQ,CAAC,GAAG,SAAU,UAE9CW,IAAe,CAACC,MAAkB;AACtC,IAAIF,IACIF,EAAA,SAAS,OAAOI,CAAK,CAAC,IAE5BJ,EAAM,SAASI,CAAK;AAAA,EAExB;AAGE,SAAA,gBAAAC;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,SAAArB;AAAA,MACA,MAAAD;AAAA,MACA,cAAAE;AAAA,MACA,UAAAC;AAAA,MACA,OAAAE;AAAA,MACA,kBAAAC;AAAA,MACA,QAAQ,CAAC,EAAE,OAAAU,QAEP,gBAAAO,EAACC,GAAU,EAAA,GAAGT,GACZ,UAAA;AAAA,QAAA,gBAAAQ,EAACE,GAAW,EAAA,GAAIZ,GAAW,kBAAkB,CAC1C,GAAA,UAAA;AAAA,UAAAN;AAAA,UACAO,KAAY,gBAAAO,EAAC,QAAK,EAAA,WAAU,iCAAgC,UAAC,IAAA,CAAA;AAAA,QAAA,GAChE;AAAA,QACA,gBAAAE;AAAA,UAACG;AAAA,UAAA;AAAA,YACE,GAAIb,GAAW,eAAe,CAAC;AAAA,YAChC,UAAUV,KAAYC;AAAA,YACtB,eAAee;AAAA,YACf,OAAOH,EAAM,UAAU,SAAY,OAAOA,EAAM,KAAK,IAAI;AAAA,YAEzD,UAAA;AAAA,cAAA,gBAAAK,EAACM,GACC,EAAA,UAAA,gBAAAN;AAAA,gBAACO;AAAA,gBAAA;AAAA,kBACC,iBAAed;AAAA,kBACf,UAAAX;AAAA,kBACC,GAAIU,GAAW,sBAAsB,CAAC;AAAA,kBACvC,WAAWgB,EAAG,oCAAoChB,GAAW,oBAAoB,SAAS;AAAA,kBAE1F,UAAA,gBAAAQ,EAACS,KAAa,GAAIjB,GAAW,oBAAoB,IAAK,aAAaD,KAAeL,EAAO,CAAA;AAAA,gBAAA;AAAA,cAAA,GAE7F;AAAA,gCACCwB,GAAe,EAAA,GAAIlB,GAAW,sBAAsB,CAClD,GAAA,UAAA;AAAA,gBACCJ,KAAA,gBAAAc,EAACS,GAAY,EAAA,GAAInB,GAAW,mBAAmB,CAAK,GAAA,OAAM,MAAK,UAAQ,IACrE,UAAA;AAAA,kBAAC,gBAAAQ,EAAAY,GAAA,EAAQ,WAAU,sBAAsB,CAAA;AAAA,kBAAE;AAAA,kBAAEvB,KAAe;AAAA,gBAAA,GAC9D;AAAA,gBAED,CAACD,KAAW,CAACD,EAAQ,SACpB,gBAAAa;AAAA,kBAACW;AAAA,kBAAA;AAAA,oBACE,GAAInB,GAAW,mBAAmB,CAAC;AAAA,oBACpC,OAAM;AAAA,oBACN,UAAQ;AAAA,oBAEP,UAAoBF,KAAA;AAAA,kBAAA;AAAA,gBAAA,IAErB;AAAA,gBACHH,GAAS,IAAI,CAAC0B,GAAQC,MACpB,gBAAAC,EAAAJ,GAAA,EAAY,GAAInB,GAAW,mBAAmB,IAAK,OAAO,OAAOqB,EAAO,KAAK,GAAG,KAAKC,IAAQ,MAAM5B,EAAA,GACjG2B,EAAO,KACV,CACD;AAAA,cAAA,EACH,CAAA;AAAA,YAAA;AAAA,UAAA;AAAA,QACF;AAAA,0BACCG,GAAa,EAAA,GAAIxB,GAAW,oBAAoB,CAAA,EAAK,CAAA;AAAA,MAAA,GACxD;AAAA,IAEJ;AAAA,EACF;AAEJ;"}
|
package/dist/formswitch.es.js
CHANGED
|
@@ -1,18 +1,18 @@
|
|
|
1
1
|
import { jsx as r, jsxs as d } from "react/jsx-runtime";
|
|
2
|
-
import { FormField as
|
|
3
|
-
import { useController as
|
|
4
|
-
import { useCallback as
|
|
5
|
-
import { cn as
|
|
6
|
-
import { Switch as
|
|
7
|
-
const
|
|
8
|
-
const { name: t, control: a, defaultValue: l, disabled: s, rules: m, shouldUnregister: n, label:
|
|
2
|
+
import { FormField as C, FormItem as x, FormControl as b, FormLabel as F, FormMessage as P } from "./form.es.js";
|
|
3
|
+
import { useController as k } from "react-hook-form";
|
|
4
|
+
import { useCallback as N } from "react";
|
|
5
|
+
import { cn as j } from "./utils.es.js";
|
|
6
|
+
import { Switch as w } from "./switch.es.js";
|
|
7
|
+
const v = (p) => {
|
|
8
|
+
const { name: t, control: a, defaultValue: l, disabled: s, readOnly: f, rules: m, shouldUnregister: n, label: h, slotProps: e, required: c, ...u } = p, { field: i } = k({ name: t, control: a, rules: m, defaultValue: l, disabled: s, shouldUnregister: n }), g = N(
|
|
9
9
|
(o) => {
|
|
10
10
|
i.onChange(o);
|
|
11
11
|
},
|
|
12
12
|
[i]
|
|
13
13
|
);
|
|
14
14
|
return /* @__PURE__ */ r(
|
|
15
|
-
|
|
15
|
+
C,
|
|
16
16
|
{
|
|
17
17
|
control: a,
|
|
18
18
|
name: t,
|
|
@@ -20,20 +20,20 @@ const S = (p) => {
|
|
|
20
20
|
disabled: s,
|
|
21
21
|
rules: m,
|
|
22
22
|
shouldUnregister: n,
|
|
23
|
-
render: ({ field: o }) => /* @__PURE__ */ d(
|
|
24
|
-
/* @__PURE__ */ r(
|
|
25
|
-
|
|
23
|
+
render: ({ field: o }) => /* @__PURE__ */ d(x, { ...u, className: "flex items-center gap-2 justify-start space-y-0", children: [
|
|
24
|
+
/* @__PURE__ */ r(b, { ...e?.formControlProps ?? {}, children: /* @__PURE__ */ r(
|
|
25
|
+
w,
|
|
26
26
|
{
|
|
27
27
|
...e?.switchProps ?? {},
|
|
28
28
|
...o,
|
|
29
29
|
checked: o.value,
|
|
30
|
-
onCheckedChange:
|
|
30
|
+
onCheckedChange: g,
|
|
31
31
|
"aria-required": c,
|
|
32
|
-
disabled: s
|
|
32
|
+
disabled: s || f
|
|
33
33
|
}
|
|
34
34
|
) }),
|
|
35
|
-
/* @__PURE__ */ d(F, { ...e?.formLabelProps ?? {}, className:
|
|
36
|
-
|
|
35
|
+
/* @__PURE__ */ d(F, { ...e?.formLabelProps ?? {}, className: j("text-text", e?.formLabelProps?.className), children: [
|
|
36
|
+
h,
|
|
37
37
|
c && /* @__PURE__ */ r("span", { className: "text-danger text-sm leading-4", children: "*" })
|
|
38
38
|
] }),
|
|
39
39
|
/* @__PURE__ */ r(P, { ...e?.formMessageProps ?? {} })
|
|
@@ -42,6 +42,6 @@ const S = (p) => {
|
|
|
42
42
|
);
|
|
43
43
|
};
|
|
44
44
|
export {
|
|
45
|
-
|
|
45
|
+
v as FormSwitch
|
|
46
46
|
};
|
|
47
47
|
//# sourceMappingURL=formswitch.es.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"formswitch.es.js","sources":["../src/components/form-switch/FormSwitch.tsx"],"sourcesContent":["\"use client\";\r\n\r\nimport { FormControl, FormField, FormItem, FormLabel, FormMessage } from \"../form/Form\";\r\nimport { SlotProps } from \"@radix-ui/react-slot\";\r\nimport { Control, ControllerProps, FieldPath, FieldValues, useController } from \"react-hook-form\";\r\n\r\nimport { useCallback } from \"react\";\r\nimport { cn } from \"../../lib/utils\";\r\nimport { Switch, SwitchProps } from \"../switch/Switch\";\r\n\r\ntype FormSwitchProps<TFieldValues extends FieldValues, TName extends FieldPath<TFieldValues>> = Omit<ControllerProps<TFieldValues, TName>, \"render\"> &\r\n React.ComponentProps<typeof FormItem> & {\r\n label: string;\r\n control: Control<TFieldValues>;\r\n required?: boolean;\r\n slotProps?: {\r\n formLabelProps?: React.HTMLAttributes<HTMLLabelElement> & React.RefAttributes<HTMLLabelElement>;\r\n formMessageProps?: React.HTMLAttributes<HTMLParagraphElement> & React.RefAttributes<HTMLParagraphElement>;\r\n formControlProps?: Omit<SlotProps & React.RefAttributes<HTMLElement>, \"ref\"> & React.RefAttributes<HTMLElement>;\r\n switchProps?: SwitchProps;\r\n };\r\n };\r\n\r\nconst FormSwitch = <TFieldValues extends FieldValues, TName extends FieldPath<TFieldValues>>(props: FormSwitchProps<TFieldValues, TName>) => {\r\n const { name, control, defaultValue, disabled, rules, shouldUnregister, label, slotProps, required, ...formItemProps } = props;\r\n const { field } = useController({ name, control, rules, defaultValue, disabled, shouldUnregister });\r\n\r\n const handleCheckChanged = useCallback(\r\n (checked: boolean) => {\r\n field.onChange(checked);\r\n },\r\n [field],\r\n );\r\n\r\n return (\r\n <FormField\r\n control={control}\r\n name={name}\r\n defaultValue={defaultValue}\r\n disabled={disabled}\r\n rules={rules}\r\n shouldUnregister={shouldUnregister}\r\n render={({ field }) => {\r\n return (\r\n <FormItem {...formItemProps} className=\"flex items-center gap-2 justify-start space-y-0\">\r\n <FormControl {...(slotProps?.formControlProps ?? {})}>\r\n <Switch\r\n {...(slotProps?.switchProps ?? {})}\r\n {...field}\r\n checked={field.value}\r\n onCheckedChange={handleCheckChanged}\r\n aria-required={required}\r\n disabled={disabled}\r\n />\r\n </FormControl>\r\n <FormLabel {...(slotProps?.formLabelProps ?? {})} className={cn(\"text-text\", slotProps?.formLabelProps?.className)}>\r\n {label}\r\n {required && <span className=\"text-danger text-sm leading-4\">*</span>}\r\n </FormLabel>\r\n <FormMessage {...(slotProps?.formMessageProps ?? {})} />\r\n </FormItem>\r\n );\r\n }}\r\n />\r\n );\r\n};\r\nexport { FormSwitch, type FormSwitchProps };\r\n"],"names":["FormSwitch","props","name","control","defaultValue","disabled","rules","shouldUnregister","label","slotProps","required","formItemProps","field","useController","handleCheckChanged","useCallback","checked","jsx","FormField","jsxs","FormItem","FormControl","Switch","FormLabel","cn","FormMessage"],"mappings":";;;;;;
|
|
1
|
+
{"version":3,"file":"formswitch.es.js","sources":["../src/components/form-switch/FormSwitch.tsx"],"sourcesContent":["\"use client\";\r\n\r\nimport { FormControl, FormField, FormItem, FormLabel, FormMessage } from \"../form/Form\";\r\nimport { SlotProps } from \"@radix-ui/react-slot\";\r\nimport { Control, ControllerProps, FieldPath, FieldValues, useController } from \"react-hook-form\";\r\n\r\nimport { useCallback } from \"react\";\r\nimport { cn } from \"../../lib/utils\";\r\nimport { Switch, SwitchProps } from \"../switch/Switch\";\r\n\r\ntype FormSwitchProps<TFieldValues extends FieldValues, TName extends FieldPath<TFieldValues>> = Omit<ControllerProps<TFieldValues, TName>, \"render\"> &\r\n React.ComponentProps<typeof FormItem> & {\r\n label: string;\r\n control: Control<TFieldValues>;\r\n required?: boolean;\r\n readOnly?: boolean;\r\n slotProps?: {\r\n formLabelProps?: React.HTMLAttributes<HTMLLabelElement> & React.RefAttributes<HTMLLabelElement>;\r\n formMessageProps?: React.HTMLAttributes<HTMLParagraphElement> & React.RefAttributes<HTMLParagraphElement>;\r\n formControlProps?: Omit<SlotProps & React.RefAttributes<HTMLElement>, \"ref\"> & React.RefAttributes<HTMLElement>;\r\n switchProps?: SwitchProps;\r\n };\r\n };\r\n\r\nconst FormSwitch = <TFieldValues extends FieldValues, TName extends FieldPath<TFieldValues>>(props: FormSwitchProps<TFieldValues, TName>) => {\r\n const { name, control, defaultValue, disabled, readOnly, rules, shouldUnregister, label, slotProps, required, ...formItemProps } = props;\r\n const { field } = useController({ name, control, rules, defaultValue, disabled, shouldUnregister });\r\n\r\n const handleCheckChanged = useCallback(\r\n (checked: boolean) => {\r\n field.onChange(checked);\r\n },\r\n [field],\r\n );\r\n\r\n return (\r\n <FormField\r\n control={control}\r\n name={name}\r\n defaultValue={defaultValue}\r\n disabled={disabled}\r\n rules={rules}\r\n shouldUnregister={shouldUnregister}\r\n render={({ field }) => {\r\n return (\r\n <FormItem {...formItemProps} className=\"flex items-center gap-2 justify-start space-y-0\">\r\n <FormControl {...(slotProps?.formControlProps ?? {})}>\r\n <Switch\r\n {...(slotProps?.switchProps ?? {})}\r\n {...field}\r\n checked={field.value}\r\n onCheckedChange={handleCheckChanged}\r\n aria-required={required}\r\n disabled={disabled || readOnly}\r\n />\r\n </FormControl>\r\n <FormLabel {...(slotProps?.formLabelProps ?? {})} className={cn(\"text-text\", slotProps?.formLabelProps?.className)}>\r\n {label}\r\n {required && <span className=\"text-danger text-sm leading-4\">*</span>}\r\n </FormLabel>\r\n <FormMessage {...(slotProps?.formMessageProps ?? {})} />\r\n </FormItem>\r\n );\r\n }}\r\n />\r\n );\r\n};\r\nexport { FormSwitch, type FormSwitchProps };\r\n"],"names":["FormSwitch","props","name","control","defaultValue","disabled","readOnly","rules","shouldUnregister","label","slotProps","required","formItemProps","field","useController","handleCheckChanged","useCallback","checked","jsx","FormField","jsxs","FormItem","FormControl","Switch","FormLabel","cn","FormMessage"],"mappings":";;;;;;AAwBM,MAAAA,IAAa,CAA0EC,MAAgD;AAC3I,QAAM,EAAE,MAAAC,GAAM,SAAAC,GAAS,cAAAC,GAAc,UAAAC,GAAU,UAAAC,GAAU,OAAAC,GAAO,kBAAAC,GAAkB,OAAAC,GAAO,WAAAC,GAAW,UAAAC,GAAU,GAAGC,EAAkB,IAAAX,GAC7H,EAAE,OAAAY,EAAM,IAAIC,EAAc,EAAE,MAAAZ,GAAM,SAAAC,GAAS,OAAAI,GAAO,cAAAH,GAAc,UAAAC,GAAU,kBAAAG,GAAkB,GAE5FO,IAAqBC;AAAA,IACzB,CAACC,MAAqB;AACpB,MAAAJ,EAAM,SAASI,CAAO;AAAA,IACxB;AAAA,IACA,CAACJ,CAAK;AAAA,EACR;AAGE,SAAA,gBAAAK;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,SAAAhB;AAAA,MACA,MAAAD;AAAA,MACA,cAAAE;AAAA,MACA,UAAAC;AAAA,MACA,OAAAE;AAAA,MACA,kBAAAC;AAAA,MACA,QAAQ,CAAC,EAAE,OAAAK,QAEN,gBAAAO,EAAAC,GAAA,EAAU,GAAGT,GAAe,WAAU,mDACrC,UAAA;AAAA,QAAA,gBAAAM,EAACI,GAAa,EAAA,GAAIZ,GAAW,oBAAoB,CAAA,GAC/C,UAAA,gBAAAQ;AAAA,UAACK;AAAA,UAAA;AAAA,YACE,GAAIb,GAAW,eAAe,CAAC;AAAA,YAC/B,GAAGG;AAAAA,YACJ,SAASA,EAAM;AAAA,YACf,iBAAiBE;AAAA,YACjB,iBAAeJ;AAAA,YACf,UAAUN,KAAYC;AAAA,UAAA;AAAA,QAAA,GAE1B;AAAA,QACC,gBAAAc,EAAAI,GAAA,EAAW,GAAId,GAAW,kBAAkB,CAAA,GAAK,WAAWe,EAAG,aAAaf,GAAW,gBAAgB,SAAS,GAC9G,UAAA;AAAA,UAAAD;AAAA,UACAE,KAAY,gBAAAO,EAAC,QAAK,EAAA,WAAU,iCAAgC,UAAC,IAAA,CAAA;AAAA,QAAA,GAChE;AAAA,0BACCQ,GAAa,EAAA,GAAIhB,GAAW,oBAAoB,CAAA,EAAK,CAAA;AAAA,MAAA,GACxD;AAAA,IAEJ;AAAA,EACF;AAEJ;"}
|
package/dist/formtextarea.es.js
CHANGED
|
@@ -1,29 +1,29 @@
|
|
|
1
|
-
import { jsx as r, jsxs as
|
|
2
|
-
import { FormField as
|
|
1
|
+
import { jsx as r, jsxs as a } from "react/jsx-runtime";
|
|
2
|
+
import { FormField as x, FormItem as F, FormLabel as P, FormControl as b, FormMessage as g } from "./form.es.js";
|
|
3
3
|
import { Textarea as h } from "./textarea.es.js";
|
|
4
|
-
const
|
|
5
|
-
const { name:
|
|
4
|
+
const I = (t) => {
|
|
5
|
+
const { name: l, control: m, defaultValue: n, disabled: o, readOnly: d, rules: i, shouldUnregister: p, label: c, slotProps: e, required: s, ...f } = t;
|
|
6
6
|
return /* @__PURE__ */ r(
|
|
7
|
-
|
|
7
|
+
x,
|
|
8
8
|
{
|
|
9
|
-
control:
|
|
10
|
-
name:
|
|
9
|
+
control: m,
|
|
10
|
+
name: l,
|
|
11
11
|
defaultValue: n,
|
|
12
12
|
disabled: o,
|
|
13
|
-
rules:
|
|
14
|
-
shouldUnregister:
|
|
15
|
-
render: ({ field:
|
|
16
|
-
/* @__PURE__ */
|
|
17
|
-
|
|
13
|
+
rules: i,
|
|
14
|
+
shouldUnregister: p,
|
|
15
|
+
render: ({ field: u }) => /* @__PURE__ */ a(F, { ...f, children: [
|
|
16
|
+
/* @__PURE__ */ a(P, { ...e?.formLabelProps ?? {}, children: [
|
|
17
|
+
c,
|
|
18
18
|
s && /* @__PURE__ */ r("span", { className: "text-danger text-sm leading-4", children: "*" })
|
|
19
19
|
] }),
|
|
20
|
-
/* @__PURE__ */ r(
|
|
20
|
+
/* @__PURE__ */ r(b, { ...e?.formControlProps ?? {}, children: /* @__PURE__ */ r(h, { "aria-required": s, disabled: o || d, ...e?.textareaProps ?? {}, ...u }) }),
|
|
21
21
|
/* @__PURE__ */ r(g, { ...e?.formMessageProps ?? {} })
|
|
22
22
|
] })
|
|
23
23
|
}
|
|
24
24
|
);
|
|
25
25
|
};
|
|
26
26
|
export {
|
|
27
|
-
|
|
27
|
+
I as FormTextarea
|
|
28
28
|
};
|
|
29
29
|
//# sourceMappingURL=formtextarea.es.js.map
|