/**
* The `auro-radio-group` element is used to group a set `auro-radio` elements.
* @customElement auro-radio-group
*
* @csspart radio-group - Apply css to the fieldset element in the shadow DOM
* @slot {HTMLSlotElement} legend - Allows for the legend to be overridden.
* @slot {HTMLSlotElement} optionalLabel - Allows overriding the optional display text "(optional)", which appears next to the label.
* @slot {HTMLSlotElement} helpText - Allows for the helper text to be overridden.
* @event auroFormElement-validated - Notifies that the element has been validated.
* @event input - Notifies every time the value prop of the element is changed.
*/
export class AuroRadioGroup extends LitElement {
static get styles(): import("lit").CSSResult[];
static get properties(): {
/**
* Defines whether the component will be on lighter or darker backgrounds.
* @type {'default' | 'inverse'}
* @default 'default'
*/
appearance: "default" | "inverse";
/**
* If true, all radio buttons will be disabled.
*/
disabled: {
type: BooleanConstructor;
reflect: boolean;
};
/**
* If true, sets persistent validity to `customError` and sets `setCustomValidity` = attribute value.
*/
error: {
type: StringConstructor;
reflect: boolean;
};
/**
* Indicates whether the legend slot is set or not.
* @private
*/
hasLegend: {
type: BooleanConstructor;
reflect: boolean;
attribute: boolean;
};
/**
* If true, displays radio buttons horizontally.
*/
horizontal: {
type: BooleanConstructor;
};
/**
* If true, disables auto-validation on blur.
*/
noValidate: {
type: BooleanConstructor;
reflect: boolean;
};
/**
* DEPRECATED - use `appearance="inverse"` instead.
*/
onDark: {
type: BooleanConstructor;
reflect: boolean;
};
/**
* Specifies the current selected radio button.
*/
optionSelected: {
type: ObjectConstructor;
};
/**
* Populates the `required` attribute on the element. Used for client-side validation.
*/
required: {
type: BooleanConstructor;
reflect: boolean;
};
/**
* Sets a custom help text message to display for all validityStates.
*/
setCustomValidity: {
type: StringConstructor;
};
/**
* Custom help text message to display when validity = `customError`.
*/
setCustomValidityCustomError: {
type: StringConstructor;
};
/**
* Custom help text message to display when validity = `valueMissing`.
*/
setCustomValidityValueMissing: {
type: StringConstructor;
};
/**
* Indicates whether the radio group is in a dirty state (has been interacted with).
* @private
*/
touched: {
type: BooleanConstructor;
reflect: boolean;
attribute: boolean;
};
/**
* Specifies the `validityState` this element is in.
*/
validity: {
type: StringConstructor;
reflect: boolean;
};
/**
* Specifies the current value of the selected radio button.
*/
value: {
type: StringConstructor;
};
};
/**
* This will register this element with the browser.
* @param {string} [name="auro-radio-group"] - The name of the element that you want to register.
*
* @example
* AuroRadioGroup.register("custom-radio-group") // This will register this element to
*
*/
static register(name?: string): void;
_initializeDefaults(): void;
appearance: string;
disabled: boolean;
horizontal: boolean;
required: boolean;
validity: any;
value: any;
optionSelected: EventTarget;
onDark: boolean;
touched: boolean;
hasLegend: boolean;
/**
* @private
*/
private validation;
/**
* @private
*/
private index;
/**
* @private
*/
private max;
/**
* @private
*/
private runtimeUtils;
/**
* @private
*/
private helpTextTag;
firstUpdated(): void;
/**
* Method for handling of selection of a radio element.
* @private
* @param {Event} event - The trigger event tied to this function.
* @returns {void}
*/
private handleSelection;
/**
* Method handles radio element blur.
* @private
* @returns {void}
*/
private handleRadioBlur;
/**
* LitElement lifecycle method. Called after the DOM has been updated.
* @param {Map} changedProperties - Keys are the names of changed properties, values are the corresponding previous values.
* @returns {void}
*/
updated(changedProperties: Map): void;
/**
* Resets component to initial state.
* @returns {void}
*/
reset(): void;
/**
* Validates value.
* @param {boolean} [force=false] - Whether to force validation.
*/
validate(force?: boolean): void;
/**
* Method handles the reset event from a radio element.
* @private
* @returns {void}
*/
private resetRadio;
/**
* Method for handling the attributes of each radio input.
* @private
* @returns {void}
*/
private handleItems;
items: Element[];
/**
* Method for handling slot content changes.
* @private
* @returns {void}
*/
private handleSlotChange;
/**
* Method for handling legend slot changes.
* @private
* @returns {void}
*/
private handleLegendSlotChange;
/**
* Method for initializing the tab index of the checked radio input.
* @private
* @returns {void}
*/
private initializeIndex;
/**
* Method for handling a newly selected radio input.
* @private
* @param {Event} event - The trigger event tied to this function.
* @returns {void}
*/
private handleToggleSelected;
/**
* Method for selecting a radio input.
* @private
* @param {Number} index - The value of the element's index attribute.
* @returns {void}
*/
private selectItem;
/**
* Method for selecting the next radio input.
* @private
* @param {Number} index - The value of the element's index attribute.
* @param {String} moveDirection - Arrow key pressed by user.
* @returns {void}
*/
private selectNextItem;
/**
* Method for handling a keydown event.
* @private
* @param {Event} event - The trigger event tied to this function.
* @returns {void}
*/
private handleKeyDown;
render(): import("lit-html").TemplateResult;
}
import { LitElement } from "lit";