showToast
Displays a toast notification when invoked from a dashboard page or widget within a page.
Use the config parameter to:
- Control the toast's appearance.
- Set callback functions to run when the user sees or clicks on the toast.
- Display a clickable call-to-action that is displayed inside the toast.
Only one toast can be shown at a time. Requests to display toasts may be queued and the toast may not be displayed immediately, if another toast is currently shown.
Note: When the timeout parameter is set to none (a toast that the user needs to close manually, or removed via code) the toast is rendered into the page layout and pushes the rest of the page down. When timeout is set to normal, the toast appears on top of other content on the page.
Signature
Copy
Parameters
| Name | Type | Description |
|---|---|---|
config | ToastConfig | Toast configuration options. |
ToastConfig Object
| Name | Type | Description |
|---|---|---|
action | ToastAction | Optional. Object representing a call-to-action that's displayed in the toast. |
message | string | Text that appears in the toast. |
onCloseClick | Function | Optional. Callback function to run when the toast is closed by clicking its close button. |
onToastSeen | Function | Optional. Callback function to run when the toast is seen by the user. |
priority | string | Priority of the toast. If several toasts are triggered at the same time, they're displayed in the order of their priority levels. Default: normal. Options: low, normal, high. |
timeout | string | Whether the toast should disappear after a predefined timeout (6 seconds). Options: none, normal. |
type | string | Toast color and message type. Default: standard. Options: standard: Blue notification toast. success: Green success toast. warning: Yellow warning toast. error: Red error toast. |
ToastAction Object
| Name | Type | Description |
|---|---|---|
onClick | Function | Callback function to run after the call-to-action is clicked. |
removeToastOnClick | boolean | Whether to remove the toast after the call-to-action is clicked. |
text | string | Text that appears in the call-to-action. |
uiType | string | The type of call-to-action. Options: button, link |
Returns
Copy
The object returned by showToast contains a function that can be used to remove the toast.
Examples
To set up a dashboard client, refer to the setup guide.
Display a success toast when a product is updated
Copy
Display an error toast with a 'Learn more' link
Copy
Remove a displayed toast
Copy
Did this help?