OrionToggle

<o-toggle> displays a toggle, which can be used to work with boolean values.

For example, on the UX side, its use is recommanded to activate or deactivate settings or features.

Usage

ToggleColor TogglePlayground

VModels

vModelboolean = undefined

Props

autofocusboolean = undefined

clearableboolean = undefined

clearToNullboolean = undefined

colorOrion.Color = 'default'

disabledboolean = undefined

donetypingnumber = undefined

forceLabelFloatingboolean = undefined

inheritValidationStateboolean = undefined

inlineboolean = undefined

labelstring = undefined

placeholderstring = undefined

prefixFontIconstring = undefined

prefixIconOrion.Icon = undefined

readonlyboolean = undefined

requiredboolean = undefined

reverseboolean = undefined

selectOnFocusboolean = undefined

sizeOrion.Size = 'md'

suffixFontIconstring = undefined

suffixIconOrion.Icon = undefined

typestring = 'toggle'

validationstring | ((val: any) => boolean) | Orion.Validator.Rule | Orion.Validation.Rule | boolean = undefined

validationErrorMessagestring = undefined

valueboolean = undefined

Events

focus

FocusEvent

blur

FocusEvent

input

T

change

T

clear

Slots

default

No bindings

PublicInstance

hasBeenFocus

() => boolean

isFocus

() => boolean

focus

() => void

blur

Lodash.debounce

clear

() => void

setHasBeenFocus

(value: boolean) => void

isValid

() => boolean

_input

() => HTMLInputElement | undefined

sharedState

() => {
	hasBeenFocus: boolean;
	isFocus: boolean;
	isAutoFilled: boolean;
}