"use strict";
Object.defineProperty(exports, "__esModule", {
    value: true
});
Object.defineProperty(exports, "OrderBook", {
    enumerable: true,
    get: function() {
        return OrderBook;
    }
});
const _jsxruntime = require("react/jsx-runtime");
const _react = /*#__PURE__*/ _interop_require_default(require("react"));
const _header = require("./header");
const _bids = require("./bids");
const _asks = require("./asks");
const _markPrice = require("./markPrice");
const _depthSelect = require("../../block/orderbook/depthSelect");
const _orderContext = require("../../block/orderbook/orderContext");
const _spinner = require("../../spinner");
const _css = require("../../utils/css");
function _interop_require_default(obj) {
    return obj && obj.__esModule ? obj : {
        default: obj
    };
}
const OrderBook = (props)=>{
    const { lastPrice, markPrice, quote, base, isLoading, onDepthChange } = props;
    // const onModeChange = useCallback((mode: QtyMode) => {}, []);
    return /*#__PURE__*/ (0, _jsxruntime.jsx)(_orderContext.OrderBookProvider, {
        cellHeight: props.cellHeight ?? 20,
        onItemClick: props.onItemClick,
        depth: props.activeDepth,
        pendingOrders: [],
        showTotal: false,
        children: /*#__PURE__*/ (0, _jsxruntime.jsxs)("div", {
            id: "orderly-orderbook-mobile",
            className: (0, _css.cn)("orderly-h-full orderly-relative", props.className),
            children: [
                /*#__PURE__*/ (0, _jsxruntime.jsx)(_header.Header, {
                    quote: quote,
                    base: base
                }),
                /*#__PURE__*/ (0, _jsxruntime.jsx)(_asks.Asks, {
                    data: props.asks
                }),
                /*#__PURE__*/ (0, _jsxruntime.jsx)(_markPrice.MarkPrice, {
                    lastPrice: lastPrice,
                    markPrice: markPrice
                }),
                /*#__PURE__*/ (0, _jsxruntime.jsx)(_bids.Bids, {
                    data: props.bids
                }),
                /*#__PURE__*/ (0, _jsxruntime.jsx)(_depthSelect.DepthSelect, {
                    depth: props.depth || [],
                    value: props.activeDepth,
                    onChange: onDepthChange
                }),
                isLoading && /*#__PURE__*/ (0, _jsxruntime.jsx)("div", {
                    className: "orderly-absolute orderly-left-0 orderly-top-0 orderly-right-0 orderly-bottom-0 orderly-z-10 orderly-flex orderly-items-center orderly-justify-center orderly-bg-base-800/70 orderly-h-full orderly-min-h-[420px]",
                    children: /*#__PURE__*/ (0, _jsxruntime.jsx)(_spinner.Spinner, {})
                })
            ]
        })
    });
};

//# sourceMappingURL=index.js.map