import { AfterViewInit , Component , ElementRef , Input , ViewChild } from '@angular/core' ; import { Observable , of } from 'rxjs' ; import { WindowRef } from '../../../types/window-ref' ; @ Component ( { selector : 'kirby-alert' , templateUrl : './alert.component.html' , styleUrls : [ './alert.component.scss' ] , host : { '[class.ion-page]' : 'false' } , } ) export class AlertComponent implements AfterViewInit { readonly BLUR_WRAPPER_DELAY_IN_MS = 50 ; @ ViewChild ( 'alertWrapper' , { static : true } ) private alertWrapper : ElementRef ; private scrollY : number = Math . abs ( this . windowRef . nativeWindow . scrollY ) ; title$ : Observable < string > ; @ Input ( ) set title ( title ) { this . title$ = typeof title === 'string' ? of ( title ) : title ; } message$ : Observable < string > ; @ Input ( ) set message ( message ) { this . message$ = typeof message === 'string' ? of ( message ) : message ; } @ Input ( ) iconName : string ; @ Input ( ) iconThemeColor : string ; @ Input ( ) okBtnText : string ; @ Input ( ) okBtnIsDestructive : boolean ; @ Input ( ) cancelBtnText : string ; constructor ( private elementRef , private windowRef ) { } ngAfterViewInit ( ) { setTimeout ( ( ) => { this . alertWrapper . nativeElement . focus ( ) ; this . alertWrapper . nativeElement . blur ( ) ; } , this . BLUR_WRAPPER_DELAY_IN_MS ) ; } onFocusChange ( ) { this . windowRef . nativeWindow . scrollTo ( { top : this . scrollY } ) ; } onCancel ( ) { const ionModalElement = this . elementRef . nativeElement . closest ( 'ion-modal' ) ; ionModalElement && ionModalElement . dismiss ( false ) ; } onOk ( ) { const ionModalElement = this . elementRef . nativeElement . closest ( 'ion-modal' ) ; ionModalElement && ionModalElement . dismiss ( true ) ; } }