"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
const jsx_runtime_1 = require("react/jsx-runtime");
const antd_1 = require("antd");
const react_1 = require("react");
const theme_1 = require("@cocalc/util/theme");
function IntegerSlider({ value, onChange, min, max, maxText, defaultValue, initialValue, units, presets, disabled = false, step = 1, }) {
    function toNumber(x) {
        return typeof x === "number" ? x : min;
    }
    const [val, setVal] = (0, react_1.useState)(value ?? initialValue ?? defaultValue ?? min);
    return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsxs)(antd_1.Row, { children: [(0, jsx_runtime_1.jsx)(antd_1.Col, { span: 12, children: (0, jsx_runtime_1.jsx)(antd_1.Slider, { disabled: disabled, style: { width: "100%" }, min: min, max: max, onChange: (x) => {
                                onChange(x);
                                setVal(x);
                            }, value: value != null ? toNumber(value) : val, defaultValue: initialValue, step: step }) }), (0, jsx_runtime_1.jsxs)(antd_1.Col, { span: 12, children: [(0, jsx_runtime_1.jsx)(antd_1.InputNumber, { min: min, max: maxText ?? max, step: step, disabled: disabled, style: {
                                    marginLeft: "16px",
                                    marginBottom: "5px",
                                    minWidth: "8ex",
                                    width: "20ex",
                                }, defaultValue: initialValue, value: value ?? val, onChange: (value) => {
                                    let val = toNumber(value);
                                    if (step !== 1) {
                                        // quantize val to a multiple of step
                                        val = Math.round(val / step) * step;
                                    }
                                    onChange(val);
                                    setVal(val);
                                }, addonAfter: units }), defaultValue != null && ((0, jsx_runtime_1.jsxs)(antd_1.Button, { type: "dashed", disabled: disabled || (value ?? val) == defaultValue, style: { marginLeft: "5px" }, onClick: () => {
                                    onChange(defaultValue);
                                    setVal(defaultValue);
                                }, children: ["Default: ", defaultValue] }))] })] }), presets && ((0, jsx_runtime_1.jsx)("div", { children: presets.map((number) => ((0, jsx_runtime_1.jsx)(antd_1.Tag, { color: disabled ? theme_1.COLORS.GRAY_LL : "blue", style: { cursor: disabled ? "not-allowed" : "pointer" }, onClick: () => {
                        if (disabled)
                            return;
                        onChange(number);
                        setVal(number);
                    }, children: number }, number))) }))] }));
}
exports.default = IntegerSlider;
//# sourceMappingURL=integer-slider.js.map