@picked/client 0.0.1-dev.1773807602703 → 0.0.1-dev.1773878362211

package/dist/esm/form/index.js

@@ -0,0 +1,393 @@
+import { e as N } from "../../rules-logic-CZfip-Wl.js";
+import { createStore as A, attach as B, createEffect as k, sample as m, createEvent as x, split as $, combine as z } from "effector";
+function T(r, t, i) {
+  const s = r[t];
+  if (s === void 0) {
+    r[t] = i;
+    return;
+  }
+  if (Array.isArray(s) && Array.isArray(i) && i.length > 0) {
+    typeof s[0] == "string" ? r[t] = [...s, ...i].map(String) : typeof s[0] == "number" ? r[t] = [...s, ...i].map(Number) : typeof s[0] == "boolean" ? r[t] = [...s, ...i].map((e) => !!e) : r[t] = i;
+    return;
+  }
+  r[t] = i;
+}
+function G(r, t) {
+  const i = Array.from(t.entries()), s = {};
+  return r.forEach((e) => {
+    let p = i.filter(([u]) => u === e.id);
+    p.length === 0 && (p = [[e.id, ""]]), p.forEach(([, u]) => {
+      if (u === "") {
+        T(s, e.id, null);
+        return;
+      }
+      switch (e.type) {
+        case "text":
+        case "object":
+          T(s, e.id, e.multiple ? [String(u)] : String(u));
+          break;
+        case "number":
+          T(s, e.id, e.multiple ? [Number(u)] : Number(u));
+          break;
+        case "boolean":
+          T(
+            s,
+            e.id,
+            e.multiple ? [u === "true"] : u === "true"
+          );
+          break;
+      }
+    });
+  }), s;
+}
+function j(r) {
+  return Array.isArray(r.options) && r.options.some((t) => "condition" in t);
+}
+function J(r) {
+  return r.some((t) => t.condition || j(t));
+}
+async function K(r, t, i) {
+  return t.length === 0 || !J(t) ? t : (await Promise.all(
+    t.map(async (e) => {
+      if (!(e.condition ? await N(r, e.condition, i) : !0))
+        return null;
+      if (!Array.isArray(e.options) || !j(e))
+        return e;
+      const g = (await Promise.all(
+        e.options.map(async (o) => o.condition ? await N(r, o.condition, i) ? o : null : o)
+      )).filter((o) => o !== null);
+      return g.length === e.options.length ? e : g.length === 0 ? null : { ...e, options: g };
+    })
+  )).filter((e) => e !== null);
+}
+function Q(r, t, i) {
+  const s = A([]), e = B({
+    source: {
+      allFields: r.fields.listStore,
+      fieldIds: t,
+      staged: i,
+      committed: r.responses.getAllStore
+    },
+    effect: k(
+      async ({
+        allFields: p,
+        fieldIds: u,
+        staged: g,
+        committed: v
+      }) => {
+        const o = p.filter((d) => u.includes(d.id)), c = { ...v, ...g };
+        return await K(r, o, { responses: c });
+      }
+    )
+  });
+  return m({ clock: e.doneData, target: s }), e(), m({
+    clock: [r.responses.listStore, t, r.fields.listStore, i],
+    target: e
+  }), { fieldsStore: s };
+}
+function U(r) {
+  return r === null || r === "" || Array.isArray(r) && r.length === 0;
+}
+function W(r, t, i) {
+  const s = x(), e = x(), p = A({});
+  m({
+    clock: e,
+    source: p,
+    fn: (o, { fieldId: c }) => ({ ...o, [c]: !0 }),
+    target: p
+  });
+  const u = A({}), g = u.map(
+    (o) => Object.values(o).filter((c) => c !== void 0)
+  ), v = B({
+    source: {
+      fields: t,
+      staged: i,
+      committed: r.responses.getAllStore
+    },
+    effect: async ({
+      fields: o,
+      staged: c,
+      committed: d
+    }, {
+      fieldId: l,
+      value: y,
+      checkRequired: R
+    }) => {
+      const b = o.find((h) => h.id === l);
+      if (!b) return { fieldId: l, error: null };
+      if (b.validation && Object.keys(b.validation).length > 0) {
+        const h = { ...d, ...c }, E = await N(r, b.validation, {
+          responses: h,
+          $input: y
+        });
+        if (typeof E == "string")
+          return {
+            fieldId: l,
+            error: {
+              fieldId: l,
+              userMessage: E,
+              systemMessage: E,
+              value: y
+            }
+          };
+        if (E === !1)
+          return {
+            fieldId: l,
+            error: {
+              fieldId: l,
+              userMessage: "This field is invalid",
+              systemMessage: "Field validation rule returned false.",
+              value: y
+            }
+          };
+      }
+      return R && b.required && U(y) ? {
+        fieldId: l,
+        error: {
+          fieldId: l,
+          userMessage: "This field is required",
+          systemMessage: "Field is required.",
+          value: y
+        }
+      } : { fieldId: l, error: null };
+    }
+  });
+  return m({
+    clock: s,
+    source: p,
+    filter: (o, { fieldId: c }) => o[c] === !0,
+    fn: (o, { fieldId: c, value: d }) => ({ fieldId: c, value: d, checkRequired: !1 }),
+    target: v
+  }), m({
+    clock: e,
+    fn: ({ fieldId: o, value: c }) => ({ fieldId: o, value: c, checkRequired: !0 }),
+    target: v
+  }), i.on(s, (o, { fieldId: c, value: d }) => ({
+    ...o,
+    [c]: d
+  })), i.on(e, (o, { fieldId: c, value: d }) => ({
+    ...o,
+    [c]: d
+  })), u.on(v.doneData, (o, { fieldId: c, error: d }) => {
+    if (d === null) {
+      const l = { ...o };
+      return delete l[c], l;
+    }
+    return { ...o, [c]: d };
+  }), {
+    fieldChangeEvent: s,
+    fieldBlurEvent: e,
+    touchedStore: p,
+    fieldErrorsStore: u,
+    formErrorsStore: g,
+    stagedValuesStore: i
+  };
+}
+function w(r) {
+  let t = [];
+  return { executeFx: k(async (...e) => await r(t, ...e)), register: (e) => (t.push(e), () => {
+    t = t.filter((p) => p !== e);
+  }) };
+}
+function X({
+  client: r,
+  experienceInstance: t,
+  formId: i,
+  title: s,
+  stepStore: e,
+  fieldsStore: p,
+  goToNextStep: u
+}) {
+  const g = x(), v = x(), o = x(), c = x(), d = x(), l = A(!1), y = A(!1);
+  y.on(c, () => !0).on(g, () => !1);
+  const R = g.map(() => {
+  }), b = w(async (n, a) => {
+    await Promise.all(n.map((f) => Promise.resolve(f(a))));
+  }), h = w(async (n, a) => {
+    await Promise.all(n.map((f) => Promise.resolve(f(a))));
+  }), E = w(
+    async (n, a) => {
+      let f = a;
+      for (const F of n) {
+        const O = await Promise.resolve(F(f));
+        O !== void 0 && (f = O);
+      }
+      return f;
+    }
+  ), _ = k(async (n) => {
+    const a = await r.responses.commit(n);
+    return { data: n, errors: a.errors };
+  }), C = B({
+    source: { step: e, title: s },
+    mapParams: (n, a) => ({
+      step: a.step,
+      title: a.title,
+      data: n.data
+    }),
+    effect: k(
+      async ({
+        step: n,
+        title: a,
+        data: f
+      }) => (r.eventBus({
+        type: "form_submit_success",
+        form: { id: i, title: a },
+        experience: t,
+        step: n ?? void 0
+      }), f)
+    )
+  }), M = B({
+    source: { step: e, title: s },
+    mapParams: (n, a) => ({
+      step: a.step,
+      title: a.title,
+      errors: n.errors
+    }),
+    effect: k(
+      async ({
+        step: n,
+        title: a,
+        errors: f
+      }) => (r.eventBus({
+        type: "form_submit_error",
+        form: { id: i, title: a },
+        exception: { reason: f },
+        experience: t,
+        step: n ?? void 0
+      }), f.forEach((F) => {
+        r.eventBus({
+          type: "field_validation_error",
+          exception: { reason: [F] },
+          experience: t,
+          step: n ?? void 0
+        });
+      }), f)
+    )
+  });
+  return m({ clock: g, fn: () => !0, target: l }), m({
+    clock: g,
+    source: { step: e, title: s },
+    fn: ({ step: n, title: a }) => ({ formId: i, title: a, step: n }),
+    target: k(
+      ({
+        formId: n,
+        title: a,
+        step: f
+      }) => {
+        r.eventBus({
+          type: "form_submit",
+          form: { id: n, title: a },
+          experience: t,
+          step: f ?? void 0
+        });
+      }
+    )
+  }), m({
+    clock: g,
+    source: { stepFields: p },
+    fn: ({ stepFields: n }, a) => (a.preventDefault(), G(n, new FormData(a.currentTarget))),
+    target: E.executeFx
+  }), m({ clock: E.executeFx.doneData, target: _ }), $({
+    source: _.doneData,
+    match: { hasErrors: ({ errors: n }) => n.length > 0 },
+    cases: { hasErrors: M, __: C }
+  }), m({ clock: C.doneData, target: v }), m({
+    clock: v,
+    fn: (n) => ({ data: n, stopNavigation: c }),
+    target: b.executeFx
+  }), m({ clock: b.executeFx.done, target: d }), m({
+    clock: d,
+    source: y,
+    filter: (n) => !n,
+    target: u
+  }), m({ clock: M.doneData, target: o }), m({ clock: o, target: h.executeFx }), m({
+    clock: [d, h.executeFx.done],
+    fn: () => !1,
+    target: l
+  }), {
+    submitEvent: g,
+    isFormSubmitting: l,
+    onSubmit: E.register,
+    onSuccess: b.register,
+    onError: h.register,
+    submitStarted: R,
+    // formErrorEvent is EventCallable<ValidationError[]>, assignable to Event<ValidationError[]>
+    serverErrorsReceived: o
+  };
+}
+function q(r) {
+  const t = r.currentTarget;
+  if (t instanceof HTMLInputElement)
+    return t.type === "checkbox" ? t.checked : t.value;
+  if (t instanceof HTMLSelectElement || t instanceof HTMLTextAreaElement)
+    return t.value;
+}
+function V(r, t, i, s) {
+  const { client: e, experienceInstance: p } = r, { currentStepStore: u, goToNextStep: g } = p, v = A({}), { fieldsStore: o } = Q(e, s, v), { fieldChangeEvent: c, fieldBlurEvent: d, touchedStore: l, fieldErrorsStore: y, formErrorsStore: R } = W(e, o, v), b = z(
+    {
+      fields: o,
+      responses: e.responses.listStore,
+      staged: v,
+      fieldErrors: y,
+      touched: l
+    },
+    ({ fields: f, responses: F, staged: O, fieldErrors: L, touched: H }) => f.map(
+      (S) => ({
+        ...S,
+        // Staged value takes priority (live input); committed response is the fallback
+        // for fields pre-filled from a previous submission or external update.
+        value: O[S.id] ?? F.find((D) => D.fieldId === S.id)?.value,
+        error: L[S.id],
+        touched: H[S.id] ?? !1,
+        onChange: (D) => {
+          const P = q(D);
+          P !== void 0 && c({ fieldId: S.id, value: P });
+        },
+        onBlur: (D) => {
+          const P = q(D);
+          P !== void 0 && d({ fieldId: S.id, value: P });
+        }
+      })
+    )
+  ), {
+    submitEvent: h,
+    isFormSubmitting: E,
+    onSubmit: _,
+    onSuccess: C,
+    onError: M,
+    submitStarted: n,
+    serverErrorsReceived: a
+  } = X({
+    client: e,
+    experienceInstance: p,
+    formId: t,
+    title: i,
+    stepStore: u,
+    fieldsStore: o,
+    goToNextStep: g
+  });
+  return m({ clock: n, fn: () => ({}), target: l }), m({ clock: n, fn: () => ({}), target: y }), m({
+    clock: a,
+    fn: (f) => Object.fromEntries(f.map((F) => [F.fieldId, F])),
+    target: y
+  }), {
+    form: {
+      onsubmit: h,
+      errors: R,
+      submitting: E,
+      onSubmit: _,
+      onSuccess: C,
+      onError: M
+    },
+    fields: b
+  };
+}
+export {
+  G as buildResponsesFromFormData,
+  Q as createFieldEvaluator,
+  W as createFieldValidation,
+  V as createForm,
+  X as createSubmitPipeline,
+  q as getEventValue,
+  K as getStepFields
+};