import * as _emotion_react_jsx_runtime from '@emotion/react/jsx-runtime';
import { InputHTMLAttributes, ReactNode } from 'react';
import { Props } from '../@types/Props.js';
import { ThemeRadio } from './theme.js';

interface RadioProps extends InputHTMLAttributes<HTMLInputElement>, Props {
    id?: string;
    /**
     * Whether radio button is checked. This is necessary when using the
     * [controlled approach](https://reactjs.org/docs/forms.html#controlled-components)
     * (recommended) to form state management.
     *
     * _Note: if you pass the `checked` prop, you MUST also pass an `onChange`
     * handler, or the field will be rendered as read-only._
     */
    checked?: boolean;
    /**
     * When using the [uncontrolled approach](https://reactjs.org/docs/uncontrolled-components.html),
     * use defaultChecked to indicate the initially checked button.
     */
    defaultChecked?: boolean;
    /**
     * Appears to the right of the radio button. If a visible label is
     * undesirable (e.g. for layout reasons) use `aria-label` instead.
     *
     * If label is omitted, supporting text will not appear either.
     */
    label?: string | ReactNode;
    /**
     * Additional text or a component that appears below the label
     */
    supporting?: string | ReactNode;
    /**
     * Partial or complete theme to override the component's colour palette.
     * The sanctioned colours have been set out by the design system team.
     * The colours which can be changed are:
     *
     *  `borderSelected`<br>
     *  `borderUnselected`<br>
     *  `borderHover`<br>
     *  `borderError`<br>
     *  `fillSelected`<br>
     *  `fillUnselected`<br>
     *  `textLabel`<br>
     *  `textSupporting`<br>
     */
    theme?: Partial<ThemeRadio>;
}
/**
 * [Storybook](https://guardian.github.io/storybooks/?path=/story/source_react-components-radio--default-default-theme) •
 * [Design System](https://theguardian.design/2a1e5182b/p/2891dd-radio-button/b/46940d) •
 * [GitHub](https://github.com/guardian/csnx/tree/main/libs/@guardian/source/src/react-components/radio/Radio.tsx) •
 * [NPM](https://www.npmjs.com/package/@guardian/source)
 *
 * Radio buttons allow users to make a single selection from a set of options.
 *
 * The following themes are supported: `default`, `brand`
 */
declare const Radio: ({ id, label: labelContent, value, supporting, checked, defaultChecked, cssOverrides, theme, ...props }: RadioProps) => _emotion_react_jsx_runtime.JSX.Element;

export { Radio };
export type { RadioProps };