import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import React from "react";
import { Option, RadioButton, RadioButtonsDefaults, Checked, Wrapper, } from "./styled";
const RadioButtons = (props) => {
    const theme = props.theme
        ? { ...RadioButtonsDefaults, ...props.theme }
        : RadioButtonsDefaults;
    if (props?.width) {
        theme.wrapperWidth = props?.width;
    }
    return (_jsx(Wrapper, { theme: theme, className: "ui-radio-buttons__wrapper", children: React.Children.map(props.children, (child, i) => {
            const key = child && child.key
                ? child.key
                : i;
            const selected = child.key === props.selected;
            return (_jsxs(Option, { theme: theme, selected: selected, className: "ui-radio-buttons__option", onClick: () => props.onChange(key?.toString() ?? ""), children: [_jsx(RadioButton, { className: "ui-radio-buttons__button", children: _jsx(Checked, { selected: selected, className: "ui-radio-buttons__checked" }) }), child] }, key));
        }) }));
};
export default RadioButtons;
//# sourceMappingURL=index.js.map