# app-usage-events-emitter-react

> A set of types, type checks, and type guards for simpler, safer, and easier to read code.

Latest version **1.0.1** (published 2023-07-16) · 0 weekly downloads

## Install

```sh
npm install app-usage-events-emitter-react
pnpm add app-usage-events-emitter-react
yarn add app-usage-events-emitter-react
bun add app-usage-events-emitter-react
```

## Health

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

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

Warnings: low downloads; no esm support.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 1.0.1 |
| Published | 2023-07-16 |
| First published | 2023-07-16 |
| Weekly downloads | 0 |
| TypeScript types | bundled |
| Module format | CommonJS |
| Node | >=8.0.0 |
| Dependencies | 15 |
| Unpacked size | 147 KB |
| Known vulnerabilities | 0 (+1 in 1 direct dependencies) |
| Install scripts | no |
| GitHub stars | 0 |
| Author | mhetrics |
| Maintainers | uladkasach |
| Keywords | types, type guards, guards, type checks, checks, type, checking, typescript |

## Links

- npm: https://www.npmjs.com/package/app-usage-events-emitter-react
- Repository: https://github.com/mhetrics/app-usage-events-emitter-react
- Issues: https://github.com/mhetrics/app-usage-events-emitter-react/issues
- npm.io page: https://npm.io/package/app-usage-events-emitter-react

## Dependencies (15)

- [pako](https://npm.io/package/pako.md) 2.1.0
- [uuid](https://npm.io/package/uuid.md) 9.0.0
- [react](https://npm.io/package/react.md) 17.0.2
- [date-fns](https://npm.io/package/date-fns.md) 2.30.0
- [type-fns](https://npm.io/package/type-fns.md) 0.9.0
- [@types/pako](https://npm.io/package/@types/pako.md) 2.0.0
- [@types/react](https://npm.io/package/@types/react.md) 17.0.62
- [cross-sha256](https://npm.io/package/cross-sha256.md) 1.2.0
- [object-sizeof](https://npm.io/package/object-sizeof.md) 2.6.3
- [domain-objects](https://npm.io/package/domain-objects.md) 0.10.3
- [simple-async-tasks](https://npm.io/package/simple-async-tasks.md) 1.1.1
- [with-simple-caching](https://npm.io/package/with-simple-caching.md) 0.11.1
- [simple-in-memory-cache](https://npm.io/package/simple-in-memory-cache.md) 0.3.0
- [simple-in-memory-queue](https://npm.io/package/simple-in-memory-queue.md) 1.1.6
- [simple-localstorage-cache](https://npm.io/package/simple-localstorage-cache.md) 1.0.1

## Alternatives

- [@openai/codex-sdk](https://npm.io/package/@openai/codex-sdk.md) — 731.4K weekly downloads
- [babel-plugin-transform-react-jsx](https://npm.io/package/babel-plugin-transform-react-jsx.md) — 565.0K weekly downloads
- [babel-helper-remove-or-void](https://npm.io/package/babel-helper-remove-or-void.md) — 508.5K weekly downloads
- [@pnpm/store-controller-types](https://npm.io/package/@pnpm/store-controller-types.md) — 186.9K weekly downloads
- [react-native-signature-canvas](https://npm.io/package/react-native-signature-canvas.md) — 155.6K weekly downloads

## Recent versions

- 1.0.1 (latest) — 2023-07-16
- 1.0.0 — 2023-07-16

## README

# app-usage-events-emitter-react

utility to easily emit app-usage-events from your app to the mhetrics platform

# install

```ts
npm install @mhetrics/app-usage-events-emitter-react
```

# use

### autocaptured events

Add the provider to your react app. This provider is responsible for
- instantiating the autocapture listeners
- emitting the app-usage-events
- configuring the capture-server authorization

```tsx
import { AppUsageEventsEmitter } from '@mhetrics/app-usage-events-emitter-react';

<AppUsageEventsEmitter
  clientKey={config.mhetrics.clientKey}
  captureHost={config.mhetrics.captureHost}
/>
```

With that, your app will automatically be emitting
- network events (e.g., rest requests)
- browser events (e.g., load, unload, focus, blur, navigation)
- runtime events (e.g., console.log, console.warn, console.error)
- activity events (e.g., mouse, touch, scroll, keyboard)


### domain events

Your app is now also configured to emit domain events. Domain events are custom events produced by your application's domain logic (a.k.a. business logic). Here is an example of how to emit domain events

```ts
import { emitDomainEvent } from '@mhetrics/app-usage-events-emitter-react';

await emitDomainEvent({
  /**
   * the name of this event
   */
  name: 'conversion', // a conversion occurred

  /**
   * the scope of the domain that this event applies to
   */
  scope: 'storefront', // a conversion from the storefront product

  /**
   * any adhoc details we want to associate with this event
   */
  details: {
    promocode: 'WINT23',
  }
})
```

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