a basit (simple) toast like notification 🔔🔔.
yarn add basit-toastnpm install basit-toastimport React, { useState } from 'react'
import { BasitToast } from 'basit-toast'
import 'basit-toast/dist/basit-toast.css'
const ExampleBasitToast = () => {
const [openToast, setOpenToast] = useState(false)
const handleClick = () => {
setOpenToast(true)
}
return (
<>
<BasitToast
isOpen={openToast}
handleClose={() => setOpenToast(false)}
position='bottomcenter'
severity='errors'
handleCloseDuration={3000}
message='Your errors toast here !'
/>
<button onClick={handleClick}>Click</button>
</>
)
}
export default ExampleBasitToastimport React from 'react'
import { useBasitToast } from 'basit-toast'
import 'basit-toast/dist/basit-toast.css'
const ExampleUseBasitToast = () => {
const { defaults } = useBasitToast()
const handleClick = () => {
defaults('Hallo', 'bottomcenter')
}
return <button onClick={handleClick}>click</button>
}
export default ExampleUseBasitToastimport React from 'react'
import { basittoast } from 'basit-toast'
import 'basit-toast/dist/basit-toast.css'
const ExampleBasitToast = () => {
const handleClick = () => {
basittoast.info('HELLO', 'bottomcenter', 3000)
}
return <button onClick={handleClick}>click</button>
}
export default ExampleBasitToast| Props | Type | Required |
|---|---|---|
| isOpen | boolean | true |
| severity ["default", "success", "warning", "errors", "info"] | string | true |
| position ["topright", "topleft", "topcenter", "bottomright", "bottomleft", "bottomcenter",] | string | true |
| message | string | true |
| handleClose | func | true |
| handleCloseDuration | number | false |
- clone this repository
- install dependencies
yarn- checkout to new branch
git checkout -B new-feature- modify and push in your branch
- add pull request and done.
MIT.