@some-angular-utils/modal

---

NPM

---

DEMO

This repo ships with an interactive showcase app — every feature has a live, editable example (edit the code, open the dialog). Run it locally:

npm install
npm run dev

Then open http://localhost:4200.

IMPORT

import { ModalService, DeleteModalComponent } from '@some-angular-utils/modal';

TYPESCRIPT

private modalService = inject(ModalService);

deleteCompany(company: Company) {
  const modalRef = this.modalService.open(DeleteModalComponent, {});
  modalRef.componentInstance.name = company.name;
  modalRef.componentInstance.entity = 'Company';

  modalRef.result.then(
    () => this.removeFromList(company.id), // confirmed
    () => {},                              // cancelled
  );
}

open() also accepts any of your own standalone components — set its @Input()s via modalRef.componentInstance the same way.

OPTIONS

this.modalService.open(DeleteModalComponent, {
  size: 'lg',        // 'sm' | 'md' | 'lg', defaults to 'md'
  backdrop: 'static', // true | false | 'static' — 'static' keeps it open on outside click
  keyboard: false,    // whether Escape dismisses it, defaults to true
});

COLORS

sau-modal-container, .sau-delete-modal {
    --sau-color-primary: rgb(147, 51, 234);
    --sau-color-delete: rgb(239, 68, 68);
    --sau-color-background: rgb(255, 255, 255);
    --sau-color-text: rgb(31, 41, 55);
}