Toast
function Toast(__namedParameters): Element;Defined in: packages/react/src/components/Toast.tsx:32
The Toast component is a rudimentary way to display a message to the user. This message should be short lived and not require user interaction. For example, displaying the current connection state like ConnectionStateToast
Parameters
| Parameter | Type |
|---|---|
__namedParameters | ToastProps |
Returns
Element
Example
// Basic — show a short-lived status message.
<Toast>
Connecting...
</Toast>
// Advanced — branch on room connection state.
function ConnectionNotice() {
const state = useConnectionState();
if (state === "connected") return null;
return <Toast>{state === "reconnecting" ? "Reconnecting..." : "Connecting..."}</Toast>;
}
<VoiceRoom agent={agent}>
<ConnectionNotice />
</VoiceRoom>