# wuibuttonbehavior

> Generic button WizUI behavior

Latest version **0.2.0** (published 2015-07-13) · MIT license · 0 weekly downloads

## Install

```sh
npm install wuibuttonbehavior
pnpm add wuibuttonbehavior
yarn add wuibuttonbehavior
bun add wuibuttonbehavior
```

## Health

**Score 15/100 (F)** — status: abandoned.

Positive: no vulnerabilities.

Warnings: low downloads; no types; no esm support; pre 1.0.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 0.2.0 |
| Published | 2015-07-13 |
| First published | 2015-07-13 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | none |
| Module format | CommonJS |
| Dependencies | 0 |
| Known vulnerabilities | 0 |
| Install scripts | no |
| GitHub stars | 0 |
| Author | Wizcorp |
| Maintainers | micky2be |

## Links

- npm: https://www.npmjs.com/package/wuibuttonbehavior
- Repository: https://github.com/wizui/wuiButtonBehavior
- Homepage: http://wizui.github.io/
- Issues: https://github.com/wizui/wuiButtonBehavior/issues
- npm.io page: https://npm.io/package/wuibuttonbehavior

## Recent versions

- 0.2.0 (latest) — 2015-07-13

## README

# wuiButtonBehavior
[![Circle CI](https://circleci.com/gh/WizUI/wuiButtonBehavior/tree/master.svg?style=svg)](https://circleci.com/gh/WizUI/wuiButtonBehavior/tree/master)

## What it is

wuiButtonBehavior is a behavior made for [WizUI]. It behaves like an HTML5 button would be expected to.
Setting the behavior to a [WuiDom] would make it able to listen for various events.

wuiButtonBehavior will attach methods and events to the WuiDom element;

```javascript
var button = new WuiDom('div');
wuiButtonBehavior(button);
```
[See the full example at the end of the file](#how-to-use)


## Methods

### enable

The enable method can be called to enable tap interaction.

```javascript
function Button() {
    WuiDom.call(this);
    wuiButtonBehavior(this);
}
```

### disable

The disable method can be called to prevent tap interaction on the element.

```javascript
button.disable();
```

### tap

The tap method will trigger the a successful cycle of tap events.


## Events

### tap

This event occurs when a successful tap by the user happened.
Most likely used to trigger action.


### tapstart

This event occurs when the user first presses the WuiDom.
Most likely used for design purpose.


### tapend

This event occurs when the user release the WuiDom he was pressing or when the tap got cancelled.
It receives a boolean as parameter which will be set to `true` if the tap has been cancelled.
Most likely used for design purpose.


### enabled

The enabled event is called when the tap behavior is enabled, such as by the enable method.


### disabled

The disabled event is called when the tap behavior is disabled, such as by the disable method.


## How to use

See the example below:

```javascript
var inherits = require('util').inherits;
var WuiDom = require('WuiDom');
var wuiButtonBehavior = require('wuiButtonBehavior');

function Button(label) {
    WuiDom.call(this, 'div', { text: label, className: 'button' });
    wuiButtonBehavior(this);

    this.on('tapstart', function () {
        this.addClassNames('pressed');
    });

    this.on('tapend', function () {
        this.delClassNames('pressed');
    });

    this.on('disabled', function () {
        this.addClassNames('disabled');
    });

    this.on('enabled', function () {
        this.delClassNames('disabled');
    });
}

inherits(Button, WuiDom);

var button = new Button('My Button');

button.on('tap', function () {
    doSomething();
});
```

[WizUI]: http://wizui.github.com "WizUI"
[WuiDom]: https://github.com/WizUI/WuiDom "WuiDom"

---
_Source: https://npm.io/package/wuibuttonbehavior · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._