import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
import { useState } from "react";
import { TPSLEditor } from "../../block/tp_sl/tp_sl_editor";
import { Statistic } from "../../statistic";
import { useMarkPrice, useSymbolsInfo } from "@orderly.network/hooks";
import { Text } from "../../text/text";
import { AlgoOrderRootType } from "@orderly.network/types";
import { useModal } from "../../modal";
import { Divider } from "../../divider";
export const TPSLOrderEditorSheet = (props)=>{
    const { position, order, isEditing } = props;
    const { data: markPrice } = useMarkPrice(position.symbol);
    const { hide, setStates } = useModal();
    const priceDp = useSymbolsInfo()[position.symbol]("quote_dp") || 2;
    const [type, setType] = useState(order?.algo_type);
    const onTypeChange = (type)=>{
        // console.log(type);
        setStates({
            type
        });
        setType(type);
    };
    return /*#__PURE__*/ _jsxs("div", {
        children: [
            /*#__PURE__*/ _jsxs("div", {
                className: "orderly-py-3 orderly-space-x-2",
                children: [
                    /*#__PURE__*/ _jsx(Text, {
                        rule: "symbol",
                        children: position.symbol
                    }),
                    isEditing ? null : /*#__PURE__*/ _jsx(_Fragment, {
                        children: position.position_qty > 0 ? /*#__PURE__*/ _jsx("span", {
                            className: "orderly-text-trade-profit orderly-text-xs",
                            children: "Long"
                        }) : /*#__PURE__*/ _jsx("span", {
                            className: "orderly-text-trade-loss orderly-text-xs",
                            children: "Short"
                        })
                    })
                ]
            }),
            /*#__PURE__*/ _jsxs("div", {
                className: "orderly-grid orderly-grid-cols-3 orderly-gap-2 orderly-pb-4",
                children: [
                    /*#__PURE__*/ _jsx(Statistic, {
                        label: "Order type",
                        value: type === AlgoOrderRootType.POSITIONAL_TP_SL ? "Position TP/SL" : "TP/SL",
                        labelClassName: "orderly-text-4xs orderly-text-base-contrast-36",
                        valueClassName: "orderly-text-xs"
                    }),
                    /*#__PURE__*/ _jsx(Statistic, {
                        label: "Avg. open",
                        value: position.average_open_price,
                        rule: "price",
                        precision: priceDp,
                        labelClassName: "orderly-text-4xs orderly-text-base-contrast-36",
                        valueClassName: "orderly-text-xs"
                    }),
                    /*#__PURE__*/ _jsx(Statistic, {
                        label: "Mark price",
                        value: markPrice,
                        precision: priceDp,
                        rule: "price",
                        align: "right",
                        labelClassName: "orderly-text-4xs orderly-text-base-contrast-36",
                        valueClassName: "orderly-text-xs"
                    })
                ]
            }),
            !props.canModifyQty && /*#__PURE__*/ _jsx(Divider, {
                className: "orderly-mb-3"
            }),
            /*#__PURE__*/ _jsx(TPSLEditor, {
                position: position,
                symbol: position.symbol,
                maxQty: position.position_qty,
                order: props.order,
                isEditing: props.isEditing,
                canModifyQty: props.canModifyQty,
                onCancel: hide,
                onSuccess: hide,
                onTypeChange: onTypeChange,
                quoteDp: priceDp
            })
        ]
    });
};

//# sourceMappingURL=tpslSheet.js.map