import React, { useEffect, useState } from 'react';
import classNames from 'classnames';
import TimePanel from './time-panel';
var TimePicker = function (props) {
    var _a = props.prefixCls, prefixCls = _a === void 0 ? 'ty-time-picker' : _a, _b = props.defaultValue, defaultValue = _b === void 0 ? new Date() : _b, onChange = props.onChange, className = props.className, style = props.style;
    var cls = classNames(prefixCls, className);
    var _c = useState(props.value ? props.value : defaultValue), date = _c[0], setDate = _c[1];
    var updateTime = function (type, num) {
        if (type === 'h') {
            date.setHours(num);
        }
        else if (type === 'm') {
            date.setMinutes(num);
        }
        else if (type === 's') {
            date.setSeconds(num);
        }
        setDate(date);
        !props.value && onChange && onChange(date);
    };
    useEffect(function () {
        props.value && setDate(props.value);
    }, [props.value]);
    return (React.createElement("div", { className: cls, style: style },
        React.createElement(TimePanel, { value: date.getHours(), count: 24, onChange: function (hour) { return updateTime('h', hour); } }),
        React.createElement(TimePanel, { value: date.getMinutes(), count: 60, onChange: function (min) { return updateTime('m', min); } }),
        React.createElement(TimePanel, { value: date.getSeconds(), count: 60, onChange: function (sec) { return updateTime('s', sec); } })));
};
export default TimePicker;
//# sourceMappingURL=time-picker.js.map