import { CSSResult, TemplateResult } from "lit";
import { RadioSelectionController } from "../controllers/RadioSelectionController.js";
import CheckedElement from "./CheckedElement.js";
import '../../define/ui/ui-ripple.js';
import UiRipple from "../effects/ripple.js";
import { EndPressConfig } from "../controllers/ActionController.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 {
    static get styles(): CSSResult | CSSResult[];
    protected selection: RadioSelectionController;
    protected get _validationError(): string;
    protected ripple: Promise<UiRipple | null>;
    protected 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