@object-ui/plugin-form 5.1.1 → 5.2.1
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/CHANGELOG.md +36 -0
- package/dist/index.js +205 -202
- package/dist/index.umd.cjs +1 -1
- package/package.json +8 -8
package/dist/index.js
CHANGED
|
@@ -4,10 +4,10 @@ import { SchemaRenderer as c, useSafeFieldLabel as l } from "@object-ui/react";
|
|
|
4
4
|
import { buildValidationRules as u, evaluateCondition as d, formatFileSize as f, mapFieldTypeToFormType as p } from "@object-ui/fields";
|
|
5
5
|
import { Button as m, Card as h, CardContent as g, CardDescription as _, CardHeader as v, CardTitle as y, Dialog as b, DialogDescription as x, DialogHeader as S, DialogTitle as C, MobileDialogContent as w, ResizableHandle as T, ResizablePanel as E, ResizablePanelGroup as D, Sheet as O, SheetContent as k, SheetDescription as A, SheetHeader as j, SheetTitle as M, Skeleton as N, Tabs as P, TabsContent as F, TabsList as I, TabsTrigger as L, cn as R, useIsMobile as z } from "@object-ui/components";
|
|
6
6
|
import { usePermissions as B } from "@object-ui/permissions";
|
|
7
|
-
import { Check as ee, CheckCircle2 as V, ChevronDown as H, ChevronLeft as te, ChevronRight as U, Loader2 as
|
|
8
|
-
import { Fragment as
|
|
7
|
+
import { Check as ee, CheckCircle2 as V, ChevronDown as H, ChevronLeft as te, ChevronRight as U, Loader2 as W, Lock as G, ShieldCheck as K } from "lucide-react";
|
|
8
|
+
import { Fragment as q, jsx as J, jsxs as Y } from "react/jsx-runtime";
|
|
9
9
|
//#region src/FormSection.tsx
|
|
10
|
-
var
|
|
10
|
+
var X = ({ label: e, description: t, collapsible: n = !1, collapsed: r = !1, columns: i = 1, children: a, className: s, gridClassName: c, showBorder: l }) => {
|
|
11
11
|
let [u, d] = o(r), f = {
|
|
12
12
|
1: "grid-cols-1",
|
|
13
13
|
2: "grid-cols-1 md:grid-cols-2",
|
|
@@ -15,53 +15,53 @@ var Y = ({ label: e, description: t, collapsible: n = !1, collapsed: r = !1, col
|
|
|
15
15
|
4: "grid-cols-1 md:grid-cols-2 lg:grid-cols-4"
|
|
16
16
|
}, p = () => {
|
|
17
17
|
n && d(!u);
|
|
18
|
-
}, m = l ?? !!e, b = e || t ? /* @__PURE__ */
|
|
18
|
+
}, m = l ?? !!e, b = e || t ? /* @__PURE__ */ Y("div", {
|
|
19
19
|
className: R("flex items-start gap-2", !m && "mb-4", n && "cursor-pointer select-none"),
|
|
20
20
|
onClick: p,
|
|
21
21
|
role: n ? "button" : void 0,
|
|
22
22
|
"aria-expanded": n ? !u : void 0,
|
|
23
|
-
children: [n && /* @__PURE__ */
|
|
23
|
+
children: [n && /* @__PURE__ */ J("span", {
|
|
24
24
|
className: "mt-0.5 text-muted-foreground",
|
|
25
|
-
children:
|
|
26
|
-
}), /* @__PURE__ */
|
|
25
|
+
children: J(u ? U : H, { className: "h-4 w-4" })
|
|
26
|
+
}), /* @__PURE__ */ Y("div", {
|
|
27
27
|
className: "flex-1",
|
|
28
|
-
children: [e && /* @__PURE__ */
|
|
28
|
+
children: [e && /* @__PURE__ */ J("h3", {
|
|
29
29
|
className: "text-base font-semibold text-foreground",
|
|
30
30
|
children: e
|
|
31
|
-
}), t && /* @__PURE__ */
|
|
31
|
+
}), t && /* @__PURE__ */ J("p", {
|
|
32
32
|
className: "text-sm text-muted-foreground mt-0.5",
|
|
33
33
|
children: t
|
|
34
34
|
})]
|
|
35
35
|
})]
|
|
36
|
-
}) : null, x = u ? null : /* @__PURE__ */
|
|
36
|
+
}) : null, x = u ? null : /* @__PURE__ */ J("div", {
|
|
37
37
|
className: R("grid gap-4", c || f[i]),
|
|
38
38
|
children: a
|
|
39
39
|
});
|
|
40
|
-
return m ? /* @__PURE__ */
|
|
40
|
+
return m ? /* @__PURE__ */ Y(h, {
|
|
41
41
|
className: R("form-section", s),
|
|
42
|
-
children: [b && /* @__PURE__ */
|
|
42
|
+
children: [b && /* @__PURE__ */ Y(v, {
|
|
43
43
|
className: "pb-3",
|
|
44
44
|
children: [
|
|
45
|
-
e && /* @__PURE__ */
|
|
45
|
+
e && /* @__PURE__ */ J(y, {
|
|
46
46
|
className: "text-base",
|
|
47
47
|
children: e
|
|
48
48
|
}),
|
|
49
|
-
t && /* @__PURE__ */
|
|
50
|
-
n && /* @__PURE__ */
|
|
49
|
+
t && /* @__PURE__ */ J(_, { children: t }),
|
|
50
|
+
n && /* @__PURE__ */ J("button", {
|
|
51
51
|
type: "button",
|
|
52
52
|
className: "absolute right-4 top-4 text-muted-foreground",
|
|
53
53
|
onClick: p,
|
|
54
54
|
"aria-expanded": !u,
|
|
55
55
|
"aria-label": u ? "Expand section" : "Collapse section",
|
|
56
|
-
children:
|
|
56
|
+
children: J(u ? U : H, { className: "h-4 w-4" })
|
|
57
57
|
})
|
|
58
58
|
]
|
|
59
|
-
}), x && /* @__PURE__ */
|
|
60
|
-
}) : /* @__PURE__ */
|
|
59
|
+
}), x && /* @__PURE__ */ J(g, { children: x })]
|
|
60
|
+
}) : /* @__PURE__ */ Y("div", {
|
|
61
61
|
className: R("form-section", s),
|
|
62
62
|
children: [b, x]
|
|
63
63
|
});
|
|
64
|
-
},
|
|
64
|
+
}, Z = ({ schema: n, dataSource: r, className: i }) => {
|
|
65
65
|
let { fieldLabel: a } = l(), [s, d] = o(null), [f, m] = o({}), [h, g] = o(!0), [_, v] = o(null), [y, b] = o(n.defaultTab || n.sections[0]?.name || n.sections[0]?.label || "tab-0");
|
|
66
66
|
e.useEffect(() => {
|
|
67
67
|
(async () => {
|
|
@@ -140,19 +140,19 @@ var Y = ({ label: e, description: t, collapsible: n = !1, collapsed: r = !1, col
|
|
|
140
140
|
}, [n, r]), C = t(() => {
|
|
141
141
|
n.onCancel && n.onCancel();
|
|
142
142
|
}, [n]), w = (e, t) => e.name || e.label || `tab-${t}`;
|
|
143
|
-
if (_) return /* @__PURE__ */
|
|
143
|
+
if (_) return /* @__PURE__ */ Y("div", {
|
|
144
144
|
className: "p-4 border border-red-300 bg-red-50 rounded-md",
|
|
145
|
-
children: [/* @__PURE__ */
|
|
145
|
+
children: [/* @__PURE__ */ J("h3", {
|
|
146
146
|
className: "text-red-800 font-semibold",
|
|
147
147
|
children: "Error loading form"
|
|
148
|
-
}), /* @__PURE__ */
|
|
148
|
+
}), /* @__PURE__ */ J("p", {
|
|
149
149
|
className: "text-red-600 text-sm mt-1",
|
|
150
150
|
children: _.message
|
|
151
151
|
})]
|
|
152
152
|
});
|
|
153
|
-
if (h) return /* @__PURE__ */
|
|
153
|
+
if (h) return /* @__PURE__ */ Y("div", {
|
|
154
154
|
className: "p-8 text-center",
|
|
155
|
-
children: [/* @__PURE__ */
|
|
155
|
+
children: [/* @__PURE__ */ J("div", { className: "inline-block animate-spin rounded-full h-8 w-8 border-b-2 border-gray-900" }), /* @__PURE__ */ J("p", {
|
|
156
156
|
className: "mt-2 text-sm text-gray-600",
|
|
157
157
|
children: "Loading form..."
|
|
158
158
|
})]
|
|
@@ -169,29 +169,29 @@ var Y = ({ label: e, description: t, collapsible: n = !1, collapsed: r = !1, col
|
|
|
169
169
|
onSubmit: S,
|
|
170
170
|
onCancel: C
|
|
171
171
|
}, E = n.tabPosition === "left" || n.tabPosition === "right";
|
|
172
|
-
return /* @__PURE__ */
|
|
172
|
+
return /* @__PURE__ */ J("div", {
|
|
173
173
|
className: R("w-full", i, n.className),
|
|
174
|
-
children: /* @__PURE__ */
|
|
174
|
+
children: /* @__PURE__ */ Y(P, {
|
|
175
175
|
value: y,
|
|
176
176
|
onValueChange: b,
|
|
177
177
|
orientation: E ? "vertical" : "horizontal",
|
|
178
178
|
className: R(E && "flex gap-4"),
|
|
179
|
-
children: [/* @__PURE__ */
|
|
179
|
+
children: [/* @__PURE__ */ J(I, {
|
|
180
180
|
className: R(E ? "flex-col h-auto" : "", n.tabPosition === "bottom" && "order-last", n.tabPosition === "right" && "order-last"),
|
|
181
|
-
children: n.sections.map((e, t) => /* @__PURE__ */
|
|
181
|
+
children: n.sections.map((e, t) => /* @__PURE__ */ J(L, {
|
|
182
182
|
value: w(e, t),
|
|
183
183
|
className: E ? "w-full justify-start" : "",
|
|
184
184
|
children: e.label || `Tab ${t + 1}`
|
|
185
185
|
}, w(e, t)))
|
|
186
|
-
}), /* @__PURE__ */
|
|
186
|
+
}), /* @__PURE__ */ J("div", {
|
|
187
187
|
className: "flex-1",
|
|
188
|
-
children: n.sections.map((e, t) => /* @__PURE__ */
|
|
188
|
+
children: n.sections.map((e, t) => /* @__PURE__ */ J(F, {
|
|
189
189
|
value: w(e, t),
|
|
190
190
|
className: "mt-0",
|
|
191
|
-
children: /* @__PURE__ */
|
|
191
|
+
children: /* @__PURE__ */ J(X, {
|
|
192
192
|
description: e.description,
|
|
193
193
|
columns: e.columns || 1,
|
|
194
|
-
children: /* @__PURE__ */
|
|
194
|
+
children: /* @__PURE__ */ J(c, { schema: {
|
|
195
195
|
...T,
|
|
196
196
|
fields: x(e),
|
|
197
197
|
showSubmit: n.showSubmit !== !1 && n.mode !== "view",
|
|
@@ -202,7 +202,7 @@ var Y = ({ label: e, description: t, collapsible: n = !1, collapsed: r = !1, col
|
|
|
202
202
|
})]
|
|
203
203
|
})
|
|
204
204
|
});
|
|
205
|
-
},
|
|
205
|
+
}, Q = ({ schema: n, dataSource: r, className: a }) => {
|
|
206
206
|
let { fieldLabel: s } = l(), [f, h] = o(null), [g, _] = o({}), [v, y] = o(!0), [b, x] = o(null), [S, C] = o(0), [w, T] = o(/* @__PURE__ */ new Set()), [E, D] = o(!1), O = n.sections.length, k = S === 0, A = S === O - 1;
|
|
207
207
|
e.useEffect(() => {
|
|
208
208
|
(async () => {
|
|
@@ -316,51 +316,51 @@ var Y = ({ label: e, description: t, collapsible: n = !1, collapsed: r = !1, col
|
|
|
316
316
|
S,
|
|
317
317
|
P
|
|
318
318
|
]);
|
|
319
|
-
if (b) return /* @__PURE__ */
|
|
319
|
+
if (b) return /* @__PURE__ */ Y("div", {
|
|
320
320
|
className: "p-4 border border-red-300 bg-red-50 rounded-md",
|
|
321
|
-
children: [/* @__PURE__ */
|
|
321
|
+
children: [/* @__PURE__ */ J("h3", {
|
|
322
322
|
className: "text-red-800 font-semibold",
|
|
323
323
|
children: "Error loading form"
|
|
324
|
-
}), /* @__PURE__ */
|
|
324
|
+
}), /* @__PURE__ */ J("p", {
|
|
325
325
|
className: "text-red-600 text-sm mt-1",
|
|
326
326
|
children: b.message
|
|
327
327
|
})]
|
|
328
328
|
});
|
|
329
|
-
if (v) return /* @__PURE__ */
|
|
329
|
+
if (v) return /* @__PURE__ */ Y("div", {
|
|
330
330
|
className: "p-8 text-center",
|
|
331
|
-
children: [/* @__PURE__ */
|
|
331
|
+
children: [/* @__PURE__ */ J("div", { className: "inline-block animate-spin rounded-full h-8 w-8 border-b-2 border-gray-900" }), /* @__PURE__ */ J("p", {
|
|
332
332
|
className: "mt-2 text-sm text-gray-600",
|
|
333
333
|
children: "Loading form..."
|
|
334
334
|
})]
|
|
335
335
|
});
|
|
336
336
|
let z = n.sections[S];
|
|
337
|
-
return /* @__PURE__ */
|
|
337
|
+
return /* @__PURE__ */ Y("div", {
|
|
338
338
|
className: R("w-full", a, n.className),
|
|
339
339
|
children: [
|
|
340
|
-
n.showStepIndicator !== !1 && /* @__PURE__ */
|
|
340
|
+
n.showStepIndicator !== !1 && /* @__PURE__ */ J("nav", {
|
|
341
341
|
"aria-label": "Progress",
|
|
342
342
|
className: "mb-8",
|
|
343
|
-
children: /* @__PURE__ */
|
|
343
|
+
children: /* @__PURE__ */ J("ol", {
|
|
344
344
|
className: "flex items-center",
|
|
345
345
|
children: n.sections.map((e, t) => {
|
|
346
346
|
let r = t === S, i = w.has(t), a = n.allowSkip || i || t <= S;
|
|
347
|
-
return /* @__PURE__ */
|
|
347
|
+
return /* @__PURE__ */ Y("li", {
|
|
348
348
|
className: R("relative flex-1", t !== O - 1 && "pr-8 sm:pr-12"),
|
|
349
|
-
children: [t !== O - 1 && /* @__PURE__ */
|
|
349
|
+
children: [t !== O - 1 && /* @__PURE__ */ J("div", {
|
|
350
350
|
className: "absolute top-3 sm:top-4 left-6 -right-4 sm:left-10 sm:-right-2 h-0.5",
|
|
351
351
|
"aria-hidden": "true",
|
|
352
|
-
children: /* @__PURE__ */
|
|
353
|
-
}), /* @__PURE__ */
|
|
352
|
+
children: /* @__PURE__ */ J("div", { className: R("h-full", i ? "bg-primary" : "bg-muted") })
|
|
353
|
+
}), /* @__PURE__ */ Y("button", {
|
|
354
354
|
type: "button",
|
|
355
355
|
className: R("group relative flex items-center", a ? "cursor-pointer" : "cursor-not-allowed"),
|
|
356
356
|
onClick: () => L(t),
|
|
357
357
|
disabled: !a,
|
|
358
|
-
children: [/* @__PURE__ */
|
|
358
|
+
children: [/* @__PURE__ */ J("span", {
|
|
359
359
|
className: R("flex h-6 w-6 sm:h-8 sm:w-8 items-center justify-center rounded-full text-xs sm:text-sm font-medium transition-colors", i && "bg-primary text-primary-foreground", r && !i && "border-2 border-primary bg-background text-primary", !r && !i && "border-2 border-muted bg-background text-muted-foreground"),
|
|
360
|
-
children: i ? /* @__PURE__ */
|
|
361
|
-
}), /* @__PURE__ */
|
|
360
|
+
children: i ? /* @__PURE__ */ J(ee, { className: "h-3 w-3 sm:h-4 sm:w-4" }) : t + 1
|
|
361
|
+
}), /* @__PURE__ */ J("span", {
|
|
362
362
|
className: "ml-2 sm:ml-3 text-xs sm:text-sm font-medium hidden sm:block",
|
|
363
|
-
children: /* @__PURE__ */
|
|
363
|
+
children: /* @__PURE__ */ J("span", {
|
|
364
364
|
className: R(r ? "text-foreground" : "text-muted-foreground"),
|
|
365
365
|
children: e.label || `Step ${t + 1}`
|
|
366
366
|
})
|
|
@@ -370,13 +370,13 @@ var Y = ({ label: e, description: t, collapsible: n = !1, collapsed: r = !1, col
|
|
|
370
370
|
})
|
|
371
371
|
})
|
|
372
372
|
}),
|
|
373
|
-
/* @__PURE__ */
|
|
373
|
+
/* @__PURE__ */ J("div", {
|
|
374
374
|
className: "min-h-[200px]",
|
|
375
|
-
children: z && /* @__PURE__ */
|
|
375
|
+
children: z && /* @__PURE__ */ J(X, {
|
|
376
376
|
label: z.label,
|
|
377
377
|
description: z.description,
|
|
378
378
|
columns: z.columns || 1,
|
|
379
|
-
children: M.length > 0 ? /* @__PURE__ */
|
|
379
|
+
children: M.length > 0 ? /* @__PURE__ */ J(c, { schema: {
|
|
380
380
|
type: "form",
|
|
381
381
|
fields: M,
|
|
382
382
|
layout: "vertical",
|
|
@@ -384,22 +384,22 @@ var Y = ({ label: e, description: t, collapsible: n = !1, collapsed: r = !1, col
|
|
|
384
384
|
showSubmit: !1,
|
|
385
385
|
showCancel: !1,
|
|
386
386
|
onSubmit: N
|
|
387
|
-
} }) : /* @__PURE__ */
|
|
387
|
+
} }) : /* @__PURE__ */ J("div", {
|
|
388
388
|
className: "text-center py-8 text-muted-foreground",
|
|
389
389
|
children: "No fields configured for this step"
|
|
390
390
|
})
|
|
391
391
|
})
|
|
392
392
|
}),
|
|
393
|
-
/* @__PURE__ */
|
|
393
|
+
/* @__PURE__ */ Y("div", {
|
|
394
394
|
className: "flex items-center justify-between mt-6 pt-4 border-t",
|
|
395
|
-
children: [/* @__PURE__ */
|
|
395
|
+
children: [/* @__PURE__ */ J("div", { children: n.showCancel !== !1 && /* @__PURE__ */ J(m, {
|
|
396
396
|
variant: "ghost",
|
|
397
397
|
onClick: I,
|
|
398
398
|
children: n.cancelText || "Cancel"
|
|
399
|
-
}) }), /* @__PURE__ */
|
|
399
|
+
}) }), /* @__PURE__ */ Y("div", {
|
|
400
400
|
className: "flex items-center gap-2",
|
|
401
401
|
children: [
|
|
402
|
-
/* @__PURE__ */
|
|
402
|
+
/* @__PURE__ */ Y("span", {
|
|
403
403
|
className: "text-sm text-muted-foreground mr-2",
|
|
404
404
|
children: [
|
|
405
405
|
"Step ",
|
|
@@ -408,25 +408,28 @@ var Y = ({ label: e, description: t, collapsible: n = !1, collapsed: r = !1, col
|
|
|
408
408
|
O
|
|
409
409
|
]
|
|
410
410
|
}),
|
|
411
|
-
!k && /* @__PURE__ */
|
|
411
|
+
!k && /* @__PURE__ */ Y(m, {
|
|
412
412
|
variant: "outline",
|
|
413
413
|
onClick: F,
|
|
414
|
-
children: [/* @__PURE__ */
|
|
414
|
+
children: [/* @__PURE__ */ J(te, { className: "h-4 w-4 mr-1" }), n.prevText || "Back"]
|
|
415
415
|
}),
|
|
416
|
-
A ? /* @__PURE__ */
|
|
416
|
+
A ? /* @__PURE__ */ Y(m, {
|
|
417
417
|
onClick: () => N(g),
|
|
418
418
|
disabled: E || n.mode === "view",
|
|
419
|
-
children: E
|
|
420
|
-
|
|
419
|
+
children: [E && /* @__PURE__ */ J(W, {
|
|
420
|
+
className: "mr-2 h-4 w-4 animate-spin",
|
|
421
|
+
"aria-hidden": !0
|
|
422
|
+
}), E ? "Submitting..." : n.submitText || (n.mode === "create" ? "Create" : "Update")]
|
|
423
|
+
}) : /* @__PURE__ */ Y(m, {
|
|
421
424
|
onClick: () => N(g),
|
|
422
|
-
children: [n.nextText || "Next", /* @__PURE__ */
|
|
425
|
+
children: [n.nextText || "Next", /* @__PURE__ */ J(U, { className: "h-4 w-4 ml-1" })]
|
|
423
426
|
})
|
|
424
427
|
]
|
|
425
428
|
})]
|
|
426
429
|
})
|
|
427
430
|
]
|
|
428
431
|
});
|
|
429
|
-
},
|
|
432
|
+
}, ne = ({ schema: e, dataSource: r, className: a }) => {
|
|
430
433
|
let { fieldLabel: s } = l(), [f, m] = o(null), [h, g] = o({}), [_, v] = o(!0), [y, b] = o(null);
|
|
431
434
|
n(() => {
|
|
432
435
|
(async () => {
|
|
@@ -515,19 +518,19 @@ var Y = ({ label: e, description: t, collapsible: n = !1, collapsed: r = !1, col
|
|
|
515
518
|
}, [e]), w = i(() => e.sections.slice(0, 1), [e.sections]), O = i(() => e.sections.slice(1), [e.sections]);
|
|
516
519
|
i(() => e.sections.flatMap((e) => x(e)), [e.sections, x]);
|
|
517
520
|
let k = e.splitDirection || "horizontal", A = e.splitSize || 50;
|
|
518
|
-
if (y) return /* @__PURE__ */
|
|
521
|
+
if (y) return /* @__PURE__ */ Y("div", {
|
|
519
522
|
className: "p-4 border border-red-300 bg-red-50 rounded-md",
|
|
520
|
-
children: [/* @__PURE__ */
|
|
523
|
+
children: [/* @__PURE__ */ J("h3", {
|
|
521
524
|
className: "text-red-800 font-semibold",
|
|
522
525
|
children: "Error loading form"
|
|
523
|
-
}), /* @__PURE__ */
|
|
526
|
+
}), /* @__PURE__ */ J("p", {
|
|
524
527
|
className: "text-red-600 text-sm mt-1",
|
|
525
528
|
children: y.message
|
|
526
529
|
})]
|
|
527
530
|
});
|
|
528
|
-
if (_) return /* @__PURE__ */
|
|
531
|
+
if (_) return /* @__PURE__ */ Y("div", {
|
|
529
532
|
className: "p-8 text-center",
|
|
530
|
-
children: [/* @__PURE__ */
|
|
533
|
+
children: [/* @__PURE__ */ J("div", { className: "inline-block animate-spin rounded-full h-8 w-8 border-b-2 border-gray-900" }), /* @__PURE__ */ J("p", {
|
|
531
534
|
className: "mt-2 text-sm text-gray-600",
|
|
532
535
|
children: "Loading form..."
|
|
533
536
|
})]
|
|
@@ -538,13 +541,13 @@ var Y = ({ label: e, description: t, collapsible: n = !1, collapsed: r = !1, col
|
|
|
538
541
|
defaultValues: h,
|
|
539
542
|
onSubmit: S,
|
|
540
543
|
onCancel: C
|
|
541
|
-
}, M = (t, n) => /* @__PURE__ */
|
|
544
|
+
}, M = (t, n) => /* @__PURE__ */ J("div", {
|
|
542
545
|
className: "space-y-4 p-4",
|
|
543
|
-
children: t.map((t, r) => /* @__PURE__ */
|
|
546
|
+
children: t.map((t, r) => /* @__PURE__ */ J(X, {
|
|
544
547
|
label: t.label,
|
|
545
548
|
description: t.description,
|
|
546
549
|
columns: t.columns || 1,
|
|
547
|
-
children: /* @__PURE__ */
|
|
550
|
+
children: /* @__PURE__ */ J(c, { schema: {
|
|
548
551
|
...j,
|
|
549
552
|
fields: x(t),
|
|
550
553
|
showSubmit: n && e.showSubmit !== !1 && e.mode !== "view",
|
|
@@ -554,16 +557,16 @@ var Y = ({ label: e, description: t, collapsible: n = !1, collapsed: r = !1, col
|
|
|
554
557
|
} })
|
|
555
558
|
}, t.name || t.label || r))
|
|
556
559
|
});
|
|
557
|
-
return /* @__PURE__ */
|
|
560
|
+
return /* @__PURE__ */ J("div", {
|
|
558
561
|
className: R("w-full", a, e.className),
|
|
559
|
-
children: /* @__PURE__ */
|
|
562
|
+
children: /* @__PURE__ */ Y(D, {
|
|
560
563
|
orientation: k,
|
|
561
564
|
className: "min-h-[300px] rounded-lg border",
|
|
562
|
-
children: [/* @__PURE__ */
|
|
565
|
+
children: [/* @__PURE__ */ J(E, {
|
|
563
566
|
defaultSize: A,
|
|
564
567
|
minSize: 20,
|
|
565
568
|
children: M(w, O.length === 0)
|
|
566
|
-
}), O.length > 0 && /* @__PURE__ */
|
|
569
|
+
}), O.length > 0 && /* @__PURE__ */ Y(q, { children: [/* @__PURE__ */ J(T, { withHandle: e.splitResizable !== !1 }), /* @__PURE__ */ J(E, {
|
|
567
570
|
defaultSize: 100 - A,
|
|
568
571
|
minSize: 20,
|
|
569
572
|
children: M(O, !0)
|
|
@@ -859,29 +862,29 @@ var ve = {
|
|
|
859
862
|
onSubmit: D,
|
|
860
863
|
onCancel: N
|
|
861
864
|
};
|
|
862
|
-
return /* @__PURE__ */
|
|
865
|
+
return /* @__PURE__ */ J(O, {
|
|
863
866
|
open: S,
|
|
864
867
|
onOpenChange: e.onOpenChange,
|
|
865
|
-
children: /* @__PURE__ */
|
|
868
|
+
children: /* @__PURE__ */ Y(k, {
|
|
866
869
|
side: C,
|
|
867
870
|
className: R("overflow-y-auto", a, e.className),
|
|
868
871
|
style: P,
|
|
869
|
-
children: [(e.title || e.description) && /* @__PURE__ */
|
|
872
|
+
children: [(e.title || e.description) && /* @__PURE__ */ Y(j, { children: [e.title && /* @__PURE__ */ J(M, { children: e.title }), e.description && /* @__PURE__ */ J(A, { children: e.description })] }), /* @__PURE__ */ J("div", {
|
|
870
873
|
className: "@container py-4",
|
|
871
874
|
children: (() => {
|
|
872
|
-
if (b) return /* @__PURE__ */
|
|
875
|
+
if (b) return /* @__PURE__ */ Y("div", {
|
|
873
876
|
className: "p-4 border border-red-300 bg-red-50 rounded-md",
|
|
874
|
-
children: [/* @__PURE__ */
|
|
877
|
+
children: [/* @__PURE__ */ J("h3", {
|
|
875
878
|
className: "text-red-800 font-semibold",
|
|
876
879
|
children: "Error loading form"
|
|
877
|
-
}), /* @__PURE__ */
|
|
880
|
+
}), /* @__PURE__ */ J("p", {
|
|
878
881
|
className: "text-red-600 text-sm mt-1",
|
|
879
882
|
children: b.message
|
|
880
883
|
})]
|
|
881
884
|
});
|
|
882
|
-
if (v) return /* @__PURE__ */
|
|
885
|
+
if (v) return /* @__PURE__ */ Y("div", {
|
|
883
886
|
className: "p-8 text-center",
|
|
884
|
-
children: [/* @__PURE__ */
|
|
887
|
+
children: [/* @__PURE__ */ J("div", { className: "inline-block animate-spin rounded-full h-8 w-8 border-b-2 border-gray-900" }), /* @__PURE__ */ J("p", {
|
|
885
888
|
className: "mt-2 text-sm text-gray-600",
|
|
886
889
|
children: "Loading form..."
|
|
887
890
|
})]
|
|
@@ -907,13 +910,13 @@ var ve = {
|
|
|
907
910
|
...e,
|
|
908
911
|
hidden: !0
|
|
909
912
|
}))) : t.push(...a);
|
|
910
|
-
}), /* @__PURE__ */
|
|
913
|
+
}), /* @__PURE__ */ J(c, { schema: {
|
|
911
914
|
...F,
|
|
912
915
|
fields: t
|
|
913
916
|
} });
|
|
914
917
|
}
|
|
915
918
|
let t = $(m, d, e.columns, e.mode), n = ve[t.columns || 1];
|
|
916
|
-
return /* @__PURE__ */
|
|
919
|
+
return /* @__PURE__ */ J(c, { schema: {
|
|
917
920
|
...F,
|
|
918
921
|
fields: t.fields,
|
|
919
922
|
columns: t.columns,
|
|
@@ -1112,97 +1115,97 @@ var ve = {
|
|
|
1112
1115
|
h
|
|
1113
1116
|
]), H = t(() => {
|
|
1114
1117
|
e.onCancel && e.onCancel(), e.onOpenChange?.(!1);
|
|
1115
|
-
}, [e]), te = e.layout === "vertical" || e.layout === "horizontal" ? e.layout : "vertical", U = e.showSubmit !== !1 && e.mode !== "view",
|
|
1118
|
+
}, [e]), te = e.layout === "vertical" || e.layout === "horizontal" ? e.layout : "vertical", U = e.showSubmit !== !1 && e.mode !== "view", G = e.showCancel !== !1, K = e.submitText || (e.mode === "create" ? "Create" : "Update"), q = e.cancelText || "Cancel", Z = {
|
|
1116
1119
|
type: "form",
|
|
1117
1120
|
layout: te,
|
|
1118
1121
|
defaultValues: E,
|
|
1119
|
-
submitLabel:
|
|
1120
|
-
cancelLabel:
|
|
1122
|
+
submitLabel: K,
|
|
1123
|
+
cancelLabel: q,
|
|
1121
1124
|
showSubmit: U,
|
|
1122
|
-
showCancel:
|
|
1125
|
+
showCancel: G,
|
|
1123
1126
|
onSubmit: V,
|
|
1124
1127
|
onCancel: H,
|
|
1125
1128
|
showActions: !1,
|
|
1126
1129
|
id: I
|
|
1127
|
-
},
|
|
1128
|
-
if (A) return /* @__PURE__ */
|
|
1130
|
+
}, Q = () => {
|
|
1131
|
+
if (A) return /* @__PURE__ */ Y("div", {
|
|
1129
1132
|
className: "p-4 border border-red-300 bg-red-50 rounded-md",
|
|
1130
|
-
children: [/* @__PURE__ */
|
|
1133
|
+
children: [/* @__PURE__ */ J("h3", {
|
|
1131
1134
|
className: "text-red-800 font-semibold",
|
|
1132
1135
|
children: "Error loading form"
|
|
1133
|
-
}), /* @__PURE__ */
|
|
1136
|
+
}), /* @__PURE__ */ J("p", {
|
|
1134
1137
|
className: "text-red-600 text-sm mt-1",
|
|
1135
1138
|
children: A.message
|
|
1136
1139
|
})]
|
|
1137
1140
|
});
|
|
1138
|
-
if (O) return /* @__PURE__ */
|
|
1141
|
+
if (O) return /* @__PURE__ */ J("div", {
|
|
1139
1142
|
className: "space-y-4",
|
|
1140
1143
|
"data-testid": "modal-form-skeleton",
|
|
1141
1144
|
children: [
|
|
1142
1145
|
1,
|
|
1143
1146
|
2,
|
|
1144
1147
|
3
|
|
1145
|
-
].map((e) => /* @__PURE__ */
|
|
1148
|
+
].map((e) => /* @__PURE__ */ Y("div", {
|
|
1146
1149
|
className: "space-y-2",
|
|
1147
|
-
children: [/* @__PURE__ */
|
|
1150
|
+
children: [/* @__PURE__ */ J(N, { className: "h-4 w-24" }), /* @__PURE__ */ J(N, { className: "h-10 w-full" })]
|
|
1148
1151
|
}, e))
|
|
1149
1152
|
});
|
|
1150
|
-
if (e.sections?.length) return /* @__PURE__ */
|
|
1153
|
+
if (e.sections?.length) return /* @__PURE__ */ J("div", {
|
|
1151
1154
|
className: "space-y-6",
|
|
1152
1155
|
children: e.sections.map((e, t) => {
|
|
1153
1156
|
let n = e.columns || 1;
|
|
1154
|
-
return /* @__PURE__ */
|
|
1157
|
+
return /* @__PURE__ */ J(X, {
|
|
1155
1158
|
label: e.label,
|
|
1156
1159
|
description: e.description,
|
|
1157
1160
|
columns: n,
|
|
1158
1161
|
gridClassName: xe[n],
|
|
1159
|
-
children: /* @__PURE__ */
|
|
1160
|
-
...
|
|
1162
|
+
children: /* @__PURE__ */ J(c, { schema: {
|
|
1163
|
+
...Z,
|
|
1161
1164
|
fields: g(ee(e))
|
|
1162
1165
|
} })
|
|
1163
1166
|
}, e.name || e.label || t);
|
|
1164
1167
|
})
|
|
1165
1168
|
});
|
|
1166
1169
|
let t = L ?? $(y, _, e.columns, e.mode), n = xe[t.columns || 1];
|
|
1167
|
-
return /* @__PURE__ */
|
|
1168
|
-
...
|
|
1170
|
+
return /* @__PURE__ */ J(c, { schema: {
|
|
1171
|
+
...Z,
|
|
1169
1172
|
fields: g(t.fields),
|
|
1170
1173
|
columns: t.columns,
|
|
1171
1174
|
...n ? { fieldContainerClass: n } : {}
|
|
1172
1175
|
} });
|
|
1173
|
-
},
|
|
1174
|
-
return /* @__PURE__ */
|
|
1176
|
+
}, ne = !O && !A && (U || G);
|
|
1177
|
+
return /* @__PURE__ */ J(b, {
|
|
1175
1178
|
open: F,
|
|
1176
1179
|
onOpenChange: e.onOpenChange,
|
|
1177
|
-
children: /* @__PURE__ */
|
|
1180
|
+
children: /* @__PURE__ */ Y(w, {
|
|
1178
1181
|
className: R(z, "flex flex-col h-[100dvh] sm:h-auto sm:max-h-[90vh] overflow-hidden p-0", s, e.className),
|
|
1179
1182
|
children: [
|
|
1180
|
-
(e.title || e.description) && /* @__PURE__ */
|
|
1183
|
+
(e.title || e.description) && /* @__PURE__ */ Y(S, {
|
|
1181
1184
|
className: "shrink-0 px-4 pt-4 sm:px-6 sm:pt-6 pb-2 border-b",
|
|
1182
|
-
children: [e.title && /* @__PURE__ */
|
|
1185
|
+
children: [e.title && /* @__PURE__ */ J(C, { children: e.title }), e.description && /* @__PURE__ */ J(x, { children: e.description })]
|
|
1183
1186
|
}),
|
|
1184
|
-
/* @__PURE__ */
|
|
1187
|
+
/* @__PURE__ */ J("div", {
|
|
1185
1188
|
className: "@container flex-1 overflow-y-auto px-4 sm:px-6 py-4",
|
|
1186
|
-
children:
|
|
1189
|
+
children: Q()
|
|
1187
1190
|
}),
|
|
1188
|
-
|
|
1191
|
+
ne && /* @__PURE__ */ J("div", {
|
|
1189
1192
|
className: "shrink-0 border-t px-4 sm:px-6 py-3 bg-background",
|
|
1190
1193
|
"data-testid": "modal-form-footer",
|
|
1191
|
-
children: /* @__PURE__ */
|
|
1194
|
+
children: /* @__PURE__ */ Y("div", {
|
|
1192
1195
|
className: "flex flex-col sm:flex-row gap-2 sm:justify-end",
|
|
1193
|
-
children: [
|
|
1196
|
+
children: [G && /* @__PURE__ */ J(m, {
|
|
1194
1197
|
type: "button",
|
|
1195
1198
|
variant: "outline",
|
|
1196
1199
|
onClick: H,
|
|
1197
1200
|
disabled: M,
|
|
1198
1201
|
className: "w-full sm:w-auto",
|
|
1199
|
-
children:
|
|
1200
|
-
}), U && /* @__PURE__ */
|
|
1202
|
+
children: q
|
|
1203
|
+
}), U && /* @__PURE__ */ Y(m, {
|
|
1201
1204
|
type: "submit",
|
|
1202
1205
|
form: I,
|
|
1203
1206
|
disabled: M,
|
|
1204
1207
|
className: "w-full sm:w-auto",
|
|
1205
|
-
children: [M && /* @__PURE__ */
|
|
1208
|
+
children: [M && /* @__PURE__ */ J(W, { className: "mr-2 h-4 w-4 animate-spin" }), K]
|
|
1206
1209
|
})]
|
|
1207
1210
|
})
|
|
1208
1211
|
})
|
|
@@ -1226,7 +1229,7 @@ var ve = {
|
|
|
1226
1229
|
}))
|
|
1227
1230
|
};
|
|
1228
1231
|
}, [e, n]), { sectionLabel: a } = l(), o = (e) => e?.name ? a(r.objectName, e.name, e.label || e.name) : e?.label;
|
|
1229
|
-
if (r.formType === "tabbed" && r.sections?.length) return /* @__PURE__ */
|
|
1232
|
+
if (r.formType === "tabbed" && r.sections?.length) return /* @__PURE__ */ J(Z, {
|
|
1230
1233
|
schema: {
|
|
1231
1234
|
...r,
|
|
1232
1235
|
formType: "tabbed",
|
|
@@ -1243,7 +1246,7 @@ var ve = {
|
|
|
1243
1246
|
dataSource: t,
|
|
1244
1247
|
className: r.className
|
|
1245
1248
|
});
|
|
1246
|
-
if (r.formType === "wizard" && r.sections?.length) return /* @__PURE__ */
|
|
1249
|
+
if (r.formType === "wizard" && r.sections?.length) return /* @__PURE__ */ J(Q, {
|
|
1247
1250
|
schema: {
|
|
1248
1251
|
...r,
|
|
1249
1252
|
formType: "wizard",
|
|
@@ -1263,7 +1266,7 @@ var ve = {
|
|
|
1263
1266
|
dataSource: t,
|
|
1264
1267
|
className: r.className
|
|
1265
1268
|
});
|
|
1266
|
-
if (r.formType === "split" && r.sections?.length) return /* @__PURE__ */
|
|
1269
|
+
if (r.formType === "split" && r.sections?.length) return /* @__PURE__ */ J(ne, {
|
|
1267
1270
|
schema: {
|
|
1268
1271
|
...r,
|
|
1269
1272
|
formType: "split",
|
|
@@ -1283,7 +1286,7 @@ var ve = {
|
|
|
1283
1286
|
});
|
|
1284
1287
|
if (r.formType === "drawer") {
|
|
1285
1288
|
let { layout: e, ...n } = r, i = r.layout === "vertical" || r.layout === "horizontal" ? r.layout : void 0;
|
|
1286
|
-
return /* @__PURE__ */
|
|
1289
|
+
return /* @__PURE__ */ J(ye, {
|
|
1287
1290
|
schema: {
|
|
1288
1291
|
...n,
|
|
1289
1292
|
layout: i,
|
|
@@ -1308,7 +1311,7 @@ var ve = {
|
|
|
1308
1311
|
}
|
|
1309
1312
|
if (r.formType === "modal") {
|
|
1310
1313
|
let { layout: e, ...n } = r, i = r.layout === "vertical" || r.layout === "horizontal" ? r.layout : void 0;
|
|
1311
|
-
return /* @__PURE__ */
|
|
1314
|
+
return /* @__PURE__ */ J(Se, {
|
|
1312
1315
|
schema: {
|
|
1313
1316
|
...n,
|
|
1314
1317
|
layout: i,
|
|
@@ -1329,7 +1332,7 @@ var ve = {
|
|
|
1329
1332
|
className: r.className
|
|
1330
1333
|
});
|
|
1331
1334
|
}
|
|
1332
|
-
return /* @__PURE__ */
|
|
1335
|
+
return /* @__PURE__ */ J(we, {
|
|
1333
1336
|
schema: r,
|
|
1334
1337
|
dataSource: t
|
|
1335
1338
|
});
|
|
@@ -1492,36 +1495,36 @@ var ve = {
|
|
|
1492
1495
|
}, [_]),
|
|
1493
1496
|
...x
|
|
1494
1497
|
};
|
|
1495
|
-
if (T) return /* @__PURE__ */
|
|
1498
|
+
if (T) return /* @__PURE__ */ Y("div", {
|
|
1496
1499
|
className: "p-3 sm:p-4 border border-red-300 bg-red-50 rounded-md",
|
|
1497
|
-
children: [/* @__PURE__ */
|
|
1500
|
+
children: [/* @__PURE__ */ J("h3", {
|
|
1498
1501
|
className: "text-red-800 font-semibold",
|
|
1499
1502
|
children: "Error loading form"
|
|
1500
|
-
}), /* @__PURE__ */
|
|
1503
|
+
}), /* @__PURE__ */ J("p", {
|
|
1501
1504
|
className: "text-red-600 text-sm mt-1",
|
|
1502
1505
|
children: T.message
|
|
1503
1506
|
})]
|
|
1504
1507
|
});
|
|
1505
|
-
if (C) return /* @__PURE__ */
|
|
1508
|
+
if (C) return /* @__PURE__ */ Y("div", {
|
|
1506
1509
|
className: "p-4 sm:p-8 text-center",
|
|
1507
|
-
children: [/* @__PURE__ */
|
|
1510
|
+
children: [/* @__PURE__ */ J("div", { className: "inline-block animate-spin rounded-full h-8 w-8 border-b-2 border-gray-900" }), /* @__PURE__ */ J("p", {
|
|
1508
1511
|
className: "mt-2 text-sm text-gray-600",
|
|
1509
1512
|
children: "Loading form..."
|
|
1510
1513
|
})]
|
|
1511
1514
|
});
|
|
1512
1515
|
let M = r.layout === "vertical" || r.layout === "horizontal" ? r.layout : "vertical";
|
|
1513
|
-
if (r.sections?.length && (!r.formType || r.formType === "simple")) return /* @__PURE__ */
|
|
1516
|
+
if (r.sections?.length && (!r.formType || r.formType === "simple")) return /* @__PURE__ */ J("div", {
|
|
1514
1517
|
className: "w-full space-y-6",
|
|
1515
1518
|
children: r.sections.map((e, t) => {
|
|
1516
1519
|
let n = e.fields.map((e) => typeof e == "string" ? e : e.name), i = g(y.filter((e) => n.includes(e.name)));
|
|
1517
|
-
return /* @__PURE__ */
|
|
1520
|
+
return /* @__PURE__ */ J(X, {
|
|
1518
1521
|
label: e.name ? s(r.objectName, e.name, e.label || e.name) : e.label,
|
|
1519
1522
|
description: e.description,
|
|
1520
1523
|
collapsible: e.collapsible,
|
|
1521
1524
|
collapsed: e.collapsed,
|
|
1522
1525
|
columns: e.columns,
|
|
1523
1526
|
showBorder: e.showBorder,
|
|
1524
|
-
children: /* @__PURE__ */
|
|
1527
|
+
children: /* @__PURE__ */ J(c, { schema: {
|
|
1525
1528
|
type: "form",
|
|
1526
1529
|
fields: i,
|
|
1527
1530
|
layout: M,
|
|
@@ -1556,7 +1559,7 @@ var ve = {
|
|
|
1556
1559
|
fields: r
|
|
1557
1560
|
});
|
|
1558
1561
|
}
|
|
1559
|
-
return /* @__PURE__ */
|
|
1562
|
+
return /* @__PURE__ */ J(Q, {
|
|
1560
1563
|
schema: {
|
|
1561
1564
|
...r,
|
|
1562
1565
|
formType: "wizard",
|
|
@@ -1583,10 +1586,10 @@ var ve = {
|
|
|
1583
1586
|
className: r.className,
|
|
1584
1587
|
mobileStickyActions: !!I?.stickyActions
|
|
1585
1588
|
};
|
|
1586
|
-
return /* @__PURE__ */
|
|
1589
|
+
return /* @__PURE__ */ J("div", {
|
|
1587
1590
|
className: I?.stickyActions ? "w-full pb-20 md:pb-0" : "w-full",
|
|
1588
1591
|
"data-mobile-form": I ? "true" : void 0,
|
|
1589
|
-
children: /* @__PURE__ */
|
|
1592
|
+
children: /* @__PURE__ */ J(c, { schema: H })
|
|
1590
1593
|
});
|
|
1591
1594
|
}, Te = {
|
|
1592
1595
|
text: 200,
|
|
@@ -1692,35 +1695,35 @@ var Ae = ({ config: e, dataSource: r, prefillParams: s, className: c }) => {
|
|
|
1692
1695
|
}, [e.branding]);
|
|
1693
1696
|
if (l) {
|
|
1694
1697
|
let t = e.thankYouPage, n = e.texts ?? {}, r = Math.ceil((t?.redirectDelay ?? 3e3) / 1e3), i = (n.redirecting ?? "Redirecting in {{seconds}} seconds…").replace("{{seconds}}", String(r));
|
|
1695
|
-
return /* @__PURE__ */
|
|
1698
|
+
return /* @__PURE__ */ J("div", {
|
|
1696
1699
|
className: `min-h-screen flex items-center justify-center p-4 bg-gradient-to-b from-muted/40 via-background to-background ${c || ""}`,
|
|
1697
1700
|
style: k,
|
|
1698
|
-
children: /* @__PURE__ */
|
|
1701
|
+
children: /* @__PURE__ */ Y("div", {
|
|
1699
1702
|
className: "max-w-md w-full bg-card border rounded-xl shadow-sm p-8 text-center space-y-4",
|
|
1700
1703
|
children: [
|
|
1701
|
-
/* @__PURE__ */
|
|
1704
|
+
/* @__PURE__ */ J("div", {
|
|
1702
1705
|
className: "mx-auto inline-flex h-14 w-14 items-center justify-center rounded-full bg-emerald-50 text-emerald-600 dark:bg-emerald-500/10 dark:text-emerald-400",
|
|
1703
|
-
children: /* @__PURE__ */
|
|
1706
|
+
children: /* @__PURE__ */ J(V, {
|
|
1704
1707
|
className: "h-8 w-8",
|
|
1705
1708
|
"aria-hidden": "true"
|
|
1706
1709
|
})
|
|
1707
1710
|
}),
|
|
1708
|
-
/* @__PURE__ */
|
|
1711
|
+
/* @__PURE__ */ J("h2", {
|
|
1709
1712
|
className: "text-xl font-semibold text-foreground",
|
|
1710
1713
|
children: t?.title || n.thankYouTitle || "Thank You!"
|
|
1711
1714
|
}),
|
|
1712
|
-
/* @__PURE__ */
|
|
1715
|
+
/* @__PURE__ */ J("p", {
|
|
1713
1716
|
className: "text-sm text-muted-foreground",
|
|
1714
1717
|
children: t?.message || n.thankYouMessage || "Your submission has been received successfully."
|
|
1715
1718
|
}),
|
|
1716
|
-
e.allowMultiple && /* @__PURE__ */
|
|
1719
|
+
e.allowMultiple && /* @__PURE__ */ J(m, {
|
|
1717
1720
|
variant: "outline",
|
|
1718
1721
|
size: "sm",
|
|
1719
1722
|
onClick: O,
|
|
1720
1723
|
className: "mt-2",
|
|
1721
1724
|
children: n.submitAnother ?? "Submit Another Response"
|
|
1722
1725
|
}),
|
|
1723
|
-
t?.redirectUrl && /* @__PURE__ */
|
|
1726
|
+
t?.redirectUrl && /* @__PURE__ */ J("p", {
|
|
1724
1727
|
className: "text-xs text-muted-foreground",
|
|
1725
1728
|
children: i
|
|
1726
1729
|
})
|
|
@@ -1729,51 +1732,51 @@ var Ae = ({ config: e, dataSource: r, prefillParams: s, className: c }) => {
|
|
|
1729
1732
|
});
|
|
1730
1733
|
}
|
|
1731
1734
|
let A = e.texts ?? {}, j = !!e.consent?.required, M = `${e.formId}-consent`;
|
|
1732
|
-
return /* @__PURE__ */
|
|
1735
|
+
return /* @__PURE__ */ J("div", {
|
|
1733
1736
|
className: `min-h-screen flex items-center justify-center p-4 sm:p-6 bg-gradient-to-b from-muted/40 via-background to-background ${c || ""}`,
|
|
1734
1737
|
style: k,
|
|
1735
|
-
children: /* @__PURE__ */
|
|
1738
|
+
children: /* @__PURE__ */ Y("div", {
|
|
1736
1739
|
className: "max-w-2xl w-full bg-card border rounded-xl shadow-sm overflow-hidden",
|
|
1737
1740
|
children: [
|
|
1738
|
-
e.branding?.coverImage && /* @__PURE__ */
|
|
1741
|
+
e.branding?.coverImage && /* @__PURE__ */ J("div", {
|
|
1739
1742
|
className: "h-28 sm:h-32 w-full bg-cover bg-center",
|
|
1740
1743
|
style: { backgroundImage: `url(${JSON.stringify(e.branding.coverImage)})` },
|
|
1741
1744
|
role: "presentation"
|
|
1742
1745
|
}),
|
|
1743
|
-
/* @__PURE__ */
|
|
1746
|
+
/* @__PURE__ */ Y("div", {
|
|
1744
1747
|
className: "px-6 sm:px-8 pt-7 pb-5 border-b bg-muted/20",
|
|
1745
1748
|
style: e.branding?.primaryColor ? { borderBottomColor: e.branding.primaryColor } : void 0,
|
|
1746
1749
|
children: [
|
|
1747
|
-
e.branding?.logo && /* @__PURE__ */
|
|
1750
|
+
e.branding?.logo && /* @__PURE__ */ J("img", {
|
|
1748
1751
|
src: e.branding.logo,
|
|
1749
1752
|
alt: "",
|
|
1750
1753
|
className: "h-8 mb-4"
|
|
1751
1754
|
}),
|
|
1752
|
-
e.title && /* @__PURE__ */
|
|
1755
|
+
e.title && /* @__PURE__ */ J("h1", {
|
|
1753
1756
|
className: "text-2xl font-semibold tracking-tight text-foreground",
|
|
1754
1757
|
children: e.title
|
|
1755
1758
|
}),
|
|
1756
|
-
e.description && /* @__PURE__ */
|
|
1759
|
+
e.description && /* @__PURE__ */ J("p", {
|
|
1757
1760
|
className: "text-sm text-muted-foreground mt-2 leading-relaxed",
|
|
1758
1761
|
children: e.description
|
|
1759
1762
|
}),
|
|
1760
|
-
/* @__PURE__ */
|
|
1763
|
+
/* @__PURE__ */ J("p", {
|
|
1761
1764
|
className: "text-[11px] text-muted-foreground/70 mt-3",
|
|
1762
1765
|
"aria-hidden": "true",
|
|
1763
1766
|
children: A.requiredHint ?? "* Required field"
|
|
1764
1767
|
})
|
|
1765
1768
|
]
|
|
1766
1769
|
}),
|
|
1767
|
-
/* @__PURE__ */
|
|
1770
|
+
/* @__PURE__ */ Y("div", {
|
|
1768
1771
|
className: "relative px-6 sm:px-8 py-6",
|
|
1769
1772
|
children: [
|
|
1770
|
-
p && /* @__PURE__ */
|
|
1773
|
+
p && /* @__PURE__ */ J("div", {
|
|
1771
1774
|
role: "alert",
|
|
1772
1775
|
"aria-live": "assertive",
|
|
1773
1776
|
className: "mb-4 p-3 bg-destructive/10 border border-destructive/30 rounded-md text-sm text-destructive",
|
|
1774
1777
|
children: p
|
|
1775
1778
|
}),
|
|
1776
|
-
/* @__PURE__ */
|
|
1779
|
+
/* @__PURE__ */ J(Ce, {
|
|
1777
1780
|
schema: {
|
|
1778
1781
|
type: "object-form",
|
|
1779
1782
|
objectName: e.objectName,
|
|
@@ -1786,13 +1789,13 @@ var Ae = ({ config: e, dataSource: r, prefillParams: s, className: c }) => {
|
|
|
1786
1789
|
},
|
|
1787
1790
|
dataSource: T
|
|
1788
1791
|
}),
|
|
1789
|
-
S && /* @__PURE__ */
|
|
1792
|
+
S && /* @__PURE__ */ Y("div", {
|
|
1790
1793
|
"aria-hidden": "true",
|
|
1791
1794
|
className: "absolute left-[-10000px] top-auto h-px w-px overflow-hidden",
|
|
1792
|
-
children: [/* @__PURE__ */
|
|
1795
|
+
children: [/* @__PURE__ */ J("label", {
|
|
1793
1796
|
htmlFor: `${e.formId}-${S}`,
|
|
1794
1797
|
children: "Do not fill this field"
|
|
1795
|
-
}), /* @__PURE__ */
|
|
1798
|
+
}), /* @__PURE__ */ J("input", {
|
|
1796
1799
|
ref: b,
|
|
1797
1800
|
id: `${e.formId}-${S}`,
|
|
1798
1801
|
type: "text",
|
|
@@ -1802,11 +1805,11 @@ var Ae = ({ config: e, dataSource: r, prefillParams: s, className: c }) => {
|
|
|
1802
1805
|
defaultValue: ""
|
|
1803
1806
|
})]
|
|
1804
1807
|
}),
|
|
1805
|
-
e.consent && /* @__PURE__ */
|
|
1808
|
+
e.consent && /* @__PURE__ */ Y("div", {
|
|
1806
1809
|
className: "mt-4",
|
|
1807
|
-
children: [/* @__PURE__ */
|
|
1810
|
+
children: [/* @__PURE__ */ Y("label", {
|
|
1808
1811
|
className: "flex items-start gap-2 text-sm text-foreground cursor-pointer select-none",
|
|
1809
|
-
children: [/* @__PURE__ */
|
|
1812
|
+
children: [/* @__PURE__ */ J("input", {
|
|
1810
1813
|
type: "checkbox",
|
|
1811
1814
|
id: M,
|
|
1812
1815
|
checked: g,
|
|
@@ -1817,16 +1820,16 @@ var Ae = ({ config: e, dataSource: r, prefillParams: s, className: c }) => {
|
|
|
1817
1820
|
"aria-invalid": v ? "true" : void 0,
|
|
1818
1821
|
"aria-describedby": v ? `${M}-error` : void 0,
|
|
1819
1822
|
className: "mt-0.5 h-4 w-4 rounded border-input accent-primary"
|
|
1820
|
-
}), /* @__PURE__ */
|
|
1823
|
+
}), /* @__PURE__ */ Y("span", {
|
|
1821
1824
|
className: "leading-relaxed",
|
|
1822
1825
|
children: [
|
|
1823
1826
|
e.consent.label ?? A.consentLabelDefault ?? "I agree to the privacy policy.",
|
|
1824
|
-
j && /* @__PURE__ */
|
|
1827
|
+
j && /* @__PURE__ */ J("span", {
|
|
1825
1828
|
"aria-hidden": "true",
|
|
1826
1829
|
className: "text-destructive ml-0.5",
|
|
1827
1830
|
children: "*"
|
|
1828
1831
|
}),
|
|
1829
|
-
e.consent.privacyUrl && /* @__PURE__ */
|
|
1832
|
+
e.consent.privacyUrl && /* @__PURE__ */ Y(q, { children: [" ", /* @__PURE__ */ J("a", {
|
|
1830
1833
|
href: e.consent.privacyUrl,
|
|
1831
1834
|
target: "_blank",
|
|
1832
1835
|
rel: "noopener noreferrer",
|
|
@@ -1835,42 +1838,42 @@ var Ae = ({ config: e, dataSource: r, prefillParams: s, className: c }) => {
|
|
|
1835
1838
|
})] })
|
|
1836
1839
|
]
|
|
1837
1840
|
})]
|
|
1838
|
-
}), v && /* @__PURE__ */
|
|
1841
|
+
}), v && /* @__PURE__ */ J("p", {
|
|
1839
1842
|
id: `${M}-error`,
|
|
1840
1843
|
role: "alert",
|
|
1841
1844
|
className: "mt-1.5 text-xs text-destructive",
|
|
1842
1845
|
children: v
|
|
1843
1846
|
})]
|
|
1844
1847
|
}),
|
|
1845
|
-
d && /* @__PURE__ */
|
|
1848
|
+
d && /* @__PURE__ */ Y("div", {
|
|
1846
1849
|
className: "mt-3 flex items-center gap-2 text-xs text-muted-foreground",
|
|
1847
|
-
children: [/* @__PURE__ */
|
|
1850
|
+
children: [/* @__PURE__ */ J(W, {
|
|
1848
1851
|
className: "h-3.5 w-3.5 animate-spin",
|
|
1849
1852
|
"aria-hidden": "true"
|
|
1850
|
-
}), /* @__PURE__ */
|
|
1853
|
+
}), /* @__PURE__ */ J("span", { children: A.submitting ?? "Submitting…" })]
|
|
1851
1854
|
})
|
|
1852
1855
|
]
|
|
1853
1856
|
}),
|
|
1854
|
-
/* @__PURE__ */
|
|
1857
|
+
/* @__PURE__ */ Y("div", {
|
|
1855
1858
|
className: "px-6 sm:px-8 py-4 border-t bg-muted/20 flex flex-col sm:flex-row items-center justify-between gap-2",
|
|
1856
|
-
children: [/* @__PURE__ */
|
|
1859
|
+
children: [/* @__PURE__ */ Y("p", {
|
|
1857
1860
|
className: "inline-flex items-center gap-1.5 text-xs text-muted-foreground",
|
|
1858
|
-
children: [/* @__PURE__ */
|
|
1861
|
+
children: [/* @__PURE__ */ J(G, {
|
|
1859
1862
|
className: "h-3 w-3",
|
|
1860
1863
|
"aria-hidden": "true"
|
|
1861
|
-
}), /* @__PURE__ */
|
|
1862
|
-
}), /* @__PURE__ */
|
|
1864
|
+
}), /* @__PURE__ */ J("span", { children: A.secureNotice ?? "Your information is transmitted securely and only used to respond to your request." })]
|
|
1865
|
+
}), /* @__PURE__ */ Y("div", {
|
|
1863
1866
|
className: "flex items-center gap-3 text-xs text-muted-foreground/80",
|
|
1864
|
-
children: [e.privacyPolicyUrl && /* @__PURE__ */
|
|
1867
|
+
children: [e.privacyPolicyUrl && /* @__PURE__ */ Y("a", {
|
|
1865
1868
|
href: e.privacyPolicyUrl,
|
|
1866
1869
|
target: "_blank",
|
|
1867
1870
|
rel: "noopener noreferrer",
|
|
1868
1871
|
className: "inline-flex items-center gap-1 underline hover:text-foreground",
|
|
1869
|
-
children: [/* @__PURE__ */
|
|
1872
|
+
children: [/* @__PURE__ */ J(K, {
|
|
1870
1873
|
className: "h-3 w-3",
|
|
1871
1874
|
"aria-hidden": "true"
|
|
1872
1875
|
}), A.consentLink ?? "Privacy policy"]
|
|
1873
|
-
}), /* @__PURE__ */
|
|
1876
|
+
}), /* @__PURE__ */ J("span", { children: A.poweredBy ?? "Powered by ObjectStack" })]
|
|
1874
1877
|
})]
|
|
1875
1878
|
})
|
|
1876
1879
|
]
|
|
@@ -1888,87 +1891,87 @@ var Me = ({ formId: e, formTitle: t, metrics: n, className: r }) => {
|
|
|
1888
1891
|
let e = n.totalSubmissions + n.abandonedSubmissions;
|
|
1889
1892
|
return e === 0 ? 0 : Math.round(n.totalSubmissions / e * 100);
|
|
1890
1893
|
}, [n.totalSubmissions, n.abandonedSubmissions]), o = i(() => n.dailySubmissions?.length ? Math.max(...n.dailySubmissions.map((e) => e.count), 1) : 1, [n.dailySubmissions]);
|
|
1891
|
-
return /* @__PURE__ */
|
|
1894
|
+
return /* @__PURE__ */ Y("div", {
|
|
1892
1895
|
className: `space-y-4 ${r || ""}`,
|
|
1893
1896
|
children: [
|
|
1894
|
-
/* @__PURE__ */
|
|
1897
|
+
/* @__PURE__ */ Y("div", { children: [/* @__PURE__ */ J("h2", {
|
|
1895
1898
|
className: "text-lg font-semibold text-foreground",
|
|
1896
1899
|
children: t || "Form Analytics"
|
|
1897
|
-
}), /* @__PURE__ */
|
|
1900
|
+
}), /* @__PURE__ */ Y("p", {
|
|
1898
1901
|
className: "text-sm text-muted-foreground",
|
|
1899
1902
|
children: ["Form ID: ", e]
|
|
1900
1903
|
})] }),
|
|
1901
|
-
/* @__PURE__ */
|
|
1904
|
+
/* @__PURE__ */ Y("div", {
|
|
1902
1905
|
className: "grid grid-cols-1 sm:grid-cols-3 gap-4",
|
|
1903
1906
|
children: [
|
|
1904
|
-
/* @__PURE__ */
|
|
1907
|
+
/* @__PURE__ */ J(h, { children: /* @__PURE__ */ Y(v, {
|
|
1905
1908
|
className: "pb-2",
|
|
1906
|
-
children: [/* @__PURE__ */
|
|
1909
|
+
children: [/* @__PURE__ */ J(_, { children: "Total Submissions" }), /* @__PURE__ */ J(y, {
|
|
1907
1910
|
className: "text-2xl",
|
|
1908
1911
|
children: n.totalSubmissions.toLocaleString()
|
|
1909
1912
|
})]
|
|
1910
1913
|
}) }),
|
|
1911
|
-
/* @__PURE__ */
|
|
1914
|
+
/* @__PURE__ */ Y(h, { children: [/* @__PURE__ */ Y(v, {
|
|
1912
1915
|
className: "pb-2",
|
|
1913
|
-
children: [/* @__PURE__ */
|
|
1916
|
+
children: [/* @__PURE__ */ J(_, { children: "Fill Rate" }), /* @__PURE__ */ Y(y, {
|
|
1914
1917
|
className: "text-2xl",
|
|
1915
1918
|
children: [a, "%"]
|
|
1916
1919
|
})]
|
|
1917
|
-
}), /* @__PURE__ */
|
|
1920
|
+
}), /* @__PURE__ */ J(g, { children: /* @__PURE__ */ J("div", {
|
|
1918
1921
|
className: "w-full bg-muted rounded-full h-2",
|
|
1919
|
-
children: /* @__PURE__ */
|
|
1922
|
+
children: /* @__PURE__ */ J("div", {
|
|
1920
1923
|
className: "bg-primary rounded-full h-2 transition-all",
|
|
1921
1924
|
style: { width: `${a}%` }
|
|
1922
1925
|
})
|
|
1923
1926
|
}) })] }),
|
|
1924
|
-
/* @__PURE__ */
|
|
1927
|
+
/* @__PURE__ */ J(h, { children: /* @__PURE__ */ Y(v, {
|
|
1925
1928
|
className: "pb-2",
|
|
1926
|
-
children: [/* @__PURE__ */
|
|
1929
|
+
children: [/* @__PURE__ */ J(_, { children: "Avg. Completion Time" }), /* @__PURE__ */ J(y, {
|
|
1927
1930
|
className: "text-2xl",
|
|
1928
1931
|
children: n.avgCompletionTime ? je(n.avgCompletionTime) : "—"
|
|
1929
1932
|
})]
|
|
1930
1933
|
}) })
|
|
1931
1934
|
]
|
|
1932
1935
|
}),
|
|
1933
|
-
n.dailySubmissions && n.dailySubmissions.length > 0 && /* @__PURE__ */
|
|
1936
|
+
n.dailySubmissions && n.dailySubmissions.length > 0 && /* @__PURE__ */ Y(h, { children: [/* @__PURE__ */ J(v, { children: /* @__PURE__ */ J(y, {
|
|
1934
1937
|
className: "text-sm font-medium",
|
|
1935
1938
|
children: "Daily Submissions"
|
|
1936
|
-
}) }), /* @__PURE__ */
|
|
1939
|
+
}) }), /* @__PURE__ */ J(g, { children: /* @__PURE__ */ J("div", {
|
|
1937
1940
|
className: "flex items-end gap-1 h-32",
|
|
1938
|
-
children: n.dailySubmissions.map((e, t) => /* @__PURE__ */
|
|
1941
|
+
children: n.dailySubmissions.map((e, t) => /* @__PURE__ */ Y("div", {
|
|
1939
1942
|
className: "flex-1 flex flex-col items-center gap-1",
|
|
1940
|
-
children: [/* @__PURE__ */
|
|
1943
|
+
children: [/* @__PURE__ */ J("div", {
|
|
1941
1944
|
className: "w-full bg-primary/80 rounded-t transition-all hover:bg-primary",
|
|
1942
1945
|
style: {
|
|
1943
1946
|
height: `${e.count / o * 100}%`,
|
|
1944
1947
|
minHeight: e.count > 0 ? "4px" : "0"
|
|
1945
1948
|
},
|
|
1946
1949
|
title: `${e.date}: ${e.count} submissions`
|
|
1947
|
-
}), /* @__PURE__ */
|
|
1950
|
+
}), /* @__PURE__ */ J("span", {
|
|
1948
1951
|
className: "text-[10px] text-muted-foreground truncate w-full text-center",
|
|
1949
1952
|
children: e.date.slice(-5)
|
|
1950
1953
|
})]
|
|
1951
1954
|
}, t))
|
|
1952
1955
|
}) })] }),
|
|
1953
|
-
n.fieldDropOff && n.fieldDropOff.length > 0 && /* @__PURE__ */
|
|
1956
|
+
n.fieldDropOff && n.fieldDropOff.length > 0 && /* @__PURE__ */ Y(h, { children: [/* @__PURE__ */ Y(v, { children: [/* @__PURE__ */ J(y, {
|
|
1954
1957
|
className: "text-sm font-medium",
|
|
1955
1958
|
children: "Field Completion Rates"
|
|
1956
|
-
}), /* @__PURE__ */
|
|
1959
|
+
}), /* @__PURE__ */ J(_, { children: "Percentage of users who completed each field" })] }), /* @__PURE__ */ J(g, { children: /* @__PURE__ */ J("div", {
|
|
1957
1960
|
className: "space-y-3",
|
|
1958
|
-
children: n.fieldDropOff.map((e, t) => /* @__PURE__ */
|
|
1961
|
+
children: n.fieldDropOff.map((e, t) => /* @__PURE__ */ Y("div", {
|
|
1959
1962
|
className: "space-y-1",
|
|
1960
|
-
children: [/* @__PURE__ */
|
|
1963
|
+
children: [/* @__PURE__ */ Y("div", {
|
|
1961
1964
|
className: "flex justify-between text-sm",
|
|
1962
|
-
children: [/* @__PURE__ */
|
|
1965
|
+
children: [/* @__PURE__ */ J("span", {
|
|
1963
1966
|
className: "text-foreground",
|
|
1964
1967
|
children: e.label
|
|
1965
|
-
}), /* @__PURE__ */
|
|
1968
|
+
}), /* @__PURE__ */ Y("span", {
|
|
1966
1969
|
className: "text-muted-foreground",
|
|
1967
1970
|
children: [e.completionRate, "%"]
|
|
1968
1971
|
})]
|
|
1969
|
-
}), /* @__PURE__ */
|
|
1972
|
+
}), /* @__PURE__ */ J("div", {
|
|
1970
1973
|
className: "w-full bg-muted rounded-full h-1.5",
|
|
1971
|
-
children: /* @__PURE__ */
|
|
1974
|
+
children: /* @__PURE__ */ J("div", {
|
|
1972
1975
|
className: `rounded-full h-1.5 transition-all ${e.completionRate >= 80 ? "bg-green-500" : e.completionRate >= 50 ? "bg-yellow-500" : "bg-destructive"}`,
|
|
1973
1976
|
style: { width: `${e.completionRate}%` }
|
|
1974
1977
|
})
|
|
@@ -1977,7 +1980,7 @@ var Me = ({ formId: e, formTitle: t, metrics: n, className: r }) => {
|
|
|
1977
1980
|
}) })] })
|
|
1978
1981
|
]
|
|
1979
1982
|
});
|
|
1980
|
-
}, Ne = ({ schema: e }) => /* @__PURE__ */
|
|
1983
|
+
}, Ne = ({ schema: e }) => /* @__PURE__ */ J(Ce, { schema: e });
|
|
1981
1984
|
s.register("object-form", Ne, {
|
|
1982
1985
|
namespace: "plugin-form",
|
|
1983
1986
|
label: "Object Form",
|
|
@@ -2147,7 +2150,7 @@ s.register("object-form", Ne, {
|
|
|
2147
2150
|
]
|
|
2148
2151
|
}
|
|
2149
2152
|
]
|
|
2150
|
-
}), s.register("embeddable-form", ({ schema: e }) => /* @__PURE__ */
|
|
2153
|
+
}), s.register("embeddable-form", ({ schema: e }) => /* @__PURE__ */ J(Ae, { config: e }), {
|
|
2151
2154
|
namespace: "plugin-form",
|
|
2152
2155
|
label: "Embeddable Form",
|
|
2153
2156
|
category: "plugin",
|
|
@@ -2185,7 +2188,7 @@ s.register("object-form", Ne, {
|
|
|
2185
2188
|
label: "Allow Multiple Submissions"
|
|
2186
2189
|
}
|
|
2187
2190
|
]
|
|
2188
|
-
}), s.register("form-analytics", ({ schema: e }) => /* @__PURE__ */
|
|
2191
|
+
}), s.register("form-analytics", ({ schema: e }) => /* @__PURE__ */ J(Me, {
|
|
2189
2192
|
formId: e.formId,
|
|
2190
2193
|
formTitle: e.formTitle,
|
|
2191
2194
|
metrics: e.metrics || { totalSubmissions: 0 }
|
|
@@ -2213,4 +2216,4 @@ s.register("object-form", Ne, {
|
|
|
2213
2216
|
]
|
|
2214
2217
|
});
|
|
2215
2218
|
//#endregion
|
|
2216
|
-
export { ye as DrawerForm, Ae as EmbeddableForm, Me as FormAnalytics,
|
|
2219
|
+
export { ye as DrawerForm, Ae as EmbeddableForm, Me as FormAnalytics, X as FormSection, Se as ModalForm, Ce as ObjectForm, ne as SplitForm, Z as TabbedForm, Q as WizardForm, le as applyAutoColSpan, $ as applyAutoLayout, pe as filterAutoGeneratedFields, fe as filterCreateModeFields, de as filterSystemFields, ce as inferColumns, me as inferModalSize, se as isAutoGeneratedFieldType, oe as isWideFieldType };
|