import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import './SelectionSwitcher.scss';
import Icon from '../Icon';
import Typography from '../Typography';
const SelectionSwitcher = ({ options, selected, onChange, className = '', width = 160, height = 30, iconName = 'purple_tick_icon', }) => {
    const containerStyle = {
        width,
        height,
    };
    return (_jsx("div", { className: `context_toggle ${className}`, style: containerStyle, children: options.map((option) => {
            const isActive = selected === option.value;
            return (_jsxs("button", { className: `toggle_item ${isActive ? 'active' : ''}`, onClick: () => onChange(option.value), type: "button", children: [_jsx(Typography, { children: option.label }), isActive && iconName && _jsx(Icon, { name: iconName })] }, option.value));
        }) }));
};
export default SelectionSwitcher;
//# sourceMappingURL=SelectionSwitcher.js.map