import { TemplateResult } from 'lit';
import { RadioSelectionController } from '../../../controllers/RadioSelectionController.js';
import CheckedElement from '../../checkbox/internals/CheckedElement.js';
import UiRipple from '../../ripple/internals/ripple.js';
import { EndPressConfig } from '../../../controllers/ActionController.js';
import '../../ripple/ui-ripple.js';
import '../../focus-ring/ui-focus-ring.js';
/**
 * A form-associated radio button.
 *
 * ```html
 * <label>
 *  <api-radio name="fruit" value="apple"></api-radio>
 *  Apple
 * </label>
 * <label>
 *  <api-radio name="fruit" value="banana"></api-radio>
 *  Banana
 * </label>
 * <label>
 *  <api-radio name="fruit" value="mango"></api-radio>
 *  Mango
 * </label>
 * ```
 *
 * The radio supports keyboard navigation as the `<input type="radio"/>` does.
 * Radio buttons are grouped by name. This means if another button with the same name
 * is selected, all other with the same name are deselected. It is possible to use
 * two radio inputs with the same name in different forms in the same document.
 * The grouping only affects inputs inside the form.
 */
export default class RadioElement extends CheckedElement {
    protected selection: RadioSelectionController;
    protected readonly _validationError = "Please select one of these options.";
    protected accessor ripple: Promise<UiRipple | null>;
    protected accessor showRipple: boolean;
    protected readonly getRipple: () => Promise<UiRipple | null>;
    endPress(config: EndPressConfig): void;
    connectedCallback(): void;
    handleClick(e: MouseEvent): void;
    protected _setChecked(value?: boolean): void;
    handleKeyDown(e: KeyboardEvent): Promise<void>;
    handleKeyUp(e: KeyboardEvent): Promise<void>;
    protected handleFocus(): Promise<void>;
    protected handleBlur(): Promise<void>;
    protected render(): TemplateResult;
    protected renderRipple: () => TemplateResult;
}
//# sourceMappingURL=RadioElement.d.ts.map