reusables-notify
v0.1.2
Published
A composable toast notification package for React.
Maintainers
whyte25Readme
reusables-notify
A composable toast notification package for React.
Links
- Docs: https://reusables.vercel.app/docs/components/notify
- GitHub: https://github.com/whyte25/reusables/tree/main/packages/notify
- Issues: https://github.com/whyte25/reusables/issues
Install
npm install reusables-notifyUsage
import { toast, ToastProvider } from "reusables-notify"
export function App() {
return (
<ToastProvider>
<button onClick={() => toast.success("Saved")}>Show toast</button>
</ToastProvider>
)
}API
import {
ToastProvider,
toast,
Toast,
statusStyles,
toastVariants,
toastPositionVariants,
toastActionVariants,
progressBarVariants,
} from "reusables-notify"Examples
Basic Toast
toast.info("Event has been created")
toast.success("Saved")
toast.error("Something went wrong")Toast Provider
import { ToastProvider } from "reusables-notify"
export default function RootLayout({
children,
}: {
children: React.ReactNode
}) {
return (
<html lang="en">
<body>
<ToastProvider>{children}</ToastProvider>
</body>
</html>
)
}Promise Toast
import { toast } from "reusables-notify"
toast.promise(
async () => {
const response = await fetch("/api/save")
return response.json()
},
{
loading: "Saving...",
success: () => "Saved",
error: "Save failed",
}
)shadcn
Prefer source files in your app? Install the shadcn registry version instead:
npx shadcn@latest add "https://reusables.vercel.app/r/notify"License
MIT