@indice/ng-components 0.2.143-beta → 0.2.146-beta
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/bundles/indice-ng-components.umd.js +13 -48
- package/bundles/indice-ng-components.umd.js.map +1 -1
- package/esm2015/lib/layouts/shell/shell-header/shell-header.component.js +13 -14
- package/esm2015/lib/layouts/shell/shell-layout/shell-layout.component.js +1 -1
- package/esm2015/lib/ng-components.module.js +2 -3
- package/fesm2015/indice-ng-components.js +14 -45
- package/fesm2015/indice-ng-components.js.map +1 -1
- package/lib/layouts/shell/shell-header/shell-header.component.d.ts +2 -3
- package/lib/ng-components.module.d.ts +0 -1
- package/package.json +1 -1
- package/esm2015/lib/services/notifications.service.js +0 -37
- package/lib/services/notifications.service.d.ts +0 -14
|
@@ -5,8 +5,8 @@ import { isPlatformBrowser, DOCUMENT, CommonModule } from '@angular/common';
|
|
|
5
5
|
import * as i1$1 from '@angular/router';
|
|
6
6
|
import { NavigationStart, Router, ActivationStart, RouterModule } from '@angular/router';
|
|
7
7
|
import { NG_VALUE_ACCESSOR } from '@angular/forms';
|
|
8
|
-
import { BehaviorSubject, Subject,
|
|
9
|
-
import { filter, map, debounceTime, distinctUntilChanged, startWith, catchError } from 'rxjs/operators';
|
|
8
|
+
import { BehaviorSubject, Subject, of, Observable, fromEvent } from 'rxjs';
|
|
9
|
+
import { filter, shareReplay, map, debounceTime, distinctUntilChanged, startWith, catchError } from 'rxjs/operators';
|
|
10
10
|
import * as i2 from '@indice/ng-auth';
|
|
11
11
|
import { AuthService, IndiceAuthModule } from '@indice/ng-auth';
|
|
12
12
|
|
|
@@ -1643,44 +1643,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.0.1", ngImpor
|
|
|
1643
1643
|
args: [{ providedIn: 'root' }]
|
|
1644
1644
|
}], ctorParameters: function () { return [{ type: i0.ComponentFactoryResolver }, { type: i0.Injector }, { type: i0.ApplicationRef }]; } });
|
|
1645
1645
|
|
|
1646
|
-
class NotificationsService {
|
|
1647
|
-
constructor(links) {
|
|
1648
|
-
this.links = links;
|
|
1649
|
-
this.unreadCountSubject$ = new ReplaySubject(1);
|
|
1650
|
-
this._notificationLinks = of([]);
|
|
1651
|
-
this.notificationLinksPath = 'notifications';
|
|
1652
|
-
this._notificationLinks = this.links[this.notificationLinksPath];
|
|
1653
|
-
}
|
|
1654
|
-
getMessagesObs() {
|
|
1655
|
-
return this._notificationLinks;
|
|
1656
|
-
}
|
|
1657
|
-
getUnreadCount(breakCache = false) {
|
|
1658
|
-
if (breakCache) {
|
|
1659
|
-
this._notificationLinks.pipe(map(notifications => {
|
|
1660
|
-
return notifications.filter(x => !x.isRead).length;
|
|
1661
|
-
})).subscribe((res) => this.unreadCountSubject$.next(res));
|
|
1662
|
-
}
|
|
1663
|
-
return this.unreadCountSubject$.asObservable();
|
|
1664
|
-
}
|
|
1665
|
-
}
|
|
1666
|
-
NotificationsService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.0.1", ngImport: i0, type: NotificationsService, deps: [{ token: APP_LINKS }], target: i0.ɵɵFactoryTarget.Injectable });
|
|
1667
|
-
NotificationsService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "12.0.1", ngImport: i0, type: NotificationsService, providedIn: 'root' });
|
|
1668
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.0.1", ngImport: i0, type: NotificationsService, decorators: [{
|
|
1669
|
-
type: Injectable,
|
|
1670
|
-
args: [{
|
|
1671
|
-
providedIn: 'root'
|
|
1672
|
-
}]
|
|
1673
|
-
}], ctorParameters: function () { return [{ type: undefined, decorators: [{
|
|
1674
|
-
type: Inject,
|
|
1675
|
-
args: [APP_LINKS]
|
|
1676
|
-
}] }]; } });
|
|
1677
|
-
|
|
1678
1646
|
class ShellHeaderComponent {
|
|
1679
|
-
constructor(authService, router, links
|
|
1647
|
+
constructor(authService, router, links) {
|
|
1680
1648
|
this.authService = authService;
|
|
1681
1649
|
this.router = router;
|
|
1682
1650
|
this.links = links;
|
|
1683
|
-
this._notifications = _notifications;
|
|
1684
1651
|
// tslint:disable-next-line:no-input-rename
|
|
1685
1652
|
this.sectionLinksPath = 'main';
|
|
1686
1653
|
this.notificationLinksPath = 'notifications';
|
|
@@ -1722,9 +1689,8 @@ class ShellHeaderComponent {
|
|
|
1722
1689
|
this.showUserNameOnHeader = (_b = this.config) === null || _b === void 0 ? void 0 : _b.showUserNameOnHeader;
|
|
1723
1690
|
this.sectionLinks = this.links[this.sectionLinksPath];
|
|
1724
1691
|
this.allNotificationsLink = this.links[this.allNotificationsLinkPath];
|
|
1725
|
-
this.notificationLinks = this.
|
|
1726
|
-
this.
|
|
1727
|
-
.subscribe((unreadCount) => (this.notificationsCount = unreadCount));
|
|
1692
|
+
this.notificationLinks = this.links[this.notificationLinksPath];
|
|
1693
|
+
this.getNotificationsCount();
|
|
1728
1694
|
this.routerSub$ = this.router.events.pipe(filter(event => event instanceof NavigationStart)).subscribe(event => {
|
|
1729
1695
|
this.mobileMenuExpanded = false;
|
|
1730
1696
|
this.userMenuExpanded = false;
|
|
@@ -1771,10 +1737,16 @@ class ShellHeaderComponent {
|
|
|
1771
1737
|
expandNotificationsMenu() {
|
|
1772
1738
|
this.notificationsMenuExpanded = !this.notificationsMenuExpanded;
|
|
1773
1739
|
this.userMenuExpanded = false;
|
|
1740
|
+
this.getNotificationsCount();
|
|
1741
|
+
}
|
|
1742
|
+
getNotificationsCount() {
|
|
1743
|
+
this.notificationLinks.pipe(shareReplay(1)).subscribe(notifications => {
|
|
1744
|
+
this.notificationsCount = notifications.filter(x => !x.isRead).length;
|
|
1745
|
+
});
|
|
1774
1746
|
}
|
|
1775
1747
|
}
|
|
1776
|
-
ShellHeaderComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.0.1", ngImport: i0, type: ShellHeaderComponent, deps: [{ token: AuthService }, { token: Router }, { token: APP_LINKS }
|
|
1777
|
-
ShellHeaderComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.0.1", type: ShellHeaderComponent, selector: "lib-shell-header", inputs: { sectionLinksPath: ["section-links", "sectionLinksPath"], notificationLinksPath: ["notification-links", "notificationLinksPath"], allNotificationsLinkPath: ["all-notifications", "allNotificationsLinkPath"], config: "config", border: "border" }, ngImport: i0, template: "<nav>\r\n <div class=\"shell-header-paddings\">\r\n <div [class]=\"border ? 'shell-header-border' : ''\">\r\n <div class=\"shell-header-menu-container\">\r\n <div class=\"shell-header-links-no-grow-container\">\r\n <div>\r\n <a href=\"#\"\r\n [routerLink]=\"['/']\"><img class=\"app-logo\"\r\n [src]=\"config.appLogo\"\r\n [alt]=\"config.appLogoAlt\" /></a>\r\n </div>\r\n </div>\r\n\r\n <div class=\"shell-header-link-container\">\r\n <ng-container *ngFor=\"let link of sectionLinks | async\">\r\n <a href=\"#\"\r\n [routerLink]=\"[link.path]\"\r\n [attr.target]=\"link.external ? '_blank' : '_self'\"\r\n [routerLinkActive]=\"['nav-link-active']\"\r\n [routerLinkActiveOptions]=\"{ exact: link.exact }\"\r\n class=\"nav-link\">\r\n {{ link.text }}\r\n </a>\r\n </ng-container>\r\n </div>\r\n\r\n <div class=\"shell-header-md-visible\">\r\n <div class=\"shell-header-links-no-grow-container\">\r\n\r\n <ng-container *ngFor=\"let link of links.profileActions | async\">\r\n <a class=\"shell-header-menu-rounded-button\"\r\n (clickOutside)=\"onClickOutsideProfile($event)\"\r\n [attr.href]=\"link.path\"\r\n [attr.target]=\"link.external ? '_blank' : '_self'\">\r\n <span class=\"sr-only\">{{ link.text }}</span>\r\n <i *ngIf=\"link.icon\"\r\n [class]=\"link.icon\"></i>\r\n </a>\r\n </ng-container>\r\n\r\n <!-- Profile dropdown -->\r\n <div class=\"ml-2 relative\"\r\n (clickOutside)=\"onClickOutsideProfile($event)\"\r\n *ngIf=\"profileMenuVisible\">\r\n <div [ngClass]=\"{'shell-header-profile': showUserNameOnHeader}\">\r\n <div *ngIf=\"user && showUserNameOnHeader\"\r\n class=\"shell-header-profile-userName\">\r\n {{ user.profile.name }}\r\n </div>\r\n <button type=\"button\"\r\n *ngIf=\"user\"\r\n (click)=\"userMenuExpanded = !userMenuExpanded\"\r\n class=\"shell-header-profile-dropdown-button\"\r\n id=\"user-menu\"\r\n aria-expanded=\"false\"\r\n aria-haspopup=\"true\">\r\n <span class=\"sr-only\">Open user menu</span>\r\n <span class=\"avatar-container\">\r\n <span class=\"avatar-text\">{{this.avatarName}}</span>\r\n </span>\r\n </button>\r\n\r\n <button type=\"button\"\r\n *ngIf=\"!user\"\r\n (click)=\"signin(null)\"\r\n class=\"shell-header-profile-dropdown-button\"\r\n id=\"user-menu\"\r\n aria-expanded=\"false\"\r\n aria-haspopup=\"true\">\r\n <span class=\"sr-only\">sign in</span>\r\n <span class=\"avatar-container\">\r\n <span class=\"avatar-text\"><i class=\"ms-Icon ms-Icon--Signin\"></i></span>\r\n </span>\r\n </button>\r\n\r\n <div *ngIf=\"userMenuExpanded\"\r\n [ngClass]=\"showUserNameOnHeader ? 'shell-header-profile-dropdown-with-username' : 'shell-header-profile-dropdown'\"\r\n role=\"menu\"\r\n aria-orientation=\"vertical\"\r\n aria-labelledby=\"user-menu\">\r\n <!-- <a href=\"#\" class=\"block px-4 py-2 text-sm text-gray-700 hover:bg-gray-100\" role=\"menuitem\">\u0391\u03C0\u03BF\u03C3\u03CD\u03BD\u03B4\u03B5\u03C3\u03B7</a> -->\r\n <ng-container *ngFor=\"let link of links.profile | async\">\r\n <!-- <a *ngIf=\"link.external\" [attr.href]=\"link.path\" [attr.target]=\"'_blank'\" class=\"nav-link-profile\">\r\n {{ link.text }}\r\n </a> -->\r\n <a [routerLink]=\"link.path\"\r\n [routerLinkActive]=\"['nav-link-profile-active']\"\r\n [routerLinkActiveOptions]=\"{ exact: link.exact }\"\r\n class=\"nav-link-profile\">\r\n {{ link.text }}\r\n </a>\r\n </ng-container>\r\n </div>\r\n\r\n </div>\r\n </div>\r\n\r\n <!-- Notifications dropdown -->\r\n <div class=\"ml-2 relative\"\r\n (clickOutside)=\"onClickOutsideNotifications($event)\"\r\n *ngIf=\"notificationsMenuVisible\">\r\n <!-- Notifications Button -->\r\n <button type=\"button\"\r\n class=\"mobile-menu-rounded-button bg-transparent\"\r\n *ngIf=\"showNotifications\"\r\n (click)=\"expandNotificationsMenu()\"\r\n id=\"notifications-menu\"\r\n aria-expanded=\"false\"\r\n aria-haspopup=\"true\">\r\n <span class=\"sr-only\">View notifications</span>\r\n <span class=\"relative inline-block\">\r\n <!-- Heroicon name: outline/bell -->\r\n <svg class=\"mobile-menu-rounded-button-icon-style\"\r\n xmlns=\"http://www.w3.org/2000/svg\"\r\n fill=\"none\"\r\n viewBox=\"0 0 24 24\"\r\n stroke=\"currentColor\"\r\n aria-hidden=\"true\">\r\n <path stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"\r\n stroke-width=\"2\"\r\n d=\"M15 17h5l-1.405-1.405A2.032 2.032 0 0118 14.158V11a6.002 6.002 0 00-4-5.659V5a2 2 0 10-4 0v.341C7.67 6.165 6 8.388 6 11v3.159c0 .538-.214 1.055-.595 1.436L4 17h5m6 0v1a3 3 0 11-6 0v-1m6 0H9\" />\r\n </svg>\r\n <span *ngIf=\"notificationsCount > 0\"\r\n class=\"absolute top-0 right-0 inline-flex items-center justify-center px-2 py-1 text-xs font-bold leading-none text-gray-100 transform translate-x-1/2 -translate-y-1/2 bg-gray-500 rounded-full\">{{notificationsCount}}</span>\r\n </span>\r\n </button>\r\n\r\n <div *ngIf=\"notificationsMenuExpanded\"\r\n [ngClass]=\"showUserNameOnHeader ? 'shell-header-notifications-dropdown-with-username' : 'shell-header-notifications-dropdown'\"\r\n role=\"menu\"\r\n aria-orientation=\"vertical\"\r\n aria-labelledby=\"notifications-menu\">\r\n <div class=\"max-h-64 overflow-y-auto notification-messages min-h\">\r\n <ng-container *ngIf=\"!notificationLinks; else notificationsDropDown\"\r\n class=\"py-5\">\r\n <div class=\"nav-link-notifications hover:bg-transparent\">\r\n \u0394\u03B5\u03BD \u03AD\u03C7\u03B5\u03C4\u03B5 \u03BD\u03AD\u03B5\u03C2 \u03B5\u03B9\u03B4\u03BF\u03C0\u03BF\u03B9\u03AE\u03C3\u03B5\u03B9\u03C2\r\n </div>\r\n </ng-container>\r\n <ng-template #notificationsDropDown>\r\n <ul class=\"pr-1.5\">\r\n <ng-container *ngIf=\"notificationLinks | async as obs; else loading\">\r\n <ng-container *ngIf=\"obs.length <= 0\"\r\n class=\"py-5\">\r\n <div class=\"nav-link-notifications hover:bg-transparent\">\r\n \u0394\u03B5\u03BD \u03AD\u03C7\u03B5\u03C4\u03B5 \u03BD\u03AD\u03B5\u03C2 \u03B5\u03B9\u03B4\u03BF\u03C0\u03BF\u03B9\u03AE\u03C3\u03B5\u03B9\u03C2\r\n </div>\r\n </ng-container>\r\n <ng-container *ngFor=\"let link of obs\">\r\n <li class=\"mb-2\"\r\n [ngClass]=\"{'border-l-2 border-blue-500 bg-blue-50 hover:bg-blue-50': !link.isRead }\">\r\n <div class=\"flex justify-between\">\r\n <div class=\"flex-grow\">\r\n <a [routerLink]=\"link.path\"\r\n class=\"nav-link-notifications grid\"\r\n [ngClass]=\"!link.isRead ? ' hover:bg-blue-50' : 'border-b border-gray-100'\">\r\n <div class=\"flex flex-col\">\r\n <div class=\"font-thin tracking-tighter\">\r\n {{ link.creationDate | date: 'EEE, d MMMM' }}\r\n </div>\r\n <div class=\"font-bold\">\r\n {{ link.text }}\r\n </div>\r\n </div>\r\n </a>\r\n </div>\r\n <!-- <div class=\"flex-none font-thin tracking-tighter\">\r\n <button type=\"button\"\r\n title=\"\u0394\u03B9\u03B1\u03B3\u03C1\u03B1\u03C6\u03AE\"\r\n class=\"text-red-600 hover:text-red-900\">\r\n <span class=\"ms-Icon ms-Icon--Delete\"></span>\r\n </button>\r\n </div> -->\r\n </div>\r\n </li>\r\n\r\n\r\n </ng-container>\r\n </ng-container>\r\n\r\n <ng-template #loading>\r\n <div class=\"h-32 flex items-center justify-center\">\r\n <div class=\"animate-pulse text-s text-gray-600\">Loading...</div>\r\n </div>\r\n </ng-template>\r\n\r\n\r\n </ul>\r\n </ng-template>\r\n </div>\r\n <div class=\"p-1 rounded-sm\">\r\n <a [routerLink]=\"(allNotificationsLink | async)?.path\">\r\n <button type=\"button\"\r\n class=\"shell-header-notifications-dropdown-view-all-button\">\u03A0\u03C1\u03BF\u03B2\u03BF\u03BB\u03AE \u03CC\u03BB\u03C9\u03BD</button>\r\n </a>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <div class=\"mobile-menu-button-container\">\r\n <!-- Mobile menu button -->\r\n <button type=\"button\"\r\n (click)=\"mobileMenuExpanded = !mobileMenuExpanded\"\r\n class=\"mobile-menu-button\"\r\n aria-controls=\"mobile-menu\"\r\n [attr.aria-expanded]=\"mobileMenuExpanded\">\r\n <span class=\"sr-only\">Open main menu</span>\r\n <!--Heroicon name: outline/menu Menu open: \"hidden\", Menu closed: \"block\"-->\r\n <svg class=\"block h-6 w-6\"\r\n xmlns=\"http://www.w3.org/2000/svg\"\r\n fill=\"none\"\r\n viewBox=\"0 0 24 24\"\r\n stroke=\"currentColor\"\r\n aria-hidden=\"true\">\r\n <path stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"\r\n stroke-width=\"2\"\r\n d=\"M4 6h16M4 12h16M4 18h16\" />\r\n </svg>\r\n <!--Heroicon name: outline/x Menu open: \"block\", Menu closed: \"hidden\"-->\r\n <svg class=\"hidden h-6 w-6\"\r\n xmlns=\"http://www.w3.org/2000/svg\"\r\n fill=\"none\"\r\n viewBox=\"0 0 24 24\"\r\n stroke=\"currentColor\"\r\n aria-hidden=\"true\">\r\n <path stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"\r\n stroke-width=\"2\"\r\n d=\"M6 18L18 6M6 6l12 12\" />\r\n </svg>\r\n </button>\r\n </div>\r\n\r\n </div>\r\n </div>\r\n </div>\r\n <!-- Mobile menu, show/hide based on menu state. -->\r\n <div class=\"mobile-menu-container\"\r\n *ngIf=\"mobileMenuExpanded\"\r\n id=\"mobile-menu\">\r\n <div class=\"mobile-menu-link-container\">\r\n <ng-container *ngFor=\"let link of sectionLinks | async\">\r\n <a *ngIf=\"link.external\"\r\n [attr.href]=\"link.path\"\r\n [attr.target]=\"'_blank'\"\r\n class=\"nav-link-mobile\">\r\n {{ link.text }}\r\n </a>\r\n <a *ngIf=\"!link.external\"\r\n [routerLink]=\"link.path\"\r\n [routerLinkActive]=\"['nav-link-mobile-active']\"\r\n [routerLinkActiveOptions]=\"{ exact: link.exact }\"\r\n class=\"nav-link-mobile\">\r\n {{ link.text }}\r\n </a>\r\n </ng-container>\r\n <ng-container *ngIf=\"!user\">\r\n <a href=\"#\"\r\n (click)=\"signin($event)\"\r\n class=\"nav-link-mobile\">\r\n <i class=\"ms-Icon ms-Icon--Signin mr-2\"></i>\u03A3\u03CD\u03BD\u03B4\u03B5\u03C3\u03B7\r\n </a>\r\n </ng-container>\r\n </div>\r\n <div class=\"mobile-menu-user-info-container\"\r\n *ngIf=\"user\">\r\n <div class=\"mobile-menu-user-info-container-inner\">\r\n <div class=\"flex-shrink-0\">\r\n <span class=\"mobile-menu-avatar-container\">\r\n <span class=\"mobile-menu-avatar-name\">{{ this.avatarName }}</span>\r\n </span>\r\n </div>\r\n <div class=\"ml-3\">\r\n <div class=\"mobile-menu-user-name\">{{ user.profile.name }}</div>\r\n <div class=\"mobile-menu-user-email\">{{ user.profile.email }}</div>\r\n </div>\r\n <a [routerLink]=\"(allNotificationsLink | async)?.path\">\r\n <button class=\"mobile-menu-rounded-button\">\r\n <span class=\"sr-only\">View notifications</span>\r\n <!-- Heroicon name: outline/bell -->\r\n <svg class=\"mobile-menu-rounded-button-icon-style\"\r\n xmlns=\"http://www.w3.org/2000/svg\"\r\n fill=\"none\"\r\n viewBox=\"0 0 24 24\"\r\n stroke=\"currentColor\"\r\n aria-hidden=\"true\">\r\n <path stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"\r\n stroke-width=\"2\"\r\n d=\"M15 17h5l-1.405-1.405A2.032 2.032 0 0118 14.158V11a6.002 6.002 0 00-4-5.659V5a2 2 0 10-4 0v.341C7.67 6.165 6 8.388 6 11v3.159c0 .538-.214 1.055-.595 1.436L4 17h5m6 0v1a3 3 0 11-6 0v-1m6 0H9\" />\r\n </svg>\r\n </button>\r\n </a>\r\n </div>\r\n <div class=\"mobile-menu-link-container\">\r\n <ng-container *ngFor=\"let link of links.profile | async\">\r\n <a *ngIf=\"link.external\"\r\n [attr.href]=\"link.path\"\r\n [attr.target]=\"'_blank'\"\r\n class=\"nav-link-mobile\">\r\n {{ link.text }}\r\n </a>\r\n <a [routerLink]=\"link.path\"\r\n [routerLinkActive]=\"['nav-link-mobile-active']\"\r\n [routerLinkActiveOptions]=\"{ exact: link.exact }\"\r\n class=\"nav-link-mobile\">\r\n {{ link.text }}\r\n </a>\r\n </ng-container>\r\n <!-- <a href=\"#\" class=\"block px-3 py-2 rounded-sm text-base font-medium text-gray-400 hover:text-white hover:bg-gray-700\">\u0391\u03C0\u03BF\u03C3\u03CD\u03BD\u03B4\u03B5\u03C3\u03B7</a> -->\r\n </div>\r\n </div>\r\n </div>\r\n</nav>\r\n", directives: [{ type: i1$1.RouterLinkWithHref, selector: "a[routerLink],area[routerLink]", inputs: ["routerLink", "target", "queryParams", "fragment", "queryParamsHandling", "preserveFragment", "skipLocationChange", "replaceUrl", "state", "relativeTo"] }, { type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i1$1.RouterLinkActive, selector: "[routerLinkActive]", inputs: ["routerLinkActiveOptions", "routerLinkActive"], exportAs: ["routerLinkActive"] }, { type: ClickOutsideDirective, selector: "[clickOutside]", inputs: ["clickOutsideEnabled", "attachOutsideOnClick", "delayClickOutsideInit", "emitOnBlur", "exclude", "excludeBeforeClick", "clickOutsideEvents"], outputs: ["clickOutside"] }, { type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }], pipes: { "async": i1.AsyncPipe, "date": i1.DatePipe } });
|
|
1748
|
+
ShellHeaderComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.0.1", ngImport: i0, type: ShellHeaderComponent, deps: [{ token: AuthService }, { token: Router }, { token: APP_LINKS }], target: i0.ɵɵFactoryTarget.Component });
|
|
1749
|
+
ShellHeaderComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.0.1", type: ShellHeaderComponent, selector: "lib-shell-header", inputs: { sectionLinksPath: ["section-links", "sectionLinksPath"], notificationLinksPath: ["notification-links", "notificationLinksPath"], allNotificationsLinkPath: ["all-notifications", "allNotificationsLinkPath"], config: "config", border: "border" }, ngImport: i0, template: "<nav>\r\n <div class=\"shell-header-paddings\">\r\n <div [class]=\"border ? 'shell-header-border' : ''\">\r\n <div class=\"shell-header-menu-container\">\r\n <div class=\"shell-header-links-no-grow-container\">\r\n <div>\r\n <a href=\"#\" [routerLink]=\"['/']\"><img class=\"app-logo\" [src]=\"config.appLogo\" [alt]=\"config.appLogoAlt\" /></a>\r\n </div>\r\n </div>\r\n\r\n <div class=\"shell-header-link-container\">\r\n <ng-container *ngFor=\"let link of sectionLinks | async\">\r\n <a\r\n href=\"#\"\r\n (click)=\"getNotificationsCount()\"\r\n [routerLink]=\"[link.path]\"\r\n [attr.target]=\"link.external ? '_blank' : '_self'\"\r\n [routerLinkActive]=\"['nav-link-active']\"\r\n [routerLinkActiveOptions]=\"{ exact: link.exact }\"\r\n class=\"nav-link\"\r\n >\r\n {{ link.text }}\r\n </a>\r\n </ng-container>\r\n </div>\r\n\r\n <div class=\"shell-header-md-visible\">\r\n <div class=\"shell-header-links-no-grow-container\">\r\n <ng-container *ngFor=\"let link of links.profileActions | async\">\r\n <a\r\n class=\"shell-header-menu-rounded-button\"\r\n (clickOutside)=\"onClickOutsideProfile($event)\"\r\n [attr.href]=\"link.path\"\r\n [attr.target]=\"link.external ? '_blank' : '_self'\"\r\n >\r\n <span class=\"sr-only\">{{ link.text }}</span>\r\n <i *ngIf=\"link.icon\" [class]=\"link.icon\"></i>\r\n </a>\r\n </ng-container>\r\n\r\n <!-- Profile dropdown -->\r\n <div class=\"ml-2 relative\" (clickOutside)=\"onClickOutsideProfile($event)\" *ngIf=\"profileMenuVisible\">\r\n <div [ngClass]=\"{ 'shell-header-profile': showUserNameOnHeader }\">\r\n <div *ngIf=\"user && showUserNameOnHeader\" class=\"shell-header-profile-userName\">\r\n {{ user.profile.name }}\r\n </div>\r\n <button\r\n type=\"button\"\r\n *ngIf=\"user\"\r\n (click)=\"userMenuExpanded = !userMenuExpanded\"\r\n class=\"shell-header-profile-dropdown-button\"\r\n id=\"user-menu\"\r\n aria-expanded=\"false\"\r\n aria-haspopup=\"true\"\r\n >\r\n <span class=\"sr-only\">Open user menu</span>\r\n <span class=\"avatar-container\">\r\n <span class=\"avatar-text\">{{ this.avatarName }}</span>\r\n </span>\r\n </button>\r\n\r\n <button\r\n type=\"button\"\r\n *ngIf=\"!user\"\r\n (click)=\"signin(null)\"\r\n class=\"shell-header-profile-dropdown-button\"\r\n id=\"user-menu\"\r\n aria-expanded=\"false\"\r\n aria-haspopup=\"true\"\r\n >\r\n <span class=\"sr-only\">sign in</span>\r\n <span class=\"avatar-container\">\r\n <span class=\"avatar-text\"><i class=\"ms-Icon ms-Icon--Signin\"></i></span>\r\n </span>\r\n </button>\r\n\r\n <div\r\n *ngIf=\"userMenuExpanded\"\r\n [ngClass]=\"showUserNameOnHeader ? 'shell-header-profile-dropdown-with-username' : 'shell-header-profile-dropdown'\"\r\n role=\"menu\"\r\n aria-orientation=\"vertical\"\r\n aria-labelledby=\"user-menu\"\r\n >\r\n <!-- <a href=\"#\" class=\"block px-4 py-2 text-sm text-gray-700 hover:bg-gray-100\" role=\"menuitem\">\u0391\u03C0\u03BF\u03C3\u03CD\u03BD\u03B4\u03B5\u03C3\u03B7</a> -->\r\n <ng-container *ngFor=\"let link of links.profile | async\">\r\n <!-- <a *ngIf=\"link.external\" [attr.href]=\"link.path\" [attr.target]=\"'_blank'\" class=\"nav-link-profile\">\r\n {{ link.text }}\r\n </a> -->\r\n <a\r\n [routerLink]=\"link.path\"\r\n [routerLinkActive]=\"['nav-link-profile-active']\"\r\n [routerLinkActiveOptions]=\"{ exact: link.exact }\"\r\n class=\"nav-link-profile\"\r\n >\r\n {{ link.text }}\r\n </a>\r\n </ng-container>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <!-- Notifications dropdown -->\r\n <div class=\"ml-2 relative\" (clickOutside)=\"onClickOutsideNotifications($event)\" *ngIf=\"notificationsMenuVisible\">\r\n <!-- Notifications Button -->\r\n <button\r\n type=\"button\"\r\n class=\"mobile-menu-rounded-button bg-transparent\"\r\n *ngIf=\"showNotifications\"\r\n (click)=\"expandNotificationsMenu()\"\r\n id=\"notifications-menu\"\r\n aria-expanded=\"false\"\r\n aria-haspopup=\"true\"\r\n >\r\n <span class=\"sr-only\">View notifications</span>\r\n <span class=\"relative inline-block\">\r\n <!-- Heroicon name: outline/bell -->\r\n <svg\r\n class=\"mobile-menu-rounded-button-icon-style\"\r\n xmlns=\"http://www.w3.org/2000/svg\"\r\n fill=\"none\"\r\n viewBox=\"0 0 24 24\"\r\n stroke=\"currentColor\"\r\n aria-hidden=\"true\"\r\n >\r\n <path\r\n stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"\r\n stroke-width=\"2\"\r\n d=\"M15 17h5l-1.405-1.405A2.032 2.032 0 0118 14.158V11a6.002 6.002 0 00-4-5.659V5a2 2 0 10-4 0v.341C7.67 6.165 6 8.388 6 11v3.159c0 .538-.214 1.055-.595 1.436L4 17h5m6 0v1a3 3 0 11-6 0v-1m6 0H9\"\r\n />\r\n </svg>\r\n <span\r\n *ngIf=\"notificationsCount > 0\"\r\n class=\"absolute top-0 right-0 inline-flex items-center justify-center px-2 py-1 text-xs font-bold leading-none text-gray-100 transform translate-x-1/2 -translate-y-1/2 bg-gray-500 rounded-full\"\r\n >{{ notificationsCount }}</span\r\n >\r\n </span>\r\n </button>\r\n\r\n <div\r\n *ngIf=\"notificationsMenuExpanded\"\r\n [ngClass]=\"\r\n showUserNameOnHeader ? 'shell-header-notifications-dropdown-with-username' : 'shell-header-notifications-dropdown'\r\n \"\r\n role=\"menu\"\r\n aria-orientation=\"vertical\"\r\n aria-labelledby=\"notifications-menu\"\r\n >\r\n <div class=\"max-h-64 overflow-y-auto notification-messages min-h\">\r\n <ng-container *ngIf=\"!notificationLinks; else notificationsDropDown\" class=\"py-5\">\r\n <div class=\"nav-link-notifications hover:bg-transparent\">\u0394\u03B5\u03BD \u03AD\u03C7\u03B5\u03C4\u03B5 \u03BD\u03AD\u03B5\u03C2 \u03B5\u03B9\u03B4\u03BF\u03C0\u03BF\u03B9\u03AE\u03C3\u03B5\u03B9\u03C2</div>\r\n </ng-container>\r\n <ng-template #notificationsDropDown>\r\n <ul class=\"pr-1.5\">\r\n <ng-container *ngIf=\"notificationLinks | async as obs; else loading\">\r\n <ng-container *ngIf=\"obs.length <= 0\" class=\"py-5\">\r\n <div class=\"nav-link-notifications hover:bg-transparent\">\u0394\u03B5\u03BD \u03AD\u03C7\u03B5\u03C4\u03B5 \u03BD\u03AD\u03B5\u03C2 \u03B5\u03B9\u03B4\u03BF\u03C0\u03BF\u03B9\u03AE\u03C3\u03B5\u03B9\u03C2</div>\r\n </ng-container>\r\n <ng-container *ngFor=\"let link of obs\">\r\n <li class=\"mb-2\" [ngClass]=\"{ 'border-l-2 border-blue-500 bg-blue-50 hover:bg-blue-50': !link.isRead }\">\r\n <div class=\"flex justify-between\">\r\n <div class=\"flex-grow\">\r\n <a\r\n [routerLink]=\"link.path\"\r\n class=\"nav-link-notifications grid\"\r\n [ngClass]=\"!link.isRead ? ' hover:bg-blue-50' : 'border-b border-gray-100'\"\r\n >\r\n <div class=\"flex flex-col\">\r\n <div class=\"font-thin tracking-tighter\">\r\n {{ link.creationDate | date: \"EEE, d MMMM\" }}\r\n </div>\r\n <div class=\"font-bold\">\r\n {{ link.text }}\r\n </div>\r\n </div>\r\n </a>\r\n </div>\r\n <!-- <div class=\"flex-none font-thin tracking-tighter\">\r\n <button type=\"button\"\r\n title=\"\u0394\u03B9\u03B1\u03B3\u03C1\u03B1\u03C6\u03AE\"\r\n class=\"text-red-600 hover:text-red-900\">\r\n <span class=\"ms-Icon ms-Icon--Delete\"></span>\r\n </button>\r\n </div> -->\r\n </div>\r\n </li>\r\n </ng-container>\r\n </ng-container>\r\n\r\n <ng-template #loading>\r\n <div class=\"h-32 flex items-center justify-center\">\r\n <div class=\"animate-pulse text-s text-gray-600\">Loading...</div>\r\n </div>\r\n </ng-template>\r\n </ul>\r\n </ng-template>\r\n </div>\r\n <div class=\"p-1 rounded-sm\">\r\n <a [routerLink]=\"(allNotificationsLink | async)?.path\">\r\n <button type=\"button\" class=\"shell-header-notifications-dropdown-view-all-button\">\u03A0\u03C1\u03BF\u03B2\u03BF\u03BB\u03AE \u03CC\u03BB\u03C9\u03BD</button>\r\n </a>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <div class=\"mobile-menu-button-container\">\r\n <!-- Mobile menu button -->\r\n <button\r\n type=\"button\"\r\n (click)=\"mobileMenuExpanded = !mobileMenuExpanded\"\r\n class=\"mobile-menu-button\"\r\n aria-controls=\"mobile-menu\"\r\n [attr.aria-expanded]=\"mobileMenuExpanded\"\r\n >\r\n <span class=\"sr-only\">Open main menu</span>\r\n <!--Heroicon name: outline/menu Menu open: \"hidden\", Menu closed: \"block\"-->\r\n <svg\r\n class=\"block h-6 w-6\"\r\n xmlns=\"http://www.w3.org/2000/svg\"\r\n fill=\"none\"\r\n viewBox=\"0 0 24 24\"\r\n stroke=\"currentColor\"\r\n aria-hidden=\"true\"\r\n >\r\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M4 6h16M4 12h16M4 18h16\" />\r\n </svg>\r\n <!--Heroicon name: outline/x Menu open: \"block\", Menu closed: \"hidden\"-->\r\n <svg\r\n class=\"hidden h-6 w-6\"\r\n xmlns=\"http://www.w3.org/2000/svg\"\r\n fill=\"none\"\r\n viewBox=\"0 0 24 24\"\r\n stroke=\"currentColor\"\r\n aria-hidden=\"true\"\r\n >\r\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M6 18L18 6M6 6l12 12\" />\r\n </svg>\r\n </button>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <!-- Mobile menu, show/hide based on menu state. -->\r\n <div class=\"mobile-menu-container\" *ngIf=\"mobileMenuExpanded\" id=\"mobile-menu\">\r\n <div class=\"mobile-menu-link-container\">\r\n <ng-container *ngFor=\"let link of sectionLinks | async\">\r\n <a *ngIf=\"link.external\" [attr.href]=\"link.path\" [attr.target]=\"'_blank'\" class=\"nav-link-mobile\">\r\n {{ link.text }}\r\n </a>\r\n <a\r\n *ngIf=\"!link.external\"\r\n [routerLink]=\"link.path\"\r\n [routerLinkActive]=\"['nav-link-mobile-active']\"\r\n [routerLinkActiveOptions]=\"{ exact: link.exact }\"\r\n class=\"nav-link-mobile\"\r\n >\r\n {{ link.text }}\r\n </a>\r\n </ng-container>\r\n <ng-container *ngIf=\"!user\">\r\n <a href=\"#\" (click)=\"signin($event)\" class=\"nav-link-mobile\"> <i class=\"ms-Icon ms-Icon--Signin mr-2\"></i>\u03A3\u03CD\u03BD\u03B4\u03B5\u03C3\u03B7 </a>\r\n </ng-container>\r\n </div>\r\n <div class=\"mobile-menu-user-info-container\" *ngIf=\"user\">\r\n <div class=\"mobile-menu-user-info-container-inner\">\r\n <div class=\"flex-shrink-0\">\r\n <span class=\"mobile-menu-avatar-container\">\r\n <span class=\"mobile-menu-avatar-name\">{{ this.avatarName }}</span>\r\n </span>\r\n </div>\r\n <div class=\"ml-3\">\r\n <div class=\"mobile-menu-user-name\">{{ user.profile.name }}</div>\r\n <div class=\"mobile-menu-user-email\">{{ user.profile.email }}</div>\r\n </div>\r\n <a [routerLink]=\"(allNotificationsLink | async)?.path\">\r\n <button class=\"mobile-menu-rounded-button\">\r\n <span class=\"sr-only\">View notifications</span>\r\n <!-- Heroicon name: outline/bell -->\r\n <svg\r\n class=\"mobile-menu-rounded-button-icon-style\"\r\n xmlns=\"http://www.w3.org/2000/svg\"\r\n fill=\"none\"\r\n viewBox=\"0 0 24 24\"\r\n stroke=\"currentColor\"\r\n aria-hidden=\"true\"\r\n >\r\n <path\r\n stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"\r\n stroke-width=\"2\"\r\n d=\"M15 17h5l-1.405-1.405A2.032 2.032 0 0118 14.158V11a6.002 6.002 0 00-4-5.659V5a2 2 0 10-4 0v.341C7.67 6.165 6 8.388 6 11v3.159c0 .538-.214 1.055-.595 1.436L4 17h5m6 0v1a3 3 0 11-6 0v-1m6 0H9\"\r\n />\r\n </svg>\r\n </button>\r\n </a>\r\n </div>\r\n <div class=\"mobile-menu-link-container\">\r\n <ng-container *ngFor=\"let link of links.profile | async\">\r\n <a *ngIf=\"link.external\" [attr.href]=\"link.path\" [attr.target]=\"'_blank'\" class=\"nav-link-mobile\">\r\n {{ link.text }}\r\n </a>\r\n <a\r\n [routerLink]=\"link.path\"\r\n [routerLinkActive]=\"['nav-link-mobile-active']\"\r\n [routerLinkActiveOptions]=\"{ exact: link.exact }\"\r\n class=\"nav-link-mobile\"\r\n >\r\n {{ link.text }}\r\n </a>\r\n </ng-container>\r\n <!-- <a href=\"#\" class=\"block px-3 py-2 rounded-sm text-base font-medium text-gray-400 hover:text-white hover:bg-gray-700\">\u0391\u03C0\u03BF\u03C3\u03CD\u03BD\u03B4\u03B5\u03C3\u03B7</a> -->\r\n </div>\r\n </div>\r\n </div>\r\n</nav>\r\n", directives: [{ type: i1$1.RouterLinkWithHref, selector: "a[routerLink],area[routerLink]", inputs: ["routerLink", "target", "queryParams", "fragment", "queryParamsHandling", "preserveFragment", "skipLocationChange", "replaceUrl", "state", "relativeTo"] }, { type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i1$1.RouterLinkActive, selector: "[routerLinkActive]", inputs: ["routerLinkActiveOptions", "routerLinkActive"], exportAs: ["routerLinkActive"] }, { type: ClickOutsideDirective, selector: "[clickOutside]", inputs: ["clickOutsideEnabled", "attachOutsideOnClick", "delayClickOutsideInit", "emitOnBlur", "exclude", "excludeBeforeClick", "clickOutsideEvents"], outputs: ["clickOutside"] }, { type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }], pipes: { "async": i1.AsyncPipe, "date": i1.DatePipe } });
|
|
1778
1750
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.0.1", ngImport: i0, type: ShellHeaderComponent, decorators: [{
|
|
1779
1751
|
type: Component,
|
|
1780
1752
|
args: [{
|
|
@@ -1791,9 +1763,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.0.1", ngImpor
|
|
|
1791
1763
|
}] }, { type: undefined, decorators: [{
|
|
1792
1764
|
type: Inject,
|
|
1793
1765
|
args: [APP_LINKS]
|
|
1794
|
-
}] }, { type: NotificationsService, decorators: [{
|
|
1795
|
-
type: Inject,
|
|
1796
|
-
args: [NotificationsService]
|
|
1797
1766
|
}] }]; }, propDecorators: { sectionLinksPath: [{
|
|
1798
1767
|
type: Input,
|
|
1799
1768
|
args: ['section-links']
|
|
@@ -3097,7 +3066,7 @@ class IndiceComponentsModule {
|
|
|
3097
3066
|
static forRoot() {
|
|
3098
3067
|
return {
|
|
3099
3068
|
ngModule: IndiceComponentsModule,
|
|
3100
|
-
providers: [ToasterService
|
|
3069
|
+
providers: [ToasterService]
|
|
3101
3070
|
};
|
|
3102
3071
|
}
|
|
3103
3072
|
}
|