remix-validated-form 4.6.6 → 4.6.8
Sign up to get free protection for your applications and to get access to all the features.
- package/.turbo/turbo-typecheck.log +13 -0
- package/dist/index.cjs.js +41 -39
- package/dist/index.cjs.js.map +1 -1
- package/dist/index.esm.js +40 -38
- package/dist/index.esm.js.map +1 -1
- package/package.json +4 -2
- package/src/internal/state/createFormStore.ts +1 -1
- package/stats.html +1 -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";
|
@@ -155,7 +157,7 @@ var hydratable = {
|
|
155
157
|
|
156
158
|
// src/internal/state/createFormStore.ts
|
157
159
|
import invariant2 from "tiny-invariant";
|
158
|
-
import create from "zustand";
|
160
|
+
import { create } from "zustand";
|
159
161
|
import { immer } from "zustand/middleware/immer";
|
160
162
|
|
161
163
|
// src/internal/logic/requestSubmit.ts
|
@@ -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) => {
|