"use strict";
Object.defineProperty(exports, "__esModule", {
    value: true
});
Object.defineProperty(exports, "OrderConfirmView", {
    enumerable: true,
    get: function() {
        return OrderConfirmView;
    }
});
const _jsxruntime = require("react/jsx-runtime");
const _types = require("@orderly.network/types");
const _react = require("react");
const _text = require("../../../text");
const OrderConfirmView = (props)=>{
    const { order, quote = "USDC", base } = props;
    const type = (0, _react.useMemo)(()=>{
        const type = order.order_type === _types.OrderType.MARKET ? "Market" : "Limit";
        if (order.side === _types.OrderSide.BUY) {
            return /*#__PURE__*/ (0, _jsxruntime.jsx)(_text.Text, {
                type: "buy",
                children: `${type} Buy`
            });
        }
        return /*#__PURE__*/ (0, _jsxruntime.jsx)(_text.Text, {
            type: "sell",
            children: `${type} Sell`
        });
    }, [
        order.side,
        order.order_type
    ]);
    return /*#__PURE__*/ (0, _jsxruntime.jsxs)("div", {
        className: "orderly-grid orderly-grid-cols-2 orderly-text-base-contract-54 orderly-text-xs desktop:orderly-text-sm",
        children: [
            /*#__PURE__*/ (0, _jsxruntime.jsxs)("div", {
                children: [
                    /*#__PURE__*/ (0, _jsxruntime.jsx)("div", {
                        className: "desktop:orderly-flex desktop:orderly-justify-start",
                        children: type
                    }),
                    /*#__PURE__*/ (0, _jsxruntime.jsxs)("div", {
                        className: "orderly-flex orderly-gap-1 orderly-items-end",
                        children: [
                            /*#__PURE__*/ (0, _jsxruntime.jsx)("span", {
                                children: base
                            }),
                            /*#__PURE__*/ (0, _jsxruntime.jsxs)("span", {
                                className: "orderly-text-3xs orderly-text-base-contrast-54",
                                children: [
                                    "/",
                                    quote
                                ]
                            })
                        ]
                    })
                ]
            }),
            /*#__PURE__*/ (0, _jsxruntime.jsxs)("div", {
                className: "orderly-flex orderly-flex-col orderly-gap-2",
                children: [
                    /*#__PURE__*/ (0, _jsxruntime.jsxs)("div", {
                        className: "orderly-flex orderly-justify-between",
                        children: [
                            /*#__PURE__*/ (0, _jsxruntime.jsx)("span", {
                                className: "orderly-text-base-contrast-54",
                                children: "Qty."
                            }),
                            /*#__PURE__*/ (0, _jsxruntime.jsx)("span", {
                                children: order.order_quantity
                            })
                        ]
                    }),
                    /*#__PURE__*/ (0, _jsxruntime.jsxs)("div", {
                        className: "orderly-flex orderly-justify-between",
                        children: [
                            /*#__PURE__*/ (0, _jsxruntime.jsx)("span", {
                                className: "orderly-text-base-contrast-54",
                                children: "Price"
                            }),
                            /*#__PURE__*/ (0, _jsxruntime.jsx)("span", {
                                children: order.order_type === _types.OrderType.MARKET ? "Market" : order.order_price
                            })
                        ]
                    }),
                    /*#__PURE__*/ (0, _jsxruntime.jsxs)("div", {
                        className: "orderly-flex orderly-justify-between",
                        children: [
                            /*#__PURE__*/ (0, _jsxruntime.jsx)("span", {
                                className: "orderly-text-base-contrast-54",
                                children: "Total"
                            }),
                            /*#__PURE__*/ (0, _jsxruntime.jsx)("span", {
                                children: order.total
                            })
                        ]
                    })
                ]
            })
        ]
    });
};

//# sourceMappingURL=orderConfirmView.js.map