@wavemaker/app-ng-runtime 12.0.0-next.45002 → 12.0.0-next.45006

app-ng-runtime/components/data/form/bundles/index.umd.js

@@ -1,8 +1,8 @@
 (function (global, factory) {
-    typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('@angular/core'), require('@angular/common'), require('@wm/components/base'), require('@wm/components/basic'), require('@wm/components/input'), require('@wm/components/dialogs/design-dialog'), require('@angular/forms'), require('@wm/core'), require('@wm/components/prefab'), require('@wm/components/data/list'), require('@wm/components/data/table'), require('rxjs/operators'), require('@wm/components/data/live-table')) :
-    typeof define === 'function' && define.amd ? define(['exports', '@angular/core', '@angular/common', '@wm/components/base', '@wm/components/basic', '@wm/components/input', '@wm/components/dialogs/design-dialog', '@angular/forms', '@wm/core', '@wm/components/prefab', '@wm/components/data/list', '@wm/components/data/table', 'rxjs/operators', '@wm/components/data/live-table'], factory) :
-    (global = typeof globalThis !== 'undefined' ? globalThis : global || self, factory((global.wm = global.wm || {}, global.wm.components = global.wm.components || {}, global.wm.components.data = global.wm.components.data || {}, global.wm.components.data.form = {}), global.ng.core, global.ng.common, global.wm.components.base, global.wm.components.basic, global.wm.components.input, global.wm.components.dialogs.designdialog, global.ng.forms, global.wm.core, global.wm.components.prefab, global.wm.components.data.list, global.wm.components.data.table, global.rxjs.operators, global.wm.components.data.livetable));
-})(this, (function (exports, i0, i7, i5, i6, i8, designDialog, i1, i1$1, i4, i3, table, operators, i1$2) { 'use strict';
+    typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('@angular/core'), require('@angular/common'), require('@wm/components/base'), require('@wm/components/basic'), require('@wm/components/input'), require('@wm/components/dialogs/design-dialog'), require('@angular/forms'), require('@wm/core'), require('@wm/components/prefab'), require('@wm/components/data/list'), require('lodash-es'), require('@wm/components/data/table'), require('rxjs/operators'), require('@wm/components/data/live-table')) :
+    typeof define === 'function' && define.amd ? define(['exports', '@angular/core', '@angular/common', '@wm/components/base', '@wm/components/basic', '@wm/components/input', '@wm/components/dialogs/design-dialog', '@angular/forms', '@wm/core', '@wm/components/prefab', '@wm/components/data/list', 'lodash-es', '@wm/components/data/table', 'rxjs/operators', '@wm/components/data/live-table'], factory) :
+    (global = typeof globalThis !== 'undefined' ? globalThis : global || self, factory((global.wm = global.wm || {}, global.wm.components = global.wm.components || {}, global.wm.components.data = global.wm.components.data || {}, global.wm.components.data.form = {}), global.ng.core, global.ng.common, global.wm.components.base, global.wm.components.basic, global.wm.components.input, global.wm.components.dialogs.designdialog, global.ng.forms, global.wm.core, global.wm.components.prefab, global.wm.components.data.list, global._, global.wm.components.data.table, global.rxjs.operators, global.wm.components.data.livetable));
+})(this, (function (exports, i0, i7, i5, i6, i8, designDialog, i1, i1$1, i4, i3, lodashEs, table, operators, i1$2) { 'use strict';
 
     function _interopNamespaceDefault(e) {
         var n = Object.create(null);
@@ -104,6 +104,11 @@
 
     const _c0$1 = ["dynamicForm"];
     const _c1$1 = ["wmForm", ""];
+    const _c2 = ["*"];
+    const _c3 = (a0, a1) => ({ "form-elements": a0, "form-body": a1 });
+    const _c4 = (a0, a1) => ({ "form-elements": a0, "form-content": a1 });
+    const _c5 = a0 => ({ "modal-footer": a0 });
+    const _c6 = a0 => ({ btn: a0 });
     function FormComponent_ng_template_0_Template(rf, ctx) { if (rf & 1) {
         i0__namespace.ɵɵprojection(0);
     } }
@@ -113,27 +118,27 @@
     function FormComponent_ng_template_3_div_0_i_3_Template(rf, ctx) { if (rf & 1) {
         i0__namespace.ɵɵelement(0, "i", 22);
     } if (rf & 2) {
-        const ctx_r16 = i0__namespace.ɵɵnextContext(3);
-        i0__namespace.ɵɵproperty("ngClass", ctx_r16.iconclass);
+        const ctx_r0 = i0__namespace.ɵɵnextContext(3);
+        i0__namespace.ɵɵproperty("ngClass", ctx_r0.iconclass);
     } }
-    const _c2 = function (a0) { return { btn: a0 }; };
     function FormComponent_ng_template_3_div_0_ng_container_8_Template(rf, ctx) { if (rf & 1) {
         i0__namespace.ɵɵelementContainer(0, 23);
     } if (rf & 2) {
-        const btn_r19 = ctx.$implicit;
-        i0__namespace.ɵɵnextContext(3);
-        const _r7 = i0__namespace.ɵɵreference(8);
-        const _r9 = i0__namespace.ɵɵreference(10);
-        i0__namespace.ɵɵproperty("ngTemplateOutlet", btn_r19.widgetType === "button" ? _r7 : _r9)("ngTemplateOutletContext", i0__namespace.ɵɵpureFunction1(2, _c2, btn_r19));
+        const btn_r2 = ctx.$implicit;
+        const index_r3 = ctx.index;
+        const ctx_r0 = i0__namespace.ɵɵnextContext(3);
+        const buttonRef_r4 = i0__namespace.ɵɵreference(8);
+        const anchorRef_r5 = i0__namespace.ɵɵreference(10);
+        i0__namespace.ɵɵproperty("ngTemplateOutlet", btn_r2.widgetType === "button" ? buttonRef_r4 : anchorRef_r5)("ngTemplateOutletContext", i0__namespace.ɵɵpureFunction1(3, _c6, btn_r2))("ngTemplateOutletInjector", ctx_r0.createCustomInjector("action_header_" + index_r3, i0__namespace.ɵɵpureFunction1(5, _c6, btn_r2)));
     } }
     function FormComponent_ng_template_3_div_0_button_10_Template(rf, ctx) { if (rf & 1) {
-        const _r21 = i0__namespace.ɵɵgetCurrentView();
+        const _r6 = i0__namespace.ɵɵgetCurrentView();
         i0__namespace.ɵɵelementStart(0, "button", 24);
-        i0__namespace.ɵɵlistener("click", function FormComponent_ng_template_3_div_0_button_10_Template_button_click_0_listener() { i0__namespace.ɵɵrestoreView(_r21); const ctx_r20 = i0__namespace.ɵɵnextContext(3); return i0__namespace.ɵɵresetView(ctx_r20.expandCollapsePanel()); });
+        i0__namespace.ɵɵlistener("click", function FormComponent_ng_template_3_div_0_button_10_Template_button_click_0_listener() { i0__namespace.ɵɵrestoreView(_r6); const ctx_r0 = i0__namespace.ɵɵnextContext(3); return i0__namespace.ɵɵresetView(ctx_r0.expandCollapsePanel()); });
         i0__namespace.ɵɵelementEnd();
     } if (rf & 2) {
-        const ctx_r18 = i0__namespace.ɵɵnextContext(3);
-        i0__namespace.ɵɵproperty("ngClass", ctx_r18.expanded ? "wi-minus" : "wi-plus");
+        const ctx_r0 = i0__namespace.ɵɵnextContext(3);
+        i0__namespace.ɵɵproperty("ngClass", ctx_r0.expanded ? "wi-minus" : "wi-plus");
     } }
     function FormComponent_ng_template_3_div_0_Template(rf, ctx) { if (rf & 1) {
         i0__namespace.ɵɵelementStart(0, "div", 14)(1, "h3", 15)(2, "div", 16);
@@ -143,28 +148,28 @@
         i0__namespace.ɵɵelement(5, "div", 18)(6, "div", 19);
         i0__namespace.ɵɵelementEnd();
         i0__namespace.ɵɵelementStart(7, "div", 20);
-        i0__namespace.ɵɵtemplate(8, FormComponent_ng_template_3_div_0_ng_container_8_Template, 1, 4, "ng-container", 13);
+        i0__namespace.ɵɵtemplate(8, FormComponent_ng_template_3_div_0_ng_container_8_Template, 1, 7, "ng-container", 13);
         i0__namespace.ɵɵpipe(9, "filter");
         i0__namespace.ɵɵtemplate(10, FormComponent_ng_template_3_div_0_button_10_Template, 1, 1, "button", 21);
         i0__namespace.ɵɵelementEnd()()();
     } if (rf & 2) {
-        const ctx_r12 = i0__namespace.ɵɵnextContext(2);
+        const ctx_r0 = i0__namespace.ɵɵnextContext(2);
         i0__namespace.ɵɵadvance(3);
-        i0__namespace.ɵɵproperty("ngIf", ctx_r12.iconclass);
+        i0__namespace.ɵɵproperty("ngIf", ctx_r0.iconclass);
         i0__namespace.ɵɵadvance(2);
-        i0__namespace.ɵɵproperty("innerHTML", ctx_r12.title, i0__namespace.ɵɵsanitizeHtml);
-        i0__namespace.ɵɵadvance(1);
-        i0__namespace.ɵɵproperty("innerHTML", ctx_r12.subheading, i0__namespace.ɵɵsanitizeHtml);
+        i0__namespace.ɵɵproperty("innerHTML", ctx_r0.title, i0__namespace.ɵɵsanitizeHtml);
+        i0__namespace.ɵɵadvance();
+        i0__namespace.ɵɵproperty("innerHTML", ctx_r0.subheading, i0__namespace.ɵɵsanitizeHtml);
         i0__namespace.ɵɵadvance(2);
-        i0__namespace.ɵɵproperty("ngForOf", i0__namespace.ɵɵpipeBind3(9, 5, ctx_r12.buttonArray, "position", "header"));
+        i0__namespace.ɵɵproperty("ngForOf", i0__namespace.ɵɵpipeBind3(9, 5, ctx_r0.buttonArray, "position", "header"));
         i0__namespace.ɵɵadvance(2);
-        i0__namespace.ɵɵproperty("ngIf", ctx_r12.collapsible);
+        i0__namespace.ɵɵproperty("ngIf", ctx_r0.collapsible);
     } }
     function FormComponent_ng_template_3_p_2_Template(rf, ctx) { if (rf & 1) {
         i0__namespace.ɵɵelement(0, "p", 25);
     } if (rf & 2) {
-        const ctx_r13 = i0__namespace.ɵɵnextContext(2);
-        i0__namespace.ɵɵattribute("aria-hidden", !ctx_r13.statusMessage.caption)("aria-label", ctx_r13.statusMessage.caption);
+        const ctx_r0 = i0__namespace.ɵɵnextContext(2);
+        i0__namespace.ɵɵattribute("aria-hidden", !ctx_r0.statusMessage.caption)("aria-label", ctx_r0.statusMessage.caption);
     } }
     function FormComponent_ng_template_3_ng_container_4_Template(rf, ctx) { if (rf & 1) {
         i0__namespace.ɵɵelementContainer(0);
@@ -172,15 +177,13 @@
     function FormComponent_ng_template_3_ng_container_6_Template(rf, ctx) { if (rf & 1) {
         i0__namespace.ɵɵelementContainer(0, 23);
     } if (rf & 2) {
-        const btn_r22 = ctx.$implicit;
-        i0__namespace.ɵɵnextContext(2);
-        const _r7 = i0__namespace.ɵɵreference(8);
-        const _r9 = i0__namespace.ɵɵreference(10);
-        i0__namespace.ɵɵproperty("ngTemplateOutlet", btn_r22.widgetType === "button" ? _r7 : _r9)("ngTemplateOutletContext", i0__namespace.ɵɵpureFunction1(2, _c2, btn_r22));
+        const btn_r7 = ctx.$implicit;
+        const index_r8 = ctx.index;
+        const ctx_r0 = i0__namespace.ɵɵnextContext(2);
+        const buttonRef_r4 = i0__namespace.ɵɵreference(8);
+        const anchorRef_r5 = i0__namespace.ɵɵreference(10);
+        i0__namespace.ɵɵproperty("ngTemplateOutlet", btn_r7.widgetType === "button" ? buttonRef_r4 : anchorRef_r5)("ngTemplateOutletContext", i0__namespace.ɵɵpureFunction1(3, _c6, btn_r7))("ngTemplateOutletInjector", ctx_r0.createCustomInjector("action_footer_" + index_r8, i0__namespace.ɵɵpureFunction1(5, _c6, btn_r7)));
     } }
-    const _c3 = function (a0, a1) { return { "form-elements": a0, "form-body": a1 }; };
-    const _c4 = function (a0, a1) { return { "form-elements": a0, "form-content": a1 }; };
-    const _c5 = function (a0) { return { "modal-footer": a0 }; };
     function FormComponent_ng_template_3_Template(rf, ctx) { if (rf & 1) {
         i0__namespace.ɵɵtemplate(0, FormComponent_ng_template_3_div_0_Template, 11, 9, "div", 7);
         i0__namespace.ɵɵelementStart(1, "div", 8);
@@ -189,27 +192,27 @@
         i0__namespace.ɵɵtemplate(4, FormComponent_ng_template_3_ng_container_4_Template, 1, 0, "ng-container", 11);
         i0__namespace.ɵɵelementEnd();
         i0__namespace.ɵɵelementStart(5, "div", 12);
-        i0__namespace.ɵɵtemplate(6, FormComponent_ng_template_3_ng_container_6_Template, 1, 4, "ng-container", 13);
+        i0__namespace.ɵɵtemplate(6, FormComponent_ng_template_3_ng_container_6_Template, 1, 7, "ng-container", 13);
         i0__namespace.ɵɵpipe(7, "filter");
         i0__namespace.ɵɵelementEnd()();
     } if (rf & 2) {
-        const ctx_r4 = i0__namespace.ɵɵnextContext();
-        const _r0 = i0__namespace.ɵɵreference(1);
-        i0__namespace.ɵɵproperty("ngIf", !ctx_r4.isLayoutDialog && (ctx_r4.title || ctx_r4.subheading || ctx_r4.iconclass || ctx_r4.showButtons("header")));
-        i0__namespace.ɵɵadvance(1);
-        i0__namespace.ɵɵclassProp("hidden", !ctx_r4.expanded);
-        i0__namespace.ɵɵproperty("ngClass", i0__namespace.ɵɵpureFunction2(15, _c3, ctx_r4.isLayoutDialog, !ctx_r4.isLayoutDialog));
-        i0__namespace.ɵɵadvance(1);
-        i0__namespace.ɵɵproperty("ngIf", !!ctx_r4.statusMessage.caption);
-        i0__namespace.ɵɵadvance(1);
-        i0__namespace.ɵɵproperty("ngClass", i0__namespace.ɵɵpureFunction2(18, _c4, !ctx_r4.isLayoutDialog, ctx_r4.isLayoutDialog));
-        i0__namespace.ɵɵadvance(1);
-        i0__namespace.ɵɵproperty("ngTemplateOutlet", _r0);
-        i0__namespace.ɵɵadvance(1);
-        i0__namespace.ɵɵclassProp("hidden", !ctx_r4.expanded || !ctx_r4.showButtons("footer"));
-        i0__namespace.ɵɵproperty("ngClass", i0__namespace.ɵɵpureFunction1(21, _c5, ctx_r4.isLayoutDialog));
-        i0__namespace.ɵɵadvance(1);
-        i0__namespace.ɵɵproperty("ngForOf", i0__namespace.ɵɵpipeBind3(7, 11, ctx_r4.buttonArray, "position", "footer"));
+        const ctx_r0 = i0__namespace.ɵɵnextContext();
+        const content_r9 = i0__namespace.ɵɵreference(1);
+        i0__namespace.ɵɵproperty("ngIf", !ctx_r0.isLayoutDialog && (ctx_r0.title || ctx_r0.subheading || ctx_r0.iconclass || ctx_r0.showButtons("header")));
+        i0__namespace.ɵɵadvance();
+        i0__namespace.ɵɵclassProp("hidden", !ctx_r0.expanded);
+        i0__namespace.ɵɵproperty("ngClass", i0__namespace.ɵɵpureFunction2(15, _c3, ctx_r0.isLayoutDialog, !ctx_r0.isLayoutDialog));
+        i0__namespace.ɵɵadvance();
+        i0__namespace.ɵɵproperty("ngIf", !!ctx_r0.statusMessage.caption);
+        i0__namespace.ɵɵadvance();
+        i0__namespace.ɵɵproperty("ngClass", i0__namespace.ɵɵpureFunction2(18, _c4, !ctx_r0.isLayoutDialog, ctx_r0.isLayoutDialog));
+        i0__namespace.ɵɵadvance();
+        i0__namespace.ɵɵproperty("ngTemplateOutlet", content_r9);
+        i0__namespace.ɵɵadvance();
+        i0__namespace.ɵɵclassProp("hidden", !ctx_r0.expanded || !ctx_r0.showButtons("footer"));
+        i0__namespace.ɵɵproperty("ngClass", i0__namespace.ɵɵpureFunction1(21, _c5, ctx_r0.isLayoutDialog));
+        i0__namespace.ɵɵadvance();
+        i0__namespace.ɵɵproperty("ngForOf", i0__namespace.ɵɵpipeBind3(7, 11, ctx_r0.buttonArray, "position", "footer"));
     } }
     function FormComponent_ng_template_5_ng_container_0_Template(rf, ctx) { if (rf & 1) {
         i0__namespace.ɵɵelementContainer(0);
@@ -218,33 +221,32 @@
         i0__namespace.ɵɵtemplate(0, FormComponent_ng_template_5_ng_container_0_Template, 1, 0, "ng-container", 11);
     } if (rf & 2) {
         i0__namespace.ɵɵnextContext();
-        const _r0 = i0__namespace.ɵɵreference(1);
-        i0__namespace.ɵɵproperty("ngTemplateOutlet", _r0);
+        const content_r9 = i0__namespace.ɵɵreference(1);
+        i0__namespace.ɵɵproperty("ngTemplateOutlet", content_r9);
     } }
     function FormComponent_ng_template_7_Template(rf, ctx) { if (rf & 1) {
-        const _r26 = i0__namespace.ɵɵgetCurrentView();
+        const _r10 = i0__namespace.ɵɵgetCurrentView();
         i0__namespace.ɵɵelementStart(0, "button", 26);
-        i0__namespace.ɵɵlistener("click", function FormComponent_ng_template_7_Template_button_click_0_listener($event) { const restoredCtx = i0__namespace.ɵɵrestoreView(_r26); const btn_r24 = restoredCtx.btn; const ctx_r25 = i0__namespace.ɵɵnextContext(); return i0__namespace.ɵɵresetView(ctx_r25.invokeActionEvent($event, btn_r24.action)); });
+        i0__namespace.ɵɵlistener("click", function FormComponent_ng_template_7_Template_button_click_0_listener($event) { const btn_r11 = i0__namespace.ɵɵrestoreView(_r10).btn; const ctx_r0 = i0__namespace.ɵɵnextContext(); return i0__namespace.ɵɵresetView(ctx_r0.invokeActionEvent($event, btn_r11.action)); });
         i0__namespace.ɵɵelementEnd();
     } if (rf & 2) {
-        const btn_r24 = ctx.btn;
-        const ctx_r8 = i0__namespace.ɵɵnextContext();
-        i0__namespace.ɵɵclassProp("hidden", btn_r24.updateMode ? !ctx_r8.isUpdateMode : ctx_r8.isUpdateMode);
-        i0__namespace.ɵɵpropertyInterpolate("name", btn_r24.key);
-        i0__namespace.ɵɵattribute("aria-label", btn_r24.displayName);
+        const btn_r11 = ctx.btn;
+        const ctx_r0 = i0__namespace.ɵɵnextContext();
+        i0__namespace.ɵɵclassProp("hidden", btn_r11.updateMode ? !ctx_r0.isUpdateMode : ctx_r0.isUpdateMode);
+        i0__namespace.ɵɵpropertyInterpolate("name", btn_r11.key);
+        i0__namespace.ɵɵattribute("aria-label", btn_r11.displayName);
     } }
     function FormComponent_ng_template_9_Template(rf, ctx) { if (rf & 1) {
-        const _r29 = i0__namespace.ɵɵgetCurrentView();
+        const _r12 = i0__namespace.ɵɵgetCurrentView();
         i0__namespace.ɵɵelementStart(0, "a", 27);
-        i0__namespace.ɵɵlistener("click", function FormComponent_ng_template_9_Template_a_click_0_listener($event) { const restoredCtx = i0__namespace.ɵɵrestoreView(_r29); const btn_r27 = restoredCtx.btn; const ctx_r28 = i0__namespace.ɵɵnextContext(); return i0__namespace.ɵɵresetView(ctx_r28.invokeActionEvent($event, btn_r27.action)); });
+        i0__namespace.ɵɵlistener("click", function FormComponent_ng_template_9_Template_a_click_0_listener($event) { const btn_r13 = i0__namespace.ɵɵrestoreView(_r12).btn; const ctx_r0 = i0__namespace.ɵɵnextContext(); return i0__namespace.ɵɵresetView(ctx_r0.invokeActionEvent($event, btn_r13.action)); });
         i0__namespace.ɵɵelementEnd();
     } if (rf & 2) {
-        const btn_r27 = ctx.btn;
-        const ctx_r10 = i0__namespace.ɵɵnextContext();
-        i0__namespace.ɵɵclassProp("hidden", btn_r27.updateMode ? !ctx_r10.isUpdateMode : ctx_r10.isUpdateMode);
-        i0__namespace.ɵɵpropertyInterpolate("name", btn_r27.key);
+        const btn_r13 = ctx.btn;
+        const ctx_r0 = i0__namespace.ɵɵnextContext();
+        i0__namespace.ɵɵclassProp("hidden", btn_r13.updateMode ? !ctx_r0.isUpdateMode : ctx_r0.isUpdateMode);
+        i0__namespace.ɵɵpropertyInterpolate("name", btn_r13.key);
     } }
-    const _c6 = ["*"];
     const WIDGET_CONFIG$1 = { widgetType: 'wm-form', hostClass: 'panel app-panel app-form' };
     const LOGIN_FORM_CONFIG = { widgetType: 'wm-form', hostClass: 'app-form app-login-form' };
     const LIVE_FORM_CONFIG = { widgetType: 'wm-liveform', hostClass: 'panel app-panel app-liveform liveform-inline' };
@@ -265,7 +267,7 @@
     // Generate the form field with given field definition. Add a grid column wrapper around the form field.
     const setMarkupForFormField = (field, columnWidth) => {
         let propsTmpl = '';
-        _.forEach(field, (value, key) => {
+        lodashEs.forEach(field, (value, key) => {
             propsTmpl = `${propsTmpl} ${key}="${value}"`;
         });
         return `<wm-gridcolumn columnwidth="${columnWidth}">
@@ -305,7 +307,7 @@
             return;
         }
         if (ngForm.controls) {
-            _.forEach(ngForm.controls, (ctrl, fieldName) => {
+            lodashEs.forEach(ngForm.controls, (ctrl, fieldName) => {
                 setTouchedState(self, ctrl, fieldName);
             });
         }
@@ -367,8 +369,8 @@
             }
             return i1$1.isDefined(this._formIsInList) ? this._formIsInList : this.parentList;
         }
-        constructor(inj, fb, app, dialogService, dynamicComponentProvider, ngZone, parentList, parentForm, parentPrefab, parentPartial, onBeforeSubmitEvt, onSubmitEvt, onBeforeRenderEvt, binddataset, bindformdata, isLiveForm, isLiveFilter, role, key, name) {
-            super(inj, getWidgetConfig(isLiveForm, isLiveFilter, role));
+        constructor(inj, fb, app, dialogService, dynamicComponentProvider, ngZone, parentList, parentForm, parentPrefab, parentPartial, onBeforeSubmitEvt, onSubmitEvt, onBeforeRenderEvt, binddataset, bindformdata, isLiveForm, isLiveFilter, role, key, name, explicitContext) {
+            super(inj, getWidgetConfig(isLiveForm, isLiveFilter, role), explicitContext);
             this.fb = fb;
             this.app = app;
             this.dialogService = dialogService;
@@ -397,7 +399,7 @@
                 type: ''
             };
             this.primaryKey = [];
-            this._debouncedUpdateFieldSource = _.debounce(this.updateFieldSource, 350);
+            this._debouncedUpdateFieldSource = lodashEs.debounce(this.updateFieldSource, 350);
             this.validationMessages = [];
             this._debouncedSubmitForm = i1$1.debounce(($event) => {
                 // calling submit event in ngZone as change detection is not triggered post the submit callback and actions like notification are not shown
@@ -432,7 +434,7 @@
         ngAfterViewInit() {
             if (this.parentForm && this.parentForm.ngform && this.isParentList) {
                 // setting formArray control on ngform.
-                if (!_.get(this.parentForm.ngform.controls, this.parentList.name)) {
+                if (!lodashEs.get(this.parentForm.ngform.controls, this.parentList.name)) {
                     this.parentForm.ngform.setControl(this.parentList.name, new i1.FormArray([]));
                 }
                 // pushing the ngform to formArray.
@@ -470,10 +472,10 @@
                      * 5. this means form name change applies only when there is single form (immediate child) inside the parentContainer.
                      */
                     const prefabInnerForm = parentContentEl.find('form').first();
-                    if (_.get(prefabInnerForm[0], 'widget.widgetId') === this.widgetId) {
+                    if (lodashEs.get(prefabInnerForm[0], 'widget.widgetId') === this.widgetId) {
                         // check whether form inside prefab container is inside the list. If true, do not change the name.
                         if (!prefabInnerForm.isParentList && !prefabInnerForm.siblings('form').length) {
-                            binding = _.get(parentContainer, 'name');
+                            binding = lodashEs.get(parentContainer, 'name');
                         }
                     }
                 }
@@ -508,16 +510,16 @@
         setValidationOnInnerForms(validateTouch) {
             const formEle = this.getNativeElement();
             const formObjs = formEle.querySelectorAll('.app-form');
-            _.forEach(formObjs, e => {
+            lodashEs.forEach(formObjs, e => {
                 const formInstance = e.widget;
                 // differentiating the validationMessages prefix based on the formGroupName
                 // as the formName's are same when forms are in list
-                let formName = _.get(formInstance, 'formGroupName') || formInstance.name;
+                let formName = lodashEs.get(formInstance, 'formGroupName') || formInstance.name;
                 if (i1$1.isDefined(formInstance.formArrayIndex)) {
                     formName = formName + '[' + formInstance.formArrayIndex + ']';
                 }
                 let current = formInstance;
-                while (_.get(current, 'parentForm')) {
+                while (lodashEs.get(current, 'parentForm')) {
                     let parentName = current.parentForm.formGroupName || current.parentForm.name;
                     if (current.parentForm.parentFormArray) {
                         parentName = parentName + '[' + current.parentForm.formArrayIndex + ']';
@@ -540,7 +542,7 @@
             if (!formFields) {
                 return;
             }
-            _.forEach(controls, (v, k) => {
+            lodashEs.forEach(controls, (v, k) => {
                 const field = formFields.find(e => e.key === k);
                 if (!field || (validateTouch && !v.touched)) {
                     return;
@@ -567,18 +569,18 @@
                     this.validationMessages.push({
                         field: k,
                         value: field.value,
-                        errorType: _.keys(v.errors),
+                        errorType: lodashEs.keys(v.errors),
                         message: field.validationmessage || '',
                         getElement: () => {
                             return field.$element.find('[focus-target]');
                         },
-                        formName: _.last(prefix.split('.')),
+                        formName: lodashEs.last(prefix.split('.')),
                         fullyQualifiedFormName: prefix
                     });
                 }
                 else {
                     this.validationMessages[index].value = field.value;
-                    this.validationMessages[index].errorType = _.keys(v.errors);
+                    this.validationMessages[index].errorType = lodashEs.keys(v.errors);
                 }
             }
             else if (v.valid && index > -1) {
@@ -587,7 +589,7 @@
         }
         // This will return a object containing the error details from the list of formFields that are invalid
         setValidationMsgs(validateTouch) {
-            if (!this.formFields.length && _.isEmpty(this.ngform.controls)) {
+            if (!this.formFields.length && lodashEs.isEmpty(this.ngform.controls)) {
                 return;
             }
             this.setValidationOnFields(this, this.name, validateTouch);
@@ -669,10 +671,10 @@
                     break;
                 case 'formdata':
                     // For livelist when multiselect is enabled, formdata will be array of objects. In this case consider the last object as formdata.
-                    if (_.isEqual(nv, ov)) {
+                    if (lodashEs.isEqual(nv, ov)) {
                         break;
                     }
-                    _.isArray(nv) ? this.setFormData(_.last(nv)) : this.setFormData(nv);
+                    lodashEs.isArray(nv) ? this.setFormData(lodashEs.last(nv)) : this.setFormData(nv);
                     // if dataset on the formFields are not set as the datasourceChange is triggered before the formFields are registered.
                     if (!this.isDataSourceUpdated && this.datasource) {
                         this.onDataSourceChange();
@@ -702,7 +704,7 @@
                     const formFields = this.getFormFields();
                     formFields.forEach(field => {
                         // notifying the dataset change to the form-field widget.
-                        if (!field.isDataSetBound && _.get(field.formWidget, 'dataset$')) {
+                        if (!field.isDataSetBound && lodashEs.get(field.formWidget, 'dataset$')) {
                             field.formWidget.dataset$.next();
                         }
                     });
@@ -751,7 +753,7 @@
         }
         // if there is an App.onServiceError handler for the app, that message should be used instead of server returned error message
         checkAppServiceErrorMsg(type) {
-            const notificationAction = _.get(this.app, 'Actions.appNotification');
+            const notificationAction = lodashEs.get(this.app, 'Actions.appNotification');
             if (notificationAction && type === 'error') {
                 return notificationAction.getMessage();
             }
@@ -764,7 +766,7 @@
         // Set the classes on the form based on the captionposition and captionwidth properties
         setLayoutConfig() {
             let layoutConfig;
-            layoutConfig = i5.getFieldLayoutConfig(this.captionwidth, this.captionposition, _.get(this.app.selectedViewPort, 'os'));
+            layoutConfig = i5.getFieldLayoutConfig(this.captionwidth, this.captionposition, lodashEs.get(this.app.selectedViewPort, 'os'));
             this._widgetClass = layoutConfig.widgetCls;
             this._captionClass = layoutConfig.captionCls;
             i1$1.$appDigest();
@@ -785,9 +787,9 @@
                 this.parentForm.setFormData(this.parentForm.formdata, this.formFields, this.formdata || {});
             }
             // WMS-18967: Applying formadata after formfields are ready
-            if (fieldCount === this.numberOfFields && !_.isEmpty(this.formdata)) {
+            if (fieldCount === this.numberOfFields && !lodashEs.isEmpty(this.formdata)) {
                 this.onDataSourceChange();
-                _.isArray(this.formdata) ? this.setFormData(_.last(this.formdata)) : this.setFormData(this.formdata);
+                lodashEs.isArray(this.formdata) ? this.setFormData(lodashEs.last(this.formdata)) : this.setFormData(this.formdata);
             }
         }
         registerActions(formAction) {
@@ -796,8 +798,8 @@
         // Update the dataoutput whenever there is a change in inside form widget value
         updateFormDataOutput(dataObject) {
             // Set the values of the widgets inside the live form (other than form fields) in form data
-            _.forEach(this.ngform.value, (val, key) => {
-                if (!_.find(this.formFields, { key })) {
+            lodashEs.forEach(this.ngform.value, (val, key) => {
+                if (!lodashEs.find(this.formFields, { key })) {
                     dataObject[key] = val;
                 }
             });
@@ -821,20 +823,20 @@
                 // This form is having innerform i.e. address, these fields are listed as
                 // {"applicantName": "", "applicantID": "", "address": {"street": ""}}
                 if (field.form.widgetId !== this.widgetId && field.form.formGroupName) {
-                    const fd = _.get(formData, field.form.formGroupName, {});
+                    const fd = lodashEs.get(formData, field.form.formGroupName, {});
                     fd[fieldName] = fieldValue;
-                    _.set(formData, field.form.formGroupName, fd);
+                    lodashEs.set(formData, field.form.formGroupName, fd);
                 }
                 else if ((typeof field.form.formArrayIndex === 'number') && field.form.isParentList && !this.parentForm) { // Fix for [WMS-25806]: use formArrayIndex only if form has a parent form
                     // setting formdata based on formArrayIndex
-                    const fd = _.get(formData, field.form.parentList.name, []);
+                    const fd = lodashEs.get(formData, field.form.parentList.name, []);
                     fd[field.form.formArrayIndex] = fd[field.form.formArrayIndex] || {};
                     fd[field.form.formArrayIndex][fieldName] = fieldValue;
-                    _.set(formData, field.form.parentList.name, fd);
+                    lodashEs.set(formData, field.form.parentList.name, fd);
                 }
                 else {
                     // In case of update the field will be already present in form data
-                    _.set(formData, fieldName, fieldValue);
+                    lodashEs.set(formData, fieldName, fieldValue);
                 }
             });
             this.updateFormDataOutput(formData);
@@ -849,7 +851,7 @@
         // FormFields will contain all the fields in parent and inner form also.
         // This returns the formFields in the form based on the form name.
         getFormFields() {
-            return _.filter(this.formFields, formField => {
+            return lodashEs.filter(this.formFields, formField => {
                 return formField.form.name === this.name;
             });
         }
@@ -860,12 +862,12 @@
             const fd = innerFormdata ? innerFormdata : data;
             if (fd) {
                 if (fd.hasOwnProperty(key)) {
-                    field.value = _.get(fd, key);
+                    field.value = lodashEs.get(fd, key);
                 }
-                else if (_.includes(key, '.')) {
+                else if (lodashEs.includes(key, '.')) {
                     // key contains '.' when mapping the fields to child reference i.e. childCol is having key as "parent.childCol"
-                    if (fd.hasOwnProperty(_.split(key, '.')[0])) {
-                        field.value = _.get(fd, key);
+                    if (fd.hasOwnProperty(lodashEs.split(key, '.')[0])) {
+                        field.value = lodashEs.get(fd, key);
                     }
                 }
                 // WMS-18906: For default value, do not mark the form as dirty.
@@ -878,11 +880,11 @@
              * if formGroupName is defined which means field is inside the inner form
              * then set the formdata on the field's form using formGroupName
              */
-            if (formGroupName && _.get(data, formGroupName)) {
+            if (formGroupName && lodashEs.get(data, formGroupName)) {
                 this.setFormData.call(field.form, data[formGroupName]);
             }
             // if formdata is assigned later then on propertyChangeHandler, even inner forms data also needs to be updated.
-            if (_.get(field.form, 'parentFormArray')) {
+            if (lodashEs.get(field.form, 'parentFormArray')) {
                 this.setFormDataFromParentFormData.call(field.form, data);
             }
         }
@@ -1065,7 +1067,7 @@
                         template = this.errormessage || error.error || error;
                         i1$1.$appDigest();
                         return {
-                            'result': _.get(error, 'error') || error,
+                            'result': lodashEs.get(error, 'error') || error,
                             'status': false,
                             'message': template,
                             'type': 'error'
@@ -1092,8 +1094,8 @@
         }
         // Method to show/hide the panel header or footer based on the buttons
         showButtons(position) {
-            return _.some(this.buttonArray, btn => {
-                return _.includes(btn.position, position) && btn.updateMode === this.isUpdateMode;
+            return lodashEs.some(this.buttonArray, btn => {
+                return lodashEs.includes(btn.position, position) && btn.updateMode === this.isUpdateMode;
             });
         }
         // Expand or collapse the panel
@@ -1122,13 +1124,13 @@
             if (!form.parentForm) {
                 return {};
             }
-            if (!form.bindformdata && _.get(form.parentForm, 'formdata') && !_.isEmpty(form.parentForm.formdata)) {
+            if (!form.bindformdata && lodashEs.get(form.parentForm, 'formdata') && !lodashEs.isEmpty(form.parentForm.formdata)) {
                 return form.parentForm.formdata;
             }
             return this.getNearestParentFormData(form.parentForm);
         }
         setFormDataFromParentFormData(formdata) {
-            if (_.isEmpty(this.formdata) && this.parentForm && formdata) {
+            if (lodashEs.isEmpty(this.formdata) && this.parentForm && formdata) {
                 /**
                  * If form is inside list,
                  * 1. directly applying the formdata to the formArray to update the formdata on list of forms using patchValue.
@@ -1139,9 +1141,9 @@
                  * If not inside list, just set the formdata on all the formfields including innerForm fields
                  */
                 if (this.parentFormArray) {
-                    let childFormArrayData = _.get(formdata, this.parentList.name);
+                    let childFormArrayData = lodashEs.get(formdata, this.parentList.name);
                     if (childFormArrayData) {
-                        if (!_.isArray(childFormArrayData)) {
+                        if (!lodashEs.isArray(childFormArrayData)) {
                             childFormArrayData = [childFormArrayData];
                         }
                         this.parentFormArray.patchValue(childFormArrayData);
@@ -1151,7 +1153,7 @@
                         this.setFormData(this.formdata);
                     }
                     else if (this.isParentList && this.parentForm.formGroupName) {
-                        const parentFormData = _.get(formdata, this.parentForm.formGroupName);
+                        const parentFormData = lodashEs.get(formdata, this.parentForm.formGroupName);
                         this.setFormDataFromParentFormData(parentFormData);
                     }
                 }
@@ -1162,7 +1164,7 @@
         }
         // On form data source change. This method is overridden by live form and live filter
         onDataSourceChange() {
-            if (_.get(this.formFields, 'length') && !this.bindformdata) {
+            if (lodashEs.get(this.formFields, 'length') && !this.bindformdata) {
                 this.isDataSourceUpdated = true;
                 /**
                  * formdata on the parent form will be set before the inner forms are rendered.
@@ -1194,7 +1196,7 @@
             let noOfColumns;
             let $gridLayout;
             // Check if grid layout is present or not for first time
-            if (_.isUndefined(this._isGridLayoutPresent)) {
+            if (lodashEs.isUndefined(this._isGridLayoutPresent)) {
                 this._isGridLayoutPresent = this.$element.find('.panel-body [wmlayoutgrid]').length > 0;
             }
             if (this._isGridLayoutPresent) {
@@ -1216,7 +1218,7 @@
             let userFields;
             let fields = this.metadata ? this.metadata.data || this.metadata : [];
             this.formFields = []; // empty the form fields
-            if (_.isEmpty(fields)) {
+            if (lodashEs.isEmpty(fields)) {
                 return;
             }
             if (this.onBeforeRenderEvt) {
@@ -1225,7 +1227,7 @@
                     fields = userFields;
                 }
             }
-            if (!_.isArray(fields)) {
+            if (!lodashEs.isArray(fields)) {
                 return;
             }
             while (fields[colCount]) {
@@ -1311,12 +1313,12 @@
         }
         ngOnDestroy() {
             // on form destroy, removing this form from the parentForm too.
-            const controls = this.parentForm && _.get(this.parentForm, 'ngform.controls');
+            const controls = this.parentForm && lodashEs.get(this.parentForm, 'ngform.controls');
             if (controls) {
                 // when current form is inside the list (i.e. incase of formArray).
-                if (_.get(this.parentList, 'name') && controls.hasOwnProperty(this.parentList.name)) {
+                if (lodashEs.get(this.parentList, 'name') && controls.hasOwnProperty(this.parentList.name)) {
                     //get the index of current form in the list and remove the FormControl from FormArray
-                    const index = _.findIndex(this.parentList.getWidgets(this.name), { widgetId: this.widgetId });
+                    const index = lodashEs.findIndex(this.parentList.getWidgets(this.name), { widgetId: this.widgetId });
                     this.parentForm.ngform.controls[this.parentList.name].removeAt(index);
                 }
                 // when we have formGroupName set i.e. multiple formInstance with counter appended to formName
@@ -1329,7 +1331,7 @@
             }
             super.ngOnDestroy();
         }
-        static { this.ɵfac = function FormComponent_Factory(t) { return new (t || FormComponent)(i0__namespace.ɵɵdirectiveInject(i0__namespace.Injector), i0__namespace.ɵɵdirectiveInject(i1__namespace.FormBuilder), i0__namespace.ɵɵdirectiveInject(i1$1__namespace.App), i0__namespace.ɵɵdirectiveInject(i1$1__namespace.AbstractDialogService), i0__namespace.ɵɵdirectiveInject(i1$1__namespace.DynamicComponentRefProvider), i0__namespace.ɵɵdirectiveInject(i0__namespace.NgZone), i0__namespace.ɵɵdirectiveInject(i3__namespace.ListComponent, 8), i0__namespace.ɵɵdirectiveInject(FormComponent, 12), i0__namespace.ɵɵdirectiveInject(i4__namespace.PrefabDirective, 12), i0__namespace.ɵɵdirectiveInject(i5__namespace.PartialDirective, 12), i0__namespace.ɵɵinjectAttribute('beforesubmit.event'), i0__namespace.ɵɵinjectAttribute('submit.event'), i0__namespace.ɵɵinjectAttribute('beforerender.event'), i0__namespace.ɵɵinjectAttribute('dataset.bind'), i0__namespace.ɵɵinjectAttribute('formdata.bind'), i0__namespace.ɵɵinjectAttribute('wmLiveForm'), i0__namespace.ɵɵinjectAttribute('wmLiveFilter'), i0__namespace.ɵɵinjectAttribute('data-role'), i0__namespace.ɵɵinjectAttribute('key'), i0__namespace.ɵɵinjectAttribute('name')); }; }
+        static { this.ɵfac = function FormComponent_Factory(t) { return new (t || FormComponent)(i0__namespace.ɵɵdirectiveInject(i0__namespace.Injector), i0__namespace.ɵɵdirectiveInject(i1__namespace.FormBuilder), i0__namespace.ɵɵdirectiveInject(i1$1__namespace.App), i0__namespace.ɵɵdirectiveInject(i1$1__namespace.AbstractDialogService), i0__namespace.ɵɵdirectiveInject(i1$1__namespace.DynamicComponentRefProvider), i0__namespace.ɵɵdirectiveInject(i0__namespace.NgZone), i0__namespace.ɵɵdirectiveInject(i3__namespace.ListComponent, 8), i0__namespace.ɵɵdirectiveInject(FormComponent, 12), i0__namespace.ɵɵdirectiveInject(i4__namespace.PrefabDirective, 12), i0__namespace.ɵɵdirectiveInject(i5__namespace.PartialDirective, 12), i0__namespace.ɵɵinjectAttribute('beforesubmit.event'), i0__namespace.ɵɵinjectAttribute('submit.event'), i0__namespace.ɵɵinjectAttribute('beforerender.event'), i0__namespace.ɵɵinjectAttribute('dataset.bind'), i0__namespace.ɵɵinjectAttribute('formdata.bind'), i0__namespace.ɵɵinjectAttribute('wmLiveForm'), i0__namespace.ɵɵinjectAttribute('wmLiveFilter'), i0__namespace.ɵɵinjectAttribute('data-role'), i0__namespace.ɵɵinjectAttribute('key'), i0__namespace.ɵɵinjectAttribute('name'), i0__namespace.ɵɵdirectiveInject('EXPLICIT_CONTEXT', 8)); }; }
         static { this.ɵcmp = /*@__PURE__*/ i0__namespace.ɵɵdefineComponent({ type: FormComponent, selectors: [["form", "wmForm", ""]], contentQueries: function FormComponent_ContentQueries(rf, ctx, dirIndex) { if (rf & 1) {
                 i0__namespace.ɵɵcontentQuery(dirIndex, i5.WidgetRef, 5);
             } if (rf & 2) {
@@ -1348,28 +1350,23 @@
                 i0__namespace.ɵɵhostProperty("action", ctx.action, i0__namespace.ɵɵsanitizeUrl);
             } }, features: [i0__namespace.ɵɵProvidersFeature([
                     i5.provideAsWidgetRef(FormComponent)
-                ]), i0__namespace.ɵɵInheritDefinitionFeature], attrs: _c1$1, ngContentSelectors: _c6, decls: 13, vars: 3, consts: [["content", ""], [4, "ngIf", "ngIfThen", "ngIfElse"], ["defaultTemplate", ""], ["pageLayoutTemplate", ""], ["buttonRef", ""], ["anchorRef", ""], ["dynamicForm", ""], ["class", "panel-heading", 4, "ngIf"], [1, "panel-body", 3, "ngClass"], ["wmMessage", "", "caption.bind", "statusMessage.caption", "type.bind", "statusMessage.type", 4, "ngIf"], [3, "ngClass"], [4, "ngTemplateOutlet"], [1, "basic-btn-grp", "form-action", "panel-footer", "clearfix", 3, "ngClass"], [3, "ngTemplateOutlet", "ngTemplateOutletContext", 4, "ngFor", "ngForOf"], [1, "panel-heading"], [1, "panel-title"], [1, "pull-left"], ["class", "app-icon panel-icon", "aria-hidden", "true", 3, "ngClass", 4, "ngIf"], [1, "heading", 3, "innerHTML"], [1, "description", 3, "innerHTML"], [1, "form-action", "panel-actions", "basic-btn-grp"], ["type", "button", "class", "app-icon wi panel-action", "title", "Collapse/Expand", 3, "ngClass", "click", 4, "ngIf"], ["aria-hidden", "true", 1, "app-icon", "panel-icon", 3, "ngClass"], [3, "ngTemplateOutlet", "ngTemplateOutletContext"], ["type", "button", "title", "Collapse/Expand", 1, "app-icon", "wi", "panel-action", 3, "ngClass", "click"], ["wmMessage", "", "caption.bind", "statusMessage.caption", "type.bind", "statusMessage.type"], ["wmButton", "", "caption.bind", "btn.displayName", "class.bind", "btn.class", "iconclass.bind", "btn.iconclass", "show.bind", "btn.show", "type.bind", "btn.type", "hint.bind", "btn.title", "shortcutkey.bind", "btn.shortcutkey", "disabled.bind", "ngform.status === 'PENDING' || btn.disabled", "tabindex.bind", "btn.tabindex", 3, "name", "click"], ["wmAnchor", "", "caption.bind", "btn.displayName", "class.bind", "btn.class", "iconclass.bind", "btn.iconclass", "show.bind", "btn.show", "hint.bind", "btn.title", "shortcutkey.bind", "btn.shortcutkey", "hyperlink.bind", "btn.hyperlink", "target.bind", "btn.target", "tabindex.bind", "btn.tabindex", 3, "name", "click"]], template: function FormComponent_Template(rf, ctx) { if (rf & 1) {
+                ]), i0__namespace.ɵɵInheritDefinitionFeature], attrs: _c1$1, ngContentSelectors: _c2, decls: 13, vars: 3, consts: [["content", ""], ["defaultTemplate", ""], ["pageLayoutTemplate", ""], ["buttonRef", ""], ["anchorRef", ""], ["dynamicForm", ""], [4, "ngIf", "ngIfThen", "ngIfElse"], ["class", "panel-heading", 4, "ngIf"], [1, "panel-body", 3, "ngClass"], ["wmMessage", "", "caption.bind", "statusMessage.caption", "type.bind", "statusMessage.type", 4, "ngIf"], [3, "ngClass"], [4, "ngTemplateOutlet"], [1, "basic-btn-grp", "form-action", "panel-footer", "clearfix", 3, "ngClass"], [3, "ngTemplateOutlet", "ngTemplateOutletContext", "ngTemplateOutletInjector", 4, "ngFor", "ngForOf"], [1, "panel-heading"], [1, "panel-title"], [1, "pull-left"], ["class", "app-icon panel-icon", "aria-hidden", "true", 3, "ngClass", 4, "ngIf"], [1, "heading", 3, "innerHTML"], [1, "description", 3, "innerHTML"], [1, "form-action", "panel-actions", "basic-btn-grp"], ["type", "button", "class", "app-icon wi panel-action", "title", "Collapse/Expand", 3, "ngClass", "click", 4, "ngIf"], ["aria-hidden", "true", 1, "app-icon", "panel-icon", 3, "ngClass"], [3, "ngTemplateOutlet", "ngTemplateOutletContext", "ngTemplateOutletInjector"], ["type", "button", "title", "Collapse/Expand", 1, "app-icon", "wi", "panel-action", 3, "click", "ngClass"], ["wmMessage", "", "caption.bind", "statusMessage.caption", "type.bind", "statusMessage.type"], ["wmButton", "", "caption.bind", "btn.displayName", "class.bind", "btn.class", "iconclass.bind", "btn.iconclass", "show.bind", "btn.show", "type.bind", "btn.type", "hint.bind", "btn.title", "shortcutkey.bind", "btn.shortcutkey", "disabled.bind", "ngform.status === 'PENDING' || btn.disabled", "tabindex.bind", "btn.tabindex", 3, "click", "name"], ["wmAnchor", "", "caption.bind", "btn.displayName", "class.bind", "btn.class", "iconclass.bind", "btn.iconclass", "show.bind", "btn.show", "hint.bind", "btn.title", "shortcutkey.bind", "btn.shortcutkey", "hyperlink.bind", "btn.hyperlink", "target.bind", "btn.target", "tabindex.bind", "btn.tabindex", 3, "click", "name"]], template: function FormComponent_Template(rf, ctx) { if (rf & 1) {
                 i0__namespace.ɵɵprojectionDef();
-                i0__namespace.ɵɵtemplate(0, FormComponent_ng_template_0_Template, 1, 0, "ng-template", null, 0, i0__namespace.ɵɵtemplateRefExtractor);
-                i0__namespace.ɵɵtemplate(2, FormComponent_ng_container_2_Template, 1, 0, "ng-container", 1);
-                i0__namespace.ɵɵtemplate(3, FormComponent_ng_template_3_Template, 8, 23, "ng-template", null, 2, i0__namespace.ɵɵtemplateRefExtractor);
-                i0__namespace.ɵɵtemplate(5, FormComponent_ng_template_5_Template, 1, 1, "ng-template", null, 3, i0__namespace.ɵɵtemplateRefExtractor);
-                i0__namespace.ɵɵtemplate(7, FormComponent_ng_template_7_Template, 1, 4, "ng-template", null, 4, i0__namespace.ɵɵtemplateRefExtractor);
-                i0__namespace.ɵɵtemplate(9, FormComponent_ng_template_9_Template, 1, 3, "ng-template", null, 5, i0__namespace.ɵɵtemplateRefExtractor);
-                i0__namespace.ɵɵelementContainer(11, null, 6);
+                i0__namespace.ɵɵtemplate(0, FormComponent_ng_template_0_Template, 1, 0, "ng-template", null, 0, i0__namespace.ɵɵtemplateRefExtractor)(2, FormComponent_ng_container_2_Template, 1, 0, "ng-container", 6)(3, FormComponent_ng_template_3_Template, 8, 23, "ng-template", null, 1, i0__namespace.ɵɵtemplateRefExtractor)(5, FormComponent_ng_template_5_Template, 1, 1, "ng-template", null, 2, i0__namespace.ɵɵtemplateRefExtractor)(7, FormComponent_ng_template_7_Template, 1, 4, "ng-template", null, 3, i0__namespace.ɵɵtemplateRefExtractor)(9, FormComponent_ng_template_9_Template, 1, 3, "ng-template", null, 4, i0__namespace.ɵɵtemplateRefExtractor);
+                i0__namespace.ɵɵelementContainer(11, null, 5);
             } if (rf & 2) {
-                const _r3 = i0__namespace.ɵɵreference(4);
-                const _r5 = i0__namespace.ɵɵreference(6);
+                const defaultTemplate_r14 = i0__namespace.ɵɵreference(4);
+                const pageLayoutTemplate_r15 = i0__namespace.ɵɵreference(6);
                 i0__namespace.ɵɵadvance(2);
-                i0__namespace.ɵɵproperty("ngIf", ctx.formlayout === "page")("ngIfThen", _r5)("ngIfElse", _r3);
+                i0__namespace.ɵɵproperty("ngIf", ctx.formlayout === "page")("ngIfThen", pageLayoutTemplate_r15)("ngIfElse", defaultTemplate_r14);
             } }, dependencies: [i6__namespace.AnchorComponent, i7__namespace.NgClass, i7__namespace.NgForOf, i7__namespace.NgIf, i7__namespace.NgTemplateOutlet, i8__namespace.ButtonComponent, i5__namespace.MessageComponent, i5__namespace.FilterPipe], encapsulation: 2 }); }
     }
-    (function () { (typeof ngDevMode === "undefined" || ngDevMode) && i0__namespace.ɵsetClassMetadata(FormComponent, [{
+    (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0__namespace.ɵsetClassMetadata(FormComponent, [{
             type: i0.Component,
             args: [{ selector: 'form[wmForm]', providers: [
                         i5.provideAsWidgetRef(FormComponent)
-                    ], template: "<ng-template #content><ng-content></ng-content></ng-template>\n\n<ng-container *ngIf=\"formlayout === 'page'; then pageLayoutTemplate else defaultTemplate\">\n</ng-container>\n\n<ng-template #defaultTemplate>\n    <div class=\"panel-heading\" *ngIf=\"!isLayoutDialog && (title || subheading || iconclass || showButtons('header'))\">\n        <h3 class=\"panel-title\">\n            <div class=\"pull-left\">\n                <i class=\"app-icon panel-icon\" aria-hidden=\"true\" [ngClass]=\"iconclass\" *ngIf=\"iconclass\"></i>\n            </div>\n            <div class=\"pull-left\">\n                <div class=\"heading\" [innerHTML]=\"title\"></div>\n                <div class=\"description\" [innerHTML]=\"subheading\"></div>\n            </div>\n            <div class=\"form-action panel-actions basic-btn-grp\">\n                <ng-container *ngFor=\"let btn of buttonArray | filter : 'position' : 'header'\"\n                              [ngTemplateOutlet]=\"btn.widgetType === 'button' ? buttonRef : anchorRef\" [ngTemplateOutletContext]=\"{btn:btn}\">\n                </ng-container>\n                <button type=\"button\" class=\"app-icon wi panel-action\" *ngIf=\"collapsible\" title=\"Collapse/Expand\"\n                        [ngClass]=\"expanded ? 'wi-minus': 'wi-plus'\" (click)=\"expandCollapsePanel();\"></button>\n            </div>\n        </h3>\n    </div>\n    <div class=\"panel-body\" [ngClass]=\"{'form-elements': isLayoutDialog, 'form-body': !isLayoutDialog}\" [class.hidden]=\"!expanded\">\n        <p wmMessage *ngIf=\"!!statusMessage.caption\" [attr.aria-hidden]=\"!statusMessage.caption\" [attr.aria-label]=\"statusMessage.caption\" caption.bind=\"statusMessage.caption\" type.bind=\"statusMessage.type\"></p>\n        <div [ngClass]=\"{'form-elements': !isLayoutDialog, 'form-content': isLayoutDialog}\">\n            <ng-container *ngTemplateOutlet=\"content\"></ng-container>\n        </div>\n        <div class=\"basic-btn-grp form-action panel-footer clearfix\" [ngClass]=\"{'modal-footer': isLayoutDialog}\" [class.hidden]=\"!expanded || !showButtons('footer')\">\n            <ng-container *ngFor=\"let btn of buttonArray | filter : 'position' : 'footer'\"\n                          [ngTemplateOutlet]=\"btn.widgetType === 'button' ? buttonRef : anchorRef\" [ngTemplateOutletContext]=\"{btn:btn}\">\n            </ng-container>\n        </div>\n    </div>\n</ng-template>\n\n<ng-template #pageLayoutTemplate>\n    <ng-container *ngTemplateOutlet=\"content\"></ng-container>\n</ng-template>\n\n<ng-template #buttonRef let-btn=\"btn\">\n    <button  wmButton name=\"{{btn.key}}\" caption.bind=\"btn.displayName\" class.bind=\"btn.class\" iconclass.bind=\"btn.iconclass\" show.bind=\"btn.show\"\n             (click)=\"invokeActionEvent($event, btn.action)\" type.bind=\"btn.type\" hint.bind=\"btn.title\" shortcutkey.bind=\"btn.shortcutkey\" disabled.bind=\"ngform.status === 'PENDING' || btn.disabled\"\n             tabindex.bind=\"btn.tabindex\" [attr.aria-label]=\"btn.displayName\" [class.hidden]=\"btn.updateMode ? !isUpdateMode : isUpdateMode\"></button>\n</ng-template>\n\n<ng-template #anchorRef let-btn=\"btn\">\n    <a wmAnchor name=\"{{btn.key}}\" caption.bind=\"btn.displayName\" class.bind=\"btn.class\" iconclass.bind=\"btn.iconclass\" show.bind=\"btn.show\"\n             (click)=\"invokeActionEvent($event, btn.action)\" hint.bind=\"btn.title\" shortcutkey.bind=\"btn.shortcutkey\"\n             hyperlink.bind=\"btn.hyperlink\" target.bind=\"btn.target\"\n             tabindex.bind=\"btn.tabindex\" [class.hidden]=\"btn.updateMode ? !isUpdateMode : isUpdateMode\"></a>\n</ng-template>\n\n<ng-container #dynamicForm></ng-container>\n" }]
-        }], function () { return [{ type: i0__namespace.Injector }, { type: i1__namespace.FormBuilder }, { type: i1$1__namespace.App }, { type: i1$1__namespace.AbstractDialogService }, { type: i1$1__namespace.DynamicComponentRefProvider }, { type: i0__namespace.NgZone }, { type: i3__namespace.ListComponent, decorators: [{
+                    ], template: "<ng-template #content><ng-content></ng-content></ng-template>\n\n<ng-container *ngIf=\"formlayout === 'page'; then pageLayoutTemplate else defaultTemplate\">\n</ng-container>\n\n<ng-template #defaultTemplate>\n    <div class=\"panel-heading\" *ngIf=\"!isLayoutDialog && (title || subheading || iconclass || showButtons('header'))\">\n        <h3 class=\"panel-title\">\n            <div class=\"pull-left\">\n                <i class=\"app-icon panel-icon\" aria-hidden=\"true\" [ngClass]=\"iconclass\" *ngIf=\"iconclass\"></i>\n            </div>\n            <div class=\"pull-left\">\n                <div class=\"heading\" [innerHTML]=\"title\"></div>\n                <div class=\"description\" [innerHTML]=\"subheading\"></div>\n            </div>\n            <div class=\"form-action panel-actions basic-btn-grp\">\n                <ng-container *ngFor=\"let btn of buttonArray | filter : 'position' : 'header'; let index = index\"\n                              [ngTemplateOutlet]=\"btn.widgetType === 'button' ? buttonRef : anchorRef\"\n                              [ngTemplateOutletContext]=\"{btn:btn}\"\n                              [ngTemplateOutletInjector]=\"createCustomInjector('action_header_' + index, {btn:btn})\">\n                </ng-container>\n                <button type=\"button\" class=\"app-icon wi panel-action\" *ngIf=\"collapsible\" title=\"Collapse/Expand\"\n                        [ngClass]=\"expanded ? 'wi-minus': 'wi-plus'\" (click)=\"expandCollapsePanel();\"></button>\n            </div>\n        </h3>\n    </div>\n    <div class=\"panel-body\" [ngClass]=\"{'form-elements': isLayoutDialog, 'form-body': !isLayoutDialog}\" [class.hidden]=\"!expanded\">\n        <p wmMessage *ngIf=\"!!statusMessage.caption\" [attr.aria-hidden]=\"!statusMessage.caption\" [attr.aria-label]=\"statusMessage.caption\" caption.bind=\"statusMessage.caption\" type.bind=\"statusMessage.type\"></p>\n        <div [ngClass]=\"{'form-elements': !isLayoutDialog, 'form-content': isLayoutDialog}\">\n            <ng-container *ngTemplateOutlet=\"content\"></ng-container>\n        </div>\n        <div class=\"basic-btn-grp form-action panel-footer clearfix\" [ngClass]=\"{'modal-footer': isLayoutDialog}\" [class.hidden]=\"!expanded || !showButtons('footer')\">\n            <ng-container *ngFor=\"let btn of buttonArray | filter : 'position' : 'footer'; let index = index\"\n                          [ngTemplateOutlet]=\"btn.widgetType === 'button' ? buttonRef : anchorRef\"\n                          [ngTemplateOutletContext]=\"{btn:btn}\"\n                          [ngTemplateOutletInjector]=\"createCustomInjector('action_footer_' + index, {btn:btn})\">\n            </ng-container>\n        </div>\n    </div>\n</ng-template>\n\n<ng-template #pageLayoutTemplate>\n    <ng-container *ngTemplateOutlet=\"content\"></ng-container>\n</ng-template>\n\n<ng-template #buttonRef let-btn=\"btn\">\n    <button  wmButton name=\"{{btn.key}}\" caption.bind=\"btn.displayName\" class.bind=\"btn.class\" iconclass.bind=\"btn.iconclass\" show.bind=\"btn.show\"\n             (click)=\"invokeActionEvent($event, btn.action)\" type.bind=\"btn.type\" hint.bind=\"btn.title\" shortcutkey.bind=\"btn.shortcutkey\" disabled.bind=\"ngform.status === 'PENDING' || btn.disabled\"\n             tabindex.bind=\"btn.tabindex\" [attr.aria-label]=\"btn.displayName\" [class.hidden]=\"btn.updateMode ? !isUpdateMode : isUpdateMode\"></button>\n</ng-template>\n\n<ng-template #anchorRef let-btn=\"btn\">\n    <a wmAnchor name=\"{{btn.key}}\" caption.bind=\"btn.displayName\" class.bind=\"btn.class\" iconclass.bind=\"btn.iconclass\" show.bind=\"btn.show\"\n             (click)=\"invokeActionEvent($event, btn.action)\" hint.bind=\"btn.title\" shortcutkey.bind=\"btn.shortcutkey\"\n             hyperlink.bind=\"btn.hyperlink\" target.bind=\"btn.target\"\n             tabindex.bind=\"btn.tabindex\" [class.hidden]=\"btn.updateMode ? !isUpdateMode : isUpdateMode\"></a>\n</ng-template>\n\n<ng-container #dynamicForm></ng-container>\n" }]
+        }], () => [{ type: i0__namespace.Injector }, { type: i1__namespace.FormBuilder }, { type: i1$1__namespace.App }, { type: i1$1__namespace.AbstractDialogService }, { type: i1$1__namespace.DynamicComponentRefProvider }, { type: i0__namespace.NgZone }, { type: i3__namespace.ListComponent, decorators: [{
                     type: i0.Optional
                 }] }, { type: FormComponent, decorators: [{
                     type: i0.SkipSelf
@@ -1413,7 +1410,12 @@
                 }] }, { type: undefined, decorators: [{
                     type: i0.Attribute,
                     args: ['name']
-                }] }]; }, { dynamicFormRef: [{
+                }] }, { type: undefined, decorators: [{
+                    type: i0.Inject,
+                    args: ['EXPLICIT_CONTEXT']
+                }, {
+                    type: i0.Optional
+                }] }], { dynamicFormRef: [{
                 type: i0.ViewChild,
                 args: ['dynamicForm', { static: true, read: i0.ViewContainerRef }]
             }], messageRef: [{
@@ -1435,6 +1437,7 @@
                 type: i0.HostListener,
                 args: ['keydown', ['$event']]
             }] }); })();
+    (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0__namespace.ɵsetClassDebugInfo(FormComponent, { className: "FormComponent", filePath: "form.component.ts", lineNumber: 159 }); })();
 
     class FormWidgetDirective {
         constructor(form, table, componentInstance, fb, name, key) {
@@ -1476,12 +1479,12 @@
         static { this.ɵfac = function FormWidgetDirective_Factory(t) { return new (t || FormWidgetDirective)(i0__namespace.ɵɵdirectiveInject(FormComponent, 8), i0__namespace.ɵɵdirectiveInject(table.TableComponent, 8), i0__namespace.ɵɵdirectiveInject(i5.WidgetRef, 2), i0__namespace.ɵɵdirectiveInject(i1__namespace.FormBuilder), i0__namespace.ɵɵinjectAttribute('name'), i0__namespace.ɵɵinjectAttribute('key')); }; }
         static { this.ɵdir = /*@__PURE__*/ i0__namespace.ɵɵdefineDirective({ type: FormWidgetDirective, selectors: [["", "wmFormWidget", ""]] }); }
     }
-    (function () { (typeof ngDevMode === "undefined" || ngDevMode) && i0__namespace.ɵsetClassMetadata(FormWidgetDirective, [{
+    (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0__namespace.ɵsetClassMetadata(FormWidgetDirective, [{
             type: i0.Directive,
             args: [{
                     selector: '[wmFormWidget]'
                 }]
-        }], function () { return [{ type: undefined, decorators: [{
+        }], () => [{ type: undefined, decorators: [{
                     type: i0.Optional
                 }, {
                     type: i0.Inject,
@@ -1502,7 +1505,7 @@
                 }] }, { type: undefined, decorators: [{
                     type: i0.Attribute,
                     args: ['key']
-                }] }]; }, null); })();
+                }] }], null); })();
 
     const registerProps$1 = () => {
         i5.register('wm-form-action', new Map([
@@ -1531,8 +1534,8 @@
     const WIDGET_CONFIG = { widgetType: 'wm-form-action', hostClass: '' };
     class FormActionDirective extends i5.BaseComponent {
         static { this.initializeProps = registerProps$1(); }
-        constructor(inj, form) {
-            super(inj, WIDGET_CONFIG);
+        constructor(inj, form, explicitContext) {
+            super(inj, WIDGET_CONFIG, explicitContext);
             this.form = form;
         }
         populateAction() {
@@ -1542,7 +1545,7 @@
                 show: this.show,
                 class: this.class ? this.class : (this['widget-type'] === 'button' ? 'btn-secondary' : ''),
                 iconclass: this.iconclass || '',
-                title: _.isUndefined(this.title) ? (this['display-name'] || '') : this.title,
+                title: lodashEs.isUndefined(this.title) ? (this['display-name'] || '') : this.title,
                 action: this.action,
                 accessroles: this.accessroles,
                 shortcutkey: this.shortcutkey,
@@ -1575,12 +1578,12 @@
                     break;
             }
         }
-        static { this.ɵfac = function FormActionDirective_Factory(t) { return new (t || FormActionDirective)(i0__namespace.ɵɵdirectiveInject(i0__namespace.Injector), i0__namespace.ɵɵdirectiveInject(FormComponent, 8)); }; }
+        static { this.ɵfac = function FormActionDirective_Factory(t) { return new (t || FormActionDirective)(i0__namespace.ɵɵdirectiveInject(i0__namespace.Injector), i0__namespace.ɵɵdirectiveInject(FormComponent, 8), i0__namespace.ɵɵdirectiveInject('EXPLICIT_CONTEXT', 8)); }; }
         static { this.ɵdir = /*@__PURE__*/ i0__namespace.ɵɵdefineDirective({ type: FormActionDirective, selectors: [["", "wmFormAction", ""]], features: [i0__namespace.ɵɵProvidersFeature([
                     i5.provideAsWidgetRef(FormActionDirective)
                 ]), i0__namespace.ɵɵInheritDefinitionFeature] }); }
     }
-    (function () { (typeof ngDevMode === "undefined" || ngDevMode) && i0__namespace.ɵsetClassMetadata(FormActionDirective, [{
+    (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0__namespace.ɵsetClassMetadata(FormActionDirective, [{
             type: i0.Directive,
             args: [{
                     selector: '[wmFormAction]',
@@ -1588,9 +1591,14 @@
                         i5.provideAsWidgetRef(FormActionDirective)
                     ]
                 }]
-        }], function () { return [{ type: i0__namespace.Injector }, { type: FormComponent, decorators: [{
+        }], () => [{ type: i0__namespace.Injector }, { type: FormComponent, decorators: [{
+                    type: i0.Optional
+                }] }, { type: undefined, decorators: [{
+                    type: i0.Inject,
+                    args: ['EXPLICIT_CONTEXT']
+                }, {
                     type: i0.Optional
-                }] }]; }, null); })();
+                }] }], null); })();
 
     const registerProps = () => {
         const formFieldMap = new Map([
@@ -1661,14 +1669,14 @@
         handleClick(event) {
             this._clicktriggeredByUser = true;
         }
-        constructor(inj, form, fb, viewport, app, parentList, bindChipclass, binddataset, binddisplayexpression, binddisplaylabel, _widgetType, name, binddisplayimagesrc, key, isRange, pcDisplay, mobileDisplay, tabletDisplay, contexts) {
+        constructor(inj, form, fb, viewport, app, parentList, bindChipclass, binddataset, binddisplayexpression, binddisplaylabel, _widgetType, name, binddisplayimagesrc, key, isRange, pcDisplay, mobileDisplay, tabletDisplay, contexts, explicitContext) {
             const WIDGET_CONFIG = {
                 widgetType: 'wm-form-field',
                 hostClass: '',
                 widgetSubType: 'wm-form-field-' + (_widgetType || i1$1.FormWidgetType.TEXT).trim()
             };
             let resolveFn = i1$1.noop;
-            super(inj, WIDGET_CONFIG, new Promise(res => resolveFn = res));
+            super(inj, WIDGET_CONFIG, explicitContext, new Promise(res => resolveFn = res));
             this._initPropsRes = resolveFn;
             this.app = app;
             this.fieldDefConfig = {};
@@ -1752,10 +1760,10 @@
             const value = this.value;
             const displayField = this.displayfield || this.displaylabel;
             const displayExpr = this.displayexpression;
-            if (_.isObject(value)) {
-                if (_.isArray(value)) {
-                    _.forEach(value, obj => {
-                        if (_.isObject(obj)) {
+            if (lodashEs.isObject(value)) {
+                if (lodashEs.isArray(value)) {
+                    lodashEs.forEach(value, obj => {
+                        if (lodashEs.isObject(obj)) {
                             caption.push(this.evaluateExpr(obj, displayField, displayExpr));
                         }
                     });
@@ -1763,16 +1771,16 @@
                 else {
                     caption.push(this.evaluateExpr(value, displayField, displayExpr));
                 }
-                return _.join(caption, ',');
+                return lodashEs.join(caption, ',');
             }
             return (value === undefined || value === null) ? '' : this.value;
         }
         getCaption() {
-            return (this.value === undefined || this.value === null) ? (_.get(this.form.dataoutput, this._fieldName) || '') : this.value;
+            return (this.value === undefined || this.value === null) ? (lodashEs.get(this.form.dataoutput, this._fieldName) || '') : this.value;
         }
         // Notifies changes to observing validation fields
         notifyChanges() {
-            _.forEach(this.notifyForFields, field => {
+            lodashEs.forEach(this.notifyForFields, field => {
                 field.fieldValidations.validate();
             });
         }
@@ -2040,7 +2048,7 @@
                     .subscribe(this.onValueChange.bind(this));
                 this.registerDestroyListener(() => onMaxValueChangeSubscription.unsubscribe());
             }
-            this.value = _.get(this.form.formdata, this._fieldName);
+            this.value = lodashEs.get(this.form.formdata, this._fieldName);
         }
         ngOnInit() {
             this.ngform = this.form.ngform;
@@ -2110,7 +2118,7 @@
                 this.setReadOnlyState();
             });
         }
-        static { this.ɵfac = function FormFieldDirective_Factory(t) { return new (t || FormFieldDirective)(i0__namespace.ɵɵdirectiveInject(i0__namespace.Injector), i0__namespace.ɵɵdirectiveInject(FormComponent), i0__namespace.ɵɵdirectiveInject(i1__namespace.FormBuilder), i0__namespace.ɵɵdirectiveInject(i1$1__namespace.Viewport), i0__namespace.ɵɵdirectiveInject(i1$1__namespace.App), i0__namespace.ɵɵdirectiveInject(i3__namespace.ListComponent, 8), i0__namespace.ɵɵinjectAttribute('chipclass.bind'), i0__namespace.ɵɵinjectAttribute('dataset.bind'), i0__namespace.ɵɵinjectAttribute('displayexpression.bind'), i0__namespace.ɵɵinjectAttribute('displaylabel.bind'), i0__namespace.ɵɵinjectAttribute('widgettype'), i0__namespace.ɵɵinjectAttribute('name'), i0__namespace.ɵɵinjectAttribute('displayimagesrc.bind'), i0__namespace.ɵɵinjectAttribute('key'), i0__namespace.ɵɵinjectAttribute('is-range'), i0__namespace.ɵɵinjectAttribute('pc-display'), i0__namespace.ɵɵinjectAttribute('mobile-display'), i0__namespace.ɵɵinjectAttribute('tablet-display'), i0__namespace.ɵɵdirectiveInject(i5.Context, 2)); }; }
+        static { this.ɵfac = function FormFieldDirective_Factory(t) { return new (t || FormFieldDirective)(i0__namespace.ɵɵdirectiveInject(i0__namespace.Injector), i0__namespace.ɵɵdirectiveInject(FormComponent), i0__namespace.ɵɵdirectiveInject(i1__namespace.FormBuilder), i0__namespace.ɵɵdirectiveInject(i1$1__namespace.Viewport), i0__namespace.ɵɵdirectiveInject(i1$1__namespace.App), i0__namespace.ɵɵdirectiveInject(i3__namespace.ListComponent, 8), i0__namespace.ɵɵinjectAttribute('chipclass.bind'), i0__namespace.ɵɵinjectAttribute('dataset.bind'), i0__namespace.ɵɵinjectAttribute('displayexpression.bind'), i0__namespace.ɵɵinjectAttribute('displaylabel.bind'), i0__namespace.ɵɵinjectAttribute('widgettype'), i0__namespace.ɵɵinjectAttribute('name'), i0__namespace.ɵɵinjectAttribute('displayimagesrc.bind'), i0__namespace.ɵɵinjectAttribute('key'), i0__namespace.ɵɵinjectAttribute('is-range'), i0__namespace.ɵɵinjectAttribute('pc-display'), i0__namespace.ɵɵinjectAttribute('mobile-display'), i0__namespace.ɵɵinjectAttribute('tablet-display'), i0__namespace.ɵɵdirectiveInject(i5.Context, 2), i0__namespace.ɵɵdirectiveInject('EXPLICIT_CONTEXT', 8)); }; }
         static { this.ɵdir = /*@__PURE__*/ i0__namespace.ɵɵdefineDirective({ type: FormFieldDirective, selectors: [["", "wmFormField", ""]], contentQueries: function FormFieldDirective_ContentQueries(rf, ctx, dirIndex) { if (rf & 1) {
                 i0__namespace.ɵɵcontentQuery(dirIndex, _c0, 7);
                 i0__namespace.ɵɵcontentQuery(dirIndex, _c1, 5);
@@ -2126,7 +2134,7 @@
                     { provide: i5.Context, useFactory: () => { return {}; }, multi: true }
                 ]), i0__namespace.ɵɵInheritDefinitionFeature] }); }
     }
-    (function () { (typeof ngDevMode === "undefined" || ngDevMode) && i0__namespace.ɵsetClassMetadata(FormFieldDirective, [{
+    (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0__namespace.ɵsetClassMetadata(FormFieldDirective, [{
             type: i0.Directive,
             args: [{
                     selector: '[wmFormField]',
@@ -2137,7 +2145,7 @@
                         { provide: i5.Context, useFactory: () => { return {}; }, multi: true }
                     ]
                 }]
-        }], function () { return [{ type: i0__namespace.Injector }, { type: FormComponent }, { type: i1__namespace.FormBuilder }, { type: i1$1__namespace.Viewport }, { type: i1$1__namespace.App }, { type: i3__namespace.ListComponent, decorators: [{
+        }], () => [{ type: i0__namespace.Injector }, { type: FormComponent }, { type: i1__namespace.FormBuilder }, { type: i1$1__namespace.Viewport }, { type: i1$1__namespace.App }, { type: i3__namespace.ListComponent, decorators: [{
                     type: i0.Optional
                 }] }, { type: undefined, decorators: [{
                     type: i0.Attribute,
@@ -2180,7 +2188,12 @@
                 }, {
                     type: i0.Inject,
                     args: [i5.Context]
-                }] }]; }, { formWidget: [{
+                }] }, { type: undefined, decorators: [{
+                    type: i0.Inject,
+                    args: ['EXPLICIT_CONTEXT']
+                }, {
+                    type: i0.Optional
+                }] }], { formWidget: [{
                 type: i0.ContentChild,
                 args: ['formWidget', { static: true }]
             }], formWidgetMax: [{
@@ -2342,17 +2355,17 @@
         static { this.ɵfac = function LiveActionsDirective_Factory(t) { return new (t || LiveActionsDirective)(i0__namespace.ɵɵdirectiveInject(i3.ListComponent, 2), i0__namespace.ɵɵdirectiveInject(i1$1__namespace.App), i0__namespace.ɵɵdirectiveInject(i1$1__namespace.AbstractDialogService)); }; }
         static { this.ɵdir = /*@__PURE__*/ i0__namespace.ɵɵdefineDirective({ type: LiveActionsDirective, selectors: [["", "wmLiveActions", ""]] }); }
     }
-    (function () { (typeof ngDevMode === "undefined" || ngDevMode) && i0__namespace.ɵsetClassMetadata(LiveActionsDirective, [{
+    (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0__namespace.ɵsetClassMetadata(LiveActionsDirective, [{
             type: i0.Directive,
             args: [{
                     selector: '[wmLiveActions]'
                 }]
-        }], function () { return [{ type: undefined, decorators: [{
+        }], () => [{ type: undefined, decorators: [{
                     type: i0.Self
                 }, {
                     type: i0.Inject,
                     args: [i3.ListComponent]
-                }] }, { type: i1$1__namespace.App }, { type: i1$1__namespace.AbstractDialogService }]; }, null); })();
+                }] }, { type: i1$1__namespace.App }, { type: i1$1__namespace.AbstractDialogService }], null); })();
 
     class DependsonDirective {
         constructor(dialogId, dependson, dialogService, app) {
@@ -2487,18 +2500,18 @@
                 i0__namespace.ɵɵqueryRefresh(_t = i0__namespace.ɵɵloadQuery()) && (ctx.formChildren = _t);
             } } }); }
     }
-    (function () { (typeof ngDevMode === "undefined" || ngDevMode) && i0__namespace.ɵsetClassMetadata(DependsonDirective, [{
+    (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0__namespace.ɵsetClassMetadata(DependsonDirective, [{
             type: i0.Directive,
             args: [{
                     selector: '[dependson]'
                 }]
-        }], function () { return [{ type: undefined, decorators: [{
+        }], () => [{ type: undefined, decorators: [{
                     type: i0.Attribute,
                     args: ['dialogid']
                 }] }, { type: undefined, decorators: [{
                     type: i0.Attribute,
                     args: ['dependson']
-                }] }, { type: i1$1__namespace.AbstractDialogService }, { type: i1$1__namespace.App }]; }, { formChildren: [{
+                }] }, { type: i1$1__namespace.AbstractDialogService }, { type: i1$1__namespace.App }], { formChildren: [{
                 type: i0.ContentChildren,
                 args: [FormComponent, { descendants: true }]
             }] }); })();
@@ -2782,7 +2795,7 @@
                 orderBy: orderBy,
                 page: page,
                 pagesize: this.form.pagesize || 20,
-                skipDataSetUpdate: true,
+                skipDataSetUpdate: true, // dont update the actual variable dataset,
                 inFlightBehavior: 'executeAll'
             }).then(response => {
                 const data = response.data;
@@ -2811,7 +2824,7 @@
         // Calls the filter function if default values are present
         filterOnDefault() {
             /*Check if default value is present for any filter field*/
-            const defaultObj = _.find(this.form.formFields, obj => {
+            const defaultObj = lodashEs.find(this.form.formFields, obj => {
                 return i1$1.isDefined(obj.value) || i1$1.isDefined(obj.minValue) || i1$1.isDefined(obj.maxValue);
             });
             /*If default value exists and data is loaded, apply the filter*/
@@ -2826,17 +2839,17 @@
         static { this.ɵfac = function LiveFilterDirective_Factory(t) { return new (t || LiveFilterDirective)(i0__namespace.ɵɵdirectiveInject(FormComponent, 2)); }; }
         static { this.ɵdir = /*@__PURE__*/ i0__namespace.ɵɵdefineDirective({ type: LiveFilterDirective, selectors: [["", "wmLiveFilter", ""]] }); }
     }
-    (function () { (typeof ngDevMode === "undefined" || ngDevMode) && i0__namespace.ɵsetClassMetadata(LiveFilterDirective, [{
+    (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0__namespace.ɵsetClassMetadata(LiveFilterDirective, [{
             type: i0.Directive,
             args: [{
                     selector: '[wmLiveFilter]'
                 }]
-        }], function () { return [{ type: undefined, decorators: [{
+        }], () => [{ type: undefined, decorators: [{
                     type: i0.Self
                 }, {
                     type: i0.Inject,
                     args: [FormComponent]
-                }] }]; }, null); })();
+                }] }], null); })();
 
     const isTimeType = field => field.widgettype === i1$1.DataType.TIME || (field.type === i1$1.DataType.TIME && !field.widgettype);
     const getValidTime = val => {
@@ -2922,7 +2935,7 @@
             }
         }
         onDataSourceChange() {
-            if (_.get(this.form.formFields, 'length')) {
+            if (lodashEs.get(this.form.formFields, 'length')) {
                 this.form.isDataSourceUpdated = true;
             }
             const formFields = this.form.getFormFields();
@@ -2977,14 +2990,14 @@
             }
             formFields = formFields || this.form.formFields;
             formFields.forEach(field => {
-                const value = _.get(dataObj, field.key || field.name);
+                const value = lodashEs.get(dataObj, field.key || field.name);
                 if (isTimeType(field)) {
                     field.value = getValidTime(value);
                 }
                 else if (field.type === i1$1.DataType.BLOB) {
                     this.form.resetFileUploadWidget(field, true);
                     field.href = this.getBlobURL(dataObj, field.key, value);
-                    field.value = _.isString(value) ? '' : value;
+                    field.value = lodashEs.isString(value) ? '' : value;
                 }
                 else {
                     this.form.setFieldValue(field, dataObj);
@@ -3036,7 +3049,7 @@
             formFields = isPreviousData ? this.form.prevformFields : this.form.getFormFields();
             formFields.forEach(field => {
                 let dateTime, fieldValue;
-                const fieldTarget = _.split(field.key, '.');
+                const fieldTarget = lodashEs.split(field.key, '.');
                 const fieldName = fieldTarget[0] || field.key;
                 /*collect the values from the fields and construct the object*/
                 /*Format the output of date time widgets to the given output format*/
@@ -3097,7 +3110,7 @@
             /*If OperationType is not set then based on the formdata object return the operation type,
                 this case occurs only if the form is outside a livegrid*/
             /*If the formdata object has primary key value then return update else insert*/
-            if (this.form.primaryKey && !_.isEmpty(this.form.formdata)) {
+            if (this.form.primaryKey && !lodashEs.isEmpty(this.form.formdata)) {
                 /*If only one column is primary key*/
                 if (this.form.primaryKey.length === 1) {
                     if (this.form.formdata[this.form.primaryKey[0]]) {
@@ -3106,7 +3119,7 @@
                     /*If only no column is primary key*/
                 }
                 else if (this.form.primaryKey.length === 0) {
-                    _.forEach(this.form.formdata, (value) => {
+                    lodashEs.forEach(this.form.formdata, (value) => {
                         if (value) {
                             isPrimary = true;
                         }
@@ -3117,7 +3130,7 @@
                     /*If multiple columns are primary key*/
                 }
                 else {
-                    isPrimary = _.some(this.form.primaryKey, (primaryKey) => {
+                    isPrimary = lodashEs.some(this.form.primaryKey, (primaryKey) => {
                         if (this.form.formdata[primaryKey]) {
                             return true;
                         }
@@ -3130,7 +3143,7 @@
             return operation || i5.Live_Operations.INSERT;
         }
         getPrevDataValues() {
-            const prevDataValues = _.fromPairs(_.map(this.form.prevDataValues, (item) => {
+            const prevDataValues = lodashEs.fromPairs(lodashEs.map(this.form.prevDataValues, (item) => {
                 return [item.key, item.value];
             })); // Convert of array of values to an object
             this.form.formFields.forEach(field => {
@@ -3240,7 +3253,7 @@
             }
             // If operation is update, form is not touched and current data and previous data is same, Show no changes detected message
             if (this.form.operationType === i5.Live_Operations.UPDATE && this.form.ngform && this.form.ngform.pristine &&
-                (this.form.isSelected && _.isEqual(data, prevData))) {
+                (this.form.isSelected && lodashEs.isEqual(data, prevData))) {
                 this.form.toggleMessage(true, this.form.appLocale.MESSAGE_NO_CHANGES, 'info', '');
                 i1$1.$appDigest();
                 return;
@@ -3305,12 +3318,12 @@
                 i0__namespace.ɵɵlistener("keydown", function LiveFormDirective_keydown_HostBindingHandler($event) { return ctx.onKeydownHandler($event); });
             } } }); }
     }
-    (function () { (typeof ngDevMode === "undefined" || ngDevMode) && i0__namespace.ɵsetClassMetadata(LiveFormDirective, [{
+    (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0__namespace.ɵsetClassMetadata(LiveFormDirective, [{
             type: i0.Directive,
             args: [{
                     selector: '[wmLiveForm]'
                 }]
-        }], function () { return [{ type: undefined, decorators: [{
+        }], () => [{ type: undefined, decorators: [{
                     type: i0.Self
                 }, {
                     type: i0.Inject,
@@ -3320,7 +3333,7 @@
                 }] }, { type: i5__namespace.ToDatePipe }, { type: i1$1__namespace.AbstractDialogService }, { type: undefined, decorators: [{
                     type: i0.Attribute,
                     args: ['formlayout']
-                }] }]; }, { onKeydownHandler: [{
+                }] }], { onKeydownHandler: [{
                 type: i0.HostListener,
                 args: ['keydown', ['$event']]
             }] }); })();
@@ -3344,7 +3357,7 @@
                 i8.InputModule,
                 i5.WmComponentsModule] }); }
     }
-    (function () { (typeof ngDevMode === "undefined" || ngDevMode) && i0__namespace.ɵsetClassMetadata(FormModule, [{
+    (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0__namespace.ɵsetClassMetadata(FormModule, [{
             type: i0.NgModule,
             args: [{
                     imports: [