import { jsx, jsxs } from 'react/jsx-runtime';
import Icon from '../Icon/Icon.js';
import Typography from '../Typography/Typography.js';

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 { SelectionSwitcher as default };
//# sourceMappingURL=SelectionSwitcher.js.map
