@steroidsjs/core 2.3.0-beta.7 → 3.0.0-beta.1

package/ui/form/ImageField/ImageField.js

@@ -1,145 +1,145 @@
-"use strict";
-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 __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]; } });
-}) : (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    o[k2] = m[k];
-}));
-var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
-    Object.defineProperty(o, "default", { enumerable: true, value: v });
-}) : function(o, v) {
-    o["default"] = v;
-});
-var __importStar = (this && this.__importStar) || function (mod) {
-    if (mod && mod.__esModule) return mod;
-    var result = {};
-    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
-    __setModuleDefault(result, mod);
-    return result;
-};
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-exports.__esModule = true;
-var React = __importStar(require("react"));
-var File_1 = __importDefault(require("fileup-core/lib/models/File"));
-var first_1 = __importDefault(require("lodash-es/first"));
-var values_1 = __importDefault(require("lodash-es/values"));
-var react_1 = require("react");
-var uniqueId_1 = __importDefault(require("lodash-es/uniqueId"));
-var hooks_1 = require("../../../hooks");
-var useDispatch_1 = __importDefault(require("../../../hooks/useDispatch"));
-var useFile_1 = __importDefault(require("../../../hooks/useFile"));
-var fieldWrapper_1 = __importDefault(require("../Field/fieldWrapper"));
-var modal_1 = require("../../../actions/modal");
-function ImageField(props) {
-    var components = hooks_1.useComponents();
-    var dispatch = useDispatch_1["default"]();
-    // Add cropping option
-    var _a = react_1.useState(null), croppedImage = _a[0], setCroppedImage = _a[1];
-    var modalId = react_1.useMemo(function () { var _a; return ((_a = props.modalProps) === null || _a === void 0 ? void 0 : _a.modalId) || uniqueId_1["default"]('cropModal'); }, [props.modalProps.modalId]);
-    var ImageFieldModalVIew = props.modalView || components.ui.getView('form.ImageFieldModalView');
-    var responseParser = react_1.useCallback(function (text) {
-        var data = null;
-        try {
-            data = JSON.parse(text);
-            dispatch(modal_1.openModal(ImageFieldModalVIew, __assign(__assign({ modalId: modalId }, props.modalProps), { crop: __assign(__assign({}, props.crop), { onSubmit: function (crop, imageId) { return setCroppedImage(__assign(__assign({}, crop), { id: imageId })); } }), image: first_1["default"](data) || data })));
-            // eslint-disable-next-line no-empty
-        }
-        catch (e) { }
-        return data;
-    }, [ImageFieldModalVIew, modalId, dispatch, props.crop, props.modalProps]);
-    var _b = useFile_1["default"](__assign(__assign({}, props), { multiple: false, imagesOnly: true, uploader: __assign({ uploaderConfigs: {
-                xhr: {
-                    responseParser: props.crop ? responseParser : null
-                }
-            } }, props.uploader) })), files = _b.files, onBrowse = _b.onBrowse, onRemove = _b.onRemove, onAdd = _b.onAdd;
-    // Fetch cropped image
-    react_1.useEffect(function () {
-        if (croppedImage) {
-            components.http.post(props.crop.backendUrl, croppedImage).then(function (res) {
-                setCroppedImage(null);
-                onAdd(new File_1["default"]({
-                    path: res.title || res.label || res.uid || res.id,
-                    status: File_1["default"].STATUS_END,
-                    result: File_1["default"].RESULT_SUCCESS,
-                    resultHttpStatus: 200,
-                    resultHttpMessage: res,
-                    uid: res.uid
-                }));
-            });
-        }
-    }, [components.http, croppedImage, onAdd, onRemove, props.crop.backendUrl]);
-    var ImageFieldView = props.view || components.ui.getView('form.ImageFieldView');
-    var item = react_1.useMemo(function () {
-        var result = null;
-        var _file = first_1["default"](files);
-        if (_file) {
-            var data = _file.getResultHttpMessage() || {};
-            result = {
-                uid: _file.getUid(),
-                fileId: data.id || null,
-                title: _file.getName(),
-                size: props.size,
-                disabled: props.disabled,
-                onRemove: function () { return onRemove(_file); },
-                error: null,
-                image: null,
-                progress: null
-            };
-            // Add error
-            if (_file.getResult() === File_1["default"].RESULT_ERROR) {
-                if (typeof _file.getResultHttpMessage() === 'string'
-                    && _file.getResultHttpMessage().substr(0, 1) === '{') {
-                    var errorResponse = JSON.parse(_file.getResultHttpMessage());
-                    result.error = errorResponse.error || errorResponse.message || __('Ошибка');
-                }
-                else {
-                    result.error = _file.getResultHttpMessage()
-                        ? JSON.stringify(_file.getResultHttpMessage())
-                        : __('Ошибка');
-                }
-            }
-            // Add thumbnail image
-            if (data.images) {
-                // Image object has properties: url, width, height
-                result.image = data.images[props.imagesProcessor]
-                    || first_1["default"](values_1["default"](data.images));
-            }
-            // Add progress
-            if (_file.getStatus() === File_1["default"].STATUS_PROCESS) {
-                result.progress = {
-                    bytesUploaded: _file.getBytesUploaded(),
-                    percent: _file.progress.getPercent()
-                };
-            }
-        }
-        return result;
-    }, [files, onRemove, props.disabled, props.imagesProcessor, props.size]);
-    return (React.createElement(ImageFieldView, __assign({}, props, { item: item, onClick: onBrowse })));
-}
-ImageField.defaultProps = {
-    disabled: false,
-    required: false,
-    className: '',
-    modalProps: {},
-    label: 'Upload',
-    crop: {
-        initialValues: {
-            aspect: 1
-        }
-    }
-};
-exports["default"] = fieldWrapper_1["default"]('ImageField', ImageField);
+"use strict";
+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 __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]; } });
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+exports.__esModule = true;
+var React = __importStar(require("react"));
+var File_1 = __importDefault(require("fileup-core/lib/models/File"));
+var first_1 = __importDefault(require("lodash-es/first"));
+var values_1 = __importDefault(require("lodash-es/values"));
+var react_1 = require("react");
+var uniqueId_1 = __importDefault(require("lodash-es/uniqueId"));
+var hooks_1 = require("../../../hooks");
+var useDispatch_1 = __importDefault(require("../../../hooks/useDispatch"));
+var useFile_1 = __importDefault(require("../../../hooks/useFile"));
+var fieldWrapper_1 = __importDefault(require("../Field/fieldWrapper"));
+var modal_1 = require("../../../actions/modal");
+function ImageField(props) {
+    var components = hooks_1.useComponents();
+    var dispatch = useDispatch_1["default"]();
+    // Add cropping option
+    var _a = react_1.useState(null), croppedImage = _a[0], setCroppedImage = _a[1];
+    var modalId = react_1.useMemo(function () { var _a; return ((_a = props.modalProps) === null || _a === void 0 ? void 0 : _a.modalId) || uniqueId_1["default"]('cropModal'); }, [props.modalProps.modalId]);
+    var ImageFieldModalVIew = props.modalView || components.ui.getView('form.ImageFieldModalView');
+    var responseParser = react_1.useCallback(function (text) {
+        var data = null;
+        try {
+            data = JSON.parse(text);
+            dispatch(modal_1.openModal(ImageFieldModalVIew, __assign(__assign({ modalId: modalId }, props.modalProps), { crop: __assign(__assign({}, props.crop), { onSubmit: function (crop, imageId) { return setCroppedImage(__assign(__assign({}, crop), { id: imageId })); } }), image: first_1["default"](data) || data })));
+            // eslint-disable-next-line no-empty
+        }
+        catch (e) { }
+        return data;
+    }, [ImageFieldModalVIew, modalId, dispatch, props.crop, props.modalProps]);
+    var _b = useFile_1["default"](__assign(__assign({}, props), { multiple: false, imagesOnly: true, uploader: __assign({ uploaderConfigs: {
+                xhr: {
+                    responseParser: props.crop ? responseParser : null
+                }
+            } }, props.uploader) })), files = _b.files, onBrowse = _b.onBrowse, onRemove = _b.onRemove, onAdd = _b.onAdd;
+    // Fetch cropped image
+    react_1.useEffect(function () {
+        if (croppedImage) {
+            components.http.post(props.crop.backendUrl, croppedImage).then(function (res) {
+                setCroppedImage(null);
+                onAdd(new File_1["default"]({
+                    path: res.title || res.label || res.uid || res.id,
+                    status: File_1["default"].STATUS_END,
+                    result: File_1["default"].RESULT_SUCCESS,
+                    resultHttpStatus: 200,
+                    resultHttpMessage: res,
+                    uid: res.uid
+                }));
+            });
+        }
+    }, [components.http, croppedImage, onAdd, onRemove, props.crop.backendUrl]);
+    var ImageFieldView = props.view || components.ui.getView('form.ImageFieldView');
+    var item = react_1.useMemo(function () {
+        var result = null;
+        var _file = first_1["default"](files);
+        if (_file) {
+            var data = _file.getResultHttpMessage() || {};
+            result = {
+                uid: _file.getUid(),
+                fileId: data.id || null,
+                title: _file.getName(),
+                size: props.size,
+                disabled: props.disabled,
+                onRemove: function () { return onRemove(_file); },
+                error: null,
+                image: null,
+                progress: null
+            };
+            // Add error
+            if (_file.getResult() === File_1["default"].RESULT_ERROR) {
+                if (typeof _file.getResultHttpMessage() === 'string'
+                    && _file.getResultHttpMessage().substr(0, 1) === '{') {
+                    var errorResponse = JSON.parse(_file.getResultHttpMessage());
+                    result.error = errorResponse.error || errorResponse.message || __('Ошибка');
+                }
+                else {
+                    result.error = _file.getResultHttpMessage()
+                        ? JSON.stringify(_file.getResultHttpMessage())
+                        : __('Ошибка');
+                }
+            }
+            // Add thumbnail image
+            if (data.images) {
+                // Image object has properties: url, width, height
+                result.image = data.images[props.imagesProcessor]
+                    || first_1["default"](values_1["default"](data.images));
+            }
+            // Add progress
+            if (_file.getStatus() === File_1["default"].STATUS_PROCESS) {
+                result.progress = {
+                    bytesUploaded: _file.getBytesUploaded(),
+                    percent: _file.progress.getPercent()
+                };
+            }
+        }
+        return result;
+    }, [files, onRemove, props.disabled, props.imagesProcessor, props.size]);
+    return (React.createElement(ImageFieldView, __assign({}, props, { item: item, onClick: onBrowse })));
+}
+ImageField.defaultProps = {
+    disabled: false,
+    required: false,
+    className: '',
+    modalProps: {},
+    label: 'Upload',
+    crop: {
+        initialValues: {
+            aspect: 1
+        }
+    }
+};
+exports["default"] = fieldWrapper_1["default"]('ImageField', ImageField);

package/ui/form/ImageField/index.d.ts

@@ -1,2 +1,2 @@
-import ImageField from './ImageField';
-export default ImageField;
+import ImageField from './ImageField';
+export default ImageField;

package/ui/form/ImageField/index.js

@@ -1,7 +1,7 @@
-"use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-exports.__esModule = true;
-var ImageField_1 = __importDefault(require("./ImageField"));
-exports["default"] = ImageField_1["default"];
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+exports.__esModule = true;
+var ImageField_1 = __importDefault(require("./ImageField"));
+exports["default"] = ImageField_1["default"];

package/ui/form/InputField/InputField.d.ts

@@ -1,99 +1,99 @@
-import * as React from 'react';
-import { ChangeEventHandler, ReactNode } from 'react';
-import { IFieldWrapperInputProps, IFieldWrapperOutputProps } from '../Field/fieldWrapper';
-declare type IElementInputType = 'button' | 'checkbox' | 'color' | 'date' | 'datetime-local' | 'email' | 'file' | 'hidden' | 'image' | 'month' | 'number' | 'password' | 'radio' | 'range' | 'reset' | 'search' | 'submit' | 'tel' | 'text' | 'time' | 'url' | 'week' | string;
-/**
- * InputField
- * Поле ввода текста
- */
-export interface IInputFieldProps extends IFieldWrapperInputProps {
-    /**
-     * HTML Тип
-     * @example email
-     */
-    type?: IElementInputType;
-    /**
-     * Placeholder подсказка
-     * @example Your text...
-     */
-    placeholder?: string;
-    /**
-     * Свойства для элемента \<input /\>
-     * @example {onKeyDown: ...}
-     */
-    inputProps?: any;
-    /**
-     * Дополнительный CSS-класс для элемента отображения
-     */
-    className?: CssClassName;
-    /**
-     * Переопределение view React компонента для кастомизации отображения
-     * @example MyCustomView
-     */
-    view?: any;
-    /**
-     */
-    viewProps?: any;
-    /**
-     * Размер Innput
-     * @example 'large'
-     */
-    size?: Size;
-    /**
-     * Объект CSS стилей
-     * @example {width: '45%'}
-     */
-    style?: any;
-    /**
-     * Изображение или React-нода, которая будет отрендерена слева от поля.
-     * @example require('icon.png') | <component/>
-     */
-    textBefore?: number | ReactNode | string;
-    /**
-     * Изображение или React-нода, которая будет отрендерена справа от поля.
-     * @example require('icon.png') | <component/>
-     */
-    textAfter?: number | ReactNode | string;
-    /**
-     * Текст или React-нода, которая будет отрендерена слева от поля.
-     * @example 'http://'
-     */
-    addonBefore?: ReactNode | string;
-    /**
-     * Текст или React-нода, которая будет отрендерена справа от поля.
-     * @example '.com'
-     */
-    addonAfter?: ReactNode | string;
-    /**
-     * Конфигурация маски
-     * @example { mask: '+7 (999) 999-99-99' }
-     */
-    maskProps?: any;
-    success?: boolean;
-    failed?: boolean;
-    [key: string]: any;
-}
-export interface IInputFieldViewProps extends IInputFieldProps, IFieldWrapperOutputProps {
-    style?: any;
-    errors?: string[];
-    placeholder?: string;
-    type?: string;
-    inputProps: {
-        type: string;
-        name: string;
-        onChange: ChangeEventHandler<Element>;
-        value: string | number;
-        placeholder: string;
-        disabled: string;
-    };
-    textBefore?: number | ReactNode | string;
-    textAfter?: number | ReactNode | string;
-    addonBefore?: ReactNode | string;
-    addonAfter?: ReactNode | string;
-    maskProps?: any;
-    onFocus?: (e: Event | React.FocusEvent) => void;
-    onBlur?: (e: Event | React.FocusEvent) => void;
-    onMouseDown?: (e: Event | React.MouseEvent) => void;
-}
-declare const _default: import("../Field/fieldWrapper").FieldWrapperComponent<IInputFieldProps>;
-export default _default;
+import * as React from 'react';
+import { ChangeEventHandler, ReactNode } from 'react';
+import { IFieldWrapperInputProps, IFieldWrapperOutputProps } from '../Field/fieldWrapper';
+declare type IElementInputType = 'button' | 'checkbox' | 'color' | 'date' | 'datetime-local' | 'email' | 'file' | 'hidden' | 'image' | 'month' | 'number' | 'password' | 'radio' | 'range' | 'reset' | 'search' | 'submit' | 'tel' | 'text' | 'time' | 'url' | 'week' | string;
+/**
+ * InputField
+ * Поле ввода текста
+ */
+export interface IInputFieldProps extends IFieldWrapperInputProps {
+    /**
+     * HTML Тип
+     * @example email
+     */
+    type?: IElementInputType;
+    /**
+     * Placeholder подсказка
+     * @example Your text...
+     */
+    placeholder?: string;
+    /**
+     * Свойства для элемента \<input /\>
+     * @example {onKeyDown: ...}
+     */
+    inputProps?: any;
+    /**
+     * Дополнительный CSS-класс для элемента отображения
+     */
+    className?: CssClassName;
+    /**
+     * Переопределение view React компонента для кастомизации отображения
+     * @example MyCustomView
+     */
+    view?: any;
+    /**
+     */
+    viewProps?: any;
+    /**
+     * Размер Innput
+     * @example 'large'
+     */
+    size?: Size;
+    /**
+     * Объект CSS стилей
+     * @example {width: '45%'}
+     */
+    style?: any;
+    /**
+     * Изображение или React-нода, которая будет отрендерена слева от поля.
+     * @example require('icon.png') | <component/>
+     */
+    textBefore?: number | ReactNode | string;
+    /**
+     * Изображение или React-нода, которая будет отрендерена справа от поля.
+     * @example require('icon.png') | <component/>
+     */
+    textAfter?: number | ReactNode | string;
+    /**
+     * Текст или React-нода, которая будет отрендерена слева от поля.
+     * @example 'http://'
+     */
+    addonBefore?: ReactNode | string;
+    /**
+     * Текст или React-нода, которая будет отрендерена справа от поля.
+     * @example '.com'
+     */
+    addonAfter?: ReactNode | string;
+    /**
+     * Конфигурация маски
+     * @example { mask: '+7 (999) 999-99-99' }
+     */
+    maskProps?: any;
+    success?: boolean;
+    failed?: boolean;
+    [key: string]: any;
+}
+export interface IInputFieldViewProps extends IInputFieldProps, IFieldWrapperOutputProps {
+    style?: any;
+    errors?: string[];
+    placeholder?: string;
+    type?: string;
+    inputProps: {
+        type: string;
+        name: string;
+        onChange: ChangeEventHandler<Element>;
+        value: string | number;
+        placeholder: string;
+        disabled: string;
+    };
+    textBefore?: number | ReactNode | string;
+    textAfter?: number | ReactNode | string;
+    addonBefore?: ReactNode | string;
+    addonAfter?: ReactNode | string;
+    maskProps?: any;
+    onFocus?: (e: Event | React.FocusEvent) => void;
+    onBlur?: (e: Event | React.FocusEvent) => void;
+    onMouseDown?: (e: Event | React.MouseEvent) => void;
+}
+declare const _default: import("../Field/fieldWrapper").FieldWrapperComponent<IInputFieldProps>;
+export default _default;

package/ui/form/InputField/InputField.js

@@ -1,71 +1,71 @@
-"use strict";
-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 __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]; } });
-}) : (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    o[k2] = m[k];
-}));
-var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
-    Object.defineProperty(o, "default", { enumerable: true, value: v });
-}) : function(o, v) {
-    o["default"] = v;
-});
-var __importStar = (this && this.__importStar) || function (mod) {
-    if (mod && mod.__esModule) return mod;
-    var result = {};
-    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
-    __setModuleDefault(result, mod);
-    return result;
-};
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-exports.__esModule = true;
-var React = __importStar(require("react"));
-var react_input_mask_1 = __importDefault(require("react-input-mask"));
-var react_1 = require("react");
-var fieldWrapper_1 = __importDefault(require("../Field/fieldWrapper"));
-var hooks_1 = require("../../../hooks");
-function InputField(props) {
-    var components = hooks_1.useComponents();
-    var inputProps = react_1.useMemo(function () {
-        var _a;
-        return (__assign({ type: props.type, name: props.input.name, value: (_a = props.input.value) !== null && _a !== void 0 ? _a : '', onChange: function (value) { return props.input.onChange(value); }, placeholder: props.placeholder, disabled: props.disabled }, props.inputProps));
-    }, [props.disabled, props.input, props.inputProps, props.placeholder, props.type]);
-    // No render for hidden input
-    if (props.type === 'hidden') {
-        return null;
-    }
-    // react-input-mask HOC for mask
-    if (props.maskProps) {
-        var maskOnChange = function (e) { return props.input.onChange(e.target.value); };
-        return (React.createElement(react_input_mask_1["default"], __assign({}, inputProps, props.maskProps, { onChange: maskOnChange }), components.ui.renderView(props.view || 'form.InputFieldView', __assign(__assign(__assign({}, props), props.viewProps), { inputProps: inputProps, onChange: maskOnChange }))));
-    }
-    return components.ui.renderView(props.view || 'form.InputFieldView', __assign(__assign(__assign({}, props), props.viewProps), { inputProps: inputProps }));
-}
-InputField.defaultProps = {
-    type: 'text',
-    size: 'medium',
-    disabled: false,
-    required: false,
-    className: '',
-    placeholder: '',
-    errors: null,
-    textBefore: null,
-    textAfter: null,
-    addonBefore: null,
-    addonAfter: null
-};
-exports["default"] = fieldWrapper_1["default"]('InputField', InputField);
+"use strict";
+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 __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]; } });
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+exports.__esModule = true;
+var React = __importStar(require("react"));
+var react_input_mask_1 = __importDefault(require("react-input-mask"));
+var react_1 = require("react");
+var fieldWrapper_1 = __importDefault(require("../Field/fieldWrapper"));
+var hooks_1 = require("../../../hooks");
+function InputField(props) {
+    var components = hooks_1.useComponents();
+    var inputProps = react_1.useMemo(function () {
+        var _a;
+        return (__assign({ type: props.type, name: props.input.name, value: (_a = props.input.value) !== null && _a !== void 0 ? _a : '', onChange: function (value) { return props.input.onChange(value); }, placeholder: props.placeholder, disabled: props.disabled }, props.inputProps));
+    }, [props.disabled, props.input, props.inputProps, props.placeholder, props.type]);
+    // No render for hidden input
+    if (props.type === 'hidden') {
+        return null;
+    }
+    // react-input-mask HOC for mask
+    if (props.maskProps) {
+        var maskOnChange = function (e) { return props.input.onChange(e.target.value); };
+        return (React.createElement(react_input_mask_1["default"], __assign({}, inputProps, props.maskProps, { onChange: maskOnChange }), components.ui.renderView(props.view || 'form.InputFieldView', __assign(__assign(__assign({}, props), props.viewProps), { inputProps: inputProps, onChange: maskOnChange }))));
+    }
+    return components.ui.renderView(props.view || 'form.InputFieldView', __assign(__assign(__assign({}, props), props.viewProps), { inputProps: inputProps }));
+}
+InputField.defaultProps = {
+    type: 'text',
+    size: 'medium',
+    disabled: false,
+    required: false,
+    className: '',
+    placeholder: '',
+    errors: null,
+    textBefore: null,
+    textAfter: null,
+    addonBefore: null,
+    addonAfter: null
+};
+exports["default"] = fieldWrapper_1["default"]('InputField', InputField);