@michalrakus/x-react-web-lib 1.0.0 → 1.2.0

package/lib/components/XHolders.js

@@ -5,9 +5,11 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.XHolder2 = exports.XHolder1 = void 0;
 var react_1 = __importDefault(require("react"));
-exports.XHolder1 = function (props) {
+var XHolder1 = function (props) {
     return react_1.default.createElement("div", null, props.element);
 };
-exports.XHolder2 = function (props) {
+exports.XHolder1 = XHolder1;
+var XHolder2 = function (props) {
     return react_1.default.createElement("div", null, props.element);
 };
+exports.XHolder2 = XHolder2;

package/lib/components/XInput.d.ts

@@ -0,0 +1,13 @@
+import React from "react";
+import { XFormComponent, XFormComponentProps } from "./XFormComponent";
+import { XField } from "../serverApi/XEntityMetadata";
+export interface XInputProps<T> extends XFormComponentProps<T> {
+    field: string;
+    inputStyle?: React.CSSProperties;
+}
+export declare abstract class XInput<T, P extends XInputProps<T>> extends XFormComponent<T, P> {
+    protected xField: XField;
+    protected constructor(props: P);
+    getField(): string;
+    isNotNull(): boolean;
+}

package/lib/components/XInput.js

@@ -0,0 +1,38 @@
+"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 __());
+    };
+})();
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.XInput = void 0;
+var XUtilsMetadata_1 = require("./XUtilsMetadata");
+var XFormComponent_1 = require("./XFormComponent");
+// spolocna nadtrieda pre jednoduche inputy (nie asociacne)
+var XInput = /** @class */ (function (_super) {
+    __extends(XInput, _super);
+    function XInput(props) {
+        var _this = _super.call(this, props) || this;
+        _this.xField = XUtilsMetadata_1.XUtilsMetadata.getXFieldByPathStr(props.form.getEntity(), props.field);
+        props.form.addField(props.field);
+        return _this;
+    }
+    XInput.prototype.getField = function () {
+        return this.props.field;
+    };
+    XInput.prototype.isNotNull = function () {
+        return !this.xField.isNullable;
+    };
+    return XInput;
+}(XFormComponent_1.XFormComponent));
+exports.XInput = XInput;

package/lib/components/XInputDT.d.ts

@@ -0,0 +1,11 @@
+import { XField } from "../serverApi/XEntityMetadata";
+import { XFormComponentDT, XFormComponentDTProps } from "./XFormComponentDT";
+export interface XInputDTProps extends XFormComponentDTProps {
+    field: string;
+}
+export declare abstract class XInputDT<P extends XInputDTProps> extends XFormComponentDT<P> {
+    protected xField: XField;
+    protected constructor(props: P);
+    getField(): string;
+    isNotNull(): boolean;
+}

package/lib/components/XInputDT.js

@@ -0,0 +1,37 @@
+"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 __());
+    };
+})();
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.XInputDT = void 0;
+var XUtilsMetadata_1 = require("./XUtilsMetadata");
+var XFormComponentDT_1 = require("./XFormComponentDT");
+// spolocna nadtrieda pre jednoduche inputy (nie asociacne)
+var XInputDT = /** @class */ (function (_super) {
+    __extends(XInputDT, _super);
+    function XInputDT(props) {
+        var _this = _super.call(this, props) || this;
+        _this.xField = XUtilsMetadata_1.XUtilsMetadata.getXFieldByPathStr(props.entity, props.field);
+        return _this;
+    }
+    XInputDT.prototype.getField = function () {
+        return this.props.field;
+    };
+    XInputDT.prototype.isNotNull = function () {
+        return !this.xField.isNullable;
+    };
+    return XInputDT;
+}(XFormComponentDT_1.XFormComponentDT));
+exports.XInputDT = XInputDT;

package/lib/components/XInputDate.d.ts

@@ -1,8 +1,9 @@
-/// <reference types="react" />
 import { XFormBase } from "./XFormBase";
+import React from "react";
 export declare const XInputDate: (props: {
     form: XFormBase;
     field: string;
     label?: string | undefined;
     readOnly?: boolean | undefined;
+    labelStyle?: React.CSSProperties | undefined;
 }) => JSX.Element;

package/lib/components/XInputDate.js

@@ -10,8 +10,8 @@ var XUtilsConversions_1 = require("./XUtilsConversions");
 var XUtilsMetadata_1 = require("./XUtilsMetadata");
 var XUtilsCommon_1 = require("../serverApi/XUtilsCommon");
 var XUtils_1 = require("./XUtils");
-exports.XInputDate = function (props) {
-    var _a;
+var XInputDate = function (props) {
+    var _a, _b;
     props.form.addField(props.field);
     var xField = XUtilsMetadata_1.XUtilsMetadata.getXFieldByPathStr(props.form.getEntity(), props.field);
     var showTime = (xField.type === 'datetime');
@@ -49,7 +49,10 @@ exports.XInputDate = function (props) {
         }
         // fieldValue zostalo undefined (konvertujeme null -> undefined) - Calendar pozaduje undefined, nechce null
     }
+    var labelStyle = (_b = props.labelStyle) !== null && _b !== void 0 ? _b : {};
+    XUtils_1.XUtils.addCssPropIfNotExists(labelStyle, { width: XUtils_1.XUtils.FIELD_LABEL_WIDTH });
     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(calendar_1.Calendar, { id: props.field, value: fieldValue, onChange: onValueChange, disabled: readOnly, showIcon: true, dateFormat: XUtilsConversions_1.dateFormatCalendar(), showTime: showTime, showSeconds: showTime, inputClassName: cssClassName, showOnFocus: false })));
+        react_1.default.createElement("label", { htmlFor: props.field, className: "col-fixed", style: labelStyle }, label),
+        react_1.default.createElement(calendar_1.Calendar, { id: props.field, value: fieldValue, onChange: onValueChange, disabled: readOnly, showIcon: true, dateFormat: (0, XUtilsConversions_1.dateFormatCalendar)(), showTime: showTime, showSeconds: showTime, inputClassName: cssClassName, showOnFocus: false })));
 };
+exports.XInputDate = XInputDate;

package/lib/components/XInputDateDT.js

@@ -8,7 +8,7 @@ var XUtilsConversions_1 = require("./XUtilsConversions");
 var calendar_1 = require("primereact/calendar");
 var react_1 = __importDefault(require("react"));
 var XUtilsCommon_1 = require("../serverApi/XUtilsCommon");
-exports.XInputDateDT = function (props) {
+var XInputDateDT = function (props) {
     var showTime = (props.xField.type === 'datetime');
     var cssClassName = showTime ? 'x-input-datetime' : 'x-input-date';
     // ak mame path, field je vzdy readOnly
@@ -50,5 +50,6 @@ exports.XInputDateDT = function (props) {
     // TODO - nefunguje dobre pridavanie noveho riadku - su tam stare neupdatnute hodnoty - este to asi neopravili https://github.com/primefaces/primereact/issues/1277
     // test mame na TestovaciForm
     // appendTo={document.body} appenduje overlay panel na element body - eliminuje problem s overflow (pozri poznamku v XDropdownDTFilter)
-    return (react_1.default.createElement(calendar_1.Calendar, { appendTo: document.body, id: props.field, value: fieldValue, onChange: function (e) { return onValueChange(props.field, props.rowData, e.value); }, disabled: readOnly, showIcon: true, dateFormat: XUtilsConversions_1.dateFormatCalendar(), showTime: showTime, showSeconds: showTime, inputClassName: cssClassName, showOnFocus: false }));
+    return (react_1.default.createElement(calendar_1.Calendar, { appendTo: document.body, id: props.field, value: fieldValue, onChange: function (e) { return onValueChange(props.field, props.rowData, e.value); }, disabled: readOnly, showIcon: true, dateFormat: (0, XUtilsConversions_1.dateFormatCalendar)(), showTime: showTime, showSeconds: showTime, inputClassName: cssClassName, showOnFocus: false }));
 };
+exports.XInputDateDT = XInputDateDT;

package/lib/components/XInputDecimal.d.ts

@@ -1,8 +1,15 @@
 import React from "react";
 import { XFormComponentProps } from "./XFormComponent";
-export interface XInputDecimalProps extends XFormComponentProps {
+import { XInput } from "./XInput";
+export interface XInputDecimalProps extends XFormComponentProps<number> {
     field: string;
     size?: number;
     inputStyle?: React.CSSProperties;
 }
-export declare const XInputDecimal: (props: XInputDecimalProps) => JSX.Element;
+export declare class XInputDecimal extends XInput<number, XInputDecimalProps> {
+    constructor(props: XInputDecimalProps);
+    getValue(): number | undefined;
+    onValueChange(e: any): void;
+    onBlur(e: any): void;
+    render(): JSX.Element;
+}

package/lib/components/XInputDecimal.js

@@ -1,4 +1,30 @@
 "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 __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
 var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
@@ -7,54 +33,46 @@ exports.XInputDecimal = void 0;
 var react_1 = __importDefault(require("react"));
 var inputnumber_1 = require("primereact/inputnumber");
 var XUtilsMetadata_1 = require("./XUtilsMetadata");
-var XUtilsCommon_1 = require("../serverApi/XUtilsCommon");
-var XUtils_1 = require("./XUtils");
-exports.XInputDecimal = function (props) {
-    var _a, _b, _c;
-    props.form.addField(props.field);
-    var xField = XUtilsMetadata_1.XUtilsMetadata.getXFieldByPathStr(props.form.getEntity(), props.field);
-    var _d = XUtilsMetadata_1.XUtilsMetadata.getParamsForInputNumber(xField), useGrouping = _d.useGrouping, fractionDigits = _d.fractionDigits, min = _d.min, max = _d.max, size = _d.size;
-    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 sizeInput = props.size !== undefined ? props.size : size;
-    var inline = (_b = props.inline) !== null && _b !== void 0 ? _b : false;
-    var labelStyle = (_c = props.labelStyle) !== null && _c !== void 0 ? _c : {};
-    if (!inline) {
-        XUtils_1.XUtils.addCssPropIfNotExists(labelStyle, { width: XUtils_1.XUtils.FIELD_LABEL_WIDTH });
+var XInput_1 = require("./XInput");
+var XInputDecimal = /** @class */ (function (_super) {
+    __extends(XInputDecimal, _super);
+    function XInputDecimal(props) {
+        var _this = _super.call(this, props) || this;
+        _this.onValueChange = _this.onValueChange.bind(_this);
+        _this.onBlur = _this.onBlur.bind(_this);
+        return _this;
     }
-    else {
-        XUtils_1.XUtils.addCssPropIfNotExists(labelStyle, { width: 'auto' }); // podla dlzky labelu
-        XUtils_1.XUtils.addCssPropIfNotExists(labelStyle, { marginLeft: '1rem' });
-    }
-    var onValueChange = function (e) {
-        // z InputNumber prichadza e.value - typ number alebo null
-        props.form.onFieldChange(props.field, e.value);
-    };
-    var fieldValue = undefined;
-    var object = props.form.state.object;
-    if (object !== null) {
-        var objectValue = XUtilsCommon_1.XUtilsCommon.getValueByPath(object, props.field);
-        //  pre istotu dame na null, null je standard
-        //if (objectValue === undefined) {
-        //    objectValue = null;
-        //}
-        // TODO - konvertovat null hodnotu na "" (vo funkcii stringAsUI) je dolezite aby sa prejavila zmena na null v modeli
-        // - otestovat ci zmena na null funguje dobre -
-        //fieldValue = stringAsUI(objectValue);
+    XInputDecimal.prototype.getValue = function () {
+        var value = undefined;
+        var objectValue = this.getValueFromObject();
         // tuto zatial hack, mal by prist number
         if (typeof objectValue === 'string') {
-            fieldValue = parseFloat(objectValue);
+            value = parseFloat(objectValue);
         }
         else if (typeof objectValue === 'number') {
-            fieldValue = objectValue;
+            value = objectValue;
         }
-        // fieldValue zostalo undefined (konvertujeme null -> undefined) - InputNumber pozaduje undefined, nechce null
-    }
-    // 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: labelStyle }, label),
-        react_1.default.createElement(inputnumber_1.InputNumber, { id: props.field, value: fieldValue, onChange: onValueChange, disabled: readOnly, mode: "decimal", locale: "de-DE", useGrouping: useGrouping, minFractionDigits: fractionDigits, maxFractionDigits: fractionDigits, min: min, max: max, size: sizeInput, style: props.inputStyle })));
-};
+        // value zostalo undefined ak nebol vykonany ziaden if (konvertujeme null -> undefined) - InputNumber pozaduje undefined, nechce null
+        return value;
+    };
+    XInputDecimal.prototype.onValueChange = function (e) {
+        // z InputNumber prichadza e.value - typ number alebo null
+        this.onValueChangeBase(e.value);
+    };
+    // nedame do onChange inputu, lebo by sa nas onChange volal po kazdej zmene pismenka
+    // ak bude treba, mozme este dorobit metodu "onChange2", ktora sa bude volat po kazdej zmene pismenka (asi iba do XInputText)
+    XInputDecimal.prototype.onBlur = function (e) {
+        this.callOnChangeFromOnBlur();
+    };
+    XInputDecimal.prototype.render = function () {
+        var _a;
+        var _b = XUtilsMetadata_1.XUtilsMetadata.getParamsForInputNumber(this.xField), useGrouping = _b.useGrouping, fractionDigits = _b.fractionDigits, min = _b.min, max = _b.max, size = _b.size;
+        var sizeInput = (_a = this.props.size) !== null && _a !== void 0 ? _a : size;
+        // 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(inputnumber_1.InputNumber, __assign({ id: this.props.field, value: this.getValue(), onChange: this.onValueChange, readOnly: this.isReadOnly(), mode: "decimal", locale: "de-DE", useGrouping: useGrouping, minFractionDigits: fractionDigits, maxFractionDigits: fractionDigits, min: min, max: max, size: sizeInput, style: this.props.inputStyle }, this.getClassNameTooltip(), { onBlur: this.onBlur }))));
+    };
+    return XInputDecimal;
+}(XInput_1.XInput));
+exports.XInputDecimal = XInputDecimal;

package/lib/components/XInputDecimalDT.d.ts

@@ -1,9 +1,11 @@
 /// <reference types="react" />
-import { XFormBase } from "./XFormBase";
-export declare const XInputDecimalDT: (props: {
-    form: XFormBase;
-    entity: string;
-    field: string;
-    rowData: any;
-    readOnly?: boolean | undefined;
-}) => JSX.Element;
+import { XInputDT, XInputDTProps } from "./XInputDT";
+export interface XInputDecimalDTProps extends XInputDTProps {
+}
+export declare class XInputDecimalDT extends XInputDT<XInputDecimalDTProps> {
+    constructor(props: XInputDecimalDTProps);
+    getValue(): number | undefined;
+    onValueChange(e: any): void;
+    onBlur(e: any): void;
+    render(): JSX.Element;
+}

package/lib/components/XInputDecimalDT.js

@@ -1,4 +1,30 @@
 "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 __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
 var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
@@ -7,45 +33,42 @@ exports.XInputDecimalDT = void 0;
 var react_1 = __importDefault(require("react"));
 var inputnumber_1 = require("primereact/inputnumber");
 var XUtilsMetadata_1 = require("./XUtilsMetadata");
-var XUtilsCommon_1 = require("../serverApi/XUtilsCommon");
-exports.XInputDecimalDT = function (props) {
-    var xField = XUtilsMetadata_1.XUtilsMetadata.getXFieldByPathStr(props.entity, props.field);
-    var _a = XUtilsMetadata_1.XUtilsMetadata.getParamsForInputNumber(xField), useGrouping = _a.useGrouping, fractionDigits = _a.fractionDigits, min = _a.min, max = _a.max;
-    // ak mame path, field je vzdy readOnly
-    var readOnly;
-    var posDot = props.field.indexOf(".");
-    if (posDot !== -1) {
-        readOnly = true;
-    }
-    else {
-        readOnly = props.readOnly !== undefined ? props.readOnly : false;
+var XInputDT_1 = require("./XInputDT");
+var XUtils_1 = require("./XUtils");
+var XInputDecimalDT = /** @class */ (function (_super) {
+    __extends(XInputDecimalDT, _super);
+    function XInputDecimalDT(props) {
+        var _this = _super.call(this, props) || this;
+        _this.onValueChange = _this.onValueChange.bind(_this);
+        _this.onBlur = _this.onBlur.bind(_this);
+        return _this;
     }
-    var onValueChange = function (field, rowData, newValue) {
-        // z InputNumber prichadza e.value - typ number alebo null
-        // zmenime hodnotu v modeli (odtial sa hodnota cita)
-        rowData[field] = newValue;
-        // kedze "rowData" je sucastou "props.form.state.object", tak nam staci zavolat setState({object: object}), aby sa zmena prejavila
-        props.form.onObjectDataChange();
-    };
-    var fieldValue = undefined;
-    // test na undefined je tu koli insertu noveho riadku
-    if (props.rowData !== undefined && props.rowData !== null) {
-        var rowDataValue = XUtilsCommon_1.XUtilsCommon.getValueByPath(props.rowData, props.field);
-        //  pre istotu dame na null, null je standard
-        //if (rowDataValue === undefined) {
-        //    rowDataValue = null;
-        //}
-        // TODO - konvertovat null hodnotu na "" (vo funkcii stringAsUI) je dolezite aby sa prejavila zmena na null v modeli
-        // - otestovat ci zmena na null funguje dobre -
-        //fieldValue = stringAsUI(rowDataValue);
+    XInputDecimalDT.prototype.getValue = function () {
+        var value = undefined;
+        var rowDataValue = this.getValueFromRowData();
         // tuto zatial hack, mal by prist number
         if (typeof rowDataValue === 'string') {
-            fieldValue = parseFloat(rowDataValue);
+            value = parseFloat(rowDataValue);
         }
         else if (typeof rowDataValue === 'number') {
-            fieldValue = rowDataValue;
+            value = rowDataValue;
         }
-        // fieldValue zostalo undefined (konvertujeme null -> undefined) - InputNumber pozaduje undefined, nechce null
-    }
-    return (react_1.default.createElement(inputnumber_1.InputNumber, { id: props.field, value: fieldValue, onChange: function (e) { return onValueChange(props.field, props.rowData, e.value); }, disabled: readOnly, mode: "decimal", locale: "de-DE", useGrouping: useGrouping, minFractionDigits: fractionDigits, maxFractionDigits: fractionDigits, min: min, max: max, className: "x-input-to-resize" }));
-};
+        // value zostalo undefined ak nebol vykonany ziaden if (konvertujeme null -> undefined) - InputNumber pozaduje undefined, nechce null
+        return value;
+    };
+    XInputDecimalDT.prototype.onValueChange = function (e) {
+        // z InputNumber prichadza e.value - typ number alebo null
+        this.onValueChangeBase(e.value);
+    };
+    // nedame do onChange inputu, lebo by sa nas onChange volal po kazdej zmene pismenka
+    // ak bude treba, mozme este dorobit metodu "onChange2", ktora sa bude volat po kazdej zmene pismenka (asi iba do XInputText)
+    XInputDecimalDT.prototype.onBlur = function (e) {
+        this.callOnChangeFromOnBlur();
+    };
+    XInputDecimalDT.prototype.render = function () {
+        var _a = XUtilsMetadata_1.XUtilsMetadata.getParamsForInputNumber(this.xField), useGrouping = _a.useGrouping, fractionDigits = _a.fractionDigits, min = _a.min, max = _a.max;
+        return (react_1.default.createElement(inputnumber_1.InputNumber, __assign({ id: this.props.field, value: this.getValue(), onChange: this.onValueChange, readOnly: this.isReadOnly(), mode: "decimal", locale: "de-DE", useGrouping: useGrouping, minFractionDigits: fractionDigits, maxFractionDigits: fractionDigits, min: min, max: max, onBlur: this.onBlur }, XUtils_1.XUtils.addClassName(XUtils_1.XUtils.createErrorProps(this.getError()), "x-input-to-resize"))));
+    };
+    return XInputDecimalDT;
+}(XInputDT_1.XInputDT));
+exports.XInputDecimalDT = XInputDecimalDT;

package/lib/components/XInputText.d.ts

@@ -1,16 +1,12 @@
-import React from "react";
-import { XFormComponent, XFormComponentProps } from "./XFormComponent";
-import { XField } from "../serverApi/XEntityMetadata";
-export interface XInputTextProps extends XFormComponentProps {
-    field: string;
+/// <reference types="react" />
+import { XInput, XInputProps } from "./XInput";
+export interface XInputTextProps extends XInputProps<string> {
     size?: number;
-    inputStyle?: React.CSSProperties;
 }
-export declare class XInputText extends XFormComponent<XInputTextProps> {
-    protected xField: XField;
+export declare class XInputText extends XInput<string, XInputTextProps> {
     constructor(props: XInputTextProps);
-    getFieldForEdit(): string | undefined;
-    checkNotNull(): boolean;
-    getValueFromObject(): any;
+    getValue(): string;
+    onValueChange(e: any): void;
+    onBlur(e: any): void;
     render(): JSX.Element;
 }

package/lib/components/XInputText.js

@@ -3,10 +3,12 @@ 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 (b.hasOwnProperty(p)) d[p] = b[p]; };
+            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 __());
@@ -29,68 +31,39 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.XInputText = void 0;
 var react_1 = __importDefault(require("react"));
-var XUtilsMetadata_1 = require("./XUtilsMetadata");
-var XUtils_1 = require("./XUtils");
 var XUtilsConversions_1 = require("./XUtilsConversions");
-var XUtilsCommon_1 = require("../serverApi/XUtilsCommon");
 var inputtext_1 = require("primereact/inputtext");
-var XFormComponent_1 = require("./XFormComponent");
+var XInput_1 = require("./XInput");
 var XInputText = /** @class */ (function (_super) {
     __extends(XInputText, _super);
     function XInputText(props) {
         var _this = _super.call(this, props) || this;
-        _this.xField = XUtilsMetadata_1.XUtilsMetadata.getXFieldByPathStr(props.form.getEntity(), props.field);
-        props.form.addField(props.field);
+        _this.onValueChange = _this.onValueChange.bind(_this);
+        _this.onBlur = _this.onBlur.bind(_this);
         return _this;
     }
-    // TODO - prerobit - len field nech vracia
-    XInputText.prototype.getFieldForEdit = function () {
-        // TODO - zohladnit aj aktualny readOnly stav
-        if (!XUtils_1.XUtils.isReadOnly(this.props.field, this.props.readOnly)) {
-            return this.props.field;
-        }
-        return undefined;
+    XInputText.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 (0, XUtilsConversions_1.stringAsUI)(value);
     };
-    XInputText.prototype.checkNotNull = function () {
-        // TODO - zohladnit aj aktualny readOnly stav
-        return !this.xField.isNullable && !XUtils_1.XUtils.isReadOnly(this.props.field, this.props.readOnly);
+    XInputText.prototype.onValueChange = function (e) {
+        var value = (0, XUtilsConversions_1.stringFromUI)(e.target.value);
+        this.onValueChangeBase(value);
     };
-    XInputText.prototype.getValueFromObject = function () {
-        var objectValue = null;
-        var object = this.props.form.state.object;
-        if (object !== null) {
-            objectValue = XUtilsCommon_1.XUtilsCommon.getValueByPath(object, this.props.field);
-            //  pre istotu dame na null, null je standard
-            if (objectValue === undefined) {
-                objectValue = null;
-            }
-        }
-        return objectValue;
+    // nedame do onChange inputu, lebo by sa nas onChange volal po kazdej zmene pismenka
+    // ak bude treba, mozme este dorobit metodu "onChange2", ktora sa bude volat po kazdej zmene pismenka (asi iba do XInputText)
+    XInputText.prototype.onBlur = function (e) {
+        this.callOnChangeFromOnBlur();
     };
     XInputText.prototype.render = function () {
-        var _this = this;
-        var _a, _b, _c;
-        var props = this.props;
-        var xField = this.xField;
-        var label = (_a = props.label) !== null && _a !== void 0 ? _a : props.field;
-        if (this.checkNotNull()) {
-            label = XUtils_1.XUtils.markNotNull(label);
-        }
-        var readOnly = XUtils_1.XUtils.isReadOnly(props.field, props.readOnly);
-        var size = (_b = props.size) !== null && _b !== void 0 ? _b : xField.length;
-        var labelStyle = (_c = props.labelStyle) !== null && _c !== void 0 ? _c : { width: XUtils_1.XUtils.FIELD_LABEL_WIDTH };
-        var onValueChange = function (e) {
-            var value = XUtilsConversions_1.stringFromUI(e.target.value);
-            var error = _this.validateOnChange(value);
-            props.form.onFieldChange(props.field, value, error);
-        };
-        // konvertovat null hodnotu na "" (vo funkcii stringAsUI) je dolezite aby sa prejavila zmena na null v modeli
-        var fieldValue = XUtilsConversions_1.stringAsUI(this.getValueFromObject());
+        var _a;
+        var size = (_a = this.props.size) !== null && _a !== void 0 ? _a : this.xField.length;
         // 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: labelStyle }, label),
-            react_1.default.createElement(inputtext_1.InputText, __assign({ id: props.field, value: fieldValue, onChange: onValueChange, readOnly: readOnly, maxLength: xField.length, size: size, style: props.inputStyle }, this.getClassNameTooltip()))));
+            react_1.default.createElement("label", { htmlFor: this.props.field, className: "col-fixed", style: this.getLabelStyle() }, this.getLabel()),
+            react_1.default.createElement(inputtext_1.InputText, __assign({ id: this.props.field, value: this.getValue(), onChange: this.onValueChange, readOnly: this.isReadOnly(), maxLength: this.xField.length, size: size, style: this.props.inputStyle }, this.getClassNameTooltip(), { onBlur: this.onBlur }))));
     };
     return XInputText;
-}(XFormComponent_1.XFormComponent));
+}(XInput_1.XInput));
 exports.XInputText = XInputText;

package/lib/components/XInputTextDT.js

@@ -9,7 +9,7 @@ var inputtext_1 = require("primereact/inputtext");
 var XUtilsConversions_1 = require("./XUtilsConversions");
 var XUtilsMetadata_1 = require("./XUtilsMetadata");
 var XUtilsCommon_1 = require("../serverApi/XUtilsCommon");
-exports.XInputTextDT = function (props) {
+var XInputTextDT = function (props) {
     var xField = XUtilsMetadata_1.XUtilsMetadata.getXFieldByPathStr(props.entity, props.field);
     // ak mame path, field je vzdy readOnly
     var readOnly;
@@ -21,9 +21,8 @@ exports.XInputTextDT = function (props) {
         readOnly = props.readOnly !== undefined ? props.readOnly : false;
     }
     var onValueChange = function (field, rowData, newValue) {
-        //console.log("onBodyValueChange");
         // zmenime hodnotu v modeli (odtial sa hodnota cita)
-        rowData[field] = XUtilsConversions_1.stringFromUI(newValue);
+        rowData[field] = (0, XUtilsConversions_1.stringFromUI)(newValue);
         // kedze "rowData" je sucastou "props.form.state.object", tak nam staci zavolat setState({object: object}), aby sa zmena prejavila
         props.form.onObjectDataChange();
     };
@@ -36,7 +35,8 @@ exports.XInputTextDT = function (props) {
             rowDataValue = null;
         }
         // konvertovat null hodnotu na "" (vo funkcii stringAsUI) je dolezite aby sa prejavila zmena na null v modeli (a tiez aby korektne pridal novy riadok)
-        fieldValue = XUtilsConversions_1.stringAsUI(rowDataValue);
+        fieldValue = (0, XUtilsConversions_1.stringAsUI)(rowDataValue);
     }
     return (react_1.default.createElement(inputtext_1.InputText, { id: props.field, value: fieldValue, onChange: function (e) { return onValueChange(props.field, props.rowData, e.target.value); }, readOnly: readOnly, maxLength: xField.length, className: "x-input-to-resize" }));
 };
+exports.XInputTextDT = XInputTextDT;

package/lib/components/XInputTextarea.d.ts

@@ -0,0 +1,18 @@
+import React from "react";
+import { XInput, XInputProps } from "./XInput";
+export interface XInputTextareaProps extends XInputProps<string> {
+    rows: number;
+    cols?: number | "full";
+    labelOnTop?: boolean;
+}
+export declare class XInputTextarea extends XInput<string, XInputTextareaProps> {
+    static defaultProps: {
+        cols: string;
+        labelOnTop: boolean;
+    };
+    constructor(props: XInputTextareaProps);
+    getValue(): string;
+    onValueChange(e: any): void;
+    getLabelStyle(): React.CSSProperties;
+    render(): JSX.Element;
+}