@michalrakus/x-react-web-lib 0.25.0 → 1.1.0

package/LICENSE.md

@@ -0,0 +1,21 @@
+The MIT License (MIT)
+
+Copyright (c) 2023-2023 Michal Rakus
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in
+all copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
+THE SOFTWARE.

package/XEnvVars.d.ts

@@ -0,0 +1,3 @@
+// generated by gulp
+
+export * from './lib/components/XEnvVars';

package/XEnvVars.js

@@ -0,0 +1,5 @@
+// generated by gulp
+
+'use strict';
+
+module.exports = require('./lib/components/XEnvVars.js');

package/XInputTextarea.d.ts

@@ -0,0 +1,3 @@
+// generated by gulp
+
+export * from './lib/components/XInputTextarea';

package/XInputTextarea.js

@@ -0,0 +1,5 @@
+// generated by gulp
+
+'use strict';
+
+module.exports = require('./lib/components/XInputTextarea.js');

package/gulpfile.js

@@ -21,6 +21,7 @@ function generateApi(cb) {
         "./lib/components/XChangePasswordForm",
         "./lib/components/XCheckbox",
         "./lib/components/XDropdown",
+        "./lib/components/XEnvVars",
         "./lib/components/XErrors",
         "./lib/components/XFormBase",
         "./lib/components/XFormBaseT",
@@ -31,6 +32,7 @@ function generateApi(cb) {
         "./lib/components/XInputDate",
         "./lib/components/XInputDecimal",
         "./lib/components/XInputText",
+        "./lib/components/XInputTextarea",
         "./lib/components/XLazyDataTable",
         "./lib/components/XLoginDialog",
         "./lib/components/XLoginForm",

package/lib/administration/XBrowseMetaForm.js

@@ -56,7 +56,7 @@ var XBrowseMetaForm = /** @class */ (function (_super) {
             react_1.default.createElement(XFormFooter_1.XFormFooter, { form: this })));
     };
     XBrowseMetaForm = __decorate([
-        XFormBase_1.Form("XBrowseMeta")
+        (0, XFormBase_1.Form)("XBrowseMeta")
     ], XBrowseMetaForm);
     return XBrowseMetaForm;
 }(XFormBase_1.XFormBase));

package/lib/administration/XUserBrowse.js

@@ -14,7 +14,7 @@ var __generator = (this && this.__generator) || function (thisArg, body) {
     function verb(n) { return function (v) { return step([n, v]); }; }
     function step(op) {
         if (f) throw new TypeError("Generator is already executing.");
-        while (_) try {
+        while (g && (g = 0, op[0] && (_ = 0)), _) try {
             if (f = 1, y && (t = op[0] & 2 ? y["return"] : op[0] ? y["throw"] || ((t = y["return"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t;
             if (y = 0, t) op = [op[0] & 2, t.value];
             switch (op[0]) {
@@ -47,7 +47,7 @@ var XUtils_1 = require("../components/XUtils");
 var XUserBrowse = function (props) {
     var onAddRow = function () {
         // openForm pridavame automaticky v XFormNavigator3 pri renderovani komponentu
-        props.openForm(react_1.default.createElement(XUserForm_1.XUserForm, null));
+        props.openForm(react_1.default.createElement(XUserForm_1.XUserForm, { object: { enabled: true } }));
     };
     var onEdit = function (selectedRow) {
         // openForm pridavame automaticky v XFormNavigator3 pri renderovani komponentu
@@ -77,8 +77,9 @@ var XUserBrowse = function (props) {
     }); };
     return (react_1.default.createElement(XLazyDataTable_1.XLazyDataTable, { entity: "XUser", rows: 10, onAddRow: onAddRow, onEdit: onEdit, removeRow: onRemoveRow, displayed: props.displayed },
         react_1.default.createElement(XLazyDataTable_1.XLazyColumn, { field: "idXUser", header: "ID" }),
-        react_1.default.createElement(XLazyDataTable_1.XLazyColumn, { field: "username", header: "Username", width: "11rem" }),
-        react_1.default.createElement(XLazyDataTable_1.XLazyColumn, { field: "name", header: "Name", width: "17rem" })));
+        react_1.default.createElement(XLazyDataTable_1.XLazyColumn, { field: "username", header: "Username", width: "17rem" }),
+        react_1.default.createElement(XLazyDataTable_1.XLazyColumn, { field: "name", header: "Name", width: "17rem" }),
+        react_1.default.createElement(XLazyDataTable_1.XLazyColumn, { field: "enabled", header: "Enabled" })));
 };
 exports.XUserBrowse = XUserBrowse;
 // zatial nepouzivane - prichystane do buducnosti

package/lib/administration/XUserForm.js

@@ -38,7 +38,7 @@ var __generator = (this && this.__generator) || function (thisArg, body) {
     function verb(n) { return function (v) { return step([n, v]); }; }
     function step(op) {
         if (f) throw new TypeError("Generator is already executing.");
-        while (_) try {
+        while (g && (g = 0, op[0] && (_ = 0)), _) try {
             if (f = 1, y && (t = op[0] & 2 ? y["return"] : op[0] ? y["throw"] || ((t = y["return"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t;
             if (y = 0, t) op = [op[0] & 2, t.value];
             switch (op[0]) {
@@ -71,11 +71,13 @@ var XInputDecimal_1 = require("../components/XInputDecimal");
 var password_1 = require("primereact/password");
 var XUtils_1 = require("../components/XUtils");
 var XFormFooter_1 = require("../components/XFormFooter");
+var XCheckbox_1 = require("../components/XCheckbox");
+var XEnvVars_1 = require("../components/XEnvVars");
 var XUserForm = /** @class */ (function (_super) {
     __extends(XUserForm, _super);
     function XUserForm(props) {
         var _this = _super.call(this, props) || this;
-        _this.state.usernameReadOnly = false;
+        _this.state.usernameEnabledReadOnly = false;
         _this.state.passwordNew = '';
         _this.state.passwordNewConfirm = '';
         _this.onClickSave = _this.onClickSave.bind(_this);
@@ -91,7 +93,7 @@ var XUserForm = /** @class */ (function (_super) {
                         _a.sent();
                         username = this.getXObject().username;
                         if (username === XUtils_1.XUtils.getUsername() || (XUtils_1.XUtils.demo() && (username === 'jozko' || username === 'xman'))) {
-                            this.setState({ usernameReadOnly: true });
+                            this.setState({ usernameEnabledReadOnly: true });
                         }
                         return [2 /*return*/];
                 }
@@ -112,26 +114,29 @@ var XUserForm = /** @class */ (function (_super) {
                             alert("Users jozko, xman can not be changed.");
                             return [2 /*return*/];
                         }
-                        if (this.isAddRow() && this.state.passwordNew === '') {
-                            alert("Password is required.");
-                            return [2 /*return*/];
-                        }
-                        if (this.state.passwordNew !== '' || this.state.passwordNewConfirm !== '') {
-                            // nedovolime tuto zmenit heslo aktualne prihlasenemu uzivatelovi, lebo by sme museli upravit aj token
-                            if (this.state.object.username === XUtils_1.XUtils.getUsername()) {
-                                alert("Please, change your password via option Administration -> Change password.");
+                        // password is used only by local authorization
+                        if (XUtils_1.XUtils.getEnvVarValue(XEnvVars_1.XEnvVar.REACT_APP_AUTH) === XEnvVars_1.XReactAppAuth.LOCAL) {
+                            if (this.isAddRow() && this.state.passwordNew === '') {
+                                alert("Password is required.");
                                 return [2 /*return*/];
                             }
-                            if (this.state.passwordNew !== this.state.passwordNewConfirm) {
-                                alert("New password and confirmed new password are not equal.");
-                                return [2 /*return*/];
+                            if (this.state.passwordNew !== '' || this.state.passwordNewConfirm !== '') {
+                                // nedovolime tuto zmenit heslo aktualne prihlasenemu uzivatelovi, lebo by sme museli upravit aj token
+                                if (this.state.object.username === XUtils_1.XUtils.getUsername()) {
+                                    alert("Please, change your password via option Administration -> Change password.");
+                                    return [2 /*return*/];
+                                }
+                                if (this.state.passwordNew !== this.state.passwordNewConfirm) {
+                                    alert("New password and confirmed new password are not equal.");
+                                    return [2 /*return*/];
+                                }
+                                // zapiseme nove heslo do objektu
+                                this.state.object.password = this.state.passwordNew;
+                            }
+                            else {
+                                // nemenime heslo (atribut s hodnotou undefined sa nezapise do DB)
+                                this.state.object.password = undefined;
                             }
-                            // zapiseme nove heslo do objektu
-                            this.state.object.password = this.state.passwordNew;
-                        }
-                        else {
-                            // nemenime heslo (atribut s hodnotou undefined sa nezapise do DB)
-                            this.state.object.password = undefined;
                         }
                         _a.label = 1;
                     case 1:
@@ -154,22 +159,29 @@ var XUserForm = /** @class */ (function (_super) {
     XUserForm.prototype.render = function () {
         var _this = this;
         // autoComplete="new-password" - bez tohto chrome predplna user/password, ak si user da ulozit user/password (pre danu url)
+        var passwordElems = [];
+        if (XUtils_1.XUtils.getEnvVarValue(XEnvVars_1.XEnvVar.REACT_APP_AUTH) === XEnvVars_1.XReactAppAuth.LOCAL) {
+            passwordElems = [
+                react_1.default.createElement("div", { className: "field grid" },
+                    react_1.default.createElement("label", { className: "col-fixed", style: { width: '14rem' } }, "New password"),
+                    react_1.default.createElement(password_1.Password, { value: this.state.passwordNew, onChange: function (e) { return _this.setState({ passwordNew: e.target.value }); }, feedback: false, maxLength: 64, size: 20, autoComplete: "new-password" })),
+                react_1.default.createElement("div", { className: "field grid" },
+                    react_1.default.createElement("label", { className: "col-fixed", style: { width: '14rem', whiteSpace: 'nowrap' } }, "Confirm new password"),
+                    react_1.default.createElement(password_1.Password, { value: this.state.passwordNewConfirm, onChange: function (e) { return _this.setState({ passwordNewConfirm: e.target.value }); }, feedback: false, maxLength: 64, size: 20, autoComplete: "new-password" }))
+            ];
+        }
         return (react_1.default.createElement("div", null,
             react_1.default.createElement("div", { className: "x-form-row" },
                 react_1.default.createElement("div", { className: "x-form-col" },
                     react_1.default.createElement(XInputDecimal_1.XInputDecimal, { form: this, field: "idXUser", label: "ID", readOnly: true, labelStyle: { width: '14rem' } }),
-                    react_1.default.createElement(XInputText_1.XInputText, { form: this, field: "username", label: "Username", size: 20, labelStyle: { width: '14rem' }, readOnly: this.state.usernameReadOnly }),
+                    react_1.default.createElement(XInputText_1.XInputText, { form: this, field: "username", label: "Username", size: 30, labelStyle: { width: '14rem' }, readOnly: this.state.usernameEnabledReadOnly }),
                     react_1.default.createElement(XInputText_1.XInputText, { form: this, field: "name", label: "Name", size: 30, labelStyle: { width: '14rem' } }),
-                    react_1.default.createElement("div", { className: "field grid" },
-                        react_1.default.createElement("label", { className: "col-fixed", style: { width: '14rem' } }, "New password"),
-                        react_1.default.createElement(password_1.Password, { value: this.state.passwordNew, onChange: function (e) { return _this.setState({ passwordNew: e.target.value }); }, feedback: false, maxLength: 64, size: 20, autoComplete: "new-password" })),
-                    react_1.default.createElement("div", { className: "field grid" },
-                        react_1.default.createElement("label", { className: "col-fixed", style: { width: '14rem', whiteSpace: 'nowrap' } }, "Confirm new password"),
-                        react_1.default.createElement(password_1.Password, { value: this.state.passwordNewConfirm, onChange: function (e) { return _this.setState({ passwordNewConfirm: e.target.value }); }, feedback: false, maxLength: 64, size: 20, autoComplete: "new-password" })))),
+                    react_1.default.createElement(XCheckbox_1.XCheckbox, { form: this, field: "enabled", label: "Enabled", labelStyle: { width: '14rem' }, readOnly: this.state.usernameEnabledReadOnly }),
+                    passwordElems)),
             react_1.default.createElement(XFormFooter_1.XFormFooter, { form: this })));
     };
     XUserForm = __decorate([
-        XFormBase_1.Form("XUser"),
+        (0, XFormBase_1.Form)("XUser"),
         __metadata("design:paramtypes", [Object])
     ], XUserForm);
     return XUserForm;

package/lib/components/SourceCodeLinkEntity.js

@@ -7,7 +7,7 @@ exports.SourceCodeLinkEntity = void 0;
 var react_1 = __importDefault(require("react"));
 var SourceCodeLinkEntity = function (props) {
     return (react_1.default.createElement("div", { className: "flex justify-content-center" },
-        react_1.default.createElement("a", { className: "source-code-link", href: "https://github.com/michalrakus/demo-nest-server-app/blob/master/src/model/" + props.sourceCodeFile, target: "_blank", rel: "noopener noreferrer" },
+        react_1.default.createElement("a", { className: "source-code-link", href: "https://github.com/michalrakus/demo-nest-server-app/blob/master/src/model/".concat(props.sourceCodeFile), target: "_blank", rel: "noopener noreferrer" },
             "Source code entity: ",
             props.sourceCodeFile)));
 };

package/lib/components/XAutoComplete.d.ts

@@ -20,9 +20,9 @@ export declare class XAutoComplete extends XFormComponent<XAutoCompleteProps> {
     constructor(props: XAutoCompleteProps);
     componentDidMount(): void;
     readAndSetSuggestions(): Promise<void>;
-    getFieldForEdit(): string | undefined;
-    checkNotNull(): boolean;
-    getValueFromObject(): any;
+    getField(): string;
+    isNotNull(): boolean;
+    getValue(): any | null;
     onChangeAutoCompleteBase(object: any, objectChange: OperationType): void;
     onErrorChangeAutoCompleteBase(error: string | undefined): void;
     validate(): {

package/lib/components/XAutoComplete.js

@@ -29,7 +29,7 @@ var __generator = (this && this.__generator) || function (thisArg, body) {
     function verb(n) { return function (v) { return step([n, v]); }; }
     function step(op) {
         if (f) throw new TypeError("Generator is already executing.");
-        while (_) try {
+        while (g && (g = 0, op[0] && (_ = 0)), _) try {
             if (f = 1, y && (t = op[0] & 2 ? y["return"] : op[0] ? y["throw"] || ((t = y["return"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t;
             if (y = 0, t) op = [op[0] & 2, t.value];
             switch (op[0]) {
@@ -91,32 +91,18 @@ var XAutoComplete = /** @class */ (function (_super) {
             });
         });
     };
-    XAutoComplete.prototype.getFieldForEdit = function () {
-        var _a;
-        // TODO - zohladnit aj aktualny readOnly stav
-        var readOnly = (_a = this.props.readOnly) !== null && _a !== void 0 ? _a : false;
-        if (!readOnly) {
-            return this.props.assocField;
-        }
-        return undefined;
+    XAutoComplete.prototype.getField = function () {
+        return this.props.assocField;
     };
-    XAutoComplete.prototype.checkNotNull = function () {
-        var _a;
-        // TODO - zohladnit aj aktualny readOnly stav
-        return !this.xAssoc.isNullable && !((_a = this.props.readOnly) !== null && _a !== void 0 ? _a : false);
+    XAutoComplete.prototype.isNotNull = function () {
+        return !this.xAssoc.isNullable;
     };
-    XAutoComplete.prototype.getValueFromObject = function () {
-        var object = this.props.form.state.object;
-        var assocObject = object !== null ? object[this.props.assocField] : null;
-        // ak je undefined, pre istotu dame na null, null je standard
-        if (assocObject === undefined) {
-            assocObject = null;
-        }
+    XAutoComplete.prototype.getValue = function () {
+        var assocObject = this.getValueFromObject();
         return assocObject;
     };
     XAutoComplete.prototype.onChangeAutoCompleteBase = function (object, objectChange) {
-        var error = this.validateOnChange(object);
-        this.props.form.onFieldChange(this.props.assocField, object, error);
+        this.onValueChangeBase(object);
         if (objectChange !== XUtils_1.OperationType.None) {
             // zmenil sa zaznam dobrovolnika v DB
             // zatial len refreshneme z DB
@@ -131,30 +117,23 @@ var XAutoComplete = /** @class */ (function (_super) {
     // overrides method in XFormComponent
     XAutoComplete.prototype.validate = function () {
         if (this.errorInBase) {
-            var field = this.getFieldForEdit();
-            if (field) {
-                // error message dame na onChange, mohli by sme aj na onSet (predtym onBlur), je to jedno viac-menej
-                return { field: field, xError: { onChange: this.errorInBase } };
-            }
+            // error message dame na onChange, mohli by sme aj na onSet (predtym onBlur), je to jedno viac-menej
+            return { field: this.getField(), xError: { onChange: this.errorInBase, fieldLabel: this.getLabel() } };
         }
         // zavolame povodnu metodu
         return _super.prototype.validate.call(this);
     };
     XAutoComplete.prototype.render = function () {
-        var _a, _b, _c, _d;
+        var _a;
         var xEntityAssoc = XUtilsMetadata_1.XUtilsMetadata.getXEntity(this.xAssoc.entityName);
         var xDisplayField = XUtilsMetadata_1.XUtilsMetadata.getXFieldByPath(xEntityAssoc, this.props.displayField);
-        var label = (_a = this.props.label) !== null && _a !== void 0 ? _a : this.props.assocField;
-        if (this.checkNotNull()) {
-            label = XUtils_1.XUtils.markNotNull(label);
-        }
-        var readOnly = (_b = this.props.readOnly) !== null && _b !== void 0 ? _b : false;
-        var size = (_c = this.props.size) !== null && _c !== void 0 ? _c : xDisplayField.length;
-        var labelStyle = (_d = this.props.labelStyle) !== null && _d !== void 0 ? _d : { width: XUtils_1.XUtils.FIELD_LABEL_WIDTH };
+        // TODO - readOnly
+        // TODO - size
+        var size = (_a = this.props.size) !== null && _a !== void 0 ? _a : xDisplayField.length;
         // div className="col" nam zabezpeci aby XAutoCompleteBase nezaberal celu dlzku grid-u (ma nastaveny width=100% vdaka "formgroup-inline")
         return (react_1.default.createElement("div", { className: "field grid" },
-            react_1.default.createElement("label", { htmlFor: this.props.assocField, className: "col-fixed", style: labelStyle }, label),
-            react_1.default.createElement(XAutoCompleteBase_1.XAutoCompleteBase, { value: this.getValueFromObject(), suggestions: this.state.suggestions, onChange: this.onChangeAutoCompleteBase, field: this.props.displayField, valueForm: this.props.assocForm, idField: xEntityAssoc.idField, error: this.getError(), onErrorChange: this.onErrorChangeAutoCompleteBase })));
+            react_1.default.createElement("label", { htmlFor: this.props.assocField, className: "col-fixed", style: this.getLabelStyle() }, this.getLabel()),
+            react_1.default.createElement(XAutoCompleteBase_1.XAutoCompleteBase, { value: this.getValue(), suggestions: this.state.suggestions, onChange: this.onChangeAutoCompleteBase, field: this.props.displayField, valueForm: this.props.assocForm, idField: xEntityAssoc.idField, error: this.getError(), onErrorChange: this.onErrorChangeAutoCompleteBase })));
     };
     return XAutoComplete;
 }(XFormComponent_1.XFormComponent));

package/lib/components/XAutoCompleteBase.d.ts

@@ -7,7 +7,7 @@ export interface XAutoCompleteBaseProps {
     field: string;
     valueForm?: any;
     idField?: string;
-    maxlength?: number;
+    maxLength?: number;
     error?: string;
     onErrorChange: (error: string | undefined) => void;
     setFocusOnCreate?: boolean;

package/lib/components/XAutoCompleteBase.js

@@ -27,7 +27,11 @@ var __assign = (this && this.__assign) || function () {
 };
 var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
     if (k2 === undefined) k2 = k;
-    Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
 }) : (function(o, m, k, k2) {
     if (k2 === undefined) k2 = k;
     o[k2] = m[k];
@@ -60,10 +64,14 @@ var __read = (this && this.__read) || function (o, n) {
     }
     return ar;
 };
-var __spreadArray = (this && this.__spreadArray) || function (to, from) {
-    for (var i = 0, il = from.length, j = to.length; i < il; i++, j++)
-        to[j] = from[i];
-    return to;
+var __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {
+    if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) {
+        if (ar || !(i in from)) {
+            if (!ar) ar = Array.prototype.slice.call(from, 0, i);
+            ar[i] = from[i];
+        }
+    }
+    return to.concat(ar || Array.prototype.slice.call(from));
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.XAutoCompleteBase = void 0;
@@ -101,7 +109,7 @@ var XAutoCompleteBase = /** @class */ (function (_super) {
         var _this = this;
         var filteredSuggestions;
         if (!event.query.trim().length) {
-            filteredSuggestions = __spreadArray([], __read(this.props.suggestions));
+            filteredSuggestions = __spreadArray([], __read(this.props.suggestions), false);
         }
         else {
             var queryNormalized_1 = XUtils_1.XUtils.normalizeString(event.query);
@@ -163,7 +171,7 @@ var XAutoCompleteBase = /** @class */ (function (_super) {
         }
     };
     XAutoCompleteBase.prototype.createErrorMessage = function () {
-        return "Value \"" + this.state.inputValueState + "\" was not found among valid values.";
+        return "Value \"".concat(this.state.inputValueState, "\" was not found among valid values.");
     };
     /*
         onBlurInvalidInput() {
@@ -189,18 +197,7 @@ var XAutoCompleteBase = /** @class */ (function (_super) {
         }
     */
     XAutoCompleteBase.prototype.setFocusToInput = function () {
-        if (this.autoCompleteRef.current.inputRef !== undefined) {
-            // funguje ak je XAutoCompleteBase priamo v projekte, tiez funguje ak sa pouziva lib-ka z npmjs.com
-            // nefunguje ak mame lib-ku priamo nalinkovanu na projekt (zmeny lib-ky pocas vyvoja)(minimalne next projekt kvm-next-web-app nefungoval)
-            this.autoCompleteRef.current.inputRef.current.focus();
-        }
-        else {
-            // pozor! nefunguje ak sa lib-ka pouziva z npmjs.com,
-            // je tu koli tomu ked je lib-ka priamo nalinkovana na projekt
-            // je to hack ale neviem to lepsie vyriesit
-            console.log('Warning! this.autoCompleteRef.current.inputRef is undefined - we try to use this.autoCompleteRef.current.inputEl instead');
-            this.autoCompleteRef.current.inputEl.focus();
-        }
+        this.autoCompleteRef.current.focus();
     };
     XAutoCompleteBase.prototype.setObjectValue = function (object, objectChange) {
         this.setState({ inputChanged: false, notValid: false });
@@ -263,7 +260,7 @@ var XAutoCompleteBase = /** @class */ (function (_super) {
                 icon: 'pi pi-pencil',
                 command: function (e) {
                     if (_this.state.inputChanged) {
-                        alert("Value \"" + _this.state.inputValueState + "\" was not found among valid values, please enter some valid value.");
+                        alert("Value \"".concat(_this.state.inputValueState, "\" was not found among valid values, please enter some valid value."));
                         _this.setFocusToInput();
                     }
                     else {
@@ -295,7 +292,11 @@ var XAutoCompleteBase = /** @class */ (function (_super) {
             command: function (e) {
                 // zobrazi cely suggestions list, zide sa ak chceme vidiet vsetky moznosti
                 // neprakticke ak mame vela poloziek v suggestions list
-                _this.autoCompleteRef.current.onDropdownClick();
+                // krasne zobrazi cely objekt!
+                // this.autoCompleteRef.current je element <AutoComplete .../>, ktory vytvarame v render metode
+                //console.log(this.autoCompleteRef.current);
+                // otvori dropdown (search je metoda popisana v API, volanie sme skopcili zo zdrojakov primereact)
+                _this.autoCompleteRef.current.search(e, '', 'dropdown');
             }
         });
         // vypocitame inputValue
@@ -312,7 +313,7 @@ var XAutoCompleteBase = /** @class */ (function (_super) {
         // <DobrovolnikForm id={this.formDialogObjectId} object={this.formDialogInitObjectForInsert} onSaveOrCancel={this.formDialogOnSaveOrCancel}/>
         // formgroup-inline lepi SplitButton na autocomplete a zarovna jeho vysku
         return (react_1.default.createElement("div", { className: "x-auto-complete-base" },
-            react_1.default.createElement(autocomplete_1.AutoComplete, __assign({ value: inputValue, suggestions: this.state.filteredSuggestions, completeMethod: this.completeMethod, field: this.props.field, onChange: this.onChange, onSelect: this.onSelect, onBlur: this.onBlur, maxlength: this.props.maxlength, ref: this.autoCompleteRef }, XUtils_1.XUtils.createErrorProps(error))),
+            react_1.default.createElement(autocomplete_1.AutoComplete, __assign({ value: inputValue, suggestions: this.state.filteredSuggestions, completeMethod: this.completeMethod, field: this.props.field, onChange: this.onChange, onSelect: this.onSelect, onBlur: this.onBlur, maxLength: this.props.maxLength, ref: this.autoCompleteRef }, XUtils_1.XUtils.createErrorProps(error))),
             react_1.default.createElement(splitbutton_1.SplitButton, { model: splitButtonItems, className: 'x-splitbutton-only-dropdown' + XUtils_1.XUtils.mobileCssSuffix(), menuClassName: 'x-splitbutton-only-dropdown-menu' + XUtils_1.XUtils.mobileCssSuffix() }),
             this.props.valueForm != undefined ?
                 react_1.default.createElement(dialog_1.Dialog, { visible: this.state.formDialogOpened, onHide: this.formDialogOnHide, header: this.formDialogObjectId ? 'Modification' : 'New record' }, react_1.default.cloneElement(this.props.valueForm, {

package/lib/components/XBrowse.js

@@ -16,7 +16,11 @@ var __extends = (this && this.__extends) || (function () {
 })();
 var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
     if (k2 === undefined) k2 = k;
-    Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
 }) : (function(o, m, k, k2) {
     if (k2 === undefined) k2 = k;
     o[k2] = m[k];
@@ -48,7 +52,7 @@ var __generator = (this && this.__generator) || function (thisArg, body) {
     function verb(n) { return function (v) { return step([n, v]); }; }
     function step(op) {
         if (f) throw new TypeError("Generator is already executing.");
-        while (_) try {
+        while (g && (g = 0, op[0] && (_ = 0)), _) try {
             if (f = 1, y && (t = op[0] & 2 ? y["return"] : op[0] ? y["throw"] || ((t = y["return"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t;
             if (y = 0, t) op = [op[0] & 2, t.value];
             switch (op[0]) {
@@ -314,7 +318,7 @@ var XBrowse = /** @class */ (function (_super) {
             this.props.openForm(formElementCloned);
         }
         else {
-            console.log("XBrowse entity = " + this.props.entity + ": form not found/registered.");
+            console.log("XBrowse entity = ".concat(this.props.entity, ": form not found/registered."));
         }
     };
     XBrowse.prototype.render = function () {

package/lib/components/XChangePasswordForm.js

@@ -1,7 +1,11 @@
 "use strict";
 var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
     if (k2 === undefined) k2 = k;
-    Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
 }) : (function(o, m, k, k2) {
     if (k2 === undefined) k2 = k;
     o[k2] = m[k];
@@ -33,7 +37,7 @@ var __generator = (this && this.__generator) || function (thisArg, body) {
     function verb(n) { return function (v) { return step([n, v]); }; }
     function step(op) {
         if (f) throw new TypeError("Generator is already executing.");
-        while (_) try {
+        while (g && (g = 0, op[0] && (_ = 0)), _) try {
             if (f = 1, y && (t = op[0] & 2 ? y["return"] : op[0] ? y["throw"] || ((t = y["return"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t;
             if (y = 0, t) op = [op[0] & 2, t.value];
             switch (op[0]) {
@@ -79,9 +83,9 @@ var button_1 = require("primereact/button");
 var inputtext_1 = require("primereact/inputtext");
 var XChangePasswordForm = function (props) {
     var _a;
-    var _b = __read(react_1.useState(""), 2), passwordCurrent = _b[0], setPasswordCurrent = _b[1];
-    var _c = __read(react_1.useState(""), 2), passwordNew = _c[0], setPasswordNew = _c[1];
-    var _d = __read(react_1.useState(""), 2), passwordNewConfirm = _d[0], setPasswordNewConfirm = _d[1];
+    var _b = __read((0, react_1.useState)(""), 2), passwordCurrent = _b[0], setPasswordCurrent = _b[1];
+    var _c = __read((0, react_1.useState)(""), 2), passwordNew = _c[0], setPasswordNew = _c[1];
+    var _d = __read((0, react_1.useState)(""), 2), passwordNewConfirm = _d[0], setPasswordNewConfirm = _d[1];
     var onClickSave = function () { return __awaiter(void 0, void 0, void 0, function () {
         var xToken, e_1;
         return __generator(this, function (_a) {

package/lib/components/XCheckbox.d.ts

@@ -1,9 +1,8 @@
-import React from "react";
-import { XFormBase } from "./XFormBase";
-export declare const XCheckbox: (props: {
-    form: XFormBase;
-    field: string;
-    label?: string | undefined;
-    readOnly?: boolean | undefined;
-    inputStyle?: React.CSSProperties | undefined;
-}) => JSX.Element;
+/// <reference types="react" />
+import { XInput, XInputProps } from "./XInput";
+export declare class XCheckbox extends XInput<XInputProps> {
+    constructor(props: XInputProps);
+    getValue(): boolean | null;
+    onValueChange(e: any): void;
+    render(): JSX.Element;
+}

package/lib/components/XCheckbox.js

@@ -1,49 +1,57 @@
 "use strict";
+var __extends = (this && this.__extends) || (function () {
+    var extendStatics = function (d, b) {
+        extendStatics = Object.setPrototypeOf ||
+            ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
+            function (d, b) { for (var p in b) if (Object.prototype.hasOwnProperty.call(b, p)) d[p] = b[p]; };
+        return extendStatics(d, b);
+    };
+    return function (d, b) {
+        if (typeof b !== "function" && b !== null)
+            throw new TypeError("Class extends value " + String(b) + " is not a constructor or null");
+        extendStatics(d, b);
+        function __() { this.constructor = d; }
+        d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
+    };
+})();
 var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.XCheckbox = void 0;
 var react_1 = __importDefault(require("react"));
-var XUtilsMetadata_1 = require("./XUtilsMetadata");
 var tristatecheckbox_1 = require("primereact/tristatecheckbox");
-var XUtilsCommon_1 = require("../serverApi/XUtilsCommon");
-var XUtils_1 = require("./XUtils");
-var XCheckbox = function (props) {
-    var _a;
-    props.form.addField(props.field);
-    var xField = XUtilsMetadata_1.XUtilsMetadata.getXFieldByPathStr(props.form.getEntity(), props.field);
-    var label = (_a = props.label) !== null && _a !== void 0 ? _a : props.field;
-    var readOnly = XUtils_1.XUtils.isReadOnly(props.field, props.readOnly);
-    if (!xField.isNullable && !readOnly) {
-        label = XUtils_1.XUtils.markNotNull(label);
+var XInput_1 = require("./XInput");
+var XCheckbox = /** @class */ (function (_super) {
+    __extends(XCheckbox, _super);
+    function XCheckbox(props) {
+        var _this = _super.call(this, props) || this;
+        _this.onValueChange = _this.onValueChange.bind(_this);
+        return _this;
     }
-    var onValueChange = function (e) {
+    XCheckbox.prototype.getValue = function () {
+        // konvertovat null hodnotu na "" (vo funkcii stringAsUI) je dolezite aby sa prejavila zmena na null v modeli
+        var value = this.getValueFromObject();
+        return value;
+    };
+    XCheckbox.prototype.onValueChange = function (e) {
         var newValue = e.value;
         // pri klikani na TriStateCheckbox prichadza v newValue cyklicky: true -> false -> null
         // ak mame not null atribut, tak pri null hodnote skocime rovno na true
-        if (!xField.isNullable) {
+        if (this.isNotNull()) {
             if (newValue === null) {
                 newValue = true;
             }
         }
         // zmenime hodnotu v modeli (odtial sa hodnota cita)
-        props.form.onFieldChange(props.field, newValue);
+        this.onValueChangeBase(newValue);
     };
-    var fieldValue = null;
-    var object = props.form.state.object;
-    if (object !== null) {
-        var objectValue = XUtilsCommon_1.XUtilsCommon.getValueByPath(object, props.field);
-        //  pri inserte noveho riadku su (zatial) vsetky fieldy undefined, dame na null, null je standard
-        if (objectValue === undefined) {
-            objectValue = null;
-        }
-        // konvertovat null hodnotu na "" (vo funkcii stringAsUI) je dolezite aby sa prejavila zmena na null v modeli
-        fieldValue = objectValue;
-    }
-    // note: style overrides size (width of the input according to character count)
-    return (react_1.default.createElement("div", { className: "field grid" },
-        react_1.default.createElement("label", { htmlFor: props.field, className: "col-fixed", style: { width: XUtils_1.XUtils.FIELD_LABEL_WIDTH } }, label),
-        react_1.default.createElement(tristatecheckbox_1.TriStateCheckbox, { id: props.field, value: fieldValue, onChange: onValueChange, disabled: readOnly, style: props.inputStyle })));
-};
+    XCheckbox.prototype.render = function () {
+        // note: style overrides size (width of the input according to character count)
+        return (react_1.default.createElement("div", { className: "field grid" },
+            react_1.default.createElement("label", { htmlFor: this.props.field, className: "col-fixed", style: this.getLabelStyle() }, this.getLabel()),
+            react_1.default.createElement(tristatecheckbox_1.TriStateCheckbox, { id: this.props.field, value: this.getValue(), onChange: this.onValueChange, disabled: this.isReadOnly(), style: this.props.inputStyle })));
+    };
+    return XCheckbox;
+}(XInput_1.XInput));
 exports.XCheckbox = XCheckbox;