|
1 | | -import{ElementRef,Injectable,Renderer2}from'@angular/core'; |
| 1 | +import{ElementRef,inject,Injectable,Renderer2}from'@angular/core'; |
2 | 2 | import{Triggers}from'../coreui.types'; |
3 | 3 |
|
4 | 4 | exportinterfaceIListenersConfig{ |
5 | | -hostElement:ElementRef, |
6 | | -trigger?:Triggers|Triggers[], |
7 | | -callbackOn?:()=>void, |
8 | | -callbackOff?:()=>void, |
9 | | -callbackToggle?:()=>void, |
| 5 | +hostElement:ElementRef; |
| 6 | +trigger?:Triggers|Triggers[]; |
| 7 | +callbackOn?:()=>void; |
| 8 | +callbackOff?:()=>void; |
| 9 | +callbackToggle?:()=>void; |
10 | 10 | } |
11 | 11 |
|
12 | 12 | @Injectable() |
13 | 13 | exportclassListenersService{ |
| 14 | +readonlyrenderer=inject(Renderer2); |
14 | 15 |
|
15 | 16 | privatelisteners:Map<string,()=>void>=newMap(); |
16 | 17 |
|
17 | | -constructor( |
18 | | -privaterenderer:Renderer2 |
19 | | -){} |
20 | | - |
21 | | -setListeners({ hostElement, trigger, callbackOn, callbackOff, callbackToggle}:IListenersConfig):void{ |
| 18 | +setListeners({ |
| 19 | + hostElement, |
| 20 | + trigger, |
| 21 | + callbackOn, |
| 22 | + callbackOff, |
| 23 | + callbackToggle, |
| 24 | +}:IListenersConfig):void{ |
22 | 25 | consthost=hostElement.nativeElement; |
23 | 26 | consttriggers=Array.isArray(trigger) ?trigger :trigger?.split(' ')??[]; |
24 | 27 |
|
25 | 28 | if(triggers?.includes('click')){ |
26 | | -typeofcallbackToggle==='function'&&this.listeners.set( |
27 | | -'click', |
28 | | -this.renderer.listen(host,'click',callbackToggle) |
29 | | -); |
| 29 | +typeofcallbackToggle==='function'&& |
| 30 | +this.listeners.set('click',this.renderer.listen(host,'click',callbackToggle)); |
30 | 31 | } |
31 | 32 | if(triggers?.includes('focus')){ |
32 | | -typeofcallbackOn==='function'&&this.listeners.set( |
33 | | -'focus', |
34 | | -this.renderer.listen(host,'focus',callbackOn) |
35 | | -); |
| 33 | +typeofcallbackOn==='function'&& |
| 34 | +this.listeners.set('focus',this.renderer.listen(host,'focus',callbackOn)); |
| 35 | +} |
| 36 | +if(triggers?.includes('focusin')){ |
| 37 | +typeofcallbackOff==='function'&& |
| 38 | +this.listeners.set('focusout',this.renderer.listen(host,'focusout',callbackOff)); |
| 39 | +typeofcallbackOn==='function'&& |
| 40 | +this.listeners.set('focusin',this.renderer.listen(host,'focusin',callbackOn)); |
36 | 41 | } |
37 | 42 | if(triggers?.includes('click')||triggers?.includes('focus')){ |
38 | | -typeofcallbackOff==='function'&&this.listeners.set( |
39 | | -'blur', |
40 | | -this.renderer.listen(host,'blur',callbackOff) |
41 | | -); |
| 43 | +typeofcallbackOff==='function'&& |
| 44 | +this.listeners.set('blur',this.renderer.listen(host,'blur',callbackOff)); |
42 | 45 | } |
43 | 46 | if(triggers?.includes('hover')){ |
44 | | -typeofcallbackOn==='function'&&this.listeners.set( |
45 | | -'mouseenter', |
46 | | -this.renderer.listen(host,'mouseenter',callbackOn) |
47 | | -); |
48 | | -typeofcallbackOff==='function'&&this.listeners.set( |
49 | | -'mouseleave', |
50 | | -this.renderer.listen(host,'mouseleave',callbackOff) |
51 | | -); |
| 47 | +typeofcallbackOn==='function'&& |
| 48 | +this.listeners.set('mouseenter',this.renderer.listen(host,'mouseenter',callbackOn)); |
| 49 | +typeofcallbackOff==='function'&& |
| 50 | +this.listeners.set('mouseleave',this.renderer.listen(host,'mouseleave',callbackOff)); |
52 | 51 | } |
53 | 52 | } |
54 | 53 |
|
|