Basit Toast

Basit Toast

Kode SumberDemo

BASIT TOAST 🔔🔔

a basit (simple) toast like notification 🔔🔔.

Daftar Isi 📚


Instalasi


yarn add basit-toast
npm install basit-toast

BasitToastComponents

import 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 ExampleBasitToast

useBasitToast

import 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 ExampleUseBasitToast

basittoast

import 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

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

How to Contribute ?


  1. clone this repository
  2. install dependencies
yarn
  1. checkout to new branch
git checkout -B new-feature
  1. modify and push in your branch
  2. add pull request and done.

Licence

MIT.

Teknologi yang digunakan

J
JavaScript

Bagiin?