Notinoti

Notinoti is a simple notification system for your vuejs application
Notinoti es un sistema de notificaciones simple para tu aplicación vuejs

- Installation
- Usage
- slots

Importants requirements

- Vue 3
- Vite
- Tailwindcss

Installation

##
npm install notinoti

Usage

1. Import the component and put it in your App.vue template

``html
// App.vue



`

- You can customize the NotiProvider' component by passing props to the NotiProvider component

// class object for the notification container, title, msg


- classProp example

`javascript

const classProp = {
container: 'container-class',
title: 'title-class',
msg: 'msg-class'
}

`

2. Use the addNotification method to add a notification in every component you want

`javascript
import { useNotification } from 'notinoti'

const { addNotification } = useNotification()

addNotification({
title: 'Hello',
message: 'This is a notification',
type: 'success'
})

`
3. method addNotification() options

`typescript

type NotiType = 'success' | 'info' | 'warning' | 'error' | 'default';
type NotiPosition = 'topRight'| 'topCenter' | 'topLeft' | 'bottomRight' | 'bottomCenter' | 'bottomLeft' | 'centerCenter' | 'centerLeft' | 'centerRight';


export interface NotinotiProps {
msg: string;
showTitle?: boolean;
title?: string;
icon?: string;
timeout?: number; // duration in ms
position?: NotiPosition;
type?: NotiType;
resetStyle?: boolean;
closeOnClick?: boolean;
closeOnHover?: boolean;
showCloseButton?: boolean;
showIcon?: boolean;
showProgressBar?: boolean;
}
`

slots

`html

``