# Visibility & launchers

> Open, close, show, and hide the messenger — or wire up your own custom launcher button.

Source: https://docs.useclad.ai/visibility-launchers

---

All visibility methods are safe to call before or after boot; calls made before
the widget is ready are queued.

```ts
await chat.open();   // open the messenger panel
await chat.close();  // close the panel (launcher stays visible)

chat.show();         // show all widget surfaces
chat.hide();         // hide all widget surfaces

chat.showLauncher();
chat.hideLauncher();
chat.setLauncherVisible(false);
```

### Custom launcher

Hide the built‑in launcher and trigger the widget from your own button. Unread
counts are still delivered via events.

```ts
const chat = SupportChat.createChat({
  workspaceId: "{YOUR_WORKSPACE_ID}",
  widgetId: "{YOUR_WIDGET_ID}",
  launcher: { showUnreadBadge: false },
});

chat.hideLauncher();

document.querySelector("#support-button")
  ?.addEventListener("click", () => chat.open());

const off = chat.on("unread:change", ({ payload }) => {
  document.querySelector("#support-badge")!.textContent = String(payload.count);
});
```
