5.1.0 • Published 6 years ago
veams-component-toggler v5.1.0
Toggler
Represents a simple toggler with global event binding.
Requirements
Veams >= v5.0.0
- Veams Framework.
Installation
Installation with Veams
veams install vc toggler
SASS
Variables
- $toggler-animation-duration-std {
String
} '200ms'; - $toggler-animation-easing-std {
Function
} ease-in-out;
Fields
toggler
Settings
- settings.togglerContextClasses {
String
} default - Context class. - settings.togglerClasses {
String
} - Modifier classes. - settings.togglerJsOptions {
Object
} - Options object which gets stringified. - settings.togglerJsModule {
Boolean
} - _Specify if component is a Javascript module or not. - settings.togglerJsModuleWithContext {
String
} - Reference to specific Javascript module toggler context. - settings.togglerId {
String
} - Id to reference specific toggler component instance. - settings.attributes {
Array
} - List of attributes that consist of name value pairs.
Content
- content.togglerField {
String
} - Add description.
JavaScript Options
The module gives you the possibility to override default options:
- a11yFocusKeyClass {
String
} 'a11y-focus-key' - Class for the accessibility focus key. - calculatingClass {
String
} 'is-calculating' - Class used to display calculating state. - closeClass {
String
} 'is-closed' - Class when toggler is closed. - context {
Boolean
} false - Context property that gets passed to toggler open event. - dataMaxAttr {
String
} 'data-js-height' - Dynamic max height attribute. - globalEvent {
String
} '' - Reference to global event that when triggered calls toggle method. - globalEventId {
String
} '' - Compare toggler's globaleventid with the globaleventid of the object that triggered the toggle method to determine if toggle should be run or aborted. - openClass {
String
} 'is-open' - Class when toggler is open. - setOverflow {
Boolean
} false - Specify if overflow should be set or not. - toggleTabindexElems {
String
} '' - Selector that targets elements to toggle tab-index.