@verbb/formie-vue 1.0.1 → 1.0.3

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/index.js CHANGED
@@ -1,1246 +1,1361 @@
1
- import { FORMIE_HTML_EVENT_NAMES as e, createFormieClient as t } from "@verbb/formie-browser";
2
- import { computed as n, defineComponent as r, h as i, inject as a, onBeforeUnmount as o, onMounted as s, provide as c, ref as l, shallowRef as u, watch as d } from "vue";
3
- import { FRONTEND_CLIENT_EVENT_NAMES as f, compositePartDefinitions as p, createFrontendFormInstance as m, createGraphqlFrontendTransport as h, createRepeaterRowValue as g, createRestFrontendTransport as _, isCompositeField as v, isFileField as y, isKnownFrontendFieldType as b, isRepeatableField as x, loadFrontendEnvelope as S, loadGraphqlFrontendEnvelope as ee, repeaterRowDefinitions as te } from "@verbb/formie-core";
4
- //#region src/stable.ts
5
- function C(e, t) {
6
- if (e == null) return String(e);
7
- if (typeof e == "string") return JSON.stringify(e);
8
- if (typeof e == "number" || typeof e == "boolean") return String(e);
9
- if (typeof e == "function") return "[function]";
10
- if (typeof File < "u" && e instanceof File) return `[file:${e.name}:${e.size}:${e.type}]`;
11
- if (typeof Blob < "u" && e instanceof Blob) return `[blob:${e.size}:${e.type}]`;
12
- if (Array.isArray(e)) return `[${e.map((e) => C(e, t)).join(",")}]`;
13
- if (typeof e == "object") {
14
- if (t.has(e)) return "[circular]";
15
- t.add(e);
16
- let n = Object.entries(e).sort(([e], [t]) => e.localeCompare(t)).map(([e, n]) => `${JSON.stringify(e)}:${C(n, t)}`);
17
- return t.delete(e), `{${n.join(",")}}`;
18
- }
19
- return JSON.stringify(String(e));
1
+ import { createFormieClient as A, FORMIE_HTML_EVENT_NAMES as B } from "@verbb/formie-browser";
2
+ import { defineComponent as g, shallowRef as x, ref as k, computed as m, provide as W, watch as I, h as u, inject as J, onMounted as G, onBeforeUnmount as X } from "vue";
3
+ import { createFrontendFormInstance as Q, FRONTEND_CLIENT_EVENT_NAMES as Y, loadGraphqlFrontendEnvelope as Z, loadFrontendEnvelope as ee, createGraphqlFrontendTransport as te, createRestFrontendTransport as ne, isKnownFrontendFieldType as U, isCompositeField as oe, isRepeatableField as ie, isFileField as re, compositePartDefinitions as ue, repeaterRowDefinitions as se, createRepeaterRowValue as le } from "@verbb/formie-core";
4
+ function M(e, t) {
5
+ if (e == null)
6
+ return String(e);
7
+ if (typeof e == "string")
8
+ return JSON.stringify(e);
9
+ if (typeof e == "number" || typeof e == "boolean")
10
+ return String(e);
11
+ if (typeof e == "function")
12
+ return "[function]";
13
+ if (typeof File < "u" && e instanceof File)
14
+ return `[file:${e.name}:${e.size}:${e.type}]`;
15
+ if (typeof Blob < "u" && e instanceof Blob)
16
+ return `[blob:${e.size}:${e.type}]`;
17
+ if (Array.isArray(e))
18
+ return `[${e.map((n) => M(n, t)).join(",")}]`;
19
+ if (typeof e == "object") {
20
+ if (t.has(e))
21
+ return "[circular]";
22
+ t.add(e);
23
+ const n = Object.entries(e).sort(([o], [i]) => o.localeCompare(i)).map(([o, i]) => `${JSON.stringify(o)}:${M(i, t)}`);
24
+ return t.delete(e), `{${n.join(",")}}`;
25
+ }
26
+ return JSON.stringify(String(e));
20
27
  }
21
- function w(e) {
22
- return C(e, /* @__PURE__ */ new WeakSet());
28
+ function q(e) {
29
+ return M(e, /* @__PURE__ */ new WeakSet());
23
30
  }
24
- //#endregion
25
- //#region src/definition-form.ts
26
- var T = Symbol("formie-definition-context"), E = {
27
- field: {
28
- type: Object,
29
- required: !0
30
- },
31
- value: {
32
- type: null,
33
- default: void 0
34
- },
35
- errors: {
36
- type: Array,
37
- default: () => []
38
- },
39
- errorKey: {
40
- type: String,
41
- required: !0
42
- },
43
- disabled: {
44
- type: Boolean,
45
- default: !1
46
- },
47
- hidden: {
48
- type: Boolean,
49
- default: !1
50
- },
51
- setValue: {
52
- type: Function,
53
- required: !0
54
- }
31
+ const K = /* @__PURE__ */ Symbol("formie-definition-context"), w = {
32
+ field: {
33
+ type: Object,
34
+ required: !0
35
+ },
36
+ value: {
37
+ type: null,
38
+ default: void 0
39
+ },
40
+ errors: {
41
+ type: Array,
42
+ default: () => []
43
+ },
44
+ errorKey: {
45
+ type: String,
46
+ required: !0
47
+ },
48
+ disabled: {
49
+ type: Boolean,
50
+ default: !1
51
+ },
52
+ hidden: {
53
+ type: Boolean,
54
+ default: !1
55
+ },
56
+ setValue: {
57
+ type: Function,
58
+ required: !0
59
+ }
55
60
  };
56
- function D() {
57
- let e = a(T);
58
- if (!e) throw Error("Formie definition composables must be used within a client-rendered <FormieForm>.");
59
- return e;
61
+ function h() {
62
+ const e = J(K);
63
+ if (!e)
64
+ throw new Error("Formie definition composables must be used within a client-rendered <FormieForm>.");
65
+ return e;
60
66
  }
61
- function O(e) {
62
- return "definition" in e;
67
+ function L(e) {
68
+ return "definition" in e;
63
69
  }
64
- async function k(e) {
65
- return O(e) ? e.definition : e.transport === "graphql" ? ee({
66
- endpoint: e.endpoint,
67
- formHandle: e.formHandle,
68
- siteId: e.siteId
69
- }) : S({
70
- endpoint: e.endpoint,
71
- formHandle: e.formHandle,
72
- siteId: e.siteId
73
- });
70
+ async function ae(e) {
71
+ return L(e) ? e.definition : e.transport === "graphql" ? Z({
72
+ endpoint: e.endpoint,
73
+ formHandle: e.formHandle,
74
+ siteId: e.siteId
75
+ }) : ee({
76
+ endpoint: e.endpoint,
77
+ formHandle: e.formHandle,
78
+ siteId: e.siteId
79
+ });
74
80
  }
75
- function ne(e) {
76
- let t = O(e) ? e.transport : {
77
- type: e.transport,
78
- endpoint: e.endpoint,
79
- formHandle: e.formHandle,
80
- siteId: e.siteId
81
- };
82
- return t.type === "graphql" ? h(t) : _(t);
81
+ function de(e) {
82
+ const t = L(e) ? e.transport : {
83
+ type: e.transport,
84
+ endpoint: e.endpoint,
85
+ formHandle: e.formHandle,
86
+ siteId: e.siteId
87
+ };
88
+ return t.type === "graphql" ? te(t) : ne(t);
83
89
  }
84
- function re(e) {
85
- return e.pages.flatMap((e) => e.rows).flatMap((e) => e.fields);
90
+ function ce(e) {
91
+ return e.pages.flatMap((t) => t.rows).flatMap((t) => t.fields);
86
92
  }
87
- function A(e) {
88
- if (b(e.type)) return e.type;
89
- let t = typeof e.input.fieldKind == "string" ? e.input.fieldKind : null;
90
- return t === "text" ? "single-line-text" : t === "textarea" ? "multi-line-text" : t === "boolean" ? "agree" : t === "file" ? "file" : e.type;
93
+ function _(e) {
94
+ if (U(e.type))
95
+ return e.type;
96
+ const t = typeof e.input.fieldKind == "string" ? e.input.fieldKind : null;
97
+ return t === "text" ? "single-line-text" : t === "textarea" ? "multi-line-text" : t === "boolean" ? "agree" : t === "file" ? "file" : e.type;
91
98
  }
92
- function ie(e, t, n) {
93
- let r = new Set(e.moduleRefs || []);
94
- return t.modules.find((e) => r.has(e.id) && e.capability === n) || null;
99
+ function fe(e, t, n) {
100
+ const o = new Set(e.moduleRefs || []);
101
+ return t.modules.find((i) => o.has(i.id) && i.capability === n) || null;
95
102
  }
96
- function j(e, t, n, r) {
97
- if (!n) return null;
98
- let a = e.slots.value[t];
99
- return a ? i(a, {
100
- slotKey: t,
101
- attributes: r
102
- }, { default: () => [n] }) : n;
103
+ function $(e, t, n, o) {
104
+ if (!n)
105
+ return null;
106
+ const i = e.slots.value[t];
107
+ return i ? u(i, {
108
+ slotKey: t,
109
+ attributes: o
110
+ }, {
111
+ default: () => [n]
112
+ }) : n;
103
113
  }
104
- var M = r({
105
- name: "FormieVueDefaultErrorSummary",
106
- props: { errors: {
107
- type: Array,
108
- required: !0
109
- } },
110
- setup(e) {
111
- return () => e.errors.length === 0 ? null : i("div", { class: "formie-vue-errors" }, [i("ul", null, e.errors.map((e, t) => i("li", { key: `${e}:${t}` }, e)))]);
112
- }
113
- }), N = r({
114
- name: "FormieVueDefaultField",
115
- props: {
116
- field: {
117
- type: Object,
118
- required: !0
119
- },
120
- errors: {
121
- type: Array,
122
- required: !0
123
- }
124
- },
125
- setup(e, t) {
126
- let n = D();
127
- return () => {
128
- let r = t.slots.default?.() || [];
129
- return i("div", {
130
- class: "formie-vue-field",
131
- "data-field-type": e.field.type
132
- }, [
133
- e.field.label ? j(n, "label", i("label", { class: "formie-vue-label" }, e.field.label), { class: "formie-vue-label" }) : null,
134
- e.field.instructions ? j(n, "instructions", i("div", { class: "formie-vue-description" }, e.field.instructions), { class: "formie-vue-description" }) : null,
135
- j(n, "input", i("div", { class: "formie-vue-input" }, r), { class: "formie-vue-input" }),
136
- e.errors.length > 0 ? j(n, "errors", i("ul", { class: "formie-vue-field-errors" }, e.errors.map((e, t) => i("li", { key: `${e}:${t}` }, e))), { class: "formie-vue-field-errors" }) : null
137
- ]);
138
- };
139
- }
140
- }), P = r({
141
- name: "FormieVueDefaultForm",
142
- props: {
143
- definition: {
144
- type: Object,
145
- required: !0
146
- },
147
- session: {
148
- type: Object,
149
- required: !0
150
- },
151
- state: {
152
- type: Object,
153
- required: !0
154
- },
155
- className: {
156
- type: String,
157
- default: void 0
158
- },
159
- onSubmit: {
160
- type: Function,
161
- required: !0
162
- }
163
- },
164
- setup(e, t) {
165
- return () => i("form", {
166
- class: e.className,
167
- onSubmit: (t) => {
168
- t.preventDefault(), e.onSubmit();
169
- },
170
- "data-formie-definition": e.definition.handle,
171
- "data-formie-render-id": e.session.tokens.render
172
- }, t.slots.default?.() || []);
173
- }
174
- }), F = r({
175
- name: "FormieVueDefaultPage",
176
- props: {
177
- page: {
178
- type: Object,
179
- required: !0
180
- },
181
- state: {
182
- type: Object,
183
- required: !0
184
- }
185
- },
186
- setup(e, t) {
187
- return () => i("section", {
188
- "data-page-id": e.page.id,
189
- class: "formie-vue-page"
190
- }, t.slots.default?.() || []);
191
- }
192
- }), I = r({
193
- name: "FormieVueSignatureFieldInput",
194
- props: E,
195
- setup(e) {
196
- let t = D(), r = l(null), a = u(null), c = l(null), f = n(() => ie(e.field, t.state.value?.definition || { modules: [] }, "draw-signature")?.config), p = n(() => {
197
- let e = f.value?.options;
198
- return typeof e?.backgroundColor == "string" ? e.backgroundColor : "#ffffff";
199
- }), m = n(() => {
200
- let e = f.value?.options;
201
- return typeof e?.penColor == "string" ? e.penColor : "#000000";
202
- }), h = n(() => {
203
- let e = f.value?.options;
204
- return Number(e?.penWeight ?? 2) || 2;
205
- }), g = n(() => typeof e.value == "string" ? e.value : ""), _ = !1, v = () => void 0, y = () => void 0;
206
- return s(() => {
207
- (async () => {
208
- try {
209
- let t = r.value;
210
- if (!t) return;
211
- let { default: n } = await import("./signature_pad-69C-Dgt3.js");
212
- if (_) return;
213
- let i = new n(t, {
214
- backgroundColor: p.value,
215
- penColor: m.value,
216
- minWidth: h.value,
217
- maxWidth: h.value
218
- }), o = () => {
219
- let e = typeof window > "u" ? 1 : Math.max(window.devicePixelRatio || 1, 1), n = Math.max(1, Math.floor(t.clientWidth || 480)), r = t.getContext("2d");
220
- t.width = n * e, t.height = 192 * e, t.style.height = "192px", r && (r.setTransform(1, 0, 0, 1, 0, 0), r.scale(e, e)), i.clear();
221
- }, s = () => {
222
- e.setValue(i.isEmpty() ? "" : i.toDataURL());
223
- };
224
- o(), i.addEventListener?.("endStroke", s), v = () => {
225
- i.removeEventListener?.("endStroke", s);
226
- }, typeof window < "u" && (window.addEventListener("resize", o), y = () => {
227
- window.removeEventListener("resize", o);
228
- }), a.value = i, c.value = null;
229
- } catch (e) {
230
- _ || (c.value = e.message || "Unable to load signature support.");
231
- }
232
- })();
233
- }), o(() => {
234
- _ = !0, v(), y(), a.value = null;
235
- }), d(g, (e) => {
236
- let t = a.value;
237
- if (t) {
238
- if (!e) {
239
- t.isEmpty() || t.clear();
240
- return;
241
- }
242
- try {
243
- t.fromDataURL(e);
244
- } catch {}
245
- }
246
- }, { immediate: !0 }), () => i("div", { class: "formie-vue-signature" }, [
247
- i("canvas", {
248
- key: "canvas",
249
- ref: r,
250
- "data-formie-signature-canvas": !0,
251
- style: e.disabled ? { pointerEvents: "none" } : void 0
252
- }),
253
- i("button", {
254
- key: "clear",
255
- type: "button",
256
- disabled: e.disabled,
257
- "data-formie-signature-clear": !0,
258
- onClick: () => {
259
- a.value?.clear(), e.setValue("");
260
- }
261
- }, "Clear"),
262
- c.value ? i("div", {
263
- key: "error",
264
- class: "formie-vue-unsupported"
265
- }, c.value) : null
266
- ]);
267
- }
268
- }), L = r({
269
- name: "FormieVueCompositeFieldInput",
270
- props: E,
271
- setup(e) {
272
- let t = D();
273
- return () => {
274
- let n = t.state.value;
275
- if (!n) return null;
276
- let r = p(e.field), a = e.value && typeof e.value == "object" ? e.value : {};
277
- return r.length === 0 ? i("div", { class: "formie-vue-unsupported" }, `Unsupported field type: ${e.field.type}`) : i("div", { class: "formie-vue-name-grid" }, r.filter((e) => e.meta?.hidden !== !0).map((t) => {
278
- let r = `${e.errorKey}.${t.handle}`;
279
- return i(z, {
280
- key: `${e.field.id}:${t.handle}`,
281
- field: t,
282
- value: a[t.handle],
283
- errors: n.errors.fields[r] || [],
284
- errorKey: r,
285
- disabled: e.disabled || t.meta?.disabled === !0,
286
- hidden: !1,
287
- setValue(n) {
288
- e.setValue({
289
- ...a,
290
- [t.handle]: n
291
- });
292
- }
293
- });
294
- }));
295
- };
296
- }
297
- }), R = r({
298
- name: "FormieVueFileFieldInput",
299
- props: E,
300
- setup(e) {
301
- return () => {
302
- let t = e.field.input, n = Array.isArray(e.value) ? e.value : [], r = t.multiple === !0, a = n.map((e, t) => e && typeof e == "object" && "name" in e && typeof e.name == "string" ? e.name : e && typeof e == "object" && "filename" in e && typeof e.filename == "string" ? e.filename : e && typeof e == "object" && "assetId" in e && typeof e.assetId == "number" ? `Asset #${e.assetId}` : `File ${t + 1}`);
303
- return i("div", { class: "formie-vue-file" }, [i("input", {
304
- key: "input",
305
- type: "file",
306
- disabled: e.disabled,
307
- multiple: r,
308
- onChange: (t) => {
309
- let n = t.target;
310
- e.setValue(Array.from(n.files || []));
311
- }
312
- }), a.length > 0 ? i("ul", {
313
- key: "summary",
314
- class: "formie-vue-field-errors"
315
- }, a.map((e, t) => i("li", { key: `${e}:${t}` }, e))) : null]);
316
- };
317
- }
318
- }), z = r({
319
- name: "FormieVueConfigFieldNode",
320
- props: E,
321
- setup(e) {
322
- let t = D();
323
- return () => {
324
- let n = t.state.value;
325
- if (!n) return null;
326
- let r = n.fieldStates[e.field.id]?.hidden === !0;
327
- if (r) return null;
328
- let a = A(e.field), o = t.fieldComponents.value[e.field.type] || t.fieldComponents.value[a] || W;
329
- return i(t.components.value.Field || N, {
330
- field: e.field,
331
- errors: e.errors
332
- }, { default: () => [i(o, {
333
- field: e.field,
334
- value: e.value,
335
- errors: e.errors,
336
- errorKey: e.errorKey,
337
- disabled: e.disabled,
338
- hidden: r,
339
- setValue: e.setValue
340
- })] });
341
- };
342
- }
343
- }), B = r({
344
- name: "FormieVueConfigField",
345
- props: { field: {
346
- type: Object,
347
- required: !0
348
- } },
349
- setup(e) {
350
- let t = D();
351
- return () => {
352
- let n = t.state.value, r = t.instance.value;
353
- if (!n || !r) return null;
354
- let a = n.fieldStates[e.field.id];
355
- return i(z, {
356
- field: e.field,
357
- value: n.values[e.field.id],
358
- errors: n.errors.fields[e.field.id] || [],
359
- errorKey: e.field.id,
360
- disabled: a?.disabled === !0,
361
- hidden: a?.hidden === !0,
362
- setValue(t) {
363
- r.setValue(e.field.id, t);
364
- }
365
- });
366
- };
367
- }
368
- }), V = r({
369
- name: "FormieVueConfigRow",
370
- props: {
371
- row: {
372
- type: Object,
373
- required: !0
374
- },
375
- rowIndex: {
376
- type: Number,
377
- required: !0
378
- },
379
- values: {
380
- type: Object,
381
- default: void 0
382
- },
383
- errorPrefix: {
384
- type: String,
385
- default: void 0
386
- },
387
- disabled: {
388
- type: Boolean,
389
- default: !1
390
- },
391
- setFieldValue: {
392
- type: Function,
393
- default: void 0
394
- }
395
- },
396
- setup(e) {
397
- let t = D();
398
- return () => {
399
- let n = t.state.value;
400
- return n ? i("div", { class: "formie-vue-row" }, e.row.fields.map((t, r) => {
401
- if (!e.values || !e.setFieldValue) return i(B, {
402
- key: t.id || `${e.rowIndex}:${r}`,
403
- field: t
404
- });
405
- let a = `${e.errorPrefix}.${t.handle}`;
406
- return i(z, {
407
- key: t.id || `${e.rowIndex}:${r}`,
408
- field: t,
409
- value: e.values[t.handle],
410
- errors: n.errors.fields[a] || [],
411
- errorKey: a,
412
- disabled: e.disabled === !0 || n.fieldStates[t.id]?.disabled === !0,
413
- hidden: n.fieldStates[t.id]?.hidden === !0,
414
- setValue(n) {
415
- e.setFieldValue?.(t, n);
416
- }
417
- });
418
- })) : null;
419
- };
420
- }
421
- }), H = r({
422
- name: "FormieVueRepeaterFieldInput",
423
- props: E,
424
- setup(e) {
425
- let t = D();
426
- return () => {
427
- let n = t.state.value;
428
- if (!n) return null;
429
- let r = te(e.field), a = Array.isArray(e.value) ? e.value : [], o = e.field.input, s = Number(o.minRows ?? 0) || 0, c = Number(o.maxRows ?? 0) || 0, l = !e.disabled && (c <= 0 || a.length < c);
430
- return r.length === 0 ? i("div", { class: "formie-vue-unsupported" }, "Unsupported repeater field.") : i("div", {
431
- class: "formie-vue-repeater",
432
- "data-formie-repeater-container": !0
433
- }, [
434
- ...a.map((t, n) => {
435
- let o = `${e.field.id}:${n}`;
436
- return i("div", {
437
- key: o,
438
- class: "formie-vue-repeater-item",
439
- "data-formie-repeater-item": !0
440
- }, [...r.map((r, s) => i(V, {
441
- key: `${o}:${s}`,
442
- row: r,
443
- rowIndex: s,
444
- values: t,
445
- errorPrefix: `${e.errorKey}.${n}`,
446
- disabled: e.disabled,
447
- setFieldValue(t, r) {
448
- let i = a.map((e, i) => i === n ? {
449
- ...e,
450
- [t.handle]: r
451
- } : e);
452
- e.setValue(i);
453
- }
454
- })), i("button", {
455
- key: "remove",
456
- type: "button",
457
- disabled: e.disabled || s > 0 && a.length <= s,
458
- "data-formie-repeater-remove": !0,
459
- onClick: () => {
460
- e.setValue(a.filter((e, t) => t !== n));
461
- }
462
- }, "Remove")]);
463
- }),
464
- i("button", {
465
- key: "add",
466
- type: "button",
467
- disabled: !l,
468
- "data-formie-repeater-add": e.field.handle,
469
- onClick: () => {
470
- e.setValue([...a, g(e.field)]);
471
- }
472
- }, String(o.addLabel ?? "Add another row")),
473
- n.errors.fields[e.errorKey] && n.errors.fields[e.errorKey].length > 0 ? i("ul", {
474
- key: "errors",
475
- class: "formie-vue-field-errors"
476
- }, n.errors.fields[e.errorKey].map((e, t) => i("li", { key: `${e}:${t}` }, e))) : null
477
- ]);
478
- };
479
- }
114
+ const me = g({
115
+ name: "FormieVueDefaultErrorSummary",
116
+ props: {
117
+ errors: {
118
+ type: Array,
119
+ required: !0
120
+ }
121
+ },
122
+ setup(e) {
123
+ return () => e.errors.length === 0 ? null : u("div", {
124
+ class: "formie-vue-errors"
125
+ }, [
126
+ u("ul", null, e.errors.map((t, n) => u("li", {
127
+ key: `${t}:${n}`
128
+ }, t)))
129
+ ]);
130
+ }
131
+ }), ve = g({
132
+ name: "FormieVueDefaultField",
133
+ props: {
134
+ field: {
135
+ type: Object,
136
+ required: !0
137
+ },
138
+ errors: {
139
+ type: Array,
140
+ required: !0
141
+ }
142
+ },
143
+ setup(e, t) {
144
+ const n = h();
145
+ return () => {
146
+ const o = t.slots.default?.() || [];
147
+ return u("div", {
148
+ class: "formie-vue-field",
149
+ "data-field-type": e.field.type
150
+ }, [
151
+ e.field.label ? $(n, "label", u("label", {
152
+ class: "formie-vue-label"
153
+ }, e.field.label), {
154
+ class: "formie-vue-label"
155
+ }) : null,
156
+ e.field.instructions ? $(n, "instructions", u("div", {
157
+ class: "formie-vue-description"
158
+ }, e.field.instructions), {
159
+ class: "formie-vue-description"
160
+ }) : null,
161
+ $(n, "input", u("div", {
162
+ class: "formie-vue-input"
163
+ }, o), {
164
+ class: "formie-vue-input"
165
+ }),
166
+ e.errors.length > 0 ? $(n, "errors", u("ul", {
167
+ class: "formie-vue-field-errors"
168
+ }, e.errors.map((i, r) => u("li", {
169
+ key: `${i}:${r}`
170
+ }, i))), {
171
+ class: "formie-vue-field-errors"
172
+ }) : null
173
+ ]);
174
+ };
175
+ }
176
+ }), ye = g({
177
+ name: "FormieVueDefaultForm",
178
+ props: {
179
+ definition: {
180
+ type: Object,
181
+ required: !0
182
+ },
183
+ session: {
184
+ type: Object,
185
+ required: !0
186
+ },
187
+ state: {
188
+ type: Object,
189
+ required: !0
190
+ },
191
+ className: {
192
+ type: String,
193
+ default: void 0
194
+ },
195
+ onSubmit: {
196
+ type: Function,
197
+ required: !0
198
+ }
199
+ },
200
+ setup(e, t) {
201
+ return () => u("form", {
202
+ class: e.className,
203
+ onSubmit: (n) => {
204
+ n.preventDefault(), e.onSubmit();
205
+ },
206
+ "data-formie-definition": e.definition.handle,
207
+ "data-formie-render-id": e.session.tokens.render
208
+ }, t.slots.default?.() || []);
209
+ }
210
+ }), be = g({
211
+ name: "FormieVueDefaultPage",
212
+ props: {
213
+ page: {
214
+ type: Object,
215
+ required: !0
216
+ },
217
+ state: {
218
+ type: Object,
219
+ required: !0
220
+ }
221
+ },
222
+ setup(e, t) {
223
+ return () => u("section", {
224
+ "data-page-id": e.page.id,
225
+ class: "formie-vue-page"
226
+ }, t.slots.default?.() || []);
227
+ }
228
+ }), ge = g({
229
+ name: "FormieVueSignatureFieldInput",
230
+ props: w,
231
+ setup(e) {
232
+ const t = h(), n = k(null), o = x(null), i = k(null), r = m(() => fe(e.field, t.state.value?.definition || {
233
+ modules: []
234
+ }, "draw-signature")?.config), s = m(() => {
235
+ const l = r.value?.options;
236
+ return typeof l?.backgroundColor == "string" ? l.backgroundColor : "#ffffff";
237
+ }), a = m(() => {
238
+ const l = r.value?.options;
239
+ return typeof l?.penColor == "string" ? l.penColor : "#000000";
240
+ }), f = m(() => {
241
+ const l = r.value?.options;
242
+ return Number(l?.penWeight ?? 2) || 2;
243
+ }), d = m(() => typeof e.value == "string" ? e.value : "");
244
+ let c = !1, S = () => {
245
+ }, C = () => {
246
+ };
247
+ return G(() => {
248
+ (async () => {
249
+ try {
250
+ const v = n.value;
251
+ if (!v)
252
+ return;
253
+ const { default: y } = await import("./signature_pad-CKGlHEaq.js");
254
+ if (c)
255
+ return;
256
+ const p = new y(v, {
257
+ backgroundColor: s.value,
258
+ penColor: a.value,
259
+ minWidth: f.value,
260
+ maxWidth: f.value
261
+ }), R = () => {
262
+ const b = typeof window > "u" ? 1 : Math.max(window.devicePixelRatio || 1, 1), N = Math.max(1, Math.floor(v.clientWidth || 480)), E = 192, F = v.getContext("2d");
263
+ v.width = N * b, v.height = E * b, v.style.height = `${E}px`, F && (F.setTransform(1, 0, 0, 1, 0, 0), F.scale(b, b)), p.clear();
264
+ }, V = () => {
265
+ e.setValue(p.isEmpty() ? "" : p.toDataURL());
266
+ };
267
+ R(), p.addEventListener?.("endStroke", V), S = () => {
268
+ p.removeEventListener?.("endStroke", V);
269
+ }, typeof window < "u" && (window.addEventListener("resize", R), C = () => {
270
+ window.removeEventListener("resize", R);
271
+ }), o.value = p, i.value = null;
272
+ } catch (v) {
273
+ c || (i.value = v.message || "Unable to load signature support.");
274
+ }
275
+ })();
276
+ }), X(() => {
277
+ c = !0, S(), C(), o.value = null;
278
+ }), I(d, (l) => {
279
+ const v = o.value;
280
+ if (v) {
281
+ if (!l) {
282
+ v.isEmpty() || v.clear();
283
+ return;
284
+ }
285
+ try {
286
+ v.fromDataURL(l);
287
+ } catch {
288
+ }
289
+ }
290
+ }, { immediate: !0 }), () => u("div", {
291
+ class: "formie-vue-signature"
292
+ }, [
293
+ u("canvas", {
294
+ key: "canvas",
295
+ ref: n,
296
+ "data-formie-signature-canvas": !0,
297
+ style: e.disabled ? { pointerEvents: "none" } : void 0
298
+ }),
299
+ u("button", {
300
+ key: "clear",
301
+ type: "button",
302
+ disabled: e.disabled,
303
+ "data-formie-signature-clear": !0,
304
+ onClick: () => {
305
+ o.value?.clear(), e.setValue("");
306
+ }
307
+ }, "Clear"),
308
+ i.value ? u("div", {
309
+ key: "error",
310
+ class: "formie-vue-unsupported"
311
+ }, i.value) : null
312
+ ]);
313
+ }
314
+ }), Se = g({
315
+ name: "FormieVueCompositeFieldInput",
316
+ props: w,
317
+ setup(e) {
318
+ const t = h();
319
+ return () => {
320
+ const n = t.state.value;
321
+ if (!n)
322
+ return null;
323
+ const o = ue(e.field), i = e.value && typeof e.value == "object" ? e.value : {};
324
+ return o.length === 0 ? u("div", {
325
+ class: "formie-vue-unsupported"
326
+ }, `Unsupported field type: ${e.field.type}`) : u("div", {
327
+ class: "formie-vue-name-grid"
328
+ }, o.filter((r) => r.meta?.hidden !== !0).map((r) => {
329
+ const s = `${e.errorKey}.${r.handle}`;
330
+ return u(D, {
331
+ key: `${e.field.id}:${r.handle}`,
332
+ field: r,
333
+ value: i[r.handle],
334
+ errors: n.errors.fields[s] || [],
335
+ errorKey: s,
336
+ disabled: e.disabled || r.meta?.disabled === !0,
337
+ hidden: !1,
338
+ setValue(a) {
339
+ e.setValue({
340
+ ...i,
341
+ [r.handle]: a
342
+ });
343
+ }
344
+ });
345
+ }));
346
+ };
347
+ }
348
+ }), Fe = g({
349
+ name: "FormieVueFileFieldInput",
350
+ props: w,
351
+ setup(e) {
352
+ return () => {
353
+ const t = e.field.input, n = Array.isArray(e.value) ? e.value : [], o = t.multiple === !0, i = n.map((r, s) => r && typeof r == "object" && "name" in r && typeof r.name == "string" ? r.name : r && typeof r == "object" && "filename" in r && typeof r.filename == "string" ? r.filename : r && typeof r == "object" && "assetId" in r && typeof r.assetId == "number" ? `Asset #${r.assetId}` : `File ${s + 1}`);
354
+ return u("div", {
355
+ class: "formie-vue-file"
356
+ }, [
357
+ u("input", {
358
+ key: "input",
359
+ type: "file",
360
+ disabled: e.disabled,
361
+ multiple: o,
362
+ onChange: (r) => {
363
+ const s = r.target;
364
+ e.setValue(Array.from(s.files || []));
365
+ }
366
+ }),
367
+ i.length > 0 ? u("ul", {
368
+ key: "summary",
369
+ class: "formie-vue-field-errors"
370
+ }, i.map((r, s) => u("li", {
371
+ key: `${r}:${s}`
372
+ }, r))) : null
373
+ ]);
374
+ };
375
+ }
376
+ }), D = g({
377
+ name: "FormieVueConfigFieldNode",
378
+ props: w,
379
+ setup(e) {
380
+ const t = h();
381
+ return () => {
382
+ const n = t.state.value;
383
+ if (!n)
384
+ return null;
385
+ const i = n.fieldStates[e.field.id]?.hidden === !0;
386
+ if (i)
387
+ return null;
388
+ const r = _(e.field), s = t.fieldComponents.value[e.field.type] || t.fieldComponents.value[r] || Ce, a = t.components.value.Field || ve;
389
+ return u(a, {
390
+ field: e.field,
391
+ errors: e.errors
392
+ }, {
393
+ default: () => [
394
+ u(s, {
395
+ field: e.field,
396
+ value: e.value,
397
+ errors: e.errors,
398
+ errorKey: e.errorKey,
399
+ disabled: e.disabled,
400
+ hidden: i,
401
+ setValue: e.setValue
402
+ })
403
+ ]
404
+ });
405
+ };
406
+ }
407
+ }), he = g({
408
+ name: "FormieVueConfigField",
409
+ props: {
410
+ field: {
411
+ type: Object,
412
+ required: !0
413
+ }
414
+ },
415
+ setup(e) {
416
+ const t = h();
417
+ return () => {
418
+ const n = t.state.value, o = t.instance.value;
419
+ if (!n || !o)
420
+ return null;
421
+ const i = n.fieldStates[e.field.id];
422
+ return u(D, {
423
+ field: e.field,
424
+ value: n.values[e.field.id],
425
+ errors: n.errors.fields[e.field.id] || [],
426
+ errorKey: e.field.id,
427
+ disabled: i?.disabled === !0,
428
+ hidden: i?.hidden === !0,
429
+ setValue(r) {
430
+ o.setValue(e.field.id, r);
431
+ }
432
+ });
433
+ };
434
+ }
435
+ }), z = g({
436
+ name: "FormieVueConfigRow",
437
+ props: {
438
+ row: {
439
+ type: Object,
440
+ required: !0
441
+ },
442
+ rowIndex: {
443
+ type: Number,
444
+ required: !0
445
+ },
446
+ values: {
447
+ type: Object,
448
+ default: void 0
449
+ },
450
+ errorPrefix: {
451
+ type: String,
452
+ default: void 0
453
+ },
454
+ disabled: {
455
+ type: Boolean,
456
+ default: !1
457
+ },
458
+ setFieldValue: {
459
+ type: Function,
460
+ default: void 0
461
+ }
462
+ },
463
+ setup(e) {
464
+ const t = h();
465
+ return () => {
466
+ const n = t.state.value;
467
+ return n ? u("div", {
468
+ class: "formie-vue-row"
469
+ }, e.row.fields.map((o, i) => {
470
+ if (!e.values || !e.setFieldValue)
471
+ return u(he, {
472
+ key: o.id || `${e.rowIndex}:${i}`,
473
+ field: o
474
+ });
475
+ const r = `${e.errorPrefix}.${o.handle}`;
476
+ return u(D, {
477
+ key: o.id || `${e.rowIndex}:${i}`,
478
+ field: o,
479
+ value: e.values[o.handle],
480
+ errors: n.errors.fields[r] || [],
481
+ errorKey: r,
482
+ disabled: e.disabled === !0 || n.fieldStates[o.id]?.disabled === !0,
483
+ hidden: n.fieldStates[o.id]?.hidden === !0,
484
+ setValue(s) {
485
+ e.setFieldValue?.(o, s);
486
+ }
487
+ });
488
+ })) : null;
489
+ };
490
+ }
491
+ }), pe = g({
492
+ name: "FormieVueRepeaterFieldInput",
493
+ props: w,
494
+ setup(e) {
495
+ const t = h();
496
+ return () => {
497
+ const n = t.state.value;
498
+ if (!n)
499
+ return null;
500
+ const o = se(e.field), i = Array.isArray(e.value) ? e.value : [], r = e.field.input, s = Number(r.minRows ?? 0) || 0, a = Number(r.maxRows ?? 0) || 0, f = !e.disabled && (a <= 0 || i.length < a);
501
+ return o.length === 0 ? u("div", {
502
+ class: "formie-vue-unsupported"
503
+ }, "Unsupported repeater field.") : u("div", {
504
+ class: "formie-vue-repeater",
505
+ "data-formie-repeater-container": !0
506
+ }, [
507
+ ...i.map((d, c) => {
508
+ const S = `${e.field.id}:${c}`;
509
+ return u("div", {
510
+ key: S,
511
+ class: "formie-vue-repeater-item",
512
+ "data-formie-repeater-item": !0
513
+ }, [
514
+ ...o.map((C, l) => u(z, {
515
+ key: `${S}:${l}`,
516
+ row: C,
517
+ rowIndex: l,
518
+ values: d,
519
+ errorPrefix: `${e.errorKey}.${c}`,
520
+ disabled: e.disabled,
521
+ setFieldValue(v, y) {
522
+ const p = i.map((R, V) => V !== c ? R : {
523
+ ...R,
524
+ [v.handle]: y
525
+ });
526
+ e.setValue(p);
527
+ }
528
+ })),
529
+ u("button", {
530
+ key: "remove",
531
+ type: "button",
532
+ disabled: e.disabled || s > 0 && i.length <= s,
533
+ "data-formie-repeater-remove": !0,
534
+ onClick: () => {
535
+ e.setValue(i.filter((C, l) => l !== c));
536
+ }
537
+ }, "Remove")
538
+ ]);
539
+ }),
540
+ u("button", {
541
+ key: "add",
542
+ type: "button",
543
+ disabled: !f,
544
+ "data-formie-repeater-add": e.field.handle,
545
+ onClick: () => {
546
+ e.setValue([...i, le(e.field)]);
547
+ }
548
+ }, String(r.addLabel ?? "Add another row")),
549
+ n.errors.fields[e.errorKey] && n.errors.fields[e.errorKey].length > 0 ? u("ul", {
550
+ key: "errors",
551
+ class: "formie-vue-field-errors"
552
+ }, n.errors.fields[e.errorKey].map((d, c) => u("li", {
553
+ key: `${d}:${c}`
554
+ }, d))) : null
555
+ ]);
556
+ };
557
+ }
480
558
  });
481
- function U(e, t, n, r) {
482
- let a = e.input;
483
- if (e.type === "multi-line-text") return i("textarea", {
484
- value: typeof t == "string" ? t : "",
485
- disabled: n,
486
- placeholder: typeof a.placeholder == "string" ? a.placeholder : void 0,
487
- onInput: (e) => {
488
- let t = e.target;
489
- r(t.value);
490
- }
491
- });
492
- if (e.type === "dropdown") {
493
- let o = Array.isArray(a.options) ? a.options : [], s = a.multiple === !0;
494
- return i("select", {
495
- value: s ? void 0 : typeof t == "string" ? t : "",
496
- disabled: n,
497
- multiple: s,
498
- onChange: (e) => {
499
- let t = e.target;
500
- if (s) {
501
- r(Array.from(t.selectedOptions).map((e) => e.value));
502
- return;
503
- }
504
- r(t.value);
505
- }
506
- }, o.map((t) => {
507
- let n = String(t.value ?? "");
508
- return i("option", {
509
- key: `${e.id}:${n}`,
510
- value: n,
511
- disabled: t.disabled === !0
512
- }, String(t.label ?? n));
513
- }));
514
- }
515
- let o = typeof a.inputType == "string" ? a.inputType : e.type === "email" ? "email" : e.type === "phone" ? "tel" : e.type === "number" ? "number" : "text";
516
- return i("input", {
517
- type: o,
518
- value: typeof t == "string" || typeof t == "number" ? String(t) : "",
519
- disabled: n,
520
- placeholder: typeof a.placeholder == "string" ? a.placeholder : void 0,
521
- onInput: (e) => {
522
- let t = e.target;
523
- if (o === "number") {
524
- let e = t.valueAsNumber;
525
- r(Number.isFinite(e) ? e : "");
526
- return;
527
- }
528
- r(t.value);
529
- }
530
- });
559
+ function T(e, t, n, o) {
560
+ const i = e.input;
561
+ if (e.type === "multi-line-text")
562
+ return u("textarea", {
563
+ value: typeof t == "string" ? t : "",
564
+ disabled: n,
565
+ placeholder: typeof i.placeholder == "string" ? i.placeholder : void 0,
566
+ onInput: (s) => {
567
+ const a = s.target;
568
+ o(a.value);
569
+ }
570
+ });
571
+ if (e.type === "dropdown") {
572
+ const s = Array.isArray(i.options) ? i.options : [], a = i.multiple === !0;
573
+ return u("select", {
574
+ value: a ? void 0 : typeof t == "string" ? t : "",
575
+ disabled: n,
576
+ multiple: a,
577
+ onChange: (f) => {
578
+ const d = f.target;
579
+ if (a) {
580
+ o(Array.from(d.selectedOptions).map((c) => c.value));
581
+ return;
582
+ }
583
+ o(d.value);
584
+ }
585
+ }, s.map((f) => {
586
+ const d = String(f.value ?? "");
587
+ return u("option", {
588
+ key: `${e.id}:${d}`,
589
+ value: d,
590
+ disabled: f.disabled === !0
591
+ }, String(f.label ?? d));
592
+ }));
593
+ }
594
+ const r = typeof i.inputType == "string" ? i.inputType : e.type === "email" ? "email" : e.type === "phone" ? "tel" : e.type === "number" ? "number" : "text";
595
+ return u("input", {
596
+ type: r,
597
+ value: typeof t == "string" || typeof t == "number" ? String(t) : "",
598
+ disabled: n,
599
+ placeholder: typeof i.placeholder == "string" ? i.placeholder : void 0,
600
+ onInput: (s) => {
601
+ const a = s.target;
602
+ if (r === "number") {
603
+ const f = a.valueAsNumber;
604
+ o(Number.isFinite(f) ? f : "");
605
+ return;
606
+ }
607
+ o(a.value);
608
+ }
609
+ });
531
610
  }
532
- var W = r({
533
- name: "FormieVueDefaultFieldInput",
534
- props: E,
535
- setup(e) {
536
- return () => {
537
- let t = e.field.input, n = A(e.field);
538
- if (v(e.field)) return i(L, e);
539
- if (x(e.field)) return i(H, e);
540
- if (y(e.field)) return i(R, e);
541
- if (n === "signature") return i(I, e);
542
- if (n === "multi-line-text" || n === "dropdown") return U(e.field, e.value, e.disabled, e.setValue);
543
- if (n === "radio") return i("div", { class: "formie-vue-choices" }, (Array.isArray(t.options) ? t.options : []).map((t) => {
544
- let n = String(t.value ?? "");
545
- return i("label", { key: `${e.field.id}:${n}` }, [i("input", {
546
- key: "input",
547
- type: "radio",
548
- checked: e.value === n,
549
- disabled: e.disabled,
550
- onChange: () => {
551
- e.setValue(n);
552
- }
553
- }), i("span", { key: "label" }, String(t.label ?? n))]);
554
- }));
555
- if (n === "checkboxes") {
556
- let n = Array.isArray(t.options) ? t.options : [], r = Array.isArray(e.value) ? e.value.map((e) => String(e)) : [];
557
- return i("div", { class: "formie-vue-choices" }, n.map((t) => {
558
- let n = String(t.value ?? ""), a = r.includes(n);
559
- return i("label", { key: `${e.field.id}:${n}` }, [i("input", {
560
- key: "input",
561
- type: "checkbox",
562
- checked: a,
563
- disabled: e.disabled,
564
- onChange: () => {
565
- let t = a ? r.filter((e) => e !== n) : [...r, n];
566
- e.setValue(t);
567
- }
568
- }), i("span", { key: "label" }, String(t.label ?? n))]);
569
- }));
570
- }
571
- if (n === "agree") {
572
- let n = typeof t.descriptionHtml == "string" ? t.descriptionHtml : null;
573
- return i("label", { class: "formie-vue-boolean" }, [i("input", {
574
- key: "input",
575
- type: "checkbox",
576
- checked: e.value === !0,
577
- disabled: e.disabled,
578
- onChange: (t) => {
579
- let n = t.target;
580
- e.setValue(n.checked);
581
- }
582
- }), n ? i("span", {
583
- key: "description",
584
- innerHTML: n
585
- }) : i("span", { key: "description" }, e.field.label)]);
586
- }
587
- return b(n) ? U(e.field, e.value, e.disabled, e.setValue) : i("div", { class: "formie-vue-unsupported" }, `Unsupported field type: ${String(e.field.meta?.fieldType ?? e.field.type)}`);
588
- };
589
- }
590
- }), G = r({
591
- name: "FormieVueConfigPageActions",
592
- setup() {
593
- let e = D();
594
- return () => {
595
- let t = e.state.value, n = e.instance.value;
596
- if (!t || !n) return null;
597
- let r = t.definition.pages.find((e) => e.id === t.currentPageId);
598
- if (!r) return null;
599
- let a = [];
600
- return r.actions.secondary.forEach((e) => {
601
- a.push(i("button", {
602
- key: e.type,
603
- type: "button",
604
- onClick: () => {
605
- n.submit(e.type);
606
- }
607
- }, e.label));
608
- }), a.push(i("button", {
609
- key: r.actions.primary.type,
610
- type: "submit"
611
- }, r.actions.primary.label)), i("div", { class: "formie-page-actions" }, a);
612
- };
613
- }
614
- }), K = r({
615
- name: "FormieVueConfigRenderer",
616
- props: { className: {
617
- type: String,
618
- default: void 0
619
- } },
620
- setup(e) {
621
- let t = D();
622
- return () => {
623
- let n = t.instance.value, r = t.state.value;
624
- if (!n || !r) return null;
625
- let a = t.components.value.Form || P, o = t.components.value.Page || F, s = t.components.value.ErrorSummary || M, c = r.definition.pages.find((e) => e.id === r.currentPageId && r.pageStates[e.id]?.hidden !== !0) || r.definition.pages.find((e) => r.pageStates[e.id]?.hidden !== !0) || r.definition.pages[0], l = r.lastSubmitResult?.messages.error, u = !!l && !r.errors.form.includes(l);
626
- return c ? i(a, {
627
- definition: r.definition,
628
- session: r.session,
629
- state: r,
630
- className: e.className,
631
- onSubmit: () => {
632
- n.submit();
633
- }
634
- }, { default: () => [
635
- i(s, {
636
- key: "errors",
637
- errors: r.errors.form
638
- }),
639
- r.lastSubmitResult?.messages.notice ? i("div", {
640
- key: "notice",
641
- class: "formie-vue-notice"
642
- }, r.lastSubmitResult.messages.notice) : null,
643
- u ? i("div", {
644
- key: "error",
645
- class: "formie-vue-error"
646
- }, l) : null,
647
- i(o, {
648
- key: c.id,
649
- page: c,
650
- state: r
651
- }, { default: () => [...c.rows.map((e, t) => i(V, {
652
- key: `${c.id}:${t}`,
653
- row: e,
654
- rowIndex: t
655
- })), i(G, { key: "actions" })] })
656
- ] }) : null;
657
- };
658
- }
659
- }), q = {
660
- source: {
661
- type: Object,
662
- required: !0
663
- },
664
- components: {
665
- type: Object,
666
- default: () => ({})
667
- },
668
- fieldComponents: {
669
- type: Object,
670
- default: () => ({})
671
- },
672
- slots: {
673
- type: Object,
674
- default: () => ({})
675
- },
676
- className: {
677
- type: String,
678
- default: void 0
679
- },
680
- onMount: {
681
- type: Function,
682
- default: void 0
683
- },
684
- onReady: {
685
- type: Function,
686
- default: void 0
687
- },
688
- onUnmount: {
689
- type: Function,
690
- default: void 0
691
- },
692
- onResult: {
693
- type: Function,
694
- default: void 0
695
- },
696
- onSuccess: {
697
- type: Function,
698
- default: void 0
699
- },
700
- onError: {
701
- type: Function,
702
- default: void 0
703
- },
704
- onSubmitResult: {
705
- type: Function,
706
- default: void 0
707
- },
708
- onSubmitSuccess: {
709
- type: Function,
710
- default: void 0
711
- },
712
- onSubmitError: {
713
- type: Function,
714
- default: void 0
715
- },
716
- onEvent: {
717
- type: Function,
718
- default: void 0
719
- }
611
+ const Ce = g({
612
+ name: "FormieVueDefaultFieldInput",
613
+ props: w,
614
+ setup(e) {
615
+ return () => {
616
+ const t = e.field.input, n = _(e.field);
617
+ if (oe(e.field))
618
+ return u(Se, e);
619
+ if (ie(e.field))
620
+ return u(pe, e);
621
+ if (re(e.field))
622
+ return u(Fe, e);
623
+ if (n === "signature")
624
+ return u(ge, e);
625
+ if (n === "multi-line-text" || n === "dropdown")
626
+ return T(e.field, e.value, e.disabled, e.setValue);
627
+ if (n === "radio") {
628
+ const o = Array.isArray(t.options) ? t.options : [];
629
+ return u("div", {
630
+ class: "formie-vue-choices"
631
+ }, o.map((i) => {
632
+ const r = String(i.value ?? "");
633
+ return u("label", {
634
+ key: `${e.field.id}:${r}`
635
+ }, [
636
+ u("input", {
637
+ key: "input",
638
+ type: "radio",
639
+ checked: e.value === r,
640
+ disabled: e.disabled,
641
+ onChange: () => {
642
+ e.setValue(r);
643
+ }
644
+ }),
645
+ u("span", {
646
+ key: "label"
647
+ }, String(i.label ?? r))
648
+ ]);
649
+ }));
650
+ }
651
+ if (n === "checkboxes") {
652
+ const o = Array.isArray(t.options) ? t.options : [], i = Array.isArray(e.value) ? e.value.map((r) => String(r)) : [];
653
+ return u("div", {
654
+ class: "formie-vue-choices"
655
+ }, o.map((r) => {
656
+ const s = String(r.value ?? ""), a = i.includes(s);
657
+ return u("label", {
658
+ key: `${e.field.id}:${s}`
659
+ }, [
660
+ u("input", {
661
+ key: "input",
662
+ type: "checkbox",
663
+ checked: a,
664
+ disabled: e.disabled,
665
+ onChange: () => {
666
+ const f = a ? i.filter((d) => d !== s) : [...i, s];
667
+ e.setValue(f);
668
+ }
669
+ }),
670
+ u("span", {
671
+ key: "label"
672
+ }, String(r.label ?? s))
673
+ ]);
674
+ }));
675
+ }
676
+ if (n === "agree") {
677
+ const o = typeof t.descriptionHtml == "string" ? t.descriptionHtml : null;
678
+ return u("label", {
679
+ class: "formie-vue-boolean"
680
+ }, [
681
+ u("input", {
682
+ key: "input",
683
+ type: "checkbox",
684
+ checked: e.value === !0,
685
+ disabled: e.disabled,
686
+ onChange: (i) => {
687
+ const r = i.target;
688
+ e.setValue(r.checked);
689
+ }
690
+ }),
691
+ o ? u("span", {
692
+ key: "description",
693
+ innerHTML: o
694
+ }) : u("span", {
695
+ key: "description"
696
+ }, e.field.label)
697
+ ]);
698
+ }
699
+ return U(n) ? T(e.field, e.value, e.disabled, e.setValue) : u("div", {
700
+ class: "formie-vue-unsupported"
701
+ }, `Unsupported field type: ${String(e.field.meta?.fieldType ?? e.field.type)}`);
702
+ };
703
+ }
704
+ }), Ee = g({
705
+ name: "FormieVueConfigPageActions",
706
+ setup() {
707
+ const e = h();
708
+ return () => {
709
+ const t = e.state.value, n = e.instance.value;
710
+ if (!t || !n)
711
+ return null;
712
+ const o = t.definition.pages.find((r) => r.id === t.currentPageId);
713
+ if (!o)
714
+ return null;
715
+ const i = [];
716
+ return o.actions.secondary.forEach((r) => {
717
+ i.push(u("button", {
718
+ key: r.type,
719
+ type: "button",
720
+ onClick: () => {
721
+ n.submit(r.type);
722
+ }
723
+ }, r.label));
724
+ }), i.push(u("button", {
725
+ key: o.actions.primary.type,
726
+ type: "submit"
727
+ }, o.actions.primary.label)), u("div", {
728
+ class: "formie-page-actions"
729
+ }, i);
730
+ };
731
+ }
732
+ }), Re = g({
733
+ name: "FormieVueConfigRenderer",
734
+ props: {
735
+ className: {
736
+ type: String,
737
+ default: void 0
738
+ }
739
+ },
740
+ setup(e) {
741
+ const t = h();
742
+ return () => {
743
+ const n = t.instance.value, o = t.state.value;
744
+ if (!n || !o)
745
+ return null;
746
+ const i = t.components.value.Form || ye, r = t.components.value.Page || be, s = t.components.value.ErrorSummary || me, a = o.definition.pages.find((c) => c.id === o.currentPageId && o.pageStates[c.id]?.hidden !== !0) || o.definition.pages.find((c) => o.pageStates[c.id]?.hidden !== !0) || o.definition.pages[0], f = o.lastSubmitResult?.messages.error, d = !!f && !o.errors.form.includes(f);
747
+ return a ? u(i, {
748
+ definition: o.definition,
749
+ session: o.session,
750
+ state: o,
751
+ className: e.className,
752
+ onSubmit: () => {
753
+ n.submit();
754
+ }
755
+ }, {
756
+ default: () => [
757
+ u(s, {
758
+ key: "errors",
759
+ errors: o.errors.form
760
+ }),
761
+ o.lastSubmitResult?.messages.notice ? u("div", {
762
+ key: "notice",
763
+ class: "formie-vue-notice"
764
+ }, o.lastSubmitResult.messages.notice) : null,
765
+ d ? u("div", {
766
+ key: "error",
767
+ class: "formie-vue-error"
768
+ }, f) : null,
769
+ u(r, {
770
+ key: a.id,
771
+ page: a,
772
+ state: o
773
+ }, {
774
+ default: () => [
775
+ ...a.rows.map((c, S) => u(z, {
776
+ key: `${a.id}:${S}`,
777
+ row: c,
778
+ rowIndex: S
779
+ })),
780
+ u(Ee, {
781
+ key: "actions"
782
+ })
783
+ ]
784
+ })
785
+ ]
786
+ }) : null;
787
+ };
788
+ }
789
+ }), Ve = {
790
+ source: {
791
+ type: Object,
792
+ required: !0
793
+ },
794
+ components: {
795
+ type: Object,
796
+ default: () => ({})
797
+ },
798
+ fieldComponents: {
799
+ type: Object,
800
+ default: () => ({})
801
+ },
802
+ slots: {
803
+ type: Object,
804
+ default: () => ({})
805
+ },
806
+ className: {
807
+ type: String,
808
+ default: void 0
809
+ },
810
+ onMount: {
811
+ type: Function,
812
+ default: void 0
813
+ },
814
+ onReady: {
815
+ type: Function,
816
+ default: void 0
817
+ },
818
+ onUnmount: {
819
+ type: Function,
820
+ default: void 0
821
+ },
822
+ onResult: {
823
+ type: Function,
824
+ default: void 0
825
+ },
826
+ onSuccess: {
827
+ type: Function,
828
+ default: void 0
829
+ },
830
+ onError: {
831
+ type: Function,
832
+ default: void 0
833
+ },
834
+ onSubmitResult: {
835
+ type: Function,
836
+ default: void 0
837
+ },
838
+ onSubmitSuccess: {
839
+ type: Function,
840
+ default: void 0
841
+ },
842
+ onSubmitError: {
843
+ type: Function,
844
+ default: void 0
845
+ },
846
+ onEvent: {
847
+ type: Function,
848
+ default: void 0
849
+ }
720
850
  };
721
- function J(e, t, ...n) {
722
- e?.(...n), t && t !== e && t(...n);
851
+ function O(e, t, ...n) {
852
+ e?.(...n), t && t !== e && t(...n);
723
853
  }
724
- var Y = r({
725
- name: "FormieVueDefinitionFormView",
726
- props: q,
727
- emits: [
728
- "mount",
729
- "ready",
730
- "unmount",
731
- "result",
732
- "success",
733
- "error",
734
- "submit-result",
735
- "submit-success",
736
- "submit-error",
737
- "event"
738
- ],
739
- setup(e, { emit: t }) {
740
- let r = u(null), a = u(null), o = l(null), s = {
741
- instance: r,
742
- state: a,
743
- components: n(() => e.components || {}),
744
- fieldComponents: n(() => e.fieldComponents || {}),
745
- slots: n(() => e.slots || {})
746
- }, p = n(() => w(e.source));
747
- return c(T, s), d(p, (n, i, s) => {
748
- let c = !1, l = () => void 0;
749
- (async () => {
750
- try {
751
- let n = m({
752
- envelope: await k(e.source),
753
- transport: ne(e.source)
754
- });
755
- if (c) {
756
- await n.destroy();
757
- return;
758
- }
759
- o.value = null, r.value = n, a.value = n.getState(), e.onMount?.(n), e.onReady?.(n), t("mount", n), t("ready", n);
760
- let i = [
761
- n.subscribe((e) => {
762
- a.value = e;
763
- }),
764
- n.on("formie:submit:result", (n) => {
765
- let r = n;
766
- J(e.onSubmitResult, e.onResult, r), t("result", r), t("submit-result", r), r.success ? (J(e.onSubmitSuccess, e.onSuccess, r), t("success", r), t("submit-success", r)) : (J(e.onSubmitError, e.onError, r), t("error", r), t("submit-error", r));
767
- }),
768
- ...f.map((r) => n.on(r, (n) => {
769
- let i = {
770
- name: r,
771
- payload: n
772
- };
773
- e.onEvent?.(i), t("event", i);
774
- }))
775
- ];
776
- l = () => {
777
- i.forEach((e) => e()), n.destroy(), r.value === n && (r.value = null, a.value = null), e.onUnmount?.(), t("unmount");
778
- };
779
- } catch (e) {
780
- c || (o.value = e);
781
- }
782
- })(), s(() => {
783
- c = !0, l();
784
- });
785
- }, { immediate: !0 }), () => o.value ? i("div", { class: "formie-vue-error" }, o.value.message) : !r.value || !a.value ? i("div", { class: "formie-vue-loading" }, "Loading form...") : i(K, { className: e.className });
786
- }
854
+ const ke = g({
855
+ name: "FormieVueDefinitionFormView",
856
+ props: Ve,
857
+ emits: ["mount", "ready", "unmount", "result", "success", "error", "submit-result", "submit-success", "submit-error", "event"],
858
+ setup(e, { emit: t }) {
859
+ const n = x(null), o = x(null), i = k(null), r = m(() => e.components || {}), s = m(() => e.fieldComponents || {}), a = m(() => e.slots || {}), f = {
860
+ instance: n,
861
+ state: o,
862
+ components: r,
863
+ fieldComponents: s,
864
+ slots: a
865
+ }, d = m(() => q(e.source));
866
+ return W(K, f), I(d, (c, S, C) => {
867
+ let l = !1, v = null, y = () => {
868
+ };
869
+ (async () => {
870
+ try {
871
+ const R = await ae(e.source), V = de(e.source), b = Q({
872
+ envelope: R,
873
+ transport: V
874
+ });
875
+ if (l) {
876
+ await b.destroy();
877
+ return;
878
+ }
879
+ v = b, i.value = null, n.value = b, o.value = b.getState(), e.onMount?.(b), e.onReady?.(b), t("mount", b), t("ready", b);
880
+ const N = [
881
+ b.subscribe((E) => {
882
+ o.value = E;
883
+ }),
884
+ b.on("formie:submit:result", (E) => {
885
+ const F = E;
886
+ O(e.onSubmitResult, e.onResult, F), t("result", F), t("submit-result", F), F.success ? (O(e.onSubmitSuccess, e.onSuccess, F), t("success", F), t("submit-success", F)) : (O(e.onSubmitError, e.onError, F), t("error", F), t("submit-error", F));
887
+ }),
888
+ ...Y.map((E) => b.on(E, (F) => {
889
+ const H = {
890
+ name: E,
891
+ payload: F
892
+ };
893
+ e.onEvent?.(H), t("event", H);
894
+ }))
895
+ ];
896
+ y = () => {
897
+ N.forEach((E) => E()), b.destroy(), n.value === b && (n.value = null, o.value = null), e.onUnmount?.(), t("unmount");
898
+ };
899
+ } catch (R) {
900
+ l || (i.value = R);
901
+ }
902
+ })(), C(() => {
903
+ l = !0, y();
904
+ });
905
+ }, { immediate: !0 }), () => i.value ? u("div", {
906
+ class: "formie-vue-error"
907
+ }, i.value.message) : !n.value || !o.value ? u("div", {
908
+ class: "formie-vue-loading"
909
+ }, "Loading form...") : u(Re, {
910
+ className: e.className
911
+ });
912
+ }
787
913
  });
788
- function ae() {
789
- let e = D();
790
- return {
791
- definition: n(() => e.state.value?.definition || null),
792
- session: n(() => e.state.value?.session || null),
793
- state: e.state,
794
- instance: e.instance
795
- };
914
+ function He() {
915
+ const e = h();
916
+ return {
917
+ definition: m(() => e.state.value?.definition || null),
918
+ session: m(() => e.state.value?.session || null),
919
+ state: e.state,
920
+ instance: e.instance
921
+ };
796
922
  }
797
- function oe(e) {
798
- let t = D(), r = n(() => {
799
- let n = t.state.value?.definition;
800
- return n && re(n).find((t) => t.id === e) || null;
801
- });
802
- return {
803
- field: r,
804
- value: n(() => t.state.value?.values[e]),
805
- errors: n(() => t.state.value?.errors.fields[e] || []),
806
- hidden: n(() => t.state.value?.fieldStates[e]?.hidden === !0),
807
- disabled: n(() => t.state.value?.fieldStates[e]?.disabled === !0),
808
- setValue(e) {
809
- !r.value || !t.instance.value || t.instance.value.setValue(r.value.id, e);
810
- }
811
- };
923
+ function Te(e) {
924
+ const t = h(), n = m(() => {
925
+ const o = t.state.value?.definition;
926
+ return o && ce(o).find((i) => i.id === e) || null;
927
+ });
928
+ return {
929
+ field: n,
930
+ value: m(() => t.state.value?.values[e]),
931
+ errors: m(() => t.state.value?.errors.fields[e] || []),
932
+ hidden: m(() => t.state.value?.fieldStates[e]?.hidden === !0),
933
+ disabled: m(() => t.state.value?.fieldStates[e]?.disabled === !0),
934
+ setValue(o) {
935
+ !n.value || !t.instance.value || t.instance.value.setValue(n.value.id, o);
936
+ }
937
+ };
812
938
  }
813
- function se(e) {
814
- let t = D();
815
- return {
816
- page: n(() => t.state.value?.definition.pages.find((t) => t.id === e) || null),
817
- isCurrent: n(() => t.state.value?.currentPageId === e),
818
- hidden: n(() => t.state.value?.pageStates[e]?.hidden === !0)
819
- };
939
+ function Pe(e) {
940
+ const t = h();
941
+ return {
942
+ page: m(() => t.state.value?.definition.pages.find((n) => n.id === e) || null),
943
+ isCurrent: m(() => t.state.value?.currentPageId === e),
944
+ hidden: m(() => t.state.value?.pageStates[e]?.hidden === !0)
945
+ };
820
946
  }
821
- function ce() {
822
- return D().instance;
947
+ function Ue() {
948
+ return h().instance;
823
949
  }
824
- function le(e) {
825
- let t = D();
826
- return n(() => t.slots.value[e] || null);
950
+ function Ke(e) {
951
+ const t = h();
952
+ return m(() => t.slots.value[e] || null);
827
953
  }
828
- //#endregion
829
- //#region src/index.ts
830
- function X(e) {
831
- return !!e && "payload" in e;
954
+ function P(e) {
955
+ return !!e && "payload" in e;
832
956
  }
833
- function ue(e) {
834
- return "success" in e ? e.success : e.ok;
957
+ function we(e) {
958
+ return "success" in e ? e.success : e.ok;
835
959
  }
836
- function Z(e, t, ...n) {
837
- e?.(...n), t && t !== e && t(...n);
960
+ function j(e, t, ...n) {
961
+ e?.(...n), t && t !== e && t(...n);
838
962
  }
839
- function de(e) {
840
- let t = e.transport;
841
- if (!t && !X(e.source)) throw Error("`transport` is required for <FormieForm>.");
842
- return {
843
- mode: "server-rendered",
844
- transport: t,
845
- endpoint: e.endpoint,
846
- formHandle: e.formHandle,
847
- payload: X(e.source) ? e.source.payload : void 0,
848
- staticCache: e.staticCache,
849
- refreshTokens: e.refreshTokens,
850
- locale: e.locale,
851
- siteId: e.siteId,
852
- autoVisible: e.autoVisible,
853
- theme: e.theme,
854
- themeConfig: e.themeConfig
855
- };
963
+ function $e(e) {
964
+ const t = e.transport;
965
+ if (!t && !P(e.source))
966
+ throw new Error("`transport` is required for <FormieForm>.");
967
+ return {
968
+ mode: "server-rendered",
969
+ transport: t,
970
+ endpoint: e.endpoint,
971
+ formHandle: e.formHandle,
972
+ payload: P(e.source) ? e.source.payload : void 0,
973
+ staticCache: e.staticCache,
974
+ refreshTokens: e.refreshTokens,
975
+ locale: e.locale,
976
+ siteId: e.siteId,
977
+ autoVisible: e.autoVisible,
978
+ theme: e.theme,
979
+ themeConfig: e.themeConfig
980
+ };
856
981
  }
857
- function fe(e) {
858
- if (e.source) return e.source;
859
- let t = e.transport, n = e.endpoint, r = e.formHandle;
860
- if (t !== "rest" && t !== "graphql") throw Error("Vue client-rendered forms require `transport=\"rest\"` or `transport=\"graphql\"`.");
861
- if (!n || !r) throw Error("Vue client-rendered forms require either `source` or both `endpoint` and `formHandle`.");
862
- return {
863
- transport: t,
864
- endpoint: n,
865
- formHandle: r,
866
- siteId: e.siteId
867
- };
982
+ function xe(e) {
983
+ if (e.source)
984
+ return e.source;
985
+ const t = e.transport, n = e.endpoint, o = e.formHandle;
986
+ if (t !== "rest" && t !== "graphql")
987
+ throw new Error('Vue client-rendered forms require `transport="rest"` or `transport="graphql"`.');
988
+ if (!n || !o)
989
+ throw new Error("Vue client-rendered forms require either `source` or both `endpoint` and `formHandle`.");
990
+ return {
991
+ transport: t,
992
+ endpoint: n,
993
+ formHandle: o,
994
+ siteId: e.siteId
995
+ };
868
996
  }
869
- function pe() {
870
- return t();
997
+ function Le() {
998
+ return A();
871
999
  }
872
- function Q() {
873
- return t();
1000
+ function Ie() {
1001
+ return A();
874
1002
  }
875
- function $(e) {
876
- let t = Q(), r = l(null), i = u(null), a = l(null);
877
- return d([r, n(() => w(e))], ([n], r, o) => {
878
- if (!n) return;
879
- let s = !1, c = !1, l = async () => {
880
- c || (c = !0, await t.unmount(n));
881
- }, u = Promise.resolve().then(async () => {
882
- if (!s) try {
883
- let r = await t.mount(n, {
884
- ...e,
885
- mode: "server-rendered"
886
- });
887
- if (s) {
888
- await l();
889
- return;
890
- }
891
- i.value = r, a.value = null;
892
- } catch (e) {
893
- s || (a.value = e);
894
- }
895
- });
896
- o(() => {
897
- s = !0, i.value = null, u.finally(l);
898
- });
899
- }, { immediate: !0 }), {
900
- rootRef: r,
901
- state: {
902
- instance: i,
903
- isMounted: n(() => !!i.value),
904
- error: a
905
- },
906
- submit: async (e = "submit") => i.value ? i.value.submit(e) : null
907
- };
1003
+ function _e(e) {
1004
+ const t = Ie(), n = k(null), o = x(null), i = k(null), r = m(() => q(e));
1005
+ return I([n, r], ([s], a, f) => {
1006
+ if (!s)
1007
+ return;
1008
+ let d = !1, c = !1;
1009
+ const S = async () => {
1010
+ c || (c = !0, await t.unmount(s));
1011
+ }, C = Promise.resolve().then(async () => {
1012
+ if (!d)
1013
+ try {
1014
+ const l = await t.mount(s, {
1015
+ ...e,
1016
+ mode: "server-rendered"
1017
+ });
1018
+ if (d) {
1019
+ await S();
1020
+ return;
1021
+ }
1022
+ o.value = l, i.value = null;
1023
+ } catch (l) {
1024
+ d || (i.value = l);
1025
+ }
1026
+ });
1027
+ f(() => {
1028
+ d = !0, o.value = null, C.finally(S);
1029
+ });
1030
+ }, { immediate: !0 }), {
1031
+ rootRef: n,
1032
+ state: {
1033
+ instance: o,
1034
+ isMounted: m(() => !!o.value),
1035
+ error: i
1036
+ },
1037
+ submit: async (s = "submit") => o.value ? o.value.submit(s) : null
1038
+ };
908
1039
  }
909
- var me = r({
910
- name: "FormieVueHtmlFormView",
911
- props: { options: {
912
- type: Object,
913
- required: !0
914
- } },
915
- emits: [
916
- "mount",
917
- "ready",
918
- "unmount",
919
- "result",
920
- "success",
921
- "error",
922
- "submit-result",
923
- "submit-success",
924
- "submit-error",
925
- "event"
926
- ],
927
- setup(r, { emit: a }) {
928
- let o = l(null), s = t(), c = n(() => de(r.options));
929
- return d([o, n(() => w(c.value))], ([t], n, i) => {
930
- if (!t) return;
931
- let o = !1, l = null, u = [], d = Promise.resolve().then(async () => {
932
- let n = await s.mount(t, c.value);
933
- if (o) {
934
- await s.unmount(t);
935
- return;
936
- }
937
- l = n, r.options.onMount?.(n), r.options.onReady?.(n), a("mount", n), a("ready", n), u.push(n.on("formie:submit:result", (e) => {
938
- let t = e;
939
- Z(r.options.onSubmitResult, r.options.onResult, t), a("result", t), a("submit-result", t), ue(t) ? (Z(r.options.onSubmitSuccess, r.options.onSuccess, t), a("success", t), a("submit-success", t)) : (Z(r.options.onSubmitError, r.options.onError, t), a("error", t), a("submit-error", t));
940
- })), e.forEach((e) => {
941
- u.push(n.on(e, (t) => {
942
- let n = {
943
- name: e,
944
- payload: t
945
- };
946
- r.options.onEvent?.(n), a("event", n);
947
- }));
948
- });
949
- });
950
- i(() => {
951
- o = !0, u.forEach((e) => e()), d.finally(async () => {
952
- await s.unmount(t), l &&= (r.options.onUnmount?.(), a("unmount"), null);
953
- });
954
- });
955
- }, { immediate: !0 }), () => i("div", {
956
- ref: o,
957
- class: r.options.className
958
- });
959
- }
960
- }), he = {
961
- source: {
962
- type: Object,
963
- default: void 0
964
- },
965
- transport: {
966
- type: String,
967
- default: void 0
968
- },
969
- endpoint: {
970
- type: String,
971
- default: void 0
972
- },
973
- formHandle: {
974
- type: String,
975
- default: void 0
976
- },
977
- staticCache: {
978
- type: Boolean,
979
- default: void 0
980
- },
981
- refreshTokens: {
982
- type: Boolean,
983
- default: void 0
984
- },
985
- locale: {
986
- type: String,
987
- default: void 0
988
- },
989
- siteId: {
990
- type: Number,
991
- default: void 0
992
- },
993
- autoVisible: {
994
- type: Boolean,
995
- default: void 0
996
- },
997
- theme: {
998
- type: String,
999
- default: void 0
1000
- },
1001
- themeConfig: {
1002
- type: Object,
1003
- default: void 0
1004
- },
1005
- className: {
1006
- type: String,
1007
- default: void 0
1008
- },
1009
- onMount: {
1010
- type: Function,
1011
- default: void 0
1012
- },
1013
- onReady: {
1014
- type: Function,
1015
- default: void 0
1016
- },
1017
- onUnmount: {
1018
- type: Function,
1019
- default: void 0
1020
- },
1021
- onResult: {
1022
- type: Function,
1023
- default: void 0
1024
- },
1025
- onSuccess: {
1026
- type: Function,
1027
- default: void 0
1028
- },
1029
- onError: {
1030
- type: Function,
1031
- default: void 0
1032
- },
1033
- onSubmitResult: {
1034
- type: Function,
1035
- default: void 0
1036
- },
1037
- onSubmitSuccess: {
1038
- type: Function,
1039
- default: void 0
1040
- },
1041
- onSubmitError: {
1042
- type: Function,
1043
- default: void 0
1044
- },
1045
- onEvent: {
1046
- type: Function,
1047
- default: void 0
1048
- }
1049
- }, ge = {
1050
- source: {
1051
- type: Object,
1052
- default: void 0
1053
- },
1054
- transport: {
1055
- type: String,
1056
- default: void 0
1057
- },
1058
- endpoint: {
1059
- type: String,
1060
- default: void 0
1061
- },
1062
- formHandle: {
1063
- type: String,
1064
- default: void 0
1065
- },
1066
- siteId: {
1067
- type: Number,
1068
- default: void 0
1069
- },
1070
- components: {
1071
- type: Object,
1072
- default: void 0
1073
- },
1074
- fieldComponents: {
1075
- type: Object,
1076
- default: void 0
1077
- },
1078
- slots: {
1079
- type: Object,
1080
- default: void 0
1081
- },
1082
- className: {
1083
- type: String,
1084
- default: void 0
1085
- },
1086
- onMount: {
1087
- type: Function,
1088
- default: void 0
1089
- },
1090
- onReady: {
1091
- type: Function,
1092
- default: void 0
1093
- },
1094
- onUnmount: {
1095
- type: Function,
1096
- default: void 0
1097
- },
1098
- onResult: {
1099
- type: Function,
1100
- default: void 0
1101
- },
1102
- onSuccess: {
1103
- type: Function,
1104
- default: void 0
1105
- },
1106
- onError: {
1107
- type: Function,
1108
- default: void 0
1109
- },
1110
- onSubmitResult: {
1111
- type: Function,
1112
- default: void 0
1113
- },
1114
- onSubmitSuccess: {
1115
- type: Function,
1116
- default: void 0
1117
- },
1118
- onSubmitError: {
1119
- type: Function,
1120
- default: void 0
1121
- },
1122
- onEvent: {
1123
- type: Function,
1124
- default: void 0
1125
- }
1126
- }, _e = r({
1127
- name: "FormieVueForm",
1128
- props: he,
1129
- emits: [
1130
- "mount",
1131
- "ready",
1132
- "unmount",
1133
- "result",
1134
- "success",
1135
- "error",
1136
- "submit-result",
1137
- "submit-success",
1138
- "submit-error",
1139
- "event"
1140
- ],
1141
- setup(e, { emit: t }) {
1142
- return () => i(me, {
1143
- options: {
1144
- source: e.source,
1145
- transport: e.transport,
1146
- endpoint: e.endpoint,
1147
- formHandle: e.formHandle,
1148
- staticCache: e.staticCache,
1149
- refreshTokens: e.refreshTokens,
1150
- locale: e.locale,
1151
- siteId: e.siteId,
1152
- autoVisible: e.autoVisible,
1153
- theme: e.theme,
1154
- themeConfig: e.themeConfig,
1155
- className: e.className,
1156
- onMount: e.onMount,
1157
- onReady: e.onReady,
1158
- onUnmount: e.onUnmount,
1159
- onResult: e.onResult,
1160
- onSuccess: e.onSuccess,
1161
- onError: e.onError,
1162
- onSubmitResult: e.onSubmitResult,
1163
- onSubmitSuccess: e.onSubmitSuccess,
1164
- onSubmitError: e.onSubmitError,
1165
- onEvent: e.onEvent
1166
- },
1167
- onMount: (e) => t("mount", e),
1168
- onReady: (e) => t("ready", e),
1169
- onUnmount: () => t("unmount"),
1170
- onResult: (e) => t("result", e),
1171
- onSuccess: (e) => t("success", e),
1172
- onError: (e) => t("error", e),
1173
- onSubmitResult: (e) => t("submit-result", e),
1174
- onSubmitSuccess: (e) => t("submit-success", e),
1175
- onSubmitError: (e) => t("submit-error", e),
1176
- onEvent: (e) => t("event", e)
1177
- });
1178
- }
1179
- }), ve = r({
1180
- name: "FormieVueClientForm",
1181
- props: ge,
1182
- emits: [
1183
- "mount",
1184
- "ready",
1185
- "unmount",
1186
- "result",
1187
- "success",
1188
- "error",
1189
- "submit-result",
1190
- "submit-success",
1191
- "submit-error",
1192
- "event"
1193
- ],
1194
- setup(e, { emit: t }) {
1195
- return () => i(Y, {
1196
- source: fe({
1197
- source: e.source,
1198
- transport: e.transport,
1199
- endpoint: e.endpoint,
1200
- formHandle: e.formHandle,
1201
- siteId: e.siteId,
1202
- components: e.components,
1203
- fieldComponents: e.fieldComponents,
1204
- slots: e.slots,
1205
- className: e.className,
1206
- onMount: e.onMount,
1207
- onReady: e.onReady,
1208
- onUnmount: e.onUnmount,
1209
- onResult: e.onResult,
1210
- onSuccess: e.onSuccess,
1211
- onError: e.onError,
1212
- onSubmitResult: e.onSubmitResult,
1213
- onSubmitSuccess: e.onSubmitSuccess,
1214
- onSubmitError: e.onSubmitError,
1215
- onEvent: e.onEvent
1216
- }),
1217
- components: e.components,
1218
- fieldComponents: e.fieldComponents,
1219
- slots: e.slots,
1220
- className: e.className,
1221
- onMount: (n) => {
1222
- e.onMount?.(n), t("mount", n);
1223
- },
1224
- onReady: (n) => {
1225
- e.onReady?.(n), t("ready", n);
1226
- },
1227
- onUnmount: () => {
1228
- e.onUnmount?.(), t("unmount");
1229
- },
1230
- onSubmitResult: (n) => {
1231
- e.onSubmitResult?.(n), e.onResult?.(n), t("result", n), t("submit-result", n);
1232
- },
1233
- onSubmitSuccess: (n) => {
1234
- e.onSubmitSuccess?.(n), e.onSuccess?.(n), t("success", n), t("submit-success", n);
1235
- },
1236
- onSubmitError: (n) => {
1237
- e.onSubmitError?.(n), e.onError?.(n), t("error", n), t("submit-error", n);
1238
- },
1239
- onEvent: (n) => {
1240
- e.onEvent?.(n), t("event", n);
1241
- }
1242
- });
1243
- }
1040
+ const Ne = {
1041
+ options: {
1042
+ type: Object,
1043
+ required: !0
1044
+ }
1045
+ }, Oe = g({
1046
+ name: "FormieVueHtmlFormView",
1047
+ props: Ne,
1048
+ emits: ["mount", "ready", "unmount", "result", "success", "error", "submit-result", "submit-success", "submit-error", "event"],
1049
+ setup(e, { emit: t }) {
1050
+ const n = k(null), o = A(), i = m(() => $e(e.options)), r = m(() => q(i.value));
1051
+ return I([n, r], ([s], a, f) => {
1052
+ if (!s)
1053
+ return;
1054
+ let d = !1, c = null;
1055
+ const S = [], C = Promise.resolve().then(async () => {
1056
+ const l = await o.mount(s, i.value);
1057
+ if (d) {
1058
+ await o.unmount(s);
1059
+ return;
1060
+ }
1061
+ c = l, e.options.onMount?.(l), e.options.onReady?.(l), t("mount", l), t("ready", l), S.push(l.on("formie:submit:result", (v) => {
1062
+ const y = v;
1063
+ j(e.options.onSubmitResult, e.options.onResult, y), t("result", y), t("submit-result", y), we(y) ? (j(e.options.onSubmitSuccess, e.options.onSuccess, y), t("success", y), t("submit-success", y)) : (j(e.options.onSubmitError, e.options.onError, y), t("error", y), t("submit-error", y));
1064
+ })), B.forEach((v) => {
1065
+ S.push(l.on(v, (y) => {
1066
+ const p = {
1067
+ name: v,
1068
+ payload: y
1069
+ };
1070
+ e.options.onEvent?.(p), t("event", p);
1071
+ }));
1072
+ });
1073
+ });
1074
+ f(() => {
1075
+ d = !0, S.forEach((l) => l()), C.finally(async () => {
1076
+ await o.unmount(s), c && (e.options.onUnmount?.(), t("unmount"), c = null);
1077
+ });
1078
+ });
1079
+ }, { immediate: !0 }), () => u("div", {
1080
+ ref: n,
1081
+ class: e.options.className
1082
+ });
1083
+ }
1084
+ }), je = {
1085
+ source: {
1086
+ type: Object,
1087
+ default: void 0
1088
+ },
1089
+ transport: {
1090
+ type: String,
1091
+ default: void 0
1092
+ },
1093
+ endpoint: {
1094
+ type: String,
1095
+ default: void 0
1096
+ },
1097
+ formHandle: {
1098
+ type: String,
1099
+ default: void 0
1100
+ },
1101
+ staticCache: {
1102
+ type: Boolean,
1103
+ default: void 0
1104
+ },
1105
+ refreshTokens: {
1106
+ type: Boolean,
1107
+ default: void 0
1108
+ },
1109
+ locale: {
1110
+ type: String,
1111
+ default: void 0
1112
+ },
1113
+ siteId: {
1114
+ type: Number,
1115
+ default: void 0
1116
+ },
1117
+ autoVisible: {
1118
+ type: Boolean,
1119
+ default: void 0
1120
+ },
1121
+ theme: {
1122
+ type: String,
1123
+ default: void 0
1124
+ },
1125
+ themeConfig: {
1126
+ type: Object,
1127
+ default: void 0
1128
+ },
1129
+ className: {
1130
+ type: String,
1131
+ default: void 0
1132
+ },
1133
+ onMount: {
1134
+ type: Function,
1135
+ default: void 0
1136
+ },
1137
+ onReady: {
1138
+ type: Function,
1139
+ default: void 0
1140
+ },
1141
+ onUnmount: {
1142
+ type: Function,
1143
+ default: void 0
1144
+ },
1145
+ onResult: {
1146
+ type: Function,
1147
+ default: void 0
1148
+ },
1149
+ onSuccess: {
1150
+ type: Function,
1151
+ default: void 0
1152
+ },
1153
+ onError: {
1154
+ type: Function,
1155
+ default: void 0
1156
+ },
1157
+ onSubmitResult: {
1158
+ type: Function,
1159
+ default: void 0
1160
+ },
1161
+ onSubmitSuccess: {
1162
+ type: Function,
1163
+ default: void 0
1164
+ },
1165
+ onSubmitError: {
1166
+ type: Function,
1167
+ default: void 0
1168
+ },
1169
+ onEvent: {
1170
+ type: Function,
1171
+ default: void 0
1172
+ }
1173
+ }, Me = {
1174
+ source: {
1175
+ type: Object,
1176
+ default: void 0
1177
+ },
1178
+ transport: {
1179
+ type: String,
1180
+ default: void 0
1181
+ },
1182
+ endpoint: {
1183
+ type: String,
1184
+ default: void 0
1185
+ },
1186
+ formHandle: {
1187
+ type: String,
1188
+ default: void 0
1189
+ },
1190
+ siteId: {
1191
+ type: Number,
1192
+ default: void 0
1193
+ },
1194
+ components: {
1195
+ type: Object,
1196
+ default: void 0
1197
+ },
1198
+ fieldComponents: {
1199
+ type: Object,
1200
+ default: void 0
1201
+ },
1202
+ slots: {
1203
+ type: Object,
1204
+ default: void 0
1205
+ },
1206
+ className: {
1207
+ type: String,
1208
+ default: void 0
1209
+ },
1210
+ onMount: {
1211
+ type: Function,
1212
+ default: void 0
1213
+ },
1214
+ onReady: {
1215
+ type: Function,
1216
+ default: void 0
1217
+ },
1218
+ onUnmount: {
1219
+ type: Function,
1220
+ default: void 0
1221
+ },
1222
+ onResult: {
1223
+ type: Function,
1224
+ default: void 0
1225
+ },
1226
+ onSuccess: {
1227
+ type: Function,
1228
+ default: void 0
1229
+ },
1230
+ onError: {
1231
+ type: Function,
1232
+ default: void 0
1233
+ },
1234
+ onSubmitResult: {
1235
+ type: Function,
1236
+ default: void 0
1237
+ },
1238
+ onSubmitSuccess: {
1239
+ type: Function,
1240
+ default: void 0
1241
+ },
1242
+ onSubmitError: {
1243
+ type: Function,
1244
+ default: void 0
1245
+ },
1246
+ onEvent: {
1247
+ type: Function,
1248
+ default: void 0
1249
+ }
1250
+ }, ze = g({
1251
+ name: "FormieVueForm",
1252
+ props: je,
1253
+ emits: ["mount", "ready", "unmount", "result", "success", "error", "submit-result", "submit-success", "submit-error", "event"],
1254
+ setup(e, { emit: t }) {
1255
+ return () => {
1256
+ const n = {
1257
+ source: e.source,
1258
+ transport: e.transport,
1259
+ endpoint: e.endpoint,
1260
+ formHandle: e.formHandle,
1261
+ staticCache: e.staticCache,
1262
+ refreshTokens: e.refreshTokens,
1263
+ locale: e.locale,
1264
+ siteId: e.siteId,
1265
+ autoVisible: e.autoVisible,
1266
+ theme: e.theme,
1267
+ themeConfig: e.themeConfig,
1268
+ className: e.className,
1269
+ onMount: e.onMount,
1270
+ onReady: e.onReady,
1271
+ onUnmount: e.onUnmount,
1272
+ onResult: e.onResult,
1273
+ onSuccess: e.onSuccess,
1274
+ onError: e.onError,
1275
+ onSubmitResult: e.onSubmitResult,
1276
+ onSubmitSuccess: e.onSubmitSuccess,
1277
+ onSubmitError: e.onSubmitError,
1278
+ onEvent: e.onEvent
1279
+ };
1280
+ return u(Oe, {
1281
+ options: n,
1282
+ onMount: (o) => t("mount", o),
1283
+ onReady: (o) => t("ready", o),
1284
+ onUnmount: () => t("unmount"),
1285
+ onResult: (o) => t("result", o),
1286
+ onSuccess: (o) => t("success", o),
1287
+ onError: (o) => t("error", o),
1288
+ onSubmitResult: (o) => t("submit-result", o),
1289
+ onSubmitSuccess: (o) => t("submit-success", o),
1290
+ onSubmitError: (o) => t("submit-error", o),
1291
+ onEvent: (o) => t("event", o)
1292
+ });
1293
+ };
1294
+ }
1295
+ }), Be = g({
1296
+ name: "FormieVueClientForm",
1297
+ props: Me,
1298
+ emits: ["mount", "ready", "unmount", "result", "success", "error", "submit-result", "submit-success", "submit-error", "event"],
1299
+ setup(e, { emit: t }) {
1300
+ return () => u(ke, {
1301
+ source: xe({
1302
+ source: e.source,
1303
+ transport: e.transport,
1304
+ endpoint: e.endpoint,
1305
+ formHandle: e.formHandle,
1306
+ siteId: e.siteId,
1307
+ components: e.components,
1308
+ fieldComponents: e.fieldComponents,
1309
+ slots: e.slots,
1310
+ className: e.className,
1311
+ onMount: e.onMount,
1312
+ onReady: e.onReady,
1313
+ onUnmount: e.onUnmount,
1314
+ onResult: e.onResult,
1315
+ onSuccess: e.onSuccess,
1316
+ onError: e.onError,
1317
+ onSubmitResult: e.onSubmitResult,
1318
+ onSubmitSuccess: e.onSubmitSuccess,
1319
+ onSubmitError: e.onSubmitError,
1320
+ onEvent: e.onEvent
1321
+ }),
1322
+ components: e.components,
1323
+ fieldComponents: e.fieldComponents,
1324
+ slots: e.slots,
1325
+ className: e.className,
1326
+ onMount: (n) => {
1327
+ e.onMount?.(n), t("mount", n);
1328
+ },
1329
+ onReady: (n) => {
1330
+ e.onReady?.(n), t("ready", n);
1331
+ },
1332
+ onUnmount: () => {
1333
+ e.onUnmount?.(), t("unmount");
1334
+ },
1335
+ onSubmitResult: (n) => {
1336
+ e.onSubmitResult?.(n), e.onResult?.(n), t("result", n), t("submit-result", n);
1337
+ },
1338
+ onSubmitSuccess: (n) => {
1339
+ e.onSubmitSuccess?.(n), e.onSuccess?.(n), t("success", n), t("submit-success", n);
1340
+ },
1341
+ onSubmitError: (n) => {
1342
+ e.onSubmitError?.(n), e.onError?.(n), t("error", n), t("submit-error", n);
1343
+ },
1344
+ onEvent: (n) => {
1345
+ e.onEvent?.(n), t("event", n);
1346
+ }
1347
+ });
1348
+ }
1244
1349
  });
1245
- //#endregion
1246
- export { ve as FormieClientForm, _e as FormieForm, pe as createVueFormieClient, ae as useFormie, Q as useFormieClient, oe as useFormieField, $ as useFormieHtml, ce as useFormieInstance, se as useFormiePage, le as useFormieSlot };
1350
+ export {
1351
+ Be as FormieClientForm,
1352
+ ze as FormieForm,
1353
+ Le as createVueFormieClient,
1354
+ He as useFormie,
1355
+ Ie as useFormieClient,
1356
+ Te as useFormieField,
1357
+ _e as useFormieHtml,
1358
+ Ue as useFormieInstance,
1359
+ Pe as useFormiePage,
1360
+ Ke as useFormieSlot
1361
+ };