Package Exports
- codex-notifier
This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (codex-notifier) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.
Readme
JavaScript Notifier
Lightweight notification module for websites
Instalation
Install via npm
Install package
npm install codex-notifier --save
Connect with Webpack
Require module in your application
const notifier = require('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
orprompt
.Alert
by defaultstyle
— just add'cdx-notify--' + style
class. We have some default styles:success
anderror
time
— notification expire time in ms. Only foralert
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 pressedcancelHandler
— 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 parametercancelHandler
— fires when notification was closedplaceholder
— input placeholderdefault
— input default valueinputType
— type of input (text by default)
Examples
notifier.show({
message: 'Refresh the page'
})
notifier.show({
message: 'Message was sent',
style: 'success',
time: 5000
})
notifier.show({
message: 'Sorry, server is busy now',
style: 'error'
})
notifier.show({
message: 'Delete account?',
type: 'confirm',
okText: 'Yes',
cancelText: 'Oh, wait',
okHandler: account.delete
})
notifier.show({
message: 'Enter your email',
type: 'prompt',
okText: 'Enter',
okHandler: checkEmail,
inputType: 'email',
placeholder: 'team@ifmo.su'
})
Custom styles
You can easily customize notifications appearance. Read more about it here