envoc-form 4.1.0 → 5.0.1
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/README.md +236 -180
- package/es/AddressInput/AddressInput.d.ts +24 -25
- package/es/AddressInput/AddressInput.js +20 -31
- package/es/AddressInput/UsStates.d.ts +3 -3
- package/es/AddressInput/UsStates.js +53 -53
- package/es/ConfirmBaseForm/ConfirmBaseForm.d.ts +26 -26
- package/es/ConfirmBaseForm/ConfirmBaseForm.js +42 -42
- package/es/ConfirmDeleteForm/ConfirmDeleteForm.d.ts +24 -24
- package/es/ConfirmDeleteForm/ConfirmDeleteForm.js +60 -60
- package/es/DatePicker/DatePickerGroup.d.ts +13 -14
- package/es/DatePicker/DatePickerGroup.js +87 -87
- package/es/DatePicker/DatePickerHelper.d.ts +3 -3
- package/es/DatePicker/DatePickerHelper.js +1 -1
- package/es/DatePicker/StringDateOnlyPickerGroup.d.ts +9 -10
- package/es/DatePicker/StringDateOnlyPickerGroup.js +29 -29
- package/es/DatePicker/StringDatePickerGroup.d.ts +9 -10
- package/es/DatePicker/StringDatePickerGroup.js +24 -24
- package/es/Field/CustomFieldInputProps.d.ts +7 -7
- package/es/Field/CustomFieldInputProps.js +1 -1
- package/es/Field/CustomFieldMetaProps.d.ts +4 -4
- package/es/Field/CustomFieldMetaProps.js +1 -1
- package/es/Field/Field.d.ts +28 -28
- package/es/Field/Field.js +51 -51
- package/es/Field/FieldErrorScrollTarget.d.ts +2 -3
- package/es/Field/FieldErrorScrollTarget.js +12 -12
- package/es/Field/FieldNameContext.d.ts +3 -3
- package/es/Field/FieldNameContext.js +3 -3
- package/es/Field/FieldSection.d.ts +7 -7
- package/es/Field/FieldSection.js +9 -20
- package/es/Field/InjectedFieldProps.d.ts +7 -7
- package/es/Field/InjectedFieldProps.js +1 -1
- package/es/Field/StandAloneInput.d.ts +13 -13
- package/es/Field/StandAloneInput.js +50 -50
- package/es/Field/useStandardField.d.ts +21 -21
- package/es/Field/useStandardField.js +92 -92
- package/es/FieldArray/FieldArray.d.ts +24 -24
- package/es/FieldArray/FieldArray.js +77 -88
- package/es/File/FileGroup.d.ts +10 -10
- package/es/File/FileGroup.js +53 -53
- package/es/File/FileList.d.ts +5 -6
- package/es/File/FileList.js +10 -21
- package/es/File/humanFileSize.d.ts +1 -1
- package/es/File/humanFileSize.js +6 -6
- package/es/Form/FocusError.d.ts +7 -7
- package/es/Form/FocusError.js +42 -42
- package/es/Form/Form.d.ts +33 -33
- package/es/Form/Form.js +141 -141
- package/es/Form/FormBasedPreventNavigation.d.ts +6 -7
- package/es/Form/FormBasedPreventNavigation.js +20 -20
- package/es/Form/LegacyFormBasedPreventNavigation.d.ts +17 -17
- package/es/Form/LegacyFormBasedPreventNavigation.js +69 -69
- package/es/Form/NewFormBasedPreventNavigation.d.ts +14 -14
- package/es/Form/NewFormBasedPreventNavigation.js +39 -39
- package/es/Form/ServerErrorContext.d.ts +11 -11
- package/es/Form/ServerErrorContext.js +9 -9
- package/es/FormActions.d.ts +12 -13
- package/es/FormActions.js +16 -27
- package/es/FormDefaults.d.ts +4 -4
- package/es/FormDefaults.js +2 -2
- package/es/Group.d.ts +16 -16
- package/es/Group.js +14 -25
- package/es/Input/IconInputGroup.d.ts +12 -12
- package/es/Input/IconInputGroup.js +43 -43
- package/es/Input/InputGroup.d.ts +12 -12
- package/es/Input/InputGroup.js +34 -34
- package/es/Input/MoneyInputGroup.d.ts +9 -9
- package/es/Input/MoneyInputGroup.js +43 -43
- package/es/Input/NumberInputGroup.d.ts +9 -9
- package/es/Input/NumberInputGroup.js +43 -43
- package/es/Input/StringInputGroup.d.ts +8 -8
- package/es/Input/StringInputGroup.js +43 -43
- package/es/Normalization/NormalizationFunction.d.ts +4 -4
- package/es/Normalization/NormalizationFunction.js +1 -1
- package/es/Normalization/normalizers.d.ts +4 -4
- package/es/Normalization/normalizers.js +32 -32
- package/es/Select/BooleanSelectGroup.d.ts +7 -8
- package/es/Select/BooleanSelectGroup.js +28 -28
- package/es/Select/NumberSelectGroup.d.ts +9 -10
- package/es/Select/NumberSelectGroup.js +21 -21
- package/es/Select/SelectGroup.d.ts +27 -28
- package/es/Select/SelectGroup.js +65 -65
- package/es/Select/SelectGroupPropsHelper.d.ts +3 -3
- package/es/Select/SelectGroupPropsHelper.js +1 -1
- package/es/Select/StringSelectGroup.d.ts +9 -10
- package/es/Select/StringSelectGroup.js +21 -21
- package/es/StandardFormActions.d.ts +11 -11
- package/es/StandardFormActions.js +14 -25
- package/es/SubmitFormButton.d.ts +10 -10
- package/es/SubmitFormButton.js +40 -40
- package/es/TextArea/TextAreaGroup.d.ts +9 -9
- package/es/TextArea/TextAreaGroup.js +35 -35
- package/es/Validation/ValidatedApiResult.d.ts +6 -6
- package/es/Validation/ValidatedApiResult.js +1 -1
- package/es/Validation/ValidationError.d.ts +5 -5
- package/es/Validation/ValidationError.js +1 -1
- package/es/Validation/ValidationFunction.d.ts +4 -4
- package/es/Validation/ValidationFunction.js +1 -1
- package/es/Validation/validators.d.ts +18 -18
- package/es/Validation/validators.js +77 -77
- package/es/index.d.ts +73 -73
- package/es/index.js +50 -50
- package/es/setupTests.d.ts +1 -1
- package/es/setupTests.js +1 -1
- package/es/utils/objectContainsNonSerializableProperty.d.ts +1 -1
- package/es/utils/objectContainsNonSerializableProperty.js +14 -14
- package/es/utils/objectToFormData.d.ts +10 -10
- package/es/utils/objectToFormData.js +77 -77
- package/es/utils/typeChecks.d.ts +8 -8
- package/es/utils/typeChecks.js +18 -18
- package/lib/AddressInput/AddressInput.d.ts +24 -25
- package/lib/AddressInput/AddressInput.js +26 -37
- package/lib/AddressInput/UsStates.d.ts +3 -3
- package/lib/AddressInput/UsStates.js +55 -55
- package/lib/ConfirmBaseForm/ConfirmBaseForm.d.ts +26 -26
- package/lib/ConfirmBaseForm/ConfirmBaseForm.js +48 -48
- package/lib/ConfirmDeleteForm/ConfirmDeleteForm.d.ts +24 -24
- package/lib/ConfirmDeleteForm/ConfirmDeleteForm.js +66 -66
- package/lib/DatePicker/DatePickerGroup.d.ts +13 -14
- package/lib/DatePicker/DatePickerGroup.js +95 -95
- package/lib/DatePicker/DatePickerHelper.d.ts +3 -3
- package/lib/DatePicker/DatePickerHelper.js +2 -2
- package/lib/DatePicker/StringDateOnlyPickerGroup.d.ts +9 -10
- package/lib/DatePicker/StringDateOnlyPickerGroup.js +35 -35
- package/lib/DatePicker/StringDatePickerGroup.d.ts +9 -10
- package/lib/DatePicker/StringDatePickerGroup.js +30 -30
- package/lib/Field/CustomFieldInputProps.d.ts +7 -7
- package/lib/Field/CustomFieldInputProps.js +2 -2
- package/lib/Field/CustomFieldMetaProps.d.ts +4 -4
- package/lib/Field/CustomFieldMetaProps.js +2 -2
- package/lib/Field/Field.d.ts +28 -28
- package/lib/Field/Field.js +56 -56
- package/lib/Field/FieldErrorScrollTarget.d.ts +2 -3
- package/lib/Field/FieldErrorScrollTarget.js +15 -15
- package/lib/Field/FieldNameContext.d.ts +3 -3
- package/lib/Field/FieldNameContext.js +9 -9
- package/lib/Field/FieldSection.d.ts +7 -7
- package/lib/Field/FieldSection.js +12 -23
- package/lib/Field/InjectedFieldProps.d.ts +7 -7
- package/lib/Field/InjectedFieldProps.js +2 -2
- package/lib/Field/StandAloneInput.d.ts +13 -13
- package/lib/Field/StandAloneInput.js +76 -76
- package/lib/Field/useStandardField.d.ts +21 -21
- package/lib/Field/useStandardField.js +95 -95
- package/lib/FieldArray/FieldArray.d.ts +24 -24
- package/lib/FieldArray/FieldArray.js +83 -94
- package/lib/File/FileGroup.d.ts +10 -10
- package/lib/File/FileGroup.js +58 -58
- package/lib/File/FileList.d.ts +5 -6
- package/lib/File/FileList.js +13 -24
- package/lib/File/humanFileSize.d.ts +1 -1
- package/lib/File/humanFileSize.js +10 -10
- package/lib/Form/FocusError.d.ts +7 -7
- package/lib/Form/FocusError.js +48 -48
- package/lib/Form/Form.d.ts +33 -33
- package/lib/Form/Form.js +147 -147
- package/lib/Form/FormBasedPreventNavigation.d.ts +6 -7
- package/lib/Form/FormBasedPreventNavigation.js +26 -26
- package/lib/Form/LegacyFormBasedPreventNavigation.d.ts +17 -17
- package/lib/Form/LegacyFormBasedPreventNavigation.js +72 -72
- package/lib/Form/NewFormBasedPreventNavigation.d.ts +14 -14
- package/lib/Form/NewFormBasedPreventNavigation.js +42 -42
- package/lib/Form/ServerErrorContext.d.ts +11 -11
- package/lib/Form/ServerErrorContext.js +15 -15
- package/lib/FormActions.d.ts +12 -13
- package/lib/FormActions.js +22 -33
- package/lib/FormDefaults.d.ts +4 -4
- package/lib/FormDefaults.js +5 -5
- package/lib/Group.d.ts +16 -16
- package/lib/Group.js +20 -31
- package/lib/Input/IconInputGroup.d.ts +12 -12
- package/lib/Input/IconInputGroup.js +48 -48
- package/lib/Input/InputGroup.d.ts +12 -12
- package/lib/Input/InputGroup.js +39 -39
- package/lib/Input/MoneyInputGroup.d.ts +9 -9
- package/lib/Input/MoneyInputGroup.js +48 -48
- package/lib/Input/NumberInputGroup.d.ts +9 -9
- package/lib/Input/NumberInputGroup.js +48 -48
- package/lib/Input/StringInputGroup.d.ts +8 -8
- package/lib/Input/StringInputGroup.js +48 -48
- package/lib/Normalization/NormalizationFunction.d.ts +4 -4
- package/lib/Normalization/NormalizationFunction.js +2 -2
- package/lib/Normalization/normalizers.d.ts +4 -4
- package/lib/Normalization/normalizers.js +37 -37
- package/lib/Select/BooleanSelectGroup.d.ts +7 -8
- package/lib/Select/BooleanSelectGroup.js +35 -35
- package/lib/Select/NumberSelectGroup.d.ts +9 -10
- package/lib/Select/NumberSelectGroup.js +29 -29
- package/lib/Select/SelectGroup.d.ts +27 -28
- package/lib/Select/SelectGroup.js +71 -71
- package/lib/Select/SelectGroupPropsHelper.d.ts +3 -3
- package/lib/Select/SelectGroupPropsHelper.js +2 -2
- package/lib/Select/StringSelectGroup.d.ts +9 -10
- package/lib/Select/StringSelectGroup.js +29 -29
- package/lib/StandardFormActions.d.ts +11 -11
- package/lib/StandardFormActions.js +20 -31
- package/lib/SubmitFormButton.d.ts +10 -10
- package/lib/SubmitFormButton.js +45 -45
- package/lib/TextArea/TextAreaGroup.d.ts +9 -9
- package/lib/TextArea/TextAreaGroup.js +40 -40
- package/lib/Validation/ValidatedApiResult.d.ts +6 -6
- package/lib/Validation/ValidatedApiResult.js +2 -2
- package/lib/Validation/ValidationError.d.ts +5 -5
- package/lib/Validation/ValidationError.js +2 -2
- package/lib/Validation/ValidationFunction.d.ts +4 -4
- package/lib/Validation/ValidationFunction.js +2 -2
- package/lib/Validation/validators.d.ts +18 -18
- package/lib/Validation/validators.js +90 -90
- package/lib/index.d.ts +73 -73
- package/lib/index.js +117 -117
- package/lib/setupTests.d.ts +1 -1
- package/lib/setupTests.js +3 -3
- package/lib/utils/objectContainsNonSerializableProperty.d.ts +1 -1
- package/lib/utils/objectContainsNonSerializableProperty.js +17 -17
- package/lib/utils/objectToFormData.d.ts +10 -10
- package/lib/utils/objectToFormData.js +79 -79
- package/lib/utils/typeChecks.d.ts +8 -8
- package/lib/utils/typeChecks.js +29 -29
- package/package.json +12 -12
- package/src/AddressInput/__snapshots__/AddressInput.test.tsx.snap +6 -8
- package/src/Select/__tests__/__snapshots__/BooleanSelectGroup.test.tsx.snap +6 -8
- package/src/Select/__tests__/__snapshots__/NumberSelectGroup.test.tsx.snap +12 -16
- package/src/Select/__tests__/__snapshots__/StringSelectGroup.test.tsx.snap +12 -16
- package/src/utils/objectToFormData.test.tsx +1 -1
package/es/Form/Form.js
CHANGED
@@ -1,141 +1,141 @@
|
|
1
|
-
var __assign = (this && this.__assign) || function () {
|
2
|
-
__assign = Object.assign || function(t) {
|
3
|
-
for (var s, i = 1, n = arguments.length; i < n; i++) {
|
4
|
-
s = arguments[i];
|
5
|
-
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
|
6
|
-
t[p] = s[p];
|
7
|
-
}
|
8
|
-
return t;
|
9
|
-
};
|
10
|
-
return __assign.apply(this, arguments);
|
11
|
-
};
|
12
|
-
var __rest = (this && this.__rest) || function (s, e) {
|
13
|
-
var t = {};
|
14
|
-
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
|
15
|
-
t[p] = s[p];
|
16
|
-
if (s != null && typeof Object.getOwnPropertySymbols === "function")
|
17
|
-
for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
|
18
|
-
if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
|
19
|
-
t[p[i]] = s[p[i]];
|
20
|
-
}
|
21
|
-
return t;
|
22
|
-
};
|
23
|
-
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
24
|
-
import { useContext, useMemo, useState, } from 'react';
|
25
|
-
import classNames from 'classnames';
|
26
|
-
import { Form as FormikFormWrapper, Formik, useFormikContext, } from 'formik';
|
27
|
-
import FocusError from './FocusError';
|
28
|
-
import FormBasedPreventNavigation from './FormBasedPreventNavigation';
|
29
|
-
import { ServerErrorContext, } from './ServerErrorContext';
|
30
|
-
import Field from '../Field/Field';
|
31
|
-
import FieldArray from '../FieldArray/FieldArray';
|
32
|
-
import { FormDefaults } from '../FormDefaults';
|
33
|
-
import objectContainsNonSerializableProperty from '../utils/objectContainsNonSerializableProperty';
|
34
|
-
import objectToFormData from '../utils/objectToFormData';
|
35
|
-
/** Define a form. Uses [formik](https://formik.org/docs/overview). Usually contains many `<Field/>` components. */
|
36
|
-
export default function Form(_a) {
|
37
|
-
var children = _a.children, className = _a.className, style = _a.style, ignoreLostChanges = _a.ignoreLostChanges, onSubmit = _a.onSubmit, onFormDataSubmit = _a.onFormDataSubmit, initialValues = _a.initialValues, props = __rest(_a, ["children", "className", "style", "ignoreLostChanges", "onSubmit", "onFormDataSubmit", "initialValues"]);
|
38
|
-
// formik resets all error on each blur (with our settings)
|
39
|
-
// this means that ALL errors from the server disappear when any one field is blurred
|
40
|
-
// So, we have to store server errors ourselves
|
41
|
-
// Since we only use useStandardFormInput, that means there is only one consumer
|
42
|
-
var _b = useState({}), serverErrors = _b[0], setServerErrors = _b[1];
|
43
|
-
var serverErrorContextValue = useMemo(function () { return ({
|
44
|
-
errors: serverErrors,
|
45
|
-
getError: function (path) {
|
46
|
-
var lowered = path.toLowerCase();
|
47
|
-
return serverErrors && serverErrors[lowered];
|
48
|
-
},
|
49
|
-
setError: function (path, errorMessage) {
|
50
|
-
var _a;
|
51
|
-
var lowered = path.toLowerCase();
|
52
|
-
setServerErrors(Object.assign({}, serverErrors, (_a = {},
|
53
|
-
_a[lowered] = !errorMessage ? undefined : errorMessage,
|
54
|
-
_a)));
|
55
|
-
},
|
56
|
-
}); }, [serverErrors]);
|
57
|
-
return (_jsx(Formik, __assign({ validateOnChange: false, validateOnBlur: true, validateOnMount: false, initialValues: initialValues || {}, onSubmit: handleSubmit }, props, { children: _jsx(ServerErrorContext.Provider,
|
58
|
-
// hack for ref forwarding
|
59
|
-
Field: Field,
|
60
|
-
FieldArray: FieldArray,
|
61
|
-
})] })
|
62
|
-
function handleSubmit(values, formikBag) {
|
63
|
-
var formData = undefined;
|
64
|
-
var submitFunc;
|
65
|
-
if (objectContainsNonSerializableProperty(values)) {
|
66
|
-
formData = objectToFormData(values, {
|
67
|
-
indices: true,
|
68
|
-
dotNotation: true,
|
69
|
-
allowEmptyArrays: true,
|
70
|
-
noFileListBrackets: true,
|
71
|
-
});
|
72
|
-
if (onFormDataSubmit === undefined) {
|
73
|
-
throw new Error('No onFormDataSubmit supplied for non-serializable properties.');
|
74
|
-
}
|
75
|
-
submitFunc = function () {
|
76
|
-
return onFormDataSubmit(formData !== null && formData !== void 0 ? formData : new FormData(), formikBag);
|
77
|
-
};
|
78
|
-
}
|
79
|
-
else {
|
80
|
-
if (onSubmit === undefined) {
|
81
|
-
formData = objectToFormData(values, {
|
82
|
-
indices: true,
|
83
|
-
dotNotation: true,
|
84
|
-
allowEmptyArrays: true,
|
85
|
-
noFileListBrackets: true,
|
86
|
-
});
|
87
|
-
if (onFormDataSubmit === undefined) {
|
88
|
-
// This error should never occur, as this case is covered by RequireAtLeastOne type safety
|
89
|
-
throw new Error('No onFormDataSubmit supplied for non-serializable properties.');
|
90
|
-
}
|
91
|
-
submitFunc = function () {
|
92
|
-
return onFormDataSubmit(formData !== null && formData !== void 0 ? formData : new FormData(), formikBag);
|
93
|
-
};
|
94
|
-
}
|
95
|
-
else {
|
96
|
-
submitFunc = function () { return onSubmit(values, formikBag); };
|
97
|
-
}
|
98
|
-
}
|
99
|
-
return submitFunc()
|
100
|
-
.then(function (response) {
|
101
|
-
return response;
|
102
|
-
})
|
103
|
-
.catch(function (err) {
|
104
|
-
//this is an http error
|
105
|
-
if (err &&
|
106
|
-
err.response &&
|
107
|
-
err.response.data &&
|
108
|
-
err.response.data.validationFailures) {
|
109
|
-
try {
|
110
|
-
var serverErrors_1 = err.response.data.validationFailures.reduce(function (acc, value) {
|
111
|
-
var _a;
|
112
|
-
// for simplicity, just keep it to one server error at a time per path
|
113
|
-
// don't care of the property name case changes
|
114
|
-
var path = (_a = value.propertyName) === null || _a === void 0 ? void 0 : _a.toLowerCase();
|
115
|
-
if (!!path && !!value.errorMessage) {
|
116
|
-
acc[path] = value.errorMessage;
|
117
|
-
}
|
118
|
-
return acc;
|
119
|
-
}, {});
|
120
|
-
setServerErrors(serverErrors_1);
|
121
|
-
}
|
122
|
-
catch (err) {
|
123
|
-
console.error('Failure to getErrorObject');
|
124
|
-
console.error(err);
|
125
|
-
throw err;
|
126
|
-
}
|
127
|
-
}
|
128
|
-
throw err;
|
129
|
-
});
|
130
|
-
}
|
131
|
-
}
|
132
|
-
Form.DisplayFormState = DisplayFormState;
|
133
|
-
function DisplayFormState() {
|
134
|
-
var formState = useFormikContext();
|
135
|
-
var serverErrorContext = useContext(ServerErrorContext);
|
136
|
-
return (_jsx("div",
|
137
|
-
background: '#f6f8fa',
|
138
|
-
fontSize: '.65rem',
|
139
|
-
padding: '.5rem',
|
140
|
-
}
|
141
|
-
}
|
1
|
+
var __assign = (this && this.__assign) || function () {
|
2
|
+
__assign = Object.assign || function(t) {
|
3
|
+
for (var s, i = 1, n = arguments.length; i < n; i++) {
|
4
|
+
s = arguments[i];
|
5
|
+
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
|
6
|
+
t[p] = s[p];
|
7
|
+
}
|
8
|
+
return t;
|
9
|
+
};
|
10
|
+
return __assign.apply(this, arguments);
|
11
|
+
};
|
12
|
+
var __rest = (this && this.__rest) || function (s, e) {
|
13
|
+
var t = {};
|
14
|
+
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
|
15
|
+
t[p] = s[p];
|
16
|
+
if (s != null && typeof Object.getOwnPropertySymbols === "function")
|
17
|
+
for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
|
18
|
+
if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
|
19
|
+
t[p[i]] = s[p[i]];
|
20
|
+
}
|
21
|
+
return t;
|
22
|
+
};
|
23
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
24
|
+
import { useContext, useMemo, useState, } from 'react';
|
25
|
+
import classNames from 'classnames';
|
26
|
+
import { Form as FormikFormWrapper, Formik, useFormikContext, } from 'formik';
|
27
|
+
import FocusError from './FocusError';
|
28
|
+
import FormBasedPreventNavigation from './FormBasedPreventNavigation';
|
29
|
+
import { ServerErrorContext, } from './ServerErrorContext';
|
30
|
+
import Field from '../Field/Field';
|
31
|
+
import FieldArray from '../FieldArray/FieldArray';
|
32
|
+
import { FormDefaults } from '../FormDefaults';
|
33
|
+
import objectContainsNonSerializableProperty from '../utils/objectContainsNonSerializableProperty';
|
34
|
+
import objectToFormData from '../utils/objectToFormData';
|
35
|
+
/** Define a form. Uses [formik](https://formik.org/docs/overview). Usually contains many `<Field/>` components. */
|
36
|
+
export default function Form(_a) {
|
37
|
+
var children = _a.children, className = _a.className, style = _a.style, ignoreLostChanges = _a.ignoreLostChanges, onSubmit = _a.onSubmit, onFormDataSubmit = _a.onFormDataSubmit, initialValues = _a.initialValues, props = __rest(_a, ["children", "className", "style", "ignoreLostChanges", "onSubmit", "onFormDataSubmit", "initialValues"]);
|
38
|
+
// formik resets all error on each blur (with our settings)
|
39
|
+
// this means that ALL errors from the server disappear when any one field is blurred
|
40
|
+
// So, we have to store server errors ourselves
|
41
|
+
// Since we only use useStandardFormInput, that means there is only one consumer
|
42
|
+
var _b = useState({}), serverErrors = _b[0], setServerErrors = _b[1];
|
43
|
+
var serverErrorContextValue = useMemo(function () { return ({
|
44
|
+
errors: serverErrors,
|
45
|
+
getError: function (path) {
|
46
|
+
var lowered = path.toLowerCase();
|
47
|
+
return serverErrors && serverErrors[lowered];
|
48
|
+
},
|
49
|
+
setError: function (path, errorMessage) {
|
50
|
+
var _a;
|
51
|
+
var lowered = path.toLowerCase();
|
52
|
+
setServerErrors(Object.assign({}, serverErrors, (_a = {},
|
53
|
+
_a[lowered] = !errorMessage ? undefined : errorMessage,
|
54
|
+
_a)));
|
55
|
+
},
|
56
|
+
}); }, [serverErrors]);
|
57
|
+
return (_jsx(Formik, __assign({ validateOnChange: false, validateOnBlur: true, validateOnMount: false, initialValues: initialValues || {}, onSubmit: handleSubmit }, props, { children: _jsx(ServerErrorContext.Provider, { value: serverErrorContextValue, children: _jsxs(FormikFormWrapper, { className: classNames(className, FormDefaults.cssClassPrefix + 'form'), style: style, children: [_jsx(FocusError, { serverErrors: serverErrorContextValue }), _jsx(FormBasedPreventNavigation, { ignoreLostChanges: ignoreLostChanges }), children({
|
58
|
+
// hack for ref forwarding
|
59
|
+
Field: Field,
|
60
|
+
FieldArray: FieldArray,
|
61
|
+
})] }) }) })));
|
62
|
+
function handleSubmit(values, formikBag) {
|
63
|
+
var formData = undefined;
|
64
|
+
var submitFunc;
|
65
|
+
if (objectContainsNonSerializableProperty(values)) {
|
66
|
+
formData = objectToFormData(values, {
|
67
|
+
indices: true,
|
68
|
+
dotNotation: true,
|
69
|
+
allowEmptyArrays: true,
|
70
|
+
noFileListBrackets: true,
|
71
|
+
});
|
72
|
+
if (onFormDataSubmit === undefined) {
|
73
|
+
throw new Error('No onFormDataSubmit supplied for non-serializable properties.');
|
74
|
+
}
|
75
|
+
submitFunc = function () {
|
76
|
+
return onFormDataSubmit(formData !== null && formData !== void 0 ? formData : new FormData(), formikBag);
|
77
|
+
};
|
78
|
+
}
|
79
|
+
else {
|
80
|
+
if (onSubmit === undefined) {
|
81
|
+
formData = objectToFormData(values, {
|
82
|
+
indices: true,
|
83
|
+
dotNotation: true,
|
84
|
+
allowEmptyArrays: true,
|
85
|
+
noFileListBrackets: true,
|
86
|
+
});
|
87
|
+
if (onFormDataSubmit === undefined) {
|
88
|
+
// This error should never occur, as this case is covered by RequireAtLeastOne type safety
|
89
|
+
throw new Error('No onFormDataSubmit supplied for non-serializable properties.');
|
90
|
+
}
|
91
|
+
submitFunc = function () {
|
92
|
+
return onFormDataSubmit(formData !== null && formData !== void 0 ? formData : new FormData(), formikBag);
|
93
|
+
};
|
94
|
+
}
|
95
|
+
else {
|
96
|
+
submitFunc = function () { return onSubmit(values, formikBag); };
|
97
|
+
}
|
98
|
+
}
|
99
|
+
return submitFunc()
|
100
|
+
.then(function (response) {
|
101
|
+
return response;
|
102
|
+
})
|
103
|
+
.catch(function (err) {
|
104
|
+
//this is an http error
|
105
|
+
if (err &&
|
106
|
+
err.response &&
|
107
|
+
err.response.data &&
|
108
|
+
err.response.data.validationFailures) {
|
109
|
+
try {
|
110
|
+
var serverErrors_1 = err.response.data.validationFailures.reduce(function (acc, value) {
|
111
|
+
var _a;
|
112
|
+
// for simplicity, just keep it to one server error at a time per path
|
113
|
+
// don't care of the property name case changes
|
114
|
+
var path = (_a = value.propertyName) === null || _a === void 0 ? void 0 : _a.toLowerCase();
|
115
|
+
if (!!path && !!value.errorMessage) {
|
116
|
+
acc[path] = value.errorMessage;
|
117
|
+
}
|
118
|
+
return acc;
|
119
|
+
}, {});
|
120
|
+
setServerErrors(serverErrors_1);
|
121
|
+
}
|
122
|
+
catch (err) {
|
123
|
+
console.error('Failure to getErrorObject');
|
124
|
+
console.error(err);
|
125
|
+
throw err;
|
126
|
+
}
|
127
|
+
}
|
128
|
+
throw err;
|
129
|
+
});
|
130
|
+
}
|
131
|
+
}
|
132
|
+
Form.DisplayFormState = DisplayFormState;
|
133
|
+
function DisplayFormState() {
|
134
|
+
var formState = useFormikContext();
|
135
|
+
var serverErrorContext = useContext(ServerErrorContext);
|
136
|
+
return (_jsx("div", { style: { margin: '1rem 0' }, children: _jsxs("pre", { style: {
|
137
|
+
background: '#f6f8fa',
|
138
|
+
fontSize: '.65rem',
|
139
|
+
padding: '.5rem',
|
140
|
+
}, children: [serverErrorContext && serverErrorContext.errors && (_jsxs("div", { children: [_jsx("strong", { children: "serverErrors = " }), JSON.stringify(serverErrorContext.errors, null, 2)] })), _jsx("strong", { children: "formState = " }), JSON.stringify(formState, null, 2)] }) }));
|
141
|
+
}
|
@@ -1,7 +1,6 @@
|
|
1
|
-
|
2
|
-
|
3
|
-
|
4
|
-
|
5
|
-
|
6
|
-
|
7
|
-
export default function FormBasedPreventNavigation({ ignoreLostChanges, promptMessage, }: FormBasedPreventNavigationProps): JSX.Element;
|
1
|
+
export interface FormBasedPreventNavigationProps {
|
2
|
+
ignoreLostChanges?: boolean;
|
3
|
+
promptMessage?: string;
|
4
|
+
}
|
5
|
+
/** Prevent the user from navigating away from a form if there are any changes. */
|
6
|
+
export default function FormBasedPreventNavigation({ ignoreLostChanges, promptMessage, }: FormBasedPreventNavigationProps): import("react/jsx-runtime").JSX.Element;
|
@@ -1,20 +1,20 @@
|
|
1
|
-
import { jsx as _jsx } from "react/jsx-runtime";
|
2
|
-
import { useContext } from 'react';
|
3
|
-
import { UNSAFE_NavigationContext as NavigationContext, } from 'react-router-dom';
|
4
|
-
import { useFormikContext } from 'formik';
|
5
|
-
import LegacyFormBasedPreventNavigation from './LegacyFormBasedPreventNavigation';
|
6
|
-
import NewFormBasedPreventNavigation from './NewFormBasedPreventNavigation';
|
7
|
-
/** Prevent the user from navigating away from a form if there are any changes. */
|
8
|
-
export default function FormBasedPreventNavigation(_a) {
|
9
|
-
var ignoreLostChanges = _a.ignoreLostChanges, _b = _a.promptMessage, promptMessage = _b === void 0 ? 'Changes you made may not be saved.' : _b;
|
10
|
-
var _c = useFormikContext(), dirty = _c.dirty, isSubmitting = _c.isSubmitting;
|
11
|
-
var preventNavigate = !ignoreLostChanges && dirty && !isSubmitting;
|
12
|
-
var navigator = useContext(NavigationContext).navigator;
|
13
|
-
var isUsingDataRouter = navigator.location === undefined;
|
14
|
-
if (isUsingDataRouter) {
|
15
|
-
return (_jsx(NewFormBasedPreventNavigation, { promptMessage: promptMessage, preventNavigate: preventNavigate, navigator: navigator }));
|
16
|
-
}
|
17
|
-
else {
|
18
|
-
return (_jsx(LegacyFormBasedPreventNavigation, { promptMessage: promptMessage, preventNavigate: preventNavigate, navigator: navigator }));
|
19
|
-
}
|
20
|
-
}
|
1
|
+
import { jsx as _jsx } from "react/jsx-runtime";
|
2
|
+
import { useContext } from 'react';
|
3
|
+
import { UNSAFE_NavigationContext as NavigationContext, } from 'react-router-dom';
|
4
|
+
import { useFormikContext } from 'formik';
|
5
|
+
import LegacyFormBasedPreventNavigation from './LegacyFormBasedPreventNavigation';
|
6
|
+
import NewFormBasedPreventNavigation from './NewFormBasedPreventNavigation';
|
7
|
+
/** Prevent the user from navigating away from a form if there are any changes. */
|
8
|
+
export default function FormBasedPreventNavigation(_a) {
|
9
|
+
var ignoreLostChanges = _a.ignoreLostChanges, _b = _a.promptMessage, promptMessage = _b === void 0 ? 'Changes you made may not be saved.' : _b;
|
10
|
+
var _c = useFormikContext(), dirty = _c.dirty, isSubmitting = _c.isSubmitting;
|
11
|
+
var preventNavigate = !ignoreLostChanges && dirty && !isSubmitting;
|
12
|
+
var navigator = useContext(NavigationContext).navigator;
|
13
|
+
var isUsingDataRouter = navigator.location === undefined;
|
14
|
+
if (isUsingDataRouter) {
|
15
|
+
return (_jsx(NewFormBasedPreventNavigation, { promptMessage: promptMessage, preventNavigate: preventNavigate, navigator: navigator }));
|
16
|
+
}
|
17
|
+
else {
|
18
|
+
return (_jsx(LegacyFormBasedPreventNavigation, { promptMessage: promptMessage, preventNavigate: preventNavigate, navigator: navigator }));
|
19
|
+
}
|
20
|
+
}
|
@@ -1,17 +1,17 @@
|
|
1
|
-
import type { History } from 'history';
|
2
|
-
import { Navigator as BaseNavigator } from 'react-router-dom';
|
3
|
-
interface Navigator extends BaseNavigator {
|
4
|
-
block?: History['block'];
|
5
|
-
}
|
6
|
-
export interface FormBasedPreventNavigationProps {
|
7
|
-
promptMessage?: string;
|
8
|
-
preventNavigate: boolean;
|
9
|
-
navigator: Navigator;
|
10
|
-
}
|
11
|
-
/** Only use this if the project uses `<BrowserRouter/>` or any router that does not support the new
|
12
|
-
* [react-router Data API](https://reactrouter.com/en/main/routers/picking-a-router#using-v64-data-apis)
|
13
|
-
*
|
14
|
-
* Legacy function to prevent the user from navigating away from a form if there are any changes.
|
15
|
-
*/
|
16
|
-
export default function LegacyFormBasedPreventNavigation({ promptMessage, preventNavigate, navigator, }: FormBasedPreventNavigationProps): null;
|
17
|
-
export {};
|
1
|
+
import type { History } from 'history';
|
2
|
+
import { Navigator as BaseNavigator } from 'react-router-dom';
|
3
|
+
interface Navigator extends BaseNavigator {
|
4
|
+
block?: History['block'];
|
5
|
+
}
|
6
|
+
export interface FormBasedPreventNavigationProps {
|
7
|
+
promptMessage?: string;
|
8
|
+
preventNavigate: boolean;
|
9
|
+
navigator: Navigator;
|
10
|
+
}
|
11
|
+
/** Only use this if the project uses `<BrowserRouter/>` or any router that does not support the new
|
12
|
+
* [react-router Data API](https://reactrouter.com/en/main/routers/picking-a-router#using-v64-data-apis)
|
13
|
+
*
|
14
|
+
* Legacy function to prevent the user from navigating away from a form if there are any changes.
|
15
|
+
*/
|
16
|
+
export default function LegacyFormBasedPreventNavigation({ promptMessage, preventNavigate, navigator, }: FormBasedPreventNavigationProps): null;
|
17
|
+
export {};
|
@@ -1,69 +1,69 @@
|
|
1
|
-
var __assign = (this && this.__assign) || function () {
|
2
|
-
__assign = Object.assign || function(t) {
|
3
|
-
for (var s, i = 1, n = arguments.length; i < n; i++) {
|
4
|
-
s = arguments[i];
|
5
|
-
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
|
6
|
-
t[p] = s[p];
|
7
|
-
}
|
8
|
-
return t;
|
9
|
-
};
|
10
|
-
return __assign.apply(this, arguments);
|
11
|
-
};
|
12
|
-
import { useEffect } from 'react';
|
13
|
-
/** Only use this if the project uses `<BrowserRouter/>` or any router that does not support the new
|
14
|
-
* [react-router Data API](https://reactrouter.com/en/main/routers/picking-a-router#using-v64-data-apis)
|
15
|
-
*
|
16
|
-
* Legacy function to prevent the user from navigating away from a form if there are any changes.
|
17
|
-
*/
|
18
|
-
export default function LegacyFormBasedPreventNavigation(_a) {
|
19
|
-
var _b = _a.promptMessage, promptMessage = _b === void 0 ? 'Changes you made may not be saved.' : _b, preventNavigate = _a.preventNavigate, navigator = _a.navigator;
|
20
|
-
useEffect(function () {
|
21
|
-
if (!preventNavigate) {
|
22
|
-
return;
|
23
|
-
}
|
24
|
-
var unblock = function () { };
|
25
|
-
var push = navigator.push;
|
26
|
-
// TODO: https://reactrouter.com/docs/en/v6/upgrading/v5#prompt-is-not-currently-supported
|
27
|
-
// this is a workaround until we get native support for prompt on navigate
|
28
|
-
if (navigator.block) {
|
29
|
-
var blocker_1 = function (tx) {
|
30
|
-
if (window.confirm(promptMessage)) {
|
31
|
-
tx.retry();
|
32
|
-
}
|
33
|
-
};
|
34
|
-
unblock = navigator.block(function (tx) {
|
35
|
-
var autoUnblockingTx = __assign(__assign({}, tx), { retry: function () {
|
36
|
-
// Automatically unblock the transition so it can play all the way
|
37
|
-
// through before retrying it. TODO: Figure out how to re-enable
|
38
|
-
// this block if the transition is cancelled for some reason.
|
39
|
-
unblock();
|
40
|
-
tx.retry();
|
41
|
-
} });
|
42
|
-
blocker_1(autoUnblockingTx);
|
43
|
-
});
|
44
|
-
}
|
45
|
-
else {
|
46
|
-
//https://gist.github.com/MarksCode/64e438c82b0b2a1161e01c88ca0d0355
|
47
|
-
navigator.push = function () {
|
48
|
-
var args = [];
|
49
|
-
for (var _i = 0; _i < arguments.length; _i++) {
|
50
|
-
args[_i] = arguments[_i];
|
51
|
-
}
|
52
|
-
if (window.confirm(promptMessage)) {
|
53
|
-
push.apply(void 0, args);
|
54
|
-
}
|
55
|
-
};
|
56
|
-
}
|
57
|
-
window.addEventListener('beforeunload', beforeUnload);
|
58
|
-
return function () {
|
59
|
-
unblock();
|
60
|
-
navigator.push = push;
|
61
|
-
window.removeEventListener('beforeunload', beforeUnload);
|
62
|
-
};
|
63
|
-
function beforeUnload(e) {
|
64
|
-
e.preventDefault();
|
65
|
-
e.returnValue = promptMessage;
|
66
|
-
}
|
67
|
-
}, [preventNavigate, promptMessage, navigator]);
|
68
|
-
return null;
|
69
|
-
}
|
1
|
+
var __assign = (this && this.__assign) || function () {
|
2
|
+
__assign = Object.assign || function(t) {
|
3
|
+
for (var s, i = 1, n = arguments.length; i < n; i++) {
|
4
|
+
s = arguments[i];
|
5
|
+
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
|
6
|
+
t[p] = s[p];
|
7
|
+
}
|
8
|
+
return t;
|
9
|
+
};
|
10
|
+
return __assign.apply(this, arguments);
|
11
|
+
};
|
12
|
+
import { useEffect } from 'react';
|
13
|
+
/** Only use this if the project uses `<BrowserRouter/>` or any router that does not support the new
|
14
|
+
* [react-router Data API](https://reactrouter.com/en/main/routers/picking-a-router#using-v64-data-apis)
|
15
|
+
*
|
16
|
+
* Legacy function to prevent the user from navigating away from a form if there are any changes.
|
17
|
+
*/
|
18
|
+
export default function LegacyFormBasedPreventNavigation(_a) {
|
19
|
+
var _b = _a.promptMessage, promptMessage = _b === void 0 ? 'Changes you made may not be saved.' : _b, preventNavigate = _a.preventNavigate, navigator = _a.navigator;
|
20
|
+
useEffect(function () {
|
21
|
+
if (!preventNavigate) {
|
22
|
+
return;
|
23
|
+
}
|
24
|
+
var unblock = function () { };
|
25
|
+
var push = navigator.push;
|
26
|
+
// TODO: https://reactrouter.com/docs/en/v6/upgrading/v5#prompt-is-not-currently-supported
|
27
|
+
// this is a workaround until we get native support for prompt on navigate
|
28
|
+
if (navigator.block) {
|
29
|
+
var blocker_1 = function (tx) {
|
30
|
+
if (window.confirm(promptMessage)) {
|
31
|
+
tx.retry();
|
32
|
+
}
|
33
|
+
};
|
34
|
+
unblock = navigator.block(function (tx) {
|
35
|
+
var autoUnblockingTx = __assign(__assign({}, tx), { retry: function () {
|
36
|
+
// Automatically unblock the transition so it can play all the way
|
37
|
+
// through before retrying it. TODO: Figure out how to re-enable
|
38
|
+
// this block if the transition is cancelled for some reason.
|
39
|
+
unblock();
|
40
|
+
tx.retry();
|
41
|
+
} });
|
42
|
+
blocker_1(autoUnblockingTx);
|
43
|
+
});
|
44
|
+
}
|
45
|
+
else {
|
46
|
+
//https://gist.github.com/MarksCode/64e438c82b0b2a1161e01c88ca0d0355
|
47
|
+
navigator.push = function () {
|
48
|
+
var args = [];
|
49
|
+
for (var _i = 0; _i < arguments.length; _i++) {
|
50
|
+
args[_i] = arguments[_i];
|
51
|
+
}
|
52
|
+
if (window.confirm(promptMessage)) {
|
53
|
+
push.apply(void 0, args);
|
54
|
+
}
|
55
|
+
};
|
56
|
+
}
|
57
|
+
window.addEventListener('beforeunload', beforeUnload);
|
58
|
+
return function () {
|
59
|
+
unblock();
|
60
|
+
navigator.push = push;
|
61
|
+
window.removeEventListener('beforeunload', beforeUnload);
|
62
|
+
};
|
63
|
+
function beforeUnload(e) {
|
64
|
+
e.preventDefault();
|
65
|
+
e.returnValue = promptMessage;
|
66
|
+
}
|
67
|
+
}, [preventNavigate, promptMessage, navigator]);
|
68
|
+
return null;
|
69
|
+
}
|
@@ -1,14 +1,14 @@
|
|
1
|
-
import type { History } from 'history';
|
2
|
-
import { Navigator as BaseNavigator } from 'react-router-dom';
|
3
|
-
interface Navigator extends BaseNavigator {
|
4
|
-
block?: History['block'];
|
5
|
-
location: Location;
|
6
|
-
}
|
7
|
-
interface FormBasedPreventNavigationProps {
|
8
|
-
promptMessage?: string;
|
9
|
-
preventNavigate: boolean;
|
10
|
-
navigator: Navigator;
|
11
|
-
}
|
12
|
-
/** Temporary function to allow backwards compatibility with routers that do not use the new Data API */
|
13
|
-
export default function NewFormBasedPreventNavigation({ promptMessage, preventNavigate, navigator, }: FormBasedPreventNavigationProps): null;
|
14
|
-
export {};
|
1
|
+
import type { History } from 'history';
|
2
|
+
import { Navigator as BaseNavigator } from 'react-router-dom';
|
3
|
+
interface Navigator extends BaseNavigator {
|
4
|
+
block?: History['block'];
|
5
|
+
location: Location;
|
6
|
+
}
|
7
|
+
interface FormBasedPreventNavigationProps {
|
8
|
+
promptMessage?: string;
|
9
|
+
preventNavigate: boolean;
|
10
|
+
navigator: Navigator;
|
11
|
+
}
|
12
|
+
/** Temporary function to allow backwards compatibility with routers that do not use the new Data API */
|
13
|
+
export default function NewFormBasedPreventNavigation({ promptMessage, preventNavigate, navigator, }: FormBasedPreventNavigationProps): null;
|
14
|
+
export {};
|
@@ -1,39 +1,39 @@
|
|
1
|
-
import { useEffect } from 'react';
|
2
|
-
import { unstable_usePrompt as usePrompt, } from 'react-router-dom';
|
3
|
-
/** Temporary function to allow backwards compatibility with routers that do not use the new Data API */
|
4
|
-
export default function NewFormBasedPreventNavigation(_a) {
|
5
|
-
var _b = _a.promptMessage, promptMessage = _b === void 0 ? 'Changes you made may not be saved.' : _b, preventNavigate = _a.preventNavigate, navigator = _a.navigator;
|
6
|
-
usePrompt({
|
7
|
-
when: preventNavigate,
|
8
|
-
message: promptMessage,
|
9
|
-
});
|
10
|
-
// TODO: Once react-router fully supports usePrompt and when we do not want to support routers
|
11
|
-
// that do not support the react-router Data API we can remove this.
|
12
|
-
useEffect(function () {
|
13
|
-
if (!preventNavigate) {
|
14
|
-
return;
|
15
|
-
}
|
16
|
-
var unblock = function () { };
|
17
|
-
var push = navigator.push;
|
18
|
-
navigator.push = function () {
|
19
|
-
var args = [];
|
20
|
-
for (var _i = 0; _i < arguments.length; _i++) {
|
21
|
-
args[_i] = arguments[_i];
|
22
|
-
}
|
23
|
-
if (window.confirm(promptMessage)) {
|
24
|
-
push.apply(void 0, args);
|
25
|
-
}
|
26
|
-
};
|
27
|
-
window.addEventListener('beforeunload', beforeUnload);
|
28
|
-
return function () {
|
29
|
-
unblock();
|
30
|
-
navigator.push = push;
|
31
|
-
window.removeEventListener('beforeunload', beforeUnload);
|
32
|
-
};
|
33
|
-
function beforeUnload(e) {
|
34
|
-
e.preventDefault();
|
35
|
-
e.returnValue = promptMessage;
|
36
|
-
}
|
37
|
-
}, [preventNavigate, promptMessage, navigator]);
|
38
|
-
return null;
|
39
|
-
}
|
1
|
+
import { useEffect } from 'react';
|
2
|
+
import { unstable_usePrompt as usePrompt, } from 'react-router-dom';
|
3
|
+
/** Temporary function to allow backwards compatibility with routers that do not use the new Data API */
|
4
|
+
export default function NewFormBasedPreventNavigation(_a) {
|
5
|
+
var _b = _a.promptMessage, promptMessage = _b === void 0 ? 'Changes you made may not be saved.' : _b, preventNavigate = _a.preventNavigate, navigator = _a.navigator;
|
6
|
+
usePrompt({
|
7
|
+
when: preventNavigate,
|
8
|
+
message: promptMessage,
|
9
|
+
});
|
10
|
+
// TODO: Once react-router fully supports usePrompt and when we do not want to support routers
|
11
|
+
// that do not support the react-router Data API we can remove this.
|
12
|
+
useEffect(function () {
|
13
|
+
if (!preventNavigate) {
|
14
|
+
return;
|
15
|
+
}
|
16
|
+
var unblock = function () { };
|
17
|
+
var push = navigator.push;
|
18
|
+
navigator.push = function () {
|
19
|
+
var args = [];
|
20
|
+
for (var _i = 0; _i < arguments.length; _i++) {
|
21
|
+
args[_i] = arguments[_i];
|
22
|
+
}
|
23
|
+
if (window.confirm(promptMessage)) {
|
24
|
+
push.apply(void 0, args);
|
25
|
+
}
|
26
|
+
};
|
27
|
+
window.addEventListener('beforeunload', beforeUnload);
|
28
|
+
return function () {
|
29
|
+
unblock();
|
30
|
+
navigator.push = push;
|
31
|
+
window.removeEventListener('beforeunload', beforeUnload);
|
32
|
+
};
|
33
|
+
function beforeUnload(e) {
|
34
|
+
e.preventDefault();
|
35
|
+
e.returnValue = promptMessage;
|
36
|
+
}
|
37
|
+
}, [preventNavigate, promptMessage, navigator]);
|
38
|
+
return null;
|
39
|
+
}
|