ToastProvider
The ToastProvider component is a context provider that manages the display of toast notifications across your application. Toasts are brief, non-intrusive messages that appear temporarily, often used to inform users of the success or failure of an action, such as saving data or completing a task. By centralizing the management of toasts, the ToastProvider ensures that notifications are consistent and easy to control throughout the app. Use cases include displaying success messages after form submissions, error notifications during data processing, or informational updates in real-time applications.
useToast
The useToast hook is a custom React hook that provides a simple interface for triggering toast notifications from anywhere within your application. By using this hook, developers can easily show success, error, or informational messages in response to user actions. This is particularly useful in forms, data submissions, or real-time applications where immediate feedback is necessary. For instance, in an e-commerce site, useToast can be used to show a confirmation message when a product is added to the cart or an error message when a payment fails.
Code
//In your top level.root entry file, (incase of CRA based apps, it would be src/index.js) import { ToastProvider } from "@lumina-design/core/Toast"; const root = ReactDOM.createRoot(document.getElementById("root")); root.render( <ToastProvider> <App /> </ToastProvider> );