Quick start

You need two things to render the chat: a server URL (where the AW Chat backend runs) and a session token (a JWT your server mints for the signed-in user — see Auth).

Web

pnpm add @aw-chat/web

import { AWChat } from "@aw-chat/web";

export function Support() {
  return (
    <div style={{ height: "100dvh" }}>
      <AWChat
        userId="user-123"
        sessionToken={session.token}
        serverUrl="https://chat.antarcticwallet.com"
        telemetry={{
          appVersion: "6.1.4",
          hardwareId: "web",
          osVersion: navigator.userAgent,
          deviceLang: "ru",
        }}
        theme="light"
        locale="ru"
      />
    </div>
  );
}

<AWChat /> fills its container — give the parent a height.

React Native

pnpm add @aw-chat/react-native react-native-svg

import { AWChat } from "@aw-chat/react-native";

export function SupportScreen() {
  return (
    <AWChat
      userId="user-123"
      sessionToken={session.token}
      serverUrl="https://chat.antarcticwallet.com"
      telemetry={{ appVersion: "6.1.4", hardwareId: "iPhone15,2", osVersion: "iOS 17.4", deviceLang: "ru" }}
      fcmToken={fcmToken}        // enables mobile push
      theme="light"
      locale="ru"
    />
  );
}

react-native-svg is a peer dependency (bundled with Expo).

Telegram Mini App

Use @aw-chat/web and pass telegramChatId to enable Telegram push and deep links:

<AWChat
  userId="user-123"
  sessionToken={session.token}
  serverUrl="https://chat.antarcticwallet.com"
  telemetry={{ appVersion: "6.1.4", hardwareId: "tma", osVersion: "tma", deviceLang: "ru" }}
  telegramChatId={tg.initDataUnsafe.user.id.toString()}
/>

Try it without a backend

Both SDKs ship a mock mode (demo prop) that runs on built-in sample data with no network — ideal for design review:

<AWChat demo userId="demo" sessionToken="" serverUrl="" telemetry={{ /* … */ }} />

The examples/ folder in the repo has runnable web and React Native demos with a Mock/Live toggle.

Next

• Props reference — every prop explained.
• Auth & sessions — how to mint the token.
• Theming & locale.