Interface ToggleButtonConfig

Configuration interface for a toggle button component.

interface ToggleButtonConfig {
    acceptsTouchWithUiHidden?: boolean;
    ariaLabel?: LocalizableText;
    cssClass?: string;
    cssClasses?: string[];
    cssPrefix?: string;
    disabled?: boolean;
    hidden?: boolean;
    id?: string;
    offAriaLabel?: LocalizableText;
    offClass?: string;
    onAriaLabel?: LocalizableText;
    onClass?: string;
    role?: string;
    tabIndex?: number;
    tag?: string;
    text?: LocalizableText;
}

Hierarchy (view full)

Properties

acceptsTouchWithUiHidden?: boolean

Specifies whether the first touch event received by the UIContainer should be prevented or not.

Default: false

ariaLabel?: LocalizableText

WCAG20 standard for defining info about the component (usually the name)

It is recommended to use onAriaLabel and offAriaLabel for toggle buttons as the component can then update them as the button is used.

If both ariaLabel and onAriaLabel are set, onAriaLabel is used.

cssClass?: string

The CSS classes of the component. This is usually the class from where the component takes its styling.

cssClasses?: string[]

Additional CSS classes of the component.

cssPrefix?: string

A prefix to prepend all CSS classes with.

disabled?: boolean

Specifies if the component is enabled (interactive) or not. Default: false

hidden?: boolean

Specifies if the component should be hidden at startup. Default: false

id?: string

The HTML ID of the component. Default: automatically generated with pattern 'ui-id-{guid}'.

offAriaLabel?: LocalizableText

The aria label that marks the off-state of the button.

offClass?: string

The CSS class that marks the off-state of the button.

onAriaLabel?: LocalizableText

The aria label that marks the on-state of the button.

onClass?: string

The CSS class that marks the on-state of the button.

role?: string

Specifies the component role for WCAG20 standard

tabIndex?: number

WCAG20 requirement for screen reader navigation

tag?: string

The HTML tag name of the component. Default: 'div'

The text as string or as localize callback on the button.