"use strict";
Object.defineProperty(exports, "__esModule", {
    value: true
});
Object.defineProperty(exports, "Market", {
    enumerable: true,
    get: function() {
        return Market;
    }
});
const _jsxruntime = require("react/jsx-runtime");
const _react = require("react");
const _markets = require("../../../../../block/markets");
const _icon = require("../../../../../icon");
const _sheet = require("../../../../../sheet");
const _hooks = require("@orderly.network/hooks");
const _page = require("../../../../../page");
const Market = (props)=>{
    const { symbol } = props;
    const [open, setOpen] = (0, _react.useState)(false);
    const symbolConfig = (0, _hooks.useSymbolsInfo)();
    const { data } = (0, _hooks.useMarketsStream)();
    const { onSymbolChange } = (0, _react.useContext)(_page.TradingPageContext);
    const onSymbolClick = (0, _react.useCallback)((symbol)=>{
        setOpen(false);
        onSymbolChange?.(symbol);
    }, [
        onSymbolChange
    ]);
    const [innerHeight, setInnerHeight] = (0, _react.useState)(window.innerHeight - 180);
    (0, _react.useEffect)(()=>{
        const handleResize = ()=>{
            setInnerHeight(window.innerHeight - 180);
        };
        window.addEventListener('resize', handleResize);
        return ()=>{
            window.removeEventListener('resize', handleResize);
        };
    }, []);
    return /*#__PURE__*/ (0, _jsxruntime.jsxs)(_sheet.Sheet, {
        open: open,
        onOpenChange: setOpen,
        children: [
            /*#__PURE__*/ (0, _jsxruntime.jsx)(_sheet.SheetTrigger, {
                asChild: true,
                children: /*#__PURE__*/ (0, _jsxruntime.jsxs)("button", {
                    className: "orderly-flex orderly-items-center orderly-gap-1",
                    children: [
                        /*#__PURE__*/ (0, _jsxruntime.jsx)("span", {
                            children: symbolConfig[symbol]("name")
                        }),
                        /*#__PURE__*/ (0, _jsxruntime.jsx)(_icon.ArrowIcon, {
                            size: 8,
                            className: "orderly-fill-base-contrast-54"
                        })
                    ]
                })
            }),
            /*#__PURE__*/ (0, _jsxruntime.jsx)(_sheet.SheetContent, {
                id: "orderly-markets-sheet-content",
                side: "left",
                closeable: false,
                className: "orderly-w-84% orderly-h-100vh",
                onOpenAutoFocus: (event)=>event.preventDefault(),
                children: /*#__PURE__*/ (0, _jsxruntime.jsx)(_markets.Markets, {
                    // @ts-ignore
                    dataSource: data,
                    onItemClick: onSymbolClick,
                    listHeight: innerHeight
                })
            })
        ]
    });
};

//# sourceMappingURL=market.js.map