@nova-design-system/nova-angular-18 3.13.0 → 3.14.0-beta.0

package/dist/nova-components/esm2022/public-api.mjs

@@ -4,5 +4,6 @@
 export * from './lib/nova-components.module';
 export * from './lib/stencil-generated/components';
 export * from './lib/stencil-generated/component-value-accessors';
+export * from './lib/providers';
 export * from '@nova-design-system/nova-webcomponents/constants';
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoicHVibGljLWFwaS5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uL3Byb2plY3RzL25vdmEtY29tcG9uZW50cy9zcmMvcHVibGljLWFwaS50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQTs7R0FFRztBQUVILGNBQWMsOEJBQThCLENBQUM7QUFDN0MsY0FBYyxvQ0FBb0MsQ0FBQztBQUNuRCxjQUFjLG1EQUFtRCxDQUFDO0FBQ2xFLGNBQWMsa0RBQWtELENBQUMiLCJzb3VyY2VzQ29udGVudCI6WyIvKlxuICogUHVibGljIEFQSSBTdXJmYWNlIG9mIG5vdmEtY29tcG9uZW50c1xuICovXG5cbmV4cG9ydCAqIGZyb20gJy4vbGliL25vdmEtY29tcG9uZW50cy5tb2R1bGUnO1xuZXhwb3J0ICogZnJvbSAnLi9saWIvc3RlbmNpbC1nZW5lcmF0ZWQvY29tcG9uZW50cyc7XG5leHBvcnQgKiBmcm9tICcuL2xpYi9zdGVuY2lsLWdlbmVyYXRlZC9jb21wb25lbnQtdmFsdWUtYWNjZXNzb3JzJztcbmV4cG9ydCAqIGZyb20gJ0Bub3ZhLWRlc2lnbi1zeXN0ZW0vbm92YS13ZWJjb21wb25lbnRzL2NvbnN0YW50cyc7XG4iXX0=
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoicHVibGljLWFwaS5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uL3Byb2plY3RzL25vdmEtY29tcG9uZW50cy9zcmMvcHVibGljLWFwaS50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQTs7R0FFRztBQUVILGNBQWMsOEJBQThCLENBQUM7QUFDN0MsY0FBYyxvQ0FBb0MsQ0FBQztBQUNuRCxjQUFjLG1EQUFtRCxDQUFDO0FBQ2xFLGNBQWMsaUJBQWlCLENBQUM7QUFDaEMsY0FBYyxrREFBa0QsQ0FBQyIsInNvdXJjZXNDb250ZW50IjpbIi8qXG4gKiBQdWJsaWMgQVBJIFN1cmZhY2Ugb2Ygbm92YS1jb21wb25lbnRzXG4gKi9cblxuZXhwb3J0ICogZnJvbSAnLi9saWIvbm92YS1jb21wb25lbnRzLm1vZHVsZSc7XG5leHBvcnQgKiBmcm9tICcuL2xpYi9zdGVuY2lsLWdlbmVyYXRlZC9jb21wb25lbnRzJztcbmV4cG9ydCAqIGZyb20gJy4vbGliL3N0ZW5jaWwtZ2VuZXJhdGVkL2NvbXBvbmVudC12YWx1ZS1hY2Nlc3NvcnMnO1xuZXhwb3J0ICogZnJvbSAnLi9saWIvcHJvdmlkZXJzJztcbmV4cG9ydCAqIGZyb20gJ0Bub3ZhLWRlc2lnbi1zeXN0ZW0vbm92YS13ZWJjb21wb25lbnRzL2NvbnN0YW50cyc7XG4iXX0=

package/dist/nova-components/fesm2022/nova-components.mjs

@@ -1,9 +1,11 @@
 import * as i0 from '@angular/core';
-import { ChangeDetectionStrategy, Component, HostListener, Directive, APP_INITIALIZER, NgModule } from '@angular/core';
+import { ChangeDetectionStrategy, Component, HostListener, Directive, APP_INITIALIZER, NgModule, Injectable, ElementRef, ViewChildren, Input, CUSTOM_ELEMENTS_SCHEMA } from '@angular/core';
 import { defineCustomElements } from '@nova-design-system/nova-webcomponents/loader';
 import { __decorate } from 'tslib';
-import { fromEvent } from 'rxjs';
+import { fromEvent, BehaviorSubject } from 'rxjs';
 import { NG_VALUE_ACCESSOR } from '@angular/forms';
+import * as i2 from '@angular/common';
+import { CommonModule } from '@angular/common';
 export * from '@nova-design-system/nova-webcomponents/constants';
 
 /* eslint-disable */
@@ -1004,12 +1006,12 @@ let NvNotification = class NvNotification {
         proxyOutputs(this, this.el, ['hiddenChanged']);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: NvNotification, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: NvNotification, selector: "nv-notification", inputs: { dismissible: "dismissible", emphasis: "emphasis", feedback: "feedback", heading: "heading", hidden: "hidden", icon: "icon", message: "message", uid: "uid" }, ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: NvNotification, selector: "nv-notification", inputs: { dismissible: "dismissible", emphasis: "emphasis", feedback: "feedback", heading: "heading", hidden: "hidden", icon: "icon", initiallyHidden: "initiallyHidden", message: "message", uid: "uid" }, ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 };
 NvNotification = __decorate([
     ProxyCmp({
-        inputs: ['dismissible', 'emphasis', 'feedback', 'heading', 'hidden', 'icon', 'message', 'uid'],
-        methods: ['dismiss']
+        inputs: ['dismissible', 'emphasis', 'feedback', 'heading', 'hidden', 'icon', 'initiallyHidden', 'message', 'uid'],
+        methods: ['dismiss', 'show']
     })
 ], NvNotification);
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: NvNotification, decorators: [{
@@ -1019,7 +1021,32 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
                     changeDetection: ChangeDetectionStrategy.OnPush,
                     template: '<ng-content></ng-content>',
                     // eslint-disable-next-line @angular-eslint/no-inputs-metadata-property
-                    inputs: ['dismissible', 'emphasis', 'feedback', 'heading', 'hidden', 'icon', 'message', 'uid'],
+                    inputs: ['dismissible', 'emphasis', 'feedback', 'heading', 'hidden', 'icon', 'initiallyHidden', 'message', 'uid'],
+                    standalone: false
+                }]
+        }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }, { type: i0.ElementRef }, { type: i0.NgZone }] });
+let NvNotificationcontainer = class NvNotificationcontainer {
+    constructor(c, r, z) {
+        this.z = z;
+        c.detach();
+        this.el = r.nativeElement;
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: NvNotificationcontainer, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: NvNotificationcontainer, selector: "nv-notificationcontainer", inputs: { position: "position" }, ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+};
+NvNotificationcontainer = __decorate([
+    ProxyCmp({
+        inputs: ['position']
+    })
+], NvNotificationcontainer);
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: NvNotificationcontainer, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'nv-notificationcontainer',
+                    changeDetection: ChangeDetectionStrategy.OnPush,
+                    template: '<ng-content></ng-content>',
+                    // eslint-disable-next-line @angular-eslint/no-inputs-metadata-property
+                    inputs: ['position'],
                     standalone: false
                 }]
         }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }, { type: i0.ElementRef }, { type: i0.NgZone }] });
@@ -1292,6 +1319,7 @@ const DIRECTIVES = [
     NvMenu,
     NvMenuitem,
     NvNotification,
+    NvNotificationcontainer,
     NvPopover,
     NvRow,
     NvStack,
@@ -2079,7 +2107,7 @@ function provideNovaComponents() {
 }
 class NovaComponentsModule {
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: NovaComponentsModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.2.13", ngImport: i0, type: NovaComponentsModule, declarations: [NvAccordion, NvAccordionItem, NvAlert, NvAvatar, NvBadge, NvBreadcrumb, NvBreadcrumbs, NvButton, NvButtongroup, NvCalendar, NvCol, NvDatagrid, NvDatagridcolumn, NvDialog, NvDialogfooter, NvDialogheader, NvFieldcheckbox, NvFielddate, NvFielddaterange, NvFielddropdown, NvFielddropdownitem, NvFielddropdownitemcheck, NvFieldmultiselect, NvFieldnumber, NvFieldpassword, NvFieldradio, NvFieldselect, NvFieldslider, NvFieldtext, NvFieldtextarea, NvFieldtime, NvIcon, NvIconbutton, NvLoader, NvMenu, NvMenuitem, NvNotification, NvPopover, NvRow, NvStack, NvTable, NvTablecolumn, NvToggle, NvTogglebutton, NvTogglebuttongroup, NvTooltip], exports: [NvAccordion, NvAccordionItem, NvAlert, NvAvatar, NvBadge, NvBreadcrumb, NvBreadcrumbs, NvButton, NvButtongroup, NvCalendar, NvCol, NvDatagrid, NvDatagridcolumn, NvDialog, NvDialogfooter, NvDialogheader, NvFieldcheckbox, NvFielddate, NvFielddaterange, NvFielddropdown, NvFielddropdownitem, NvFielddropdownitemcheck, NvFieldmultiselect, NvFieldnumber, NvFieldpassword, NvFieldradio, NvFieldselect, NvFieldslider, NvFieldtext, NvFieldtextarea, NvFieldtime, NvIcon, NvIconbutton, NvLoader, NvMenu, NvMenuitem, NvNotification, NvPopover, NvRow, NvStack, NvTable, NvTablecolumn, NvToggle, NvTogglebutton, NvTogglebuttongroup, NvTooltip] }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.2.13", ngImport: i0, type: NovaComponentsModule, declarations: [NvAccordion, NvAccordionItem, NvAlert, NvAvatar, NvBadge, NvBreadcrumb, NvBreadcrumbs, NvButton, NvButtongroup, NvCalendar, NvCol, NvDatagrid, NvDatagridcolumn, NvDialog, NvDialogfooter, NvDialogheader, NvFieldcheckbox, NvFielddate, NvFielddaterange, NvFielddropdown, NvFielddropdownitem, NvFielddropdownitemcheck, NvFieldmultiselect, NvFieldnumber, NvFieldpassword, NvFieldradio, NvFieldselect, NvFieldslider, NvFieldtext, NvFieldtextarea, NvFieldtime, NvIcon, NvIconbutton, NvLoader, NvMenu, NvMenuitem, NvNotification, NvNotificationcontainer, NvPopover, NvRow, NvStack, NvTable, NvTablecolumn, NvToggle, NvTogglebutton, NvTogglebuttongroup, NvTooltip], exports: [NvAccordion, NvAccordionItem, NvAlert, NvAvatar, NvBadge, NvBreadcrumb, NvBreadcrumbs, NvButton, NvButtongroup, NvCalendar, NvCol, NvDatagrid, NvDatagridcolumn, NvDialog, NvDialogfooter, NvDialogheader, NvFieldcheckbox, NvFielddate, NvFielddaterange, NvFielddropdown, NvFielddropdownitem, NvFielddropdownitemcheck, NvFieldmultiselect, NvFieldnumber, NvFieldpassword, NvFieldradio, NvFieldselect, NvFieldslider, NvFieldtext, NvFieldtextarea, NvFieldtime, NvIcon, NvIconbutton, NvLoader, NvMenu, NvMenuitem, NvNotification, NvNotificationcontainer, NvPopover, NvRow, NvStack, NvTable, NvTablecolumn, NvToggle, NvTogglebutton, NvTogglebuttongroup, NvTooltip] }); }
     static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: NovaComponentsModule, providers: [provideNovaComponents()] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: NovaComponentsModule, decorators: [{
@@ -2103,6 +2131,315 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
                 }]
         }] });
 
+/**
+ * Utility function to generate unique IDs.
+ *
+ * @returns {string} A unique identifier string
+ */
+const generateId = () => {
+    return `notification-${Date.now()}-${Math.random()
+        .toString(36)
+        .substr(2, 9)}`;
+};
+/**
+ * Angular service for managing notifications.
+ */
+class NotificationService {
+    /**
+     * Current array of notifications.
+     *
+     * @returns {Notification[]} Array of active notifications
+     */
+    get notifications() {
+        return this._notifications.value;
+    }
+    constructor() {
+        this._notifications = new BehaviorSubject([]);
+        /**
+         * Observable stream of active notifications.
+         */
+        this.notifications$ = this._notifications.asObservable();
+        // keep track of all notification refs
+        this.elRefs = new Map();
+        this._config = {
+            position: 'top-right',
+            maxNotifications: 50,
+            className: '',
+        };
+    }
+    /**
+     * Configure the notification service.
+     *
+     * @param {NotificationServiceConfig} config Configuration options
+     */
+    configure(config) {
+        Object.assign(this._config, config);
+    }
+    /**
+     * Get the current configuration.
+     *
+     * @returns {Required<NotificationServiceConfig>} Current configuration
+     */
+    get config() {
+        return { ...this._config };
+    }
+    registerRef(id, el) {
+        this.elRefs.set(id, el);
+    }
+    unregisterRef(id) {
+        this.elRefs.delete(id);
+    }
+    clearRefs() {
+        this.elRefs.clear();
+    }
+    /**
+     * Show a new notification.
+     *
+     * @param {NotificationOptions} options The notification options
+     * @returns {string} The notification ID
+     */
+    show(options) {
+        const id = options.id || generateId();
+        const notification = {
+            id,
+            heading: options.heading,
+            message: options.message,
+            dismissible: options.dismissible ?? true,
+            emphasis: options.emphasis ?? 'medium',
+            feedback: options.feedback ?? 'information',
+            icon: options.icon,
+            actions: options.actions ?? [],
+            actionSlot: options.actionSlot,
+            createdAt: Date.now(),
+        };
+        const currentNotifications = this._notifications.value;
+        // Remove oldest notifications if we exceed max
+        const newNotifications = [notification, ...currentNotifications];
+        if (newNotifications.length > this._config.maxNotifications) {
+            this._notifications.next(newNotifications.slice(0, this._config.maxNotifications));
+        }
+        else {
+            this._notifications.next(newNotifications);
+        }
+        setTimeout(() => {
+            const ref = this.elRefs.get(id);
+            ref?.show();
+        }, 0);
+        return id;
+    }
+    /**
+     * Dismiss a specific notification by ID. This will remove the notification
+     * after the animation completes.
+     *
+     * @param {string} id The notification ID to dismiss
+     */
+    dismiss(id) {
+        this.elRefs.get(id)?.dismiss?.();
+    }
+    /**
+     * Immediately remove a specific notification by ID.
+     *
+     * @param {string} id The notification ID to dismiss
+     */
+    remove(id) {
+        const currentNotifications = this._notifications.value;
+        const filteredNotifications = currentNotifications.filter((notification) => notification.id !== id);
+        this._notifications.next(filteredNotifications);
+    }
+    /**
+     * Immediately remove all active notifications.
+     */
+    removeAll() {
+        this._notifications.next([]);
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: NotificationService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: NotificationService, providedIn: 'root' }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: NotificationService, decorators: [{
+            type: Injectable,
+            args: [{
+                    providedIn: 'root',
+                }]
+        }], ctorParameters: () => [] });
+
+/**
+ * Angular component that renders the notification container with active notifications.
+ */
+class NotificationServiceComponent {
+    constructor(notificationService) {
+        this.notificationService = notificationService;
+        /**
+         * Array of active notifications.
+         */
+        this.notifications = [];
+    }
+    /**
+     * Component initialization.
+     */
+    ngOnInit() {
+        // Use service config if no input provided
+        this.position ??= this.notificationService.config.position;
+        this.className ??= this.notificationService.config.className;
+        // Subscribe to notification changes
+        this.subscription = this.notificationService.notifications$.subscribe((list) => (this.notifications = list));
+    }
+    /**
+     * Synchronize notification elements/refs with the service.
+     */
+    ngAfterViewInit() {
+        const sync = () => {
+            this.notificationService.clearRefs();
+            for (const elRef of this.notificationEls.toArray()) {
+                const el = elRef.nativeElement;
+                const id = el.getAttribute('data-id');
+                if (id)
+                    this.notificationService.registerRef(id, el);
+            }
+        };
+        sync();
+        this.notificationEls.changes.subscribe(sync);
+    }
+    /**
+     * Component cleanup.
+     */
+    ngOnDestroy() {
+        this.subscription?.unsubscribe();
+        this.notificationService.clearRefs();
+    }
+    /**
+     * Track function for ngFor to optimize rendering.
+     *
+     * @param {number} index The index of the item
+     * @param {Notification} notification The notification item
+     * @returns {string} The notification ID
+     */
+    trackByNotificationId(index, notification) {
+        return notification.id;
+    }
+    /**
+     * Handle notification hidden state change.
+     *
+     * @param {CustomEvent<boolean>} event The hidden changed event
+     * @param {string} id The notification ID
+     */
+    handleHiddenChanged(event, id) {
+        if (event.detail && id) {
+            this.notificationService.remove(id);
+        }
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: NotificationServiceComponent, deps: [{ token: NotificationService }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: NotificationServiceComponent, isStandalone: true, selector: "nv-notification-service", inputs: { position: "position", className: "className" }, viewQueries: [{ propertyName: "notificationEls", predicate: ["notificationEl"], descendants: true, read: ElementRef }], ngImport: i0, template: `
+    <nv-notificationcontainer
+      [position]="position"
+      [class]="className"
+      data-testid="notification-container"
+    >
+      <nv-notification
+        *ngFor="
+          let notification of notifications;
+          trackBy: trackByNotificationId
+        "
+        #notificationEl
+        [attr.data-id]="notification.id"
+        [heading]="notification.heading"
+        [message]="notification.message"
+        [dismissible]="notification.dismissible"
+        [emphasis]="notification.emphasis"
+        [feedback]="notification.feedback"
+        [icon]="notification.icon"
+        [initiallyHidden]="true"
+        (hiddenChanged)="handleHiddenChanged($event, notification.id)"
+      >
+        <!-- Actions slot content for the custom element -->
+        <div
+          slot="actions"
+          class="flex gap-2"
+          *ngIf="notification.actions?.length || notification.actionSlot"
+        >
+          <!-- Config-driven actions -->
+          <nv-button
+            *ngFor="let action of notification.actions"
+            emphasis="low"
+            size="sm"
+            (click)="action.onClick()"
+          >
+            {{ action.label }}
+          </nv-button>
+
+          <!-- Component-driven actions -->
+          <ng-container
+            *ngIf="notification.actionSlot"
+            [ngComponentOutlet]="notification.actionSlot"
+          ></ng-container>
+        </div>
+      </nv-notification>
+    </nv-notificationcontainer>
+  `, isInline: true, dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2.NgComponentOutlet, selector: "[ngComponentOutlet]", inputs: ["ngComponentOutlet", "ngComponentOutletInputs", "ngComponentOutletInjector", "ngComponentOutletContent", "ngComponentOutletNgModule", "ngComponentOutletNgModuleFactory"] }, { kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: NotificationServiceComponent, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'nv-notification-service',
+                    standalone: true,
+                    imports: [CommonModule],
+                    schemas: [CUSTOM_ELEMENTS_SCHEMA],
+                    template: `
+    <nv-notificationcontainer
+      [position]="position"
+      [class]="className"
+      data-testid="notification-container"
+    >
+      <nv-notification
+        *ngFor="
+          let notification of notifications;
+          trackBy: trackByNotificationId
+        "
+        #notificationEl
+        [attr.data-id]="notification.id"
+        [heading]="notification.heading"
+        [message]="notification.message"
+        [dismissible]="notification.dismissible"
+        [emphasis]="notification.emphasis"
+        [feedback]="notification.feedback"
+        [icon]="notification.icon"
+        [initiallyHidden]="true"
+        (hiddenChanged)="handleHiddenChanged($event, notification.id)"
+      >
+        <!-- Actions slot content for the custom element -->
+        <div
+          slot="actions"
+          class="flex gap-2"
+          *ngIf="notification.actions?.length || notification.actionSlot"
+        >
+          <!-- Config-driven actions -->
+          <nv-button
+            *ngFor="let action of notification.actions"
+            emphasis="low"
+            size="sm"
+            (click)="action.onClick()"
+          >
+            {{ action.label }}
+          </nv-button>
+
+          <!-- Component-driven actions -->
+          <ng-container
+            *ngIf="notification.actionSlot"
+            [ngComponentOutlet]="notification.actionSlot"
+          ></ng-container>
+        </div>
+      </nv-notification>
+    </nv-notificationcontainer>
+  `,
+                }]
+        }], ctorParameters: () => [{ type: NotificationService }], propDecorators: { position: [{
+                type: Input
+            }], className: [{
+                type: Input
+            }], notificationEls: [{
+                type: ViewChildren,
+                args: ['notificationEl', { read: ElementRef }]
+            }] } });
+
 /*
  * Public API Surface of nova-components
  */
@@ -2111,5 +2448,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
  * Generated bundle index. Do not edit.
  */
 
-export { NovaComponentsModule, NovaComponentsValueAccessorModule, NvAccordion, NvAccordionItem, NvAlert, NvAlertValueAccessor, NvAvatar, NvBadge, NvBreadcrumb, NvBreadcrumbs, NvButton, NvButtongroup, NvCalendar, NvCalendarValueAccessor, NvCol, NvDatagrid, NvDatagridValueAccessor, NvDatagridcolumn, NvDialog, NvDialogValueAccessor, NvDialogfooter, NvDialogheader, NvFieldcheckbox, NvFieldcheckboxValueAccessor, NvFielddate, NvFielddateValueAccessor, NvFielddaterange, NvFielddaterangeValueAccessor, NvFielddropdown, NvFielddropdownValueAccessor, NvFielddropdownitem, NvFielddropdownitemcheck, NvFieldmultiselect, NvFieldmultiselectValueAccessor, NvFieldnumber, NvFieldnumberValueAccessor, NvFieldpassword, NvFieldpasswordValueAccessor, NvFieldradio, NvFieldradioValueAccessor, NvFieldselect, NvFieldselectValueAccessor, NvFieldslider, NvFieldsliderValueAccessor, NvFieldtext, NvFieldtextValueAccessor, NvFieldtextarea, NvFieldtextareaValueAccessor, NvFieldtime, NvIcon, NvIconbutton, NvLoader, NvMenu, NvMenuitem, NvNotification, NvNotificationValueAccessor, NvPopover, NvPopoverValueAccessor, NvRow, NvStack, NvTable, NvTablecolumn, NvToggle, NvToggleValueAccessor, NvTogglebutton, NvTogglebuttongroup, NvTogglebuttongroupValueAccessor, NvTooltip, VALUE_ACCESSORS, provideNovaComponents };
+export { NotificationService, NotificationServiceComponent, NovaComponentsModule, NovaComponentsValueAccessorModule, NvAccordion, NvAccordionItem, NvAlert, NvAlertValueAccessor, NvAvatar, NvBadge, NvBreadcrumb, NvBreadcrumbs, NvButton, NvButtongroup, NvCalendar, NvCalendarValueAccessor, NvCol, NvDatagrid, NvDatagridValueAccessor, NvDatagridcolumn, NvDialog, NvDialogValueAccessor, NvDialogfooter, NvDialogheader, NvFieldcheckbox, NvFieldcheckboxValueAccessor, NvFielddate, NvFielddateValueAccessor, NvFielddaterange, NvFielddaterangeValueAccessor, NvFielddropdown, NvFielddropdownValueAccessor, NvFielddropdownitem, NvFielddropdownitemcheck, NvFieldmultiselect, NvFieldmultiselectValueAccessor, NvFieldnumber, NvFieldnumberValueAccessor, NvFieldpassword, NvFieldpasswordValueAccessor, NvFieldradio, NvFieldradioValueAccessor, NvFieldselect, NvFieldselectValueAccessor, NvFieldslider, NvFieldsliderValueAccessor, NvFieldtext, NvFieldtextValueAccessor, NvFieldtextarea, NvFieldtextareaValueAccessor, NvFieldtime, NvIcon, NvIconbutton, NvLoader, NvMenu, NvMenuitem, NvNotification, NvNotificationValueAccessor, NvNotificationcontainer, NvPopover, NvPopoverValueAccessor, NvRow, NvStack, NvTable, NvTablecolumn, NvToggle, NvToggleValueAccessor, NvTogglebutton, NvTogglebuttongroup, NvTogglebuttongroupValueAccessor, NvTooltip, VALUE_ACCESSORS, provideNovaComponents };
 //# sourceMappingURL=nova-components.mjs.map