https://github.com/codex-team/js-notifier
Notifications for websites
https://github.com/codex-team/js-notifier
Last synced: 6 months ago
JSON representation
Notifications for websites
- Host: GitHub
- URL: https://github.com/codex-team/js-notifier
- Owner: codex-team
- License: mit
- Created: 2017-06-26T17:01:19.000Z (almost 8 years ago)
- Default Branch: master
- Last Pushed: 2020-10-10T11:43:41.000Z (over 4 years ago)
- Last Synced: 2024-04-23T17:32:41.634Z (about 1 year ago)
- Language: JavaScript
- Size: 169 KB
- Stars: 49
- Watchers: 6
- Forks: 10
- Open Issues: 2
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# JavaScript Notifier
Lightweight notification module for websites
## Instalation
### Install via NPM/Yarn
Install package
```shell
npm install codex-notifier --save
```
```shell
yarn add codex-notifier
```
#### Require module
```javascript
const notifier = require('codex-notifier');
```
```javascript
import notifier from 'codex-notifier';
import {ConfirmNotifierOptions, NotifierOptions, PromptNotifierOptions} from 'codex-notifier';
```
## Usage
Module has only one public method — `show`.
You should pass there object with notification properties
#### General properties
- `message` — notification message (can contains HTML)
- `type` — type of notification: `alert`, `confirm` or `prompt`. `Alert` by default
- `style` — just add `'cdx-notify--' + style` class. We have some default styles: `success` and `error`
- `time` — notification expire time in ms. Only for `alert` notifies expires (8s by default)
#### Confirm notifications properties
- `okText` — text for confirmation button (*Confirm* by default)
- `cancelText` — text for cancel button (*Cancel* by default)
- `okHandler` — fires when *Confirm* button was pressed
- `cancelHandler` — fires when *Cancel* button was pressed or notification was closed
#### Prompt notifications properties
- `okText` — text for submit button (*Ok* by default)
- `okHandler` — fires when submit button was pressed. Gets input's value as a parameter
- `cancelHandler` — fires when notification was closed
- `placeholder` — input placeholder
- `default` — input default value
- `inputType` — type of input (text by default)
## Examples
```javascript
notifier.show({
message: 'Refresh the page'
})
```
```javascript
notifier.show({
message: 'Message was sent',
style: 'success',
time: 5000
})
```
```javascript
notifier.show({
message: 'Sorry, server is busy now',
style: 'error'
})
```
```javascript
notifier.show({
message: 'Delete account?',
type: 'confirm',
okText: 'Yes',
cancelText: 'Oh, wait',
okHandler: account.delete
})
```
```javascript
notifier.show({
message: 'Enter your email',
type: 'prompt',
okText: 'Enter',
okHandler: checkEmail,
inputType: 'email',
placeholder: '[email protected]'
})
```
## Custom styles
You can easily customize notifications appearance. Read more about it [here](https://github.com/codex-team/js-notifier/blob/master/docs/styles.md)