@indice/ng-components 0.3.2-beta.6 → 0.3.2-beta.61

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.
Files changed (30) hide show
  1. package/_styles.scss +99 -95
  2. package/esm2022/lib/controls/date-picker/date-picker.component.mjs +3 -3
  3. package/esm2022/lib/controls/drop-down-menu/drop-down-menu.component.mjs +3 -3
  4. package/esm2022/lib/controls/nav-links-list/nav-links-list.component.mjs +3 -3
  5. package/esm2022/lib/controls/notifications-indicator/notifications-indicator.component.mjs +3 -3
  6. package/esm2022/lib/controls/side-pane/side-pane.component.mjs +5 -2
  7. package/esm2022/lib/controls/skeleton-loader/skeleton-loader.component.mjs +3 -3
  8. package/esm2022/lib/controls/user-profile-menu/user-profile-menu.component.mjs +3 -3
  9. package/esm2022/lib/helpers/base-list.component.mjs +10 -5
  10. package/esm2022/lib/layouts/shell/shell-header/shell-header.component.mjs +6 -3
  11. package/esm2022/lib/layouts/shell/shell-layout/shell-layout.component.mjs +8 -6
  12. package/esm2022/lib/layouts/shell/shell-sidebar-layout/shell-sidebar-layout.component.mjs +6 -3
  13. package/esm2022/lib/layouts/shell/shell-stacked-layout/shell-stacked-layout.component.mjs +8 -4
  14. package/esm2022/lib/layouts/views/form-layout/form-layout.component.mjs +1 -1
  15. package/esm2022/lib/layouts/views/model-view-layout/model-view-layout.component.mjs +6 -4
  16. package/esm2022/lib/layouts/views/view-layout/view-layout.component.mjs +3 -3
  17. package/esm2022/lib/pages/http-status/error/error.component.mjs +3 -3
  18. package/esm2022/lib/pages/http-status/page-not-found/page-not-found.component.mjs +3 -3
  19. package/esm2022/lib/pages/http-status/unauthorized/unauthorized.component.mjs +3 -3
  20. package/esm2022/lib/types.mjs +9 -1
  21. package/fesm2022/indice-ng-components.mjs +71 -41
  22. package/fesm2022/indice-ng-components.mjs.map +1 -1
  23. package/lib/controls/side-pane/side-pane.component.d.ts +3 -1
  24. package/lib/helpers/base-list.component.d.ts +2 -1
  25. package/lib/layouts/shell/shell-header/shell-header.component.d.ts +2 -1
  26. package/lib/layouts/shell/shell-layout/shell-layout.component.d.ts +3 -2
  27. package/lib/layouts/shell/shell-sidebar-layout/shell-sidebar-layout.component.d.ts +3 -2
  28. package/lib/layouts/shell/shell-stacked-layout/shell-stacked-layout.component.d.ts +2 -1
  29. package/lib/types.d.ts +6 -0
  30. package/package.json +1 -1
@@ -243,11 +243,11 @@ class DropDownMenuComponent {
243
243
  this.selectedChanged.emit(option.value);
244
244
  }
245
245
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.6", ngImport: i0, type: DropDownMenuComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
246
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.6", type: DropDownMenuComponent, selector: "lib-drop-down-menu", inputs: { options: "options", selectedValue: ["selected", "selectedValue"], multiple: "multiple", placeholder: "placeholder", showIcons: ["show-icons", "showIcons"] }, outputs: { selectedChange: "selectedChange", selectedChanged: "selectedChanged" }, usesOnChanges: true, ngImport: i0, template: "<div class=\"dropdown-container\" (clickOutside)=\"onClickOutside($event)\">\r\n <button\r\n type=\"button\"\r\n (click)=\"expanded = !expanded\"\r\n class=\"dropdown-button\"\r\n aria-haspopup=\"listbox\"\r\n aria-expanded=\"true\"\r\n aria-labelledby=\"listbox-label\">\r\n <span class=\"dropdown-selected-text\">\r\n <i *ngIf=\"selectedOption?.icon && showIcons\" \r\n [class]=\"selectedOption?.icon\" \r\n [class.mr-2]=\"selectedOption?.icon\"></i>{{ selectedOption?.text || placeholder }}\r\n </span>\r\n <span class=\"dropdown-button-icon\">\r\n <!-- Heroicon name: solid/selector -->\r\n <svg class=\"dropdown-arrow\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 20 20\" fill=\"currentColor\" aria-hidden=\"true\">\r\n <path\r\n fill-rule=\"evenodd\"\r\n d=\"M10 3a1 1 0 01.707.293l3 3a1 1 0 01-1.414 1.414L10 5.414 7.707 7.707a1 1 0 01-1.414-1.414l3-3A1 1 0 0110 3zm-3.707 9.293a1 1 0 011.414 0L10 14.586l2.293-2.293a1 1 0 011.414 1.414l-3 3a1 1 0 01-1.414 0l-3-3a1 1 0 010-1.414z\"\r\n clip-rule=\"evenodd\"\r\n />\r\n </svg>\r\n </span>\r\n </button>\r\n <ul\r\n *ngIf=\"expanded && options && options.length > 0\"\r\n class=\"dropdown-ul\"\r\n tabindex=\"-1\"\r\n role=\"listbox\"\r\n aria-labelledby=\"listbox-label\"\r\n aria-activedescendant=\"listbox-option-3\"\r\n >\r\n <ng-container *ngFor=\"let option of options\">\r\n <li\r\n [class]=\"isSelected(option) ? 'dropdown-li-selected' : 'dropdown-li'\"\r\n (click)=\"selectOption(option)\"\r\n id=\"listbox-option-0\"\r\n role=\"option\"\r\n >\r\n <span [class]=\"isSelected(option) ? 'dropdown-li-selected-text' : 'dropdown-li-text'\">\r\n <i *ngIf=\"option.icon && showIcons\" [class]=\"option.icon\" [class.mr-2]=\"option.icon\"></i>{{ option.text }}\r\n </span>\r\n <span *ngIf=\"isSelected(option)\" class=\"dropdown-li-selected-indicator-container\">\r\n <!-- Heroicon name: solid/check -->\r\n <svg\r\n class=\"dropdown-li-selected-indicator\"\r\n xmlns=\"http://www.w3.org/2000/svg\"\r\n viewBox=\"0 0 20 20\"\r\n fill=\"currentColor\"\r\n aria-hidden=\"true\"\r\n >\r\n <path\r\n fill-rule=\"evenodd\"\r\n d=\"M16.707 5.293a1 1 0 010 1.414l-8 8a1 1 0 01-1.414 0l-4-4a1 1 0 011.414-1.414L8 12.586l7.293-7.293a1 1 0 011.414 0z\"\r\n clip-rule=\"evenodd\"\r\n />\r\n </svg>\r\n </span>\r\n </li>\r\n </ng-container>\r\n </ul>\r\n</div>\r\n", dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: ClickOutsideDirective, selector: "[clickOutside]", inputs: ["clickOutsideEnabled", "attachOutsideOnClick", "delayClickOutsideInit", "emitOnBlur", "exclude", "excludeBeforeClick", "clickOutsideEvents"], outputs: ["clickOutside"] }] }); }
246
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.6", type: DropDownMenuComponent, selector: "lib-drop-down-menu", inputs: { options: "options", selectedValue: ["selected", "selectedValue"], multiple: "multiple", placeholder: "placeholder", showIcons: ["show-icons", "showIcons"] }, outputs: { selectedChange: "selectedChange", selectedChanged: "selectedChanged" }, usesOnChanges: true, ngImport: i0, template: "<div class=\"dropdown-container\" (clickOutside)=\"onClickOutside($event)\">\r\n <button type=\"button\" (click)=\"expanded = !expanded\" class=\"dropdown-button\" aria-haspopup=\"listbox\" aria-expanded=\"true\" aria-labelledby=\"listbox-label\">\r\n <span class=\"dropdown-selected-text\">\r\n <i *ngIf=\"selectedOption?.icon && showIcons\" [class]=\"selectedOption?.icon\" \r\n [class.mr-2]=\"selectedOption?.icon\"></i>{{ selectedOption?.text || placeholder }}\r\n </span>\r\n <span class=\"dropdown-button-icon\">\r\n <!-- Heroicon name: solid/selector -->\r\n <svg class=\"dropdown-arrow\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 20 20\" fill=\"currentColor\" aria-hidden=\"true\">\r\n <path fill-rule=\"evenodd\"\r\n d=\"M10 3a1 1 0 01.707.293l3 3a1 1 0 01-1.414 1.414L10 5.414 7.707 7.707a1 1 0 01-1.414-1.414l3-3A1 1 0 0110 3zm-3.707 9.293a1 1 0 011.414 0L10 14.586l2.293-2.293a1 1 0 011.414 1.414l-3 3a1 1 0 01-1.414 0l-3-3a1 1 0 010-1.414z\"\r\n clip-rule=\"evenodd\"/>\r\n </svg>\r\n </span>\r\n </button>\r\n <ul title=\"menu\" *ngIf=\"expanded && options && options.length > 0\" class=\"dropdown-ul\" tabindex=\"-1\" role=\"listbox\" aria-labelledby=\"listbox-label\">\r\n <ng-container *ngFor=\"let option of options\">\r\n <li [class]=\"isSelected(option) ? 'dropdown-li-selected' : 'dropdown-li'\" (click)=\"selectOption(option)\" id=\"listbox-option-0\" role=\"option\">\r\n <span [class]=\"isSelected(option) ? 'dropdown-li-selected-text' : 'dropdown-li-text'\">\r\n <i *ngIf=\"option.icon && showIcons\" [class]=\"option.icon\" [class.mr-2]=\"option.icon\"></i>{{ option.text }}\r\n </span>\r\n <span *ngIf=\"isSelected(option)\" class=\"dropdown-li-selected-indicator-container\">\r\n <!-- Heroicon name: solid/check -->\r\n <svg class=\"dropdown-li-selected-indicator\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 20 20\" fill=\"currentColor\" aria-hidden=\"true\">\r\n <path fill-rule=\"evenodd\" d=\"M16.707 5.293a1 1 0 010 1.414l-8 8a1 1 0 01-1.414 0l-4-4a1 1 0 011.414-1.414L8 12.586l7.293-7.293a1 1 0 011.414 0z\" clip-rule=\"evenodd\"/>\r\n </svg>\r\n </span>\r\n </li>\r\n </ng-container>\r\n </ul>\r\n</div>\r\n", dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: ClickOutsideDirective, selector: "[clickOutside]", inputs: ["clickOutsideEnabled", "attachOutsideOnClick", "delayClickOutsideInit", "emitOnBlur", "exclude", "excludeBeforeClick", "clickOutsideEvents"], outputs: ["clickOutside"] }] }); }
247
247
  }
248
248
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.6", ngImport: i0, type: DropDownMenuComponent, decorators: [{
249
249
  type: Component,
250
- args: [{ selector: 'lib-drop-down-menu', template: "<div class=\"dropdown-container\" (clickOutside)=\"onClickOutside($event)\">\r\n <button\r\n type=\"button\"\r\n (click)=\"expanded = !expanded\"\r\n class=\"dropdown-button\"\r\n aria-haspopup=\"listbox\"\r\n aria-expanded=\"true\"\r\n aria-labelledby=\"listbox-label\">\r\n <span class=\"dropdown-selected-text\">\r\n <i *ngIf=\"selectedOption?.icon && showIcons\" \r\n [class]=\"selectedOption?.icon\" \r\n [class.mr-2]=\"selectedOption?.icon\"></i>{{ selectedOption?.text || placeholder }}\r\n </span>\r\n <span class=\"dropdown-button-icon\">\r\n <!-- Heroicon name: solid/selector -->\r\n <svg class=\"dropdown-arrow\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 20 20\" fill=\"currentColor\" aria-hidden=\"true\">\r\n <path\r\n fill-rule=\"evenodd\"\r\n d=\"M10 3a1 1 0 01.707.293l3 3a1 1 0 01-1.414 1.414L10 5.414 7.707 7.707a1 1 0 01-1.414-1.414l3-3A1 1 0 0110 3zm-3.707 9.293a1 1 0 011.414 0L10 14.586l2.293-2.293a1 1 0 011.414 1.414l-3 3a1 1 0 01-1.414 0l-3-3a1 1 0 010-1.414z\"\r\n clip-rule=\"evenodd\"\r\n />\r\n </svg>\r\n </span>\r\n </button>\r\n <ul\r\n *ngIf=\"expanded && options && options.length > 0\"\r\n class=\"dropdown-ul\"\r\n tabindex=\"-1\"\r\n role=\"listbox\"\r\n aria-labelledby=\"listbox-label\"\r\n aria-activedescendant=\"listbox-option-3\"\r\n >\r\n <ng-container *ngFor=\"let option of options\">\r\n <li\r\n [class]=\"isSelected(option) ? 'dropdown-li-selected' : 'dropdown-li'\"\r\n (click)=\"selectOption(option)\"\r\n id=\"listbox-option-0\"\r\n role=\"option\"\r\n >\r\n <span [class]=\"isSelected(option) ? 'dropdown-li-selected-text' : 'dropdown-li-text'\">\r\n <i *ngIf=\"option.icon && showIcons\" [class]=\"option.icon\" [class.mr-2]=\"option.icon\"></i>{{ option.text }}\r\n </span>\r\n <span *ngIf=\"isSelected(option)\" class=\"dropdown-li-selected-indicator-container\">\r\n <!-- Heroicon name: solid/check -->\r\n <svg\r\n class=\"dropdown-li-selected-indicator\"\r\n xmlns=\"http://www.w3.org/2000/svg\"\r\n viewBox=\"0 0 20 20\"\r\n fill=\"currentColor\"\r\n aria-hidden=\"true\"\r\n >\r\n <path\r\n fill-rule=\"evenodd\"\r\n d=\"M16.707 5.293a1 1 0 010 1.414l-8 8a1 1 0 01-1.414 0l-4-4a1 1 0 011.414-1.414L8 12.586l7.293-7.293a1 1 0 011.414 0z\"\r\n clip-rule=\"evenodd\"\r\n />\r\n </svg>\r\n </span>\r\n </li>\r\n </ng-container>\r\n </ul>\r\n</div>\r\n" }]
250
+ args: [{ selector: 'lib-drop-down-menu', template: "<div class=\"dropdown-container\" (clickOutside)=\"onClickOutside($event)\">\r\n <button type=\"button\" (click)=\"expanded = !expanded\" class=\"dropdown-button\" aria-haspopup=\"listbox\" aria-expanded=\"true\" aria-labelledby=\"listbox-label\">\r\n <span class=\"dropdown-selected-text\">\r\n <i *ngIf=\"selectedOption?.icon && showIcons\" [class]=\"selectedOption?.icon\" \r\n [class.mr-2]=\"selectedOption?.icon\"></i>{{ selectedOption?.text || placeholder }}\r\n </span>\r\n <span class=\"dropdown-button-icon\">\r\n <!-- Heroicon name: solid/selector -->\r\n <svg class=\"dropdown-arrow\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 20 20\" fill=\"currentColor\" aria-hidden=\"true\">\r\n <path fill-rule=\"evenodd\"\r\n d=\"M10 3a1 1 0 01.707.293l3 3a1 1 0 01-1.414 1.414L10 5.414 7.707 7.707a1 1 0 01-1.414-1.414l3-3A1 1 0 0110 3zm-3.707 9.293a1 1 0 011.414 0L10 14.586l2.293-2.293a1 1 0 011.414 1.414l-3 3a1 1 0 01-1.414 0l-3-3a1 1 0 010-1.414z\"\r\n clip-rule=\"evenodd\"/>\r\n </svg>\r\n </span>\r\n </button>\r\n <ul title=\"menu\" *ngIf=\"expanded && options && options.length > 0\" class=\"dropdown-ul\" tabindex=\"-1\" role=\"listbox\" aria-labelledby=\"listbox-label\">\r\n <ng-container *ngFor=\"let option of options\">\r\n <li [class]=\"isSelected(option) ? 'dropdown-li-selected' : 'dropdown-li'\" (click)=\"selectOption(option)\" id=\"listbox-option-0\" role=\"option\">\r\n <span [class]=\"isSelected(option) ? 'dropdown-li-selected-text' : 'dropdown-li-text'\">\r\n <i *ngIf=\"option.icon && showIcons\" [class]=\"option.icon\" [class.mr-2]=\"option.icon\"></i>{{ option.text }}\r\n </span>\r\n <span *ngIf=\"isSelected(option)\" class=\"dropdown-li-selected-indicator-container\">\r\n <!-- Heroicon name: solid/check -->\r\n <svg class=\"dropdown-li-selected-indicator\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 20 20\" fill=\"currentColor\" aria-hidden=\"true\">\r\n <path fill-rule=\"evenodd\" d=\"M16.707 5.293a1 1 0 010 1.414l-8 8a1 1 0 01-1.414 0l-4-4a1 1 0 011.414-1.414L8 12.586l7.293-7.293a1 1 0 011.414 0z\" clip-rule=\"evenodd\"/>\r\n </svg>\r\n </span>\r\n </li>\r\n </ng-container>\r\n </ul>\r\n</div>\r\n" }]
251
251
  }], ctorParameters: () => [], propDecorators: { options: [{
252
252
  type: Input
253
253
  }], selectedValue: [{
@@ -333,6 +333,14 @@ class NotificationNavLink extends NavLink {
333
333
  this.creationDate = creationDate;
334
334
  }
335
335
  }
336
+ class NavLinkSeparator extends NavLink {
337
+ constructor(text, path, isRead, creationDate) {
338
+ super('', '');
339
+ this.isRead = isRead;
340
+ this.creationDate = creationDate;
341
+ this.type = 'separator';
342
+ }
343
+ }
336
344
  class ViewAction {
337
345
  constructor(type, key, param, icon, tooltip, text) {
338
346
  this.type = type;
@@ -1225,7 +1233,7 @@ class DatepickerComponent {
1225
1233
  useExisting: forwardRef(() => DatepickerComponent),
1226
1234
  multi: true
1227
1235
  }
1228
- ], viewQueries: [{ propertyName: "dateInput", first: true, predicate: ["dateInput"], descendants: true }], ngImport: i0, template: "<div class=\"flex\"\r\n [ngClass]=\"{'relative': !inline}\"\r\n (clickOutside)=\"closeCalendar()\">\r\n\r\n <input type=\"text\"\r\n *ngIf=\"!inline\"\r\n #dateInput\r\n [readonly]=\"readonly\"\r\n name=\"dateInput\"\r\n (blur)=\"onBlur($event)\"\r\n id=\"dateInput\"\r\n title=\"dateInput\"\r\n (focus)=\"showCalendar = false\"\r\n [value]=\"value | date: displayFormat\"\r\n class=\"detapicker-input\"\r\n [ngClass]=\"{'cursor-not-allowed': disabled}\"\r\n [placeholder]=\"disabled ? '' : placeholder\">\r\n\r\n <button type=\"button\"\r\n *ngIf=\"!inline\"\r\n class=\"datepicker-button\"\r\n [disabled]=\"disabled\"\r\n (click)=\"openCalendar()\"\r\n [ngClass]=\"{'cursor-not-allowed': disabled}\">\r\n <i class=\"ms-Icon ms-Icon--DateTime2\"></i>\r\n </button>\r\n\r\n <div *ngIf=\"showCalendar || inline\"\r\n [ngClass]=\"{'absolute': !inline}\"\r\n class=\"datepicker-background\"\r\n style=\"height:18rem;min-width:16rem;\"\r\n name=\"calendar\">\r\n <div class=\"datepicker-btn-wrapper\">\r\n <div>\r\n <button type=\"button\"\r\n (click)=\"openYears()\">\r\n <span class=\"datepicker-selected-month\">\r\n {{monthNames[month]}}\r\n </span>\r\n <span class=\"datepicker-selected-year\">\r\n {{year}}</span>\r\n </button>\r\n </div>\r\n <div *ngIf=\"!showYears; else showYearsPickerTmpl\">\r\n <button type=\"button\"\r\n class=\"datepicker-nav-btn\"\r\n (click)=\"previousMonth();\">\r\n <svg fill=\"none\"\r\n viewBox=\"0 0 24 24\"\r\n stroke=\"currentColor\">\r\n <path stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"\r\n stroke-width=\"2\"\r\n d=\"M15 19l-7-7 7-7\" />\r\n </svg>\r\n </button>\r\n <button type=\"button\"\r\n class=\"datepicker-nav-btn\"\r\n (click)=\"nextMonth()\">\r\n <svg fill=\"none\"\r\n viewBox=\"0 0 24 24\"\r\n stroke=\"currentColor\">\r\n <path stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"\r\n stroke-width=\"2\"\r\n d=\"M9 5l7 7-7 7\" />\r\n </svg>\r\n </button>\r\n </div>\r\n <ng-template #showYearsPickerTmpl>\r\n <div>\r\n <button type=\"button\"\r\n class=\"datepicker-nav-btn\"\r\n (click)=\"previousYear();\">\r\n <svg fill=\"none\"\r\n viewBox=\"0 0 24 24\"\r\n stroke=\"currentColor\">\r\n <path stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"\r\n stroke-width=\"2\"\r\n d=\"M15 19l-7-7 7-7\" />\r\n </svg>\r\n </button>\r\n <button type=\"button\"\r\n class=\"datepicker-nav-btn\"\r\n (click)=\"nextYear()\">\r\n <svg fill=\"none\"\r\n viewBox=\"0 0 24 24\"\r\n stroke=\"currentColor\">\r\n <path stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"\r\n stroke-width=\"2\"\r\n d=\"M9 5l7 7-7 7\" />\r\n </svg>\r\n </button>\r\n </div>\r\n </ng-template>\r\n </div>\r\n\r\n <div class=\"datepicker-wrapper\"\r\n *ngIf=\"!showYears; else showCalYearsTmpl\">\r\n <div *ngFor=\"let day of dayNames\"\r\n class=\"datepicker-day-name\"\r\n style=\"width: 14.28%\">{{day}}</div>\r\n </div>\r\n\r\n <ng-template #showCalYearsTmpl>\r\n <div class=\"datepicker-content-wrapper\">\r\n <div *ngFor=\"let year of showCalendarYears\"\r\n style=\"width: 18.28%\"\r\n class=\"px-1 mb-1\">\r\n <div (click)=\"selectYearValue(year)\"\r\n class=\"datepicker-year\"\r\n [class]=\"year.selected ? 'selected' : 'not-selected'\">\r\n {{year.year}}</div>\r\n </div>\r\n </div>\r\n </ng-template>\r\n\r\n <div class=\"datepicker-content-wrapper\"\r\n *ngIf=\"!showYears\">\r\n <div *ngFor=\"let blankday of blankDays\"\r\n style=\"width: 14.28%\"\r\n class=\"datepicker-blank-days\">{{blankday}}</div>\r\n <div *ngFor=\"let date of calendarDates;\"\r\n style=\"width: 14.28%\"\r\n class=\"px-1 mb-1\">\r\n <div (click)=\"selectDateValue(date)\"\r\n class=\"datepicker-days\"\r\n [ngClass]=\"{'out-of-range': outOfRangeDate(date),'selected': date.selected, 'not-selected':!date.selected }\">\r\n {{date.day}}</div>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n</div>", dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: ClickOutsideDirective, selector: "[clickOutside]", inputs: ["clickOutsideEnabled", "attachOutsideOnClick", "delayClickOutsideInit", "emitOnBlur", "exclude", "excludeBeforeClick", "clickOutsideEvents"], outputs: ["clickOutside"] }, { kind: "pipe", type: i1.DatePipe, name: "date" }] }); }
1236
+ ], viewQueries: [{ propertyName: "dateInput", first: true, predicate: ["dateInput"], descendants: true }], ngImport: i0, template: "<div [class.relative]=\"!inline\">\r\n<div class=\"datepicker-container\" (clickOutside)=\"closeCalendar()\">\r\n <input *ngIf=\"!inline\"\r\n #dateInput\r\n [readonly]=\"readonly\"\r\n name=\"dateInput\"\r\n (blur)=\"onBlur($event)\"\r\n id=\"dateInput\"\r\n title=\"dateInput\"\r\n (focus)=\"showCalendar = false\"\r\n [value]=\"value | date: displayFormat\"\r\n class=\"datepicker-input\"\r\n [ngClass]=\"{'cursor-not-allowed': disabled}\"\r\n [placeholder]=\"placeholder\">\r\n\r\n <button type=\"button\"\r\n *ngIf=\"!inline\"\r\n class=\"datepicker-button\"\r\n [disabled]=\"disabled\"\r\n (click)=\"openCalendar()\"\r\n [ngClass]=\"{'cursor-not-allowed': disabled}\">\r\n <i class=\"ms-Icon ms-Icon--DateTime2\"></i>\r\n </button>\r\n</div>\r\n<div *ngIf=\"showCalendar || inline\"\r\n [class.absolute]=\"!inline\"\r\n class=\"datepicker-background\"\r\n style=\"height:18rem;min-width:16rem;\"\r\n name=\"calendar\">\r\n <div class=\"datepicker-btn-wrapper\">\r\n <div>\r\n <button type=\"button\"(click)=\"openYears()\">\r\n <span class=\"datepicker-selected-month\">\r\n {{monthNames[month]}}\r\n </span>\r\n <span class=\"datepicker-selected-year\">\r\n {{year}}</span>\r\n </button>\r\n </div>\r\n <div *ngIf=\"!showYears; else showYearsPickerTmpl\">\r\n <button type=\"button\"\r\n class=\"datepicker-nav-btn\"\r\n (click)=\"previousMonth();\">\r\n <svg fill=\"none\"\r\n viewBox=\"0 0 24 24\"\r\n stroke=\"currentColor\">\r\n <path stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"\r\n stroke-width=\"2\"\r\n d=\"M15 19l-7-7 7-7\" />\r\n </svg>\r\n </button>\r\n <button type=\"button\"\r\n class=\"datepicker-nav-btn\"\r\n (click)=\"nextMonth()\">\r\n <svg fill=\"none\"\r\n viewBox=\"0 0 24 24\"\r\n stroke=\"currentColor\">\r\n <path stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"\r\n stroke-width=\"2\"\r\n d=\"M9 5l7 7-7 7\" />\r\n </svg>\r\n </button>\r\n </div>\r\n <ng-template #showYearsPickerTmpl>\r\n <div>\r\n <button type=\"button\"\r\n class=\"datepicker-nav-btn\"\r\n (click)=\"previousYear();\">\r\n <svg fill=\"none\"\r\n viewBox=\"0 0 24 24\"\r\n stroke=\"currentColor\">\r\n <path stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"\r\n stroke-width=\"2\"\r\n d=\"M15 19l-7-7 7-7\" />\r\n </svg>\r\n </button>\r\n <button type=\"button\"\r\n class=\"datepicker-nav-btn\"\r\n (click)=\"nextYear()\">\r\n <svg fill=\"none\"\r\n viewBox=\"0 0 24 24\"\r\n stroke=\"currentColor\">\r\n <path stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"\r\n stroke-width=\"2\"\r\n d=\"M9 5l7 7-7 7\" />\r\n </svg>\r\n </button>\r\n </div>\r\n </ng-template>\r\n </div>\r\n\r\n <div class=\"datepicker-wrapper\"\r\n *ngIf=\"!showYears; else showCalYearsTmpl\">\r\n <div *ngFor=\"let day of dayNames\"\r\n class=\"datepicker-day-name\"\r\n style=\"width: 14.28%\">{{day}}</div>\r\n </div>\r\n\r\n <ng-template #showCalYearsTmpl>\r\n <div class=\"datepicker-content-wrapper\">\r\n <div *ngFor=\"let year of showCalendarYears\"\r\n style=\"width: 18.28%\"\r\n class=\"px-1 mb-1\">\r\n <div (click)=\"selectYearValue(year)\"\r\n class=\"datepicker-year\"\r\n [class]=\"year.selected ? 'selected' : 'not-selected'\">\r\n {{year.year}}</div>\r\n </div>\r\n </div>\r\n </ng-template>\r\n\r\n <div class=\"datepicker-content-wrapper\" *ngIf=\"!showYears\">\r\n <div *ngFor=\"let blankday of blankDays\" style=\"width: 14.28%\" class=\"datepicker-blank-days\">{{blankday}}</div>\r\n <div *ngFor=\"let date of calendarDates;\" style=\"width: 14.28%\" class=\"px-1 mb-1\">\r\n <div (click)=\"selectDateValue(date)\" class=\"datepicker-days\" [ngClass]=\"{'out-of-range': outOfRangeDate(date),'selected': date.selected, 'not-selected':!date.selected }\">\r\n {{date.day}}\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n</div>", dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: ClickOutsideDirective, selector: "[clickOutside]", inputs: ["clickOutsideEnabled", "attachOutsideOnClick", "delayClickOutsideInit", "emitOnBlur", "exclude", "excludeBeforeClick", "clickOutsideEvents"], outputs: ["clickOutside"] }, { kind: "pipe", type: i1.DatePipe, name: "date" }] }); }
1229
1237
  }
1230
1238
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.6", ngImport: i0, type: DatepickerComponent, decorators: [{
1231
1239
  type: Component,
@@ -1235,7 +1243,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.6", ngImpor
1235
1243
  useExisting: forwardRef(() => DatepickerComponent),
1236
1244
  multi: true
1237
1245
  }
1238
- ], template: "<div class=\"flex\"\r\n [ngClass]=\"{'relative': !inline}\"\r\n (clickOutside)=\"closeCalendar()\">\r\n\r\n <input type=\"text\"\r\n *ngIf=\"!inline\"\r\n #dateInput\r\n [readonly]=\"readonly\"\r\n name=\"dateInput\"\r\n (blur)=\"onBlur($event)\"\r\n id=\"dateInput\"\r\n title=\"dateInput\"\r\n (focus)=\"showCalendar = false\"\r\n [value]=\"value | date: displayFormat\"\r\n class=\"detapicker-input\"\r\n [ngClass]=\"{'cursor-not-allowed': disabled}\"\r\n [placeholder]=\"disabled ? '' : placeholder\">\r\n\r\n <button type=\"button\"\r\n *ngIf=\"!inline\"\r\n class=\"datepicker-button\"\r\n [disabled]=\"disabled\"\r\n (click)=\"openCalendar()\"\r\n [ngClass]=\"{'cursor-not-allowed': disabled}\">\r\n <i class=\"ms-Icon ms-Icon--DateTime2\"></i>\r\n </button>\r\n\r\n <div *ngIf=\"showCalendar || inline\"\r\n [ngClass]=\"{'absolute': !inline}\"\r\n class=\"datepicker-background\"\r\n style=\"height:18rem;min-width:16rem;\"\r\n name=\"calendar\">\r\n <div class=\"datepicker-btn-wrapper\">\r\n <div>\r\n <button type=\"button\"\r\n (click)=\"openYears()\">\r\n <span class=\"datepicker-selected-month\">\r\n {{monthNames[month]}}\r\n </span>\r\n <span class=\"datepicker-selected-year\">\r\n {{year}}</span>\r\n </button>\r\n </div>\r\n <div *ngIf=\"!showYears; else showYearsPickerTmpl\">\r\n <button type=\"button\"\r\n class=\"datepicker-nav-btn\"\r\n (click)=\"previousMonth();\">\r\n <svg fill=\"none\"\r\n viewBox=\"0 0 24 24\"\r\n stroke=\"currentColor\">\r\n <path stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"\r\n stroke-width=\"2\"\r\n d=\"M15 19l-7-7 7-7\" />\r\n </svg>\r\n </button>\r\n <button type=\"button\"\r\n class=\"datepicker-nav-btn\"\r\n (click)=\"nextMonth()\">\r\n <svg fill=\"none\"\r\n viewBox=\"0 0 24 24\"\r\n stroke=\"currentColor\">\r\n <path stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"\r\n stroke-width=\"2\"\r\n d=\"M9 5l7 7-7 7\" />\r\n </svg>\r\n </button>\r\n </div>\r\n <ng-template #showYearsPickerTmpl>\r\n <div>\r\n <button type=\"button\"\r\n class=\"datepicker-nav-btn\"\r\n (click)=\"previousYear();\">\r\n <svg fill=\"none\"\r\n viewBox=\"0 0 24 24\"\r\n stroke=\"currentColor\">\r\n <path stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"\r\n stroke-width=\"2\"\r\n d=\"M15 19l-7-7 7-7\" />\r\n </svg>\r\n </button>\r\n <button type=\"button\"\r\n class=\"datepicker-nav-btn\"\r\n (click)=\"nextYear()\">\r\n <svg fill=\"none\"\r\n viewBox=\"0 0 24 24\"\r\n stroke=\"currentColor\">\r\n <path stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"\r\n stroke-width=\"2\"\r\n d=\"M9 5l7 7-7 7\" />\r\n </svg>\r\n </button>\r\n </div>\r\n </ng-template>\r\n </div>\r\n\r\n <div class=\"datepicker-wrapper\"\r\n *ngIf=\"!showYears; else showCalYearsTmpl\">\r\n <div *ngFor=\"let day of dayNames\"\r\n class=\"datepicker-day-name\"\r\n style=\"width: 14.28%\">{{day}}</div>\r\n </div>\r\n\r\n <ng-template #showCalYearsTmpl>\r\n <div class=\"datepicker-content-wrapper\">\r\n <div *ngFor=\"let year of showCalendarYears\"\r\n style=\"width: 18.28%\"\r\n class=\"px-1 mb-1\">\r\n <div (click)=\"selectYearValue(year)\"\r\n class=\"datepicker-year\"\r\n [class]=\"year.selected ? 'selected' : 'not-selected'\">\r\n {{year.year}}</div>\r\n </div>\r\n </div>\r\n </ng-template>\r\n\r\n <div class=\"datepicker-content-wrapper\"\r\n *ngIf=\"!showYears\">\r\n <div *ngFor=\"let blankday of blankDays\"\r\n style=\"width: 14.28%\"\r\n class=\"datepicker-blank-days\">{{blankday}}</div>\r\n <div *ngFor=\"let date of calendarDates;\"\r\n style=\"width: 14.28%\"\r\n class=\"px-1 mb-1\">\r\n <div (click)=\"selectDateValue(date)\"\r\n class=\"datepicker-days\"\r\n [ngClass]=\"{'out-of-range': outOfRangeDate(date),'selected': date.selected, 'not-selected':!date.selected }\">\r\n {{date.day}}</div>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n</div>" }]
1246
+ ], template: "<div [class.relative]=\"!inline\">\r\n<div class=\"datepicker-container\" (clickOutside)=\"closeCalendar()\">\r\n <input *ngIf=\"!inline\"\r\n #dateInput\r\n [readonly]=\"readonly\"\r\n name=\"dateInput\"\r\n (blur)=\"onBlur($event)\"\r\n id=\"dateInput\"\r\n title=\"dateInput\"\r\n (focus)=\"showCalendar = false\"\r\n [value]=\"value | date: displayFormat\"\r\n class=\"datepicker-input\"\r\n [ngClass]=\"{'cursor-not-allowed': disabled}\"\r\n [placeholder]=\"placeholder\">\r\n\r\n <button type=\"button\"\r\n *ngIf=\"!inline\"\r\n class=\"datepicker-button\"\r\n [disabled]=\"disabled\"\r\n (click)=\"openCalendar()\"\r\n [ngClass]=\"{'cursor-not-allowed': disabled}\">\r\n <i class=\"ms-Icon ms-Icon--DateTime2\"></i>\r\n </button>\r\n</div>\r\n<div *ngIf=\"showCalendar || inline\"\r\n [class.absolute]=\"!inline\"\r\n class=\"datepicker-background\"\r\n style=\"height:18rem;min-width:16rem;\"\r\n name=\"calendar\">\r\n <div class=\"datepicker-btn-wrapper\">\r\n <div>\r\n <button type=\"button\"(click)=\"openYears()\">\r\n <span class=\"datepicker-selected-month\">\r\n {{monthNames[month]}}\r\n </span>\r\n <span class=\"datepicker-selected-year\">\r\n {{year}}</span>\r\n </button>\r\n </div>\r\n <div *ngIf=\"!showYears; else showYearsPickerTmpl\">\r\n <button type=\"button\"\r\n class=\"datepicker-nav-btn\"\r\n (click)=\"previousMonth();\">\r\n <svg fill=\"none\"\r\n viewBox=\"0 0 24 24\"\r\n stroke=\"currentColor\">\r\n <path stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"\r\n stroke-width=\"2\"\r\n d=\"M15 19l-7-7 7-7\" />\r\n </svg>\r\n </button>\r\n <button type=\"button\"\r\n class=\"datepicker-nav-btn\"\r\n (click)=\"nextMonth()\">\r\n <svg fill=\"none\"\r\n viewBox=\"0 0 24 24\"\r\n stroke=\"currentColor\">\r\n <path stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"\r\n stroke-width=\"2\"\r\n d=\"M9 5l7 7-7 7\" />\r\n </svg>\r\n </button>\r\n </div>\r\n <ng-template #showYearsPickerTmpl>\r\n <div>\r\n <button type=\"button\"\r\n class=\"datepicker-nav-btn\"\r\n (click)=\"previousYear();\">\r\n <svg fill=\"none\"\r\n viewBox=\"0 0 24 24\"\r\n stroke=\"currentColor\">\r\n <path stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"\r\n stroke-width=\"2\"\r\n d=\"M15 19l-7-7 7-7\" />\r\n </svg>\r\n </button>\r\n <button type=\"button\"\r\n class=\"datepicker-nav-btn\"\r\n (click)=\"nextYear()\">\r\n <svg fill=\"none\"\r\n viewBox=\"0 0 24 24\"\r\n stroke=\"currentColor\">\r\n <path stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"\r\n stroke-width=\"2\"\r\n d=\"M9 5l7 7-7 7\" />\r\n </svg>\r\n </button>\r\n </div>\r\n </ng-template>\r\n </div>\r\n\r\n <div class=\"datepicker-wrapper\"\r\n *ngIf=\"!showYears; else showCalYearsTmpl\">\r\n <div *ngFor=\"let day of dayNames\"\r\n class=\"datepicker-day-name\"\r\n style=\"width: 14.28%\">{{day}}</div>\r\n </div>\r\n\r\n <ng-template #showCalYearsTmpl>\r\n <div class=\"datepicker-content-wrapper\">\r\n <div *ngFor=\"let year of showCalendarYears\"\r\n style=\"width: 18.28%\"\r\n class=\"px-1 mb-1\">\r\n <div (click)=\"selectYearValue(year)\"\r\n class=\"datepicker-year\"\r\n [class]=\"year.selected ? 'selected' : 'not-selected'\">\r\n {{year.year}}</div>\r\n </div>\r\n </div>\r\n </ng-template>\r\n\r\n <div class=\"datepicker-content-wrapper\" *ngIf=\"!showYears\">\r\n <div *ngFor=\"let blankday of blankDays\" style=\"width: 14.28%\" class=\"datepicker-blank-days\">{{blankday}}</div>\r\n <div *ngFor=\"let date of calendarDates;\" style=\"width: 14.28%\" class=\"px-1 mb-1\">\r\n <div (click)=\"selectDateValue(date)\" class=\"datepicker-days\" [ngClass]=\"{'out-of-range': outOfRangeDate(date),'selected': date.selected, 'not-selected':!date.selected }\">\r\n {{date.day}}\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n</div>" }]
1239
1247
  }], ctorParameters: () => [{ type: undefined, decorators: [{
1240
1248
  type: Inject,
1241
1249
  args: [LOCALE_ID]
@@ -1450,11 +1458,11 @@ class SkeletonLoaderComponent {
1450
1458
  return new Array(i);
1451
1459
  }
1452
1460
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.6", ngImport: i0, type: SkeletonLoaderComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
1453
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.6", type: SkeletonLoaderComponent, selector: "lib-skeleton-loader", inputs: { count: "count", type: "type", deckClass: ["deck-class", "deckClass"] }, ngImport: i0, template: "<div [class]=\"deckClass\" *ngIf=\"type === 'tiles'\">\r\n <div class=\"relative p-4 w-80 bg-white overflow-hidden shadow hover:shadow-md rounded-xl\" *ngFor=\"let i of counter(count)\">\r\n <div class=\"animate-pulse flex flex-col\">\r\n <div class=\"rounded w-full h-32 bg-gray-200\"></div>\r\n \r\n <div class=\"flex flex-col mt-5 rounded-lg\">\r\n <div class=\"w-full h-5 bg-gray-200 rounded\"></div>\r\n <div class=\"mt-2 w-10/12 h-3 bg-gray-200 rounded\"></div>\r\n <div class=\"mt-2 w-8/12 h-3 bg-gray-200 rounded\"></div>\r\n </div>\r\n\r\n <div class=\"grid grid-cols-2 mt-5 gap-x-2 gap-y-1\">\r\n <div class=\"mt-2 w-full h-3 bg-gray-200 rounded\"></div>\r\n <div class=\"mt-2 w-full h-3 bg-gray-200 rounded\"></div>\r\n </div>\r\n\r\n </div>\r\n </div>\r\n</div>\r\n \r\n<div class=\"cards-deck-1\" *ngIf=\"type === 'table'\">\r\n <div class=\"border border-light-blue-300 shadow rounded-sm p-4 max-w-sm w-full mx-auto mb-4\" *ngFor=\"let i of counter(count)\">\r\n <div class=\"animate-pulse flex space-x-4\">\r\n <div class=\"rounded-full bg-light-blue-400 h-12 w-12\">&nbsp;</div>\r\n <div class=\"flex-1 space-y-4 py-1\">\r\n <div class=\"h-4 bg-light-blue-400 rounded w-3/4\">&nbsp;</div>\r\n <div class=\"space-y-2\">\r\n <div class=\"h-4 bg-light-blue-400 rounded\">&nbsp;</div>\r\n <div class=\"h-4 bg-light-blue-400 rounded w-5/6\">&nbsp;</div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n</div>", dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] }); }
1461
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.6", type: SkeletonLoaderComponent, selector: "lib-skeleton-loader", inputs: { count: "count", type: "type", deckClass: ["deck-class", "deckClass"] }, ngImport: i0, template: "<div [class]=\"deckClass\" *ngIf=\"type === 'tiles'\">\r\n <div class=\"relative p-4 w-80 bg-white overflow-hidden shadow hover:shadow-md rounded-xl\" *ngFor=\"let i of counter(count)\">\r\n <div class=\"animate-pulse flex flex-col rounded-xl\">\r\n <div class=\"rounded w-full h-32 bg-gray-200\"></div>\r\n \r\n <div class=\"flex flex-col mt-5 rounded-xl\">\r\n <div class=\"w-full h-5 bg-gray-200 rounded\"></div>\r\n <div class=\"mt-2 w-10/12 h-3 bg-gray-200 rounded\"></div>\r\n <div class=\"mt-2 w-8/12 h-3 bg-gray-200 rounded\"></div>\r\n </div>\r\n\r\n <div class=\"grid grid-cols-2 mt-5 gap-x-2 gap-y-1 rounded-xl\">\r\n <div class=\"mt-2 w-full h-3 bg-gray-200 rounded\"></div>\r\n <div class=\"mt-2 w-full h-3 bg-gray-200 rounded\"></div>\r\n </div>\r\n\r\n </div>\r\n </div>\r\n</div>\r\n \r\n<div class=\"cards-deck-1\" *ngIf=\"type === 'table'\">\r\n <div class=\"border border-light-blue-300 shadow rounded-lg p-4 max-w-sm w-full mx-auto mb-4\" *ngFor=\"let i of counter(count)\">\r\n <div class=\"animate-pulse flex space-x-4\">\r\n <div class=\"rounded-full bg-light-blue-400 h-12 w-12\">&nbsp;</div>\r\n <div class=\"flex-1 space-y-4 py-1\">\r\n <div class=\"h-4 bg-light-blue-400 rounded w-3/4\">&nbsp;</div>\r\n <div class=\"space-y-2\">\r\n <div class=\"h-4 bg-light-blue-400 rounded\">&nbsp;</div>\r\n <div class=\"h-4 bg-light-blue-400 rounded w-5/6\">&nbsp;</div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n</div>", dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] }); }
1454
1462
  }
1455
1463
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.6", ngImport: i0, type: SkeletonLoaderComponent, decorators: [{
1456
1464
  type: Component,
1457
- args: [{ selector: 'lib-skeleton-loader', template: "<div [class]=\"deckClass\" *ngIf=\"type === 'tiles'\">\r\n <div class=\"relative p-4 w-80 bg-white overflow-hidden shadow hover:shadow-md rounded-xl\" *ngFor=\"let i of counter(count)\">\r\n <div class=\"animate-pulse flex flex-col\">\r\n <div class=\"rounded w-full h-32 bg-gray-200\"></div>\r\n \r\n <div class=\"flex flex-col mt-5 rounded-lg\">\r\n <div class=\"w-full h-5 bg-gray-200 rounded\"></div>\r\n <div class=\"mt-2 w-10/12 h-3 bg-gray-200 rounded\"></div>\r\n <div class=\"mt-2 w-8/12 h-3 bg-gray-200 rounded\"></div>\r\n </div>\r\n\r\n <div class=\"grid grid-cols-2 mt-5 gap-x-2 gap-y-1\">\r\n <div class=\"mt-2 w-full h-3 bg-gray-200 rounded\"></div>\r\n <div class=\"mt-2 w-full h-3 bg-gray-200 rounded\"></div>\r\n </div>\r\n\r\n </div>\r\n </div>\r\n</div>\r\n \r\n<div class=\"cards-deck-1\" *ngIf=\"type === 'table'\">\r\n <div class=\"border border-light-blue-300 shadow rounded-sm p-4 max-w-sm w-full mx-auto mb-4\" *ngFor=\"let i of counter(count)\">\r\n <div class=\"animate-pulse flex space-x-4\">\r\n <div class=\"rounded-full bg-light-blue-400 h-12 w-12\">&nbsp;</div>\r\n <div class=\"flex-1 space-y-4 py-1\">\r\n <div class=\"h-4 bg-light-blue-400 rounded w-3/4\">&nbsp;</div>\r\n <div class=\"space-y-2\">\r\n <div class=\"h-4 bg-light-blue-400 rounded\">&nbsp;</div>\r\n <div class=\"h-4 bg-light-blue-400 rounded w-5/6\">&nbsp;</div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n</div>" }]
1465
+ args: [{ selector: 'lib-skeleton-loader', template: "<div [class]=\"deckClass\" *ngIf=\"type === 'tiles'\">\r\n <div class=\"relative p-4 w-80 bg-white overflow-hidden shadow hover:shadow-md rounded-xl\" *ngFor=\"let i of counter(count)\">\r\n <div class=\"animate-pulse flex flex-col rounded-xl\">\r\n <div class=\"rounded w-full h-32 bg-gray-200\"></div>\r\n \r\n <div class=\"flex flex-col mt-5 rounded-xl\">\r\n <div class=\"w-full h-5 bg-gray-200 rounded\"></div>\r\n <div class=\"mt-2 w-10/12 h-3 bg-gray-200 rounded\"></div>\r\n <div class=\"mt-2 w-8/12 h-3 bg-gray-200 rounded\"></div>\r\n </div>\r\n\r\n <div class=\"grid grid-cols-2 mt-5 gap-x-2 gap-y-1 rounded-xl\">\r\n <div class=\"mt-2 w-full h-3 bg-gray-200 rounded\"></div>\r\n <div class=\"mt-2 w-full h-3 bg-gray-200 rounded\"></div>\r\n </div>\r\n\r\n </div>\r\n </div>\r\n</div>\r\n \r\n<div class=\"cards-deck-1\" *ngIf=\"type === 'table'\">\r\n <div class=\"border border-light-blue-300 shadow rounded-lg p-4 max-w-sm w-full mx-auto mb-4\" *ngFor=\"let i of counter(count)\">\r\n <div class=\"animate-pulse flex space-x-4\">\r\n <div class=\"rounded-full bg-light-blue-400 h-12 w-12\">&nbsp;</div>\r\n <div class=\"flex-1 space-y-4 py-1\">\r\n <div class=\"h-4 bg-light-blue-400 rounded w-3/4\">&nbsp;</div>\r\n <div class=\"space-y-2\">\r\n <div class=\"h-4 bg-light-blue-400 rounded\">&nbsp;</div>\r\n <div class=\"h-4 bg-light-blue-400 rounded w-5/6\">&nbsp;</div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n</div>" }]
1458
1466
  }], ctorParameters: () => [], propDecorators: { count: [{
1459
1467
  type: Input
1460
1468
  }], type: [{
@@ -1958,7 +1966,7 @@ class SidePaneComponent {
1958
1966
  this.onComplete.emit(true);
1959
1967
  }
1960
1968
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.6", ngImport: i0, type: SidePaneComponent, deps: [{ token: i1$1.Router }, { token: DOCUMENT }], target: i0.ɵɵFactoryTarget.Component }); }
1961
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.6", type: SidePaneComponent, selector: "lib-side-pane", inputs: { showPane: ["visible", "showPane"] }, outputs: { onComplete: "onComplete", onOpen: "onOpen", onClose: "onClose" }, ngImport: i0, template: "<div *ngIf=\"showPane\" class=\"side-pane-outer-container\" aria-labelledby=\"slide-over\" role=\"dialog\" aria-modal=\"true\">\r\n <div [class]=\"showPane ? overlayStyle : 'hidden'\" aria-hidden=\"true\"></div>\r\n <div [class]=\"showPane ? 'side-pane-container' : 'hidden'\">\r\n <div [class]=\"sizeContainerStyle\">\r\n <div class=\"side-pane\">\r\n <ng-content></ng-content>\r\n </div>\r\n </div>\r\n </div>\r\n</div>\r\n", dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] }); }
1969
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.6", type: SidePaneComponent, selector: "lib-side-pane", inputs: { showPane: ["visible", "showPane"], size: "size" }, outputs: { onComplete: "onComplete", onOpen: "onOpen", onClose: "onClose" }, ngImport: i0, template: "<div *ngIf=\"showPane\" class=\"side-pane-outer-container\" aria-labelledby=\"slide-over\" role=\"dialog\" aria-modal=\"true\">\r\n <div [class]=\"showPane ? overlayStyle : 'hidden'\" aria-hidden=\"true\"></div>\r\n <div [class]=\"showPane ? 'side-pane-container' : 'hidden'\">\r\n <div [class]=\"sizeContainerStyle\">\r\n <div class=\"side-pane\">\r\n <ng-content></ng-content>\r\n </div>\r\n </div>\r\n </div>\r\n</div>\r\n", dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] }); }
1962
1970
  }
1963
1971
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.6", ngImport: i0, type: SidePaneComponent, decorators: [{
1964
1972
  type: Component,
@@ -1969,6 +1977,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.6", ngImpor
1969
1977
  }] }], propDecorators: { showPane: [{
1970
1978
  type: Input,
1971
1979
  args: ['visible']
1980
+ }], size: [{
1981
+ type: Input,
1982
+ args: ['size']
1972
1983
  }], onComplete: [{
1973
1984
  type: Output
1974
1985
  }], onOpen: [{
@@ -1997,11 +2008,11 @@ class NavLinksListComponent {
1997
2008
  this.fragmentSub$ = this.activeFragment?.subscribe(fragment => this.fragmentValue = fragment);
1998
2009
  }
1999
2010
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.6", ngImport: i0, type: NavLinksListComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
2000
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.6", type: NavLinksListComponent, selector: "lib-nav-links-list", inputs: { links: "links", activeFragment: ["active-fragment", "activeFragment"], navLinkClass: ["link-class", "navLinkClass"], navLinkActiveClass: ["link-active-class", "navLinkActiveClass"], containerClass: ["container-class", "containerClass"], showIcons: ["show-icons", "showIcons"], showText: ["show-text", "showText"], largeIcons: ["large-icons", "largeIcons"] }, ngImport: i0, template: "\r\n<div [class]=\"containerClass ?? 'nav-link-list-container'\">\r\n <div class=\"nav-link-list-container-inner\" [class.icons-only]=\"!showText\">\r\n <ng-container *ngFor=\"let link of links | async\">\r\n <ng-container [ngSwitch]=\"link.type\">\r\n <a *ngSwitchCase=\"'router'\"\r\n href=\"#\"\r\n [routerLink]=\"[link.path]\"\r\n [routerLinkActive]=\"navLinkActiveClass\"\r\n [routerLinkActiveOptions]=\"{ exact: link.exact }\"\r\n [queryParams]=\"link.queryParams\"\r\n [class]=\"navLinkClass\"\r\n [class.min-nav-link-text-width]=\"showText\">\r\n <div class=\"inline-flex items-center\">\r\n <i *ngIf=\"showIcons && link.icon\" [class]=\"link.icon\" [class.text-2xl]=\"largeIcons\" [class.p-1]=\"largeIcons\"></i>\r\n <span [class.ml-3]=\"showIcons && link.icon\" *ngIf=\"showText\">{{ link.text }}</span>\r\n </div>\r\n </a>\r\n <a *ngSwitchCase=\"'external'\"\r\n [href]=\"link.path\"\r\n [attr.target]=\"link.external ? '_blank' : '_self'\"\r\n [class]=\"navLinkClass\"\r\n [class.min-nav-link-text-width]=\"showText\">\r\n <div class=\"inline-flex items-center\">\r\n <i *ngIf=\"showIcons && link.icon\" [class]=\"link.icon\" [class.text-2xl]=\"largeIcons\" [class.p-1]=\"largeIcons\"></i>\r\n <span [class.ml-3]=\"showIcons && link.icon\" *ngIf=\"showText\">{{ link.text }}</span>\r\n </div>\r\n </a>\r\n <a *ngSwitchCase=\"'fragment'\"\r\n routerLink=\".\"\r\n [fragment]=\"link.path\"\r\n [class]=\"fragmentValue === link.path ? navLinkClass + ' ' + navLinkActiveClass : navLinkClass\"\r\n [class.min-nav-link-text-width]=\"showText\">\r\n <div class=\"inline-flex items-center\">\r\n <i *ngIf=\"showIcons && link.icon\" [class]=\"link.icon\" [class.text-2xl]=\"largeIcons\" [class.p-1]=\"largeIcons\"></i>\r\n <span [class.ml-3]=\"showIcons && link.icon\" *ngIf=\"showText\">{{ link.text }}</span>\r\n </div>\r\n </a>\r\n </ng-container>\r\n </ng-container>\r\n </div>\r\n</div>\r\n", dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i1.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "directive", type: i1$1.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "directive", type: i1$1.RouterLinkActive, selector: "[routerLinkActive]", inputs: ["routerLinkActiveOptions", "ariaCurrentWhenActive", "routerLinkActive"], outputs: ["isActiveChange"], exportAs: ["routerLinkActive"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }] }); }
2011
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.6", type: NavLinksListComponent, selector: "lib-nav-links-list", inputs: { links: "links", activeFragment: ["active-fragment", "activeFragment"], navLinkClass: ["link-class", "navLinkClass"], navLinkActiveClass: ["link-active-class", "navLinkActiveClass"], containerClass: ["container-class", "containerClass"], showIcons: ["show-icons", "showIcons"], showText: ["show-text", "showText"], largeIcons: ["large-icons", "largeIcons"] }, ngImport: i0, template: "\r\n<div [class]=\"containerClass ?? 'nav-link-list-container'\">\r\n <div class=\"nav-link-list-container-inner\" [class.icons-only]=\"!showText\">\r\n <ng-container *ngFor=\"let link of links | async\">\r\n <ng-container [ngSwitch]=\"link.type\">\r\n <div *ngSwitchCase=\"'sparator'\" class=\"h-2\"></div>\r\n <a *ngSwitchCase=\"'router'\"\r\n href=\"#\"\r\n [routerLink]=\"[link.path]\"\r\n [routerLinkActive]=\"navLinkActiveClass\"\r\n [routerLinkActiveOptions]=\"{ exact: link.exact }\"\r\n [queryParams]=\"link.queryParams\"\r\n [class]=\"navLinkClass\"\r\n [class.min-nav-link-text-width]=\"showText\">\r\n <div class=\"inline-flex items-center\">\r\n <i *ngIf=\"showIcons && link.icon\" [class]=\"link.icon\" [class.text-2xl]=\"largeIcons\" [class.p-1]=\"largeIcons\"></i>\r\n <span [class.ml-3]=\"showIcons && link.icon\" *ngIf=\"showText\">{{ link.text }}</span>\r\n </div>\r\n </a>\r\n <a *ngSwitchCase=\"'external'\"\r\n [href]=\"link.path\"\r\n [attr.target]=\"link.external ? '_blank' : '_self'\"\r\n [class]=\"navLinkClass\"\r\n [class.min-nav-link-text-width]=\"showText\">\r\n <div class=\"inline-flex items-center\">\r\n <i *ngIf=\"showIcons && link.icon\" [class]=\"link.icon\" [class.text-2xl]=\"largeIcons\" [class.p-1]=\"largeIcons\"></i>\r\n <span [class.ml-3]=\"showIcons && link.icon\" *ngIf=\"showText\">{{ link.text }}</span>\r\n </div>\r\n </a>\r\n <a *ngSwitchCase=\"'fragment'\"\r\n routerLink=\".\"\r\n [fragment]=\"link.path\"\r\n [class]=\"fragmentValue === link.path ? navLinkClass + ' ' + navLinkActiveClass : navLinkClass\"\r\n [class.min-nav-link-text-width]=\"showText\">\r\n <div class=\"inline-flex items-center\">\r\n <i *ngIf=\"showIcons && link.icon\" [class]=\"link.icon\" [class.text-2xl]=\"largeIcons\" [class.p-1]=\"largeIcons\"></i>\r\n <span [class.ml-3]=\"showIcons && link.icon\" *ngIf=\"showText\">{{ link.text }}</span>\r\n </div>\r\n </a>\r\n </ng-container>\r\n </ng-container>\r\n </div>\r\n</div>\r\n", dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i1.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "directive", type: i1$1.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "directive", type: i1$1.RouterLinkActive, selector: "[routerLinkActive]", inputs: ["routerLinkActiveOptions", "ariaCurrentWhenActive", "routerLinkActive"], outputs: ["isActiveChange"], exportAs: ["routerLinkActive"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }] }); }
2001
2012
  }
2002
2013
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.6", ngImport: i0, type: NavLinksListComponent, decorators: [{
2003
2014
  type: Component,
2004
- args: [{ selector: 'lib-nav-links-list', template: "\r\n<div [class]=\"containerClass ?? 'nav-link-list-container'\">\r\n <div class=\"nav-link-list-container-inner\" [class.icons-only]=\"!showText\">\r\n <ng-container *ngFor=\"let link of links | async\">\r\n <ng-container [ngSwitch]=\"link.type\">\r\n <a *ngSwitchCase=\"'router'\"\r\n href=\"#\"\r\n [routerLink]=\"[link.path]\"\r\n [routerLinkActive]=\"navLinkActiveClass\"\r\n [routerLinkActiveOptions]=\"{ exact: link.exact }\"\r\n [queryParams]=\"link.queryParams\"\r\n [class]=\"navLinkClass\"\r\n [class.min-nav-link-text-width]=\"showText\">\r\n <div class=\"inline-flex items-center\">\r\n <i *ngIf=\"showIcons && link.icon\" [class]=\"link.icon\" [class.text-2xl]=\"largeIcons\" [class.p-1]=\"largeIcons\"></i>\r\n <span [class.ml-3]=\"showIcons && link.icon\" *ngIf=\"showText\">{{ link.text }}</span>\r\n </div>\r\n </a>\r\n <a *ngSwitchCase=\"'external'\"\r\n [href]=\"link.path\"\r\n [attr.target]=\"link.external ? '_blank' : '_self'\"\r\n [class]=\"navLinkClass\"\r\n [class.min-nav-link-text-width]=\"showText\">\r\n <div class=\"inline-flex items-center\">\r\n <i *ngIf=\"showIcons && link.icon\" [class]=\"link.icon\" [class.text-2xl]=\"largeIcons\" [class.p-1]=\"largeIcons\"></i>\r\n <span [class.ml-3]=\"showIcons && link.icon\" *ngIf=\"showText\">{{ link.text }}</span>\r\n </div>\r\n </a>\r\n <a *ngSwitchCase=\"'fragment'\"\r\n routerLink=\".\"\r\n [fragment]=\"link.path\"\r\n [class]=\"fragmentValue === link.path ? navLinkClass + ' ' + navLinkActiveClass : navLinkClass\"\r\n [class.min-nav-link-text-width]=\"showText\">\r\n <div class=\"inline-flex items-center\">\r\n <i *ngIf=\"showIcons && link.icon\" [class]=\"link.icon\" [class.text-2xl]=\"largeIcons\" [class.p-1]=\"largeIcons\"></i>\r\n <span [class.ml-3]=\"showIcons && link.icon\" *ngIf=\"showText\">{{ link.text }}</span>\r\n </div>\r\n </a>\r\n </ng-container>\r\n </ng-container>\r\n </div>\r\n</div>\r\n" }]
2015
+ args: [{ selector: 'lib-nav-links-list', template: "\r\n<div [class]=\"containerClass ?? 'nav-link-list-container'\">\r\n <div class=\"nav-link-list-container-inner\" [class.icons-only]=\"!showText\">\r\n <ng-container *ngFor=\"let link of links | async\">\r\n <ng-container [ngSwitch]=\"link.type\">\r\n <div *ngSwitchCase=\"'sparator'\" class=\"h-2\"></div>\r\n <a *ngSwitchCase=\"'router'\"\r\n href=\"#\"\r\n [routerLink]=\"[link.path]\"\r\n [routerLinkActive]=\"navLinkActiveClass\"\r\n [routerLinkActiveOptions]=\"{ exact: link.exact }\"\r\n [queryParams]=\"link.queryParams\"\r\n [class]=\"navLinkClass\"\r\n [class.min-nav-link-text-width]=\"showText\">\r\n <div class=\"inline-flex items-center\">\r\n <i *ngIf=\"showIcons && link.icon\" [class]=\"link.icon\" [class.text-2xl]=\"largeIcons\" [class.p-1]=\"largeIcons\"></i>\r\n <span [class.ml-3]=\"showIcons && link.icon\" *ngIf=\"showText\">{{ link.text }}</span>\r\n </div>\r\n </a>\r\n <a *ngSwitchCase=\"'external'\"\r\n [href]=\"link.path\"\r\n [attr.target]=\"link.external ? '_blank' : '_self'\"\r\n [class]=\"navLinkClass\"\r\n [class.min-nav-link-text-width]=\"showText\">\r\n <div class=\"inline-flex items-center\">\r\n <i *ngIf=\"showIcons && link.icon\" [class]=\"link.icon\" [class.text-2xl]=\"largeIcons\" [class.p-1]=\"largeIcons\"></i>\r\n <span [class.ml-3]=\"showIcons && link.icon\" *ngIf=\"showText\">{{ link.text }}</span>\r\n </div>\r\n </a>\r\n <a *ngSwitchCase=\"'fragment'\"\r\n routerLink=\".\"\r\n [fragment]=\"link.path\"\r\n [class]=\"fragmentValue === link.path ? navLinkClass + ' ' + navLinkActiveClass : navLinkClass\"\r\n [class.min-nav-link-text-width]=\"showText\">\r\n <div class=\"inline-flex items-center\">\r\n <i *ngIf=\"showIcons && link.icon\" [class]=\"link.icon\" [class.text-2xl]=\"largeIcons\" [class.p-1]=\"largeIcons\"></i>\r\n <span [class.ml-3]=\"showIcons && link.icon\" *ngIf=\"showText\">{{ link.text }}</span>\r\n </div>\r\n </a>\r\n </ng-container>\r\n </ng-container>\r\n </div>\r\n</div>\r\n" }]
2005
2016
  }], ctorParameters: () => [], propDecorators: { links: [{
2006
2017
  type: Input
2007
2018
  }], activeFragment: [{
@@ -3187,11 +3198,11 @@ class NotificationsIndicatorComponent {
3187
3198
  this.menuExpanded = false;
3188
3199
  }
3189
3200
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.6", ngImport: i0, type: NotificationsIndicatorComponent, deps: [{ token: APP_NOTIFICATIONS }, { token: APP_LINKS }], target: i0.ɵɵFactoryTarget.Component }); }
3190
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.6", type: NotificationsIndicatorComponent, selector: "lib-notifications-indicator", ngImport: i0, template: "<div class=\"relative\"\r\n(clickOutside)=\"onClickOutside($event)\">\r\n <!-- Notifications Button -->\r\n <button type=\"button\"\r\n (click)=\"doInboxAction()\"\r\n aria-expanded=\"false\"\r\n aria-haspopup=\"true\">\r\n <span class=\"sr-only\">View notifications</span>\r\n <span class=\"avatar-container\">\r\n <span class=\"avatar-text\">\r\n <i class=\"ms-Icon hover:text-blue-400\"\r\n [class.ms-Icon--MessageFill]=\"unreadCount > 0\"\r\n [class.text-sky-400]=\"unreadCount > 0\"\r\n [class.animate-notification]=\"newArrival\"\r\n [class.ms-Icon--Message]=\"unreadCount === 0\">\r\n </i>\r\n </span>\r\n <span\r\n *ngIf=\"unreadCount > 0\"\r\n [class.animate-pulse]=\"newArrival\"\r\n class=\"absolute top-0 right-0 inline-flex items-center justify-center -mt-1 ml-1 text-xs leading-none text-gray-100 ordinal\">\r\n {{ unreadCount }}\r\n </span>\r\n </span>\r\n </button>\r\n\r\n <!-- Notifications dropdown -->\r\n <div *ngIf=\"menuExpanded\" class=\"header-notifications-dropdown-with-username\" role=\"menu\" aria-orientation=\"vertical\" aria-labelledby=\"messages-menu\">\r\n <div class=\"max-h-64 overflow-y-auto notification-messages min-h\">\r\n <ng-container *ngIf=\"!items; else messagesDropDown\" class=\"py-5\">\r\n <div class=\"notifications-nav-link 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 #messagesDropDown>\r\n <ul class=\"pr-1.5\">\r\n <ng-container *ngIf=\"items; else loading\">\r\n <ng-container *ngIf=\"items.length <= 0\" class=\"py-5\">\r\n <div class=\"notifications-nav-link 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 message of items; let i = index\">\r\n <li class=\"mb-2\" [ngClass]=\"{ 'border-l-2 border-blue-500 bg-blue-50 hover:bg-blue-50': !message.data.isRead }\">\r\n <div class=\"flex justify-between\">\r\n <div class=\"flex-grow\">\r\n <a\r\n [routerLink]=\"message.path\"\r\n (click)=\"removeItem(i)\"\r\n class=\"notifications-nav-link grid\"\r\n [ngClass]=\"!message.data.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 {{ message.data.creationDate | date: \"EEE, d MMMM\" }}\r\n </div>\r\n <div class=\"font-bold\">\r\n {{ message.data.text }}\r\n </div>\r\n </div>\r\n </a>\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!.path\" (click)=\"onClickOutside($event)\">\r\n <button type=\"button\" class=\"header-notifications-dropdown-view-all-button\">{{allNotificationsLink!.text}}</button>\r\n </a>\r\n </div>\r\n </div>\r\n</div>\r\n", dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$1.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "directive", type: ClickOutsideDirective, selector: "[clickOutside]", inputs: ["clickOutsideEnabled", "attachOutsideOnClick", "delayClickOutsideInit", "emitOnBlur", "exclude", "excludeBeforeClick", "clickOutsideEvents"], outputs: ["clickOutside"] }, { kind: "pipe", type: i1.DatePipe, name: "date" }] }); }
3201
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.6", type: NotificationsIndicatorComponent, selector: "lib-notifications-indicator", ngImport: i0, template: "<div class=\"relative\"\r\n(clickOutside)=\"onClickOutside($event)\">\r\n <!-- Notifications Button -->\r\n <button type=\"button\"\r\n (click)=\"doInboxAction()\"\r\n aria-expanded=\"false\"\r\n aria-haspopup=\"true\">\r\n <span class=\"sr-only\">View notifications</span>\r\n <span class=\"avatar-container\">\r\n <span class=\"avatar-text\">\r\n <i class=\"ms-Icon hover:text-blue-400\"\r\n [class.ms-Icon--MessageFill]=\"unreadCount > 0\"\r\n [class.text-sky-400]=\"unreadCount > 0\"\r\n [class.animate-notification]=\"newArrival\"\r\n [class.ms-Icon--Message]=\"unreadCount === 0\">\r\n </i>\r\n </span>\r\n <span\r\n *ngIf=\"unreadCount > 0\"\r\n [class.animate-pulse]=\"newArrival\"\r\n class=\"absolute top-0 right-0 inline-flex items-center justify-center -mt-1 ml-1 text-xs leading-none text-gray-100 ordinal\">\r\n {{ unreadCount }}\r\n </span>\r\n </span>\r\n </button>\r\n\r\n <!-- Notifications dropdown -->\r\n <div tabindex=\"1\" *ngIf=\"menuExpanded\" class=\"header-notifications-dropdown-with-username\" role=\"menu\" aria-orientation=\"vertical\" aria-labelledby=\"messages-menu\">\r\n <div class=\"max-h-64 overflow-y-auto notification-messages min-h\">\r\n <ng-container *ngIf=\"!items; else messagesDropDown\" class=\"py-5\">\r\n <div class=\"notifications-nav-link 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 #messagesDropDown>\r\n <ul class=\"pr-1.5\">\r\n <ng-container *ngIf=\"items; else loading\">\r\n <ng-container *ngIf=\"items.length <= 0\" class=\"py-5\">\r\n <div class=\"notifications-nav-link 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 message of items; let i = index\">\r\n <li class=\"mb-2\" [ngClass]=\"{ 'border-l-2 border-blue-500 bg-blue-50 hover:bg-blue-50': !message.data.isRead }\">\r\n <div class=\"flex justify-between\">\r\n <div class=\"flex-grow\">\r\n <a\r\n [routerLink]=\"message.path\"\r\n (click)=\"removeItem(i)\"\r\n class=\"notifications-nav-link grid\"\r\n [ngClass]=\"!message.data.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 {{ message.data.creationDate | date: \"EEE, d MMMM\" }}\r\n </div>\r\n <div class=\"font-bold\">\r\n {{ message.data.text }}\r\n </div>\r\n </div>\r\n </a>\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-lg\">\r\n <a [routerLink]=\"allNotificationsLink!.path\" (click)=\"onClickOutside($event)\">\r\n <button type=\"button\" class=\"header-notifications-dropdown-view-all-button\">{{allNotificationsLink!.text}}</button>\r\n </a>\r\n </div>\r\n </div>\r\n</div>\r\n", dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$1.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "directive", type: ClickOutsideDirective, selector: "[clickOutside]", inputs: ["clickOutsideEnabled", "attachOutsideOnClick", "delayClickOutsideInit", "emitOnBlur", "exclude", "excludeBeforeClick", "clickOutsideEvents"], outputs: ["clickOutside"] }, { kind: "pipe", type: i1.DatePipe, name: "date" }] }); }
3191
3202
  }
3192
3203
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.6", ngImport: i0, type: NotificationsIndicatorComponent, decorators: [{
3193
3204
  type: Component,
3194
- args: [{ selector: 'lib-notifications-indicator', template: "<div class=\"relative\"\r\n(clickOutside)=\"onClickOutside($event)\">\r\n <!-- Notifications Button -->\r\n <button type=\"button\"\r\n (click)=\"doInboxAction()\"\r\n aria-expanded=\"false\"\r\n aria-haspopup=\"true\">\r\n <span class=\"sr-only\">View notifications</span>\r\n <span class=\"avatar-container\">\r\n <span class=\"avatar-text\">\r\n <i class=\"ms-Icon hover:text-blue-400\"\r\n [class.ms-Icon--MessageFill]=\"unreadCount > 0\"\r\n [class.text-sky-400]=\"unreadCount > 0\"\r\n [class.animate-notification]=\"newArrival\"\r\n [class.ms-Icon--Message]=\"unreadCount === 0\">\r\n </i>\r\n </span>\r\n <span\r\n *ngIf=\"unreadCount > 0\"\r\n [class.animate-pulse]=\"newArrival\"\r\n class=\"absolute top-0 right-0 inline-flex items-center justify-center -mt-1 ml-1 text-xs leading-none text-gray-100 ordinal\">\r\n {{ unreadCount }}\r\n </span>\r\n </span>\r\n </button>\r\n\r\n <!-- Notifications dropdown -->\r\n <div *ngIf=\"menuExpanded\" class=\"header-notifications-dropdown-with-username\" role=\"menu\" aria-orientation=\"vertical\" aria-labelledby=\"messages-menu\">\r\n <div class=\"max-h-64 overflow-y-auto notification-messages min-h\">\r\n <ng-container *ngIf=\"!items; else messagesDropDown\" class=\"py-5\">\r\n <div class=\"notifications-nav-link 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 #messagesDropDown>\r\n <ul class=\"pr-1.5\">\r\n <ng-container *ngIf=\"items; else loading\">\r\n <ng-container *ngIf=\"items.length <= 0\" class=\"py-5\">\r\n <div class=\"notifications-nav-link 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 message of items; let i = index\">\r\n <li class=\"mb-2\" [ngClass]=\"{ 'border-l-2 border-blue-500 bg-blue-50 hover:bg-blue-50': !message.data.isRead }\">\r\n <div class=\"flex justify-between\">\r\n <div class=\"flex-grow\">\r\n <a\r\n [routerLink]=\"message.path\"\r\n (click)=\"removeItem(i)\"\r\n class=\"notifications-nav-link grid\"\r\n [ngClass]=\"!message.data.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 {{ message.data.creationDate | date: \"EEE, d MMMM\" }}\r\n </div>\r\n <div class=\"font-bold\">\r\n {{ message.data.text }}\r\n </div>\r\n </div>\r\n </a>\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!.path\" (click)=\"onClickOutside($event)\">\r\n <button type=\"button\" class=\"header-notifications-dropdown-view-all-button\">{{allNotificationsLink!.text}}</button>\r\n </a>\r\n </div>\r\n </div>\r\n</div>\r\n" }]
3205
+ args: [{ selector: 'lib-notifications-indicator', template: "<div class=\"relative\"\r\n(clickOutside)=\"onClickOutside($event)\">\r\n <!-- Notifications Button -->\r\n <button type=\"button\"\r\n (click)=\"doInboxAction()\"\r\n aria-expanded=\"false\"\r\n aria-haspopup=\"true\">\r\n <span class=\"sr-only\">View notifications</span>\r\n <span class=\"avatar-container\">\r\n <span class=\"avatar-text\">\r\n <i class=\"ms-Icon hover:text-blue-400\"\r\n [class.ms-Icon--MessageFill]=\"unreadCount > 0\"\r\n [class.text-sky-400]=\"unreadCount > 0\"\r\n [class.animate-notification]=\"newArrival\"\r\n [class.ms-Icon--Message]=\"unreadCount === 0\">\r\n </i>\r\n </span>\r\n <span\r\n *ngIf=\"unreadCount > 0\"\r\n [class.animate-pulse]=\"newArrival\"\r\n class=\"absolute top-0 right-0 inline-flex items-center justify-center -mt-1 ml-1 text-xs leading-none text-gray-100 ordinal\">\r\n {{ unreadCount }}\r\n </span>\r\n </span>\r\n </button>\r\n\r\n <!-- Notifications dropdown -->\r\n <div tabindex=\"1\" *ngIf=\"menuExpanded\" class=\"header-notifications-dropdown-with-username\" role=\"menu\" aria-orientation=\"vertical\" aria-labelledby=\"messages-menu\">\r\n <div class=\"max-h-64 overflow-y-auto notification-messages min-h\">\r\n <ng-container *ngIf=\"!items; else messagesDropDown\" class=\"py-5\">\r\n <div class=\"notifications-nav-link 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 #messagesDropDown>\r\n <ul class=\"pr-1.5\">\r\n <ng-container *ngIf=\"items; else loading\">\r\n <ng-container *ngIf=\"items.length <= 0\" class=\"py-5\">\r\n <div class=\"notifications-nav-link 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 message of items; let i = index\">\r\n <li class=\"mb-2\" [ngClass]=\"{ 'border-l-2 border-blue-500 bg-blue-50 hover:bg-blue-50': !message.data.isRead }\">\r\n <div class=\"flex justify-between\">\r\n <div class=\"flex-grow\">\r\n <a\r\n [routerLink]=\"message.path\"\r\n (click)=\"removeItem(i)\"\r\n class=\"notifications-nav-link grid\"\r\n [ngClass]=\"!message.data.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 {{ message.data.creationDate | date: \"EEE, d MMMM\" }}\r\n </div>\r\n <div class=\"font-bold\">\r\n {{ message.data.text }}\r\n </div>\r\n </div>\r\n </a>\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-lg\">\r\n <a [routerLink]=\"allNotificationsLink!.path\" (click)=\"onClickOutside($event)\">\r\n <button type=\"button\" class=\"header-notifications-dropdown-view-all-button\">{{allNotificationsLink!.text}}</button>\r\n </a>\r\n </div>\r\n </div>\r\n</div>\r\n" }]
3195
3206
  }], ctorParameters: () => [{ type: undefined, decorators: [{
3196
3207
  type: Inject,
3197
3208
  args: [APP_NOTIFICATIONS]
@@ -3242,11 +3253,11 @@ class UserProfileMenuComponent {
3242
3253
  this.userMenuExpanded = false;
3243
3254
  }
3244
3255
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.6", ngImport: i0, type: UserProfileMenuComponent, deps: [{ token: AuthService }, { token: Router }, { token: APP_LINKS }], target: i0.ɵɵFactoryTarget.Component }); }
3245
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.6", type: UserProfileMenuComponent, selector: "lib-user-profile-menu", inputs: { showUserName: ["show-user-name", "showUserName"] }, ngImport: i0, template: "<div class=\"relative\" (clickOutside)=\"onClickOutside($event)\">\r\n\r\n <div class=\"inline-flex\">\r\n <!-- Username -->\r\n <div [ngClass]=\"{'shell-header-profile': showUserName}\">\r\n <div *ngIf=\"user && showUserName\" class=\"shell-header-profile-userName\">\r\n {{ user.profile.name }}\r\n </div>\r\n </div>\r\n\r\n <div [class.ml-2]=\"showUserName\">\r\n <button type=\"button\" \r\n *ngIf=\"user\"\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 (click)=\"userMenuExpanded = !userMenuExpanded\">\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($event)\"\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 </div>\r\n </div>\r\n\r\n <div [class]=\"userMenuExpanded ?\r\n 'transition ease-out duration-200 origin-top-right z-30 absolute right-0 mt-2 w-56 rounded-sm shadow-lg bg-white ring-1 ring-black ring-opacity-5 focus:outline-none'\r\n :\r\n 'hidden transition ease-in duration-75 origin-top-right z-30 right-0 mt-2 w-56 rounded-sm shadow-lg bg-white ring-1 ring-black ring-opacity-5 focus:outline-none'\"\r\n role=\"menu\" aria-orientation=\"vertical\" aria-labelledby=\"menu-button\" tabindex=\"-1\">\r\n <lib-nav-links-list\r\n [links]=\"links.profile\"\r\n [link-class]=\"'nav-link-profile'\"\r\n [link-active-class]=\"'nav-link-profile-active'\">\r\n </lib-nav-links-list>\r\n </div>\r\n\r\n</div>\r\n\r\n", dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: ClickOutsideDirective, selector: "[clickOutside]", inputs: ["clickOutsideEnabled", "attachOutsideOnClick", "delayClickOutsideInit", "emitOnBlur", "exclude", "excludeBeforeClick", "clickOutsideEvents"], outputs: ["clickOutside"] }, { kind: "component", type: NavLinksListComponent, selector: "lib-nav-links-list", inputs: ["links", "active-fragment", "link-class", "link-active-class", "container-class", "show-icons", "show-text", "large-icons"] }] }); }
3256
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.6", type: UserProfileMenuComponent, selector: "lib-user-profile-menu", inputs: { showUserName: ["show-user-name", "showUserName"] }, ngImport: i0, template: "<div class=\"relative\" (clickOutside)=\"onClickOutside($event)\">\r\n\r\n <div class=\"inline-flex\">\r\n <!-- Username -->\r\n <div [ngClass]=\"{'shell-header-profile': showUserName}\">\r\n <div *ngIf=\"user && showUserName\" class=\"shell-header-profile-userName\">\r\n {{ user.profile.name }}\r\n </div>\r\n </div>\r\n\r\n <div [class.ml-2]=\"showUserName\">\r\n <button type=\"button\" \r\n *ngIf=\"user\"\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 (click)=\"userMenuExpanded = !userMenuExpanded\">\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($event)\"\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 </div>\r\n </div>\r\n\r\n <div [class]=\"userMenuExpanded ?\r\n 'transition ease-out duration-200 origin-top-right z-30 absolute right-0 mt-2 w-56 rounded-lg shadow-lg bg-white ring-1 ring-black ring-opacity-5 focus:outline-none'\r\n :\r\n 'hidden transition ease-in duration-75 origin-top-right z-30 right-0 mt-2 w-56 rounded-lg shadow-lg bg-white ring-1 ring-black ring-opacity-5 focus:outline-none'\"\r\n role=\"menu\" aria-orientation=\"vertical\" aria-labelledby=\"menu-button\" tabindex=\"-1\">\r\n <lib-nav-links-list\r\n (click)=\"onClickOutside($event)\"\r\n [links]=\"links.profile\"\r\n [link-class]=\"'nav-link-profile'\"\r\n [link-active-class]=\"'nav-link-profile-active'\">\r\n </lib-nav-links-list>\r\n </div>\r\n\r\n</div>\r\n\r\n", dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: ClickOutsideDirective, selector: "[clickOutside]", inputs: ["clickOutsideEnabled", "attachOutsideOnClick", "delayClickOutsideInit", "emitOnBlur", "exclude", "excludeBeforeClick", "clickOutsideEvents"], outputs: ["clickOutside"] }, { kind: "component", type: NavLinksListComponent, selector: "lib-nav-links-list", inputs: ["links", "active-fragment", "link-class", "link-active-class", "container-class", "show-icons", "show-text", "large-icons"] }] }); }
3246
3257
  }
3247
3258
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.6", ngImport: i0, type: UserProfileMenuComponent, decorators: [{
3248
3259
  type: Component,
3249
- args: [{ selector: 'lib-user-profile-menu', template: "<div class=\"relative\" (clickOutside)=\"onClickOutside($event)\">\r\n\r\n <div class=\"inline-flex\">\r\n <!-- Username -->\r\n <div [ngClass]=\"{'shell-header-profile': showUserName}\">\r\n <div *ngIf=\"user && showUserName\" class=\"shell-header-profile-userName\">\r\n {{ user.profile.name }}\r\n </div>\r\n </div>\r\n\r\n <div [class.ml-2]=\"showUserName\">\r\n <button type=\"button\" \r\n *ngIf=\"user\"\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 (click)=\"userMenuExpanded = !userMenuExpanded\">\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($event)\"\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 </div>\r\n </div>\r\n\r\n <div [class]=\"userMenuExpanded ?\r\n 'transition ease-out duration-200 origin-top-right z-30 absolute right-0 mt-2 w-56 rounded-sm shadow-lg bg-white ring-1 ring-black ring-opacity-5 focus:outline-none'\r\n :\r\n 'hidden transition ease-in duration-75 origin-top-right z-30 right-0 mt-2 w-56 rounded-sm shadow-lg bg-white ring-1 ring-black ring-opacity-5 focus:outline-none'\"\r\n role=\"menu\" aria-orientation=\"vertical\" aria-labelledby=\"menu-button\" tabindex=\"-1\">\r\n <lib-nav-links-list\r\n [links]=\"links.profile\"\r\n [link-class]=\"'nav-link-profile'\"\r\n [link-active-class]=\"'nav-link-profile-active'\">\r\n </lib-nav-links-list>\r\n </div>\r\n\r\n</div>\r\n\r\n" }]
3260
+ args: [{ selector: 'lib-user-profile-menu', template: "<div class=\"relative\" (clickOutside)=\"onClickOutside($event)\">\r\n\r\n <div class=\"inline-flex\">\r\n <!-- Username -->\r\n <div [ngClass]=\"{'shell-header-profile': showUserName}\">\r\n <div *ngIf=\"user && showUserName\" class=\"shell-header-profile-userName\">\r\n {{ user.profile.name }}\r\n </div>\r\n </div>\r\n\r\n <div [class.ml-2]=\"showUserName\">\r\n <button type=\"button\" \r\n *ngIf=\"user\"\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 (click)=\"userMenuExpanded = !userMenuExpanded\">\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($event)\"\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 </div>\r\n </div>\r\n\r\n <div [class]=\"userMenuExpanded ?\r\n 'transition ease-out duration-200 origin-top-right z-30 absolute right-0 mt-2 w-56 rounded-lg shadow-lg bg-white ring-1 ring-black ring-opacity-5 focus:outline-none'\r\n :\r\n 'hidden transition ease-in duration-75 origin-top-right z-30 right-0 mt-2 w-56 rounded-lg shadow-lg bg-white ring-1 ring-black ring-opacity-5 focus:outline-none'\"\r\n role=\"menu\" aria-orientation=\"vertical\" aria-labelledby=\"menu-button\" tabindex=\"-1\">\r\n <lib-nav-links-list\r\n (click)=\"onClickOutside($event)\"\r\n [links]=\"links.profile\"\r\n [link-class]=\"'nav-link-profile'\"\r\n [link-active-class]=\"'nav-link-profile-active'\">\r\n </lib-nav-links-list>\r\n </div>\r\n\r\n</div>\r\n\r\n" }]
3250
3261
  }], ctorParameters: () => [{ type: i2$1.AuthService, decorators: [{
3251
3262
  type: Inject,
3252
3263
  args: [AuthService]
@@ -3279,6 +3290,7 @@ class ShellHeaderComponent {
3279
3290
  // tslint:disable-next-line:no-input-rename
3280
3291
  this.showLangs = false;
3281
3292
  this.border = true;
3293
+ this.busy = false;
3282
3294
  this.sectionLinks = of([]);
3283
3295
  this.mobileMenuExpanded = false;
3284
3296
  this.userMenuExpanded = false;
@@ -3337,11 +3349,11 @@ class ShellHeaderComponent {
3337
3349
  }
3338
3350
  }
3339
3351
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.6", ngImport: i0, type: ShellHeaderComponent, deps: [{ token: AuthService }, { token: Router }, { token: ActivatedRoute }, { token: SHELL_CONFIG }, { token: APP_LINKS }], target: i0.ɵɵFactoryTarget.Component }); }
3340
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.6", type: ShellHeaderComponent, selector: "lib-shell-header", inputs: { sectionLinksPath: ["section-links", "sectionLinksPath"], profileMenuVisible: ["profile-menu", "profileMenuVisible"], showUserNameOnHeader: ["show-userName", "showUserNameOnHeader"], showAlerts: ["show-alerts", "showAlerts"], showLangs: ["show-langs", "showLangs"], border: "border" }, ngImport: i0, template: "<nav>\r\n <div class=\"shell-header-paddings\">\r\n <div class=\"shell-header-border\">\r\n <div class=\"shell-header-menu-container\">\r\n <div class=\"shell-header-logo-container\">\r\n <div>\r\n <a href=\"#\" [routerLink]=\"['/']\"><img alt=\"app logo\" 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 <div class=\"shell-header-link-container-inner\">\r\n <lib-nav-links-list\r\n [links]=\"sectionLinks\"\r\n [active-fragment]=\"activeFragment\"\r\n [link-class]=\"'nav-link'\"\r\n [link-active-class]=\"'nav-link-active'\">\r\n </lib-nav-links-list>\r\n </div>\r\n </div>\r\n\r\n <div class=\"shell-header-md-visible\">\r\n\r\n <div class=\"shell-header-links-far-container\" (clickOutside)=\"onClickOutside($event)\">\r\n\r\n <lib-nav-links-list\r\n [links]=\"links.profileActions\"\r\n [active-fragment]=\"activeFragment\"\r\n [link-class]=\"'shell-header-menu-rounded-button'\"\r\n [link-active-class]=\"'shell-header-menu-rounded-button-active'\">\r\n </lib-nav-links-list>\r\n\r\n\r\n <!-- Profile dropdown -->\r\n <div *ngIf=\"profileMenuVisible\" class=\"ml-4\">\r\n <lib-user-profile-menu [show-user-name]=\"showUserNameOnHeader\"></lib-user-profile-menu>\r\n </div>\r\n\r\n <!-- Notifications dropdown -->\r\n <div *ngIf=\"showAlerts && user\" class=\"ml-4\">\r\n <lib-notifications-indicator></lib-notifications-indicator>\r\n </div>\r\n\r\n <!-- languages dropdown -->\r\n <div *ngIf=\"showLangs\" class=\"ml-4\">\r\n <lib-language-selection></lib-language-selection>\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 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 [class]=\"mobileMenuExpanded ? 'hidden':'block h-6 w-6'\">\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 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 [class]=\"mobileMenuExpanded ? 'block h-6 w-6':'hidden'\">\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 </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 <lib-nav-links-list\r\n [links]=\"sectionLinks\"\r\n [active-fragment]=\"activeFragment\"\r\n [link-class]=\"'nav-link-mobile'\"\r\n [link-active-class]=\"'nav-link-mobile-active'\"\r\n [container-class]=\"'mobile-menu-link-container'\">\r\n </lib-nav-links-list>\r\n\r\n <div *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 </div>\r\n\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 <!--\r\n <button class=\"mobile-menu-rounded-button\">\r\n <span class=\"sr-only\">View notifications</span>\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>\r\n </div>\r\n\r\n <lib-nav-links-list\r\n [links]=\"links.profile\"\r\n [active-fragment]=\"activeFragment\"\r\n [link-class]=\"'nav-link-mobile'\"\r\n [link-active-class]=\"'nav-link-mobile-active'\"\r\n [container-class]=\"'mobile-menu-link-container'\">\r\n </lib-nav-links-list>\r\n </div>\r\n</nav>\r\n", dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$1.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "directive", type: ClickOutsideDirective, selector: "[clickOutside]", inputs: ["clickOutsideEnabled", "attachOutsideOnClick", "delayClickOutsideInit", "emitOnBlur", "exclude", "excludeBeforeClick", "clickOutsideEvents"], outputs: ["clickOutside"] }, { kind: "component", type: LanguageSelectionComponent, selector: "lib-language-selection" }, { kind: "component", type: NavLinksListComponent, selector: "lib-nav-links-list", inputs: ["links", "active-fragment", "link-class", "link-active-class", "container-class", "show-icons", "show-text", "large-icons"] }, { kind: "component", type: NotificationsIndicatorComponent, selector: "lib-notifications-indicator" }, { kind: "component", type: UserProfileMenuComponent, selector: "lib-user-profile-menu", inputs: ["show-user-name"] }] }); }
3352
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.6", type: ShellHeaderComponent, selector: "lib-shell-header", inputs: { sectionLinksPath: ["section-links", "sectionLinksPath"], profileMenuVisible: ["profile-menu", "profileMenuVisible"], showUserNameOnHeader: ["show-userName", "showUserNameOnHeader"], showAlerts: ["show-alerts", "showAlerts"], showLangs: ["show-langs", "showLangs"], border: "border", busy: "busy" }, ngImport: i0, template: "<nav>\r\n <div class=\"shell-header-paddings\">\r\n <div class=\"shell-header-border\">\r\n <div class=\"shell-header-menu-container\" [class.busy]=\"busy\">\r\n <div class=\"shell-header-logo-container\">\r\n <div>\r\n <a href=\"#\" [routerLink]=\"['/']\"><img alt=\"app logo\" 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 <div class=\"shell-header-link-container-inner\">\r\n <lib-nav-links-list\r\n [links]=\"sectionLinks\"\r\n [active-fragment]=\"activeFragment\"\r\n [link-class]=\"'nav-link'\"\r\n [link-active-class]=\"'nav-link-active'\">\r\n </lib-nav-links-list>\r\n </div>\r\n </div>\r\n\r\n <div class=\"shell-header-md-visible\">\r\n\r\n <div class=\"shell-header-links-far-container\" (clickOutside)=\"onClickOutside($event)\">\r\n\r\n <lib-nav-links-list\r\n [links]=\"links.profileActions\"\r\n [active-fragment]=\"activeFragment\"\r\n [link-class]=\"'shell-header-menu-rounded-button'\"\r\n [link-active-class]=\"'shell-header-menu-rounded-button-active'\">\r\n </lib-nav-links-list>\r\n\r\n\r\n <!-- Profile dropdown -->\r\n <div *ngIf=\"profileMenuVisible\" class=\"ml-4\">\r\n <lib-user-profile-menu [show-user-name]=\"showUserNameOnHeader\"></lib-user-profile-menu>\r\n </div>\r\n\r\n <!-- Notifications dropdown -->\r\n <div *ngIf=\"showAlerts && user\" class=\"ml-4\">\r\n <lib-notifications-indicator></lib-notifications-indicator>\r\n </div>\r\n\r\n <!-- languages dropdown -->\r\n <div *ngIf=\"showLangs\" class=\"ml-4\">\r\n <lib-language-selection></lib-language-selection>\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 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 [class]=\"mobileMenuExpanded ? 'hidden':'block h-6 w-6'\">\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 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 [class]=\"mobileMenuExpanded ? 'block h-6 w-6':'hidden'\">\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 </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 <lib-nav-links-list\r\n [links]=\"sectionLinks\"\r\n [active-fragment]=\"activeFragment\"\r\n [link-class]=\"'nav-link-mobile'\"\r\n [link-active-class]=\"'nav-link-mobile-active'\"\r\n [container-class]=\"'mobile-menu-link-container'\">\r\n </lib-nav-links-list>\r\n\r\n <div *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 </div>\r\n\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 <!--\r\n <button class=\"mobile-menu-rounded-button\">\r\n <span class=\"sr-only\">View notifications</span>\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>\r\n </div>\r\n\r\n <lib-nav-links-list\r\n [links]=\"links.profile\"\r\n [active-fragment]=\"activeFragment\"\r\n [link-class]=\"'nav-link-mobile'\"\r\n [link-active-class]=\"'nav-link-mobile-active'\"\r\n [container-class]=\"'mobile-menu-link-container'\">\r\n </lib-nav-links-list>\r\n </div>\r\n</nav>\r\n", dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$1.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "directive", type: ClickOutsideDirective, selector: "[clickOutside]", inputs: ["clickOutsideEnabled", "attachOutsideOnClick", "delayClickOutsideInit", "emitOnBlur", "exclude", "excludeBeforeClick", "clickOutsideEvents"], outputs: ["clickOutside"] }, { kind: "component", type: LanguageSelectionComponent, selector: "lib-language-selection" }, { kind: "component", type: NavLinksListComponent, selector: "lib-nav-links-list", inputs: ["links", "active-fragment", "link-class", "link-active-class", "container-class", "show-icons", "show-text", "large-icons"] }, { kind: "component", type: NotificationsIndicatorComponent, selector: "lib-notifications-indicator" }, { kind: "component", type: UserProfileMenuComponent, selector: "lib-user-profile-menu", inputs: ["show-user-name"] }] }); }
3341
3353
  }
3342
3354
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.6", ngImport: i0, type: ShellHeaderComponent, decorators: [{
3343
3355
  type: Component,
3344
- args: [{ selector: 'lib-shell-header', template: "<nav>\r\n <div class=\"shell-header-paddings\">\r\n <div class=\"shell-header-border\">\r\n <div class=\"shell-header-menu-container\">\r\n <div class=\"shell-header-logo-container\">\r\n <div>\r\n <a href=\"#\" [routerLink]=\"['/']\"><img alt=\"app logo\" 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 <div class=\"shell-header-link-container-inner\">\r\n <lib-nav-links-list\r\n [links]=\"sectionLinks\"\r\n [active-fragment]=\"activeFragment\"\r\n [link-class]=\"'nav-link'\"\r\n [link-active-class]=\"'nav-link-active'\">\r\n </lib-nav-links-list>\r\n </div>\r\n </div>\r\n\r\n <div class=\"shell-header-md-visible\">\r\n\r\n <div class=\"shell-header-links-far-container\" (clickOutside)=\"onClickOutside($event)\">\r\n\r\n <lib-nav-links-list\r\n [links]=\"links.profileActions\"\r\n [active-fragment]=\"activeFragment\"\r\n [link-class]=\"'shell-header-menu-rounded-button'\"\r\n [link-active-class]=\"'shell-header-menu-rounded-button-active'\">\r\n </lib-nav-links-list>\r\n\r\n\r\n <!-- Profile dropdown -->\r\n <div *ngIf=\"profileMenuVisible\" class=\"ml-4\">\r\n <lib-user-profile-menu [show-user-name]=\"showUserNameOnHeader\"></lib-user-profile-menu>\r\n </div>\r\n\r\n <!-- Notifications dropdown -->\r\n <div *ngIf=\"showAlerts && user\" class=\"ml-4\">\r\n <lib-notifications-indicator></lib-notifications-indicator>\r\n </div>\r\n\r\n <!-- languages dropdown -->\r\n <div *ngIf=\"showLangs\" class=\"ml-4\">\r\n <lib-language-selection></lib-language-selection>\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 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 [class]=\"mobileMenuExpanded ? 'hidden':'block h-6 w-6'\">\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 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 [class]=\"mobileMenuExpanded ? 'block h-6 w-6':'hidden'\">\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 </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 <lib-nav-links-list\r\n [links]=\"sectionLinks\"\r\n [active-fragment]=\"activeFragment\"\r\n [link-class]=\"'nav-link-mobile'\"\r\n [link-active-class]=\"'nav-link-mobile-active'\"\r\n [container-class]=\"'mobile-menu-link-container'\">\r\n </lib-nav-links-list>\r\n\r\n <div *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 </div>\r\n\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 <!--\r\n <button class=\"mobile-menu-rounded-button\">\r\n <span class=\"sr-only\">View notifications</span>\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>\r\n </div>\r\n\r\n <lib-nav-links-list\r\n [links]=\"links.profile\"\r\n [active-fragment]=\"activeFragment\"\r\n [link-class]=\"'nav-link-mobile'\"\r\n [link-active-class]=\"'nav-link-mobile-active'\"\r\n [container-class]=\"'mobile-menu-link-container'\">\r\n </lib-nav-links-list>\r\n </div>\r\n</nav>\r\n" }]
3356
+ args: [{ selector: 'lib-shell-header', template: "<nav>\r\n <div class=\"shell-header-paddings\">\r\n <div class=\"shell-header-border\">\r\n <div class=\"shell-header-menu-container\" [class.busy]=\"busy\">\r\n <div class=\"shell-header-logo-container\">\r\n <div>\r\n <a href=\"#\" [routerLink]=\"['/']\"><img alt=\"app logo\" 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 <div class=\"shell-header-link-container-inner\">\r\n <lib-nav-links-list\r\n [links]=\"sectionLinks\"\r\n [active-fragment]=\"activeFragment\"\r\n [link-class]=\"'nav-link'\"\r\n [link-active-class]=\"'nav-link-active'\">\r\n </lib-nav-links-list>\r\n </div>\r\n </div>\r\n\r\n <div class=\"shell-header-md-visible\">\r\n\r\n <div class=\"shell-header-links-far-container\" (clickOutside)=\"onClickOutside($event)\">\r\n\r\n <lib-nav-links-list\r\n [links]=\"links.profileActions\"\r\n [active-fragment]=\"activeFragment\"\r\n [link-class]=\"'shell-header-menu-rounded-button'\"\r\n [link-active-class]=\"'shell-header-menu-rounded-button-active'\">\r\n </lib-nav-links-list>\r\n\r\n\r\n <!-- Profile dropdown -->\r\n <div *ngIf=\"profileMenuVisible\" class=\"ml-4\">\r\n <lib-user-profile-menu [show-user-name]=\"showUserNameOnHeader\"></lib-user-profile-menu>\r\n </div>\r\n\r\n <!-- Notifications dropdown -->\r\n <div *ngIf=\"showAlerts && user\" class=\"ml-4\">\r\n <lib-notifications-indicator></lib-notifications-indicator>\r\n </div>\r\n\r\n <!-- languages dropdown -->\r\n <div *ngIf=\"showLangs\" class=\"ml-4\">\r\n <lib-language-selection></lib-language-selection>\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 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 [class]=\"mobileMenuExpanded ? 'hidden':'block h-6 w-6'\">\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 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 [class]=\"mobileMenuExpanded ? 'block h-6 w-6':'hidden'\">\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 </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 <lib-nav-links-list\r\n [links]=\"sectionLinks\"\r\n [active-fragment]=\"activeFragment\"\r\n [link-class]=\"'nav-link-mobile'\"\r\n [link-active-class]=\"'nav-link-mobile-active'\"\r\n [container-class]=\"'mobile-menu-link-container'\">\r\n </lib-nav-links-list>\r\n\r\n <div *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 </div>\r\n\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 <!--\r\n <button class=\"mobile-menu-rounded-button\">\r\n <span class=\"sr-only\">View notifications</span>\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>\r\n </div>\r\n\r\n <lib-nav-links-list\r\n [links]=\"links.profile\"\r\n [active-fragment]=\"activeFragment\"\r\n [link-class]=\"'nav-link-mobile'\"\r\n [link-active-class]=\"'nav-link-mobile-active'\"\r\n [container-class]=\"'mobile-menu-link-container'\">\r\n </lib-nav-links-list>\r\n </div>\r\n</nav>\r\n" }]
3345
3357
  }], ctorParameters: () => [{ type: i2$1.AuthService, decorators: [{
3346
3358
  type: Inject,
3347
3359
  args: [AuthService]
@@ -3374,6 +3386,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.6", ngImpor
3374
3386
  args: ['show-langs']
3375
3387
  }], border: [{
3376
3388
  type: Input
3389
+ }], busy: [{
3390
+ type: Input
3377
3391
  }] } });
3378
3392
 
3379
3393
  class ShellSidebarHeaderComponent extends ShellHeaderComponent {
@@ -3411,6 +3425,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.6", ngImpor
3411
3425
  class ShellSidebarLayoutComponent {
3412
3426
  constructor(_userSettings) {
3413
3427
  this._userSettings = _userSettings;
3428
+ this.busy = false;
3414
3429
  this.showMobileSidebar = this._userSettings.get('MobileSideBar');
3415
3430
  }
3416
3431
  ngOnInit() { }
@@ -3419,15 +3434,17 @@ class ShellSidebarLayoutComponent {
3419
3434
  this._userSettings.set('MobileSideBar', this.showMobileSidebar);
3420
3435
  }
3421
3436
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.6", ngImport: i0, type: ShellSidebarLayoutComponent, deps: [{ token: UserSettingsService }], target: i0.ɵɵFactoryTarget.Component }); }
3422
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.6", type: ShellSidebarLayoutComponent, selector: "lib-shell-sidebar-layout", inputs: { config: "config", sidebarFooterTemplate: "sidebarFooterTemplate" }, ngImport: i0, template: "<div>\r\n <div class=\"sidebar-off-canvas-menu-container\"\r\n role=\"dialog\"\r\n aria-modal=\"true\">\r\n <div class=\"sidebar-off-canvas-menu-backdrop\"\r\n [class.sidebar-off-canvas-menu-backdrop-opacity-100]=\"!showMobileSidebar\">\r\n </div>\r\n <div class=\"sidebar-off-canvas-menu-container-inner\"\r\n [class.sidebar-off-canvas-menu-container-inner-active]=\"!showMobileSidebar\"\r\n [class.sidebar-off-canvas-menu-container-inner-not-active]=\"showMobileSidebar\">\r\n <div class=\"sidebar-off-canvas-layout-container\">\r\n <div class=\"sidebar-off-canvas-toggle-button-container\">\r\n <button type=\"button\"\r\n class=\"sidebar-off-canvas-toggle-button\"\r\n (click)=\"toggleMobileSidebar()\">\r\n <span class=\"sr-only\">Close sidebar</span>\r\n <svg class=\"h-6 w-6 text-white\"\r\n xmlns=\"http://www.w3.org/2000/svg\"\r\n fill=\"none\"\r\n viewBox=\"0 0 24 24\"\r\n stroke-width=\"2\"\r\n stroke=\"currentColor\"\r\n aria-hidden=\"true\">\r\n <path stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"\r\n d=\"M6 18L18 6M6 6l12 12\" />\r\n </svg>\r\n </button>\r\n </div>\r\n <div class=\"sidebar-off-canvas-app-logo-container\">\r\n <img alt=\"image\" class=\"shell-sidebar-logo\"\r\n [src]=\"config?.appLogo\"\r\n [alt]=\"config?.appLogoAlt\">\r\n </div>\r\n <lib-shell-sidebar></lib-shell-sidebar>\r\n </div>\r\n <div class=\"sidebar-dummy-element\"\r\n aria-hidden=\"true\">\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"sidebar-static-menu-outer-container\">\r\n <div class=\"sidebar-static-menu-container\"\r\n [class.sidebar-static-menu-container-active]=\"!showMobileSidebar\"\r\n [class.sidebar-static-menu-container-not-active]=\"showMobileSidebar\">\r\n <div class=\"sidebar-static-menu-container-inner\">\r\n <div class=\"sidebar-static-menu-app-logo-container\">\r\n <img alt=\"image\" *ngIf=\"!showMobileSidebar\"\r\n class=\"shell-sidebar-logo\"\r\n [src]=\"config?.appLogo\"\r\n [alt]=\"config?.appLogoAlt\">\r\n <button *ngIf=\"showMobileSidebar\"\r\n type=\"button\"\r\n class=\"sidebar-static-menu-toggle-button\"\r\n (click)=\"toggleMobileSidebar()\">\r\n <span class=\"sr-only\">Toggle sidebar</span>\r\n <svg class=\"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-width=\"2\"\r\n stroke=\"currentColor\"\r\n aria-hidden=\"true\">\r\n <path stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"\r\n d=\"M4 6h16M4 12h16M4 18h7\" />\r\n </svg>\r\n </button>\r\n </div>\r\n <lib-shell-sidebar [sticky]=\"showMobileSidebar\"></lib-shell-sidebar>\r\n </div>\r\n <div class=\"flex flex-shrink-0 bg-gray-700 p-4\"\r\n *ngIf=\"!showMobileSidebar && sidebarFooterTemplate\">\r\n <div class=\"group block flex-shrink-0\">\r\n <div class=\"flex items-center\">\r\n <div>\r\n <p class=\"text-sm font-medium text-gray-400\">\r\n <ng-container [ngTemplateOutlet]=\"sidebarFooterTemplate\"></ng-container>\r\n </p>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"sidebar-static-menu-wrapper\"\r\n [class.sidebar-static-menu-wrapper-expanded]=\"!showMobileSidebar\">\r\n <div class=\"sidebar-static-menu-sticky-header-container\"\r\n *ngIf=\"config?.showHeader\">\r\n <button *ngIf=\"showMobileSidebar\"\r\n type=\"button\"\r\n class=\"sidebar-static-menu-toggle-button-md\"\r\n (click)=\"toggleMobileSidebar()\">\r\n <span class=\"sr-only\">Toggle sidebar</span>\r\n <svg class=\"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-width=\"2\"\r\n stroke=\"currentColor\"\r\n aria-hidden=\"true\">\r\n <path stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"\r\n d=\"M4 6h16M4 12h16M4 18h7\" />\r\n </svg>\r\n </button>\r\n <button *ngIf=\"!showMobileSidebar\"\r\n type=\"button\"\r\n class=\"sidebar-static-menu-toggle-button\"\r\n (click)=\"toggleMobileSidebar()\">\r\n <span class=\"sr-only\">Toggle sidebar</span>\r\n <svg class=\"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-width=\"2\"\r\n stroke=\"currentColor\"\r\n aria-hidden=\"true\">\r\n <path stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"\r\n d=\"M4 6h16M4 12h16M4 18h7\" />\r\n </svg>\r\n </button>\r\n <div class=\"sidebar-static-menu-header-container\">\r\n <div class=\"sidebar-static-menu-header-near-container\">\r\n <div class=\"sidebar-static-menu-header-app-logo-container\"\r\n *ngIf=\"showMobileSidebar\">\r\n <img alt=\"image\" class=\"shell-sidebar-logo\"\r\n [src]=\"config?.appLogo\"\r\n [alt]=\"config?.appLogoAlt\">\r\n </div>\r\n </div>\r\n <div class=\"sidebar-static-menu-header-far-container\">\r\n <lib-shell-sidebar-header [show-userName]=\"config?.showUserNameOnHeader\"\r\n [show-alerts]=\"config?.showAlertsOnHeader\"\r\n [show-langs]=\"config?.showLangsOnHeader\">\r\n </lib-shell-sidebar-header>\r\n </div>\r\n </div>\r\n </div>\r\n <div flex-1>\r\n <main class=\"shell-content-container-fluid\">\r\n <lib-breadcrumb *ngIf=\"config?.breadcrumb || false\"></lib-breadcrumb>\r\n <div class=\"shell-content-container-inner\">\r\n <router-outlet *ngIf=\"(config && config.layout === 'Sidebar')\"></router-outlet>\r\n </div>\r\n </main>\r\n </div>\r\n </div>\r\n</div>", dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1$1.RouterOutlet, selector: "router-outlet", inputs: ["name"], outputs: ["activate", "deactivate", "attach", "detach"], exportAs: ["outlet"] }, { kind: "component", type: BreadcrumbComponent, selector: "lib-breadcrumb" }, { kind: "component", type: ShellSidebarComponent, selector: "lib-shell-sidebar", inputs: ["section-links", "config", "sticky"] }, { kind: "component", type: ShellSidebarHeaderComponent, selector: "lib-shell-sidebar-header" }] }); }
3437
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.6", type: ShellSidebarLayoutComponent, selector: "lib-shell-sidebar-layout", inputs: { config: "config", sidebarFooterTemplate: "sidebarFooterTemplate", busy: "busy" }, ngImport: i0, template: "<div>\r\n <div class=\"sidebar-off-canvas-menu-container\" role=\"dialog\" aria-modal=\"true\">\r\n <div class=\"sidebar-off-canvas-menu-backdrop\"\r\n [class.sidebar-off-canvas-menu-backdrop-opacity-100]=\"!showMobileSidebar\">\r\n </div>\r\n <div class=\"sidebar-off-canvas-menu-container-inner\"\r\n [class.sidebar-off-canvas-menu-container-inner-active]=\"!showMobileSidebar\"\r\n [class.sidebar-off-canvas-menu-container-inner-not-active]=\"showMobileSidebar\">\r\n <div class=\"sidebar-off-canvas-layout-container\">\r\n <div class=\"sidebar-off-canvas-toggle-button-container\">\r\n <button type=\"button\" class=\"sidebar-off-canvas-toggle-button\" (click)=\"toggleMobileSidebar()\">\r\n <span class=\"sr-only\">Close sidebar</span>\r\n <svg class=\"h-6 w-6 text-white\" xmlns=\"http://www.w3.org/2000/svg\" fill=\"none\" viewBox=\"0 0 24 24\" stroke-width=\"2\" stroke=\"currentColor\" aria-hidden=\"true\">\r\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M6 18L18 6M6 6l12 12\" />\r\n </svg>\r\n </button>\r\n </div>\r\n <div class=\"sidebar-off-canvas-app-logo-container\">\r\n <img alt=\"image\" class=\"shell-sidebar-logo\"\r\n [src]=\"config?.appLogo\"\r\n [alt]=\"config?.appLogoAlt\">\r\n </div>\r\n <lib-shell-sidebar></lib-shell-sidebar>\r\n </div>\r\n <div class=\"sidebar-dummy-element\" aria-hidden=\"true\"></div>\r\n </div>\r\n </div>\r\n <div class=\"sidebar-static-menu-outer-container\">\r\n <div class=\"sidebar-static-menu-container\"\r\n [class.sidebar-static-menu-container-active]=\"!showMobileSidebar\"\r\n [class.sidebar-static-menu-container-not-active]=\"showMobileSidebar\">\r\n <div class=\"sidebar-static-menu-container-inner\">\r\n <div class=\"sidebar-static-menu-app-logo-container\">\r\n <img alt=\"image\" *ngIf=\"!showMobileSidebar\" class=\"shell-sidebar-logo\" [src]=\"config?.appLogo\" [alt]=\"config?.appLogoAlt\">\r\n <button *ngIf=\"showMobileSidebar\" type=\"button\" class=\"sidebar-static-menu-toggle-button\" (click)=\"toggleMobileSidebar()\">\r\n <span class=\"sr-only\">Toggle sidebar</span>\r\n <svg class=\"h-6 w-6\" xmlns=\"http://www.w3.org/2000/svg\" fill=\"none\" viewBox=\"0 0 24 24\" stroke-width=\"2\" stroke=\"currentColor\" aria-hidden=\"true\">\r\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M4 6h16M4 12h16M4 18h7\" />\r\n </svg>\r\n </button>\r\n </div>\r\n <lib-shell-sidebar [sticky]=\"showMobileSidebar\"></lib-shell-sidebar>\r\n </div>\r\n <div class=\"flex flex-shrink-0 bg-gray-700 p-4\" *ngIf=\"!showMobileSidebar && sidebarFooterTemplate\">\r\n <div class=\"group block flex-shrink-0\">\r\n <div class=\"flex items-center\">\r\n <div>\r\n <p class=\"text-sm font-medium text-gray-400\">\r\n <ng-container [ngTemplateOutlet]=\"sidebarFooterTemplate\"></ng-container>\r\n </p>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"sidebar-static-menu-wrapper\" [class.sidebar-static-menu-wrapper-expanded]=\"!showMobileSidebar\">\r\n <div class=\"sidebar-static-menu-sticky-header-container\" [class.busy]=\"busy\" *ngIf=\"config?.showHeader\">\r\n <button *ngIf=\"showMobileSidebar\" type=\"button\" class=\"sidebar-static-menu-toggle-button-md\" (click)=\"toggleMobileSidebar()\">\r\n <span class=\"sr-only\">Toggle sidebar</span>\r\n <svg class=\"h-6 w-6\" xmlns=\"http://www.w3.org/2000/svg\" fill=\"none\" viewBox=\"0 0 24 24\" stroke-width=\"2\" stroke=\"currentColor\" aria-hidden=\"true\">\r\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M4 6h16M4 12h16M4 18h7\" />\r\n </svg>\r\n </button>\r\n <button *ngIf=\"!showMobileSidebar\" type=\"button\" class=\"sidebar-static-menu-toggle-button\" (click)=\"toggleMobileSidebar()\">\r\n <span class=\"sr-only\">Toggle sidebar</span>\r\n <svg class=\"h-6 w-6\" xmlns=\"http://www.w3.org/2000/svg\" fill=\"none\" viewBox=\"0 0 24 24\" stroke-width=\"2\" stroke=\"currentColor\" aria-hidden=\"true\">\r\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M4 6h16M4 12h16M4 18h7\" />\r\n </svg>\r\n </button>\r\n <div class=\"sidebar-static-menu-header-container\" [class.busy]=\"busy\">\r\n <div class=\"sidebar-static-menu-header-near-container\" [class.busy]=\"busy\">\r\n <div class=\"sidebar-static-menu-header-app-logo-container\" *ngIf=\"showMobileSidebar\">\r\n <img alt=\"image\" class=\"shell-sidebar-logo\" [src]=\"config?.appLogo\" [alt]=\"config?.appLogoAlt\">\r\n </div>\r\n </div>\r\n <div class=\"sidebar-static-menu-header-between-container\" [class.busy]=\"busy\"></div>\r\n <div class=\"sidebar-static-menu-header-far-container\" [class.busy]=\"busy\">\r\n <lib-shell-sidebar-header [show-userName]=\"config?.showUserNameOnHeader\"\r\n [show-alerts]=\"config?.showAlertsOnHeader\"\r\n [show-langs]=\"config?.showLangsOnHeader\"\r\n [busy]=\"busy\">\r\n </lib-shell-sidebar-header>\r\n </div>\r\n </div>\r\n </div>\r\n <div flex-1>\r\n <main class=\"shell-content-container-fluid\" [class.busy]=\"busy\">\r\n <lib-breadcrumb *ngIf=\"config?.breadcrumb || false\"></lib-breadcrumb>\r\n <div class=\"shell-content-container-inner\" [class.busy]=\"busy\">\r\n <router-outlet *ngIf=\"(config && config.layout === 'Sidebar')\"></router-outlet>\r\n </div>\r\n </main>\r\n </div>\r\n </div>\r\n</div>", dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1$1.RouterOutlet, selector: "router-outlet", inputs: ["name"], outputs: ["activate", "deactivate", "attach", "detach"], exportAs: ["outlet"] }, { kind: "component", type: BreadcrumbComponent, selector: "lib-breadcrumb" }, { kind: "component", type: ShellSidebarComponent, selector: "lib-shell-sidebar", inputs: ["section-links", "config", "sticky"] }, { kind: "component", type: ShellSidebarHeaderComponent, selector: "lib-shell-sidebar-header" }] }); }
3423
3438
  }
3424
3439
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.6", ngImport: i0, type: ShellSidebarLayoutComponent, decorators: [{
3425
3440
  type: Component,
3426
- args: [{ selector: 'lib-shell-sidebar-layout', template: "<div>\r\n <div class=\"sidebar-off-canvas-menu-container\"\r\n role=\"dialog\"\r\n aria-modal=\"true\">\r\n <div class=\"sidebar-off-canvas-menu-backdrop\"\r\n [class.sidebar-off-canvas-menu-backdrop-opacity-100]=\"!showMobileSidebar\">\r\n </div>\r\n <div class=\"sidebar-off-canvas-menu-container-inner\"\r\n [class.sidebar-off-canvas-menu-container-inner-active]=\"!showMobileSidebar\"\r\n [class.sidebar-off-canvas-menu-container-inner-not-active]=\"showMobileSidebar\">\r\n <div class=\"sidebar-off-canvas-layout-container\">\r\n <div class=\"sidebar-off-canvas-toggle-button-container\">\r\n <button type=\"button\"\r\n class=\"sidebar-off-canvas-toggle-button\"\r\n (click)=\"toggleMobileSidebar()\">\r\n <span class=\"sr-only\">Close sidebar</span>\r\n <svg class=\"h-6 w-6 text-white\"\r\n xmlns=\"http://www.w3.org/2000/svg\"\r\n fill=\"none\"\r\n viewBox=\"0 0 24 24\"\r\n stroke-width=\"2\"\r\n stroke=\"currentColor\"\r\n aria-hidden=\"true\">\r\n <path stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"\r\n d=\"M6 18L18 6M6 6l12 12\" />\r\n </svg>\r\n </button>\r\n </div>\r\n <div class=\"sidebar-off-canvas-app-logo-container\">\r\n <img alt=\"image\" class=\"shell-sidebar-logo\"\r\n [src]=\"config?.appLogo\"\r\n [alt]=\"config?.appLogoAlt\">\r\n </div>\r\n <lib-shell-sidebar></lib-shell-sidebar>\r\n </div>\r\n <div class=\"sidebar-dummy-element\"\r\n aria-hidden=\"true\">\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"sidebar-static-menu-outer-container\">\r\n <div class=\"sidebar-static-menu-container\"\r\n [class.sidebar-static-menu-container-active]=\"!showMobileSidebar\"\r\n [class.sidebar-static-menu-container-not-active]=\"showMobileSidebar\">\r\n <div class=\"sidebar-static-menu-container-inner\">\r\n <div class=\"sidebar-static-menu-app-logo-container\">\r\n <img alt=\"image\" *ngIf=\"!showMobileSidebar\"\r\n class=\"shell-sidebar-logo\"\r\n [src]=\"config?.appLogo\"\r\n [alt]=\"config?.appLogoAlt\">\r\n <button *ngIf=\"showMobileSidebar\"\r\n type=\"button\"\r\n class=\"sidebar-static-menu-toggle-button\"\r\n (click)=\"toggleMobileSidebar()\">\r\n <span class=\"sr-only\">Toggle sidebar</span>\r\n <svg class=\"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-width=\"2\"\r\n stroke=\"currentColor\"\r\n aria-hidden=\"true\">\r\n <path stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"\r\n d=\"M4 6h16M4 12h16M4 18h7\" />\r\n </svg>\r\n </button>\r\n </div>\r\n <lib-shell-sidebar [sticky]=\"showMobileSidebar\"></lib-shell-sidebar>\r\n </div>\r\n <div class=\"flex flex-shrink-0 bg-gray-700 p-4\"\r\n *ngIf=\"!showMobileSidebar && sidebarFooterTemplate\">\r\n <div class=\"group block flex-shrink-0\">\r\n <div class=\"flex items-center\">\r\n <div>\r\n <p class=\"text-sm font-medium text-gray-400\">\r\n <ng-container [ngTemplateOutlet]=\"sidebarFooterTemplate\"></ng-container>\r\n </p>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"sidebar-static-menu-wrapper\"\r\n [class.sidebar-static-menu-wrapper-expanded]=\"!showMobileSidebar\">\r\n <div class=\"sidebar-static-menu-sticky-header-container\"\r\n *ngIf=\"config?.showHeader\">\r\n <button *ngIf=\"showMobileSidebar\"\r\n type=\"button\"\r\n class=\"sidebar-static-menu-toggle-button-md\"\r\n (click)=\"toggleMobileSidebar()\">\r\n <span class=\"sr-only\">Toggle sidebar</span>\r\n <svg class=\"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-width=\"2\"\r\n stroke=\"currentColor\"\r\n aria-hidden=\"true\">\r\n <path stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"\r\n d=\"M4 6h16M4 12h16M4 18h7\" />\r\n </svg>\r\n </button>\r\n <button *ngIf=\"!showMobileSidebar\"\r\n type=\"button\"\r\n class=\"sidebar-static-menu-toggle-button\"\r\n (click)=\"toggleMobileSidebar()\">\r\n <span class=\"sr-only\">Toggle sidebar</span>\r\n <svg class=\"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-width=\"2\"\r\n stroke=\"currentColor\"\r\n aria-hidden=\"true\">\r\n <path stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"\r\n d=\"M4 6h16M4 12h16M4 18h7\" />\r\n </svg>\r\n </button>\r\n <div class=\"sidebar-static-menu-header-container\">\r\n <div class=\"sidebar-static-menu-header-near-container\">\r\n <div class=\"sidebar-static-menu-header-app-logo-container\"\r\n *ngIf=\"showMobileSidebar\">\r\n <img alt=\"image\" class=\"shell-sidebar-logo\"\r\n [src]=\"config?.appLogo\"\r\n [alt]=\"config?.appLogoAlt\">\r\n </div>\r\n </div>\r\n <div class=\"sidebar-static-menu-header-far-container\">\r\n <lib-shell-sidebar-header [show-userName]=\"config?.showUserNameOnHeader\"\r\n [show-alerts]=\"config?.showAlertsOnHeader\"\r\n [show-langs]=\"config?.showLangsOnHeader\">\r\n </lib-shell-sidebar-header>\r\n </div>\r\n </div>\r\n </div>\r\n <div flex-1>\r\n <main class=\"shell-content-container-fluid\">\r\n <lib-breadcrumb *ngIf=\"config?.breadcrumb || false\"></lib-breadcrumb>\r\n <div class=\"shell-content-container-inner\">\r\n <router-outlet *ngIf=\"(config && config.layout === 'Sidebar')\"></router-outlet>\r\n </div>\r\n </main>\r\n </div>\r\n </div>\r\n</div>" }]
3441
+ args: [{ selector: 'lib-shell-sidebar-layout', template: "<div>\r\n <div class=\"sidebar-off-canvas-menu-container\" role=\"dialog\" aria-modal=\"true\">\r\n <div class=\"sidebar-off-canvas-menu-backdrop\"\r\n [class.sidebar-off-canvas-menu-backdrop-opacity-100]=\"!showMobileSidebar\">\r\n </div>\r\n <div class=\"sidebar-off-canvas-menu-container-inner\"\r\n [class.sidebar-off-canvas-menu-container-inner-active]=\"!showMobileSidebar\"\r\n [class.sidebar-off-canvas-menu-container-inner-not-active]=\"showMobileSidebar\">\r\n <div class=\"sidebar-off-canvas-layout-container\">\r\n <div class=\"sidebar-off-canvas-toggle-button-container\">\r\n <button type=\"button\" class=\"sidebar-off-canvas-toggle-button\" (click)=\"toggleMobileSidebar()\">\r\n <span class=\"sr-only\">Close sidebar</span>\r\n <svg class=\"h-6 w-6 text-white\" xmlns=\"http://www.w3.org/2000/svg\" fill=\"none\" viewBox=\"0 0 24 24\" stroke-width=\"2\" stroke=\"currentColor\" aria-hidden=\"true\">\r\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M6 18L18 6M6 6l12 12\" />\r\n </svg>\r\n </button>\r\n </div>\r\n <div class=\"sidebar-off-canvas-app-logo-container\">\r\n <img alt=\"image\" class=\"shell-sidebar-logo\"\r\n [src]=\"config?.appLogo\"\r\n [alt]=\"config?.appLogoAlt\">\r\n </div>\r\n <lib-shell-sidebar></lib-shell-sidebar>\r\n </div>\r\n <div class=\"sidebar-dummy-element\" aria-hidden=\"true\"></div>\r\n </div>\r\n </div>\r\n <div class=\"sidebar-static-menu-outer-container\">\r\n <div class=\"sidebar-static-menu-container\"\r\n [class.sidebar-static-menu-container-active]=\"!showMobileSidebar\"\r\n [class.sidebar-static-menu-container-not-active]=\"showMobileSidebar\">\r\n <div class=\"sidebar-static-menu-container-inner\">\r\n <div class=\"sidebar-static-menu-app-logo-container\">\r\n <img alt=\"image\" *ngIf=\"!showMobileSidebar\" class=\"shell-sidebar-logo\" [src]=\"config?.appLogo\" [alt]=\"config?.appLogoAlt\">\r\n <button *ngIf=\"showMobileSidebar\" type=\"button\" class=\"sidebar-static-menu-toggle-button\" (click)=\"toggleMobileSidebar()\">\r\n <span class=\"sr-only\">Toggle sidebar</span>\r\n <svg class=\"h-6 w-6\" xmlns=\"http://www.w3.org/2000/svg\" fill=\"none\" viewBox=\"0 0 24 24\" stroke-width=\"2\" stroke=\"currentColor\" aria-hidden=\"true\">\r\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M4 6h16M4 12h16M4 18h7\" />\r\n </svg>\r\n </button>\r\n </div>\r\n <lib-shell-sidebar [sticky]=\"showMobileSidebar\"></lib-shell-sidebar>\r\n </div>\r\n <div class=\"flex flex-shrink-0 bg-gray-700 p-4\" *ngIf=\"!showMobileSidebar && sidebarFooterTemplate\">\r\n <div class=\"group block flex-shrink-0\">\r\n <div class=\"flex items-center\">\r\n <div>\r\n <p class=\"text-sm font-medium text-gray-400\">\r\n <ng-container [ngTemplateOutlet]=\"sidebarFooterTemplate\"></ng-container>\r\n </p>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"sidebar-static-menu-wrapper\" [class.sidebar-static-menu-wrapper-expanded]=\"!showMobileSidebar\">\r\n <div class=\"sidebar-static-menu-sticky-header-container\" [class.busy]=\"busy\" *ngIf=\"config?.showHeader\">\r\n <button *ngIf=\"showMobileSidebar\" type=\"button\" class=\"sidebar-static-menu-toggle-button-md\" (click)=\"toggleMobileSidebar()\">\r\n <span class=\"sr-only\">Toggle sidebar</span>\r\n <svg class=\"h-6 w-6\" xmlns=\"http://www.w3.org/2000/svg\" fill=\"none\" viewBox=\"0 0 24 24\" stroke-width=\"2\" stroke=\"currentColor\" aria-hidden=\"true\">\r\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M4 6h16M4 12h16M4 18h7\" />\r\n </svg>\r\n </button>\r\n <button *ngIf=\"!showMobileSidebar\" type=\"button\" class=\"sidebar-static-menu-toggle-button\" (click)=\"toggleMobileSidebar()\">\r\n <span class=\"sr-only\">Toggle sidebar</span>\r\n <svg class=\"h-6 w-6\" xmlns=\"http://www.w3.org/2000/svg\" fill=\"none\" viewBox=\"0 0 24 24\" stroke-width=\"2\" stroke=\"currentColor\" aria-hidden=\"true\">\r\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M4 6h16M4 12h16M4 18h7\" />\r\n </svg>\r\n </button>\r\n <div class=\"sidebar-static-menu-header-container\" [class.busy]=\"busy\">\r\n <div class=\"sidebar-static-menu-header-near-container\" [class.busy]=\"busy\">\r\n <div class=\"sidebar-static-menu-header-app-logo-container\" *ngIf=\"showMobileSidebar\">\r\n <img alt=\"image\" class=\"shell-sidebar-logo\" [src]=\"config?.appLogo\" [alt]=\"config?.appLogoAlt\">\r\n </div>\r\n </div>\r\n <div class=\"sidebar-static-menu-header-between-container\" [class.busy]=\"busy\"></div>\r\n <div class=\"sidebar-static-menu-header-far-container\" [class.busy]=\"busy\">\r\n <lib-shell-sidebar-header [show-userName]=\"config?.showUserNameOnHeader\"\r\n [show-alerts]=\"config?.showAlertsOnHeader\"\r\n [show-langs]=\"config?.showLangsOnHeader\"\r\n [busy]=\"busy\">\r\n </lib-shell-sidebar-header>\r\n </div>\r\n </div>\r\n </div>\r\n <div flex-1>\r\n <main class=\"shell-content-container-fluid\" [class.busy]=\"busy\">\r\n <lib-breadcrumb *ngIf=\"config?.breadcrumb || false\"></lib-breadcrumb>\r\n <div class=\"shell-content-container-inner\" [class.busy]=\"busy\">\r\n <router-outlet *ngIf=\"(config && config.layout === 'Sidebar')\"></router-outlet>\r\n </div>\r\n </main>\r\n </div>\r\n </div>\r\n</div>" }]
3427
3442
  }], ctorParameters: () => [{ type: UserSettingsService }], propDecorators: { config: [{
3428
3443
  type: Input
3429
3444
  }], sidebarFooterTemplate: [{
3430
3445
  type: Input
3446
+ }], busy: [{
3447
+ type: Input
3431
3448
  }] } });
3432
3449
 
3433
3450
  class ShellFooterComponent {
@@ -3446,16 +3463,20 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.6", ngImpor
3446
3463
  }] }] });
3447
3464
 
3448
3465
  class ShellStackedLayoutComponent {
3449
- constructor() { }
3466
+ constructor() {
3467
+ this.busy = false;
3468
+ }
3450
3469
  ngOnInit() { }
3451
3470
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.6", ngImport: i0, type: ShellStackedLayoutComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
3452
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.6", type: ShellStackedLayoutComponent, selector: "lib-shell-stacked-layout", inputs: { config: "config" }, ngImport: i0, template: "<div class=\"shell-header-container\"\r\n *ngIf=\"config?.showHeader\">\r\n <div [class]=\"config?.fluid ? 'shell-header-container-inner-fluid' : 'shell-header-container-inner'\">\r\n <ng-container *ngIf=\"config?.customHeaderComponent\">\r\n <div appDynamicComponentHost=\"Header\"></div>\r\n </ng-container>\r\n <lib-shell-header *ngIf=\"!config?.customHeaderComponent\"\r\n [show-userName]=\"config?.showUserNameOnHeader\"\r\n [show-alerts]=\"config?.showAlertsOnHeader\"\r\n [show-langs]=\"config?.showLangsOnHeader\">\r\n </lib-shell-header>\r\n </div>\r\n</div>\r\n<main [class]=\"config?.showHeader ? 'shell-content-container' : 'shell-content-container-no-header'\">\r\n <div [class]=\"config?.fluid ? 'shell-content-container-inner-fluid' : 'shell-content-container-inner'\">\r\n <router-outlet *ngIf=\"(!config || config.layout === 'Stacked' || !config.layout)\"></router-outlet>\r\n </div>\r\n</main>\r\n<div class=\"shell-footer-container\"\r\n *ngIf=\"config?.showFooter\">\r\n <div [class]=\"config?.fluid ? 'shell-footer-container-inner-fluid' : 'shell-footer-container-inner'\">\r\n <ng-container *ngIf=\"config?.customFooterComponent\">\r\n <div appDynamicComponentHost\r\n hostName=\"Footer\"></div>\r\n </ng-container>\r\n <lib-shell-footer *ngIf=\"!config?.customFooterComponent\"></lib-shell-footer>\r\n </div>\r\n</div>", dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$1.RouterOutlet, selector: "router-outlet", inputs: ["name"], outputs: ["activate", "deactivate", "attach", "detach"], exportAs: ["outlet"] }, { kind: "directive", type: DynamicComponentHostDirective, selector: "[appDynamicComponentHost]", inputs: ["hostName"] }, { kind: "component", type: ShellFooterComponent, selector: "lib-shell-footer" }, { kind: "component", type: ShellHeaderComponent, selector: "lib-shell-header", inputs: ["section-links", "profile-menu", "show-userName", "show-alerts", "show-langs", "border"] }] }); }
3471
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.6", type: ShellStackedLayoutComponent, selector: "lib-shell-stacked-layout", inputs: { config: "config", busy: "busy" }, ngImport: i0, template: "<div class=\"shell-header-container\"\r\n *ngIf=\"config?.showHeader\">\r\n <div [class]=\"config?.fluid ? 'shell-header-container-inner-fluid' : 'shell-header-container-inner'\">\r\n <ng-container *ngIf=\"config?.customHeaderComponent\">\r\n <div appDynamicComponentHost=\"Header\"></div>\r\n </ng-container>\r\n <lib-shell-header *ngIf=\"!config?.customHeaderComponent\"\r\n [busy]=\"busy\"\r\n [show-userName]=\"config?.showUserNameOnHeader\"\r\n [show-alerts]=\"config?.showAlertsOnHeader\"\r\n [show-langs]=\"config?.showLangsOnHeader\">\r\n </lib-shell-header>\r\n </div>\r\n</div>\r\n<main [class]=\"config?.showHeader ? 'shell-content-container' : 'shell-content-container-no-header'\">\r\n <div [class]=\"config?.fluid ? 'shell-content-container-inner-fluid' : 'shell-content-container-inner'\">\r\n <router-outlet *ngIf=\"(!config || config.layout === 'Stacked' || !config.layout)\"></router-outlet>\r\n </div>\r\n</main>\r\n<div class=\"shell-footer-container\"\r\n *ngIf=\"config?.showFooter\">\r\n <div [class]=\"config?.fluid ? 'shell-footer-container-inner-fluid' : 'shell-footer-container-inner'\">\r\n <ng-container *ngIf=\"config?.customFooterComponent\">\r\n <div appDynamicComponentHost\r\n hostName=\"Footer\"></div>\r\n </ng-container>\r\n <lib-shell-footer *ngIf=\"!config?.customFooterComponent\"></lib-shell-footer>\r\n </div>\r\n</div>", dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$1.RouterOutlet, selector: "router-outlet", inputs: ["name"], outputs: ["activate", "deactivate", "attach", "detach"], exportAs: ["outlet"] }, { kind: "directive", type: DynamicComponentHostDirective, selector: "[appDynamicComponentHost]", inputs: ["hostName"] }, { kind: "component", type: ShellFooterComponent, selector: "lib-shell-footer" }, { kind: "component", type: ShellHeaderComponent, selector: "lib-shell-header", inputs: ["section-links", "profile-menu", "show-userName", "show-alerts", "show-langs", "border", "busy"] }] }); }
3453
3472
  }
3454
3473
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.6", ngImport: i0, type: ShellStackedLayoutComponent, decorators: [{
3455
3474
  type: Component,
3456
- args: [{ selector: 'lib-shell-stacked-layout', template: "<div class=\"shell-header-container\"\r\n *ngIf=\"config?.showHeader\">\r\n <div [class]=\"config?.fluid ? 'shell-header-container-inner-fluid' : 'shell-header-container-inner'\">\r\n <ng-container *ngIf=\"config?.customHeaderComponent\">\r\n <div appDynamicComponentHost=\"Header\"></div>\r\n </ng-container>\r\n <lib-shell-header *ngIf=\"!config?.customHeaderComponent\"\r\n [show-userName]=\"config?.showUserNameOnHeader\"\r\n [show-alerts]=\"config?.showAlertsOnHeader\"\r\n [show-langs]=\"config?.showLangsOnHeader\">\r\n </lib-shell-header>\r\n </div>\r\n</div>\r\n<main [class]=\"config?.showHeader ? 'shell-content-container' : 'shell-content-container-no-header'\">\r\n <div [class]=\"config?.fluid ? 'shell-content-container-inner-fluid' : 'shell-content-container-inner'\">\r\n <router-outlet *ngIf=\"(!config || config.layout === 'Stacked' || !config.layout)\"></router-outlet>\r\n </div>\r\n</main>\r\n<div class=\"shell-footer-container\"\r\n *ngIf=\"config?.showFooter\">\r\n <div [class]=\"config?.fluid ? 'shell-footer-container-inner-fluid' : 'shell-footer-container-inner'\">\r\n <ng-container *ngIf=\"config?.customFooterComponent\">\r\n <div appDynamicComponentHost\r\n hostName=\"Footer\"></div>\r\n </ng-container>\r\n <lib-shell-footer *ngIf=\"!config?.customFooterComponent\"></lib-shell-footer>\r\n </div>\r\n</div>" }]
3475
+ args: [{ selector: 'lib-shell-stacked-layout', template: "<div class=\"shell-header-container\"\r\n *ngIf=\"config?.showHeader\">\r\n <div [class]=\"config?.fluid ? 'shell-header-container-inner-fluid' : 'shell-header-container-inner'\">\r\n <ng-container *ngIf=\"config?.customHeaderComponent\">\r\n <div appDynamicComponentHost=\"Header\"></div>\r\n </ng-container>\r\n <lib-shell-header *ngIf=\"!config?.customHeaderComponent\"\r\n [busy]=\"busy\"\r\n [show-userName]=\"config?.showUserNameOnHeader\"\r\n [show-alerts]=\"config?.showAlertsOnHeader\"\r\n [show-langs]=\"config?.showLangsOnHeader\">\r\n </lib-shell-header>\r\n </div>\r\n</div>\r\n<main [class]=\"config?.showHeader ? 'shell-content-container' : 'shell-content-container-no-header'\">\r\n <div [class]=\"config?.fluid ? 'shell-content-container-inner-fluid' : 'shell-content-container-inner'\">\r\n <router-outlet *ngIf=\"(!config || config.layout === 'Stacked' || !config.layout)\"></router-outlet>\r\n </div>\r\n</main>\r\n<div class=\"shell-footer-container\"\r\n *ngIf=\"config?.showFooter\">\r\n <div [class]=\"config?.fluid ? 'shell-footer-container-inner-fluid' : 'shell-footer-container-inner'\">\r\n <ng-container *ngIf=\"config?.customFooterComponent\">\r\n <div appDynamicComponentHost\r\n hostName=\"Footer\"></div>\r\n </ng-container>\r\n <lib-shell-footer *ngIf=\"!config?.customFooterComponent\"></lib-shell-footer>\r\n </div>\r\n</div>" }]
3457
3476
  }], ctorParameters: () => [], propDecorators: { config: [{
3458
3477
  type: Input
3478
+ }], busy: [{
3479
+ type: Input
3459
3480
  }] } });
3460
3481
 
3461
3482
  class ShellLayoutComponent {
@@ -3464,6 +3485,7 @@ class ShellLayoutComponent {
3464
3485
  this._componentLoaderFactory = _componentLoaderFactory;
3465
3486
  this._config = _config;
3466
3487
  this._dynamicComponentHosts = null;
3488
+ this.busy = false;
3467
3489
  this._routerSub$ = null;
3468
3490
  this.showRightPaneSM = false;
3469
3491
  this.activeConfig = new DefaultShellConfig();
@@ -3478,9 +3500,8 @@ class ShellLayoutComponent {
3478
3500
  setTimeout(() => { this.loaded = true; }, 200);
3479
3501
  }
3480
3502
  ngOnInit() {
3481
- this._routerSub$ = this._router
3482
- .events
3483
- .pipe(filter((event) => event instanceof ActivationStart)).subscribe((event) => {
3503
+ this._routerSub$ = this._router.events.pipe(filter((event) => event instanceof ActivationStart))
3504
+ .subscribe((event) => {
3484
3505
  if (event?.snapshot) {
3485
3506
  if (event?.snapshot?.data) {
3486
3507
  if (event?.snapshot?.data.shell) {
@@ -3519,17 +3540,19 @@ class ShellLayoutComponent {
3519
3540
  }
3520
3541
  }
3521
3542
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.6", ngImport: i0, type: ShellLayoutComponent, deps: [{ token: i1$1.Router }, { token: ComponentLoaderFactory }, { token: SHELL_CONFIG }], target: i0.ɵɵFactoryTarget.Component }); }
3522
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.6", type: ShellLayoutComponent, selector: "lib-shell-layout", inputs: { sidebarFooterTemplate: "sidebarFooterTemplate" }, viewQueries: [{ propertyName: "_dynamicComponentHosts", predicate: DynamicComponentHostDirective, descendants: true }], ngImport: i0, template: "<div [class.hidden]=\"!loaded\"\r\n [class.block]=\"loaded\">\r\n <!-- STACKED LAYOUT -->\r\n <div *ngIf=\"(activeConfig.layout === 'Stacked' || !activeConfig.layout)\"\r\n class=\"shell-container active-side-pane\">\r\n <lib-shell-stacked-layout [config]=\"activeConfig\"></lib-shell-stacked-layout>\r\n </div>\r\n <!-- SIDEBAR LAYOUT -->\r\n <div *ngIf=\"activeConfig.layout === 'Sidebar'\"\r\n class=\"sidebar shell-container active-side-pane\">\r\n <lib-shell-sidebar-layout [config]=\"activeConfig\"\r\n [sidebarFooterTemplate]=\"sidebarFooterTemplate\">\r\n </lib-shell-sidebar-layout>\r\n </div>\r\n <lib-side-pane #rightPane>\r\n <router-outlet name=\"rightpane\"\r\n (activate)=\"rightPane.onSidePaneActivated($event)\"\r\n (deactivate)=\"rightPane.onSidePaneDeactivated($event)\">\r\n </router-outlet>\r\n </lib-side-pane>\r\n <lib-toaster-container></lib-toaster-container>\r\n</div>", dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$1.RouterOutlet, selector: "router-outlet", inputs: ["name"], outputs: ["activate", "deactivate", "attach", "detach"], exportAs: ["outlet"] }, { kind: "component", type: ShellSidebarLayoutComponent, selector: "lib-shell-sidebar-layout", inputs: ["config", "sidebarFooterTemplate"] }, { kind: "component", type: ShellStackedLayoutComponent, selector: "lib-shell-stacked-layout", inputs: ["config"] }, { kind: "component", type: SidePaneComponent, selector: "lib-side-pane", inputs: ["visible"], outputs: ["onComplete", "onOpen", "onClose"] }, { kind: "component", type: ToasterContainerComponent, selector: "lib-toaster-container" }] }); }
3543
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.6", type: ShellLayoutComponent, selector: "lib-shell-layout", inputs: { busy: "busy", sidebarFooterTemplate: "sidebarFooterTemplate" }, viewQueries: [{ propertyName: "_dynamicComponentHosts", predicate: DynamicComponentHostDirective, descendants: true }], ngImport: i0, template: "<div [class.hidden]=\"!loaded\" [class.block]=\"loaded\">\r\n <!-- STACKED LAYOUT -->\r\n <div *ngIf=\"(activeConfig.layout === 'Stacked' || !activeConfig.layout)\" class=\"shell-container active-side-pane\">\r\n <lib-shell-stacked-layout [config]=\"activeConfig\" [busy]=\"busy\"></lib-shell-stacked-layout>\r\n </div>\r\n <!-- SIDEBAR LAYOUT -->\r\n <div *ngIf=\"activeConfig.layout === 'Sidebar'\" class=\"sidebar shell-container active-side-pane\">\r\n <lib-shell-sidebar-layout [config]=\"activeConfig\" [busy]=\"busy\"\r\n [sidebarFooterTemplate]=\"sidebarFooterTemplate\">\r\n </lib-shell-sidebar-layout>\r\n </div>\r\n <lib-side-pane #rightPane>\r\n <router-outlet name=\"rightpane\"\r\n (activate)=\"rightPane.onSidePaneActivated($event)\"\r\n (deactivate)=\"rightPane.onSidePaneDeactivated($event)\">\r\n </router-outlet>\r\n </lib-side-pane>\r\n <lib-toaster-container></lib-toaster-container>\r\n</div>", dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$1.RouterOutlet, selector: "router-outlet", inputs: ["name"], outputs: ["activate", "deactivate", "attach", "detach"], exportAs: ["outlet"] }, { kind: "component", type: ShellSidebarLayoutComponent, selector: "lib-shell-sidebar-layout", inputs: ["config", "sidebarFooterTemplate", "busy"] }, { kind: "component", type: ShellStackedLayoutComponent, selector: "lib-shell-stacked-layout", inputs: ["config", "busy"] }, { kind: "component", type: SidePaneComponent, selector: "lib-side-pane", inputs: ["visible", "size"], outputs: ["onComplete", "onOpen", "onClose"] }, { kind: "component", type: ToasterContainerComponent, selector: "lib-toaster-container" }] }); }
3523
3544
  }
3524
3545
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.6", ngImport: i0, type: ShellLayoutComponent, decorators: [{
3525
3546
  type: Component,
3526
- args: [{ selector: 'lib-shell-layout', template: "<div [class.hidden]=\"!loaded\"\r\n [class.block]=\"loaded\">\r\n <!-- STACKED LAYOUT -->\r\n <div *ngIf=\"(activeConfig.layout === 'Stacked' || !activeConfig.layout)\"\r\n class=\"shell-container active-side-pane\">\r\n <lib-shell-stacked-layout [config]=\"activeConfig\"></lib-shell-stacked-layout>\r\n </div>\r\n <!-- SIDEBAR LAYOUT -->\r\n <div *ngIf=\"activeConfig.layout === 'Sidebar'\"\r\n class=\"sidebar shell-container active-side-pane\">\r\n <lib-shell-sidebar-layout [config]=\"activeConfig\"\r\n [sidebarFooterTemplate]=\"sidebarFooterTemplate\">\r\n </lib-shell-sidebar-layout>\r\n </div>\r\n <lib-side-pane #rightPane>\r\n <router-outlet name=\"rightpane\"\r\n (activate)=\"rightPane.onSidePaneActivated($event)\"\r\n (deactivate)=\"rightPane.onSidePaneDeactivated($event)\">\r\n </router-outlet>\r\n </lib-side-pane>\r\n <lib-toaster-container></lib-toaster-container>\r\n</div>" }]
3547
+ args: [{ selector: 'lib-shell-layout', template: "<div [class.hidden]=\"!loaded\" [class.block]=\"loaded\">\r\n <!-- STACKED LAYOUT -->\r\n <div *ngIf=\"(activeConfig.layout === 'Stacked' || !activeConfig.layout)\" class=\"shell-container active-side-pane\">\r\n <lib-shell-stacked-layout [config]=\"activeConfig\" [busy]=\"busy\"></lib-shell-stacked-layout>\r\n </div>\r\n <!-- SIDEBAR LAYOUT -->\r\n <div *ngIf=\"activeConfig.layout === 'Sidebar'\" class=\"sidebar shell-container active-side-pane\">\r\n <lib-shell-sidebar-layout [config]=\"activeConfig\" [busy]=\"busy\"\r\n [sidebarFooterTemplate]=\"sidebarFooterTemplate\">\r\n </lib-shell-sidebar-layout>\r\n </div>\r\n <lib-side-pane #rightPane>\r\n <router-outlet name=\"rightpane\"\r\n (activate)=\"rightPane.onSidePaneActivated($event)\"\r\n (deactivate)=\"rightPane.onSidePaneDeactivated($event)\">\r\n </router-outlet>\r\n </lib-side-pane>\r\n <lib-toaster-container></lib-toaster-container>\r\n</div>" }]
3527
3548
  }], ctorParameters: () => [{ type: i1$1.Router }, { type: ComponentLoaderFactory }, { type: undefined, decorators: [{
3528
3549
  type: Inject,
3529
3550
  args: [SHELL_CONFIG]
3530
3551
  }] }], propDecorators: { _dynamicComponentHosts: [{
3531
3552
  type: ViewChildren,
3532
3553
  args: [DynamicComponentHostDirective]
3554
+ }], busy: [{
3555
+ type: Input
3533
3556
  }], sidebarFooterTemplate: [{
3534
3557
  type: Input
3535
3558
  }] } });
@@ -3597,11 +3620,11 @@ class ViewLayoutComponent {
3597
3620
  }
3598
3621
  }
3599
3622
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.6", ngImport: i0, type: ViewLayoutComponent, deps: [{ token: i1$1.ActivatedRoute }, { token: i1$1.Router }], target: i0.ɵɵFactoryTarget.Component }); }
3600
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.6", type: ViewLayoutComponent, selector: "lib-view-layout", inputs: { header: ["show-header", "header"], fluid: "fluid", title: "title", icon: "icon", actions: "actions", busy: "busy", searchPlaceholder: ["search-placeholder", "searchPlaceholder"], view: "view", metaItems: ["meta-items", "metaItems"] }, outputs: { onAction: "onAction", onSearch: "onSearch" }, viewQueries: [{ propertyName: "searchInput$", first: true, predicate: ["search"], descendants: true }], ngImport: i0, template: "<header *ngIf=\"header\" class=\"view-layout-paddings\">\r\n <div class=\"view-layout-title-container\">\r\n <div class=\"view-layout-title-container-inner\">\r\n <div class=\"flex items-center\">\r\n <i *ngIf=\"icon\" [class]=\"icon + ' title-icon'\" aria-hidden=\"true\"></i>\r\n <h1 [class]=\"busy ? 'view-layout-title-busy' : 'view-layout-title'\">{{title}}</h1>\r\n </div>\r\n <div *ngIf=\"metaItems && metaItems.length > 0\" class=\"meta-container\">\r\n <ng-container *ngFor=\"let meta of metaItems\">\r\n <div class=\"meta-item-container\">\r\n <i *ngIf=\"meta.icon\" [class]=\"meta.icon + ' meta-icon'\" aria-hidden=\"true\"></i>\r\n <span class=\"meta-text\">{{meta.text}}</span>\r\n </div>\r\n </ng-container>\r\n </div>\r\n </div>\r\n <div class=\"view-layout-title-container-far\">\r\n <ng-container *ngFor=\"let action of actions\" [ngSwitch]=\"action.type\">\r\n\r\n <ng-container *ngSwitchCase=\"'search'\">\r\n <label for=\"search\" class=\"sr-only\">Search</label>\r\n <div class=\"search-container mr-1\">\r\n <input id=\"text\"\r\n #search\r\n title=\"search\"\r\n class=\"search-input\"\r\n [placeholder]=\"searchPlaceholder\"\r\n name=\"search\"\r\n (input)=\"searchActionType(search.value)\"\r\n (onsearch)=\"handleClear($event)\">\r\n <button type=\"button\"\r\n href=\"#\"\r\n class=\"search-button\"\r\n [title]=\"action.tooltip\"\r\n (click)=\"searchActionClick(action, search.value)\">\r\n <i [class]=\"action.icon\"></i>\r\n </button>\r\n </div>\r\n </ng-container>\r\n\r\n <ng-container *ngSwitchCase=\"'switch-view'\">\r\n <button [disabled]=\"view === action.param\"\r\n type=\"button\"\r\n href=\"#\"\r\n class=\"p-2 disabled:opacity-75 btn-view-header\"\r\n (click)=\"switchViewActionClick(action)\">\r\n <span class=\"inline-block relative\">\r\n <i [class]=\"action.icon\"></i>\r\n <span *ngIf=\"view === action.param\"\r\n class=\"selected-view-indicator\">\r\n </span>\r\n </span>\r\n </button>\r\n </ng-container>\r\n\r\n <ng-container *ngSwitchCase=\"'router-link'\">\r\n <button type=\"button\"\r\n href=\"#\"\r\n class=\"p-2 btn-view-header\"\r\n [title]=\"action.tooltip\"\r\n (click)=\"routerLinkActionClick(action)\">\r\n <i [class]=\"action.icon\"\r\n [ngClass]=\"{'pr-1': action.text}\"></i>\r\n {{ action.text }}\r\n </button>\r\n </ng-container>\r\n\r\n <ng-container *ngSwitchDefault>\r\n <button type=\"button\"\r\n class=\"p-2 btn-view-header\"\r\n [title]=\"action.tooltip\"\r\n (click)=\"emitActionClick(action)\">\r\n <i [class]=\"action.icon\"\r\n [ngClass]=\"{'pr-1': action.text}\"></i>\r\n {{ action.text }}\r\n </button>\r\n </ng-container>\r\n </ng-container>\r\n </div>\r\n </div>\r\n</header>\r\n<div [class]=\"fluid ? 'view-container-fluid' : 'view-container'\">\r\n <ng-content></ng-content>\r\n</div>", dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i1.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "directive", type: i1.NgSwitchDefault, selector: "[ngSwitchDefault]" }] }); }
3623
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.6", type: ViewLayoutComponent, selector: "lib-view-layout", inputs: { header: ["show-header", "header"], fluid: "fluid", title: "title", icon: "icon", actions: "actions", busy: "busy", searchPlaceholder: ["search-placeholder", "searchPlaceholder"], view: "view", metaItems: ["meta-items", "metaItems"] }, outputs: { onAction: "onAction", onSearch: "onSearch" }, viewQueries: [{ propertyName: "searchInput$", first: true, predicate: ["search"], descendants: true }], ngImport: i0, template: "<header *ngIf=\"header\" class=\"view-layout-paddings\">\r\n <div class=\"view-layout-title-container\">\r\n <div class=\"view-layout-title-container-inner\">\r\n \r\n <div class=\"flex items-center\">\r\n <i *ngIf=\"icon\" [class]=\"icon + ' title-icon'\" aria-hidden=\"true\"></i>\r\n <h1 [class]=\"busy ? 'view-layout-title-busy' : 'view-layout-title'\">{{title || ' '}}</h1>\r\n </div>\r\n \r\n <div *ngIf=\"metaItems && metaItems.length > 0\" class=\"meta-container\">\r\n <ng-container *ngFor=\"let meta of metaItems\">\r\n <div class=\"meta-item-container\">\r\n <i *ngIf=\"meta.icon\" [class]=\"meta.icon + ' meta-icon'\" aria-hidden=\"true\"></i>\r\n <span class=\"meta-text\">{{meta.text}}</span>\r\n </div>\r\n </ng-container>\r\n </div>\r\n\r\n </div>\r\n <div class=\"view-layout-title-container-far\">\r\n <ng-container *ngFor=\"let action of actions\" [ngSwitch]=\"action.type\">\r\n\r\n <ng-container *ngSwitchCase=\"'search'\">\r\n <label for=\"search\" class=\"sr-only\">Search</label>\r\n <div class=\"search-container mr-1\">\r\n <input id=\"text\"\r\n #search\r\n title=\"search\"\r\n class=\"search-input\"\r\n [placeholder]=\"searchPlaceholder\"\r\n name=\"search\"\r\n (input)=\"searchActionType(search.value)\"\r\n (onsearch)=\"handleClear($event)\">\r\n <button type=\"button\"\r\n href=\"#\"\r\n class=\"search-button\"\r\n [title]=\"action.tooltip\"\r\n (click)=\"searchActionClick(action, search.value)\">\r\n <i [class]=\"action.icon\"></i>\r\n </button>\r\n </div>\r\n </ng-container>\r\n\r\n <ng-container *ngSwitchCase=\"'switch-view'\">\r\n <button [disabled]=\"view === action.param\" type=\"button\" href=\"#\" class=\"p-2 disabled:opacity-75 btn-view-header\" (click)=\"switchViewActionClick(action)\">\r\n <span class=\"inline-block relative\">\r\n <i [class]=\"action.icon\"></i><span *ngIf=\"view === action.param\" class=\"selected-view-indicator\"></span>\r\n </span>\r\n </button>\r\n </ng-container>\r\n\r\n <ng-container *ngSwitchCase=\"'router-link'\">\r\n <button type=\"button\" href=\"#\" class=\"p-2 btn-view-header\" [title]=\"action.tooltip\" (click)=\"routerLinkActionClick(action)\">\r\n <i [class]=\"action.icon\" [ngClass]=\"{'pr-1': action.text}\"></i>\r\n {{ action.text }}\r\n </button>\r\n </ng-container>\r\n\r\n <ng-container *ngSwitchDefault>\r\n <button type=\"button\" class=\"p-2 btn-view-header\" [title]=\"action.tooltip\" (click)=\"emitActionClick(action)\">\r\n <i [class]=\"action.icon\" [ngClass]=\"{'pr-1': action.text}\"></i>\r\n {{ action.text }}\r\n </button>\r\n </ng-container>\r\n </ng-container>\r\n </div>\r\n </div>\r\n</header>\r\n<div [class]=\"fluid ? 'view-container-fluid' : 'view-container'\">\r\n <ng-content></ng-content>\r\n</div>", dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i1.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "directive", type: i1.NgSwitchDefault, selector: "[ngSwitchDefault]" }] }); }
3601
3624
  }
3602
3625
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.6", ngImport: i0, type: ViewLayoutComponent, decorators: [{
3603
3626
  type: Component,
3604
- args: [{ selector: 'lib-view-layout', template: "<header *ngIf=\"header\" class=\"view-layout-paddings\">\r\n <div class=\"view-layout-title-container\">\r\n <div class=\"view-layout-title-container-inner\">\r\n <div class=\"flex items-center\">\r\n <i *ngIf=\"icon\" [class]=\"icon + ' title-icon'\" aria-hidden=\"true\"></i>\r\n <h1 [class]=\"busy ? 'view-layout-title-busy' : 'view-layout-title'\">{{title}}</h1>\r\n </div>\r\n <div *ngIf=\"metaItems && metaItems.length > 0\" class=\"meta-container\">\r\n <ng-container *ngFor=\"let meta of metaItems\">\r\n <div class=\"meta-item-container\">\r\n <i *ngIf=\"meta.icon\" [class]=\"meta.icon + ' meta-icon'\" aria-hidden=\"true\"></i>\r\n <span class=\"meta-text\">{{meta.text}}</span>\r\n </div>\r\n </ng-container>\r\n </div>\r\n </div>\r\n <div class=\"view-layout-title-container-far\">\r\n <ng-container *ngFor=\"let action of actions\" [ngSwitch]=\"action.type\">\r\n\r\n <ng-container *ngSwitchCase=\"'search'\">\r\n <label for=\"search\" class=\"sr-only\">Search</label>\r\n <div class=\"search-container mr-1\">\r\n <input id=\"text\"\r\n #search\r\n title=\"search\"\r\n class=\"search-input\"\r\n [placeholder]=\"searchPlaceholder\"\r\n name=\"search\"\r\n (input)=\"searchActionType(search.value)\"\r\n (onsearch)=\"handleClear($event)\">\r\n <button type=\"button\"\r\n href=\"#\"\r\n class=\"search-button\"\r\n [title]=\"action.tooltip\"\r\n (click)=\"searchActionClick(action, search.value)\">\r\n <i [class]=\"action.icon\"></i>\r\n </button>\r\n </div>\r\n </ng-container>\r\n\r\n <ng-container *ngSwitchCase=\"'switch-view'\">\r\n <button [disabled]=\"view === action.param\"\r\n type=\"button\"\r\n href=\"#\"\r\n class=\"p-2 disabled:opacity-75 btn-view-header\"\r\n (click)=\"switchViewActionClick(action)\">\r\n <span class=\"inline-block relative\">\r\n <i [class]=\"action.icon\"></i>\r\n <span *ngIf=\"view === action.param\"\r\n class=\"selected-view-indicator\">\r\n </span>\r\n </span>\r\n </button>\r\n </ng-container>\r\n\r\n <ng-container *ngSwitchCase=\"'router-link'\">\r\n <button type=\"button\"\r\n href=\"#\"\r\n class=\"p-2 btn-view-header\"\r\n [title]=\"action.tooltip\"\r\n (click)=\"routerLinkActionClick(action)\">\r\n <i [class]=\"action.icon\"\r\n [ngClass]=\"{'pr-1': action.text}\"></i>\r\n {{ action.text }}\r\n </button>\r\n </ng-container>\r\n\r\n <ng-container *ngSwitchDefault>\r\n <button type=\"button\"\r\n class=\"p-2 btn-view-header\"\r\n [title]=\"action.tooltip\"\r\n (click)=\"emitActionClick(action)\">\r\n <i [class]=\"action.icon\"\r\n [ngClass]=\"{'pr-1': action.text}\"></i>\r\n {{ action.text }}\r\n </button>\r\n </ng-container>\r\n </ng-container>\r\n </div>\r\n </div>\r\n</header>\r\n<div [class]=\"fluid ? 'view-container-fluid' : 'view-container'\">\r\n <ng-content></ng-content>\r\n</div>" }]
3627
+ args: [{ selector: 'lib-view-layout', template: "<header *ngIf=\"header\" class=\"view-layout-paddings\">\r\n <div class=\"view-layout-title-container\">\r\n <div class=\"view-layout-title-container-inner\">\r\n \r\n <div class=\"flex items-center\">\r\n <i *ngIf=\"icon\" [class]=\"icon + ' title-icon'\" aria-hidden=\"true\"></i>\r\n <h1 [class]=\"busy ? 'view-layout-title-busy' : 'view-layout-title'\">{{title || ' '}}</h1>\r\n </div>\r\n \r\n <div *ngIf=\"metaItems && metaItems.length > 0\" class=\"meta-container\">\r\n <ng-container *ngFor=\"let meta of metaItems\">\r\n <div class=\"meta-item-container\">\r\n <i *ngIf=\"meta.icon\" [class]=\"meta.icon + ' meta-icon'\" aria-hidden=\"true\"></i>\r\n <span class=\"meta-text\">{{meta.text}}</span>\r\n </div>\r\n </ng-container>\r\n </div>\r\n\r\n </div>\r\n <div class=\"view-layout-title-container-far\">\r\n <ng-container *ngFor=\"let action of actions\" [ngSwitch]=\"action.type\">\r\n\r\n <ng-container *ngSwitchCase=\"'search'\">\r\n <label for=\"search\" class=\"sr-only\">Search</label>\r\n <div class=\"search-container mr-1\">\r\n <input id=\"text\"\r\n #search\r\n title=\"search\"\r\n class=\"search-input\"\r\n [placeholder]=\"searchPlaceholder\"\r\n name=\"search\"\r\n (input)=\"searchActionType(search.value)\"\r\n (onsearch)=\"handleClear($event)\">\r\n <button type=\"button\"\r\n href=\"#\"\r\n class=\"search-button\"\r\n [title]=\"action.tooltip\"\r\n (click)=\"searchActionClick(action, search.value)\">\r\n <i [class]=\"action.icon\"></i>\r\n </button>\r\n </div>\r\n </ng-container>\r\n\r\n <ng-container *ngSwitchCase=\"'switch-view'\">\r\n <button [disabled]=\"view === action.param\" type=\"button\" href=\"#\" class=\"p-2 disabled:opacity-75 btn-view-header\" (click)=\"switchViewActionClick(action)\">\r\n <span class=\"inline-block relative\">\r\n <i [class]=\"action.icon\"></i><span *ngIf=\"view === action.param\" class=\"selected-view-indicator\"></span>\r\n </span>\r\n </button>\r\n </ng-container>\r\n\r\n <ng-container *ngSwitchCase=\"'router-link'\">\r\n <button type=\"button\" href=\"#\" class=\"p-2 btn-view-header\" [title]=\"action.tooltip\" (click)=\"routerLinkActionClick(action)\">\r\n <i [class]=\"action.icon\" [ngClass]=\"{'pr-1': action.text}\"></i>\r\n {{ action.text }}\r\n </button>\r\n </ng-container>\r\n\r\n <ng-container *ngSwitchDefault>\r\n <button type=\"button\" class=\"p-2 btn-view-header\" [title]=\"action.tooltip\" (click)=\"emitActionClick(action)\">\r\n <i [class]=\"action.icon\" [ngClass]=\"{'pr-1': action.text}\"></i>\r\n {{ action.text }}\r\n </button>\r\n </ng-container>\r\n </ng-container>\r\n </div>\r\n </div>\r\n</header>\r\n<div [class]=\"fluid ? 'view-container-fluid' : 'view-container'\">\r\n <ng-content></ng-content>\r\n</div>" }]
3605
3628
  }], ctorParameters: () => [{ type: i1$1.ActivatedRoute }, { type: i1$1.Router }], propDecorators: { searchInput$: [{
3606
3629
  type: ViewChild,
3607
3630
  args: ['search']
@@ -3646,7 +3669,9 @@ class ModelViewLayoutComponent {
3646
3669
  this._options.push(new MenuOption(p.text, p.link, undefined, undefined, p.icon));
3647
3670
  });
3648
3671
  }
3649
- this.selectedTab = this._options[0].value;
3672
+ if (this._options && this._options.length > 0) {
3673
+ this.selectedTab = this._options[0].value;
3674
+ }
3650
3675
  }
3651
3676
  return this._options;
3652
3677
  }
@@ -3701,11 +3726,11 @@ class ModelViewLayoutComponent {
3701
3726
  this.router.navigate([link], { relativeTo: this.route });
3702
3727
  }
3703
3728
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.6", ngImport: i0, type: ModelViewLayoutComponent, deps: [{ token: i1.Location }, { token: i1$1.Router }, { token: i1$1.ActivatedRoute }], target: i0.ɵɵFactoryTarget.Component }); }
3704
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.6", type: ModelViewLayoutComponent, selector: "lib-model-view-layout", inputs: { title: "title", primary: ["primary-links", "primary"], secondary: ["secondary-links", "secondary"], metaItems: ["meta-items", "metaItems"], icon: "icon", busy: "busy", actions: "actions" }, ngImport: i0, template: "<lib-view-layout [title]=\"title\" [meta-items]=\"metaItems\" [actions]=\"actions\" [icon]=\"icon\" [busy]=\"busy\">\r\n <main class=\"model-view-container\">\r\n <div class=\"model-view-container-inner\">\r\n <aside class=\"model-view-aside\">\r\n <section aria-labelledby=\"menu\" class=\"details-view-aside-header-section\">\r\n <div class=\"model-view-aside-header-container\">\r\n <div class=\"model-view-aside-header-container-inner\">\r\n <ng-content *ngIf=\"!busy\"></ng-content>\r\n <div *ngIf=\"busy\" class=\"max-w-64 animate-pulse flex space-x-4\">\r\n <div class=\"rounded-full bg-slate-700 h-10 w-10\"></div>\r\n <div class=\"flex-1 space-y-6 py-1\">\r\n <div class=\"h-2 bg-slate-700 rounded\"></div>\r\n <div class=\"space-y-3\">\r\n <div class=\"grid grid-cols-3 gap-4\">\r\n <div class=\"h-2 bg-slate-700 rounded col-span-2\"></div>\r\n <div class=\"h-2 bg-slate-700 rounded col-span-1\"></div>\r\n </div>\r\n <div class=\"h-2 bg-slate-700 rounded\"></div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <!-- menu items -->\r\n <div class=\"model-view-menu-container-mobile\">\r\n <lib-drop-down-menu [options]=\"tabsOptions\" [selected]=\"selectedTab\" (selectedChange)=\"navigateLink($event)\"></lib-drop-down-menu>\r\n </div>\r\n <div class=\"model-view-menu-container\">\r\n <nav class=\"model-view-menu-nav\">\r\n <div class=\"model-view-menu-item\">\r\n <ng-container *ngFor=\"let section of primary\">\r\n <a href=\"#\"\r\n [routerLinkActive]=\"['view-nav-link-active']\"\r\n [routerLink]=\"section.link\"\r\n [routerLinkActiveOptions]=\"{ exact: false }\"\r\n class=\"view-nav-link\">\r\n <i *ngIf=\"section.icon\" [class]=\"section.icon + ' mr-2'\"></i>\r\n {{section.text}}\r\n </a>\r\n </ng-container>\r\n </div>\r\n <div class=\"model-view-menu-item-far\">\r\n <ng-container *ngFor=\"let section of secondary\">\r\n <a href=\"#\"\r\n [routerLinkActive]=\"['view-nav-link-active']\"\r\n [routerLink]=\"section.link\"\r\n [routerLinkActiveOptions]=\"{ exact: false }\"\r\n class=\"view-nav-link\">\r\n <i *ngIf=\"section.icon\" [class]=\"section.icon + ' mr-2'\"></i>\r\n {{section.text}}\r\n </a>\r\n </ng-container>\r\n </div>\r\n </nav>\r\n </div>\r\n </div>\r\n </section>\r\n </aside>\r\n <div class=\"model-view-details-container\">\r\n <router-outlet></router-outlet>\r\n </div>\r\n </div>\r\n </main>\r\n", dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$1.RouterOutlet, selector: "router-outlet", inputs: ["name"], outputs: ["activate", "deactivate", "attach", "detach"], exportAs: ["outlet"] }, { kind: "directive", type: i1$1.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "directive", type: i1$1.RouterLinkActive, selector: "[routerLinkActive]", inputs: ["routerLinkActiveOptions", "ariaCurrentWhenActive", "routerLinkActive"], outputs: ["isActiveChange"], exportAs: ["routerLinkActive"] }, { kind: "component", type: DropDownMenuComponent, selector: "lib-drop-down-menu", inputs: ["options", "selected", "multiple", "placeholder", "show-icons"], outputs: ["selectedChange", "selectedChanged"] }, { kind: "component", type: ViewLayoutComponent, selector: "lib-view-layout", inputs: ["show-header", "fluid", "title", "icon", "actions", "busy", "search-placeholder", "view", "meta-items"], outputs: ["onAction", "onSearch"] }] }); }
3729
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.6", type: ModelViewLayoutComponent, selector: "lib-model-view-layout", inputs: { title: "title", primary: ["primary-links", "primary"], secondary: ["secondary-links", "secondary"], metaItems: ["meta-items", "metaItems"], icon: "icon", busy: "busy", actions: "actions" }, ngImport: i0, template: "<lib-view-layout [title]=\"title || ' '\" [meta-items]=\"metaItems\" [actions]=\"actions\" [icon]=\"icon\" [busy]=\"busy\">\r\n <main class=\"model-view-container\">\r\n <div class=\"model-view-container-inner\">\r\n <aside class=\"model-view-aside\">\r\n <section aria-labelledby=\"menu\" class=\"details-view-aside-header-section\">\r\n <div class=\"model-view-aside-header-container\">\r\n <div class=\"model-view-aside-header-container-inner\">\r\n <ng-content *ngIf=\"!busy\"></ng-content>\r\n\r\n <ng-container *ngIf=\"busy\">\r\n <div class=\"flex items-center p-5\">\r\n <div class=\"w-12 h-14 mr-4 rounded-lg bg-gray-200 animate-pulse\"></div>\r\n <div>\r\n <div class=\"h-6 w-48 bg-gray-200 rounded-lg animate-pulse\"></div>\r\n <div class=\"mt-1 h-4 w-40 bg-gray-200 rounded-lg animate-pulse\"></div>\r\n </div>\r\n </div>\r\n </ng-container>\r\n\r\n </div>\r\n <!-- menu items -->\r\n <div class=\"model-view-menu-container-mobile\">\r\n <lib-drop-down-menu [options]=\"tabsOptions\" [selected]=\"selectedTab\" (selectedChange)=\"navigateLink($event)\"></lib-drop-down-menu>\r\n </div>\r\n <div class=\"model-view-menu-container\">\r\n <nav class=\"model-view-menu-nav\">\r\n <div class=\"model-view-menu-item\">\r\n <ng-container *ngFor=\"let section of primary\">\r\n <a href=\"#\"\r\n [routerLinkActive]=\"['view-nav-link-active']\"\r\n [routerLink]=\"section.link\"\r\n [routerLinkActiveOptions]=\"{ exact: false }\"\r\n class=\"view-nav-link\">\r\n <i *ngIf=\"section.icon\" [class]=\"section.icon + ' mr-2'\"></i>\r\n {{section.text}}\r\n </a>\r\n </ng-container>\r\n </div>\r\n <div class=\"model-view-menu-item-far\">\r\n <ng-container *ngFor=\"let section of secondary\">\r\n <a href=\"#\"\r\n [routerLinkActive]=\"['view-nav-link-active']\"\r\n [routerLink]=\"section.link\"\r\n [routerLinkActiveOptions]=\"{ exact: false }\"\r\n class=\"view-nav-link\">\r\n <i *ngIf=\"section.icon\" [class]=\"section.icon + ' mr-2'\"></i>\r\n {{section.text}}\r\n </a>\r\n </ng-container>\r\n </div>\r\n </nav>\r\n </div>\r\n </div>\r\n </section>\r\n </aside>\r\n <div class=\"model-view-details-container\">\r\n <router-outlet></router-outlet>\r\n </div>\r\n </div>\r\n </main>\r\n", dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$1.RouterOutlet, selector: "router-outlet", inputs: ["name"], outputs: ["activate", "deactivate", "attach", "detach"], exportAs: ["outlet"] }, { kind: "directive", type: i1$1.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "directive", type: i1$1.RouterLinkActive, selector: "[routerLinkActive]", inputs: ["routerLinkActiveOptions", "ariaCurrentWhenActive", "routerLinkActive"], outputs: ["isActiveChange"], exportAs: ["routerLinkActive"] }, { kind: "component", type: DropDownMenuComponent, selector: "lib-drop-down-menu", inputs: ["options", "selected", "multiple", "placeholder", "show-icons"], outputs: ["selectedChange", "selectedChanged"] }, { kind: "component", type: ViewLayoutComponent, selector: "lib-view-layout", inputs: ["show-header", "fluid", "title", "icon", "actions", "busy", "search-placeholder", "view", "meta-items"], outputs: ["onAction", "onSearch"] }] }); }
3705
3730
  }
3706
3731
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.6", ngImport: i0, type: ModelViewLayoutComponent, decorators: [{
3707
3732
  type: Component,
3708
- args: [{ selector: 'lib-model-view-layout', template: "<lib-view-layout [title]=\"title\" [meta-items]=\"metaItems\" [actions]=\"actions\" [icon]=\"icon\" [busy]=\"busy\">\r\n <main class=\"model-view-container\">\r\n <div class=\"model-view-container-inner\">\r\n <aside class=\"model-view-aside\">\r\n <section aria-labelledby=\"menu\" class=\"details-view-aside-header-section\">\r\n <div class=\"model-view-aside-header-container\">\r\n <div class=\"model-view-aside-header-container-inner\">\r\n <ng-content *ngIf=\"!busy\"></ng-content>\r\n <div *ngIf=\"busy\" class=\"max-w-64 animate-pulse flex space-x-4\">\r\n <div class=\"rounded-full bg-slate-700 h-10 w-10\"></div>\r\n <div class=\"flex-1 space-y-6 py-1\">\r\n <div class=\"h-2 bg-slate-700 rounded\"></div>\r\n <div class=\"space-y-3\">\r\n <div class=\"grid grid-cols-3 gap-4\">\r\n <div class=\"h-2 bg-slate-700 rounded col-span-2\"></div>\r\n <div class=\"h-2 bg-slate-700 rounded col-span-1\"></div>\r\n </div>\r\n <div class=\"h-2 bg-slate-700 rounded\"></div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <!-- menu items -->\r\n <div class=\"model-view-menu-container-mobile\">\r\n <lib-drop-down-menu [options]=\"tabsOptions\" [selected]=\"selectedTab\" (selectedChange)=\"navigateLink($event)\"></lib-drop-down-menu>\r\n </div>\r\n <div class=\"model-view-menu-container\">\r\n <nav class=\"model-view-menu-nav\">\r\n <div class=\"model-view-menu-item\">\r\n <ng-container *ngFor=\"let section of primary\">\r\n <a href=\"#\"\r\n [routerLinkActive]=\"['view-nav-link-active']\"\r\n [routerLink]=\"section.link\"\r\n [routerLinkActiveOptions]=\"{ exact: false }\"\r\n class=\"view-nav-link\">\r\n <i *ngIf=\"section.icon\" [class]=\"section.icon + ' mr-2'\"></i>\r\n {{section.text}}\r\n </a>\r\n </ng-container>\r\n </div>\r\n <div class=\"model-view-menu-item-far\">\r\n <ng-container *ngFor=\"let section of secondary\">\r\n <a href=\"#\"\r\n [routerLinkActive]=\"['view-nav-link-active']\"\r\n [routerLink]=\"section.link\"\r\n [routerLinkActiveOptions]=\"{ exact: false }\"\r\n class=\"view-nav-link\">\r\n <i *ngIf=\"section.icon\" [class]=\"section.icon + ' mr-2'\"></i>\r\n {{section.text}}\r\n </a>\r\n </ng-container>\r\n </div>\r\n </nav>\r\n </div>\r\n </div>\r\n </section>\r\n </aside>\r\n <div class=\"model-view-details-container\">\r\n <router-outlet></router-outlet>\r\n </div>\r\n </div>\r\n </main>\r\n" }]
3733
+ args: [{ selector: 'lib-model-view-layout', template: "<lib-view-layout [title]=\"title || ' '\" [meta-items]=\"metaItems\" [actions]=\"actions\" [icon]=\"icon\" [busy]=\"busy\">\r\n <main class=\"model-view-container\">\r\n <div class=\"model-view-container-inner\">\r\n <aside class=\"model-view-aside\">\r\n <section aria-labelledby=\"menu\" class=\"details-view-aside-header-section\">\r\n <div class=\"model-view-aside-header-container\">\r\n <div class=\"model-view-aside-header-container-inner\">\r\n <ng-content *ngIf=\"!busy\"></ng-content>\r\n\r\n <ng-container *ngIf=\"busy\">\r\n <div class=\"flex items-center p-5\">\r\n <div class=\"w-12 h-14 mr-4 rounded-lg bg-gray-200 animate-pulse\"></div>\r\n <div>\r\n <div class=\"h-6 w-48 bg-gray-200 rounded-lg animate-pulse\"></div>\r\n <div class=\"mt-1 h-4 w-40 bg-gray-200 rounded-lg animate-pulse\"></div>\r\n </div>\r\n </div>\r\n </ng-container>\r\n\r\n </div>\r\n <!-- menu items -->\r\n <div class=\"model-view-menu-container-mobile\">\r\n <lib-drop-down-menu [options]=\"tabsOptions\" [selected]=\"selectedTab\" (selectedChange)=\"navigateLink($event)\"></lib-drop-down-menu>\r\n </div>\r\n <div class=\"model-view-menu-container\">\r\n <nav class=\"model-view-menu-nav\">\r\n <div class=\"model-view-menu-item\">\r\n <ng-container *ngFor=\"let section of primary\">\r\n <a href=\"#\"\r\n [routerLinkActive]=\"['view-nav-link-active']\"\r\n [routerLink]=\"section.link\"\r\n [routerLinkActiveOptions]=\"{ exact: false }\"\r\n class=\"view-nav-link\">\r\n <i *ngIf=\"section.icon\" [class]=\"section.icon + ' mr-2'\"></i>\r\n {{section.text}}\r\n </a>\r\n </ng-container>\r\n </div>\r\n <div class=\"model-view-menu-item-far\">\r\n <ng-container *ngFor=\"let section of secondary\">\r\n <a href=\"#\"\r\n [routerLinkActive]=\"['view-nav-link-active']\"\r\n [routerLink]=\"section.link\"\r\n [routerLinkActiveOptions]=\"{ exact: false }\"\r\n class=\"view-nav-link\">\r\n <i *ngIf=\"section.icon\" [class]=\"section.icon + ' mr-2'\"></i>\r\n {{section.text}}\r\n </a>\r\n </ng-container>\r\n </div>\r\n </nav>\r\n </div>\r\n </div>\r\n </section>\r\n </aside>\r\n <div class=\"model-view-details-container\">\r\n <router-outlet></router-outlet>\r\n </div>\r\n </div>\r\n </main>\r\n" }]
3709
3734
  }], ctorParameters: () => [{ type: i1.Location }, { type: i1$1.Router }, { type: i1$1.ActivatedRoute }], propDecorators: { title: [{
3710
3735
  type: Input
3711
3736
  }], primary: [{
@@ -3876,7 +3901,7 @@ class FormLayoutComponent {
3876
3901
  }
3877
3902
  }
3878
3903
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.6", ngImport: i0, type: FormLayoutComponent, deps: [{ token: i1$1.Router }], target: i0.ɵɵFactoryTarget.Component }); }
3879
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.6", type: FormLayoutComponent, selector: "lib-form-layout", inputs: { title: "title", image: "image", icon: "icon", 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, template: "<div class=\"form-layout-container\">\r\n <div class=\"form-header\" *ngIf=\"title || subTitle || actions\">\r\n <div class=\"flex\">\r\n <div class=\"mr-4 flex-shrink-0\" *ngIf=\"image\">\r\n <img alt=\"form tab image\" class=\"form-header-image\" [src]=\"image\">\r\n </div>\r\n <div class=\"mr-4 flex-shrink-0\" *ngIf=\"icon\">\r\n <i [class]=\"icon\" class=\"form-header-icon\"></i>\r\n </div>\r\n <div class=\"form-header-inner\">\r\n <h3 class=\"form-title\">{{ title }}</h3>\r\n <p class=\"form-subtitle\">{{ subTitle }}</p>\r\n </div>\r\n </div>\r\n \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", dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i1.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "directive", type: i1.NgSwitchDefault, selector: "[ngSwitchDefault]" }, { kind: "directive", type: i1$1.RouterOutlet, selector: "router-outlet", inputs: ["name"], outputs: ["activate", "deactivate", "attach", "detach"], exportAs: ["outlet"] }, { kind: "component", type: SidePaneComponent, selector: "lib-side-pane", inputs: ["visible"], outputs: ["onComplete", "onOpen", "onClose"] }] }); }
3904
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.6", type: FormLayoutComponent, selector: "lib-form-layout", inputs: { title: "title", image: "image", icon: "icon", 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, template: "<div class=\"form-layout-container\">\r\n <div class=\"form-header\" *ngIf=\"title || subTitle || actions\">\r\n <div class=\"flex\">\r\n <div class=\"mr-4 flex-shrink-0\" *ngIf=\"image\">\r\n <img alt=\"form tab image\" class=\"form-header-image\" [src]=\"image\">\r\n </div>\r\n <div class=\"mr-4 flex-shrink-0\" *ngIf=\"icon\">\r\n <i [class]=\"icon\" class=\"form-header-icon\"></i>\r\n </div>\r\n <div class=\"form-header-inner\">\r\n <h3 class=\"form-title\">{{ title }}</h3>\r\n <p class=\"form-subtitle\">{{ subTitle }}</p>\r\n </div>\r\n </div>\r\n \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", dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i1.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "directive", type: i1.NgSwitchDefault, selector: "[ngSwitchDefault]" }, { kind: "directive", type: i1$1.RouterOutlet, selector: "router-outlet", inputs: ["name"], outputs: ["activate", "deactivate", "attach", "detach"], exportAs: ["outlet"] }, { kind: "component", type: SidePaneComponent, selector: "lib-side-pane", inputs: ["visible", "size"], outputs: ["onComplete", "onOpen", "onClose"] }] }); }
3880
3905
  }
3881
3906
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.6", ngImport: i0, type: FormLayoutComponent, decorators: [{
3882
3907
  type: Component,
@@ -3986,11 +4011,11 @@ class ErrorComponent {
3986
4011
  ngOnInit() {
3987
4012
  }
3988
4013
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.6", ngImport: i0, type: ErrorComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
3989
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.6", type: ErrorComponent, selector: "lib-error", ngImport: i0, template: "<lib-view-layout [show-header]=\"false\" title=\"500 - \u03C0\u03B1\u03C1\u03BF\u03C5\u03C3\u03B9\u03AC\u03C3\u03C4\u03B7\u03BA\u03B5 \u03C3\u03C6\u03AC\u03BB\u03BC\u03B1!\">\r\n <div class=\"bg-gray-600 view-container\">\r\n <div class=\"max-w-2xl mx-auto text-center py-16 px-4 sm:py-20 sm:px-6 lg:px-8\">\r\n <h2 class=\"text-3xl font-extrabold text-white sm:text-4xl\">\r\n <span class=\"block\">500</span>\r\n </h2>\r\n <p class=\"mt-4 text-lg leading-6 text-gray-200\">\u03C3\u03C6\u03AC\u03BB\u03BC\u03B1, \u03BA\u03B1\u03C4\u03B9 \u03B4\u03B5\u03BD \u03C0\u03AE\u03B3\u03B5 \u03BA\u03B1\u03BB\u03AC...!</p>\r\n <a href=\"/\" class=\"mt-8 inline-flex items-center justify-center px-5 py-3 border border-transparent text-base font-sm rounded-sm text-gray-600 bg-white hover:bg-gray-50 sm:w-auto\">\r\n \u03C0\u03B1\u03C4\u03AE\u03C3\u03C4\u03B5 \u03B5\u03B4\u03CE \u03B3\u03B9\u03B1 \u03BD\u03B1 \u03B5\u03C0\u03B9\u03C3\u03C4\u03C1\u03AD\u03C8\u03B5\u03C4\u03B5\r\n </a>\r\n </div>\r\n </div>\r\n</lib-view-layout>\r\n", dependencies: [{ kind: "component", type: ViewLayoutComponent, selector: "lib-view-layout", inputs: ["show-header", "fluid", "title", "icon", "actions", "busy", "search-placeholder", "view", "meta-items"], outputs: ["onAction", "onSearch"] }] }); }
4014
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.6", type: ErrorComponent, selector: "lib-error", ngImport: i0, template: "<lib-view-layout [show-header]=\"false\" title=\"500 - \u03C0\u03B1\u03C1\u03BF\u03C5\u03C3\u03B9\u03AC\u03C3\u03C4\u03B7\u03BA\u03B5 \u03C3\u03C6\u03AC\u03BB\u03BC\u03B1!\">\r\n <div class=\"bg-gray-600 view-container\">\r\n <div class=\"max-w-2xl mx-auto text-center py-16 px-4 sm:py-20 sm:px-6 lg:px-8\">\r\n <h2 class=\"text-3xl font-extrabold text-white sm:text-4xl\">\r\n <span class=\"block\">500</span>\r\n </h2>\r\n <p class=\"mt-4 text-lg leading-6 text-gray-200\">\u03C3\u03C6\u03AC\u03BB\u03BC\u03B1, \u03BA\u03B1\u03C4\u03B9 \u03B4\u03B5\u03BD \u03C0\u03AE\u03B3\u03B5 \u03BA\u03B1\u03BB\u03AC...!</p>\r\n <a href=\"/\" class=\"mt-8 inline-flex items-center justify-center px-5 py-3 border border-transparent text-base font-sm rounded-lg text-gray-600 bg-white hover:bg-gray-50 sm:w-auto\">\r\n \u03C0\u03B1\u03C4\u03AE\u03C3\u03C4\u03B5 \u03B5\u03B4\u03CE \u03B3\u03B9\u03B1 \u03BD\u03B1 \u03B5\u03C0\u03B9\u03C3\u03C4\u03C1\u03AD\u03C8\u03B5\u03C4\u03B5\r\n </a>\r\n </div>\r\n </div>\r\n</lib-view-layout>\r\n", dependencies: [{ kind: "component", type: ViewLayoutComponent, selector: "lib-view-layout", inputs: ["show-header", "fluid", "title", "icon", "actions", "busy", "search-placeholder", "view", "meta-items"], outputs: ["onAction", "onSearch"] }] }); }
3990
4015
  }
3991
4016
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.6", ngImport: i0, type: ErrorComponent, decorators: [{
3992
4017
  type: Component,
3993
- args: [{ selector: 'lib-error', template: "<lib-view-layout [show-header]=\"false\" title=\"500 - \u03C0\u03B1\u03C1\u03BF\u03C5\u03C3\u03B9\u03AC\u03C3\u03C4\u03B7\u03BA\u03B5 \u03C3\u03C6\u03AC\u03BB\u03BC\u03B1!\">\r\n <div class=\"bg-gray-600 view-container\">\r\n <div class=\"max-w-2xl mx-auto text-center py-16 px-4 sm:py-20 sm:px-6 lg:px-8\">\r\n <h2 class=\"text-3xl font-extrabold text-white sm:text-4xl\">\r\n <span class=\"block\">500</span>\r\n </h2>\r\n <p class=\"mt-4 text-lg leading-6 text-gray-200\">\u03C3\u03C6\u03AC\u03BB\u03BC\u03B1, \u03BA\u03B1\u03C4\u03B9 \u03B4\u03B5\u03BD \u03C0\u03AE\u03B3\u03B5 \u03BA\u03B1\u03BB\u03AC...!</p>\r\n <a href=\"/\" class=\"mt-8 inline-flex items-center justify-center px-5 py-3 border border-transparent text-base font-sm rounded-sm text-gray-600 bg-white hover:bg-gray-50 sm:w-auto\">\r\n \u03C0\u03B1\u03C4\u03AE\u03C3\u03C4\u03B5 \u03B5\u03B4\u03CE \u03B3\u03B9\u03B1 \u03BD\u03B1 \u03B5\u03C0\u03B9\u03C3\u03C4\u03C1\u03AD\u03C8\u03B5\u03C4\u03B5\r\n </a>\r\n </div>\r\n </div>\r\n</lib-view-layout>\r\n" }]
4018
+ args: [{ selector: 'lib-error', template: "<lib-view-layout [show-header]=\"false\" title=\"500 - \u03C0\u03B1\u03C1\u03BF\u03C5\u03C3\u03B9\u03AC\u03C3\u03C4\u03B7\u03BA\u03B5 \u03C3\u03C6\u03AC\u03BB\u03BC\u03B1!\">\r\n <div class=\"bg-gray-600 view-container\">\r\n <div class=\"max-w-2xl mx-auto text-center py-16 px-4 sm:py-20 sm:px-6 lg:px-8\">\r\n <h2 class=\"text-3xl font-extrabold text-white sm:text-4xl\">\r\n <span class=\"block\">500</span>\r\n </h2>\r\n <p class=\"mt-4 text-lg leading-6 text-gray-200\">\u03C3\u03C6\u03AC\u03BB\u03BC\u03B1, \u03BA\u03B1\u03C4\u03B9 \u03B4\u03B5\u03BD \u03C0\u03AE\u03B3\u03B5 \u03BA\u03B1\u03BB\u03AC...!</p>\r\n <a href=\"/\" class=\"mt-8 inline-flex items-center justify-center px-5 py-3 border border-transparent text-base font-sm rounded-lg text-gray-600 bg-white hover:bg-gray-50 sm:w-auto\">\r\n \u03C0\u03B1\u03C4\u03AE\u03C3\u03C4\u03B5 \u03B5\u03B4\u03CE \u03B3\u03B9\u03B1 \u03BD\u03B1 \u03B5\u03C0\u03B9\u03C3\u03C4\u03C1\u03AD\u03C8\u03B5\u03C4\u03B5\r\n </a>\r\n </div>\r\n </div>\r\n</lib-view-layout>\r\n" }]
3994
4019
  }] });
3995
4020
 
3996
4021
  class PageNotFoundComponent {
@@ -3998,22 +4023,22 @@ class PageNotFoundComponent {
3998
4023
  ngOnInit() {
3999
4024
  }
4000
4025
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.6", ngImport: i0, type: PageNotFoundComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
4001
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.6", type: PageNotFoundComponent, selector: "lib-page-not-found", ngImport: i0, template: "<lib-view-layout [show-header]=\"false\" title=\"404 - \u03B4\u03B5\u03BD \u03B2\u03C1\u03AD\u03B8\u03B7\u03BA\u03B5!\">\r\n <div class=\"text-gray-900\">\r\n <div class=\"max-w-4xl mx-auto text-center py-16 px-4 sm:py-20 sm:px-6 lg:px-8\">\r\n <h2 class=\"text-3xl font-extrabold sm:text-4xl\">\r\n <span class=\"block\">404</span>\r\n </h2>\r\n <p class=\"mt-4 text-lg leading-6 text-gray-800\">\u03B4\u03B5\u03BD \u03B2\u03C1\u03AD\u03B8\u03B7\u03BA\u03B5 \u03B7 \u03C3\u03B5\u03BB\u03AF\u03B4\u03B1 \u03C0\u03BF\u03C5 \u03B6\u03B7\u03C4\u03AE\u03C3\u03B1\u03C4\u03B5!</p>\r\n <a href=\"/\"\r\n class=\"mt-8 inline-flex items-center justify-center px-5 py-3 border border-transparent text-base font-sm rounded-sm text-gray-600 bg-white hover:bg-gray-50 sm:w-auto\">\r\n \u03C0\u03B1\u03C4\u03AE\u03C3\u03C4\u03B5 \u03B5\u03B4\u03CE \u03B3\u03B9\u03B1 \u03BD\u03B1 \u03B5\u03C0\u03B9\u03C3\u03C4\u03C1\u03AD\u03C8\u03B5\u03C4\u03B5\r\n </a>\r\n </div>\r\n </div>\r\n</lib-view-layout>\r\n", dependencies: [{ kind: "component", type: ViewLayoutComponent, selector: "lib-view-layout", inputs: ["show-header", "fluid", "title", "icon", "actions", "busy", "search-placeholder", "view", "meta-items"], outputs: ["onAction", "onSearch"] }] }); }
4026
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.6", type: PageNotFoundComponent, selector: "lib-page-not-found", ngImport: i0, template: "<lib-view-layout [show-header]=\"false\" title=\"404 - \u03B4\u03B5\u03BD \u03B2\u03C1\u03AD\u03B8\u03B7\u03BA\u03B5!\">\r\n <div class=\"text-gray-900\">\r\n <div class=\"max-w-4xl mx-auto text-center py-16 px-4 sm:py-20 sm:px-6 lg:px-8\">\r\n <h2 class=\"text-3xl font-extrabold sm:text-4xl\">\r\n <span class=\"block\">404</span>\r\n </h2>\r\n <p class=\"mt-4 text-lg leading-6 text-gray-800\">\u03B4\u03B5\u03BD \u03B2\u03C1\u03AD\u03B8\u03B7\u03BA\u03B5 \u03B7 \u03C3\u03B5\u03BB\u03AF\u03B4\u03B1 \u03C0\u03BF\u03C5 \u03B6\u03B7\u03C4\u03AE\u03C3\u03B1\u03C4\u03B5!</p>\r\n <a href=\"/\"\r\n class=\"mt-8 inline-flex items-center justify-center px-5 py-3 border border-transparent text-base font-sm rounded-lg text-gray-600 bg-white hover:bg-gray-50 sm:w-auto\">\r\n \u03C0\u03B1\u03C4\u03AE\u03C3\u03C4\u03B5 \u03B5\u03B4\u03CE \u03B3\u03B9\u03B1 \u03BD\u03B1 \u03B5\u03C0\u03B9\u03C3\u03C4\u03C1\u03AD\u03C8\u03B5\u03C4\u03B5\r\n </a>\r\n </div>\r\n </div>\r\n</lib-view-layout>\r\n", dependencies: [{ kind: "component", type: ViewLayoutComponent, selector: "lib-view-layout", inputs: ["show-header", "fluid", "title", "icon", "actions", "busy", "search-placeholder", "view", "meta-items"], outputs: ["onAction", "onSearch"] }] }); }
4002
4027
  }
4003
4028
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.6", ngImport: i0, type: PageNotFoundComponent, decorators: [{
4004
4029
  type: Component,
4005
- args: [{ selector: 'lib-page-not-found', template: "<lib-view-layout [show-header]=\"false\" title=\"404 - \u03B4\u03B5\u03BD \u03B2\u03C1\u03AD\u03B8\u03B7\u03BA\u03B5!\">\r\n <div class=\"text-gray-900\">\r\n <div class=\"max-w-4xl mx-auto text-center py-16 px-4 sm:py-20 sm:px-6 lg:px-8\">\r\n <h2 class=\"text-3xl font-extrabold sm:text-4xl\">\r\n <span class=\"block\">404</span>\r\n </h2>\r\n <p class=\"mt-4 text-lg leading-6 text-gray-800\">\u03B4\u03B5\u03BD \u03B2\u03C1\u03AD\u03B8\u03B7\u03BA\u03B5 \u03B7 \u03C3\u03B5\u03BB\u03AF\u03B4\u03B1 \u03C0\u03BF\u03C5 \u03B6\u03B7\u03C4\u03AE\u03C3\u03B1\u03C4\u03B5!</p>\r\n <a href=\"/\"\r\n class=\"mt-8 inline-flex items-center justify-center px-5 py-3 border border-transparent text-base font-sm rounded-sm text-gray-600 bg-white hover:bg-gray-50 sm:w-auto\">\r\n \u03C0\u03B1\u03C4\u03AE\u03C3\u03C4\u03B5 \u03B5\u03B4\u03CE \u03B3\u03B9\u03B1 \u03BD\u03B1 \u03B5\u03C0\u03B9\u03C3\u03C4\u03C1\u03AD\u03C8\u03B5\u03C4\u03B5\r\n </a>\r\n </div>\r\n </div>\r\n</lib-view-layout>\r\n" }]
4030
+ args: [{ selector: 'lib-page-not-found', template: "<lib-view-layout [show-header]=\"false\" title=\"404 - \u03B4\u03B5\u03BD \u03B2\u03C1\u03AD\u03B8\u03B7\u03BA\u03B5!\">\r\n <div class=\"text-gray-900\">\r\n <div class=\"max-w-4xl mx-auto text-center py-16 px-4 sm:py-20 sm:px-6 lg:px-8\">\r\n <h2 class=\"text-3xl font-extrabold sm:text-4xl\">\r\n <span class=\"block\">404</span>\r\n </h2>\r\n <p class=\"mt-4 text-lg leading-6 text-gray-800\">\u03B4\u03B5\u03BD \u03B2\u03C1\u03AD\u03B8\u03B7\u03BA\u03B5 \u03B7 \u03C3\u03B5\u03BB\u03AF\u03B4\u03B1 \u03C0\u03BF\u03C5 \u03B6\u03B7\u03C4\u03AE\u03C3\u03B1\u03C4\u03B5!</p>\r\n <a href=\"/\"\r\n class=\"mt-8 inline-flex items-center justify-center px-5 py-3 border border-transparent text-base font-sm rounded-lg text-gray-600 bg-white hover:bg-gray-50 sm:w-auto\">\r\n \u03C0\u03B1\u03C4\u03AE\u03C3\u03C4\u03B5 \u03B5\u03B4\u03CE \u03B3\u03B9\u03B1 \u03BD\u03B1 \u03B5\u03C0\u03B9\u03C3\u03C4\u03C1\u03AD\u03C8\u03B5\u03C4\u03B5\r\n </a>\r\n </div>\r\n </div>\r\n</lib-view-layout>\r\n" }]
4006
4031
  }], ctorParameters: () => [] });
4007
4032
 
4008
4033
  class UnauthorizedComponent {
4009
4034
  constructor() { }
4010
4035
  ngOnInit() { }
4011
4036
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.6", ngImport: i0, type: UnauthorizedComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
4012
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.6", type: UnauthorizedComponent, selector: "lib-unauthorized", ngImport: i0, template: "<lib-view-layout [show-header]=\"false\" title=\"401 - \u03B4\u03B5\u03BD \u03B5\u03C0\u03B9\u03C4\u03C1\u03AD\u03C0\u03B5\u03C4\u03B1\u03B9 \u03B7 \u03C0\u03C1\u03CC\u03C3\u03B2\u03B1\u03C3\u03B7!\">\r\n <div class=\"bg-gray-600 view-container\">\r\n <div class=\"max-w-2xl mx-auto text-center py-16 px-4 sm:py-20 sm:px-6 lg:px-8\">\r\n <h2 class=\"text-3xl font-extrabold text-white sm:text-4xl\">\r\n <span class=\"block\">401</span>\r\n </h2>\r\n <p class=\"mt-4 text-lg leading-6 text-gray-200\">\u03B4\u03B5\u03BD \u03AD\u03C7\u03B5\u03C4\u03B5 \u03C4\u03B1 \u03BA\u03B1\u03C4\u03AC\u03BB\u03BB\u03B7\u03BB\u03B1 \u03B4\u03B9\u03BA\u03B1\u03B9\u03CE\u03BC\u03B1\u03C4\u03B1 \u03C0\u03C1\u03CC\u03C3\u03B2\u03B1\u03C3\u03B7\u03C2!</p>\r\n <a href=\"/\" class=\"mt-8 inline-flex items-center justify-center px-5 py-3 border border-transparent text-base font-sm rounded-sm text-gray-600 bg-white hover:bg-gray-50 sm:w-auto\">\r\n \u03C0\u03B1\u03C4\u03AE\u03C3\u03C4\u03B5 \u03B5\u03B4\u03CE \u03B3\u03B9\u03B1 \u03BD\u03B1 \u03B5\u03C0\u03B9\u03C3\u03C4\u03C1\u03AD\u03C8\u03B5\u03C4\u03B5\r\n </a>\r\n </div>\r\n </div>\r\n </lib-view-layout>\r\n\r\n\r\n", dependencies: [{ kind: "component", type: ViewLayoutComponent, selector: "lib-view-layout", inputs: ["show-header", "fluid", "title", "icon", "actions", "busy", "search-placeholder", "view", "meta-items"], outputs: ["onAction", "onSearch"] }] }); }
4037
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.6", type: UnauthorizedComponent, selector: "lib-unauthorized", ngImport: i0, template: "<lib-view-layout [show-header]=\"false\" title=\"401 - \u03B4\u03B5\u03BD \u03B5\u03C0\u03B9\u03C4\u03C1\u03AD\u03C0\u03B5\u03C4\u03B1\u03B9 \u03B7 \u03C0\u03C1\u03CC\u03C3\u03B2\u03B1\u03C3\u03B7!\">\r\n <div class=\"bg-gray-600 view-container\">\r\n <div class=\"max-w-2xl mx-auto text-center py-16 px-4 sm:py-20 sm:px-6 lg:px-8\">\r\n <h2 class=\"text-3xl font-extrabold text-white sm:text-4xl\">\r\n <span class=\"block\">401</span>\r\n </h2>\r\n <p class=\"mt-4 text-lg leading-6 text-gray-200\">\u03B4\u03B5\u03BD \u03AD\u03C7\u03B5\u03C4\u03B5 \u03C4\u03B1 \u03BA\u03B1\u03C4\u03AC\u03BB\u03BB\u03B7\u03BB\u03B1 \u03B4\u03B9\u03BA\u03B1\u03B9\u03CE\u03BC\u03B1\u03C4\u03B1 \u03C0\u03C1\u03CC\u03C3\u03B2\u03B1\u03C3\u03B7\u03C2!</p>\r\n <a href=\"/\" class=\"mt-8 inline-flex items-center justify-center px-5 py-3 border border-transparent text-base font-sm rounded-lg text-gray-600 bg-white hover:bg-gray-50 sm:w-auto\">\r\n \u03C0\u03B1\u03C4\u03AE\u03C3\u03C4\u03B5 \u03B5\u03B4\u03CE \u03B3\u03B9\u03B1 \u03BD\u03B1 \u03B5\u03C0\u03B9\u03C3\u03C4\u03C1\u03AD\u03C8\u03B5\u03C4\u03B5\r\n </a>\r\n </div>\r\n </div>\r\n </lib-view-layout>\r\n\r\n\r\n", dependencies: [{ kind: "component", type: ViewLayoutComponent, selector: "lib-view-layout", inputs: ["show-header", "fluid", "title", "icon", "actions", "busy", "search-placeholder", "view", "meta-items"], outputs: ["onAction", "onSearch"] }] }); }
4013
4038
  }
4014
4039
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.6", ngImport: i0, type: UnauthorizedComponent, decorators: [{
4015
4040
  type: Component,
4016
- args: [{ selector: 'lib-unauthorized', template: "<lib-view-layout [show-header]=\"false\" title=\"401 - \u03B4\u03B5\u03BD \u03B5\u03C0\u03B9\u03C4\u03C1\u03AD\u03C0\u03B5\u03C4\u03B1\u03B9 \u03B7 \u03C0\u03C1\u03CC\u03C3\u03B2\u03B1\u03C3\u03B7!\">\r\n <div class=\"bg-gray-600 view-container\">\r\n <div class=\"max-w-2xl mx-auto text-center py-16 px-4 sm:py-20 sm:px-6 lg:px-8\">\r\n <h2 class=\"text-3xl font-extrabold text-white sm:text-4xl\">\r\n <span class=\"block\">401</span>\r\n </h2>\r\n <p class=\"mt-4 text-lg leading-6 text-gray-200\">\u03B4\u03B5\u03BD \u03AD\u03C7\u03B5\u03C4\u03B5 \u03C4\u03B1 \u03BA\u03B1\u03C4\u03AC\u03BB\u03BB\u03B7\u03BB\u03B1 \u03B4\u03B9\u03BA\u03B1\u03B9\u03CE\u03BC\u03B1\u03C4\u03B1 \u03C0\u03C1\u03CC\u03C3\u03B2\u03B1\u03C3\u03B7\u03C2!</p>\r\n <a href=\"/\" class=\"mt-8 inline-flex items-center justify-center px-5 py-3 border border-transparent text-base font-sm rounded-sm text-gray-600 bg-white hover:bg-gray-50 sm:w-auto\">\r\n \u03C0\u03B1\u03C4\u03AE\u03C3\u03C4\u03B5 \u03B5\u03B4\u03CE \u03B3\u03B9\u03B1 \u03BD\u03B1 \u03B5\u03C0\u03B9\u03C3\u03C4\u03C1\u03AD\u03C8\u03B5\u03C4\u03B5\r\n </a>\r\n </div>\r\n </div>\r\n </lib-view-layout>\r\n\r\n\r\n" }]
4041
+ args: [{ selector: 'lib-unauthorized', template: "<lib-view-layout [show-header]=\"false\" title=\"401 - \u03B4\u03B5\u03BD \u03B5\u03C0\u03B9\u03C4\u03C1\u03AD\u03C0\u03B5\u03C4\u03B1\u03B9 \u03B7 \u03C0\u03C1\u03CC\u03C3\u03B2\u03B1\u03C3\u03B7!\">\r\n <div class=\"bg-gray-600 view-container\">\r\n <div class=\"max-w-2xl mx-auto text-center py-16 px-4 sm:py-20 sm:px-6 lg:px-8\">\r\n <h2 class=\"text-3xl font-extrabold text-white sm:text-4xl\">\r\n <span class=\"block\">401</span>\r\n </h2>\r\n <p class=\"mt-4 text-lg leading-6 text-gray-200\">\u03B4\u03B5\u03BD \u03AD\u03C7\u03B5\u03C4\u03B5 \u03C4\u03B1 \u03BA\u03B1\u03C4\u03AC\u03BB\u03BB\u03B7\u03BB\u03B1 \u03B4\u03B9\u03BA\u03B1\u03B9\u03CE\u03BC\u03B1\u03C4\u03B1 \u03C0\u03C1\u03CC\u03C3\u03B2\u03B1\u03C3\u03B7\u03C2!</p>\r\n <a href=\"/\" class=\"mt-8 inline-flex items-center justify-center px-5 py-3 border border-transparent text-base font-sm rounded-lg text-gray-600 bg-white hover:bg-gray-50 sm:w-auto\">\r\n \u03C0\u03B1\u03C4\u03AE\u03C3\u03C4\u03B5 \u03B5\u03B4\u03CE \u03B3\u03B9\u03B1 \u03BD\u03B1 \u03B5\u03C0\u03B9\u03C3\u03C4\u03C1\u03AD\u03C8\u03B5\u03C4\u03B5\r\n </a>\r\n </div>\r\n </div>\r\n </lib-view-layout>\r\n\r\n\r\n" }]
4017
4042
  }], ctorParameters: () => [] });
4018
4043
 
4019
4044
  class AddressPipe {
@@ -4157,6 +4182,7 @@ class BaseListComponent {
4157
4182
  this.searchOptions = [];
4158
4183
  this.sortOptions = [];
4159
4184
  this.metaItems = [];
4185
+ this.autoLoad = true;
4160
4186
  }
4161
4187
  ngOnDestroy() {
4162
4188
  if (this.routeSub$) {
@@ -4217,7 +4243,8 @@ class BaseListComponent {
4217
4243
  });
4218
4244
  // just to sync params in query
4219
4245
  this.setRouteParams(true);
4220
- this.load();
4246
+ if (this.autoLoad)
4247
+ this.load();
4221
4248
  }
4222
4249
  /**
4223
4250
  * Get filters from a querystring
@@ -4354,12 +4381,15 @@ class BaseListComponent {
4354
4381
  this.load();
4355
4382
  }
4356
4383
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.6", ngImport: i0, type: BaseListComponent, deps: [{ token: i1$1.ActivatedRoute }, { token: i1$1.Router }], target: i0.ɵɵFactoryTarget.Component }); }
4357
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.6", type: BaseListComponent, selector: "ng-component", ngImport: i0, template: '', isInline: true }); }
4384
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.6", type: BaseListComponent, selector: "ng-component", inputs: { autoLoad: ["auto-load", "autoLoad"] }, ngImport: i0, template: '', isInline: true }); }
4358
4385
  }
4359
4386
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.6", ngImport: i0, type: BaseListComponent, decorators: [{
4360
4387
  type: Component,
4361
4388
  args: [{ template: '' }]
4362
- }], ctorParameters: () => [{ type: i1$1.ActivatedRoute }, { type: i1$1.Router }] });
4389
+ }], ctorParameters: () => [{ type: i1$1.ActivatedRoute }, { type: i1$1.Router }], propDecorators: { autoLoad: [{
4390
+ type: Input,
4391
+ args: ['auto-load']
4392
+ }] } });
4363
4393
 
4364
4394
  const cssClassNames = {
4365
4395
  backdrop: 'modal-backdrop',
@@ -5062,5 +5092,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.6", ngImpor
5062
5092
  * Generated bundle index. Do not edit.
5063
5093
  */
5064
5094
 
5065
- export { APP_LANGUAGES, APP_LINKS, APP_NOTIFICATIONS, AddressPipe, AdvancedSearchComponent, AuthCallbackComponent, AuthRenewComponent, AvatarInitialsComponent, BaseListComponent, BreadcrumbComponent, BreadcrumbItem, BreadcrumbRouteData, BreadcrumbService, ClickOutsideDirective, CollapsiblePanelComponent, ComboboxComponent, ComponentLoaderFactory, ContentTileComponent, ContentTileHeaderComponent, ContentTileItemComponent, DatepickerComponent, DefaultShellConfig, DropDownMenuComponent, DurationFormatPipe, ErrorComponent, ExternalNavLink, FilterClause, FormLayoutComponent, FragmentNavLink, HeaderMetaItem, Icons, IndiceComponentsModule, KpiTileComponent, LIBSTEPPER_ACCESSOR, LIBTABGROUP_ACCESSOR, LibStepComponent, LibStepInfoDirective, LibStepLabelDirective, LibStepperComponent, LibTabComponent, LibTabGroupComponent, LibTabLabelDirective, ListColumnComponent, ListDetailsSectionComponent, ListTileComponent, ListViewComponent, ListViewEmptyStateComponent, ListViewType, LoggedOutComponent, MODAL_CONFIG_DEFAULT_OVERRIDE, MenuOption, Modal, ModalOptions, ModalService, ModelViewLayoutComponent, NULL_TOAST, NavLink, NavLinksListComponent, NotificationNavLink, OperatorOptions, Operators, PageNotFoundComponent, PagerComponent, PagerPosition, ProgressBarComponent, QueryParameters, RouterViewAction, SCREEN_SIZE, SHELL_CONFIG, ShellFooterComponent, ShellHeaderComponent, ShellLayoutComponent, ShellLayoutType, ShellSidebarComponent, ShellSidebarHeaderComponent, ShortNumberPipe, SidePaneComponent, SidePaneOverlayType, SidePaneSize, SideViewLayoutComponent, SkeletonLoaderComponent, StatsGridComponent, StepState, StepperType, SwitchViewAction, ToastType, ToasterComponent, ToasterContainerComponent, ToasterService, ToggleButtonComponent, ToggleButtonsListComponent, ToggleComponent, UnauthorizedComponent, UserSettingsService, ViewAction, ViewLayoutComponent };
5095
+ export { APP_LANGUAGES, APP_LINKS, APP_NOTIFICATIONS, AddressPipe, AdvancedSearchComponent, AuthCallbackComponent, AuthRenewComponent, AvatarInitialsComponent, BaseListComponent, BreadcrumbComponent, BreadcrumbItem, BreadcrumbRouteData, BreadcrumbService, ClickOutsideDirective, CollapsiblePanelComponent, ComboboxComponent, ComponentLoaderFactory, ContentTileComponent, ContentTileHeaderComponent, ContentTileItemComponent, DatepickerComponent, DefaultShellConfig, DropDownMenuComponent, DurationFormatPipe, ErrorComponent, ExternalNavLink, FilterClause, FormLayoutComponent, FragmentNavLink, HeaderMetaItem, Icons, IndiceComponentsModule, KpiTileComponent, LIBSTEPPER_ACCESSOR, LIBTABGROUP_ACCESSOR, LibStepComponent, LibStepInfoDirective, LibStepLabelDirective, LibStepperComponent, LibTabComponent, LibTabGroupComponent, LibTabLabelDirective, ListColumnComponent, ListDetailsSectionComponent, ListTileComponent, ListViewComponent, ListViewEmptyStateComponent, ListViewType, LoggedOutComponent, MODAL_CONFIG_DEFAULT_OVERRIDE, MenuOption, Modal, ModalOptions, ModalService, ModelViewLayoutComponent, NULL_TOAST, NavLink, NavLinkSeparator, NavLinksListComponent, NotificationNavLink, OperatorOptions, Operators, PageNotFoundComponent, PagerComponent, PagerPosition, ProgressBarComponent, QueryParameters, RouterViewAction, SCREEN_SIZE, SHELL_CONFIG, ShellFooterComponent, ShellHeaderComponent, ShellLayoutComponent, ShellLayoutType, ShellSidebarComponent, ShellSidebarHeaderComponent, ShortNumberPipe, SidePaneComponent, SidePaneOverlayType, SidePaneSize, SideViewLayoutComponent, SkeletonLoaderComponent, StatsGridComponent, StepState, StepperType, SwitchViewAction, ToastType, ToasterComponent, ToasterContainerComponent, ToasterService, ToggleButtonComponent, ToggleButtonsListComponent, ToggleComponent, UnauthorizedComponent, UserSettingsService, ViewAction, ViewLayoutComponent };
5066
5096
  //# sourceMappingURL=indice-ng-components.mjs.map