import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import { Statistic } from "../../../statistic";
import { useCallback, useContext } from "react";
import { StatisticStyleProvider } from "../../../statistic/defaultStaticStyle";
import { Numeral } from "../../../text";
import { cn } from "../../../utils/css";
import { AssetsContext } from "../../../provider/assetsProvider";
import { modal } from "../../../modal";
import { SettlePnlContent } from "../../../block/withdraw";
export const Header = (props)=>{
    const unrealPnL = props.aggregated?.unrealPnL ?? 0;
    const { onSettle } = useContext(AssetsContext);
    const { pnlNotionalDecimalPrecision } = props;
    const onSettleClick = useCallback(()=>{
        modal.confirm({
            title: "Settle PnL",
            content: /*#__PURE__*/ _jsx(SettlePnlContent, {}),
            maxWidth: "xs",
            onCancel () {
                return Promise.reject("cancel");
            },
            onOk () {
                return onSettle().catch((e)=>{});
            }
        }).then(()=>{}, (error)=>{});
    }, []);
    return /*#__PURE__*/ _jsx(StatisticStyleProvider, {
        labelClassName: "orderly-text-3xs orderly-text-base-contrast-54",
        valueClassName: "orderly-text-base-contrast/80 orderly-tabular-nums orderly-font-semibold",
        children: /*#__PURE__*/ _jsx("div", {
            className: "orderly-flex orderly-justify-between orderly-py-3 orderly-items-center",
            children: /*#__PURE__*/ _jsxs("div", {
                className: "orderly-flex orderly-space-x-6",
                children: [
                    /*#__PURE__*/ _jsx(Statistic, {
                        label: "Unreal. PnL",
                        value: /*#__PURE__*/ _jsxs("div", {
                            className: cn("orderly-flex orderly-gap-1", {
                                "orderly-text-trade-loss": unrealPnL < 0,
                                "orderly-text-trade-profit": unrealPnL > 0
                            }),
                            children: [
                                /*#__PURE__*/ _jsx(Numeral, {
                                    precision: pnlNotionalDecimalPrecision,
                                    children: unrealPnL
                                }),
                                /*#__PURE__*/ _jsx(Numeral, {
                                    rule: "percentages",
                                    prefix: "(",
                                    surfix: ")",
                                    className: "orderly-ml-1",
                                    precision: pnlNotionalDecimalPrecision,
                                    children: props.aggregated?.unrealPnlROI ?? 0
                                })
                            ]
                        }),
                        rule: "price",
                        coloring: true
                    }),
                    /*#__PURE__*/ _jsx(Statistic, {
                        label: "Notional",
                        value: props.aggregated?.notional,
                        rule: "price",
                        precision: pnlNotionalDecimalPrecision
                    })
                ]
            })
        })
    });
};

//# sourceMappingURL=header.js.map