'use strict';

var React = require('react');
var classnames = require('classnames');
var Text = require('./Text-cjs.js');

var styles = {"radioGroup":"KZfSK2vhTyI-","directionHorizontal":"PbxbMNv8uwM-","input":"w1Rr3bk2t5g-","label":"gN41T07x0l0-","description":"Ke2WKKuvmRo-","children":"JZOA-psW-FI-","spinning":"_54fzkHxkCbs-"};

/**
 * For rendering props only. To make updates to
 * the real RadioOption, look at InternalRadioOption
 */
function RadioOption({ children }) {
    return React.createElement(React.Fragment, null, children);
}
function InternalRadioOption({ value, name, label, description, disabled, checked, children, onChange, }) {
    const inputId = `${value.toString()}_${React.useId()}`;
    const shouldRenderIndependentChildren = label && children;
    return (React.createElement("div", null,
        React.createElement("input", { onChange: handleChange, type: "radio", name: name, value: value, disabled: disabled, checked: checked, id: inputId, className: styles.input, "aria-describedby": description ? `${inputId}_description` : undefined }),
        React.createElement("label", { className: styles.label, htmlFor: inputId }, label ? label : children),
        description && (React.createElement("div", { className: styles.description, id: `${inputId}_description` },
            React.createElement(Text.Text, { variation: "subdued", size: "small" }, description))),
        shouldRenderIndependentChildren && (React.createElement("div", { className: styles.children, id: `${inputId}_children` }, children))));
    function handleChange() {
        onChange(value);
    }
}

function RadioGroup({ children, value, ariaLabel, onChange, name = React.useId(), direction = "vertical", }) {
    const className = classnames(styles.radioGroup, {
        [styles.directionHorizontal]: direction === "horizontal",
    });
    return (React.createElement("div", { role: "radiogroup", "aria-label": ariaLabel, className: className }, React.Children.map(children, option => (React.createElement(InternalRadioOption, Object.assign({ checked: value === option.props.value, name: name, onChange: handleChange }, option.props), option.props.children)))));
    function handleChange(newValue) {
        if (newValue !== value) {
            onChange(newValue);
        }
    }
}

exports.RadioGroup = RadioGroup;
exports.RadioOption = RadioOption;
