@syncfusion/ej2-form-renderer 34.2.2 → 34.2.4

package/dist/global/index.d.ts

@@ -1,6 +1,6 @@
 /*!
 *  filename: index.d.ts
-*  version : 34.2.2
+*  version : 34.2.4
 *  Copyright Syncfusion Inc. 2001 - 2025. All rights reserved.
 *  Use of this code is subject to the terms of our license.
 *  A copy of the current license can be obtained at any time by e-mailing

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@syncfusion/ej2-form-renderer",
-  "version": "34.2.2",
+  "version": "34.2.4",
   "description": "A package of Essential JS 2 Form Renderer which can render feature-rich Syncfusion components as a form.",
   "author": "Syncfusion Inc.",
   "license": "SEE LICENSE IN license",
@@ -9,14 +9,14 @@
   "es2015": "./dist/es6/ej2-form-renderer.es5.js",
   "dependencies": {
     "@syncfusion/ej2-buttons": "~34.2.2",
-    "@syncfusion/ej2-calendars": "~34.2.2",
-    "@syncfusion/ej2-dropdowns": "~34.2.2",
-    "@syncfusion/ej2-grids": "~34.2.2",
+    "@syncfusion/ej2-calendars": "~34.2.4",
+    "@syncfusion/ej2-dropdowns": "~34.2.4",
+    "@syncfusion/ej2-grids": "~34.2.4",
     "@syncfusion/ej2-image-editor": "~34.2.2",
     "@syncfusion/ej2-inputs": "~34.2.2",
-    "@syncfusion/ej2-navigations": "~34.2.2",
+    "@syncfusion/ej2-navigations": "~34.2.4",
     "@syncfusion/ej2-notifications": "~34.2.2",
-    "@syncfusion/ej2-richtexteditor": "~34.2.2",
+    "@syncfusion/ej2-richtexteditor": "~34.2.4",
     "@syncfusion/ej2-splitbuttons": "~34.2.2"
   },
   "devDependencies": {},

package/src/common/checkbox-group.js

@@ -112,7 +112,7 @@ var CheckboxGroup = /** @class */ (function () {
             var optionLabel = typeof option === 'string'
                 ? option
                 : (option.label != null ? option.label : (option.value != null ? option.value : String(optionValue)));
-            var wrapper = document.createElement('div');
+            var wrapper = document.createElement('input');
             itemsContainer.appendChild(wrapper);
             var checkBox = new CheckBox({
                 label: optionLabel,
@@ -210,7 +210,7 @@ var CheckboxGroup = /** @class */ (function () {
             var optionLabel = typeof option === 'string'
                 ? option
                 : (option.label || option.value || String(optionValue));
-            var wrapper = document.createElement('div');
+            var wrapper = document.createElement('input');
             _this.itemsContainer.appendChild(wrapper);
             var checkBox = new CheckBox({
                 label: optionLabel,

package/src/form-renderer/form-renderer.js

@@ -275,6 +275,11 @@ var FormRenderer = /** @class */ (function (_super) {
                 var rteInstance = getComponent(toolbarElement, 'toolbar');
                 rteInstance.refresh();
             }
+            if (component.type === 'tabs') {
+                var tabElement = rendered.querySelector('.e-control.e-tab');
+                var tabInstance = getComponent(tabElement, 'tab');
+                tabInstance.refreshOverflow();
+            }
         });
         if (this.created && !this.createdFired) {
             setTimeout(function () {
@@ -1324,6 +1329,9 @@ var FormRenderer = /** @class */ (function (_super) {
                             form.querySelectorAll('input[type="checkbox"]').forEach(function (cb) {
                                 (cb.ej2_instances[0]).checked = false;
                             });
+                            form.querySelectorAll('.e-control.e-multiselect.e-lib').forEach(function (cb) {
+                                (cb.ej2_instances[0]).value = [];
+                            });
                         }
                         _this.formState.values = {};
                         form.reset();
@@ -1525,8 +1533,7 @@ var FormRenderer = /** @class */ (function (_super) {
         // Per-consumer dependency set (rebuilt each pass).
         var consumerDeps = new Map();
         var allComps = this.collectAllComponents(this.processedSchemaCache.components);
-        for (var _i = 0, allComps_1 = allComps; _i < allComps_1.length; _i++) {
-            var comp = allComps_1[_i];
+        var _loop_3 = function (comp) {
             var myDeps = new Set();
             consumerDeps.set(comp.id, myDeps);
             var conditions = comp.conditions;
@@ -1540,34 +1547,34 @@ var FormRenderer = /** @class */ (function (_super) {
                     'choiceBasedField',
                     'conditionalData'
                 ];
-                for (var _a = 0, conditionKeys_1 = conditionKeys; _a < conditionKeys_1.length; _a++) {
-                    var key = conditionKeys_1[_a];
+                for (var _i = 0, conditionKeys_1 = conditionKeys; _i < conditionKeys_1.length; _i++) {
+                    var key = conditionKeys_1[_i];
                     if (conditions[key]) {
-                        this.collectConditionFieldIds(conditions[key], triggers);
-                        this.collectConditionFieldIds(conditions[key], myDeps);
+                        this_1.collectConditionFieldIds(conditions[key], triggers);
+                        this_1.collectConditionFieldIds(conditions[key], myDeps);
                     }
                 }
                 if (Array.isArray(conditions.conditionalData)) {
-                    for (var _b = 0, _c = conditions.conditionalData; _b < _c.length; _b++) {
-                        var item = _c[_b];
+                    for (var _a = 0, _b = conditions.conditionalData; _a < _b.length; _a++) {
+                        var item = _b[_a];
                         if (item && item.condition) {
-                            this.collectConditionFieldIds(item.condition, triggers);
-                            this.collectConditionFieldIds(item.condition, myDeps);
+                            this_1.collectConditionFieldIds(item.condition, triggers);
+                            this_1.collectConditionFieldIds(item.condition, myDeps);
                         }
                         // DataGrid conditional columns
                         if (item && Array.isArray(item.conditions)) {
-                            for (var _d = 0, _e = item.conditions; _d < _e.length; _d++) {
-                                var subCond = _e[_d];
-                                this.collectConditionFieldIds(subCond, triggers);
-                                this.collectConditionFieldIds(subCond, myDeps);
+                            for (var _c = 0, _d = item.conditions; _c < _d.length; _c++) {
+                                var subCond = _d[_c];
+                                this_1.collectConditionFieldIds(subCond, triggers);
+                                this_1.collectConditionFieldIds(subCond, myDeps);
                             }
                         }
                     }
                 }
                 if (conditions.setValueWhen &&
                     conditions.setValueWhen.condition) {
-                    this.collectConditionFieldIds(conditions.setValueWhen.condition, triggers);
-                    this.collectConditionFieldIds(conditions.setValueWhen.condition, myDeps);
+                    this_1.collectConditionFieldIds(conditions.setValueWhen.condition, triggers);
+                    this_1.collectConditionFieldIds(conditions.setValueWhen.condition, myDeps);
                 }
                 if (conditions.choiceBasedField &&
                     typeof conditions.choiceBasedField.primaryFieldId === 'string') {
@@ -1575,6 +1582,33 @@ var FormRenderer = /** @class */ (function (_super) {
                     myDeps.add(conditions.choiceBasedField.primaryFieldId);
                 }
             }
+            var collectMinMaxReferenceIds = function (range) {
+                if (!range || range.enabled !== true) {
+                    return;
+                }
+                var collectFromBound = function (bound) {
+                    if (bound && typeof bound === 'object' && typeof bound.field === 'string') {
+                        triggers.add(bound.field);
+                        myDeps.add(bound.field);
+                    }
+                };
+                collectFromBound(range.minValue);
+                collectFromBound(range.maxValue);
+            };
+            var minMaxRule = comp.minMaxRange;
+            if (Array.isArray(minMaxRule)) {
+                for (var _e = 0, minMaxRule_1 = minMaxRule; _e < minMaxRule_1.length; _e++) {
+                    var range = minMaxRule_1[_e];
+                    collectMinMaxReferenceIds(range);
+                }
+            }
+            var minMaxTimeRule = comp.minMaxTimeRange;
+            if (Array.isArray(minMaxTimeRule)) {
+                for (var _f = 0, minMaxTimeRule_1 = minMaxTimeRule; _f < minMaxTimeRule_1.length; _f++) {
+                    var range = minMaxTimeRule_1[_f];
+                    collectMinMaxReferenceIds(range);
+                }
+            }
             // ==========================================================
             // DataGrid remote datasource dependencies
             // Example:
@@ -1587,19 +1621,24 @@ var FormRenderer = /** @class */ (function (_super) {
                 ds &&
                 ds.type === 'url') {
                 if (ds.search && typeof ds.search.key === 'string') {
-                    this.collectDataSourceReferenceIds(ds.search.key, allComps, triggers);
-                    this.collectDataSourceReferenceIds(ds.search.key, allComps, myDeps);
+                    this_1.collectDataSourceReferenceIds(ds.search.key, allComps, triggers);
+                    this_1.collectDataSourceReferenceIds(ds.search.key, allComps, myDeps);
                 }
                 if (Array.isArray(ds.filters)) {
-                    for (var _f = 0, _g = ds.filters; _f < _g.length; _f++) {
-                        var filter = _g[_f];
+                    for (var _g = 0, _h = ds.filters; _g < _h.length; _g++) {
+                        var filter = _h[_g];
                         if (typeof filter.value === 'string') {
-                            this.collectDataSourceReferenceIds(filter.value, allComps, triggers);
-                            this.collectDataSourceReferenceIds(filter.value, allComps, myDeps);
+                            this_1.collectDataSourceReferenceIds(filter.value, allComps, triggers);
+                            this_1.collectDataSourceReferenceIds(filter.value, allComps, myDeps);
                         }
                     }
                 }
             }
+        };
+        var this_1 = this;
+        for (var _i = 0, allComps_1 = allComps; _i < allComps_1.length; _i++) {
+            var comp = allComps_1[_i];
+            _loop_3(comp);
         }
         this.conditionalTriggerFieldIds = triggers;
         this.consumerDependencyMap = consumerDeps;
@@ -1649,11 +1688,11 @@ var FormRenderer = /** @class */ (function (_super) {
         var savedWindowScrollY = window.scrollY;
         this.preservedFields.clear();
         var allComps = this.collectAllComponents(this.processedSchemaCache.components);
-        var _loop_3 = function (comp) {
+        var _loop_4 = function (comp) {
             if (!FormRenderer_1.PRESERVABLE_TYPES.has(comp.type)) {
                 return "continue";
             }
-            var myDeps = this_1.consumerDependencyMap.get(comp.id);
+            var myDeps = this_2.consumerDependencyMap.get(comp.id);
             var dependsOnChanged = false;
             if (myDeps) {
                 changedIds.forEach(function (changedId) {
@@ -1665,16 +1704,16 @@ var FormRenderer = /** @class */ (function (_super) {
             if (dependsOnChanged) {
                 return "continue";
             }
-            var liveNode = this_1.element.querySelector("[data-field-id=\"" + comp.id + "\"]");
+            var liveNode = this_2.element.querySelector("[data-field-id=\"" + comp.id + "\"]");
             if (liveNode && liveNode.parentElement) {
                 liveNode.parentElement.removeChild(liveNode);
-                this_1.preservedFields.set(comp.id, liveNode);
+                this_2.preservedFields.set(comp.id, liveNode);
             }
         };
-        var this_1 = this;
+        var this_2 = this;
         for (var _i = 0, allComps_2 = allComps; _i < allComps_2.length; _i++) {
             var comp = allComps_2[_i];
-            _loop_3(comp);
+            _loop_4(comp);
         }
         this.refreshing = true;
         this.destroyRenderedExcludingPreserved();
@@ -1786,37 +1825,37 @@ var FormRenderer = /** @class */ (function (_super) {
     FormRenderer.prototype.destroyRenderedExcludingPreserved = function () {
         var survived = [];
         var preservedNodes = Array.from(this.preservedFields.values());
-        var _loop_4 = function (inst) {
+        var _loop_5 = function (inst) {
             var hostEl = inst && (inst.element || inst.target || (inst.hostElement && inst.hostElement()));
             var isPreserved = !!hostEl && preservedNodes.some(function (n) { return n === hostEl || n.contains(hostEl); });
             if (isPreserved) {
                 survived.push(inst);
             }
             else {
-                this_2.destroyRenderedInstance(inst);
+                this_3.destroyRenderedInstance(inst);
             }
         };
-        var this_2 = this;
+        var this_3 = this;
         for (var _i = 0, _a = this.renderedInstances; _i < _a.length; _i++) {
             var inst = _a[_i];
-            _loop_4(inst);
+            _loop_5(inst);
         }
         this.renderedInstances = survived;
         // Prune inputRefs whose host element lives in a destroyed subtree
         // (preserved ones stay).
         var inputRefKeys = Object.keys(this.inputRefs);
-        var _loop_5 = function (key) {
-            var inst = this_3.inputRefs[key];
+        var _loop_6 = function (key) {
+            var inst = this_4.inputRefs[key];
             var hostEl = inst && (inst.element || inst.target || (inst.hostElement && inst.hostElement()));
             var isPreserved = !!hostEl && preservedNodes.some(function (n) { return n === hostEl || n.contains(hostEl); });
             if (!isPreserved) {
-                delete this_3.inputRefs[key];
+                delete this_4.inputRefs[key];
             }
         };
-        var this_3 = this;
+        var this_4 = this;
         for (var _b = 0, inputRefKeys_1 = inputRefKeys; _b < inputRefKeys_1.length; _b++) {
             var key = inputRefKeys_1[_b];
-            _loop_5(key);
+            _loop_6(key);
         }
         this.conditionalValueApplied = {};
         this.expressionDependencyGraph = {};
@@ -1897,7 +1936,7 @@ var FormRenderer = /** @class */ (function (_super) {
             Object.assign(previousValues, contextValues);
             var changedFields = new Set();
             var ctxKeys = Object.keys(contextValues);
-            var _loop_6 = function (fieldName) {
+            var _loop_7 = function (fieldName) {
                 var fieldId = Object.keys(idToNameMap_1).find(function (id) { return idToNameMap_1[id] === fieldName; });
                 if (fieldId && contextValues[fieldName] !== previousContextValues[fieldName] && !computedFieldNames.has(fieldId)) {
                     changedFields.add(fieldName);
@@ -1905,13 +1944,13 @@ var FormRenderer = /** @class */ (function (_super) {
             };
             for (var _a = 0, ctxKeys_1 = ctxKeys; _a < ctxKeys_1.length; _a++) {
                 var fieldName = ctxKeys_1[_a];
-                _loop_6(fieldName);
+                _loop_7(fieldName);
             }
             if (changedFields.size === 0) {
                 return;
             }
             var evaluationOrder = engine.getTopologicalOrder(dependencyGraph);
-            var _loop_7 = function (fieldName) {
+            var _loop_8 = function (fieldName) {
                 var component = allComponents.find(function (c) { return c.name === fieldName; });
                 if (component && component.expressionValue) {
                     computedFieldNames.add(component.id);
@@ -1958,13 +1997,13 @@ var FormRenderer = /** @class */ (function (_super) {
                                         break;
                                 }
                             }
-                            if (result !== null && result !== undefined && result !== formValues[component.id] && this_4.formState) {
-                                this_4.formState.values[component.id] = result;
+                            if (result !== null && result !== undefined && result !== formValues[component.id] && this_5.formState) {
+                                this_5.formState.values[component.id] = result;
                                 // Sync the underlying input element so the
                                 // FormValidator reads the new value on its
                                 // next validate() pass.
-                                if (this_4.validator) {
-                                    var inputEl = this_4.getInputElementByName(component.id);
+                                if (this_5.validator) {
+                                    var inputEl = this_5.getInputElementByName(component.id);
                                     if (inputEl) {
                                         try {
                                             if (inputEl.ej2_instances[0]) {
@@ -1982,18 +2021,18 @@ var FormRenderer = /** @class */ (function (_super) {
                         }
                     }
                     catch (error) {
-                        if (this_4.failure) {
-                            this_4.trigger('failure', {
+                        if (this_5.failure) {
+                            this_5.trigger('failure', {
                                 error: error
                             });
                         }
                     }
                 }
             };
-            var this_4 = this;
+            var this_5 = this;
             for (var _b = 0, evaluationOrder_1 = evaluationOrder; _b < evaluationOrder_1.length; _b++) {
                 var fieldName = evaluationOrder_1[_b];
-                _loop_7(fieldName);
+                _loop_8(fieldName);
             }
             Object.assign(previousValues, contextValues);
         }