Toggler

Description

Represents a simple toggler component with global event binding when necessary.

---

Requirements

• @veams/core - Veams Core Framework.
• @veams/query or jquery - Veams Query or jQuery.
• @veams/component - Veams Component.
• @veams/helpers - Veams Detection Helpers.

---

Installation

veams install component toggler

veams -i c toggler

---

Fields

toggler

Settings

Option	Type	Default	Description
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

Option	Type	Default	Description
content.togglerField	String		Add description.

---

JavaScript Options

The module gives you the possibility to override default options:

Option	Type	Default	Description
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.

---

SASS Options

Option	Type	Default	Description
$toggler-animation-duration-std	String	500ms	Duration of the toggle animation.
$toggler-animation-easing-std	Function	ease-in-out	Easing method of the animation.

---