5.1.0 • Published 6 years ago

veams-component-toggler v5.1.0

Weekly downloads
2
License
MIT
Repository
github
Last release
6 years ago

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.

5.1.0

6 years ago

5.0.0

7 years ago

4.0.2

7 years ago