Support widget

import { MedianSupport } from "@mediansh/widget";

<MedianSupport apiKey="median_pk_..." />;

With an identity route, pass its path instead:

<MedianSupport identity="/api/median/identity" />;

Mount it once, near the root of your app. It places itself in the bottom right corner. Do not wrap it in dynamic(). The reply renderer already loads on its own when the pointer reaches the launcher, when the panel opens, or when the page is idle with an answered thread behind the button.

What a visitor sees in a thread is on Conversations. Opening the panel from your own code is on Control from code.

Props

The props type is MedianSupportProps. launcher takes a SupportLauncherKind, "bubble" | "hidden".

Diagnostics, screenshots, telemetry and appState limits are on Context and diagnostics. Destinations are on Pages and highlights.

MedianUser

Every field is optional.

const { data: session } = useSession();

<MedianSupport
  apiKey="median_pk_..."
  user={
    session
      ? {
          name: session.user.name,
          email: session.user.email,
          avatarUrl: session.user.image,
          metadata: { plan: session.org.plan, seats: String(session.org.seats) },
        }
      : undefined
  }
/>;

• Nothing is stored until the visitor sends a message. The first message saves user, and later changes sync as they happen. Pass user on every render, as soon as your session has it.
• A new name, email or avatarUrl replaces the stored one. A missing field or an empty string leaves the stored value alone.
• metadata is replaced as a whole. Keys missing from the newest object are removed. An empty object is ignored.
• Metadata keys display as labels. signed_up_at and signedUpAt both show as Signed up at. Values show exactly as sent, so format dates and numbers yourself.
• Invalid values are cut or dropped. They never block a message.
• Without a name or an email, your team sees the visitor as Customer #12.

Signing id and signing out are on Identity.

Dashboard settings

These change every installed widget without a redeploy.

Powered by Median has no prop. Only the dashboard switch hides it. The widget checks every 60 seconds and shows the line again if the check fails or the paid period ends.

Troubleshooting

Errors inside the widget never break your page. The widget hides itself and prints to the console.

Errors

Printed in every build.

Warnings

Printed only when your bundle sets process.env.NODE_ENV to development.

Median: support read status could not be synced and Median: the picture the agent asked for could not be uploaded print in every build and need no action.

No console message