import { jsx as _jsx } from "react/jsx-runtime";
import React, { useState, useEffect } from "react";
import { StyledTextField } from "../Components/TextField";
import { PropertyEditorNumberList } from "../PropertyEditing/PropertyEditorNumberList";
export { DisplayModeValueEditor as DisplayModeNumberValueEditor } from "./DisplayModeRender";
export const EditModeNumberValueEditor = React.forwardRef((props, ref) => {
    if (props.forData.list) {
        return _jsx(NumberListEditor, Object.assign({}, props, { ref: ref }), void 0);
    }
    return _jsx(NumberEditor, Object.assign({}, props, { ref: ref }), void 0);
});
const NumberEditor = React.forwardRef(({ value, forData, onUpdate }, ref) => {
    let datadef = forData;
    const [values, setValues] = useState(() => {
        return datadef.convert(value);
    });
    const [error, setError] = useState();
    useEffect(() => {
        setValues(forData.convert(value));
    }, [value, setValues, forData]);
    const onChange = (event) => {
        const validNumber = new RegExp(/^\d*\.?\d*$/);
        if (validNumber.test(event.target.value)) {
            if (event.target.value !== "") {
                let newValue = Number(event.target.value);
                if (!isNaN(newValue) && event.target.value.endsWith(".") && datadef.allowDecimals) {
                    setValues(event.target.value);
                    return;
                }
                if (datadef.upperBounds !== undefined) {
                    if (newValue < datadef.upperBounds) {
                        setValues(newValue);
                    }
                    else {
                        setError(`should be less than ${datadef.upperBounds}`);
                    }
                }
                else {
                    setValues(newValue);
                }
            }
            else {
                setValues(undefined);
            }
        }
        else {
            if (event.target.value !== "") {
                setError("only numbers are allowed");
            }
        }
    };
    return (_jsx(StyledTextField, { variant: "outlined", size: "small", value: values || "", onChange: onChange, placeholder: datadef.allowDecimals ? "0.00" : "00", type: "text", inputRef: ref, "data-testid": `ValueEditor-Edit-number`, onBlur: () => {
            if (datadef.lowerBounds === undefined ||
                (datadef.lowerBounds !== undefined && values < datadef.lowerBounds)) {
                onUpdate(values && values !== "" ? Number(values) : values);
            }
        }, inputProps: { style: { textAlign: "right" } }, error: !!error, helperText: error }, void 0));
});
const NumberListEditor = React.forwardRef(({ value, onUpdate }, ref) => {
    const field = {
        value: Array.isArray(value) && typeof value !== "string" ? value : value ? [value] : [],
    };
    const onValueUpdate = () => {
        onUpdate(field.value);
    };
    return _jsx(PropertyEditorNumberList, { editObject: field, propertyName: "value", updateCallback: onValueUpdate }, void 0);
});
//# sourceMappingURL=Number.js.map