@zeedhi/common 1.112.0 → 1.114.0

package/dist/zd-common.umd.js

@@ -1923,6 +1923,7 @@
           this.internalDisplayValue = '';
           this.internalValue = null;
           this.formParent = this.getFormParent();
+          this.grid = {};
           this.lastInputValue = '';
           this.callInputEvent = debounce__default["default"](({ event, element, component }) => {
               this.callEvent('input', { event, element, component });
@@ -1950,6 +1951,7 @@
           this.value = this.getInitValue('value', props.value, this.value);
           this.validations = this.getInitValue('validations', props.validations, this.validations);
           this.autoRegister = this.getInitValue('autoRegister', props.autoRegister, this.autoRegister);
+          this.grid = this.getInitValue('grid', props.grid, this.grid);
           this.parseValidations(props.validations || {});
           if (this.autoRegister && this.formParent) {
               this.formParent.registerInput(this);
@@ -2838,7 +2840,7 @@
           return mask;
       }
   }
-  core.FormatterParserProvider.registerFormatter('ZdTextInput', (value, { valueWithPrefix = textInputDefaults.valueWithPrefix, prefix = textInputDefaults.prefix, valueWithSuffix = textInputDefaults.valueWithSuffix, suffix = textInputDefaults.suffix, mask = textInputDefaults.mask, } = {}) => {
+  core.FormatterParserProvider.registerFormatter('ZdTextInput', (value, { valueWithPrefix = textInputDefaults.valueWithPrefix, prefix = textInputDefaults.prefix, valueWithSuffix = textInputDefaults.valueWithSuffix, suffix = textInputDefaults.suffix, mask = textInputDefaults.mask, eagerMask, } = {}) => {
       let formatted = value;
       if (formatted) {
           formatted = valueWithPrefix ? formatted.substring(prefix.length) : formatted;
@@ -2849,7 +2851,10 @@
               maskDef = core.Loader.getInstance(controller)[accessor];
           }
           const maskValue = typeof (maskDef) === 'function' ? maskDef(core.Mask.getValueWithoutMask(formatted)) : maskDef;
-          formatted = maskValue ? core.Mask.getValueWithMask(core.Mask.getValueWithoutMask(formatted), maskValue) : formatted;
+          if (maskValue) {
+              const valueWithoutMask = core.Mask.getValueWithoutMask(formatted);
+              formatted = core.Mask.getValueWithMask(valueWithoutMask, maskValue, false, eagerMask);
+          }
       }
       return formatted;
   });
@@ -3145,8 +3150,10 @@
        * Hides alert by index. Default index is 0
        */
       static hide(index = 0) {
-          this.alertsManager.visibleInstances[index].hide();
-          this.remove(index);
+          if (this.alertsManager.visibleInstances[index]) {
+              this.alertsManager.visibleInstances[index].hide();
+              this.remove(index);
+          }
       }
       /**
        * Hides alert by alert id (returned by the `show` method)
@@ -5860,7 +5867,24 @@
               && (!this.searchVisibleOnly || column.isVisible)
               && (this.searchIn === undefined || this.searchIn === column.name);
       }
-  }
+  }
+  core.Messages.add({
+      'pt-BR': {
+          translation: {
+              gridPageText: '{{firstRow}} - {{lastRow}} de {{total}}',
+          },
+      },
+      'en-US': {
+          translation: {
+              gridPageText: '{{firstRow}} - {{lastRow}} of {{total}}',
+          },
+      },
+      'es-CL': {
+          translation: {
+              gridPageText: '{{firstRow}} - {{lastRow}} de {{total}}',
+          },
+      },
+  });
 
   /**
    * Delete rows error
@@ -7059,6 +7083,9 @@
               });
           }
       }
+      /**
+       * Retrieves the visible value of a cell, which is the corresponding cell in edited row or in the default row
+       */
       getVisibleValue(row, column) {
           const key = row[this.datasource.uniqueKey];
           if (this.editedRows[key] && Object.prototype.hasOwnProperty.call(this.editedRows[key], column.valueIn)) {
@@ -7066,6 +7093,18 @@
           }
           return row[column.valueIn];
       }
+      /**
+       * Retrieves the visible values of a row
+       * @param row
+       * @returns
+       */
+      getVisibleRow(row) {
+          const visibleRow = Object.assign({}, row);
+          this.columns.forEach((column) => {
+              visibleRow[column.valueIn] = this.getVisibleValue(row, column);
+          });
+          return visibleRow;
+      }
       /**
        * Returns editable component properties based on the column definition
        * @param column Column definition
@@ -7161,6 +7200,15 @@
               delete this.invalidComponents[component.name];
           }
       }
+      clearInvalidComponentsForRow(rowKey) {
+          const cloneInvalidComponents = Object.assign({}, this.invalidComponents);
+          Object.keys(cloneInvalidComponents).forEach((compName) => {
+              if (compName.includes(`_editable_${rowKey}`)) {
+                  delete cloneInvalidComponents[compName];
+              }
+          });
+          this.invalidComponents = cloneInvalidComponents;
+      }
       /**
        * change event of editable components
        */
@@ -7272,6 +7320,7 @@
               delete cloneAddedRows[key];
               this.editedRows = cloneEditedRows;
               this.addedRows = cloneAddedRows;
+              this.clearInvalidComponentsForRow(key);
               const { data, uniqueKey } = this.datasource;
               const index = data.findIndex((row) => row[uniqueKey] === key);
               data.splice(index, 1);
@@ -7285,6 +7334,8 @@
               for (let index = allData.length - 1; index >= 0; index -= 1) {
                   const row = allData[index];
                   if (this.addedRows[row[this.datasource.uniqueKey]]) {
+                      const key = row[this.datasource.uniqueKey];
+                      this.clearInvalidComponentsForRow(key);
                       allData.splice(index, 1);
                   }
               }
@@ -7305,13 +7356,17 @@
       saveEditedRows(revalidate = false) {
           return __awaiter(this, void 0, void 0, function* () {
               const { page } = this.datasource;
+              // Verificar se o grid é válido antes de tentar salvar
+              if (!this.isGridValid(revalidate)) {
+                  throw new Error('Invalid rows');
+              }
+              // Só cancelar as linhas adicionadas se todas forem válidas
               yield this.cancelAddedRows();
-              const response = yield Promise.all(this.getEditedRows(revalidate).map((row) => this.addDataRow(row)));
+              const response = yield Promise.all(this.getEditedRows(revalidate, true).map((row) => this.addDataRow(row)));
               this.editing = false;
               this.editedRows = {};
               this.addedRows = {};
               this.invalidComponents = {};
-              this.addedRows = {};
               yield this.datasource.setPage(page);
               return response;
           });
@@ -7562,6 +7617,8 @@
           const rows = Object.assign({}, this.editedRows);
           delete rows[foundRow[uniqueKey]];
           this.editedRows = rows;
+          const key = foundRow[uniqueKey];
+          this.clearInvalidComponentsForRow(key);
       }
       /**
        * Makes the cell enter edit mode
@@ -8534,18 +8591,26 @@
               SUM: 'SUM',
           };
           this.colunmXLS = 'ABCDEFGHIJKLMNOPQRSTUVWXYZ';
+          this.labelFormatter = labelFormatter;
           this.reportColumnTransformer = this.getReportColumnTransformer(labelFormatter);
       }
       getReportColumnTransformer(labelFormatter) {
           return new ReportColumnTransformer({ labelFormatter, fileType: this.getFileType() });
       }
+      getColumnLabel(key, column) {
+          if (!column)
+              return key;
+          if (!this.labelFormatter)
+              return column.label || key;
+          return this.labelFormatter({ column, fileType: this.getFileType() });
+      }
       buildFilter(filter, columns) {
           return Object.keys(filter).map((key) => {
-              var _a;
-              return ({
-                  label: ((_a = columns.find((col) => col.name === key)) === null || _a === void 0 ? void 0 : _a.label) || key,
+              const column = columns.find((col) => col.name === key);
+              return {
+                  label: this.getColumnLabel(key, column),
                   value: core.I18n.translate('IS_EQUAL', { value: filter[key] }),
-              });
+              };
           });
       }
       formatLangCode(lang) {
@@ -8554,6 +8619,12 @@
           }
           return lang.toLowerCase().replace('-', '_');
       }
+      filterColumns(columns) {
+          return columns.filter((item) => (item.type !== 'action' && item.isVisible !== false));
+      }
+      buildCols(columns) {
+          return this.reportColumnTransformer.transform(this.filterColumns(columns));
+      }
   }
 
   class CSVReport extends BaseReport {
@@ -8564,8 +8635,9 @@
       getFileType() {
           return 'csv';
       }
-      buildDataset(data, columns) {
-          const columnNames = columns.map((col) => col.name);
+      buildDataset({ data, columns }) {
+          const filteredColumns = this.filterColumns(columns);
+          const columnNames = filteredColumns.map((col) => col.name);
           const result = data.reduce((reduced, row) => {
               const values = columnNames.map((col) => row[col] || '');
               return [...reduced, values];
@@ -8573,7 +8645,7 @@
           return JSON.stringify(result);
       }
       buildMetadata(name, title, columns, filter) {
-          const builtCols = this.reportColumnTransformer.transform(columns);
+          const builtCols = this.buildCols(columns);
           const builtFilters = this.buildFilter(filter || {}, columns);
           const lang = this.formatLangCode(core.I18n.instance.language);
           const clientLogo = '';
@@ -8617,7 +8689,7 @@
           const fileType = this.getFileType();
           return new ReportColumnTransformer({ getFormatFn, labelFormatter, fileType });
       }
-      buildDataset(data) {
+      buildDataset({ data }) {
           return JSON.stringify(data);
       }
       getFormatOfColumn(column) {
@@ -8667,7 +8739,7 @@
       }
       buildMetadata(name, title, columns, filter, portrait = true) {
           return __awaiter(this, void 0, void 0, function* () {
-              const builtCols = this.reportColumnTransformer.transform(columns);
+              const builtCols = this.buildCols(columns);
               const builtFilters = this.buildFilter(filter || {}, columns);
               const lang = this.formatLangCode(core.I18n.instance.language);
               let clientLogo = '';
@@ -8755,8 +8827,8 @@
       getFileType() {
           return 'xls';
       }
-      buildDataset(data, columns) {
-          const result = this.formatRawDataSet(data, columns);
+      buildDataset({ data, columns }) {
+          const result = this.formatRawDataSet(data, this.filterColumns(columns));
           return JSON.stringify(result);
       }
       // formata o dataset para o formato "cru" xls
@@ -8769,7 +8841,7 @@
           return result;
       }
       buildMetadata(name, title, columns, filter) {
-          const builtCols = this.reportColumnTransformer.transform(columns);
+          const builtCols = this.buildCols(columns);
           const builtFilters = this.buildFilter(filter || {}, columns);
           const lang = this.formatLangCode(core.I18n.instance.language);
           const clientLogo = '';
@@ -8812,12 +8884,12 @@
       getFileType() {
           return 'xls';
       }
-      buildDataset(data, metadata) {
+      buildDataset({ data, metadata }) {
           const result = this.formatDataSet(metadata, data);
           return JSON.stringify(result);
       }
       buildMetadata(name, title, columns, filter) {
-          const builtCols = this.reportColumnTransformer.transform(columns);
+          const builtCols = this.buildCols(columns);
           const builtFilters = this.buildFilter(filter || {}, columns);
           const lang = this.formatLangCode(core.I18n.instance.language);
           const clientLogo = '';
@@ -9012,12 +9084,12 @@
       getFileType() {
           return 'xls';
       }
-      buildDataset(data, metadata) {
+      buildDataset({ data, metadata }) {
           const result = this.formatDataSet(metadata, data);
           return JSON.stringify(result);
       }
       buildMetadata(name, title, columns, filter) {
-          const builtCols = this.reportColumnTransformer.transform(columns);
+          const builtCols = this.buildCols(columns);
           const builtFilters = this.buildFilter(filter || {}, columns);
           const lang = this.formatLangCode(core.I18n.instance.language);
           const clientLogo = '';
@@ -9337,21 +9409,20 @@
               const { route } = reportType;
               const { name, columns, datasource } = this.iterable;
               const { groupedData } = Object.assign({}, this.iterable);
-              const formattedColumns = this.filterColumns(columns);
-              const metadataObj = yield reportType.buildMetadata(name, this.title, formattedColumns, datasource.filter, portrait);
+              const metadataObj = yield reportType.buildMetadata(name, this.title, columns, datasource.filter, portrait);
               let dataset;
               if ((reportType instanceof XLS2Report || reportType instanceof XLS3Report) && groupedData) {
                   const rowMetadata = rowObj.metaData;
                   const metadataObjClone = merge__default["default"](rowMetadata, JSON.parse(metadataObj));
-                  dataset = reportType.buildDataset(groupedData, metadataObjClone);
+                  dataset = reportType.buildDataset({ data: groupedData, metadata: metadataObjClone });
               }
               else if (reportType instanceof PDFReport && groupedData && groupedData.length > 0) {
                   const formatter = new GroupedPDFFormatter();
                   const pdfGroupedData = formatter.format(groupedData);
-                  dataset = reportType.buildDataset(pdfGroupedData);
+                  dataset = reportType.buildDataset({ data: pdfGroupedData });
               }
               else {
-                  dataset = reportType.buildDataset(data, formattedColumns);
+                  dataset = reportType.buildDataset({ data, metadata: metadataObj, columns });
               }
               const filter = '[]';
               let row = {
@@ -9380,9 +9451,6 @@
               return new URL(reportFile, this.fileEndPoint).href;
           });
       }
-      filterColumns(columns) {
-          return columns.filter((item) => (item.type !== 'action' && item.isVisible));
-      }
   }
 
   class TreeDataStructure {
@@ -9838,6 +9906,77 @@
       }
   }
 
+  class DatasourceSearcher {
+      constructor() {
+          this.dsSearch = {
+              SEARCH: (value, searchIn) => ({
+                  searchIn: [searchIn],
+                  search: String(value || ''),
+              }),
+              FILTER: (value, searchIn) => ({
+                  filter: {
+                      [searchIn]: value,
+                  },
+              }),
+              FIND: (value, searchIn) => ({
+                  find: {
+                      [searchIn]: value,
+                  },
+              }),
+              DYNAMIC_FILTER: (value, search_in) => {
+                  const arrayValue = Array.isArray(value) ? value : Array.of(value);
+                  const filter = arrayValue.map((item) => ({ operation: 'EQUALS', relation: 'OR', value: item }));
+                  const dynamicFilter = { [search_in]: filter };
+                  return { dynamicFilter };
+              },
+          };
+      }
+      search(datasource, searchValue, searchIn, searchParam) {
+          return __awaiter(this, void 0, void 0, function* () {
+              // using filter/find/dynamicFilter should make only 1 request
+              // using normal search should make one request per search value
+              if (!Array.isArray(searchValue)) {
+                  return this.searchRequest(datasource, searchValue, searchIn, searchParam);
+              }
+              if (searchParam !== 'SEARCH') {
+                  const items = yield this.searchRequest(datasource, searchValue, searchIn, searchParam);
+                  return items;
+              }
+              const searchedItems = [];
+              const promises = searchValue.map((value) => __awaiter(this, void 0, void 0, function* () {
+                  const [item] = yield this.searchRequest(datasource, value, searchIn, searchParam);
+                  searchedItems.push(item);
+              }));
+              yield Promise.all(promises);
+              return searchedItems;
+          });
+      }
+      searchRequest(datasource, searchValue, searchIn, searchParam) {
+          return __awaiter(this, void 0, void 0, function* () {
+              const config = Object.assign(Object.assign(Object.assign({}, datasource.clone()), this.dsSearch[searchParam](searchValue, searchIn)), { lazyLoad: true, loadAll: Array.isArray(searchValue) });
+              const cloneDatasource = core.DatasourceFactory.factory(config);
+              const items = yield cloneDatasource.get();
+              cloneDatasource.destroy();
+              if (Array.isArray(searchValue)) {
+                  return items.filter((item) => searchValue.includes(item[searchIn]));
+              }
+              return items.filter((row) => row[searchIn] === searchValue);
+          });
+      }
+  }
+
+  const uniqueBy = (a, key) => {
+      const seen = {};
+      return a.filter((item) => {
+          const k = item[key] || JSON.stringify(item);
+          if (!seen[k]) {
+              seen[k] = true;
+              return true;
+          }
+          return false;
+      });
+  };
+
   /**
    * Base class for Select component.
    */
@@ -10128,18 +10267,13 @@
        * Finds and retrieves items searching by value
        * @param value Default value
        */
-      getItemsBySearchValue(value, searchIn) {
+      getItemsBySearchValue(value) {
           return __awaiter(this, void 0, void 0, function* () {
-              const config = Object.assign(Object.assign(Object.assign({}, this.datasource.clone()), this.dsSearch[this.searchParam](value, searchIn)), { lazyLoad: true, loadAll: Array.isArray(value) });
               this.datasource.loading = true;
-              const datasource = core.DatasourceFactory.factory(config);
-              const items = yield datasource.get();
+              const datasourceSearcher = new DatasourceSearcher();
+              const result = yield datasourceSearcher.search(this.datasource, value, this.dataValue, this.searchParam);
               this.datasource.loading = false;
-              datasource.destroy();
-              if (Array.isArray(value)) {
-                  return items.filter((item) => value.includes(item[this.dataValue]));
-              }
-              return items.filter(this.getCondition(value));
+              return result;
           });
       }
       getCondition(filterValue) {
@@ -10164,17 +10298,6 @@
               this.updateSearch(this.dirtySearchValue);
           });
       }
-      uniqueBy(a, key) {
-          const seen = {};
-          return a.filter((item) => {
-              const k = item[key] || JSON.stringify(item);
-              if (!seen[k]) {
-                  seen[k] = true;
-                  return true;
-              }
-              return false;
-          });
-      }
       afterLoad() {
           if (this.manualMode)
               return;
@@ -10240,11 +10363,10 @@
               else {
                   filterValue = value;
               }
-              const searchIn = this.dataValue;
               const foundInData = this.datasource.data.find(this.getCondition(filterValue));
               let searchValue = foundInData;
               if (!foundInData && !this.manualMode) {
-                  [searchValue] = yield this.getItemsBySearchValue(filterValue, searchIn);
+                  [searchValue] = yield this.getItemsBySearchValue(filterValue);
               }
               if (!searchValue) {
                   this.setFieldRowValue(null);
@@ -10542,7 +10664,7 @@
           });
       }
   }
-  core.FormatterParserProvider.registerFormatter('ZdSelect', (value, { dataText, dataTextSeparator = ' | ', }) => {
+  core.FormatterParserProvider.registerFormatter('ZdSelect', (value, { dataText, dataTextSeparator = ' | ', eagerMask, }) => {
       if (value === null || value === undefined) {
           return null;
       }
@@ -10574,7 +10696,7 @@
               let masked = value[column];
               if (masks[index]) {
                   const maskValue = typeof masks[index] === 'function' ? masks[index](value[column]) : masks[index];
-                  masked = core.Mask.getValueWithMask(value[column], maskValue);
+                  masked = core.Mask.getValueWithMask(value[column], maskValue, false, eagerMask);
               }
               return result + separator + masked;
           }
@@ -10877,15 +10999,12 @@
           this.createAccessors();
       }
       addSlashes(value) {
-          if (typeof value === 'string') {
-              return value.replace(/\\/g, '\\\\')
-                  .replace(/\t/g, '\\t')
-                  .replace(/\n/g, '\\n')
-                  .replace(/\f/g, '\\f')
-                  .replace(/\r/g, '\\r')
-                  .replace(/"/g, '\\"');
-          }
-          return value;
+          return value.replace(/\\/g, '\\\\')
+              .replace(/\t/g, '\\t')
+              .replace(/\n/g, '\\n')
+              .replace(/\f/g, '\\f')
+              .replace(/\r/g, '\\r')
+              .replace(/"/g, '\\"');
       }
       /**
        * Returns the iterable component metadata based on row data
@@ -10898,14 +11017,13 @@
               .replace(rowExp, JSON.stringify(row))
               .replace(exp, (match) => {
               const propPath = match.replace(/<<|>>|"/g, '').split('.').splice(1).join('.');
-              const value = this.addSlashes(get__default["default"](row, propPath));
+              let value = get__default["default"](row, propPath);
+              if (value === undefined || value === null)
+                  value = '';
               if (typeof value === 'string') {
-                  if (match.startsWith('"') && match.endsWith('"'))
-                      return `"${value}"`;
-                  return value;
+                  const escaped = this.addSlashes(value);
+                  return match.startsWith('"') && match.endsWith('"') ? `"${escaped}"` : escaped;
               }
-              if (value === undefined)
-                  return '""';
               return value;
           });
           return JSON.parse(metadata);
@@ -12185,7 +12303,8 @@
           }
       }
       return value;
-  });
+  });
+  InputFactory.register('ZdMonth', Month);
 
   /**
    * Base class for Password component.
@@ -12582,19 +12701,10 @@
                   this.insertedValues.push(item);
                   pushed = true;
               });
-              // using filter/find/dynamicFilter should make only 1 request
-              // using normal search should make one request per search value
-              if (this.searchParam !== 'SEARCH') {
-                  const items = yield this.getItemsBySearchValue(searchedValues, this.dataValue);
+              if (searchedValues.length) {
+                  const items = yield this.getItemsBySearchValue(searchedValues);
                   items.forEach(insertItem);
               }
-              else {
-                  const promises = searchedValues.map((searchedValue) => __awaiter(this, void 0, void 0, function* () {
-                      const [item] = yield this.getItemsBySearchValue(searchedValue, this.dataValue);
-                      insertItem(item);
-                  }));
-                  yield Promise.all(promises);
-              }
               if (foundValues.length > 0) {
                   this.setFieldRowValue(foundValues);
               }
@@ -12832,7 +12942,7 @@
           if (this.manualMode)
               return;
           if (this.insertedValues.length) {
-              this.datasource.data = this.uniqueBy(this.insertedValues.concat(this.datasource.data), this.datasource.uniqueKey);
+              this.datasource.data = uniqueBy(this.insertedValues.concat(this.datasource.data), this.datasource.uniqueKey);
               const values = this.insertedValues.map((inserted) => inserted[this.dataValue]);
               // prevent caching insertedValues
               this.cachedData = this.datasource.data.filter((row) => !values.includes(row[this.dataValue]));
@@ -12975,7 +13085,8 @@
           return formattedRow;
       });
       return formattedValue;
-  });
+  });
+  InputFactory.register('ZdSelectMultiple', SelectMultiple);
 
   /**
    * Base class for Select Tree  component.
@@ -13066,6 +13177,7 @@
            * Defines if should wait and not execute GET method when Datasource is created
            */
           this.lazyLoad = true;
+          this.selectValue = null;
           /**
            * Uses delayed loading to load tree branches
            */
@@ -13087,6 +13199,10 @@
            */
           this.dataValueOutFormName = '';
           this.formatterFn = core.FormatterParserProvider.getFormatter('ZdSelectTree');
+          /**
+           * Defines if data handling should be manual or automatic
+           */
+          this.searchParam = 'SEARCH';
           this.savedNodes = undefined;
           this.search = '';
           this.debounceSearch = debounce__default["default"](this.searchChange, 500);
@@ -13114,6 +13230,7 @@
           this.autoSelection = this.getInitValue('autoSelection', props.autoSelection, this.autoSelection);
           this.dataValueOut = this.getInitValue('dataValueOut', props.dataValueOut, this.dataValueOut);
           this.dataValueOutFormName = this.getInitValue('dataValueOutFormName', props.dataValueOutFormName, this.dataValueOutFormName);
+          this.searchParam = this.getInitValue('searchParam', props.searchParam, this.searchParam);
           if (props.datasource && Object.keys(props.datasource).length) {
               this.lazyLoad = props.datasource.lazyLoad !== false;
               const searchFields = Array.isArray(this.dataText) ? this.dataText : [this.dataText];
@@ -13183,6 +13300,9 @@
               this.nodes = this.createChildrenNodes(firstLevelNodes);
           }
       }
+      /**
+       * Creates a Tree Node from a datasource row
+       */
       createNodeFromRow(row) {
           let children;
           if (this.fetchOnDemand && !this.datasource.search) {
@@ -13322,31 +13442,71 @@
           });
           return result;
       }
+      clearNodeRow(row) {
+          return this.clearRow(row.row || row);
+      }
+      /**
+       * Finds and retrieves items searching by value
+       * @param value Default value
+       */
+      getItemsBySearchValue(value) {
+          return __awaiter(this, void 0, void 0, function* () {
+              this.datasource.loading = true;
+              const datasourceSearcher = new DatasourceSearcher();
+              const result = yield datasourceSearcher.search(this.datasource, value, this.dataValue, this.searchParam);
+              this.datasource.loading = false;
+              return result;
+          });
+      }
       get value() {
           if (!this.selectValue)
               return this.selectValue;
           if (this.returnObject) {
-              return this.clearRow(this.selectValue.row || this.selectValue);
+              return this.clearNodeRow(this.selectValue);
           }
-          return this.selectValue;
+          const key = this.datasource ? this.dataValue : 'id';
+          return this.selectValue[key];
       }
       set value(value) {
           this.setValue(value);
       }
       setValue(value) {
-          let val = value;
-          const key = this.datasource ? this.dataValue : 'id';
-          if (typeof value === 'object' && !Array.isArray(value) && value !== null) {
-              val = value[key];
-          }
-          else if (!value && value !== 0) {
-              val = null;
-          }
-          if (this.returnObject) {
-              this.selectValue = val ? { id: val } : null;
-              return;
-          }
-          this.selectValue = val;
+          return __awaiter(this, void 0, void 0, function* () {
+              let val = null;
+              const key = this.datasource ? this.dataValue : 'id';
+              if (!value && value !== 0) {
+                  val = null;
+              }
+              else if (typeof value === 'object') {
+                  val = value[key];
+              }
+              else {
+                  val = value;
+              }
+              if (!val) {
+                  this.selectValue = null;
+                  return;
+              }
+              if (!this.datasource) {
+                  this.selectValue = { id: val };
+                  return;
+              }
+              const searchIn = this.dataValue;
+              const foundInData = this.datasource.data.find((row) => row[searchIn] === val);
+              let foundValue = foundInData;
+              if (!foundInData) {
+                  [foundValue] = yield this.getItemsBySearchValue(val);
+              }
+              if (!foundValue) {
+                  if (typeof value === 'object') {
+                      this.selectValue = Object.assign({ id: val }, value);
+                      return;
+                  }
+                  this.selectValue = { id: val };
+                  return;
+              }
+              this.selectValue = foundValue;
+          });
       }
       loadChildren(parentNode) {
           return __awaiter(this, void 0, void 0, function* () {
@@ -13399,6 +13559,7 @@
            * Selected Nodes
            */
           this.selectedNodes = [];
+          this.selectValue = [];
           /**
            * Changes the behavior of checked nodes that will be displayed in the array of values
            */
@@ -13417,7 +13578,9 @@
        * Triggered after selected nodes change
        */
       changeSelectedNodes(selectedNodes, element) {
-          this.callEvent('onChangeSelectedNodes', { element, component: this, selectedNodes });
+          const selection = this.returnObject
+              ? selectedNodes.map((value) => this.clearNodeRow(value)) : selectedNodes.map((node) => node.id);
+          this.callEvent('onChangeSelectedNodes', { element, component: this, selectedNodes: selection });
       }
       /**
        * Triggered deselecting an node
@@ -13429,34 +13592,58 @@
           if (!this.selectValue)
               return [];
           if (this.returnObject) {
-              return this.selectValue.map((value) => this.clearRow(value.row || value));
+              return this.selectValue.map((value) => this.clearNodeRow(value));
           }
-          return this.selectValue;
+          const key = this.datasource ? this.dataValue : 'id';
+          return this.selectValue.map((item) => item[key]);
       }
       set value(value) {
           this.setValue(value);
       }
       setValue(value) {
-          if (!value) {
-              this.selectValue = [];
-              return;
-          }
-          const arrValue = Array.isArray(value) ? value : [value];
-          const key = this.datasource ? this.dataValue : 'id';
-          if (!this.returnObject) {
-              this.selectValue = arrValue.map((item) => {
+          return __awaiter(this, void 0, void 0, function* () {
+              if (!value) {
+                  this.selectValue = [];
+                  return;
+              }
+              const arrValue = Array.isArray(value) ? value : [value];
+              const key = this.datasource ? this.dataValue : 'id';
+              if (!this.datasource) {
+                  this.selectValue = arrValue.map((item) => {
+                      if (item && typeof item === 'object') {
+                          return item;
+                      }
+                      return { [key]: item };
+                  });
+                  return;
+              }
+              const valuesToSearch = [];
+              const foundValues = [];
+              const insertItem = (item) => __awaiter(this, void 0, void 0, function* () {
+                  if (!item)
+                      return;
+                  foundValues.push(item);
+              });
+              arrValue.forEach((item) => __awaiter(this, void 0, void 0, function* () {
+                  const searchIn = this.dataValue;
+                  if (!item)
+                      return;
                   if (typeof item === 'object') {
-                      return item[key];
+                      insertItem(item);
+                      return;
                   }
-                  return item;
-              });
-              return;
-          }
-          this.selectValue = arrValue.map((item) => {
-              if (typeof item !== 'object') {
-                  return { id: item };
+                  const foundInData = this.datasource.data.find((row) => row[searchIn] === item);
+                  if (!foundInData) {
+                      valuesToSearch.push(item);
+                      return;
+                  }
+                  insertItem(foundInData);
+              }));
+              if (valuesToSearch.length) {
+                  const items = yield this.getItemsBySearchValue(valuesToSearch);
+                  items.forEach(insertItem);
               }
-              return { id: item[key] };
+              this.selectValue = foundValues;
           });
       }
       /**
@@ -13504,16 +13691,18 @@
        */
       selectAllItems(nodes = this.nodes) {
           var _a;
-          if (((_a = this.datasource) === null || _a === void 0 ? void 0 : _a.data) && this.fetchOnDemand) {
-              this.setValue(this.datasource.data);
-              return;
-          }
-          const allNodes = this.getAllNodes(nodes, !this.search);
-          // merge all nodes with the current value before setting it
-          const currentValue = this.getValueAsObject();
-          const nodeMap = this.createMergeMap(currentValue, allNodes);
-          const uniqueArray = Array.from(nodeMap.values());
-          this.setValue(uniqueArray);
+          return __awaiter(this, void 0, void 0, function* () {
+              if (((_a = this.datasource) === null || _a === void 0 ? void 0 : _a.data) && this.fetchOnDemand) {
+                  yield this.setValue(this.datasource.data);
+                  return;
+              }
+              const allNodes = this.getAllNodes(nodes, !this.search);
+              // merge all nodes with the current value before setting it
+              const currentValue = this.getValueAsObject();
+              const nodeMap = this.createMergeMap(currentValue, allNodes);
+              const uniqueArray = Array.from(nodeMap.values());
+              yield this.setValue(uniqueArray);
+          });
       }
       /**
        * Unelects all items in the tree \
@@ -13525,21 +13714,23 @@
        */
       unSelectAllItems(nodes = this.nodes) {
           var _a;
-          if (((_a = this.datasource) === null || _a === void 0 ? void 0 : _a.data) && this.fetchOnDemand) {
-              this.setValue([]);
-              return;
-          }
-          const allNodes = this.getAllNodes(nodes, !this.search);
-          // merge all nodes with the current value before setting it
-          const currentValue = this.getValueAsObject();
-          const nodeMap = this.createMergeMap(currentValue);
-          // remove the current visible nodes from the array
-          const valuesToRemove = allNodes.map((node) => node.id);
-          valuesToRemove.forEach((value) => {
-              nodeMap.delete(value);
+          return __awaiter(this, void 0, void 0, function* () {
+              if (((_a = this.datasource) === null || _a === void 0 ? void 0 : _a.data) && this.fetchOnDemand) {
+                  yield this.setValue([]);
+                  return;
+              }
+              const allNodes = this.getAllNodes(nodes, !this.search);
+              // merge all nodes with the current value before setting it
+              const currentValue = this.getValueAsObject();
+              const nodeMap = this.createMergeMap(currentValue);
+              // remove the current visible nodes from the array
+              const valuesToRemove = allNodes.map((node) => node.id);
+              valuesToRemove.forEach((value) => {
+                  nodeMap.delete(value);
+              });
+              const uniqueArray = Array.from(nodeMap.values());
+              yield this.setValue(uniqueArray);
           });
-          const uniqueArray = Array.from(nodeMap.values());
-          this.setValue(uniqueArray);
       }
       /**
        * Takes two arrays and creates a map of the unique values
@@ -13561,15 +13752,15 @@
           return this.value;
       }
       getValueAsObject() {
-          return this.value.map((row) => {
-              if (this.returnObject)
-                  return row;
-              return { id: row };
+          return this.selectValue.map((row) => {
+              const key = this.datasource ? this.dataValue : 'id';
+              return Object.assign({ id: row[key] }, row);
           });
       }
   }
   const selectFormatterFn = core.FormatterParserProvider.getFormatter('ZdSelectMultiple');
-  core.FormatterParserProvider.registerFormatter('ZdSelectTreeMultiple', selectFormatterFn);
+  core.FormatterParserProvider.registerFormatter('ZdSelectTreeMultiple', selectFormatterFn);
+  InputFactory.register('ZdSelectTreeMultiple', SelectTreeMultiple);
 
   /**
    * Base class for SelectableList component.
@@ -15994,7 +16185,7 @@
       }
       return row;
   };
-  const formatter$1 = ({ column, value, row, componentProps, }) => {
+  const formatter$2 = ({ column, value, row, componentProps, }) => {
       if (value === null || value === undefined)
           return '';
       const { dataText, formatterDataText, dataTextSeparator, dataValue, dataTextDiscrete, foreignColumns, } = componentProps;
@@ -16025,12 +16216,12 @@
           return currentRow[textColumn] || value;
       }
       const formatterFn = core.FormatterParserProvider.getFormatter('ZdSelect');
-      return formatterFn(currentRow, { dataText: textColumn, dataTextSeparator });
+      return formatterFn(currentRow, { dataText: textColumn, dataTextSeparator, eagerMask: false });
   };
-  core.FormatterParserProvider.registerFormatter('column_ZdSelect', formatter$1);
-  core.FormatterParserProvider.registerFormatter('column_ZdSelectTree', formatter$1);
+  core.FormatterParserProvider.registerFormatter('column_ZdSelect', formatter$2);
+  core.FormatterParserProvider.registerFormatter('column_ZdSelectTree', formatter$2);
 
-  const formatter = ({ column, value, row, componentProps, }) => {
+  const formatter$1 = ({ column, value, row, componentProps, }) => {
       if (!value || !Array.isArray(value) || value.length === 0)
           return '';
       const { formatterDataText, foreignColumns, dataText } = componentProps;
@@ -16068,8 +16259,12 @@
       });
       return result.join(', ');
   };
-  core.FormatterParserProvider.registerFormatter('column_ZdSelectMultiple', formatter);
-  core.FormatterParserProvider.registerFormatter('column_ZdSelectTreeMultiple', formatter);
+  core.FormatterParserProvider.registerFormatter('column_ZdSelectMultiple', formatter$1);
+  core.FormatterParserProvider.registerFormatter('column_ZdSelectTreeMultiple', formatter$1);
+
+  const defaultFormatter = core.FormatterParserProvider.getFormatter('ZdTextInput');
+  const formatter = ({ value, componentProps, }) => defaultFormatter(value, Object.assign(Object.assign({}, componentProps), { eagerMask: false }));
+  core.FormatterParserProvider.registerFormatter('column_ZdTextInput', formatter);
 
   const AutoNumeric = require('@zeedhi/autonumeric/dist/autoNumeric');
   const packageContent = require('../package.json');
@@ -16101,6 +16296,7 @@
   exports.Currency = Currency;
   exports.Dashboard = Dashboard;
   exports.DataValueOutHelper = DataValueOutHelper;
+  exports.DatasourceSearcher = DatasourceSearcher;
   exports.Date = Date$1;
   exports.DateRange = DateRange;
   exports.Dialog = Dialog;
@@ -16187,6 +16383,7 @@
   exports.XLS3Report = XLS3Report;
   exports.XLSReport = XLSReport;
   exports.initTheme = initTheme;
+  exports.uniqueBy = uniqueBy;
 
   Object.defineProperty(exports, '__esModule', { value: true });