relay-forms-nodeps 2.0.0 → 2.3.0

package/lib/useForceUpdate.js

@@ -3,9 +3,10 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
+exports.useForceUpdate = void 0;
 var react_1 = require("react");
 function useForceUpdate() {
-  var _a = react_1.useReducer(function (x) {
+  var _a = (0, react_1.useReducer)(function (x) {
       return x + 1;
     }, 0),
     forceUpdate = _a[1];

package/lib/useForm.js

@@ -3,6 +3,7 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
+exports.useForm = void 0;
 var React = require("react");
 var RelayStoreProvider_1 = require("./relay/RelayStoreProvider");
 var RelayStoreUtils_1 = require("./relay/RelayStoreUtils");
@@ -10,7 +11,9 @@ var useFormField_1 = require("./useFormField");
 var Utils_1 = require("./Utils");
 function logicSubmit(environment, onSubmit) {
   function dispose() {
-    subscription && subscription.dispose();
+    if (subscription) {
+      subscription.dispose();
+    }
     subscription = undefined;
   }
   var isSubmitting = false;
@@ -18,14 +21,14 @@ function logicSubmit(environment, onSubmit) {
   function execute(snapshot) {
     var disposeSubmit = function () {
       isSubmitting = false;
-      Utils_1.commit(environment, function (_, form) {
+      (0, Utils_1.commit)(environment, function (_, form) {
         form.setValue(false, 'isSubmitting');
       });
     };
     var data = snapshot.data;
     var entries = data.form.entries;
     var filtered = entries.filter(function (value) {
-      return useFormField_1.isDone(value.check);
+      return (0, useFormField_1.isDone)(value.check);
     });
     var isValidating = filtered.length !== entries.length;
     var errors = entries.filter(function (value) {
@@ -34,7 +37,7 @@ function logicSubmit(environment, onSubmit) {
       return value.id;
     });
     var isValid = !isValidating && errors.length === 0;
-    Utils_1.commit(environment, function (store, form) {
+    (0, Utils_1.commit)(environment, function (store, form) {
       form.setValue(isValidating, 'isValidating').setValue(isValid, 'isValid');
       var errorFields = [];
       errors.forEach(function (id) {
@@ -49,7 +52,7 @@ function logicSubmit(environment, onSubmit) {
         result_1[entry.key] = entry.value;
       });
       var submit_1 = onSubmit(result_1);
-      if (RelayStoreUtils_1.isPromise(submit_1)) {
+      if ((0, RelayStoreUtils_1.isPromise)(submit_1)) {
         submit_1.then(disposeSubmit).catch(disposeSubmit);
         return;
       }
@@ -60,7 +63,7 @@ function logicSubmit(environment, onSubmit) {
   function reset() {
     if (!isSubmitting) {
       dispose();
-      Utils_1.commit(environment, function (_, form) {
+      (0, Utils_1.commit)(environment, function (_, form) {
         form.setValue(false, 'isSubmitting').setValue(false, 'isValidating').setLinkedRecords([], 'errors').getLinkedRecords('entries').forEach(function (entry) {
           return entry.setValue(useFormField_1.RESET, 'check').setValue(undefined, 'error');
         });
@@ -68,7 +71,7 @@ function logicSubmit(environment, onSubmit) {
     }
   }
   function validate() {
-    Utils_1.commit(environment, function (_, form) {
+    (0, Utils_1.commit)(environment, function (_, form) {
       var tobeValitating = form.setValue(isSubmitting, 'isSubmitting').getLinkedRecords('entries').filter(function (value) {
         return value.getValue('check') === useFormField_1.TOBEVALIDATE;
       });
@@ -86,7 +89,9 @@ function logicSubmit(environment, onSubmit) {
     execute(snapshot);
   }
   function submit(event) {
-    event && event.preventDefault();
+    if (event) {
+      event.preventDefault();
+    }
     if (!isSubmitting) {
       isSubmitting = true;
       validate();
@@ -112,9 +117,9 @@ function logicSubmit(environment, onSubmit) {
     getData: getData
   };
 }
-exports.useForm = function (_a) {
+var useForm = function (_a) {
   var onSubmit = _a.onSubmit;
-  var environment = RelayStoreProvider_1.useStore();
+  var environment = (0, RelayStoreProvider_1.useStore)();
   var resolver = React.useMemo(function () {
     return logicSubmit(environment, onSubmit);
   }, [environment, onSubmit]);
@@ -122,4 +127,5 @@ exports.useForm = function (_a) {
     return resolver.subscribe();
   }, [resolver]);
   return resolver.getData();
-};
+};
+exports.useForm = useForm;

package/lib/useFormField.d.ts

@@ -3,4 +3,4 @@ export declare const TOBEVALIDATE = 1;
 export declare const VALIDATING = 2;
 export declare const RESET = 5;
 export declare function isDone(check: any): boolean;
-export declare function useFormField<ValueType>({ key, initialValue, validate, validateOnChange, label, }: FormSetValueOptions<ValueType>): FormSetValueReturn<ValueType>;
+export declare function useFormField<ValueType>({ key, initialValue, validate, validateOnChange, label, dependsOn, }: FormSetValueOptions<ValueType>): FormSetValueReturn<ValueType>;

package/lib/useFormField.js

@@ -1,10 +1,22 @@
 "use strict";
 
+var __assign = this && this.__assign || function () {
+  __assign = Object.assign || function (t) {
+    for (var s, i = 1, n = arguments.length; i < n; i++) {
+      s = arguments[i];
+      for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p)) t[p] = s[p];
+    }
+    return t;
+  };
+  return __assign.apply(this, arguments);
+};
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
+exports.useFormField = exports.isDone = exports.RESET = exports.VALIDATING = exports.TOBEVALIDATE = void 0;
 var React = require("react");
 var queries_1 = require("./relay/queries");
+var queryValueFieldFragment_graphql_1 = require("./relay/queryValueFieldFragment.graphql");
 var RelayStoreProvider_1 = require("./relay/RelayStoreProvider");
 var RelayStoreUtils_1 = require("./relay/RelayStoreUtils");
 var useForceUpdate_1 = require("./useForceUpdate");
@@ -28,10 +40,15 @@ function logicSetValue(params) {
     initialValue = params.initialValue,
     forceUpdate = params.forceUpdate,
     validateOnChange = params.validateOnChange,
-    label = params.label;
+    label = params.label,
+    dependsOn = params.dependsOn;
   var validate = undefined;
   var firstSet = true;
-  var localId = Utils_1.getFieldId(key);
+  var deps = {};
+  var localId = (0, Utils_1.getFieldId)(key);
+  function getDeps() {
+    return deps;
+  }
   function getValidate() {
     return validate;
   }
@@ -47,7 +64,7 @@ function logicSetValue(params) {
     if (commitValue === void 0) {
       commitValue = true;
     }
-    Utils_1.commit(environment, function (store, form) {
+    (0, Utils_1.commit)(environment, function (store, form) {
       var field = store.get(localId);
       if (!field) {
         field = store.create(localId).setValue(localId, 'id').setValue(label, 'label').setValue(key, 'key');
@@ -106,25 +123,26 @@ function logicSetValue(params) {
     }
     commitField(false);
   }
-  function internalValidate(value, validateFunction) {
+  function internalValidate(value, validateFunction, depsValidation) {
     ref.isChecking = true;
-    var result = validateFunction(value);
+    var result = validateFunction(value, deps);
     function internalFinalize(error) {
       var validate = getValidate();
-      if (value !== dataResult.value || validate !== validateFunction) {
-        internalValidate(dataResult.value, validate);
+      var deps = getDeps();
+      if (value !== dataResult.value || validate !== validateFunction || deps !== depsValidation) {
+        internalValidate(dataResult.value, validate, deps);
         return;
       }
       finalizeCheck(error);
     }
-    if (RelayStoreUtils_1.isPromise(result)) {
+    if ((0, RelayStoreUtils_1.isPromise)(result)) {
       result.then(internalFinalize).catch(internalFinalize);
     } else {
       internalFinalize(result);
     }
   }
   function subscribe() {
-    var snapshot = Utils_1.getSnapshot(environment, queries_1.FragmentSet, key);
+    var snapshot = (0, Utils_1.getSnapshot)(environment, queries_1.FragmentSet, key);
     var disposeSubscrition = environment.subscribe(snapshot, function (s) {
       var data = s.data;
       var dataCheck = data.check;
@@ -136,12 +154,28 @@ function logicSetValue(params) {
         ref.check = getInitCheck(validate);
         setValueInternal(initialValue);
       } else if (isValidating && !ref.isChecking) {
-        internalValidate(dataResult.value, validate);
+        internalValidate(dataResult.value, validate, deps);
       }
     }).dispose;
+    var disposeDeps = [];
+    if (dependsOn != null) {
+      dependsOn.forEach(function (depKey) {
+        var snapshot = (0, Utils_1.getSnapshot)(environment, queryValueFieldFragment_graphql_1.default, depKey);
+        var disposeDep = environment.subscribe(snapshot, function (s) {
+          var _a;
+          var data = s.data;
+          deps = __assign(__assign({}, deps), (_a = {}, _a[depKey] = data, _a));
+          if (ref.check == DONEVALIDATED && !ref.isChecking) {
+            ref.check = exports.VALIDATING;
+            commitField(false);
+          }
+        }).dispose;
+        disposeDeps.push(disposeDep);
+      });
+    }
     var dispose = function () {
       disposeSubscrition();
-      Utils_1.commit(environment, function (store, form) {
+      (0, Utils_1.commit)(environment, function (store, form) {
         var entriesArray = form.getLinkedRecords('entries');
         var newEntries = entriesArray.filter(function (value) {
           return value.getDataID() != localId;
@@ -149,9 +183,12 @@ function logicSetValue(params) {
         form.setLinkedRecords(newEntries, 'entries');
         store.delete(localId);
       });
+      disposeDeps.forEach(function (dispose) {
+        return dispose;
+      });
     };
     if (validateOnChange) {
-      internalValidate(initialValue, getValidate());
+      internalValidate(initialValue, getValidate(), deps);
     }
     return dispose;
   }
@@ -167,9 +204,10 @@ function useFormField(_a) {
     initialValue = _a.initialValue,
     validate = _a.validate,
     validateOnChange = _a.validateOnChange,
-    label = _a.label;
-  var forceUpdate = useForceUpdate_1.useForceUpdate();
-  var environment = RelayStoreProvider_1.useStore();
+    label = _a.label,
+    dependsOn = _a.dependsOn;
+  var forceUpdate = (0, useForceUpdate_1.useForceUpdate)();
+  var environment = (0, RelayStoreProvider_1.useStore)();
   var resolver = React.useMemo(function () {
     return logicSetValue({
       environment: environment,
@@ -177,9 +215,10 @@ function useFormField(_a) {
       label: label,
       initialValue: initialValue,
       forceUpdate: forceUpdate,
-      validateOnChange: validateOnChange
+      validateOnChange: validateOnChange,
+      dependsOn: dependsOn
     });
-  }, [environment, key, initialValue, forceUpdate, validateOnChange, label]);
+  }, [environment, key, initialValue, forceUpdate, validateOnChange, label, dependsOn]);
   resolver.setValidate(validate);
   React.useEffect(function () {
     return resolver.subscribe();

package/lib/useFormState.d.ts

@@ -1,12 +1,2 @@
-export declare const useFormState: () => {
-    readonly errors: readonly {
-        readonly check: number;
-        readonly error: string;
-        readonly id: string;
-        readonly key: string;
-        readonly label: string;
-    }[];
-    readonly isSubmitting: boolean;
-    readonly isValid: boolean;
-    readonly isValidating: boolean;
-};
+import { QueryErrorsData } from './relay/queries';
+export declare const useFormState: () => QueryErrorsData['form'] | null;

package/lib/useFormState.js

@@ -3,11 +3,12 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
+exports.useFormState = void 0;
 var React = require("react");
 var RelayStoreProvider_1 = require("./relay/RelayStoreProvider");
 var Utils_1 = require("./Utils");
-exports.useFormState = function () {
-  var environment = RelayStoreProvider_1.useStore();
+var useFormState = function () {
+  var environment = (0, RelayStoreProvider_1.useStore)();
   var snapshot = React.useMemo(function () {
     var s = environment.lookup(Utils_1.operationQueryErrorsForm.fragment);
     s.seenRecords.add('local:form');
@@ -23,4 +24,5 @@ exports.useFormState = function () {
     // eslint-disable-next-line react-hooks/exhaustive-deps
   }, [snapshot]);
   return data;
-};
+};
+exports.useFormState = useFormState;

package/lib/useFormValue.js

@@ -3,14 +3,15 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
+exports.useFormValue = void 0;
 var React = require("react");
 var queries_1 = require("./relay/queries");
 var RelayStoreProvider_1 = require("./relay/RelayStoreProvider");
 var Utils_1 = require("./Utils");
 function useFormValue(key) {
-  var environment = RelayStoreProvider_1.useStore();
+  var environment = (0, RelayStoreProvider_1.useStore)();
   var snapshot = React.useMemo(function () {
-    return Utils_1.getSnapshot(environment, queries_1.FragmentValue, key);
+    return (0, Utils_1.getSnapshot)(environment, queries_1.FragmentValue, key);
   }, [key, environment]);
   var _a = React.useState(snapshot.data),
     data = _a[0],

package/package.json

@@ -1,102 +1,106 @@
-{
-  "name": "relay-forms-nodeps",
-  "version": "2.0.0",
-  "keywords": [
-    "forms",
-    "relay",
-    "hooks",
-    "react",
-    "react-native",
-    "validation"
-  ],
-  "main": "lib/index.js",
-  "module": "./lib/es/index.js",
-  "unpkg": "lib/umd/relay-forms-nodeps.min.js",
-  "license": "MIT",
-  "description": "Relay Forms Without Deps",
-  "author": {
-    "name": "morrys"
-  },
-  "homepage": "https://morrys.github.io/relay-forms/docs/relay-forms.html",
-  "repository": {
-    "type": "git",
-    "url": "https://github.com/morrys/relay-forms"
-  },
-  "scripts": {
-    "clean": "rimraf lib",
-    "relay": "relay-compiler",
-    "compile": "npm run clean && tsc && tsc --project tsconfig.esm.json && npm run build:js && npm run build:replace && npm run rollup",
-    "build": "npm run compile && npm run test",
-    "fast:test": "npm run clean && tsc && npm run test",
-    "test": "cross-env NODE_ENV=test jest --coverage",
-    "format": "prettier --write \"src/**/*.ts*\" \"!src/relay/**/*.ts\"",
-    "format:ci": "prettier --list-different \"src/**/*.ts*\" \"!src/relay/**/*.ts\"",
-    "eslint": "eslint ./src --ext .js,.jsx,.ts,.tsx",
-    "prepublishOnly": "npm run build",
-    "build:js": "babel lib --out-dir lib --extensions \".js,.jsx\" && babel lib/es --out-dir lib/es --extensions \".js,.jsx\"",
-    "build:replace": "replace-in-file --configFile=replace.config.js",
-    "rollup": "rollup -c"
-  },
-  "relay": {
-    "src": "./compile/",
-    "schema": "./forms.graphql",
-    "excludes": [
-      "__generated__",
-      "node_modules"
-    ],
-    "language": "typescript",
-    "artifactDirectory": "./src/relay",
-    "persistConfig": {
-      "file": "./ignore-queries.json"
-    }
-  },
-  "peerDependencies": {
-    "react": "^16.9.0 || ^17 || ^18"
-  },
-  "devDependencies": {
-    "@babel/cli": "^7.8.3",
-    "@babel/runtime": "7.20.7",
-    "babel-preset-fbjs": "^3.3.0",
-    "@types/babel__traverse": "7.18.2",
-    "cross-env": "6.0.3",
-    "typescript": "3.8.3",
-    "react": "^18.0.0",
-    "react-dom": "^18.0.0",
-    "graphql": "^14.2.0",
-    "@types/react": "18.0.26",
-    "@types/react-dom": "18.0.10",
-    "relay-compiler": "^14.0.0",
-    "replace-in-file": "6.2.0",
-    "react-test-renderer": "^18.0.0",
-    "relay-test-utils": "^14.0.0",
-    "relay-test-utils-internal": "^14.0.0",
-    "@types/jest": "24.0.18",
-    "ts-jest": "^26.5.6",
-    "jest": "^26.0.0",
-    "promise-polyfill": "6.1.0",
-    "@typescript-eslint/eslint-plugin": "2.25.0",
-    "@typescript-eslint/parser": "2.25.0",
-    "eslint": "6.8.0",
-    "eslint-config-prettier": "6.10.1",
-    "eslint-import-resolver-typescript": "2.0.0",
-    "eslint-plugin-import": "2.20.1",
-    "eslint-plugin-json": "2.1.1",
-    "eslint-plugin-jsx-a11y": "6.2.3",
-    "eslint-plugin-prettier": "3.1.2",
-    "eslint-plugin-react": "7.19.0",
-    "eslint-plugin-react-hooks": "3.0.0",
-    "prettier": "1.19.1",
-    "rimraf": "^2.5.4",
-    "@types/node": "13.9.3",
-    "relay-compiler-language-typescript": "12.0.0",
-    "@testing-library/react": "13.4.0",
-    "rollup": "^2.23.0",
-    "rollup-plugin-sourcemaps": "0.6.2",
-    "rollup-plugin-terser": "^6.1.0",
-    "rollup-plugin-typescript2": "^0.27.1",
-    "@rollup/plugin-commonjs": "14.0.0",
-    "@rollup/plugin-node-resolve": "^8.4.0",
-    "@rollup/plugin-replace": "^2.3.3",
-    "@rollup/plugin-babel": "5.2.2"
-  }
-}
+{
+  "name": "relay-forms-nodeps",
+  "version": "2.3.0",
+  "keywords": [
+    "forms",
+    "relay",
+    "hooks",
+    "react",
+    "react-native",
+    "validation"
+  ],
+  "main": "lib/index.js",
+  "module": "./lib/es/index.js",
+  "unpkg": "lib/umd/relay-forms-nodeps.min.js",
+  "license": "MIT",
+  "description": "Relay Forms Without Deps",
+  "author": {
+    "name": "morrys"
+  },
+  "homepage": "https://morrys.github.io/relay-forms/docs/relay-forms.html",
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/morrys/relay-forms"
+  },
+  "scripts": {
+    "clean": "rimraf lib",
+    "relay": "relay-compiler",
+    "compile": "npm run clean && tsc && tsc --project tsconfig.esm.json && npm run build:js && npm run build:replace && npm run rollup",
+    "build": "npm run compile && npm run test",
+    "fast:test": "npm run clean && tsc && npm run test",
+    "test": "cross-env NODE_ENV=test jest --coverage",
+    "format": "prettier --write \"src/**/*.ts*\" \"!src/relay/**/*.ts\"",
+    "format:ci": "prettier --list-different \"src/**/*.ts*\" \"!src/relay/**/*.ts\"",
+    "eslint": "eslint ./src",
+    "prepublishOnly": "npm run build",
+    "build:js": "babel lib --out-dir lib --extensions \".js,.jsx\" && babel lib/es --out-dir lib/es --extensions \".js,.jsx\"",
+    "build:replace": "replace-in-file --configFile=replace.config.js",
+    "rollup": "rollup -c"
+  },
+  "relay": {
+    "src": "./compile/",
+    "schema": "./forms.graphql",
+    "excludes": [
+      "__generated__",
+      "node_modules"
+    ],
+    "language": "typescript",
+    "artifactDirectory": "./src/relay",
+    "persistConfig": {
+      "file": "./ignore-queries.json"
+    }
+  },
+  "peerDependencies": {
+    "react": "^16.9.0 || ^17 || ^18 || ^19"
+  },
+  "devDependencies": {
+    "@babel/cli": "^7.8.3",
+    "@babel/runtime": "7.20.7",
+    "@eslint/js": "^9.39.4",
+    "@rollup/plugin-babel": "5.2.2",
+    "@rollup/plugin-commonjs": "14.0.0",
+    "@rollup/plugin-node-resolve": "^8.4.0",
+    "@rollup/plugin-replace": "^2.3.3",
+    "@testing-library/react": "^16.3.2",
+    "@types/babel__traverse": "7.18.2",
+    "@types/jest": "24.0.18",
+    "@types/node": "13.9.3",
+    "@types/react": "^19.0.26",
+    "@types/react-dom": "^19.0.10",
+    "@typescript-eslint/eslint-plugin": "^8.62.1",
+    "@typescript-eslint/parser": "^8.62.1",
+    "babel-preset-fbjs": "^3.3.0",
+    "cross-env": "6.0.3",
+    "eslint": "^9.39.4",
+    "eslint-config-prettier": "^10.1.8",
+    "eslint-import-resolver-typescript": "4.4.5",
+    "eslint-plugin-import": "2.32.0",
+    "eslint-plugin-json": "4.0.1",
+    "eslint-plugin-jsx-a11y": "6.10.2",
+    "eslint-plugin-prettier": "5.5.6",
+    "eslint-plugin-react": "7.37.5",
+    "eslint-plugin-react-hooks": "7.1.1",
+    "graphql": "^14.2.0",
+    "jest": "^26.0.0",
+    "prettier": "^3.9.4",
+    "promise-polyfill": "6.1.0",
+    "react": "^19.0.0",
+    "react-dom": "^19.0.0",
+    "react-test-renderer": "^19.2.7",
+    "relay-compiler": "^21.0.0",
+    "relay-compiler-language-typescript": "12.0.0",
+    "relay-hooks": "^10.0.0",
+    "relay-runtime": "^21.0.0",
+    "relay-test-utils": "^21.0.0",
+    "relay-test-utils-internal": "^21.0.0",
+    "replace-in-file": "6.2.0",
+    "rimraf": "^2.5.4",
+    "rollup": "^2.23.0",
+    "rollup-plugin-sourcemaps": "0.6.2",
+    "rollup-plugin-terser": "^6.1.0",
+    "rollup-plugin-typescript2": "^0.27.1",
+    "ts-jest": "^26.5.6",
+    "tslib": "^2.8.1",
+    "typescript": "^4.0.0"
+  }
+}