open-index/open-npm huggingface dataset:
npm package: @mgcm/react
Description: A simplified layer on top of @mgcm/api to use it in a React based widget.
Author: Nordeck IT + Consulting GmbH
Latest version: 2.0.2
Deprecated: Package no longer supported. Contact Support at https://www.npmjs.com/support for more info.

# `@mgcm/react`

[![@mgcm/react](https://img.shields.io/npm/v/@mgcm/react)](https://www.npmjs.com/package/@mgcm/react)

This is package that provides a Widget API intergration for React apps.

## Usage

Install it with:

```bash
yarn add @mgcm/react
```

### Providing the Widget API to React components

While this package contains a `<WidgetApiProvider>` you probably don't want to use this package most of the time.
Prefer using [`@mgcm/mui`](../mui/) which internally use this package to share functionality.

### Acessing the Widget API

Once the Widget API is provided to React components, use the `useWidgetApi` hook to access it:

```typescript
import { useWidgetApi } from '@mgcm/react';

const widgetApi = useWidgetApi();
```

### Mocking the Widget API

Most of the time you will use `<MuiWidgetApiProvider>` to initialize and provide the `WidgetApi` to your react components.
However, if you want to mock it in tests, you can use `<WidgetApiMockProvider>` to provide a mocked version:

```tsx
import { WidgetApiMockProvider } from '@mgcm/react';

<WidgetApiMockProvider value={widgetApi}>
  /* Your child components */
</WidgetApiMockProvider>;
```