PHPackages                             tobento/js-notifier - PHPackages - PHPackages  [Skip to content](#main-content)[PHPackages](/)[Directory](/)[Categories](/categories)[Trending](/trending)[Leaderboard](/leaderboard)[Changelog](/changelog)[Analyze](/analyze)[Collections](/collections)[Log in](/login)[Sign up](/register)

1. [Directory](/)
2. /
3. [Mail & Notifications](/categories/mail)
4. /
5. tobento/js-notifier

ActiveLibrary[Mail & Notifications](/categories/mail)

tobento/js-notifier
===================

Simple JavaScript notifier to show notifications.

1.0.1(1y ago)0312MITJavaScript

Since Dec 28Pushed 1y ago1 watchersCompare

[ Source](https://github.com/tobento-ch/js-notifier)[ Packagist](https://packagist.org/packages/tobento/js-notifier)[ Docs](https://www.tobento.ch)[ RSS](/packages/tobento-js-notifier/feed)WikiDiscussions 1.x Synced 1mo ago

READMEChangelog (2)DependenciesVersions (3)Used By (2)

JS Notifier
===========

[](#js-notifier)

Simple JavaScript notifier to show notifications.

Table of Contents
-----------------

[](#table-of-contents)

- [Getting started](#getting-started)
    - [Browser support](#browser-support)
- [Documentation](#documentation)
    - [Basic Usage](#basic-usage)
    - [Parameters](#parameters)
    - [Methods](#methods)
    - [Stacks](#stacks)
- [Credits](#credits)

---

Getting started
===============

[](#getting-started)

Browser support
---------------

[](#browser-support)

Modern browser only.

Documentation
=============

[](#documentation)

Basic Usage
-----------

[](#basic-usage)

**1. Include CSS/JS**

```

```

**2. Import Notifier And Send A Notification**

```
import notifier from "notifier.js";

const notification = notifier.send({
    status: 'success',
    title: 'Lorem',
    text: 'Lorem ipsum.',
});
```

Parameters
----------

[](#parameters)

ParameterValueDescription`action``{title: "View ...", url: "https://example.com/slug", classes: ["button"]}`You may set an action displayed using an `a` element.`autotimeout``5000`, `null`If defined, the notification will be closed after the milliseconds passed.`classes``["notification", "notification-fade"]`You may set custom CSS classes to the notification element.`icon``""`You may add a custom icon.`id``"ID"`A unique notification id.`removeDelay``500`Milliseconds after the notification will be removed. You may change this value if you have a custom animation, other than fade in and out.`showCloseButton``false`If `false` close button will not be displayed at all.`showIcon``false`If `false` icon will not be displayed at all.`stack``"name"`A stack name. See [stack section](#stacks) to learn more.`status``"success"`, `"error"`, `"warning"`, `"info"`The notification status.`text``"Lorem ipsum"`A text to be displayed.`title``"Lorem"`A title to be displayed.All parameters are optional but you must specify `title` or `text` at least.

### Methods

[](#methods)

```
import notifier from "notifier.js";

const notification = notifier.send({
    status: 'success',
    title: 'Lorem',
    autotimeout: null,
});

// close after 2000 milliseconds:
notification.close(2000);
```

### Stacks

[](#stacks)

By default, notifications will be pushed to the `default` stack which will be positioned top right. You may create more stacks by the following way:

**1. Create the CSS class**

Name your class like .notification-stack-`stack-name`:

```
.notification-stack-secondary {
  position: fixed;
  bottom: 1rem;
  left: 1rem;
  z-index: 50;
  width: 400px;
}
```

**2. Define the stack within you notifiaction**

```
import notifier from "notifier.js";

const notification = notifier.send({
    stack: 'secondary',
    title: 'Lorem',
});
```

Credits
=======

[](#credits)

- [Tobias Strub](https://www.tobento.ch)
- [All Contributors](../../contributors)
- [Tabler Icons](https://github.com/tabler/tabler-icons)

###  Health Score

26

—

LowBetter than 43% of packages

Maintenance40

Moderate activity, may be stable

Popularity8

Limited adoption so far

Community12

Small or concentrated contributor base

Maturity39

Early-stage or recently created project

 Bus Factor1

Top contributor holds 100% of commits — single point of failure

How is this calculated?**Maintenance (25%)** — Last commit recency, latest release date, and issue-to-star ratio. Uses a 2-year decay window.

**Popularity (30%)** — Total and monthly downloads, GitHub stars, and forks. Logarithmic scaling prevents top-heavy scores.

**Community (15%)** — Contributors, dependents, forks, watchers, and maintainers. Measures real ecosystem engagement.

**Maturity (30%)** — Project age, version count, PHP version support, and release stability.

###  Release Activity

Cadence

Every ~1 days

Total

3

Last Release

504d ago

### Community

Maintainers

![](https://www.gravatar.com/avatar/055d6a1b5c2384bb179c75ab0b55914231d898fdc4dffeb30770f81200e52206?d=identicon)[TOBENTOch](/maintainers/TOBENTOch)

---

Top Contributors

[![tobento-ch](https://avatars.githubusercontent.com/u/16684832?v=4)](https://github.com/tobento-ch "tobento-ch (2 commits)")

---

Tags

notificationnotifiertobento

### Embed Badge

![Health badge](/badges/tobento-js-notifier/health.svg)

```
[![Health](https://phpackages.com/badges/tobento-js-notifier/health.svg)](https://phpackages.com/packages/tobento-js-notifier)
```

###  Alternatives

[symfony/notifier

Sends notifications via one or more channels (email, SMS, ...)

80640.3M290](/packages/symfony-notifier)[guanguans/notify

Push notification SDK(AnPush、Bark、Chanify、DingTalk、Discord、Gitter、GoogleChat、IGot、Lark、Mattermost、MicrosoftTeams、NowPush、Ntfy、Push、Pushback、PushBullet、PushDeer、PushMe、Pushover、PushPlus、QQ、RocketChat、ServerChan、ShowdocPush、SimplePush、Slack、Telegram、WeWork、WPush、XiZhi、YiFengChuanHua、ZohoCliq、ZohoCliqWebHook、Zulip).

682104.9k7](/packages/guanguans-notify)[yieldstudio/laravel-expo-notifier

Easily send Expo notifications with Laravel.

59115.9k](/packages/yieldstudio-laravel-expo-notifier)[nikolaposa/notifier

Extensible library for building notifications and sending them via different delivery channels.

211.6k](/packages/nikolaposa-notifier)

PHPackages © 2026

[Directory](/)[Categories](/categories)[Trending](/trending)[Changelog](/changelog)[Analyze](/analyze)