"use strict";
Object.defineProperty(exports, "__esModule", {
    value: true
});
Object.defineProperty(exports, "SortGroup", {
    enumerable: true,
    get: function() {
        return SortGroup;
    }
});
const _jsxruntime = require("react/jsx-runtime");
const _icon = require("../../../icon");
const _useSort = require("../useSort");
const _sortItem = require("./sortItem");
const _react = require("react");
const SortGroup = (props)=>{
    const { sortKey, onSort, direction, value: currentValue } = (0, _useSort.useSort)(props.value, props.readLastSortCondition);
    (0, _react.useEffect)(()=>{
        props.onChange?.({
            key: sortKey,
            direction
        });
    }, [
        sortKey,
        direction
    ]);
    return /*#__PURE__*/ (0, _jsxruntime.jsxs)("div", {
        className: "orderly-flex orderly-justify-between orderly-text-4xs orderly-pt-5 orderly-pb-3 orderly-text-base-contrast-36",
        children: [
            /*#__PURE__*/ (0, _jsxruntime.jsxs)("div", {
                className: "orderly-flex orderly-items-center orderly-gap-1",
                children: [
                    /*#__PURE__*/ (0, _jsxruntime.jsx)("div", {
                        children: "Instrument"
                    }),
                    /*#__PURE__*/ (0, _jsxruntime.jsx)("div", {
                        children: "/"
                    }),
                    /*#__PURE__*/ (0, _jsxruntime.jsx)(_icon.OrderlyIcon, {
                        size: 14,
                        className: "orderly-mx-[2px]"
                    }),
                    /*#__PURE__*/ (0, _jsxruntime.jsx)(_sortItem.SortItem, {
                        label: "Vol.",
                        value: "vol",
                        onClick: onSort,
                        currentValue: currentValue
                    })
                ]
            }),
            /*#__PURE__*/ (0, _jsxruntime.jsxs)("div", {
                className: "orderly-flex orderly-items-center orderly-gap-1",
                children: [
                    /*#__PURE__*/ (0, _jsxruntime.jsx)(_sortItem.SortItem, {
                        label: "Price",
                        value: "price",
                        onClick: onSort,
                        currentValue: currentValue
                    }),
                    /*#__PURE__*/ (0, _jsxruntime.jsx)("div", {
                        children: "/"
                    }),
                    /*#__PURE__*/ (0, _jsxruntime.jsx)(_sortItem.SortItem, {
                        label: "Change%",
                        value: "change",
                        onClick: onSort,
                        currentValue: currentValue
                    })
                ]
            })
        ]
    });
};

//# sourceMappingURL=sortGroup.js.map