13331632524

Committed 14 Feb 2025 02:51PM UTC coverage: 22.015% (-69.6%) from 91.622%

Build # 13331632524

Build Type

Pull #15372

github

Committed by

web-flow

Commit Message

Merge d52d57714 into bcb78ae0a

Pull Request Pull Request #15372: chore(*): test ci passing

Run Details

1990 of 15592 branches covered (12.76%)

431 of 964 new or added lines in 18 files covered. (44.71%)

19956 existing lines in 307 files now uncovered.

6452 of 29307 relevant lines covered (22.02%)

249.17 hits per line

Source File
Press 'n' to go to next uncovered line, 'b' for previous

41.67

/projects/igniteui-angular/src/lib/snackbar/snackbar.component.ts

import { useAnimation } from '@angular/animations';
import { NgIf } from '@angular/common';
import {
    Component,
    EventEmitter,
    HostBinding,
    Input,
    OnInit,
    Output
} from '@angular/core';
import { takeUntil } from 'rxjs/operators';
import { ContainerPositionStrategy, GlobalPositionStrategy, HorizontalAlignment,
    PositionSettings, VerticalAlignment } from '../services/public_api';
import { IgxNotificationsDirective } from '../directives/notification/notifications.directive';
import { ToggleViewEventArgs } from '../directives/toggle/toggle.directive';
import { IgxButtonDirective } from '../directives/button/button.directive';
import { fadeIn, fadeOut } from 'igniteui-angular/animations';

let NEXT_ID = 0;
/**
 * **Ignite UI for Angular Snackbar** -
 * [Documentation](https://www.infragistics.com/products/ignite-ui-angular/angular/components/snackbar.html)
 *
 * The Ignite UI Snack Bar provides feedback about an operation with a single-line message, which can
 * include a link to an action such as Undo.
 *
 * Example:
 * ```html
 * <button type="button" igxButton (click)="snackbar.show()">Send message</button>
 * <div>
 *   <igx-snackbar #snackbar>
 *      Message sent
 *   </igx-snackbar>
 * </div>
 * ```
 */
@Component({
    selector: 'igx-snackbar',
    templateUrl: 'snackbar.component.html',
    imports: [NgIf, IgxButtonDirective]
})
export class IgxSnackbarComponent extends IgxNotificationsDirective
    implements OnInit {
    /**
     * Sets/gets the `id` of the snackbar.
     * If not set, the `id` of the first snackbar component  will be `"igx-snackbar-0"`;
     * ```html
     * <igx-snackbar id = "Snackbar1"></igx-snackbar>
     * ```
     * ```typescript
     * let snackbarId = this.snackbar.id;
     * ```
     *
     * @memberof IgxSnackbarComponent
     */
    @HostBinding('attr.id')
    @Input()
    public override id = `igx-snackbar-${NEXT_ID++}`;

    /**
     * The default css class applied to the component.
     *
     * @hidden
     * @internal
     */
    @HostBinding('class.igx-snackbar')
    public cssClass = 'igx-snackbar';

    /**
     * Sets/gets the `actionText` attribute.
     * ```html
     * <igx-snackbar [actionText] = "'Action Text'"></igx-snackbar>
     * ```
     */
    @Input() public actionText?: string;

    /**
     * An event that will be emitted when the action button is clicked.
     * Provides reference to the `IgxSnackbarComponent` as an argument.
     * ```html
     * <igx-snackbar (clicked)="clickedHandler($event)"></igx-snackbar>
     * ```
     */
    @Output()
    public clicked = new EventEmitter<IgxSnackbarComponent>();

    /**
     * An event that will be emitted when the snackbar animation starts.
     * Provides reference to the `ToggleViewEventArgs` interface as an argument.
     * ```html
     * <igx-snackbar (animationStarted) = "animationStarted($event)"></igx-snackbar>
     * ```
     */
    @Output() public animationStarted = new EventEmitter<ToggleViewEventArgs>();

    /**
     * An event that will be emitted when the snackbar animation ends.
     * Provides reference to the `ToggleViewEventArgs` interface as an argument.
     * ```html
     * <igx-snackbar (animationDone) = "animationDone($event)"></igx-snackbar>
     * ```
     */
    @Output() public animationDone = new EventEmitter<ToggleViewEventArgs>();

    /**
     * Get the position and animation settings used by the snackbar.
     * ```typescript
     * @ViewChild('snackbar', { static: true }) public snackbar: IgxSnackbarComponent;
     * let currentPosition: PositionSettings = this.snackbar.positionSettings
     * ```
     */
    @Input()
    public get positionSettings(): PositionSettings {
        return this._positionSettings;
    }

    /**
     * Set the position and animation settings used by the snackbar.
     * ```html
     * <igx-snackbar [positionSettings]="newPositionSettings"></igx-snackbar>
     * ```
     * ```typescript
     * import { slideInTop, slideOutBottom } from 'igniteui-angular';
     * ...
     * @ViewChild('snackbar', { static: true }) public snackbar: IgxSnackbarComponent;
     *  public newPositionSettings: PositionSettings = {
     *      openAnimation: useAnimation(slideInTop, { params: { duration: '1000ms', fromPosition: 'translateY(100%)'}}),
     *      closeAnimation: useAnimation(slideOutBottom, { params: { duration: '1000ms', fromPosition: 'translateY(0)'}}),
     *      horizontalDirection: HorizontalAlignment.Left,
     *      verticalDirection: VerticalAlignment.Middle,
     *      horizontalStartPoint: HorizontalAlignment.Left,
     *      verticalStartPoint: VerticalAlignment.Middle,
     *      minSize: { height: 100, width: 100 }
     *  };
     * this.snackbar.positionSettings = this.newPositionSettings;
     * ```
     */
    public set positionSettings(settings: PositionSettings) {
        this._positionSettings = settings;
    }

    private _positionSettings: PositionSettings = {
        horizontalDirection: HorizontalAlignment.Center,
        verticalDirection: VerticalAlignment.Bottom,
        openAnimation: useAnimation(fadeIn, { params: { duration: '.35s', easing: 'cubic-bezier(0.0, 0.0, 0.2, 1)',
            fromPosition: 'translateY(100%)', toPosition: 'translateY(0)'} }),
        closeAnimation: useAnimation(fadeOut, {  params: { duration: '.2s', easing: 'cubic-bezier(0.4, 0.0, 1, 1)',
            fromPosition: 'translateY(0)', toPosition: 'translateY(100%)'} }),
    };

    /**
     * Shows the snackbar and hides it after the `displayTime` is over if `autoHide` is set to `true`.
     * ```typescript
     * this.snackbar.open();
     * ```
     */
    public override open(message?: string) {
        if (message !== undefined) {
            this.textMessage = message;
        }

        this.strategy = this.outlet ? new ContainerPositionStrategy(this.positionSettings)
            : new GlobalPositionStrategy(this.positionSettings);
        super.open();
    }

    /**
     * Opens or closes the snackbar, depending on its current state.
     *
     * ```typescript
     * this.snackbar.toggle();
     * ```
     */
     public override toggle() {
        if (this.collapsed || this.isClosing) {
            this.open();
        } else {
            this.close();
        }
    }

    /**
     * @hidden
     */
    public triggerAction(): void {
        this.clicked.emit(this);
    }

    /**
     * @hidden
     */
    public override ngOnInit() {
        this.opened.pipe(takeUntil(this.destroy$)).subscribe(() => {
            const openedEventArgs: ToggleViewEventArgs = { owner: this, id: this._overlayId };
            this.animationStarted.emit(openedEventArgs);
        });

        this.closed.pipe(takeUntil(this.destroy$)).subscribe(() => {
            const closedEventArgs: ToggleViewEventArgs = { owner: this, id: this._overlayId };
            this.animationDone.emit(closedEventArgs);
        });
    }
}

1	import { useAnimation } from '@angular/animations';
2	import { NgIf } from '@angular/common';
3	import {
4	Component,
5	EventEmitter,
6	HostBinding,
7	Input,
8	OnInit,
9	Output
10	} from '@angular/core';
11	import { takeUntil } from 'rxjs/operators';
12	import { ContainerPositionStrategy, GlobalPositionStrategy, HorizontalAlignment,
13	PositionSettings, VerticalAlignment } from '../services/public_api';
14	import { IgxNotificationsDirective } from '../directives/notification/notifications.directive';
15	import { ToggleViewEventArgs } from '../directives/toggle/toggle.directive';
16	import { IgxButtonDirective } from '../directives/button/button.directive';
17	import { fadeIn, fadeOut } from 'igniteui-angular/animations';
18
19	let NEXT_ID = 0;	2✔
20	/**
21	* Ignite UI for Angular Snackbar -
22	* [Documentation](https://www.infragistics.com/products/ignite-ui-angular/angular/components/snackbar.html)
23	*
24	* The Ignite UI Snack Bar provides feedback about an operation with a single-line message, which can
25	* include a link to an action such as Undo.
26	*
27	* Example:
28	* ```html
29	* <button type="button" igxButton (click)="snackbar.show()">Send message</button>
30	* <div>
31	* <igx-snackbar #snackbar>
32	* Message sent
33	* </igx-snackbar>
34	* </div>
35	* ```
36	*/
37	@Component({
38	selector: 'igx-snackbar',
39	templateUrl: 'snackbar.component.html',
40	imports: [NgIf, IgxButtonDirective]
41	})
42	export class IgxSnackbarComponent extends IgxNotificationsDirective	2✔
43	implements OnInit {
44	/**
45	* Sets/gets the `id` of the snackbar.
46	* If not set, the `id` of the first snackbar component will be `"igx-snackbar-0"`;
47	* ```html
48	* <igx-snackbar id = "Snackbar1"></igx-snackbar>
49	* ```
50	* ```typescript
51	* let snackbarId = this.snackbar.id;
52	* ```
53	*
54	* @memberof IgxSnackbarComponent
55	*/
56	@HostBinding('attr.id')
57	@Input()
58	public override id = `igx-snackbar-${NEXT_ID++}`;	37✔
59
60	/**
61	* The default css class applied to the component.
62	*
63	* @hidden
64	* @internal
65	*/
66	@HostBinding('class.igx-snackbar')
67	public cssClass = 'igx-snackbar';	37✔
68
69	/**
70	* Sets/gets the `actionText` attribute.
71	* ```html
72	* <igx-snackbar [actionText] = "'Action Text'"></igx-snackbar>
73	* ```
74	*/
75	@Input() public actionText?: string;
76
77	/**
78	* An event that will be emitted when the action button is clicked.
79	* Provides reference to the `IgxSnackbarComponent` as an argument.
80	* ```html
81	* <igx-snackbar (clicked)="clickedHandler($event)"></igx-snackbar>
82	* ```
83	*/
84	@Output()
85	public clicked = new EventEmitter<IgxSnackbarComponent>();	37✔
86
87	/**
88	* An event that will be emitted when the snackbar animation starts.
89	* Provides reference to the `ToggleViewEventArgs` interface as an argument.
90	* ```html
91	* <igx-snackbar (animationStarted) = "animationStarted($event)"></igx-snackbar>
92	* ```
93	*/
94	@Output() public animationStarted = new EventEmitter<ToggleViewEventArgs>();	37✔
95
96	/**
97	* An event that will be emitted when the snackbar animation ends.
98	* Provides reference to the `ToggleViewEventArgs` interface as an argument.
99	* ```html
100	* <igx-snackbar (animationDone) = "animationDone($event)"></igx-snackbar>
101	* ```
102	*/
103	@Output() public animationDone = new EventEmitter<ToggleViewEventArgs>();	37✔
104
105	/**
106	* Get the position and animation settings used by the snackbar.
107	* ```typescript
108	* @ViewChild('snackbar', { static: true }) public snackbar: IgxSnackbarComponent;
109	* let currentPosition: PositionSettings = this.snackbar.positionSettings
110	* ```
111	*/
112	@Input()
113	public get positionSettings(): PositionSettings {
UNCOV 114	return this._positionSettings;	×
115	}
116
117	/**
118	* Set the position and animation settings used by the snackbar.
119	* ```html
120	* <igx-snackbar [positionSettings]="newPositionSettings"></igx-snackbar>
121	* ```
122	* ```typescript
123	* import { slideInTop, slideOutBottom } from 'igniteui-angular';
124	* ...
125	* @ViewChild('snackbar', { static: true }) public snackbar: IgxSnackbarComponent;
126	* public newPositionSettings: PositionSettings = {
127	* openAnimation: useAnimation(slideInTop, { params: { duration: '1000ms', fromPosition: 'translateY(100%)'}}),
128	* closeAnimation: useAnimation(slideOutBottom, { params: { duration: '1000ms', fromPosition: 'translateY(0)'}}),
129	* horizontalDirection: HorizontalAlignment.Left,
130	* verticalDirection: VerticalAlignment.Middle,
131	* horizontalStartPoint: HorizontalAlignment.Left,
132	* verticalStartPoint: VerticalAlignment.Middle,
133	* minSize: { height: 100, width: 100 }
134	* };
135	* this.snackbar.positionSettings = this.newPositionSettings;
136	* ```
137	*/
138	public set positionSettings(settings: PositionSettings) {
UNCOV 139	this._positionSettings = settings;	×
140	}
141
142	private _positionSettings: PositionSettings = {	37✔
143	horizontalDirection: HorizontalAlignment.Center,
144	verticalDirection: VerticalAlignment.Bottom,
145	openAnimation: useAnimation(fadeIn, { params: { duration: '.35s', easing: 'cubic-bezier(0.0, 0.0, 0.2, 1)',
146	fromPosition: 'translateY(100%)', toPosition: 'translateY(0)'} }),
147	closeAnimation: useAnimation(fadeOut, { params: { duration: '.2s', easing: 'cubic-bezier(0.4, 0.0, 1, 1)',
148	fromPosition: 'translateY(0)', toPosition: 'translateY(100%)'} }),
149	};
150
151	/**
152	* Shows the snackbar and hides it after the `displayTime` is over if `autoHide` is set to `true`.
153	* ```typescript
154	* this.snackbar.open();
155	* ```
156	*/
157	public override open(message?: string) {
UNCOV 158	if (message !== undefined) {	×
UNCOV 159	this.textMessage = message;	×
160	}
161
UNCOV 162	this.strategy = this.outlet ? new ContainerPositionStrategy(this.positionSettings)	×
163	: new GlobalPositionStrategy(this.positionSettings);
UNCOV 164	super.open();	×
165	}
166
167	/**
168	* Opens or closes the snackbar, depending on its current state.
169	*
170	* ```typescript
171	* this.snackbar.toggle();
172	* ```
173	*/
174	public override toggle() {
UNCOV 175	if (this.collapsed \|\| this.isClosing) {	×
UNCOV 176	this.open();	×
177	} else {
UNCOV 178	this.close();	×
179	}
180	}
181
182	/**
183	* @hidden
184	*/
185	public triggerAction(): void {
UNCOV 186	this.clicked.emit(this);	×
187	}
188
189	/**
190	* @hidden
191	*/
192	public override ngOnInit() {
193	this.opened.pipe(takeUntil(this.destroy$)).subscribe(() => {	37✔
UNCOV 194	const openedEventArgs: ToggleViewEventArgs = { owner: this, id: this._overlayId };	×
UNCOV 195	this.animationStarted.emit(openedEventArgs);	×
196	});
197
198	this.closed.pipe(takeUntil(this.destroy$)).subscribe(() => {	37✔
UNCOV 199	const closedEventArgs: ToggleViewEventArgs = { owner: this, id: this._overlayId };	×
UNCOV 200	this.animationDone.emit(closedEventArgs);	×
201	});
202	}
203	}

IgniteUI / igniteui-angular / 13331632524

Source File Press 'n' to go to next uncovered line, 'b' for previous

Source File
Press 'n' to go to next uncovered line, 'b' for previous