@formio/js 5.1.0-dev.6039.a838d78 → 5.1.0-dev.6042.18ef5d3
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/Changelog.md +140 -6
- package/dist/formio.form.js +587 -576
- package/dist/formio.form.min.js +1 -1
- package/dist/formio.full.js +609 -598
- package/dist/formio.full.min.js +1 -1
- package/dist/formio.js +45 -12
- package/dist/formio.min.js +1 -1
- package/dist/formio.utils.js +46 -13
- package/dist/formio.utils.min.js +1 -1
- package/lib/cjs/Element.d.ts +2 -1
- package/lib/cjs/Element.js +6 -4
- package/lib/cjs/Webform.d.ts +2 -2
- package/lib/cjs/Webform.js +6 -8
- package/lib/cjs/WebformBuilder.js +4 -0
- package/lib/cjs/Wizard.d.ts +1 -0
- package/lib/cjs/Wizard.js +23 -3
- package/lib/cjs/components/_classes/component/Component.d.ts +27 -17
- package/lib/cjs/components/_classes/component/Component.js +124 -70
- package/lib/cjs/components/_classes/component/editForm/Component.edit.data.js +19 -0
- package/lib/cjs/components/_classes/component/editForm/utils.js +1 -1
- package/lib/cjs/components/_classes/list/ListComponent.js +2 -2
- package/lib/cjs/components/_classes/nested/NestedComponent.d.ts +0 -1
- package/lib/cjs/components/_classes/nested/NestedComponent.form.js +13 -0
- package/lib/cjs/components/_classes/nested/NestedComponent.js +10 -18
- package/lib/cjs/components/_classes/nesteddata/NestedDataComponent.d.ts +0 -2
- package/lib/cjs/components/_classes/nesteddata/NestedDataComponent.js +0 -11
- package/lib/cjs/components/address/Address.d.ts +9 -0
- package/lib/cjs/components/address/Address.js +31 -8
- 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/address/editForm/Address.edit.provider.js +8 -8
- package/lib/cjs/components/content/editForm/Content.edit.display.js +8 -0
- package/lib/cjs/components/currency/editForm/Currency.edit.display.js +12 -0
- package/lib/cjs/components/datagrid/DataGrid.js +0 -3
- package/lib/cjs/components/datamap/DataMap.js +2 -6
- package/lib/cjs/components/datetime/editForm/DateTime.edit.validation.d.ts +66 -15
- package/lib/cjs/components/datetime/editForm/DateTime.edit.validation.js +68 -47
- package/lib/cjs/components/day/editForm/Day.edit.display.js +8 -0
- package/lib/cjs/components/editgrid/EditGrid.js +3 -13
- package/lib/cjs/components/email/editForm/Email.edit.display.js +12 -0
- package/lib/cjs/components/fieldset/editForm/Fieldset.edit.display.js +8 -0
- package/lib/cjs/components/file/File.js +7 -2
- package/lib/cjs/components/file/editForm/File.edit.file.d.ts +13 -0
- package/lib/cjs/components/file/editForm/File.edit.file.js +1 -0
- package/lib/cjs/components/form/Form.js +11 -11
- package/lib/cjs/components/hidden/editForm/Hidden.edit.display.js +8 -0
- package/lib/cjs/components/html/HTML.js +1 -2
- package/lib/cjs/components/html/editForm/HTML.edit.display.js +8 -0
- package/lib/cjs/components/number/editForm/Number.edit.display.js +12 -0
- package/lib/cjs/components/password/editForm/Password.edit.display.js +13 -1
- package/lib/cjs/components/phonenumber/PhoneNumber.form.js +9 -1
- package/lib/cjs/components/radio/Radio.js +1 -1
- package/lib/cjs/components/select/Select.js +1 -1
- package/lib/cjs/components/select/editForm/Select.edit.data.d.ts +68 -110
- package/lib/cjs/components/select/editForm/Select.edit.data.js +2 -37
- package/lib/cjs/components/selectboxes/SelectBoxes.js +3 -0
- package/lib/cjs/components/survey/Survey.js +1 -1
- package/lib/cjs/components/tabs/Tabs.js +1 -0
- package/lib/cjs/components/tabs/editForm/Tabs.edit.display.js +8 -0
- package/lib/cjs/components/textarea/TextArea.js +9 -1
- package/lib/cjs/components/textarea/editForm/TextArea.edit.display.js +12 -0
- package/lib/cjs/components/unknown/Unknown.form.d.ts +2 -1
- package/lib/cjs/components/unknown/Unknown.form.js +13 -9
- package/lib/cjs/components/url/editForm/Url.edit.display.js +12 -0
- package/lib/cjs/components/well/editForm/Well.edit.display.js +8 -0
- package/lib/cjs/formio.form.js +2 -2
- package/lib/cjs/providers/storage/uploadAdapter.js +5 -3
- package/lib/cjs/translations/en.d.ts +1 -234
- package/lib/cjs/translations/en.js +4 -2
- package/lib/cjs/utils/formUtils.d.ts +2 -2
- package/lib/cjs/utils/utils.d.ts +0 -8
- package/lib/cjs/utils/utils.js +3 -23
- package/lib/mjs/Element.d.ts +2 -1
- package/lib/mjs/Element.js +6 -4
- package/lib/mjs/Webform.d.ts +2 -2
- package/lib/mjs/Webform.js +6 -8
- package/lib/mjs/WebformBuilder.js +4 -0
- package/lib/mjs/Wizard.d.ts +1 -0
- package/lib/mjs/Wizard.js +22 -2
- package/lib/mjs/components/_classes/component/Component.d.ts +27 -17
- package/lib/mjs/components/_classes/component/Component.js +125 -71
- package/lib/mjs/components/_classes/component/editForm/Component.edit.data.js +19 -0
- package/lib/mjs/components/_classes/component/editForm/utils.js +1 -1
- package/lib/mjs/components/_classes/list/ListComponent.js +2 -2
- package/lib/mjs/components/_classes/nested/NestedComponent.d.ts +0 -1
- package/lib/mjs/components/_classes/nested/NestedComponent.form.js +13 -0
- package/lib/mjs/components/_classes/nested/NestedComponent.js +10 -18
- package/lib/mjs/components/_classes/nesteddata/NestedDataComponent.d.ts +0 -2
- package/lib/mjs/components/_classes/nesteddata/NestedDataComponent.js +0 -11
- package/lib/mjs/components/address/Address.d.ts +9 -0
- package/lib/mjs/components/address/Address.js +31 -8
- 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/address/editForm/Address.edit.provider.js +8 -8
- package/lib/mjs/components/content/editForm/Content.edit.display.js +8 -0
- package/lib/mjs/components/currency/editForm/Currency.edit.display.js +12 -0
- package/lib/mjs/components/datagrid/DataGrid.js +0 -3
- package/lib/mjs/components/datamap/DataMap.js +2 -6
- package/lib/mjs/components/datetime/editForm/DateTime.edit.validation.d.ts +66 -15
- package/lib/mjs/components/datetime/editForm/DateTime.edit.validation.js +68 -47
- package/lib/mjs/components/day/editForm/Day.edit.display.js +8 -0
- package/lib/mjs/components/editgrid/EditGrid.js +3 -12
- package/lib/mjs/components/email/editForm/Email.edit.display.js +12 -0
- package/lib/mjs/components/fieldset/editForm/Fieldset.edit.display.js +8 -0
- package/lib/mjs/components/file/File.js +7 -2
- package/lib/mjs/components/file/editForm/File.edit.file.d.ts +13 -0
- package/lib/mjs/components/file/editForm/File.edit.file.js +1 -0
- package/lib/mjs/components/form/Form.js +11 -11
- package/lib/mjs/components/hidden/editForm/Hidden.edit.display.js +8 -0
- package/lib/mjs/components/html/HTML.js +1 -2
- package/lib/mjs/components/html/editForm/HTML.edit.display.js +8 -0
- package/lib/mjs/components/number/editForm/Number.edit.display.js +12 -0
- package/lib/mjs/components/password/editForm/Password.edit.display.js +13 -1
- package/lib/mjs/components/phonenumber/PhoneNumber.form.js +9 -1
- package/lib/mjs/components/radio/Radio.js +1 -1
- package/lib/mjs/components/select/Select.js +1 -1
- package/lib/mjs/components/select/editForm/Select.edit.data.d.ts +68 -110
- package/lib/mjs/components/select/editForm/Select.edit.data.js +2 -37
- package/lib/mjs/components/selectboxes/SelectBoxes.js +3 -0
- package/lib/mjs/components/survey/Survey.js +1 -1
- package/lib/mjs/components/tabs/Tabs.js +1 -0
- package/lib/mjs/components/tabs/editForm/Tabs.edit.display.js +8 -0
- package/lib/mjs/components/textarea/TextArea.js +9 -1
- package/lib/mjs/components/textarea/editForm/TextArea.edit.display.js +12 -0
- package/lib/mjs/components/unknown/Unknown.form.d.ts +2 -1
- package/lib/mjs/components/unknown/Unknown.form.js +13 -9
- package/lib/mjs/components/url/editForm/Url.edit.display.js +12 -0
- package/lib/mjs/components/well/editForm/Well.edit.display.js +8 -0
- package/lib/mjs/formio.form.js +1 -1
- package/lib/mjs/providers/storage/uploadAdapter.js +5 -3
- package/lib/mjs/translations/en.d.ts +1 -234
- package/lib/mjs/translations/en.js +3 -47
- package/lib/mjs/utils/formUtils.d.ts +2 -2
- package/lib/mjs/utils/utils.d.ts +0 -8
- package/lib/mjs/utils/utils.js +2 -21
- package/package.json +2 -2
- package/lib/cjs/i18n.d.ts +0 -13
- package/lib/cjs/i18n.js +0 -19
- package/lib/cjs/utils/i18n.d.ts +0 -19
- package/lib/cjs/utils/i18n.js +0 -120
- package/lib/mjs/i18n.d.ts +0 -13
- package/lib/mjs/i18n.js +0 -14
- package/lib/mjs/utils/i18n.d.ts +0 -19
- package/lib/mjs/utils/i18n.js +0 -112
package/lib/cjs/Element.d.ts
CHANGED
@@ -170,10 +170,11 @@ export default class Element {
|
|
170
170
|
/**
|
171
171
|
* Translate a text using the i18n system.
|
172
172
|
* @param {string|Array<string>} text - The i18n identifier.
|
173
|
+
* @param {any} data - contextual data object containing data, component, row, etc.
|
173
174
|
* @param {...any} args - The arguments to pass to the i18n translation.
|
174
175
|
* @returns {string} - The translated text.
|
175
176
|
*/
|
176
|
-
t(text: string | Array<string>, ...args: any[]): string;
|
177
|
+
t(text: string | Array<string>, data: any, ...args: any[]): string;
|
177
178
|
/**
|
178
179
|
* Alias to create a text node.
|
179
180
|
* @param {string} text - The text to create.
|
package/lib/cjs/Element.js
CHANGED
@@ -29,10 +29,11 @@ Object.defineProperty(exports, "__esModule", { value: true });
|
|
29
29
|
const EventEmitter_1 = __importDefault(require("./EventEmitter"));
|
30
30
|
const Formio_1 = require("./Formio");
|
31
31
|
const FormioUtils = __importStar(require("./utils/utils"));
|
32
|
-
const
|
32
|
+
const core_1 = require("@formio/core");
|
33
33
|
const lodash_1 = __importDefault(require("lodash"));
|
34
34
|
const moment_1 = __importDefault(require("moment"));
|
35
35
|
const vanilla_text_mask_1 = __importDefault(require("@formio/vanilla-text-mask"));
|
36
|
+
const en_1 = __importDefault(require("./translations/en"));
|
36
37
|
/**
|
37
38
|
* The root component for all elements within the Form.io renderer.
|
38
39
|
*/
|
@@ -67,7 +68,7 @@ class Element {
|
|
67
68
|
if ((_a = this.options) === null || _a === void 0 ? void 0 : _a.language) {
|
68
69
|
this.options.i18n.language = this.options.language;
|
69
70
|
}
|
70
|
-
this.options.i18next = this.i18next = this.options.i18next ||
|
71
|
+
this.options.i18next = this.i18next = this.options.i18next || core_1.I18n.init(Object.assign({ en: en_1.default }, this.options.i18n));
|
71
72
|
/**
|
72
73
|
* An instance of the EventEmitter class to handle the emitting and registration of events.
|
73
74
|
* @type {EventEmitter}
|
@@ -415,11 +416,12 @@ class Element {
|
|
415
416
|
/**
|
416
417
|
* Translate a text using the i18n system.
|
417
418
|
* @param {string|Array<string>} text - The i18n identifier.
|
419
|
+
* @param {any} data - contextual data object containing data, component, row, etc.
|
418
420
|
* @param {...any} args - The arguments to pass to the i18n translation.
|
419
421
|
* @returns {string} - The translated text.
|
420
422
|
*/
|
421
|
-
t(text, ...args) {
|
422
|
-
return this.i18next ? this.i18next.t(text, ...args) : text;
|
423
|
+
t(text, data, ...args) {
|
424
|
+
return this.i18next ? this.i18next.t(text, data, ...args) : text;
|
423
425
|
}
|
424
426
|
/**
|
425
427
|
* Alias to create a text node.
|
package/lib/cjs/Webform.d.ts
CHANGED
@@ -45,7 +45,7 @@
|
|
45
45
|
* @property {number} [saveDraftThrottle] - The throttle for the save draft feature.
|
46
46
|
* @property {boolean} [readOnly] - Set this form to readOnly.
|
47
47
|
* @property {boolean} [noAlerts] - Disable the alerts dialog.
|
48
|
-
* @property {{[key: string]: string}} [
|
48
|
+
* @property {{[key: string]: string}} [enTranslation] - The translation file for this rendering.
|
49
49
|
* @property {string} [template] - Custom logic for creation of elements.
|
50
50
|
* @property {boolean} [noDefaults] - Exclude default values from the settings.
|
51
51
|
* @property {any} [fileService] - The file service for this form.
|
@@ -586,7 +586,7 @@ export type FormOptions = {
|
|
586
586
|
/**
|
587
587
|
* - The translation file for this rendering.
|
588
588
|
*/
|
589
|
-
|
589
|
+
enTranslation?: {
|
590
590
|
[key: string]: string;
|
591
591
|
} | undefined;
|
592
592
|
/**
|
package/lib/cjs/Webform.js
CHANGED
@@ -7,7 +7,7 @@ const lodash_1 = __importDefault(require("lodash"));
|
|
7
7
|
const moment_1 = __importDefault(require("moment"));
|
8
8
|
const compare_versions_1 = require("compare-versions");
|
9
9
|
const EventEmitter_1 = __importDefault(require("./EventEmitter"));
|
10
|
-
const
|
10
|
+
const en_1 = __importDefault(require("./translations/en"));
|
11
11
|
const Formio_1 = require("./Formio");
|
12
12
|
const Components_1 = __importDefault(require("./components/Components"));
|
13
13
|
const NestedDataComponent_1 = __importDefault(require("./components/_classes/nesteddata/NestedDataComponent"));
|
@@ -100,7 +100,7 @@ function getOptions(options) {
|
|
100
100
|
* @property {number} [saveDraftThrottle] - The throttle for the save draft feature.
|
101
101
|
* @property {boolean} [readOnly] - Set this form to readOnly.
|
102
102
|
* @property {boolean} [noAlerts] - Disable the alerts dialog.
|
103
|
-
* @property {{[key: string]: string}} [
|
103
|
+
* @property {{[key: string]: string}} [enTranslation] - The translation file for this rendering.
|
104
104
|
* @property {string} [template] - Custom logic for creation of elements.
|
105
105
|
* @property {boolean} [noDefaults] - Exclude default values from the settings.
|
106
106
|
* @property {any} [fileService] - The file service for this form.
|
@@ -370,7 +370,7 @@ class Webform extends NestedDataComponent_1.default {
|
|
370
370
|
*/
|
371
371
|
addLanguage(code, lang, active = false) {
|
372
372
|
if (this.i18next) {
|
373
|
-
var translations = lodash_1.default.assign((0, utils_1.fastCloneDeep)(
|
373
|
+
var translations = lodash_1.default.assign((0, utils_1.fastCloneDeep)(en_1.default), lang);
|
374
374
|
this.i18next.addResourceBundle(code, 'translation', translations, true, true);
|
375
375
|
if (active) {
|
376
376
|
this.language = code;
|
@@ -1157,11 +1157,8 @@ class Webform extends NestedDataComponent_1.default {
|
|
1157
1157
|
};
|
1158
1158
|
errors.forEach(({ message, context, fromServer, component }, index) => {
|
1159
1159
|
const text = !(component === null || component === void 0 ? void 0 : component.label) || (context === null || context === void 0 ? void 0 : context.hasLabel) || fromServer
|
1160
|
-
? this.t(
|
1161
|
-
: this.t(
|
1162
|
-
label: this.t(component === null || component === void 0 ? void 0 : component.label),
|
1163
|
-
message: this.t(message),
|
1164
|
-
});
|
1160
|
+
? this.t(message)
|
1161
|
+
: `${this.t(component === null || component === void 0 ? void 0 : component.label)}: ${this.t(message)}`;
|
1165
1162
|
displayedErrors.push(createListItem(text, index));
|
1166
1163
|
});
|
1167
1164
|
}
|
@@ -1322,6 +1319,7 @@ class Webform extends NestedDataComponent_1.default {
|
|
1322
1319
|
userAgent: navigator.userAgent,
|
1323
1320
|
pathName: window.location.pathname,
|
1324
1321
|
onLine: navigator.onLine,
|
1322
|
+
language: this.language,
|
1325
1323
|
});
|
1326
1324
|
}
|
1327
1325
|
submitForm(options = {}, local = false) {
|
@@ -1623,6 +1623,10 @@ class WebformBuilder extends Component_1.default {
|
|
1623
1623
|
info.type);
|
1624
1624
|
}
|
1625
1625
|
hasEditTabs(type) {
|
1626
|
+
// If the component type does not exist then it has no edit tabs
|
1627
|
+
if (!Components_1.default.components[type === 'custom' ? 'unknown' : type]) {
|
1628
|
+
return false;
|
1629
|
+
}
|
1626
1630
|
const editTabs = (0, formUtils_1.getComponent)(Components_1.default.components[type === 'custom' ? 'unknown' : type].editForm().components, 'tabs', true).components;
|
1627
1631
|
const hiddenEditTabs = lodash_1.default.filter(lodash_1.default.get(this.options, `editForm.${type}`, []), 'ignore');
|
1628
1632
|
return lodash_1.default.intersectionBy(editTabs, hiddenEditTabs, 'key').length !== editTabs.length;
|
package/lib/cjs/Wizard.d.ts
CHANGED
@@ -106,6 +106,7 @@ declare class Wizard extends Webform {
|
|
106
106
|
onChange(flags: any, changed: any, modified: any, changes: any): void;
|
107
107
|
checkValidity(data: any, dirty: any, row: any, currentPageOnly: any, childErrors?: any[]): any;
|
108
108
|
focusOnComponent(key: any): void | Promise<void>;
|
109
|
+
triggerButtonCaptcha(page: any): void;
|
109
110
|
}
|
110
111
|
declare namespace Wizard {
|
111
112
|
let setBaseUrl: any;
|
package/lib/cjs/Wizard.js
CHANGED
@@ -602,7 +602,7 @@ class Wizard extends Webform_1.default {
|
|
602
602
|
}
|
603
603
|
this.redraw().then(() => {
|
604
604
|
this.checkData(this.submission.data);
|
605
|
-
this.triggerCaptcha(this.
|
605
|
+
this.triggerCaptcha(this.currentPage.components);
|
606
606
|
const errors = this.submitted ? this.validate(this.localData, { dirty: true }) : this.validateCurrentPage();
|
607
607
|
if (this.alert) {
|
608
608
|
this.showErrors(errors, true, true);
|
@@ -670,6 +670,7 @@ class Wizard extends Webform_1.default {
|
|
670
670
|
beforeSubmit() {
|
671
671
|
const pages = this.getPages({ all: true });
|
672
672
|
return Promise.all(pages.map((page) => {
|
673
|
+
this.triggerButtonCaptcha(page);
|
673
674
|
page.options.beforeSubmit = true;
|
674
675
|
return page.beforeSubmit();
|
675
676
|
}));
|
@@ -726,10 +727,13 @@ class Wizard extends Webform_1.default {
|
|
726
727
|
}
|
727
728
|
}
|
728
729
|
validateCurrentPage(flags = {}) {
|
729
|
-
var _a, _b;
|
730
|
+
var _a, _b, _c, _d;
|
730
731
|
const components = (_a = this.currentPage) === null || _a === void 0 ? void 0 : _a.components.map((component) => component.component);
|
731
732
|
// Accessing the parent ensures the right instance (whether it's the parent Wizard or a nested Wizard) performs its validation
|
732
|
-
|
733
|
+
if ((_b = this.currentPage) === null || _b === void 0 ? void 0 : _b.parent) {
|
734
|
+
return (_c = this.currentPage) === null || _c === void 0 ? void 0 : _c.parent.validateComponents(components, this.root.data, flags);
|
735
|
+
}
|
736
|
+
return (_d = this.currentPage) === null || _d === void 0 ? void 0 : _d.validateComponents(components, this.root ? this.root.data : this.data, flags);
|
733
737
|
}
|
734
738
|
emitPrevPage() {
|
735
739
|
this.emit('prevPage', { page: this.page, submission: this.submission });
|
@@ -942,6 +946,22 @@ class Wizard extends Webform_1.default {
|
|
942
946
|
}
|
943
947
|
return super.focusOnComponent(key);
|
944
948
|
}
|
949
|
+
triggerButtonCaptcha(page) {
|
950
|
+
if (!page.components) {
|
951
|
+
return;
|
952
|
+
}
|
953
|
+
let captchaComponent;
|
954
|
+
page.eachComponent((component) => {
|
955
|
+
if (/^(re)?captcha$/.test(component.component.type) &&
|
956
|
+
component.component.eventType === 'buttonClick' &&
|
957
|
+
component.component.buttonKey === 'submit') {
|
958
|
+
captchaComponent = component;
|
959
|
+
}
|
960
|
+
});
|
961
|
+
if (captchaComponent) {
|
962
|
+
captchaComponent.verify(`submitClick`);
|
963
|
+
}
|
964
|
+
}
|
945
965
|
}
|
946
966
|
exports.default = Wizard;
|
947
967
|
Wizard.setBaseUrl = Formio_1.Formio.setBaseUrl;
|
@@ -119,13 +119,6 @@ declare class Component extends Element {
|
|
119
119
|
*/
|
120
120
|
paths: import('@formio/core').ComponentPaths;
|
121
121
|
_path: string;
|
122
|
-
/**
|
123
|
-
* Determines if this component is conditionally hidden. Should generally not be set outside of conditional logic pipeline.
|
124
|
-
* This is necessary because of clearOnHide behavior that only clears when conditionally hidden - we need to track
|
125
|
-
* conditionallyHidden separately from "regular" visibility.
|
126
|
-
*/
|
127
|
-
_parentConditionallyHidden: any;
|
128
|
-
_conditionallyHidden: any;
|
129
122
|
/**
|
130
123
|
* Determines if this component is visible, or not.
|
131
124
|
*/
|
@@ -170,6 +163,8 @@ declare class Component extends Element {
|
|
170
163
|
*/
|
171
164
|
info: any;
|
172
165
|
get componentsMap(): object;
|
166
|
+
parentShouldConditionallyClear(): boolean;
|
167
|
+
parentConditionallyHidden(): boolean;
|
173
168
|
set data(value: any);
|
174
169
|
get data(): any;
|
175
170
|
mergeSchema(component?: {}): any;
|
@@ -231,14 +226,10 @@ declare class Component extends Element {
|
|
231
226
|
* @returns {boolean} - Whether the component is visible or not.
|
232
227
|
*/
|
233
228
|
get visible(): boolean;
|
234
|
-
get
|
235
|
-
|
236
|
-
|
237
|
-
|
238
|
-
* @param {object} row - The row object to evaluate the condition against.
|
239
|
-
* @returns {boolean} - Whether the component is conditionally hidden.
|
240
|
-
*/
|
241
|
-
checkConditionallyHidden(data?: object, row?: object): boolean;
|
229
|
+
get logicallyHidden(): any;
|
230
|
+
_logicallyHidden: any;
|
231
|
+
shouldConditionallyClear(skipParent?: boolean): boolean;
|
232
|
+
conditionallyHidden(skipParent?: boolean): boolean;
|
242
233
|
set currentForm(instance: any);
|
243
234
|
get currentForm(): any;
|
244
235
|
_currentForm: any;
|
@@ -789,6 +780,10 @@ declare class Component extends Element {
|
|
789
780
|
* @returns {void}
|
790
781
|
*/
|
791
782
|
setElementInvalid(element: HTMLElement, invalid: boolean): void;
|
783
|
+
/**
|
784
|
+
* Clear any conditionally hidden components for this component only.
|
785
|
+
*/
|
786
|
+
clearComponentOnHide(): void;
|
792
787
|
/**
|
793
788
|
* Clears the components data if it is conditionally hidden AND clearOnHide is set to true for this component.
|
794
789
|
*/
|
@@ -893,7 +888,20 @@ declare class Component extends Element {
|
|
893
888
|
*/
|
894
889
|
deleteValue(): void;
|
895
890
|
getCustomDefaultValue(defaultValue: any): any;
|
896
|
-
|
891
|
+
/**
|
892
|
+
* Returns if a component has a default value set.
|
893
|
+
* @returns {boolean} - TRUE if a default value is set.
|
894
|
+
*/
|
895
|
+
get hasDefaultValue(): boolean;
|
896
|
+
/**
|
897
|
+
* Determine if we should add a default value for this component.
|
898
|
+
* @returns {boolean} - TRUE if a default value should be set
|
899
|
+
*/
|
900
|
+
get shouldAddDefaultValue(): boolean;
|
901
|
+
/**
|
902
|
+
* Get the default value of this component.
|
903
|
+
* @returns {*} - The default value for this component.
|
904
|
+
*/
|
897
905
|
get defaultValue(): any;
|
898
906
|
/**
|
899
907
|
* Get the input value of this component.
|
@@ -1003,9 +1011,10 @@ declare class Component extends Element {
|
|
1003
1011
|
* @param {boolean} dirty - If the component is dirty.
|
1004
1012
|
* @param {boolean} ignoreCondition - If conditions for the component should be ignored when checking validity.
|
1005
1013
|
* @param {*} row - Contextual row data for this component.
|
1014
|
+
* @param {*} options - Additional options for validation.
|
1006
1015
|
* @returns {string} - The message to show when the component is invalid.
|
1007
1016
|
*/
|
1008
|
-
invalidMessage(data: any, dirty: boolean, ignoreCondition: boolean, row: any): string;
|
1017
|
+
invalidMessage(data: any, dirty: boolean, ignoreCondition: boolean, row: any, options?: any): string;
|
1009
1018
|
/**
|
1010
1019
|
* Returns if the component is valid or not.
|
1011
1020
|
* @param {*} data - The data to check if the component is valid.
|
@@ -1067,6 +1076,7 @@ declare class Component extends Element {
|
|
1067
1076
|
* @returns {void|boolean} - TRUE if no check should be performed on the component.
|
1068
1077
|
*/
|
1069
1078
|
checkData(data?: any, flags?: any, row?: any): void | boolean;
|
1079
|
+
checkingData: boolean | undefined;
|
1070
1080
|
checkModal(errors?: any[], dirty?: boolean): void;
|
1071
1081
|
get validationValue(): any;
|
1072
1082
|
isEmpty(value?: any): any;
|
@@ -351,18 +351,11 @@ class Component extends Element_1.default {
|
|
351
351
|
this._path = '';
|
352
352
|
// Needs for Nextgen Rules Engine
|
353
353
|
this.resetCaches();
|
354
|
-
/**
|
355
|
-
* Determines if this component is conditionally hidden. Should generally not be set outside of conditional logic pipeline.
|
356
|
-
* This is necessary because of clearOnHide behavior that only clears when conditionally hidden - we need to track
|
357
|
-
* conditionallyHidden separately from "regular" visibility.
|
358
|
-
*/
|
359
|
-
this._parentConditionallyHidden = this.options.hasOwnProperty('parentConditionallyHidden') ? this.options.parentConditionallyHidden : false;
|
360
|
-
this._conditionallyHidden = this.checkConditionallyHidden(null, data) || this._parentConditionallyHidden;
|
361
354
|
/**
|
362
355
|
* Determines if this component is visible, or not.
|
363
356
|
*/
|
364
357
|
this._parentVisible = this.options.hasOwnProperty('parentVisible') ? this.options.parentVisible : true;
|
365
|
-
this._visible = this._parentVisible && (this.hasCondition() ? !this.
|
358
|
+
this._visible = this._parentVisible && (this.hasCondition() ? !this.conditionallyHidden() : !this.component.hidden);
|
366
359
|
this._parentDisabled = false;
|
367
360
|
/**
|
368
361
|
* The reference attribute name for this component
|
@@ -431,7 +424,7 @@ class Component extends Element_1.default {
|
|
431
424
|
if (this.allowData && this.key) {
|
432
425
|
this.options.name += `[${this.key}]`;
|
433
426
|
// If component is visible or not set to clear on hide, set the default value.
|
434
|
-
if (!
|
427
|
+
if (!this.shouldConditionallyClear()) {
|
435
428
|
if (!this.hasValue()) {
|
436
429
|
if (this.shouldAddDefaultValue) {
|
437
430
|
this.dataValue = this.defaultValue;
|
@@ -465,6 +458,26 @@ class Component extends Element_1.default {
|
|
465
458
|
var _a;
|
466
459
|
return ((_a = this.root) === null || _a === void 0 ? void 0 : _a.childComponentsMap) || {};
|
467
460
|
}
|
461
|
+
parentShouldConditionallyClear() {
|
462
|
+
let currentParent = this.parent;
|
463
|
+
while (currentParent) {
|
464
|
+
if (currentParent.shouldConditionallyClear(true)) {
|
465
|
+
return true;
|
466
|
+
}
|
467
|
+
currentParent = currentParent.parent;
|
468
|
+
}
|
469
|
+
return false;
|
470
|
+
}
|
471
|
+
parentConditionallyHidden() {
|
472
|
+
let currentParent = this.parent;
|
473
|
+
while (currentParent) {
|
474
|
+
if (currentParent.conditionallyHidden(true)) {
|
475
|
+
return true;
|
476
|
+
}
|
477
|
+
currentParent = currentParent.parent;
|
478
|
+
}
|
479
|
+
return false;
|
480
|
+
}
|
468
481
|
get data() {
|
469
482
|
return this._data;
|
470
483
|
}
|
@@ -505,8 +518,7 @@ class Component extends Element_1.default {
|
|
505
518
|
init() {
|
506
519
|
var _a;
|
507
520
|
this.disabled = this.shouldDisabled;
|
508
|
-
this.
|
509
|
-
this._visible = (this.hasCondition() ? !this.conditionallyHidden : !this.component.hidden);
|
521
|
+
this._visible = (this.hasCondition() ? !this.conditionallyHidden() : !this.component.hidden);
|
510
522
|
if ((_a = this.component.addons) === null || _a === void 0 ? void 0 : _a.length) {
|
511
523
|
this.component.addons.forEach((addon) => this.createAddon(addon));
|
512
524
|
}
|
@@ -671,20 +683,54 @@ class Component extends Element_1.default {
|
|
671
683
|
}
|
672
684
|
return this._visible && this._parentVisible;
|
673
685
|
}
|
674
|
-
get
|
675
|
-
|
686
|
+
get logicallyHidden() {
|
687
|
+
if (this._logicallyHidden && !this.component.hidden) {
|
688
|
+
this._logicallyHidden = false;
|
689
|
+
}
|
690
|
+
return this._logicallyHidden;
|
676
691
|
}
|
677
|
-
|
678
|
-
|
679
|
-
|
680
|
-
* @param {object} row - The row object to evaluate the condition against.
|
681
|
-
* @returns {boolean} - Whether the component is conditionally hidden.
|
682
|
-
*/
|
683
|
-
checkConditionallyHidden(data = null, row = null) {
|
684
|
-
if (!this.hasCondition()) {
|
692
|
+
shouldConditionallyClear(skipParent = false) {
|
693
|
+
// Skip if this component has clearOnHide set to false.
|
694
|
+
if (this.component.clearOnHide === false) {
|
685
695
|
return false;
|
686
696
|
}
|
687
|
-
|
697
|
+
// If the component is logically hidden, then it is conditionally hidden and should clear.
|
698
|
+
if (this.logicallyHidden) {
|
699
|
+
return true;
|
700
|
+
}
|
701
|
+
// If we have a condition and it is not conditionally visible, the it should conditionally clear.
|
702
|
+
if (this.hasCondition() && !this.conditionallyVisible()) {
|
703
|
+
return true;
|
704
|
+
}
|
705
|
+
if (skipParent) {
|
706
|
+
// Stop recurrsion for the parent checks.
|
707
|
+
return false;
|
708
|
+
}
|
709
|
+
// If this component has a set value, then it should ONLY clear if a parent is hidden
|
710
|
+
// and has the clearOnHide set to true.
|
711
|
+
if (this.hasSetValue) {
|
712
|
+
return this.parentShouldConditionallyClear();
|
713
|
+
}
|
714
|
+
// Clear the value if the parent is conditionally hidden.
|
715
|
+
return this.parentConditionallyHidden();
|
716
|
+
}
|
717
|
+
conditionallyHidden(skipParent = false) {
|
718
|
+
if (this.logicallyHidden) {
|
719
|
+
return true;
|
720
|
+
}
|
721
|
+
if (!this.hasCondition() && !skipParent) {
|
722
|
+
return this.parentConditionallyHidden();
|
723
|
+
}
|
724
|
+
// Return if we are not conditionally visible (conditionallyHidden)
|
725
|
+
if (!this.conditionallyVisible()) {
|
726
|
+
return true;
|
727
|
+
}
|
728
|
+
if (skipParent) {
|
729
|
+
// Stop recurrsion for the parent checks.
|
730
|
+
return false;
|
731
|
+
}
|
732
|
+
// Check the parent.
|
733
|
+
return this.parentConditionallyHidden();
|
688
734
|
}
|
689
735
|
get currentForm() {
|
690
736
|
return this._currentForm;
|
@@ -1852,7 +1898,7 @@ class Component extends Element_1.default {
|
|
1852
1898
|
rebuild() {
|
1853
1899
|
this.destroy();
|
1854
1900
|
this.init();
|
1855
|
-
this.visible = this.hasCondition() ? !this.conditionallyHidden : !this.component.hidden;
|
1901
|
+
this.visible = this.hasCondition() ? !this.conditionallyHidden() : !this.component.hidden;
|
1856
1902
|
return this.redraw();
|
1857
1903
|
}
|
1858
1904
|
/**
|
@@ -1950,23 +1996,12 @@ class Component extends Element_1.default {
|
|
1950
1996
|
if (!this.builderMode & !this.previewMode && this.fieldLogic(data, row)) {
|
1951
1997
|
this.redraw();
|
1952
1998
|
}
|
1953
|
-
// Check advanced conditions (and cache the result)
|
1954
|
-
const isConditionallyHidden = this.checkConditionallyHidden(data, row) || this._parentConditionallyHidden;
|
1955
|
-
let shouldClear = false;
|
1956
|
-
if (isConditionallyHidden !== this._conditionallyHidden) {
|
1957
|
-
this._conditionallyHidden = isConditionallyHidden;
|
1958
|
-
shouldClear = true;
|
1959
|
-
}
|
1960
1999
|
// Check visibility
|
1961
|
-
const visible = (this.hasCondition() ? !this.conditionallyHidden : !this.component.hidden);
|
2000
|
+
const visible = (this.hasCondition() ? !this.conditionallyHidden() : !this.component.hidden);
|
1962
2001
|
if (this.visible !== visible) {
|
1963
2002
|
this.visible = visible;
|
1964
2003
|
}
|
1965
|
-
|
1966
|
-
// calling clearOnHide
|
1967
|
-
if (shouldClear) {
|
1968
|
-
this.clearOnHide();
|
1969
|
-
}
|
2004
|
+
this.clearComponentOnHide();
|
1970
2005
|
return visible;
|
1971
2006
|
}
|
1972
2007
|
/**
|
@@ -2075,9 +2110,9 @@ class Component extends Element_1.default {
|
|
2075
2110
|
if (!lodash_1.default.isEqual(lodash_1.default.get(this.component, property), lodash_1.default.get(newComponent, property))) {
|
2076
2111
|
// Advanced Logic can modify the component's hidden property; because we track conditionally hidden state
|
2077
2112
|
// separately from the component's hidden property, and technically this Advanced Logic conditionally hides
|
2078
|
-
// a component, we need to set
|
2113
|
+
// a component, we need to set a temporary variable to the new value
|
2079
2114
|
if (property === 'hidden') {
|
2080
|
-
this.
|
2115
|
+
this._logicallyHidden = newComponent.hidden;
|
2081
2116
|
}
|
2082
2117
|
changed = true;
|
2083
2118
|
}
|
@@ -2092,7 +2127,7 @@ class Component extends Element_1.default {
|
|
2092
2127
|
component: newComponent,
|
2093
2128
|
result,
|
2094
2129
|
});
|
2095
|
-
if (!lodash_1.default.isEqual(oldValue, newValue) && !
|
2130
|
+
if (!lodash_1.default.isEqual(oldValue, newValue) && !this.shouldConditionallyClear()) {
|
2096
2131
|
this.setValue(newValue);
|
2097
2132
|
if (this.viewOnly) {
|
2098
2133
|
this.dataValue = newValue;
|
@@ -2125,7 +2160,7 @@ class Component extends Element_1.default {
|
|
2125
2160
|
component: newComponent,
|
2126
2161
|
result,
|
2127
2162
|
}, 'value');
|
2128
|
-
if (!lodash_1.default.isEqual(oldValue, newValue) && !
|
2163
|
+
if (!lodash_1.default.isEqual(oldValue, newValue) && !this.shouldConditionallyClear()) {
|
2129
2164
|
this.setValue(newValue);
|
2130
2165
|
if (this.viewOnly) {
|
2131
2166
|
this.dataValue = newValue;
|
@@ -2226,17 +2261,12 @@ class Component extends Element_1.default {
|
|
2226
2261
|
element.setAttribute('aria-invalid', invalid ? 'true' : 'false');
|
2227
2262
|
}
|
2228
2263
|
/**
|
2229
|
-
*
|
2264
|
+
* Clear any conditionally hidden components for this component only.
|
2230
2265
|
*/
|
2231
|
-
|
2266
|
+
clearComponentOnHide() {
|
2232
2267
|
// clearOnHide defaults to true for old forms (without the value set) so only trigger if the value is false.
|
2233
|
-
if (
|
2234
|
-
|
2235
|
-
(!this.rootPristine || this.options.server || (0, utils_1.isInsideScopingComponent)(this)) &&
|
2236
|
-
this.component.clearOnHide !== false &&
|
2237
|
-
!this.options.readOnly &&
|
2238
|
-
!this.options.showHiddenFields) {
|
2239
|
-
if (this.conditionallyHidden) {
|
2268
|
+
if (this.component.clearOnHide !== false && !this.options.readOnly && !this.options.showHiddenFields) {
|
2269
|
+
if (this.shouldConditionallyClear()) {
|
2240
2270
|
this.deleteValue();
|
2241
2271
|
}
|
2242
2272
|
else if (!this.hasValue() && this.shouldAddDefaultValue) {
|
@@ -2247,6 +2277,12 @@ class Component extends Element_1.default {
|
|
2247
2277
|
}
|
2248
2278
|
}
|
2249
2279
|
}
|
2280
|
+
/**
|
2281
|
+
* Clears the components data if it is conditionally hidden AND clearOnHide is set to true for this component.
|
2282
|
+
*/
|
2283
|
+
clearOnHide() {
|
2284
|
+
this.clearComponentOnHide();
|
2285
|
+
}
|
2250
2286
|
/**
|
2251
2287
|
* Triggers a debounced onChange event for the root component (usually Webform).
|
2252
2288
|
* @param {...any} args - The arguments to pass to the onChange event.
|
@@ -2494,27 +2530,17 @@ class Component extends Element_1.default {
|
|
2494
2530
|
* @returns {*} - The value for this component.
|
2495
2531
|
*/
|
2496
2532
|
get dataValue() {
|
2497
|
-
if (!this.key
|
2498
|
-
|
2499
|
-
return this.emptyValue;
|
2500
|
-
}
|
2501
|
-
if (!this.hasValue() && this.shouldAddDefaultValue) {
|
2502
|
-
const empty = this.component.multiple ? [] : this.emptyValue;
|
2503
|
-
if (!this.rootPristine) {
|
2504
|
-
this.dataValue = empty;
|
2505
|
-
}
|
2506
|
-
return empty;
|
2533
|
+
if (!this.key) {
|
2534
|
+
return this.component.multiple ? [] : this.emptyValue;
|
2507
2535
|
}
|
2508
|
-
return lodash_1.default.get(this._data, this.key);
|
2536
|
+
return lodash_1.default.get(this._data, this.key, this.component.multiple ? [] : this.emptyValue);
|
2509
2537
|
}
|
2510
2538
|
/**
|
2511
2539
|
* Sets the static value of this component.
|
2512
2540
|
* @param {*} value - The value to set for this component.
|
2513
2541
|
*/
|
2514
2542
|
set dataValue(value) {
|
2515
|
-
if (!this.allowData ||
|
2516
|
-
!this.key ||
|
2517
|
-
(this.conditionallyHidden && this.component.clearOnHide && !this.rootPristine)) {
|
2543
|
+
if (!this.allowData || !this.key) {
|
2518
2544
|
return;
|
2519
2545
|
}
|
2520
2546
|
if ((value !== null) && (value !== undefined)) {
|
@@ -2557,13 +2583,30 @@ class Component extends Element_1.default {
|
|
2557
2583
|
}
|
2558
2584
|
getCustomDefaultValue(defaultValue) {
|
2559
2585
|
if (this.component.customDefaultValue && !this.options.preview) {
|
2560
|
-
defaultValue = this.evaluate(this.component.customDefaultValue, { value:
|
2586
|
+
defaultValue = this.evaluate(this.component.customDefaultValue, { value: this.dataValue }, 'value');
|
2561
2587
|
}
|
2562
2588
|
return defaultValue;
|
2563
2589
|
}
|
2590
|
+
/**
|
2591
|
+
* Returns if a component has a default value set.
|
2592
|
+
* @returns {boolean} - TRUE if a default value is set.
|
2593
|
+
*/
|
2594
|
+
get hasDefaultValue() {
|
2595
|
+
return this.component.customDefaultValue || (this.component.hasOwnProperty('defaultValue') &&
|
2596
|
+
(this.component.defaultValue !== null) &&
|
2597
|
+
(this.component.defaultValue !== undefined));
|
2598
|
+
}
|
2599
|
+
/**
|
2600
|
+
* Determine if we should add a default value for this component.
|
2601
|
+
* @returns {boolean} - TRUE if a default value should be set
|
2602
|
+
*/
|
2564
2603
|
get shouldAddDefaultValue() {
|
2565
|
-
return
|
2604
|
+
return this.pristine && this.allowData && (this.hasDefaultValue || !this.options.noDefaults);
|
2566
2605
|
}
|
2606
|
+
/**
|
2607
|
+
* Get the default value of this component.
|
2608
|
+
* @returns {*} - The default value for this component.
|
2609
|
+
*/
|
2567
2610
|
get defaultValue() {
|
2568
2611
|
let defaultValue = this.emptyValue;
|
2569
2612
|
if (this.component.defaultValue) {
|
@@ -2834,10 +2877,8 @@ class Component extends Element_1.default {
|
|
2834
2877
|
}
|
2835
2878
|
// If no calculated value or
|
2836
2879
|
// hidden and set to clearOnHide (Don't calculate a value for a hidden field set to clear when hidden)
|
2837
|
-
const { clearOnHide } = this.component;
|
2838
|
-
const shouldBeCleared = this.conditionallyHidden && clearOnHide;
|
2839
2880
|
const allowOverride = lodash_1.default.get(this.component, 'allowCalculateOverride', false);
|
2840
|
-
if (
|
2881
|
+
if (this.shouldConditionallyClear()) {
|
2841
2882
|
// remove calculated value so that the value is recalculated once component becomes visible
|
2842
2883
|
if (this.hasOwnProperty('calculatedValue') && allowOverride) {
|
2843
2884
|
lodash_1.default.unset(this, 'calculatedValue');
|
@@ -2958,10 +2999,12 @@ class Component extends Element_1.default {
|
|
2958
2999
|
* @param {boolean} dirty - If the component is dirty.
|
2959
3000
|
* @param {boolean} ignoreCondition - If conditions for the component should be ignored when checking validity.
|
2960
3001
|
* @param {*} row - Contextual row data for this component.
|
3002
|
+
* @param {*} options - Additional options for validation.
|
2961
3003
|
* @returns {string} - The message to show when the component is invalid.
|
2962
3004
|
*/
|
2963
|
-
invalidMessage(data, dirty, ignoreCondition, row) {
|
3005
|
+
invalidMessage(data, dirty, ignoreCondition, row, options = {}) {
|
2964
3006
|
var _a;
|
3007
|
+
const { local } = options;
|
2965
3008
|
if (!row) {
|
2966
3009
|
row = (0, utils_1.getContextualRowData)(this.component, data, this.paths);
|
2967
3010
|
}
|
@@ -2981,6 +3024,7 @@ class Component extends Element_1.default {
|
|
2981
3024
|
component: this.component,
|
2982
3025
|
data,
|
2983
3026
|
row,
|
3027
|
+
local,
|
2984
3028
|
path: this.path || this.component.key,
|
2985
3029
|
parent: (_a = this.parent) === null || _a === void 0 ? void 0 : _a.component,
|
2986
3030
|
paths: this.paths,
|
@@ -3157,6 +3201,14 @@ class Component extends Element_1.default {
|
|
3157
3201
|
data = data || this.rootValue;
|
3158
3202
|
flags = flags || {};
|
3159
3203
|
row = row || this.data;
|
3204
|
+
// Some components (for legacy reasons) have calls to "checkData" in inappropriate places such
|
3205
|
+
// as setValue. Historically, this was bypassed by a series of cached states around the data model
|
3206
|
+
// which caused its own problems. We need to ensure that premium and custom components do not fall into
|
3207
|
+
// an infinite loop by only checking this component once.
|
3208
|
+
if (this.checkingData) {
|
3209
|
+
return;
|
3210
|
+
}
|
3211
|
+
this.checkingData = true;
|
3160
3212
|
// Needs for Nextgen Rules Engine
|
3161
3213
|
this.resetCaches();
|
3162
3214
|
// Do not trigger refresh if change was triggered on blur event since components with Refresh on Blur have their own listeners
|
@@ -3170,6 +3222,8 @@ class Component extends Element_1.default {
|
|
3170
3222
|
if (this.id !== flags.triggeredComponentId) {
|
3171
3223
|
this.calculateComponentValue(data, flags, row);
|
3172
3224
|
}
|
3225
|
+
// We are done checking data.
|
3226
|
+
this.checkingData = false;
|
3173
3227
|
}
|
3174
3228
|
checkModal(errors = [], dirty = false) {
|
3175
3229
|
const messages = errors.filter(error => !error.fromServer);
|
@@ -3485,7 +3539,7 @@ class Component extends Element_1.default {
|
|
3485
3539
|
// If component definition changed, replace it.
|
3486
3540
|
if (!lodash_1.default.isEqual(this.component, newComponent)) {
|
3487
3541
|
this.component = newComponent;
|
3488
|
-
const visible = this.hasCondition() ? !this.conditionallyHidden : !this.component.hidden;
|
3542
|
+
const visible = this.hasCondition() ? !this.conditionallyHidden() : !this.component.hidden;
|
3489
3543
|
const disabled = this.shouldDisabled;
|
3490
3544
|
// Change states which won't be recalculated during redrawing
|
3491
3545
|
if (this.visible !== visible) {
|