remix-validated-form 4.6.6 → 4.6.7
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/index.cjs.js +39 -37
- package/dist/index.cjs.js.map +1 -1
- package/dist/index.esm.js +39 -37
- package/dist/index.esm.js.map +1 -1
- package/package.json +3 -1
package/dist/index.esm.js
CHANGED
@@ -122,8 +122,10 @@ function _setPathNormalized(object, path, value) {
|
|
122
122
|
}
|
123
123
|
|
124
124
|
// ../set-get/src/getPath.ts
|
125
|
-
import
|
126
|
-
var getPath = (object, path) =>
|
125
|
+
import get from "lodash.get";
|
126
|
+
var getPath = (object, path) => {
|
127
|
+
return get(object, path);
|
128
|
+
};
|
127
129
|
|
128
130
|
// src/internal/hooks.ts
|
129
131
|
import invariant3 from "tiny-invariant";
|
@@ -617,7 +619,7 @@ var defaultFormState = {
|
|
617
619
|
}
|
618
620
|
}
|
619
621
|
};
|
620
|
-
var createFormState = (set,
|
622
|
+
var createFormState = (set, get2) => ({
|
621
623
|
isHydrated: false,
|
622
624
|
isSubmitting: false,
|
623
625
|
hasBeenSubmitted: false,
|
@@ -625,7 +627,7 @@ var createFormState = (set, get) => ({
|
|
625
627
|
fieldErrors: {},
|
626
628
|
formElement: null,
|
627
629
|
currentDefaultValues: {},
|
628
|
-
isValid: () => Object.keys(
|
630
|
+
isValid: () => Object.keys(get2().fieldErrors).length === 0,
|
629
631
|
startSubmit: () => set((state) => {
|
630
632
|
state.isSubmitting = true;
|
631
633
|
state.hasBeenSubmitted = true;
|
@@ -663,7 +665,7 @@ var createFormState = (set, get) => ({
|
|
663
665
|
state.isHydrated = true;
|
664
666
|
}),
|
665
667
|
setFormElement: (formElement) => {
|
666
|
-
if (
|
668
|
+
if (get2().formElement === formElement)
|
667
669
|
return;
|
668
670
|
set((state) => {
|
669
671
|
state.formElement = formElement;
|
@@ -671,48 +673,48 @@ var createFormState = (set, get) => ({
|
|
671
673
|
},
|
672
674
|
validateField: async (field) => {
|
673
675
|
var _a, _b, _c;
|
674
|
-
const formElement =
|
676
|
+
const formElement = get2().formElement;
|
675
677
|
invariant2(
|
676
678
|
formElement,
|
677
679
|
"Cannot find reference to form. This is probably a bug in remix-validated-form."
|
678
680
|
);
|
679
|
-
const validator = (_a =
|
681
|
+
const validator = (_a = get2().formProps) == null ? void 0 : _a.validator;
|
680
682
|
invariant2(
|
681
683
|
validator,
|
682
684
|
"Cannot validator. This is probably a bug in remix-validated-form."
|
683
685
|
);
|
684
|
-
await ((_c = (_b =
|
686
|
+
await ((_c = (_b = get2().controlledFields).awaitValueUpdate) == null ? void 0 : _c.call(_b, field));
|
685
687
|
const { error } = await validator.validateField(
|
686
688
|
new FormData(formElement),
|
687
689
|
field
|
688
690
|
);
|
689
691
|
if (error) {
|
690
|
-
|
692
|
+
get2().setFieldError(field, error);
|
691
693
|
return error;
|
692
694
|
} else {
|
693
|
-
|
695
|
+
get2().clearFieldError(field);
|
694
696
|
return null;
|
695
697
|
}
|
696
698
|
},
|
697
699
|
validate: async () => {
|
698
700
|
var _a;
|
699
|
-
const formElement =
|
701
|
+
const formElement = get2().formElement;
|
700
702
|
invariant2(
|
701
703
|
formElement,
|
702
704
|
"Cannot find reference to form. This is probably a bug in remix-validated-form."
|
703
705
|
);
|
704
|
-
const validator = (_a =
|
706
|
+
const validator = (_a = get2().formProps) == null ? void 0 : _a.validator;
|
705
707
|
invariant2(
|
706
708
|
validator,
|
707
709
|
"Cannot validator. This is probably a bug in remix-validated-form."
|
708
710
|
);
|
709
711
|
const result = await validator.validate(new FormData(formElement));
|
710
712
|
if (result.error)
|
711
|
-
|
713
|
+
get2().setFieldErrors(result.error.fieldErrors);
|
712
714
|
return result;
|
713
715
|
},
|
714
716
|
submit: () => {
|
715
|
-
const formElement =
|
717
|
+
const formElement = get2().formElement;
|
716
718
|
invariant2(
|
717
719
|
formElement,
|
718
720
|
"Cannot find reference to form. This is probably a bug in remix-validated-form."
|
@@ -721,11 +723,11 @@ var createFormState = (set, get) => ({
|
|
721
723
|
},
|
722
724
|
getValues: () => {
|
723
725
|
var _a;
|
724
|
-
return new FormData((_a =
|
726
|
+
return new FormData((_a = get2().formElement) != null ? _a : void 0);
|
725
727
|
},
|
726
728
|
resetFormElement: () => {
|
727
729
|
var _a;
|
728
|
-
return (_a =
|
730
|
+
return (_a = get2().formElement) == null ? void 0 : _a.reset();
|
729
731
|
},
|
730
732
|
controlledFields: {
|
731
733
|
values: {},
|
@@ -740,7 +742,7 @@ var createFormState = (set, get) => ({
|
|
740
742
|
});
|
741
743
|
},
|
742
744
|
unregister: (fieldName) => {
|
743
|
-
if (
|
745
|
+
if (get2() === null || get2() === void 0)
|
744
746
|
return;
|
745
747
|
set((state) => {
|
746
748
|
var _a, _b, _c;
|
@@ -767,12 +769,12 @@ var createFormState = (set, get) => ({
|
|
767
769
|
delete state.controlledFields.refCounts[fieldName];
|
768
770
|
});
|
769
771
|
},
|
770
|
-
getValue: (fieldName) => getPath(
|
772
|
+
getValue: (fieldName) => getPath(get2().controlledFields.values, fieldName),
|
771
773
|
setValue: (fieldName, value) => {
|
772
774
|
set((state) => {
|
773
775
|
setPath(state.controlledFields.values, fieldName, value);
|
774
776
|
});
|
775
|
-
|
777
|
+
get2().controlledFields.kickoffValueUpdate(fieldName);
|
776
778
|
},
|
777
779
|
kickoffValueUpdate: (fieldName) => {
|
778
780
|
const clear = () => set((state) => {
|
@@ -787,7 +789,7 @@ var createFormState = (set, get) => ({
|
|
787
789
|
});
|
788
790
|
},
|
789
791
|
awaitValueUpdate: async (fieldName) => {
|
790
|
-
await
|
792
|
+
await get2().controlledFields.valueUpdatePromises[fieldName];
|
791
793
|
},
|
792
794
|
array: {
|
793
795
|
push: (fieldName, item) => {
|
@@ -795,7 +797,7 @@ var createFormState = (set, get) => ({
|
|
795
797
|
getArray(state.controlledFields.values, fieldName).push(item);
|
796
798
|
getArray(state.currentDefaultValues, fieldName).push(item);
|
797
799
|
});
|
798
|
-
|
800
|
+
get2().controlledFields.kickoffValueUpdate(fieldName);
|
799
801
|
},
|
800
802
|
swap: (fieldName, indexA, indexB) => {
|
801
803
|
set((state) => {
|
@@ -820,7 +822,7 @@ var createFormState = (set, get) => ({
|
|
820
822
|
(array) => swap(array, indexA, indexB)
|
821
823
|
);
|
822
824
|
});
|
823
|
-
|
825
|
+
get2().controlledFields.kickoffValueUpdate(fieldName);
|
824
826
|
},
|
825
827
|
move: (fieldName, from2, to) => {
|
826
828
|
set((state) => {
|
@@ -845,7 +847,7 @@ var createFormState = (set, get) => ({
|
|
845
847
|
(array) => move(array, from2, to)
|
846
848
|
);
|
847
849
|
});
|
848
|
-
|
850
|
+
get2().controlledFields.kickoffValueUpdate(fieldName);
|
849
851
|
},
|
850
852
|
insert: (fieldName, index, item) => {
|
851
853
|
set((state) => {
|
@@ -870,7 +872,7 @@ var createFormState = (set, get) => ({
|
|
870
872
|
(array) => insert(array, index, void 0)
|
871
873
|
);
|
872
874
|
});
|
873
|
-
|
875
|
+
get2().controlledFields.kickoffValueUpdate(fieldName);
|
874
876
|
},
|
875
877
|
remove: (fieldName, index) => {
|
876
878
|
set((state) => {
|
@@ -893,7 +895,7 @@ var createFormState = (set, get) => ({
|
|
893
895
|
(array) => remove(array, index)
|
894
896
|
);
|
895
897
|
});
|
896
|
-
|
898
|
+
get2().controlledFields.kickoffValueUpdate(fieldName);
|
897
899
|
},
|
898
900
|
pop: (fieldName) => {
|
899
901
|
set((state) => {
|
@@ -910,7 +912,7 @@ var createFormState = (set, get) => ({
|
|
910
912
|
(array) => array.pop()
|
911
913
|
);
|
912
914
|
});
|
913
|
-
|
915
|
+
get2().controlledFields.kickoffValueUpdate(fieldName);
|
914
916
|
},
|
915
917
|
unshift: (fieldName, value) => {
|
916
918
|
set((state) => {
|
@@ -951,17 +953,17 @@ var createFormState = (set, get) => ({
|
|
951
953
|
(array) => replace(array, index, item)
|
952
954
|
);
|
953
955
|
});
|
954
|
-
|
956
|
+
get2().controlledFields.kickoffValueUpdate(fieldName);
|
955
957
|
}
|
956
958
|
}
|
957
959
|
}
|
958
960
|
});
|
959
961
|
var useRootFormStore = create()(
|
960
|
-
immer((set,
|
962
|
+
immer((set, get2) => ({
|
961
963
|
forms: {},
|
962
964
|
form: (formId) => {
|
963
965
|
var _a;
|
964
|
-
return (_a =
|
966
|
+
return (_a = get2().forms[formId]) != null ? _a : defaultFormState;
|
965
967
|
},
|
966
968
|
cleanupForm: (formId) => {
|
967
969
|
set((state) => {
|
@@ -969,12 +971,12 @@ var useRootFormStore = create()(
|
|
969
971
|
});
|
970
972
|
},
|
971
973
|
registerForm: (formId) => {
|
972
|
-
if (
|
974
|
+
if (get2().forms[formId])
|
973
975
|
return;
|
974
976
|
set((state) => {
|
975
977
|
state.forms[formId] = createFormState(
|
976
978
|
(setter) => set((state2) => setter(state2.forms[formId])),
|
977
|
-
() =>
|
979
|
+
() => get2().forms[formId]
|
978
980
|
);
|
979
981
|
});
|
980
982
|
}
|
@@ -1278,7 +1280,7 @@ import {
|
|
1278
1280
|
useRef as useRef4,
|
1279
1281
|
useState
|
1280
1282
|
} from "react";
|
1281
|
-
import * as
|
1283
|
+
import * as R3 from "remeda";
|
1282
1284
|
|
1283
1285
|
// src/internal/MultiValueMap.ts
|
1284
1286
|
import { useCallback as useCallback3, useRef } from "react";
|
@@ -1341,7 +1343,7 @@ function useSubmitComplete(isSubmitting, callback) {
|
|
1341
1343
|
|
1342
1344
|
// src/internal/util.ts
|
1343
1345
|
import { useEffect as useEffect4, useLayoutEffect, useRef as useRef3 } from "react";
|
1344
|
-
import * as
|
1346
|
+
import * as R2 from "remeda";
|
1345
1347
|
var mergeRefs = (refs) => {
|
1346
1348
|
return (value) => {
|
1347
1349
|
refs.filter(Boolean).forEach((ref) => {
|
@@ -1356,7 +1358,7 @@ var mergeRefs = (refs) => {
|
|
1356
1358
|
var useIsomorphicLayoutEffect = typeof window !== "undefined" ? useLayoutEffect : useEffect4;
|
1357
1359
|
var useDeepEqualsMemo = (item) => {
|
1358
1360
|
const ref = useRef3(item);
|
1359
|
-
const areEqual = ref.current === item ||
|
1361
|
+
const areEqual = ref.current === item || R2.equals(ref.current, item);
|
1360
1362
|
useEffect4(() => {
|
1361
1363
|
if (!areEqual) {
|
1362
1364
|
ref.current = item;
|
@@ -1379,7 +1381,7 @@ var focusFirstInvalidInput = (fieldErrors, customFocusHandlers, formElement) =>
|
|
1379
1381
|
return input.name;
|
1380
1382
|
return null;
|
1381
1383
|
}).filter(nonNull).filter((name) => name in fieldErrors);
|
1382
|
-
const uniqueNamesInOrder =
|
1384
|
+
const uniqueNamesInOrder = R3.uniq(namesInOrder);
|
1383
1385
|
for (const fieldName of uniqueNamesInOrder) {
|
1384
1386
|
if (customFocusHandlers.has(fieldName)) {
|
1385
1387
|
customFocusHandlers.getAll(fieldName).forEach((handler) => {
|
@@ -1614,7 +1616,7 @@ function ValidatedForm({
|
|
1614
1616
|
}
|
1615
1617
|
|
1616
1618
|
// src/validation/createValidator.ts
|
1617
|
-
import * as
|
1619
|
+
import * as R4 from "remeda";
|
1618
1620
|
|
1619
1621
|
// src/internal/flatten.ts
|
1620
1622
|
var objectFromPathEntries = (entries) => {
|
@@ -1632,7 +1634,7 @@ var preprocessFormData = (data) => {
|
|
1632
1634
|
return objectFromPathEntries([...data.entries()]);
|
1633
1635
|
return objectFromPathEntries(Object.entries(data));
|
1634
1636
|
};
|
1635
|
-
var omitInternalFields = (data) =>
|
1637
|
+
var omitInternalFields = (data) => R4.omit(data, [FORM_ID_FIELD]);
|
1636
1638
|
function createValidator(validator) {
|
1637
1639
|
return {
|
1638
1640
|
validate: async (value) => {
|