UNPKG

infinity-forge

Version:
102 lines 5.08 kB
"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 __importDefault = (this && this.__importDefault) || function (mod) { return (mod && mod.__esModule) ? mod : { "default": mod }; }; Object.defineProperty(exports, "__esModule", { value: true }); exports.InputDatePicker = exports.mode = void 0; var jsx_runtime_1 = require("react/jsx-runtime"); var react_1 = require("react"); var moment_1 = __importDefault(require("moment")); var formik_1 = require("formik"); var ui_1 = require("../../../../ui/index.js"); var calendar_1 = require("./calendar/index.js"); exports.mode = { month: { mask: '__/____', format: 'MM/YYYY', }, date: { mask: '__/__/____', format: 'DD/MM/YYYY', }, timer: { mask: '__:__', format: 'HH:mm', }, 'timer-date': { mask: '__/__/____ __:__', format: 'DD/MM/YYYY HH:mm', }, year: { mask: '____', format: 'YYYY', }, }; var InputDatePicker = function (props) { var _a, _b, _c; var currentMode = (_a = props === null || props === void 0 ? void 0 : props.mode) !== null && _a !== void 0 ? _a : 'date'; var _d = (0, formik_1.useField)({ name: props.name, type: props.type }), field = _d[0], _ = _d[1], utils = _d[2]; var _e = (0, formik_1.useFormikContext)(), values = _e.values, setFieldValue = _e.setFieldValue; var ID = props.name + props.id; var value = field.value; var fieldValueInput = values[ID]; var mask = exports.mode[currentMode].mask; var momentFormatter = exports.mode[currentMode].format; var formattedValueToMask = (0, moment_1.default)(value).format(momentFormatter).toString(); var initialData = value ? (0, moment_1.default)(value).toDate() : ((_b = props.date) === null || _b === void 0 ? void 0 : _b.maxDate) ? (0, moment_1.default)(props.date.maxDate).toDate() : null; (0, react_1.useEffect)(function () { var _a; if (initialData && (0, moment_1.default)(initialData).isValid()) { if (!((_a = props === null || props === void 0 ? void 0 : props.date) === null || _a === void 0 ? void 0 : _a.maxDate)) { utils.setValue(initialData); setFieldValue(ID, (0, moment_1.default)(initialData).format(momentFormatter)); } } }, []); (0, react_1.useEffect)(function () { if (formattedValueToMask !== fieldValueInput) { setFieldValue(ID, value ? formattedValueToMask : null); if (value) props.onChangeInput && props.onChangeInput(value); } }, [value]); return ((0, jsx_runtime_1.jsx)(ui_1.Tooltip, __assign({}, props === null || props === void 0 ? void 0 : props.tooltip, { idTooltip: 'CALENDAR', position: 'bottom-left', bgColor: ((_c = props === null || props === void 0 ? void 0 : props.tooltip) === null || _c === void 0 ? void 0 : _c.bgColor) || 'transparent', closeOnClick: true, style: { background: '#fff', borderRadius: '7px', marginTop: '-8px', }, trigger: (0, jsx_runtime_1.jsx)(ui_1.InputControl, __assign({}, props, { i18n: { disabled: true }, children: (0, jsx_runtime_1.jsx)(ui_1.InputMask, __assign({ placeholder: props.placeholder, name: ID, mask: mask, disabled: props === null || props === void 0 ? void 0 : props.disabled }, (props.isClearable && { icon: { direction: 'right', name: 'IconClose', onClick: function () { return setFieldValue(props.name, null); }, }, }), { onChangeInput: function (value, callback) { var valueInput = value; var date = (0, moment_1.default)(valueInput, momentFormatter, true); callback(); if (date.isValid()) { setFieldValue(props.name, date.toDate()); if (date) props.onChangeInput && props.onChangeInput(date === null || date === void 0 ? void 0 : date.toDate()); if (props.date.maxDate && (0, moment_1.default)(props.date.maxDate).isBefore(date.toDate())) { setTimeout(function () { return props.date.maxDateError && utils.setError(props.date.maxDateError); }, 100); } } } })) })), ContentWithTooltipProps: function (_a) { var closeToolTip = _a.closeToolTip; return currentMode !== 'timer' ? (0, jsx_runtime_1.jsx)(calendar_1.Calendar, __assign({ closeToolTip: closeToolTip }, props)) : null; } }))); }; exports.InputDatePicker = InputDatePicker; //# sourceMappingURL=component.js.map