"use strict";
Object.defineProperty(exports, "__esModule", {
    value: true
});
Object.defineProperty(exports, "OrderDetail", {
    enumerable: true,
    get: function() {
        return OrderDetail;
    }
});
const _jsxruntime = require("react/jsx-runtime");
const _types = require("@orderly.network/types");
const _text = require("../../../text");
const _numeralTotal = require("../../../text/numeralTotal");
const _css = require("../../../utils/css");
const _utils = require("@orderly.network/utils");
const OrderDetail = (props)=>{
    const { order, quote } = props;
    const { side } = order;
    return /*#__PURE__*/ (0, _jsxruntime.jsxs)("div", {
        className: (0, _css.cn)("orderly-grid orderly-grid-cols-[1fr_2fr]", props.className),
        children: [
            /*#__PURE__*/ (0, _jsxruntime.jsx)("div", {
                className: "orderly-flex orderly-flex-col",
                children: /*#__PURE__*/ (0, _jsxruntime.jsx)(_text.Text, {
                    type: side === _types.OrderSide.SELL ? "sell" : "buy",
                    children: side === _types.OrderSide.SELL ? "Limit Sell" : "Limit Buy"
                })
            }),
            /*#__PURE__*/ (0, _jsxruntime.jsxs)("div", {
                className: "orderly-space-y-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)(_text.Text, {
                                type: side === _types.OrderSide.SELL ? "sell" : "buy",
                                children: (0, _utils.commify)(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)(_text.Text, {
                                surfix: /*#__PURE__*/ (0, _jsxruntime.jsx)("span", {
                                    className: "orderly-text-base-contrast-36",
                                    children: quote
                                }),
                                children: (0, _utils.commify)(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)(_numeralTotal.NumeralTotal, {
                                quantity: order.order_quantity ?? 0,
                                price: order.order_price ?? 0,
                                surfix: /*#__PURE__*/ (0, _jsxruntime.jsx)("span", {
                                    className: "orderly-text-base-contrast-36",
                                    children: quote
                                })
                            })
                        ]
                    })
                ]
            })
        ]
    });
};

//# sourceMappingURL=orderDetail.js.map