import React, { forwardRef } from 'react';
import cx from 'classnames';
import { Form } from 'react-bootstrap';
import type { FormCheckProps } from 'react-bootstrap';

const CLASS_NAME = 'FormRadio';

interface RadioProps extends Omit<FormCheckProps, 'type' | 'as'> {
    testId?: string;
}

/**
 * Radio are round interactive UI elements used to turn an option on or off. They allow the user to select a single item from a set.
 *
 * @type atom
 * @status live
 * @tags form-elements
 */
export const Radio = forwardRef<HTMLInputElement, RadioProps>(
    ({ className, testId = CLASS_NAME, ...bsProps }, ref) => (
        <Form.Check
            type="radio"
            className={cx(CLASS_NAME, className)}
            data-testid={testId}
            ref={ref}
            {...bsProps}
        />
    )
);