# Виджет Моночата в React (Vite, Create React App)

Самый простой способ — `index.html` перед `</body>`:

```html
<script src="https://monochat.ru/widget/ВАШ_WIDGET_KEY.js" async></script>
```

Или компонентом (один раз в корне приложения):

```jsx
import { useEffect } from "react";

export function MonochatWidget({ widgetKey }) {
  useEffect(() => {
    const src = `https://monochat.ru/widget/${widgetKey}.js`;
    if (document.querySelector(`script[src="${src}"]`)) return;
    const s = document.createElement("script");
    s.src = src;
    s.async = true;
    document.body.appendChild(s);
  }, [widgetKey]);
  return null;
}

// App.jsx
<MonochatWidget widgetKey={import.meta.env.VITE_MONOCHAT_WIDGET_KEY} />
```

Или npm: `npm i monochat-widget` → `import { MonochatWidget } from "monochat-widget/react"`. См. [npm](https://monochat.ru/docs/npm).

Ключ виджета публичный, его можно держать в клиентском коде.