@reformer/core 8.0.0 → 9.0.0-beta.2

package/README.md

@@ -30,33 +30,35 @@ npm install @reformer/core@beta # Active development is underway, so you can try
 
 ## Quick Start
 
+ReFormer is built around the **M1 architecture**: a reactive `FormModel` owns the values, a single
+schema binds field config (component / validators) to the model's signals, and `createForm({ model, schema })`
+wires them into a typed form.
+
 ```tsx
 import { useMemo } from 'react';
 import {
+  createModel,
   createForm,
+  validateFormModel,
   useFormControl,
-  required,
-  email,
-  validate,
-  watchField,
-  FieldNode,
-  type ValidationSchemaFn,
-  type BehaviorSchemaFn,
+  type FieldNode,
 } from '@reformer/core';
+import { required, email, minLength } from '@reformer/core/validators';
+import { defineFormBehavior, onChange } from '@reformer/core/behaviors';
 
 // 0. Simple FormField component
 function FormField({ label, control }: { label: string; control: FieldNode<string> }) {
-  const { value, errors } = useFormControl(control);
+  const { value, errors, shouldShowError } = useFormControl(control);
 
   return (
     <div>
       <label>{label}</label>
       <input
-        value={value}
+        value={value ?? ''}
         onChange={(e) => control.setValue(e.target.value)}
         onBlur={() => control.markAsTouched()}
       />
-      {errors.length > 0 && <span className="error">{errors[0].message}</span>}
+      {shouldShowError && <span className="error">{errors[0].message}</span>}
     </div>
   );
 }
@@ -69,62 +71,55 @@ interface RegistrationForm {
   confirmPassword: string;
 }
 
-// 2. Form schema
-const formSchema = {
-  username: { value: '' },
-  email: { value: '' },
-  password: { value: '' },
-  confirmPassword: { value: '' },
+// 2. Reactive model — the source of truth for values
+const model = createModel<RegistrationForm>({
+  username: '',
+  email: '',
+  password: '',
+  confirmPassword: '',
+});
+
+// 3. Single schema — binds field config to model signals (`model.$.<field>`).
+//    Validators are inline factories from `@reformer/core/validators`.
+//    Cross-field validation is a ModelValidator `(value, model) => error | null`.
+const schema = {
+  children: [
+    { value: model.$.username, component: Input, validators: [required(), minLength(2)] },
+    { value: model.$.email, component: Input, validators: [required(), email()] },
+    { value: model.$.password, component: Input, validators: [required(), minLength(8)] },
+    {
+      value: model.$.confirmPassword,
+      component: Input,
+      validators: [
+        required(),
+        (value, m) =>
+          value && m.password && value !== m.password
+            ? { code: 'mismatch', message: 'Passwords do not match' }
+            : null,
+      ],
+    },
+  ],
 };
 
-// 3. Validation schema
-const validationSchema: ValidationSchemaFn<RegistrationForm> = (path) => {
-  required(path.username);
-
-  required(path.email);
-  email(path.email);
-
-  required(path.password);
-  required(path.confirmPassword);
-
-  // Cross-field validation: вешается на поле-носитель ошибки, соседнее поле читается через `root`
-  validate(path.confirmPassword, (value, _control, root) => {
-    const password = root.password.value.value;
-    if (value && password && value !== password) {
-      return { code: 'mismatch', message: 'Passwords do not match' };
-    }
-    return null;
+// 4. Behavior — declarative reactive logic, run by `createForm({ behavior })`.
+//    Clear confirmPassword whenever password changes.
+const behavior = defineFormBehavior<RegistrationForm>(({ model }) => {
+  onChange(model.$.password, () => {
+    if (model.confirmPassword) model.confirmPassword = '';
   });
-};
-
-// 4. Behavior schema
-const behaviorSchema: BehaviorSchemaFn<RegistrationForm> = (path) => {
-  // Clear confirmPassword when password changes (if not empty)
-  watchField(path.password, (_, ctx) => {
-    const confirmValue = ctx.form.confirmPassword.value.value;
-    if (confirmValue) {
-      ctx.form.confirmPassword.setValue('', { emitEvent: false });
-    }
-  });
-};
+});
 
 // 5. Registration form component
 function RegistrationFormExample() {
-  const form = useMemo(
-    () =>
-      createForm<RegistrationForm>({
-        form: formSchema,
-        validation: validationSchema,
-        behavior: behaviorSchema,
-      }),
-    []
-  );
+  const form = useMemo(() => createForm<RegistrationForm>({ model, schema, behavior }), []);
 
   const handleSubmit = async (e: React.FormEvent) => {
     e.preventDefault();
-    await form.validate();
-    if (form.valid.value) {
-      console.log('Form data:', form.value.value);
+    form.touchAll();
+    // Validate the whole model against the schema (sync + async); errors route into the form.
+    const { valid } = await validateFormModel(model, schema);
+    if (valid) {
+      console.log('Form data:', model.get());
     }
   };
 

package/dist/behaviors-Br4Im38V.js

@@ -0,0 +1,263 @@
+import { effect as a } from "@preact/signals-core";
+var l = /* @__PURE__ */ ((n) => (n.THROW = "throw", n.LOG = "log", n.CONVERT = "convert", n))(l || {});
+class m {
+  static handle(e, t, r = "throw") {
+    const s = this.extractMessage(e);
+    switch (process.env.NODE_ENV !== "production" && console.error(`[${t}]`, e), r) {
+      case "throw":
+        throw e;
+      case "log":
+        return;
+      case "convert":
+        return {
+          code: "validator_error",
+          message: s,
+          params: { field: t }
+        };
+    }
+  }
+  /**
+   * Извлечь сообщение из ошибки
+   *
+   * Обрабатывает различные типы ошибок:
+   * - Error объекты → error.message
+   * - Строки → возвращает как есть
+   * - Объекты с message → извлекает message
+   * - Другое → String(error)
+   *
+   * @param error Ошибка для извлечения сообщения
+   * @returns Сообщение ошибки
+   * @private
+   *
+   * @example
+   * ```typescript
+   * FormErrorHandler.extractMessage(new Error('Test'));
+   * // 'Test'
+   *
+   * FormErrorHandler.extractMessage('String error');
+   * // 'String error'
+   *
+   * FormErrorHandler.extractMessage({ message: 'Object error' });
+   * // 'Object error'
+   *
+   * FormErrorHandler.extractMessage(null);
+   * // 'null'
+   * ```
+   */
+  static extractMessage(e) {
+    return e instanceof Error ? e.message : typeof e == "string" ? e : typeof e == "object" && e !== null && "message" in e ? String(e.message) : String(e);
+  }
+  /**
+   * Создать ValidationError с заданными параметрами
+   *
+   * Утилитная функция для создания ValidationError объектов
+   *
+   * @param code Код ошибки
+   * @param message Сообщение ошибки
+   * @param field Поле (опционально)
+   * @returns ValidationError объект
+   *
+   * @example
+   * ```typescript
+   * const error = FormErrorHandler.createValidationError(
+   *   'required',
+   *   'This field is required',
+   *   'email'
+   * );
+   * // { code: 'required', message: 'This field is required', field: 'email' }
+   * ```
+   */
+  static createValidationError(e, t, r) {
+    return {
+      code: e,
+      message: t,
+      params: r ? { field: r } : void 0
+    };
+  }
+  /**
+   * Проверить, является ли объект ValidationError
+   *
+   * Type guard для ValidationError
+   *
+   * @param value Значение для проверки
+   * @returns true если value является ValidationError
+   *
+   * @example
+   * ```typescript
+   * if (FormErrorHandler.isValidationError(result)) {
+   *   console.log(result.code); // OK, типобезопасно
+   * }
+   * ```
+   */
+  static isValidationError(e) {
+    return typeof e == "object" && e !== null && "code" in e && "message" in e && typeof e.code == "string" && typeof e.message == "string";
+  }
+}
+const u = /* @__PURE__ */ new WeakMap();
+function w(n) {
+  u.set(n, (u.get(n) ?? 0) + 1);
+}
+function E(n) {
+  const e = u.get(n);
+  e !== void 0 && (e <= 1 ? u.delete(n) : u.set(n, e - 1));
+}
+function O(n) {
+  return u.has(n);
+}
+const h = /* @__PURE__ */ new WeakMap();
+function D(n, e) {
+  h.set(n, e);
+}
+function p(n) {
+  return h.get(n);
+}
+const y = "runOutsideEffect";
+function g(n) {
+  return typeof n == "object" && n !== null && typeof n.then == "function";
+}
+function v(n, e) {
+  try {
+    const t = n();
+    g(t) && t.then(void 0, (r) => m.handle(r, e, l.LOG));
+  } catch (t) {
+    m.handle(t, e, l.LOG);
+  }
+}
+function F(n) {
+  return (...e) => {
+    i(() => n(...e));
+  };
+}
+function i(n) {
+  let e = !1;
+  return queueMicrotask(() => {
+    e || v(n, y);
+  }), () => {
+    e = !0;
+  };
+}
+function V(n, e) {
+  return () => {
+    e(() => v(n, "safeDebouncedCallback"));
+  };
+}
+function W(n, e, t, r) {
+  return a(() => {
+    const s = n.map((f) => f.value);
+    if (r?.when && !r.when(...s)) return;
+    const o = t(...s);
+    e.peek() !== o && (e.value = o);
+  });
+}
+function N(n, e, t) {
+  return a(() => {
+    const r = n.value;
+    if (t?.when && !t.when()) return;
+    const s = t?.transform ? t.transform(r) : r;
+    e.peek() !== s && (e.value = s);
+  });
+}
+function x(n, e, t) {
+  let r = !0;
+  return a(() => {
+    const s = n.value;
+    r && (r = !1, !t?.immediate) || e(s);
+  });
+}
+function k(n, e, t) {
+  return a(() => {
+    const r = e(), s = p(n);
+    s && i(() => {
+      r ? s.enable() : (s.disable(), t?.resetOnDisable && s.reset());
+    });
+  });
+}
+function C(n, e, t) {
+  return k(n, () => !e(), t);
+}
+function M(n, e) {
+  let t = !1;
+  return a(() => {
+    const r = n.value;
+    t || i(() => {
+      const s = e(r);
+      if (n.peek() !== s) {
+        t = !0;
+        try {
+          n.value = s;
+        } finally {
+          t = !1;
+        }
+      }
+    });
+  });
+}
+function j(n, e, t) {
+  const r = t?.resetValue ?? null;
+  return a(() => {
+    const s = e();
+    i(() => {
+      s && n.peek() !== r && (n.value = r);
+    });
+  });
+}
+function L(n, e, t) {
+  const r = t?.transform;
+  let s = !1;
+  const o = a(() => {
+    const c = n.value;
+    s || i(() => {
+      s = !0;
+      try {
+        const d = r ? r(c) : c;
+        e.peek() !== d && (e.value = d);
+      } finally {
+        s = !1;
+      }
+    });
+  }), f = a(() => {
+    const c = e.value;
+    s || i(() => {
+      s = !0;
+      try {
+        n.peek() !== c && (n.value = c);
+      } finally {
+        s = !1;
+      }
+    });
+  });
+  return () => {
+    o(), f();
+  };
+}
+function T(n, e) {
+  let t = !0;
+  return a(() => {
+    if (n.forEach((r) => r.value), t) {
+      t = !1;
+      return;
+    }
+    i(() => e());
+  });
+}
+export {
+  l as E,
+  m as F,
+  j as a,
+  T as b,
+  N as c,
+  D as d,
+  k as e,
+  F as f,
+  p as g,
+  V as h,
+  O as i,
+  W as j,
+  C as k,
+  w as m,
+  i as r,
+  L as s,
+  M as t,
+  E as u,
+  x as w
+};