@formio/js 5.1.0-dev.6066.c5295e7 → 5.1.0-dev.6068.894e88e
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 +3 -3
- package/dist/formio.form.min.js +1 -1
- package/dist/formio.full.js +4 -4
- package/dist/formio.full.min.js +1 -1
- package/lib/cjs/components/_classes/component/Component.d.ts +6 -2
- package/lib/cjs/components/_classes/component/Component.js +39 -32
- package/lib/cjs/components/_classes/component/editForm/utils.js +1 -1
- package/lib/cjs/components/address/editForm/Address.edit.display.d.ts +4 -0
- package/lib/cjs/components/address/editForm/Address.edit.display.js +1 -0
- package/lib/cjs/components/form/Form.d.ts +0 -1
- package/lib/cjs/components/form/Form.js +12 -20
- package/lib/mjs/components/_classes/component/Component.d.ts +6 -2
- package/lib/mjs/components/_classes/component/Component.js +39 -32
- package/lib/mjs/components/_classes/component/editForm/utils.js +1 -1
- package/lib/mjs/components/address/editForm/Address.edit.display.d.ts +4 -0
- package/lib/mjs/components/address/editForm/Address.edit.display.js +1 -0
- package/lib/mjs/components/form/Form.d.ts +0 -1
- package/lib/mjs/components/form/Form.js +12 -20
- package/package.json +1 -1
@@ -165,6 +165,7 @@ declare class Component extends Element {
|
|
165
165
|
get componentsMap(): object;
|
166
166
|
parentShouldConditionallyClear(): boolean;
|
167
167
|
parentConditionallyHidden(): boolean;
|
168
|
+
parentHidden(): boolean;
|
168
169
|
set data(value: any);
|
169
170
|
get data(): any;
|
170
171
|
mergeSchema(component?: {}): any;
|
@@ -228,8 +229,11 @@ declare class Component extends Element {
|
|
228
229
|
get visible(): boolean;
|
229
230
|
get logicallyHidden(): any;
|
230
231
|
_logicallyHidden: any;
|
231
|
-
|
232
|
-
|
232
|
+
shouldConditionallyClearOnPristine(): boolean;
|
233
|
+
shouldConditionallyClear(): boolean;
|
234
|
+
_conditionallyClear: boolean | undefined;
|
235
|
+
conditionallyHidden(): boolean;
|
236
|
+
_conditionallyHidden: boolean | undefined;
|
233
237
|
set currentForm(instance: any);
|
234
238
|
get currentForm(): any;
|
235
239
|
_currentForm: any;
|
@@ -461,7 +461,8 @@ class Component extends Element_1.default {
|
|
461
461
|
parentShouldConditionallyClear() {
|
462
462
|
let currentParent = this.parent;
|
463
463
|
while (currentParent) {
|
464
|
-
if (currentParent.
|
464
|
+
if ((currentParent.allowData && currentParent._conditionallyClear) ||
|
465
|
+
(!currentParent.allowData && currentParent._conditionallyHidden)) {
|
465
466
|
return true;
|
466
467
|
}
|
467
468
|
currentParent = currentParent.parent;
|
@@ -471,7 +472,17 @@ class Component extends Element_1.default {
|
|
471
472
|
parentConditionallyHidden() {
|
472
473
|
let currentParent = this.parent;
|
473
474
|
while (currentParent) {
|
474
|
-
if (currentParent.
|
475
|
+
if (currentParent._conditionallyHidden) {
|
476
|
+
return true;
|
477
|
+
}
|
478
|
+
currentParent = currentParent.parent;
|
479
|
+
}
|
480
|
+
return false;
|
481
|
+
}
|
482
|
+
parentHidden() {
|
483
|
+
let currentParent = this.parent;
|
484
|
+
while (currentParent) {
|
485
|
+
if (currentParent.component.hidden) {
|
475
486
|
return true;
|
476
487
|
}
|
477
488
|
currentParent = currentParent.parent;
|
@@ -689,48 +700,44 @@ class Component extends Element_1.default {
|
|
689
700
|
}
|
690
701
|
return this._logicallyHidden;
|
691
702
|
}
|
692
|
-
|
703
|
+
shouldConditionallyClearOnPristine() {
|
704
|
+
return !this.parentHidden();
|
705
|
+
}
|
706
|
+
shouldConditionallyClear() {
|
693
707
|
// Skip if this component has clearOnHide set to false.
|
694
708
|
if (this.component.clearOnHide === false) {
|
695
|
-
|
709
|
+
this._conditionallyClear = false;
|
710
|
+
return this._conditionallyClear;
|
696
711
|
}
|
697
712
|
// If the component is logically hidden, then it is conditionally hidden and should clear.
|
698
713
|
if (this.logicallyHidden) {
|
699
|
-
|
714
|
+
this._conditionallyClear = true;
|
715
|
+
return this._conditionallyClear;
|
700
716
|
}
|
701
717
|
// If we have a condition and it is not conditionally visible, the it should conditionally clear.
|
702
|
-
if (this.hasCondition() &&
|
703
|
-
|
704
|
-
|
705
|
-
|
706
|
-
|
707
|
-
return false;
|
718
|
+
if (this.hasCondition() &&
|
719
|
+
!this.conditionallyVisible() &&
|
720
|
+
(!this.rootPristine || this.shouldConditionallyClearOnPristine())) {
|
721
|
+
this._conditionallyClear = true;
|
722
|
+
return this._conditionallyClear;
|
708
723
|
}
|
709
|
-
|
710
|
-
|
711
|
-
if (this.hasSetValue) {
|
712
|
-
return this.parentShouldConditionallyClear();
|
713
|
-
}
|
714
|
-
// Clear the value if the parent is conditionally hidden.
|
715
|
-
return this.parentConditionallyHidden();
|
724
|
+
this._conditionallyClear = this.hasSetValue ? false : this.parentShouldConditionallyClear();
|
725
|
+
return this._conditionallyClear;
|
716
726
|
}
|
717
|
-
conditionallyHidden(
|
727
|
+
conditionallyHidden() {
|
728
|
+
// If it is logically hidden, then it is conditionally hidden.
|
718
729
|
if (this.logicallyHidden) {
|
719
|
-
|
730
|
+
this._conditionallyHidden = true;
|
731
|
+
return this._conditionallyHidden;
|
720
732
|
}
|
721
|
-
|
722
|
-
|
723
|
-
|
724
|
-
|
725
|
-
if (!this.conditionallyVisible()) {
|
726
|
-
return true;
|
727
|
-
}
|
728
|
-
if (skipParent) {
|
729
|
-
// Stop recurrsion for the parent checks.
|
730
|
-
return false;
|
733
|
+
// If it has a condition, and is not conditionally visible, then it is conditionally hidden.
|
734
|
+
if (this.hasCondition() && !this.conditionallyVisible()) {
|
735
|
+
this._conditionallyHidden = true;
|
736
|
+
return this._conditionallyHidden;
|
731
737
|
}
|
732
|
-
//
|
733
|
-
|
738
|
+
// It is conditionally hidden if its parent is conditionally hidden.
|
739
|
+
this._conditionallyHidden = this.parentConditionallyHidden();
|
740
|
+
return this._conditionallyHidden;
|
734
741
|
}
|
735
742
|
get currentForm() {
|
736
743
|
return this._currentForm;
|
@@ -11,7 +11,7 @@ const EditFormUtils = {
|
|
11
11
|
},
|
12
12
|
unifyComponents(objValue, srcValue) {
|
13
13
|
if (objValue.key && srcValue.key) {
|
14
|
-
if (objValue.skipMerge || srcValue.skipMerge) {
|
14
|
+
if ((objValue.skipMerge || srcValue.skipMerge) && !objValue.ignore) {
|
15
15
|
return false;
|
16
16
|
}
|
17
17
|
if (objValue.key === srcValue.key) {
|
@@ -8,6 +8,7 @@ declare const _default: ({
|
|
8
8
|
customConditional: ({ data }: {
|
9
9
|
data: any;
|
10
10
|
}) => boolean;
|
11
|
+
defaultValue?: undefined;
|
11
12
|
placeholder?: undefined;
|
12
13
|
validate?: undefined;
|
13
14
|
} | {
|
@@ -15,6 +16,7 @@ declare const _default: ({
|
|
15
16
|
type: string;
|
16
17
|
input: boolean;
|
17
18
|
key: string;
|
19
|
+
defaultValue: string;
|
18
20
|
label: string;
|
19
21
|
placeholder: string;
|
20
22
|
tooltip: string;
|
@@ -32,6 +34,7 @@ declare const _default: ({
|
|
32
34
|
label: string;
|
33
35
|
tooltip: string;
|
34
36
|
customConditional?: undefined;
|
37
|
+
defaultValue?: undefined;
|
35
38
|
placeholder?: undefined;
|
36
39
|
validate?: undefined;
|
37
40
|
} | {
|
@@ -45,6 +48,7 @@ declare const _default: ({
|
|
45
48
|
customConditional: ({ data }: {
|
46
49
|
data: any;
|
47
50
|
}) => any;
|
51
|
+
defaultValue?: undefined;
|
48
52
|
validate?: undefined;
|
49
53
|
})[];
|
50
54
|
export default _default;
|
@@ -15,6 +15,7 @@ exports.default = [
|
|
15
15
|
type: 'textfield',
|
16
16
|
input: true,
|
17
17
|
key: 'switchToManualModeLabel',
|
18
|
+
defaultValue: 'Can\'t find address? Switch to manual mode.',
|
18
19
|
label: 'Switch To Manual Mode Label',
|
19
20
|
placeholder: 'Switch To Manual Mode Label',
|
20
21
|
tooltip: 'The label for the checkbox used to switch to manual mode.',
|
@@ -98,7 +98,6 @@ export default class FormComponent extends Component {
|
|
98
98
|
* @returns {void}
|
99
99
|
*/
|
100
100
|
onSetSubFormValue(submission: object | null | undefined, flags: object | null | undefined): void;
|
101
|
-
areAllComponentsEmpty(data: any): boolean;
|
102
101
|
updateSubFormVisibility(): void;
|
103
102
|
/**
|
104
103
|
* Determines if this form is a Nested Wizard
|
@@ -101,6 +101,9 @@ class FormComponent extends Component_1.default {
|
|
101
101
|
}
|
102
102
|
return this.createSubForm();
|
103
103
|
}
|
104
|
+
shouldConditionallyClearOnPristine() {
|
105
|
+
return !this.hasSetValue && super.shouldConditionallyClearOnPristine();
|
106
|
+
}
|
104
107
|
get dataReady() {
|
105
108
|
var _a;
|
106
109
|
return ((_a = this.subForm) === null || _a === void 0 ? void 0 : _a.dataReady) || this.subFormReady || Promise.resolve();
|
@@ -290,11 +293,13 @@ class FormComponent extends Component_1.default {
|
|
290
293
|
}
|
291
294
|
this.subForm.attach(element);
|
292
295
|
this.valueChanged = this.hasSetValue;
|
293
|
-
if (!this.
|
294
|
-
this.
|
295
|
-
|
296
|
-
|
297
|
-
|
296
|
+
if (!this.shouldConditionallyClear()) {
|
297
|
+
if (!this.valueChanged && this.dataValue.state !== 'submitted') {
|
298
|
+
this.setDefaultValue();
|
299
|
+
}
|
300
|
+
else {
|
301
|
+
this.restoreValue();
|
302
|
+
}
|
298
303
|
}
|
299
304
|
}
|
300
305
|
if (!this.builderMode && this.component.modalEdit) {
|
@@ -411,7 +416,7 @@ class FormComponent extends Component_1.default {
|
|
411
416
|
lodash_1.default.assign(componentsMap, formComponentsMap);
|
412
417
|
this.component.components = this.subForm.components.map((comp) => comp.component);
|
413
418
|
this.subForm.on('change', () => {
|
414
|
-
if (this.subForm) {
|
419
|
+
if (this.subForm && !this.shouldConditionallyClear()) {
|
415
420
|
this.dataValue = this.subForm.getValue();
|
416
421
|
this.triggerChange({
|
417
422
|
noEmit: true
|
@@ -679,20 +684,7 @@ class FormComponent extends Component_1.default {
|
|
679
684
|
}
|
680
685
|
}
|
681
686
|
isEmpty(value = this.dataValue) {
|
682
|
-
return value === null || lodash_1.default.isEqual(value, this.emptyValue)
|
683
|
-
}
|
684
|
-
areAllComponentsEmpty(data) {
|
685
|
-
let res = true;
|
686
|
-
if (this.subForm) {
|
687
|
-
this.subForm.everyComponent((comp) => {
|
688
|
-
const componentValue = lodash_1.default.get(data, comp.key);
|
689
|
-
res &= comp.isEmpty(componentValue);
|
690
|
-
});
|
691
|
-
}
|
692
|
-
else {
|
693
|
-
res = false;
|
694
|
-
}
|
695
|
-
return res;
|
687
|
+
return value === null || lodash_1.default.isEqual(value, this.emptyValue);
|
696
688
|
}
|
697
689
|
getValue() {
|
698
690
|
if (this.subForm) {
|
@@ -165,6 +165,7 @@ declare class Component extends Element {
|
|
165
165
|
get componentsMap(): object;
|
166
166
|
parentShouldConditionallyClear(): boolean;
|
167
167
|
parentConditionallyHidden(): boolean;
|
168
|
+
parentHidden(): boolean;
|
168
169
|
set data(value: any);
|
169
170
|
get data(): any;
|
170
171
|
mergeSchema(component?: {}): any;
|
@@ -228,8 +229,11 @@ declare class Component extends Element {
|
|
228
229
|
get visible(): boolean;
|
229
230
|
get logicallyHidden(): any;
|
230
231
|
_logicallyHidden: any;
|
231
|
-
|
232
|
-
|
232
|
+
shouldConditionallyClearOnPristine(): boolean;
|
233
|
+
shouldConditionallyClear(): boolean;
|
234
|
+
_conditionallyClear: boolean | undefined;
|
235
|
+
conditionallyHidden(): boolean;
|
236
|
+
_conditionallyHidden: boolean | undefined;
|
233
237
|
set currentForm(instance: any);
|
234
238
|
get currentForm(): any;
|
235
239
|
_currentForm: any;
|
@@ -425,7 +425,8 @@ export default class Component extends Element {
|
|
425
425
|
parentShouldConditionallyClear() {
|
426
426
|
let currentParent = this.parent;
|
427
427
|
while (currentParent) {
|
428
|
-
if (currentParent.
|
428
|
+
if ((currentParent.allowData && currentParent._conditionallyClear) ||
|
429
|
+
(!currentParent.allowData && currentParent._conditionallyHidden)) {
|
429
430
|
return true;
|
430
431
|
}
|
431
432
|
currentParent = currentParent.parent;
|
@@ -435,7 +436,17 @@ export default class Component extends Element {
|
|
435
436
|
parentConditionallyHidden() {
|
436
437
|
let currentParent = this.parent;
|
437
438
|
while (currentParent) {
|
438
|
-
if (currentParent.
|
439
|
+
if (currentParent._conditionallyHidden) {
|
440
|
+
return true;
|
441
|
+
}
|
442
|
+
currentParent = currentParent.parent;
|
443
|
+
}
|
444
|
+
return false;
|
445
|
+
}
|
446
|
+
parentHidden() {
|
447
|
+
let currentParent = this.parent;
|
448
|
+
while (currentParent) {
|
449
|
+
if (currentParent.component.hidden) {
|
439
450
|
return true;
|
440
451
|
}
|
441
452
|
currentParent = currentParent.parent;
|
@@ -653,48 +664,44 @@ export default class Component extends Element {
|
|
653
664
|
}
|
654
665
|
return this._logicallyHidden;
|
655
666
|
}
|
656
|
-
|
667
|
+
shouldConditionallyClearOnPristine() {
|
668
|
+
return !this.parentHidden();
|
669
|
+
}
|
670
|
+
shouldConditionallyClear() {
|
657
671
|
// Skip if this component has clearOnHide set to false.
|
658
672
|
if (this.component.clearOnHide === false) {
|
659
|
-
|
673
|
+
this._conditionallyClear = false;
|
674
|
+
return this._conditionallyClear;
|
660
675
|
}
|
661
676
|
// If the component is logically hidden, then it is conditionally hidden and should clear.
|
662
677
|
if (this.logicallyHidden) {
|
663
|
-
|
678
|
+
this._conditionallyClear = true;
|
679
|
+
return this._conditionallyClear;
|
664
680
|
}
|
665
681
|
// If we have a condition and it is not conditionally visible, the it should conditionally clear.
|
666
|
-
if (this.hasCondition() &&
|
667
|
-
|
668
|
-
|
669
|
-
|
670
|
-
|
671
|
-
return false;
|
682
|
+
if (this.hasCondition() &&
|
683
|
+
!this.conditionallyVisible() &&
|
684
|
+
(!this.rootPristine || this.shouldConditionallyClearOnPristine())) {
|
685
|
+
this._conditionallyClear = true;
|
686
|
+
return this._conditionallyClear;
|
672
687
|
}
|
673
|
-
|
674
|
-
|
675
|
-
if (this.hasSetValue) {
|
676
|
-
return this.parentShouldConditionallyClear();
|
677
|
-
}
|
678
|
-
// Clear the value if the parent is conditionally hidden.
|
679
|
-
return this.parentConditionallyHidden();
|
688
|
+
this._conditionallyClear = this.hasSetValue ? false : this.parentShouldConditionallyClear();
|
689
|
+
return this._conditionallyClear;
|
680
690
|
}
|
681
|
-
conditionallyHidden(
|
691
|
+
conditionallyHidden() {
|
692
|
+
// If it is logically hidden, then it is conditionally hidden.
|
682
693
|
if (this.logicallyHidden) {
|
683
|
-
|
694
|
+
this._conditionallyHidden = true;
|
695
|
+
return this._conditionallyHidden;
|
684
696
|
}
|
685
|
-
|
686
|
-
|
687
|
-
|
688
|
-
|
689
|
-
if (!this.conditionallyVisible()) {
|
690
|
-
return true;
|
691
|
-
}
|
692
|
-
if (skipParent) {
|
693
|
-
// Stop recurrsion for the parent checks.
|
694
|
-
return false;
|
697
|
+
// If it has a condition, and is not conditionally visible, then it is conditionally hidden.
|
698
|
+
if (this.hasCondition() && !this.conditionallyVisible()) {
|
699
|
+
this._conditionallyHidden = true;
|
700
|
+
return this._conditionallyHidden;
|
695
701
|
}
|
696
|
-
//
|
697
|
-
|
702
|
+
// It is conditionally hidden if its parent is conditionally hidden.
|
703
|
+
this._conditionallyHidden = this.parentConditionallyHidden();
|
704
|
+
return this._conditionallyHidden;
|
698
705
|
}
|
699
706
|
get currentForm() {
|
700
707
|
return this._currentForm;
|
@@ -6,7 +6,7 @@ const EditFormUtils = {
|
|
6
6
|
},
|
7
7
|
unifyComponents(objValue, srcValue) {
|
8
8
|
if (objValue.key && srcValue.key) {
|
9
|
-
if (objValue.skipMerge || srcValue.skipMerge) {
|
9
|
+
if ((objValue.skipMerge || srcValue.skipMerge) && !objValue.ignore) {
|
10
10
|
return false;
|
11
11
|
}
|
12
12
|
if (objValue.key === srcValue.key) {
|
@@ -8,6 +8,7 @@ declare const _default: ({
|
|
8
8
|
customConditional: ({ data }: {
|
9
9
|
data: any;
|
10
10
|
}) => boolean;
|
11
|
+
defaultValue?: undefined;
|
11
12
|
placeholder?: undefined;
|
12
13
|
validate?: undefined;
|
13
14
|
} | {
|
@@ -15,6 +16,7 @@ declare const _default: ({
|
|
15
16
|
type: string;
|
16
17
|
input: boolean;
|
17
18
|
key: string;
|
19
|
+
defaultValue: string;
|
18
20
|
label: string;
|
19
21
|
placeholder: string;
|
20
22
|
tooltip: string;
|
@@ -32,6 +34,7 @@ declare const _default: ({
|
|
32
34
|
label: string;
|
33
35
|
tooltip: string;
|
34
36
|
customConditional?: undefined;
|
37
|
+
defaultValue?: undefined;
|
35
38
|
placeholder?: undefined;
|
36
39
|
validate?: undefined;
|
37
40
|
} | {
|
@@ -45,6 +48,7 @@ declare const _default: ({
|
|
45
48
|
customConditional: ({ data }: {
|
46
49
|
data: any;
|
47
50
|
}) => any;
|
51
|
+
defaultValue?: undefined;
|
48
52
|
validate?: undefined;
|
49
53
|
})[];
|
50
54
|
export default _default;
|
@@ -13,6 +13,7 @@ export default [
|
|
13
13
|
type: 'textfield',
|
14
14
|
input: true,
|
15
15
|
key: 'switchToManualModeLabel',
|
16
|
+
defaultValue: 'Can\'t find address? Switch to manual mode.',
|
16
17
|
label: 'Switch To Manual Mode Label',
|
17
18
|
placeholder: 'Switch To Manual Mode Label',
|
18
19
|
tooltip: 'The label for the checkbox used to switch to manual mode.',
|
@@ -98,7 +98,6 @@ export default class FormComponent extends Component {
|
|
98
98
|
* @returns {void}
|
99
99
|
*/
|
100
100
|
onSetSubFormValue(submission: object | null | undefined, flags: object | null | undefined): void;
|
101
|
-
areAllComponentsEmpty(data: any): boolean;
|
102
101
|
updateSubFormVisibility(): void;
|
103
102
|
/**
|
104
103
|
* Determines if this form is a Nested Wizard
|
@@ -96,6 +96,9 @@ export default class FormComponent extends Component {
|
|
96
96
|
}
|
97
97
|
return this.createSubForm();
|
98
98
|
}
|
99
|
+
shouldConditionallyClearOnPristine() {
|
100
|
+
return !this.hasSetValue && super.shouldConditionallyClearOnPristine();
|
101
|
+
}
|
99
102
|
get dataReady() {
|
100
103
|
return this.subForm?.dataReady || this.subFormReady || Promise.resolve();
|
101
104
|
}
|
@@ -286,11 +289,13 @@ export default class FormComponent extends Component {
|
|
286
289
|
}
|
287
290
|
this.subForm.attach(element);
|
288
291
|
this.valueChanged = this.hasSetValue;
|
289
|
-
if (!this.
|
290
|
-
this.
|
291
|
-
|
292
|
-
|
293
|
-
|
292
|
+
if (!this.shouldConditionallyClear()) {
|
293
|
+
if (!this.valueChanged && this.dataValue.state !== 'submitted') {
|
294
|
+
this.setDefaultValue();
|
295
|
+
}
|
296
|
+
else {
|
297
|
+
this.restoreValue();
|
298
|
+
}
|
294
299
|
}
|
295
300
|
}
|
296
301
|
if (!this.builderMode && this.component.modalEdit) {
|
@@ -405,7 +410,7 @@ export default class FormComponent extends Component {
|
|
405
410
|
_.assign(componentsMap, formComponentsMap);
|
406
411
|
this.component.components = this.subForm.components.map((comp) => comp.component);
|
407
412
|
this.subForm.on('change', () => {
|
408
|
-
if (this.subForm) {
|
413
|
+
if (this.subForm && !this.shouldConditionallyClear()) {
|
409
414
|
this.dataValue = this.subForm.getValue();
|
410
415
|
this.triggerChange({
|
411
416
|
noEmit: true
|
@@ -668,20 +673,7 @@ export default class FormComponent extends Component {
|
|
668
673
|
}
|
669
674
|
}
|
670
675
|
isEmpty(value = this.dataValue) {
|
671
|
-
return value === null || _.isEqual(value, this.emptyValue)
|
672
|
-
}
|
673
|
-
areAllComponentsEmpty(data) {
|
674
|
-
let res = true;
|
675
|
-
if (this.subForm) {
|
676
|
-
this.subForm.everyComponent((comp) => {
|
677
|
-
const componentValue = _.get(data, comp.key);
|
678
|
-
res &= comp.isEmpty(componentValue);
|
679
|
-
});
|
680
|
-
}
|
681
|
-
else {
|
682
|
-
res = false;
|
683
|
-
}
|
684
|
-
return res;
|
676
|
+
return value === null || _.isEqual(value, this.emptyValue);
|
685
677
|
}
|
686
678
|
getValue() {
|
687
679
|
if (this.subForm) {
|