@picked/client 0.0.51-next.1 → 0.0.51-next.10

package/dist/esm/form/index.js

@@ -1,4 +1,4 @@
-import { t as e } from "../../rules-logic-BIkBWZmf.js";
+import { t as e } from "../../rules-logic-CnVktz2l.js";
 import { attach as t, combine as n, createEffect as r, createEvent as i, createStore as a, sample as o, split as s } from "effector";
 //#region src/form/build-responses.ts
 function c(e, t, n) {
@@ -16,22 +16,22 @@ function c(e, t, n) {
 function l(e, t) {
 	let n = Array.from(t.entries()), r = {};
 	return e.forEach((e) => {
-		let t = n.filter(([t]) => t === e.id);
-		t.length === 0 && (t = [[e.id, ""]]), t.forEach(([, t]) => {
+		let t = n.filter(([t]) => t === e.key);
+		t.length === 0 && (t = [[e.key, ""]]), t.forEach(([, t]) => {
 			if (t === "") {
-				c(r, e.id, null);
+				c(r, e.key, null);
 				return;
 			}
 			switch (e.type) {
 				case "text":
 				case "object":
-					c(r, e.id, e.multiple ? [String(t)] : String(t));
+					c(r, e.key, e.multiple ? [String(t)] : String(t));
 					break;
 				case "number":
-					c(r, e.id, e.multiple ? [Number(t)] : Number(t));
+					c(r, e.key, e.multiple ? [Number(t)] : Number(t));
 					break;
 				case "boolean":
-					c(r, e.id, e.multiple ? [t === "true"] : t === "true");
+					c(r, e.key, e.multiple ? [t === "true"] : t === "true");
 					break;
 			}
 		});
@@ -45,20 +45,24 @@ function u(e) {
 function d(e) {
 	return e.some((e) => e.condition || u(e));
 }
-async function f(t, n, r) {
+function f(e) {
+	return e.condition ?? null;
+}
+async function p(t, n, r) {
 	return n.length === 0 || !d(n) ? n : (await Promise.all(n.map(async (n) => {
-		if (!(!n.condition || await e(t, n.condition, r))) return null;
+		let i = f(n);
+		if (!(!i || await e(t, i, r))) return null;
 		if (!Array.isArray(n.options) || !u(n)) return n;
-		let i = (await Promise.all(n.options.map(async (n) => n.condition ? await e(t, n.condition, r) ? n : null : n))).filter((e) => e !== null);
-		return i.length === n.options.length ? n : i.length === 0 ? null : {
+		let a = (await Promise.all(n.options.map(async (n) => n.condition ? await e(t, n.condition, r) ? n : null : n))).filter((e) => e !== null);
+		return a.length === n.options.length ? n : a.length === 0 ? null : {
 			...n,
-			options: i
+			options: a
 		};
 	}))).filter((e) => e !== null);
 }
 //#endregion
 //#region src/form/create-field-evaluator.ts
-function p(e, n, i) {
+function m(e, n, i) {
 	let s = a([]), c = t({
 		source: {
 			allFields: e.fields.listStore,
@@ -66,7 +70,7 @@ function p(e, n, i) {
 			staged: i,
 			committed: e.responses.getAllStore
 		},
-		effect: r(async ({ allFields: t, fieldIds: n, staged: r, committed: i }) => await f(e, t.filter((e) => n.includes(e.id)), { responses: {
+		effect: r(async ({ allFields: t, fieldIds: n, staged: r, committed: i }) => await p(e, t.filter((e) => n.includes(e.id)), { responses: {
 			...i,
 			...r
 		} }))
@@ -86,30 +90,30 @@ function p(e, n, i) {
 }
 //#endregion
 //#region src/form/create-field-validation.ts
-function m(e) {
+function h(e) {
 	return e === null || e === "" || Array.isArray(e) && e.length === 0;
 }
-function h(n, r, s) {
+function g(n, r, s) {
 	let c = i(), l = i(), u = i(), d = a({});
 	o({
 		clock: u,
 		source: d,
-		fn: (e, { fieldId: t }) => ({
+		fn: (e, { fieldKey: t }) => ({
 			...e,
 			[t]: !0
 		}),
 		target: d
 	});
-	let f = a({}), p = f.map((e) => Object.values(e).filter((e) => e !== void 0)), h = t({
+	let f = a({}), p = f.map((e) => Object.values(e).filter((e) => e !== void 0)), m = t({
 		source: {
 			fields: r,
 			staged: s,
 			committed: n.responses.getAllStore
 		},
-		effect: async ({ fields: t, staged: r, committed: i }, { fieldId: a, value: o, checkRequired: s }) => {
-			let c = t.find((e) => e.id === a);
+		effect: async ({ fields: t, staged: r, committed: i }, { fieldKey: a, value: o, checkRequired: s }) => {
+			let c = t.find((e) => e.key === a);
 			if (!c) return {
-				fieldId: a,
+				fieldKey: a,
 				error: null
 			};
 			if (c.validation && Object.keys(c.validation).length > 0) {
@@ -121,34 +125,34 @@ function h(n, r, s) {
 					$input: o
 				});
 				if (typeof s == "string") return {
-					fieldId: a,
+					fieldKey: a,
 					error: {
-						fieldId: a,
+						fieldKey: c.key,
 						userMessage: s,
 						systemMessage: s,
 						value: o
 					}
 				};
 				if (s === !1) return {
-					fieldId: a,
+					fieldKey: a,
 					error: {
-						fieldId: a,
+						fieldKey: c.key,
 						userMessage: "This field is invalid",
 						systemMessage: "Field validation rule returned false.",
 						value: o
 					}
 				};
 			}
-			return s && c.required && m(o) ? {
-				fieldId: a,
+			return s && c.required && h(o) ? {
+				fieldKey: a,
 				error: {
-					fieldId: a,
+					fieldKey: c.key,
 					userMessage: "This field is required",
 					systemMessage: "Field is required.",
 					value: o
 				}
 			} : {
-				fieldId: a,
+				fieldKey: a,
 				error: null
 			};
 		}
@@ -156,41 +160,41 @@ function h(n, r, s) {
 	return o({
 		clock: c,
 		source: d,
-		filter: (e, { fieldId: t }) => e[t] === !0,
-		fn: (e, { fieldId: t, value: n }) => ({
-			fieldId: t,
+		filter: (e, { fieldKey: t }) => e[t] === !0,
+		fn: (e, { fieldKey: t, value: n }) => ({
+			fieldKey: t,
 			value: n,
 			checkRequired: !1
 		}),
-		target: h
+		target: m
 	}), o({
 		clock: l,
 		source: d,
-		filter: (e, { fieldId: t }) => e[t] === !0,
-		fn: (e, { fieldId: t, value: n }) => ({
-			fieldId: t,
+		filter: (e, { fieldKey: t }) => e[t] === !0,
+		fn: (e, { fieldKey: t, value: n }) => ({
+			fieldKey: t,
 			value: n,
 			checkRequired: !1
 		}),
-		target: h
+		target: m
 	}), o({
 		clock: u,
-		fn: ({ fieldId: e, value: t }) => ({
-			fieldId: e,
+		fn: ({ fieldKey: e, value: t }) => ({
+			fieldKey: e,
 			value: t,
 			checkRequired: !0
 		}),
-		target: h
-	}), s.on(c, (e, { fieldId: t, value: n }) => ({
+		target: m
+	}), s.on(c, (e, { fieldKey: t, value: n }) => ({
 		...e,
 		[t]: n
-	})), s.on(l, (e, { fieldId: t, value: n }) => ({
+	})), s.on(l, (e, { fieldKey: t, value: n }) => ({
 		...e,
 		[t]: n
-	})), s.on(u, (e, { fieldId: t, value: n }) => ({
+	})), s.on(u, (e, { fieldKey: t, value: n }) => ({
 		...e,
 		[t]: n
-	})), f.on(h.doneData, (e, { fieldId: t, error: n }) => {
+	})), f.on(m.doneData, (e, { fieldKey: t, error: n }) => {
 		if (n === null) {
 			let n = { ...e };
 			return delete n[t], n;
@@ -211,7 +215,7 @@ function h(n, r, s) {
 }
 //#endregion
 //#region src/form/create-submit-pipeline.ts
-function g(e) {
+function _(e) {
 	let t = [];
 	return {
 		executeFx: r(async (...n) => await e(t, ...n)),
@@ -220,14 +224,14 @@ function g(e) {
 		})
 	};
 }
-function _({ client: e, experienceInstance: n, formId: c, title: u, stepStore: d, fieldsStore: f, goToNextStep: p }) {
-	let m = i(), h = i(), _ = i(), v = i(), y = i(), b = a(!1), x = a(!1);
+function v({ client: e, experienceInstance: n, formId: c, title: u, stepStore: d, fieldsStore: f, goToNextStep: p }) {
+	let m = i(), h = i(), g = i(), v = i(), y = i(), b = a(!1), x = a(!1);
 	x.on(v, () => !0).on(m, () => !1);
-	let S = m.map(() => void 0), C = g(async (e, t) => {
+	let S = m.map(() => void 0), C = _(async (e, t) => {
 		await Promise.all(e.map((e) => Promise.resolve(e(t))));
-	}), w = g(async (e, t) => {
+	}), w = _(async (e, t) => {
 		await Promise.all(e.map((e) => Promise.resolve(e(t))));
-	}), T = g(async (e, t) => {
+	}), T = _(async (e, t) => {
 		let n = t;
 		for (let t of e) {
 			let e = await Promise.resolve(t(n));
@@ -345,9 +349,9 @@ function _({ client: e, experienceInstance: n, formId: c, title: u, stepStore: d
 		target: p
 	}), o({
 		clock: O.doneData,
-		target: _
+		target: g
 	}), o({
-		clock: _,
+		clock: g,
 		target: w.executeFx
 	}), o({
 		clock: [y, w.executeFx.done],
@@ -360,33 +364,33 @@ function _({ client: e, experienceInstance: n, formId: c, title: u, stepStore: d
 		onSuccess: C.register,
 		onError: w.register,
 		submitStarted: S,
-		validationErrorsReceived: _
+		validationErrorsReceived: g
 	};
 }
 //#endregion
 //#region src/form/create-form.ts
-function v(e) {
+function y(e) {
 	let t = e.currentTarget;
 	if (t instanceof HTMLInputElement) return t.type === "checkbox" ? t.checked : t.value;
 	if (t instanceof HTMLSelectElement || t instanceof HTMLTextAreaElement) return t.value;
 }
-function y(e, t, r, i) {
+function b(e, t, r, i) {
 	let { client: s, experienceInstance: c } = e, { currentStepStore: l, goToNextStep: u } = c, d = n(l, c, (e, t) => ({
 		stepId: e?.id,
 		experienceId: t.id
-	})), f = a({}), { fieldsStore: m } = p(s, i, f);
+	})), f = a({}), { fieldsStore: p } = m(s, i, f);
 	o({
-		clock: m,
+		clock: p,
 		source: f,
 		fn: (e, t) => {
 			let n = !1, r = { ...e };
-			for (let e of t) e.defaultValue != null && !(e.id in r) && (r[e.id] = e.defaultValue, n = !0);
+			for (let e of t) e.defaultValue != null && !(e.key in r) && (r[e.key] = e.defaultValue, n = !0);
 			return n ? r : e;
 		},
 		target: f
 	});
-	let { fieldInputEvent: g, fieldChangeEvent: y, fieldBlurEvent: b, touchedStore: x, fieldErrorsStore: S, formErrorsStore: C } = h(s, m, f), w = n({
-		fields: m,
+	let { fieldInputEvent: h, fieldChangeEvent: _, fieldBlurEvent: b, touchedStore: x, fieldErrorsStore: S, formErrorsStore: C } = g(s, p, f), w = n({
+		fields: p,
 		responses: s.responses.listStore,
 		staged: f,
 		fieldErrors: S,
@@ -394,32 +398,33 @@ function y(e, t, r, i) {
 		experienceAndStepId: d
 	}, ({ fields: e, responses: t, staged: n, fieldErrors: r, touched: i, experienceAndStepId: a }) => e.map((e) => {
 		let o = (t) => {
-			let n = v(t);
-			n !== void 0 && g({
-				fieldId: e.id,
+			let n = y(t);
+			n !== void 0 && h({
+				fieldKey: e.key,
 				value: n
 			});
 		}, s = (t) => {
-			let n = v(t);
-			n !== void 0 && y({
-				fieldId: e.id,
+			let n = y(t);
+			n !== void 0 && _({
+				fieldKey: e.key,
 				value: n
 			});
 		}, c = (t) => {
-			let n = v(t);
+			let n = y(t);
 			n !== void 0 && b({
-				fieldId: e.id,
+				fieldKey: e.key,
 				value: n
 			});
-		}, l = n[e.id] ?? t.find((t) => t.fieldId === e.id)?.value ?? e.defaultValue, u = r[e.id], d = e.type === "number" ? "number" : "text", f = e.type === "boolean" ? "checkbox" : d, { experienceId: p, stepId: m } = a, h = `${p}-${m ?? "step"}-${e.id}`;
+		}, l = n[e.key] ?? t.find((t) => t.fieldKey === e.key)?.value ?? e.defaultValue, u = r[e.key], d = e.type === "number" ? "number" : "text", f = e.type === "boolean" ? "checkbox" : d, { experienceId: p, stepId: m } = a, g = `${p}-${m ?? "step"}-${e.id}`;
 		return {
 			...e,
 			value: l,
 			error: u,
-			touched: i[e.id] ?? !1,
+			touched: i[e.key] ?? !1,
 			props: {
-				id: h,
-				name: e.name,
+				id: g,
+				name: e.key,
+				key: e.key,
 				value: l,
 				type: f,
 				required: e.required,
@@ -429,13 +434,13 @@ function y(e, t, r, i) {
 				onblur: c
 			}
 		};
-	})), { submitEvent: T, isFormSubmitting: E, onBeforeSubmit: D, onSuccess: O, onError: k, submitStarted: A, validationErrorsReceived: j } = _({
+	})), { submitEvent: T, isFormSubmitting: E, onBeforeSubmit: D, onSuccess: O, onError: k, submitStarted: A, validationErrorsReceived: j } = v({
 		client: s,
 		experienceInstance: c,
 		formId: t,
 		title: r,
 		stepStore: l,
-		fieldsStore: m,
+		fieldsStore: p,
 		goToNextStep: u
 	});
 	return o({
@@ -448,7 +453,8 @@ function y(e, t, r, i) {
 		target: S
 	}), o({
 		clock: j,
-		fn: (e) => Object.fromEntries(e.map((e) => [e.fieldId, e])),
+		source: p,
+		fn: (e, t) => Object.fromEntries(t.map((t) => [e.find((e) => e.key === t.fieldKey)?.key ?? t.fieldKey, t])),
 		target: S
 	}), {
 		form: {
@@ -463,4 +469,4 @@ function y(e, t, r, i) {
 	};
 }
 //#endregion
-export { l as buildResponsesFromFormData, p as createFieldEvaluator, h as createFieldValidation, y as createForm, _ as createSubmitPipeline, v as getEventValue, f as getStepFields };
+export { l as buildResponsesFromFormData, m as createFieldEvaluator, g as createFieldValidation, b as createForm, v as createSubmitPipeline, y as getEventValue, p as getStepFields };