var __rest = (this && this.__rest) || function (s, e) {
    var t = {};
    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
        t[p] = s[p];
    if (s != null && typeof Object.getOwnPropertySymbols === "function")
        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
                t[p[i]] = s[p[i]];
        }
    return t;
};
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import React, { useState, useEffect, useRef, useId } from "react";
import { cn } from "@utils";
import { Radio } from "../radio";
import { radioGroupVariants, radioGroupItemVariants, radioGroupItemLabelVariants } from "./radioGroupVariants";
/**
 * RadioGroup component for grouping radio button options
 */
export const RadioGroup = ({ size = "md", options, onChange, className, selectedValue, disabled, radioPlacement = "start", variant = "outline" }) => {
    const [selected, setSelected] = useState(selectedValue !== null && selectedValue !== void 0 ? selectedValue : "");
    const inputId = useRef(useId());
    const onChangeHandler = (event) => {
        const newSelected = event.currentTarget.checked ? event.target.value : "";
        setSelected(newSelected);
        onChange === null || onChange === void 0 ? void 0 : onChange(newSelected);
    };
    useEffect(() => {
        if (selectedValue) {
            setSelected(selectedValue);
        }
    }, [selectedValue]);
    return (_jsx("div", { "data-testid": "radio-group", className: cn(radioGroupVariants({ variant }), { "bg-secondary-50 dark:bg-secondary-700 dark:text-secondary-400": disabled && variant === "text" }, className), children: options === null || options === void 0 ? void 0 : options.map((option, index) => {
            const { id, name, value, label, className: optionClassName, disabled: optionDisabled } = option, restOptionProps = __rest(option, ["id", "name", "value", "label", "className", "disabled"]);
            const isChecked = selected === value;
            const isDisabled = disabled || optionDisabled;
            const renderRadio = (_jsx(Radio, Object.assign({ size: size, name: name, id: id || inputId.current, value: value, onChange: onChangeHandler, disabled: isDisabled, checked: isChecked, className: cn({ "mt-[2px]": size === "sm" }) }, restOptionProps)));
            return (_jsxs("label", { htmlFor: id || inputId.current, className: cn(radioGroupItemVariants({
                    variant,
                    size,
                    checked: isChecked && variant === "outline",
                    disabled: isDisabled && variant === "outline"
                }), { "pt-0": index !== 0 && variant === "text" }, optionClassName), children: [radioPlacement === "start" && renderRadio, label && (_jsx("div", { className: cn(radioGroupItemLabelVariants({ disabled: isDisabled })), children: label })), radioPlacement === "end" && renderRadio] }, index));
        }) }));
};
RadioGroup.displayName = "RadioGroup";
//# sourceMappingURL=radioGroup.js.map