UNPKG

@skbkontur/db-viewer-ui

Version:

Database Viewer with custom configuration

37 lines 1.75 kB
"use strict"; Object.defineProperty(exports, "__esModule", { value: true }); exports.TimePicker = void 0; const jsx_runtime_1 = require("react/jsx-runtime"); const edi_ui_1 = require("@skbkontur/edi-ui"); const react_ui_1 = require("@skbkontur/react-ui"); const react_1 = require("react"); const helpers_1 = require("./helpers"); const TimePicker = ({ disabled, warning, error, useSeconds, defaultTime, value, onChange, }) => { const [innerValue, setInnerValue] = (0, react_1.useState)(() => value !== null && value !== void 0 ? value : ""); const formatChars = { "9": "[0-9]", H: "[0-2]", h: innerValue.startsWith("2") ? "[0-3]" : "[0-9]", M: "[0-5]", m: "[0-9]", S: "[0-5]", s: "[0-9]", }; (0, react_1.useEffect)(() => { setInnerValue(value !== null && value !== void 0 ? value : ""); }, [value]); const handleBlur = () => { const paddedTime = (0, helpers_1.padTime)(innerValue, useSeconds); if (paddedTime && edi_ui_1.TimeUtils.isCorrectTime(paddedTime)) { setInnerValue(paddedTime); onChange(paddedTime); return; } const fallback = defaultTime || (useSeconds ? "00:00:00.000" : "00:00"); setInnerValue(fallback); onChange(fallback); }; return ((0, jsx_runtime_1.jsx)(react_ui_1.MaskedInput, { unmask: true, disabled: disabled, mask: useSeconds ? "Hh{:}Mm{:}Ss{.}999" : "Hh{:}Mm", formatChars: formatChars, value: innerValue, width: useSeconds ? 96 : 58, error: error, placeholder: disabled ? undefined : defaultTime, onValueChange: setInnerValue, onBlur: handleBlur, warning: warning })); }; exports.TimePicker = TimePicker; //# sourceMappingURL=TimePicker.js.map