import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import { useWatch } from "react-hook-form";
import { calculateCashBalanceChange } from "../utils/table.js";
import { FormattedNumber } from "./formatted-number.js";
export function CashBalanceChange(props) {
    const { control } = props;
    const cashAmount = useWatch({ control, name: "cashAmount" });
    const type = useWatch({ control, name: "type" });
    const fees = useWatch({ control, name: "fees" });
    const cashBalanceChange = calculateCashBalanceChange(type, cashAmount, fees);
    return (_jsxs("div", { className: "flex items-center justify-between border-t border-gray-300 bg-gray-100 p-3 font-semibold text-gray-800", children: [_jsx("div", { className: "mr-6 text-sm text-gray-600", children: "Cash Balance Change $USD" }), _jsx("div", { className: "h-px flex-1 border-b border-dashed border-gray-400" }), _jsx("div", { className: "pl-8 text-sm text-gray-900", children: _jsx(FormattedNumber, { value: cashBalanceChange }) })] }));
}
//# sourceMappingURL=cash-balance-change.js.map