alert-dialog

1import { A11yModule } from '@angular/cdk/a11y';
2import { OverlayModule } from '@angular/cdk/overlay';
3import {
4  BasePortalOutlet,
5  CdkPortalOutlet,
6  type ComponentPortal,
7  PortalModule,
8  type TemplatePortal,
9} from '@angular/cdk/portal';
10import { NgTemplateOutlet } from '@angular/common';
11import {
12  ChangeDetectionStrategy,
13  Component,
14  type ComponentRef,
15  computed,
16  ElementRef,
17  type EmbeddedViewRef,
18  type EventEmitter,
19  inject,
20  NgModule,
21  output,
22  type TemplateRef,
23  type Type,
24  viewChild,
25  type ViewContainerRef,
26} from '@angular/core';
27 
28import type { ClassValue } from 'clsx';
29 
30import { ZardIdDirective } from '@/shared/core';
31import { mergeClasses, noopFn } from '@/shared/utils/merge-classes';
32 
33import type { ZardAlertDialogRef } from './alert-dialog-ref';
34import { ZardAlertDialogService } from './alert-dialog.service';
35import {
36  alertDialogDescriptionVariants,
37  alertDialogFooterVariants,
38  alertDialogHeaderVariants,
39  alertDialogMediaVariants,
40  alertDialogTitleVariants,
41  alertDialogVariants,
42  type ZardAlertDialogSizeVariants,
43} from './alert-dialog.variants';
44import { ZardButtonComponent } from '../button/button.component';
45 
46export type OnClickCallback<T> = (instance: T) => false | void | object;
47 
48export class ZardAlertDialogOptions<T> {
49  zCancelText?: string | null;
50  zClosable?: boolean;
51  zContent?: string | TemplateRef<T> | Type<T>;
52  zCustomClasses?: ClassValue;
53  zData?: object;
54  zDescription?: string;
55  /** Animation duration (ms) used when closing. Defaults to 100 (matches CSS transition). */
56  zDuration?: number;
57  zMaskClosable?: boolean;
58  /**
59   * Optional template rendered as a media slot above the title (e.g. an icon).
60   * When present, the header layout adapts to align media + title side-by-side
61   * on `default` size at sm breakpoint.
62   */
63  zMedia?: TemplateRef<void>;
64  /** Extra classes applied to the media slot wrapper (e.g. tinted backgrounds for destructive). */
65  zMediaClass?: ClassValue;
66  zOkDestructive?: boolean;
67  zOkDisabled?: boolean;
68  zOkText?: string | null;
69  zOnCancel?: EventEmitter<T> | OnClickCallback<T> = noopFn;
70  zOnOk?: EventEmitter<T> | OnClickCallback<T> = noopFn;
71  /** Visual size of the dialog. `default` is wider on sm+; `sm` keeps the compact width. */
72  zSize?: ZardAlertDialogSizeVariants;
73  zTitle?: string | TemplateRef<T>;
74  zViewContainerRef?: ViewContainerRef;
75  zWidth?: string;
76}
77 
78@Component({
79  selector: 'z-alert-dialog',
80// … truncated