@progress/kendo-angular-notification 17.0.0-develop.4 → 17.0.0-develop.40
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +30 -15
- package/{esm2020 → esm2022}/localization/localized-messages.directive.mjs +13 -8
- package/esm2022/models/notification-settings.mjs +87 -0
- package/{esm2020 → esm2022}/notification.component.mjs +46 -25
- package/{esm2020 → esm2022}/notification.container.component.mjs +13 -6
- package/{esm2020 → esm2022}/notification.module.mjs +4 -4
- package/{esm2020 → esm2022}/package-metadata.mjs +2 -2
- package/{esm2020 → esm2022}/services/notification.service.mjs +9 -5
- package/{fesm2020 → fesm2022}/progress-kendo-angular-notification.mjs +168 -101
- package/localization/localized-messages.directive.d.ts +1 -1
- package/models/animation.d.ts +1 -1
- package/models/position.d.ts +1 -1
- package/models/type.d.ts +1 -1
- package/notification.component.d.ts +1 -1
- package/notification.container.component.d.ts +1 -1
- package/package.json +13 -19
- package/esm2020/models/notification-settings.mjs +0 -57
- package/fesm2015/progress-kendo-angular-notification.mjs +0 -774
- /package/{esm2020 → esm2022}/directives.mjs +0 -0
- /package/{esm2020 → esm2022}/index.mjs +0 -0
- /package/{esm2020 → esm2022}/models/animation.mjs +0 -0
- /package/{esm2020 → esm2022}/models/notification-ref.mjs +0 -0
- /package/{esm2020 → esm2022}/models/position.mjs +0 -0
- /package/{esm2020 → esm2022}/models/type.mjs +0 -0
- /package/{esm2020 → esm2022}/progress-kendo-angular-notification.mjs +0 -0
- /package/{esm2020 → esm2022}/utils/animations.mjs +0 -0
package/README.md
CHANGED
|
@@ -4,30 +4,45 @@
|
|
|
4
4
|
|
|
5
5
|
## Kendo UI for Angular Notification Component
|
|
6
6
|
|
|
7
|
-
>
|
|
8
|
-
> *
|
|
9
|
-
> * You will need to install a license key when adding the package to your project. For more information, please refer to the [Kendo UI for Angular My License page](https://www.telerik.com/kendo-angular-ui/my-license?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-angular-trial-npm-notification).
|
|
10
|
-
> * To receive a license key, you need to either [purchase a license](https://www.telerik.com/purchase/kendo-ui?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-angular-trial-npm-notification) or register for a [free trial](https://www.telerik.com/download-login-v2-kendo-angular-ui?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-angular-trial-npm-notification). Doing so indicates that you [accept the Kendo UI for Angular License Agreement](https://www.telerik.com/purchase/license-agreement/kendo-ui?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-angular-trial-npm-notification).
|
|
7
|
+
> * This package is part of [Kendo UI for Angular](https://www.telerik.com/kendo-angular-ui)—a commercial library designed and built for developing business applications with Angular. Every UI component in the Kendo UI for Angular suite has been built from the ground-up specifically for Angular.
|
|
8
|
+
> * You must [install a license key](https://www.telerik.com/kendo-angular-ui/my-license) when adding the package to your project. To receive a license key, either [purchase a license](https://www.telerik.com/purchase/kendo-ui) or register for a [free trial](https://www.telerik.com/download-login-v2-kendo-angular-ui).
|
|
11
9
|
> * The 30-day free trial gives you access to all the Kendo UI for Angular components and their full functionality. Additionally, for the period of your license, you get access to our legendary technical support provided directly by the Kendo UI for Angular dev team!
|
|
12
10
|
>
|
|
13
|
-
> [Start using Kendo UI for Angular](https://www.telerik.com/download-login-v2-kendo-angular-ui
|
|
11
|
+
> [Start using Kendo UI for Angular](https://www.telerik.com/download-login-v2-kendo-angular-ui) and speed up your development process!
|
|
14
12
|
|
|
15
|
-
|
|
13
|
+
## Angular Notification Component
|
|
14
|
+
|
|
15
|
+
The [Kendo UI for Angular Notification](https://www.telerik.com/kendo-angular-ui/components/notification) component displays a brief message to inform users about the status of a particular process, such as a successful update of data or an error message.
|
|
16
|
+
|
|
17
|
+
## Key Features
|
|
18
|
+
|
|
19
|
+
Among the many features which the Kendo UI for Angular Notification delivers are:
|
|
20
|
+
|
|
21
|
+
* [Types](https://www.telerik.com/kendo-angular-ui/components/notification/types)—The Notification component provides several built-in types that enable you to configure colors and styles for the most common scenarios like success, info, error, warning, and more.
|
|
22
|
+
* [Animations](https://www.telerik.com/kendo-angular-ui/components/notification/animations)—Allows you to use different built-in animation effects, which enable you to visualize the display and disappearance of the notifications.
|
|
23
|
+
* [Controlling the Content](https://www.telerik.com/kendo-angular-ui/components/notification/content)—The Notification provides options for controlling its content.
|
|
24
|
+
* [Positioning](https://www.telerik.com/kendo-angular-ui/components/notification/positioning)—Enables you to configure the notification to align to the browser's viewport or position the component to a specific container.
|
|
25
|
+
* [Hiding](https://www.telerik.com/kendo-angular-ui/components/notification/hiding-notifications)—Allows you to hide the Notification by defining a delay period before the hiding occurs or by defining a closable Notification component.
|
|
26
|
+
* [Appending to Dynamic Containers](https://www.telerik.com/kendo-angular-ui/components/notification/dynamic-containers)—The Notification component provides a service, that can be used to define a container to which the Notification will be appended.
|
|
27
|
+
|
|
28
|
+
## Support Options
|
|
29
|
+
|
|
30
|
+
For any issues you might encounter while working with the Kendo UI for Angular Notification, you have the following support channels available:
|
|
31
|
+
|
|
32
|
+
* Industry-leading technical support—Kendo UI for Angular paid license holders and users with an active (free) trial license can take advantage of our outstanding customer support. To submit a ticket, use the [dedicated Kendo UI for Angular support system](https://www.telerik.com/account/support-tickets).
|
|
33
|
+
* Product forums—The [Kendo UI for Angular forums](https://www.telerik.com/forums/kendo-angular-ui) are part of the free support you can get from the community and from the Kendo UI for Angular team.
|
|
34
|
+
* Feedback portal—The [Kendo UI for Angular feedback portal](https://feedback.telerik.com/kendo-angular-ui) is where you can request and vote for new features to be added.
|
|
16
35
|
|
|
17
36
|
## Resources
|
|
18
37
|
|
|
19
|
-
* [
|
|
20
|
-
* [
|
|
38
|
+
* [Getting Started with Kendo UI for Angular](https://www.telerik.com/kendo-angular-ui/getting-started)
|
|
39
|
+
* [Getting Started with the Kendo UI for Angular Notification](https://www.telerik.com/kendo-angular-ui/components/notification/installation/getting-started)
|
|
40
|
+
* [Notification Overview page](https://www.telerik.com/kendo-angular-ui/components/notification) and [Notification API reference](https://www.telerik.com/kendo-angular-ui/components/notification/api)
|
|
41
|
+
* [Kendo UI for Angular roadmap](https://www.telerik.com/kendo-angular-ui/roadmap)
|
|
21
42
|
* [Blogs](http://www.telerik.com/blogs/kendo-ui)
|
|
43
|
+
* [Demos, documentation, and component reference](https://www.telerik.com/kendo-angular-ui/components)
|
|
22
44
|
* [Kendo UI for Angular pricing and licensing](https://www.telerik.com/purchase/kendo-ui)
|
|
23
45
|
|
|
24
|
-
## Questions and Feedback
|
|
25
|
-
|
|
26
|
-
* [Official Forums](https://www.telerik.com/forums/kendo-angular-ui)
|
|
27
|
-
* [GitHub Issues](https://github.com/telerik/kendo-angular/issues)
|
|
28
|
-
* [Feedback Portal](https://feedback.telerik.com/kendo-angular-ui)
|
|
29
|
-
* [StackOverflow](https://stackoverflow.com/questions/tagged/kendo-ui-angular2)
|
|
30
|
-
|
|
31
46
|
*Copyright © 2024 Progress Software Corporation and/or one of its subsidiaries or affiliates. All rights reserved.*
|
|
32
47
|
|
|
33
48
|
*Progress, Telerik, and certain product names used herein are trademarks or registered trademarks of Progress Software Corporation and/or one of its subsidiaries or affiliates in the U.S. and/or other countries.*
|
|
@@ -10,19 +10,24 @@ import * as i1 from "@progress/kendo-angular-l10n";
|
|
|
10
10
|
* @hidden
|
|
11
11
|
*/
|
|
12
12
|
export class LocalizedMessagesDirective extends ComponentMessages {
|
|
13
|
+
service;
|
|
14
|
+
/**
|
|
15
|
+
* The title of the close button.
|
|
16
|
+
*/
|
|
17
|
+
closeTitle;
|
|
13
18
|
constructor(service) {
|
|
14
19
|
super();
|
|
15
20
|
this.service = service;
|
|
16
21
|
}
|
|
22
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: LocalizedMessagesDirective, deps: [{ token: i1.LocalizationService }], target: i0.ɵɵFactoryTarget.Directive });
|
|
23
|
+
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.2.12", type: LocalizedMessagesDirective, isStandalone: true, selector: "[kendoNotificationLocalizedMessages]", inputs: { closeTitle: "closeTitle" }, providers: [
|
|
24
|
+
{
|
|
25
|
+
provide: ComponentMessages,
|
|
26
|
+
useExisting: forwardRef(() => LocalizedMessagesDirective)
|
|
27
|
+
}
|
|
28
|
+
], usesInheritance: true, ngImport: i0 });
|
|
17
29
|
}
|
|
18
|
-
|
|
19
|
-
LocalizedMessagesDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.2.10", type: LocalizedMessagesDirective, isStandalone: true, selector: "[kendoNotificationLocalizedMessages]", inputs: { closeTitle: "closeTitle" }, providers: [
|
|
20
|
-
{
|
|
21
|
-
provide: ComponentMessages,
|
|
22
|
-
useExisting: forwardRef(() => LocalizedMessagesDirective)
|
|
23
|
-
}
|
|
24
|
-
], usesInheritance: true, ngImport: i0 });
|
|
25
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: LocalizedMessagesDirective, decorators: [{
|
|
30
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: LocalizedMessagesDirective, decorators: [{
|
|
26
31
|
type: Directive,
|
|
27
32
|
args: [{
|
|
28
33
|
providers: [
|
|
@@ -0,0 +1,87 @@
|
|
|
1
|
+
/**-----------------------------------------------------------------------------------------
|
|
2
|
+
* Copyright © 2024 Progress Software Corporation. All rights reserved.
|
|
3
|
+
* Licensed under commercial license. See LICENSE.md in the project root for more information
|
|
4
|
+
*-------------------------------------------------------------------------------------------*/
|
|
5
|
+
export class NotificationSettings {
|
|
6
|
+
/**
|
|
7
|
+
* Defines the content of the Notification.
|
|
8
|
+
*/
|
|
9
|
+
content;
|
|
10
|
+
/**
|
|
11
|
+
* Specifies the time in milliseconds after which the
|
|
12
|
+
* Notification will hide
|
|
13
|
+
* ([see example](slug:hiding_notifications#toc-defining-a-delay-before-hiding)).
|
|
14
|
+
* Defaults to `5000`.
|
|
15
|
+
*/
|
|
16
|
+
hideAfter = 5000;
|
|
17
|
+
/**
|
|
18
|
+
* Defines the position of the Notification
|
|
19
|
+
* ([see example]({% slug positioning_notification %})).
|
|
20
|
+
*
|
|
21
|
+
* The possible values are:
|
|
22
|
+
* * `horizontal: 'left'|'center'|'right'`
|
|
23
|
+
* * `vertical: 'top'|'bottom'`
|
|
24
|
+
*/
|
|
25
|
+
position = { horizontal: 'right', vertical: 'top' };
|
|
26
|
+
/**
|
|
27
|
+
* Specifies the animation settings of the Notification
|
|
28
|
+
* ([see example]({% slug animations_notification %})).
|
|
29
|
+
*
|
|
30
|
+
* The possible values are:
|
|
31
|
+
* * `duration`—Accepts a number in milliseconds. Defaults to `500ms`.
|
|
32
|
+
* * `type?: 'slide'| (Default) 'fade'`
|
|
33
|
+
*/
|
|
34
|
+
animation = { type: 'fade', duration: 500 };
|
|
35
|
+
/**
|
|
36
|
+
* Specifies if the Notification will require a user action to hide.
|
|
37
|
+
* If the property is set to `true`, the Notification renders a **Close** button
|
|
38
|
+
* ([see example]({% slug hiding_notifications %}#toc-defining-a-closable-notification)).
|
|
39
|
+
*
|
|
40
|
+
* The possible values are:
|
|
41
|
+
* * (Default) `false`
|
|
42
|
+
* * `true`
|
|
43
|
+
*/
|
|
44
|
+
closable = false;
|
|
45
|
+
/**
|
|
46
|
+
* Specifies the title of the close button.
|
|
47
|
+
*/
|
|
48
|
+
closeTitle;
|
|
49
|
+
/**
|
|
50
|
+
* Specifies the type of the Notification
|
|
51
|
+
* ([see example]({% slug types_notification %})).
|
|
52
|
+
*
|
|
53
|
+
* The possible values are:
|
|
54
|
+
* * `style: (Default) 'none'|'success'|'error'|'warning'|'info'`
|
|
55
|
+
* * `icon: 'true'|'false'`
|
|
56
|
+
*/
|
|
57
|
+
type = { style: 'none', icon: true };
|
|
58
|
+
/**
|
|
59
|
+
* Specifies the width of the Notification.
|
|
60
|
+
*/
|
|
61
|
+
width;
|
|
62
|
+
/**
|
|
63
|
+
* Specifies the height of the Notification.
|
|
64
|
+
*/
|
|
65
|
+
height;
|
|
66
|
+
/**
|
|
67
|
+
* The value of the Notification element `aria-label` attribute.
|
|
68
|
+
* @default 'Notification'
|
|
69
|
+
*/
|
|
70
|
+
notificationLabel = 'Notification';
|
|
71
|
+
/**
|
|
72
|
+
* Specifies a list of CSS classes that will be added to the Notification.
|
|
73
|
+
* To apply CSS rules to the component, set `encapsulation` to `ViewEncapsulation.None`
|
|
74
|
+
* ([see example](slug:overview_notification)).
|
|
75
|
+
*
|
|
76
|
+
* > To style the content of the Notification, use the `cssClass` property binding.
|
|
77
|
+
*/
|
|
78
|
+
cssClass;
|
|
79
|
+
/**
|
|
80
|
+
* Defines the container to which the Notification will be appended
|
|
81
|
+
* ([see example]({% slug dynamic_containers %})).
|
|
82
|
+
*
|
|
83
|
+
* If not provided, the Notification will be placed in the root component
|
|
84
|
+
* of the application or in the `body` element of the document.
|
|
85
|
+
*/
|
|
86
|
+
appendTo;
|
|
87
|
+
}
|
|
@@ -22,33 +22,54 @@ import * as i2 from "@progress/kendo-angular-l10n";
|
|
|
22
22
|
*
|
|
23
23
|
*/
|
|
24
24
|
export class NotificationComponent {
|
|
25
|
+
cdr;
|
|
26
|
+
element;
|
|
27
|
+
renderer;
|
|
28
|
+
builder;
|
|
29
|
+
localizationService;
|
|
30
|
+
/**
|
|
31
|
+
* @hidden
|
|
32
|
+
*/
|
|
33
|
+
xIcon = xIcon;
|
|
34
|
+
contentId = `k-${guid()}`;
|
|
35
|
+
container;
|
|
36
|
+
closeClickSubscription;
|
|
37
|
+
close = new EventEmitter();
|
|
38
|
+
templateRef;
|
|
39
|
+
templateString;
|
|
40
|
+
width = null;
|
|
41
|
+
height = null;
|
|
42
|
+
notificationLabel = 'Notification';
|
|
43
|
+
cssClass;
|
|
44
|
+
hideAfter;
|
|
45
|
+
closable;
|
|
46
|
+
type;
|
|
47
|
+
animation;
|
|
48
|
+
closeTitle;
|
|
49
|
+
/**
|
|
50
|
+
* @hidden
|
|
51
|
+
*/
|
|
52
|
+
direction;
|
|
53
|
+
get closeButtonTitle() {
|
|
54
|
+
return this.closeTitle || this.localizationService.get('closeTitle');
|
|
55
|
+
}
|
|
56
|
+
defaultHideAfter = 5000;
|
|
57
|
+
hideTimeout;
|
|
58
|
+
animationEnd = new EventEmitter();
|
|
59
|
+
dynamicRTLSubscription;
|
|
60
|
+
rtl = false;
|
|
25
61
|
constructor(cdr, element, renderer, builder, localizationService) {
|
|
26
62
|
this.cdr = cdr;
|
|
27
63
|
this.element = element;
|
|
28
64
|
this.renderer = renderer;
|
|
29
65
|
this.builder = builder;
|
|
30
66
|
this.localizationService = localizationService;
|
|
31
|
-
/**
|
|
32
|
-
* @hidden
|
|
33
|
-
*/
|
|
34
|
-
this.xIcon = xIcon;
|
|
35
|
-
this.contentId = `k-${guid()}`;
|
|
36
|
-
this.close = new EventEmitter();
|
|
37
|
-
this.width = null;
|
|
38
|
-
this.height = null;
|
|
39
|
-
this.notificationLabel = 'Notification';
|
|
40
|
-
this.defaultHideAfter = 5000;
|
|
41
|
-
this.animationEnd = new EventEmitter();
|
|
42
|
-
this.rtl = false;
|
|
43
67
|
validatePackage(packageMetadata);
|
|
44
68
|
this.dynamicRTLSubscription = localizationService.changes.subscribe(({ rtl }) => {
|
|
45
69
|
this.rtl = rtl;
|
|
46
70
|
this.direction = this.rtl ? 'rtl' : 'ltr';
|
|
47
71
|
});
|
|
48
72
|
}
|
|
49
|
-
get closeButtonTitle() {
|
|
50
|
-
return this.closeTitle || this.localizationService.get('closeTitle');
|
|
51
|
-
}
|
|
52
73
|
notificationClasses() {
|
|
53
74
|
return `${this.type ? this.typeClass() : ''}
|
|
54
75
|
${this.closable ? 'k-notification-closable' : ''}`;
|
|
@@ -156,15 +177,14 @@ export class NotificationComponent {
|
|
|
156
177
|
fadeAnimation(duration, onclose) {
|
|
157
178
|
return onclose ? fadeCloseAnimation(duration) : fadeAnimation(duration);
|
|
158
179
|
}
|
|
159
|
-
}
|
|
160
|
-
|
|
161
|
-
|
|
162
|
-
|
|
163
|
-
|
|
164
|
-
|
|
165
|
-
|
|
166
|
-
}
|
|
167
|
-
], viewQueries: [{ propertyName: "container", first: true, predicate: ["container"], descendants: true, read: ViewContainerRef, static: true }], ngImport: i0, template: `
|
|
180
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: NotificationComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: i0.Renderer2 }, { token: i1.AnimationBuilder }, { token: i2.LocalizationService }], target: i0.ɵɵFactoryTarget.Component });
|
|
181
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: NotificationComponent, isStandalone: true, selector: "kendo-notification", inputs: { templateRef: "templateRef", templateString: "templateString", width: "width", height: "height", notificationLabel: "notificationLabel", cssClass: "cssClass", hideAfter: "hideAfter", closable: "closable", type: "type", animation: "animation" }, host: { properties: { "attr.dir": "this.direction" } }, providers: [
|
|
182
|
+
LocalizationService,
|
|
183
|
+
{
|
|
184
|
+
provide: L10N_PREFIX,
|
|
185
|
+
useValue: 'kendo.notification'
|
|
186
|
+
}
|
|
187
|
+
], viewQueries: [{ propertyName: "container", first: true, predicate: ["container"], descendants: true, read: ViewContainerRef, static: true }], ngImport: i0, template: `
|
|
168
188
|
<ng-container kendoNotificationLocalizedMessages
|
|
169
189
|
i18n-closeTitle="kendo.notification.closeTitle|The title of the close button"
|
|
170
190
|
closeTitle="Close"
|
|
@@ -204,7 +224,8 @@ NotificationComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0",
|
|
|
204
224
|
</span>
|
|
205
225
|
</div>
|
|
206
226
|
`, isInline: true, dependencies: [{ kind: "directive", type: LocalizedMessagesDirective, selector: "[kendoNotificationLocalizedMessages]", inputs: ["closeTitle"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: IconWrapperComponent, selector: "kendo-icon-wrapper", inputs: ["name", "svgIcon", "innerCssClass", "customFontClass", "size"], exportAs: ["kendoIconWrapper"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }] });
|
|
207
|
-
|
|
227
|
+
}
|
|
228
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: NotificationComponent, decorators: [{
|
|
208
229
|
type: Component,
|
|
209
230
|
args: [{
|
|
210
231
|
selector: 'kendo-notification',
|
|
@@ -10,13 +10,20 @@ import * as i0 from "@angular/core";
|
|
|
10
10
|
* @hidden
|
|
11
11
|
*/
|
|
12
12
|
export class NotificationContainerComponent {
|
|
13
|
+
element;
|
|
14
|
+
renderer;
|
|
15
|
+
resolver;
|
|
16
|
+
ngZone;
|
|
17
|
+
container;
|
|
18
|
+
group;
|
|
19
|
+
id = '';
|
|
20
|
+
notifications = [];
|
|
21
|
+
position;
|
|
13
22
|
constructor(element, renderer, resolver, ngZone) {
|
|
14
23
|
this.element = element;
|
|
15
24
|
this.renderer = renderer;
|
|
16
25
|
this.resolver = resolver;
|
|
17
26
|
this.ngZone = ngZone;
|
|
18
|
-
this.id = '';
|
|
19
|
-
this.notifications = [];
|
|
20
27
|
/**/
|
|
21
28
|
}
|
|
22
29
|
ngOnDestroy() {
|
|
@@ -136,14 +143,14 @@ export class NotificationContainerComponent {
|
|
|
136
143
|
const vertical = positionLayout.vertical[position.vertical];
|
|
137
144
|
return Object.assign({}, horizontal, vertical);
|
|
138
145
|
}
|
|
139
|
-
}
|
|
140
|
-
|
|
141
|
-
NotificationContainerComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: NotificationContainerComponent, isStandalone: true, selector: "kendo-notification-container", inputs: { id: "id" }, viewQueries: [{ propertyName: "container", first: true, predicate: ["container"], descendants: true, read: ViewContainerRef, static: true }, { propertyName: "group", first: true, predicate: ["group"], descendants: true, static: true }], ngImport: i0, template: `
|
|
146
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: NotificationContainerComponent, deps: [{ token: i0.ElementRef }, { token: i0.Renderer2 }, { token: i0.ComponentFactoryResolver }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Component });
|
|
147
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: NotificationContainerComponent, isStandalone: true, selector: "kendo-notification-container", inputs: { id: "id" }, viewQueries: [{ propertyName: "container", first: true, predicate: ["container"], descendants: true, read: ViewContainerRef, static: true }, { propertyName: "group", first: true, predicate: ["group"], descendants: true, static: true }], ngImport: i0, template: `
|
|
142
148
|
<div #group class="k-notification-group">
|
|
143
149
|
<ng-container #container></ng-container>
|
|
144
150
|
</div>
|
|
145
151
|
`, isInline: true });
|
|
146
|
-
|
|
152
|
+
}
|
|
153
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: NotificationContainerComponent, decorators: [{
|
|
147
154
|
type: Component,
|
|
148
155
|
args: [{
|
|
149
156
|
selector: 'kendo-notification-container',
|
|
@@ -41,11 +41,11 @@ import * as i2 from "./notification.container.component";
|
|
|
41
41
|
* ```
|
|
42
42
|
*/
|
|
43
43
|
export class NotificationModule {
|
|
44
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: NotificationModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
|
|
45
|
+
static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "16.2.12", ngImport: i0, type: NotificationModule, imports: [i1.NotificationComponent, i2.NotificationContainerComponent], exports: [i1.NotificationComponent, i2.NotificationContainerComponent] });
|
|
46
|
+
static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: NotificationModule, providers: [NotificationService, IconsService], imports: [i1.NotificationComponent] });
|
|
44
47
|
}
|
|
45
|
-
|
|
46
|
-
NotificationModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.10", ngImport: i0, type: NotificationModule, imports: [i1.NotificationComponent, i2.NotificationContainerComponent], exports: [i1.NotificationComponent, i2.NotificationContainerComponent] });
|
|
47
|
-
NotificationModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: NotificationModule, providers: [NotificationService, IconsService], imports: [KENDO_NOTIFICATION] });
|
|
48
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: NotificationModule, decorators: [{
|
|
48
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: NotificationModule, decorators: [{
|
|
49
49
|
type: NgModule,
|
|
50
50
|
args: [{
|
|
51
51
|
imports: [...KENDO_NOTIFICATION],
|
|
@@ -9,7 +9,7 @@ export const packageMetadata = {
|
|
|
9
9
|
name: '@progress/kendo-angular-notification',
|
|
10
10
|
productName: 'Kendo UI for Angular',
|
|
11
11
|
productCodes: ['KENDOUIANGULAR', 'KENDOUICOMPLETE'],
|
|
12
|
-
publishDate:
|
|
13
|
-
version: '17.0.0-develop.
|
|
12
|
+
publishDate: 1730799118,
|
|
13
|
+
version: '17.0.0-develop.40',
|
|
14
14
|
licensingDocsUrl: 'https://www.telerik.com/kendo-angular-ui/my-license/'
|
|
15
15
|
};
|
|
@@ -53,6 +53,12 @@ export const NOTIFICATION_CONTAINER = new InjectionToken('Notification Container
|
|
|
53
53
|
* @class NotificationService
|
|
54
54
|
*/
|
|
55
55
|
export class NotificationService {
|
|
56
|
+
resolver;
|
|
57
|
+
injector;
|
|
58
|
+
container;
|
|
59
|
+
notificationContainers = [];
|
|
60
|
+
position = { horizontal: 'right', vertical: 'top' };
|
|
61
|
+
applicationRef;
|
|
56
62
|
/**
|
|
57
63
|
* @hidden
|
|
58
64
|
*/
|
|
@@ -60,8 +66,6 @@ export class NotificationService {
|
|
|
60
66
|
this.resolver = resolver;
|
|
61
67
|
this.injector = injector;
|
|
62
68
|
this.container = container;
|
|
63
|
-
this.notificationContainers = [];
|
|
64
|
-
this.position = { horizontal: 'right', vertical: 'top' };
|
|
65
69
|
}
|
|
66
70
|
/**
|
|
67
71
|
* Opens a Notification component. Created Notification are mounted
|
|
@@ -124,10 +128,10 @@ export class NotificationService {
|
|
|
124
128
|
}
|
|
125
129
|
return container;
|
|
126
130
|
}
|
|
131
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: NotificationService, deps: [{ token: i0.ComponentFactoryResolver }, { token: i0.Injector }, { token: NOTIFICATION_CONTAINER, optional: true }], target: i0.ɵɵFactoryTarget.Injectable });
|
|
132
|
+
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: NotificationService, providedIn: 'root' });
|
|
127
133
|
}
|
|
128
|
-
|
|
129
|
-
NotificationService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: NotificationService, providedIn: 'root' });
|
|
130
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: NotificationService, decorators: [{
|
|
134
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: NotificationService, decorators: [{
|
|
131
135
|
type: Injectable,
|
|
132
136
|
args: [{
|
|
133
137
|
providedIn: 'root'
|