"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.InlineOptionSelect = void 0;
const tslib_1 = require("tslib");
const jsx_runtime_1 = require("react/jsx-runtime");
const react_1 = tslib_1.__importDefault(require("react"));
const core_1 = require("@material-ui/core");
const InlineTextEdit_1 = require("./InlineTextEdit");
function InlineOptionSelect(props) {
    const [anchorEl, setAnchorEl] = react_1.default.useState(null);
    const handleClick = (event) => {
        event.stopPropagation();
        if (!props.readOnly) {
            setAnchorEl(event.currentTarget);
        }
    };
    const handleClose = () => {
        setAnchorEl(null);
    };
    function renderMenuItem(option) {
        return ((0, jsx_runtime_1.jsx)(core_1.MenuItem, { onClick: (event) => {
                event.stopPropagation();
                setAnchorEl(null);
                if (props.onEdit)
                    props.onEdit(option);
            }, children: option }, option));
    }
    return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(InlineTextEdit_1.InheritLabel, { onClick: handleClick, "data-testid": "InlineOptionSelect", children: props.text }), (0, jsx_runtime_1.jsx)(core_1.Menu, { anchorEl: anchorEl, open: Boolean(anchorEl), keepMounted: true, onClose: handleClose, children: props.options.map((option) => {
                    return renderMenuItem(option);
                }) })] }));
}
exports.InlineOptionSelect = InlineOptionSelect;
//# sourceMappingURL=InlineOptionSelect.js.map