"use strict";
Object.defineProperty(exports, "__esModule", {
    value: true
});
function _export(target, all) {
    for(var name in all)Object.defineProperty(target, name, {
        enumerable: true,
        get: all[name]
    });
}
_export(exports, {
    PnLMode: function() {
        return PnLMode;
    },
    PnlInput: function() {
        return PnlInput;
    }
});
const _jsxruntime = require("react/jsx-runtime");
const _input = require("../../input");
const _react = require("react");
const _dropdown = require("../../dropdown/dropdown");
const _icon = require("../../icon");
const _hooks = require("@orderly.network/hooks");
const _utils = require("../../utils");
const _utils1 = require("@orderly.network/utils");
var PnLMode;
(function(PnLMode) {
    PnLMode["PnL"] = "PnL";
    PnLMode["OFFSET"] = "Offset";
    PnLMode["PERCENTAGE"] = "Offset%";
})(PnLMode || (PnLMode = {}));
const PnlInput = (props)=>{
    const { quote, type, quote_db = 2 } = props;
    const [mode, setMode] = (0, _hooks.useLocalStorage)("TP/SL_Mode", "Offset%");
    const percentageSuffix = (0, _react.useRef)("");
    const key = (0, _react.useMemo)(()=>{
        switch(mode){
            case "Offset":
                return `${type.toLowerCase()}_offset`;
            case "Offset%":
                return `${type.toLowerCase()}_offset_percentage`;
            default:
                return `${type.toLowerCase()}_pnl`;
        }
    }, [
        mode
    ]);
    const value = (0, _react.useMemo)(()=>{
        const val = props.values[mode];
        // console.log("val", val);
        if (val === "") return val;
        if (mode === "PnL" || mode === "Offset") {
            return (0, _utils1.commify)(val);
        }
        if (mode === "Offset%") {
            return `${new _utils1.Decimal(val).mul(100).todp(2, 4).toString()}${percentageSuffix.current}`;
        // return (Number(val) * 100).toFixed(2);
        }
        return val;
    }, [
        props.values,
        mode
    ]);
    const pnlNumber = Number(props.values.PnL);
    return /*#__PURE__*/ (0, _jsxruntime.jsx)(_input.Input, {
        prefix: mode,
        placeholder: mode === "Offset%" ? "%" : quote,
        className: (0, _utils.cn)("orderly-text-right oorderly-text-3xs orderly-caret-white placeholder:orderly-text-3xs", pnlNumber > 0 ? "orderly-text-trade-profit" : pnlNumber === 0 ? "" : "orderly-text-trade-loss"),
        fixClassName: "desktop:orderly-text-3xs",
        containerClassName: "desktop:orderly-bg-base-700 orderly-bg-base-500",
        "data-testid": props.testId,
        name: props.type,
        id: props.type,
        autoComplete: "off",
        thousandSeparator: true,
        suffix: /*#__PURE__*/ (0, _jsxruntime.jsxs)(_dropdown.DropdownMenu, {
            modal: false,
            children: [
                /*#__PURE__*/ (0, _jsxruntime.jsx)(_dropdown.DropdownMenuTrigger, {
                    asChild: true,
                    children: /*#__PURE__*/ (0, _jsxruntime.jsx)("button", {
                        className: "orderly-px-2 orderly-h-full orderly-group active:orderly-outline-0",
                        "data-testid": `${props.type}_dropdown_btn`,
                        children: /*#__PURE__*/ (0, _jsxruntime.jsx)(_icon.ArrowIcon, {
                            size: 12,
                            className: "group-data-[state=open]:orderly-rotate-180 orderly-transition orderly-text-base-contrast-54"
                        })
                    })
                }),
                /*#__PURE__*/ (0, _jsxruntime.jsxs)(_dropdown.DropdownMenuContent, {
                    align: "end",
                    className: "orderly-w-[120px]",
                    children: [
                        /*#__PURE__*/ (0, _jsxruntime.jsx)(_dropdown.DropdownMenuItem, {
                            onSelect: ()=>setMode("PnL"),
                            "data-testid": `${"PnL"}_menu_item`,
                            children: "PnL"
                        }),
                        /*#__PURE__*/ (0, _jsxruntime.jsx)(_dropdown.DropdownMenuItem, {
                            onSelect: ()=>setMode("Offset"),
                            "data-testid": `${"Offset"}_mneu_item`,
                            children: "Offset"
                        }),
                        /*#__PURE__*/ (0, _jsxruntime.jsx)(_dropdown.DropdownMenuItem, {
                            onSelect: ()=>setMode("Offset%"),
                            "data-testid": `${"Offset%"}_menu_item`,
                            children: "Offset%"
                        })
                    ]
                })
            ]
        }),
        value: value,
        onValueChange: (value)=>{
            ;
            if (mode === "Offset%" && value !== "") {
                percentageSuffix.current = value.endsWith(".") ? "." : "";
                value = new _utils1.Decimal(value).div(100).todp(4, 4).toNumber();
            }
            props.onChange(key, value);
        // setInnerValue(value);
        }
    });
};

//# sourceMappingURL=pnlInput.js.map