import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import { ChevronDownIcon } from '../../../lib/icons/ChevronDown.js';
import { OffIcon } from '../../../lib/icons/Off.js';
import { ThermostatCoolIcon } from '../../../lib/icons/ThermostatCool.js';
import { ThermostatHeatIcon } from '../../../lib/icons/ThermostatHeat.js';
import { ThermostatHeatCoolIcon } from '../../../lib/icons/ThermostatHeatCool.js';
import { Menu } from '../../../lib/ui/Menu/Menu.js';
import { ThermoModeMenuOption } from '../../../lib/ui/thermostat/ThermoModeMenuOption.js';
const modes = ['heat', 'cool', 'heat_cool', 'off'];
export function ClimateModeMenu({ mode, onChange, }) {
    return (_jsx(Menu, { renderButton: ({ onOpen }) => (_jsxs("button", { onClick: onOpen, className: 'seam-climate-mode-menu-button', children: [_jsx("div", { className: 'seam-climate-mode-menu-button-icon', children: ModeIcon(mode) }), _jsx(ChevronDownIcon, {})] })), verticalOffset: -180, horizontalOffset: -32, backgroundProps: {
            className: 'seam-thermo-mode-menu',
        }, children: modes.map((m) => (_jsx(ThermoModeMenuOption, { label: t[m], icon: ModeIcon(m), isSelected: mode === m, onClick: () => {
                onChange(m);
            } }, m))) }));
}
function ModeIcon(mode) {
    switch (mode) {
        case 'heat':
            return _jsx(ThermostatHeatIcon, {});
        case 'cool':
            return _jsx(ThermostatCoolIcon, {});
        case 'heat_cool':
            return _jsx(ThermostatHeatCoolIcon, {});
        case 'off':
            return _jsx(OffIcon, {});
    }
}
const t = {
    heat: 'Heat',
    cool: 'Cool',
    heat_cool: 'Heat & Cool',
    off: 'Off',
};
//# sourceMappingURL=ClimateModeMenu.js.map