import { useLingui } from '../../../../../../node_modules/@lingui/react/dist/index.mjs';
import React__default from 'react';
import Button from '../atoms/Button.mjs';
import { useTimeRemaining } from '../atoms/Countdown.mjs';
import VerticalTransition from '../atoms/VerticalTransition.mjs';

const ResendOTPButton = ({ isSubmitting, resendOTP, countdown })=>{
    const { i18n: $__i18n, _: $__ } = useLingui();
    const [timeRemaining, active] = useTimeRemaining(countdown.expiration);
    return /*#__PURE__*/ React__default.createElement(Button, {
        variant: "outline",
        disabled: isSubmitting || active,
        onClick: ()=>{
            countdown.start(15);
            resendOTP().catch(()=>countdown.clear());
        }
    }, /*#__PURE__*/ React__default.createElement(VerticalTransition, {
        className: (void 0),
        primary: $__i18n._({
            id: "passcode.resendCode",
            message: "Resend code"
        }),
        secondary: $__i18n._({
            id: "passcode.codeSent",
            message: "Code sent! Try again in {timeRemaining}s",
            values: {
                timeRemaining: timeRemaining
            }
        }),
        triggered: active
    }));
};

export { ResendOTPButton };
//# sourceMappingURL=ResendOTPButton.mjs.map
