import { Callout } from "@wfp/react"
The Callout
component is a flexible and customizable notification component used to display a variety of messages to users, such as alerts, warnings, information, and success messages.
<Callout title="Your Title" subtitle="Your subtitle" kind="info" // ...other props > Your content here </Callout>;
<Callout title="Network Error" subtitle="There was an error connecting to the server" kind="error" onClose={() => console.log("Closed")} > Please check your internet connection and try again. </Callout>;
role
prop is set appropriately to ensure screen readers interpret the notification correctly.iconDescription
and statusIconDescription
props to provide meaningful descriptions for icons.kind
values to indicate the nature of the notification (e.g., error, success).