@formio/js 5.0.0-dev.5913.d415fcc → 5.0.0-dev.5914.76c64d9
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/formio.form.js +579 -589
- package/dist/formio.form.min.js +1 -1
- package/dist/formio.form.min.js.LICENSE.txt +1 -3
- package/dist/formio.full.js +580 -590
- package/dist/formio.full.min.js +1 -1
- package/dist/formio.full.min.js.LICENSE.txt +1 -3
- package/dist/formio.js +3006 -287
- package/dist/formio.min.js +1 -1
- package/dist/formio.min.js.LICENSE.txt +12 -0
- package/dist/formio.utils.js +41 -51
- package/dist/formio.utils.min.js +1 -1
- package/dist/formio.utils.min.js.LICENSE.txt +1 -3
- package/lib/cjs/Webform.d.ts +1 -1
- package/lib/cjs/Webform.js +27 -28
- package/lib/cjs/WebformBuilder.js +21 -18
- package/lib/cjs/Wizard.d.ts +2 -2
- package/lib/cjs/Wizard.js +42 -50
- package/lib/cjs/components/Components.d.ts +0 -7
- package/lib/cjs/components/Components.js +1 -33
- package/lib/cjs/components/_classes/component/Component.d.ts +24 -7
- package/lib/cjs/components/_classes/component/Component.js +47 -13
- package/lib/cjs/components/_classes/componentModal/ComponentModal.d.ts +1 -0
- package/lib/cjs/components/_classes/componentModal/ComponentModal.js +1 -0
- package/lib/cjs/components/_classes/nested/NestedComponent.d.ts +4 -19
- package/lib/cjs/components/_classes/nested/NestedComponent.js +39 -54
- package/lib/cjs/components/_classes/nestedarray/NestedArrayComponent.d.ts +2 -1
- package/lib/cjs/components/_classes/nestedarray/NestedArrayComponent.js +9 -46
- package/lib/cjs/components/datagrid/DataGrid.d.ts +0 -1
- package/lib/cjs/components/datagrid/DataGrid.js +1 -45
- package/lib/cjs/components/datamap/DataMap.js +1 -2
- package/lib/cjs/components/editgrid/EditGrid.js +6 -6
- package/lib/cjs/components/form/Form.d.ts +1 -3
- package/lib/cjs/components/form/Form.js +16 -24
- package/lib/cjs/components/selectboxes/SelectBoxes.js +8 -1
- package/lib/cjs/utils/conditionOperators/DateGreaterThan.js +2 -2
- package/lib/cjs/utils/conditionOperators/IsEmptyValue.d.ts +2 -2
- package/lib/cjs/utils/conditionOperators/IsEmptyValue.js +2 -2
- package/lib/cjs/utils/conditionOperators/IsEqualTo.d.ts +2 -2
- package/lib/cjs/utils/conditionOperators/IsEqualTo.js +2 -2
- package/lib/cjs/utils/formUtils.d.ts +25 -14
- package/lib/cjs/utils/formUtils.js +11 -16
- package/lib/cjs/utils/utils.d.ts +1 -2
- package/lib/cjs/utils/utils.js +15 -31
- package/lib/mjs/Webform.d.ts +1 -1
- package/lib/mjs/Webform.js +24 -27
- package/lib/mjs/WebformBuilder.js +21 -18
- package/lib/mjs/Wizard.d.ts +2 -2
- package/lib/mjs/Wizard.js +38 -45
- package/lib/mjs/components/Components.d.ts +0 -7
- package/lib/mjs/components/Components.js +1 -32
- package/lib/mjs/components/_classes/component/Component.d.ts +24 -7
- package/lib/mjs/components/_classes/component/Component.js +49 -14
- package/lib/mjs/components/_classes/componentModal/ComponentModal.d.ts +1 -0
- package/lib/mjs/components/_classes/componentModal/ComponentModal.js +1 -0
- package/lib/mjs/components/_classes/nested/NestedComponent.d.ts +4 -19
- package/lib/mjs/components/_classes/nested/NestedComponent.js +40 -55
- package/lib/mjs/components/_classes/nestedarray/NestedArrayComponent.d.ts +2 -1
- package/lib/mjs/components/_classes/nestedarray/NestedArrayComponent.js +8 -43
- package/lib/mjs/components/datagrid/DataGrid.d.ts +0 -1
- package/lib/mjs/components/datagrid/DataGrid.js +1 -45
- package/lib/mjs/components/datamap/DataMap.js +1 -2
- package/lib/mjs/components/editgrid/EditGrid.js +9 -6
- package/lib/mjs/components/form/Form.d.ts +1 -3
- package/lib/mjs/components/form/Form.js +17 -24
- package/lib/mjs/components/selectboxes/SelectBoxes.js +8 -1
- package/lib/mjs/utils/conditionOperators/DateGreaterThan.js +2 -2
- package/lib/mjs/utils/conditionOperators/IsEmptyValue.d.ts +2 -2
- package/lib/mjs/utils/conditionOperators/IsEmptyValue.js +2 -2
- package/lib/mjs/utils/conditionOperators/IsEqualTo.d.ts +2 -2
- package/lib/mjs/utils/conditionOperators/IsEqualTo.js +2 -2
- package/lib/mjs/utils/formUtils.d.ts +25 -14
- package/lib/mjs/utils/formUtils.js +2 -12
- package/lib/mjs/utils/utils.d.ts +1 -2
- package/lib/mjs/utils/utils.js +14 -29
- package/package.json +4 -4
|
@@ -18,8 +18,6 @@
|
|
|
18
18
|
* MIT licensed
|
|
19
19
|
*/
|
|
20
20
|
|
|
21
|
-
/*! @license DOMPurify 3.1.6 | (c) Cure53 and other contributors | Released under the Apache license 2.0 and Mozilla Public License 2.0 | github.com/cure53/DOMPurify/blob/3.1.6/LICENSE */
|
|
22
|
-
|
|
23
21
|
/*! @license DOMPurify 3.2.0 | (c) Cure53 and other contributors | Released under the Apache license 2.0 and Mozilla Public License 2.0 | github.com/cure53/DOMPurify/blob/3.2.0/LICENSE */
|
|
24
22
|
|
|
25
23
|
/*! formiojs v5.0.0-rc.59 | https://unpkg.com/formiojs@5.0.0-rc.59/LICENSE.txt */
|
|
@@ -45,4 +43,4 @@
|
|
|
45
43
|
|
|
46
44
|
//! moment.js
|
|
47
45
|
|
|
48
|
-
//! version : 0.5.
|
|
46
|
+
//! version : 0.5.46
|
package/lib/cjs/Webform.d.ts
CHANGED
|
@@ -426,7 +426,7 @@ declare class Webform extends NestedDataComponent {
|
|
|
426
426
|
*/
|
|
427
427
|
cancel(noconfirm: boolean): boolean;
|
|
428
428
|
setMetadata(submission: any): void;
|
|
429
|
-
submitForm(options?: {}): Promise<any>;
|
|
429
|
+
submitForm(options?: {}, local?: boolean): Promise<any>;
|
|
430
430
|
setServerErrors(error: any): void;
|
|
431
431
|
serverErrors: any;
|
|
432
432
|
executeSubmit(options: any): Promise<object>;
|
package/lib/cjs/Webform.js
CHANGED
|
@@ -585,11 +585,12 @@ class Webform extends NestedDataComponent_1.default {
|
|
|
585
585
|
* @returns {Promise} - The promise that is triggered when the form is set.
|
|
586
586
|
*/
|
|
587
587
|
setForm(form, flags = {}) {
|
|
588
|
-
var _a
|
|
588
|
+
var _a;
|
|
589
589
|
const isFormAlreadySet = this._form && ((_a = this._form.components) === null || _a === void 0 ? void 0 : _a.length);
|
|
590
590
|
try {
|
|
591
591
|
// Do not set the form again if it has been already set
|
|
592
592
|
if (isFormAlreadySet && JSON.stringify(this._form) === JSON.stringify(form)) {
|
|
593
|
+
this.formReadyResolve();
|
|
593
594
|
return Promise.resolve();
|
|
594
595
|
}
|
|
595
596
|
// Create the form.
|
|
@@ -597,13 +598,11 @@ class Webform extends NestedDataComponent_1.default {
|
|
|
597
598
|
if (this.onSetForm) {
|
|
598
599
|
this.onSetForm(lodash_1.default.cloneDeep(this._form), form);
|
|
599
600
|
}
|
|
600
|
-
if ((_c = (_b = this.parent) === null || _b === void 0 ? void 0 : _b.component) === null || _c === void 0 ? void 0 : _c.modalEdit) {
|
|
601
|
-
return Promise.resolve();
|
|
602
|
-
}
|
|
603
601
|
}
|
|
604
602
|
catch (err) {
|
|
605
603
|
console.warn(err);
|
|
606
604
|
// If provided form is not a valid JSON object, do not set it too
|
|
605
|
+
this.formReadyReject(err);
|
|
607
606
|
return Promise.resolve();
|
|
608
607
|
}
|
|
609
608
|
// Allow the form to provide component overrides.
|
|
@@ -847,6 +846,9 @@ class Webform extends NestedDataComponent_1.default {
|
|
|
847
846
|
return changed;
|
|
848
847
|
}
|
|
849
848
|
getValue() {
|
|
849
|
+
if (!this._submission) {
|
|
850
|
+
this._submission = {};
|
|
851
|
+
}
|
|
850
852
|
if (!this._submission.data) {
|
|
851
853
|
this._submission.data = {};
|
|
852
854
|
}
|
|
@@ -1108,29 +1110,24 @@ class Webform extends NestedDataComponent_1.default {
|
|
|
1108
1110
|
return;
|
|
1109
1111
|
}
|
|
1110
1112
|
// Mark any components as invalid if in a custom message.
|
|
1113
|
+
const componentErrors = {};
|
|
1111
1114
|
errors.forEach((err) => {
|
|
1112
|
-
|
|
1113
|
-
|
|
1114
|
-
|
|
1115
|
-
|
|
1116
|
-
if (err.path) {
|
|
1117
|
-
components.push(err.path);
|
|
1115
|
+
var _a, _b;
|
|
1116
|
+
const path = err.path || ((_a = err.context) === null || _a === void 0 ? void 0 : _a.path) || ((_b = err.component) === null || _b === void 0 ? void 0 : _b.key);
|
|
1117
|
+
if (!componentErrors[path]) {
|
|
1118
|
+
componentErrors[path] = [];
|
|
1118
1119
|
}
|
|
1119
|
-
|
|
1120
|
-
const originalPath = (0, utils_1.getStringFromComponentPath)(path);
|
|
1121
|
-
const component = this.getComponent(path, lodash_1.default.identity, originalPath);
|
|
1122
|
-
if (err.fromServer) {
|
|
1123
|
-
if (component.serverErrors) {
|
|
1124
|
-
component.serverErrors.push(err);
|
|
1125
|
-
}
|
|
1126
|
-
else {
|
|
1127
|
-
component.serverErrors = [err];
|
|
1128
|
-
}
|
|
1129
|
-
}
|
|
1130
|
-
const components = lodash_1.default.compact(Array.isArray(component) ? component : [component]);
|
|
1131
|
-
components.forEach((component) => component.setCustomValidity(err.message, true));
|
|
1132
|
-
});
|
|
1120
|
+
componentErrors[path].push(err);
|
|
1133
1121
|
});
|
|
1122
|
+
// Iterate through all of our component errors and apply them to the components.
|
|
1123
|
+
for (let path in componentErrors) {
|
|
1124
|
+
const component = this.getComponent(path);
|
|
1125
|
+
const errors = componentErrors[path];
|
|
1126
|
+
if (component) {
|
|
1127
|
+
component.serverErrors = errors.filter((err) => err.fromServer);
|
|
1128
|
+
component.setCustomValidity(errors, true);
|
|
1129
|
+
}
|
|
1130
|
+
}
|
|
1134
1131
|
const displayedErrors = [];
|
|
1135
1132
|
if (errors.length) {
|
|
1136
1133
|
errors = lodash_1.default.uniqBy(errors, (error) => { var _a, _b; return [error.message, (_a = error.component) === null || _a === void 0 ? void 0 : _a.id, (_b = error.context) === null || _b === void 0 ? void 0 : _b.path].join(); });
|
|
@@ -1322,7 +1319,7 @@ class Webform extends NestedDataComponent_1.default {
|
|
|
1322
1319
|
onLine: navigator.onLine,
|
|
1323
1320
|
});
|
|
1324
1321
|
}
|
|
1325
|
-
submitForm(options = {}) {
|
|
1322
|
+
submitForm(options = {}, local = false) {
|
|
1326
1323
|
this.clearServerErrors();
|
|
1327
1324
|
return new Promise((resolve, reject) => {
|
|
1328
1325
|
// Read-only forms should never submit.
|
|
@@ -1348,6 +1345,7 @@ class Webform extends NestedDataComponent_1.default {
|
|
|
1348
1345
|
return reject("Invalid Submission");
|
|
1349
1346
|
}
|
|
1350
1347
|
const errors = this.validate(submission.data, {
|
|
1348
|
+
local,
|
|
1351
1349
|
dirty: true,
|
|
1352
1350
|
silentCheck: false,
|
|
1353
1351
|
process: "submit",
|
|
@@ -1362,12 +1360,13 @@ class Webform extends NestedDataComponent_1.default {
|
|
|
1362
1360
|
console.error(err);
|
|
1363
1361
|
}
|
|
1364
1362
|
this.everyComponent((comp) => {
|
|
1363
|
+
var _a, _b;
|
|
1365
1364
|
if (submission._vnote && comp.type === "form" && comp.component.reference) {
|
|
1366
|
-
lodash_1.default.get(submission.data, comp.path, {})._vnote = submission._vnote;
|
|
1365
|
+
lodash_1.default.get(submission.data, local ? (_a = comp.paths) === null || _a === void 0 ? void 0 : _a.localDataPath : comp.path, {})._vnote = submission._vnote;
|
|
1367
1366
|
}
|
|
1368
1367
|
const { persistent } = comp.component;
|
|
1369
1368
|
if (persistent === "client-only") {
|
|
1370
|
-
lodash_1.default.unset(submission.data, comp.path);
|
|
1369
|
+
lodash_1.default.unset(submission.data, local ? (_b = comp.paths) === null || _b === void 0 ? void 0 : _b.localDataPath : comp.path);
|
|
1371
1370
|
}
|
|
1372
1371
|
});
|
|
1373
1372
|
this.hook("customValidation", Object.assign(Object.assign({}, submission), { component: options.component }), (err) => {
|
|
@@ -1534,7 +1533,7 @@ class Webform extends NestedDataComponent_1.default {
|
|
|
1534
1533
|
return;
|
|
1535
1534
|
}
|
|
1536
1535
|
const captchaComponent = [];
|
|
1537
|
-
|
|
1536
|
+
this.eachComponent((component) => {
|
|
1538
1537
|
if (/^(re)?captcha$/.test(component.type) && component.component.eventType === 'formLoad') {
|
|
1539
1538
|
captchaComponent.push(component);
|
|
1540
1539
|
}
|
|
@@ -901,13 +901,16 @@ class WebformBuilder extends Component_1.default {
|
|
|
901
901
|
keyboardActionsEnabled = keyboardActionsEnabled === 'true';
|
|
902
902
|
}
|
|
903
903
|
this.keyboardActionsEnabled = keyboardActionsEnabled;
|
|
904
|
-
const
|
|
905
|
-
|
|
906
|
-
};
|
|
907
|
-
const
|
|
908
|
-
|
|
904
|
+
const { display, noAddSubmitButton, noDefaultSubmitButton } = this.options;
|
|
905
|
+
const { _id, components } = form;
|
|
906
|
+
const isSubmitButton = ({ type, action }) => type === 'button' && (action === 'submit' || !action);
|
|
907
|
+
const hasSubmitButton = components.some(isSubmitButton);
|
|
908
|
+
// Add submit button if form display was switched from wizard
|
|
909
|
+
// Don't add if there is noAddSubmitButton flag passed, or the form has id, or the form has a submit button already
|
|
910
|
+
const shouldAddSubmitButton = (display === 'wizard' && !hasSubmitButton) ||
|
|
911
|
+
(!noAddSubmitButton && !_id && !hasSubmitButton);
|
|
909
912
|
// Ensure there is at least a submit button.
|
|
910
|
-
if (
|
|
913
|
+
if (!noDefaultSubmitButton && shouldAddSubmitButton) {
|
|
911
914
|
form.components.push({
|
|
912
915
|
type: 'button',
|
|
913
916
|
label: 'Submit',
|
|
@@ -1056,6 +1059,7 @@ class WebformBuilder extends Component_1.default {
|
|
|
1056
1059
|
'conditional',
|
|
1057
1060
|
'customConditional',
|
|
1058
1061
|
'id',
|
|
1062
|
+
'logic',
|
|
1059
1063
|
'fields.day.required',
|
|
1060
1064
|
'fields.month.required',
|
|
1061
1065
|
'fields.year.required',
|
|
@@ -1081,6 +1085,12 @@ class WebformBuilder extends Component_1.default {
|
|
|
1081
1085
|
parentComponent.tabs[tabIndex].splice(index, 1, newComp);
|
|
1082
1086
|
newComp.checkValidity = () => true;
|
|
1083
1087
|
newComp.build(defaultValueComponent.element);
|
|
1088
|
+
if (this.preview && !this.preview.defaultChanged) {
|
|
1089
|
+
const defaultValue = lodash_1.default.get(this.preview._data, this.editForm._data.key);
|
|
1090
|
+
if (lodash_1.default.isObject(defaultValue) && !lodash_1.default.isArray(defaultValue)) {
|
|
1091
|
+
this.editForm._data.defaultValue = defaultValue;
|
|
1092
|
+
}
|
|
1093
|
+
}
|
|
1084
1094
|
}
|
|
1085
1095
|
}
|
|
1086
1096
|
else {
|
|
@@ -1091,6 +1101,7 @@ class WebformBuilder extends Component_1.default {
|
|
|
1091
1101
|
path.unshift(component.key);
|
|
1092
1102
|
dataPath = (0, utils_1.getStringFromComponentPath)(path);
|
|
1093
1103
|
}
|
|
1104
|
+
this.preview.defaultChanged = true;
|
|
1094
1105
|
lodash_1.default.set(this.preview._data, dataPath, changed.value);
|
|
1095
1106
|
lodash_1.default.set(this.webform._data, dataPath, changed.value);
|
|
1096
1107
|
}
|
|
@@ -1101,20 +1112,12 @@ class WebformBuilder extends Component_1.default {
|
|
|
1101
1112
|
findRepeatablePaths() {
|
|
1102
1113
|
const repeatablePaths = [];
|
|
1103
1114
|
const keys = new Map();
|
|
1104
|
-
(0, formUtils_1.eachComponent)(this.form.components, (comp, path) => {
|
|
1105
|
-
if (
|
|
1106
|
-
|
|
1107
|
-
}
|
|
1108
|
-
if (keys.has(comp.key)) {
|
|
1109
|
-
if (keys.get(comp.key).includes(path)) {
|
|
1110
|
-
repeatablePaths.push(path);
|
|
1111
|
-
}
|
|
1112
|
-
else {
|
|
1113
|
-
keys.set(comp.key, [...keys.get(comp.key), path]);
|
|
1114
|
-
}
|
|
1115
|
+
(0, formUtils_1.eachComponent)(this.form.components, (comp, path, components, parent, paths) => {
|
|
1116
|
+
if (keys.has(paths.dataPath)) {
|
|
1117
|
+
repeatablePaths.push(paths.dataPath);
|
|
1115
1118
|
}
|
|
1116
1119
|
else {
|
|
1117
|
-
keys.set(
|
|
1120
|
+
keys.set(paths.dataPath, true);
|
|
1118
1121
|
}
|
|
1119
1122
|
}, true);
|
|
1120
1123
|
return repeatablePaths;
|
package/lib/cjs/Wizard.d.ts
CHANGED
|
@@ -6,6 +6,7 @@ declare class Wizard extends Webform {
|
|
|
6
6
|
originalComponents: any[];
|
|
7
7
|
page: number;
|
|
8
8
|
currentPanel: any;
|
|
9
|
+
currentPanels: any[] | null;
|
|
9
10
|
currentNextPage: number;
|
|
10
11
|
_seenPages: number[];
|
|
11
12
|
subWizards: any[];
|
|
@@ -16,7 +17,7 @@ declare class Wizard extends Webform {
|
|
|
16
17
|
originalOptions: any;
|
|
17
18
|
isLastPage(): any;
|
|
18
19
|
getPages(args?: {}): any[];
|
|
19
|
-
get
|
|
20
|
+
get hasExtraPages(): boolean;
|
|
20
21
|
get localData(): any;
|
|
21
22
|
get wizardKey(): string;
|
|
22
23
|
set wizard(form: object);
|
|
@@ -104,7 +105,6 @@ declare class Wizard extends Webform {
|
|
|
104
105
|
pageId(page: any): any;
|
|
105
106
|
onChange(flags: any, changed: any, modified: any, changes: any): void;
|
|
106
107
|
checkValidity(data: any, dirty: any, row: any, currentPageOnly: any, childErrors?: any[]): any;
|
|
107
|
-
showErrors(errors: any, triggerEvent: any): void | any[];
|
|
108
108
|
focusOnComponent(key: any): void | Promise<void>;
|
|
109
109
|
}
|
|
110
110
|
declare namespace Wizard {
|
package/lib/cjs/Wizard.js
CHANGED
|
@@ -34,6 +34,7 @@ class Wizard extends Webform_1.default {
|
|
|
34
34
|
this.originalComponents = [];
|
|
35
35
|
this.page = 0;
|
|
36
36
|
this.currentPanel = null;
|
|
37
|
+
this.currentPanels = null;
|
|
37
38
|
this.currentNextPage = 0;
|
|
38
39
|
this._seenPages = [0];
|
|
39
40
|
this.subWizards = [];
|
|
@@ -52,12 +53,12 @@ class Wizard extends Webform_1.default {
|
|
|
52
53
|
}
|
|
53
54
|
getPages(args = {}) {
|
|
54
55
|
const { all = false } = args;
|
|
55
|
-
const pages = this.
|
|
56
|
+
const pages = this.hasExtraPages ? this.components : this.pages;
|
|
56
57
|
const filteredPages = pages
|
|
57
58
|
.filter(all ? lodash_1.default.identity : (p, index) => this._seenPages.includes(index));
|
|
58
59
|
return filteredPages;
|
|
59
60
|
}
|
|
60
|
-
get
|
|
61
|
+
get hasExtraPages() {
|
|
61
62
|
return !lodash_1.default.isEmpty(this.subWizards);
|
|
62
63
|
}
|
|
63
64
|
get data() {
|
|
@@ -186,9 +187,9 @@ class Wizard extends Webform_1.default {
|
|
|
186
187
|
}
|
|
187
188
|
render() {
|
|
188
189
|
const ctx = this.renderContext;
|
|
189
|
-
if (this.component.
|
|
190
|
-
ctx.panels.
|
|
191
|
-
if (panel.
|
|
190
|
+
if (this.component.key) {
|
|
191
|
+
ctx.panels.map(panel => {
|
|
192
|
+
if (panel.key === this.component.key) {
|
|
192
193
|
this.currentPanel = panel;
|
|
193
194
|
ctx.wizardPageTooltip = this.getFormattedTooltip(panel.tooltip);
|
|
194
195
|
}
|
|
@@ -374,11 +375,11 @@ class Wizard extends Webform_1.default {
|
|
|
374
375
|
this.emit('wizardPageSelected', this.pages[index], index);
|
|
375
376
|
}
|
|
376
377
|
attachHeader() {
|
|
377
|
-
var _a;
|
|
378
|
+
var _a, _b;
|
|
378
379
|
const isAllowPrevious = this.isAllowPrevious();
|
|
379
|
-
this.attachTooltips(this.refs[`${this.wizardKey}-tooltip`], this.currentPanel.tooltip);
|
|
380
|
+
this.attachTooltips(this.refs[`${this.wizardKey}-tooltip`], (_a = this.currentPanel) === null || _a === void 0 ? void 0 : _a.tooltip);
|
|
380
381
|
if (this.isBreadcrumbClickable() || isAllowPrevious) {
|
|
381
|
-
(
|
|
382
|
+
(_b = this.refs[`${this.wizardKey}-link`]) === null || _b === void 0 ? void 0 : _b.forEach((link, index) => {
|
|
382
383
|
if (!isAllowPrevious || index <= this.enabledIndex) {
|
|
383
384
|
this.addEventListener(link, 'click', (event) => {
|
|
384
385
|
this.emit('wizardNavigationClicked', this.pages[index]);
|
|
@@ -586,7 +587,7 @@ class Wizard extends Webform_1.default {
|
|
|
586
587
|
this.pageFieldLogic(num);
|
|
587
588
|
this.getNextPage();
|
|
588
589
|
let parentNum = num;
|
|
589
|
-
if (this.
|
|
590
|
+
if (this.hasExtraPages) {
|
|
590
591
|
const pageFromPages = this.pages[num];
|
|
591
592
|
const pageFromComponents = this.components[num];
|
|
592
593
|
if (!pageFromComponents || (pageFromPages === null || pageFromPages === void 0 ? void 0 : pageFromPages.id) !== pageFromComponents.id) {
|
|
@@ -601,7 +602,10 @@ class Wizard extends Webform_1.default {
|
|
|
601
602
|
}
|
|
602
603
|
this.redraw().then(() => {
|
|
603
604
|
this.checkData(this.submission.data);
|
|
604
|
-
this.validateCurrentPage();
|
|
605
|
+
const errors = this.submitted ? this.validate(this.localData, { dirty: true }) : this.validateCurrentPage();
|
|
606
|
+
if (this.alert) {
|
|
607
|
+
this.showErrors(errors, true, true);
|
|
608
|
+
}
|
|
605
609
|
});
|
|
606
610
|
return Promise.resolve();
|
|
607
611
|
}
|
|
@@ -698,9 +702,11 @@ class Wizard extends Webform_1.default {
|
|
|
698
702
|
});
|
|
699
703
|
});
|
|
700
704
|
}
|
|
701
|
-
// Validate the form
|
|
702
|
-
const
|
|
703
|
-
|
|
705
|
+
// Validate the form before going to the next page
|
|
706
|
+
const currentPageErrors = this.validateCurrentPage({ dirty: true });
|
|
707
|
+
const errors = this.submitted ? this.validate(this.localData, { dirty: true }) : currentPageErrors;
|
|
708
|
+
// allow going to the next page if the current page is valid, even if there are form level errors
|
|
709
|
+
if (currentPageErrors.length === 0) {
|
|
704
710
|
this.checkData(this.submission.data);
|
|
705
711
|
return this.beforePage(true).then(() => {
|
|
706
712
|
return this.setPage(this.getNextPage()).then(() => {
|
|
@@ -715,13 +721,14 @@ class Wizard extends Webform_1.default {
|
|
|
715
721
|
else {
|
|
716
722
|
this.currentPage.components.forEach((comp) => comp.setPristine(false));
|
|
717
723
|
this.scrollIntoView(this.element, true);
|
|
718
|
-
return Promise.reject(
|
|
724
|
+
return Promise.reject(this.showErrors(errors, true));
|
|
719
725
|
}
|
|
720
726
|
}
|
|
721
727
|
validateCurrentPage(flags = {}) {
|
|
722
|
-
var _a;
|
|
728
|
+
var _a, _b;
|
|
729
|
+
const components = (_a = this.currentPage) === null || _a === void 0 ? void 0 : _a.components.map((component) => component.component);
|
|
723
730
|
// Accessing the parent ensures the right instance (whether it's the parent Wizard or a nested Wizard) performs its validation
|
|
724
|
-
return (
|
|
731
|
+
return (_b = this.currentPage) === null || _b === void 0 ? void 0 : _b.parent.validateComponents(components, this.root.data, flags);
|
|
725
732
|
}
|
|
726
733
|
emitPrevPage() {
|
|
727
734
|
this.emit('prevPage', { page: this.page, submission: this.submission });
|
|
@@ -861,25 +868,31 @@ class Wizard extends Webform_1.default {
|
|
|
861
868
|
}
|
|
862
869
|
}
|
|
863
870
|
onChange(flags, changed, modified, changes) {
|
|
864
|
-
var _a;
|
|
871
|
+
var _a, _b;
|
|
865
872
|
super.onChange(flags, changed, modified, changes);
|
|
866
|
-
|
|
873
|
+
// The onChange loop doesn't need all components for wizards
|
|
874
|
+
const errors = this.submitted ? this.validate(this.localData, { dirty: true }) : this.validateCurrentPage();
|
|
867
875
|
if (this.alert) {
|
|
868
876
|
this.showErrors(errors, true, true);
|
|
869
877
|
}
|
|
870
878
|
// If the pages change, need to redraw the header.
|
|
871
|
-
|
|
872
|
-
|
|
873
|
-
this.establishPages();
|
|
874
|
-
const newPanels = this.pages;
|
|
879
|
+
let currentPanels;
|
|
880
|
+
let panels;
|
|
875
881
|
const currentNextPage = this.currentNextPage;
|
|
876
|
-
|
|
877
|
-
|
|
878
|
-
|
|
879
|
-
|
|
880
|
-
this.setPage(newIndex);
|
|
882
|
+
if (this.hasExtraPages) {
|
|
883
|
+
currentPanels = this.pages.map(page => page.component.key);
|
|
884
|
+
this.establishPages();
|
|
885
|
+
panels = this.pages.map(page => page.component.key);
|
|
881
886
|
}
|
|
882
|
-
|
|
887
|
+
else {
|
|
888
|
+
currentPanels = this.currentPanels || this.pages.map(page => page.component.key);
|
|
889
|
+
panels = this.establishPages().map(panel => panel.key);
|
|
890
|
+
this.currentPanels = panels;
|
|
891
|
+
if (((_a = this.currentPanel) === null || _a === void 0 ? void 0 : _a.key) && ((_b = this.currentPanels) === null || _b === void 0 ? void 0 : _b.length)) {
|
|
892
|
+
this.setPage(this.currentPanels.findIndex(panel => panel === this.currentPanel.key));
|
|
893
|
+
}
|
|
894
|
+
}
|
|
895
|
+
if (!lodash_1.default.isEqual(panels, currentPanels) || (flags && flags.fromSubmission)) {
|
|
883
896
|
this.redrawHeader();
|
|
884
897
|
}
|
|
885
898
|
// If the next page changes, then make sure to redraw navigation.
|
|
@@ -890,13 +903,6 @@ class Wizard extends Webform_1.default {
|
|
|
890
903
|
this.redraw();
|
|
891
904
|
}
|
|
892
905
|
}
|
|
893
|
-
redraw() {
|
|
894
|
-
var _a, _b;
|
|
895
|
-
if ((_b = (_a = this.parent) === null || _a === void 0 ? void 0 : _a.component) === null || _b === void 0 ? void 0 : _b.modalEdit) {
|
|
896
|
-
return this.parent.redraw();
|
|
897
|
-
}
|
|
898
|
-
return super.redraw();
|
|
899
|
-
}
|
|
900
906
|
rebuild() {
|
|
901
907
|
const currentPage = this.page;
|
|
902
908
|
const setCurrentPage = () => this.setPage(currentPage);
|
|
@@ -913,21 +919,7 @@ class Wizard extends Webform_1.default {
|
|
|
913
919
|
return components.reduce((check, comp) => comp.checkValidity(data, dirty, row, currentPageOnly, childErrors) && check, true);
|
|
914
920
|
}
|
|
915
921
|
get errors() {
|
|
916
|
-
|
|
917
|
-
return this.currentPage.errors;
|
|
918
|
-
}
|
|
919
|
-
return super.errors;
|
|
920
|
-
}
|
|
921
|
-
showErrors(errors, triggerEvent) {
|
|
922
|
-
if (this.hasSubWizards) {
|
|
923
|
-
this.subWizards.forEach((subWizard) => {
|
|
924
|
-
if (Array.isArray(subWizard.errors)) {
|
|
925
|
-
errors = [...errors, ...subWizard.errors];
|
|
926
|
-
}
|
|
927
|
-
});
|
|
928
|
-
}
|
|
929
|
-
;
|
|
930
|
-
return super.showErrors(errors, triggerEvent);
|
|
922
|
+
return !this.isLastPage() && !this.submitted ? this.currentPage.errors : super.errors;
|
|
931
923
|
}
|
|
932
924
|
focusOnComponent(key) {
|
|
933
925
|
const component = this.getComponent(key);
|
|
@@ -256,13 +256,6 @@ export default class Components {
|
|
|
256
256
|
static setComponents(comps: any): void;
|
|
257
257
|
static addComponent(name: any, comp: any): void;
|
|
258
258
|
static setComponent(name: any, comp: any): void;
|
|
259
|
-
/**
|
|
260
|
-
* Return a path of component's value.
|
|
261
|
-
* @param {Component} component - The component instance.
|
|
262
|
-
* @returns {string} - The component's value path.
|
|
263
|
-
*/
|
|
264
|
-
static getComponentPath(component: Component): string;
|
|
265
259
|
static create(component: any, options: any, data: any): any;
|
|
266
260
|
}
|
|
267
261
|
import BaseEditForm from './_classes/component/Component.form';
|
|
268
|
-
import Component from './_classes/component/Component';
|
|
@@ -6,7 +6,6 @@ Object.defineProperty(exports, "__esModule", { value: true });
|
|
|
6
6
|
const Component_1 = __importDefault(require("./_classes/component/Component"));
|
|
7
7
|
const utils_1 = __importDefault(require("./_classes/component/editForm/utils"));
|
|
8
8
|
const Component_form_1 = __importDefault(require("./_classes/component/Component.form"));
|
|
9
|
-
const utils_2 = require("../utils/utils");
|
|
10
9
|
const lodash_1 = __importDefault(require("lodash"));
|
|
11
10
|
class Components {
|
|
12
11
|
static set EditFormUtils(value) {
|
|
@@ -49,35 +48,6 @@ class Components {
|
|
|
49
48
|
static setComponent(name, comp) {
|
|
50
49
|
Components.components[name] = comp;
|
|
51
50
|
}
|
|
52
|
-
/**
|
|
53
|
-
* Return a path of component's value.
|
|
54
|
-
* @param {Component} component - The component instance.
|
|
55
|
-
* @returns {string} - The component's value path.
|
|
56
|
-
*/
|
|
57
|
-
static getComponentPath(component) {
|
|
58
|
-
var _a;
|
|
59
|
-
let path = '';
|
|
60
|
-
const componentKey = (0, utils_2.getComponentKey)(component.component);
|
|
61
|
-
if (componentKey) {
|
|
62
|
-
let thisPath = ((_a = component.options) === null || _a === void 0 ? void 0 : _a.parent) || component;
|
|
63
|
-
while (thisPath && !thisPath.allowData && thisPath.parent) {
|
|
64
|
-
thisPath = thisPath.parent;
|
|
65
|
-
}
|
|
66
|
-
// TODO: any component that is nested in e.g. a Data Grid or an Edit Grid is going to receive a row prop; the problem
|
|
67
|
-
// is that options.row is passed to each further nested component, which results in erroneous paths like
|
|
68
|
-
// `editGrid[0].container[0].textField` rather than `editGrid[0].container.textField`. This should be adapted for other
|
|
69
|
-
// components with a tree-like data model
|
|
70
|
-
const rowIndex = component.row;
|
|
71
|
-
const rowIndexPath = rowIndex && !['container'].includes(thisPath.component.type) ? `[${Number.parseInt(rowIndex)}]` : '';
|
|
72
|
-
path = `${thisPath.path}${rowIndexPath}.`;
|
|
73
|
-
if (rowIndexPath && (0, utils_2.getModelType)(thisPath) === 'nestedDataArray') {
|
|
74
|
-
path = `${path}data.`;
|
|
75
|
-
}
|
|
76
|
-
path += componentKey;
|
|
77
|
-
return lodash_1.default.trim(path, '.');
|
|
78
|
-
}
|
|
79
|
-
return path;
|
|
80
|
-
}
|
|
81
51
|
static create(component, options, data) {
|
|
82
52
|
let comp = null;
|
|
83
53
|
if (component.type && Components.components.hasOwnProperty(component.type)) {
|
|
@@ -102,9 +72,7 @@ class Components {
|
|
|
102
72
|
else {
|
|
103
73
|
comp = new Component_1.default(component, options, data);
|
|
104
74
|
}
|
|
105
|
-
|
|
106
|
-
if (path) {
|
|
107
|
-
comp.path = path;
|
|
75
|
+
if (comp.path) {
|
|
108
76
|
comp.componentsMap[comp.path] = comp;
|
|
109
77
|
}
|
|
110
78
|
return comp;
|
|
@@ -42,14 +42,13 @@ declare class Component extends Element {
|
|
|
42
42
|
*/
|
|
43
43
|
private _hasCondition;
|
|
44
44
|
/**
|
|
45
|
-
*
|
|
45
|
+
* The row index for this component.
|
|
46
46
|
*/
|
|
47
|
-
|
|
47
|
+
_rowIndex: number | undefined;
|
|
48
48
|
/**
|
|
49
|
-
*
|
|
50
|
-
* @type {string}
|
|
49
|
+
* References to dom elements
|
|
51
50
|
*/
|
|
52
|
-
|
|
51
|
+
refs: {};
|
|
53
52
|
/**
|
|
54
53
|
* An array of all the children components errors.
|
|
55
54
|
*/
|
|
@@ -114,6 +113,11 @@ declare class Component extends Element {
|
|
|
114
113
|
* @type {Component}
|
|
115
114
|
*/
|
|
116
115
|
parent: Component;
|
|
116
|
+
/**
|
|
117
|
+
* The component paths for this component.
|
|
118
|
+
* @type {import('@formio/core').ComponentPaths} - The component paths.
|
|
119
|
+
*/
|
|
120
|
+
paths: import('@formio/core').ComponentPaths;
|
|
117
121
|
_path: string;
|
|
118
122
|
/**
|
|
119
123
|
* Determines if this component is visible, or not.
|
|
@@ -158,7 +162,7 @@ declare class Component extends Element {
|
|
|
158
162
|
* @type {*}
|
|
159
163
|
*/
|
|
160
164
|
info: any;
|
|
161
|
-
get componentsMap():
|
|
165
|
+
get componentsMap(): object;
|
|
162
166
|
set data(value: any);
|
|
163
167
|
get data(): any;
|
|
164
168
|
mergeSchema(component?: {}): any;
|
|
@@ -182,6 +186,17 @@ declare class Component extends Element {
|
|
|
182
186
|
* @returns {boolean} - TRUE if the component is disabled.
|
|
183
187
|
*/
|
|
184
188
|
get disabled(): boolean;
|
|
189
|
+
/**
|
|
190
|
+
* Set Row Index to row and update each component.
|
|
191
|
+
* @param {number} value - The row index.
|
|
192
|
+
* @returns {void}
|
|
193
|
+
*/
|
|
194
|
+
set rowIndex(value: number);
|
|
195
|
+
/**
|
|
196
|
+
* Get Row Index.
|
|
197
|
+
* @returns {number} - The row index.
|
|
198
|
+
*/
|
|
199
|
+
get rowIndex(): number;
|
|
185
200
|
afterComponentAssign(): void;
|
|
186
201
|
createAddon(addonConfiguration: any): any;
|
|
187
202
|
get shouldDisabled(): any;
|
|
@@ -190,6 +205,8 @@ declare class Component extends Element {
|
|
|
190
205
|
get hasInput(): any;
|
|
191
206
|
get defaultSchema(): any;
|
|
192
207
|
get key(): any;
|
|
208
|
+
set path(path: string | undefined);
|
|
209
|
+
get path(): string | undefined;
|
|
193
210
|
set parentVisible(value: any);
|
|
194
211
|
get parentVisible(): any;
|
|
195
212
|
set parentDisabled(value: boolean);
|
|
@@ -212,7 +229,7 @@ declare class Component extends Element {
|
|
|
212
229
|
_currentForm: any;
|
|
213
230
|
get fullMode(): boolean;
|
|
214
231
|
get builderMode(): boolean;
|
|
215
|
-
get calculatedPath(): string;
|
|
232
|
+
get calculatedPath(): string | undefined;
|
|
216
233
|
get labelPosition(): any;
|
|
217
234
|
get labelWidth(): any;
|
|
218
235
|
get labelMargin(): any;
|