import { jsx as _jsx } from "react/jsx-runtime";
import cx from "classnames";
import { useIntl } from "react-intl";
import { Dropdown, DropdownButton, SingleSelectListItem, UiListbox, } from "@gooddata/sdk-ui-kit";
import { messages } from "../messages.js";
const options = [
    {
        title: messages.alertSensitivityLow.id,
        id: "LOW",
    },
    {
        title: messages.alertSensitivityMedium.id,
        id: "MEDIUM",
    },
    {
        title: messages.alertSensitivityHigh.id,
        id: "HIGH",
    },
];
export function AlertSensitivitySelect({ id, selectedSensitivity = "MEDIUM", onSensitivityChange, overlayPositionType, closeOnParentScroll, }) {
    const selectedOption = options.find((o) => o.id === selectedSensitivity);
    const intl = useIntl();
    return (_jsx("div", { className: "gd-alert-sensitivity-select", children: _jsx(Dropdown, { closeOnParentScroll: closeOnParentScroll, overlayPositionType: overlayPositionType, autofocusOnOpen: true, renderButton: ({ isOpen, toggleDropdown, buttonRef, dropdownId }) => {
                return (_jsx(DropdownButton, { id: id, value: selectedOption ? intl.formatMessage({ id: selectedOption.title }) : "", onClick: toggleDropdown, className: cx("gd-edit-alert-sensitivity-select__button s-alert-sensitivity-select"), buttonRef: buttonRef, dropdownId: dropdownId, isOpen: isOpen, accessibilityConfig: {
                        ariaExpanded: isOpen,
                        popupType: "listbox",
                    } }));
            }, renderBody: ({ closeDropdown, ariaAttributes }) => {
                const listboxItems = options.map((option) => ({
                    type: "interactive",
                    id: option.id,
                    stringTitle: intl.formatMessage({ id: option.title }),
                    data: option,
                }));
                return (_jsx(UiListbox, { shouldKeyboardActionStopPropagation: true, shouldKeyboardActionPreventDefault: true, dataTestId: "s-alert-sensitivity-select-list", items: listboxItems, selectedItemId: selectedSensitivity, onSelect: (item) => {
                        if (selectedSensitivity !== item.id) {
                            onSensitivityChange(item.id);
                        }
                    }, onClose: closeDropdown, ariaAttributes: ariaAttributes, InteractiveItemComponent: ({ item, isSelected, onSelect, isFocused }) => {
                        return (_jsx(SingleSelectListItem, { title: item.stringTitle, isSelected: isSelected, isFocused: isFocused, onClick: onSelect, className: "gd-alert-sensitivity-select__list-item" }));
                    } }));
            } }) }));
}
//# sourceMappingURL=AlertSensitivitySelect.js.map