import { jsx as _jsx } from "react/jsx-runtime";
import { Slider } from "../../../slider";
import { useMemo, useState } from "react";
export const LeverageEditor = (props)=>{
    // const [maxLeverage, { update, config: leverageLevers }] = useLeverage();
    const { maxLeverage, leverageLevers, onSave } = props;
    const [leverage, setLeverage] = useState(()=>maxLeverage ?? 0);
    const leverageValue = useMemo(()=>{
        const index = leverageLevers.findIndex((item)=>item === leverage);
        return index;
    }, [
        leverage,
        leverageLevers
    ]);
    return /*#__PURE__*/ _jsx(Slider, {
        min: 0,
        max: leverageLevers.length - 1,
        color: "primary",
        markLabelVisible: true,
        value: [
            leverageValue
        ],
        showTip: false,
        // markCount={5}
        marks: leverageLevers.map((item)=>({
                value: item,
                label: `${item}x`
            })),
        onValueChange: (value)=>{
            // console.log("value", value);
            const _value = leverageLevers[value[0]];
            setLeverage(_value);
        },
        onValueCommit: (value)=>{
            const _value = leverageLevers[value[0]];
            // setLeverage(_value);
            onSave?.({
                leverage: _value
            }).catch((err)=>{
                setLeverage(maxLeverage ?? 1);
            });
        }
    });
};

//# sourceMappingURL=leverageEditor.js.map