"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 lodash_1 = require("lodash");
const misc_1 = require("@cocalc/util/misc");
const { Option } = antd_1.Select;
function SelectWithDefault({ value, defaultValue, initialValue, onChange, options, style, }) {
    const [val, setVal] = (0, react_1.useState)(value ?? initialValue ?? defaultValue ?? (0, lodash_1.keys)(options)[0] ?? "");
    const v = [];
    if ((0, misc_1.is_array)(options)) {
        // @ts-ignore
        for (const value of options) {
            v.push((0, jsx_runtime_1.jsx)(Option, { value: value, children: value }, value));
        }
    }
    else {
        for (const value in options) {
            v.push((0, jsx_runtime_1.jsx)(Option, { value: value, children: options[value] }, value));
        }
    }
    return ((0, jsx_runtime_1.jsxs)("div", { style: { width: "100%" }, children: [(0, jsx_runtime_1.jsx)(antd_1.Select, { showSearch: true, value: val, onChange: (value) => {
                    onChange(value);
                    setVal(value);
                }, style: { width: "30ex", maxWidth: "100%", ...style }, children: v }), defaultValue != null && ((0, jsx_runtime_1.jsx)(antd_1.Button, { type: "dashed", disabled: (value ?? val) == defaultValue, style: { marginLeft: "5px" }, onClick: () => {
                    onChange(defaultValue);
                    setVal(defaultValue);
                }, children: (value ?? val) == defaultValue ? ("Default") : ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: ["Changed from ", (0, misc_1.is_array)(options) ? defaultValue : options[defaultValue]] })) }))] }));
}
exports.default = SelectWithDefault;
//# sourceMappingURL=select-with-default.js.map