"use client";
import { useCallback, useEffect, useRef } from "react";
import { Controls } from "../../../components";
import { format, parseNumber } from "../../../lib/utils";
import { Numberpad } from "../../../parts";
export default function Currency(props) {
    const step = props?.step || 1;
    const max = parseNumber(props?.max);
    const ref = useRef(props?.value?.toString() || "");
    const handleClick = useCallback((e) => {
        if (typeof props?.button?.onClick === "function")
            props?.button?.onClick(e, ref.current);
    }, [ref]);
    const handleChange = (e, v) => {
        const value = ref.current;
        let input = "";
        if (v === "+") {
            const number = value === "" ? 0 : parseFloat(format(value, "number").toString());
            input = number + step;
        }
        else if (v === "-") {
            const number = value === "" ? 0 : parseFloat(format(value, "number").toString());
            input = number - step;
            if (input <= 0)
                input = "0";
        }
        else
            input = v;
        if (v === ".") {
            input = value === "" ? "0." : value + ".";
        }
        v = parseNumber(v);
        if (!isNaN(max) && max > 0 && !isNaN(v) && v > 0 && v >= max)
            input = max;
        if (typeof props?.onChange === "function")
            props?.onChange(e, input);
    };
    useEffect(() => {
        ref.current = props?.value?.toString() || "";
        handleChange(null, ref.current);
    }, [props?.value]);
    useEffect(() => {
        if (props?.input) {
            const ref = props?.input === true ? window : props?.input?.current;
            const input = (e) => {
                if (e.key === "." || e.key === "+" || e.key === "-" || e.code === "NumpadAdd" || e.code === "NumpadSubtract")
                    handleChange(e, e.code === "NumpadAdd" ? "+" : e.code === "NumpadSubtract" ? "-" : e.key);
            };
            ref.addEventListener("keydown", input);
            return () => ref.removeEventListener("keydown", input);
        }
    }, [props?.input]);
    return (<Numberpad {...props} value={props?.value} onChange={(e, v) => handleChange(e, v)} right={{
            children: (<>
                        <Controls.Button onClick={(e) => handleChange(e, "+")} icon={"plus-small-bold"} scale={0.875}/>
                        <Controls.Button onClick={(e) => handleChange(e, "-")} icon={"minus-small-bold"} scale={0.875}/>
                        <Controls.Button onClick={(e) => handleChange(e, ".")} icon={"dot"} scale={0.875}/>
                        <Controls.Button {...props?.button} onClick={(e) => handleClick(e)} color={props?.button?.color} style={{
                    ...props?.button?.style,
                    ...(props?.reverse && { order: -1 }),
                }}>
                            {props?.button?.children || "OK"}
                        </Controls.Button>
                    </>),
        }}/>);
}
//# sourceMappingURL=Currency.jsx.map