layout.title

layout.subtitle

@ng-orbit/notify

Notify

A headless notification service for Angular apps that want fast toasts, confirms, and blocking prompts while keeping side effects in the feature layer.

Provide the service once, mount the renderer once, and let features call `show`, `success`, `openBlocking`, or `confirm` without wiring UI every time.

Install @ng-orbit/notify

    pnpm add @ng-orbit/notify @ng-orbit/notify-render-plain
  

Import

    import { OrbitNotifyService, provideOrbitNotify } from '@ng-orbit/notify';
import { OrbitNotifyRenderPlainComponent } from '@ng-orbit/notify-render-plain';
  

Mental model

OrbitNotify owns queueing, defaults, and timer behavior. Your app still decides when a notification should appear and what a chosen action actually does.

  • Toasts are non-blocking and stack with per-tone defaults.
  • Blocking notifications resolve action ids through a FIFO queue.
  • The service stays headless so the renderer shell can change later.

What the consumer owns

The feature layer still owns copy strategy, analytics, retries, publish actions, deletes, or any other business side effect triggered after a result resolves.

  • Call notify methods from your own components, facades, or effects.
  • Await blocking results and branch in app code.
  • Override defaults only where product behavior genuinely differs.

DX defaults

The default setup is intentionally fast: mount one renderer, call one service, and only drop into config when the app truly needs a different policy.

  • Toast stack limit defaults to 3 and position defaults to top-end.
  • Tone defaults control durations automatically.
  • Blocking prompts do not close on Escape or backdrop unless you opt in.

Quickstart

    import { ChangeDetectionStrategy, Component, inject } from '@angular/core';
import { OrbitNotifyService, provideOrbitNotify } from '@ng-orbit/notify';
import { OrbitNotifyRenderPlainComponent } from '@ng-orbit/notify-render-plain';

@Component({
  standalone: true,
  imports: [OrbitNotifyRenderPlainComponent],
  providers: [provideOrbitNotify()],
  changeDetection: ChangeDetectionStrategy.OnPush,
  template: `
    <button type="button" (click)="save()">Save draft</button>
    <orbit-notify-render-plain />
  `
})
export class SaveDraftButtonComponent {
  private readonly notify = inject(OrbitNotifyService);

  async save(): Promise<void> {
    this.notify.success('Draft saved');

    const decision = await this.notify.confirm({
      title: 'Publish changes?',
      message: 'This confirm resolves to confirm or cancel.'
    });

    if (decision === 'confirm') {
      // Keep business work in your feature layer.
    }
  }
}