@formio/js 5.0.0 → 5.1.0-rc.2
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.embed.js +1 -1
- package/dist/formio.embed.min.js +1 -1
- package/dist/formio.embed.min.js.LICENSE.txt +1 -1
- package/dist/formio.form.js +127 -116
- package/dist/formio.form.min.js +1 -1
- package/dist/formio.form.min.js.LICENSE.txt +3 -3
- package/dist/formio.full.js +128 -117
- package/dist/formio.full.min.js +1 -1
- package/dist/formio.full.min.js.LICENSE.txt +3 -3
- package/dist/formio.js +3013 -283
- package/dist/formio.min.js +1 -1
- package/dist/formio.min.js.LICENSE.txt +14 -2
- package/dist/formio.utils.js +60 -49
- package/dist/formio.utils.min.js +1 -1
- package/dist/formio.utils.min.js.LICENSE.txt +3 -3
- package/lib/cjs/Webform.d.ts +8 -1
- package/lib/cjs/Webform.js +40 -32
- package/lib/cjs/WebformBuilder.js +4 -12
- package/lib/cjs/Wizard.js +4 -11
- 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 +52 -7
- package/lib/cjs/components/_classes/component/Component.js +120 -42
- package/lib/cjs/components/_classes/component/editForm/Component.edit.data.js +2 -2
- 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 +54 -60
- package/lib/cjs/components/_classes/nestedarray/NestedArrayComponent.d.ts +2 -1
- package/lib/cjs/components/_classes/nestedarray/NestedArrayComponent.js +7 -44
- 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 +2 -3
- package/lib/cjs/components/editgrid/EditGrid.js +8 -11
- package/lib/cjs/components/form/Form.d.ts +8 -3
- package/lib/cjs/components/form/Form.js +31 -29
- package/lib/cjs/components/html/HTML.js +15 -3
- package/lib/cjs/components/selectboxes/SelectBoxes.js +0 -1
- package/lib/cjs/components/signature/Signature.d.ts +0 -1
- package/lib/cjs/components/signature/Signature.js +1 -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 -3
- package/lib/cjs/utils/utils.js +19 -35
- package/lib/mjs/Webform.d.ts +8 -1
- package/lib/mjs/Webform.js +37 -31
- package/lib/mjs/WebformBuilder.js +4 -12
- package/lib/mjs/Wizard.js +2 -8
- 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 +52 -7
- package/lib/mjs/components/_classes/component/Component.js +130 -43
- package/lib/mjs/components/_classes/component/editForm/Component.edit.data.js +2 -2
- 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 +55 -61
- 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 +2 -3
- package/lib/mjs/components/editgrid/EditGrid.js +11 -11
- package/lib/mjs/components/form/Form.d.ts +8 -3
- package/lib/mjs/components/form/Form.js +32 -29
- package/lib/mjs/components/html/HTML.js +15 -3
- package/lib/mjs/components/selectboxes/SelectBoxes.js +0 -1
- package/lib/mjs/components/signature/Signature.d.ts +0 -1
- package/lib/mjs/components/signature/Signature.js +1 -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 -3
- package/lib/mjs/utils/utils.js +18 -33
- package/package.json +4 -4
@@ -234,6 +234,7 @@ class Component extends Element_1.default {
|
|
234
234
|
*/
|
235
235
|
/* eslint-disable max-statements */
|
236
236
|
constructor(component, options, data) {
|
237
|
+
var _a, _b, _c, _d;
|
237
238
|
super(Object.assign({
|
238
239
|
renderMode: 'form',
|
239
240
|
attachMode: 'full',
|
@@ -249,6 +250,10 @@ class Component extends Element_1.default {
|
|
249
250
|
* @private
|
250
251
|
*/
|
251
252
|
this._hasCondition = null;
|
253
|
+
/**
|
254
|
+
* The row index for this component.
|
255
|
+
*/
|
256
|
+
this._rowIndex = undefined;
|
252
257
|
/**
|
253
258
|
* References to dom elements
|
254
259
|
*/
|
@@ -259,11 +264,6 @@ class Component extends Element_1.default {
|
|
259
264
|
this.options.components[component.type]) {
|
260
265
|
lodash_1.default.merge(component, this.options.components[component.type]);
|
261
266
|
}
|
262
|
-
/**
|
263
|
-
* The data path to this specific component instance.
|
264
|
-
* @type {string}
|
265
|
-
*/
|
266
|
-
this.path = (component === null || component === void 0 ? void 0 : component.key) || '';
|
267
267
|
/**
|
268
268
|
* An array of all the children components errors.
|
269
269
|
*/
|
@@ -332,15 +332,27 @@ class Component extends Element_1.default {
|
|
332
332
|
* @type {Component}
|
333
333
|
*/
|
334
334
|
this.parent = this.options.parent;
|
335
|
+
/**
|
336
|
+
* The component paths for this component.
|
337
|
+
* @type {import('@formio/core').ComponentPaths} - The component paths.
|
338
|
+
*/
|
339
|
+
this.paths = FormioUtils.getComponentPaths(this.component, (_a = this.parent) === null || _a === void 0 ? void 0 : _a.component, Object.assign(Object.assign({}, (_b = this.parent) === null || _b === void 0 ? void 0 : _b.paths), { dataIndex: this.options.rowIndex === undefined ? (_d = (_c = this.parent) === null || _c === void 0 ? void 0 : _c.paths) === null || _d === void 0 ? void 0 : _d.dataIndex : this.options.rowIndex }));
|
335
340
|
this.options.name = this.options.name || 'data';
|
336
341
|
this._path = '';
|
337
342
|
// Needs for Nextgen Rules Engine
|
338
343
|
this.resetCaches();
|
344
|
+
/**
|
345
|
+
* Determines if this component is conditionally hidden. Should generally not be set outside of conditional logic pipeline.
|
346
|
+
* This is necessary because of clearOnHide behavior that only clears when conditionally hidden - we need to track
|
347
|
+
* conditionallyHidden separately from "regular" visibility.
|
348
|
+
*/
|
349
|
+
this._parentConditionallyHidden = this.options.hasOwnProperty('parentConditionallyHidden') ? this.options.parentConditionallyHidden : false;
|
350
|
+
this._conditionallyHidden = this.checkConditionallyHidden(null, data) || this._parentConditionallyHidden;
|
339
351
|
/**
|
340
352
|
* Determines if this component is visible, or not.
|
341
353
|
*/
|
342
354
|
this._parentVisible = this.options.hasOwnProperty('parentVisible') ? this.options.parentVisible : true;
|
343
|
-
this._visible = this._parentVisible && this.
|
355
|
+
this._visible = this._parentVisible && (this.hasCondition() ? !this._conditionallyHidden : !this.component.hidden);
|
344
356
|
this._parentDisabled = false;
|
345
357
|
/**
|
346
358
|
* The reference attribute name for this component
|
@@ -409,7 +421,7 @@ class Component extends Element_1.default {
|
|
409
421
|
if (this.allowData && this.key) {
|
410
422
|
this.options.name += `[${this.key}]`;
|
411
423
|
// If component is visible or not set to clear on hide, set the default value.
|
412
|
-
if (this.
|
424
|
+
if (!(this.conditionallyHidden && this.component.clearOnHide)) {
|
413
425
|
if (!this.hasValue()) {
|
414
426
|
if (this.shouldAddDefaultValue) {
|
415
427
|
this.dataValue = this.defaultValue;
|
@@ -438,12 +450,7 @@ class Component extends Element_1.default {
|
|
438
450
|
/* eslint-enable max-statements */
|
439
451
|
get componentsMap() {
|
440
452
|
var _a;
|
441
|
-
|
442
|
-
return this.localRoot.childComponentsMap;
|
443
|
-
}
|
444
|
-
const localMap = {};
|
445
|
-
localMap[this.path] = this;
|
446
|
-
return localMap;
|
453
|
+
return ((_a = this.root) === null || _a === void 0 ? void 0 : _a.childComponentsMap) || {};
|
447
454
|
}
|
448
455
|
get data() {
|
449
456
|
return this._data;
|
@@ -485,11 +492,29 @@ class Component extends Element_1.default {
|
|
485
492
|
init() {
|
486
493
|
var _a;
|
487
494
|
this.disabled = this.shouldDisabled;
|
488
|
-
this.
|
495
|
+
this._conditionallyHidden = this.checkConditionallyHidden();
|
496
|
+
this._visible = (this.hasCondition() ? !this.conditionallyHidden : !this.component.hidden);
|
489
497
|
if ((_a = this.component.addons) === null || _a === void 0 ? void 0 : _a.length) {
|
490
498
|
this.component.addons.forEach((addon) => this.createAddon(addon));
|
491
499
|
}
|
492
500
|
}
|
501
|
+
/**
|
502
|
+
* Get Row Index.
|
503
|
+
* @returns {number} - The row index.
|
504
|
+
*/
|
505
|
+
get rowIndex() {
|
506
|
+
return this._rowIndex;
|
507
|
+
}
|
508
|
+
/**
|
509
|
+
* Set Row Index to row and update each component.
|
510
|
+
* @param {number} value - The row index.
|
511
|
+
* @returns {void}
|
512
|
+
*/
|
513
|
+
set rowIndex(value) {
|
514
|
+
var _a, _b;
|
515
|
+
this.paths = FormioUtils.getComponentPaths(this.component, (_a = this.parent) === null || _a === void 0 ? void 0 : _a.component, Object.assign(Object.assign({}, (((_b = this.parent) === null || _b === void 0 ? void 0 : _b.paths) || {})), { dataIndex: value }));
|
516
|
+
this._rowIndex = value;
|
517
|
+
}
|
493
518
|
afterComponentAssign() {
|
494
519
|
//implement in extended classes
|
495
520
|
}
|
@@ -559,6 +584,12 @@ class Component extends Element_1.default {
|
|
559
584
|
get key() {
|
560
585
|
return lodash_1.default.get(this.component, 'key', '');
|
561
586
|
}
|
587
|
+
get path() {
|
588
|
+
return this.paths.dataPath;
|
589
|
+
}
|
590
|
+
set path(path) {
|
591
|
+
throw new Error('Should not be setting the path of a component.');
|
592
|
+
}
|
562
593
|
set parentVisible(value) {
|
563
594
|
this._parentVisible = value;
|
564
595
|
}
|
@@ -604,7 +635,6 @@ class Component extends Element_1.default {
|
|
604
635
|
return;
|
605
636
|
}
|
606
637
|
this._visible = value;
|
607
|
-
this.clearOnHide();
|
608
638
|
this.redraw();
|
609
639
|
}
|
610
640
|
}
|
@@ -625,6 +655,21 @@ class Component extends Element_1.default {
|
|
625
655
|
}
|
626
656
|
return this._visible && this._parentVisible;
|
627
657
|
}
|
658
|
+
get conditionallyHidden() {
|
659
|
+
return this._conditionallyHidden || this._parentConditionallyHidden;
|
660
|
+
}
|
661
|
+
/**
|
662
|
+
* Evaluates whether the component is conditionally hidden (as opposed to intentionally hidden, e.g. via the `hidden` component schema property).
|
663
|
+
* @param {object} data - The data object to evaluate the condition against.
|
664
|
+
* @param {object} row - The row object to evaluate the condition against.
|
665
|
+
* @returns {boolean} - Whether the component is conditionally hidden.
|
666
|
+
*/
|
667
|
+
checkConditionallyHidden(data = null, row = null) {
|
668
|
+
if (!this.hasCondition()) {
|
669
|
+
return false;
|
670
|
+
}
|
671
|
+
return !this.conditionallyVisible(data, row);
|
672
|
+
}
|
628
673
|
get currentForm() {
|
629
674
|
return this._currentForm;
|
630
675
|
}
|
@@ -1046,6 +1091,14 @@ class Component extends Element_1.default {
|
|
1046
1091
|
setOpenModalElement(template = null) {
|
1047
1092
|
this.componentModal.setOpenModalElement(template || this.getModalPreviewTemplate());
|
1048
1093
|
}
|
1094
|
+
/**
|
1095
|
+
* Renders a modal preview template and returns the markup as a string
|
1096
|
+
* @param {object|null|undefined} ctx - The rendering context
|
1097
|
+
* @return {string} - The modal preview markup
|
1098
|
+
*/
|
1099
|
+
renderModalPreview(ctx) {
|
1100
|
+
return this.renderTemplate('modalPreview', ctx || {});
|
1101
|
+
}
|
1049
1102
|
/**
|
1050
1103
|
* Returns the modal preview template.
|
1051
1104
|
* @returns {string} - The modal preview template.
|
@@ -1057,7 +1110,7 @@ class Component extends Element_1.default {
|
|
1057
1110
|
if (this.hasInput && ((_a = this.component.validate) === null || _a === void 0 ? void 0 : _a.required) && !this.isPDFReadOnlyMode) {
|
1058
1111
|
modalLabel = { className: 'field-required' };
|
1059
1112
|
}
|
1060
|
-
return this.
|
1113
|
+
return this.renderModalPreview({
|
1061
1114
|
previewText: this.getValueAsString(dataValue, { modalPreview: true }) || this.t('Click to set value'),
|
1062
1115
|
messages: '',
|
1063
1116
|
labelInfo: modalLabel,
|
@@ -1106,6 +1159,19 @@ class Component extends Element_1.default {
|
|
1106
1159
|
}, topLevel);
|
1107
1160
|
}
|
1108
1161
|
}
|
1162
|
+
/**
|
1163
|
+
* Creates the tooltip instance using tippy.js and returns it
|
1164
|
+
* @param {HTMLElement} tooltipEl - HTML element to attach the tooltip
|
1165
|
+
* @param {object|null|undefined} settings - tippy.js options
|
1166
|
+
* @return {import('tippy.js').Tippy} - tippy.js instance
|
1167
|
+
*/
|
1168
|
+
createTooltip(tooltipEl, settings = {}) {
|
1169
|
+
const tooltipAttribute = tooltipEl.getAttribute('data-tooltip');
|
1170
|
+
const tooltipDataTitle = tooltipEl.getAttribute('data-title');
|
1171
|
+
const tooltipText = this.interpolate(tooltipDataTitle || tooltipAttribute)
|
1172
|
+
.replace(/(?:\r\n|\r|\n)/g, '<br />');
|
1173
|
+
return (0, tippy_js_1.default)(tooltipEl, Object.assign(Object.assign({ allowHTML: true, trigger: 'mouseenter click focus', placement: 'right', zIndex: 10000, interactive: true }, settings), { content: this.t(this.sanitize(tooltipText), { _userInput: true }) }));
|
1174
|
+
}
|
1109
1175
|
/**
|
1110
1176
|
* Attaches all the tooltips provided the refs object.
|
1111
1177
|
* @param {object} toolTipsRefs - The refs for the tooltips within your template.
|
@@ -1114,18 +1180,7 @@ class Component extends Element_1.default {
|
|
1114
1180
|
attachTooltips(toolTipsRefs) {
|
1115
1181
|
toolTipsRefs === null || toolTipsRefs === void 0 ? void 0 : toolTipsRefs.forEach((tooltip, index) => {
|
1116
1182
|
if (tooltip) {
|
1117
|
-
|
1118
|
-
const tooltipDataTitle = tooltip.getAttribute('data-title');
|
1119
|
-
const tooltipText = this.interpolate(tooltipDataTitle || tooltipAttribute)
|
1120
|
-
.replace(/(?:\r\n|\r|\n)/g, '<br />');
|
1121
|
-
this.tooltips[index] = (0, tippy_js_1.default)(tooltip, {
|
1122
|
-
allowHTML: true,
|
1123
|
-
trigger: 'mouseenter click focus',
|
1124
|
-
placement: 'right',
|
1125
|
-
zIndex: 10000,
|
1126
|
-
interactive: true,
|
1127
|
-
content: this.t(this.sanitize(tooltipText), { _userInput: true }),
|
1128
|
-
});
|
1183
|
+
this.tooltips[index] = this.createTooltip(tooltip);
|
1129
1184
|
}
|
1130
1185
|
});
|
1131
1186
|
}
|
@@ -1255,6 +1310,7 @@ class Component extends Element_1.default {
|
|
1255
1310
|
* @returns {void}
|
1256
1311
|
*/
|
1257
1312
|
checkRefresh(refreshData, changed, flags) {
|
1313
|
+
var _a, _b;
|
1258
1314
|
const changePath = lodash_1.default.get(changed, 'instance.path', false);
|
1259
1315
|
// Don't let components change themselves.
|
1260
1316
|
if (changePath && this.path === changePath) {
|
@@ -1263,7 +1319,7 @@ class Component extends Element_1.default {
|
|
1263
1319
|
if (refreshData === 'data') {
|
1264
1320
|
this.refresh(this.data, changed, flags);
|
1265
1321
|
}
|
1266
|
-
else if ((changePath && (
|
1322
|
+
else if ((changePath && (((_b = (_a = changed.instance) === null || _a === void 0 ? void 0 : _a.paths) === null || _b === void 0 ? void 0 : _b.localPath) === refreshData)) && changed && changed.instance &&
|
1267
1323
|
// Make sure the changed component is not in a different "context". Solves issues where refreshOn being set
|
1268
1324
|
// in fields inside EditGrids could alter their state from other rows (which is bad).
|
1269
1325
|
this.inContext(changed.instance)) {
|
@@ -1782,7 +1838,7 @@ class Component extends Element_1.default {
|
|
1782
1838
|
rebuild() {
|
1783
1839
|
this.destroy();
|
1784
1840
|
this.init();
|
1785
|
-
this.visible = this.
|
1841
|
+
this.visible = this.hasCondition() ? !this.conditionallyHidden : !this.component.hidden;
|
1786
1842
|
return this.redraw();
|
1787
1843
|
}
|
1788
1844
|
/**
|
@@ -1849,8 +1905,8 @@ class Component extends Element_1.default {
|
|
1849
1905
|
conditionallyVisible(data, row) {
|
1850
1906
|
data = data || this.rootValue;
|
1851
1907
|
row = row || this.data;
|
1852
|
-
if (this.builderMode || this.previewMode
|
1853
|
-
return
|
1908
|
+
if (this.builderMode || this.previewMode) {
|
1909
|
+
return true;
|
1854
1910
|
}
|
1855
1911
|
data = data || (this.root ? this.root.data : {});
|
1856
1912
|
return this.checkCondition(row, data);
|
@@ -1880,8 +1936,14 @@ class Component extends Element_1.default {
|
|
1880
1936
|
if (!this.builderMode & !this.previewMode && this.fieldLogic(data, row)) {
|
1881
1937
|
this.redraw();
|
1882
1938
|
}
|
1883
|
-
// Check advanced conditions
|
1884
|
-
const
|
1939
|
+
// Check advanced conditions (and cache the result)
|
1940
|
+
const isConditionallyHidden = this.checkConditionallyHidden(data, row) || this._parentConditionallyHidden;
|
1941
|
+
if (isConditionallyHidden !== this._conditionallyHidden) {
|
1942
|
+
this._conditionallyHidden = isConditionallyHidden;
|
1943
|
+
this.clearOnHide();
|
1944
|
+
}
|
1945
|
+
// Check visibility
|
1946
|
+
const visible = (this.hasCondition() ? !this.conditionallyHidden : !this.component.hidden);
|
1885
1947
|
if (this.visible !== visible) {
|
1886
1948
|
this.visible = visible;
|
1887
1949
|
}
|
@@ -1991,6 +2053,12 @@ class Component extends Element_1.default {
|
|
1991
2053
|
FormioUtils.setActionProperty(newComponent, action, result, row, data, this);
|
1992
2054
|
const property = action.property.value;
|
1993
2055
|
if (!lodash_1.default.isEqual(lodash_1.default.get(this.component, property), lodash_1.default.get(newComponent, property))) {
|
2056
|
+
// Advanced Logic can modify the component's hidden property; because we track conditionally hidden state
|
2057
|
+
// separately from the component's hidden property, and technically this Advanced Logic conditionally hides
|
2058
|
+
// a component, we need to set _conditionallyHidden to the new value
|
2059
|
+
if (property === 'hidden') {
|
2060
|
+
this._conditionallyHidden = newComponent.hidden;
|
2061
|
+
}
|
1994
2062
|
changed = true;
|
1995
2063
|
}
|
1996
2064
|
break;
|
@@ -2004,7 +2072,7 @@ class Component extends Element_1.default {
|
|
2004
2072
|
component: newComponent,
|
2005
2073
|
result,
|
2006
2074
|
});
|
2007
|
-
if (!lodash_1.default.isEqual(oldValue, newValue) && !(this.component.clearOnHide &&
|
2075
|
+
if (!lodash_1.default.isEqual(oldValue, newValue) && !(this.component.clearOnHide && this.conditionallyHidden)) {
|
2008
2076
|
this.setValue(newValue);
|
2009
2077
|
if (this.viewOnly) {
|
2010
2078
|
this.dataValue = newValue;
|
@@ -2037,7 +2105,7 @@ class Component extends Element_1.default {
|
|
2037
2105
|
component: newComponent,
|
2038
2106
|
result,
|
2039
2107
|
}, 'value');
|
2040
|
-
if (!lodash_1.default.isEqual(oldValue, newValue) && !(this.component.clearOnHide &&
|
2108
|
+
if (!lodash_1.default.isEqual(oldValue, newValue) && !(this.component.clearOnHide && this.conditionallyHidden)) {
|
2041
2109
|
this.setValue(newValue);
|
2042
2110
|
if (this.viewOnly) {
|
2043
2111
|
this.dataValue = newValue;
|
@@ -2148,7 +2216,7 @@ class Component extends Element_1.default {
|
|
2148
2216
|
this.component.clearOnHide !== false &&
|
2149
2217
|
!this.options.readOnly &&
|
2150
2218
|
!this.options.showHiddenFields) {
|
2151
|
-
if (
|
2219
|
+
if (this.conditionallyHidden) {
|
2152
2220
|
this.deleteValue();
|
2153
2221
|
}
|
2154
2222
|
else if (!this.hasValue() && this.shouldAddDefaultValue) {
|
@@ -2398,7 +2466,7 @@ class Component extends Element_1.default {
|
|
2398
2466
|
*/
|
2399
2467
|
get dataValue() {
|
2400
2468
|
if (!this.key ||
|
2401
|
-
(
|
2469
|
+
(this.conditionallyHidden && this.component.clearOnHide && !this.rootPristine)) {
|
2402
2470
|
return this.emptyValue;
|
2403
2471
|
}
|
2404
2472
|
if (!this.hasValue() && this.shouldAddDefaultValue) {
|
@@ -2417,7 +2485,7 @@ class Component extends Element_1.default {
|
|
2417
2485
|
set dataValue(value) {
|
2418
2486
|
if (!this.allowData ||
|
2419
2487
|
!this.key ||
|
2420
|
-
(
|
2488
|
+
(this.conditionallyHidden && this.component.clearOnHide && !this.rootPristine)) {
|
2421
2489
|
return;
|
2422
2490
|
}
|
2423
2491
|
if ((value !== null) && (value !== undefined)) {
|
@@ -2738,7 +2806,7 @@ class Component extends Element_1.default {
|
|
2738
2806
|
// If no calculated value or
|
2739
2807
|
// hidden and set to clearOnHide (Don't calculate a value for a hidden field set to clear when hidden)
|
2740
2808
|
const { clearOnHide } = this.component;
|
2741
|
-
const shouldBeCleared =
|
2809
|
+
const shouldBeCleared = this.conditionallyHidden && clearOnHide;
|
2742
2810
|
const allowOverride = lodash_1.default.get(this.component, 'allowCalculateOverride', false);
|
2743
2811
|
if (shouldBeCleared) {
|
2744
2812
|
// remove calculated value so that the value is recalculated once component becomes visible
|
@@ -2864,6 +2932,10 @@ class Component extends Element_1.default {
|
|
2864
2932
|
* @returns {string} - The message to show when the component is invalid.
|
2865
2933
|
*/
|
2866
2934
|
invalidMessage(data, dirty, ignoreCondition, row) {
|
2935
|
+
var _a;
|
2936
|
+
if (!row) {
|
2937
|
+
row = (0, utils_1.getContextualRowData)(this.component, data, this.paths);
|
2938
|
+
}
|
2867
2939
|
if (!ignoreCondition && !this.checkCondition(row, data)) {
|
2868
2940
|
return '';
|
2869
2941
|
}
|
@@ -2881,6 +2953,8 @@ class Component extends Element_1.default {
|
|
2881
2953
|
data,
|
2882
2954
|
row,
|
2883
2955
|
path: this.path || this.component.key,
|
2956
|
+
parent: (_a = this.parent) === null || _a === void 0 ? void 0 : _a.component,
|
2957
|
+
paths: this.paths,
|
2884
2958
|
scope: validationScope,
|
2885
2959
|
instance: this,
|
2886
2960
|
processors: [
|
@@ -2934,7 +3008,7 @@ class Component extends Element_1.default {
|
|
2934
3008
|
if (flags.silentCheck) {
|
2935
3009
|
return [];
|
2936
3010
|
}
|
2937
|
-
let isDirty = this.dirty || flags.dirty;
|
3011
|
+
let isDirty = (flags.dirty === false) ? false : (this.dirty || flags.dirty);
|
2938
3012
|
if (this.options.alwaysDirty) {
|
2939
3013
|
isDirty = true;
|
2940
3014
|
}
|
@@ -2949,6 +3023,7 @@ class Component extends Element_1.default {
|
|
2949
3023
|
* @returns {Array<any>} - An array of errors if the component is invalid.
|
2950
3024
|
*/
|
2951
3025
|
validateComponent(data = null, row = null, flags = {}) {
|
3026
|
+
var _a;
|
2952
3027
|
data = data || this.rootValue;
|
2953
3028
|
row = row || this.data;
|
2954
3029
|
const { async = false } = flags;
|
@@ -2959,7 +3034,10 @@ class Component extends Element_1.default {
|
|
2959
3034
|
component: this.component,
|
2960
3035
|
data,
|
2961
3036
|
row,
|
3037
|
+
local: !!flags.local,
|
2962
3038
|
value: this.validationValue,
|
3039
|
+
parent: (_a = this.parent) === null || _a === void 0 ? void 0 : _a.component,
|
3040
|
+
paths: this.paths,
|
2963
3041
|
path: this.path || this.component.key,
|
2964
3042
|
instance: this,
|
2965
3043
|
form: this.root ? this.root._form : {},
|
@@ -3378,7 +3456,7 @@ class Component extends Element_1.default {
|
|
3378
3456
|
// If component definition changed, replace it.
|
3379
3457
|
if (!lodash_1.default.isEqual(this.component, newComponent)) {
|
3380
3458
|
this.component = newComponent;
|
3381
|
-
const visible = this.
|
3459
|
+
const visible = this.hasCondition() ? !this.conditionallyHidden : !this.component.hidden;
|
3382
3460
|
const disabled = this.shouldDisabled;
|
3383
3461
|
// Change states which won't be recalculated during redrawing
|
3384
3462
|
if (this.visible !== visible) {
|
@@ -133,10 +133,10 @@ exports.default = [
|
|
133
133
|
{
|
134
134
|
weight: 700,
|
135
135
|
type: 'checkbox',
|
136
|
-
label: '
|
136
|
+
label: 'Omit Value From Submission Data When Conditionally Hidden',
|
137
137
|
key: 'clearOnHide',
|
138
138
|
defaultValue: true,
|
139
|
-
tooltip: 'When a field is hidden,
|
139
|
+
tooltip: 'When a field is conditionally hidden, omit the value from the submission data.',
|
140
140
|
input: true
|
141
141
|
},
|
142
142
|
utils_1.default.javaScriptValue('Custom Default Value', 'customDefaultValue', 'customDefaultValue', 1000, '<p><h4>Example:</h4><pre>value = data.firstName + " " + data.lastName;</pre></p>', '<p><h4>Example:</h4><pre>{"cat": [{"var": "data.firstName"}, " ", {"var": "data.lastName"}]}</pre>'),
|
@@ -56,18 +56,6 @@ export default class NestedComponent extends Field {
|
|
56
56
|
* @returns {object} - The current form object.
|
57
57
|
*/
|
58
58
|
get currentForm(): object;
|
59
|
-
/**
|
60
|
-
* Set Row Index to row and update each component.
|
61
|
-
* @param {number} value - The row index.
|
62
|
-
* @returns {void}
|
63
|
-
*/
|
64
|
-
set rowIndex(value: number);
|
65
|
-
/**
|
66
|
-
* Get Row Index.
|
67
|
-
* @returns {number} - The row index.
|
68
|
-
*/
|
69
|
-
get rowIndex(): number;
|
70
|
-
_rowIndex: number | undefined;
|
71
59
|
/**
|
72
60
|
* Get Contextual data of the component.
|
73
61
|
* @returns {object} - The contextual data of the component.
|
@@ -115,14 +103,11 @@ export default class NestedComponent extends Field {
|
|
115
103
|
*/
|
116
104
|
eachComponent(fn: Function): void;
|
117
105
|
/**
|
118
|
-
* Returns a component provided a key. This performs a deep search within the
|
119
|
-
* component tree.
|
106
|
+
* Returns a component provided a key. This performs a deep search within the component tree.
|
120
107
|
* @param {string} path - The path to the component.
|
121
|
-
* @param {Function} [fn] - Called with the component once found.
|
122
|
-
* @param {string} [originalPath] - The original path to the component.
|
123
108
|
* @returns {any} - The component that is located.
|
124
109
|
*/
|
125
|
-
getComponent(path: string
|
110
|
+
getComponent(path: string): any;
|
126
111
|
/**
|
127
112
|
* Return a component provided the Id of the component.
|
128
113
|
* @param {string} id - The Id of the component.
|
@@ -211,12 +196,12 @@ export default class NestedComponent extends Field {
|
|
211
196
|
calculateValue(data: any, flags: any, row: any): any;
|
212
197
|
isLastPage(): boolean;
|
213
198
|
isValid(data: any, dirty: any): any;
|
214
|
-
validationProcessor({ scope, data, row, instance,
|
199
|
+
validationProcessor({ scope, data, row, instance, paths }: {
|
215
200
|
scope: any;
|
216
201
|
data: any;
|
217
202
|
row: any;
|
218
203
|
instance: any;
|
219
|
-
|
204
|
+
paths: any;
|
220
205
|
}, flags: any): void;
|
221
206
|
/**
|
222
207
|
* Perform a validation on all child components of this nested component.
|