@magicdidac/notifications

This is a package to be able to use notifications in any react application.

Install

With npm

npm i @magicdidac/notifications

With yarn

yarn add @magicdidac/notifications

Examples

These are some examples of the four types of notification.

How to use

NotificationProvider

index.tsx

import {NotificationProvider} from '@magicdidac/notifications'
...
<React.StrictMode>
  <NotificationProvider>
    <App />
  </NotificationProvider>
</React.StrictMode>
...

Properties

Property	Description	Default	Values
positionX	The horizontal position where the notifications will be shown	PositionX.right	PositionX.left | PositionX.center | PositionX.right
postionY	The vertical position where the notifications will be shown	PositionY.bottom	PositionY.top | PositionY.bottom
width	The width of the notifications	400px	string

useNotifications

This is a hook to invoke notifications

import { useNotifications } from '@magicdidac/notification'
...
const notifications = useNotifications()
...
return (
 <button onClick={() => notifications.success("Working!")}>Click Me!</button>
)
...

Functions

Every function has the same parameters

Parameter	Description	Optional	Default
message	The message to show	No
options.autoClose	Set to true to close the notification automatically over 5 seconds	Yes	true

These are all the functions

Function	Example
.success
.error
.warning
.info