mobx-formkit 1.0.0

package/src/validators/VALIBOT.ts

@@ -0,0 +1,70 @@
+import * as v from "valibot";
+import FieldInterface from "../models/FieldInterface";
+import FormInterface from "../models/FormInterface";
+import StateInterface from "../models/StateInterface";
+import {
+  ValidationPlugin,
+  ValidationPluginConfig,
+  ValidationPluginConstructor,
+  ValidationPluginInterface,
+} from "../models/ValidatorInterface";
+
+class VALIBOT<TValidator = any> implements ValidationPluginInterface {
+  promises: Promise<any>[];
+  config: ValidationPluginConfig<TValidator>;
+  state: StateInterface | null;
+  extend?: (args: { validator: TValidator; form: FormInterface }) => void;
+  validator: any;
+  schema: any;
+
+  constructor({
+    config,
+    state = null,
+    promises = [],
+  }: ValidationPluginConstructor<TValidator>) {
+    this.state = state;
+    this.promises = promises;
+    this.config = config;
+    this.extend = config?.extend;
+    this.validator = config.package ?? v;
+    this.schema = config.schema;
+
+    this.extendValidator();
+  }
+
+  extendValidator(): void {
+    if (typeof this.extend === "function") {
+      this.extend({
+        validator: this.validator,
+        form: this.state!.form,
+      });
+    }
+  }
+
+  // Convert a Valibot issue.path (array of { key }) into an MRF-style string path
+  // e.g. [{ key: 'members' }, { key: 0 }, { key: 'name' }] => 'members.0.name'
+  normalizePath(issuePath: any[] = []): string {
+    return issuePath.map((seg) => seg?.key).join(".");
+  }
+
+  validate(field: FieldInterface): void {
+    const result = v.safeParse(this.schema, field.state.form.flatMapValues);
+
+    if (result.success) return;
+
+    const messages = result.issues
+      .filter((issue: any) => this.normalizePath(issue.path) === field.path)
+      .map((issue: any) => issue.message);
+
+    if (messages?.length) {
+      field.validationErrorStack = messages;
+    }
+  }
+}
+
+export default <TValidator = any>(
+  config?: ValidationPluginConfig<TValidator>
+): ValidationPlugin<TValidator> => ({
+  class: VALIBOT<TValidator>,
+  config,
+});

package/src/validators/VINEJS.ts

@@ -0,0 +1,83 @@
+import vine from "@vinejs/vine";
+import FieldInterface from "../models/FieldInterface";
+import FormInterface from "../models/FormInterface";
+import StateInterface from "../models/StateInterface";
+import {
+  ValidationPlugin,
+  ValidationPluginConfig,
+  ValidationPluginConstructor,
+  ValidationPluginInterface,
+} from "../models/ValidatorInterface";
+
+class VINEJS<TValidator = any> implements ValidationPluginInterface {
+  promises: Promise<any>[] = [];
+  config: ValidationPluginConfig<TValidator>;
+  state: StateInterface | null;
+  extend?: (args: { validator: TValidator; form: FormInterface }) => void;
+  validator: any;
+  schema: any;
+  compiled: any;
+
+  constructor({
+    config,
+    state = null,
+    promises = [],
+  }: ValidationPluginConstructor<TValidator>) {
+    this.state = state;
+    this.promises = promises;
+    this.config = config;
+    this.extend = config?.extend;
+    this.validator = config.package ?? vine;
+    this.schema = config.schema;
+    this.compiled = this.validator.compile(this.schema);
+
+    this.extendValidator();
+  }
+
+  extendValidator(): void {
+    if (typeof this.extend === "function") {
+      this.extend({
+        validator: this.validator,
+        form: this.state!.form,
+      });
+    }
+  }
+
+  // VineJS emits dot-notation paths (e.g. 'members.0.name') which match
+  // the MRF field.path convention.
+  validate(field: FieldInterface): void {
+    const validationPromise = this.compiled
+      .validate(field.state.form.flatMapValues)
+      .then(() => field.setValidationAsyncData(true))
+      .catch((error: any) => this.handleAsyncFail(field, error))
+      .then(() => this.executeAsyncValidation(field));
+
+    this.promises.push(validationPromise);
+  }
+
+  handleAsyncFail(field: FieldInterface, error: any): void {
+    const messages = error?.messages ?? [];
+    if (!messages.length) return;
+
+    const fieldError = messages.find(
+      (item: any) => item.field === field.path
+    );
+
+    if (fieldError) {
+      field.setValidationAsyncData(false, fieldError.message);
+    }
+  }
+
+  executeAsyncValidation(field: FieldInterface): void {
+    if (field.validationAsyncData.valid === false) {
+      field.invalidate(field.validationAsyncData.message ?? undefined, false, true);
+    }
+  }
+}
+
+export default <TValidator = any>(
+  config?: ValidationPluginConfig<TValidator>
+): ValidationPlugin<TValidator> => ({
+  class: VINEJS<TValidator>,
+  config,
+});

package/src/validators/VJF.ts

@@ -0,0 +1,123 @@
+
+import FieldInterface from "../models/FieldInterface";
+import FormInterface from "../models/FormInterface";
+import StateInterface from "../models/StateInterface";
+import {
+  ValidationPlugin,
+  ValidationPluginConfig,
+  ValidationPluginConstructor,
+  ValidationPluginInterface,
+} from "../models/ValidatorInterface";
+
+function isPromise(obj: any): obj is Promise<any> {
+  return (
+    !!obj &&
+    typeof obj.then === "function" &&
+    (typeof obj === "object" || typeof obj === "function")
+  );
+}
+
+class VJF<TValidator = any> implements ValidationPluginInterface<TValidator> {
+  promises: Promise<any>[];
+  config: ValidationPluginConfig<TValidator>;
+  state: StateInterface | null;
+  extend?: (args: { validator: TValidator; form: FormInterface }) => void;
+  validator: TValidator;
+
+  constructor({
+    config,
+    state = null,
+    promises = [],
+  }: ValidationPluginConstructor<TValidator>) {
+    this.state = state;
+    this.promises = promises;
+    this.config = config;
+    this.extend = config?.extend;
+    this.validator = config?.package!;
+    this.extendValidator();
+  }
+
+  extendValidator(): void {
+    if (typeof this.extend === "function") {
+      this.extend({
+        validator: this.validator,
+        form: this.state!.form,
+      });
+    }
+  }
+
+  validate(field: FieldInterface): void {
+    if (!field.validators) return;
+
+    const validators = Array.isArray(field.validators) ? field.validators : [field.validators];
+
+    validators.forEach((fn) => this.collectData(fn, field));
+
+    this.executeValidation(field);
+  }
+
+  collectData(fn: (args: { validator: TValidator; form: FormInterface; field: FieldInterface }) => [boolean, string] | Promise<[boolean, string]>, field: FieldInterface): void {
+    const result = this.handleFunctionResult(fn, field);
+
+    if (isPromise(result)) {
+      const $p = result
+        .then(([valid, message]) => field.setValidationAsyncData(valid, message))
+        .then(() => this.executeAsyncValidation(field));
+
+      this.promises.push($p);
+      return;
+    }
+
+    field.validationFunctionsData.unshift({
+      valid: result[0],
+      message: result[1],
+    });
+  }
+
+  executeValidation(field: FieldInterface): void {
+    field.validationFunctionsData.forEach(({ valid, message }) => {
+      if (valid === false) {
+        field.invalidate(message, false);
+      }
+    });
+  }
+
+  executeAsyncValidation(field: FieldInterface): void {
+    if (field.validationAsyncData.valid === false) {
+      field.invalidate(field.validationAsyncData.message ?? undefined, false, true);
+    }
+  }
+
+  handleFunctionResult(fn: (args: { validator: TValidator; form: FormInterface; field: FieldInterface }) => [boolean, string] | Promise<[boolean, string]>, field: FieldInterface): [boolean, string] | Promise<[boolean, string]> {
+    const result = fn({
+      validator: this.validator,
+      form: this.state!.form,
+      field,
+    });
+
+    if (Array.isArray(result)) {
+      return [result[0] || false, result[1] || "Error"];
+    }
+
+    if (typeof result === 'boolean') {
+      return [result, "Error"];
+    }
+
+    if (typeof result === 'string') {
+      return [false, result];
+    }
+
+    if (isPromise(result)) {
+      return result;
+    }
+
+    return [false, "Error"];
+  }
+}
+
+export default <TValidator = any>(
+  config?: ValidationPluginConfig<TValidator>
+): ValidationPlugin<TValidator> => ({
+    class: VJF<TValidator>,
+    config,
+  });

package/src/validators/YUP.ts

@@ -0,0 +1,90 @@
+import {
+  ValidationPlugin,
+  ValidationPluginConfig,
+  ValidationPluginConstructor,
+  ValidationPluginInterface,
+} from "../models/ValidatorInterface";
+import FormInterface from "../models/FormInterface";
+import StateInterface from "../models/StateInterface";
+
+class YUP<TValidator = any> implements ValidationPluginInterface {
+  promises: Promise<any>[] = [];
+  config: ValidationPluginConfig<TValidator>;
+  state: StateInterface | null;
+  extend?: (args: { validator: TValidator; form: FormInterface }) => void;
+  validator: TValidator;
+  schema: any;
+
+  constructor({
+    config,
+    state = null,
+    promises = [],
+  }: ValidationPluginConstructor) {
+    this.state = state;
+    this.promises = promises;
+    this.config = config;
+    this.extend = config?.extend;
+    this.validator = config.package;
+    this.schema = config.schema(this.validator);
+    this.extendValidator();
+  }
+
+  // Metodo per estendere il validatore
+  extendValidator(): void {
+    if (typeof this.extend === 'function') {
+      this.extend({
+        validator: this.validator,
+        form: this.state!.form,
+      });
+    }
+  }
+
+  // Metodo di validazione principale
+  validate(field: any): void {
+    const fieldValidationPromise = this.createValidationPromise(field);
+    this.promises.push(fieldValidationPromise);
+  }
+
+  // Creazione della promise per la validazione
+  private createValidationPromise(field: any): Promise<any> {
+    return new Promise((resolve) => {
+      this.schema
+        .validateAt(field.path, this.state!.form.values(), { strict: true })
+        .then(() => this.handleAsyncPasses(field, resolve))
+        .catch((error: any) => this.handleAsyncFails(field, resolve, error));
+    });
+  }
+  // Gestione dei successi della validazione asincrona
+  private handleAsyncPasses(field: any, resolve: (value?: undefined) => void): void {
+    field.setValidationAsyncData(true);
+    resolve();
+  }
+
+  // Gestione dei fallimenti della validazione asincrona
+  private handleAsyncFails(field: any, resolve: (value?: undefined) => void, error: any): void {
+    // Yup a volte restituisce errori senza path (es. array vuoti)
+    const isSameField = error.path === field.path || error.path === undefined;
+
+    if (isSameField) {
+      const message = error.message?.replace(error.path ?? field.path, field.label);
+      field.setValidationAsyncData(false, message);
+      this.executeAsyncValidation(field);
+    }
+
+    resolve(undefined);
+  }
+
+  // Esecuzione della validazione asincrona
+  private executeAsyncValidation(field: any): void {
+    if (field.validationAsyncData.valid === false) {
+      field.invalidate(field.validationAsyncData.message, false, true);
+    }
+  }
+}
+
+export default <TValidator = any>(
+  config?: ValidationPluginConfig<TValidator>
+): ValidationPlugin<TValidator> => ({
+    class: YUP<TValidator>,
+    config,
+  });

package/src/validators/ZOD.ts

@@ -0,0 +1,66 @@
+import { get } from "lodash";
+import FieldInterface from "../models/FieldInterface";
+import FormInterface from "../models/FormInterface";
+import StateInterface from "../models/StateInterface";
+import { ZodSchema } from "zod";
+import {
+  ValidationPlugin,
+  ValidationPluginConfig,
+  ValidationPluginConstructor,
+  ValidationPluginInterface,
+} from "../models/ValidatorInterface";
+
+class ZOD<TValidator = any> implements ValidationPluginInterface {
+  promises: Promise<any>[];
+  config: ValidationPluginConfig;
+  state: StateInterface | null;
+  extend?: (args: { validator: TValidator; form: FormInterface }) => void;
+  validator: any;
+  schema: ZodSchema<any>;
+
+  constructor({
+    config,
+    state = null,
+    promises = [],
+  }: ValidationPluginConstructor) {
+    this.state = state;
+    this.promises = promises;
+    this.config = config;
+    this.extend = config?.extend;
+    this.validator = config.package;
+    this.schema = config.schema as ZodSchema<any>;
+
+    this.extendValidator();
+  }
+
+  extendValidator(): void {
+    if (typeof this.extend === "function") {
+      this.extend({
+        validator: this.validator,
+        form: this.state!.form,
+      });
+    }
+  }
+
+  validate(field: FieldInterface): void {
+    const result = this.schema.safeParse(field.state.form.flatMapValues);
+
+    if (result.success) return;
+
+    const fieldErrors = get(
+      (result as any).error.format(),
+      field.path ?? ""
+    )?._errors;
+
+    if (fieldErrors?.length) {
+      field.validationErrorStack = fieldErrors;
+    }
+  }
+}
+
+export default <TValidator = any>(
+  config?: ValidationPluginConfig<TValidator>
+): ValidationPlugin<TValidator> => ({
+  class: ZOD<TValidator>,
+  config,
+});