@michalrakus/x-react-web-lib 1.34.0 → 1.35.1

package/lib/components/XLazyDataTable/XLazyDataTable.js

@@ -69,6 +69,17 @@ var __generator = (this && this.__generator) || function (thisArg, body) {
         if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };
     }
 };
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
 var __values = (this && this.__values) || function(o) {
     var s = typeof Symbol === "function" && Symbol.iterator, m = s && o[s], i = 0;
     if (m) return m.call(o);
@@ -137,6 +148,8 @@ var XInputTextBase_1 = require("../XInputTextBase");
 var useXStateSession_1 = require("../useXStateSession");
 var useXStateSessionBase_1 = require("../useXStateSessionBase");
 var _ = __importStar(require("lodash"));
+var XDocTemplateButton_1 = require("../../modules/docTemplates/XDocTemplateButton");
+var XFormDialog_1 = require("../XFormDialog");
 var XStateKeySuffix;
 (function (XStateKeySuffix) {
     XStateKeySuffix["filters"] = "filters";
@@ -147,8 +160,14 @@ var XStateKeySuffix;
     XStateKeySuffix["selectedRow"] = "selected-row";
     XStateKeySuffix["multilineSwitchValue"] = "multiline-switch-value";
 })(XStateKeySuffix = exports.XStateKeySuffix || (exports.XStateKeySuffix = {}));
-var XLazyDataTable = function (props) {
-    var _a, _b;
+exports.XLazyDataTable = (0, react_1.forwardRef)(function (_a, ref) {
+    var _b, _c;
+    var _d = _a.paginator, paginator = _d === void 0 ? true : _d, _e = _a.rows, rows = _e === void 0 ? 10 : _e, _f = _a.filterDisplay, filterDisplay = _f === void 0 ? "row" : _f, _g = _a.autoFilter, autoFilter = _g === void 0 ? false : _g, _h = _a.showFilterButtons, showFilterButtons = _h === void 0 ? true : _h, _j = _a.fullTextSearch, fullTextSearch = _j === void 0 ? true : _j, _k = _a.multilineSwitch, multilineSwitch = _k === void 0 ? false : _k, _l = _a.multilineSwitchInitValue, multilineSwitchInitValue = _l === void 0 ? "allLines" : _l, _m = _a.multilineSwitchFewLinesCount, multilineSwitchFewLinesCount = _m === void 0 ? 2 : _m, _o = _a.scrollable, scrollable = _o === void 0 ? true : _o, _p = _a.scrollWidth, scrollWidth = _p === void 0 ? 'viewport' : _p, // nastavi sirku tabulky na (100vw - nieco) (ak bude obsah sirsi, zapne horizontalny scrollbar)
+    _q = _a.scrollHeight, // nastavi sirku tabulky na (100vw - nieco) (ak bude obsah sirsi, zapne horizontalny scrollbar)
+    scrollHeight = _q === void 0 ? 'viewport' : _q, // nastavi vysku tabulky na (100vh - nieco) (ak bude obsah vecsi, zapne vertikalny scrollbar)
+    _r = _a.shrinkWidth, // nastavi vysku tabulky na (100vh - nieco) (ak bude obsah vecsi, zapne vertikalny scrollbar)
+    shrinkWidth = _r === void 0 ? true : _r, propsRest = __rest(_a, ["paginator", "rows", "filterDisplay", "autoFilter", "showFilterButtons", "fullTextSearch", "multilineSwitch", "multilineSwitchInitValue", "multilineSwitchFewLinesCount", "scrollable", "scrollWidth", "scrollHeight", "shrinkWidth"]);
+    var props = __assign({ paginator: paginator, rows: rows, filterDisplay: filterDisplay, autoFilter: autoFilter, showFilterButtons: showFilterButtons, fullTextSearch: fullTextSearch, multilineSwitch: multilineSwitch, multilineSwitchInitValue: multilineSwitchInitValue, multilineSwitchFewLinesCount: multilineSwitchFewLinesCount, scrollable: scrollable, scrollWidth: scrollWidth, scrollHeight: scrollHeight, shrinkWidth: shrinkWidth }, propsRest);
     // must be here, is used in createFiltersInit()
     var xEntity = XUtilsMetadataCommon_1.XUtilsMetadataCommon.getXEntity(props.entity);
     var createAggregateItems = function () {
@@ -214,7 +233,10 @@ var XLazyDataTable = function (props) {
     };
     var getInitFilterMatchMode = function (xLazyColumnProps, xField) {
         var filterMatchMode;
-        if (isAutoCompleteInFilterEnabled(xLazyColumnProps)) {
+        if (xLazyColumnProps.filterElement !== undefined) {
+            filterMatchMode = FindParam_1.XFilterMatchMode.X_FILTER_ELEMENT; // little hack
+        }
+        else if (isAutoCompleteInFilterEnabled(xLazyColumnProps)) {
             filterMatchMode = FindParam_1.XFilterMatchMode.X_AUTO_COMPLETE; // little hack
         }
         else if (xField.type === "string" || xField.type === "jsonb") {
@@ -316,12 +338,12 @@ var XLazyDataTable = function (props) {
     // ak mame fieldSet stlpce (stlpce ktore maju zadany fieldSetId a zobrazuju hodnoty podla fieldSet-u),
     // tak sem nacitame mapy umoznujuce ziskanie labelov zakliknutych field-ov
     // poznamka: uz by sa zislo mat vytvorene objekty (instancie) pre stlpce a do nich zapisovat pripadny XFieldSetMap, filter (teraz je vo "filters")
-    var _c = __read((0, react_1.useState)({}), 2), xFieldSetMaps = _c[0], setXFieldSetMaps = _c[1];
-    var _d = __read((0, react_1.useState)({ rowList: [], totalRecords: 0, aggregateValues: [] }), 2), value = _d[0], setValue = _d[1];
-    var _e = __read((0, react_1.useState)(undefined), 2), expandedRows = _e[0], setExpandedRows = _e[1];
-    var _f = __read((0, react_1.useState)(false), 2), loading = _f[0], setLoading = _f[1];
-    var _g = __read((0, useXStateSession_1.useXStateSession)(getStateKey(XStateKeySuffix.pagingFirst), 0), 2), first = _g[0], setFirst = _g[1];
-    var _h = __read((0, react_1.useState)(props.paginator ? props.rows : undefined), 2), rows = _h[0], setRows = _h[1];
+    var _s = __read((0, react_1.useState)({}), 2), xFieldSetMaps = _s[0], setXFieldSetMaps = _s[1];
+    var _t = __read((0, react_1.useState)({ rowList: [], totalRecords: 0, aggregateValues: [] }), 2), value = _t[0], setValue = _t[1];
+    var _u = __read((0, react_1.useState)(undefined), 2), expandedRows = _u[0], setExpandedRows = _u[1];
+    var _v = __read((0, react_1.useState)(false), 2), loading = _v[0], setLoading = _v[1];
+    var _w = __read((0, useXStateSession_1.useXStateSession)(getStateKey(XStateKeySuffix.pagingFirst), 0), 2), first = _w[0], setFirst = _w[1];
+    var _x = __read((0, react_1.useState)(props.paginator ? props.rows : undefined), 2), rowsLocal = _x[0], setRowsLocal = _x[1];
     // "filters" have special initialState function different from that used in useXStateSession
     var filtersInitialStateFunction = function () {
         var filtersInit = XUtils_1.XUtils.getValueFromStorage(getStateKey(XStateKeySuffix.filters), null);
@@ -335,19 +357,20 @@ var XLazyDataTable = function (props) {
         }
         return filtersInit;
     };
-    var _j = __read((0, useXStateSessionBase_1.useXStateSessionBase)(getStateKey(XStateKeySuffix.filters), filtersInitialStateFunction), 2), filters = _j[0], setFilters = _j[1]; // filtrovanie na "controlled manner" (moze sa sem nainicializovat nejaka hodnota)
+    var _y = __read((0, useXStateSessionBase_1.useXStateSessionBase)(getStateKey(XStateKeySuffix.filters), filtersInitialStateFunction), 2), filters = _y[0], setFilters = _y[1]; // filtrovanie na "controlled manner" (moze sa sem nainicializovat nejaka hodnota)
     var initFtsInputValue = props.fullTextSearch ? createInitFtsInputValue() : undefined;
-    var _k = __read((0, useXStateSession_1.useXStateSession)(getStateKey(XStateKeySuffix.ftsInputValue), initFtsInputValue), 2), ftsInputValue = _k[0], setFtsInputValue = _k[1];
-    var _l = __read((0, useXStateSession_1.useXStateSession)(getStateKey(XStateKeySuffix.optionalCustomFilter), undefined), 2), optionalCustomFilter = _l[0], setOptionalCustomFilter = _l[1];
-    var _m = __read((_a = props.multilineSwitchValue) !== null && _a !== void 0 ? _a : (0, useXStateSession_1.useXStateSession)(getStateKey(XStateKeySuffix.multilineSwitchValue), props.multilineSwitchInitValue), 2), multilineSwitchValue = _m[0], setMultilineSwitchValue = _m[1];
-    var _o = __read((0, useXStateSession_1.useXStateSession)(getStateKey(XStateKeySuffix.multiSortMeta), XUtilsCommon_1.XUtilsCommon.createMultiSortMeta(props.sortField)), 2), multiSortMeta = _o[0], setMultiSortMeta = _o[1];
-    var _p = __read((0, useXStateSession_1.useXStateSession)(getStateKey(XStateKeySuffix.selectedRow), null), 2), selectedRow = _p[0], setSelectedRow = _p[1];
-    var _q = __read((_b = props.dataLoadedState) !== null && _b !== void 0 ? _b : (0, react_1.useState)(false), 2), dataLoaded = _q[0], setDataLoaded = _q[1]; // priznak kde si zapiseme, ci uz sme nacitali data
-    var _r = __read((0, react_1.useState)({ dialogOpened: false }), 2), exportRowsDialogState = _r[0], setExportRowsDialogState = _r[1];
+    var _z = __read((0, useXStateSession_1.useXStateSession)(getStateKey(XStateKeySuffix.ftsInputValue), initFtsInputValue), 2), ftsInputValue = _z[0], setFtsInputValue = _z[1];
+    var _0 = __read((0, useXStateSession_1.useXStateSession)(getStateKey(XStateKeySuffix.optionalCustomFilter), undefined), 2), optionalCustomFilter = _0[0], setOptionalCustomFilter = _0[1];
+    var _1 = __read((_b = props.multilineSwitchValue) !== null && _b !== void 0 ? _b : (0, useXStateSession_1.useXStateSession)(getStateKey(XStateKeySuffix.multilineSwitchValue), props.multilineSwitchInitValue), 2), multilineSwitchValue = _1[0], setMultilineSwitchValue = _1[1];
+    var _2 = __read((0, useXStateSession_1.useXStateSession)(getStateKey(XStateKeySuffix.multiSortMeta), XUtilsCommon_1.XUtilsCommon.createMultiSortMeta(props.sortField)), 2), multiSortMeta = _2[0], setMultiSortMeta = _2[1];
+    var _3 = __read((0, useXStateSession_1.useXStateSession)(getStateKey(XStateKeySuffix.selectedRow), null), 2), selectedRow = _3[0], setSelectedRow = _3[1];
+    var _4 = __read((_c = props.dataLoadedState) !== null && _c !== void 0 ? _c : (0, react_1.useState)(false), 2), dataLoaded = _4[0], setDataLoaded = _4[1]; // priznak kde si zapiseme, ci uz sme nacitali data
+    var _5 = __read((0, react_1.useState)({ dialogOpened: false }), 2), exportRowsDialogState = _5[0], setExportRowsDialogState = _5[1];
     //const [exportRowsDialogRowCount, setExportRowsDialogRowCount] = useState<number>(); // param pre dialog
-    var _s = __read((0, react_1.useState)(filters), 2), filtersAfterFiltering = _s[0], setFiltersAfterFiltering = _s[1]; // sem si odkladame stav filtra po kliknuti na button Filter (chceme exportovat presne to co vidno vyfiltrovane)
-    var _t = __read((0, react_1.useState)(ftsInputValue), 2), ftsInputValueAfterFiltering = _t[0], setFtsInputValueAfterFiltering = _t[1]; // tak isto ako filtersAfterFiltering
-    var _u = __read((0, react_1.useState)(optionalCustomFilter), 2), optionalCustomFilterAfterFiltering = _u[0], setOptionalCustomFilterAfterFiltering = _u[1]; // tak isto ako filtersAfterFiltering
+    var _6 = __read((0, react_1.useState)(filters), 2), filtersAfterFiltering = _6[0], setFiltersAfterFiltering = _6[1]; // sem si odkladame stav filtra po kliknuti na button Filter (chceme exportovat presne to co vidno vyfiltrovane)
+    var _7 = __read((0, react_1.useState)(ftsInputValue), 2), ftsInputValueAfterFiltering = _7[0], setFtsInputValueAfterFiltering = _7[1]; // tak isto ako filtersAfterFiltering
+    var _8 = __read((0, react_1.useState)(optionalCustomFilter), 2), optionalCustomFilterAfterFiltering = _8[0], setOptionalCustomFilterAfterFiltering = _8[1]; // tak isto ako filtersAfterFiltering
+    var _9 = __read((0, react_1.useState)({ opened: false }), 2), formDialogState = _9[0], setFormDialogState = _9[1];
     // parameter [] zabezpeci ze sa metoda zavola len po prvom renderingu (a nie po kazdej zmene stavu (zavolani setNieco()))
     (0, react_1.useEffect)(function () {
         // jednoduchy sposob - nepouzivame parameter props.displayed a priznak dataLoaded
@@ -374,6 +397,10 @@ var XLazyDataTable = function (props) {
             }
         }
     }); // eslint-disable-line react-hooks/exhaustive-deps
+    (0, react_1.useImperativeHandle)(ref, function () { return ({
+        reread: reread,
+        setupExpandedRows: function () { return setupExpandedRows(value, multilineSwitchValue); }
+    }); });
     // TODO - preco je to tu? presunut dole ak sa da...
     var dataKey = props.dataKey !== undefined ? props.dataKey : XUtilsMetadataCommon_1.XUtilsMetadataCommon.getXEntity(props.entity).idField;
     var onPage = function (event) { return __awaiter(void 0, void 0, void 0, function () {
@@ -459,6 +486,10 @@ var XLazyDataTable = function (props) {
         findParam.multiSortMeta = multiSortMetaLocal;
         loadDataBase(findParam);
     };
+    // API function
+    var reread = function () {
+        loadData();
+    };
     var loadData = function () { return __awaiter(void 0, void 0, void 0, function () {
         return __generator(this, function (_a) {
             switch (_a.label) {
@@ -479,7 +510,7 @@ var XLazyDataTable = function (props) {
         return {
             resultType: FindParam_1.ResultType.RowCountAndPagedRows,
             first: first,
-            rows: rows,
+            rows: rowsLocal,
             filters: filters,
             fullTextSearch: createXFullTextSearch(ftsInputValue),
             customFilterItems: createXCustomFilterItems(customFilterItems, optionalCustomFilter),
@@ -720,51 +751,76 @@ var XLazyDataTable = function (props) {
         onRowDoubleClickBase(event.data);
     };
     var onRowDoubleClickBase = function (row) {
-        if (props.onEdit !== undefined && props.searchBrowseParams === undefined) {
-            props.onEdit(row);
+        if (props.searchBrowseParams === undefined) {
+            editRow(row);
         }
-        else if (props.searchBrowseParams !== undefined) {
+        else {
             props.searchBrowseParams.onChoose(row);
         }
     };
     var onClickAddRow = function () {
         //console.log("zavolany onClickAddRow");
-        if (props.onAddRow !== undefined) {
-            props.onAddRow();
+        if (typeof props.onAddRow === 'function') {
+            props.onAddRow(filters);
+        }
+        else if (props.editForm !== undefined && props.onAddRow !== false) {
+            setFormDialogState({
+                opened: true,
+                id: undefined,
+                initValues: {}
+            });
         }
     };
-    var onClickEdit = function () {
-        //console.log("zavolany onClickEdit");
+    var onClickEditRow = function () {
+        //console.log("zavolany onClickEditRow");
         if (selectedRow !== null) {
-            if (props.onEdit !== undefined) {
-                props.onEdit(selectedRow);
-            }
+            editRow(selectedRow);
         }
         else {
             alert((0, XLocale_1.xLocaleOption)('pleaseSelectRow'));
         }
     };
+    var editRow = function (row) {
+        if (typeof props.onEdit === 'function') {
+            props.onEdit(row);
+        }
+        else if (props.editForm !== undefined && props.onEdit !== false) {
+            setFormDialogState({
+                opened: true,
+                id: row[dataKey],
+                initValues: undefined
+            });
+        }
+    };
+    var editRowOnSaveOrCancel = function (object, objectChange) {
+        if (object !== null) {
+            // save was pressed, reread from DB
+            loadData();
+        }
+        // if object === null, then cancel was pressed, we do nothing, we just close the dialog
+        setFormDialogState({ opened: false });
+    };
     var onClickRemoveRow = function () { return __awaiter(void 0, void 0, void 0, function () {
-        var reread, e_9, e_10;
+        var reread_1, e_9, e_10;
         return __generator(this, function (_a) {
             switch (_a.label) {
                 case 0:
                     if (!(selectedRow !== null)) return [3 /*break*/, 11];
                     if (!(props.removeRow instanceof Function)) return [3 /*break*/, 5];
-                    reread = true;
+                    reread_1 = true;
                     _a.label = 1;
                 case 1:
                     _a.trys.push([1, 3, , 4]);
                     return [4 /*yield*/, props.removeRow(selectedRow)];
                 case 2:
-                    reread = _a.sent();
+                    reread_1 = _a.sent();
                     return [3 /*break*/, 4];
                 case 3:
                     e_9 = _a.sent();
                     XUtils_1.XUtils.showErrorMessage((0, XLocale_1.xLocaleOption)('removeRowFailed'), e_9);
                     return [3 /*break*/, 4];
                 case 4:
-                    if (reread) {
+                    if (reread_1) {
                         loadData();
                         if (props.onRemoveRow) {
                             props.onRemoveRow(selectedRow, XUtils_1.OperationType.Remove);
@@ -817,7 +873,7 @@ var XLazyDataTable = function (props) {
                     findParam = {
                         resultType: FindParam_1.ResultType.OnlyRowCount,
                         first: first,
-                        rows: rows,
+                        rows: rowsLocal,
                         filters: filtersAfterFiltering,
                         fullTextSearch: createXFullTextSearch(ftsInputValueAfterFiltering),
                         customFilterItems: createXCustomFilterItems(customFilterItems, optionalCustomFilterAfterFiltering),
@@ -882,13 +938,14 @@ var XLazyDataTable = function (props) {
     // ****** vseobecne metodky pre set/get do/z filtra ********
     // zatial funguje len pre simple filtrovanie (filterDisplay="row")
     // vseobecna specialna metodka pouzvana pri custom filtri (XLazyColumn.filterElement)
-    var setFilterItem = function (field, filterItem) {
+    // nepodarilo sa posunut autoFilter takym sposobom aby app programmer nemusel autoFilter nastavovat
+    var setFilterItem = function (field, filterItem, autoFilter) {
         filters[field] = filterItem;
         // neskusal som, ci treba aj toto klonovat ale pravdepodobne hej
         var filtersCloned = __assign({}, filters);
         setFilters(filtersCloned);
         removePagingFromStorage();
-        loadDataBaseIfAutoFilter(filtersCloned, false);
+        loadDataBaseIfAutoFilter(filtersCloned, autoFilter);
     };
     // vseobecna specialna metodka pouzvana pri custom filtri (XLazyColumn.filterElement)
     var getFilterItem = function (field) {
@@ -1036,19 +1093,19 @@ var XLazyDataTable = function (props) {
     };
     // ak mame scrollWidth/scrollHeight = viewport (default), vyratame scrollWidth/scrollHeight tak aby tabulka "sadla" do okna (viewport-u)
     var isMobile = XUtils_1.XUtils.isMobile();
-    var scrollWidth = undefined; // vypnute horizontalne scrollovanie
-    var scrollHeight = undefined; // vypnute vertikalne scrollovanie
+    var scrollWidthLocal = undefined; // vypnute horizontalne scrollovanie
+    var scrollHeightLocal = undefined; // vypnute vertikalne scrollovanie
     if (props.scrollable) {
         if (props.scrollWidth !== "none") {
-            scrollWidth = props.scrollWidth;
-            if (scrollWidth === "viewport") {
-                scrollWidth = "calc(100vw - ".concat(isMobile ? 1 : 2.2, "rem)"); // desktop - povodne bolo 1.4rem (20px okraje) namiesto 2.2 ale pri vela stlpcoch vznikal horizontalny scrollbar
+            scrollWidthLocal = props.scrollWidth;
+            if (scrollWidthLocal === "viewport") {
+                scrollWidthLocal = "calc(100vw - ".concat(isMobile ? 1 : 2.2, "rem)"); // desktop - povodne bolo 1.4rem (20px okraje) namiesto 2.2 ale pri vela stlpcoch vznikal horizontalny scrollbar
                 // mobil - padding 0.5rem body element
             }
         }
         if (props.scrollHeight !== "none") {
-            scrollHeight = props.scrollHeight;
-            if (scrollHeight === "viewport") {
+            scrollHeightLocal = props.scrollHeight;
+            if (scrollHeightLocal === "viewport") {
                 // vypocet je priblizny, robeny na mobil, desktop bude mat mozno iny
                 //const headerHeight = XUtils.toPX0('12.7rem');
                 //let footerHeight = XUtils.toPX0('3.7rem') + XUtils.toPX0('3rem'); // table footer (paging) + buttons Add row, Edit, ...
@@ -1085,13 +1142,13 @@ var XLazyDataTable = function (props) {
                 if (props.formFooterHeight !== undefined) {
                     headerFooterHeight += XUtils_1.XUtils.toPX0(XUtils_1.XUtils.processGridBreakpoints(props.formFooterHeight));
                 }
-                scrollHeight = "calc(".concat(viewHeight, " - ").concat(headerFooterHeight, "px)");
+                scrollHeightLocal = "calc(".concat(viewHeight, " - ").concat(headerFooterHeight, "px)");
             }
         }
     }
     var style = {};
-    if (scrollWidth !== undefined) {
-        style.width = scrollWidth;
+    if (scrollWidthLocal !== undefined) {
+        style.width = scrollWidthLocal;
     }
     if (props.shrinkWidth) {
         style.maxWidth = 'min-content'; // ak nic nedame (nechame auto), tak (v pripade ak nebudeme mat horizontalny scrollbar) natiahne tabulku na celu sirku stranky, co nechceme
@@ -1153,6 +1210,7 @@ var XLazyDataTable = function (props) {
     }
     // pre lepsiu citatelnost vytvarame stlpce uz tu
     var columnElemList = react_1.default.Children.map(props.children.filter(function (child) { return XUtils_1.XUtils.xViewStatus(child.props.columnViewStatus) !== XUtils_1.XViewStatus.Hidden; }), function (child) {
+        var _a, _b;
         // ak chceme zmenit child element, tak treba bud vytvorit novy alebo vyklonovat
         // priklad je na https://soshace.com/building-react-components-using-children-props-and-context-api/
         // (vzdy musime robit manipulacie so stlpcom, lebo potrebujeme pridat filter={true} sortable={true}
@@ -1177,92 +1235,107 @@ var XLazyDataTable = function (props) {
         }
         // *********** filterElement ***********
         var betweenFilter = undefined;
-        var filterElement;
+        var filterElement = null;
         if (childColumn.props.filterElement !== undefined) {
-            filterElement = function (options) {
-                // compilator sa stazoval ze childColumn.props.filterElement moze byt undefined, preto som pridal "!"
-                return childColumn.props.filterElement({ getFilterItem: getFilterItem, setFilterItem: setFilterItem, options: options });
-            };
+            // if we use matchModeLabel and this special match mode is chosen then we use custom filter element
+            // if we don't use matchModeLabel (undefined) then we use custom filter element always
+            if ((childColumn.props.filterElement.matchModeLabel && getFilterMatchMode(childColumn.props.field) === FindParam_1.XFilterMatchMode.X_FILTER_ELEMENT)
+                || childColumn.props.filterElement.matchModeLabel === undefined) {
+                filterElement = function (options) {
+                    // compilator sa stazoval ze childColumn.props.filterElement moze byt undefined, preto som pridal "!"
+                    return childColumn.props.filterElement.element({ getFilterItem: getFilterItem, setFilterItem: setFilterItem, options: options, autoFilter: childColumn.props.autoFilter });
+                };
+            }
         }
-        else if (getFilterMatchMode(childColumn.props.field) === FindParam_1.XFilterMatchMode.X_AUTO_COMPLETE) {
-            var assocField_1 = undefined; // path to manyToOne assoc
-            var displayField = undefined; // field/fields displayed in autocomplete (can be path)
-            // if childColumn.props.autoComplete = true, then autoComplete = undefined and default autocomlete is created
-            var autoComplete = (typeof childColumn.props.autoComplete === 'object' ? childColumn.props.autoComplete : undefined);
-            if (autoComplete) {
-                if (autoComplete.field) {
-                    displayField = autoComplete.field;
+        if (filterElement === null) {
+            if (getFilterMatchMode(childColumn.props.field) === FindParam_1.XFilterMatchMode.X_AUTO_COMPLETE) {
+                var assocField_1 = undefined; // path to manyToOne assoc
+                var displayField = undefined; // field/fields displayed in autocomplete (can be path)
+                // if childColumn.props.autoComplete = true, then autoComplete = undefined and default autocomplete is created
+                var autoComplete = (typeof childColumn.props.autoComplete === 'object' ? childColumn.props.autoComplete : undefined);
+                if (autoComplete) {
+                    if (autoComplete.field) {
+                        displayField = autoComplete.field;
+                    }
+                    if (autoComplete.assocField) {
+                        // check - autoComplete.assocField must be prefix (part) of childColumn.props.field
+                        if (!childColumn.props.field.startsWith(autoComplete.assocField + ".")) {
+                            throw "XLazyColumn with field \"".concat(childColumn.props.field, "\": autoComplete.assocField \"").concat(autoComplete.assocField, "\" is not prefix of the field");
+                        }
+                        assocField_1 = autoComplete.assocField;
+                        if (displayField === undefined) {
+                            // take displayField from childColumn.props.field (rest of the path)
+                            displayField = childColumn.props.field.substring(autoComplete.assocField.length + 1);
+                        }
+                    }
                 }
-                if (autoComplete.assocField) {
-                    // check - autoComplete.assocField must be prefix (part) of childColumn.props.field
-                    if (!childColumn.props.field.startsWith(autoComplete.assocField + ".")) {
-                        throw "XLazyColumn with field \"".concat(childColumn.props.field, "\": autoComplete.assocField \"").concat(autoComplete.assocField, "\" is not prefix of the field");
+                if (assocField_1 === undefined) {
+                    // default - take assocField/displayField from childColumn.props.field
+                    var _c = __read(XUtilsCommon_1.XUtilsCommon.getPathToAssocAndField(childColumn.props.field), 2), assocFieldTemp = _c[0], displayFieldTemp = _c[1];
+                    if (assocFieldTemp === null) {
+                        throw "XLazyColumn with field \"".concat(childColumn.props.field, "\": unexpected error - path of length >= 2 expected");
                     }
-                    assocField_1 = autoComplete.assocField;
+                    assocField_1 = assocFieldTemp;
                     if (displayField === undefined) {
-                        // take displayField from childColumn.props.field (rest of the path)
-                        displayField = childColumn.props.field.substring(autoComplete.assocField.length + 1);
+                        displayField = displayFieldTemp;
                     }
                 }
+                var xAssoc = XUtilsMetadataCommon_1.XUtilsMetadataCommon.getXAssocToOneByPath(xEntity, assocField_1);
+                var object = getFilterValue(childColumn.props.field);
+                filterElement = react_1.default.createElement(XAutoCompleteBase_1.XAutoCompleteBase, { value: object, onChange: function (object, objectChange) { return setFilterValue(childColumn.props.field, object, undefined, object !== null ? [{
+                            where: "[".concat(assocField_1, "] = ").concat(object['id']),
+                            params: {}
+                        }] : undefined, childColumn.props.autoFilter); }, error: undefined, onErrorChange: function (error) { }, idField: "id", field: displayField, itemTemplate: autoComplete === null || autoComplete === void 0 ? void 0 : autoComplete.itemTemplate, inputClassName: autoComplete === null || autoComplete === void 0 ? void 0 : autoComplete.inputClassName, suggestionsQuery: {
+                        entity: xAssoc.entityName,
+                        filter: autoComplete === null || autoComplete === void 0 ? void 0 : autoComplete.filter,
+                        sortField: autoComplete === null || autoComplete === void 0 ? void 0 : autoComplete.sortField,
+                        fields: autoComplete === null || autoComplete === void 0 ? void 0 : autoComplete.fields
+                    }, searchBrowse: autoComplete === null || autoComplete === void 0 ? void 0 : autoComplete.searchBrowse, valueForm: autoComplete === null || autoComplete === void 0 ? void 0 : autoComplete.valueForm, addRowEnabled: false, width: "100%", scrollHeight: autoComplete === null || autoComplete === void 0 ? void 0 : autoComplete.scrollHeight, suggestionsLoad: "lazy", lazyLoadMaxRows: autoComplete === null || autoComplete === void 0 ? void 0 : autoComplete.lazyLoadMaxRows, minLength: autoComplete === null || autoComplete === void 0 ? void 0 : autoComplete.minLength });
             }
-            if (assocField_1 === undefined) {
-                // default - take assocField/displayField from childColumn.props.field
-                var _a = __read(XUtilsCommon_1.XUtilsCommon.getPathToAssocAndField(childColumn.props.field), 2), assocFieldTemp = _a[0], displayFieldTemp = _a[1];
-                if (assocFieldTemp === null) {
-                    throw "XLazyColumn with field \"".concat(childColumn.props.field, "\": unexpected error - path of length >= 2 expected");
-                }
-                assocField_1 = assocFieldTemp;
-                if (displayField === undefined) {
-                    displayField = displayFieldTemp;
+            else {
+                if (xField.type === "boolean") {
+                    var checkboxValue = getFilterValue(childColumn.props.field);
+                    filterElement = react_1.default.createElement(tristatecheckbox_1.TriStateCheckbox, { value: checkboxValue, onChange: function (e) { return setFilterValue(childColumn.props.field, e.value, api_1.FilterMatchMode.EQUALS, undefined, childColumn.props.autoFilter); } });
                 }
-            }
-            var xAssoc = XUtilsMetadataCommon_1.XUtilsMetadataCommon.getXAssocToOneByPath(xEntity, assocField_1);
-            var object = getFilterValue(childColumn.props.field);
-            filterElement = react_1.default.createElement(XAutoCompleteBase_1.XAutoCompleteBase, { value: object, onChange: function (object, objectChange) { return setFilterValue(childColumn.props.field, object, undefined, object !== null ? [{ where: "[".concat(assocField_1, "] = ").concat(object['id']), params: {} }] : undefined, childColumn.props.autoFilter); }, error: undefined, onErrorChange: function (error) { }, idField: "id", field: displayField, suggestionsQuery: { entity: xAssoc.entityName, filter: autoComplete === null || autoComplete === void 0 ? void 0 : autoComplete.filter, sortField: autoComplete === null || autoComplete === void 0 ? void 0 : autoComplete.sortField }, searchBrowse: autoComplete === null || autoComplete === void 0 ? void 0 : autoComplete.searchBrowse, valueForm: autoComplete === null || autoComplete === void 0 ? void 0 : autoComplete.valueForm, addRowEnabled: false, width: "100%", scrollHeight: autoComplete === null || autoComplete === void 0 ? void 0 : autoComplete.scrollHeight, suggestionsLoad: "lazy", lazyLoadMaxRows: autoComplete === null || autoComplete === void 0 ? void 0 : autoComplete.lazyLoadMaxRows, minLength: autoComplete === null || autoComplete === void 0 ? void 0 : autoComplete.minLength });
-        }
-        else {
-            if (xField.type === "boolean") {
-                var checkboxValue = getFilterValue(childColumn.props.field);
-                filterElement = react_1.default.createElement(tristatecheckbox_1.TriStateCheckbox, { value: checkboxValue, onChange: function (e) { return setFilterValue(childColumn.props.field, e.value, api_1.FilterMatchMode.EQUALS, undefined, childColumn.props.autoFilter); } });
-            }
-            else if (childColumn.props.dropdownInFilter) {
-                var dropdownValue = getDropdownFilterValue(childColumn.props.field);
-                filterElement = react_1.default.createElement(XDropdownDTFilter_1.XDropdownDTFilter, { entity: props.entity, path: childColumn.props.field, value: dropdownValue, onValueChange: function (field, displayValue) { return onDropdownFilterChange(field, displayValue, childColumn.props.autoFilter); }, filter: childColumn.props.dropdownFilter, sortField: childColumn.props.dropdownSortField });
-            }
-            else if (xField.type === "string") {
-                var stringValue = getFilterValue(childColumn.props.field);
-                filterElement = react_1.default.createElement(XInputTextBase_1.XInputTextBase, { value: stringValue, onChange: function (value) { return setFilterValue(childColumn.props.field, value, undefined, undefined, childColumn.props.autoFilter); } });
-            }
-            else if (xField.type === "date" || xField.type === "datetime") {
-                betweenFilter = getBetweenFilter(childColumn.props.betweenFilter, props.betweenFilter);
-                if (betweenFilter !== undefined) {
-                    // display: 'flex' umiestni XCalendar elementy vedla seba
-                    filterElement =
-                        react_1.default.createElement("div", { style: betweenFilter === "row" ? { display: 'flex' } : undefined },
-                            react_1.default.createElement(XCalendar_1.XCalendar, { value: getFilterValue1(childColumn.props.field), onChange: function (value) { return setFilterValue1(childColumn.props.field, value, childColumn.props.autoFilter); }, scale: xField.scale, datetime: xField.type === "datetime" }),
-                            react_1.default.createElement(XCalendar_1.XCalendar, { value: getFilterValue2(childColumn.props.field), onChange: function (value) { return setFilterValue2(childColumn.props.field, value, childColumn.props.autoFilter); }, scale: xField.scale, datetime: xField.type === "datetime" }));
+                else if (childColumn.props.dropdownInFilter) {
+                    var dropdownValue = getDropdownFilterValue(childColumn.props.field);
+                    filterElement = react_1.default.createElement(XDropdownDTFilter_1.XDropdownDTFilter, { entity: props.entity, path: childColumn.props.field, value: dropdownValue, onValueChange: function (field, displayValue) { return onDropdownFilterChange(field, displayValue, childColumn.props.autoFilter); }, filter: childColumn.props.dropdownFilter, sortField: childColumn.props.dropdownSortField });
                 }
-                else {
-                    var dateValue = getFilterValue(childColumn.props.field);
-                    filterElement = react_1.default.createElement(XCalendar_1.XCalendar, { value: dateValue, onChange: function (value) { return setFilterValue(childColumn.props.field, value, undefined, undefined, childColumn.props.autoFilter); }, scale: xField.scale, datetime: xField.type === "datetime" });
+                else if (xField.type === "string") {
+                    var stringValue = getFilterValue(childColumn.props.field);
+                    filterElement = react_1.default.createElement(XInputTextBase_1.XInputTextBase, { value: stringValue, onChange: function (value) { return setFilterValue(childColumn.props.field, value, undefined, undefined, childColumn.props.autoFilter); } });
                 }
-            }
-            else if (xField.type === "decimal" || xField.type === "number") {
-                var params = XUtilsMetadata_1.XUtilsMetadata.getParamsForInputNumber(xField);
-                betweenFilter = getBetweenFilter(childColumn.props.betweenFilter, props.betweenFilter);
-                if (betweenFilter !== undefined) {
-                    // display: 'flex' umiestni input elementy pod seba (betweenFilter = "column") resp. vedla seba (betweenFilter = "row")
-                    filterElement =
-                        react_1.default.createElement("div", { style: { display: 'flex', flexDirection: betweenFilter } },
-                            react_1.default.createElement(XInputDecimalBase_1.XInputDecimalBase, __assign({ value: getFilterValue1(childColumn.props.field), onChange: function (value) { return setFilterValue1(childColumn.props.field, value, childColumn.props.autoFilter); } }, params)),
-                            react_1.default.createElement(XInputDecimalBase_1.XInputDecimalBase, __assign({ value: getFilterValue2(childColumn.props.field), onChange: function (value) { return setFilterValue2(childColumn.props.field, value, childColumn.props.autoFilter); } }, params)));
+                else if (xField.type === "date" || xField.type === "datetime") {
+                    betweenFilter = getBetweenFilter(childColumn.props.betweenFilter, props.betweenFilter);
+                    if (betweenFilter !== undefined) {
+                        // display: 'flex' umiestni XCalendar elementy vedla seba
+                        filterElement =
+                            react_1.default.createElement("div", { style: betweenFilter === "row" ? { display: 'flex' } : undefined },
+                                react_1.default.createElement(XCalendar_1.XCalendar, { value: getFilterValue1(childColumn.props.field), onChange: function (value) { return setFilterValue1(childColumn.props.field, value, childColumn.props.autoFilter); }, scale: xField.scale, datetime: xField.type === "datetime" }),
+                                react_1.default.createElement(XCalendar_1.XCalendar, { value: getFilterValue2(childColumn.props.field), onChange: function (value) { return setFilterValue2(childColumn.props.field, value, childColumn.props.autoFilter); }, scale: xField.scale, datetime: xField.type === "datetime" }));
+                    }
+                    else {
+                        var dateValue = getFilterValue(childColumn.props.field);
+                        filterElement = react_1.default.createElement(XCalendar_1.XCalendar, { value: dateValue, onChange: function (value) { return setFilterValue(childColumn.props.field, value, undefined, undefined, childColumn.props.autoFilter); }, scale: xField.scale, datetime: xField.type === "datetime" });
+                    }
                 }
-                else {
-                    var numberValue = getFilterValue(childColumn.props.field);
-                    filterElement = react_1.default.createElement(XInputDecimalBase_1.XInputDecimalBase, __assign({ value: numberValue, onChange: function (value) { return setFilterValue(childColumn.props.field, value, undefined, undefined, childColumn.props.autoFilter); } }, params));
+                else if (xField.type === "decimal" || xField.type === "number") {
+                    var params = XUtilsMetadata_1.XUtilsMetadata.getParamsForInputNumber(xField);
+                    betweenFilter = getBetweenFilter(childColumn.props.betweenFilter, props.betweenFilter);
+                    if (betweenFilter !== undefined) {
+                        // display: 'flex' umiestni input elementy pod seba (betweenFilter = "column") resp. vedla seba (betweenFilter = "row")
+                        filterElement =
+                            react_1.default.createElement("div", { style: { display: 'flex', flexDirection: betweenFilter } },
+                                react_1.default.createElement(XInputDecimalBase_1.XInputDecimalBase, __assign({ value: getFilterValue1(childColumn.props.field), onChange: function (value) { return setFilterValue1(childColumn.props.field, value, childColumn.props.autoFilter); } }, params)),
+                                react_1.default.createElement(XInputDecimalBase_1.XInputDecimalBase, __assign({ value: getFilterValue2(childColumn.props.field), onChange: function (value) { return setFilterValue2(childColumn.props.field, value, childColumn.props.autoFilter); } }, params)));
+                    }
+                    else {
+                        var numberValue = getFilterValue(childColumn.props.field);
+                        filterElement = react_1.default.createElement(XInputDecimalBase_1.XInputDecimalBase, __assign({ value: numberValue, onChange: function (value) { return setFilterValue(childColumn.props.field, value, undefined, undefined, childColumn.props.autoFilter); } }, params));
+                    }
                 }
             }
-        }
+        } // if (filterElement === null)
         // ************** dataType **************
         // depending on the dataType of the column, suitable match modes are displayed in filter
         var dataType = "text";
@@ -1296,6 +1369,9 @@ var XLazyDataTable = function (props) {
             if (isAutoCompleteInFilterEnabled(childColumn.props)) {
                 filterMatchModeOptions.push({ label: (0, XLocale_1.xLocaleOption)('xAutoComplete'), value: FindParam_1.XFilterMatchMode.X_AUTO_COMPLETE });
             }
+            if ((_a = childColumn.props.filterElement) === null || _a === void 0 ? void 0 : _a.matchModeLabel) {
+                filterMatchModeOptions.push({ label: (_b = childColumn.props.filterElement) === null || _b === void 0 ? void 0 : _b.matchModeLabel, value: FindParam_1.XFilterMatchMode.X_FILTER_ELEMENT });
+            }
         }
         // *********** showClearButton ***********
         // pre filterDisplay = "row" nechceme clear button, chceme setrit miesto
@@ -1364,37 +1440,23 @@ var XLazyDataTable = function (props) {
                     setMultilineSwitchValue(switchValue);
                     setupExpandedRows(value, switchValue);
                 }, className: "m-1" }) : null,
-            props.headerElementRight,
+            props.headerBodyRight,
             props.label && !isMobile ? react_1.default.createElement("div", { className: "x-lazy-datatable-label-right-compensation" }) : null),
         react_1.default.createElement("div", { className: "flex justify-content-center" },
-            react_1.default.createElement(datatable_1.DataTable, { value: value.rowList, dataKey: dataKey, expandedRows: expandedRows, rowExpansionTemplate: props.rowExpansionTemplate ? rowExpansionTemplate : undefined, paginator: props.paginator, pageLinkSize: pageLinkSize, rows: rows, totalRecords: value.totalRecords, lazy: true, first: first, onPage: onPage, loading: loading, filterDisplay: props.filterDisplay, filters: filters, onFilter: onFilter, sortMode: "multiple", removableSort: true, multiSortMeta: multiSortMeta, onSort: onSort, selectionMode: "single", selection: selectedRow, onSelectionChange: onSelectionChange, onRowDoubleClick: onRowDoubleClick, rowClassName: props.rowClassName, ref: dataTableEl, className: "p-datatable-sm x-lazy-datatable", resizableColumns: true, columnResizeMode: "expand", tableStyle: tableStyle, paginatorLeft: paginatorLeft, paginatorRight: paginatorRight, scrollable: props.scrollable, scrollHeight: scrollHeight, style: style }, columnElemList)),
+            react_1.default.createElement(datatable_1.DataTable, { value: value.rowList, dataKey: dataKey, expandedRows: expandedRows, rowExpansionTemplate: props.rowExpansionTemplate ? rowExpansionTemplate : undefined, paginator: props.paginator, pageLinkSize: pageLinkSize, rows: rowsLocal, totalRecords: value.totalRecords, lazy: true, first: first, onPage: onPage, loading: loading, filterDisplay: props.filterDisplay, filters: filters, onFilter: onFilter, sortMode: "multiple", removableSort: true, multiSortMeta: multiSortMeta, onSort: onSort, selectionMode: "single", selection: selectedRow, onSelectionChange: onSelectionChange, onRowDoubleClick: onRowDoubleClick, rowClassName: props.rowClassName, ref: dataTableEl, className: "p-datatable-sm x-lazy-datatable", resizableColumns: true, columnResizeMode: "expand", tableStyle: tableStyle, paginatorLeft: paginatorLeft, paginatorRight: paginatorRight, scrollable: props.scrollable, scrollHeight: scrollHeightLocal, style: style }, columnElemList)),
         react_1.default.createElement("div", { className: "flex justify-content-center" },
-            props.onAddRow !== undefined && props.searchBrowseParams === undefined ? react_1.default.createElement(XButton_1.XButton, { key: "addRow", icon: "pi pi-plus", label: (0, XLocale_1.xLocaleOption)('addRow'), onClick: onClickAddRow }) : null,
-            props.onEdit !== undefined && props.searchBrowseParams === undefined ? react_1.default.createElement(XButton_1.XButton, { key: "editRow", icon: "pi pi-pencil", label: (0, XLocale_1.xLocaleOption)('editRow'), onClick: onClickEdit }) : null,
-            props.removeRow !== undefined && props.removeRow !== false && props.searchBrowseParams === undefined ? react_1.default.createElement(XButton_1.XButton, { key: "removeRow", icon: "pi pi-times", label: (0, XLocale_1.xLocaleOption)('removeRow'), onClick: onClickRemoveRow }) : null,
+            (props.onAddRow !== false && (props.editForm !== undefined || props.onAddRow !== undefined)) && props.searchBrowseParams === undefined ? react_1.default.createElement(XButton_1.XButton, { key: "addRow", icon: "pi pi-plus", label: (0, XLocale_1.xLocaleOption)('addRow'), onClick: onClickAddRow }) : null,
+            (props.onEdit !== false && (props.editForm !== undefined || props.onEdit !== undefined)) && props.searchBrowseParams === undefined ? react_1.default.createElement(XButton_1.XButton, { key: "editRow", icon: "pi pi-pencil", label: (0, XLocale_1.xLocaleOption)('editRow'), onClick: onClickEditRow }) : null,
+            (props.removeRow !== false && (props.removeRow !== undefined)) && props.searchBrowseParams === undefined ? react_1.default.createElement(XButton_1.XButton, { key: "removeRow", icon: "pi pi-times", label: (0, XLocale_1.xLocaleOption)('removeRow'), onClick: onClickRemoveRow }) : null,
             exportRows ? react_1.default.createElement(XButton_1.XButton, { key: "exportRows", icon: "pi pi-file-export", label: (0, XLocale_1.xLocaleOption)('exportRows'), onClick: onClickExport }) : null,
-            props.appButtonsForRow ? props.appButtonsForRow.map(function (xAppButton) { return react_1.default.createElement(XButton_1.XButton, { key: xAppButton.key, icon: xAppButton.icon, label: xAppButton.label, onClick: function () { return onClickAppButtonForRow(xAppButton.onClick); }, style: xAppButton.style }); }) : null,
-            props.appButtons,
+            props.docTemplates && !isMobile && props.searchBrowseParams === undefined ? react_1.default.createElement(XDocTemplateButton_1.XDocTemplateButton, { key: "docTemplates", entity: props.entity, rowId: selectedRow ? selectedRow[dataKey] : undefined, docTemplates: typeof props.docTemplates === 'function' ? props.docTemplates : undefined }) : null,
+            props.appButtonsForRow && props.searchBrowseParams === undefined ? props.appButtonsForRow.map(function (xAppButton) { return react_1.default.createElement(XButton_1.XButton, { key: xAppButton.key, icon: xAppButton.icon, label: xAppButton.label, onClick: function () { return onClickAppButtonForRow(xAppButton.onClick); }, style: xAppButton.style }); }) : null,
+            props.appButtons && props.searchBrowseParams === undefined,
             props.searchBrowseParams !== undefined ? react_1.default.createElement(XButton_1.XButton, { key: "choose", label: (0, XLocale_1.xLocaleOption)('chooseRow'), onClick: onClickChoose }) : null,
+            props.editForm != undefined ? react_1.default.createElement(XFormDialog_1.XFormDialog, { key: "formDialog", dialogState: formDialogState, form: props.editForm, onSaveOrCancel: editRowOnSaveOrCancel }) : null,
             exportRows ? react_1.default.createElement(XExportRowsDialog_1.XExportRowsDialog, { key: "exportRowsDialog", dialogState: exportRowsDialogState, hideDialog: function () { return setExportRowsDialogState({ dialogOpened: false }); } }) : null),
         hasContentTypeHtml() ? react_1.default.createElement(editor_1.Editor, { style: { display: 'none' }, showHeader: false }) : null /* we want to import css if needed (<style type="text/css" data-primereact-style-id="editor">) */));
-};
-exports.XLazyDataTable = XLazyDataTable;
-exports.XLazyDataTable.defaultProps = {
-    paginator: true,
-    rows: 10,
-    filterDisplay: "row",
-    autoFilter: false,
-    showFilterButtons: true,
-    fullTextSearch: true,
-    multilineSwitch: false,
-    multilineSwitchInitValue: "allLines",
-    multilineSwitchFewLinesCount: 2,
-    scrollable: true,
-    scrollWidth: 'viewport',
-    scrollHeight: 'viewport',
-    shrinkWidth: true
-};
+});
 // TODO - XLazyColumn neni idealny nazov, lepsi je XColumn (ale zatial nechame XLazyColumn)
 var XLazyColumn = function (props) {
     // nevadi ze tu nic nevraciame, field a header vieme precitat a zvysok by sme aj tak zahodili lebo vytvarame novy element

package/lib/components/XUtils.d.ts

@@ -73,6 +73,7 @@ export declare class XUtils {
     static fetch(path: string, value: any, usePublicToken?: boolean | XToken): Promise<any>;
     static post(path: string, value: any): Promise<Response>;
     static openExcelReport(apiPath: string, requestPayload: any, fileName?: string): Promise<boolean>;
+    static downloadFile(apiPath: string, requestPayload: any, fileName: string): Promise<boolean>;
     static fetchBasicJson(path: string, value: any, usePublicToken?: boolean | XToken): Promise<Response>;
     static fetchFile(path: string, jsonFieldValue: any, fileToPost: any): Promise<any>;
     static fetchBasicAuthBasic(path: string, headers: any, body: any, usePublicToken?: boolean | XToken): Promise<Response>;