@acrool/react-toaster
v3.1.9
Published
Toaster library based for Reactjs
Downloads
208
Maintainers
Readme
Acrool React Toaster
Features
- Supports 5 status colors: default, success, info, warning, danger
- Call via global method
- Configurable disappearance delay seconds
- Plug and unplug using
@acrool/react-portal
andframer-motion
Install
yarn add @acrool/react-toaster
Usage
add in your index.tsx
import "@acrool/react-toaster/dist/index.css";
add in your App.tsx
import {ToasterPortal} from "@acrool/react-toaster";
const App = () => {
return (
<div>
<BaseUsed/>
<ToasterPortal defaultTimeout={3000}/>
</div>
);
};
then in your page
import {toast} from '@acrool/react-toaster';
const Example = () => {
return (
<div>
<button type="button" onClick={() => toast({message: 'useToaster message'})}>
useToaster message
</button>
</div>
);
};
- toast
- toast.success
- toast.info
- toast.warning
- toast.danger
There is also a example that you can play with it: