indicator-ui 0.0.106 → 0.0.108

package/dist/index.js

@@ -3134,6 +3134,22 @@ __webpack_require__.r(__webpack_exports__);
 
 /***/ }),
 
+/***/ "./src/ui/InputFields/DateTimeField/styles/DateTimeField.module.scss":
+/*!***************************************************************************!*\
+  !*** ./src/ui/InputFields/DateTimeField/styles/DateTimeField.module.scss ***!
+  \***************************************************************************/
+/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
+
+"use strict";
+__webpack_require__.r(__webpack_exports__);
+/* harmony export */ __webpack_require__.d(__webpack_exports__, {
+/* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
+/* harmony export */ });
+// extracted by mini-css-extract-plugin
+/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = ({"DateTimeField":"DateTimeField-module__DateTimeField___k_mN4","item":"DateTimeField-module__item___SY6gn"});
+
+/***/ }),
+
 /***/ "./src/ui/InputFields/FlexField/styles/FlexField.module.scss":
 /*!*******************************************************************!*\
   !*** ./src/ui/InputFields/FlexField/styles/FlexField.module.scss ***!
@@ -3226,7 +3242,7 @@ __webpack_require__.r(__webpack_exports__);
 /* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
 /* harmony export */ });
 // extracted by mini-css-extract-plugin
-/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = ({"textareaField":"TextareaField-module__textareaField___Vcg4L","offFocus":"TextareaField-module__offFocus___HcAxy","isError":"TextareaField-module__isError___VGTeU"});
+/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = ({"textareaField":"TextareaField-module__textareaField___Vcg4L","isError":"TextareaField-module__isError___VGTeU"});
 
 /***/ }),
 
@@ -6291,8 +6307,25 @@ __webpack_require__.r(__webpack_exports__);
 function useFormData(value) {
     const [formData, setFormData] = (0,react__WEBPACK_IMPORTED_MODULE_0__.useState)(value || {});
     const formDataRef = (0,react__WEBPACK_IMPORTED_MODULE_0__.useRef)(value || {});
+    const _setFormData = (newFormData) => {
+        formDataRef.current = newFormData;
+        setFormData(newFormData);
+    };
+    const _setFormDataExternal = (value) => {
+        if (typeof value === "function") {
+            const prevState = formDataRef.current;
+            value = value(prevState);
+        }
+        _setFormData(value);
+    };
+    const resetForm = () => {
+        _setFormData(value || {});
+    };
+    const clearForm = () => {
+        _setFormData({});
+    };
     const setValue = (value, keyWay, options = { unionToArray: false }) => {
-        const proccessFun = (prevState) => {
+        const processFun = (prevState) => {
             let newValue = value;
             if (options.unionToArray) {
                 const curValue = (0,_lib__WEBPACK_IMPORTED_MODULE_1__.getDeepValue)(prevState, keyWay);
@@ -6317,24 +6350,14 @@ function useFormData(value) {
                     }
                 }
             }
-            const newState = { ...(0,_lib__WEBPACK_IMPORTED_MODULE_1__.setDeepValue)(prevState, newValue, { keysWay: keyWay }) };
-            formDataRef.current = newState;
-            return newState;
+            return { ...(0,_lib__WEBPACK_IMPORTED_MODULE_1__.setDeepValue)(prevState, newValue, { keysWay: keyWay }) };
         };
-        formDataRef.current = proccessFun(formDataRef.current);
-        setFormData(proccessFun);
+        const newFormData = processFun(formDataRef.current);
+        _setFormData(newFormData);
     };
     const getValue = (keyWay) => {
         return (0,_lib__WEBPACK_IMPORTED_MODULE_1__.getDeepValue)(formDataRef.current, keyWay);
     };
-    const resetForm = () => {
-        setFormData(value || {});
-        formDataRef.current = value || {};
-    };
-    const clearForm = () => {
-        setFormData({});
-        formDataRef.current = {};
-    };
     const deleteArrayItem = (keyWay) => {
         const lastKeyWay = keyWay.length > 0 && keyWay[keyWay.length - 1] || undefined;
         if (lastKeyWay && typeof lastKeyWay === 'object') {
@@ -6345,7 +6368,7 @@ function useFormData(value) {
     };
     return {
         formData: formData,
-        setFormData: setFormData,
+        setFormData: _setFormDataExternal,
         setValue: setValue,
         getValue: getValue,
         resetForm: resetForm,
@@ -6706,12 +6729,16 @@ __webpack_require__.r(__webpack_exports__);
 /* harmony export */   isCustomComponent: () => (/* reexport safe */ _reactComponents__WEBPACK_IMPORTED_MODULE_2__.isCustomComponent),
 /* harmony export */   isDict: () => (/* reexport safe */ _dict__WEBPACK_IMPORTED_MODULE_0__.isDict),
 /* harmony export */   isEqualArrays: () => (/* reexport safe */ _array__WEBPACK_IMPORTED_MODULE_1__.isEqualArrays),
+/* harmony export */   saveFormatDate: () => (/* reexport safe */ _time__WEBPACK_IMPORTED_MODULE_3__.saveFormatDate),
+/* harmony export */   saveParseDate: () => (/* reexport safe */ _time__WEBPACK_IMPORTED_MODULE_3__.saveParseDate),
 /* harmony export */   setDeepValue: () => (/* reexport safe */ _dict__WEBPACK_IMPORTED_MODULE_0__.setDeepValue),
 /* harmony export */   traverseTreeByStack: () => (/* reexport safe */ _array__WEBPACK_IMPORTED_MODULE_1__.traverseTreeByStack)
 /* harmony export */ });
 /* harmony import */ var _dict__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./dict */ "./src/lib/dict/index.ts");
 /* harmony import */ var _array__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./array */ "./src/lib/array/index.ts");
 /* harmony import */ var _reactComponents__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./reactComponents */ "./src/lib/reactComponents/index.ts");
+/* harmony import */ var _time__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./time */ "./src/lib/time/index.ts");
+
 
 
 
@@ -6779,6 +6806,82 @@ function isCustomComponent(element) {
 }
 
 
+/***/ }),
+
+/***/ "./src/lib/time/index.ts":
+/*!*******************************!*\
+  !*** ./src/lib/time/index.ts ***!
+  \*******************************/
+/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
+
+"use strict";
+__webpack_require__.r(__webpack_exports__);
+/* harmony export */ __webpack_require__.d(__webpack_exports__, {
+/* harmony export */   saveFormatDate: () => (/* reexport safe */ _saveFormatDate__WEBPACK_IMPORTED_MODULE_0__.saveFormatDate),
+/* harmony export */   saveParseDate: () => (/* reexport safe */ _saveParseDate__WEBPACK_IMPORTED_MODULE_1__.saveParseDate)
+/* harmony export */ });
+/* harmony import */ var _saveFormatDate__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./saveFormatDate */ "./src/lib/time/saveFormatDate.ts");
+/* harmony import */ var _saveParseDate__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./saveParseDate */ "./src/lib/time/saveParseDate.ts");
+
+
+
+
+/***/ }),
+
+/***/ "./src/lib/time/saveFormatDate.ts":
+/*!****************************************!*\
+  !*** ./src/lib/time/saveFormatDate.ts ***!
+  \****************************************/
+/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
+
+"use strict";
+__webpack_require__.r(__webpack_exports__);
+/* harmony export */ __webpack_require__.d(__webpack_exports__, {
+/* harmony export */   saveFormatDate: () => (/* binding */ saveFormatDate)
+/* harmony export */ });
+/* harmony import */ var date_fns__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! date-fns */ "./node_modules/date-fns/format.js");
+/* harmony import */ var date_fns__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! date-fns */ "./node_modules/date-fns/parse.js");
+
+function saveFormatDate(date, { from, to, errorNull = false, locale }) {
+    try {
+        if (from != null && typeof date === 'string') {
+            return (0,date_fns__WEBPACK_IMPORTED_MODULE_0__.format)((0,date_fns__WEBPACK_IMPORTED_MODULE_1__.parse)(date, from, new Date()), to, { locale: locale });
+        }
+        return (0,date_fns__WEBPACK_IMPORTED_MODULE_0__.format)(date, to);
+    }
+    catch (e) {
+        console.warn(e);
+    }
+    return errorNull ? null : date;
+}
+
+
+/***/ }),
+
+/***/ "./src/lib/time/saveParseDate.ts":
+/*!***************************************!*\
+  !*** ./src/lib/time/saveParseDate.ts ***!
+  \***************************************/
+/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
+
+"use strict";
+__webpack_require__.r(__webpack_exports__);
+/* harmony export */ __webpack_require__.d(__webpack_exports__, {
+/* harmony export */   saveParseDate: () => (/* binding */ saveParseDate)
+/* harmony export */ });
+/* harmony import */ var date_fns__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! date-fns */ "./node_modules/date-fns/parse.js");
+
+function saveParseDate(date, { from }) {
+    try {
+        return (0,date_fns__WEBPACK_IMPORTED_MODULE_0__.parse)(date, from, new Date());
+    }
+    catch (e) {
+        console.warn(e);
+    }
+    return null;
+}
+
+
 /***/ }),
 
 /***/ "./src/types/DictDeepActionsTypes.ts":
@@ -7055,7 +7158,7 @@ function Button({ children, text, iconLeft, iconRight, hierarchy = 'primary', wa
             className: getClassName()
         });
     }
-    return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("button", { ...props, className: getClassName(), children: getMainContent() }));
+    return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("button", { ...props, disabled: disabled, className: getClassName(), children: getMainContent() }));
 }
 
 
@@ -8807,6 +8910,387 @@ __webpack_require__.r(__webpack_exports__);
 
 
 
+/***/ }),
+
+/***/ "./src/ui/InputFields/DateTimeField/index.ts":
+/*!***************************************************!*\
+  !*** ./src/ui/InputFields/DateTimeField/index.ts ***!
+  \***************************************************/
+/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
+
+"use strict";
+__webpack_require__.r(__webpack_exports__);
+/* harmony export */ __webpack_require__.d(__webpack_exports__, {
+/* harmony export */   DateTimeField: () => (/* reexport safe */ _ui__WEBPACK_IMPORTED_MODULE_0__.DateTimeField)
+/* harmony export */ });
+/* harmony import */ var _ui__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./ui */ "./src/ui/InputFields/DateTimeField/ui/index.ts");
+/* harmony import */ var _types__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./types */ "./src/ui/InputFields/DateTimeField/types/index.ts");
+
+
+
+
+/***/ }),
+
+/***/ "./src/ui/InputFields/DateTimeField/styles/index.ts":
+/*!**********************************************************!*\
+  !*** ./src/ui/InputFields/DateTimeField/styles/index.ts ***!
+  \**********************************************************/
+/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
+
+"use strict";
+__webpack_require__.r(__webpack_exports__);
+/* harmony export */ __webpack_require__.d(__webpack_exports__, {
+/* harmony export */   DateTimeFieldStyle: () => (/* reexport safe */ _DateTimeField_module_scss__WEBPACK_IMPORTED_MODULE_0__["default"])
+/* harmony export */ });
+/* harmony import */ var _DateTimeField_module_scss__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./DateTimeField.module.scss */ "./src/ui/InputFields/DateTimeField/styles/DateTimeField.module.scss");
+
+
+
+/***/ }),
+
+/***/ "./src/ui/InputFields/DateTimeField/types/DateFieldTypes.ts":
+/*!******************************************************************!*\
+  !*** ./src/ui/InputFields/DateTimeField/types/DateFieldTypes.ts ***!
+  \******************************************************************/
+/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
+
+"use strict";
+__webpack_require__.r(__webpack_exports__);
+
+
+
+/***/ }),
+
+/***/ "./src/ui/InputFields/DateTimeField/types/DateTimeFieldTypes.ts":
+/*!**********************************************************************!*\
+  !*** ./src/ui/InputFields/DateTimeField/types/DateTimeFieldTypes.ts ***!
+  \**********************************************************************/
+/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
+
+"use strict";
+__webpack_require__.r(__webpack_exports__);
+
+
+
+/***/ }),
+
+/***/ "./src/ui/InputFields/DateTimeField/types/TimeFieldTypes.ts":
+/*!******************************************************************!*\
+  !*** ./src/ui/InputFields/DateTimeField/types/TimeFieldTypes.ts ***!
+  \******************************************************************/
+/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
+
+"use strict";
+__webpack_require__.r(__webpack_exports__);
+
+
+
+/***/ }),
+
+/***/ "./src/ui/InputFields/DateTimeField/types/index.ts":
+/*!*********************************************************!*\
+  !*** ./src/ui/InputFields/DateTimeField/types/index.ts ***!
+  \*********************************************************/
+/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
+
+"use strict";
+__webpack_require__.r(__webpack_exports__);
+/* harmony import */ var _DateTimeFieldTypes__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./DateTimeFieldTypes */ "./src/ui/InputFields/DateTimeField/types/DateTimeFieldTypes.ts");
+/* harmony import */ var _DateFieldTypes__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./DateFieldTypes */ "./src/ui/InputFields/DateTimeField/types/DateFieldTypes.ts");
+/* harmony import */ var _TimeFieldTypes__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./TimeFieldTypes */ "./src/ui/InputFields/DateTimeField/types/TimeFieldTypes.ts");
+
+
+
+
+
+/***/ }),
+
+/***/ "./src/ui/InputFields/DateTimeField/ui/DateField.tsx":
+/*!***********************************************************!*\
+  !*** ./src/ui/InputFields/DateTimeField/ui/DateField.tsx ***!
+  \***********************************************************/
+/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
+
+"use strict";
+__webpack_require__.r(__webpack_exports__);
+/* harmony export */ __webpack_require__.d(__webpack_exports__, {
+/* harmony export */   DateField: () => (/* binding */ DateField)
+/* harmony export */ });
+/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react/jsx-runtime */ "./node_modules/react/jsx-runtime.js");
+/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! react */ "react");
+/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_1__);
+/* harmony import */ var react_imask__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! react-imask */ "./node_modules/react-imask/esm/index.js");
+/* harmony import */ var _lib__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! @/lib */ "./src/lib/index.ts");
+/* harmony import */ var _FlexField__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../../FlexField */ "./src/ui/InputFields/FlexField/index.ts");
+
+
+
+
+
+function DateField({ value, disabled, required, isError, onChange, onFocus, dateFormat = 'dd.MM.yyyy', onBlur, minYear = 1000, maxYear = 9999, additionStyles, }) {
+    const [dateValue, setDateValue] = (0,react__WEBPACK_IMPORTED_MODULE_1__.useState)(value);
+    (0,react__WEBPACK_IMPORTED_MODULE_1__.useEffect)(() => {
+        if (value !== dateValue)
+            setDateValue(value);
+    }, [value]);
+    const handleChange = (newDate) => {
+        setDateValue(newDate);
+        const formatDate = (0,_lib__WEBPACK_IMPORTED_MODULE_3__.saveFormatDate)(newDate, { from: dateFormat, to: dateFormat, errorNull: true });
+        if (formatDate !== null && onChange) {
+            onChange(formatDate);
+        }
+    };
+    return (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_FlexField__WEBPACK_IMPORTED_MODULE_4__.FlexField, { value: dateValue, onChange: handleChange, disabled: disabled, isError: isError, onFocus: onFocus, onBlur: onBlur, mask: dateFormat, blocks: {
+            yyyy: {
+                mask: react_imask__WEBPACK_IMPORTED_MODULE_2__.IMask.MaskedRange,
+                from: minYear, // минимальный год
+                to: maxYear, // максимальный год
+            },
+            MM: {
+                mask: react_imask__WEBPACK_IMPORTED_MODULE_2__.IMask.MaskedRange,
+                from: 1, // минимальный месяц
+                to: 12, // максимальный месяц
+            },
+            dd: {
+                mask: react_imask__WEBPACK_IMPORTED_MODULE_2__.IMask.MaskedRange,
+                from: 1, // минимальный день
+                to: 31, // максимальный день
+            },
+        }, required: required });
+}
+
+
+/***/ }),
+
+/***/ "./src/ui/InputFields/DateTimeField/ui/DateTimeField.tsx":
+/*!***************************************************************!*\
+  !*** ./src/ui/InputFields/DateTimeField/ui/DateTimeField.tsx ***!
+  \***************************************************************/
+/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
+
+"use strict";
+__webpack_require__.r(__webpack_exports__);
+/* harmony export */ __webpack_require__.d(__webpack_exports__, {
+/* harmony export */   DateTimeField: () => (/* binding */ DateTimeField)
+/* harmony export */ });
+/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react/jsx-runtime */ "./node_modules/react/jsx-runtime.js");
+/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! react */ "react");
+/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_1__);
+/* harmony import */ var clsx__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! clsx */ "./node_modules/clsx/dist/clsx.mjs");
+/* harmony import */ var date_fns_locale__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! date-fns/locale */ "./node_modules/date-fns/locale/ru.js");
+/* harmony import */ var _lib__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! @/lib */ "./src/lib/index.ts");
+/* harmony import */ var _styles__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../styles */ "./src/ui/InputFields/DateTimeField/styles/index.ts");
+/* harmony import */ var _TimeField__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ./TimeField */ "./src/ui/InputFields/DateTimeField/ui/TimeField.tsx");
+/* harmony import */ var _DateField__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ./DateField */ "./src/ui/InputFields/DateTimeField/ui/DateField.tsx");
+
+
+
+
+
+
+
+
+function DateTimeField({ value, fieldConfig = 'datetime', onChange, dateFormat = 'dd.MM.yyyy', timeFormat = 'HH:mm', outFormat = 'iso-8601', additionStyle, ...props }) {
+    const isInputDate = (0,react__WEBPACK_IMPORTED_MODULE_1__.useRef)(false);
+    const isInputTime = (0,react__WEBPACK_IMPORTED_MODULE_1__.useRef)(false);
+    const getDateValue = () => {
+        if (value === undefined)
+            return undefined;
+        if (outFormat === 'iso-8601') {
+            return new Date(value);
+        }
+        return (0,_lib__WEBPACK_IMPORTED_MODULE_3__.saveParseDate)(value, { from: outFormat });
+    };
+    const setDateValue = (newValue) => {
+        if (onChange) {
+            if (outFormat === 'iso-8601') {
+                onChange(newValue.toISOString());
+            }
+            const res = (0,_lib__WEBPACK_IMPORTED_MODULE_3__.saveFormatDate)(newValue, { to: outFormat });
+            if (res != null && typeof res === 'string') {
+                onChange(res);
+            }
+        }
+    };
+    const getTimeContent = () => {
+        if (fieldConfig == 'date')
+            return undefined;
+        const handleChange = (newTime) => {
+            isInputTime.current = true;
+            const dateValue = getDateValue();
+            let res = new Date();
+            const dateTime = (0,_lib__WEBPACK_IMPORTED_MODULE_3__.saveParseDate)(newTime, { from: timeFormat });
+            if (dateValue != null) {
+                res = dateValue;
+            }
+            if (dateTime != null) {
+                res.setHours(dateTime.getHours());
+                res.setMinutes(dateTime.getMinutes());
+                res.setSeconds(dateTime.getSeconds());
+                res.setMilliseconds(dateTime.getMilliseconds());
+                setDateValue(res);
+            }
+        };
+        const getTime = () => {
+            if (isInputTime.current === false)
+                return undefined;
+            const dateValue = getDateValue();
+            const res = (0,_lib__WEBPACK_IMPORTED_MODULE_3__.saveFormatDate)(dateValue, { to: timeFormat, locale: date_fns_locale__WEBPACK_IMPORTED_MODULE_7__.ru });
+            return typeof res === 'string' ? res : undefined;
+        };
+        return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", { className: _styles__WEBPACK_IMPORTED_MODULE_4__.DateTimeFieldStyle.item, children: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_TimeField__WEBPACK_IMPORTED_MODULE_5__.TimeField, { ...props, onChange: handleChange, value: getTime(), timeFormat: timeFormat }) }));
+    };
+    const getDateContent = () => {
+        if (fieldConfig == 'time')
+            return undefined;
+        const handleChange = (newDate) => {
+            isInputDate.current = true;
+            const dateValue = getDateValue();
+            let res = new Date();
+            const dateTime = (0,_lib__WEBPACK_IMPORTED_MODULE_3__.saveParseDate)(newDate, { from: dateFormat });
+            if (dateValue != null) {
+                res = dateValue;
+            }
+            if (dateTime != null) {
+                res.setFullYear(dateTime.getFullYear());
+                res.setMonth(dateTime.getMonth());
+                res.setDate(dateTime.getDate());
+                setDateValue(res);
+            }
+        };
+        const getDate = () => {
+            if (isInputDate.current === false)
+                return undefined;
+            const dateValue = getDateValue();
+            const res = (0,_lib__WEBPACK_IMPORTED_MODULE_3__.saveFormatDate)(dateValue, { to: dateFormat, locale: date_fns_locale__WEBPACK_IMPORTED_MODULE_7__.ru });
+            return typeof res === 'string' ? res : undefined;
+        };
+        return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", { className: _styles__WEBPACK_IMPORTED_MODULE_4__.DateTimeFieldStyle.item, children: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_DateField__WEBPACK_IMPORTED_MODULE_6__.DateField, { ...props, value: getDate(), onChange: handleChange, dateFormat: dateFormat }) }));
+    };
+    return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", { className: (0,clsx__WEBPACK_IMPORTED_MODULE_2__["default"])(_styles__WEBPACK_IMPORTED_MODULE_4__.DateTimeFieldStyle.DateTimeField, additionStyle), children: [getDateContent(), getTimeContent()] }));
+}
+
+
+/***/ }),
+
+/***/ "./src/ui/InputFields/DateTimeField/ui/TimeField.tsx":
+/*!***********************************************************!*\
+  !*** ./src/ui/InputFields/DateTimeField/ui/TimeField.tsx ***!
+  \***********************************************************/
+/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
+
+"use strict";
+__webpack_require__.r(__webpack_exports__);
+/* harmony export */ __webpack_require__.d(__webpack_exports__, {
+/* harmony export */   TimeField: () => (/* binding */ TimeField)
+/* harmony export */ });
+/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react/jsx-runtime */ "./node_modules/react/jsx-runtime.js");
+/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! react */ "react");
+/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_1__);
+/* harmony import */ var react_imask__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! react-imask */ "./node_modules/react-imask/esm/index.js");
+/* harmony import */ var _lib__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! @/lib */ "./src/lib/index.ts");
+/* harmony import */ var _FlexField__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../../FlexField */ "./src/ui/InputFields/FlexField/index.ts");
+
+
+
+
+
+function TimeField({ value, disabled, required, isError, onChange, onFocus, timeFormat = 'HH:mm', onBlur, additionStyles, }) {
+    const [timeValue, setTimeValue] = (0,react__WEBPACK_IMPORTED_MODULE_1__.useState)(value);
+    (0,react__WEBPACK_IMPORTED_MODULE_1__.useEffect)(() => {
+        if (value !== timeValue)
+            setTimeValue(value);
+    }, [value]);
+    const handleChange = (newTime) => {
+        setTimeValue(newTime);
+        const formatTime = (0,_lib__WEBPACK_IMPORTED_MODULE_3__.saveFormatDate)(newTime, { from: timeFormat, to: timeFormat, errorNull: true });
+        if (formatTime !== null && onChange) {
+            onChange(formatTime);
+        }
+    };
+    return (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_FlexField__WEBPACK_IMPORTED_MODULE_4__.FlexField, { value: timeValue, onChange: handleChange, disabled: disabled, isError: isError, onFocus: onFocus, onBlur: onBlur, mask: timeFormat, blocks: {
+            HH: {
+                mask: react_imask__WEBPACK_IMPORTED_MODULE_2__.IMask.MaskedRange,
+                from: 0,
+                to: 23, // для часов 00-23
+            },
+            mm: {
+                mask: react_imask__WEBPACK_IMPORTED_MODULE_2__.IMask.MaskedRange,
+                from: 0,
+                to: 59, // для минут 00-59
+            },
+            ss: {
+                mask: react_imask__WEBPACK_IMPORTED_MODULE_2__.IMask.MaskedRange,
+                from: 0,
+                to: 59, // для секунд 00-59
+            },
+            SSS: {
+                mask: react_imask__WEBPACK_IMPORTED_MODULE_2__.IMask.MaskedRange,
+                from: 0,
+                to: 999, // для миллисекунд 000-999
+            },
+        }, required: required });
+}
+
+
+/***/ }),
+
+/***/ "./src/ui/InputFields/DateTimeField/ui/index.ts":
+/*!******************************************************!*\
+  !*** ./src/ui/InputFields/DateTimeField/ui/index.ts ***!
+  \******************************************************/
+/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
+
+"use strict";
+__webpack_require__.r(__webpack_exports__);
+/* harmony export */ __webpack_require__.d(__webpack_exports__, {
+/* harmony export */   DateTimeField: () => (/* reexport safe */ _DateTimeField__WEBPACK_IMPORTED_MODULE_0__.DateTimeField)
+/* harmony export */ });
+/* harmony import */ var _DateTimeField__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./DateTimeField */ "./src/ui/InputFields/DateTimeField/ui/DateTimeField.tsx");
+
+
+
+/***/ }),
+
+/***/ "./src/ui/InputFields/FieldsBase/index.ts":
+/*!************************************************!*\
+  !*** ./src/ui/InputFields/FieldsBase/index.ts ***!
+  \************************************************/
+/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
+
+"use strict";
+__webpack_require__.r(__webpack_exports__);
+/* harmony import */ var _types__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./types */ "./src/ui/InputFields/FieldsBase/types/index.ts");
+
+
+
+/***/ }),
+
+/***/ "./src/ui/InputFields/FieldsBase/types/FieldsBaseTypes.ts":
+/*!****************************************************************!*\
+  !*** ./src/ui/InputFields/FieldsBase/types/FieldsBaseTypes.ts ***!
+  \****************************************************************/
+/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
+
+"use strict";
+__webpack_require__.r(__webpack_exports__);
+
+
+
+/***/ }),
+
+/***/ "./src/ui/InputFields/FieldsBase/types/index.ts":
+/*!******************************************************!*\
+  !*** ./src/ui/InputFields/FieldsBase/types/index.ts ***!
+  \******************************************************/
+/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
+
+"use strict";
+__webpack_require__.r(__webpack_exports__);
+/* harmony import */ var _FieldsBaseTypes__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./FieldsBaseTypes */ "./src/ui/InputFields/FieldsBase/types/FieldsBaseTypes.ts");
+
+
+
 /***/ }),
 
 /***/ "./src/ui/InputFields/FlexField/index.ts":
@@ -9994,16 +10478,13 @@ __webpack_require__.r(__webpack_exports__);
 
 
 
-function TextareaField({ value, name, placeholder, onChange, required = false, disabled = false, isError = false, offFocus = false, additionStyles,
-// className = TextareaFieldStyle,
- }) {
+function TextareaField({ value, name, placeholder, onChange, required = false, disabled = false, isError = false, offFocus = false, additionStyles, }) {
     const handleOnChange = (e) => {
         e.preventDefault();
         onChange && onChange(e.target.value);
     };
-    return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("textarea", { name: name, placeholder: placeholder, value: value || '', onChange: handleOnChange, required: required, disabled: disabled, className: (0,clsx__WEBPACK_IMPORTED_MODULE_1__["default"])(_styles__WEBPACK_IMPORTED_MODULE_2__.TextareaFieldStyle.textareaField, {
+    return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("textarea", { name: name, placeholder: placeholder, value: value, onChange: handleOnChange, required: required, disabled: disabled, className: (0,clsx__WEBPACK_IMPORTED_MODULE_1__["default"])(_styles__WEBPACK_IMPORTED_MODULE_2__.TextareaFieldStyle.textareaField, {
             [_styles__WEBPACK_IMPORTED_MODULE_2__.TextareaFieldStyle.isError]: isError,
-            [_styles__WEBPACK_IMPORTED_MODULE_2__.TextareaFieldStyle.offFocus]: offFocus,
         }, additionStyles) }));
 }
 
@@ -10019,6 +10500,7 @@ function TextareaField({ value, name, placeholder, onChange, required = false, d
 "use strict";
 __webpack_require__.r(__webpack_exports__);
 /* harmony export */ __webpack_require__.d(__webpack_exports__, {
+/* harmony export */   DateTimeField: () => (/* reexport safe */ _DateTimeField__WEBPACK_IMPORTED_MODULE_8__.DateTimeField),
 /* harmony export */   FlexField: () => (/* reexport safe */ _FlexField__WEBPACK_IMPORTED_MODULE_0__.FlexField),
 /* harmony export */   InputField: () => (/* reexport safe */ _InputField__WEBPACK_IMPORTED_MODULE_6__.InputField),
 /* harmony export */   InputFieldWrapper: () => (/* reexport safe */ _InputFieldWrapper__WEBPACK_IMPORTED_MODULE_2__.InputFieldWrapper),
@@ -10034,6 +10516,10 @@ __webpack_require__.r(__webpack_exports__);
 /* harmony import */ var _RadioField__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./RadioField */ "./src/ui/InputFields/RadioField/index.ts");
 /* harmony import */ var _TextareaField__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ./TextareaField */ "./src/ui/InputFields/TextareaField/index.ts");
 /* harmony import */ var _InputField__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ./InputField */ "./src/ui/InputFields/InputField/index.ts");
+/* harmony import */ var _FieldsBase__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ./FieldsBase */ "./src/ui/InputFields/FieldsBase/index.ts");
+/* harmony import */ var _DateTimeField__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! ./DateTimeField */ "./src/ui/InputFields/DateTimeField/index.ts");
+
+
 
 
 
@@ -11445,6 +11931,7 @@ __webpack_require__.r(__webpack_exports__);
 /* harmony export */   DatePickerFooter: () => (/* reexport safe */ _DatePicker__WEBPACK_IMPORTED_MODULE_2__.DatePickerFooter),
 /* harmony export */   DatePickerHeader: () => (/* reexport safe */ _DatePicker__WEBPACK_IMPORTED_MODULE_2__.DatePickerHeader),
 /* harmony export */   DatePickerMain: () => (/* reexport safe */ _DatePicker__WEBPACK_IMPORTED_MODULE_2__.DatePickerMain),
+/* harmony export */   DateTimeField: () => (/* reexport safe */ _InputFields__WEBPACK_IMPORTED_MODULE_3__.DateTimeField),
 /* harmony export */   FlexField: () => (/* reexport safe */ _InputFields__WEBPACK_IMPORTED_MODULE_3__.FlexField),
 /* harmony export */   FormBuilder: () => (/* reexport safe */ _FormBuilder__WEBPACK_IMPORTED_MODULE_4__.FormBuilder),
 /* harmony export */   INIT_FIELDS_NAME: () => (/* reexport safe */ _FormBuilder__WEBPACK_IMPORTED_MODULE_4__.INIT_FIELDS_NAME),
@@ -25908,6 +26395,7 @@ __webpack_require__.r(__webpack_exports__);
 /* harmony export */   DatePickerFooter: () => (/* reexport safe */ _ui__WEBPACK_IMPORTED_MODULE_1__.DatePickerFooter),
 /* harmony export */   DatePickerHeader: () => (/* reexport safe */ _ui__WEBPACK_IMPORTED_MODULE_1__.DatePickerHeader),
 /* harmony export */   DatePickerMain: () => (/* reexport safe */ _ui__WEBPACK_IMPORTED_MODULE_1__.DatePickerMain),
+/* harmony export */   DateTimeField: () => (/* reexport safe */ _ui__WEBPACK_IMPORTED_MODULE_1__.DateTimeField),
 /* harmony export */   FlexField: () => (/* reexport safe */ _ui__WEBPACK_IMPORTED_MODULE_1__.FlexField),
 /* harmony export */   FormBuilder: () => (/* reexport safe */ _ui__WEBPACK_IMPORTED_MODULE_1__.FormBuilder),
 /* harmony export */   INIT_FIELDS_NAME: () => (/* reexport safe */ _ui__WEBPACK_IMPORTED_MODULE_1__.INIT_FIELDS_NAME),
@@ -25945,6 +26433,8 @@ __webpack_require__.r(__webpack_exports__);
 /* harmony export */   isDict: () => (/* reexport safe */ _lib__WEBPACK_IMPORTED_MODULE_4__.isDict),
 /* harmony export */   isEqualArrays: () => (/* reexport safe */ _lib__WEBPACK_IMPORTED_MODULE_4__.isEqualArrays),
 /* harmony export */   reactNodeComponent: () => (/* reexport safe */ _ui__WEBPACK_IMPORTED_MODULE_1__.reactNodeComponent),
+/* harmony export */   saveFormatDate: () => (/* reexport safe */ _lib__WEBPACK_IMPORTED_MODULE_4__.saveFormatDate),
+/* harmony export */   saveParseDate: () => (/* reexport safe */ _lib__WEBPACK_IMPORTED_MODULE_4__.saveParseDate),
 /* harmony export */   setDeepValue: () => (/* reexport safe */ _lib__WEBPACK_IMPORTED_MODULE_4__.setDeepValue),
 /* harmony export */   traverseTreeByStack: () => (/* reexport safe */ _lib__WEBPACK_IMPORTED_MODULE_4__.traverseTreeByStack),
 /* harmony export */   useFormData: () => (/* reexport safe */ _hooks__WEBPACK_IMPORTED_MODULE_2__.useFormData),