@i-novus/ui-core/dist/data-entry/InputTime.js

Базовые UI компоненты

import { jsx as _jsx } from "react/jsx-runtime";
import { forwardRef, useCallback, useEffect, useMemo, useState } from 'react';
import dayjs from 'dayjs';
import customParseFormat from 'dayjs/plugin/customParseFormat';
import { useConfigProvider } from '../core';
import { Input } from './Input';
dayjs.extend(customParseFormat);
export const InputTime = forwardRef((props, ref) => {
    const { value, onChange, prefix, format = 'HH:mm', ...restProps } = props;
    const { getPrefix } = useConfigProvider();
    const prefixCls = getPrefix(prefix);
    const [time, setTime] = useState('');
    const onChangeTime = useCallback((value) => {
        if (!value) {
            setTime('');
            return;
        }
        let newValue = value;
        if (value.length === 3 && !value.endsWith(':')) {
            const hours = value.substring(0, 2);
            const minutes = value.substring(2);
            newValue = `${hours}:${minutes}`;
        }
        if (!newValue.match(/^([0-2]|0\d|1\d|2[0-3])?(:([0-5]|[0-5]\d)?)?$/)) {
            return;
        }
        if (/^(0\d|1\d|2[0-3]):([0-5]\d)$/.test(newValue)) {
            onChange(dayjs(newValue, format).toDate());
        }
        setTime(newValue);
    }, [format, onChange]);
    useEffect(() => {
        if (!time) {
            onChange(null);
        }
    }, [onChange, time]);
    const getDefaultValue = useMemo(() => {
        if (value) {
            const hours = dayjs(value).hour().toString();
            const minutes = dayjs(value).minute().toString();
            const TwoDigitHours = hours.length === 1 ? `0${hours}` : hours;
            const TwoDigitMinutes = minutes.length === 1 ? `0${minutes}` : minutes;
            setTime(`${TwoDigitHours}:${TwoDigitMinutes}`);
            return `${TwoDigitHours}:${TwoDigitMinutes}`;
        }
        return '';
    }, [value]);
    return (_jsx(Input, { ...restProps, ref: ref, prefix: prefixCls, placeholder: "\u0427\u0427:MM", defaultValue: getDefaultValue, value: time, onChange: onChangeTime }));
});
InputTime.displayName = 'InputTime';