# preact-delegate

> Preact delegate DOM events

Latest version **1.1.1** (published 2017-03-03) · MIT license · 0 weekly downloads

## Install

```sh
npm install preact-delegate
pnpm add preact-delegate
yarn add preact-delegate
bun add preact-delegate
```

## Health

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

Positive: no vulnerabilities.

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

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 1.1.1 |
| Published | 2017-03-03 |
| First published | 2017-03-02 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | none |
| Module format | CommonJS |
| Dependencies | 0 |
| Known vulnerabilities | 0 |
| Install scripts | no |
| GitHub stars | 19 |
| Author | Arthur Stolyar |
| Maintainers | nekr |
| Keywords | preact, delegate, dom, events |

## Links

- npm: https://www.npmjs.com/package/preact-delegate
- Repository: https://github.com/NekR/preact-delegate
- Homepage: https://github.com/NekR/preact-delegate#readme
- Issues: https://github.com/NekR/preact-delegate/issues
- npm.io page: https://npm.io/package/preact-delegate

## Alternatives

- [babylon](https://npm.io/package/babylon.md) — 5.1M weekly downloads
- [csscolorparser](https://npm.io/package/csscolorparser.md) — 3.7M weekly downloads
- [expr-eval-fork](https://npm.io/package/expr-eval-fork.md) — 1.5M weekly downloads
- [@leeoniya/ufuzzy](https://npm.io/package/@leeoniya/ufuzzy.md) — 247.7K weekly downloads
- [xml-parser](https://npm.io/package/xml-parser.md) — 78.4K weekly downloads

## Recent versions

- 1.1.1 (latest) — 2017-03-03
- 1.1.0 — 2017-03-03
- 1.0.0 — 2017-03-02

## README

# preact-delegate

Delegate DOM events with Preact (since Preact doesn't do that by default).

## Install

```sh
npm install preact-delegate --save-dev
```

## Usage

Just wrap your root element from where to capture events with `DelegateContainer` and then wrap individual elements which should receive events with `DelegateElement`. See example:

```js
import { Component } from 'preact';
import { DelegateContainer, DelegateElement } from 'preact-delegate';

class MyComponent extends Component {
  constructor(...args) {
    super(...args);

    this.onClick = (e) => {
      console.log(e.target);
    };
  }

  render({ items }) {
    return <DelegateContainer>
      <div class="my-component">
        {items.map(item => (
          <div class="my-item">
            <DelegateElement click={this.onClick}>
              <button type="button" class="my-button">{ item.text }</button>
            </DelegateElement>
          </div>
        ))}
      </div>
    </DelegateContainer>
  }
}
```

## LICENSE

[MIT](LICEMSE.md)

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