# @mocat/ui

> User Interface for Mocat

Latest version **0.3.0** (published 2022-01-01) · MIT license · 0 weekly downloads

## Install

```sh
npm install @mocat/ui
pnpm add @mocat/ui
yarn add @mocat/ui
bun add @mocat/ui
```

## Health

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

Positive: no vulnerabilities.

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

Negative: abandoned.

## Facts

| | |
|---|---|
| Version | 0.3.0 |
| Published | 2022-01-01 |
| First published | 2020-11-11 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | none |
| Module format | CommonJS |
| Dependencies | 9 |
| Unpacked size | 97.6 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| GitHub stars | 29 |
| Maintainers | lawvs |

## Links

- npm: https://www.npmjs.com/package/@mocat/ui
- Repository: https://github.com/lawvs/mocat
- Homepage: https://github.com/lawvs/mocat#readme
- Issues: https://github.com/lawvs/mocat/issues
- npm.io page: https://npm.io/package/@mocat/ui

## Dependencies (9)

- [react](https://npm.io/package/react.md) ^17.0.2
- [lodash](https://npm.io/package/lodash.md) ^4.17.21
- [react-dom](https://npm.io/package/react-dom.md) ^17.0.2
- [react-use](https://npm.io/package/react-use.md) ^17.3.2
- [@mui/material](https://npm.io/package/@mui/material.md) ^5.2.5
- [@emotion/react](https://npm.io/package/@emotion/react.md) ^11.7.1
- [@emotion/styled](https://npm.io/package/@emotion/styled.md) ^11.6.0
- [@mocat/interceptor](https://npm.io/package/@mocat/interceptor.md) ^0.3.0
- [@mui/icons-material](https://npm.io/package/@mui/icons-material.md) ^5.2.5

## Recent versions

- 0.3.0 (latest) — 2022-01-01
- 0.2.5 — 2021-11-28
- 0.2.4 — 2020-12-07
- 0.2.3 — 2020-12-01
- 0.2.2 — 2020-11-26
- 0.2.1 — 2020-11-18
- 0.2.0 — 2020-11-11

## README

# Mocat UI

the core UI of Mocat. It's a React based UI which you can initialize with a function. You can configure it by providing a provider API.

## Usage

First you need to install `@mocat/ui` into your app.

```
yarn add @mocat/ui --dev
```

Then you can initialize the UI like this:

```ts
import { EventEmitter2 } from 'eventemitter2'
import { create as createUI } from '@mocat/ui'
import type { UIOptions, MockEventEmitter } from '@mocat/ui'

const roolEl = document.querySelector('#root')
const eventEmitter = new EventEmitter2() as MockEventEmitter

const uiOptions: UIOptions = {
  eventEmitter,
  el: roolEl, // optional
  // ...
}

const ui = createUI(uiOptions)

ui.unmount()
```

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