# be-vigilant

> Add mutation observer to element, and broadcast mutations.

Latest version **0.0.27** (published 2022-11-21) · MIT license · 0 weekly downloads

## Install

```sh
npm install be-vigilant
pnpm add be-vigilant
yarn add be-vigilant
bun add be-vigilant
```

## Health

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

Positive: has types; esm support; no vulnerabilities; high quality score.

Warnings: low downloads; pre 1.0.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 0.0.27 |
| Published | 2022-11-21 |
| First published | 2021-10-15 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | bundled |
| Module format | ESM + CommonJS |
| Dependencies | 2 |
| Unpacked size | 13.2 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| GitHub stars | 0 |
| Author | Bruce B. Anderson |
| Maintainers | bahrus |
| Keywords | web-components, custom-elements |

## Links

- npm: https://www.npmjs.com/package/be-vigilant
- Repository: https://github.com/bahrus/be-vigilant
- Homepage: https://github.com/bahrus/be-vigilant#readme
- Issues: https://github.com/bahrus/be-vigilant/issues
- npm.io page: https://npm.io/package/be-vigilant

## Dependencies (2)

- [be-hive](https://npm.io/package/be-hive.md) 0.0.77
- [be-watching](https://npm.io/package/be-watching.md) 0.0.21

## Recent versions

- 0.0.27 (latest) — 2022-11-21
- 0.0.26 — 2022-11-16
- 0.0.25 — 2022-10-30
- 0.0.24 — 2022-10-16
- 0.0.23 — 2022-10-16
- 0.0.22 — 2022-10-16
- 0.0.21 — 2022-10-14
- 0.0.20 — 2022-10-05
- 0.0.19 — 2022-10-01
- 0.0.18 — 2022-09-15
- 0.0.17 — 2022-09-06
- 0.0.16 — 2022-08-28
- 0.0.15 — 2022-08-27
- 0.0.14 — 2022-08-27
- 0.0.13 — 2022-08-27
- … 13 more at https://npm.io/package/be-vigilant/versions

## README

# be-vigilant

Add mutation observer to element.

[![Playwright Tests](https://github.com/bahrus/be-vigilant/actions/workflows/CI.yml/badge.svg?branch=baseline)](https://github.com/bahrus/be-vigilant/actions/workflows/CI.yml)
[![NPM version](https://badge.fury.io/js/be-vigilant.png)](http://badge.fury.io/js/be-vigilant)

Size, including be-decorated framework:

[![How big is this package in your project?](https://img.shields.io/bundlephobia/minzip/be-vigilant?style=for-the-badge)](https://bundlephobia.com/result?p=be-vigilant)

Size of new code:

<img src="http://img.badgesize.io/https://cdn.jsdelivr.net/npm/be-vigilant?compression=gzip">



Use case I:  Many UI libraries are built around communicating between elements via events.  be-vigilant translates mutation changes into events.

```html
<div be-vigilant=my-event-name>
...
</div>
```

Event my-event-name is fired from the div element when the direct children of the div element change.

If the value of the attribute isn't specified, the default event name is be-vigilant-changed:

```html
<div be-vigilant>
...
</div>
```


Use case II:  be-vigilant also provides a brute-force way of sniffing out [be-decorated](https://github.com/bahrus/be-decorated) adorned elements, even behind nooks and crannies of the DOM.  be-decorated behaviors search for elements based on css observing, but sometimes those aren't always picked up.

For example:

```html
<select>
    <template be-repeated></template>
</select>
```

Using the standard ways be-decorated elements are registered via css animation queries, this template simply won't be registered.

be-vigilant will cause it to register, if instructed to do so:

```html
<select be-vigilant='{
    "forBs": true
}'>
    <template be-repeated></template>
</select>
```

To fine tune how the mutation observer is configured:

```html
<div be-vigilant='{
    "subtree": true,
    "dispatchInfo": "my-event-name"
}'>
...
</div>
```

Another option, matchActions, provides the ability to specify different event names, based on css match tests on the mutated elements.

## CDN

To use from a CDN:

```html
<script type='module' crossorigin='anonymous'>
    import 'https://esm.run/be-vigilant';
</script>
```

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