Important: This documentation covers Yarn 1 (Classic).
For Yarn 2+ docs and migration guide, see yarnpkg.com.

Package detail

@trycourier/courier-ui-inbox

trycourier2.2kMIT2.2.0TypeScript support: included

Inbox components for the Courier web UI

courier, ui, inbox, typescript, browser

readme

courier-ui-inbox

Using React? Use the @trycourier/courier-react package.

Installation

npm install @trycourier/courier-ui-inbox

Usage

Check out the Courier documentation for a full guide to Courier Inbox Web Components.

Examples

Below are a few examples of the Courier Inbox. Visit the Courier documentation for more examples.

courier-inbox

Screenshot 2025-06-25 at 2 32 30 PM
<body>

  <courier-inbox id="inbox"></courier-inbox>

  <script type="module">
    import { Courier } from '@trycourier/courier-ui-inbox';

    // Generate a JWT for your user (do this on your backend server)
    const jwt = 'eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9...'; // Replace with actual JWT

    // Authenticate the user with the inbox
    Courier.shared.signIn({
      userId: $YOUR_USER_ID,
      jwt: jwt
    });
  </script>

</body>

courier-inbox-popup-menu

Screenshot 2025-06-25 at 2 33 17 PM
<body>

  <div style="padding: 24px;">
    <courier-inbox-popup-menu id="inbox"></courier-inbox-popup-menu>
  </div>

  <script type="module">
    import { Courier } from '@trycourier/courier-ui-inbox';

    // Generate a JWT for your user (do this on your backend server)
    const jwt = 'eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9...'; // Replace with actual JWT

    // Authenticate the user with the inbox
    Courier.shared.signIn({
      userId: $YOUR_USER_ID,
      jwt: jwt
    });
  </script>

</body>

Share feedback with Courier

Have an idea or feedback about our SDKs? Let us know!

Open an issue: Courier Web Issues