@churchillliving/se-ui-toolkit 6.53.471 → 6.53.472

package/bundles/churchillliving-se-ui-toolkit.umd.js

@@ -2531,11 +2531,11 @@
        * @param param
        * Receives lazy event and returns sort array
        */
-      GridService.prototype.getGridSorts = function (_h, columns) {
+      GridService.prototype.getGridSorts = function (_g, columns) {
           var _this = this;
-          var multiSortMeta = _h.multiSortMeta;
-          return (multiSortMeta || []).map(function (_h, i) {
-              var field = _h.field, order = _h.order;
+          var multiSortMeta = _g.multiSortMeta;
+          return (multiSortMeta || []).map(function (_g, i) {
+              var field = _g.field, order = _g.order;
               return ({
                   field: field,
                   direction: order > 0 ? exports.EGridSortDirection.ASC : exports.EGridSortDirection.DESC,
@@ -2552,11 +2552,11 @@
       GridService.prototype.mapFilters = function (event, columns) {
           var _this = this;
           var filters = [];
-          Object.entries(event.filters).forEach(function (_h) {
-              var _j = __read(_h, 2), field = _j[0], value = _j[1];
+          Object.entries(event.filters).forEach(function (_g) {
+              var _h = __read(_g, 2), field = _h[0], value = _h[1];
               if (Array.isArray(value)) {
-                  value.forEach(function (_h) {
-                      var matchMode = _h.matchMode, operator = _h.operator, filter = _h.value;
+                  value.forEach(function (_g) {
+                      var matchMode = _g.matchMode, operator = _g.operator, filter = _g.value;
                       if (filter !== null) {
                           filters.push({
                               field: field,
@@ -2646,25 +2646,13 @@
       GridService.prototype.setRowValue = function (rowData) {
           var _a;
           (_a = Object.keys(rowData)) === null || _a === void 0 ? void 0 : _a.forEach(function (row) {
-              var _a, _b, _c, _d, _e;
+              var rowObj = row + '_obj';
               if (row === exports.EGridRowAction.DELETEBTN || row === exports.EGridRowAction.EDITBTN) {
                   delete rowData[row];
               }
-              else if (rowData[row] &&
-                  typeof (rowData[row]) === 'object') {
-                  if ((_b = (_a = rowData[row]) === null || _a === void 0 ? void 0 : _a.action) === null || _b === void 0 ? void 0 : _b.field) {
-                      if ((_c = rowData[row]) === null || _c === void 0 ? void 0 : _c.extraField) {
-                          delete rowData[row];
-                      }
-                      else {
-                          rowData[row] = (_d = rowData[row]) === null || _d === void 0 ? void 0 : _d.text;
-                      }
-                  }
-                  else {
-                      if (rowData[row].hasOwnProperty('text') && rowData[row].hasOwnProperty('value')) {
-                          rowData[row] = (_e = rowData[row]) === null || _e === void 0 ? void 0 : _e.value;
-                      }
-                  }
+              else if (rowData[rowObj] &&
+                  typeof (rowData[rowObj]) === 'object') {
+                  delete rowData[rowObj];
               }
           });
           return rowData;
@@ -2960,7 +2948,7 @@
           this.requestService
               .get('/Data/Fetch', { uniqueKey: uniqueKey, filters: filters })
               .subscribe(function (response) {
-              var _h;
+              var _g;
               var _a;
               if (search) {
                   var existInRecord = (_a = response.records) === null || _a === void 0 ? void 0 : _a.some(function (record) {
@@ -2970,7 +2958,7 @@
                               (search === null || search === void 0 ? void 0 : search.toLowerCase());
                   });
                   if (!existInRecord) {
-                      response.records.unshift((_h = {}, _h[column.displayField] = search, _h));
+                      response.records.unshift((_g = {}, _g[column.displayField] = search, _g));
                   }
               }
               column.data = _this.setDataFields(response.records);
@@ -2980,7 +2968,7 @@
           var _a, _b;
           return __awaiter(this, void 0, void 0, function () {
               var newValue, i;
-              return __generator(this, function (_h) {
+              return __generator(this, function (_g) {
                   newValue = {};
                   for (i = 0; i < uniqueKey.values.length; i++) {
                       if (uniqueKey.values[i].name.toLowerCase() == ((_a = column.field) === null || _a === void 0 ? void 0 : _a.toLowerCase()) || uniqueKey.values[i].name.toLowerCase() == ((_b = column.displayField) === null || _b === void 0 ? void 0 : _b.toLowerCase())) {
@@ -2993,8 +2981,8 @@
                   this.requestService
                       .get('/Data/Save', { uniqueKey: uniqueKey.name, values: newValue })
                       .subscribe(function (response) {
-                      (function (_h) {
-                          var error = _h.error;
+                      (function (_g) {
+                          var error = _g.error;
                           return error;
                       });
                       return 'success';
@@ -3205,8 +3193,8 @@
                               : res[field.toLowerCase()];
                       }
                   }
-              }, function (_h) {
-                  var error = _h.error;
+              }, function (_g) {
+                  var error = _g.error;
                   _this.alertService.apiError(error);
               });
           }
@@ -3254,9 +3242,10 @@
               data.forEach(function (row) {
                   newRow = Object.assign({}, row);
                   columns.forEach(function (col) {
+                      var _a;
                       var keys = Object.keys(row);
                       if (col.type === exports.EGridColumnType.DIALOG) {
-                          var field = col.field + '_obj';
+                          var field = ((_a = col.field) === null || _a === void 0 ? void 0 : _a.toLowerCase()) + '_obj';
                           newRow[field] = Object.assign({}, col);
                           newRow[field].displayText = col.displayText
                               ? row[col.displayText.toLowerCase()]
@@ -3266,6 +3255,7 @@
                           }
                       }
                       linksResponse.forEach(function (linkResponse) {
+                          var _a;
                           if ((col.type === exports.EGridColumnType.LINK ||
                               col.type === exports.EGridColumnType.IFRAME ||
                               col.type === exports.EGridColumnType.LOOKUP_INPUT) &&
@@ -3274,7 +3264,7 @@
                               col.linkId === linkResponse.linkId) {
                               var paramKeys = Object.keys(col.params);
                               var link = setHyperlink(keys, row, linkResponse.url, paramKeys, col.params);
-                              var field = col.field + '_obj';
+                              var field = ((_a = col.field) === null || _a === void 0 ? void 0 : _a.toLowerCase()) + '_obj';
                               newRow[field] = Object.assign({}, col);
                               newRow[field].hyperlink = link;
                               newRow[field].displayText = col.displayText
@@ -3422,8 +3412,8 @@
                   var _a, _b, _c;
                   if (((_a = Object.keys(x !== null && x !== void 0 ? x : {})) === null || _a === void 0 ? void 0 : _a.length) > 0) {
                       var result = (_b = Object.keys(x)) === null || _b === void 0 ? void 0 : _b.reduce(function (prev, current) {
-                          var _h;
-                          return (Object.assign(Object.assign({}, prev), (_h = {}, _h[current.toLowerCase()] = x[current], _h)));
+                          var _g;
+                          return (Object.assign(Object.assign({}, prev), (_g = {}, _g[current.toLowerCase()] = x[current], _g)));
                       }, {});
                       if (dataKey &&
                           dataKey.length > 0 &&
@@ -3534,31 +3524,28 @@
       GridService.prototype.setGridRowPropValue = function (row, props, columns) {
           if (columns === void 0) { columns = []; }
           props === null || props === void 0 ? void 0 : props.forEach(function (prop) {
-              var _h, _j, _k, _l, _m;
-              var _a, _b, _c, _d, _e, _f, _g;
+              var _g, _h, _j, _k;
+              var _a, _b, _c, _d;
               if (prop.propName && (prop.propValue || prop.propValue === false || prop.propValue === '')) {
                   if (prop.field) {
                       var fieldName = (_a = Object.keys(row)) === null || _a === void 0 ? void 0 : _a.find(function (key) { var _a; return (key === null || key === void 0 ? void 0 : key.toLowerCase()) === ((_a = prop === null || prop === void 0 ? void 0 : prop.field) === null || _a === void 0 ? void 0 : _a.toLowerCase()); });
-                      var fieldNameObj = fieldName + '_obj';
+                      var fieldNameObj = (fieldName === null || fieldName === void 0 ? void 0 : fieldName.toLowerCase()) + '_obj';
                       if (fieldName) {
-                          if (((_b = Object.keys(row)) === null || _b === void 0 ? void 0 : _b.includes(fieldNameObj)) && !((_c = row[fieldNameObj]) === null || _c === void 0 ? void 0 : _c.action)) {
-                              row[fieldNameObj] = Object.assign(Object.assign({}, row[fieldNameObj]), { text: row[fieldName], action: (_h = {}, _h[prop.propName] = prop.propValue, _h) });
-                          }
-                          else if ((_d = row[fieldNameObj]) === null || _d === void 0 ? void 0 : _d.action) {
-                              row[fieldNameObj].action = Object.assign((_e = row[fieldNameObj]) === null || _e === void 0 ? void 0 : _e.action, (_j = {}, _j[prop.propName] = prop.propValue, _j));
+                          if ((_b = Object.keys(row)) === null || _b === void 0 ? void 0 : _b.includes(fieldNameObj)) {
+                              row[fieldNameObj] = Object.assign(Object.assign({}, row[fieldNameObj]), (_g = { text: row[fieldName] }, _g[prop.propName] = prop.propValue, _g));
                           }
                           else {
-                              row[fieldNameObj] = { text: row[fieldName], action: (_k = {}, _k[prop.propName] = prop.propValue, _k) };
+                              row[fieldNameObj] = Object.assign(Object.assign({}, row[fieldName]), (_h = { text: row[fieldName] }, _h[prop.propName] = prop.propValue, _h));
                           }
                       }
                       else if (columns === null || columns === void 0 ? void 0 : columns.some(function (column) { var _a, _b; return ((_a = column.field) === null || _a === void 0 ? void 0 : _a.toLowerCase()) === ((_b = prop === null || prop === void 0 ? void 0 : prop.field) === null || _b === void 0 ? void 0 : _b.toLowerCase()); })) {
-                          var propField = (_f = prop.field) === null || _f === void 0 ? void 0 : _f.toLowerCase();
+                          var propField = (_c = prop.field) === null || _c === void 0 ? void 0 : _c.toLowerCase();
                           var propFieldObj = propField + '_obj';
-                          if ((_g = Object.keys(row)) === null || _g === void 0 ? void 0 : _g.includes(fieldNameObj)) {
-                              row[propFieldObj] = Object.assign(Object.assign({}, row[propFieldObj]), { text: row[prop.field], extraField: true, action: (_l = {}, _l[prop.propName] = prop.propValue, _l) });
+                          if ((_d = Object.keys(row)) === null || _d === void 0 ? void 0 : _d.includes(fieldNameObj)) {
+                              row[propFieldObj] = Object.assign(Object.assign({}, row[propFieldObj]), (_j = { text: row[prop.field] }, _j[prop.propName] = prop.propValue, _j));
                           }
                           else {
-                              row[propFieldObj] = { text: row[prop.field], extraField: true, action: (_m = {}, _m[prop.propName] = prop.propValue, _m) };
+                              row[propFieldObj] = Object.assign(Object.assign({}, row[propField]), (_k = { text: row[prop.field] }, _k[prop.propName] = prop.propValue, _k));
                           }
                       }
                       ;
@@ -4233,11 +4220,7 @@
                           }
                           else if (!column.minutesInterval) {
                               _this.rowsData.forEach(function (row) {
-                                  var _a;
-                                  if (row[column.field + '_obj'] && row[column.field + '_obj'].action) {
-                                      row[column.field] = new Date((_a = row[column.field + '_obj']) === null || _a === void 0 ? void 0 : _a.text);
-                                  }
-                                  else if (row[column.field]) {
+                                  if (row[column.field]) {
                                       row[column.field] = new Date(row[column.field]);
                                   }
                               });
@@ -4247,13 +4230,6 @@
                       if (column.filter && column.filterValue && column.filtering !== false) {
                           _this.setFilterFocusOut(column);
                       }
-                      // add "flex-shrink: 0" for flex-basis Style
-                      // if (column.style && column.style.includes('flex-basis')) {
-                      //   let style = column.style + ' !important; flex-shrink: 0 !important';
-                      //   column.style = style.includes(';;')
-                      //     ? style.replace(';;', ';')
-                      //     : style;
-                      // }
                       // set DisplayText when value is in curly brackets.
                       _this.setDisplayTextValue(column);
                       //Aggregate scenario
@@ -4296,28 +4272,28 @@
                           _this.rowsData &&
                           _this.rowsData.length > 0) {
                           _this.rowsData.forEach(function (row) {
-                              var _45, _46, _47;
+                              var _32, _33, _34;
                               var _a, _b, _c, _d, _e, _f, _g, _h;
                               // convert string that contains comma into arrays
                               if ((_a = row[column.field]) === null || _a === void 0 ? void 0 : _a.toString().includes(';')) {
                                   row[column.field] = (_c = (_b = row[column.field]) === null || _b === void 0 ? void 0 : _b.toString().split(';')) === null || _c === void 0 ? void 0 : _c.map(function (value) {
-                                      var _45;
+                                      var _32;
                                       var _a, _b, _c;
-                                      return (_45 = {}, _45[(_a = column.displayField) === null || _a === void 0 ? void 0 : _a.toLowerCase()] = row[column.displayField], _45[(_b = column.optionLabel) === null || _b === void 0 ? void 0 : _b.toLowerCase()] = value, _45[(_c = column.field) === null || _c === void 0 ? void 0 : _c.toLowerCase()] = value, _45);
+                                      return (_32 = {}, _32[(_a = column.displayField) === null || _a === void 0 ? void 0 : _a.toLowerCase()] = row[column.displayField], _32[(_b = column.optionLabel) === null || _b === void 0 ? void 0 : _b.toLowerCase()] = value, _32[(_c = column.field) === null || _c === void 0 ? void 0 : _c.toLowerCase()] = value, _32);
                                   });
                               }
                               var key = Object.keys(row).find(function (x) { return x === column.field.toLowerCase(); });
                               // convert simple string into array
                               if (!Array.isArray(row[key]) && row[key]) {
                                   if (column.displayField) {
-                                      row[key] = [(_45 = {}, _45[(_d = column.displayField) === null || _d === void 0 ? void 0 : _d.toLowerCase()] = row[column.displayField], _45[(_e = column.field) === null || _e === void 0 ? void 0 : _e.toLowerCase()] = row[key], _45)];
+                                      row[key] = [(_32 = {}, _32[(_d = column.displayField) === null || _d === void 0 ? void 0 : _d.toLowerCase()] = row[column.displayField], _32[(_e = column.field) === null || _e === void 0 ? void 0 : _e.toLowerCase()] = row[key], _32)];
                                   }
                                   else {
                                       if (column.optionLabel) {
-                                          row[key] = [(_46 = {}, _46[(_f = column.field) === null || _f === void 0 ? void 0 : _f.toLowerCase()] = row[key], _46[(_g = column.optionLabel) === null || _g === void 0 ? void 0 : _g.toLowerCase()] = row[key], _46)];
+                                          row[key] = [(_33 = {}, _33[(_f = column.field) === null || _f === void 0 ? void 0 : _f.toLowerCase()] = row[key], _33[(_g = column.optionLabel) === null || _g === void 0 ? void 0 : _g.toLowerCase()] = row[key], _33)];
                                       }
                                       else {
-                                          row[key] = [(_47 = {}, _47[(_h = column.field) === null || _h === void 0 ? void 0 : _h.toLowerCase()] = row[key], _47)];
+                                          row[key] = [(_34 = {}, _34[(_h = column.field) === null || _h === void 0 ? void 0 : _h.toLowerCase()] = row[key], _34)];
                                       }
                                   }
                               }
@@ -4381,15 +4357,15 @@
           this.isCheckBoxChangeEventCalled = false;
       };
       GridComponent.prototype.autoCompleteSelectedValue = function (row, column, value) {
-          var _45;
+          var _32;
           var _a, _b, _c, _d;
           if (column.optionLabel) {
               var valueKey = column.optionValue ? column.optionValue : column.field;
-              row[column.field] = __spreadArray(__spreadArray([], __read(row[column.field])), [(_45 = {},
-                      _45[(_a = column.optionLabel) === null || _a === void 0 ? void 0 : _a.toLowerCase()] = value[(_b = column.optionLabel) === null || _b === void 0 ? void 0 : _b.toLowerCase()],
-                      _45[valueKey === null || valueKey === void 0 ? void 0 : valueKey.toLowerCase()] = value[valueKey === null || valueKey === void 0 ? void 0 : valueKey.toLowerCase()],
-                      _45[(_c = column.field) === null || _c === void 0 ? void 0 : _c.toLowerCase()] = value[valueKey === null || valueKey === void 0 ? void 0 : valueKey.toLowerCase()],
-                      _45)]);
+              row[column.field] = __spreadArray(__spreadArray([], __read(row[column.field])), [(_32 = {},
+                      _32[(_a = column.optionLabel) === null || _a === void 0 ? void 0 : _a.toLowerCase()] = value[(_b = column.optionLabel) === null || _b === void 0 ? void 0 : _b.toLowerCase()],
+                      _32[valueKey === null || valueKey === void 0 ? void 0 : valueKey.toLowerCase()] = value[valueKey === null || valueKey === void 0 ? void 0 : valueKey.toLowerCase()],
+                      _32[(_c = column.field) === null || _c === void 0 ? void 0 : _c.toLowerCase()] = value[valueKey === null || valueKey === void 0 ? void 0 : valueKey.toLowerCase()],
+                      _32)]);
               var index = (_d = row[column.field]) === null || _d === void 0 ? void 0 : _d.findIndex(function (x) { return JSON.stringify(x) === JSON.stringify(value); });
               row[column.field].splice(index, 1);
           }
@@ -4429,29 +4405,29 @@
       };
       // set the format of currency && number && decimal && percent
       GridComponent.prototype.setNumericFormat = function (column, row) {
-          var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w;
+          var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s;
           row = objConvertToLower(row);
-          var value = ((_b = (_a = row[column.field + '_obj']) === null || _a === void 0 ? void 0 : _a.action) === null || _b === void 0 ? void 0 : _b.displayText)
-              ? (_d = (_c = row[column.field + '_obj']) === null || _c === void 0 ? void 0 : _c.action) === null || _d === void 0 ? void 0 : _d.displayText
-              : ((_g = (_f = (_e = row[column.field + '_obj']) === null || _e === void 0 ? void 0 : _e.action) === null || _f === void 0 ? void 0 : _f.displayField) === null || _g === void 0 ? void 0 : _g.toLowerCase())
-                  ? row[(_k = (_j = (_h = row[column.field + '_obj']) === null || _h === void 0 ? void 0 : _h.action) === null || _j === void 0 ? void 0 : _j.displayField) === null || _k === void 0 ? void 0 : _k.toLowerCase()]
-                  : row[(_l = column.displayField) === null || _l === void 0 ? void 0 : _l.toLowerCase()]
+          var value = ((_a = row[column.field + '_obj']) === null || _a === void 0 ? void 0 : _a.displayText)
+              ? (_b = row[column.field + '_obj']) === null || _b === void 0 ? void 0 : _b.displayText
+              : ((_d = (_c = row[column.field + '_obj']) === null || _c === void 0 ? void 0 : _c.displayField) === null || _d === void 0 ? void 0 : _d.toLowerCase())
+                  ? row[(_f = (_e = row[column.field + '_obj']) === null || _e === void 0 ? void 0 : _e.displayField) === null || _f === void 0 ? void 0 : _f.toLowerCase()]
+                  : row[(_g = column.displayField) === null || _g === void 0 ? void 0 : _g.toLowerCase()]
                       ? row[column.displayField.toLowerCase()]
-                      : (((_o = row[((_m = column.field) === null || _m === void 0 ? void 0 : _m.toLowerCase()) + '_obj']) === null || _o === void 0 ? void 0 : _o.text) || ((_q = row[((_p = column.field) === null || _p === void 0 ? void 0 : _p.toLowerCase()) + '_obj']) === null || _q === void 0 ? void 0 : _q.text) === 0 || ((_s = row[((_r = column.field) === null || _r === void 0 ? void 0 : _r.toLowerCase()) + '_obj']) === null || _s === void 0 ? void 0 : _s.text) === null)
-                          ? (_t = row[column.field.toLowerCase() + '_obj']) === null || _t === void 0 ? void 0 : _t.text : row[column.field.toLowerCase()];
+                      : (((_j = row[((_h = column.field) === null || _h === void 0 ? void 0 : _h.toLowerCase()) + '_obj']) === null || _j === void 0 ? void 0 : _j.text) || ((_l = row[((_k = column.field) === null || _k === void 0 ? void 0 : _k.toLowerCase()) + '_obj']) === null || _l === void 0 ? void 0 : _l.text) === 0 || ((_o = row[((_m = column.field) === null || _m === void 0 ? void 0 : _m.toLowerCase()) + '_obj']) === null || _o === void 0 ? void 0 : _o.text) === null)
+                          ? (_p = row[column.field.toLowerCase() + '_obj']) === null || _p === void 0 ? void 0 : _p.text : row[column.field.toLowerCase()];
           if (this.typeOf(value) === 'number' && value === 0) {
               value = value.toString();
           }
-          var formatParams = (_u = column.format) === null || _u === void 0 ? void 0 : _u.formatParams;
+          var formatParams = (_q = column.format) === null || _q === void 0 ? void 0 : _q.formatParams;
           var digitsInfo = formatParams === null || formatParams === void 0 ? void 0 : formatParams.digitsInfo;
           if (column.format && value) {
-              switch ((_v = column.format) === null || _v === void 0 ? void 0 : _v.type) {
+              switch ((_r = column.format) === null || _r === void 0 ? void 0 : _r.type) {
                   case exports.EGridFormatType.CURRENCY:
-                      value = (_w = new Intl.NumberFormat((formatParams === null || formatParams === void 0 ? void 0 : formatParams.locale) ? formatParams.locale : 'en-US', {
+                      value = (_s = new Intl.NumberFormat((formatParams === null || formatParams === void 0 ? void 0 : formatParams.locale) ? formatParams.locale : 'en-US', {
                           style: 'currency',
                           currency: (formatParams === null || formatParams === void 0 ? void 0 : formatParams.currency) ? formatParams.currency : 'USD',
                           minimumFractionDigits: digitsInfo ? digitsInfo : '2',
-                      })) === null || _w === void 0 ? void 0 : _w.format(value);
+                      })) === null || _s === void 0 ? void 0 : _s.format(value);
                       break;
                   case exports.EGridFormatType.DECIMAL:
                       value = parseFloat(value).toFixed(digitsInfo ? digitsInfo : '2');
@@ -4637,7 +4613,7 @@
           var _a;
           var isDisabled = column.disabled
               ? true
-              : ((_a = row[column.field + '_obj']) === null || _a === void 0 ? void 0 : _a.action) && row[column.field + '_obj'].action.disabled
+              : ((_a = row[column.field + '_obj']) === null || _a === void 0 ? void 0 : _a.disabled)
                   ? true
                   : false;
           this.onClickEvent(column, row);
@@ -4687,19 +4663,19 @@
           return selectedValue;
       };
       GridComponent.prototype.setTextBoxReadOnlyValue = function (row, column) {
-          var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k;
+          var _a, _b, _c, _d, _e, _f;
           var value;
           if (column.displayText) {
               value = column.displayText;
           }
-          else if ((_b = (_a = row[column.field + '_obj']) === null || _a === void 0 ? void 0 : _a.action) === null || _b === void 0 ? void 0 : _b.displayText) {
-              value = (_d = (_c = row[column.field + '_obj']) === null || _c === void 0 ? void 0 : _c.action) === null || _d === void 0 ? void 0 : _d.displayText;
+          else if ((_a = row[column.field + '_obj']) === null || _a === void 0 ? void 0 : _a.displayText) {
+              value = (_b = row[column.field + '_obj']) === null || _b === void 0 ? void 0 : _b.displayText;
           }
-          else if ((_f = (_e = row[column.field + '_obj']) === null || _e === void 0 ? void 0 : _e.action) === null || _f === void 0 ? void 0 : _f.displayField) {
-              value = row[(_j = (_h = (_g = row[column.field + '_obj']) === null || _g === void 0 ? void 0 : _g.action) === null || _h === void 0 ? void 0 : _h.displayField) === null || _j === void 0 ? void 0 : _j.toLowerCase()];
+          else if ((_c = row[column.field + '_obj']) === null || _c === void 0 ? void 0 : _c.displayField) {
+              value = row[(_e = (_d = row[column.field + '_obj']) === null || _d === void 0 ? void 0 : _d.displayField) === null || _e === void 0 ? void 0 : _e.toLowerCase()];
           }
           else if (column.displayField) {
-              value = row[(_k = column.displayField) === null || _k === void 0 ? void 0 : _k.toLowerCase()];
+              value = row[(_f = column.displayField) === null || _f === void 0 ? void 0 : _f.toLowerCase()];
           }
           else {
               value = row[column.field];
@@ -4710,17 +4686,17 @@
        * return conditional base value and title
        */
       GridComponent.prototype.setConditionBaseValue = function (row, column) {
-          var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y, _z, _0, _1, _2;
+          var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t;
           delete row['undefined'];
           var value;
           if (column.type == exports.EGridColumnType.DATE) {
               var newValue = void 0;
-              if (typeof (row[column.field + '_obj']) === "object" && ((_a = row[column.field + '_obj']) === null || _a === void 0 ? void 0 : _a.action)) {
-                  newValue = ((_c = (_b = row[column.field + '_obj']) === null || _b === void 0 ? void 0 : _b.action) === null || _c === void 0 ? void 0 : _c.displayText)
-                      ? (_e = (_d = row[column.field + '_obj']) === null || _d === void 0 ? void 0 : _d.action) === null || _e === void 0 ? void 0 : _e.displayText
-                      : ((_h = (_g = (_f = row[column.field + '_obj']) === null || _f === void 0 ? void 0 : _f.action) === null || _g === void 0 ? void 0 : _g.displayField) === null || _h === void 0 ? void 0 : _h.toLowerCase())
-                          ? row[(_l = (_k = (_j = row[column.field + '_obj']) === null || _j === void 0 ? void 0 : _j.action) === null || _k === void 0 ? void 0 : _k.displayField) === null || _l === void 0 ? void 0 : _l.toLowerCase()]
-                          : (_o = row[((_m = column.field) === null || _m === void 0 ? void 0 : _m.toLowerCase()) + '_obj']) === null || _o === void 0 ? void 0 : _o.text;
+              if (typeof (row[column.field + '_obj']) === "object" && row[column.field + '_obj']) {
+                  newValue = ((_a = row[column.field + '_obj']) === null || _a === void 0 ? void 0 : _a.displayText)
+                      ? (_b = row[column.field + '_obj']) === null || _b === void 0 ? void 0 : _b.displayText
+                      : ((_d = (_c = row[column.field + '_obj']) === null || _c === void 0 ? void 0 : _c.displayField) === null || _d === void 0 ? void 0 : _d.toLowerCase())
+                          ? row[(_f = (_e = row[column.field + '_obj']) === null || _e === void 0 ? void 0 : _e.displayField) === null || _f === void 0 ? void 0 : _f.toLowerCase()]
+                          : (_h = row[((_g = column.field) === null || _g === void 0 ? void 0 : _g.toLowerCase()) + '_obj']) === null || _h === void 0 ? void 0 : _h.text;
               }
               else {
                   newValue = row[column.field];
@@ -4736,17 +4712,17 @@
               }
           }
           else {
-              value = ((_q = (_p = row[column.field + '_obj']) === null || _p === void 0 ? void 0 : _p.action) === null || _q === void 0 ? void 0 : _q.displayText)
-                  ? (_s = (_r = row[column.field + '_obj']) === null || _r === void 0 ? void 0 : _r.action) === null || _s === void 0 ? void 0 : _s.displayText
-                  : ((_v = (_u = (_t = row[column.field + '_obj']) === null || _t === void 0 ? void 0 : _t.action) === null || _u === void 0 ? void 0 : _u.displayField) === null || _v === void 0 ? void 0 : _v.toLowerCase())
-                      ? row[(_y = (_x = (_w = row[column.field + '_obj']) === null || _w === void 0 ? void 0 : _w.action) === null || _x === void 0 ? void 0 : _x.displayField) === null || _y === void 0 ? void 0 : _y.toLowerCase()]
-                      : row[(_z = column.displayField) === null || _z === void 0 ? void 0 : _z.toLowerCase()]
-                          ? row[(_0 = column.displayField) === null || _0 === void 0 ? void 0 : _0.toLowerCase()]
+              value = ((_j = row[column.field + '_obj']) === null || _j === void 0 ? void 0 : _j.displayText)
+                  ? (_k = row[column.field + '_obj']) === null || _k === void 0 ? void 0 : _k.displayText
+                  : ((_m = (_l = row[column.field + '_obj']) === null || _l === void 0 ? void 0 : _l.displayField) === null || _m === void 0 ? void 0 : _m.toLowerCase())
+                      ? row[(_p = (_o = row[column.field + '_obj']) === null || _o === void 0 ? void 0 : _o.displayField) === null || _p === void 0 ? void 0 : _p.toLowerCase()]
+                      : row[(_q = column.displayField) === null || _q === void 0 ? void 0 : _q.toLowerCase()]
+                          ? row[(_r = column.displayField) === null || _r === void 0 ? void 0 : _r.toLowerCase()]
                           : row[column.field + '_obj'] &&
                               row[column.field + '_obj'].displayText === null
                               ? ''
-                              : ((_1 = row[column.field + '_obj']) === null || _1 === void 0 ? void 0 : _1.displayText)
-                                  ? ((_2 = column === null || column === void 0 ? void 0 : column.filter) === null || _2 === void 0 ? void 0 : _2.type) === 'calendar' && column.timeOnly && column.type === exports.EGridColumnType.DIALOG ?
+                              : ((_s = row[column.field + '_obj']) === null || _s === void 0 ? void 0 : _s.displayText)
+                                  ? ((_t = column === null || column === void 0 ? void 0 : column.filter) === null || _t === void 0 ? void 0 : _t.type) === 'calendar' && column.timeOnly && column.type === exports.EGridColumnType.DIALOG ?
                                       (row[column.field + '_obj'].displayText.toString().includes('AM') || row[column.field + '_obj'].displayText.toString().includes('PM')) ?
                                           row[column.field + '_obj'].displayText : this.datePipe.transform(row[column.field + '_obj'].displayText, 'hh:mm a')
                                       : column.format ? this.datePipe.transform(row[column.field + '_obj'].displayText, this.setFormat(column)) : row[column.field + '_obj'].displayText
@@ -4919,10 +4895,10 @@
           var _this = this;
           this.refreshGridTerminator();
           var selectedRow = Object.assign({}, row);
-          Object.entries(selectedRow).forEach(function (_45) {
-              var _46 = __read(_45, 2), key = _46[0], value = _46[1];
+          Object.entries(selectedRow).forEach(function (_32) {
+              var _33 = __read(_32, 2), key = _33[0], value = _33[1];
               _this.columns.forEach(function (col) {
-                  var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o;
+                  var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l;
                   if (_this.setDropdownFilter) {
                       _this.setDropdownFilterValue(col, row, key);
                       _this.setDropdownFilter = false;
@@ -4942,8 +4918,8 @@
                       var newValue = value.map(function (x) { return x[col.displayField]; });
                       if ((_b = newValue === null || newValue === void 0 ? void 0 : newValue.toString()) === null || _b === void 0 ? void 0 : _b.includes(';')) {
                           row[col.field] = (_e = (_d = (_c = newValue === null || newValue === void 0 ? void 0 : newValue.toString()) === null || _c === void 0 ? void 0 : _c.replaceAll(';', ',')) === null || _d === void 0 ? void 0 : _d.split(',')) === null || _e === void 0 ? void 0 : _e.map(function (x) {
-                              var _45;
-                              return (_45 = {}, _45[col.displayField ? col.displayField : col.field] = x, _45[col.field + '_temp'] = value[0][col.field], _45);
+                              var _32;
+                              return (_32 = {}, _32[col.displayField ? col.displayField : col.field] = x, _32[col.field + '_temp'] = value[0][col.field], _32);
                           });
                       }
                   }
@@ -4964,9 +4940,8 @@
                   }
                   if (((_g = col.field) === null || _g === void 0 ? void 0 : _g.toLowerCase()) === (key === null || key === void 0 ? void 0 : key.toLowerCase()) &&
                       col.type === exports.EGridColumnType.DATE) {
-                      value = (value === null || value === void 0 ? void 0 : value.action) ? value.text : value;
                       if (row[col.field] !== null) {
-                          if (((_h = row[key + '_obj']) === null || _h === void 0 ? void 0 : _h.action) && ((_k = Object.keys((_j = row[key + '_obj']) === null || _j === void 0 ? void 0 : _j.action)) === null || _k === void 0 ? void 0 : _k.length) > 0) {
+                          if (row[key + '_obj'] && ((_h = Object.keys(row[key + '_obj'])) === null || _h === void 0 ? void 0 : _h.length) > 0) {
                               row[key + '_obj'].text = new Date(value);
                           }
                           else {
@@ -4981,7 +4956,7 @@
                       }
                   }
                   if (col.type === exports.EGridColumnType.DIALOG &&
-                      ((_l = col.filter) === null || _l === void 0 ? void 0 : _l.type) === 'calendar' &&
+                      ((_j = col.filter) === null || _j === void 0 ? void 0 : _j.type) === 'calendar' &&
                       col.field.toLowerCase() === key.toLowerCase()) {
                       if (value === null) {
                           row[key] = new Date();
@@ -4991,10 +4966,10 @@
                       }
                   }
                   if (col.type === exports.EGridColumnType.LINK &&
-                      ((_m = col.field) === null || _m === void 0 ? void 0 : _m.toLowerCase()) === (key === null || key === void 0 ? void 0 : key.toLowerCase()) &&
+                      ((_k = col.field) === null || _k === void 0 ? void 0 : _k.toLowerCase()) === (key === null || key === void 0 ? void 0 : key.toLowerCase()) &&
                       (col.allowSave === true || col.allowSave === undefined)) {
                       if (col.editLink === true) {
-                          row[key] = (_o = row[col.field + '_obj']) === null || _o === void 0 ? void 0 : _o.hyperlink;
+                          row[key] = (_l = row[col.field + '_obj']) === null || _l === void 0 ? void 0 : _l.hyperlink;
                       }
                       else if (col.editLink === false || col.editLink === undefined) {
                           row[key] = value;
@@ -5062,7 +5037,7 @@
           var automCompleteTempData = [];
           var lookupInfo = {};
           this.selectedColumns.forEach(function (column) {
-              var _45;
+              var _32;
               var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m;
               delete selectedRow[column.field + '-data'];
               delete selectedRow[column.field + '_secondType'];
@@ -5078,7 +5053,7 @@
                   else if (column.formatter === 'numeric') {
                       value = value === true ? '1' : '0';
                   }
-                  selectedRow = Object.assign(Object.assign({}, selectedRow), (_45 = {}, _45[column.field] = value, _45));
+                  selectedRow = Object.assign(Object.assign({}, selectedRow), (_32 = {}, _32[column.field] = value, _32));
               }
               //convert date into time format
               if (column.type === exports.EGridColumnType.DATE) {
@@ -5125,11 +5100,11 @@
           var row = Object.assign({}, selectedRow);
           var keys = Object.keys(row);
           keys.forEach(function (key) {
-              var _45;
+              var _32;
               if (key.includes('_obj')) {
                   var obj_1 = row[key];
                   if (_this.checkAction === false && (obj_1 === null || obj_1 === void 0 ? void 0 : obj_1.type) && (obj_1.type === 'link' || obj_1.type === 'iframe' || obj_1.type === 'dialog')) {
-                      row = Object.assign(Object.assign({}, row), (_45 = {}, _45[key.split('_')[0]] = row[key].displayText, _45));
+                      row = Object.assign(Object.assign({}, row), (_32 = {}, _32[key.split('_')[0]] = row[key].displayText, _32));
                       _this.checkAction = true;
                   }
                   if (obj_1 &&
@@ -5393,11 +5368,10 @@
        * To set disabled the control
        */
       GridComponent.prototype.allowDisabled = function (column, row) {
-          var _a, _b, _c, _d, _e;
+          var _a, _b;
           var value = false;
-          if (typeof (row[column.field + '_obj']) === 'object' && ((_a = row[column.field + '_obj']) === null || _a === void 0 ? void 0 : _a.action)) {
-              if (((_b = row[column.field + '_obj']) === null || _b === void 0 ? void 0 : _b.action) &&
-                  ((_c = Object.keys(row[column.field + '_obj'].action)) === null || _c === void 0 ? void 0 : _c.includes('disabled')) && ((_e = (_d = row[column.field + '_obj']) === null || _d === void 0 ? void 0 : _d.action) === null || _e === void 0 ? void 0 : _e.disabled) === true) {
+          if (row[column.field + '_obj'] && typeof (row[column.field + '_obj']) === 'object') {
+              if (((_a = Object.keys(row[column.field + '_obj'])) === null || _a === void 0 ? void 0 : _a.includes('disabled')) && ((_b = row[column.field + '_obj']) === null || _b === void 0 ? void 0 : _b.disabled) === true) {
                   value = true;
               }
           }
@@ -5671,20 +5645,20 @@
        */
       GridComponent.prototype.openLookupDialog = function (column, row) {
           if (row === void 0) { row = {}; }
-          var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y, _z, _0, _1, _2, _3, _4, _5, _6, _7, _8, _9, _10, _11, _12, _13, _14, _15, _16, _17, _18, _19, _20, _21, _22, _23, _24, _25, _26, _27, _28, _29, _30, _31, _32, _33, _34, _35, _36, _37, _38, _39, _40, _41, _42, _43, _44;
+          var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y, _z, _0, _1, _2, _3, _4, _5, _6, _7, _8, _9, _10, _11, _12, _13, _14, _15, _16, _17, _18, _19, _20, _21, _22, _23, _24, _25, _26, _27, _28, _29, _30, _31;
           var columnData = ((_b = (_a = column.column) === null || _a === void 0 ? void 0 : _a.lookupControl) === null || _b === void 0 ? void 0 : _b.data) ? column.column.lookupControl.data : column.column.data;
-          if ((_e = (_d = row[((_c = column.column.field) === null || _c === void 0 ? void 0 : _c.toLowerCase()) + '_obj']) === null || _d === void 0 ? void 0 : _d.action) === null || _e === void 0 ? void 0 : _e.lookupControl) {
-              ((_k = (_j = (_h = (_g = row[((_f = column.column.field) === null || _f === void 0 ? void 0 : _f.toLowerCase()) + '_obj']) === null || _g === void 0 ? void 0 : _g.action) === null || _h === void 0 ? void 0 : _h.lookupControl) === null || _j === void 0 ? void 0 : _j.data) === null || _k === void 0 ? void 0 : _k.header) ? columnData.header = (_q = (_p = (_o = (_m = row[((_l = column.column.field) === null || _l === void 0 ? void 0 : _l.toLowerCase()) + '_obj']) === null || _m === void 0 ? void 0 : _m.action) === null || _o === void 0 ? void 0 : _o.lookupControl) === null || _p === void 0 ? void 0 : _p.data) === null || _q === void 0 ? void 0 : _q.header : '';
-              ((_v = (_u = (_t = (_s = row[((_r = column.column.field) === null || _r === void 0 ? void 0 : _r.toLowerCase()) + '_obj']) === null || _s === void 0 ? void 0 : _s.action) === null || _t === void 0 ? void 0 : _t.lookupControl) === null || _u === void 0 ? void 0 : _u.data) === null || _v === void 0 ? void 0 : _v.width) ? columnData.width = (_0 = (_z = (_y = (_x = row[((_w = column.column.field) === null || _w === void 0 ? void 0 : _w.toLowerCase()) + '_obj']) === null || _x === void 0 ? void 0 : _x.action) === null || _y === void 0 ? void 0 : _y.lookupControl) === null || _z === void 0 ? void 0 : _z.data) === null || _0 === void 0 ? void 0 : _0.width : '';
-              ((_5 = (_4 = (_3 = (_2 = row[((_1 = column.column.field) === null || _1 === void 0 ? void 0 : _1.toLowerCase()) + '_obj']) === null || _2 === void 0 ? void 0 : _2.action) === null || _3 === void 0 ? void 0 : _3.lookupControl) === null || _4 === void 0 ? void 0 : _4.data) === null || _5 === void 0 ? void 0 : _5.height) ? columnData.height = (_10 = (_9 = (_8 = (_7 = row[((_6 = column.column.field) === null || _6 === void 0 ? void 0 : _6.toLowerCase()) + '_obj']) === null || _7 === void 0 ? void 0 : _7.action) === null || _8 === void 0 ? void 0 : _8.lookupControl) === null || _9 === void 0 ? void 0 : _9.data) === null || _10 === void 0 ? void 0 : _10.height : '';
-              ((_15 = (_14 = (_13 = (_12 = row[((_11 = column.column.field) === null || _11 === void 0 ? void 0 : _11.toLowerCase()) + '_obj']) === null || _12 === void 0 ? void 0 : _12.action) === null || _13 === void 0 ? void 0 : _13.lookupControl) === null || _14 === void 0 ? void 0 : _14.data) === null || _15 === void 0 ? void 0 : _15.valueProp) ? columnData.valueProp = (_20 = (_19 = (_18 = (_17 = row[((_16 = column.column.field) === null || _16 === void 0 ? void 0 : _16.toLowerCase()) + '_obj']) === null || _17 === void 0 ? void 0 : _17.action) === null || _18 === void 0 ? void 0 : _18.lookupControl) === null || _19 === void 0 ? void 0 : _19.data) === null || _20 === void 0 ? void 0 : _20.valueProp : "";
-              ((_25 = (_24 = (_23 = (_22 = row[((_21 = column.column.field) === null || _21 === void 0 ? void 0 : _21.toLowerCase()) + '_obj']) === null || _22 === void 0 ? void 0 : _22.action) === null || _23 === void 0 ? void 0 : _23.lookupControl) === null || _24 === void 0 ? void 0 : _24.data) === null || _25 === void 0 ? void 0 : _25.labelProp) ? columnData.labelProp = (_30 = (_29 = (_28 = (_27 = row[((_26 = column.column.field) === null || _26 === void 0 ? void 0 : _26.toLowerCase()) + '_obj']) === null || _27 === void 0 ? void 0 : _27.action) === null || _28 === void 0 ? void 0 : _28.lookupControl) === null || _29 === void 0 ? void 0 : _29.data) === null || _30 === void 0 ? void 0 : _30.labelProp : "";
-              ((_35 = (_34 = (_33 = (_32 = row[((_31 = column.column.field) === null || _31 === void 0 ? void 0 : _31.toLowerCase()) + '_obj']) === null || _32 === void 0 ? void 0 : _32.action) === null || _33 === void 0 ? void 0 : _33.lookupControl) === null || _34 === void 0 ? void 0 : _34.data) === null || _35 === void 0 ? void 0 : _35.data) ? columnData.data = (_40 = (_39 = (_38 = (_37 = row[((_36 = column.column.field) === null || _36 === void 0 ? void 0 : _36.toLowerCase()) + '_obj']) === null || _37 === void 0 ? void 0 : _37.action) === null || _38 === void 0 ? void 0 : _38.lookupControl) === null || _39 === void 0 ? void 0 : _39.data) === null || _40 === void 0 ? void 0 : _40.data : '';
-          }
-          var ref = this.dialogService.open(column.component, Object.assign(Object.assign({}, columnData), { data: Object.assign({ selection: column.selection, field: column.column.field, labelProp: (_42 = (_41 = column.column.lookupControl) === null || _41 === void 0 ? void 0 : _41.data) === null || _42 === void 0 ? void 0 : _42.labelProp }, column.rowData) }));
-          var componentName = (_43 = row[column.column.field]) === null || _43 === void 0 ? void 0 : _43.name;
+          if ((_d = row[((_c = column.column.field) === null || _c === void 0 ? void 0 : _c.toLowerCase()) + '_obj']) === null || _d === void 0 ? void 0 : _d.lookupControl) {
+              ((_h = (_g = (_f = row[((_e = column.column.field) === null || _e === void 0 ? void 0 : _e.toLowerCase()) + '_obj']) === null || _f === void 0 ? void 0 : _f.lookupControl) === null || _g === void 0 ? void 0 : _g.data) === null || _h === void 0 ? void 0 : _h.header) ? columnData.header = (_m = (_l = (_k = row[((_j = column.column.field) === null || _j === void 0 ? void 0 : _j.toLowerCase()) + '_obj']) === null || _k === void 0 ? void 0 : _k.lookupControl) === null || _l === void 0 ? void 0 : _l.data) === null || _m === void 0 ? void 0 : _m.header : '';
+              ((_r = (_q = (_p = row[((_o = column.column.field) === null || _o === void 0 ? void 0 : _o.toLowerCase()) + '_obj']) === null || _p === void 0 ? void 0 : _p.lookupControl) === null || _q === void 0 ? void 0 : _q.data) === null || _r === void 0 ? void 0 : _r.width) ? columnData.width = (_v = (_u = (_t = row[((_s = column.column.field) === null || _s === void 0 ? void 0 : _s.toLowerCase()) + '_obj']) === null || _t === void 0 ? void 0 : _t.lookupControl) === null || _u === void 0 ? void 0 : _u.data) === null || _v === void 0 ? void 0 : _v.width : '';
+              ((_z = (_y = (_x = row[((_w = column.column.field) === null || _w === void 0 ? void 0 : _w.toLowerCase()) + '_obj']) === null || _x === void 0 ? void 0 : _x.lookupControl) === null || _y === void 0 ? void 0 : _y.data) === null || _z === void 0 ? void 0 : _z.height) ? columnData.height = (_3 = (_2 = (_1 = row[((_0 = column.column.field) === null || _0 === void 0 ? void 0 : _0.toLowerCase()) + '_obj']) === null || _1 === void 0 ? void 0 : _1.lookupControl) === null || _2 === void 0 ? void 0 : _2.data) === null || _3 === void 0 ? void 0 : _3.height : '';
+              ((_7 = (_6 = (_5 = row[((_4 = column.column.field) === null || _4 === void 0 ? void 0 : _4.toLowerCase()) + '_obj']) === null || _5 === void 0 ? void 0 : _5.lookupControl) === null || _6 === void 0 ? void 0 : _6.data) === null || _7 === void 0 ? void 0 : _7.valueProp) ? columnData.valueProp = (_11 = (_10 = (_9 = row[((_8 = column.column.field) === null || _8 === void 0 ? void 0 : _8.toLowerCase()) + '_obj']) === null || _9 === void 0 ? void 0 : _9.lookupControl) === null || _10 === void 0 ? void 0 : _10.data) === null || _11 === void 0 ? void 0 : _11.valueProp : "";
+              ((_15 = (_14 = (_13 = row[((_12 = column.column.field) === null || _12 === void 0 ? void 0 : _12.toLowerCase()) + '_obj']) === null || _13 === void 0 ? void 0 : _13.lookupControl) === null || _14 === void 0 ? void 0 : _14.data) === null || _15 === void 0 ? void 0 : _15.labelProp) ? columnData.labelProp = (_19 = (_18 = (_17 = row[((_16 = column.column.field) === null || _16 === void 0 ? void 0 : _16.toLowerCase()) + '_obj']) === null || _17 === void 0 ? void 0 : _17.lookupControl) === null || _18 === void 0 ? void 0 : _18.data) === null || _19 === void 0 ? void 0 : _19.labelProp : "";
+              ((_23 = (_22 = (_21 = row[((_20 = column.column.field) === null || _20 === void 0 ? void 0 : _20.toLowerCase()) + '_obj']) === null || _21 === void 0 ? void 0 : _21.lookupControl) === null || _22 === void 0 ? void 0 : _22.data) === null || _23 === void 0 ? void 0 : _23.data) ? columnData.data = (_27 = (_26 = (_25 = row[((_24 = column.column.field) === null || _24 === void 0 ? void 0 : _24.toLowerCase()) + '_obj']) === null || _25 === void 0 ? void 0 : _25.lookupControl) === null || _26 === void 0 ? void 0 : _26.data) === null || _27 === void 0 ? void 0 : _27.data : '';
+          }
+          var ref = this.dialogService.open(column.component, Object.assign(Object.assign({}, columnData), { data: Object.assign({ selection: column.selection, field: column.column.field, labelProp: (_29 = (_28 = column.column.lookupControl) === null || _28 === void 0 ? void 0 : _28.data) === null || _29 === void 0 ? void 0 : _29.labelProp }, column.rowData) }));
+          var componentName = (_30 = row[column.column.field]) === null || _30 === void 0 ? void 0 : _30.name;
           if (componentName) {
-              this.pageLoggerService.savePageLoggerInfo((_44 = this.router.url) === null || _44 === void 0 ? void 0 : _44.substring(1), componentName);
+              this.pageLoggerService.savePageLoggerInfo((_31 = this.router.url) === null || _31 === void 0 ? void 0 : _31.substring(1), componentName);
           }
           return ref;
       };
@@ -5693,11 +5667,11 @@
        */
       GridComponent.prototype.selectLookupField = function (column, row) {
           var _this = this;
-          var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s;
+          var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o;
           this.onClickEvent(column, row);
-          var obj = this.setLookupDialogConfig(row, column, ((_d = (_c = (_b = (_a = row[column.field + '_obj']) === null || _a === void 0 ? void 0 : _a.action) === null || _b === void 0 ? void 0 : _b.lookupControl) === null || _c === void 0 ? void 0 : _c.data) === null || _d === void 0 ? void 0 : _d.data)
-              ? (_h = (_g = (_f = (_e = row[column.field + '_obj']) === null || _e === void 0 ? void 0 : _e.action) === null || _f === void 0 ? void 0 : _f.lookupControl) === null || _g === void 0 ? void 0 : _g.data) === null || _h === void 0 ? void 0 : _h.data : (_k = (_j = column === null || column === void 0 ? void 0 : column.lookupControl) === null || _j === void 0 ? void 0 : _j.data) === null || _k === void 0 ? void 0 : _k.data);
-          obj['component'] = ((_o = (_m = (_l = row[column.field + '_obj']) === null || _l === void 0 ? void 0 : _l.action) === null || _m === void 0 ? void 0 : _m.lookupControl) === null || _o === void 0 ? void 0 : _o.component) ? (_r = (_q = (_p = row[column.field + '_obj']) === null || _p === void 0 ? void 0 : _p.action) === null || _q === void 0 ? void 0 : _q.lookupControl) === null || _r === void 0 ? void 0 : _r.component : (_s = column.lookupControl) === null || _s === void 0 ? void 0 : _s.component;
+          var obj = this.setLookupDialogConfig(row, column, ((_c = (_b = (_a = row[column.field + '_obj']) === null || _a === void 0 ? void 0 : _a.lookupControl) === null || _b === void 0 ? void 0 : _b.data) === null || _c === void 0 ? void 0 : _c.data)
+              ? (_f = (_e = (_d = row[column.field + '_obj']) === null || _d === void 0 ? void 0 : _d.lookupControl) === null || _e === void 0 ? void 0 : _e.data) === null || _f === void 0 ? void 0 : _f.data : (_h = (_g = column === null || column === void 0 ? void 0 : column.lookupControl) === null || _g === void 0 ? void 0 : _g.data) === null || _h === void 0 ? void 0 : _h.data);
+          obj['component'] = ((_k = (_j = row[column.field + '_obj']) === null || _j === void 0 ? void 0 : _j.lookupControl) === null || _k === void 0 ? void 0 : _k.component) ? (_m = (_l = row[column.field + '_obj']) === null || _l === void 0 ? void 0 : _l.lookupControl) === null || _m === void 0 ? void 0 : _m.component : (_o = column.lookupControl) === null || _o === void 0 ? void 0 : _o.component;
           var ref = this.openLookupDialog(obj, row);
           draggableDialog((column === null || column === void 0 ? void 0 : column.field) ? column === null || column === void 0 ? void 0 : column.field : column === null || column === void 0 ? void 0 : column.header);
           ref.onClose.subscribe(function (res) {
@@ -5754,8 +5728,8 @@
                       column.onChange(row);
                   }
               }
-          }, function (_45) {
-              var error = _45.error;
+          }, function (_32) {
+              var error = _32.error;
               _this.alertService.apiError(error);
           });
       };
@@ -5956,7 +5930,7 @@
       };
       // Invoke onClick Event.
       GridComponent.prototype.onClickEvent = function (column, row) {
-          var _a, _b, _c, _d, _e;
+          var _a, _b, _c, _d;
           if (column.type === exports.EGridColumnType.LINK && (column.editLink === false || column.editLink === undefined) && column.editable !== true && column.disabled !== true) {
               if (column && column.onClick && column.disabled !== true && ((_b = (_a = row[column.field + '_obj']) === null || _a === void 0 ? void 0 : _a.action) === null || _b === void 0 ? void 0 : _b.disabled) !== true) {
                   column.onClick(row);
@@ -5977,7 +5951,7 @@
               column.minutesInterval) {
               this.defaultDate = new Date(setMinutesInterval(new Date()));
           }
-          if (column && column.onClick && column.disabled !== true && ((_e = (_d = row[column.field + '_obj']) === null || _d === void 0 ? void 0 : _d.action) === null || _e === void 0 ? void 0 : _e.disabled) !== true) {
+          if (column && column.onClick && column.disabled !== true && ((_d = row[column.field + '_obj']) === null || _d === void 0 ? void 0 : _d.disabled) !== true) {
               column.onClick(row);
           }
       };
@@ -6115,7 +6089,7 @@
           this.onCancelAllRows.emit(this.rowsData);
       };
       GridComponent.prototype.getClassForEditAllRows = function (className) {
-          var e_1, _45;
+          var e_1, _32;
           var _this = this;
           if (className === void 0) { className = ''; }
           var _a, _b;
@@ -6128,7 +6102,7 @@
                   this.saveAllRecord = true;
                   var records$_1 = [];
                   setTimeout(function () {
-                      var e_2, _45;
+                      var e_2, _32;
                       var _loop_2 = function (item) {
                           var rowSave = new Promise(function (resolve, reject) {
                               item.click();
@@ -6145,7 +6119,7 @@
                       catch (e_2_1) { e_2 = { error: e_2_1 }; }
                       finally {
                           try {
-                              if (getBtns_2_1 && !getBtns_2_1.done && (_45 = getBtns_2.return)) _45.call(getBtns_2);
+                              if (getBtns_2_1 && !getBtns_2_1.done && (_32 = getBtns_2.return)) _32.call(getBtns_2);
                           }
                           finally { if (e_2) throw e_2.error; }
                       }
@@ -6182,7 +6156,7 @@
                   catch (e_1_1) { e_1 = { error: e_1_1 }; }
                   finally {
                       try {
-                          if (getBtns_1_1 && !getBtns_1_1.done && (_45 = getBtns_1.return)) _45.call(getBtns_1);
+                          if (getBtns_1_1 && !getBtns_1_1.done && (_32 = getBtns_1.return)) _32.call(getBtns_1);
                       }
                       finally { if (e_1) throw e_1.error; }
                   }
@@ -6292,8 +6266,8 @@
                   &&
                       ((_a = column === null || column === void 0 ? void 0 : column.filter) === null || _a === void 0 ? void 0 : _a.type) === 'checkbox' && column.filtering != false) {
                   this.rowsData.forEach(function (row) {
-                      var _a, _b;
-                      if (((_b = (_a = row[column.field + '_obj']) === null || _a === void 0 ? void 0 : _a.action) === null || _b === void 0 ? void 0 : _b.disabled) !== true && !column.disabled) {
+                      var _a;
+                      if (((_a = row[column.field + '_obj']) === null || _a === void 0 ? void 0 : _a.disabled) !== true && !column.disabled) {
                           row[column.field] = column.filterValue;
                       }
                   });
@@ -6326,7 +6300,7 @@
   GridComponent.decorators = [
       { type: i0.Component, args: [{
                   selector: 'se-grid',
-                  template: "<div class=\"grid-component-wrapper\">\n<p-confirmDialog [style]=\"{ width: '50vw' }\" *ngIf=\"useInlineCRUD\" key=\"handleInlineCRUD\"></p-confirmDialog>\n<p-confirmDialog class=\"grid-component-confirm-dialog\" *ngIf=\"columnActions.length > 0\"\n  key=\"handlecolumnActions\"></p-confirmDialog>\n<div class=\"p-mb-2 p-ai-center global-filter-buttons-wrapper\">\n\n  <!-- button for apply value on Grid -->\n  <button *ngIf=\"filtering && !hideFilter\" pButton type=\"button\" icon=\"pi pi-search\" (click)=\"applyGirdFilterBtn()\"\n    [class]=\"\n  searchGridFilter ? 'p-button-success apply-filter-btn filter-btn' : 'hide-clear-filter-button apply-filter-btn filter-btn'\n  \"></button>\n\n  <!-- button for clear value on Grid -->\n  <button *ngIf=\"filtering && !hideFilter\" pButton id=\"clearGridFilterValuesButton\" type=\"button\"\n    icon=\"pi pi-replay\" (click)=\"cleargridFiltersValue()\" [class]=\"\n      clearGridFilter ? 'filter-btn' : 'hide-clear-filter-button filter-btn'\n      \" class='global-refresh global-btn'\n    ></button>\n\n  <!-- button for save all grid at once -->\n  <button pButton *ngIf=\"editAllRows && editRowPermission\" id=\"saveAllGridValues\"\n    icon=\"pi pi-check\" [label]=\"'Save'\"\n    [class]=\"hideGridSaveButton ? 'hide-clear-filter-button' : 'ui-button-info'\" type=\"button\"\n    (click)=\"saveAllRowsAtOnce()\"></button>\n\n  <!-- button for cancel all grid at once -->\n  <button pButton *ngIf=\"editAllRows && !hideGridCancelButton\" id=\"editBtnGlobalvalues\" type=\"button\" [label]=\"'Cancel'\"\n    icon=\"pi pi-times\" class=\"ui-button-info\" (click)=\"cancelAllRowsAtOnce()\"></button>\n\n  <!-- header Button for multiSelect on Grid -->\n  <span *ngIf=\"allowColumnToggle\">\n    <p-multiSelect [showToggleAll]=\"false\" [options]=\"columns\" [(ngModel)]=\"selectedColumns\" optionLabel=\"header\"\n      selectedItemsLabel=\"{0} columns selected\"  class=\"grid-component-multiselect-header-button\" placeholder=\"Choose Columns\">\n    </p-multiSelect>\n  </span>\n\n  <!-- header Button for Adding new Row on Grid -->\n  <button pButton *ngIf=\"useInlineCRUD && addRowPermission && !hideAddBtn\" type=\"button\" [label]=\"'Add'\" pAddRow\n    [table]=\"componentTableRef\" [newRow]=\"newGridRow\" [id]=\"dataKey\" pTooltip=\"Add New Row\" tooltipPosition=\"bottom\"\n    icon=\"pi pi-plus\" class=\"ui-button-info global-add-btn\" (click)=\"addNewRow(newGridRow, true)\" pRipple></button>\n\n  <div *ngFor=\"let reportButton of reportButtons\" class=\"ui-button-info p-mr-2 p-ml-2\">\n    <se-generate-report-btn *ngIf =\"!reportButton.hidden\"[repId]=\"reportButton.reportId\" [label]=\"reportButton.label\" [params]=\"reportButton.params\"\n      [showDialog]=\"reportButton.showDialog\"></se-generate-report-btn>\n  </div>\n\n  <!-- header Button for Excel File on Grid -->\n  <button *ngIf=\"allowExportToExcel\" type=\"button\" pButton icon=\"pi pi-file-excel\" (click)=\"exportExcel()\"\n    class=\"p-button-success\" pTooltip=\"Export to Excel\" tooltipPosition=\"bottom\" pRipple></button>\n\n  <!-- header Button for PDF File on Grid -->\n  <button *ngIf=\"allowExportToPdf\" type=\"button\" pButton icon=\"pi pi-file-pdf\" (click)=\"exportPdf()\"\n    class=\"p-button-warning p-mr-2 p-ml-2\" pTooltip=\"Export to Pdf\" tooltipPosition=\"bottom\" pRipple></button>\n    <ng-content></ng-content>\n</div>\n\n<p-table *ngIf=\"!isGridHidden\" id=\"my-table\" [value]=\"rowsData\" [columns]=\"selectedColumns\" sortMode=\"multiple\"\n  [lazy]=\"useServerSideEvents\" [paginator]=\"pagination\" [alwaysShowPaginator]=\"pagination && totalRecords > 0\" [class]=\"pagination || !rowsData.length ? 'pagination' : ''\"\n  class=\"grid-component-main-table\"\n  [rows]=\"defaultRows\" [totalRecords]=\"totalRecords\" [rowsPerPageOptions]=\"setPaginationLength\"\n  [showCurrentPageReport]=\"showCurrentPageReport\" currentPageReportTemplate=\"Showing {first} to {last} of {{\n    totalRecords\n  }} entries\" [loading]=\"autoLoadData && !setGridRefreshTime ? loading : false\"\n  (onSort)=\"sortDisabled ?? handleSortChange($event)\" (onFilter)=\"handleFilterChange($event)\"\n  (onLazyLoad)=\"autoLoadData ? handleServerSideEvents($event) : ''\" (onPage)=\"handleServerSidePagination($event)\" #dt\n  [dataKey]=\"dataKey\" [(selection)]=\"selectedRows\" selectionMode=\"multiple\" [scrollable]=\"scrollable\" \n  [tableStyle]=\"{ 'max-height': scrollHeight }\"\n  editMode=\"row\" [editingRowKeys]=\"editingRowKeys\" [autoLayout]=\"true\" [rowHover]=\"rowHover\"\n  [ngClass]=\"{'horizontal-scroll': horizontalScroll === true ? true : false}\">\n  <!-- [scrollHeight]=\"scrollHeight\"   -->\n  <!-- header Button for Action on Grid -->\n  <div *ngIf=\"rowActions.length > 0 && rowActions.length > 0\" class=\"p-d-flex p-jc-end\">\n    <span *ngFor=\"let rowAction of rowActions\">\n      <button pButton type=\"button\" [label]=\"rowAction.title\" [class]=\"rowAction.class\"\n        (click)=\"rowAction.onClick(selectedRows)\"></button>\n    </span>\n  </div>\n\n  <!-- header columns on Grid -->\n  <ng-template pTemplate=\"header\" let-cols>\n    <tr>\n      <th *ngIf=\"allowSelection && selectionType === 'multiple'\" class=\"grid-component-selection\">\n        <div class=\"grid-component-table-header-inner-div-2\n              table-header-inner-div div-last-inner-html-is-icon\">\n          <span class=\"flex-grow-1\"> {{allowSelectionHeader}} </span>\n          <p-tableHeaderCheckbox *ngIf=\"selectionType === 'multiple'\" binary=\"true\"\n            (click)=\"multiCheckBoxOnclick(rowsData, $event)\"></p-tableHeaderCheckbox>\n        </div>\n      </th>\n      <th *ngIf=\"allowSelection && selectionType === 'single'\" \n            class=\"grid-component-selection\">\n        Select\n      </th>\n      <th\n        *ngIf=\"setActionColumnAsFirst && !disabledSaveBtn && columns?.length > 0 && (columnActions.length > 0 || (useInlineCRUD && (deleteRowPermission || editRowPermission)))\"\n        [class]=\"inEditMode ? 'three-action-btn' : 'two-action-btn'\">\n        Actions\n      </th>\n      <th *ngFor=\"let column of cols\" [pSortableColumn]=\"column.field\"\n        [class]=\"column.type === 'boolean' ? 'checkbox-th' : ''\"\n        [pSortableColumnDisabled]=\"sortDisabled && useServerSideEvents ? true : column.sorting === false\"\n        class=\"column?.type === 'multiple' ? 'grid-component-select-th-column-type-multiple' : ''\">\n        <div class=\"grid-component-table-header-inner-div-1 table-header-inner-div div-last-inner-html-is-icon\">        \n          <span [class]=\"'flex-grow-1'\">{{ column.header }}</span>\n          <span *ngIf=\"column.isRequired\" class=\"grid-component required-star\">*</span>\n          <p-sortIcon *ngIf=\"column.sorting !== false && column?.type !== 'multiple'\"\n            [field]=\"column.field\"></p-sortIcon>\n        </div>\n      </th>\n      <th\n        *ngIf=\"!setActionColumnAsFirst && !disabledSaveBtn && columns?.length > 0 && (columnActions.length > 0 || (useInlineCRUD && (deleteRowPermission || editRowPermission)))\"\n        [class]=\"inEditMode ? 'three-action-btn' : 'two-action-btn'\">Actions</th>\n    </tr>\n    <tr *ngIf=\"filtering && !hideFilter\">\n      <th *ngIf=\"allowSelection\" [class]=\"inEditMode ? 'three-action-btn' : 'two-action-btn'\"></th>\n      <th *ngIf=\"setActionColumnAsFirst && !disabledSaveBtn\"\n        [class]=\"inEditMode ? 'three-action-btn' : 'two-action-btn'\">\n      </th>\n      <th *ngFor=\"let column of cols\" [ngSwitch]=\"column?.filter?.type\" [style]=\"column.style\"\n        [class]=\"hideFilterOptions ? 'hide-table-filter' : ''\">\n        <span *ngIf=\"column.filtering !== false\" [class]=\"column.filter?.showFilter ? '' : 'hide-filter-icon'\">\n          <!-- Text input on Header For Filter-->\n          <p-columnFilter [type]=\"'text'\" [field]=\"column.field\" *ngSwitchCase=\"'input'\">\n            <ng-template pTemplate=\"filter\" let-value let-filter=\"filterCallback\">\n              <input type=\"text\" [(ngModel)]=\"column.filterValue\" (keyup.enter)=\"applyEnterEvent(filter, $event, column)\"\n                (blur)=\"setFilterFocusOut(column, filter, $event)\" (keydown)=\"backspaceEvent($event, column)\"\n                (keyup)=\"removingFilters($event, column)\" pInputText />\n            </ng-template>\n          </p-columnFilter>\n\n          <!-- Numeric input on Header For Filter-->\n          <p-columnFilter [type]=\"'numeric'\" [field]=\"column.field\" *ngSwitchCase=\"'numeric_input'\">\n            <ng-template pTemplate=\"filter\" let-value let-filter=\"filterCallback\">\n              <p-inputNumber [(ngModel)]=\"column.filterValue\" (keyup.enter)=\"applyEnterEvent(filter, $event, column)\"\n                (onBlur)=\"setFilterFocusOut(column, filter, $event)\" (keydown)=\"backspaceEvent($event, column)\"\n                (keyup)=\"removingFilters($event, column)\"></p-inputNumber>\n            </ng-template>\n          </p-columnFilter>\n\n            <!-- lookup input on Header For Filter-->\n            <p-columnFilter\n              [type]=\"'text'\"\n              [field]=\"column.field\"\n              *ngSwitchCase=\"'lookup_input'\"\n            >\n              <ng-template\n                pTemplate=\"filter\"\n                let-value\n                let-filter=\"filterCallback\"\n              >\n                <div class=\"close-icon-wrapper grid-component lookup-filter-wrapper\">\n                  <div class=\"lookup-filter-input-wrapper\"> \n                  <input\n                    id=\"lookUp_filter\"\n                    class=\"grid-component lookup-filter\"\n                    autocomplete=\"off\"\n                    type=\"text\"\n                    [(ngModel)]=\"column.filterValue\"\n                    (click)=\"setFilterLookup(column)\"\n                    (keyup.enter)=\"applyEnterEvent(filter, $event, column)\"\n                    (blur)=\"setFilterFocusOut(column, filter, $event)\"\n                    (keydown)=\"backspaceEvent($event, column)\"\n                    (keyup)=\"removingFilters($event, column)\"\n                    pInputText\n                  />\n                  </div>  \n                  <div><button\n                      *ngIf=\"column.filterValue\"\n                      icon=\"pi pi-times\"\n                      pButton\n                      type=\"button\"\n                      (click)=\"lookupClearValue(column)\"\n                    ></button></div>\n                </div>\n              </ng-template>\n            </p-columnFilter>\n\n          <!-- checkbox on Header For Filter-->\n          <p-columnFilter type=\"boolean\" [field]=\"column.field\" *ngSwitchCase=\"'checkbox'\">\n            <ng-template pTemplate=\"filter\" let-value let-filter=\"filterCallback\">\n              <p-checkbox [binary]=\"true\" [disabled]=\"column.disabled\" [(ngModel)]=\"column.filterValue\"\n                (keyup.enter)=\"applyEnterEvent(filter, $event, column)\"\n                (onChange)=\"setFilterFocusOut(column, filter, $event)\" (click)=\"clickCheckBoxFilter(column)\"\n                (keydown)=\"backspaceEvent($event, column)\">\n              </p-checkbox>\n            </ng-template>\n          </p-columnFilter>\n\n          <!-- multiSelect on Header For Filter-->\n          <p-columnFilter [field]=\"column.field\" matchMode=\"in\" [showMenu]=\"false\" *ngSwitchCase=\"'multi-select'\">\n            <ng-template pTemplate=\"filter\" let-value let-filter=\"filterCallback\">\n              <p-multiSelect [ngModel]=\"column.filterValue\" [options]=\"column.filter.data || []\" (onChange)=\"filter($event.value)\"\n                (blur)=\"setFilterFocusOut(column, filter, $event)\" (keydown)=\"backspaceEvent($event, column)\"\n                placeholder=\"Any\" optionLabel=\"label\">\n              </p-multiSelect>\n            </ng-template>\n          </p-columnFilter>\n\n          <!-- dropdown on Header For Filter-->\n          <p-columnFilter [field]=\"column.field\" matchMode=\"in\" [showMenu]=\"false\" *ngSwitchCase=\"'dropdown'\">\n            <ng-template pTemplate=\"filter\" let-value let-filter=\"filterCallback\">\n              <p-dropdown [showClear]=\"true\" [placeholder]=\"'Select'\" [filter]=\"column.allowSearch\"\n                [(ngModel)]=\"column.filterValue\" (keyup.enter)=\"applyDropdownFilter(filter, $event)\"\n                [options]=\"column.filter.data || []\"\n                (onChange)=\"searchDropdownFilter(filter, $event, column)\"></p-dropdown>\n            </ng-template>\n          </p-columnFilter>\n\n          <!-- calendar on Header For Filter-->\n          <p-columnFilter [field]=\"column.field\" matchMode=\"in\" [showMenu]=\"false\" *ngSwitchCase=\"'calendar'\">\n            <ng-template pTemplate=\"filter\" let-value let-filter=\"filterCallback\">\n              <p-calendar [placeholder]=\"'Select-Date'\" [(ngModel)]=\"column.filterValue\"\n                (keyup.enter)=\"applyEnterEvent(filter, $event, column)\" appendTo=\"body\" (onSelect)=\"selectDate(column)\"\n                [inputId]=\"column.field\" hourFormat=\"12\" (keyup.backspace)=\"removeNullCalendar(column, filter, $event)\"\n                [showButtonBar]=\"true\" (onClose)=\"setFilterFocusOut(column, filter, $event)\"\n                (keydown)=\"backspaceEvent($event, column)\" (onClearClick)=\"backspaceEvent($event, column)\">\n              </p-calendar>\n            </ng-template>\n          </p-columnFilter>\n\n          <!-- Default Filter For Header  -->\n          <p-columnFilter [type]=\"\n              column.type && column.type !== 'link' ? column.type : 'text'\n            \" [field]=\"column.field\" display=\"menu\" *ngSwitchDefault>\n          </p-columnFilter>\n        </span>\n      </th>\n      <th\n        *ngIf=\"!setActionColumnAsFirst && !disabledSaveBtn && columns?.length > 0 && (columnActions.length > 0 || (useInlineCRUD && (deleteRowPermission || editRowPermission)))\"\n        [class]=\"inEditMode ? 'three-action-btn' : 'two-action-btn'\"></th>\n    </tr>\n  </ng-template>\n\n  <!-- Body columns on Grid -->\n  <ng-template pTemplate=\"body\" let-row let-editing=\"editing\" let-ri=\"rowIndex\">\n    <tr [ngClass]=\"row?.highlightrow ? 'highlighted-row' : ''\"\n      [class]=\"wordWrap ? 'p-selectable-row' : 'noWrap p-selectable-row'\" (click)=\"!editing && handleRowClick(row)\"\n      [pEditableRow]=\"row\" #gridRow [id]=\"row[dataKey]\">\n      <td *ngIf=\"allowSelection\" class=\"grid-component-selection\">\n        <p-tableRadioButton [value]=\"row\" *ngIf=\"selectionType === 'single'\"\n          (click)=\"multiCheckBoxOnclick(row , $event, true)\"></p-tableRadioButton>\n        <p-tableCheckbox [value]=\"row\" *ngIf=\"selectionType === 'multiple'\"\n          (click)=\"multiCheckBoxOnclick(row, $event)\"></p-tableCheckbox>\n      </td>\n\n      <!-- first actions column -->\n      <td *ngIf=\"setActionColumnAsFirst && columnActions.length > 0\">\n        <span class=\"action-btn\" *ngFor=\"let action of columnActions\">\n          <i [title]=\"action.tooltip\" [class]=\"action.icon\" (click)=\"handleActionClick($event, action, row)\"></i>\n        </span>\n      </td>\n      <td *ngIf=\"setActionColumnAsFirst && useInlineCRUD && (deleteRowPermission || editRowPermission)\"\n        [class]=\"inEditMode ? 'three-action-btn' : 'two-action-btn'\"\n        [ngClass]=\"disabledSaveBtn ? 'hide-clear-filter-button' : ''\">\n        <span class=\"setActionColumnWidth\">\n          <se-grid-row-actions [editing]=\"editing\" [editRowPermission]=\"editRowPermission\"\n            [deleteRowPermission]=\"deleteRowPermission\" [hideDeleteBtn]=\"hideDeleteBtn\" [hideEditBtn]=\"hideEditBtn\"\n            [row]=\"row\" (onRowEditInitBtn)=\"onRowEditInit($event)\" (deleteRecordBtn)=\"deleteRecord($event)\"\n            (onRowEditSaveBtn)=\"onRowEditSave($event)\" (onRowEditCancelBtn)=\"onRowEditCancel($event, ri)\"\n            [editAllRows]=\"editAllRows\">\n          </se-grid-row-actions>\n        </span>\n      </td>\n\n      <!-- Grid Rows Data Bindings Start -->\n      <td *ngFor=\"let column of selectedColumns\" [ngSwitch]=\"column.type\" >\n\n        <!-- Boolean column on Grid -->\n        <span *ngSwitchCase=\"'boolean'\">\n      <td *ngIf=\"!editing\">\n        <p-checkbox [disabled]=\"!column.allowEdit ?? true\" [binary]=\"true\" (click)=\"onClickEvent(column, row)\"\n          (ngModelChange)=\"checkBoxChangeEvent($event, column, row)\" (blur)=\"onFocusOutEvent(column, row)\" \n          [(ngModel)]=\" \n            row[column.field] &&\n            (row[column.field].toString() === '1' ||\n              row[column.field].toString().toLowerCase() === 'true' ||\n              row[column.field].toString().toLowerCase() === 'y'||\n              ( row[column.field].text && (row[column.field]?.text?.toString() === '1' ||\n              row[column.field]?.text?.toString()?.toLowerCase() === 'true' ||\n              row[column.field]?.text?.toString()?.toLowerCase() === 'y')))\n                ? Checked\n                : unChecked\n               \">\n        </p-checkbox>\n      </td>\n      <td *ngIf=\"editing\">\n        <p-cellEditor>\n          <ng-template pTemplate=\"input\">\n            <!-- for edit checkBox -->\n            <p-checkbox (click)=\"onClickEvent(column, row)\" (ngModelChange)=\"checkBoxChangeEvent($event, column, row)\"\n              [disabled]=\"allowDisabled(column,row)\" [binary]=\"true\" [(ngModel)]=\"\n                  row[column.field] &&   \n                  (row[column.field].toString() === '1' ||\n                    row[column.field].toString().toLowerCase() === 'true' ||\n                    row[column.field].toString().toLowerCase() === 'y' ||\n                    ( row[column.field].text && (row[column.field]?.text?.toString() === '1' ||\n                    row[column.field]?.text?.toString()?.toLowerCase() === 'true' ||\n                    row[column.field]?.text?.toString()?.toLowerCase() === 'y')))\n                    ? editModeChecked\n                    : editModeunCkecked\n                \" (blur)=\"onFocusOutEvent(column, row)\"></p-checkbox>\n          </ng-template>\n          <ng-template pTemplate=\"output\">\n            {{ row[column.field] }}\n          </ng-template>\n        </p-cellEditor>\n      </td>\n      </span>\n\n      <!-- link column on Grid -->\n      <span *ngSwitchCase=\"'link'\">\n        <!-- link column for HyperLink Case -->\n        <span *ngIf=\"column.allowSave === false\">\n          <span *ngIf=\"column.target !== '_self'\" (click)=\"onClickEvent(column, row)\"\n            [title]=\"setConditionBaseValue(row, column)\" class=\"custom-link\"\n            [class]=\"allowDisabled(column,row) ? 'disabled-link' : ''\">\n\n          <a  [href]=\"column.disabled?'':row[column.field + '_obj']?.hyperlink\" target=\"_blank\">\n              <i *ngIf=\"column.icon &&!row[column.field+'_obj']?.action?.hideFieldValue; else noIcon\" [class]=\"column.icon\"></i>\n              <ng-template #noIcon>\n                {{\n                  row[column.field+'_obj']?.action?.hideFieldValue?'':\n                  setConditionBaseValue(row, column)\n                }}\n              </ng-template>\n            </a>\n      \n          </span>\n          <span *ngIf=\"column.target === '_self'\" (click)=\"onClickEvent(column, row)\"\n            [title]=\"setConditionBaseValue(row, column)\"class=\"custom-link\"\n            [class]=\" allowDisabled(column,row) ? 'disabled-link' : ''\">\n\n            <a  [href]=\"column.disabled?'':row[column.field + '_obj']?.hyperlink\" [target]='column.target'>\n              <i *ngIf=\"column.icon &&!row[column.field+'_obj']?.action?.hideFieldValue; else noIcon\" [class]=\"column.icon\"></i>\n              <ng-template #noIcon>\n                {{\n                  row[column.field+'_obj']?.action?.hideFieldValue?'':\n                  setConditionBaseValue(row, column)\n                }}\n              </ng-template>\n            </a>\n\n          </span>\n        </span>\n        <!-- link column for Edit Case -->\n        <span *ngIf=\"column.allowSave || column.allowSave === undefined\">\n          <p-cellEditor>\n            <ng-template pTemplate=\"input\">\n              <span\n                *ngIf=\"(column.editable === true || column.editable === undefined) && (column.editLink === true || column.editLink === undefined)\">\n                <input *ngIf=\"!row.isNew\" pInputText (click)=\"onClickEvent(column, row)\" type=\"text\"\n                  [class]=\"column.errorMessage ? 'ng-invalid ng-dirty' : ''\"\n                  [(ngModel)]=\"typeOf(row[column.field+'_obj']) === 'object' && row[column.field+'_obj']?.action ? row[column.field+'_obj']?.action?.hideFieldValue?'':row[column.field+'_obj']?.action?.displayField?.toLowerCase() ?\n                row[row[column.field+'_obj']?.action?.displayField.toLowerCase()] : row[column.field+'_obj']?.text : row[column.field]\" (blur)=\"onFocusOutEvent(column, row)\"\n                  (change)=\"onChangeEvent(column, row)\" />\n                <input pInputText *ngIf=\"row.isNew\" type=\"text\" (click)=\"onClickEvent(column, row)\"\n                  [class]=\"column.errorMessage ? 'ng-invalid ng-dirty' : ''\"\n                  [(ngModel)]=\"typeOf(row[column.field+'_obj']) === 'object' ? row[column.field+'_obj']?.action?.displayField?.toLowerCase() ?\n                row[row[column.field+'_obj']?.action?.displayField.toLowerCase()] : row[column.field+'_obj']?.text : row[column.field]\" (blur)=\"onFocusOutEvent(column, row)\"\n                  (change)=\"onChangeEvent(column, row)\" />\n              </span>\n              <span *ngIf=\"column.editable === false\" >\n              <a class=\"custom-link\" (click)=\"onClickEvent(column, row)\" [href]=\"row[column.field + '_obj']?.hyperlink\" [target]='column.target'\n                [class]=\"allowDisabled(column,row) ? 'disabled-link' : ''\">\n                <i *ngIf=\"column.icon && !row[column.field+'_obj']?.action?.hideFieldValue; else noIcon\"[class]=\"column.icon\"></i>\n                <ng-template #noIcon>\n                {{\n                  row[column.field+'_obj']?.action?.hideFieldValue?'':\n                  setConditionBaseValue(row, column)\n                  }}\n              </ng-template>\n              \n                </a>\n              </span>\n              <span *ngIf=\"column.editLink === false\">\n                <a (click)=\"onClickEvent(column, row)\" [href]=\"row[column.field + '_obj']?.hyperlink\" target=\"_blank\"\n                  [class]=\"column.editable === false ? '' : allowDisabled(column,row) ? 'disabled-link' : ''\">\n                  <i *ngIf=\"column.icon && !row[column.field+'_obj']?.action?.hideFieldValue; else noIcon\"[class]=\"column.icon\"></i>\n                  <ng-template #noIcon>\n                  {{\n                    row[column.field+'_obj']?.action?.hideFieldValue?'':\n                    setConditionBaseValue(row, column)\n                    }}\n                </ng-template>\n                \n                </a>\n              </span>\n            </ng-template>\n            <ng-template pTemplate=\"output\">\n              <span  class=\"custom-link\"  [class]=\"column.editable === false || allowDisabled(column,row) ? 'disabled-link' : ''\">\n                <a  (click)=\"onClickEvent(column, row)\" [href]=\"column.disabled?'':row[column.field + '_obj']?.hyperlink\" [target]=\"column.target\"\n               >\n                  <i *ngIf=\"column.icon&& !row[column.field+'_obj']?.action?.hideFieldValue; else noIcon\"[class]=\"column.icon\"></i>\n                  <ng-template #noIcon>\n                 {{\n                    row[column.field+'_obj']?.action?.hideFieldValue?'':\n                    setConditionBaseValue(row, column)\n                    }}\n                </ng-template>\n                </a>\n\n              </span>\n            </ng-template>\n          </p-cellEditor>\n        </span>\n      </span>\n\n      <!-- Iframe column on Grid -->\n      <span *ngSwitchCase=\"'iframe'\">\n        <span class=\"custom-link\" (click)=\"gridIFrame(column, row[column.field + '_obj']?.hyperlink, row)\" [title]=\"\n              row[column.field + '_obj'] &&\n              (row[column.field + '_obj'].displayText === null || row[column.field + '_obj'].displayText === '')\n                ? row[column.field] : row[column.field + '_obj']?.displayText\n                ? row[column.field + '_obj'].displayText\n                : column.displayText\n                ? column.displayText\n                : row[column.field]\n\n            \"\n          >  \n          <i *ngIf=\"column.icon; else noIcon\"[class]=\"column.icon\"></i>\n          <ng-template #noIcon>\n          {{\n            row[column.field + '_obj'] &&\n            (row[column.field + '_obj'].displayText === null || row[column.field + '_obj'].displayText === '')\n            ? row[column.field] : row[column.field + '_obj']?.displayText\n            ? row[column.field + '_obj'].displayText\n            : column.displayText ? column.displayText : row[column.field]\n          }}\n          </ng-template>\n          </span>\n        </span>\n\n        <!-- dialog column on Grid -->\n        <span *ngSwitchCase=\"'dialog'\">\n          <p-cellEditor>\n            <ng-template pTemplate=\"input\">\n              <span\n                *ngIf=\"row[column.field + '_secondType'] !== 'date' && !row.hidegridbtn\" \n                [title]=\"setConditionBaseValue(row, column) \"\n              >\n                <span *ngIf=\"column.editable === true && !row[column.field+'_obj']?.action?.hideFieldValue\">\n                  <input\n                  readonly\n                    [class]=\"column.errorMessage ? 'ng-invalid ng-dirty' : ''\"\n                    [id]=\"allowDisabled(column,row) ? 'hide-border' : ''\"\n                    type=\"text\"\n                    pInputText\n                    (click)=\"selectLookupField(column, row)\"\n                    [(ngModel)]=\"row[column.field+'_obj']?.action && row[column.field+'_obj']?.action?.displayField ?\n                    row[row[column.field+'_obj']?.action?.displayField?.toLowerCase()] : \n                    row[column.field]\"\n                    [name]=\"row[column.field]\"\n                    [disabled]=\"allowDisabled(column,row)\"\n                    (blur)=\"onFocusOutEvent(column, row)\"\n                  />\n                </span>\n                <span\n                  *ngIf=\"column.editable === false || column.editable === undefined\n                  \" class=\"custom-link\"\n                  [class]=\"\n                  allowDisabled(column,row) ? 'disabled-link' : ''\n                  \" (click)=\"openGridDialog(column, row)\">\n\n                <i *ngIf=\"column.icon && !row[column.field+'_obj']?.action?.hideFieldValue ; else noIcon\" [class]=\"column.icon\"></i>\n                <ng-template #noIcon>{{ (!column.displayText && row.isNew ) || row[column.field+'_obj']?.action?.hideFieldValue ? '' : setConditionBaseValue(row, column)\n                  }}</ng-template>\n\n\n              </span>\n            </span>\n\n            <span *ngIf=\"row[column.field + '_secondType'] === 'date'\" [title]=\"\n                  row[column.field]\n                    | date: (column.format ? column.format : 'MM/dd/YY')\n                \">\n              <p-calendar [class]=\"column.errorMessage ? 'ng-invalid ng-dirty' : ''\"\n                [id]=\"allowDisabled(column,row) ? 'hide-border' : ''\" (onClose)=\"onFocusOutEvent(column, row)\"\n                [appendTo]=\"'body'\" hourFormat=\"12\" [showTime]=\"column.showTime\" (click)=\"onClickEvent(column, row)\"\n                [timeOnly]=\"column.timeOnly\"\n                [(ngModel)]=\"typeOf(row[column.field+'_obj']) === 'object' ? row[column.field+'_obj']?.action?.displayField?.toLowerCase() ?\n                  row[row[column.field+'_obj']?.action?.displayField.toLowerCase()] : row[column.field+'_obj']?.text : row[column.field]\"\n                [disabled]=\"allowDisabled(column,row)\"></p-calendar>\n            </span>\n          </ng-template>\n          <ng-template pTemplate=\"output\">\n            <span class=\"custom-link\"\n              [class]=\"row.disabled   || allowDisabled(column,row) ? 'disabled-link' : ''\"\n              (click)=\"openGridDialog(column, row)\" *ngIf=\"!row[column.field + '_secondType'] && !row.hidegridbtn\"\n              [title]=\"setConditionBaseValue(row, column)\">\n             <i *ngIf=\"column.icon && !row[column.field+'_obj']?.action?.hideFieldValue ; else noIcon\" [class]=\"column.icon\"></i>\n              <ng-template #noIcon>{{row[column.field+'_obj']?.action?.hideFieldValue?'': setConditionBaseValue(row, column) }}</ng-template>\n\n              <!-- {{ setConditionBaseValue(row, column) }} -->\n            </span>\n          </ng-template>\n        </p-cellEditor>\n      </span>\n\n      <!-- lookup Input column on Grid -->\n      <span *ngSwitchCase=\"'lookup_input'\">\n        <p-cellEditor>\n          <ng-template pTemplate=\"input\">\n            <div class=\"close-icon-wrapper\">\n              <input readonly type=\"text\" pInputText\n                [(ngModel)]=\"row[column.field+'_obj']?.action && row[column.field+'_obj']?.action?.displayField  ?\n                row[row[column.field+'_obj']?.action?.displayField?.toLowerCase()] :\n                typeOf(row[column.field+'_obj']) === 'object' && row[column.field+'_obj']?.text?.text ? row[column.field+'_obj']?.text?.text : \n                column.displayField ? row[column.displayField] : row[column.field]\n                \"\n                (keyup.tab)=\"selectLookupField(column, row)\" [disabled]=\"allowDisabled(column,row)\"\n                (click)=\"selectLookupField(column, row)\" [id]=\"allowDisabled(column,row) ? 'hide-border' : ''\"\n                [class]=\"column.errorMessage ? 'ng-invalid ng-dirty' : ''\" (blur)=\"onFocusOutEvent(column, row)\" />\n              <div *ngIf=\"!allowDisabled(column,row)\"><button *ngIf=\"row[column.field] && typeOf(row[column.field]) === 'object'\n                ? row[column.field].text\n                : row[column.field] && !column.disabled\" icon=\"pi pi-times\" pButton type=\"button\"\n                  (click)=\"lookupClearValue(column,row)\"></button></div>\n            </div>\n          </ng-template>\n          <ng-template pTemplate=\"output\">\n            <span *ngIf=\"column.linkId\">\n              <a [href]=\"row[column.field + '_obj']?.hyperlink\" [target]=\"column.target === '_self' ? '' :  '_blank'\">\n                {{\n                  setLookupReadOnlyValue(row, column)\n                }}\n              </a>\n            </span>\n            <span *ngIf=\"!column.linkId\" [class]=\"column.component && column.editLink === true ? 'custom-link' : ''\"\n              (click)=\"openLookupHyperlink(column, row)\">\n              {{\n                setLookupReadOnlyValue(row, column)\n              }}\n            </span>\n          </ng-template>\n        </p-cellEditor>\n      </span>\n\n      <!-- Numeric Input column on Grid -->\n      <span *ngSwitchCase=\"'numeric'\">\n        <p-cellEditor>\n          <ng-template pTemplate=\"input\">\n            <!-- for Currency && Decimal && Percent -->\n            <span class=\"input-number\">\n              <p-inputNumber [id]=\"allowDisabled(column,row) ? 'hide-border' : ''\" [class]=\"\n                    column.errorMessage\n                      ? 'ng-invalid ng-dirty'\n                      : 'form-control'\n                  \" [showButtons]=\"!column.format ? true : false\"\n                [(ngModel)]=\"row[column.field+'_obj']?.action && row[column.field+'_obj']?.action?.displayField ?\n                  row[row[column.field+'_obj']?.action?.displayField?.toLowerCase()] : row[column.field]\" [name]=\"column.field\"\n                [disabled]=\"allowDisabled(column,row)\" (ngModelChange)=\"onChangeEvent(column, row)\"\n                (onBlur)=\"onFocusOutEvent(column, row)\" [mode]=\"\n                    column.format &&\n                    column.format.type === 'currency'\n                      ? 'currency'\n                      : 'decimal'\n                  \" [currency]=\"\n                    column.format &&\n                    column.format.type === 'currency' &&\n                    column.format.formatParams &&\n                    column.format.formatParams.currency\n                      ? column.format.formatParams.currency\n                      : 'USD'\n                  \" [locale]=\"\n                    column.format &&\n                    column.format.type === 'currency' &&\n                    column.format.formatParams &&\n                    column.format.formatParams.locale\n                      ? column.format.formatParams.locale\n                      : 'en-US'\n                  \" [minFractionDigits]=\"column.format ? setNumericMinMxFraction(column) : '0'\"\n                [maxFractionDigits]=\"column.format ? setNumericMinMxFraction(column) : '0'\" [suffix]=\"\n                    column.format &&\n                    column.format.type === 'percent' && \n                       '%'\n                      \n                  \">\n              </p-inputNumber>\n            </span>\n            <ng-template #locked_field><span *ngIf=\"!row.isNew\" [title]=\"row[column.field]\">\n                {{ row[column.field] }}\n              </span></ng-template>\n          </ng-template>\n          <ng-template pTemplate=\"output\">\n            <span [title]=\"setNumericFormat(column, row)\">\n              {{\n              setNumericFormat(column, row)\n              }}\n            </span>\n          </ng-template>\n        </p-cellEditor>\n      </span>\n\n      <!-- Button column on Grid -->\n      <span>\n        <div *ngSwitchCase=\"'add_button'\">\n          <button *ngIf=\"!row.hidegridbtn\" pButton type=\"button\"\n            [icon]=\"row[column.field+'_obj']?.action?.icon ? row[column.field+'_obj']?.action?.icon : column.icon\"\n            [name]=\"column.header\" class=\"merge-btn\" [disabled]=\"allowDisabled(column,row)\"\n            [label]=\"row[column.field+'_obj']?.action?.displayText ? row[column.field+'_obj']?.action?.displayText : column.value\"\n            class=\"grid-component-grid-add-btn\" (click)=\"onClickButton(column, row)\"></button>\n        </div>\n      </span>\n\n      <!-- Date column on Grid -->\n      <span *ngSwitchCase=\"'date'\" [title]=\"setConditionBaseValue(row,column)\">\n        <p-cellEditor>\n          <ng-template pTemplate=\"input\">\n            <p-calendar\n              [class]=\"column.errorMessage ? 'ng-invalid ng-dirty ' + column.field + row[dataKey] : column.field + row[dataKey]\"\n              [id]=\"allowDisabled(column,row) ? 'hide-border' : ''\" (onClose)=\"onFocusOutEvent(column, row)\"\n              [appendTo]=\"'body'\" hourFormat=\"12\" [defaultDate]=\"defaultDate\"\n              [stepMinute]=\"column.minutesInterval ? column.minutesInterval : 1\" [showTime]=\"column.showTime\"\n              [timeOnly]=\"column.timeOnly\" [dateFormat]=\"column.format ? column.format.type : calendarFormat\"\n              (keyup)=\"calenderInputValue(column, row)\" (onShow)=\"onClickEvent(column, row)\"\n              [(ngModel)]=\"row[column.field+'_obj']?.action && row[column.field+'_obj']?.action?.displayField ?\n                row[row[column.field+'_obj']?.action?.displayField.toLowerCase()] : row[column.field]\" [disabled]=\"allowDisabled(column,row)\"\n              [showButtonBar]=\"!column.timeOnly\"></p-calendar>\n            <!-- [todayButtonStyleClass]=\"column.timeOnly ? 'hide-today-btn' : 'show-today-btn'\" -->\n          </ng-template>\n          <ng-template pTemplate=\"output\">\n            {{ setConditionBaseValue(row,column) }}\n          </ng-template>\n        </p-cellEditor>\n      </span>\n      <span *ngSwitchDefault>\n        <span [ngSwitch]=\"column.type\">\n          <!-- Dropdown column on Grid -->\n          <span *ngSwitchCase=\"'dropdown'\" [class]=\"dropdownInput ? '' : 'output-dropdown'\" [title]=\"\n              setDropdwonReadOnlyValue(row, column)\n              \">\n            <p-cellEditor>\n              <ng-template pTemplate=\"input\">\n                <p-dropdown *ngIf=\"!row[column.field+'_obj']?.action?.hidden\" [options]=\"\n                      row[column.field+'_data']\n                        ? row[column.field+'_data']\n                        : column.data\n                    \"\n                  [(ngModel)]=\"row[column.field+'_obj']?.action && row[column.field+'_obj']?.action?.displayField?.toLowerCase() ?\n                  row[row[column.field+'_obj']?.action?.displayField.toLowerCase()] : row[column.field]\"\n                  [disabled]=\"allowDisabled(column,row)\" [placeholder]=\"row[column.displayField]\n                    ? row[column.displayField]\n                    : row[column.field] ? row[column.field] : 'Select'\" [showClear]=\"row[column.field] ? true : false\"\n                  [optionLabel]=\"column.optionLabel\" (click)=\"onClickEvent(column, row)\"\n                  [optionValue]=\"column.optionValue\" [class]=\"column.errorMessage ? 'ng-invalid ng-dirty' : ''\"\n                  [id]=\"allowDisabled(column,row) ? 'hide-border' : ''\" (blur)=\"onFocusOutEvent(column, row)\"\n                  (onChange)=\"onChangeEvent(column, row)\" [filter]=\"column.allowSearch\"></p-dropdown>\n              </ng-template>\n              <ng-template pTemplate=\"output\">\n                <span *ngIf=\"!row[column.field+'_obj']?.action?.hidden\">\n                  {{\n                  setDropdwonReadOnlyValue(row, column)\n                  }}\n                </span>\n              </ng-template>\n            </p-cellEditor>\n          </span>\n\n          <!-- MultiSelect column on Grid -->\n          <span *ngSwitchCase=\"'multi-select'\">\n            <p-cellEditor>\n              <ng-template pTemplate=\"input\">\n                <p-multiSelect [class]=\"column.errorMessage ? 'ng-invalid ng-dirty' : ''\"\n                  [id]=\"allowDisabled(column,row) ? 'hide-border' : ''\" type=\"text\"\n                  [(ngModel)]=\"typeOf(row[column.field+'_obj']) === 'object' && row[column.field+'_obj']?.action ? row[column.field+'_obj']?.action?.displayField?.toLowerCase() ?\n                    row[row[column.field+'_obj']?.action?.displayField.toLowerCase()] : row[column.field+'_obj']?.text : row[column.field]\" [disabled]=\"allowDisabled(column,row)\"\n                  [options]=\"column.data\" [optionLabel]=\"column.optionLabel\" [optionValue]=\"column.optionValue\"\n                  (onChange)=\"onChangeEvent(column, row)\" (onPanelShow)=\"showOption(column, row)\"\n                  (click)=\"onClickEvent(column, row)\" [appendTo]=\"'body'\" (blur)=\"onFocusOutEvent(column, row)\">\n                </p-multiSelect>\n              </ng-template>\n              <ng-template pTemplate=\"output\">\n                <span [title]=\"\n                      row[column.displayField]\n                        ? row[column.displayField]\n                        : setMultiSelectData(column, row[column.field])\n                    \">\n                  {{\n                  row[column.displayField]\n                  ? row[column.displayField] :\n                  setMultiSelectData(column, row[column.field])\n                  }}\n                </span>\n              </ng-template>\n            </p-cellEditor>\n          </span>\n\n          <!-- AutoComplete Search -->\n          <span *ngSwitchCase=\"'AutoComplete'\">\n            <p-cellEditor>\n              <ng-template pTemplate=\"input\">\n                <p-autoComplete \n                  [class]=\"column.errorMessage ? 'ng-invalid ng-dirty' : ''\"\n                  [id]=\"allowDisabled(column,row) ? 'hide-border' : ''\" \n                  [name]=\"column.header\"\n                  [suggestions]=\"column.data\" \n                  (onSelect)=\"autoCompleteSelectedValue(row, column, $event)\"\n                  [field]=\"column.optionLabel ? column.optionLabel?.toLowerCase() : column.displayField ? column.displayField?.toLowerCase() : column.field?.toLowerCase()\"\n                  [(ngModel)]=\"row[column.field+'_obj']?.action && row[column.field+'_obj']?.action?.displayField?.toLowerCase() ?\n                  row[row[column.field+'_obj']?.action?.displayField.toLowerCase()] :\n                  typeOf(row[column.field]) === 'object' && row[column.field]?.text ?\n                  row[column.field]?.text :\n                  row[column.field]\"\n                  [dropdown]=\"column.showOption\" \n                  (ngModelChange)=\"onChangeEvent(column, row)\"\n                  (click)=\"onClickEvent(column, row)\" \n                  (completeMethod)=\"autoSearch($event, column, row)\"\n                  (onBlur)=\"onFocusOutEvent(column, row)\" \n                  [disabled]=\"allowDisabled(column,row)\" \n                  [multiple]=\"true\"\n                  (keydown.enter)=\"onAutoCompleteFocusOut($event, column, row)\">\n                </p-autoComplete>\n              </ng-template>\n              <ng-template pTemplate=\"output\">\n                <span *ngIf=\"row[column.field] && row[column.field][0] &&  row[column.field][0][column.displayField]\">\n                  <span *ngFor=\"let value of row[column.field]; let i = index\">\n                    {{ row[column.field] && row[column.field].length > 1 ? row[column.field].length -1 === i ?\n                    value[column.displayField] : value[column.displayField] + ';' : value[column.displayField] }}\n                  </span>\n                </span>\n                <span *ngIf=\"row[column.field] && row[column.field][0] &&  row[column.field][0][column.field] && !column.displayField\">\n                  <span *ngFor=\"let value of row[column.field]; let i = index\">\n                    {{ row[column.field] && row[column.field].length > 1 ? row[column.field].length -1 === i ?\n                    value[column.field] : value[column.field] + ';' : value[column.field] }}\n                  </span>\n                </span>\n              </ng-template>\n            </p-cellEditor>\n          </span>\n          <!-- Add Generate Report Button -->\n          <span *ngSwitchCase=\"'report'\">\n            <p-cellEditor>\n              <ng-template pTemplate=\"output\">\n                <se-generate-report-btn [repId]=\"column.reportId\" [label]=\"column.label\" [params]=\"column.params\"\n                  [showDialog]=\"column.showDialog\"></se-generate-report-btn>\n              </ng-template>\n              <ng-template pTemplate=\"input\">\n                <se-generate-report-btn [repId]=\"column.reportId\" [label]=\"column.label\" [params]=\"column.params\"\n                  [showDialog]=\"column.showDialog\"></se-generate-report-btn>\n              </ng-template>\n            </p-cellEditor>\n          </span>\n\n          <span *ngSwitchDefault>\n            <!-- Input column on Grid -->\n            <p-cellEditor>\n              <ng-template pTemplate=\"input\">\n                <input pInputText type=\"text\" [class]=\"column.errorMessage ? 'ng-invalid ng-dirty' : ''\"\n                  [id]=\"allowDisabled(column,row) ? 'hide-border' : ''\"\n                  [(ngModel)]=\"row.undefined ? '' : allowDisabled(column,row) && row[column.displayField] ? row[column.displayField] : row[column.field]\"\n                  [disabled]=\"allowDisabled(column,row)\"\n                  (blur)=\"onFocusOutEvent(column, row)\" (change)=\"onChangeEvent(column, row)\"\n                  (click)=\"onClickButton(column, row)\" *ngIf=\"column.field !== dataKey; else locked_field\" />\n                <ng-template #locked_field><span *ngIf=\"!row.isNew\" [title]=\"row[column.field]\">\n                    {{ row[column.field] }}\n                  </span></ng-template>\n              </ng-template>\n              <ng-template pTemplate=\"output\">\n                <span (click)=\"onClickEvent(column, row)\" [title]=\"\n                setTextBoxReadOnlyValue(row, column)\n                                  \">\n                  {{\n                    setTextBoxReadOnlyValue(row, column)\n                  }}\n                </span>\n              </ng-template>\n            </p-cellEditor>\n          </span>\n        </span>\n      </span>\n      </td>\n      <!-- Grid Rows Data Bindings End -->\n\n      <!-- Action column on Grid -->\n      <td *ngIf=\"!setActionColumnAsFirst && columns?.length > 0 && columnActions.length > 0\"\n        [class]=\"inEditMode ? 'three-action-btn' : 'two-action-btn'\">\n        <span class=\"action-btn\" *ngFor=\"let action of columnActions\">\n          <i [title]=\"action.tooltip\" [class]=\"action.icon\" (click)=\"handleActionClick($event, action, row)\"></i>\n        </span>\n      </td>\n      <td\n        *ngIf=\"!setActionColumnAsFirst && columns?.length > 0 && useInlineCRUD && (deleteRowPermission || editRowPermission)\"\n        [class]=\"inEditMode ? 'three-action-btn' : 'two-action-btn'\"\n        [ngClass]=\"disabledSaveBtn ? 'hide-clear-filter-button' : ''\">\n        <span class='setActionColumnWidth'>\n          <se-grid-row-actions [editing]=\"editing\" [editRowPermission]=\"editRowPermission\"\n            [deleteRowPermission]=\"deleteRowPermission\" [hideDeleteBtn]=\"hideDeleteBtn\" [hideEditBtn]=\"hideEditBtn\"\n            [row]=\"row\" (onRowEditInitBtn)=\"onRowEditInit($event)\" (deleteRecordBtn)=\"deleteRecord($event)\"\n            (onRowEditSaveBtn)=\"onRowEditSave($event)\" (onRowEditCancelBtn)=\"onRowEditCancel($event, ri)\"\n            [editAllRows]=\"editAllRows\">\n          </se-grid-row-actions>\n        </span>\n      </td>\n    </tr>\n  </ng-template>\n\n  <!-- Footer columns on Grid -->\n  <ng-template pTemplate=\"footer\">\n    <tr *ngIf=\"aggregateFooter\">\n      <td\n        *ngIf=\"setActionColumnAsFirst && (columnActions.length > 0 || (useInlineCRUD && (deleteRowPermission || editRowPermission)))\"\n        [class]=\"inEditMode ? 'three-action-btn' : 'two-action-btn'\"></td>\n      <td *ngIf=\"allowSelection\" [class]=\"inEditMode ? 'three-action-btn' : 'two-action-btn'\"></td>\n      <td *ngFor=\"let outerColumn of selectedColumns\" class=\"grid-component-outer-column\">\n        <div *ngFor=\"let innerColumn of selectedColumns\">\n          <div *ngFor=\"let aggr of innerColumn?.aggregate\">\n            <div\n              *ngIf=\"aggr.aggrValue?.length && ((!aggr.displayField && innerColumn.field?.toLowerCase() === outerColumn.field?.toLowerCase()) || aggr.displayField && aggr.displayField?.toLowerCase() === outerColumn.field?.toLowerCase())\">\n              <div [innerHTML]=\"aggr.aggrValue\">\n              </div>\n            </div>\n          </div>\n        </div>\n      </td>\n      <td\n        *ngIf=\"!setActionColumnAsFirst && columns?.length > 0 && useInlineCRUD && (deleteRowPermission || editRowPermission)\"\n        [class]=\"inEditMode ? 'three-action-btn' : 'two-action-btn'\"\n        [ngClass]=\"disabledSaveBtn ? 'hide-clear-filter-button' : ''\"></td>\n    </tr>\n  </ng-template>\n\n  <!-- Footer for Empty Message columns on Grid -->\n  <ng-template pTemplate=\"emptymessage\">\n    <tr class=\"grid-component no-records-found\">\n      <td [attr.colspan]=\"selectedColumns?.length + 1\">{{totalRecords==0? 'No records found':''}}</td>\n    </tr>\n  </ng-template>\n</p-table>\n</div>",
+                  template: "<div class=\"grid-component-wrapper\">\n<p-confirmDialog [style]=\"{ width: '50vw' }\" *ngIf=\"useInlineCRUD\" key=\"handleInlineCRUD\"></p-confirmDialog>\n<p-confirmDialog class=\"grid-component-confirm-dialog\" *ngIf=\"columnActions.length > 0\"\n  key=\"handlecolumnActions\"></p-confirmDialog>\n<div class=\"p-mb-2 p-ai-center global-filter-buttons-wrapper\">\n\n  <!-- button for apply value on Grid -->\n  <button *ngIf=\"filtering && !hideFilter\" pButton type=\"button\" icon=\"pi pi-search\" (click)=\"applyGirdFilterBtn()\"\n    [class]=\"\n  searchGridFilter ? 'p-button-success apply-filter-btn filter-btn' : 'hide-clear-filter-button apply-filter-btn filter-btn'\n  \"></button>\n\n  <!-- button for clear value on Grid -->\n  <button *ngIf=\"filtering && !hideFilter\" pButton id=\"clearGridFilterValuesButton\" type=\"button\"\n    icon=\"pi pi-replay\" (click)=\"cleargridFiltersValue()\" [class]=\"\n      clearGridFilter ? 'filter-btn' : 'hide-clear-filter-button filter-btn'\n      \" class='global-refresh global-btn'\n    ></button>\n\n  <!-- button for save all grid at once -->\n  <button pButton *ngIf=\"editAllRows && editRowPermission\" id=\"saveAllGridValues\"\n    icon=\"pi pi-check\" [label]=\"'Save'\"\n    [class]=\"hideGridSaveButton ? 'hide-clear-filter-button' : 'ui-button-info'\" type=\"button\"\n    (click)=\"saveAllRowsAtOnce()\"></button>\n\n  <!-- button for cancel all grid at once -->\n  <button pButton *ngIf=\"editAllRows && !hideGridCancelButton\" id=\"editBtnGlobalvalues\" type=\"button\" [label]=\"'Cancel'\"\n    icon=\"pi pi-times\" class=\"ui-button-info\" (click)=\"cancelAllRowsAtOnce()\"></button>\n\n  <!-- header Button for multiSelect on Grid -->\n  <span *ngIf=\"allowColumnToggle\">\n    <p-multiSelect [showToggleAll]=\"false\" [options]=\"columns\" [(ngModel)]=\"selectedColumns\" optionLabel=\"header\"\n      selectedItemsLabel=\"{0} columns selected\"  class=\"grid-component-multiselect-header-button\" placeholder=\"Choose Columns\">\n    </p-multiSelect>\n  </span>\n\n  <!-- header Button for Adding new Row on Grid -->\n  <button pButton *ngIf=\"useInlineCRUD && addRowPermission && !hideAddBtn\" type=\"button\" [label]=\"'Add'\" pAddRow\n    [table]=\"componentTableRef\" [newRow]=\"newGridRow\" [id]=\"dataKey\" pTooltip=\"Add New Row\" tooltipPosition=\"bottom\"\n    icon=\"pi pi-plus\" class=\"ui-button-info global-add-btn\" (click)=\"addNewRow(newGridRow, true)\" pRipple></button>\n\n  <div *ngFor=\"let reportButton of reportButtons\" class=\"ui-button-info p-mr-2 p-ml-2\">\n    <se-generate-report-btn *ngIf =\"!reportButton.hidden\"[repId]=\"reportButton.reportId\" [label]=\"reportButton.label\" [params]=\"reportButton.params\"\n      [showDialog]=\"reportButton.showDialog\"></se-generate-report-btn>\n  </div>\n\n  <!-- header Button for Excel File on Grid -->\n  <button *ngIf=\"allowExportToExcel\" type=\"button\" pButton icon=\"pi pi-file-excel\" (click)=\"exportExcel()\"\n    class=\"p-button-success\" pTooltip=\"Export to Excel\" tooltipPosition=\"bottom\" pRipple></button>\n\n  <!-- header Button for PDF File on Grid -->\n  <button *ngIf=\"allowExportToPdf\" type=\"button\" pButton icon=\"pi pi-file-pdf\" (click)=\"exportPdf()\"\n    class=\"p-button-warning p-mr-2 p-ml-2\" pTooltip=\"Export to Pdf\" tooltipPosition=\"bottom\" pRipple></button>\n    <ng-content></ng-content>\n</div>\n\n<p-table *ngIf=\"!isGridHidden\" id=\"my-table\" [value]=\"rowsData\" [columns]=\"selectedColumns\" sortMode=\"multiple\"\n  [lazy]=\"useServerSideEvents\" [paginator]=\"pagination\" [alwaysShowPaginator]=\"pagination && totalRecords > 0\" [class]=\"pagination || !rowsData.length ? 'pagination' : ''\"\n  class=\"grid-component-main-table\"\n  [rows]=\"defaultRows\" [totalRecords]=\"totalRecords\" [rowsPerPageOptions]=\"setPaginationLength\"\n  [showCurrentPageReport]=\"showCurrentPageReport\" currentPageReportTemplate=\"Showing {first} to {last} of {{\n    totalRecords\n  }} entries\" [loading]=\"autoLoadData && !setGridRefreshTime ? loading : false\"\n  (onSort)=\"sortDisabled ?? handleSortChange($event)\" (onFilter)=\"handleFilterChange($event)\"\n  (onLazyLoad)=\"autoLoadData ? handleServerSideEvents($event) : ''\" (onPage)=\"handleServerSidePagination($event)\" #dt\n  [dataKey]=\"dataKey\" [(selection)]=\"selectedRows\" selectionMode=\"multiple\" [scrollable]=\"scrollable\" \n  [tableStyle]=\"{ 'max-height': scrollHeight }\"\n  editMode=\"row\" [editingRowKeys]=\"editingRowKeys\" [autoLayout]=\"true\" [rowHover]=\"rowHover\"\n  [ngClass]=\"{'horizontal-scroll': horizontalScroll === true ? true : false}\">\n  <!-- [scrollHeight]=\"scrollHeight\"   -->\n  <!-- header Button for Action on Grid -->\n  <div *ngIf=\"rowActions.length > 0 && rowActions.length > 0\" class=\"p-d-flex p-jc-end\">\n    <span *ngFor=\"let rowAction of rowActions\">\n      <button pButton type=\"button\" [label]=\"rowAction.title\" [class]=\"rowAction.class\"\n        (click)=\"rowAction.onClick(selectedRows)\"></button>\n    </span>\n  </div>\n\n  <!-- header columns on Grid -->\n  <ng-template pTemplate=\"header\" let-cols>\n    <tr>\n      <th *ngIf=\"allowSelection && selectionType === 'multiple'\" class=\"grid-component-selection\">\n        <div class=\"grid-component-table-header-inner-div-2\n              table-header-inner-div div-last-inner-html-is-icon\">\n          <span class=\"flex-grow-1\"> {{allowSelectionHeader}} </span>\n          <p-tableHeaderCheckbox *ngIf=\"selectionType === 'multiple'\" binary=\"true\"\n            (click)=\"multiCheckBoxOnclick(rowsData, $event)\"></p-tableHeaderCheckbox>\n        </div>\n      </th>\n      <th *ngIf=\"allowSelection && selectionType === 'single'\" \n            class=\"grid-component-selection\">\n        Select\n      </th>\n      <th\n        *ngIf=\"setActionColumnAsFirst && !disabledSaveBtn && columns?.length > 0 && (columnActions.length > 0 || (useInlineCRUD && (deleteRowPermission || editRowPermission)))\"\n        [class]=\"inEditMode ? 'three-action-btn' : 'two-action-btn'\">\n        Actions\n      </th>\n      <th *ngFor=\"let column of cols\" [pSortableColumn]=\"column.field\"\n        [class]=\"column.type === 'boolean' ? 'checkbox-th' : ''\"\n        [pSortableColumnDisabled]=\"sortDisabled && useServerSideEvents ? true : column.sorting === false\"\n        class=\"column?.type === 'multiple' ? 'grid-component-select-th-column-type-multiple' : ''\">\n        <div class=\"grid-component-table-header-inner-div-1 table-header-inner-div div-last-inner-html-is-icon\">        \n          <span [class]=\"'flex-grow-1'\">{{ column.header }}</span>\n          <span *ngIf=\"column.isRequired\" class=\"grid-component required-star\">*</span>\n          <p-sortIcon *ngIf=\"column.sorting !== false && column?.type !== 'multiple'\"\n            [field]=\"column.field\"></p-sortIcon>\n        </div>\n      </th>\n      <th\n        *ngIf=\"!setActionColumnAsFirst && !disabledSaveBtn && columns?.length > 0 && (columnActions.length > 0 || (useInlineCRUD && (deleteRowPermission || editRowPermission)))\"\n        [class]=\"inEditMode ? 'three-action-btn' : 'two-action-btn'\">Actions</th>\n    </tr>\n    <tr *ngIf=\"filtering && !hideFilter\">\n      <th *ngIf=\"allowSelection\" [class]=\"inEditMode ? 'three-action-btn' : 'two-action-btn'\"></th>\n      <th *ngIf=\"setActionColumnAsFirst && !disabledSaveBtn\"\n        [class]=\"inEditMode ? 'three-action-btn' : 'two-action-btn'\">\n      </th>\n      <th *ngFor=\"let column of cols\" [ngSwitch]=\"column?.filter?.type\" [style]=\"column.style\"\n        [class]=\"hideFilterOptions ? 'hide-table-filter' : ''\">\n        <span *ngIf=\"column.filtering !== false\" [class]=\"column.filter?.showFilter ? '' : 'hide-filter-icon'\">\n          <!-- Text input on Header For Filter-->\n          <p-columnFilter [type]=\"'text'\" [field]=\"column.field\" *ngSwitchCase=\"'input'\">\n            <ng-template pTemplate=\"filter\" let-value let-filter=\"filterCallback\">\n              <input type=\"text\" [(ngModel)]=\"column.filterValue\" (keyup.enter)=\"applyEnterEvent(filter, $event, column)\"\n                (blur)=\"setFilterFocusOut(column, filter, $event)\" (keydown)=\"backspaceEvent($event, column)\"\n                (keyup)=\"removingFilters($event, column)\" pInputText />\n            </ng-template>\n          </p-columnFilter>\n\n          <!-- Numeric input on Header For Filter-->\n          <p-columnFilter [type]=\"'numeric'\" [field]=\"column.field\" *ngSwitchCase=\"'numeric_input'\">\n            <ng-template pTemplate=\"filter\" let-value let-filter=\"filterCallback\">\n              <p-inputNumber [(ngModel)]=\"column.filterValue\" (keyup.enter)=\"applyEnterEvent(filter, $event, column)\"\n                (onBlur)=\"setFilterFocusOut(column, filter, $event)\" (keydown)=\"backspaceEvent($event, column)\"\n                (keyup)=\"removingFilters($event, column)\"></p-inputNumber>\n            </ng-template>\n          </p-columnFilter>\n\n            <!-- lookup input on Header For Filter-->\n            <p-columnFilter\n              [type]=\"'text'\"\n              [field]=\"column.field\"\n              *ngSwitchCase=\"'lookup_input'\"\n            >\n              <ng-template\n                pTemplate=\"filter\"\n                let-value\n                let-filter=\"filterCallback\"\n              >\n                <div class=\"close-icon-wrapper grid-component lookup-filter-wrapper\">\n                  <div class=\"lookup-filter-input-wrapper\"> \n                  <input\n                    id=\"lookUp_filter\"\n                    class=\"grid-component lookup-filter\"\n                    autocomplete=\"off\"\n                    type=\"text\"\n                    [(ngModel)]=\"column.filterValue\"\n                    (click)=\"setFilterLookup(column)\"\n                    (keyup.enter)=\"applyEnterEvent(filter, $event, column)\"\n                    (blur)=\"setFilterFocusOut(column, filter, $event)\"\n                    (keydown)=\"backspaceEvent($event, column)\"\n                    (keyup)=\"removingFilters($event, column)\"\n                    pInputText\n                  />\n                  </div>  \n                  <div><button\n                      *ngIf=\"column.filterValue\"\n                      icon=\"pi pi-times\"\n                      pButton\n                      type=\"button\"\n                      (click)=\"lookupClearValue(column)\"\n                    ></button></div>\n                </div>\n              </ng-template>\n            </p-columnFilter>\n\n          <!-- checkbox on Header For Filter-->\n          <p-columnFilter type=\"boolean\" [field]=\"column.field\" *ngSwitchCase=\"'checkbox'\">\n            <ng-template pTemplate=\"filter\" let-value let-filter=\"filterCallback\">\n              <p-checkbox [binary]=\"true\" [disabled]=\"column.disabled\" [(ngModel)]=\"column.filterValue\"\n                (keyup.enter)=\"applyEnterEvent(filter, $event, column)\"\n                (onChange)=\"setFilterFocusOut(column, filter, $event)\" (click)=\"clickCheckBoxFilter(column)\"\n                (keydown)=\"backspaceEvent($event, column)\">\n              </p-checkbox>\n            </ng-template>\n          </p-columnFilter>\n\n          <!-- multiSelect on Header For Filter-->\n          <p-columnFilter [field]=\"column.field\" matchMode=\"in\" [showMenu]=\"false\" *ngSwitchCase=\"'multi-select'\">\n            <ng-template pTemplate=\"filter\" let-value let-filter=\"filterCallback\">\n              <p-multiSelect [ngModel]=\"column.filterValue\" [options]=\"column.filter.data || []\" (onChange)=\"filter($event.value)\"\n                (blur)=\"setFilterFocusOut(column, filter, $event)\" (keydown)=\"backspaceEvent($event, column)\"\n                placeholder=\"Any\" optionLabel=\"label\">\n              </p-multiSelect>\n            </ng-template>\n          </p-columnFilter>\n\n          <!-- dropdown on Header For Filter-->\n          <p-columnFilter [field]=\"column.field\" matchMode=\"in\" [showMenu]=\"false\" *ngSwitchCase=\"'dropdown'\">\n            <ng-template pTemplate=\"filter\" let-value let-filter=\"filterCallback\">\n              <p-dropdown [showClear]=\"true\" [placeholder]=\"'Select'\" [filter]=\"column.allowSearch\"\n                [(ngModel)]=\"column.filterValue\" (keyup.enter)=\"applyDropdownFilter(filter, $event)\"\n                [options]=\"column.filter.data || []\"\n                (onChange)=\"searchDropdownFilter(filter, $event, column)\"></p-dropdown>\n            </ng-template>\n          </p-columnFilter>\n\n          <!-- calendar on Header For Filter-->\n          <p-columnFilter [field]=\"column.field\" matchMode=\"in\" [showMenu]=\"false\" *ngSwitchCase=\"'calendar'\">\n            <ng-template pTemplate=\"filter\" let-value let-filter=\"filterCallback\">\n              <p-calendar [placeholder]=\"'Select-Date'\" [(ngModel)]=\"column.filterValue\"\n                (keyup.enter)=\"applyEnterEvent(filter, $event, column)\" appendTo=\"body\" (onSelect)=\"selectDate(column)\"\n                [inputId]=\"column.field\" hourFormat=\"12\" (keyup.backspace)=\"removeNullCalendar(column, filter, $event)\"\n                [showButtonBar]=\"true\" (onClose)=\"setFilterFocusOut(column, filter, $event)\"\n                (keydown)=\"backspaceEvent($event, column)\" (onClearClick)=\"backspaceEvent($event, column)\">\n              </p-calendar>\n            </ng-template>\n          </p-columnFilter>\n\n          <!-- Default Filter For Header  -->\n          <p-columnFilter [type]=\"\n              column.type && column.type !== 'link' ? column.type : 'text'\n            \" [field]=\"column.field\" display=\"menu\" *ngSwitchDefault>\n          </p-columnFilter>\n        </span>\n      </th>\n      <th\n        *ngIf=\"!setActionColumnAsFirst && !disabledSaveBtn && columns?.length > 0 && (columnActions.length > 0 || (useInlineCRUD && (deleteRowPermission || editRowPermission)))\"\n        [class]=\"inEditMode ? 'three-action-btn' : 'two-action-btn'\"></th>\n    </tr>\n  </ng-template>\n\n  <!-- Body columns on Grid -->\n  <ng-template pTemplate=\"body\" let-row let-editing=\"editing\" let-ri=\"rowIndex\">\n    <tr [ngClass]=\"row?.highlightrow ? 'highlighted-row' : ''\"\n      [class]=\"wordWrap ? 'p-selectable-row' : 'noWrap p-selectable-row'\" (click)=\"!editing && handleRowClick(row)\"\n      [pEditableRow]=\"row\" #gridRow [id]=\"row[dataKey]\">\n      <td *ngIf=\"allowSelection\" class=\"grid-component-selection\">\n        <p-tableRadioButton [value]=\"row\" *ngIf=\"selectionType === 'single'\"\n          (click)=\"multiCheckBoxOnclick(row , $event, true)\"></p-tableRadioButton>\n        <p-tableCheckbox [value]=\"row\" *ngIf=\"selectionType === 'multiple'\"\n          (click)=\"multiCheckBoxOnclick(row, $event)\"></p-tableCheckbox>\n      </td>\n\n      <!-- first actions column -->\n      <td *ngIf=\"setActionColumnAsFirst && columnActions.length > 0\">\n        <span class=\"action-btn\" *ngFor=\"let action of columnActions\">\n          <i [title]=\"action.tooltip\" [class]=\"action.icon\" (click)=\"handleActionClick($event, action, row)\"></i>\n        </span>\n      </td>\n      <td *ngIf=\"setActionColumnAsFirst && useInlineCRUD && (deleteRowPermission || editRowPermission)\"\n        [class]=\"inEditMode ? 'three-action-btn' : 'two-action-btn'\"\n        [ngClass]=\"disabledSaveBtn ? 'hide-clear-filter-button' : ''\">\n        <span class=\"setActionColumnWidth\">\n          <se-grid-row-actions [editing]=\"editing\" [editRowPermission]=\"editRowPermission\"\n            [deleteRowPermission]=\"deleteRowPermission\" [hideDeleteBtn]=\"hideDeleteBtn\" [hideEditBtn]=\"hideEditBtn\"\n            [row]=\"row\" (onRowEditInitBtn)=\"onRowEditInit($event)\" (deleteRecordBtn)=\"deleteRecord($event)\"\n            (onRowEditSaveBtn)=\"onRowEditSave($event)\" (onRowEditCancelBtn)=\"onRowEditCancel($event, ri)\"\n            [editAllRows]=\"editAllRows\">\n          </se-grid-row-actions>\n        </span>\n      </td>\n\n      <!-- Grid Rows Data Bindings Start -->\n      <td *ngFor=\"let column of selectedColumns\" [ngSwitch]=\"column.type\" >\n\n        <!-- Boolean column on Grid -->\n        <span *ngSwitchCase=\"'boolean'\">\n      <td *ngIf=\"!editing\">\n        <p-checkbox [disabled]=\"!column.allowEdit ?? true\" [binary]=\"true\" (click)=\"onClickEvent(column, row)\"\n          (ngModelChange)=\"checkBoxChangeEvent($event, column, row)\" (blur)=\"onFocusOutEvent(column, row)\" \n          [(ngModel)]=\" \n            row[column.field] &&\n            (row[column.field].toString() === '1' ||\n              row[column.field].toString().toLowerCase() === 'true' ||\n              row[column.field].toString().toLowerCase() === 'y'||\n              ( row[column.field].text && (row[column.field]?.text?.toString() === '1' ||\n              row[column.field]?.text?.toString()?.toLowerCase() === 'true' ||\n              row[column.field]?.text?.toString()?.toLowerCase() === 'y')))\n                ? Checked\n                : unChecked\n               \">\n        </p-checkbox>\n      </td>\n      <td *ngIf=\"editing\">\n        <p-cellEditor>\n          <ng-template pTemplate=\"input\">\n            <!-- for edit checkBox -->\n            <p-checkbox (click)=\"onClickEvent(column, row)\" (ngModelChange)=\"checkBoxChangeEvent($event, column, row)\"\n              [disabled]=\"allowDisabled(column,row)\" [binary]=\"true\" [(ngModel)]=\"\n                  row[column.field] &&   \n                  (row[column.field].toString() === '1' ||\n                    row[column.field].toString().toLowerCase() === 'true' ||\n                    row[column.field].toString().toLowerCase() === 'y' ||\n                    ( row[column.field].text && (row[column.field]?.text?.toString() === '1' ||\n                    row[column.field]?.text?.toString()?.toLowerCase() === 'true' ||\n                    row[column.field]?.text?.toString()?.toLowerCase() === 'y')))\n                    ? editModeChecked\n                    : editModeunCkecked\n                \" (blur)=\"onFocusOutEvent(column, row)\"></p-checkbox>\n          </ng-template>\n          <ng-template pTemplate=\"output\">\n            {{ row[column.field] }}\n          </ng-template>\n        </p-cellEditor>\n      </td>\n      </span>\n\n      <!-- link column on Grid -->\n      <span *ngSwitchCase=\"'link'\">\n        <!-- link column for HyperLink Case -->\n        <span *ngIf=\"column.allowSave === false\">\n          <span *ngIf=\"column.target !== '_self'\" (click)=\"onClickEvent(column, row)\"\n            [title]=\"setConditionBaseValue(row, column)\" class=\"custom-link\"\n            [class]=\"allowDisabled(column,row) ? 'disabled-link' : ''\">\n\n          <a  [href]=\"column.disabled?'':row[column.field + '_obj']?.hyperlink\" target=\"_blank\">\n              <i *ngIf=\"column.icon &&!row[column.field+'_obj']?.action?.hideFieldValue; else noIcon\" [class]=\"column.icon\"></i>\n              <ng-template #noIcon>\n                {{\n                  row[column.field+'_obj']?.hideFieldValue?'':\n                  setConditionBaseValue(row, column)\n                }}\n              </ng-template>\n            </a>\n      \n          </span>\n          <span *ngIf=\"column.target === '_self'\" (click)=\"onClickEvent(column, row)\"\n            [title]=\"setConditionBaseValue(row, column)\"class=\"custom-link\"\n            [class]=\" allowDisabled(column,row) ? 'disabled-link' : ''\">\n\n            <a  [href]=\"column.disabled?'':row[column.field + '_obj']?.hyperlink\" [target]='column.target'>\n              <i *ngIf=\"column.icon &&!row[column.field+'_obj']?.hideFieldValue; else noIcon\" [class]=\"column.icon\"></i>\n              <ng-template #noIcon>\n                {{\n                  row[column.field+'_obj']?.hideFieldValue?'':\n                  setConditionBaseValue(row, column)\n                }}\n              </ng-template>\n            </a>\n\n          </span>\n        </span>\n        <!-- link column for Edit Case -->\n        <span *ngIf=\"column.allowSave || column.allowSave === undefined\">\n          <p-cellEditor>\n            <ng-template pTemplate=\"input\">\n              <span\n                *ngIf=\"(column.editable === true || column.editable === undefined) && (column.editLink === true || column.editLink === undefined)\">\n                <input *ngIf=\"!row.isNew\" pInputText (click)=\"onClickEvent(column, row)\" type=\"text\"\n                  [class]=\"column.errorMessage ? 'ng-invalid ng-dirty' : ''\"\n                  [(ngModel)]=\"row[column.field+'_obj']?.hideFieldValue ? '' : row[column.field+'_obj']?.displayField?.toLowerCase() ?\n                  row[row[column.field+'_obj']?.displayField.toLowerCase()] : row[column.field]\" (blur)=\"onFocusOutEvent(column, row)\"\n                  (change)=\"onChangeEvent(column, row)\" />\n                <input pInputText *ngIf=\"row.isNew\" type=\"text\" (click)=\"onClickEvent(column, row)\"\n                  [class]=\"column.errorMessage ? 'ng-invalid ng-dirty' : ''\"\n                  [(ngModel)]=\"row[column.field+'_obj']?.displayField?.toLowerCase() ? row[row[column.field+'_obj']?.displayField.toLowerCase()] :\n                  row[column.field]\" (blur)=\"onFocusOutEvent(column, row)\"\n                  (change)=\"onChangeEvent(column, row)\" />\n              </span>\n              <span *ngIf=\"column.editable === false\" >\n              <a class=\"custom-link\" (click)=\"onClickEvent(column, row)\" [href]=\"row[column.field + '_obj']?.hyperlink\" [target]='column.target'\n                [class]=\"allowDisabled(column,row) ? 'disabled-link' : ''\">\n                <i *ngIf=\"column.icon && !row[column.field+'_obj']?.hideFieldValue; else noIcon\"[class]=\"column.icon\"></i>\n                <ng-template #noIcon>\n                {{\n                  row[column.field+'_obj']?.hideFieldValue?'':\n                  setConditionBaseValue(row, column)\n                  }}\n              </ng-template>\n              \n                </a>\n              </span>\n              <span *ngIf=\"column.editLink === false\">\n                <a (click)=\"onClickEvent(column, row)\" [href]=\"row[column.field + '_obj']?.hyperlink\" target=\"_blank\"\n                  [class]=\"column.editable === false ? '' : allowDisabled(column,row) ? 'disabled-link' : ''\">\n                  <i *ngIf=\"column.icon && !row[column.field+'_obj']?.hideFieldValue; else noIcon\"[class]=\"column.icon\"></i>\n                  <ng-template #noIcon>\n                  {{\n                    row[column.field+'_obj']?.hideFieldValue?'':\n                    setConditionBaseValue(row, column)\n                    }}\n                </ng-template>\n                \n                </a>\n              </span>\n            </ng-template>\n            <ng-template pTemplate=\"output\">\n              <span  class=\"custom-link\"  [class]=\"column.editable === false || allowDisabled(column,row) ? 'disabled-link' : ''\">\n                <a  (click)=\"onClickEvent(column, row)\" [href]=\"column.disabled?'':row[column.field + '_obj']?.hyperlink\" [target]=\"column.target\"\n               >\n                  <i *ngIf=\"column.icon&& !row[column.field+'_obj']?.hideFieldValue; else noIcon\"[class]=\"column.icon\"></i>\n                  <ng-template #noIcon>\n                 {{\n                    row[column.field+'_obj']?.hideFieldValue?'':\n                    setConditionBaseValue(row, column)\n                    }}\n                </ng-template>\n                </a>\n\n              </span>\n            </ng-template>\n          </p-cellEditor>\n        </span>\n      </span>\n\n      <!-- Iframe column on Grid -->\n      <span *ngSwitchCase=\"'iframe'\">\n        <span class=\"custom-link\" (click)=\"gridIFrame(column, row[column.field + '_obj']?.hyperlink, row)\" [title]=\"\n              row[column.field + '_obj'] &&\n              (row[column.field + '_obj'].displayText === null || row[column.field + '_obj'].displayText === '')\n                ? row[column.field] : row[column.field + '_obj']?.displayText\n                ? row[column.field + '_obj'].displayText\n                : column.displayText\n                ? column.displayText\n                : row[column.field]\n\n            \"\n          >  \n          <i *ngIf=\"column.icon; else noIcon\"[class]=\"column.icon\"></i>\n          <ng-template #noIcon>\n          {{\n            row[column.field + '_obj'] &&\n            (row[column.field + '_obj'].displayText === null || row[column.field + '_obj'].displayText === '')\n            ? row[column.field] : row[column.field + '_obj']?.displayText\n            ? row[column.field + '_obj'].displayText\n            : column.displayText ? column.displayText : row[column.field]\n          }}\n          </ng-template>\n          </span>\n        </span>\n\n        <!-- dialog column on Grid -->\n        <span *ngSwitchCase=\"'dialog'\">\n          <p-cellEditor>\n            <ng-template pTemplate=\"input\">\n              <span\n                *ngIf=\"row[column.field + '_secondType'] !== 'date' && !row.hidegridbtn\" \n                [title]=\"setConditionBaseValue(row, column) \"\n              >\n                <span *ngIf=\"column.editable === true && !row[column.field+'_obj']?.hideFieldValue\">\n                  <input\n                  readonly\n                    [class]=\"column.errorMessage ? 'ng-invalid ng-dirty' : ''\"\n                    [id]=\"allowDisabled(column,row) ? 'hide-border' : ''\"\n                    type=\"text\"\n                    pInputText\n                    (click)=\"selectLookupField(column, row)\"\n                    [(ngModel)]=\"row[column.field+'_obj']?.displayField ?\n                    row[row[column.field+'_obj']?.displayField?.toLowerCase()] : \n                    row[column.field]\"\n                    [name]=\"row[column.field]\"\n                    [disabled]=\"allowDisabled(column,row)\"\n                    (blur)=\"onFocusOutEvent(column, row)\"\n                  />\n                </span>\n                <span\n                  *ngIf=\"column.editable === false || column.editable === undefined\n                  \" class=\"custom-link\"\n                  [class]=\"\n                  allowDisabled(column,row) ? 'disabled-link' : ''\n                  \" (click)=\"openGridDialog(column, row)\">\n\n                <i *ngIf=\"column.icon && !row[column.field+'_obj']?.hideFieldValue ; else noIcon\" [class]=\"column.icon\"></i>\n                <ng-template #noIcon>{{ (!column.displayText && row.isNew ) || row[column.field+'_obj']?.hideFieldValue ? '' : setConditionBaseValue(row, column)\n                  }}</ng-template>\n\n\n              </span>\n            </span>\n\n            <span *ngIf=\"row[column.field + '_secondType'] === 'date'\" [title]=\"\n                  row[column.field]\n                    | date: (column.format ? column.format : 'MM/dd/YY')\n                \">\n              <p-calendar [class]=\"column.errorMessage ? 'ng-invalid ng-dirty' : ''\"\n                [id]=\"allowDisabled(column,row) ? 'hide-border' : ''\" (onClose)=\"onFocusOutEvent(column, row)\"\n                [appendTo]=\"'body'\" hourFormat=\"12\" [showTime]=\"column.showTime\" (click)=\"onClickEvent(column, row)\"\n                [timeOnly]=\"column.timeOnly\"\n                [(ngModel)]=\"row[column.field+'_obj']?.displayField ?\n                  row[row[column.field+'_obj']?.displayField.toLowerCase()] : row[column.field]\"\n                [disabled]=\"allowDisabled(column,row)\"></p-calendar>\n            </span>\n          </ng-template>\n          <ng-template pTemplate=\"output\">\n            <span class=\"custom-link\"\n              [class]=\"row.disabled   || allowDisabled(column,row) ? 'disabled-link' : ''\"\n              (click)=\"openGridDialog(column, row)\" *ngIf=\"!row[column.field + '_secondType'] && !row.hidegridbtn\"\n              [title]=\"setConditionBaseValue(row, column)\">\n             <i *ngIf=\"column.icon && !row[column.field+'_obj']?.hideFieldValue ; else noIcon\" [class]=\"column.icon\"></i>\n              <ng-template #noIcon>{{ row[column.field+'_obj']?.hideFieldValue ? '' : setConditionBaseValue(row, column) }}</ng-template>\n\n              <!-- {{ setConditionBaseValue(row, column) }} -->\n            </span>\n          </ng-template>\n        </p-cellEditor>\n      </span>\n\n      <!-- lookup Input column on Grid -->\n      <span *ngSwitchCase=\"'lookup_input'\">\n        <p-cellEditor>\n          <ng-template pTemplate=\"input\">\n            <div class=\"close-icon-wrapper\">\n              <input readonly type=\"text\" pInputText\n                [(ngModel)]=\"row[column.field+'_obj']?.action && row[column.field+'_obj']?.action?.displayField  ?\n                row[row[column.field+'_obj']?.action?.displayField?.toLowerCase()] :\n                typeOf(row[column.field+'_obj']) === 'object' && row[column.field+'_obj']?.text?.text ? row[column.field+'_obj']?.text?.text : \n                column.displayField ? row[column.displayField] : row[column.field]\n                \"\n                (keyup.tab)=\"selectLookupField(column, row)\" [disabled]=\"allowDisabled(column,row)\"\n                (click)=\"selectLookupField(column, row)\" [id]=\"allowDisabled(column,row) ? 'hide-border' : ''\"\n                [class]=\"column.errorMessage ? 'ng-invalid ng-dirty' : ''\" (blur)=\"onFocusOutEvent(column, row)\" />\n              <div *ngIf=\"!allowDisabled(column,row)\"><button *ngIf=\"row[column.field] && typeOf(row[column.field]) === 'object'\n                ? row[column.field].text\n                : row[column.field] && !column.disabled\" icon=\"pi pi-times\" pButton type=\"button\"\n                  (click)=\"lookupClearValue(column,row)\"></button></div>\n            </div>\n          </ng-template>\n          <ng-template pTemplate=\"output\">\n            <span *ngIf=\"column.linkId\">\n              <a [href]=\"row[column.field + '_obj']?.hyperlink\" [target]=\"column.target === '_self' ? '' :  '_blank'\">\n                {{\n                  setLookupReadOnlyValue(row, column)\n                }}\n              </a>\n            </span>\n            <span *ngIf=\"!column.linkId\" [class]=\"column.component && column.editLink === true ? 'custom-link' : ''\"\n              (click)=\"openLookupHyperlink(column, row)\">\n              {{\n                setLookupReadOnlyValue(row, column)\n              }}\n            </span>\n          </ng-template>\n        </p-cellEditor>\n      </span>\n\n      <!-- Numeric Input column on Grid -->\n      <span *ngSwitchCase=\"'numeric'\">\n        <p-cellEditor>\n          <ng-template pTemplate=\"input\">\n            <!-- for Currency && Decimal && Percent -->\n            <span class=\"input-number\">\n              <p-inputNumber [id]=\"allowDisabled(column,row) ? 'hide-border' : ''\" [class]=\"\n                    column.errorMessage\n                      ? 'ng-invalid ng-dirty'\n                      : 'form-control'\n                  \" [showButtons]=\"!column.format ? true : false\"\n                [(ngModel)]=\"row[column.field+'_obj']?.displayField ? row[row[column.field+'_obj']?.displayField?.toLowerCase()] : row[column.field]\" [name]=\"column.field\"\n                [disabled]=\"allowDisabled(column,row)\" (ngModelChange)=\"onChangeEvent(column, row)\"\n                (onBlur)=\"onFocusOutEvent(column, row)\" [mode]=\"\n                    column.format &&\n                    column.format.type === 'currency'\n                      ? 'currency'\n                      : 'decimal'\n                  \" [currency]=\"\n                    column.format &&\n                    column.format.type === 'currency' &&\n                    column.format.formatParams &&\n                    column.format.formatParams.currency\n                      ? column.format.formatParams.currency\n                      : 'USD'\n                  \" [locale]=\"\n                    column.format &&\n                    column.format.type === 'currency' &&\n                    column.format.formatParams &&\n                    column.format.formatParams.locale\n                      ? column.format.formatParams.locale\n                      : 'en-US'\n                  \" [minFractionDigits]=\"column.format ? setNumericMinMxFraction(column) : '0'\"\n                [maxFractionDigits]=\"column.format ? setNumericMinMxFraction(column) : '0'\" [suffix]=\"\n                    column.format &&\n                    column.format.type === 'percent' && \n                       '%'\n                      \n                  \">\n              </p-inputNumber>\n            </span>\n            <ng-template #locked_field><span *ngIf=\"!row.isNew\" [title]=\"row[column.field]\">\n                {{ row[column.field] }}\n              </span></ng-template>\n          </ng-template>\n          <ng-template pTemplate=\"output\">\n            <span [title]=\"setNumericFormat(column, row)\">\n              {{\n              setNumericFormat(column, row)\n              }}\n            </span>\n          </ng-template>\n        </p-cellEditor>\n      </span>\n\n      <!-- Button column on Grid -->\n      <span>\n        <div *ngSwitchCase=\"'add_button'\">\n          <button *ngIf=\"!row.hidegridbtn\" pButton type=\"button\"\n            [icon]=\"row[column.field+'_obj']?.icon ? row[column.field+'_obj']?.icon : column.icon\"\n            [name]=\"column.header\" class=\"merge-btn\" [disabled]=\"allowDisabled(column,row)\"\n            [label]=\"row[column.field+'_obj']?.displayText ? row[column.field+'_obj']?.displayText : column.value\"\n            class=\"grid-component-grid-add-btn\" (click)=\"onClickButton(column, row)\"></button>\n        </div>\n      </span>\n\n      <!-- Date column on Grid -->\n      <span *ngSwitchCase=\"'date'\" [title]=\"setConditionBaseValue(row,column)\">\n        <p-cellEditor>\n          <ng-template pTemplate=\"input\">\n            <p-calendar\n              [class]=\"column.errorMessage ? 'ng-invalid ng-dirty ' + column.field + row[dataKey] : column.field + row[dataKey]\"\n              [id]=\"allowDisabled(column,row) ? 'hide-border' : ''\" (onClose)=\"onFocusOutEvent(column, row)\"\n              [appendTo]=\"'body'\" hourFormat=\"12\" [defaultDate]=\"defaultDate\"\n              [stepMinute]=\"column.minutesInterval ? column.minutesInterval : 1\" [showTime]=\"column.showTime\"\n              [timeOnly]=\"column.timeOnly\" [dateFormat]=\"column.format ? column.format.type : calendarFormat\"\n              (keyup)=\"calenderInputValue(column, row)\" (onShow)=\"onClickEvent(column, row)\"\n              [(ngModel)]=\"row[column.field+'_obj']?.displayField ? row[row[column.field+'_obj']?.displayField.toLowerCase()] :\n              row[column.field]\" [disabled]=\"allowDisabled(column,row)\"\n              [showButtonBar]=\"!column.timeOnly\"></p-calendar>\n          </ng-template>\n          <ng-template pTemplate=\"output\">\n            {{ setConditionBaseValue(row,column) }}\n          </ng-template>\n        </p-cellEditor>\n      </span>\n      <span *ngSwitchDefault>\n        <span [ngSwitch]=\"column.type\">\n          <!-- Dropdown column on Grid -->\n          <span *ngSwitchCase=\"'dropdown'\" [class]=\"dropdownInput ? '' : 'output-dropdown'\" [title]=\"\n              setDropdwonReadOnlyValue(row, column)\n              \">\n            <p-cellEditor>\n              <ng-template pTemplate=\"input\">\n                <p-dropdown *ngIf=\"!row[column.field+'_obj']?.hidden\" [options]=\"\n                      row[column.field+'_data']\n                        ? row[column.field+'_data']\n                        : column.data\n                    \"\n                  [(ngModel)]=\"row[column.field+'_obj']?.displayField?.toLowerCase() ? row[row[column.field+'_obj']?.displayField.toLowerCase()] : row[column.field]\"\n                  [disabled]=\"allowDisabled(column,row)\" [placeholder]=\"row[column.displayField]\n                    ? row[column.displayField]\n                    : row[column.field] ? row[column.field] : 'Select'\" [showClear]=\"row[column.field] ? true : false\"\n                  [optionLabel]=\"column.optionLabel\" (click)=\"onClickEvent(column, row)\"\n                  [optionValue]=\"column.optionValue\" [class]=\"column.errorMessage ? 'ng-invalid ng-dirty' : ''\"\n                  [id]=\"allowDisabled(column,row) ? 'hide-border' : ''\" (blur)=\"onFocusOutEvent(column, row)\"\n                  (onChange)=\"onChangeEvent(column, row)\" [filter]=\"column.allowSearch\"></p-dropdown>\n              </ng-template>\n              <ng-template pTemplate=\"output\">\n                <span *ngIf=\"!row[column.field+'_obj']?.hidden\">\n                  {{\n                  setDropdwonReadOnlyValue(row, column)\n                  }}\n                </span>\n              </ng-template>\n            </p-cellEditor>\n          </span>\n\n          <!-- MultiSelect column on Grid -->\n          <span *ngSwitchCase=\"'multi-select'\">\n            <p-cellEditor>\n              <ng-template pTemplate=\"input\">\n                <p-multiSelect [class]=\"column.errorMessage ? 'ng-invalid ng-dirty' : ''\"\n                  [id]=\"allowDisabled(column,row) ? 'hide-border' : ''\" type=\"text\"\n                  [(ngModel)]=\"row[column.field+'_obj']?.displayField?.toLowerCase() ? row[row[column.field+'_obj']?.displayField.toLowerCase()] :\n                  row[column.field]\" [disabled]=\"allowDisabled(column,row)\"\n                  [options]=\"column.data\" [optionLabel]=\"column.optionLabel\" [optionValue]=\"column.optionValue\"\n                  (onChange)=\"onChangeEvent(column, row)\" (onPanelShow)=\"showOption(column, row)\"\n                  (click)=\"onClickEvent(column, row)\" [appendTo]=\"'body'\" (blur)=\"onFocusOutEvent(column, row)\">\n                </p-multiSelect>\n              </ng-template>\n              <ng-template pTemplate=\"output\">\n                <span [title]=\"\n                      row[column.displayField]\n                        ? row[column.displayField]\n                        : setMultiSelectData(column, row[column.field])\n                    \">\n                  {{\n                  row[column.displayField]\n                  ? row[column.displayField] :\n                  setMultiSelectData(column, row[column.field])\n                  }}\n                </span>\n              </ng-template>\n            </p-cellEditor>\n          </span>\n\n          <!-- AutoComplete Search -->\n          <span *ngSwitchCase=\"'AutoComplete'\">\n            <p-cellEditor>\n              <ng-template pTemplate=\"input\">\n                <p-autoComplete \n                  [class]=\"column.errorMessage ? 'ng-invalid ng-dirty' : ''\"\n                  [id]=\"allowDisabled(column,row) ? 'hide-border' : ''\" \n                  [name]=\"column.header\"\n                  [suggestions]=\"column.data\" \n                  (onSelect)=\"autoCompleteSelectedValue(row, column, $event)\"\n                  [field]=\"column.optionLabel ? column.optionLabel?.toLowerCase() : column.displayField ? column.displayField?.toLowerCase() : column.field?.toLowerCase()\"\n                  [(ngModel)]=\"row[column.field+'_obj']?.displayField ? row[row[column.field+'_obj']?.displayField.toLowerCase()] :\n                  typeOf(row[column.field]) === 'object' && row[column.field]?.text ?\n                  row[column.field]?.text :\n                  row[column.field]\"\n                  [dropdown]=\"column.showOption\" \n                  (ngModelChange)=\"onChangeEvent(column, row)\"\n                  (click)=\"onClickEvent(column, row)\" \n                  (completeMethod)=\"autoSearch($event, column, row)\"\n                  (onBlur)=\"onFocusOutEvent(column, row)\" \n                  [disabled]=\"allowDisabled(column,row)\" \n                  [multiple]=\"true\"\n                  (keydown.enter)=\"onAutoCompleteFocusOut($event, column, row)\">\n                </p-autoComplete>\n              </ng-template>\n              <ng-template pTemplate=\"output\">\n                <span *ngIf=\"row[column.field] && row[column.field][0] &&  row[column.field][0][column.displayField]\">\n                  <span *ngFor=\"let value of row[column.field]; let i = index\">\n                    {{ row[column.field] && row[column.field].length > 1 ? row[column.field].length -1 === i ?\n                    value[column.displayField] : value[column.displayField] + ';' : value[column.displayField] }}\n                  </span>\n                </span>\n                <span *ngIf=\"row[column.field] && row[column.field][0] &&  row[column.field][0][column.field] && !column.displayField\">\n                  <span *ngFor=\"let value of row[column.field]; let i = index\">\n                    {{ row[column.field] && row[column.field].length > 1 ? row[column.field].length -1 === i ?\n                    value[column.field] : value[column.field] + ';' : value[column.field] }}\n                  </span>\n                </span>\n              </ng-template>\n            </p-cellEditor>\n          </span>\n          <!-- Add Generate Report Button -->\n          <span *ngSwitchCase=\"'report'\">\n            <p-cellEditor>\n              <ng-template pTemplate=\"output\">\n                <se-generate-report-btn [repId]=\"column.reportId\" [label]=\"column.label\" [params]=\"column.params\"\n                  [showDialog]=\"column.showDialog\"></se-generate-report-btn>\n              </ng-template>\n              <ng-template pTemplate=\"input\">\n                <se-generate-report-btn [repId]=\"column.reportId\" [label]=\"column.label\" [params]=\"column.params\"\n                  [showDialog]=\"column.showDialog\"></se-generate-report-btn>\n              </ng-template>\n            </p-cellEditor>\n          </span>\n\n          <span *ngSwitchDefault>\n            <!-- Input column on Grid -->\n            <p-cellEditor>\n              <ng-template pTemplate=\"input\">\n                <input pInputText type=\"text\" [class]=\"column.errorMessage ? 'ng-invalid ng-dirty' : ''\"\n                  [id]=\"allowDisabled(column,row) ? 'hide-border' : ''\"\n                  [(ngModel)]=\"row.undefined ? '' : allowDisabled(column,row) && row[column.displayField] ? row[column.displayField] : row[column.field]\"\n                  [disabled]=\"allowDisabled(column,row)\"\n                  (blur)=\"onFocusOutEvent(column, row)\" (change)=\"onChangeEvent(column, row)\"\n                  (click)=\"onClickButton(column, row)\" *ngIf=\"column.field !== dataKey; else locked_field\" />\n                <ng-template #locked_field><span *ngIf=\"!row.isNew\" [title]=\"row[column.field]\">\n                    {{ row[column.field] }}\n                  </span></ng-template>\n              </ng-template>\n              <ng-template pTemplate=\"output\">\n                <span (click)=\"onClickEvent(column, row)\" [title]=\"\n                setTextBoxReadOnlyValue(row, column)\n                                  \">\n                  {{\n                    setTextBoxReadOnlyValue(row, column)\n                  }}\n                </span>\n              </ng-template>\n            </p-cellEditor>\n          </span>\n        </span>\n      </span>\n      </td>\n      <!-- Grid Rows Data Bindings End -->\n\n      <!-- Action column on Grid -->\n      <td *ngIf=\"!setActionColumnAsFirst && columns?.length > 0 && columnActions.length > 0\"\n        [class]=\"inEditMode ? 'three-action-btn' : 'two-action-btn'\">\n        <span class=\"action-btn\" *ngFor=\"let action of columnActions\">\n          <i [title]=\"action.tooltip\" [class]=\"action.icon\" (click)=\"handleActionClick($event, action, row)\"></i>\n        </span>\n      </td>\n      <td\n        *ngIf=\"!setActionColumnAsFirst && columns?.length > 0 && useInlineCRUD && (deleteRowPermission || editRowPermission)\"\n        [class]=\"inEditMode ? 'three-action-btn' : 'two-action-btn'\"\n        [ngClass]=\"disabledSaveBtn ? 'hide-clear-filter-button' : ''\">\n        <span class='setActionColumnWidth'>\n          <se-grid-row-actions [editing]=\"editing\" [editRowPermission]=\"editRowPermission\"\n            [deleteRowPermission]=\"deleteRowPermission\" [hideDeleteBtn]=\"hideDeleteBtn\" [hideEditBtn]=\"hideEditBtn\"\n            [row]=\"row\" (onRowEditInitBtn)=\"onRowEditInit($event)\" (deleteRecordBtn)=\"deleteRecord($event)\"\n            (onRowEditSaveBtn)=\"onRowEditSave($event)\" (onRowEditCancelBtn)=\"onRowEditCancel($event, ri)\"\n            [editAllRows]=\"editAllRows\">\n          </se-grid-row-actions>\n        </span>\n      </td>\n    </tr>\n  </ng-template>\n\n  <!-- Footer columns on Grid -->\n  <ng-template pTemplate=\"footer\">\n    <tr *ngIf=\"aggregateFooter\">\n      <td\n        *ngIf=\"setActionColumnAsFirst && (columnActions.length > 0 || (useInlineCRUD && (deleteRowPermission || editRowPermission)))\"\n        [class]=\"inEditMode ? 'three-action-btn' : 'two-action-btn'\"></td>\n      <td *ngIf=\"allowSelection\" [class]=\"inEditMode ? 'three-action-btn' : 'two-action-btn'\"></td>\n      <td *ngFor=\"let outerColumn of selectedColumns\" class=\"grid-component-outer-column\">\n        <div *ngFor=\"let innerColumn of selectedColumns\">\n          <div *ngFor=\"let aggr of innerColumn?.aggregate\">\n            <div\n              *ngIf=\"aggr.aggrValue?.length && ((!aggr.displayField && innerColumn.field?.toLowerCase() === outerColumn.field?.toLowerCase()) || aggr.displayField && aggr.displayField?.toLowerCase() === outerColumn.field?.toLowerCase())\">\n              <div [innerHTML]=\"aggr.aggrValue\">\n              </div>\n            </div>\n          </div>\n        </div>\n      </td>\n      <td\n        *ngIf=\"!setActionColumnAsFirst && columns?.length > 0 && useInlineCRUD && (deleteRowPermission || editRowPermission)\"\n        [class]=\"inEditMode ? 'three-action-btn' : 'two-action-btn'\"\n        [ngClass]=\"disabledSaveBtn ? 'hide-clear-filter-button' : ''\"></td>\n    </tr>\n  </ng-template>\n\n  <!-- Footer for Empty Message columns on Grid -->\n  <ng-template pTemplate=\"emptymessage\">\n    <tr class=\"grid-component no-records-found\">\n      <td [attr.colspan]=\"selectedColumns?.length + 1\">{{totalRecords==0? 'No records found':''}}</td>\n    </tr>\n  </ng-template>\n</p-table>\n</div>",
                   styles: [":host ::ng-deep .p-calendar .p-inputtext{width:100%}:host ::ng-deep .p-column-filter-clear-button{display:none}:host ::ng-deep .apply-filter-btn{float:unset!important}:host ::ng-deep .filter-btn{margin-right:5px}:host ::ng-deep .hide-table-filter .pi-filter:before{display:none}:host ::ng-deep .hide-filter-icon .p-column-filter-menu-button{display:none}.disabled-link,.disabled-link a,.disabled-link label,.disabled-link span,.disabled-link div,.disable-label-control,.disabled-link.custom-link,.disabled-link.custom-link a,.disabled-link.custom-link label,.disabled-link.custom-link span,.disabled-link.custom-link div,.disable-label-control.custom-link{pointer-events:none;color:#83baf8}.custom-link{color:#205dcf;font-size:12px}.custom-link:not(.disabled-link){cursor:pointer}.mr-2{margin-right:10px;display:block}.highlighted-row{background-color:#dee2e6!important}.hide-clear-filter-button{display:none!important}\n"]
               },] }
   ];