import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import React from "react";
import { Header } from "./header";
import { Bids } from "./bids";
import { Asks } from "./asks";
import { MarkPrice } from "./markPrice";
import { DepthSelect } from "../../block/orderbook/depthSelect";
import { OrderBookProvider } from "../../block/orderbook/orderContext";
import { Spinner } from "../../spinner";
import { cn } from "../../utils/css";
export const OrderBook = (props)=>{
    const { lastPrice, markPrice, quote, base, isLoading, onDepthChange } = props;
    // const onModeChange = useCallback((mode: QtyMode) => {}, []);
    return /*#__PURE__*/ _jsx(OrderBookProvider, {
        cellHeight: props.cellHeight ?? 20,
        onItemClick: props.onItemClick,
        depth: props.activeDepth,
        pendingOrders: [],
        showTotal: false,
        children: /*#__PURE__*/ _jsxs("div", {
            id: "orderly-orderbook-mobile",
            className: cn("orderly-h-full orderly-relative", props.className),
            children: [
                /*#__PURE__*/ _jsx(Header, {
                    quote: quote,
                    base: base
                }),
                /*#__PURE__*/ _jsx(Asks, {
                    data: props.asks
                }),
                /*#__PURE__*/ _jsx(MarkPrice, {
                    lastPrice: lastPrice,
                    markPrice: markPrice
                }),
                /*#__PURE__*/ _jsx(Bids, {
                    data: props.bids
                }),
                /*#__PURE__*/ _jsx(DepthSelect, {
                    depth: props.depth || [],
                    value: props.activeDepth,
                    onChange: onDepthChange
                }),
                isLoading && /*#__PURE__*/ _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__*/ _jsx(Spinner, {})
                })
            ]
        })
    });
};

//# sourceMappingURL=index.js.map