0.2.4 • Published 3 years ago

toastique-toast v0.2.4

Weekly downloads
-
License
MIT
Repository
github
Last release
3 years ago

toastique-toast

You can try the demo here.

Installation

$ npm install --save toastique-toast
$ yarn add toastique-toast

The gist

import { toast, ToastList } from 'toastique-toast'

function App() {
  const [toasts, setToasts] = useState([])

  const handleShowToast = () => {
    toast.addToast('success', {
      heading: "Wow",
      content: "I'm an success toast!",
      position: "bottom-left"
    })
    setToasts(toast.getToasts())
  }

  return (
    <div>
      <button type='button' onClick={handleShowToast}>Show</button>
      {toasts.length > 0 && <ToastList toast={toast} toastList={toasts}/>}
    </div>
  );
}

export default App;
  }

options

OptionDescriptiondefaulttypeacceptable values
headingtoast title-String-
contenttoast text content-String-
colortoast color#9f86c0 (info)String-
#fee440 (warning)
#d62828 (error)
#57cc99 (success)
positiontoast position on the screen String'top-right'String'top-right' / bottom-right' / 'top-left' / 'bottom-left'
autoCloseTimetoast duration5000Number-
animationtoast appearance'from bottom'String'from bottom' / from right side'
'space between toasts'space beetween each toast'medium'String'small' / 'medium' / 'large'
0.2.4

3 years ago

0.2.3

3 years ago

0.2.2

3 years ago

0.2.1

3 years ago

0.2.0

3 years ago

0.1.9

3 years ago

0.1.8

3 years ago

0.1.7

3 years ago

0.1.6

3 years ago

0.1.5

3 years ago

0.1.4

3 years ago

0.1.3

3 years ago

0.1.2

3 years ago

0.1.1

3 years ago

0.1.0

3 years ago