@strictly/react-form 0.0.25 → 0.0.26

package/dist/index.js

@@ -313,6 +313,7 @@ import {
   UnreachableError as UnreachableError2
 } from "@strictly/base";
 import {
+  equals,
   flattenAccessorsOfType,
   flattenTypesOfType,
   flattenValuesOfType,
@@ -332,8 +333,8 @@ var Validation = /* @__PURE__ */ ((Validation2) => {
   Validation2[Validation2["Always"] = 2] = "Always";
   return Validation2;
 })(Validation || {});
-var _accessors_dec, _knownFields_dec, _fields_dec, _validation_dec, _fieldOverrides_dec, _value_dec, _init, _value, _fieldOverrides, _validation;
-_value_dec = [observable.ref], _fieldOverrides_dec = [observable.shallow], _validation_dec = [observable.shallow], _fields_dec = [computed], _knownFields_dec = [computed], _accessors_dec = [computed];
+var _dirty_dec, _accessors_dec, _knownFields_dec, _fields_dec, _validation_dec, _errorOverrides_dec, _fieldOverrides_dec, _value_dec, _init, _value, _fieldOverrides, _errorOverrides, _validation;
+_value_dec = [observable.ref], _fieldOverrides_dec = [observable.shallow], _errorOverrides_dec = [observable.shallow], _validation_dec = [observable.shallow], _fields_dec = [computed], _knownFields_dec = [computed], _accessors_dec = [computed], _dirty_dec = [computed];
 var FormModel = class {
   constructor(type, originalValue, adapters, mode) {
     this.type = type;
@@ -342,7 +343,8 @@ var FormModel = class {
     __runInitializers(_init, 5, this);
     __privateAdd(this, _value, __runInitializers(_init, 8, this)), __runInitializers(_init, 11, this);
     __privateAdd(this, _fieldOverrides, __runInitializers(_init, 12, this)), __runInitializers(_init, 15, this);
-    __privateAdd(this, _validation, __runInitializers(_init, 16, this, {})), __runInitializers(_init, 19, this);
+    __privateAdd(this, _errorOverrides, __runInitializers(_init, 16, this, {})), __runInitializers(_init, 19, this);
+    __privateAdd(this, _validation, __runInitializers(_init, 20, this, {})), __runInitializers(_init, 23, this);
     __publicField(this, "flattenedTypeDefs");
     // cannot be type safe
     // eslint-disable-next-line @typescript-eslint/no-explicit-any
@@ -489,34 +491,36 @@ var FormModel = class {
       defaultValue
     } = field;
     const validation = (_a = this.validation[valuePath]) != null ? _a : 0 /* None */;
-    let error;
-    switch (validation) {
-      case 0 /* None */:
-        break;
-      case 1 /* Changed */:
-        if (revert != null) {
-          const originalValue = valuePath in this.originalValues ? this.originalValues[valuePath] : defaultValue;
-          const { value: originalDisplayedValue } = convert(originalValue, valuePath, context);
-          if (displayedValue !== originalDisplayedValue) {
-            const revertResult = revert(displayedValue, valuePath, context);
+    let error = this.errorOverrides[valuePath];
+    if (error == null) {
+      switch (validation) {
+        case 0 /* None */:
+          break;
+        case 1 /* Changed */:
+          if (revert != null) {
+            const originalValue = valuePath in this.originalValues ? this.originalValues[valuePath] : defaultValue;
+            const { value: originalDisplayedValue } = convert(originalValue, valuePath, context);
+            if (displayedValue !== originalDisplayedValue) {
+              const revertResult = revert(displayedValue, valuePath, context);
+              if ((revertResult == null ? void 0 : revertResult.type) === 1 /* Failure */) {
+                ;
+                ({ error } = revertResult);
+              }
+            }
+          }
+          break;
+        case 2 /* Always */:
+          {
+            const revertResult = revert == null ? void 0 : revert(displayedValue, valuePath, context);
             if ((revertResult == null ? void 0 : revertResult.type) === 1 /* Failure */) {
               ;
               ({ error } = revertResult);
             }
           }
-        }
-        break;
-      case 2 /* Always */:
-        {
-          const revertResult = revert == null ? void 0 : revert(displayedValue, valuePath, context);
-          if ((revertResult == null ? void 0 : revertResult.type) === 1 /* Failure */) {
-            ;
-            ({ error } = revertResult);
-          }
-        }
-        break;
-      default:
-        throw new UnreachableError2(validation);
+          break;
+        default:
+          throw new UnreachableError2(validation);
+      }
     }
     return {
       value: displayedValue,
@@ -549,6 +553,11 @@ var FormModel = class {
       valuePath
     );
   }
+  get dirty() {
+    return Object.keys(this.accessors).some((valuePath) => {
+      return this.isFieldDirty(valuePath);
+    });
+  }
   typePath(valuePath) {
     return valuePathToTypePath(this.type, valuePath, true);
   }
@@ -694,6 +703,7 @@ var FormModel = class {
     const accessor = this.getAccessorForValuePath(valuePath);
     return runInAction(() => {
       this.fieldOverrides[valuePath] = [value];
+      delete this.errorOverrides[valuePath];
       if (validation != null) {
         this.validation[valuePath] = validation;
       }
@@ -711,11 +721,26 @@ var FormModel = class {
       }
     });
   }
+  /**
+   * Forces an error onto a field. Error will be removed if the field value changes
+   * @param valuePath the field to display an error for
+   * @param error the error to display
+   */
+  overrideFieldError(valuePath, error) {
+    runInAction(() => {
+      if (error) {
+        this.errorOverrides[valuePath] = error;
+      } else {
+        delete this.errorOverrides[valuePath];
+      }
+    });
+  }
   clearFieldError(valuePath) {
     const fieldOverride = this.fieldOverrides[valuePath];
     if (fieldOverride != null) {
       runInAction(() => {
         delete this.validation[valuePath];
+        delete this.errorOverrides[valuePath];
       });
     }
   }
@@ -738,12 +763,14 @@ var FormModel = class {
     runInAction(() => {
       this.fieldOverrides[key] = [displayValue];
       delete this.validation[key];
+      delete this.errorOverrides[key];
     });
   }
   clearAll(value) {
     runInAction(() => {
       this.validation = {};
       this.fieldOverrides = {};
+      this.errorOverrides = {};
       this.value = mobxCopy(this.type, value);
     });
   }
@@ -756,7 +783,7 @@ var FormModel = class {
     var _a;
     return (_a = this.validation[valuePath]) != null ? _a : 0 /* None */;
   }
-  isDirty(valuePath) {
+  isFieldDirty(valuePath) {
     const typePath = valuePathToTypePath(
       this.type,
       // eslint-disable-next-line @typescript-eslint/consistent-type-assertions
@@ -770,16 +797,30 @@ var FormModel = class {
     const {
       displayedValue,
       convert,
+      revert,
       context,
       defaultValue
     } = field;
     const originalValue = valuePath in this.originalValues ? this.originalValues[valuePath] : defaultValue;
+    if (revert != null) {
+      const typeDef = this.flattenedTypeDefs[typePath];
+      const {
+        value,
+        type
+      } = revert(displayedValue, valuePath, context);
+      if (type === 0 /* Success */) {
+        if (equals(typeDef, originalValue, value)) {
+          return false;
+        }
+      }
+    }
     const { value: originalDisplayedValue } = convert(originalValue, valuePath, context);
     return displayedValue !== originalDisplayedValue;
   }
   validateField(valuePath, validation = 2 /* Always */) {
     runInAction(() => {
       this.validation[valuePath] = validation;
+      delete this.errorOverrides[valuePath];
     });
     return this.fields[valuePath].error == null;
   }
@@ -797,17 +838,23 @@ var FormModel = class {
       }
     );
   }
+  validateSubmit() {
+    return this.validateAll();
+  }
 };
 _init = __decoratorStart(null);
 _value = new WeakMap();
 _fieldOverrides = new WeakMap();
+_errorOverrides = new WeakMap();
 _validation = new WeakMap();
 __decorateElement(_init, 4, "value", _value_dec, FormModel, _value);
 __decorateElement(_init, 4, "fieldOverrides", _fieldOverrides_dec, FormModel, _fieldOverrides);
+__decorateElement(_init, 4, "errorOverrides", _errorOverrides_dec, FormModel, _errorOverrides);
 __decorateElement(_init, 4, "validation", _validation_dec, FormModel, _validation);
 __decorateElement(_init, 2, "fields", _fields_dec, FormModel);
 __decorateElement(_init, 2, "knownFields", _knownFields_dec, FormModel);
 __decorateElement(_init, 2, "accessors", _accessors_dec, FormModel);
+__decorateElement(_init, 2, "dirty", _dirty_dec, FormModel);
 __decoratorMetadata(_init, FormModel);
 
 // core/mobx/hooks.tsx
@@ -840,7 +887,7 @@ function useDefaultMobxFormHooks(model, {
   const onFieldBlur = useCallback(
     function(path) {
       setTimeout(function() {
-        if (model.isValuePathActive(path) && model.isDirty(path)) {
+        if (model.isValuePathActive(path) && model.isFieldDirty(path)) {
           model.validateField(path, Math.max(1 /* Changed */, model.getValidation(path)));
         }
       }, 100);
@@ -849,7 +896,7 @@ function useDefaultMobxFormHooks(model, {
   );
   const onFormSubmit = useCallback(
     function() {
-      if (model.validateAll()) {
+      if (model.validateSubmit()) {
         onValidFormSubmit == null ? void 0 : onValidFormSubmit(model.value);
       }
     },

package/package.json

@@ -72,7 +72,7 @@
     "test:watch": "vitest"
   },
   "type": "module",
-  "version": "0.0.25",
+  "version": "0.0.26",
   "exports": {
     ".": {
       "import": {