@indice/ng-components 0.2.118 → 0.2.121-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/README.md +4 -4
- package/_styles.css +61 -41
- package/bundles/indice-ng-components.umd.js +68 -44
- package/bundles/indice-ng-components.umd.js.map +1 -1
- package/esm2015/lib/controls/kpi-tile/kpi-tile.component.js +1 -1
- package/esm2015/lib/controls/list-view/list-column.component.js +1 -1
- package/esm2015/lib/controls/list-view/list-view-empty-state.component.js +2 -2
- package/esm2015/lib/controls/skeleton-loader/skeleton-loader.component.js +1 -1
- package/esm2015/lib/layouts/shell/shell-footer/shell-footer.component.js +2 -2
- package/esm2015/lib/layouts/shell/shell-header/shell-header.component.js +46 -31
- package/esm2015/lib/layouts/shell/shell-layout/shell-layout.component.js +6 -11
- package/esm2015/lib/layouts/views/form-layout/form-layout.component.js +7 -6
- package/esm2015/lib/services/toaster.service.js +1 -1
- package/esm2015/lib/types.js +11 -2
- package/fesm2015/indice-ng-components.js +67 -46
- package/fesm2015/indice-ng-components.js.map +1 -1
- package/lib/layouts/shell/shell-header/shell-header.component.d.ts +21 -14
- package/lib/layouts/shell/shell-layout/shell-layout.component.d.ts +2 -3
- package/lib/layouts/views/form-layout/form-layout.component.d.ts +3 -2
- package/lib/types.d.ts +11 -3
- package/package.json +1 -1
package/README.md
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
# INDICE ANGULAR Components
|
|
2
|
-
|
|
3
|
-
Indice common components for Angular 2+
|
|
4
|
-
This library was generated with [Angular CLI](https://github.com/angular/angular-cli) version 11.2.14.
|
|
1
|
+
# INDICE ANGULAR Components
|
|
2
|
+
|
|
3
|
+
Indice common components for Angular 2+
|
|
4
|
+
This library was generated with [Angular CLI](https://github.com/angular/angular-cli) version 11.2.14.
|
package/_styles.css
CHANGED
|
@@ -105,6 +105,14 @@
|
|
|
105
105
|
@apply block px-4 py-2 text-xs text-blue-300 shadow-sm whitespace-nowrap overflow-ellipsis overflow-hidden;
|
|
106
106
|
}
|
|
107
107
|
|
|
108
|
+
.nav-link-notifications {
|
|
109
|
+
@apply block py-3 pl-3 pr-2 text-xs text-gray-700 hover:bg-gray-50;
|
|
110
|
+
}
|
|
111
|
+
|
|
112
|
+
.nav-link-notifications-active {
|
|
113
|
+
@apply block py-3 pl-3 pr-2 text-xs text-blue-300 shadow-sm;
|
|
114
|
+
}
|
|
115
|
+
|
|
108
116
|
.nav-link-mobile-active {
|
|
109
117
|
@apply bg-gray-900 text-blue-300 block px-3 py-2 rounded-sm text-xs whitespace-nowrap overflow-ellipsis overflow-hidden;
|
|
110
118
|
}
|
|
@@ -213,6 +221,47 @@
|
|
|
213
221
|
@apply z-50 origin-top-right absolute right-0 mt-24 w-48 rounded-sm shadow-lg py-1 bg-white ring-1 ring-black ring-opacity-5 focus:outline-none;
|
|
214
222
|
}
|
|
215
223
|
|
|
224
|
+
.shell-header-profile-dropdown-with-username {
|
|
225
|
+
@apply z-50 origin-top-right absolute right-0 mt-36 w-48 rounded-sm shadow-lg py-1 bg-white ring-1 ring-black ring-opacity-5 focus:outline-none;
|
|
226
|
+
}
|
|
227
|
+
|
|
228
|
+
.shell-header-notifications {
|
|
229
|
+
@apply flex gap-3 items-center;
|
|
230
|
+
}
|
|
231
|
+
|
|
232
|
+
.shell-header-notifications-dropdown-button {
|
|
233
|
+
@apply max-w-xs focus:outline-none rounded-full flex items-center text-sm ring-1 ring-blue-300 focus:ring-offset-1
|
|
234
|
+
focus:ring-offset-blue-800 focus:ring-blue-400 transition ease-in duration-100;
|
|
235
|
+
}
|
|
236
|
+
|
|
237
|
+
.shell-header-notifications-dropdown {
|
|
238
|
+
@apply z-50 origin-top-right absolute right-0 pt-3 pl-2 mt-2 w-80 rounded-sm shadow-lg bg-white ring-1 ring-black ring-opacity-5 focus:outline-none;
|
|
239
|
+
}
|
|
240
|
+
|
|
241
|
+
.shell-header-notifications-dropdown-with-username {
|
|
242
|
+
@apply z-50 origin-top-right absolute right-0 pt-3 pl-2 mt-1 w-80 rounded-sm shadow-lg bg-white ring-1 ring-black ring-opacity-5 focus:outline-none;
|
|
243
|
+
|
|
244
|
+
}
|
|
245
|
+
|
|
246
|
+
.shell-header-notifications-dropdown-view-all-button{
|
|
247
|
+
@apply items-center align-text-bottom font-medium w-full px-2.5 py-2.5 text-xs text-gray-600 focus:outline-none;
|
|
248
|
+
}
|
|
249
|
+
|
|
250
|
+
.notification-messages::-webkit-scrollbar {
|
|
251
|
+
width: 7px;
|
|
252
|
+
height: 7px;
|
|
253
|
+
background: transparent;
|
|
254
|
+
cursor: pointer;
|
|
255
|
+
/* or add it to the track */
|
|
256
|
+
}
|
|
257
|
+
|
|
258
|
+
.notification-messages::-webkit-scrollbar-thumb {
|
|
259
|
+
@apply bg-gray-600;
|
|
260
|
+
|
|
261
|
+
&:hover {
|
|
262
|
+
@apply bg-gray-700;
|
|
263
|
+
}
|
|
264
|
+
}
|
|
216
265
|
|
|
217
266
|
.mobile-menu-button-container {
|
|
218
267
|
@apply -mr-2 flex sm:hidden;
|
|
@@ -255,7 +304,7 @@
|
|
|
255
304
|
}
|
|
256
305
|
|
|
257
306
|
.mobile-menu-rounded-button {
|
|
258
|
-
@apply ml-auto bg-gray-800 flex-shrink-0 p-1 text-gray-400 rounded-full hover:text-white focus:outline-none focus:ring-2 focus:ring-offset-
|
|
307
|
+
@apply ml-auto bg-gray-800 flex-shrink-0 p-1 text-gray-400 rounded-full hover:text-white focus:outline-none focus:ring-2 focus:ring-offset-1 focus:ring-offset-blue-800 focus:ring-blue-400 focus:ring-white;
|
|
259
308
|
}
|
|
260
309
|
|
|
261
310
|
.mobile-menu-rounded-button-icon-style {
|
|
@@ -366,41 +415,20 @@
|
|
|
366
415
|
@apply flex flex-row justify-start ;
|
|
367
416
|
}
|
|
368
417
|
|
|
369
|
-
.view-layout-title-container-sm {
|
|
370
|
-
@apply lg:flex lg:items-center lg:justify-between;
|
|
371
|
-
}
|
|
372
|
-
|
|
373
418
|
.view-layout-title-container-inner {
|
|
374
419
|
@apply flex-1 min-w-0;
|
|
375
420
|
}
|
|
376
421
|
|
|
377
|
-
|
|
378
|
-
.view-layout-title-container-sm-inner {
|
|
379
|
-
@apply flex-1 justify-start items-center;
|
|
380
|
-
}
|
|
381
|
-
|
|
382
422
|
.title-icon {
|
|
383
|
-
@apply text-xl text-white font-thin mr-1;
|
|
384
|
-
}
|
|
385
|
-
|
|
386
|
-
.title-icon-sm {
|
|
387
|
-
@apply text-2xl text-white font-thin mr-2 mt-1;
|
|
388
|
-
}
|
|
389
|
-
|
|
390
|
-
.view-layout-title-busy {
|
|
391
|
-
@apply animate-pulse inline text-xl text-gray-200;
|
|
423
|
+
@apply text-2xl md:text-xl text-white font-thin mr-1;
|
|
392
424
|
}
|
|
393
425
|
|
|
394
426
|
.view-layout-title {
|
|
395
|
-
@apply inline text-xl text-white;
|
|
427
|
+
@apply inline text-xl md:text-3xl text-white;
|
|
396
428
|
}
|
|
397
429
|
|
|
398
|
-
.view-layout-title-busy
|
|
399
|
-
@apply animate-pulse inline text-3xl text-gray-200;
|
|
400
|
-
}
|
|
401
|
-
|
|
402
|
-
.view-layout-title-sm {
|
|
403
|
-
@apply inline text-3xl text-white;
|
|
430
|
+
.view-layout-title-busy {
|
|
431
|
+
@apply animate-pulse inline text-xl md:text-3xl text-gray-200;
|
|
404
432
|
}
|
|
405
433
|
|
|
406
434
|
.meta-container {
|
|
@@ -419,19 +447,11 @@
|
|
|
419
447
|
@apply flex flex-wrap sm:flex-row space-x-2;
|
|
420
448
|
}
|
|
421
449
|
|
|
422
|
-
.meta-container-sm-inner {
|
|
423
|
-
@apply flex flex-wrap mt-2 sm:flex-row space-x-2 text-white;
|
|
424
|
-
}
|
|
425
|
-
|
|
426
|
-
.meta-icon-sm {
|
|
427
|
-
@apply text-sm text-gray-400 mr-1;
|
|
428
|
-
}
|
|
429
|
-
|
|
430
450
|
.meta-text {
|
|
431
451
|
@apply text-white text-xs;
|
|
432
452
|
margin-top: 2px;
|
|
433
453
|
margin-left: 2px;
|
|
434
|
-
margin-right:
|
|
454
|
+
margin-right: 2px;
|
|
435
455
|
}
|
|
436
456
|
|
|
437
457
|
.search-container {
|
|
@@ -847,15 +867,15 @@
|
|
|
847
867
|
}
|
|
848
868
|
|
|
849
869
|
.list-view-th {
|
|
850
|
-
@apply px-
|
|
870
|
+
@apply px-4 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider;
|
|
851
871
|
}
|
|
852
872
|
|
|
853
873
|
.list-view-th-full {
|
|
854
|
-
@apply w-full px-
|
|
874
|
+
@apply w-full px-4 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider whitespace-normal break-words;
|
|
855
875
|
}
|
|
856
876
|
|
|
857
877
|
.list-view-th-half {
|
|
858
|
-
@apply w-full sm:w-1/2 px-
|
|
878
|
+
@apply w-full sm:w-1/2 px-4 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider whitespace-normal break-words;
|
|
859
879
|
}
|
|
860
880
|
|
|
861
881
|
.list-view-tbody {
|
|
@@ -871,15 +891,15 @@
|
|
|
871
891
|
}
|
|
872
892
|
|
|
873
893
|
.list-view-td {
|
|
874
|
-
@apply px-
|
|
894
|
+
@apply px-4 py-4 whitespace-nowrap;
|
|
875
895
|
}
|
|
876
896
|
|
|
877
897
|
.list-view-td-full {
|
|
878
|
-
@apply w-full px-
|
|
898
|
+
@apply w-full px-4 py-4 break-all;
|
|
879
899
|
}
|
|
880
900
|
|
|
881
901
|
.list-view-td-half {
|
|
882
|
-
@apply w-full sm:w-1/2 px-
|
|
902
|
+
@apply w-full sm:w-1/2 px-4 py-4 whitespace-normal break-words;
|
|
883
903
|
}
|
|
884
904
|
|
|
885
905
|
.details-button {
|
|
@@ -663,14 +663,17 @@
|
|
|
663
663
|
Icons.Details = ' ms-Icon ms-Icon--AccountActivity';
|
|
664
664
|
|
|
665
665
|
var NavLink = /** @class */ (function () {
|
|
666
|
-
function NavLink(text, path, exact, external, icon) {
|
|
666
|
+
function NavLink(text, path, exact, external, icon, isRead, creationDate) {
|
|
667
667
|
if (exact === void 0) { exact = false; }
|
|
668
668
|
if (external === void 0) { external = false; }
|
|
669
|
+
this.isRead = false;
|
|
669
670
|
this.text = text;
|
|
670
671
|
this.path = path;
|
|
671
672
|
this.exact = exact;
|
|
672
673
|
this.external = external;
|
|
673
674
|
this.icon = icon;
|
|
675
|
+
this.isRead = isRead;
|
|
676
|
+
this.creationDate = creationDate;
|
|
674
677
|
}
|
|
675
678
|
return NavLink;
|
|
676
679
|
}());
|
|
@@ -688,6 +691,13 @@
|
|
|
688
691
|
}
|
|
689
692
|
return FragmentNavLink;
|
|
690
693
|
}(NavLink));
|
|
694
|
+
var NotificationNavLink = /** @class */ (function (_super) {
|
|
695
|
+
__extends(NotificationNavLink, _super);
|
|
696
|
+
function NotificationNavLink(text, path, isRead, creationDate) {
|
|
697
|
+
return _super.call(this, text, path, true, false, undefined, isRead, creationDate) || this;
|
|
698
|
+
}
|
|
699
|
+
return NotificationNavLink;
|
|
700
|
+
}(NavLink));
|
|
691
701
|
var ViewAction = /** @class */ (function () {
|
|
692
702
|
function ViewAction(type, key, param, icon, tooltip) {
|
|
693
703
|
this.type = type;
|
|
@@ -750,6 +760,7 @@
|
|
|
750
760
|
this.appLogoAlt = 'your app name here';
|
|
751
761
|
this.showHeader = true;
|
|
752
762
|
this.showUserNameOnHeader = false;
|
|
763
|
+
this.showNotifications = false;
|
|
753
764
|
this.showFooter = true;
|
|
754
765
|
this.fluid = false;
|
|
755
766
|
}
|
|
@@ -982,7 +993,7 @@
|
|
|
982
993
|
return ListViewEmptyStateComponent;
|
|
983
994
|
}());
|
|
984
995
|
ListViewEmptyStateComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.0.1", ngImport: i0__namespace, type: ListViewEmptyStateComponent, deps: [], target: i0__namespace.ɵɵFactoryTarget.Component });
|
|
985
|
-
ListViewEmptyStateComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.0.1", type: ListViewEmptyStateComponent, selector: "lib-list-view-empty-state", inputs: { title: "title", subTitle: ["sub-title", "subTitle"], newItemLabel: ["new-item-label", "newItemLabel"] }, ngImport: i0__namespace, template: "<div class=\"p-20\">\n <div class=\"text-center p-2\">\n <svg xmlns=\"http://www.w3.org/2000/svg\" class=\"mx-auto h-12 w-12 text-gray-400\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\">\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M4 7v10c0 2.21 3.582 4 8 4s8-1.79 8-4V7M4 7c0 2.21 3.582 4 8 4s8-1.79 8-4M4 7c0-2.21 3.582-4 8-4s8 1.79 8 4m0 5c0 2.21-3.582 4-8 4s-8-1.79-8-4\" />\n </svg>\n <h3 class=\"mt-2 text-sm font-medium text-gray-900\">{{title}}</h3>\n <p class=\"mt-1 text-sm text-gray-500\">\n {{subTitle}}\n </p>\n <div class=\"mt-6\" *ngIf=\"false\">\n <button type=\"button\" class=\"inline-flex items-center px-4 py-2 border border-transparent shadow-sm text-sm font-medium rounded-md text-white bg-gray-600 hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-offset-1 focus:ring-gray-500\">\n <!-- Heroicon name: solid/plus -->\n <svg class=\"-ml-1 mr-2 h-6 w-6\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\" aria-hidden=\"true\">\n <path vector-effect=\"non-scaling-stroke\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M9 13h6m-3-3v6m-9 1V7a2 2 0 012-2h6l2 2h6a2 2 0 012 2v8a2 2 0 01-2 2H5a2 2 0 01-2-2z\" />\n </svg>\n {{newItemLabel}}\n </button>\n </div>\n </div>\n</div>\n", directives: [{ type: i1__namespace.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
|
|
996
|
+
ListViewEmptyStateComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.0.1", type: ListViewEmptyStateComponent, selector: "lib-list-view-empty-state", inputs: { title: "title", subTitle: ["sub-title", "subTitle"], newItemLabel: ["new-item-label", "newItemLabel"] }, ngImport: i0__namespace, template: "<div class=\"p-20\">\r\n <div class=\"text-center p-2\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" class=\"mx-auto h-12 w-12 text-gray-400\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\">\r\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M4 7v10c0 2.21 3.582 4 8 4s8-1.79 8-4V7M4 7c0 2.21 3.582 4 8 4s8-1.79 8-4M4 7c0-2.21 3.582-4 8-4s8 1.79 8 4m0 5c0 2.21-3.582 4-8 4s-8-1.79-8-4\" />\r\n </svg>\r\n <h3 class=\"mt-2 text-sm font-medium text-gray-900\">{{title}}</h3>\r\n <p class=\"mt-1 text-sm text-gray-500\">\r\n {{subTitle}}\r\n </p>\r\n <div class=\"mt-6\" *ngIf=\"false\">\r\n <button type=\"button\" class=\"inline-flex items-center px-4 py-2 border border-transparent shadow-sm text-sm font-medium rounded-md text-white bg-gray-600 hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-offset-1 focus:ring-gray-500\">\r\n <!-- Heroicon name: solid/plus -->\r\n <svg class=\"-ml-1 mr-2 h-6 w-6\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\" aria-hidden=\"true\">\r\n <path vector-effect=\"non-scaling-stroke\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M9 13h6m-3-3v6m-9 1V7a2 2 0 012-2h6l2 2h6a2 2 0 012 2v8a2 2 0 01-2 2H5a2 2 0 01-2-2z\" />\r\n </svg>\r\n {{newItemLabel}}\r\n </button>\r\n </div>\r\n </div>\r\n</div>\r\n", directives: [{ type: i1__namespace.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
|
|
986
997
|
i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.0.1", ngImport: i0__namespace, type: ListViewEmptyStateComponent, decorators: [{
|
|
987
998
|
type: i0.Component,
|
|
988
999
|
args: [{
|
|
@@ -2061,27 +2072,29 @@
|
|
|
2061
2072
|
}], ctorParameters: function () { return [{ type: i0__namespace.ComponentFactoryResolver }, { type: i0__namespace.Injector }, { type: i0__namespace.ApplicationRef }]; } });
|
|
2062
2073
|
|
|
2063
2074
|
var ShellHeaderComponent = /** @class */ (function () {
|
|
2064
|
-
function ShellHeaderComponent(authService, router,
|
|
2075
|
+
function ShellHeaderComponent(authService, router, links) {
|
|
2065
2076
|
this.authService = authService;
|
|
2066
2077
|
this.router = router;
|
|
2067
|
-
this.config = config;
|
|
2068
2078
|
this.links = links;
|
|
2069
2079
|
// tslint:disable-next-line:no-input-rename
|
|
2070
2080
|
this.sectionLinksPath = 'main';
|
|
2071
|
-
|
|
2072
|
-
this.profileMenuVisible = true;
|
|
2073
|
-
// tslint:disable-next-line:no-input-rename
|
|
2074
|
-
this.showUserNameOnHeader = false;
|
|
2081
|
+
this.notificationLinksPath = 'notifications';
|
|
2075
2082
|
this.border = true;
|
|
2083
|
+
this.showNotifications = false;
|
|
2084
|
+
this.showUserNameOnHeader = false;
|
|
2085
|
+
this.notificationsMenuVisible = true;
|
|
2086
|
+
this.profileMenuVisible = true;
|
|
2076
2087
|
this.sectionLinks = rxjs.of([]);
|
|
2088
|
+
this.notificationLinks = rxjs.of([]);
|
|
2077
2089
|
this.mobileMenuExpanded = false;
|
|
2078
2090
|
this.userMenuExpanded = false;
|
|
2091
|
+
this.notificationsMenuExpanded = false;
|
|
2092
|
+
this.routeSubject = new rxjs.Observable();
|
|
2079
2093
|
this.routerSub$ = null;
|
|
2080
2094
|
this.userSub$ = null;
|
|
2081
2095
|
this.statusSub$ = null;
|
|
2082
2096
|
this.user = null;
|
|
2083
2097
|
this.avatarName = null;
|
|
2084
|
-
this.routeSubject = this.router.events.pipe(operators.filter(function (event) { return event instanceof i1$1.NavigationStart; }));
|
|
2085
2098
|
}
|
|
2086
2099
|
ShellHeaderComponent.prototype.ngOnDestroy = function () {
|
|
2087
2100
|
console.log(this.showUserNameOnHeader);
|
|
@@ -2098,16 +2111,21 @@
|
|
|
2098
2111
|
};
|
|
2099
2112
|
ShellHeaderComponent.prototype.ngOnInit = function () {
|
|
2100
2113
|
var _this = this;
|
|
2114
|
+
var _a, _b;
|
|
2115
|
+
this.showNotifications = (_a = this.config) === null || _a === void 0 ? void 0 : _a.showNotifications;
|
|
2116
|
+
this.showUserNameOnHeader = (_b = this.config) === null || _b === void 0 ? void 0 : _b.showUserNameOnHeader;
|
|
2101
2117
|
this.sectionLinks = this.links[this.sectionLinksPath];
|
|
2102
|
-
this.
|
|
2118
|
+
this.notificationLinks = this.links[this.notificationLinksPath];
|
|
2119
|
+
this.routerSub$ = this.router.events.pipe(operators.filter(function (event) { return event instanceof i1$1.NavigationStart; })).subscribe(function (event) {
|
|
2103
2120
|
_this.mobileMenuExpanded = false;
|
|
2104
2121
|
_this.userMenuExpanded = false;
|
|
2122
|
+
_this.notificationsMenuExpanded = false;
|
|
2105
2123
|
});
|
|
2106
2124
|
this.authService.loadUser().subscribe(function (user) {
|
|
2107
2125
|
console.log(user);
|
|
2108
2126
|
_this.setCurrentUser(user);
|
|
2109
2127
|
}, function (error) {
|
|
2110
|
-
console.
|
|
2128
|
+
console.log(error);
|
|
2111
2129
|
});
|
|
2112
2130
|
// Detect user changes and display / or not user info accordingly...
|
|
2113
2131
|
this.userSub$ = this.authService.user$.subscribe(function (user) {
|
|
@@ -2115,28 +2133,40 @@
|
|
|
2115
2133
|
_this.setCurrentUser(user);
|
|
2116
2134
|
});
|
|
2117
2135
|
};
|
|
2136
|
+
ShellHeaderComponent.prototype.setCurrentUser = function (user) {
|
|
2137
|
+
var _a, _b;
|
|
2138
|
+
this.user = user;
|
|
2139
|
+
if (this.user && this.user.profile) {
|
|
2140
|
+
this.avatarName = "" + ((_a = this.user.profile.given_name) === null || _a === void 0 ? void 0 : _a.charAt(0)) + ((_b = this.user.profile.family_name) === null || _b === void 0 ? void 0 : _b.charAt(0));
|
|
2141
|
+
console.log('load user', this.avatarName);
|
|
2142
|
+
}
|
|
2143
|
+
};
|
|
2118
2144
|
// tslint:disable-next-line:typedef
|
|
2119
|
-
ShellHeaderComponent.prototype.
|
|
2145
|
+
ShellHeaderComponent.prototype.onClickOutsideProfile = function ($event) {
|
|
2120
2146
|
this.userMenuExpanded = false;
|
|
2121
2147
|
};
|
|
2148
|
+
// tslint:disable-next-line:typedef
|
|
2149
|
+
ShellHeaderComponent.prototype.onClickOutsideNotifications = function ($event) {
|
|
2150
|
+
this.notificationsMenuExpanded = false;
|
|
2151
|
+
};
|
|
2122
2152
|
ShellHeaderComponent.prototype.signin = function (event) {
|
|
2123
2153
|
if (event) {
|
|
2124
2154
|
event.preventDefault();
|
|
2125
2155
|
}
|
|
2126
2156
|
this.authService.signinRedirect();
|
|
2127
2157
|
};
|
|
2128
|
-
ShellHeaderComponent.prototype.
|
|
2129
|
-
|
|
2130
|
-
this.
|
|
2131
|
-
|
|
2132
|
-
|
|
2133
|
-
|
|
2134
|
-
|
|
2158
|
+
ShellHeaderComponent.prototype.expandUserMenu = function () {
|
|
2159
|
+
this.userMenuExpanded = !this.userMenuExpanded;
|
|
2160
|
+
this.notificationsMenuExpanded = false;
|
|
2161
|
+
};
|
|
2162
|
+
ShellHeaderComponent.prototype.expandNotificationsMenu = function () {
|
|
2163
|
+
this.notificationsMenuExpanded = !this.notificationsMenuExpanded;
|
|
2164
|
+
this.userMenuExpanded = false;
|
|
2135
2165
|
};
|
|
2136
2166
|
return ShellHeaderComponent;
|
|
2137
2167
|
}());
|
|
2138
|
-
ShellHeaderComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.0.1", ngImport: i0__namespace, type: ShellHeaderComponent, deps: [{ token: i2.AuthService }, { token: i1$1.Router }, { token:
|
|
2139
|
-
ShellHeaderComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.0.1", type: ShellHeaderComponent, selector: "lib-shell-header", inputs: { sectionLinksPath: ["section-links", "sectionLinksPath"], profileMenuVisible: ["profile-menu", "profileMenuVisible"], showUserNameOnHeader: ["show-userName", "showUserNameOnHeader"], border: "border" }, ngImport: i0__namespace, 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\" [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 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)=\"onClickOutside($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)=\"onClickOutside($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\" [routerLinkActive]=\"['nav-link-profile-active']\"\r\n [routerLinkActiveOptions]=\"{ exact: link.exact }\" 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 </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\" [attr.href]=\"link.path\" [attr.target]=\"'_blank'\" class=\"nav-link-mobile\">\r\n {{ link.text }}\r\n </a>\r\n <a *ngIf=\"!link.external\" [routerLink]=\"link.path\" [routerLinkActive]=\"['nav-link-mobile-active']\" [routerLinkActiveOptions]=\"{ exact: link.exact }\" 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=\"#\" (click)=\"signin($event)\" 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\" *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 <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 </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 [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__namespace$1.RouterLinkWithHref, selector: "a[routerLink],area[routerLink]", inputs: ["routerLink", "target", "queryParams", "fragment", "queryParamsHandling", "preserveFragment", "skipLocationChange", "replaceUrl", "state", "relativeTo"] }, { type: i1__namespace.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i1__namespace$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__namespace.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i1__namespace.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }], pipes: { "async": i1__namespace.AsyncPipe } });
|
|
2168
|
+
ShellHeaderComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.0.1", ngImport: i0__namespace, type: ShellHeaderComponent, deps: [{ token: i2.AuthService }, { token: i1$1.Router }, { token: APP_LINKS }], target: i0__namespace.ɵɵFactoryTarget.Component });
|
|
2169
|
+
ShellHeaderComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.0.1", type: ShellHeaderComponent, selector: "lib-shell-header", inputs: { sectionLinksPath: ["section-links", "sectionLinksPath"], notificationLinksPath: ["notification-links", "notificationLinksPath"], config: "config", border: "border" }, ngImport: i0__namespace, 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\" [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 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\" [routerLinkActive]=\"['nav-link-profile-active']\"\r\n [routerLinkActiveOptions]=\"{ exact: link.exact }\" 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 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 <!-- 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\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\">\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-2\">\r\n <ng-container #notificationsDropDown\r\n *ngFor=\"let link of notificationLinks | async\">\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 <a [routerLink]=\"link.path\"\r\n [routerLinkActive]=\"['nav-link-notifications-active']\"\r\n [routerLinkActiveOptions]=\"{ exact: link.exact }\"\r\n class=\"nav-link-notifications grid grid-row\"\r\n [ngClass]=\"!link.isRead ? ' hover:bg-blue-50' : 'border-b border-gray-100'\">\r\n <span class=\"font-bold\">\r\n {{ link.text }}\r\n </span>\r\n <span class=\"font-thin tracking-tighter\">\r\n {{ link.creationDate | date: 'EEE, d MMMM' }}\r\n </span>\r\n </a>\r\n </li>\r\n </ng-container>\r\n </ul>\r\n </ng-template>\r\n </div>\r\n <div class=\"p-1 rounded-sm\">\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 </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\" [attr.href]=\"link.path\" [attr.target]=\"'_blank'\" class=\"nav-link-mobile\">\r\n {{ link.text }}\r\n </a>\r\n <a *ngIf=\"!link.external\" [routerLink]=\"link.path\" [routerLinkActive]=\"['nav-link-mobile-active']\" [routerLinkActiveOptions]=\"{ exact: link.exact }\" 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=\"#\" (click)=\"signin($event)\" 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\" *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 <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 </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 [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__namespace$1.RouterLinkWithHref, selector: "a[routerLink],area[routerLink]", inputs: ["routerLink", "target", "queryParams", "fragment", "queryParamsHandling", "preserveFragment", "skipLocationChange", "replaceUrl", "state", "relativeTo"] }, { type: i1__namespace.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i1__namespace$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__namespace.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i1__namespace.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }], pipes: { "async": i1__namespace.AsyncPipe, "date": i1__namespace.DatePipe } });
|
|
2140
2170
|
i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.0.1", ngImport: i0__namespace, type: ShellHeaderComponent, decorators: [{
|
|
2141
2171
|
type: i0.Component,
|
|
2142
2172
|
args: [{
|
|
@@ -2151,9 +2181,6 @@
|
|
|
2151
2181
|
}] }, { type: i1__namespace$1.Router, decorators: [{
|
|
2152
2182
|
type: i0.Inject,
|
|
2153
2183
|
args: [i1$1.Router]
|
|
2154
|
-
}] }, { type: undefined, decorators: [{
|
|
2155
|
-
type: i0.Inject,
|
|
2156
|
-
args: [SHELL_CONFIG]
|
|
2157
2184
|
}] }, { type: undefined, decorators: [{
|
|
2158
2185
|
type: i0.Inject,
|
|
2159
2186
|
args: [APP_LINKS]
|
|
@@ -2161,12 +2188,11 @@
|
|
|
2161
2188
|
}, propDecorators: { sectionLinksPath: [{
|
|
2162
2189
|
type: i0.Input,
|
|
2163
2190
|
args: ['section-links']
|
|
2164
|
-
}],
|
|
2191
|
+
}], notificationLinksPath: [{
|
|
2165
2192
|
type: i0.Input,
|
|
2166
|
-
args: ['
|
|
2167
|
-
}],
|
|
2168
|
-
type: i0.Input
|
|
2169
|
-
args: ['show-userName']
|
|
2193
|
+
args: ['notification-links']
|
|
2194
|
+
}], config: [{
|
|
2195
|
+
type: i0.Input
|
|
2170
2196
|
}], border: [{
|
|
2171
2197
|
type: i0.Input
|
|
2172
2198
|
}] } });
|
|
@@ -2178,7 +2204,7 @@
|
|
|
2178
2204
|
return ShellFooterComponent;
|
|
2179
2205
|
}());
|
|
2180
2206
|
ShellFooterComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.0.1", ngImport: i0__namespace, type: ShellFooterComponent, deps: [{ token: APP_LINKS }], target: i0__namespace.ɵɵFactoryTarget.Component });
|
|
2181
|
-
ShellFooterComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.0.1", type: ShellFooterComponent, selector: "lib-shell-footer", ngImport: i0__namespace, template: "<footer class=\"shell-footer-component-container\">\r\n <div class=\"shell-footer-paddings\">\r\n <div class=\"shell-footer-component-container-inner\">\r\n <div class=\"shell-footer-sections-container\">\r\n <div class=\"shell-footer-section\">\r\n <img class=\"shell-footer-logo-h\" src=\"
|
|
2207
|
+
ShellFooterComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.0.1", type: ShellFooterComponent, selector: "lib-shell-footer", ngImport: i0__namespace, template: "<footer class=\"shell-footer-component-container\">\r\n <div class=\"shell-footer-paddings\">\r\n <div class=\"shell-footer-component-container-inner\">\r\n <div class=\"shell-footer-sections-container\">\r\n <div class=\"shell-footer-section\">\r\n <img class=\"shell-footer-logo-h\" src=\"assets/images/branding/indice.png\" alt=\"INDICE logo\" />\r\n <nav class=\"mt-4\">\r\n <ul class=\"space-y-2\">\r\n <ng-container *ngFor=\"let link of links.brand | async\">\r\n <li>\r\n <a [href]=\"link.path\" class=\"shell-footer-link\">{{ link.text }}</a>\r\n </li>\r\n </ng-container>\r\n </ul>\r\n </nav>\r\n </div>\r\n <div class=\"shell-footer-section-links\">\r\n <h5 class=\"shell-footer-section-title\">Legal</h5>\r\n <nav class=\"mt-4\">\r\n <ul class=\"grid lg:grid-cols-2\">\r\n <ng-container *ngFor=\"let link of links.legal | async\">\r\n <li class=\"mb-2\">\r\n <a [href]=\"link.path\" class=\"shell-footer-link\">{{ link.text }}</a>\r\n </li>\r\n </ng-container>\r\n </ul>\r\n </nav>\r\n </div>\r\n <div class=\"shell-footer-section-links\">\r\n <h5 class=\"shell-footer-section-title\">Follow us</h5>\r\n <nav class=\"mt-4\">\r\n <ul class=\"grid lg:grid-cols-2\">\r\n <li class=\"mb-2\">\r\n <a href=\"#\" class=\"shell-footer-social\">\r\n <svg class=\"shell-footer-social-icon\" aria-hidden=\"true\" fill=\"currentColor\" viewBox=\"0 0 24 24\">\r\n <path d=\"M8.29 20.251c7.547 0 11.675-6.253 11.675-11.675 0-.178 0-.355-.012-.53A8.348 8.348 0 0022 5.92a8.19 8.19 0 01-2.357.646 4.118 4.118 0 001.804-2.27 8.224 8.224 0 01-2.605.996 4.107 4.107 0 00-6.993 3.743 11.65 11.65 0 01-8.457-4.287 4.106 4.106 0 001.27 5.477A4.072 4.072 0 012.8 9.713v.052a4.105 4.105 0 003.292 4.022 4.095 4.095 0 01-1.853.07 4.108 4.108 0 003.834 2.85A8.233 8.233 0 012 18.407a11.616 11.616 0 006.29 1.84\"/>\r\n </svg>\r\n <span> Twitter </span>\r\n </a>\r\n </li>\r\n <li class=\"mb-2\">\r\n <a href=\"#\" class=\"shell-footer-social\">\r\n <svg class=\"shell-footer-social-icon\" aria-hidden=\"true\" fill=\"currentColor\" viewBox=\"0 0 24 24\">\r\n <path fill-rule=\"evenodd\" d=\"M12.315 2c2.43 0 2.784.013 3.808.06 1.064.049 1.791.218 2.427.465a4.902 4.902 0 011.772 1.153 4.902 4.902 0 011.153 1.772c.247.636.416 1.363.465 2.427.048 1.067.06 1.407.06 4.123v.08c0 2.643-.012 2.987-.06 4.043-.049 1.064-.218 1.791-.465 2.427a4.902 4.902 0 01-1.153 1.772 4.902 4.902 0 01-1.772 1.153c-.636.247-1.363.416-2.427.465-1.067.048-1.407.06-4.123.06h-.08c-2.643 0-2.987-.012-4.043-.06-1.064-.049-1.791-.218-2.427-.465a4.902 4.902 0 01-1.772-1.153 4.902 4.902 0 01-1.153-1.772c-.247-.636-.416-1.363-.465-2.427-.047-1.024-.06-1.379-.06-3.808v-.63c0-2.43.013-2.784.06-3.808.049-1.064.218-1.791.465-2.427a4.902 4.902 0 011.153-1.772A4.902 4.902 0 015.45 2.525c.636-.247 1.363-.416 2.427-.465C8.901 2.013 9.256 2 11.685 2h.63zm-.081 1.802h-.468c-2.456 0-2.784.011-3.807.058-.975.045-1.504.207-1.857.344-.467.182-.8.398-1.15.748-.35.35-.566.683-.748 1.15-.137.353-.3.882-.344 1.857-.047 1.023-.058 1.351-.058 3.807v.468c0 2.456.011 2.784.058 3.807.045.975.207 1.504.344 1.857.182.466.399.8.748 1.15.35.35.683.566 1.15.748.353.137.882.3 1.857.344 1.054.048 1.37.058 4.041.058h.08c2.597 0 2.917-.01 3.96-.058.976-.045 1.505-.207 1.858-.344.466-.182.8-.398 1.15-.748.35-.35.566-.683.748-1.15.137-.353.3-.882.344-1.857.048-1.055.058-1.37.058-4.041v-.08c0-2.597-.01-2.917-.058-3.96-.045-.976-.207-1.505-.344-1.858a3.097 3.097 0 00-.748-1.15 3.098 3.098 0 00-1.15-.748c-.353-.137-.882-.3-1.857-.344-1.023-.047-1.351-.058-3.807-.058zM12 6.865a5.135 5.135 0 110 10.27 5.135 5.135 0 010-10.27zm0 1.802a3.333 3.333 0 100 6.666 3.333 3.333 0 000-6.666zm5.338-3.205a1.2 1.2 0 110 2.4 1.2 1.2 0 010-2.4z\" clip-rule=\"evenodd\"/>\r\n </svg>\r\n <span> Instagram </span>\r\n </a>\r\n </li>\r\n <li class=\"mb-2\">\r\n <a href=\"#\" class=\"shell-footer-social\">\r\n <svg class=\"shell-footer-social-icon\" aria-hidden=\"true\" fill=\"currentColor\" viewBox=\"0 0 24 24\" >\r\n <path fill-rule=\"evenodd\" d=\"M22 12c0-5.523-4.477-10-10-10S2 6.477 2 12c0 4.991 3.657 9.128 8.438 9.878v-6.987h-2.54V12h2.54V9.797c0-2.506 1.492-3.89 3.777-3.89 1.094 0 2.238.195 2.238.195v2.46h-1.26c-1.243 0-1.63.771-1.63 1.562V12h2.773l-.443 2.89h-2.33v6.988C18.343 21.128 22 16.991 22 12z\" clip-rule=\"evenodd\"/>\r\n </svg>\r\n <span> Facebook </span>\r\n </a>\r\n </li>\r\n </ul>\r\n </nav>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"shell-footer-copyright\">\r\n <!--<nav class=\"flex flex-wrap justify-center space-x-6\">\r\n <a href=\"#\" class=\"font-normal text-sm hover:text-gray-100 mb-2\">Cookie settings</a>\r\n </nav>-->\r\n <p class=\"text-sm text-center sm:text-right\">\r\n \u00A9 2021 INDICE. All rights reserved.\r\n </p>\r\n </div>\r\n </div>\r\n</footer>\r\n", directives: [{ type: i1__namespace.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }], pipes: { "async": i1__namespace.AsyncPipe } });
|
|
2182
2208
|
i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.0.1", ngImport: i0__namespace, type: ShellFooterComponent, decorators: [{
|
|
2183
2209
|
type: i0.Component,
|
|
2184
2210
|
args: [{
|
|
@@ -2193,15 +2219,14 @@
|
|
|
2193
2219
|
} });
|
|
2194
2220
|
|
|
2195
2221
|
var ShellLayoutComponent = /** @class */ (function () {
|
|
2196
|
-
function ShellLayoutComponent(
|
|
2197
|
-
this.document = document;
|
|
2222
|
+
function ShellLayoutComponent(router, location, config, componentLoaderFactory) {
|
|
2198
2223
|
this.router = router;
|
|
2199
2224
|
this.location = location;
|
|
2200
2225
|
this.config = config;
|
|
2201
2226
|
this.componentLoaderFactory = componentLoaderFactory;
|
|
2202
2227
|
this.dynamicComponentHosts = null;
|
|
2203
|
-
this.showRightPaneSM = false;
|
|
2204
2228
|
this.routerSub$ = null;
|
|
2229
|
+
this.showRightPaneSM = false;
|
|
2205
2230
|
this.activeConfig = new DefaultShellConfig();
|
|
2206
2231
|
this.loaded = false;
|
|
2207
2232
|
if (!config) {
|
|
@@ -2265,8 +2290,8 @@
|
|
|
2265
2290
|
};
|
|
2266
2291
|
return ShellLayoutComponent;
|
|
2267
2292
|
}());
|
|
2268
|
-
ShellLayoutComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.0.1", ngImport: i0__namespace, type: ShellLayoutComponent, deps: [{ token:
|
|
2269
|
-
ShellLayoutComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.0.1", type: ShellLayoutComponent, selector: "lib-shell-layout", viewQueries: [{ propertyName: "dynamicComponentHosts", predicate: DynamicComponentHostDirective, descendants: true }], ngImport: i0__namespace, template: "<div *ngIf=\"loaded\"
|
|
2293
|
+
ShellLayoutComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.0.1", ngImport: i0__namespace, type: ShellLayoutComponent, deps: [{ token: i1__namespace$1.Router }, { token: i1__namespace.Location }, { token: SHELL_CONFIG }, { token: ComponentLoaderFactory }], target: i0__namespace.ɵɵFactoryTarget.Component });
|
|
2294
|
+
ShellLayoutComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.0.1", type: ShellLayoutComponent, selector: "lib-shell-layout", viewQueries: [{ propertyName: "dynamicComponentHosts", predicate: DynamicComponentHostDirective, descendants: true }], ngImport: i0__namespace, template: "<div *ngIf=\"loaded\"\r\n [style.display]=\"!loaded ? 'none':'block'\"\r\n class=\"shell-container active-side-pane\">\r\n <div class=\"shell-header-container\"\r\n *ngIf=\"activeConfig.showHeader\">\r\n <div [class]=\"activeConfig.fluid ? 'shell-header-container-inner-fluid' : 'shell-header-container-inner'\">\r\n\r\n <ng-container *ngIf=\"activeConfig.customHeaderComponent\">\r\n <div appDynamicComponentHost=\"Header\"></div>\r\n </ng-container>\r\n\r\n <lib-shell-header *ngIf=\"!activeConfig.customHeaderComponent\"\r\n [config]=\"activeConfig\"></lib-shell-header>\r\n </div>\r\n </div>\r\n\r\n <main [class]=\"activeConfig.showHeader ? 'shell-content-container' : 'shell-content-container-no-header'\">\r\n <div [class]=\"activeConfig.fluid ? 'shell-content-container-inner-fluid' : 'shell-content-container-inner'\">\r\n <router-outlet></router-outlet>\r\n </div>\r\n </main>\r\n\r\n <div class=\"shell-footer-container\"\r\n *ngIf=\"activeConfig.showFooter\">\r\n <div [class]=\"activeConfig.fluid ? 'shell-footer-container-inner-fluid' : 'shell-footer-container-inner'\">\r\n <ng-container *ngIf=\"activeConfig.customFooterComponent\">\r\n <div appDynamicComponentHost\r\n hostName=\"Footer\"></div>\r\n </ng-container>\r\n <lib-shell-footer *ngIf=\"!activeConfig.customFooterComponent\"></lib-shell-footer>\r\n </div>\r\n </div>\r\n\r\n <lib-side-pane #rightPane>\r\n <router-outlet name=\"rightpane\"\r\n (activate)=\"rightPane.onSidePaneActivated($event)\"\r\n (deactivate)=\"rightPane.onSidePaneDeactivated($event)\"></router-outlet>\r\n </lib-side-pane>\r\n\r\n <lib-toaster-container></lib-toaster-container>\r\n\r\n</div>\r\n", components: [{ type: ShellHeaderComponent, selector: "lib-shell-header", inputs: ["section-links", "notification-links", "config", "border"] }, { type: ShellFooterComponent, selector: "lib-shell-footer" }, { type: SidePaneComponent, selector: "lib-side-pane", inputs: ["visible"], outputs: ["onComplete"] }, { type: ToasterContainerComponent, selector: "lib-toaster-container" }], directives: [{ type: i1__namespace.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: DynamicComponentHostDirective, selector: "[appDynamicComponentHost]", inputs: ["hostName"] }, { type: i1__namespace$1.RouterOutlet, selector: "router-outlet", outputs: ["activate", "deactivate"], exportAs: ["outlet"] }] });
|
|
2270
2295
|
i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.0.1", ngImport: i0__namespace, type: ShellLayoutComponent, decorators: [{
|
|
2271
2296
|
type: i0.Component,
|
|
2272
2297
|
args: [{
|
|
@@ -2275,10 +2300,7 @@
|
|
|
2275
2300
|
templateUrl: './shell-layout.component.html',
|
|
2276
2301
|
}]
|
|
2277
2302
|
}], ctorParameters: function () {
|
|
2278
|
-
return [{ type: undefined, decorators: [{
|
|
2279
|
-
type: i0.Inject,
|
|
2280
|
-
args: [i1.DOCUMENT]
|
|
2281
|
-
}] }, { type: i1__namespace$1.Router }, { type: i1__namespace.Location }, { type: undefined, decorators: [{
|
|
2303
|
+
return [{ type: i1__namespace$1.Router }, { type: i1__namespace.Location }, { type: undefined, decorators: [{
|
|
2282
2304
|
type: i0.Inject,
|
|
2283
2305
|
args: [SHELL_CONFIG]
|
|
2284
2306
|
}] }, { type: ComponentLoaderFactory }];
|
|
@@ -2543,8 +2565,8 @@
|
|
|
2543
2565
|
}] } });
|
|
2544
2566
|
|
|
2545
2567
|
var FormLayoutComponent = /** @class */ (function () {
|
|
2546
|
-
function FormLayoutComponent(
|
|
2547
|
-
this.
|
|
2568
|
+
function FormLayoutComponent(_router) {
|
|
2569
|
+
this._router = _router;
|
|
2548
2570
|
this.title = null;
|
|
2549
2571
|
// tslint:disable-next-line:no-input-rename
|
|
2550
2572
|
this.searchPlaceholder = 'αναζήτηση';
|
|
@@ -2556,6 +2578,7 @@
|
|
|
2556
2578
|
// tslint:disable-next-line:no-output-on-prefix
|
|
2557
2579
|
this.onSearch = new i0.EventEmitter();
|
|
2558
2580
|
this.onComplete = new i0.EventEmitter();
|
|
2581
|
+
this.showRightPaneSM = false;
|
|
2559
2582
|
}
|
|
2560
2583
|
FormLayoutComponent.prototype.ngOnInit = function () {
|
|
2561
2584
|
var _a;
|
|
@@ -2585,16 +2608,16 @@
|
|
|
2585
2608
|
FormLayoutComponent.prototype.routerLinkActionClick = function (action, relative) {
|
|
2586
2609
|
if (relative === void 0) { relative = false; }
|
|
2587
2610
|
if (action.outlet) {
|
|
2588
|
-
this.
|
|
2611
|
+
this._router.navigate(['', { outlets: { formRightPane: action.link } }]);
|
|
2589
2612
|
}
|
|
2590
2613
|
else {
|
|
2591
|
-
this.
|
|
2614
|
+
this._router.navigate([action.link]);
|
|
2592
2615
|
}
|
|
2593
2616
|
};
|
|
2594
2617
|
return FormLayoutComponent;
|
|
2595
2618
|
}());
|
|
2596
2619
|
FormLayoutComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.0.1", ngImport: i0__namespace, type: FormLayoutComponent, deps: [{ token: i1__namespace$1.Router }], target: i0__namespace.ɵɵFactoryTarget.Component });
|
|
2597
|
-
FormLayoutComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.0.1", type: FormLayoutComponent, selector: "lib-form-layout", inputs: { title: "title", searchPlaceholder: ["search-placeholder", "searchPlaceholder"], actions: "actions", subTitle: ["sub-title", "subTitle"] }, outputs: { onAction: "onAction", onSearch: "onSearch", onComplete: "onComplete" }, viewQueries: [{ propertyName: "searchInput$", first: true, predicate: ["search"], descendants: true }], ngImport: i0__namespace, template: "<div class=\"form-layout-container\">\r\n <div class=\"form-header\" *ngIf=\"title || subTitle || actions\">\r\n <div class=\"form-header-inner\">\r\n <h3 class=\"form-title\">\r\n {{ title }}\r\n </h3>\r\n <p class=\"form-subtitle\">\r\n {{ subTitle }}\r\n </p>\r\n </div>\r\n <div class=\"form-header-actions\">\r\n <ng-container *ngFor=\"let action of actions\"
|
|
2620
|
+
FormLayoutComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.0.1", type: FormLayoutComponent, selector: "lib-form-layout", inputs: { title: "title", searchPlaceholder: ["search-placeholder", "searchPlaceholder"], actions: "actions", subTitle: ["sub-title", "subTitle"] }, outputs: { onAction: "onAction", onSearch: "onSearch", onComplete: "onComplete" }, viewQueries: [{ propertyName: "searchInput$", first: true, predicate: ["search"], descendants: true }], ngImport: i0__namespace, template: "<div class=\"form-layout-container\">\r\n <div class=\"form-header\" *ngIf=\"title || subTitle || actions\">\r\n <div class=\"form-header-inner\">\r\n <h3 class=\"form-title\">\r\n {{ title }}\r\n </h3>\r\n <p class=\"form-subtitle\">\r\n {{ subTitle }}\r\n </p>\r\n </div>\r\n <div class=\"form-header-actions\">\r\n <ng-container *ngFor=\"let action of actions\" [ngSwitch]=\"action.type\">\r\n <ng-container *ngSwitchCase=\"'search'\">\r\n <label for=\"search\" class=\"sr-only\">Search</label>\r\n <div class=\"search-container\">\r\n <div class=\"pointer-events-none absolute inset-y-0 left-0 pl-3 flex items-center\">\r\n <!--<svg class=\"h-5 w-5\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 20 20\" fill=\"currentColor\" aria-hidden=\"true\">\r\n <path fill-rule=\"evenodd\" d=\"M8 4a4 4 0 100 8 4 4 0 000-8zM2 8a6 6 0 1110.89 3.476l4.817 4.817a1 1 0 01-1.414 1.414l-4.816-4.816A6 6 0 012 8z\" clip-rule=\"evenodd\" />\r\n </svg>-->\r\n </div>\r\n <input id=\"search\"\r\n #search\r\n class=\"form-search-input\"\r\n [placeholder]=\"searchPlaceholder\"\r\n type=\"search\"\r\n name=\"search\"\r\n (input)=\"searchActionType(search.value)\">\r\n </div>\r\n <button type=\"button\"\r\n href=\"#\"\r\n class=\"btn-form-view-header-search\"\r\n [title]=\"action.tooltip\"\r\n (click)=\"searchActionClick(action, search.value)\">\r\n <i [class]=\"action.icon\"></i>\r\n </button>\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"'router-link'\">\r\n <button type=\"button\"\r\n href=\"#\"\r\n class=\"ml-1 btn-form-view-header\"\r\n [title]=\"action.tooltip\"\r\n (click)=\"routerLinkActionClick(action)\">\r\n <i [class]=\"action.icon\"></i>\r\n </button>\r\n </ng-container>\r\n <ng-container *ngSwitchDefault>\r\n <button type=\"button\"\r\n class=\"ml-1 btn-form-view-header\"\r\n [title]=\"action.tooltip\"\r\n (click)=\"emitActionClick(action)\">\r\n <i [class]=\"action.icon\"></i>\r\n </button>\r\n </ng-container>\r\n </ng-container>\r\n </div>\r\n </div>\r\n <div class=\"form-content-container\">\r\n <div [ngClass]=\"{'form-content-container-inner': actions}\">\r\n <ng-content></ng-content>\r\n </div>\r\n </div>\r\n <lib-side-pane #formPane (onComplete)=\"onSidePaneDeactivated($event)\">\r\n <router-outlet name=\"formRightPane\"\r\n (activate)=\"formPane.onSidePaneActivated($event)\"\r\n (deactivate)=\"formPane.onSidePaneDeactivated($event)\"></router-outlet>\r\n </lib-side-pane>\r\n</div>\r\n", components: [{ type: SidePaneComponent, selector: "lib-side-pane", inputs: ["visible"], outputs: ["onComplete"] }], directives: [{ type: i1__namespace.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i1__namespace.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i1__namespace.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { type: i1__namespace.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { type: i1__namespace.NgSwitchDefault, selector: "[ngSwitchDefault]" }, { type: i1__namespace.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i1__namespace$1.RouterOutlet, selector: "router-outlet", outputs: ["activate", "deactivate"], exportAs: ["outlet"] }] });
|
|
2598
2621
|
i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.0.1", ngImport: i0__namespace, type: FormLayoutComponent, decorators: [{
|
|
2599
2622
|
type: i0.Component,
|
|
2600
2623
|
args: [{
|
|
@@ -3700,6 +3723,7 @@
|
|
|
3700
3723
|
exports.ModelViewLayoutComponent = ModelViewLayoutComponent;
|
|
3701
3724
|
exports.NULL_TOAST = NULL_TOAST;
|
|
3702
3725
|
exports.NavLink = NavLink;
|
|
3726
|
+
exports.NotificationNavLink = NotificationNavLink;
|
|
3703
3727
|
exports.PageNotFoundComponent = PageNotFoundComponent;
|
|
3704
3728
|
exports.PagerComponent = PagerComponent;
|
|
3705
3729
|
exports.RouterViewAction = RouterViewAction;
|