import { __assign } from "tslib";
import { jsx as _jsx } from "react/jsx-runtime";
import { useCallback, useContext, useMemo } from 'react';
import PanelFooter from '../../components/PanelFooter';
import Button from '../../../button';
import Pop from '../../../pop';
import PickerContext from '../../context/PickerContext';
import PanelContext from '../../context/PanelContext';
var CombinedTimeFooter = function (_a) {
    var onSelected = _a.onSelected, selected = _a.selected;
    var i18n = useContext(PickerContext).i18n;
    var confirmStatus = useContext(PanelContext).confirmStatus;
    var confirmHandler = useCallback(function () { return onSelected(selected, true); }, [selected, onSelected]);
    var confirmNode = useMemo(function () {
        var confirmBtn = (_jsx(Button, __assign({ type: "primary", onClick: confirmHandler, disabled: confirmStatus, className: "zent-datepicker-panel-footer-btn" }, { children: i18n.confirm }), void 0));
        return confirmStatus ? (_jsx(Pop, __assign({ content: i18n.timeErrorPop, trigger: "hover" }, { children: confirmBtn }), void 0)) : (confirmBtn);
    }, [i18n, confirmStatus, confirmHandler]);
    return _jsx(PanelFooter, { rightNode: confirmNode }, void 0);
};
export default CombinedTimeFooter;
