import { jsx as _jsx } from "react/jsx-runtime";
import React from "react";
import Table from "../table";
import { Wrapper } from "./styled";
import RadioButton from "../radio-button";
const RadioButtons = ({ onChange: rawOnChange, header, className, rows: rawRows, checkedValue }) => {
    const [value, setValue] = React.useState();
    React.useEffect(() => {
        if (checkedValue && typeof checkedValue === "string" && !value) {
            setValue(checkedValue);
            return;
        }
        if (checkedValue && rawRows.length && !value) {
            setValue(rawRows[0].optionValue);
            return;
        }
    }, [rawRows, checkedValue, value]);
    const onClick = React.useCallback((value) => {
        setValue(value);
        rawOnChange(value);
    }, [rawOnChange]);
    const rows = React.useMemo(() => {
        if (rawRows.length < 1) {
            return [];
        }
        const keys = Object.keys(rawRows[0]).filter(key => (key !== "id" && key !== "optionValue" && key !== "optionTitle"));
        return rawRows.map((row, i) => {
            return {
                id: row.id,
                option: (_jsx(RadioButton, { onClick: (v) => setValue(v), value: row.optionValue, title: row.optionTitle, className: "ui-radio-buttons__button" })),
                ...keys.reduce((res, key) => ({
                    ...res,
                    [key]: row[key]
                }), {})
            };
        });
    }, [rawRows, value]);
    return (_jsx(Wrapper, { className: `ui-radio-buttons ${className ?? ""}`, children: _jsx(Table, { header: header, rows: rows, className: "ui-radio-buttons__table" }) }));
};
export default RadioButtons;
//# sourceMappingURL=index.js.map