@jameskabz/nextcraft-ui 0.6.16 → 0.7.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/README.md +37 -3
- package/dist/components/craft-button.cjs +64 -4
- package/dist/components/craft-button.cjs.map +1 -1
- package/dist/components/craft-button.d.cts +5 -2
- package/dist/components/craft-button.d.ts +5 -2
- package/dist/components/craft-button.js +65 -5
- package/dist/components/craft-button.js.map +1 -1
- package/dist/components/craft-checkbox.cjs +2 -2
- package/dist/components/craft-checkbox.cjs.map +1 -1
- package/dist/components/craft-checkbox.js +2 -2
- package/dist/components/craft-checkbox.js.map +1 -1
- package/dist/components/craft-create-edit-drawer.cjs +5 -3
- package/dist/components/craft-create-edit-drawer.cjs.map +1 -1
- package/dist/components/craft-create-edit-drawer.js +5 -3
- package/dist/components/craft-create-edit-drawer.js.map +1 -1
- package/dist/components/craft-data-table-header.cjs +74 -0
- package/dist/components/craft-data-table-header.cjs.map +1 -0
- package/dist/components/craft-data-table-header.d.cts +17 -0
- package/dist/components/craft-data-table-header.d.ts +17 -0
- package/dist/components/craft-data-table-header.js +50 -0
- package/dist/components/craft-data-table-header.js.map +1 -0
- package/dist/components/craft-data-table-pagination.cjs +107 -0
- package/dist/components/craft-data-table-pagination.cjs.map +1 -0
- package/dist/components/craft-data-table-pagination.d.cts +25 -0
- package/dist/components/craft-data-table-pagination.d.ts +25 -0
- package/dist/components/craft-data-table-pagination.js +83 -0
- package/dist/components/craft-data-table-pagination.js.map +1 -0
- package/dist/components/craft-data-table.cjs +424 -192
- package/dist/components/craft-data-table.cjs.map +1 -1
- package/dist/components/craft-data-table.d.cts +61 -9
- package/dist/components/craft-data-table.d.ts +61 -9
- package/dist/components/craft-data-table.js +424 -192
- package/dist/components/craft-data-table.js.map +1 -1
- package/dist/components/craft-form-field.cjs +67 -11
- package/dist/components/craft-form-field.cjs.map +1 -1
- package/dist/components/craft-form-field.d.cts +4 -1
- package/dist/components/craft-form-field.d.ts +4 -1
- package/dist/components/craft-form-field.js +57 -11
- package/dist/components/craft-form-field.js.map +1 -1
- package/dist/components/craft-form-modal.cjs +29 -28
- package/dist/components/craft-form-modal.cjs.map +1 -1
- package/dist/components/craft-form-modal.js +29 -28
- package/dist/components/craft-form-modal.js.map +1 -1
- package/dist/components/craft-form.cjs +5 -3
- package/dist/components/craft-form.cjs.map +1 -1
- package/dist/components/craft-form.js +5 -3
- package/dist/components/craft-form.js.map +1 -1
- package/dist/components/craft-icon.cjs +26 -32
- package/dist/components/craft-icon.cjs.map +1 -1
- package/dist/components/craft-icon.d.cts +1 -2
- package/dist/components/craft-icon.d.ts +1 -2
- package/dist/components/craft-icon.js +36 -32
- package/dist/components/craft-icon.js.map +1 -1
- package/dist/components/craft-loader.cjs +195 -0
- package/dist/components/craft-loader.cjs.map +1 -0
- package/dist/components/craft-loader.d.cts +21 -0
- package/dist/components/craft-loader.d.ts +21 -0
- package/dist/components/craft-loader.js +171 -0
- package/dist/components/craft-loader.js.map +1 -0
- package/dist/components/layout/app-template.cjs +2 -3
- package/dist/components/layout/app-template.cjs.map +1 -1
- package/dist/components/layout/app-template.d.cts +1 -2
- package/dist/components/layout/app-template.d.ts +1 -2
- package/dist/components/layout/app-template.js +2 -3
- package/dist/components/layout/app-template.js.map +1 -1
- package/dist/index.cjs +9 -3
- package/dist/index.cjs.map +1 -1
- package/dist/index.d.cts +4 -2
- package/dist/index.d.ts +4 -2
- package/dist/index.js +6 -2
- package/dist/index.js.map +1 -1
- package/dist/styles.css +164 -12
- package/package.json +8 -8
|
@@ -1,5 +1,6 @@
|
|
|
1
1
|
"use client";
|
|
2
2
|
import { jsx, jsxs } from "react/jsx-runtime";
|
|
3
|
+
import * as React from "react";
|
|
3
4
|
import {
|
|
4
5
|
Controller,
|
|
5
6
|
useFormContext
|
|
@@ -28,6 +29,9 @@ function CraftFormField({
|
|
|
28
29
|
name,
|
|
29
30
|
label,
|
|
30
31
|
description,
|
|
32
|
+
helpText,
|
|
33
|
+
success,
|
|
34
|
+
required,
|
|
31
35
|
type = "text",
|
|
32
36
|
options = [],
|
|
33
37
|
placeholder,
|
|
@@ -42,11 +46,20 @@ function CraftFormField({
|
|
|
42
46
|
}) {
|
|
43
47
|
const { register, control, formState } = useFormContext();
|
|
44
48
|
const error = getFieldError(formState.errors, name);
|
|
49
|
+
const fieldId = React.useId();
|
|
50
|
+
const errorId = `${fieldId}-error`;
|
|
51
|
+
const helpId = `${fieldId}-help`;
|
|
45
52
|
const errorMessage = typeof (error == null ? void 0 : error.message) === "string" ? error.message : void 0;
|
|
53
|
+
const hasError = Boolean(errorMessage);
|
|
54
|
+
const resolvedInputClassName = cn(
|
|
55
|
+
inputClassName,
|
|
56
|
+
hasError ? "border-[rgb(var(--nc-accent-3))] focus:border-[rgb(var(--nc-accent-3))] focus:ring-[rgb(var(--nc-accent-3)/0.35)]" : null
|
|
57
|
+
);
|
|
58
|
+
const ariaDescribedBy = hasError ? errorId : helpText ? helpId : void 0;
|
|
46
59
|
if (type === "hidden") {
|
|
47
60
|
return /* @__PURE__ */ jsx("input", { type: "hidden", ...register(name, rules) });
|
|
48
61
|
}
|
|
49
|
-
const labelNode = label ? /* @__PURE__ */
|
|
62
|
+
const labelNode = label ? /* @__PURE__ */ jsxs(
|
|
50
63
|
"label",
|
|
51
64
|
{
|
|
52
65
|
htmlFor: name,
|
|
@@ -54,7 +67,10 @@ function CraftFormField({
|
|
|
54
67
|
"text-sm font-semibold text-[rgb(var(--nc-fg))]",
|
|
55
68
|
labelClassName
|
|
56
69
|
),
|
|
57
|
-
children:
|
|
70
|
+
children: [
|
|
71
|
+
label,
|
|
72
|
+
required ? /* @__PURE__ */ jsx("span", { className: "ml-1 text-[rgb(var(--nc-accent-3))]", "aria-label": "required", children: "*" }) : null
|
|
73
|
+
]
|
|
58
74
|
}
|
|
59
75
|
) : null;
|
|
60
76
|
const descriptionNode = description ? /* @__PURE__ */ jsx(
|
|
@@ -67,7 +83,24 @@ function CraftFormField({
|
|
|
67
83
|
children: description
|
|
68
84
|
}
|
|
69
85
|
) : null;
|
|
70
|
-
const errorNode = errorMessage ? /* @__PURE__ */
|
|
86
|
+
const errorNode = errorMessage ? /* @__PURE__ */ jsxs(
|
|
87
|
+
"div",
|
|
88
|
+
{
|
|
89
|
+
id: errorId,
|
|
90
|
+
className: "flex items-start gap-2 text-xs text-[rgb(var(--nc-accent-3))]",
|
|
91
|
+
role: "alert",
|
|
92
|
+
"aria-live": "polite",
|
|
93
|
+
children: [
|
|
94
|
+
/* @__PURE__ */ jsx("svg", { className: "mt-0.5 h-4 w-4 shrink-0", viewBox: "0 0 20 20", fill: "currentColor", children: /* @__PURE__ */ jsx("path", { d: "M10 2.5a.75.75 0 01.66.39l7.25 12.5a.75.75 0 01-.66 1.11H2.75a.75.75 0 01-.66-1.11l7.25-12.5A.75.75 0 0110 2.5zm0 4.25a.75.75 0 00-.75.75v4.5a.75.75 0 001.5 0v-4.5a.75.75 0 00-.75-.75zm0 9a1 1 0 100-2 1 1 0 000 2z" }) }),
|
|
95
|
+
/* @__PURE__ */ jsx("span", { children: errorMessage })
|
|
96
|
+
]
|
|
97
|
+
}
|
|
98
|
+
) : null;
|
|
99
|
+
const helpNode = helpText && !hasError ? /* @__PURE__ */ jsx("p", { id: helpId, className: "text-xs text-[rgb(var(--nc-fg-muted))]", children: helpText }) : null;
|
|
100
|
+
const successNode = success && !hasError ? /* @__PURE__ */ jsxs("div", { className: "flex items-start gap-2 text-xs text-[rgb(var(--nc-accent-2))]", children: [
|
|
101
|
+
/* @__PURE__ */ jsx("svg", { className: "mt-0.5 h-4 w-4 shrink-0", viewBox: "0 0 20 20", fill: "currentColor", children: /* @__PURE__ */ jsx("path", { d: "M7.5 10.75l2 2 4-4a.75.75 0 111.06 1.06l-4.53 4.53a.75.75 0 01-1.06 0L6.44 11.81a.75.75 0 011.06-1.06z" }) }),
|
|
102
|
+
/* @__PURE__ */ jsx("span", { children: success })
|
|
103
|
+
] }) : null;
|
|
71
104
|
const renderInput = () => {
|
|
72
105
|
if (type === "textarea") {
|
|
73
106
|
return /* @__PURE__ */ jsx(
|
|
@@ -76,8 +109,9 @@ function CraftFormField({
|
|
|
76
109
|
id: name,
|
|
77
110
|
placeholder,
|
|
78
111
|
tone,
|
|
79
|
-
className:
|
|
112
|
+
className: resolvedInputClassName,
|
|
80
113
|
disabled,
|
|
114
|
+
"aria-describedby": ariaDescribedBy,
|
|
81
115
|
...fieldProps,
|
|
82
116
|
...register(name, rules)
|
|
83
117
|
}
|
|
@@ -89,9 +123,10 @@ function CraftFormField({
|
|
|
89
123
|
{
|
|
90
124
|
id: name,
|
|
91
125
|
tone,
|
|
92
|
-
className:
|
|
126
|
+
className: resolvedInputClassName,
|
|
93
127
|
multiple: type === "multiselect",
|
|
94
128
|
disabled,
|
|
129
|
+
"aria-describedby": ariaDescribedBy,
|
|
95
130
|
...fieldProps,
|
|
96
131
|
...register(name, rules),
|
|
97
132
|
children: [
|
|
@@ -117,6 +152,7 @@ function CraftFormField({
|
|
|
117
152
|
label,
|
|
118
153
|
description,
|
|
119
154
|
disabled,
|
|
155
|
+
"aria-describedby": ariaDescribedBy,
|
|
120
156
|
...fieldProps,
|
|
121
157
|
...register(name, rules)
|
|
122
158
|
}
|
|
@@ -129,6 +165,7 @@ function CraftFormField({
|
|
|
129
165
|
tone,
|
|
130
166
|
label,
|
|
131
167
|
disabled,
|
|
168
|
+
"aria-describedby": ariaDescribedBy,
|
|
132
169
|
...fieldProps,
|
|
133
170
|
...register(name, rules)
|
|
134
171
|
}
|
|
@@ -150,6 +187,7 @@ function CraftFormField({
|
|
|
150
187
|
onChange: field.onChange,
|
|
151
188
|
tone,
|
|
152
189
|
placeholder,
|
|
190
|
+
"aria-describedby": ariaDescribedBy,
|
|
153
191
|
...fieldProps
|
|
154
192
|
}
|
|
155
193
|
);
|
|
@@ -164,8 +202,9 @@ function CraftFormField({
|
|
|
164
202
|
id: name,
|
|
165
203
|
tone,
|
|
166
204
|
placeholder,
|
|
167
|
-
className:
|
|
205
|
+
className: resolvedInputClassName,
|
|
168
206
|
disabled,
|
|
207
|
+
"aria-describedby": ariaDescribedBy,
|
|
169
208
|
...fieldProps,
|
|
170
209
|
...register(name, rules)
|
|
171
210
|
}
|
|
@@ -178,8 +217,9 @@ function CraftFormField({
|
|
|
178
217
|
id: name,
|
|
179
218
|
tone,
|
|
180
219
|
placeholder,
|
|
181
|
-
className:
|
|
220
|
+
className: resolvedInputClassName,
|
|
182
221
|
disabled,
|
|
222
|
+
"aria-describedby": ariaDescribedBy,
|
|
183
223
|
...fieldProps,
|
|
184
224
|
...register(name, rules)
|
|
185
225
|
}
|
|
@@ -204,6 +244,7 @@ function CraftFormField({
|
|
|
204
244
|
value: option.value,
|
|
205
245
|
disabled: option.disabled || disabled,
|
|
206
246
|
className: "h-4 w-4 accent-[rgb(var(--nc-accent-1))]",
|
|
247
|
+
"aria-describedby": ariaDescribedBy,
|
|
207
248
|
...fieldProps,
|
|
208
249
|
...register(name, rules)
|
|
209
250
|
}
|
|
@@ -222,9 +263,10 @@ function CraftFormField({
|
|
|
222
263
|
type: "range",
|
|
223
264
|
className: cn(
|
|
224
265
|
"w-full accent-[rgb(var(--nc-accent-1))]",
|
|
225
|
-
|
|
266
|
+
resolvedInputClassName
|
|
226
267
|
),
|
|
227
268
|
disabled,
|
|
269
|
+
"aria-describedby": ariaDescribedBy,
|
|
228
270
|
...fieldProps,
|
|
229
271
|
...register(name, rules)
|
|
230
272
|
}
|
|
@@ -240,9 +282,10 @@ function CraftFormField({
|
|
|
240
282
|
className: cn(
|
|
241
283
|
baseInputClass,
|
|
242
284
|
"file:mr-4 file:rounded-xl file:border-0 file:bg-[rgb(var(--nc-surface)/0.35)] file:px-4 file:py-2 file:text-sm file:font-semibold file:text-[rgb(var(--nc-fg))]",
|
|
243
|
-
|
|
285
|
+
resolvedInputClassName
|
|
244
286
|
),
|
|
245
287
|
disabled,
|
|
288
|
+
"aria-describedby": ariaDescribedBy,
|
|
246
289
|
...fieldProps,
|
|
247
290
|
...register(name, rules)
|
|
248
291
|
}
|
|
@@ -256,8 +299,9 @@ function CraftFormField({
|
|
|
256
299
|
type: inputType,
|
|
257
300
|
placeholder,
|
|
258
301
|
tone,
|
|
259
|
-
className:
|
|
302
|
+
className: resolvedInputClassName,
|
|
260
303
|
disabled,
|
|
304
|
+
"aria-describedby": ariaDescribedBy,
|
|
261
305
|
...fieldProps,
|
|
262
306
|
...register(name, rules)
|
|
263
307
|
}
|
|
@@ -271,7 +315,9 @@ function CraftFormField({
|
|
|
271
315
|
showDescriptionAbove ? descriptionNode : null,
|
|
272
316
|
renderInput(),
|
|
273
317
|
showDescriptionBelow ? descriptionNode : null,
|
|
274
|
-
errorNode
|
|
318
|
+
errorNode,
|
|
319
|
+
helpNode,
|
|
320
|
+
successNode
|
|
275
321
|
] });
|
|
276
322
|
}
|
|
277
323
|
export {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/components/craft-form-field.tsx"],"sourcesContent":["\"use client\";\n\nimport * as React from \"react\";\nimport {\n Controller,\n type FieldValues,\n type Path,\n type RegisterOptions,\n useFormContext,\n} from \"react-hook-form\";\n\nimport { cn } from \"@/utils/cn\";\nimport type { ThemeName } from \"@/theme/theme-context\";\nimport { CraftInput } from \"@/components/craft-input\";\nimport { CraftTextarea } from \"@/components/craft-textarea\";\nimport { CraftSelect } from \"@/components/craft-select\";\nimport { CraftCheckbox } from \"@/components/craft-checkbox\";\nimport { CraftSwitch } from \"@/components/craft-switch\";\nimport { CraftDatePicker } from \"@/components/craft-date-picker\";\nimport { CraftNumberInput } from \"@/components/craft-number-input\";\nimport { CraftCurrencyInput } from \"@/components/craft-currency-input\";\n\nexport type CraftFormFieldOption = {\n label: React.ReactNode;\n value: string;\n disabled?: boolean;\n};\n\nexport type CraftFormFieldType =\n | \"text\"\n | \"number\"\n | \"password\"\n | \"textarea\"\n | \"select\"\n | \"checkbox\"\n | \"slider\"\n | \"date\"\n | \"color\"\n | \"email\"\n | \"tel\"\n | \"url\"\n | \"time\"\n | \"datetime-local\"\n | \"month\"\n | \"week\"\n | \"file\"\n | \"multifile\"\n | \"radio\"\n | \"switch\"\n | \"range\"\n | \"search\"\n | \"hidden\"\n | \"multiselect\"\n | \"currency\";\n\nexport type CraftFormFieldProps<TValues extends FieldValues = FieldValues> = {\n name: Path<TValues>;\n label?: React.ReactNode;\n description?: React.ReactNode;\n type?: CraftFormFieldType;\n options?: CraftFormFieldOption[];\n placeholder?: string;\n tone?: ThemeName;\n className?: string;\n inputClassName?: string;\n labelClassName?: string;\n descriptionClassName?: string;\n rules?: RegisterOptions<TValues>;\n disabled?: boolean;\n fieldProps?: Record<string, unknown>;\n};\n\nfunction getFieldError(errors: unknown, name: string) {\n if (!errors || typeof errors !== \"object\") return undefined;\n const segments = name.split(\".\");\n let current: unknown = errors;\n for (const segment of segments) {\n if (!current || typeof current !== \"object\") return undefined;\n current = (current as Record<string, unknown>)[segment];\n }\n return current;\n}\n\nconst baseInputClass =\n \"w-full rounded-2xl border-2 bg-[rgb(var(--nc-surface)/0.08)] text-[rgb(var(--nc-fg))] backdrop-blur-xl shadow-[inset_0_2px_8px_rgba(0,0,0,0.3)] focus:outline-none focus:ring-4 transition-all duration-300 disabled:opacity-50 disabled:cursor-not-allowed border-[rgb(var(--nc-border)/0.35)] focus:border-[rgb(var(--nc-accent-1)/0.8)] focus:ring-[rgb(var(--nc-accent-1)/0.3)] px-5 py-3 text-base placeholder:text-[rgb(var(--nc-fg-soft))]\";\n\nexport function CraftFormField<TValues extends FieldValues = FieldValues>({\n name,\n label,\n description,\n type = \"text\",\n options = [],\n placeholder,\n tone,\n className,\n inputClassName,\n labelClassName,\n descriptionClassName,\n rules,\n disabled,\n fieldProps,\n}: CraftFormFieldProps<TValues>) {\n const { register, control, formState } = useFormContext<TValues>();\n const error = getFieldError(formState.errors, name);\n const errorMessage =\n typeof (error as { message?: unknown })?.message === \"string\"\n ? (error as { message: string }).message\n : undefined;\n\n if (type === \"hidden\") {\n return <input type=\"hidden\" {...register(name, rules)} />;\n }\n\n const labelNode = label ? (\n <label\n htmlFor={name}\n className={cn(\n \"text-sm font-semibold text-[rgb(var(--nc-fg))]\",\n labelClassName\n )}\n >\n {label}\n </label>\n ) : null;\n\n const descriptionNode = description ? (\n <p\n className={cn(\n \"text-xs text-[rgb(var(--nc-fg-muted))]\",\n descriptionClassName\n )}\n >\n {description}\n </p>\n ) : null;\n\n const errorNode = errorMessage ? (\n <p className=\"text-xs text-[rgb(var(--nc-accent-3))]\">{errorMessage}</p>\n ) : null;\n\n const renderInput = () => {\n if (type === \"textarea\") {\n return (\n <CraftTextarea\n id={name}\n placeholder={placeholder}\n tone={tone}\n className={inputClassName}\n disabled={disabled}\n {...(fieldProps as Record<string, unknown>)}\n {...register(name, rules)}\n />\n );\n }\n\n if (type === \"select\" || type === \"multiselect\") {\n return (\n <CraftSelect\n id={name}\n tone={tone}\n className={inputClassName}\n multiple={type === \"multiselect\"}\n disabled={disabled}\n {...(fieldProps as Record<string, unknown>)}\n {...register(name, rules)}\n >\n {placeholder && (\n <option value=\"\" disabled>\n {placeholder}\n </option>\n )}\n {options.map((option) => (\n <option\n key={option.value}\n value={option.value}\n disabled={option.disabled}\n >\n {option.label}\n </option>\n ))}\n </CraftSelect>\n );\n }\n\n if (type === \"checkbox\") {\n return (\n <CraftCheckbox\n tone={tone}\n label={label}\n description={description}\n disabled={disabled}\n {...(fieldProps as Record<string, unknown>)}\n {...register(name, rules)}\n />\n );\n }\n\n if (type === \"switch\") {\n return (\n <CraftSwitch\n tone={tone}\n label={label}\n disabled={disabled}\n {...(fieldProps as Record<string, unknown>)}\n {...register(name, rules)}\n />\n );\n }\n\n if (type === \"date\") {\n return (\n <Controller\n control={control}\n name={name}\n rules={rules}\n render={({ field }) => (\n <CraftDatePicker\n value={field.value ?? \"\"}\n onChange={field.onChange}\n tone={tone}\n placeholder={placeholder}\n {...(fieldProps as Record<string, unknown>)}\n />\n )}\n />\n );\n }\n\n if (type === \"number\") {\n return (\n <CraftNumberInput\n id={name}\n tone={tone}\n placeholder={placeholder}\n className={inputClassName}\n disabled={disabled}\n {...(fieldProps as Record<string, unknown>)}\n {...register(name, rules)}\n />\n );\n }\n\n if (type === \"currency\") {\n return (\n <CraftCurrencyInput\n id={name}\n tone={tone}\n placeholder={placeholder}\n className={inputClassName}\n disabled={disabled}\n {...(fieldProps as Record<string, unknown>)}\n {...register(name, rules)}\n />\n );\n }\n\n if (type === \"radio\") {\n return (\n <div className=\"grid gap-3\">\n {options.map((option) => (\n <label\n key={option.value}\n className={cn(\n \"flex items-center gap-3 rounded-2xl border border-[rgb(var(--nc-border)/0.35)] bg-[rgb(var(--nc-surface)/0.08)] px-4 py-3 text-sm text-[rgb(var(--nc-fg))]\",\n \"transition-all duration-200\",\n \"focus-within:ring-2 focus-within:ring-[rgb(var(--nc-accent-1)/0.5)]\",\n option.disabled ? \"opacity-60\" : \"cursor-pointer\"\n )}\n data-nc-theme={tone}\n >\n <input\n type=\"radio\"\n value={option.value}\n disabled={option.disabled || disabled}\n className=\"h-4 w-4 accent-[rgb(var(--nc-accent-1))]\"\n {...(fieldProps as Record<string, unknown>)}\n {...register(name, rules)}\n />\n <span>{option.label}</span>\n </label>\n ))}\n </div>\n );\n }\n\n if (type === \"range\" || type === \"slider\") {\n return (\n <input\n id={name}\n type=\"range\"\n className={cn(\n \"w-full accent-[rgb(var(--nc-accent-1))]\",\n inputClassName\n )}\n disabled={disabled}\n {...(fieldProps as Record<string, unknown>)}\n {...register(name, rules)}\n />\n );\n }\n\n if (type === \"file\" || type === \"multifile\") {\n return (\n <input\n id={name}\n type=\"file\"\n multiple={type === \"multifile\"}\n className={cn(\n baseInputClass,\n \"file:mr-4 file:rounded-xl file:border-0 file:bg-[rgb(var(--nc-surface)/0.35)] file:px-4 file:py-2 file:text-sm file:font-semibold file:text-[rgb(var(--nc-fg))]\",\n inputClassName\n )}\n disabled={disabled}\n {...(fieldProps as Record<string, unknown>)}\n {...register(name, rules)}\n />\n );\n }\n\n const inputType =\n type === \"search\" ||\n type === \"password\" ||\n type === \"email\" ||\n type === \"tel\" ||\n type === \"url\" ||\n type === \"time\" ||\n type === \"datetime-local\" ||\n type === \"month\" ||\n type === \"week\" ||\n type === \"color\"\n ? type\n : \"text\";\n\n return (\n <CraftInput\n id={name}\n type={inputType}\n placeholder={placeholder}\n tone={tone}\n className={inputClassName}\n disabled={disabled}\n {...(fieldProps as Record<string, unknown>)}\n {...register(name, rules)}\n />\n );\n };\n\n const showLabel = type !== \"checkbox\" && type !== \"switch\";\n const showDescriptionAbove = type !== \"checkbox\" && type !== \"switch\";\n const showDescriptionBelow = type === \"switch\";\n\n return (\n <div className={cn(\"space-y-2\", className)} data-nc-theme={tone}>\n {showLabel ? labelNode : null}\n {showDescriptionAbove ? descriptionNode : null}\n {renderInput()}\n {showDescriptionBelow ? descriptionNode : null}\n {errorNode}\n </div>\n );\n}\n"],"mappings":"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","names":[]}
|
|
1
|
+
{"version":3,"sources":["../../src/components/craft-form-field.tsx"],"sourcesContent":["\"use client\";\n\nimport * as React from \"react\";\nimport {\n Controller,\n type FieldValues,\n type Path,\n type RegisterOptions,\n useFormContext,\n} from \"react-hook-form\";\n\nimport { cn } from \"@/utils/cn\";\nimport type { ThemeName } from \"@/theme/theme-context\";\nimport { CraftInput } from \"@/components/craft-input\";\nimport { CraftTextarea } from \"@/components/craft-textarea\";\nimport { CraftSelect } from \"@/components/craft-select\";\nimport { CraftCheckbox } from \"@/components/craft-checkbox\";\nimport { CraftSwitch } from \"@/components/craft-switch\";\nimport { CraftDatePicker } from \"@/components/craft-date-picker\";\nimport { CraftNumberInput } from \"@/components/craft-number-input\";\nimport { CraftCurrencyInput } from \"@/components/craft-currency-input\";\n\nexport type CraftFormFieldOption = {\n label: React.ReactNode;\n value: string;\n disabled?: boolean;\n};\n\nexport type CraftFormFieldType =\n | \"text\"\n | \"number\"\n | \"password\"\n | \"textarea\"\n | \"select\"\n | \"checkbox\"\n | \"slider\"\n | \"date\"\n | \"color\"\n | \"email\"\n | \"tel\"\n | \"url\"\n | \"time\"\n | \"datetime-local\"\n | \"month\"\n | \"week\"\n | \"file\"\n | \"multifile\"\n | \"radio\"\n | \"switch\"\n | \"range\"\n | \"search\"\n | \"hidden\"\n | \"multiselect\"\n | \"currency\";\n\nexport type CraftFormFieldProps<TValues extends FieldValues = FieldValues> = {\n name: Path<TValues>;\n label?: React.ReactNode;\n description?: React.ReactNode;\n helpText?: React.ReactNode;\n success?: React.ReactNode;\n required?: boolean;\n type?: CraftFormFieldType;\n options?: CraftFormFieldOption[];\n placeholder?: string;\n tone?: ThemeName;\n className?: string;\n inputClassName?: string;\n labelClassName?: string;\n descriptionClassName?: string;\n rules?: RegisterOptions<TValues>;\n disabled?: boolean;\n fieldProps?: Record<string, unknown>;\n};\n\nfunction getFieldError(errors: unknown, name: string) {\n if (!errors || typeof errors !== \"object\") return undefined;\n const segments = name.split(\".\");\n let current: unknown = errors;\n for (const segment of segments) {\n if (!current || typeof current !== \"object\") return undefined;\n current = (current as Record<string, unknown>)[segment];\n }\n return current;\n}\n\nconst baseInputClass =\n \"w-full rounded-2xl border-2 bg-[rgb(var(--nc-surface)/0.08)] text-[rgb(var(--nc-fg))] backdrop-blur-xl shadow-[inset_0_2px_8px_rgba(0,0,0,0.3)] focus:outline-none focus:ring-4 transition-all duration-300 disabled:opacity-50 disabled:cursor-not-allowed border-[rgb(var(--nc-border)/0.35)] focus:border-[rgb(var(--nc-accent-1)/0.8)] focus:ring-[rgb(var(--nc-accent-1)/0.3)] px-5 py-3 text-base placeholder:text-[rgb(var(--nc-fg-soft))]\";\n\nexport function CraftFormField<TValues extends FieldValues = FieldValues>({\n name,\n label,\n description,\n helpText,\n success,\n required,\n type = \"text\",\n options = [],\n placeholder,\n tone,\n className,\n inputClassName,\n labelClassName,\n descriptionClassName,\n rules,\n disabled,\n fieldProps,\n}: CraftFormFieldProps<TValues>) {\n const { register, control, formState } = useFormContext<TValues>();\n const error = getFieldError(formState.errors, name);\n const fieldId = React.useId();\n const errorId = `${fieldId}-error`;\n const helpId = `${fieldId}-help`;\n const errorMessage =\n typeof (error as { message?: unknown })?.message === \"string\"\n ? (error as { message: string }).message\n : undefined;\n const hasError = Boolean(errorMessage);\n const resolvedInputClassName = cn(\n inputClassName,\n hasError\n ? \"border-[rgb(var(--nc-accent-3))] focus:border-[rgb(var(--nc-accent-3))] focus:ring-[rgb(var(--nc-accent-3)/0.35)]\"\n : null\n );\n const ariaDescribedBy = hasError\n ? errorId\n : helpText\n ? helpId\n : undefined;\n\n if (type === \"hidden\") {\n return <input type=\"hidden\" {...register(name, rules)} />;\n }\n\n const labelNode = label ? (\n <label\n htmlFor={name}\n className={cn(\n \"text-sm font-semibold text-[rgb(var(--nc-fg))]\",\n labelClassName\n )}\n >\n {label}\n {required ? (\n <span className=\"ml-1 text-[rgb(var(--nc-accent-3))]\" aria-label=\"required\">\n *\n </span>\n ) : null}\n </label>\n ) : null;\n\n const descriptionNode = description ? (\n <p\n className={cn(\n \"text-xs text-[rgb(var(--nc-fg-muted))]\",\n descriptionClassName\n )}\n >\n {description}\n </p>\n ) : null;\n\n const errorNode = errorMessage ? (\n <div\n id={errorId}\n className=\"flex items-start gap-2 text-xs text-[rgb(var(--nc-accent-3))]\"\n role=\"alert\"\n aria-live=\"polite\"\n >\n <svg className=\"mt-0.5 h-4 w-4 shrink-0\" viewBox=\"0 0 20 20\" fill=\"currentColor\">\n <path d=\"M10 2.5a.75.75 0 01.66.39l7.25 12.5a.75.75 0 01-.66 1.11H2.75a.75.75 0 01-.66-1.11l7.25-12.5A.75.75 0 0110 2.5zm0 4.25a.75.75 0 00-.75.75v4.5a.75.75 0 001.5 0v-4.5a.75.75 0 00-.75-.75zm0 9a1 1 0 100-2 1 1 0 000 2z\" />\n </svg>\n <span>{errorMessage}</span>\n </div>\n ) : null;\n\n const helpNode = helpText && !hasError ? (\n <p id={helpId} className=\"text-xs text-[rgb(var(--nc-fg-muted))]\">\n {helpText}\n </p>\n ) : null;\n\n const successNode = success && !hasError ? (\n <div className=\"flex items-start gap-2 text-xs text-[rgb(var(--nc-accent-2))]\">\n <svg className=\"mt-0.5 h-4 w-4 shrink-0\" viewBox=\"0 0 20 20\" fill=\"currentColor\">\n <path d=\"M7.5 10.75l2 2 4-4a.75.75 0 111.06 1.06l-4.53 4.53a.75.75 0 01-1.06 0L6.44 11.81a.75.75 0 011.06-1.06z\" />\n </svg>\n <span>{success}</span>\n </div>\n ) : null;\n\n const renderInput = () => {\n if (type === \"textarea\") {\n return (\n <CraftTextarea\n id={name}\n placeholder={placeholder}\n tone={tone}\n className={resolvedInputClassName}\n disabled={disabled}\n aria-describedby={ariaDescribedBy}\n {...(fieldProps as Record<string, unknown>)}\n {...register(name, rules)}\n />\n );\n }\n\n if (type === \"select\" || type === \"multiselect\") {\n return (\n <CraftSelect\n id={name}\n tone={tone}\n className={resolvedInputClassName}\n multiple={type === \"multiselect\"}\n disabled={disabled}\n aria-describedby={ariaDescribedBy}\n {...(fieldProps as Record<string, unknown>)}\n {...register(name, rules)}\n >\n {placeholder && (\n <option value=\"\" disabled>\n {placeholder}\n </option>\n )}\n {options.map((option) => (\n <option\n key={option.value}\n value={option.value}\n disabled={option.disabled}\n >\n {option.label}\n </option>\n ))}\n </CraftSelect>\n );\n }\n\n if (type === \"checkbox\") {\n return (\n <CraftCheckbox\n tone={tone}\n label={label}\n description={description}\n disabled={disabled}\n aria-describedby={ariaDescribedBy}\n {...(fieldProps as Record<string, unknown>)}\n {...register(name, rules)}\n />\n );\n }\n\n if (type === \"switch\") {\n return (\n <CraftSwitch\n tone={tone}\n label={label}\n disabled={disabled}\n aria-describedby={ariaDescribedBy}\n {...(fieldProps as Record<string, unknown>)}\n {...register(name, rules)}\n />\n );\n }\n\n if (type === \"date\") {\n return (\n <Controller\n control={control}\n name={name}\n rules={rules}\n render={({ field }) => (\n <CraftDatePicker\n value={field.value ?? \"\"}\n onChange={field.onChange}\n tone={tone}\n placeholder={placeholder}\n aria-describedby={ariaDescribedBy}\n {...(fieldProps as Record<string, unknown>)}\n />\n )}\n />\n );\n }\n\n if (type === \"number\") {\n return (\n <CraftNumberInput\n id={name}\n tone={tone}\n placeholder={placeholder}\n className={resolvedInputClassName}\n disabled={disabled}\n aria-describedby={ariaDescribedBy}\n {...(fieldProps as Record<string, unknown>)}\n {...register(name, rules)}\n />\n );\n }\n\n if (type === \"currency\") {\n return (\n <CraftCurrencyInput\n id={name}\n tone={tone}\n placeholder={placeholder}\n className={resolvedInputClassName}\n disabled={disabled}\n aria-describedby={ariaDescribedBy}\n {...(fieldProps as Record<string, unknown>)}\n {...register(name, rules)}\n />\n );\n }\n\n if (type === \"radio\") {\n return (\n <div className=\"grid gap-3\">\n {options.map((option) => (\n <label\n key={option.value}\n className={cn(\n \"flex items-center gap-3 rounded-2xl border border-[rgb(var(--nc-border)/0.35)] bg-[rgb(var(--nc-surface)/0.08)] px-4 py-3 text-sm text-[rgb(var(--nc-fg))]\",\n \"transition-all duration-200\",\n \"focus-within:ring-2 focus-within:ring-[rgb(var(--nc-accent-1)/0.5)]\",\n option.disabled ? \"opacity-60\" : \"cursor-pointer\"\n )}\n data-nc-theme={tone}\n >\n <input\n type=\"radio\"\n value={option.value}\n disabled={option.disabled || disabled}\n className=\"h-4 w-4 accent-[rgb(var(--nc-accent-1))]\"\n aria-describedby={ariaDescribedBy}\n {...(fieldProps as Record<string, unknown>)}\n {...register(name, rules)}\n />\n <span>{option.label}</span>\n </label>\n ))}\n </div>\n );\n }\n\n if (type === \"range\" || type === \"slider\") {\n return (\n <input\n id={name}\n type=\"range\"\n className={cn(\n \"w-full accent-[rgb(var(--nc-accent-1))]\",\n resolvedInputClassName\n )}\n disabled={disabled}\n aria-describedby={ariaDescribedBy}\n {...(fieldProps as Record<string, unknown>)}\n {...register(name, rules)}\n />\n );\n }\n\n if (type === \"file\" || type === \"multifile\") {\n return (\n <input\n id={name}\n type=\"file\"\n multiple={type === \"multifile\"}\n className={cn(\n baseInputClass,\n \"file:mr-4 file:rounded-xl file:border-0 file:bg-[rgb(var(--nc-surface)/0.35)] file:px-4 file:py-2 file:text-sm file:font-semibold file:text-[rgb(var(--nc-fg))]\",\n resolvedInputClassName\n )}\n disabled={disabled}\n aria-describedby={ariaDescribedBy}\n {...(fieldProps as Record<string, unknown>)}\n {...register(name, rules)}\n />\n );\n }\n\n const inputType =\n type === \"search\" ||\n type === \"password\" ||\n type === \"email\" ||\n type === \"tel\" ||\n type === \"url\" ||\n type === \"time\" ||\n type === \"datetime-local\" ||\n type === \"month\" ||\n type === \"week\" ||\n type === \"color\"\n ? type\n : \"text\";\n\n return (\n <CraftInput\n id={name}\n type={inputType}\n placeholder={placeholder}\n tone={tone}\n className={resolvedInputClassName}\n disabled={disabled}\n aria-describedby={ariaDescribedBy}\n {...(fieldProps as Record<string, unknown>)}\n {...register(name, rules)}\n />\n );\n };\n\n const showLabel = type !== \"checkbox\" && type !== \"switch\";\n const showDescriptionAbove = type !== \"checkbox\" && type !== \"switch\";\n const showDescriptionBelow = type === \"switch\";\n\n return (\n <div className={cn(\"space-y-2\", className)} data-nc-theme={tone}>\n {showLabel ? labelNode : null}\n {showDescriptionAbove ? descriptionNode : null}\n {renderInput()}\n {showDescriptionBelow ? descriptionNode : null}\n {errorNode}\n {helpNode}\n {successNode}\n </div>\n );\n}\n"],"mappings":"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","names":[]}
|
|
@@ -38,7 +38,6 @@ var import_react_hook_form = require("react-hook-form");
|
|
|
38
38
|
var import_cn = require("../utils/cn");
|
|
39
39
|
var import_craft_modal = require("../components/craft-modal");
|
|
40
40
|
var import_craft_button = require("../components/craft-button");
|
|
41
|
-
var import_craft_submit_button = require("../components/craft-submit-button");
|
|
42
41
|
var import_craft_form_field = require("../components/craft-form-field");
|
|
43
42
|
function defaultValueForField(field) {
|
|
44
43
|
var _a, _b, _c, _d;
|
|
@@ -216,6 +215,7 @@ function CraftFormModal({
|
|
|
216
215
|
defaultValues
|
|
217
216
|
});
|
|
218
217
|
const formId = React.useId();
|
|
218
|
+
const isSubmitDisabled = disableSubmitWhenInvalid && !form.formState.isValid;
|
|
219
219
|
React.useEffect(() => {
|
|
220
220
|
form.reset(defaultValues);
|
|
221
221
|
}, [defaultValues, form]);
|
|
@@ -277,11 +277,13 @@ function CraftFormModal({
|
|
|
277
277
|
}
|
|
278
278
|
),
|
|
279
279
|
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
280
|
-
|
|
280
|
+
import_craft_button.CraftButton,
|
|
281
281
|
{
|
|
282
|
+
type: "submit",
|
|
283
|
+
variant: "solid",
|
|
282
284
|
loading,
|
|
283
|
-
disableWhenInvalid: disableSubmitWhenInvalid,
|
|
284
285
|
form: formId,
|
|
286
|
+
disabled: loading || isSubmitDisabled,
|
|
285
287
|
children: submitLabel
|
|
286
288
|
}
|
|
287
289
|
)
|
|
@@ -292,32 +294,31 @@ function CraftFormModal({
|
|
|
292
294
|
id: formId,
|
|
293
295
|
onSubmit: handleSubmit,
|
|
294
296
|
className: (0, import_cn.cn)("space-y-5", formClassName),
|
|
295
|
-
children: fields.map((field) => /* @__PURE__ */ (0, import_jsx_runtime.
|
|
296
|
-
|
|
297
|
-
|
|
298
|
-
|
|
299
|
-
|
|
300
|
-
|
|
301
|
-
|
|
302
|
-
|
|
303
|
-
|
|
304
|
-
|
|
305
|
-
|
|
306
|
-
|
|
307
|
-
|
|
308
|
-
|
|
309
|
-
|
|
310
|
-
|
|
311
|
-
|
|
312
|
-
|
|
313
|
-
|
|
314
|
-
|
|
315
|
-
|
|
316
|
-
|
|
317
|
-
}
|
|
297
|
+
children: fields.map((field) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "space-y-2", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
298
|
+
import_craft_form_field.CraftFormField,
|
|
299
|
+
{
|
|
300
|
+
name: field.name,
|
|
301
|
+
label: field.label,
|
|
302
|
+
description: field.description,
|
|
303
|
+
helpText: field.helpText,
|
|
304
|
+
required: field.required && !field.disabled,
|
|
305
|
+
type: field.type,
|
|
306
|
+
placeholder: field.placeholder,
|
|
307
|
+
options: field.options,
|
|
308
|
+
tone,
|
|
309
|
+
disabled: field.disabled || loading,
|
|
310
|
+
rules: buildRules(field, form.getValues),
|
|
311
|
+
fieldProps: {
|
|
312
|
+
min: field.min,
|
|
313
|
+
max: field.max,
|
|
314
|
+
step: field.step,
|
|
315
|
+
rows: field.rows,
|
|
316
|
+
accept: field.accept,
|
|
317
|
+
multiple: field.type === "multifile",
|
|
318
|
+
...field.fieldProps
|
|
318
319
|
}
|
|
319
|
-
|
|
320
|
-
|
|
320
|
+
}
|
|
321
|
+
) }, field.name))
|
|
321
322
|
}
|
|
322
323
|
)
|
|
323
324
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/components/craft-form-modal.tsx"],"sourcesContent":["\"use client\";\n\nimport * as React from \"react\";\nimport {\n FormProvider,\n type DefaultValues,\n type FieldValues,\n type Path,\n type RegisterOptions,\n useForm,\n} from \"react-hook-form\";\n\nimport { cn } from \"@/utils/cn\";\nimport type { ThemeName } from \"@/theme/theme-context\";\nimport { CraftModal } from \"@/components/craft-modal\";\nimport { CraftButton } from \"@/components/craft-button\";\nimport { CraftSubmitButton } from \"@/components/craft-submit-button\";\nimport {\n CraftFormField,\n type CraftFormFieldOption,\n type CraftFormFieldType,\n} from \"@/components/craft-form-field\";\n\nexport type CraftFormModalField<TValues extends FieldValues> = {\n name: Path<TValues>;\n label?: React.ReactNode;\n description?: React.ReactNode;\n type: CraftFormFieldType;\n placeholder?: string;\n options?: CraftFormFieldOption[];\n required?: boolean;\n disabled?: boolean;\n rules?: RegisterOptions<TValues>;\n defaultValue?: unknown;\n min?: number;\n max?: number;\n step?: number;\n rows?: number;\n accept?: string;\n minFiles?: number;\n maxFiles?: number;\n helpText?: React.ReactNode;\n fieldProps?: Record<string, unknown>;\n validate?: (value: unknown, values: TValues) => string | boolean | undefined;\n};\n\nexport type CraftFormModalProps<TValues extends FieldValues> = {\n title?: React.ReactNode;\n description?: React.ReactNode;\n fields: Array<CraftFormModalField<TValues>>;\n initialData?: Partial<TValues> | null;\n open?: boolean;\n defaultOpen?: boolean;\n onOpenChange?: (open: boolean) => void;\n trigger?: React.ReactNode;\n submitLabel?: React.ReactNode;\n cancelLabel?: React.ReactNode;\n resetLabel?: React.ReactNode;\n showReset?: boolean;\n showCancel?: boolean;\n tone?: ThemeName;\n className?: string;\n formClassName?: string;\n loading?: boolean;\n disableSubmitWhenInvalid?: boolean;\n closeOnSubmit?: boolean;\n closeOnCancel?: boolean;\n onSubmit: (values: TValues) => void | Promise<void>;\n onReset?: () => void;\n onCancel?: () => void;\n customValidation?: (values: TValues) => Partial<Record<Path<TValues>, string>>;\n};\n\nfunction defaultValueForField<TValues extends FieldValues>(\n field: CraftFormModalField<TValues>\n) {\n if (field.defaultValue !== undefined) return field.defaultValue;\n switch (field.type) {\n case \"checkbox\":\n case \"switch\":\n return false;\n case \"number\":\n case \"slider\":\n case \"range\":\n return field.min ?? 0;\n case \"multifile\":\n return [];\n case \"file\":\n return null;\n case \"multiselect\":\n return [];\n case \"radio\":\n return field.options?.[0]?.value ?? \"\";\n default:\n return \"\";\n }\n}\n\nfunction buildDefaultValues<TValues extends FieldValues>(\n fields: Array<CraftFormModalField<TValues>>,\n initialData?: Partial<TValues> | null\n): DefaultValues<TValues> {\n const values = {} as Record<string, unknown>;\n fields.forEach((field) => {\n const initialValue = initialData?.[field.name as keyof TValues];\n if (initialValue !== undefined && initialValue !== null) {\n values[field.name] = initialValue;\n } else {\n values[field.name] = defaultValueForField(field);\n }\n });\n return values as DefaultValues<TValues>;\n}\n\nfunction buildRules<TValues extends FieldValues>(\n field: CraftFormModalField<TValues>,\n getValues: () => TValues\n): RegisterOptions<TValues> {\n const rules: RegisterOptions<TValues> = { ...field.rules };\n const mergeValidate = (\n current: RegisterOptions<TValues>[\"validate\"],\n next: (value: unknown) => string | boolean | undefined\n ) => {\n if (!current) return next;\n if (typeof current === \"function\") {\n return (value: unknown): string | boolean | undefined => {\n const result = (current as (value: unknown, values: TValues) => string | boolean | undefined)(\n value,\n getValues()\n );\n if (result !== true) return result as string | undefined;\n return next(value);\n };\n }\n if (typeof current === \"object\") {\n return (value: unknown): string | boolean | undefined => {\n const entries = Object.entries(current);\n for (const [, validator] of entries) {\n const result = (validator as (value: unknown, values: TValues) => string | boolean | undefined)(\n value,\n getValues()\n );\n if (result !== true) return result as string | undefined;\n }\n return next(value);\n };\n }\n return next;\n };\n\n if (field.required && field.type !== \"hidden\") {\n if (field.type === \"checkbox\" || field.type === \"switch\") {\n rules.validate = mergeValidate(\n rules.validate,\n (value: unknown): string | boolean | undefined =>\n value ? true : `${String(field.label ?? field.name)} is required`\n );\n } else if (field.type === \"multiselect\") {\n rules.validate = mergeValidate(\n rules.validate,\n (value: unknown): string | boolean | undefined =>\n Array.isArray(value) && value.length > 0\n ? true\n : `${String(field.label ?? field.name)} is required`\n );\n } else if (field.type === \"file\") {\n rules.validate = mergeValidate(\n rules.validate,\n (value: unknown): string | boolean | undefined =>\n value instanceof FileList && value.length > 0\n ? true\n : `${String(field.label ?? field.name)} is required`\n );\n } else if (field.type === \"multifile\") {\n rules.validate = mergeValidate(\n rules.validate,\n (value: unknown): string | boolean | undefined =>\n Array.isArray(value) && value.length > 0\n ? true\n : `${String(field.label ?? field.name)} is required`\n );\n } else {\n rules.required = `${String(field.label ?? field.name)} is required`;\n }\n }\n\n if (field.min !== undefined) {\n rules.min = { value: field.min, message: `Min ${field.min}` };\n }\n if (field.max !== undefined) {\n rules.max = { value: field.max, message: `Max ${field.max}` };\n }\n\n if (field.type === \"email\") {\n rules.pattern = {\n value: /^[^\\s@]+@[^\\s@]+\\.[^\\s@]+$/,\n message: \"Please enter a valid email address\",\n };\n }\n\n if (field.type === \"url\") {\n rules.pattern = {\n value: /^https?:\\/\\/.+/,\n message: \"Please enter a valid URL\",\n };\n }\n\n if (field.validate) {\n rules.validate = mergeValidate(\n rules.validate,\n (value: unknown): string | boolean | undefined =>\n field.validate?.(value, getValues())\n );\n }\n\n return rules;\n}\n\nexport function CraftFormModal<TValues extends FieldValues>({\n title = \"Form\",\n description,\n fields,\n initialData = null,\n open,\n defaultOpen = false,\n onOpenChange,\n trigger,\n submitLabel = \"Submit\",\n cancelLabel = \"Cancel\",\n resetLabel = \"Reset\",\n showReset = true,\n showCancel = true,\n tone,\n className,\n formClassName,\n loading = false,\n disableSubmitWhenInvalid = true,\n closeOnSubmit = true,\n closeOnCancel = true,\n onSubmit,\n onReset,\n onCancel,\n customValidation,\n}: CraftFormModalProps<TValues>) {\n const [uncontrolledOpen, setUncontrolledOpen] = React.useState(defaultOpen);\n const isControlled = typeof open === \"boolean\";\n const isOpen = isControlled ? open : uncontrolledOpen;\n\n const setOpen = React.useCallback(\n (next: boolean) => {\n if (!isControlled) setUncontrolledOpen(next);\n onOpenChange?.(next);\n },\n [isControlled, onOpenChange]\n );\n\n const defaultValues = React.useMemo(\n () => buildDefaultValues(fields, initialData),\n [fields, initialData]\n );\n\n const form = useForm<TValues>({\n mode: \"onChange\",\n defaultValues,\n });\n\n const formId = React.useId();\n\n React.useEffect(() => {\n form.reset(defaultValues);\n }, [defaultValues, form]);\n\n const handleSubmit = form.handleSubmit(async (values) => {\n if (customValidation) {\n const customErrors = customValidation(values);\n if (customErrors && Object.keys(customErrors).length > 0) {\n Object.entries(customErrors).forEach(([key, message]) => {\n if (message) {\n form.setError(key as Path<TValues>, {\n type: \"custom\",\n message: String(message),\n });\n }\n });\n return;\n }\n }\n\n await onSubmit(values);\n if (closeOnSubmit) setOpen(false);\n });\n\n const handleReset = () => {\n form.reset(defaultValues);\n onReset?.();\n };\n\n const handleCancel = () => {\n onCancel?.();\n if (closeOnCancel) setOpen(false);\n };\n\n return (\n <FormProvider {...form}>\n <CraftModal\n open={isOpen}\n onOpenChange={setOpen}\n trigger={trigger}\n title={title}\n description={description}\n tone={tone}\n className={className}\n footer={\n <div className=\"flex flex-wrap items-center justify-end gap-3\">\n {showReset && (\n <CraftButton\n type=\"button\"\n variant=\"outline\"\n onClick={handleReset}\n disabled={loading}\n >\n {resetLabel}\n </CraftButton>\n )}\n {showCancel && (\n <CraftButton\n type=\"button\"\n variant=\"ghost\"\n onClick={handleCancel}\n disabled={loading}\n >\n {cancelLabel}\n </CraftButton>\n )}\n <CraftSubmitButton\n loading={loading}\n disableWhenInvalid={disableSubmitWhenInvalid}\n form={formId}\n >\n {submitLabel}\n </CraftSubmitButton>\n </div>\n }\n >\n <form\n id={formId}\n onSubmit={handleSubmit}\n className={cn(\"space-y-5\", formClassName)}\n >\n {fields.map((field) => (\n <div key={field.name} className=\"space-y-2\">\n {field.helpText && (\n <p className=\"text-xs text-[rgb(var(--nc-fg-muted))]\">\n {field.helpText}\n </p>\n )}\n <CraftFormField\n name={field.name}\n label={field.label}\n description={field.description}\n type={field.type}\n placeholder={field.placeholder}\n options={field.options}\n tone={tone}\n disabled={field.disabled || loading}\n rules={buildRules(field, form.getValues)}\n fieldProps={{\n min: field.min,\n max: field.max,\n step: field.step,\n rows: field.rows,\n accept: field.accept,\n multiple: field.type === \"multifile\",\n ...field.fieldProps,\n }}\n />\n </div>\n ))}\n </form>\n </CraftModal>\n </FormProvider>\n );\n}\n"],"mappings":"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","names":["_a"]}
|
|
1
|
+
{"version":3,"sources":["../../src/components/craft-form-modal.tsx"],"sourcesContent":["\"use client\";\n\nimport * as React from \"react\";\nimport {\n FormProvider,\n type DefaultValues,\n type FieldValues,\n type Path,\n type RegisterOptions,\n useForm,\n} from \"react-hook-form\";\n\nimport { cn } from \"@/utils/cn\";\nimport type { ThemeName } from \"@/theme/theme-context\";\nimport { CraftModal } from \"@/components/craft-modal\";\nimport { CraftButton } from \"@/components/craft-button\";\nimport {\n CraftFormField,\n type CraftFormFieldOption,\n type CraftFormFieldType,\n} from \"@/components/craft-form-field\";\n\nexport type CraftFormModalField<TValues extends FieldValues> = {\n name: Path<TValues>;\n label?: React.ReactNode;\n description?: React.ReactNode;\n type: CraftFormFieldType;\n placeholder?: string;\n options?: CraftFormFieldOption[];\n required?: boolean;\n disabled?: boolean;\n rules?: RegisterOptions<TValues>;\n defaultValue?: unknown;\n min?: number;\n max?: number;\n step?: number;\n rows?: number;\n accept?: string;\n minFiles?: number;\n maxFiles?: number;\n helpText?: React.ReactNode;\n fieldProps?: Record<string, unknown>;\n validate?: (value: unknown, values: TValues) => string | boolean | undefined;\n};\n\nexport type CraftFormModalProps<TValues extends FieldValues> = {\n title?: React.ReactNode;\n description?: React.ReactNode;\n fields: Array<CraftFormModalField<TValues>>;\n initialData?: Partial<TValues> | null;\n open?: boolean;\n defaultOpen?: boolean;\n onOpenChange?: (open: boolean) => void;\n trigger?: React.ReactNode;\n submitLabel?: React.ReactNode;\n cancelLabel?: React.ReactNode;\n resetLabel?: React.ReactNode;\n showReset?: boolean;\n showCancel?: boolean;\n tone?: ThemeName;\n className?: string;\n formClassName?: string;\n loading?: boolean;\n disableSubmitWhenInvalid?: boolean;\n closeOnSubmit?: boolean;\n closeOnCancel?: boolean;\n onSubmit: (values: TValues) => void | Promise<void>;\n onReset?: () => void;\n onCancel?: () => void;\n customValidation?: (values: TValues) => Partial<Record<Path<TValues>, string>>;\n};\n\nfunction defaultValueForField<TValues extends FieldValues>(\n field: CraftFormModalField<TValues>\n) {\n if (field.defaultValue !== undefined) return field.defaultValue;\n switch (field.type) {\n case \"checkbox\":\n case \"switch\":\n return false;\n case \"number\":\n case \"slider\":\n case \"range\":\n return field.min ?? 0;\n case \"multifile\":\n return [];\n case \"file\":\n return null;\n case \"multiselect\":\n return [];\n case \"radio\":\n return field.options?.[0]?.value ?? \"\";\n default:\n return \"\";\n }\n}\n\nfunction buildDefaultValues<TValues extends FieldValues>(\n fields: Array<CraftFormModalField<TValues>>,\n initialData?: Partial<TValues> | null\n): DefaultValues<TValues> {\n const values = {} as Record<string, unknown>;\n fields.forEach((field) => {\n const initialValue = initialData?.[field.name as keyof TValues];\n if (initialValue !== undefined && initialValue !== null) {\n values[field.name] = initialValue;\n } else {\n values[field.name] = defaultValueForField(field);\n }\n });\n return values as DefaultValues<TValues>;\n}\n\nfunction buildRules<TValues extends FieldValues>(\n field: CraftFormModalField<TValues>,\n getValues: () => TValues\n): RegisterOptions<TValues> {\n const rules: RegisterOptions<TValues> = { ...field.rules };\n const mergeValidate = (\n current: RegisterOptions<TValues>[\"validate\"],\n next: (value: unknown) => string | boolean | undefined\n ) => {\n if (!current) return next;\n if (typeof current === \"function\") {\n return (value: unknown): string | boolean | undefined => {\n const result = (current as (value: unknown, values: TValues) => string | boolean | undefined)(\n value,\n getValues()\n );\n if (result !== true) return result as string | undefined;\n return next(value);\n };\n }\n if (typeof current === \"object\") {\n return (value: unknown): string | boolean | undefined => {\n const entries = Object.entries(current);\n for (const [, validator] of entries) {\n const result = (validator as (value: unknown, values: TValues) => string | boolean | undefined)(\n value,\n getValues()\n );\n if (result !== true) return result as string | undefined;\n }\n return next(value);\n };\n }\n return next;\n };\n\n if (field.required && field.type !== \"hidden\") {\n if (field.type === \"checkbox\" || field.type === \"switch\") {\n rules.validate = mergeValidate(\n rules.validate,\n (value: unknown): string | boolean | undefined =>\n value ? true : `${String(field.label ?? field.name)} is required`\n );\n } else if (field.type === \"multiselect\") {\n rules.validate = mergeValidate(\n rules.validate,\n (value: unknown): string | boolean | undefined =>\n Array.isArray(value) && value.length > 0\n ? true\n : `${String(field.label ?? field.name)} is required`\n );\n } else if (field.type === \"file\") {\n rules.validate = mergeValidate(\n rules.validate,\n (value: unknown): string | boolean | undefined =>\n value instanceof FileList && value.length > 0\n ? true\n : `${String(field.label ?? field.name)} is required`\n );\n } else if (field.type === \"multifile\") {\n rules.validate = mergeValidate(\n rules.validate,\n (value: unknown): string | boolean | undefined =>\n Array.isArray(value) && value.length > 0\n ? true\n : `${String(field.label ?? field.name)} is required`\n );\n } else {\n rules.required = `${String(field.label ?? field.name)} is required`;\n }\n }\n\n if (field.min !== undefined) {\n rules.min = { value: field.min, message: `Min ${field.min}` };\n }\n if (field.max !== undefined) {\n rules.max = { value: field.max, message: `Max ${field.max}` };\n }\n\n if (field.type === \"email\") {\n rules.pattern = {\n value: /^[^\\s@]+@[^\\s@]+\\.[^\\s@]+$/,\n message: \"Please enter a valid email address\",\n };\n }\n\n if (field.type === \"url\") {\n rules.pattern = {\n value: /^https?:\\/\\/.+/,\n message: \"Please enter a valid URL\",\n };\n }\n\n if (field.validate) {\n rules.validate = mergeValidate(\n rules.validate,\n (value: unknown): string | boolean | undefined =>\n field.validate?.(value, getValues())\n );\n }\n\n return rules;\n}\n\nexport function CraftFormModal<TValues extends FieldValues>({\n title = \"Form\",\n description,\n fields,\n initialData = null,\n open,\n defaultOpen = false,\n onOpenChange,\n trigger,\n submitLabel = \"Submit\",\n cancelLabel = \"Cancel\",\n resetLabel = \"Reset\",\n showReset = true,\n showCancel = true,\n tone,\n className,\n formClassName,\n loading = false,\n disableSubmitWhenInvalid = true,\n closeOnSubmit = true,\n closeOnCancel = true,\n onSubmit,\n onReset,\n onCancel,\n customValidation,\n}: CraftFormModalProps<TValues>) {\n const [uncontrolledOpen, setUncontrolledOpen] = React.useState(defaultOpen);\n const isControlled = typeof open === \"boolean\";\n const isOpen = isControlled ? open : uncontrolledOpen;\n\n const setOpen = React.useCallback(\n (next: boolean) => {\n if (!isControlled) setUncontrolledOpen(next);\n onOpenChange?.(next);\n },\n [isControlled, onOpenChange]\n );\n\n const defaultValues = React.useMemo(\n () => buildDefaultValues(fields, initialData),\n [fields, initialData]\n );\n\n const form = useForm<TValues>({\n mode: \"onChange\",\n defaultValues,\n });\n\n const formId = React.useId();\n const isSubmitDisabled =\n disableSubmitWhenInvalid && !form.formState.isValid;\n\n React.useEffect(() => {\n form.reset(defaultValues);\n }, [defaultValues, form]);\n\n const handleSubmit = form.handleSubmit(async (values) => {\n if (customValidation) {\n const customErrors = customValidation(values);\n if (customErrors && Object.keys(customErrors).length > 0) {\n Object.entries(customErrors).forEach(([key, message]) => {\n if (message) {\n form.setError(key as Path<TValues>, {\n type: \"custom\",\n message: String(message),\n });\n }\n });\n return;\n }\n }\n\n await onSubmit(values);\n if (closeOnSubmit) setOpen(false);\n });\n\n const handleReset = () => {\n form.reset(defaultValues);\n onReset?.();\n };\n\n const handleCancel = () => {\n onCancel?.();\n if (closeOnCancel) setOpen(false);\n };\n\n return (\n <FormProvider {...form}>\n <CraftModal\n open={isOpen}\n onOpenChange={setOpen}\n trigger={trigger}\n title={title}\n description={description}\n tone={tone}\n className={className}\n footer={\n <div className=\"flex flex-wrap items-center justify-end gap-3\">\n {showReset && (\n <CraftButton\n type=\"button\"\n variant=\"outline\"\n onClick={handleReset}\n disabled={loading}\n >\n {resetLabel}\n </CraftButton>\n )}\n {showCancel && (\n <CraftButton\n type=\"button\"\n variant=\"ghost\"\n onClick={handleCancel}\n disabled={loading}\n >\n {cancelLabel}\n </CraftButton>\n )}\n <CraftButton\n type=\"submit\"\n variant=\"solid\"\n loading={loading}\n form={formId}\n disabled={loading || isSubmitDisabled}\n >\n {submitLabel}\n </CraftButton>\n </div>\n }\n >\n <form\n id={formId}\n onSubmit={handleSubmit}\n className={cn(\"space-y-5\", formClassName)}\n >\n {fields.map((field) => (\n <div key={field.name} className=\"space-y-2\">\n <CraftFormField\n name={field.name}\n label={field.label}\n description={field.description}\n helpText={field.helpText}\n required={field.required && !field.disabled}\n type={field.type}\n placeholder={field.placeholder}\n options={field.options}\n tone={tone}\n disabled={field.disabled || loading}\n rules={buildRules(field, form.getValues)}\n fieldProps={{\n min: field.min,\n max: field.max,\n step: field.step,\n rows: field.rows,\n accept: field.accept,\n multiple: field.type === \"multifile\",\n ...field.fieldProps,\n }}\n />\n </div>\n ))}\n </form>\n </CraftModal>\n </FormProvider>\n );\n}\n"],"mappings":"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","names":["_a"]}
|
|
@@ -8,7 +8,6 @@ import {
|
|
|
8
8
|
import { cn } from "../utils/cn";
|
|
9
9
|
import { CraftModal } from "../components/craft-modal";
|
|
10
10
|
import { CraftButton } from "../components/craft-button";
|
|
11
|
-
import { CraftSubmitButton } from "../components/craft-submit-button";
|
|
12
11
|
import {
|
|
13
12
|
CraftFormField
|
|
14
13
|
} from "../components/craft-form-field";
|
|
@@ -188,6 +187,7 @@ function CraftFormModal({
|
|
|
188
187
|
defaultValues
|
|
189
188
|
});
|
|
190
189
|
const formId = React.useId();
|
|
190
|
+
const isSubmitDisabled = disableSubmitWhenInvalid && !form.formState.isValid;
|
|
191
191
|
React.useEffect(() => {
|
|
192
192
|
form.reset(defaultValues);
|
|
193
193
|
}, [defaultValues, form]);
|
|
@@ -249,11 +249,13 @@ function CraftFormModal({
|
|
|
249
249
|
}
|
|
250
250
|
),
|
|
251
251
|
/* @__PURE__ */ jsx(
|
|
252
|
-
|
|
252
|
+
CraftButton,
|
|
253
253
|
{
|
|
254
|
+
type: "submit",
|
|
255
|
+
variant: "solid",
|
|
254
256
|
loading,
|
|
255
|
-
disableWhenInvalid: disableSubmitWhenInvalid,
|
|
256
257
|
form: formId,
|
|
258
|
+
disabled: loading || isSubmitDisabled,
|
|
257
259
|
children: submitLabel
|
|
258
260
|
}
|
|
259
261
|
)
|
|
@@ -264,32 +266,31 @@ function CraftFormModal({
|
|
|
264
266
|
id: formId,
|
|
265
267
|
onSubmit: handleSubmit,
|
|
266
268
|
className: cn("space-y-5", formClassName),
|
|
267
|
-
children: fields.map((field) => /* @__PURE__ */
|
|
268
|
-
|
|
269
|
-
|
|
270
|
-
|
|
271
|
-
|
|
272
|
-
|
|
273
|
-
|
|
274
|
-
|
|
275
|
-
|
|
276
|
-
|
|
277
|
-
|
|
278
|
-
|
|
279
|
-
|
|
280
|
-
|
|
281
|
-
|
|
282
|
-
|
|
283
|
-
|
|
284
|
-
|
|
285
|
-
|
|
286
|
-
|
|
287
|
-
|
|
288
|
-
|
|
289
|
-
}
|
|
269
|
+
children: fields.map((field) => /* @__PURE__ */ jsx("div", { className: "space-y-2", children: /* @__PURE__ */ jsx(
|
|
270
|
+
CraftFormField,
|
|
271
|
+
{
|
|
272
|
+
name: field.name,
|
|
273
|
+
label: field.label,
|
|
274
|
+
description: field.description,
|
|
275
|
+
helpText: field.helpText,
|
|
276
|
+
required: field.required && !field.disabled,
|
|
277
|
+
type: field.type,
|
|
278
|
+
placeholder: field.placeholder,
|
|
279
|
+
options: field.options,
|
|
280
|
+
tone,
|
|
281
|
+
disabled: field.disabled || loading,
|
|
282
|
+
rules: buildRules(field, form.getValues),
|
|
283
|
+
fieldProps: {
|
|
284
|
+
min: field.min,
|
|
285
|
+
max: field.max,
|
|
286
|
+
step: field.step,
|
|
287
|
+
rows: field.rows,
|
|
288
|
+
accept: field.accept,
|
|
289
|
+
multiple: field.type === "multifile",
|
|
290
|
+
...field.fieldProps
|
|
290
291
|
}
|
|
291
|
-
|
|
292
|
-
|
|
292
|
+
}
|
|
293
|
+
) }, field.name))
|
|
293
294
|
}
|
|
294
295
|
)
|
|
295
296
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/components/craft-form-modal.tsx"],"sourcesContent":["\"use client\";\n\nimport * as React from \"react\";\nimport {\n FormProvider,\n type DefaultValues,\n type FieldValues,\n type Path,\n type RegisterOptions,\n useForm,\n} from \"react-hook-form\";\n\nimport { cn } from \"@/utils/cn\";\nimport type { ThemeName } from \"@/theme/theme-context\";\nimport { CraftModal } from \"@/components/craft-modal\";\nimport { CraftButton } from \"@/components/craft-button\";\nimport { CraftSubmitButton } from \"@/components/craft-submit-button\";\nimport {\n CraftFormField,\n type CraftFormFieldOption,\n type CraftFormFieldType,\n} from \"@/components/craft-form-field\";\n\nexport type CraftFormModalField<TValues extends FieldValues> = {\n name: Path<TValues>;\n label?: React.ReactNode;\n description?: React.ReactNode;\n type: CraftFormFieldType;\n placeholder?: string;\n options?: CraftFormFieldOption[];\n required?: boolean;\n disabled?: boolean;\n rules?: RegisterOptions<TValues>;\n defaultValue?: unknown;\n min?: number;\n max?: number;\n step?: number;\n rows?: number;\n accept?: string;\n minFiles?: number;\n maxFiles?: number;\n helpText?: React.ReactNode;\n fieldProps?: Record<string, unknown>;\n validate?: (value: unknown, values: TValues) => string | boolean | undefined;\n};\n\nexport type CraftFormModalProps<TValues extends FieldValues> = {\n title?: React.ReactNode;\n description?: React.ReactNode;\n fields: Array<CraftFormModalField<TValues>>;\n initialData?: Partial<TValues> | null;\n open?: boolean;\n defaultOpen?: boolean;\n onOpenChange?: (open: boolean) => void;\n trigger?: React.ReactNode;\n submitLabel?: React.ReactNode;\n cancelLabel?: React.ReactNode;\n resetLabel?: React.ReactNode;\n showReset?: boolean;\n showCancel?: boolean;\n tone?: ThemeName;\n className?: string;\n formClassName?: string;\n loading?: boolean;\n disableSubmitWhenInvalid?: boolean;\n closeOnSubmit?: boolean;\n closeOnCancel?: boolean;\n onSubmit: (values: TValues) => void | Promise<void>;\n onReset?: () => void;\n onCancel?: () => void;\n customValidation?: (values: TValues) => Partial<Record<Path<TValues>, string>>;\n};\n\nfunction defaultValueForField<TValues extends FieldValues>(\n field: CraftFormModalField<TValues>\n) {\n if (field.defaultValue !== undefined) return field.defaultValue;\n switch (field.type) {\n case \"checkbox\":\n case \"switch\":\n return false;\n case \"number\":\n case \"slider\":\n case \"range\":\n return field.min ?? 0;\n case \"multifile\":\n return [];\n case \"file\":\n return null;\n case \"multiselect\":\n return [];\n case \"radio\":\n return field.options?.[0]?.value ?? \"\";\n default:\n return \"\";\n }\n}\n\nfunction buildDefaultValues<TValues extends FieldValues>(\n fields: Array<CraftFormModalField<TValues>>,\n initialData?: Partial<TValues> | null\n): DefaultValues<TValues> {\n const values = {} as Record<string, unknown>;\n fields.forEach((field) => {\n const initialValue = initialData?.[field.name as keyof TValues];\n if (initialValue !== undefined && initialValue !== null) {\n values[field.name] = initialValue;\n } else {\n values[field.name] = defaultValueForField(field);\n }\n });\n return values as DefaultValues<TValues>;\n}\n\nfunction buildRules<TValues extends FieldValues>(\n field: CraftFormModalField<TValues>,\n getValues: () => TValues\n): RegisterOptions<TValues> {\n const rules: RegisterOptions<TValues> = { ...field.rules };\n const mergeValidate = (\n current: RegisterOptions<TValues>[\"validate\"],\n next: (value: unknown) => string | boolean | undefined\n ) => {\n if (!current) return next;\n if (typeof current === \"function\") {\n return (value: unknown): string | boolean | undefined => {\n const result = (current as (value: unknown, values: TValues) => string | boolean | undefined)(\n value,\n getValues()\n );\n if (result !== true) return result as string | undefined;\n return next(value);\n };\n }\n if (typeof current === \"object\") {\n return (value: unknown): string | boolean | undefined => {\n const entries = Object.entries(current);\n for (const [, validator] of entries) {\n const result = (validator as (value: unknown, values: TValues) => string | boolean | undefined)(\n value,\n getValues()\n );\n if (result !== true) return result as string | undefined;\n }\n return next(value);\n };\n }\n return next;\n };\n\n if (field.required && field.type !== \"hidden\") {\n if (field.type === \"checkbox\" || field.type === \"switch\") {\n rules.validate = mergeValidate(\n rules.validate,\n (value: unknown): string | boolean | undefined =>\n value ? true : `${String(field.label ?? field.name)} is required`\n );\n } else if (field.type === \"multiselect\") {\n rules.validate = mergeValidate(\n rules.validate,\n (value: unknown): string | boolean | undefined =>\n Array.isArray(value) && value.length > 0\n ? true\n : `${String(field.label ?? field.name)} is required`\n );\n } else if (field.type === \"file\") {\n rules.validate = mergeValidate(\n rules.validate,\n (value: unknown): string | boolean | undefined =>\n value instanceof FileList && value.length > 0\n ? true\n : `${String(field.label ?? field.name)} is required`\n );\n } else if (field.type === \"multifile\") {\n rules.validate = mergeValidate(\n rules.validate,\n (value: unknown): string | boolean | undefined =>\n Array.isArray(value) && value.length > 0\n ? true\n : `${String(field.label ?? field.name)} is required`\n );\n } else {\n rules.required = `${String(field.label ?? field.name)} is required`;\n }\n }\n\n if (field.min !== undefined) {\n rules.min = { value: field.min, message: `Min ${field.min}` };\n }\n if (field.max !== undefined) {\n rules.max = { value: field.max, message: `Max ${field.max}` };\n }\n\n if (field.type === \"email\") {\n rules.pattern = {\n value: /^[^\\s@]+@[^\\s@]+\\.[^\\s@]+$/,\n message: \"Please enter a valid email address\",\n };\n }\n\n if (field.type === \"url\") {\n rules.pattern = {\n value: /^https?:\\/\\/.+/,\n message: \"Please enter a valid URL\",\n };\n }\n\n if (field.validate) {\n rules.validate = mergeValidate(\n rules.validate,\n (value: unknown): string | boolean | undefined =>\n field.validate?.(value, getValues())\n );\n }\n\n return rules;\n}\n\nexport function CraftFormModal<TValues extends FieldValues>({\n title = \"Form\",\n description,\n fields,\n initialData = null,\n open,\n defaultOpen = false,\n onOpenChange,\n trigger,\n submitLabel = \"Submit\",\n cancelLabel = \"Cancel\",\n resetLabel = \"Reset\",\n showReset = true,\n showCancel = true,\n tone,\n className,\n formClassName,\n loading = false,\n disableSubmitWhenInvalid = true,\n closeOnSubmit = true,\n closeOnCancel = true,\n onSubmit,\n onReset,\n onCancel,\n customValidation,\n}: CraftFormModalProps<TValues>) {\n const [uncontrolledOpen, setUncontrolledOpen] = React.useState(defaultOpen);\n const isControlled = typeof open === \"boolean\";\n const isOpen = isControlled ? open : uncontrolledOpen;\n\n const setOpen = React.useCallback(\n (next: boolean) => {\n if (!isControlled) setUncontrolledOpen(next);\n onOpenChange?.(next);\n },\n [isControlled, onOpenChange]\n );\n\n const defaultValues = React.useMemo(\n () => buildDefaultValues(fields, initialData),\n [fields, initialData]\n );\n\n const form = useForm<TValues>({\n mode: \"onChange\",\n defaultValues,\n });\n\n const formId = React.useId();\n\n React.useEffect(() => {\n form.reset(defaultValues);\n }, [defaultValues, form]);\n\n const handleSubmit = form.handleSubmit(async (values) => {\n if (customValidation) {\n const customErrors = customValidation(values);\n if (customErrors && Object.keys(customErrors).length > 0) {\n Object.entries(customErrors).forEach(([key, message]) => {\n if (message) {\n form.setError(key as Path<TValues>, {\n type: \"custom\",\n message: String(message),\n });\n }\n });\n return;\n }\n }\n\n await onSubmit(values);\n if (closeOnSubmit) setOpen(false);\n });\n\n const handleReset = () => {\n form.reset(defaultValues);\n onReset?.();\n };\n\n const handleCancel = () => {\n onCancel?.();\n if (closeOnCancel) setOpen(false);\n };\n\n return (\n <FormProvider {...form}>\n <CraftModal\n open={isOpen}\n onOpenChange={setOpen}\n trigger={trigger}\n title={title}\n description={description}\n tone={tone}\n className={className}\n footer={\n <div className=\"flex flex-wrap items-center justify-end gap-3\">\n {showReset && (\n <CraftButton\n type=\"button\"\n variant=\"outline\"\n onClick={handleReset}\n disabled={loading}\n >\n {resetLabel}\n </CraftButton>\n )}\n {showCancel && (\n <CraftButton\n type=\"button\"\n variant=\"ghost\"\n onClick={handleCancel}\n disabled={loading}\n >\n {cancelLabel}\n </CraftButton>\n )}\n <CraftSubmitButton\n loading={loading}\n disableWhenInvalid={disableSubmitWhenInvalid}\n form={formId}\n >\n {submitLabel}\n </CraftSubmitButton>\n </div>\n }\n >\n <form\n id={formId}\n onSubmit={handleSubmit}\n className={cn(\"space-y-5\", formClassName)}\n >\n {fields.map((field) => (\n <div key={field.name} className=\"space-y-2\">\n {field.helpText && (\n <p className=\"text-xs text-[rgb(var(--nc-fg-muted))]\">\n {field.helpText}\n </p>\n )}\n <CraftFormField\n name={field.name}\n label={field.label}\n description={field.description}\n type={field.type}\n placeholder={field.placeholder}\n options={field.options}\n tone={tone}\n disabled={field.disabled || loading}\n rules={buildRules(field, form.getValues)}\n fieldProps={{\n min: field.min,\n max: field.max,\n step: field.step,\n rows: field.rows,\n accept: field.accept,\n multiple: field.type === \"multifile\",\n ...field.fieldProps,\n }}\n />\n </div>\n ))}\n </form>\n </CraftModal>\n </FormProvider>\n );\n}\n"],"mappings":"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","names":["_a"]}
|
|
1
|
+
{"version":3,"sources":["../../src/components/craft-form-modal.tsx"],"sourcesContent":["\"use client\";\n\nimport * as React from \"react\";\nimport {\n FormProvider,\n type DefaultValues,\n type FieldValues,\n type Path,\n type RegisterOptions,\n useForm,\n} from \"react-hook-form\";\n\nimport { cn } from \"@/utils/cn\";\nimport type { ThemeName } from \"@/theme/theme-context\";\nimport { CraftModal } from \"@/components/craft-modal\";\nimport { CraftButton } from \"@/components/craft-button\";\nimport {\n CraftFormField,\n type CraftFormFieldOption,\n type CraftFormFieldType,\n} from \"@/components/craft-form-field\";\n\nexport type CraftFormModalField<TValues extends FieldValues> = {\n name: Path<TValues>;\n label?: React.ReactNode;\n description?: React.ReactNode;\n type: CraftFormFieldType;\n placeholder?: string;\n options?: CraftFormFieldOption[];\n required?: boolean;\n disabled?: boolean;\n rules?: RegisterOptions<TValues>;\n defaultValue?: unknown;\n min?: number;\n max?: number;\n step?: number;\n rows?: number;\n accept?: string;\n minFiles?: number;\n maxFiles?: number;\n helpText?: React.ReactNode;\n fieldProps?: Record<string, unknown>;\n validate?: (value: unknown, values: TValues) => string | boolean | undefined;\n};\n\nexport type CraftFormModalProps<TValues extends FieldValues> = {\n title?: React.ReactNode;\n description?: React.ReactNode;\n fields: Array<CraftFormModalField<TValues>>;\n initialData?: Partial<TValues> | null;\n open?: boolean;\n defaultOpen?: boolean;\n onOpenChange?: (open: boolean) => void;\n trigger?: React.ReactNode;\n submitLabel?: React.ReactNode;\n cancelLabel?: React.ReactNode;\n resetLabel?: React.ReactNode;\n showReset?: boolean;\n showCancel?: boolean;\n tone?: ThemeName;\n className?: string;\n formClassName?: string;\n loading?: boolean;\n disableSubmitWhenInvalid?: boolean;\n closeOnSubmit?: boolean;\n closeOnCancel?: boolean;\n onSubmit: (values: TValues) => void | Promise<void>;\n onReset?: () => void;\n onCancel?: () => void;\n customValidation?: (values: TValues) => Partial<Record<Path<TValues>, string>>;\n};\n\nfunction defaultValueForField<TValues extends FieldValues>(\n field: CraftFormModalField<TValues>\n) {\n if (field.defaultValue !== undefined) return field.defaultValue;\n switch (field.type) {\n case \"checkbox\":\n case \"switch\":\n return false;\n case \"number\":\n case \"slider\":\n case \"range\":\n return field.min ?? 0;\n case \"multifile\":\n return [];\n case \"file\":\n return null;\n case \"multiselect\":\n return [];\n case \"radio\":\n return field.options?.[0]?.value ?? \"\";\n default:\n return \"\";\n }\n}\n\nfunction buildDefaultValues<TValues extends FieldValues>(\n fields: Array<CraftFormModalField<TValues>>,\n initialData?: Partial<TValues> | null\n): DefaultValues<TValues> {\n const values = {} as Record<string, unknown>;\n fields.forEach((field) => {\n const initialValue = initialData?.[field.name as keyof TValues];\n if (initialValue !== undefined && initialValue !== null) {\n values[field.name] = initialValue;\n } else {\n values[field.name] = defaultValueForField(field);\n }\n });\n return values as DefaultValues<TValues>;\n}\n\nfunction buildRules<TValues extends FieldValues>(\n field: CraftFormModalField<TValues>,\n getValues: () => TValues\n): RegisterOptions<TValues> {\n const rules: RegisterOptions<TValues> = { ...field.rules };\n const mergeValidate = (\n current: RegisterOptions<TValues>[\"validate\"],\n next: (value: unknown) => string | boolean | undefined\n ) => {\n if (!current) return next;\n if (typeof current === \"function\") {\n return (value: unknown): string | boolean | undefined => {\n const result = (current as (value: unknown, values: TValues) => string | boolean | undefined)(\n value,\n getValues()\n );\n if (result !== true) return result as string | undefined;\n return next(value);\n };\n }\n if (typeof current === \"object\") {\n return (value: unknown): string | boolean | undefined => {\n const entries = Object.entries(current);\n for (const [, validator] of entries) {\n const result = (validator as (value: unknown, values: TValues) => string | boolean | undefined)(\n value,\n getValues()\n );\n if (result !== true) return result as string | undefined;\n }\n return next(value);\n };\n }\n return next;\n };\n\n if (field.required && field.type !== \"hidden\") {\n if (field.type === \"checkbox\" || field.type === \"switch\") {\n rules.validate = mergeValidate(\n rules.validate,\n (value: unknown): string | boolean | undefined =>\n value ? true : `${String(field.label ?? field.name)} is required`\n );\n } else if (field.type === \"multiselect\") {\n rules.validate = mergeValidate(\n rules.validate,\n (value: unknown): string | boolean | undefined =>\n Array.isArray(value) && value.length > 0\n ? true\n : `${String(field.label ?? field.name)} is required`\n );\n } else if (field.type === \"file\") {\n rules.validate = mergeValidate(\n rules.validate,\n (value: unknown): string | boolean | undefined =>\n value instanceof FileList && value.length > 0\n ? true\n : `${String(field.label ?? field.name)} is required`\n );\n } else if (field.type === \"multifile\") {\n rules.validate = mergeValidate(\n rules.validate,\n (value: unknown): string | boolean | undefined =>\n Array.isArray(value) && value.length > 0\n ? true\n : `${String(field.label ?? field.name)} is required`\n );\n } else {\n rules.required = `${String(field.label ?? field.name)} is required`;\n }\n }\n\n if (field.min !== undefined) {\n rules.min = { value: field.min, message: `Min ${field.min}` };\n }\n if (field.max !== undefined) {\n rules.max = { value: field.max, message: `Max ${field.max}` };\n }\n\n if (field.type === \"email\") {\n rules.pattern = {\n value: /^[^\\s@]+@[^\\s@]+\\.[^\\s@]+$/,\n message: \"Please enter a valid email address\",\n };\n }\n\n if (field.type === \"url\") {\n rules.pattern = {\n value: /^https?:\\/\\/.+/,\n message: \"Please enter a valid URL\",\n };\n }\n\n if (field.validate) {\n rules.validate = mergeValidate(\n rules.validate,\n (value: unknown): string | boolean | undefined =>\n field.validate?.(value, getValues())\n );\n }\n\n return rules;\n}\n\nexport function CraftFormModal<TValues extends FieldValues>({\n title = \"Form\",\n description,\n fields,\n initialData = null,\n open,\n defaultOpen = false,\n onOpenChange,\n trigger,\n submitLabel = \"Submit\",\n cancelLabel = \"Cancel\",\n resetLabel = \"Reset\",\n showReset = true,\n showCancel = true,\n tone,\n className,\n formClassName,\n loading = false,\n disableSubmitWhenInvalid = true,\n closeOnSubmit = true,\n closeOnCancel = true,\n onSubmit,\n onReset,\n onCancel,\n customValidation,\n}: CraftFormModalProps<TValues>) {\n const [uncontrolledOpen, setUncontrolledOpen] = React.useState(defaultOpen);\n const isControlled = typeof open === \"boolean\";\n const isOpen = isControlled ? open : uncontrolledOpen;\n\n const setOpen = React.useCallback(\n (next: boolean) => {\n if (!isControlled) setUncontrolledOpen(next);\n onOpenChange?.(next);\n },\n [isControlled, onOpenChange]\n );\n\n const defaultValues = React.useMemo(\n () => buildDefaultValues(fields, initialData),\n [fields, initialData]\n );\n\n const form = useForm<TValues>({\n mode: \"onChange\",\n defaultValues,\n });\n\n const formId = React.useId();\n const isSubmitDisabled =\n disableSubmitWhenInvalid && !form.formState.isValid;\n\n React.useEffect(() => {\n form.reset(defaultValues);\n }, [defaultValues, form]);\n\n const handleSubmit = form.handleSubmit(async (values) => {\n if (customValidation) {\n const customErrors = customValidation(values);\n if (customErrors && Object.keys(customErrors).length > 0) {\n Object.entries(customErrors).forEach(([key, message]) => {\n if (message) {\n form.setError(key as Path<TValues>, {\n type: \"custom\",\n message: String(message),\n });\n }\n });\n return;\n }\n }\n\n await onSubmit(values);\n if (closeOnSubmit) setOpen(false);\n });\n\n const handleReset = () => {\n form.reset(defaultValues);\n onReset?.();\n };\n\n const handleCancel = () => {\n onCancel?.();\n if (closeOnCancel) setOpen(false);\n };\n\n return (\n <FormProvider {...form}>\n <CraftModal\n open={isOpen}\n onOpenChange={setOpen}\n trigger={trigger}\n title={title}\n description={description}\n tone={tone}\n className={className}\n footer={\n <div className=\"flex flex-wrap items-center justify-end gap-3\">\n {showReset && (\n <CraftButton\n type=\"button\"\n variant=\"outline\"\n onClick={handleReset}\n disabled={loading}\n >\n {resetLabel}\n </CraftButton>\n )}\n {showCancel && (\n <CraftButton\n type=\"button\"\n variant=\"ghost\"\n onClick={handleCancel}\n disabled={loading}\n >\n {cancelLabel}\n </CraftButton>\n )}\n <CraftButton\n type=\"submit\"\n variant=\"solid\"\n loading={loading}\n form={formId}\n disabled={loading || isSubmitDisabled}\n >\n {submitLabel}\n </CraftButton>\n </div>\n }\n >\n <form\n id={formId}\n onSubmit={handleSubmit}\n className={cn(\"space-y-5\", formClassName)}\n >\n {fields.map((field) => (\n <div key={field.name} className=\"space-y-2\">\n <CraftFormField\n name={field.name}\n label={field.label}\n description={field.description}\n helpText={field.helpText}\n required={field.required && !field.disabled}\n type={field.type}\n placeholder={field.placeholder}\n options={field.options}\n tone={tone}\n disabled={field.disabled || loading}\n rules={buildRules(field, form.getValues)}\n fieldProps={{\n min: field.min,\n max: field.max,\n step: field.step,\n rows: field.rows,\n accept: field.accept,\n multiple: field.type === \"multifile\",\n ...field.fieldProps,\n }}\n />\n </div>\n ))}\n </form>\n </CraftModal>\n </FormProvider>\n );\n}\n"],"mappings":"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","names":["_a"]}
|