@lukfel/ng-scaffold 20.0.13 → 20.0.14

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 (6) hide show
  1. package/README.md +42 -22
  2. package/fesm2022/lukfel-ng-scaffold.mjs +135 -104
  3. package/fesm2022/lukfel-ng-scaffold.mjs.map +1 -1
  4. package/index.d.ts +79 -56
  5. package/package.json +1 -1
  6. package/styles/_variables.scss +1 -2
package/fesm2022/lukfel-ng-scaffold.mjs CHANGED
@@ -1,5 +1,5 @@
1
1
  import * as i0 from '@angular/core';
2
- import { NgModule, Input, Component, EventEmitter, Output, inject, ChangeDetectorRef, ViewChild, Injectable, DOCUMENT, InjectionToken } from '@angular/core';
2
+ import { InjectionToken, NgModule, inject, Input, Component, EventEmitter, Output, ChangeDetectorRef, ViewChild, Injectable, DOCUMENT } from '@angular/core';
3
3
  import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
4
4
  import * as i2$2 from '@angular/router';
5
5
  import { Router, RouteConfigLoadStart, RouteConfigLoadEnd, NavigationEnd, ActivatedRoute, RouterModule } from '@angular/router';
@@ -17,7 +17,7 @@ import { MatAutocompleteModule } from '@angular/material/autocomplete';
17
17
  import { MatButtonToggleModule } from '@angular/material/button-toggle';
18
18
  import * as i3 from '@angular/material/card';
19
19
  import { MatCardModule } from '@angular/material/card';
20
- import * as i2$5 from '@angular/material/checkbox';
20
+ import * as i3$3 from '@angular/material/checkbox';
21
21
  import { MatCheckboxModule } from '@angular/material/checkbox';
22
22
  import { MatChipsModule } from '@angular/material/chips';
23
23
  import { MatRippleModule } from '@angular/material/core';
@@ -29,7 +29,7 @@ import { MatFormFieldModule } from '@angular/material/form-field';
29
29
  import { MatGridListModule } from '@angular/material/grid-list';
30
30
  import * as i3$2 from '@angular/material/input';
31
31
  import { MatInputModule } from '@angular/material/input';
32
- import * as i4$3 from '@angular/material/list';
32
+ import * as i5$1 from '@angular/material/list';
33
33
  import { MatListModule } from '@angular/material/list';
34
34
  import * as i4$2 from '@angular/material/menu';
35
35
  import { MatMenuModule } from '@angular/material/menu';
@@ -58,6 +58,8 @@ import { distinctUntilChanged, firstValueFrom, BehaviorSubject, take, Subscripti
58
58
  import { Title, Meta } from '@angular/platform-browser';
59
59
  import * as i2$4 from '@angular/cdk/scrolling';
60
60
 
61
+ const CONFIG = new InjectionToken('config');
62
+
61
63
  class MaterialModule {
62
64
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.5", ngImport: i0, type: MaterialModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
63
65
  static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.0.5", ngImport: i0, type: MaterialModule, exports: [MatCheckboxModule,
@@ -202,49 +204,50 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.5", ngImpor
202
204
 
203
205
  class IconComponent {
204
206
  constructor() {
205
- this.outlineIcon = false;
207
+ this.libraryConfig = inject(CONFIG, { optional: true });
206
208
  this.alignMiddle = false;
207
209
  }
208
210
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.5", ngImport: i0, type: IconComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
209
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.5", type: IconComponent, isStandalone: true, selector: "lf-icon", inputs: { matIcon: "matIcon", svgIcon: "svgIcon", outlineIcon: "outlineIcon", alignMiddle: "alignMiddle" }, ngImport: i0, template: "<!-- mat icon -->\r\n@if (matIcon) {\r\n <mat-icon\r\n class=\"lf-icon\"\r\n [class.material-icons-outlined]=\"outlineIcon\"\r\n [class.lf-icon-align-middle]=\"alignMiddle\">\r\n {{ matIcon }}\r\n </mat-icon>\r\n} @else {\r\n @if (svgIcon) {\r\n <mat-icon\r\n class=\"lf-icon\"\r\n [svgIcon]=\"svgIcon\"\r\n [class.lf-icon-align-middle]=\"alignMiddle\"></mat-icon>\r\n }\r\n}\r\n<!-- svg icon -->\r\n", styles: [":host{display:contents}.lf-icon-align-middle{vertical-align:bottom}\n"], dependencies: [{ kind: "ngmodule", type: SharedModule }, { kind: "component", type: i4.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }] }); }
211
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.5", type: IconComponent, isStandalone: true, selector: "lf-icon", inputs: { matIcon: "matIcon", svgIcon: "svgIcon", alignMiddle: "alignMiddle" }, ngImport: i0, template: "<!-- mat icon -->\r\n@if (matIcon) {\r\n <mat-icon\r\n class=\"lf-icon\"\r\n [class.material-icons-outlined]=\"libraryConfig?.outlineIcons\"\r\n [class.lf-icon-align-middle]=\"alignMiddle\">\r\n {{ matIcon }}\r\n </mat-icon>\r\n <!-- svg icon -->\r\n} @else if (svgIcon) {\r\n <mat-icon\r\n class=\"lf-icon\"\r\n [svgIcon]=\"svgIcon\"\r\n [class.lf-icon-align-middle]=\"alignMiddle\"></mat-icon>\r\n}\r\n", styles: [":host{display:contents}.lf-icon-align-middle{vertical-align:bottom}\n"], dependencies: [{ kind: "ngmodule", type: SharedModule }, { kind: "component", type: i4.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }] }); }
210
212
  }
211
213
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.5", ngImport: i0, type: IconComponent, decorators: [{
212
214
  type: Component,
213
- args: [{ selector: 'lf-icon', standalone: true, imports: [SharedModule], template: "<!-- mat icon -->\r\n@if (matIcon) {\r\n <mat-icon\r\n class=\"lf-icon\"\r\n [class.material-icons-outlined]=\"outlineIcon\"\r\n [class.lf-icon-align-middle]=\"alignMiddle\">\r\n {{ matIcon }}\r\n </mat-icon>\r\n} @else {\r\n @if (svgIcon) {\r\n <mat-icon\r\n class=\"lf-icon\"\r\n [svgIcon]=\"svgIcon\"\r\n [class.lf-icon-align-middle]=\"alignMiddle\"></mat-icon>\r\n }\r\n}\r\n<!-- svg icon -->\r\n", styles: [":host{display:contents}.lf-icon-align-middle{vertical-align:bottom}\n"] }]
215
+ args: [{ selector: 'lf-icon', standalone: true, imports: [SharedModule], template: "<!-- mat icon -->\r\n@if (matIcon) {\r\n <mat-icon\r\n class=\"lf-icon\"\r\n [class.material-icons-outlined]=\"libraryConfig?.outlineIcons\"\r\n [class.lf-icon-align-middle]=\"alignMiddle\">\r\n {{ matIcon }}\r\n </mat-icon>\r\n <!-- svg icon -->\r\n} @else if (svgIcon) {\r\n <mat-icon\r\n class=\"lf-icon\"\r\n [svgIcon]=\"svgIcon\"\r\n [class.lf-icon-align-middle]=\"alignMiddle\"></mat-icon>\r\n}\r\n", styles: [":host{display:contents}.lf-icon-align-middle{vertical-align:bottom}\n"] }]
214
216
  }], propDecorators: { matIcon: [{
215
217
  type: Input
216
218
  }], svgIcon: [{
217
219
  type: Input
218
- }], outlineIcon: [{
219
- type: Input
220
220
  }], alignMiddle: [{
221
221
  type: Input
222
222
  }] } });
223
223
 
224
224
  class BottomBarComponent {
225
225
  constructor() {
226
+ this.libraryConfig = null;
226
227
  this.bottomBarConfig = null;
227
228
  this.isMobile = false;
228
229
  this.navbarEnabled = false;
229
230
  this.bottomBarCloseClickEvent = new EventEmitter();
230
231
  this.bottomBarButtonClickEvent = new EventEmitter();
231
232
  }
232
- actionClicked(id) {
233
+ buttonClicked(id) {
233
234
  if (!id) {
234
235
  return;
235
236
  }
236
237
  this.bottomBarButtonClickEvent.emit(id);
237
238
  }
238
- closeClicked() {
239
- this.bottomBarCloseClickEvent.emit('bottom-bar_close');
239
+ closeClicked(closeButtonId) {
240
+ this.bottomBarCloseClickEvent.emit(closeButtonId);
240
241
  }
241
242
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.5", ngImport: i0, type: BottomBarComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
242
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.5", type: BottomBarComponent, isStandalone: false, selector: "lf-bottom-bar", inputs: { bottomBarConfig: "bottomBarConfig", isMobile: "isMobile", navbarEnabled: "navbarEnabled" }, outputs: { bottomBarCloseClickEvent: "bottomBarCloseClickEvent", bottomBarButtonClickEvent: "bottomBarButtonClickEvent" }, ngImport: i0, template: "@if (bottomBarConfig && bottomBarConfig.enable) {\r\n <div\r\n class=\"lf-bottom-bar px-4\"\r\n [ngClass]=\"bottomBarConfig.class\"\r\n [class.lf-bottom-bar-show-navbar]=\"!isMobile && navbarEnabled\"\r\n [class.lf-bottom-bar-show-navbar-mobile]=\"isMobile && navbarEnabled\">\r\n <button mat-icon-button (click)=\"closeClicked()\">\r\n <mat-icon>close</mat-icon>\r\n </button>\r\n @if (bottomBarConfig.message) {\r\n <span class=\"ml-2\">{{ bottomBarConfig.message }}</span>\r\n }\r\n @if (bottomBarConfig.actions) {\r\n <div class=\"lf-bottom-bar-actions ml-4\">\r\n @for (action of bottomBarConfig.actions; track action) {\r\n @if (action.label) {\r\n <button\r\n mat-button\r\n class=\"lf-bottom-bar-action ml-2\"\r\n [ngClass]=\"action.class\"\r\n (click)=\"actionClicked(action.id)\"\r\n [matTooltip]=\"action.tooltip\">\r\n <lf-icon\r\n [matIcon]=\"action.matIcon\"\r\n [svgIcon]=\"action.svgIcon\"\r\n [outlineIcon]=\"action.outlineIcon!\"\r\n [alignMiddle]=\"true\"></lf-icon>\r\n {{ action.label }}\r\n </button>\r\n } @else {\r\n <button\r\n mat-icon-button\r\n color=\"accent\"\r\n class=\"lf-bottom-bar-action-icon ml-2\"\r\n [ngClass]=\"action.class\"\r\n (click)=\"actionClicked(action.id)\"\r\n [matTooltip]=\"action.tooltip\">\r\n <lf-icon\r\n [matIcon]=\"action.matIcon\"\r\n [svgIcon]=\"action.svgIcon\"\r\n [outlineIcon]=\"action.outlineIcon!\"></lf-icon>\r\n </button>\r\n }\r\n }\r\n </div>\r\n }\r\n </div>\r\n}\r\n", styles: [".lf-bottom-bar{transition:bottom .3s;transition:left .3s;z-index:101;position:fixed;left:0;bottom:0;right:0;height:56px;display:flex;align-items:center;box-sizing:border-box;background-color:var(--color-accent);color:#fff}.lf-bottom-bar.lf-bottom-bar-show-navbar-mobile{bottom:64px!important}.lf-bottom-bar.lf-bottom-bar-show-navbar{left:80px!important}.lf-bottom-bar .lf-bottom-bar-actions{display:flex;align-items:center}.lf-bottom-bar .lf-bottom-bar-actions .lf-bottom-bar-action{color:var(--color-accent)!important;background-color:#fff!important}.lf-bottom-bar .lf-bottom-bar-actions .lf-bottom-bar-action-icon{color:#fff!important}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: i2.MatButton, selector: " button[matButton], a[matButton], button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button], a[mat-flat-button], a[mat-stroked-button] ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }, { kind: "component", type: i2.MatIconButton, selector: "button[mat-icon-button], a[mat-icon-button], button[matIconButton], a[matIconButton]", exportAs: ["matButton", "matAnchor"] }, { kind: "component", type: i4.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "directive", type: i4$1.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "component", type: IconComponent, selector: "lf-icon", inputs: ["matIcon", "svgIcon", "outlineIcon", "alignMiddle"] }] }); }
243
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.5", type: BottomBarComponent, isStandalone: false, selector: "lf-bottom-bar", inputs: { libraryConfig: "libraryConfig", bottomBarConfig: "bottomBarConfig", isMobile: "isMobile", navbarEnabled: "navbarEnabled" }, outputs: { bottomBarCloseClickEvent: "bottomBarCloseClickEvent", bottomBarButtonClickEvent: "bottomBarButtonClickEvent" }, ngImport: i0, template: "@if (bottomBarConfig && bottomBarConfig.enable) {\r\n <div\r\n class=\"lf-bottom-bar px-4\"\r\n [ngClass]=\"bottomBarConfig.class\"\r\n [class.lf-bottom-bar-show-navbar]=\"!isMobile && navbarEnabled\"\r\n [class.lf-bottom-bar-show-navbar-mobile]=\"isMobile && navbarEnabled\">\r\n @if (bottomBarConfig.closeButtonId) {\r\n <button mat-icon-button (click)=\"closeClicked(bottomBarConfig.closeButtonId)\">\r\n <mat-icon>close</mat-icon>\r\n </button>\r\n }\r\n @if (bottomBarConfig.message) {\r\n <span class=\"ml-2\">{{ bottomBarConfig.message }}</span>\r\n }\r\n @if (bottomBarConfig.buttons) {\r\n <div class=\"lf-bottom-bar-buttons ml-4\">\r\n @for (button of bottomBarConfig.buttons; track button.id) {\r\n @if (button.label) {\r\n <button\r\n mat-button\r\n class=\"lf-bottom-bar-button ml-2\"\r\n [ngClass]=\"button.class\"\r\n (click)=\"buttonClicked(button.id)\"\r\n [matTooltip]=\"button.tooltip\">\r\n @if (button.matIcon || button.svgIcon) {\r\n <lf-icon\r\n [matIcon]=\"button.matIcon\"\r\n [svgIcon]=\"button.svgIcon\"\r\n [alignMiddle]=\"true\"></lf-icon>\r\n }\r\n {{ button.label }}\r\n </button>\r\n } @else {\r\n <button\r\n mat-icon-button\r\n color=\"accent\"\r\n class=\"lf-bottom-bar-button-icon ml-2\"\r\n [ngClass]=\"button.class\"\r\n (click)=\"buttonClicked(button.id)\"\r\n [matTooltip]=\"button.tooltip\">\r\n <lf-icon [matIcon]=\"button.matIcon\" [svgIcon]=\"button.svgIcon\"></lf-icon>\r\n </button>\r\n }\r\n }\r\n </div>\r\n }\r\n </div>\r\n}\r\n", styles: [".lf-bottom-bar{transition:bottom .3s;transition:left .3s;z-index:101;position:fixed;left:0;bottom:0;right:0;height:56px;display:flex;align-items:center;box-sizing:border-box;background-color:var(--color-accent);color:#fff}.lf-bottom-bar.lf-bottom-bar-show-navbar-mobile{bottom:64px!important}.lf-bottom-bar.lf-bottom-bar-show-navbar{left:80px!important}.lf-bottom-bar .lf-bottom-bar-buttons{display:flex;align-items:center}.lf-bottom-bar .lf-bottom-bar-buttons .lf-bottom-bar-button{color:var(--color-accent)!important;background-color:#fff!important}.lf-bottom-bar .lf-bottom-bar-buttons .lf-bottom-bar-button-icon{color:#fff!important}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: i2.MatButton, selector: " button[matButton], a[matButton], button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button], a[mat-flat-button], a[mat-stroked-button] ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }, { kind: "component", type: i2.MatIconButton, selector: "button[mat-icon-button], a[mat-icon-button], button[matIconButton], a[matIconButton]", exportAs: ["matButton", "matAnchor"] }, { kind: "component", type: i4.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "directive", type: i4$1.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "component", type: IconComponent, selector: "lf-icon", inputs: ["matIcon", "svgIcon", "alignMiddle"] }] }); }
243
244
  }
244
245
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.5", ngImport: i0, type: BottomBarComponent, decorators: [{
245
246
  type: Component,
246
- args: [{ selector: 'lf-bottom-bar', standalone: false, template: "@if (bottomBarConfig && bottomBarConfig.enable) {\r\n <div\r\n class=\"lf-bottom-bar px-4\"\r\n [ngClass]=\"bottomBarConfig.class\"\r\n [class.lf-bottom-bar-show-navbar]=\"!isMobile && navbarEnabled\"\r\n [class.lf-bottom-bar-show-navbar-mobile]=\"isMobile && navbarEnabled\">\r\n <button mat-icon-button (click)=\"closeClicked()\">\r\n <mat-icon>close</mat-icon>\r\n </button>\r\n @if (bottomBarConfig.message) {\r\n <span class=\"ml-2\">{{ bottomBarConfig.message }}</span>\r\n }\r\n @if (bottomBarConfig.actions) {\r\n <div class=\"lf-bottom-bar-actions ml-4\">\r\n @for (action of bottomBarConfig.actions; track action) {\r\n @if (action.label) {\r\n <button\r\n mat-button\r\n class=\"lf-bottom-bar-action ml-2\"\r\n [ngClass]=\"action.class\"\r\n (click)=\"actionClicked(action.id)\"\r\n [matTooltip]=\"action.tooltip\">\r\n <lf-icon\r\n [matIcon]=\"action.matIcon\"\r\n [svgIcon]=\"action.svgIcon\"\r\n [outlineIcon]=\"action.outlineIcon!\"\r\n [alignMiddle]=\"true\"></lf-icon>\r\n {{ action.label }}\r\n </button>\r\n } @else {\r\n <button\r\n mat-icon-button\r\n color=\"accent\"\r\n class=\"lf-bottom-bar-action-icon ml-2\"\r\n [ngClass]=\"action.class\"\r\n (click)=\"actionClicked(action.id)\"\r\n [matTooltip]=\"action.tooltip\">\r\n <lf-icon\r\n [matIcon]=\"action.matIcon\"\r\n [svgIcon]=\"action.svgIcon\"\r\n [outlineIcon]=\"action.outlineIcon!\"></lf-icon>\r\n </button>\r\n }\r\n }\r\n </div>\r\n }\r\n </div>\r\n}\r\n", styles: [".lf-bottom-bar{transition:bottom .3s;transition:left .3s;z-index:101;position:fixed;left:0;bottom:0;right:0;height:56px;display:flex;align-items:center;box-sizing:border-box;background-color:var(--color-accent);color:#fff}.lf-bottom-bar.lf-bottom-bar-show-navbar-mobile{bottom:64px!important}.lf-bottom-bar.lf-bottom-bar-show-navbar{left:80px!important}.lf-bottom-bar .lf-bottom-bar-actions{display:flex;align-items:center}.lf-bottom-bar .lf-bottom-bar-actions .lf-bottom-bar-action{color:var(--color-accent)!important;background-color:#fff!important}.lf-bottom-bar .lf-bottom-bar-actions .lf-bottom-bar-action-icon{color:#fff!important}\n"] }]
247
- }], propDecorators: { bottomBarConfig: [{
247
+ args: [{ selector: 'lf-bottom-bar', standalone: false, template: "@if (bottomBarConfig && bottomBarConfig.enable) {\r\n <div\r\n class=\"lf-bottom-bar px-4\"\r\n [ngClass]=\"bottomBarConfig.class\"\r\n [class.lf-bottom-bar-show-navbar]=\"!isMobile && navbarEnabled\"\r\n [class.lf-bottom-bar-show-navbar-mobile]=\"isMobile && navbarEnabled\">\r\n @if (bottomBarConfig.closeButtonId) {\r\n <button mat-icon-button (click)=\"closeClicked(bottomBarConfig.closeButtonId)\">\r\n <mat-icon>close</mat-icon>\r\n </button>\r\n }\r\n @if (bottomBarConfig.message) {\r\n <span class=\"ml-2\">{{ bottomBarConfig.message }}</span>\r\n }\r\n @if (bottomBarConfig.buttons) {\r\n <div class=\"lf-bottom-bar-buttons ml-4\">\r\n @for (button of bottomBarConfig.buttons; track button.id) {\r\n @if (button.label) {\r\n <button\r\n mat-button\r\n class=\"lf-bottom-bar-button ml-2\"\r\n [ngClass]=\"button.class\"\r\n (click)=\"buttonClicked(button.id)\"\r\n [matTooltip]=\"button.tooltip\">\r\n @if (button.matIcon || button.svgIcon) {\r\n <lf-icon\r\n [matIcon]=\"button.matIcon\"\r\n [svgIcon]=\"button.svgIcon\"\r\n [alignMiddle]=\"true\"></lf-icon>\r\n }\r\n {{ button.label }}\r\n </button>\r\n } @else {\r\n <button\r\n mat-icon-button\r\n color=\"accent\"\r\n class=\"lf-bottom-bar-button-icon ml-2\"\r\n [ngClass]=\"button.class\"\r\n (click)=\"buttonClicked(button.id)\"\r\n [matTooltip]=\"button.tooltip\">\r\n <lf-icon [matIcon]=\"button.matIcon\" [svgIcon]=\"button.svgIcon\"></lf-icon>\r\n </button>\r\n }\r\n }\r\n </div>\r\n }\r\n </div>\r\n}\r\n", styles: [".lf-bottom-bar{transition:bottom .3s;transition:left .3s;z-index:101;position:fixed;left:0;bottom:0;right:0;height:56px;display:flex;align-items:center;box-sizing:border-box;background-color:var(--color-accent);color:#fff}.lf-bottom-bar.lf-bottom-bar-show-navbar-mobile{bottom:64px!important}.lf-bottom-bar.lf-bottom-bar-show-navbar{left:80px!important}.lf-bottom-bar .lf-bottom-bar-buttons{display:flex;align-items:center}.lf-bottom-bar .lf-bottom-bar-buttons .lf-bottom-bar-button{color:var(--color-accent)!important;background-color:#fff!important}.lf-bottom-bar .lf-bottom-bar-buttons .lf-bottom-bar-button-icon{color:#fff!important}\n"] }]
248
+ }], propDecorators: { libraryConfig: [{
249
+ type: Input
250
+ }], bottomBarConfig: [{
248
251
  type: Input
249
252
  }], isMobile: [{
250
253
  type: Input
@@ -258,6 +261,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.5", ngImpor
258
261
 
259
262
  class ContentTitleCardComponent {
260
263
  constructor() {
264
+ this.libraryConfig = null;
261
265
  this.contentTitleCardConfig = null;
262
266
  this.isMobile = false;
263
267
  this.routeHistory = [];
@@ -268,12 +272,14 @@ class ContentTitleCardComponent {
268
272
  this.backButtonClickEvent.emit();
269
273
  }
270
274
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.5", ngImport: i0, type: ContentTitleCardComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
271
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.5", type: ContentTitleCardComponent, isStandalone: false, selector: "lf-content-title-card", inputs: { contentTitleCardConfig: "contentTitleCardConfig", isMobile: "isMobile", routeHistory: "routeHistory" }, outputs: { backButtonClickEvent: "backButtonClickEvent" }, ngImport: i0, template: "@if (contentTitleCardConfig && contentTitleCardConfig.enable) {\r\n <mat-card\r\n class=\"lf-content-title-card mat-elevation-z2 px-4\"\r\n [ngClass]=\"contentTitleCardConfig.class\">\r\n <!-- back button -->\r\n @if (contentTitleCardConfig.showBackButton && routeHistory.length > 1) {\r\n <button mat-icon-button color=\"accent\" (click)=\"backButtonClicked()\">\r\n <mat-icon>arrow_back_ios</mat-icon>\r\n </button>\r\n }\r\n <!-- spacer -->\r\n <div style=\"flex: 1 1 auto\"></div>\r\n <!-- label -->\r\n <span class=\"lf-content-title-card-label\">\r\n {{ contentTitleCardConfig.label || \"\" }}\r\n </span>\r\n <!-- spacer -->\r\n <div style=\"flex: 1 1 auto\"></div>\r\n <!-- empty button spacer -->\r\n <div\r\n [style.width]=\"\r\n contentTitleCardConfig.showBackButton && routeHistory.length > 1 ? '48px' : '0px'\r\n \"></div>\r\n </mat-card>\r\n}\r\n", styles: [".lf-content-title-card{z-index:98;height:80px;display:flex;flex-flow:row nowrap;align-items:center;border-radius:0}.lf-content-title-card .lf-content-title-card-label{font-size:24px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: i2.MatIconButton, selector: "button[mat-icon-button], a[mat-icon-button], button[matIconButton], a[matIconButton]", exportAs: ["matButton", "matAnchor"] }, { kind: "component", type: i3.MatCard, selector: "mat-card", inputs: ["appearance"], exportAs: ["matCard"] }, { kind: "component", type: i4.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }] }); }
275
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.5", type: ContentTitleCardComponent, isStandalone: false, selector: "lf-content-title-card", inputs: { libraryConfig: "libraryConfig", contentTitleCardConfig: "contentTitleCardConfig", isMobile: "isMobile", routeHistory: "routeHistory" }, outputs: { backButtonClickEvent: "backButtonClickEvent" }, ngImport: i0, template: "@if (contentTitleCardConfig && contentTitleCardConfig.enable) {\r\n <mat-card\r\n class=\"lf-content-title-card mat-elevation-z2 px-4\"\r\n [ngClass]=\"contentTitleCardConfig.class\">\r\n <!-- back button -->\r\n @if (contentTitleCardConfig.showBackButton && routeHistory.length > 1) {\r\n <button mat-icon-button color=\"accent\" (click)=\"backButtonClicked()\">\r\n <mat-icon>arrow_back_ios</mat-icon>\r\n </button>\r\n }\r\n <!-- spacer -->\r\n <div style=\"flex: 1 1 auto\"></div>\r\n <!-- label -->\r\n <span class=\"lf-content-title-card-label\">\r\n {{ contentTitleCardConfig.label || \"\" }}\r\n </span>\r\n <!-- spacer -->\r\n <div style=\"flex: 1 1 auto\"></div>\r\n <!-- empty button spacer -->\r\n <div\r\n [style.width]=\"\r\n contentTitleCardConfig.showBackButton && routeHistory.length > 1 ? '48px' : '0px'\r\n \"></div>\r\n </mat-card>\r\n}\r\n", styles: [".lf-content-title-card{z-index:98;height:80px;display:flex;flex-flow:row nowrap;align-items:center;border-radius:0}.lf-content-title-card .lf-content-title-card-label{font-size:24px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: i2.MatIconButton, selector: "button[mat-icon-button], a[mat-icon-button], button[matIconButton], a[matIconButton]", exportAs: ["matButton", "matAnchor"] }, { kind: "component", type: i3.MatCard, selector: "mat-card", inputs: ["appearance"], exportAs: ["matCard"] }, { kind: "component", type: i4.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }] }); }
272
276
  }
273
277
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.5", ngImport: i0, type: ContentTitleCardComponent, decorators: [{
274
278
  type: Component,
275
279
  args: [{ selector: 'lf-content-title-card', standalone: false, template: "@if (contentTitleCardConfig && contentTitleCardConfig.enable) {\r\n <mat-card\r\n class=\"lf-content-title-card mat-elevation-z2 px-4\"\r\n [ngClass]=\"contentTitleCardConfig.class\">\r\n <!-- back button -->\r\n @if (contentTitleCardConfig.showBackButton && routeHistory.length > 1) {\r\n <button mat-icon-button color=\"accent\" (click)=\"backButtonClicked()\">\r\n <mat-icon>arrow_back_ios</mat-icon>\r\n </button>\r\n }\r\n <!-- spacer -->\r\n <div style=\"flex: 1 1 auto\"></div>\r\n <!-- label -->\r\n <span class=\"lf-content-title-card-label\">\r\n {{ contentTitleCardConfig.label || \"\" }}\r\n </span>\r\n <!-- spacer -->\r\n <div style=\"flex: 1 1 auto\"></div>\r\n <!-- empty button spacer -->\r\n <div\r\n [style.width]=\"\r\n contentTitleCardConfig.showBackButton && routeHistory.length > 1 ? '48px' : '0px'\r\n \"></div>\r\n </mat-card>\r\n}\r\n", styles: [".lf-content-title-card{z-index:98;height:80px;display:flex;flex-flow:row nowrap;align-items:center;border-radius:0}.lf-content-title-card .lf-content-title-card-label{font-size:24px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}\n"] }]
276
- }], propDecorators: { contentTitleCardConfig: [{
280
+ }], propDecorators: { libraryConfig: [{
281
+ type: Input
282
+ }], contentTitleCardConfig: [{
277
283
  type: Input
278
284
  }], isMobile: [{
279
285
  type: Input
@@ -285,6 +291,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.5", ngImpor
285
291
 
286
292
  class DrawerComponent {
287
293
  constructor() {
294
+ this.libraryConfig = null;
288
295
  this.drawerConfig = null;
289
296
  this.isMobile = false;
290
297
  this.fixedOffset = 0;
@@ -301,12 +308,14 @@ class DrawerComponent {
301
308
  this.drawerConfig.open = false;
302
309
  }
303
310
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.5", ngImport: i0, type: DrawerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
304
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.5", type: DrawerComponent, isStandalone: false, selector: "lf-drawer", inputs: { drawerConfig: "drawerConfig", isMobile: "isMobile", fixedOffset: "fixedOffset", drawerPortal: "drawerPortal" }, ngImport: i0, template: "@if (drawerConfig && drawerConfig.enable) {\r\n <mat-sidenav-container class=\"lf-drawer-container\" [ngClass]=\"drawerConfig.class\">\r\n <!-- drawer -->\r\n <mat-sidenav\r\n class=\"lf-drawer mat-elevation-z2\"\r\n [mode]=\"isMobile ? 'over' : 'side'\"\r\n [opened]=\"drawerConfig.open\"\r\n [autoFocus]=\"false\"\r\n [fixedInViewport]=\"drawerConfig.fixed\"\r\n [fixedTopGap]=\"fixedOffset\"\r\n (closed)=\"onDrawerClosed()\"\r\n #drawer>\r\n <!-- drawer content -->\r\n <!-- <ng-content select=\"[drawerContent]\"></ng-content> -->\r\n @if (drawerPortal) {\r\n <ng-template [cdkPortalOutlet]=\"drawerPortal\"></ng-template>\r\n } @else {\r\n <ng-content select=\"[drawerContent]\"></ng-content>\r\n }\r\n </mat-sidenav>\r\n <mat-sidenav-content>\r\n <!-- main content -->\r\n <ng-container *ngTemplateOutlet=\"content\"></ng-container>\r\n </mat-sidenav-content>\r\n </mat-sidenav-container>\r\n} @else {\r\n <ng-container *ngTemplateOutlet=\"content\"></ng-container>\r\n}\r\n\r\n<!-- render content without drawer -->\r\n\r\n<!-- this template is required to allow multiple <ng-content></ng-content> -->\r\n<ng-template #content><ng-content></ng-content></ng-template>\r\n", styles: [".lf-drawer-container{z-index:unset!important}.lf-drawer-container .lf-drawer{width:208px;z-index:98}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i2$1.MatSidenav, selector: "mat-sidenav", inputs: ["fixedInViewport", "fixedTopGap", "fixedBottomGap"], exportAs: ["matSidenav"] }, { kind: "component", type: i2$1.MatSidenavContainer, selector: "mat-sidenav-container", exportAs: ["matSidenavContainer"] }, { kind: "component", type: i2$1.MatSidenavContent, selector: "mat-sidenav-content" }, { kind: "directive", type: i3$1.CdkPortalOutlet, selector: "[cdkPortalOutlet]", inputs: ["cdkPortalOutlet"], outputs: ["attached"], exportAs: ["cdkPortalOutlet"] }] }); }
311
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.5", type: DrawerComponent, isStandalone: false, selector: "lf-drawer", inputs: { libraryConfig: "libraryConfig", drawerConfig: "drawerConfig", isMobile: "isMobile", fixedOffset: "fixedOffset", drawerPortal: "drawerPortal" }, ngImport: i0, template: "@if (drawerConfig && drawerConfig.enable) {\r\n <mat-sidenav-container class=\"lf-drawer-container\" [ngClass]=\"drawerConfig.class\">\r\n <!-- drawer -->\r\n <mat-sidenav\r\n class=\"lf-drawer mat-elevation-z2\"\r\n [mode]=\"isMobile ? 'over' : 'side'\"\r\n [opened]=\"drawerConfig.open\"\r\n [autoFocus]=\"false\"\r\n [fixedInViewport]=\"drawerConfig.fixed\"\r\n [fixedTopGap]=\"fixedOffset\"\r\n (closed)=\"onDrawerClosed()\"\r\n #drawer>\r\n <!-- drawer content -->\r\n <!-- <ng-content select=\"[drawerContent]\"></ng-content> -->\r\n @if (drawerPortal) {\r\n <ng-template [cdkPortalOutlet]=\"drawerPortal\"></ng-template>\r\n } @else {\r\n <ng-content select=\"[drawerContent]\"></ng-content>\r\n }\r\n </mat-sidenav>\r\n <mat-sidenav-content>\r\n <!-- main content -->\r\n <ng-container *ngTemplateOutlet=\"content\"></ng-container>\r\n </mat-sidenav-content>\r\n </mat-sidenav-container>\r\n} @else {\r\n <ng-container *ngTemplateOutlet=\"content\"></ng-container>\r\n}\r\n\r\n<!-- render content without drawer -->\r\n\r\n<!-- this template is required to allow multiple <ng-content></ng-content> -->\r\n<ng-template #content><ng-content></ng-content></ng-template>\r\n", styles: [".lf-drawer-container{z-index:unset!important}.lf-drawer-container .lf-drawer{width:208px;z-index:98}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i2$1.MatSidenav, selector: "mat-sidenav", inputs: ["fixedInViewport", "fixedTopGap", "fixedBottomGap"], exportAs: ["matSidenav"] }, { kind: "component", type: i2$1.MatSidenavContainer, selector: "mat-sidenav-container", exportAs: ["matSidenavContainer"] }, { kind: "component", type: i2$1.MatSidenavContent, selector: "mat-sidenav-content" }, { kind: "directive", type: i3$1.CdkPortalOutlet, selector: "[cdkPortalOutlet]", inputs: ["cdkPortalOutlet"], outputs: ["attached"], exportAs: ["cdkPortalOutlet"] }] }); }
305
312
  }
306
313
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.5", ngImport: i0, type: DrawerComponent, decorators: [{
307
314
  type: Component,
308
315
  args: [{ selector: 'lf-drawer', standalone: false, template: "@if (drawerConfig && drawerConfig.enable) {\r\n <mat-sidenav-container class=\"lf-drawer-container\" [ngClass]=\"drawerConfig.class\">\r\n <!-- drawer -->\r\n <mat-sidenav\r\n class=\"lf-drawer mat-elevation-z2\"\r\n [mode]=\"isMobile ? 'over' : 'side'\"\r\n [opened]=\"drawerConfig.open\"\r\n [autoFocus]=\"false\"\r\n [fixedInViewport]=\"drawerConfig.fixed\"\r\n [fixedTopGap]=\"fixedOffset\"\r\n (closed)=\"onDrawerClosed()\"\r\n #drawer>\r\n <!-- drawer content -->\r\n <!-- <ng-content select=\"[drawerContent]\"></ng-content> -->\r\n @if (drawerPortal) {\r\n <ng-template [cdkPortalOutlet]=\"drawerPortal\"></ng-template>\r\n } @else {\r\n <ng-content select=\"[drawerContent]\"></ng-content>\r\n }\r\n </mat-sidenav>\r\n <mat-sidenav-content>\r\n <!-- main content -->\r\n <ng-container *ngTemplateOutlet=\"content\"></ng-container>\r\n </mat-sidenav-content>\r\n </mat-sidenav-container>\r\n} @else {\r\n <ng-container *ngTemplateOutlet=\"content\"></ng-container>\r\n}\r\n\r\n<!-- render content without drawer -->\r\n\r\n<!-- this template is required to allow multiple <ng-content></ng-content> -->\r\n<ng-template #content><ng-content></ng-content></ng-template>\r\n", styles: [".lf-drawer-container{z-index:unset!important}.lf-drawer-container .lf-drawer{width:208px;z-index:98}\n"] }]
309
- }], propDecorators: { drawerConfig: [{
316
+ }], propDecorators: { libraryConfig: [{
317
+ type: Input
318
+ }], drawerConfig: [{
310
319
  type: Input
311
320
  }], isMobile: [{
312
321
  type: Input
@@ -318,6 +327,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.5", ngImpor
318
327
 
319
328
  class FloatingButtonComponent {
320
329
  constructor() {
330
+ this.libraryConfig = null;
321
331
  this.floatingButtonConfig = null;
322
332
  this.onTop = false;
323
333
  this.isMobile = false;
@@ -354,12 +364,14 @@ class FloatingButtonComponent {
354
364
  return bottomPosition;
355
365
  }
356
366
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.5", ngImport: i0, type: FloatingButtonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
357
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.5", type: FloatingButtonComponent, isStandalone: false, selector: "lf-floating-button", inputs: { floatingButtonConfig: "floatingButtonConfig", onTop: "onTop", isMobile: "isMobile", bottomBarEnabled: "bottomBarEnabled" }, outputs: { floatingButtonClickEvent: "floatingButtonClickEvent" }, ngImport: i0, template: "@if (\r\n floatingButtonConfig && floatingButtonConfig.enable && (!floatingButtonConfig.autoHide || !onTop)\r\n) {\r\n <button\r\n mat-fab\r\n color=\"accent\"\r\n class=\"lf-floating-button\"\r\n [style.bottom]=\"getBottomPosition() + 'px'\"\r\n [ngClass]=\"floatingButtonConfig.class\"\r\n [ngClass]=\"floatingButtonConfig.horizontalPosition\"\r\n [extended]=\"!!floatingButtonConfig.label\"\r\n (click)=\"buttonClicked(floatingButtonConfig.id)\"\r\n [matTooltip]=\"floatingButtonConfig.tooltip!\">\r\n <!-- mat icon -->\r\n @if (floatingButtonConfig.matIcon) {\r\n <mat-icon [class.material-icons-outlined]=\"floatingButtonConfig.outlineIcon\">\r\n {{ floatingButtonConfig.matIcon }}\r\n </mat-icon>\r\n } @else {\r\n @if (floatingButtonConfig.svgIcon) {\r\n <mat-icon [svgIcon]=\"floatingButtonConfig.svgIcon!\"></mat-icon>\r\n }\r\n }\r\n <!-- svg icon -->\r\n <!-- label -->\r\n @if (floatingButtonConfig.label) {\r\n <span class=\"lf-floating-button-label\">\r\n {{ floatingButtonConfig.label }}\r\n </span>\r\n }\r\n </button>\r\n}\r\n", styles: [".lf-floating-button{position:fixed;transition:bottom .3s;z-index:100}.lf-floating-button.left{left:24px}.lf-floating-button.center{left:50%;transform:translate(-50%)}.lf-floating-button.right{right:24px}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: i2.MatFabButton, selector: "button[mat-fab], a[mat-fab], button[matFab], a[matFab]", inputs: ["extended"], exportAs: ["matButton", "matAnchor"] }, { kind: "component", type: i4.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "directive", type: i4$1.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }] }); }
367
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.5", type: FloatingButtonComponent, isStandalone: false, selector: "lf-floating-button", inputs: { libraryConfig: "libraryConfig", floatingButtonConfig: "floatingButtonConfig", onTop: "onTop", isMobile: "isMobile", bottomBarEnabled: "bottomBarEnabled" }, outputs: { floatingButtonClickEvent: "floatingButtonClickEvent" }, ngImport: i0, template: "@if (\r\n floatingButtonConfig && floatingButtonConfig.enable && (!floatingButtonConfig.autoHide || !onTop)\r\n) {\r\n <button\r\n mat-fab\r\n color=\"accent\"\r\n class=\"lf-floating-button\"\r\n [style.bottom]=\"getBottomPosition() + 'px'\"\r\n [ngClass]=\"floatingButtonConfig.class\"\r\n [ngClass]=\"floatingButtonConfig.horizontalPosition\"\r\n [extended]=\"!!floatingButtonConfig.label\"\r\n (click)=\"buttonClicked(floatingButtonConfig.id)\"\r\n [matTooltip]=\"floatingButtonConfig.tooltip!\">\r\n <!-- mat icon -->\r\n @if (floatingButtonConfig.matIcon) {\r\n <mat-icon [class.material-icons-outlined]=\"libraryConfig?.outlineIcons\">\r\n {{ floatingButtonConfig.matIcon }}\r\n </mat-icon>\r\n } @else {\r\n @if (floatingButtonConfig.svgIcon) {\r\n <mat-icon [svgIcon]=\"floatingButtonConfig.svgIcon!\"></mat-icon>\r\n }\r\n }\r\n <!-- svg icon -->\r\n <!-- label -->\r\n @if (floatingButtonConfig.label) {\r\n <span class=\"lf-floating-button-label\">\r\n {{ floatingButtonConfig.label }}\r\n </span>\r\n }\r\n </button>\r\n}\r\n", styles: [".lf-floating-button{position:fixed;transition:bottom .3s;z-index:100}.lf-floating-button.left{left:24px}.lf-floating-button.center{left:50%;transform:translate(-50%)}.lf-floating-button.right{right:24px}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: i2.MatFabButton, selector: "button[mat-fab], a[mat-fab], button[matFab], a[matFab]", inputs: ["extended"], exportAs: ["matButton", "matAnchor"] }, { kind: "component", type: i4.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "directive", type: i4$1.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }] }); }
358
368
  }
359
369
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.5", ngImport: i0, type: FloatingButtonComponent, decorators: [{
360
370
  type: Component,
361
- args: [{ selector: 'lf-floating-button', standalone: false, template: "@if (\r\n floatingButtonConfig && floatingButtonConfig.enable && (!floatingButtonConfig.autoHide || !onTop)\r\n) {\r\n <button\r\n mat-fab\r\n color=\"accent\"\r\n class=\"lf-floating-button\"\r\n [style.bottom]=\"getBottomPosition() + 'px'\"\r\n [ngClass]=\"floatingButtonConfig.class\"\r\n [ngClass]=\"floatingButtonConfig.horizontalPosition\"\r\n [extended]=\"!!floatingButtonConfig.label\"\r\n (click)=\"buttonClicked(floatingButtonConfig.id)\"\r\n [matTooltip]=\"floatingButtonConfig.tooltip!\">\r\n <!-- mat icon -->\r\n @if (floatingButtonConfig.matIcon) {\r\n <mat-icon [class.material-icons-outlined]=\"floatingButtonConfig.outlineIcon\">\r\n {{ floatingButtonConfig.matIcon }}\r\n </mat-icon>\r\n } @else {\r\n @if (floatingButtonConfig.svgIcon) {\r\n <mat-icon [svgIcon]=\"floatingButtonConfig.svgIcon!\"></mat-icon>\r\n }\r\n }\r\n <!-- svg icon -->\r\n <!-- label -->\r\n @if (floatingButtonConfig.label) {\r\n <span class=\"lf-floating-button-label\">\r\n {{ floatingButtonConfig.label }}\r\n </span>\r\n }\r\n </button>\r\n}\r\n", styles: [".lf-floating-button{position:fixed;transition:bottom .3s;z-index:100}.lf-floating-button.left{left:24px}.lf-floating-button.center{left:50%;transform:translate(-50%)}.lf-floating-button.right{right:24px}\n"] }]
362
- }], propDecorators: { floatingButtonConfig: [{
371
+ args: [{ selector: 'lf-floating-button', standalone: false, template: "@if (\r\n floatingButtonConfig && floatingButtonConfig.enable && (!floatingButtonConfig.autoHide || !onTop)\r\n) {\r\n <button\r\n mat-fab\r\n color=\"accent\"\r\n class=\"lf-floating-button\"\r\n [style.bottom]=\"getBottomPosition() + 'px'\"\r\n [ngClass]=\"floatingButtonConfig.class\"\r\n [ngClass]=\"floatingButtonConfig.horizontalPosition\"\r\n [extended]=\"!!floatingButtonConfig.label\"\r\n (click)=\"buttonClicked(floatingButtonConfig.id)\"\r\n [matTooltip]=\"floatingButtonConfig.tooltip!\">\r\n <!-- mat icon -->\r\n @if (floatingButtonConfig.matIcon) {\r\n <mat-icon [class.material-icons-outlined]=\"libraryConfig?.outlineIcons\">\r\n {{ floatingButtonConfig.matIcon }}\r\n </mat-icon>\r\n } @else {\r\n @if (floatingButtonConfig.svgIcon) {\r\n <mat-icon [svgIcon]=\"floatingButtonConfig.svgIcon!\"></mat-icon>\r\n }\r\n }\r\n <!-- svg icon -->\r\n <!-- label -->\r\n @if (floatingButtonConfig.label) {\r\n <span class=\"lf-floating-button-label\">\r\n {{ floatingButtonConfig.label }}\r\n </span>\r\n }\r\n </button>\r\n}\r\n", styles: [".lf-floating-button{position:fixed;transition:bottom .3s;z-index:100}.lf-floating-button.left{left:24px}.lf-floating-button.center{left:50%;transform:translate(-50%)}.lf-floating-button.right{right:24px}\n"] }]
372
+ }], propDecorators: { libraryConfig: [{
373
+ type: Input
374
+ }], floatingButtonConfig: [{
363
375
  type: Input
364
376
  }], onTop: [{
365
377
  type: Input
@@ -373,15 +385,18 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.5", ngImpor
373
385
 
374
386
  class FooterComponent {
375
387
  constructor() {
388
+ this.libraryConfig = null;
376
389
  this.footerConfig = null;
377
390
  }
378
391
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.5", ngImport: i0, type: FooterComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
379
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.5", type: FooterComponent, isStandalone: false, selector: "lf-footer", inputs: { footerConfig: "footerConfig" }, ngImport: i0, template: "@if (footerConfig && footerConfig.enable) {\r\n <mat-card class=\"lf-footer mat-elevation-z2 p-4\" [ngClass]=\"footerConfig.class\">\r\n <!-- svg logo -->\r\n @if (footerConfig.svgLogo) {\r\n <mat-icon\r\n class=\"lf-footer-logo mb-4\"\r\n color=\"primary\"\r\n [svgIcon]=\"footerConfig.svgLogo!\"></mat-icon>\r\n } @else {\r\n @if (footerConfig.imgLogo) {\r\n <img class=\"lf-footer-logo mb-4\" [src]=\"footerConfig.imgLogo\" alt=\"Logo\" />\r\n }\r\n }\r\n <!-- img logo -->\r\n <!-- links -->\r\n @if (footerConfig.links) {\r\n <div class=\"lf-footer-links mb-4\">\r\n @for (link of footerConfig.links; track link; let i = $index) {\r\n <div class=\"lf-footer-link\" [class.mr-2]=\"i < footerConfig.links!.length - 1\">\r\n @if (link.routerLink) {\r\n <a [routerLink]=\"[link.routerLink]\">{{ link.label || \"\" }}</a>\r\n } @else {\r\n <a [href]=\"link.href\" [target]=\"link.externalTab ? '_blank' : null\">\r\n {{ link.label }}\r\n </a>\r\n }\r\n </div>\r\n }\r\n </div>\r\n }\r\n <!-- copyright -->\r\n @if (footerConfig.copyright) {\r\n <span class=\"lf-footer-copyright\">\r\n {{ footerConfig.copyright }}\r\n </span>\r\n }\r\n </mat-card>\r\n}\r\n", styles: [".lf-footer{overflow:hidden;flex-flow:column;align-items:center;justify-content:center;min-height:100px;border-radius:0;border-top:solid 1px rgba(0,0,0,.12)}.lf-footer .lf-footer-logo{width:96px;height:96px}.lf-footer .lf-footer-links{display:flex;flex-flow:row wrap;align-items:center;justify-content:center}.lf-footer .lf-footer-links .lf-footer-link a{text-decoration:none;color:unset;font-size:12px}.lf-footer .lf-footer-links .lf-footer-link a:hover{color:var(--color-primary)}.lf-footer .lf-footer-copyright{font-size:12px}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2$2.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "component", type: i3.MatCard, selector: "mat-card", inputs: ["appearance"], exportAs: ["matCard"] }, { kind: "component", type: i4.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }] }); }
392
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.5", type: FooterComponent, isStandalone: false, selector: "lf-footer", inputs: { libraryConfig: "libraryConfig", footerConfig: "footerConfig" }, ngImport: i0, template: "@if (footerConfig && footerConfig.enable) {\r\n <mat-card class=\"lf-footer mat-elevation-z2 p-4\" [ngClass]=\"footerConfig.class\">\r\n <!-- svg logo -->\r\n @if (footerConfig.svgLogo) {\r\n <mat-icon\r\n class=\"lf-footer-logo mb-4\"\r\n color=\"primary\"\r\n [svgIcon]=\"footerConfig.svgLogo!\"></mat-icon>\r\n } @else {\r\n @if (footerConfig.imgLogo) {\r\n <img class=\"lf-footer-logo mb-4\" [src]=\"footerConfig.imgLogo\" alt=\"Logo\" />\r\n }\r\n }\r\n <!-- img logo -->\r\n <!-- links -->\r\n @if (footerConfig.links) {\r\n <div class=\"lf-footer-links mb-4\">\r\n @for (link of footerConfig.links; track link; let i = $index) {\r\n <div class=\"lf-footer-link\" [class.mr-2]=\"i < footerConfig.links!.length - 1\">\r\n @if (link.routerLink) {\r\n <a [routerLink]=\"[link.routerLink]\">{{ link.label || \"\" }}</a>\r\n } @else {\r\n <a [href]=\"link.href\" [target]=\"link.externalTab ? '_blank' : null\">\r\n {{ link.label }}\r\n </a>\r\n }\r\n </div>\r\n }\r\n </div>\r\n }\r\n <!-- copyright -->\r\n @if (footerConfig.copyright) {\r\n <span class=\"lf-footer-copyright\">\r\n {{ footerConfig.copyright }}\r\n </span>\r\n }\r\n </mat-card>\r\n}\r\n", styles: [".lf-footer{overflow:hidden;flex-flow:column;align-items:center;justify-content:center;min-height:100px;border-radius:0;border-top:solid 1px rgba(0,0,0,.12)}.lf-footer .lf-footer-logo{width:96px;height:96px}.lf-footer .lf-footer-links{display:flex;flex-flow:row wrap;align-items:center;justify-content:center}.lf-footer .lf-footer-links .lf-footer-link a{text-decoration:none;color:unset;font-size:12px}.lf-footer .lf-footer-links .lf-footer-link a:hover{color:var(--color-primary)}.lf-footer .lf-footer-copyright{font-size:12px}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2$2.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "component", type: i3.MatCard, selector: "mat-card", inputs: ["appearance"], exportAs: ["matCard"] }, { kind: "component", type: i4.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }] }); }
380
393
  }
381
394
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.5", ngImport: i0, type: FooterComponent, decorators: [{
382
395
  type: Component,
383
396
  args: [{ selector: 'lf-footer', standalone: false, template: "@if (footerConfig && footerConfig.enable) {\r\n <mat-card class=\"lf-footer mat-elevation-z2 p-4\" [ngClass]=\"footerConfig.class\">\r\n <!-- svg logo -->\r\n @if (footerConfig.svgLogo) {\r\n <mat-icon\r\n class=\"lf-footer-logo mb-4\"\r\n color=\"primary\"\r\n [svgIcon]=\"footerConfig.svgLogo!\"></mat-icon>\r\n } @else {\r\n @if (footerConfig.imgLogo) {\r\n <img class=\"lf-footer-logo mb-4\" [src]=\"footerConfig.imgLogo\" alt=\"Logo\" />\r\n }\r\n }\r\n <!-- img logo -->\r\n <!-- links -->\r\n @if (footerConfig.links) {\r\n <div class=\"lf-footer-links mb-4\">\r\n @for (link of footerConfig.links; track link; let i = $index) {\r\n <div class=\"lf-footer-link\" [class.mr-2]=\"i < footerConfig.links!.length - 1\">\r\n @if (link.routerLink) {\r\n <a [routerLink]=\"[link.routerLink]\">{{ link.label || \"\" }}</a>\r\n } @else {\r\n <a [href]=\"link.href\" [target]=\"link.externalTab ? '_blank' : null\">\r\n {{ link.label }}\r\n </a>\r\n }\r\n </div>\r\n }\r\n </div>\r\n }\r\n <!-- copyright -->\r\n @if (footerConfig.copyright) {\r\n <span class=\"lf-footer-copyright\">\r\n {{ footerConfig.copyright }}\r\n </span>\r\n }\r\n </mat-card>\r\n}\r\n", styles: [".lf-footer{overflow:hidden;flex-flow:column;align-items:center;justify-content:center;min-height:100px;border-radius:0;border-top:solid 1px rgba(0,0,0,.12)}.lf-footer .lf-footer-logo{width:96px;height:96px}.lf-footer .lf-footer-links{display:flex;flex-flow:row wrap;align-items:center;justify-content:center}.lf-footer .lf-footer-links .lf-footer-link a{text-decoration:none;color:unset;font-size:12px}.lf-footer .lf-footer-links .lf-footer-link a:hover{color:var(--color-primary)}.lf-footer .lf-footer-copyright{font-size:12px}\n"] }]
384
- }], propDecorators: { footerConfig: [{
397
+ }], propDecorators: { libraryConfig: [{
398
+ type: Input
399
+ }], footerConfig: [{
385
400
  type: Input
386
401
  }] } });
387
402
 
@@ -433,11 +448,11 @@ class InputComponent {
433
448
  this.inputChangeEvent.emit(this.inputValue);
434
449
  }
435
450
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.5", ngImport: i0, type: InputComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
436
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.5", type: InputComponent, isStandalone: true, selector: "lf-input", inputs: { inputConfig: "inputConfig", isMobile: "isMobile" }, outputs: { inputSubmitEvent: "inputSubmitEvent", inputChangeEvent: "inputChangeEvent", inputPrefixActionEvent: "inputPrefixActionEvent" }, viewQueries: [{ propertyName: "input", first: true, predicate: ["input"], descendants: true }], ngImport: i0, template: "@if (inputConfig) {\r\n <mat-form-field class=\"lf-input\" appearance=\"fill\" [class.lf-hide-hint]=\"!inputConfig.hint\">\r\n <mat-label>{{ inputConfig.label || \"Search\" }}</mat-label>\r\n @if (inputConfig.hint) {\r\n <mat-hint>{{ inputConfig.hint }}</mat-hint>\r\n }\r\n <input\r\n matInput\r\n type=\"text\"\r\n [(ngModel)]=\"inputValue\"\r\n [disabled]=\"inputConfig.disabled!\"\r\n (keyup.enter)=\"inputSubmitted(inputValue)\"\r\n (ngModelChange)=\"inputChanged($event)\"\r\n #input />\r\n @if (isMobile) {\r\n <button mat-icon-button matPrefix color=\"accent\" (click)=\"inputPrefixAction()\">\r\n <mat-icon>arrow_back</mat-icon>\r\n </button>\r\n }\r\n @if (inputValue) {\r\n <button class=\"lf-input-close-button\" mat-icon-button matSuffix (click)=\"clearInput()\">\r\n <mat-icon>close</mat-icon>\r\n </button>\r\n }\r\n @if (inputConfig.matIconSubmit) {\r\n <button\r\n mat-icon-button\r\n matSuffix\r\n color=\"accent\"\r\n type=\"submit\"\r\n (click)=\"inputSubmitted(inputValue)\">\r\n <mat-icon>\r\n {{ inputConfig.matIconSubmit }}\r\n </mat-icon>\r\n </button>\r\n }\r\n </mat-form-field>\r\n}\r\n", styles: [".lf-input{width:100%}.lf-input ::ng-deep .mdc-text-field{border-radius:28px!important}.lf-input ::ng-deep .mdc-line-ripple:after{border-bottom-width:0!important}.lf-input ::ng-deep .mdc-line-ripple:before{border-bottom-width:0!important}.lf-input .lf-input-close-button{color:#808080cc}.lf-input.lf-hide-hint ::ng-deep .mat-mdc-form-field-subscript-wrapper{display:none!important}\n"], dependencies: [{ kind: "ngmodule", type: SharedModule }, { kind: "directive", type: i1$1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i2.MatIconButton, selector: "button[mat-icon-button], a[mat-icon-button], button[matIconButton], a[matIconButton]", exportAs: ["matButton", "matAnchor"] }, { kind: "directive", type: i3$2.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "component", type: i3$2.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i3$2.MatLabel, selector: "mat-label" }, { kind: "directive", type: i3$2.MatHint, selector: "mat-hint", inputs: ["align", "id"] }, { kind: "directive", type: i3$2.MatPrefix, selector: "[matPrefix], [matIconPrefix], [matTextPrefix]", inputs: ["matTextPrefix"] }, { kind: "directive", type: i3$2.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "component", type: i4.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }] }); }
451
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.5", type: InputComponent, isStandalone: true, selector: "lf-input", inputs: { inputConfig: "inputConfig", isMobile: "isMobile" }, outputs: { inputSubmitEvent: "inputSubmitEvent", inputChangeEvent: "inputChangeEvent", inputPrefixActionEvent: "inputPrefixActionEvent" }, viewQueries: [{ propertyName: "input", first: true, predicate: ["input"], descendants: true }], ngImport: i0, template: "@if (inputConfig) {\r\n <mat-form-field class=\"lf-input\" appearance=\"fill\" [class.lf-hide-hint]=\"!inputConfig.hint\">\r\n <mat-label>{{ inputConfig.label || \"Search\" }}</mat-label>\r\n @if (inputConfig.hint) {\r\n <mat-hint>{{ inputConfig.hint }}</mat-hint>\r\n }\r\n <input\r\n matInput\r\n type=\"text\"\r\n [(ngModel)]=\"inputValue\"\r\n [disabled]=\"inputConfig.disabled!\"\r\n (keyup.enter)=\"inputSubmitted(inputValue)\"\r\n (ngModelChange)=\"inputChanged($event)\"\r\n #input />\r\n @if (isMobile) {\r\n <button mat-icon-button matPrefix color=\"accent\" (click)=\"inputPrefixAction()\">\r\n <mat-icon>arrow_back</mat-icon>\r\n </button>\r\n }\r\n @if (inputValue) {\r\n <button class=\"lf-input-close-button\" mat-icon-button matSuffix (click)=\"clearInput()\">\r\n <mat-icon>close</mat-icon>\r\n </button>\r\n }\r\n @if (inputConfig.matIconSubmit) {\r\n <button\r\n mat-icon-button\r\n matSuffix\r\n color=\"accent\"\r\n type=\"submit\"\r\n (click)=\"inputSubmitted(inputValue)\">\r\n <mat-icon>\r\n {{ inputConfig.matIconSubmit }}\r\n </mat-icon>\r\n </button>\r\n }\r\n </mat-form-field>\r\n}\r\n", styles: [".lf-input{width:100%}.lf-input ::ng-deep .mdc-text-field{border-radius:24px!important}.lf-input ::ng-deep .mdc-line-ripple:after{border-bottom-width:0!important}.lf-input ::ng-deep .mdc-line-ripple:before{border-bottom-width:0!important}.lf-input .lf-input-close-button{color:#808080cc}.lf-input.lf-hide-hint ::ng-deep .mat-mdc-form-field-subscript-wrapper{display:none!important}\n"], dependencies: [{ kind: "ngmodule", type: SharedModule }, { kind: "directive", type: i1$1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i2.MatIconButton, selector: "button[mat-icon-button], a[mat-icon-button], button[matIconButton], a[matIconButton]", exportAs: ["matButton", "matAnchor"] }, { kind: "directive", type: i3$2.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "component", type: i3$2.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i3$2.MatLabel, selector: "mat-label" }, { kind: "directive", type: i3$2.MatHint, selector: "mat-hint", inputs: ["align", "id"] }, { kind: "directive", type: i3$2.MatPrefix, selector: "[matPrefix], [matIconPrefix], [matTextPrefix]", inputs: ["matTextPrefix"] }, { kind: "directive", type: i3$2.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "component", type: i4.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }] }); }
437
452
  }
438
453
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.5", ngImport: i0, type: InputComponent, decorators: [{
439
454
  type: Component,
440
- args: [{ selector: 'lf-input', standalone: true, imports: [SharedModule], template: "@if (inputConfig) {\r\n <mat-form-field class=\"lf-input\" appearance=\"fill\" [class.lf-hide-hint]=\"!inputConfig.hint\">\r\n <mat-label>{{ inputConfig.label || \"Search\" }}</mat-label>\r\n @if (inputConfig.hint) {\r\n <mat-hint>{{ inputConfig.hint }}</mat-hint>\r\n }\r\n <input\r\n matInput\r\n type=\"text\"\r\n [(ngModel)]=\"inputValue\"\r\n [disabled]=\"inputConfig.disabled!\"\r\n (keyup.enter)=\"inputSubmitted(inputValue)\"\r\n (ngModelChange)=\"inputChanged($event)\"\r\n #input />\r\n @if (isMobile) {\r\n <button mat-icon-button matPrefix color=\"accent\" (click)=\"inputPrefixAction()\">\r\n <mat-icon>arrow_back</mat-icon>\r\n </button>\r\n }\r\n @if (inputValue) {\r\n <button class=\"lf-input-close-button\" mat-icon-button matSuffix (click)=\"clearInput()\">\r\n <mat-icon>close</mat-icon>\r\n </button>\r\n }\r\n @if (inputConfig.matIconSubmit) {\r\n <button\r\n mat-icon-button\r\n matSuffix\r\n color=\"accent\"\r\n type=\"submit\"\r\n (click)=\"inputSubmitted(inputValue)\">\r\n <mat-icon>\r\n {{ inputConfig.matIconSubmit }}\r\n </mat-icon>\r\n </button>\r\n }\r\n </mat-form-field>\r\n}\r\n", styles: [".lf-input{width:100%}.lf-input ::ng-deep .mdc-text-field{border-radius:28px!important}.lf-input ::ng-deep .mdc-line-ripple:after{border-bottom-width:0!important}.lf-input ::ng-deep .mdc-line-ripple:before{border-bottom-width:0!important}.lf-input .lf-input-close-button{color:#808080cc}.lf-input.lf-hide-hint ::ng-deep .mat-mdc-form-field-subscript-wrapper{display:none!important}\n"] }]
455
+ args: [{ selector: 'lf-input', standalone: true, imports: [SharedModule], template: "@if (inputConfig) {\r\n <mat-form-field class=\"lf-input\" appearance=\"fill\" [class.lf-hide-hint]=\"!inputConfig.hint\">\r\n <mat-label>{{ inputConfig.label || \"Search\" }}</mat-label>\r\n @if (inputConfig.hint) {\r\n <mat-hint>{{ inputConfig.hint }}</mat-hint>\r\n }\r\n <input\r\n matInput\r\n type=\"text\"\r\n [(ngModel)]=\"inputValue\"\r\n [disabled]=\"inputConfig.disabled!\"\r\n (keyup.enter)=\"inputSubmitted(inputValue)\"\r\n (ngModelChange)=\"inputChanged($event)\"\r\n #input />\r\n @if (isMobile) {\r\n <button mat-icon-button matPrefix color=\"accent\" (click)=\"inputPrefixAction()\">\r\n <mat-icon>arrow_back</mat-icon>\r\n </button>\r\n }\r\n @if (inputValue) {\r\n <button class=\"lf-input-close-button\" mat-icon-button matSuffix (click)=\"clearInput()\">\r\n <mat-icon>close</mat-icon>\r\n </button>\r\n }\r\n @if (inputConfig.matIconSubmit) {\r\n <button\r\n mat-icon-button\r\n matSuffix\r\n color=\"accent\"\r\n type=\"submit\"\r\n (click)=\"inputSubmitted(inputValue)\">\r\n <mat-icon>\r\n {{ inputConfig.matIconSubmit }}\r\n </mat-icon>\r\n </button>\r\n }\r\n </mat-form-field>\r\n}\r\n", styles: [".lf-input{width:100%}.lf-input ::ng-deep .mdc-text-field{border-radius:24px!important}.lf-input ::ng-deep .mdc-line-ripple:after{border-bottom-width:0!important}.lf-input ::ng-deep .mdc-line-ripple:before{border-bottom-width:0!important}.lf-input .lf-input-close-button{color:#808080cc}.lf-input.lf-hide-hint ::ng-deep .mat-mdc-form-field-subscript-wrapper{display:none!important}\n"] }]
441
456
  }], propDecorators: { inputConfig: [{
442
457
  type: Input
443
458
  }], isMobile: [{
@@ -455,6 +470,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.5", ngImpor
455
470
 
456
471
  class HeaderComponent {
457
472
  constructor() {
473
+ this.libraryConfig = null;
458
474
  this.headerConfig = null;
459
475
  this.isMobile = false;
460
476
  this.routeLoading = false;
@@ -488,12 +504,14 @@ class HeaderComponent {
488
504
  return route === id;
489
505
  }
490
506
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.5", ngImport: i0, type: HeaderComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
491
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.5", type: HeaderComponent, isStandalone: false, selector: "lf-header", inputs: { headerConfig: "headerConfig", isMobile: "isMobile", routeLoading: "routeLoading", currentRoute: "currentRoute" }, outputs: { headerButtonClickEvent: "headerButtonClickEvent", headerInputSubmitEvent: "headerInputSubmitEvent", headerInputChangeEvent: "headerInputChangeEvent" }, ngImport: i0, template: "@if (headerConfig && headerConfig.enable) {\r\n <mat-toolbar\r\n class=\"lf-header mat-elevation-z3\"\r\n [class.px-4]=\"!isMobile\"\r\n [class.px-1]=\"isMobile\"\r\n [ngClass]=\"headerConfig.class\"\r\n color=\"primary\">\r\n <!-- left menu button -->\r\n <ng-container\r\n [ngTemplateOutlet]=\"menuButtonTemplate\"\r\n [ngTemplateOutletContext]=\"{\r\n menuButton: headerConfig.leftMenuButton!,\r\n hideLabel: true,\r\n }\"></ng-container>\r\n <!-- logo & title -->\r\n <div\r\n class=\"lf-header-logo-title-wrapper ml-1 mr-2\"\r\n [class.ml-10]=\"headerConfig.leftMenuButton && !isMobile\">\r\n <!-- link wrapper -->\r\n <div\r\n class=\"lf-header-logo-title-wrapper-link\"\r\n [class.lf-clickable]=\"headerConfig.titleRouterLink\"\r\n [routerLink]=\"headerConfig.titleRouterLink ? [headerConfig.titleRouterLink] : null\">\r\n <!-- svg logo -->\r\n @if (headerConfig.svgLogo) {\r\n <mat-icon\r\n class=\"lf-header-logo\"\r\n [class.mr-3]=\"headerConfig.title\"\r\n [svgIcon]=\"headerConfig.svgLogo!\"></mat-icon>\r\n } @else {\r\n @if (headerConfig.imgLogo) {\r\n <img\r\n class=\"lf-header-logo\"\r\n [class.mr-3]=\"headerConfig.title\"\r\n [src]=\"headerConfig.imgLogo\"\r\n alt=\"Logo\" />\r\n }\r\n }\r\n <!-- img logo -->\r\n <!-- title -->\r\n @if (headerConfig.title) {\r\n <div class=\"lf-header-title-wrapper\">\r\n @if (headerConfig.title) {\r\n <span class=\"lf-header-title\">\r\n {{ headerConfig.title }}\r\n </span>\r\n }\r\n @if (headerConfig.subtitle) {\r\n <span class=\"lf-header-subtitle\">\r\n {{ headerConfig.subtitle }}\r\n </span>\r\n }\r\n </div>\r\n }\r\n </div>\r\n </div>\r\n <!-- input -->\r\n @if (headerConfig.inputConfig?.enable) {\r\n <div class=\"spacer\"></div>\r\n <lf-input\r\n [class.lf-header-input-mobile]=\"isMobile\"\r\n [class.mx-3]=\"!isMobile\"\r\n [inputConfig]=\"headerConfig.inputConfig!\"\r\n [isMobile]=\"isMobile\"\r\n (inputSubmitEvent)=\"inputSubmitted($event)\"\r\n (inputChangeEvent)=\"inputChanged($event)\"\r\n (inputPrefixActionEvent)=\"headerConfig.inputConfig!.enable = false\"></lf-input>\r\n }\r\n <!-- spacer -->\r\n <div class=\"spacer\"></div>\r\n <!-- right menu buttons -->\r\n @for (button of headerConfig.rightMenuButtons; track button) {\r\n <ng-container\r\n [ngTemplateOutlet]=\"menuButtonTemplate\"\r\n [ngTemplateOutletContext]=\"{\r\n menuButton: button,\r\n }\"></ng-container>\r\n }\r\n </mat-toolbar>\r\n <!-- loading bar -->\r\n @if (headerConfig.loading || (headerConfig.showRouteLoading && routeLoading)) {\r\n <mat-progress-bar\r\n class=\"lf-header-progress-bar\"\r\n color=\"accent\"\r\n mode=\"indeterminate\"></mat-progress-bar>\r\n }\r\n}\r\n\r\n<!-- header menu button -->\r\n<ng-template #menuButtonTemplate let-menuButton=\"menuButton\" let-hideLabel=\"hideLabel\">\r\n @if (menuButton) {\r\n <!-- icon button -->\r\n @if ((menuButton.matIcon || menuButton.svgIcon) && (!menuButton.label || hideLabel)) {\r\n <button\r\n mat-icon-button\r\n class=\"lf-header-menu-button\"\r\n [ngClass]=\"menuButton.class\"\r\n (click)=\"buttonClicked(menuButton.id)\"\r\n [matMenuTriggerFor]=\"menuButton.menuButtons ? menu : null\"\r\n [matTooltip]=\"menuButton.tooltip\"\r\n [attr.aria-label]=\"menuButton.id\">\r\n <!-- icon -->\r\n <lf-icon\r\n [matIcon]=\"menuButton.matIcon\"\r\n [svgIcon]=\"menuButton.svgIcon\"\r\n [outlineIcon]=\"menuButton.outlineIcon\"></lf-icon>\r\n </button>\r\n } @else {\r\n @if (!hideLabel) {\r\n <button\r\n mat-button\r\n class=\"lf-header-menu-button\"\r\n [class.lf-header-menu-button-active]=\"isActive(menuButton.id)\"\r\n [ngClass]=\"menuButton.class\"\r\n (click)=\"buttonClicked(menuButton.id)\"\r\n [matMenuTriggerFor]=\"menuButton.menuButtons ? menu : null\"\r\n [matTooltip]=\"menuButton.tooltip\">\r\n <!-- label -->\r\n {{ menuButton.label }}\r\n </button>\r\n }\r\n }\r\n <!-- text button -->\r\n <!-- menu -->\r\n <mat-menu #menu=\"matMenu\">\r\n <!-- label menu buttons -->\r\n @for (button of menuButton.menuButtons; track button) {\r\n <!-- menu button -->\r\n @if (button.label) {\r\n <button\r\n mat-menu-item\r\n [class.lf-header-menu-button-active]=\"isActive(button.id)\"\r\n [ngClass]=\"button.class\"\r\n (click)=\"buttonClicked(button.id)\">\r\n <!-- icon -->\r\n <lf-icon\r\n [matIcon]=\"button.matIcon\"\r\n [svgIcon]=\"button.svgIcon\"\r\n [outlineIcon]=\"button.outlineIcon\"\r\n [alignMiddle]=\"true\"></lf-icon>\r\n <!-- label -->\r\n @if (button.label) {\r\n <span>{{ button.label }}</span>\r\n }\r\n </button>\r\n }\r\n }\r\n <!-- icon menu buttons -->\r\n <div class=\"lf-menu-icons px-1\">\r\n @for (button of menuButton.menuButtons; track button) {\r\n <!-- icon button -->\r\n @if (!button.label && (button.matIcon || button.svgIcon)) {\r\n <button\r\n mat-icon-button\r\n class=\"lf-menu-icon-button\"\r\n [ngClass]=\"button.class\"\r\n (click)=\"buttonClicked(button.id)\"\r\n [matTooltip]=\"button.tooltip\">\r\n <!-- icon -->\r\n <lf-icon\r\n [matIcon]=\"button.matIcon\"\r\n [svgIcon]=\"button.svgIcon\"\r\n [outlineIcon]=\"button.outlineIcon\"></lf-icon>\r\n </button>\r\n }\r\n }\r\n </div>\r\n </mat-menu>\r\n }\r\n</ng-template>\r\n", styles: [".lf-header{transition:top .3s;z-index:100;position:fixed;top:0;height:64px}.lf-header .lf-header-menu-button{flex-shrink:0;max-width:144px}.lf-header .lf-header-menu-button ::ng-deep .mdc-button__label{overflow:hidden;text-overflow:ellipsis}.lf-header .lf-header-menu-button.lf-header-menu-button-active{background-color:#fff}.lf-header .lf-header-logo-title-wrapper{flex:0 0 auto;max-width:480px;overflow:hidden;display:flex}.lf-header .lf-header-logo-title-wrapper .lf-header-logo-title-wrapper-link{display:flex;flex-flow:row nowrap;align-items:center;flex:0}.lf-header .lf-header-logo-title-wrapper .lf-header-logo-title-wrapper-link.lf-clickable{cursor:pointer}.lf-header .lf-header-logo-title-wrapper .lf-header-logo{width:40px;height:40px;min-width:40px;min-height:40px}.lf-header .lf-header-logo-title-wrapper .lf-header-title-wrapper{display:flex;flex-flow:column}.lf-header .lf-header-logo-title-wrapper .lf-header-title-wrapper .lf-header-title{font-size:20px;line-height:28px}.lf-header .lf-header-logo-title-wrapper .lf-header-title-wrapper .lf-header-subtitle{font-size:12px;line-height:12px}.lf-header lf-input{z-index:100;flex:1 1 480px}.lf-header lf-input.lf-header-input-mobile{position:fixed!important;left:4px!important;right:4px!important;width:unset!important;max-width:unset!important}.lf-header .spacer{flex:1 0 auto}.lf-menu-icons{display:flex;flex-flow:row wrap;align-items:center;justify-content:flex-start}.lf-header-progress-bar{z-index:100;position:fixed;top:64px}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i2$2.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "component", type: i2.MatButton, selector: " button[matButton], a[matButton], button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button], a[mat-flat-button], a[mat-stroked-button] ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }, { kind: "component", type: i2.MatIconButton, selector: "button[mat-icon-button], a[mat-icon-button], button[matIconButton], a[matIconButton]", exportAs: ["matButton", "matAnchor"] }, { kind: "component", type: i4$2.MatMenu, selector: "mat-menu", inputs: ["backdropClass", "aria-label", "aria-labelledby", "aria-describedby", "xPosition", "yPosition", "overlapTrigger", "hasBackdrop", "class", "classList"], outputs: ["closed", "close"], exportAs: ["matMenu"] }, { kind: "component", type: i4$2.MatMenuItem, selector: "[mat-menu-item]", inputs: ["role", "disabled", "disableRipple"], exportAs: ["matMenuItem"] }, { kind: "directive", type: i4$2.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", inputs: ["mat-menu-trigger-for", "matMenuTriggerFor", "matMenuTriggerData", "matMenuTriggerRestoreFocus"], outputs: ["menuOpened", "onMenuOpen", "menuClosed", "onMenuClose"], exportAs: ["matMenuTrigger"] }, { kind: "component", type: i5.MatToolbar, selector: "mat-toolbar", inputs: ["color"], exportAs: ["matToolbar"] }, { kind: "component", type: i4.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i7.MatProgressBar, selector: "mat-progress-bar", inputs: ["color", "value", "bufferValue", "mode"], outputs: ["animationEnd"], exportAs: ["matProgressBar"] }, { kind: "directive", type: i4$1.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "component", type: InputComponent, selector: "lf-input", inputs: ["inputConfig", "isMobile"], outputs: ["inputSubmitEvent", "inputChangeEvent", "inputPrefixActionEvent"] }, { kind: "component", type: IconComponent, selector: "lf-icon", inputs: ["matIcon", "svgIcon", "outlineIcon", "alignMiddle"] }] }); }
507
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.5", type: HeaderComponent, isStandalone: false, selector: "lf-header", inputs: { libraryConfig: "libraryConfig", headerConfig: "headerConfig", isMobile: "isMobile", routeLoading: "routeLoading", currentRoute: "currentRoute" }, outputs: { headerButtonClickEvent: "headerButtonClickEvent", headerInputSubmitEvent: "headerInputSubmitEvent", headerInputChangeEvent: "headerInputChangeEvent" }, ngImport: i0, template: "@if (headerConfig && headerConfig.enable) {\r\n <mat-toolbar\r\n class=\"lf-header mat-elevation-z3\"\r\n [class.px-4]=\"!isMobile\"\r\n [class.px-1]=\"isMobile\"\r\n [ngClass]=\"headerConfig.class\"\r\n color=\"primary\">\r\n <!-- left menu button -->\r\n <ng-container\r\n [ngTemplateOutlet]=\"menuButtonTemplate\"\r\n [ngTemplateOutletContext]=\"{\r\n menuButton: headerConfig.leftMenuButton!,\r\n hideLabel: true,\r\n }\"></ng-container>\r\n <!-- logo & title -->\r\n <div\r\n class=\"lf-header-logo-title-wrapper ml-1 mr-2\"\r\n [class.ml-10]=\"headerConfig.leftMenuButton && !isMobile\">\r\n <!-- link wrapper -->\r\n <div\r\n class=\"lf-header-logo-title-wrapper-link\"\r\n [class.lf-clickable]=\"headerConfig.titleRouterLink\"\r\n [routerLink]=\"headerConfig.titleRouterLink ? [headerConfig.titleRouterLink] : null\">\r\n <!-- svg logo -->\r\n @if (headerConfig.svgLogo) {\r\n <mat-icon\r\n class=\"lf-header-logo\"\r\n [class.mr-3]=\"headerConfig.title\"\r\n [svgIcon]=\"headerConfig.svgLogo!\"></mat-icon>\r\n } @else {\r\n @if (headerConfig.imgLogo) {\r\n <img\r\n class=\"lf-header-logo\"\r\n [class.mr-3]=\"headerConfig.title\"\r\n [src]=\"headerConfig.imgLogo\"\r\n alt=\"Logo\" />\r\n }\r\n }\r\n <!-- img logo -->\r\n <!-- title -->\r\n @if (headerConfig.title) {\r\n <div class=\"lf-header-title-wrapper\">\r\n @if (headerConfig.title) {\r\n <span class=\"lf-header-title\">\r\n {{ headerConfig.title }}\r\n </span>\r\n }\r\n @if (headerConfig.subtitle) {\r\n <span class=\"lf-header-subtitle\">\r\n {{ headerConfig.subtitle }}\r\n </span>\r\n }\r\n </div>\r\n }\r\n </div>\r\n </div>\r\n <!-- input -->\r\n @if (headerConfig.inputConfig?.enable) {\r\n <div class=\"spacer\"></div>\r\n <lf-input\r\n [class.lf-header-input-mobile]=\"isMobile\"\r\n [class.mx-3]=\"!isMobile\"\r\n [inputConfig]=\"headerConfig.inputConfig!\"\r\n [isMobile]=\"isMobile\"\r\n (inputSubmitEvent)=\"inputSubmitted($event)\"\r\n (inputChangeEvent)=\"inputChanged($event)\"\r\n (inputPrefixActionEvent)=\"headerConfig.inputConfig!.enable = false\"></lf-input>\r\n }\r\n <!-- spacer -->\r\n <div class=\"spacer\"></div>\r\n <!-- right menu buttons -->\r\n @for (button of headerConfig.rightMenuButtons; track button) {\r\n <ng-container\r\n [ngTemplateOutlet]=\"menuButtonTemplate\"\r\n [ngTemplateOutletContext]=\"{\r\n menuButton: button,\r\n }\"></ng-container>\r\n }\r\n </mat-toolbar>\r\n <!-- loading bar -->\r\n @if (headerConfig.loading || (headerConfig.showRouteLoading && routeLoading)) {\r\n <mat-progress-bar\r\n class=\"lf-header-progress-bar\"\r\n color=\"accent\"\r\n mode=\"indeterminate\"></mat-progress-bar>\r\n }\r\n}\r\n\r\n<!-- header menu button -->\r\n<ng-template #menuButtonTemplate let-menuButton=\"menuButton\" let-hideLabel=\"hideLabel\">\r\n @if (menuButton) {\r\n <!-- icon button -->\r\n @if ((menuButton.matIcon || menuButton.svgIcon) && (!menuButton.label || hideLabel)) {\r\n <button\r\n mat-icon-button\r\n class=\"lf-header-menu-button\"\r\n [ngClass]=\"menuButton.class\"\r\n (click)=\"buttonClicked(menuButton.id)\"\r\n [matMenuTriggerFor]=\"menuButton.menuButtons ? menu : null\"\r\n [matTooltip]=\"menuButton.tooltip\"\r\n [attr.aria-label]=\"menuButton.id\">\r\n <!-- icon -->\r\n <lf-icon [matIcon]=\"menuButton.matIcon\" [svgIcon]=\"menuButton.svgIcon\"></lf-icon>\r\n </button>\r\n } @else {\r\n @if (!hideLabel) {\r\n <button\r\n mat-button\r\n class=\"lf-header-menu-button\"\r\n [class.lf-header-menu-button-active]=\"isActive(menuButton.id)\"\r\n [ngClass]=\"menuButton.class\"\r\n (click)=\"buttonClicked(menuButton.id)\"\r\n [matMenuTriggerFor]=\"menuButton.menuButtons ? menu : null\"\r\n [matTooltip]=\"menuButton.tooltip\">\r\n <!-- label -->\r\n {{ menuButton.label }}\r\n </button>\r\n }\r\n }\r\n <!-- text button -->\r\n <!-- menu -->\r\n <mat-menu #menu=\"matMenu\">\r\n <!-- label menu buttons -->\r\n @for (button of menuButton.menuButtons; track button) {\r\n <!-- menu button -->\r\n @if (button.label) {\r\n <button\r\n mat-menu-item\r\n [class.lf-header-menu-button-active]=\"isActive(button.id)\"\r\n [ngClass]=\"button.class\"\r\n (click)=\"buttonClicked(button.id)\">\r\n <!-- icon -->\r\n <lf-icon\r\n [matIcon]=\"button.matIcon\"\r\n [svgIcon]=\"button.svgIcon\"\r\n [alignMiddle]=\"true\"></lf-icon>\r\n <!-- label -->\r\n @if (button.label) {\r\n <span>{{ button.label }}</span>\r\n }\r\n </button>\r\n }\r\n }\r\n <!-- icon menu buttons -->\r\n <div class=\"lf-menu-icons px-1\">\r\n @for (button of menuButton.menuButtons; track button) {\r\n <!-- icon button -->\r\n @if (!button.label && (button.matIcon || button.svgIcon)) {\r\n <button\r\n mat-icon-button\r\n class=\"lf-menu-icon-button\"\r\n [ngClass]=\"button.class\"\r\n (click)=\"buttonClicked(button.id)\"\r\n [matTooltip]=\"button.tooltip\">\r\n <!-- icon -->\r\n <lf-icon [matIcon]=\"button.matIcon\" [svgIcon]=\"button.svgIcon\"></lf-icon>\r\n </button>\r\n }\r\n }\r\n </div>\r\n </mat-menu>\r\n }\r\n</ng-template>\r\n", styles: [".lf-header{transition:top .3s;z-index:100;position:fixed;top:0;height:64px}.lf-header .lf-header-menu-button{flex-shrink:0;max-width:144px}.lf-header .lf-header-menu-button ::ng-deep .mdc-button__label{overflow:hidden;text-overflow:ellipsis}.lf-header .lf-header-menu-button.lf-header-menu-button-active{background-color:#fff}.lf-header .lf-header-logo-title-wrapper{flex:0 0 auto;max-width:480px;overflow:hidden;display:flex}.lf-header .lf-header-logo-title-wrapper .lf-header-logo-title-wrapper-link{display:flex;flex-flow:row nowrap;align-items:center;flex:0}.lf-header .lf-header-logo-title-wrapper .lf-header-logo-title-wrapper-link.lf-clickable{cursor:pointer}.lf-header .lf-header-logo-title-wrapper .lf-header-logo{width:40px;height:40px;min-width:40px;min-height:40px}.lf-header .lf-header-logo-title-wrapper .lf-header-title-wrapper{display:flex;flex-flow:column}.lf-header .lf-header-logo-title-wrapper .lf-header-title-wrapper .lf-header-title{font-size:20px;line-height:28px}.lf-header .lf-header-logo-title-wrapper .lf-header-title-wrapper .lf-header-subtitle{font-size:12px;line-height:12px}.lf-header lf-input{z-index:100;flex:1 1 480px}.lf-header lf-input.lf-header-input-mobile{position:fixed!important;left:4px!important;right:4px!important;width:unset!important;max-width:unset!important}.lf-header .spacer{flex:1 0 auto}.lf-menu-icons{display:flex;flex-flow:row wrap;align-items:center;justify-content:flex-start}.lf-header-progress-bar{z-index:100;position:fixed;top:64px}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i2$2.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "component", type: i2.MatButton, selector: " button[matButton], a[matButton], button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button], a[mat-flat-button], a[mat-stroked-button] ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }, { kind: "component", type: i2.MatIconButton, selector: "button[mat-icon-button], a[mat-icon-button], button[matIconButton], a[matIconButton]", exportAs: ["matButton", "matAnchor"] }, { kind: "component", type: i4$2.MatMenu, selector: "mat-menu", inputs: ["backdropClass", "aria-label", "aria-labelledby", "aria-describedby", "xPosition", "yPosition", "overlapTrigger", "hasBackdrop", "class", "classList"], outputs: ["closed", "close"], exportAs: ["matMenu"] }, { kind: "component", type: i4$2.MatMenuItem, selector: "[mat-menu-item]", inputs: ["role", "disabled", "disableRipple"], exportAs: ["matMenuItem"] }, { kind: "directive", type: i4$2.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", inputs: ["mat-menu-trigger-for", "matMenuTriggerFor", "matMenuTriggerData", "matMenuTriggerRestoreFocus"], outputs: ["menuOpened", "onMenuOpen", "menuClosed", "onMenuClose"], exportAs: ["matMenuTrigger"] }, { kind: "component", type: i5.MatToolbar, selector: "mat-toolbar", inputs: ["color"], exportAs: ["matToolbar"] }, { kind: "component", type: i4.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i7.MatProgressBar, selector: "mat-progress-bar", inputs: ["color", "value", "bufferValue", "mode"], outputs: ["animationEnd"], exportAs: ["matProgressBar"] }, { kind: "directive", type: i4$1.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "component", type: InputComponent, selector: "lf-input", inputs: ["inputConfig", "isMobile"], outputs: ["inputSubmitEvent", "inputChangeEvent", "inputPrefixActionEvent"] }, { kind: "component", type: IconComponent, selector: "lf-icon", inputs: ["matIcon", "svgIcon", "alignMiddle"] }] }); }
492
508
  }
493
509
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.5", ngImport: i0, type: HeaderComponent, decorators: [{
494
510
  type: Component,
495
- args: [{ selector: 'lf-header', standalone: false, template: "@if (headerConfig && headerConfig.enable) {\r\n <mat-toolbar\r\n class=\"lf-header mat-elevation-z3\"\r\n [class.px-4]=\"!isMobile\"\r\n [class.px-1]=\"isMobile\"\r\n [ngClass]=\"headerConfig.class\"\r\n color=\"primary\">\r\n <!-- left menu button -->\r\n <ng-container\r\n [ngTemplateOutlet]=\"menuButtonTemplate\"\r\n [ngTemplateOutletContext]=\"{\r\n menuButton: headerConfig.leftMenuButton!,\r\n hideLabel: true,\r\n }\"></ng-container>\r\n <!-- logo & title -->\r\n <div\r\n class=\"lf-header-logo-title-wrapper ml-1 mr-2\"\r\n [class.ml-10]=\"headerConfig.leftMenuButton && !isMobile\">\r\n <!-- link wrapper -->\r\n <div\r\n class=\"lf-header-logo-title-wrapper-link\"\r\n [class.lf-clickable]=\"headerConfig.titleRouterLink\"\r\n [routerLink]=\"headerConfig.titleRouterLink ? [headerConfig.titleRouterLink] : null\">\r\n <!-- svg logo -->\r\n @if (headerConfig.svgLogo) {\r\n <mat-icon\r\n class=\"lf-header-logo\"\r\n [class.mr-3]=\"headerConfig.title\"\r\n [svgIcon]=\"headerConfig.svgLogo!\"></mat-icon>\r\n } @else {\r\n @if (headerConfig.imgLogo) {\r\n <img\r\n class=\"lf-header-logo\"\r\n [class.mr-3]=\"headerConfig.title\"\r\n [src]=\"headerConfig.imgLogo\"\r\n alt=\"Logo\" />\r\n }\r\n }\r\n <!-- img logo -->\r\n <!-- title -->\r\n @if (headerConfig.title) {\r\n <div class=\"lf-header-title-wrapper\">\r\n @if (headerConfig.title) {\r\n <span class=\"lf-header-title\">\r\n {{ headerConfig.title }}\r\n </span>\r\n }\r\n @if (headerConfig.subtitle) {\r\n <span class=\"lf-header-subtitle\">\r\n {{ headerConfig.subtitle }}\r\n </span>\r\n }\r\n </div>\r\n }\r\n </div>\r\n </div>\r\n <!-- input -->\r\n @if (headerConfig.inputConfig?.enable) {\r\n <div class=\"spacer\"></div>\r\n <lf-input\r\n [class.lf-header-input-mobile]=\"isMobile\"\r\n [class.mx-3]=\"!isMobile\"\r\n [inputConfig]=\"headerConfig.inputConfig!\"\r\n [isMobile]=\"isMobile\"\r\n (inputSubmitEvent)=\"inputSubmitted($event)\"\r\n (inputChangeEvent)=\"inputChanged($event)\"\r\n (inputPrefixActionEvent)=\"headerConfig.inputConfig!.enable = false\"></lf-input>\r\n }\r\n <!-- spacer -->\r\n <div class=\"spacer\"></div>\r\n <!-- right menu buttons -->\r\n @for (button of headerConfig.rightMenuButtons; track button) {\r\n <ng-container\r\n [ngTemplateOutlet]=\"menuButtonTemplate\"\r\n [ngTemplateOutletContext]=\"{\r\n menuButton: button,\r\n }\"></ng-container>\r\n }\r\n </mat-toolbar>\r\n <!-- loading bar -->\r\n @if (headerConfig.loading || (headerConfig.showRouteLoading && routeLoading)) {\r\n <mat-progress-bar\r\n class=\"lf-header-progress-bar\"\r\n color=\"accent\"\r\n mode=\"indeterminate\"></mat-progress-bar>\r\n }\r\n}\r\n\r\n<!-- header menu button -->\r\n<ng-template #menuButtonTemplate let-menuButton=\"menuButton\" let-hideLabel=\"hideLabel\">\r\n @if (menuButton) {\r\n <!-- icon button -->\r\n @if ((menuButton.matIcon || menuButton.svgIcon) && (!menuButton.label || hideLabel)) {\r\n <button\r\n mat-icon-button\r\n class=\"lf-header-menu-button\"\r\n [ngClass]=\"menuButton.class\"\r\n (click)=\"buttonClicked(menuButton.id)\"\r\n [matMenuTriggerFor]=\"menuButton.menuButtons ? menu : null\"\r\n [matTooltip]=\"menuButton.tooltip\"\r\n [attr.aria-label]=\"menuButton.id\">\r\n <!-- icon -->\r\n <lf-icon\r\n [matIcon]=\"menuButton.matIcon\"\r\n [svgIcon]=\"menuButton.svgIcon\"\r\n [outlineIcon]=\"menuButton.outlineIcon\"></lf-icon>\r\n </button>\r\n } @else {\r\n @if (!hideLabel) {\r\n <button\r\n mat-button\r\n class=\"lf-header-menu-button\"\r\n [class.lf-header-menu-button-active]=\"isActive(menuButton.id)\"\r\n [ngClass]=\"menuButton.class\"\r\n (click)=\"buttonClicked(menuButton.id)\"\r\n [matMenuTriggerFor]=\"menuButton.menuButtons ? menu : null\"\r\n [matTooltip]=\"menuButton.tooltip\">\r\n <!-- label -->\r\n {{ menuButton.label }}\r\n </button>\r\n }\r\n }\r\n <!-- text button -->\r\n <!-- menu -->\r\n <mat-menu #menu=\"matMenu\">\r\n <!-- label menu buttons -->\r\n @for (button of menuButton.menuButtons; track button) {\r\n <!-- menu button -->\r\n @if (button.label) {\r\n <button\r\n mat-menu-item\r\n [class.lf-header-menu-button-active]=\"isActive(button.id)\"\r\n [ngClass]=\"button.class\"\r\n (click)=\"buttonClicked(button.id)\">\r\n <!-- icon -->\r\n <lf-icon\r\n [matIcon]=\"button.matIcon\"\r\n [svgIcon]=\"button.svgIcon\"\r\n [outlineIcon]=\"button.outlineIcon\"\r\n [alignMiddle]=\"true\"></lf-icon>\r\n <!-- label -->\r\n @if (button.label) {\r\n <span>{{ button.label }}</span>\r\n }\r\n </button>\r\n }\r\n }\r\n <!-- icon menu buttons -->\r\n <div class=\"lf-menu-icons px-1\">\r\n @for (button of menuButton.menuButtons; track button) {\r\n <!-- icon button -->\r\n @if (!button.label && (button.matIcon || button.svgIcon)) {\r\n <button\r\n mat-icon-button\r\n class=\"lf-menu-icon-button\"\r\n [ngClass]=\"button.class\"\r\n (click)=\"buttonClicked(button.id)\"\r\n [matTooltip]=\"button.tooltip\">\r\n <!-- icon -->\r\n <lf-icon\r\n [matIcon]=\"button.matIcon\"\r\n [svgIcon]=\"button.svgIcon\"\r\n [outlineIcon]=\"button.outlineIcon\"></lf-icon>\r\n </button>\r\n }\r\n }\r\n </div>\r\n </mat-menu>\r\n }\r\n</ng-template>\r\n", styles: [".lf-header{transition:top .3s;z-index:100;position:fixed;top:0;height:64px}.lf-header .lf-header-menu-button{flex-shrink:0;max-width:144px}.lf-header .lf-header-menu-button ::ng-deep .mdc-button__label{overflow:hidden;text-overflow:ellipsis}.lf-header .lf-header-menu-button.lf-header-menu-button-active{background-color:#fff}.lf-header .lf-header-logo-title-wrapper{flex:0 0 auto;max-width:480px;overflow:hidden;display:flex}.lf-header .lf-header-logo-title-wrapper .lf-header-logo-title-wrapper-link{display:flex;flex-flow:row nowrap;align-items:center;flex:0}.lf-header .lf-header-logo-title-wrapper .lf-header-logo-title-wrapper-link.lf-clickable{cursor:pointer}.lf-header .lf-header-logo-title-wrapper .lf-header-logo{width:40px;height:40px;min-width:40px;min-height:40px}.lf-header .lf-header-logo-title-wrapper .lf-header-title-wrapper{display:flex;flex-flow:column}.lf-header .lf-header-logo-title-wrapper .lf-header-title-wrapper .lf-header-title{font-size:20px;line-height:28px}.lf-header .lf-header-logo-title-wrapper .lf-header-title-wrapper .lf-header-subtitle{font-size:12px;line-height:12px}.lf-header lf-input{z-index:100;flex:1 1 480px}.lf-header lf-input.lf-header-input-mobile{position:fixed!important;left:4px!important;right:4px!important;width:unset!important;max-width:unset!important}.lf-header .spacer{flex:1 0 auto}.lf-menu-icons{display:flex;flex-flow:row wrap;align-items:center;justify-content:flex-start}.lf-header-progress-bar{z-index:100;position:fixed;top:64px}\n"] }]
496
- }], propDecorators: { headerConfig: [{
511
+ args: [{ selector: 'lf-header', standalone: false, template: "@if (headerConfig && headerConfig.enable) {\r\n <mat-toolbar\r\n class=\"lf-header mat-elevation-z3\"\r\n [class.px-4]=\"!isMobile\"\r\n [class.px-1]=\"isMobile\"\r\n [ngClass]=\"headerConfig.class\"\r\n color=\"primary\">\r\n <!-- left menu button -->\r\n <ng-container\r\n [ngTemplateOutlet]=\"menuButtonTemplate\"\r\n [ngTemplateOutletContext]=\"{\r\n menuButton: headerConfig.leftMenuButton!,\r\n hideLabel: true,\r\n }\"></ng-container>\r\n <!-- logo & title -->\r\n <div\r\n class=\"lf-header-logo-title-wrapper ml-1 mr-2\"\r\n [class.ml-10]=\"headerConfig.leftMenuButton && !isMobile\">\r\n <!-- link wrapper -->\r\n <div\r\n class=\"lf-header-logo-title-wrapper-link\"\r\n [class.lf-clickable]=\"headerConfig.titleRouterLink\"\r\n [routerLink]=\"headerConfig.titleRouterLink ? [headerConfig.titleRouterLink] : null\">\r\n <!-- svg logo -->\r\n @if (headerConfig.svgLogo) {\r\n <mat-icon\r\n class=\"lf-header-logo\"\r\n [class.mr-3]=\"headerConfig.title\"\r\n [svgIcon]=\"headerConfig.svgLogo!\"></mat-icon>\r\n } @else {\r\n @if (headerConfig.imgLogo) {\r\n <img\r\n class=\"lf-header-logo\"\r\n [class.mr-3]=\"headerConfig.title\"\r\n [src]=\"headerConfig.imgLogo\"\r\n alt=\"Logo\" />\r\n }\r\n }\r\n <!-- img logo -->\r\n <!-- title -->\r\n @if (headerConfig.title) {\r\n <div class=\"lf-header-title-wrapper\">\r\n @if (headerConfig.title) {\r\n <span class=\"lf-header-title\">\r\n {{ headerConfig.title }}\r\n </span>\r\n }\r\n @if (headerConfig.subtitle) {\r\n <span class=\"lf-header-subtitle\">\r\n {{ headerConfig.subtitle }}\r\n </span>\r\n }\r\n </div>\r\n }\r\n </div>\r\n </div>\r\n <!-- input -->\r\n @if (headerConfig.inputConfig?.enable) {\r\n <div class=\"spacer\"></div>\r\n <lf-input\r\n [class.lf-header-input-mobile]=\"isMobile\"\r\n [class.mx-3]=\"!isMobile\"\r\n [inputConfig]=\"headerConfig.inputConfig!\"\r\n [isMobile]=\"isMobile\"\r\n (inputSubmitEvent)=\"inputSubmitted($event)\"\r\n (inputChangeEvent)=\"inputChanged($event)\"\r\n (inputPrefixActionEvent)=\"headerConfig.inputConfig!.enable = false\"></lf-input>\r\n }\r\n <!-- spacer -->\r\n <div class=\"spacer\"></div>\r\n <!-- right menu buttons -->\r\n @for (button of headerConfig.rightMenuButtons; track button) {\r\n <ng-container\r\n [ngTemplateOutlet]=\"menuButtonTemplate\"\r\n [ngTemplateOutletContext]=\"{\r\n menuButton: button,\r\n }\"></ng-container>\r\n }\r\n </mat-toolbar>\r\n <!-- loading bar -->\r\n @if (headerConfig.loading || (headerConfig.showRouteLoading && routeLoading)) {\r\n <mat-progress-bar\r\n class=\"lf-header-progress-bar\"\r\n color=\"accent\"\r\n mode=\"indeterminate\"></mat-progress-bar>\r\n }\r\n}\r\n\r\n<!-- header menu button -->\r\n<ng-template #menuButtonTemplate let-menuButton=\"menuButton\" let-hideLabel=\"hideLabel\">\r\n @if (menuButton) {\r\n <!-- icon button -->\r\n @if ((menuButton.matIcon || menuButton.svgIcon) && (!menuButton.label || hideLabel)) {\r\n <button\r\n mat-icon-button\r\n class=\"lf-header-menu-button\"\r\n [ngClass]=\"menuButton.class\"\r\n (click)=\"buttonClicked(menuButton.id)\"\r\n [matMenuTriggerFor]=\"menuButton.menuButtons ? menu : null\"\r\n [matTooltip]=\"menuButton.tooltip\"\r\n [attr.aria-label]=\"menuButton.id\">\r\n <!-- icon -->\r\n <lf-icon [matIcon]=\"menuButton.matIcon\" [svgIcon]=\"menuButton.svgIcon\"></lf-icon>\r\n </button>\r\n } @else {\r\n @if (!hideLabel) {\r\n <button\r\n mat-button\r\n class=\"lf-header-menu-button\"\r\n [class.lf-header-menu-button-active]=\"isActive(menuButton.id)\"\r\n [ngClass]=\"menuButton.class\"\r\n (click)=\"buttonClicked(menuButton.id)\"\r\n [matMenuTriggerFor]=\"menuButton.menuButtons ? menu : null\"\r\n [matTooltip]=\"menuButton.tooltip\">\r\n <!-- label -->\r\n {{ menuButton.label }}\r\n </button>\r\n }\r\n }\r\n <!-- text button -->\r\n <!-- menu -->\r\n <mat-menu #menu=\"matMenu\">\r\n <!-- label menu buttons -->\r\n @for (button of menuButton.menuButtons; track button) {\r\n <!-- menu button -->\r\n @if (button.label) {\r\n <button\r\n mat-menu-item\r\n [class.lf-header-menu-button-active]=\"isActive(button.id)\"\r\n [ngClass]=\"button.class\"\r\n (click)=\"buttonClicked(button.id)\">\r\n <!-- icon -->\r\n <lf-icon\r\n [matIcon]=\"button.matIcon\"\r\n [svgIcon]=\"button.svgIcon\"\r\n [alignMiddle]=\"true\"></lf-icon>\r\n <!-- label -->\r\n @if (button.label) {\r\n <span>{{ button.label }}</span>\r\n }\r\n </button>\r\n }\r\n }\r\n <!-- icon menu buttons -->\r\n <div class=\"lf-menu-icons px-1\">\r\n @for (button of menuButton.menuButtons; track button) {\r\n <!-- icon button -->\r\n @if (!button.label && (button.matIcon || button.svgIcon)) {\r\n <button\r\n mat-icon-button\r\n class=\"lf-menu-icon-button\"\r\n [ngClass]=\"button.class\"\r\n (click)=\"buttonClicked(button.id)\"\r\n [matTooltip]=\"button.tooltip\">\r\n <!-- icon -->\r\n <lf-icon [matIcon]=\"button.matIcon\" [svgIcon]=\"button.svgIcon\"></lf-icon>\r\n </button>\r\n }\r\n }\r\n </div>\r\n </mat-menu>\r\n }\r\n</ng-template>\r\n", styles: [".lf-header{transition:top .3s;z-index:100;position:fixed;top:0;height:64px}.lf-header .lf-header-menu-button{flex-shrink:0;max-width:144px}.lf-header .lf-header-menu-button ::ng-deep .mdc-button__label{overflow:hidden;text-overflow:ellipsis}.lf-header .lf-header-menu-button.lf-header-menu-button-active{background-color:#fff}.lf-header .lf-header-logo-title-wrapper{flex:0 0 auto;max-width:480px;overflow:hidden;display:flex}.lf-header .lf-header-logo-title-wrapper .lf-header-logo-title-wrapper-link{display:flex;flex-flow:row nowrap;align-items:center;flex:0}.lf-header .lf-header-logo-title-wrapper .lf-header-logo-title-wrapper-link.lf-clickable{cursor:pointer}.lf-header .lf-header-logo-title-wrapper .lf-header-logo{width:40px;height:40px;min-width:40px;min-height:40px}.lf-header .lf-header-logo-title-wrapper .lf-header-title-wrapper{display:flex;flex-flow:column}.lf-header .lf-header-logo-title-wrapper .lf-header-title-wrapper .lf-header-title{font-size:20px;line-height:28px}.lf-header .lf-header-logo-title-wrapper .lf-header-title-wrapper .lf-header-subtitle{font-size:12px;line-height:12px}.lf-header lf-input{z-index:100;flex:1 1 480px}.lf-header lf-input.lf-header-input-mobile{position:fixed!important;left:4px!important;right:4px!important;width:unset!important;max-width:unset!important}.lf-header .spacer{flex:1 0 auto}.lf-menu-icons{display:flex;flex-flow:row wrap;align-items:center;justify-content:flex-start}.lf-header-progress-bar{z-index:100;position:fixed;top:64px}\n"] }]
512
+ }], propDecorators: { libraryConfig: [{
513
+ type: Input
514
+ }], headerConfig: [{
497
515
  type: Input
498
516
  }], isMobile: [{
499
517
  type: Input
@@ -520,6 +538,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.5", ngImpor
520
538
 
521
539
  class NavbarComponent {
522
540
  constructor() {
541
+ this.libraryConfig = null;
523
542
  this.navbarConfig = null;
524
543
  this.isMobile = false;
525
544
  this.navbarButtonClickEvent = new EventEmitter();
@@ -538,12 +557,14 @@ class NavbarComponent {
538
557
  return route === id;
539
558
  }
540
559
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.5", ngImport: i0, type: NavbarComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
541
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.5", type: NavbarComponent, isStandalone: false, selector: "lf-navbar", inputs: { navbarConfig: "navbarConfig", isMobile: "isMobile", currentRoute: "currentRoute" }, outputs: { navbarButtonClickEvent: "navbarButtonClickEvent" }, ngImport: i0, template: "@if (navbarConfig && navbarConfig.enable) {\r\n <div\r\n class=\"mat-app-background mat-elevation-z3\"\r\n [class.lf-navbar]=\"!isMobile\"\r\n [class.lf-navbar-mobile]=\"isMobile\"\r\n [ngClass]=\"navbarConfig.class\">\r\n <!-- items -->\r\n <div [class.lf-navbar-items]=\"!isMobile\" [class.lf-navbar-mobile-items]=\"isMobile\">\r\n <!-- item -->\r\n @for (button of navbarConfig.menuButtons; track button; let i = $index) {\r\n @if (i < 5) {\r\n <div\r\n class=\"lf-navbar-item\"\r\n [class.lf-navbar-item-active]=\"isActive(button.id)\"\r\n [ngClass]=\"button.class\"\r\n (click)=\"buttonClicked(button.id)\"\r\n tabindex=\"0\"\r\n role=\"button\"\r\n [matTooltip]=\"button.tooltip\">\r\n <!-- icon -->\r\n <lf-icon\r\n [matIcon]=\"button.matIcon!\"\r\n [svgIcon]=\"button.svgIcon!\"\r\n [outlineIcon]=\"button.outlineIcon!\"></lf-icon>\r\n <!-- label -->\r\n <!-- show a protected space on desktop so the icon doesn't move up and down -->\r\n @if (button?.label) {\r\n <span class=\"lf-navbar-item-label\">\r\n {{\r\n isActive(button.id) || navbarConfig.showAllLabels\r\n ? button.label\r\n : isMobile\r\n ? \"\"\r\n : \"&nbsp;\"\r\n }}\r\n </span>\r\n }\r\n </div>\r\n }\r\n }\r\n </div>\r\n </div>\r\n}\r\n", styles: [".lf-navbar{z-index:99;position:fixed;left:0;top:0;height:100vh;padding:80px 4px 0;border-right:solid 1px rgba(0,0,0,.12)}.lf-navbar .lf-navbar-items{display:flex;flex-flow:column;align-items:center}.lf-navbar-mobile{z-index:99;position:fixed;left:0;bottom:0;width:100vw;padding:4px 0;box-sizing:border-box;border-top:solid 1px rgba(0,0,0,.12)}.lf-navbar-mobile .lf-navbar-mobile-items{display:flex;flex-flow:row nowrap;align-items:center;justify-content:space-evenly}.lf-navbar-mobile .lf-navbar-mobile-items .lf-navbar-item{height:56px!important}.lf-navbar-item{width:72px;height:72px;display:flex;align-items:center;justify-content:center;flex-flow:column;border-radius:16px;cursor:pointer}.lf-navbar-item.lf-navbar-item-active{color:var(--color-primary)}.lf-navbar-item .lf-navbar-item-icon{width:24px;height:24px;overflow:visible!important}.lf-navbar-item .lf-navbar-item-label{max-width:72px;white-space:nowrap!important;overflow:hidden;text-overflow:ellipsis;text-transform:none;vertical-align:top;font-size:12px;font-weight:500}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i4$1.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "component", type: IconComponent, selector: "lf-icon", inputs: ["matIcon", "svgIcon", "outlineIcon", "alignMiddle"] }] }); }
560
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.5", type: NavbarComponent, isStandalone: false, selector: "lf-navbar", inputs: { libraryConfig: "libraryConfig", navbarConfig: "navbarConfig", isMobile: "isMobile", currentRoute: "currentRoute" }, outputs: { navbarButtonClickEvent: "navbarButtonClickEvent" }, ngImport: i0, template: "@if (navbarConfig && navbarConfig.enable) {\r\n <div\r\n class=\"mat-app-background mat-elevation-z3\"\r\n [class.lf-navbar]=\"!isMobile\"\r\n [class.lf-navbar-mobile]=\"isMobile\"\r\n [ngClass]=\"navbarConfig.class\">\r\n <!-- items -->\r\n <div [class.lf-navbar-items]=\"!isMobile\" [class.lf-navbar-mobile-items]=\"isMobile\">\r\n <!-- item -->\r\n @for (button of navbarConfig.menuButtons; track button; let i = $index) {\r\n @if (i < 5) {\r\n <div\r\n class=\"lf-navbar-item\"\r\n [class.lf-navbar-item-active]=\"isActive(button.id)\"\r\n [ngClass]=\"button.class\"\r\n (click)=\"buttonClicked(button.id)\"\r\n tabindex=\"0\"\r\n role=\"button\"\r\n [matTooltip]=\"button.tooltip\">\r\n <!-- icon -->\r\n <lf-icon [matIcon]=\"button.matIcon!\" [svgIcon]=\"button.svgIcon!\"></lf-icon>\r\n <!-- label -->\r\n <!-- show a protected space on desktop so the icon doesn't move up and down -->\r\n @if (button?.label) {\r\n <span class=\"lf-navbar-item-label\">\r\n {{\r\n isActive(button.id) || navbarConfig.showAllLabels\r\n ? button.label\r\n : isMobile\r\n ? \"\"\r\n : \"&nbsp;\"\r\n }}\r\n </span>\r\n }\r\n </div>\r\n }\r\n }\r\n </div>\r\n </div>\r\n}\r\n", styles: [".lf-navbar{z-index:99;position:fixed;left:0;top:0;height:100vh;padding:80px 4px 0;border-right:solid 1px rgba(0,0,0,.12)}.lf-navbar .lf-navbar-items{display:flex;flex-flow:column;align-items:center}.lf-navbar-mobile{z-index:99;position:fixed;left:0;bottom:0;width:100vw;padding:4px 0;box-sizing:border-box;border-top:solid 1px rgba(0,0,0,.12)}.lf-navbar-mobile .lf-navbar-mobile-items{display:flex;flex-flow:row nowrap;align-items:center;justify-content:space-evenly}.lf-navbar-mobile .lf-navbar-mobile-items .lf-navbar-item{height:56px!important}.lf-navbar-item{width:72px;height:72px;display:flex;align-items:center;justify-content:center;flex-flow:column;border-radius:16px;cursor:pointer}.lf-navbar-item.lf-navbar-item-active{color:var(--color-primary)}.lf-navbar-item .lf-navbar-item-icon{width:24px;height:24px;overflow:visible!important}.lf-navbar-item .lf-navbar-item-label{max-width:72px;white-space:nowrap!important;overflow:hidden;text-overflow:ellipsis;text-transform:none;vertical-align:top;font-size:12px;font-weight:500}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i4$1.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "component", type: IconComponent, selector: "lf-icon", inputs: ["matIcon", "svgIcon", "alignMiddle"] }] }); }
542
561
  }
543
562
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.5", ngImport: i0, type: NavbarComponent, decorators: [{
544
563
  type: Component,
545
- args: [{ selector: 'lf-navbar', standalone: false, template: "@if (navbarConfig && navbarConfig.enable) {\r\n <div\r\n class=\"mat-app-background mat-elevation-z3\"\r\n [class.lf-navbar]=\"!isMobile\"\r\n [class.lf-navbar-mobile]=\"isMobile\"\r\n [ngClass]=\"navbarConfig.class\">\r\n <!-- items -->\r\n <div [class.lf-navbar-items]=\"!isMobile\" [class.lf-navbar-mobile-items]=\"isMobile\">\r\n <!-- item -->\r\n @for (button of navbarConfig.menuButtons; track button; let i = $index) {\r\n @if (i < 5) {\r\n <div\r\n class=\"lf-navbar-item\"\r\n [class.lf-navbar-item-active]=\"isActive(button.id)\"\r\n [ngClass]=\"button.class\"\r\n (click)=\"buttonClicked(button.id)\"\r\n tabindex=\"0\"\r\n role=\"button\"\r\n [matTooltip]=\"button.tooltip\">\r\n <!-- icon -->\r\n <lf-icon\r\n [matIcon]=\"button.matIcon!\"\r\n [svgIcon]=\"button.svgIcon!\"\r\n [outlineIcon]=\"button.outlineIcon!\"></lf-icon>\r\n <!-- label -->\r\n <!-- show a protected space on desktop so the icon doesn't move up and down -->\r\n @if (button?.label) {\r\n <span class=\"lf-navbar-item-label\">\r\n {{\r\n isActive(button.id) || navbarConfig.showAllLabels\r\n ? button.label\r\n : isMobile\r\n ? \"\"\r\n : \"&nbsp;\"\r\n }}\r\n </span>\r\n }\r\n </div>\r\n }\r\n }\r\n </div>\r\n </div>\r\n}\r\n", styles: [".lf-navbar{z-index:99;position:fixed;left:0;top:0;height:100vh;padding:80px 4px 0;border-right:solid 1px rgba(0,0,0,.12)}.lf-navbar .lf-navbar-items{display:flex;flex-flow:column;align-items:center}.lf-navbar-mobile{z-index:99;position:fixed;left:0;bottom:0;width:100vw;padding:4px 0;box-sizing:border-box;border-top:solid 1px rgba(0,0,0,.12)}.lf-navbar-mobile .lf-navbar-mobile-items{display:flex;flex-flow:row nowrap;align-items:center;justify-content:space-evenly}.lf-navbar-mobile .lf-navbar-mobile-items .lf-navbar-item{height:56px!important}.lf-navbar-item{width:72px;height:72px;display:flex;align-items:center;justify-content:center;flex-flow:column;border-radius:16px;cursor:pointer}.lf-navbar-item.lf-navbar-item-active{color:var(--color-primary)}.lf-navbar-item .lf-navbar-item-icon{width:24px;height:24px;overflow:visible!important}.lf-navbar-item .lf-navbar-item-label{max-width:72px;white-space:nowrap!important;overflow:hidden;text-overflow:ellipsis;text-transform:none;vertical-align:top;font-size:12px;font-weight:500}\n"] }]
546
- }], propDecorators: { navbarConfig: [{
564
+ args: [{ selector: 'lf-navbar', standalone: false, template: "@if (navbarConfig && navbarConfig.enable) {\r\n <div\r\n class=\"mat-app-background mat-elevation-z3\"\r\n [class.lf-navbar]=\"!isMobile\"\r\n [class.lf-navbar-mobile]=\"isMobile\"\r\n [ngClass]=\"navbarConfig.class\">\r\n <!-- items -->\r\n <div [class.lf-navbar-items]=\"!isMobile\" [class.lf-navbar-mobile-items]=\"isMobile\">\r\n <!-- item -->\r\n @for (button of navbarConfig.menuButtons; track button; let i = $index) {\r\n @if (i < 5) {\r\n <div\r\n class=\"lf-navbar-item\"\r\n [class.lf-navbar-item-active]=\"isActive(button.id)\"\r\n [ngClass]=\"button.class\"\r\n (click)=\"buttonClicked(button.id)\"\r\n tabindex=\"0\"\r\n role=\"button\"\r\n [matTooltip]=\"button.tooltip\">\r\n <!-- icon -->\r\n <lf-icon [matIcon]=\"button.matIcon!\" [svgIcon]=\"button.svgIcon!\"></lf-icon>\r\n <!-- label -->\r\n <!-- show a protected space on desktop so the icon doesn't move up and down -->\r\n @if (button?.label) {\r\n <span class=\"lf-navbar-item-label\">\r\n {{\r\n isActive(button.id) || navbarConfig.showAllLabels\r\n ? button.label\r\n : isMobile\r\n ? \"\"\r\n : \"&nbsp;\"\r\n }}\r\n </span>\r\n }\r\n </div>\r\n }\r\n }\r\n </div>\r\n </div>\r\n}\r\n", styles: [".lf-navbar{z-index:99;position:fixed;left:0;top:0;height:100vh;padding:80px 4px 0;border-right:solid 1px rgba(0,0,0,.12)}.lf-navbar .lf-navbar-items{display:flex;flex-flow:column;align-items:center}.lf-navbar-mobile{z-index:99;position:fixed;left:0;bottom:0;width:100vw;padding:4px 0;box-sizing:border-box;border-top:solid 1px rgba(0,0,0,.12)}.lf-navbar-mobile .lf-navbar-mobile-items{display:flex;flex-flow:row nowrap;align-items:center;justify-content:space-evenly}.lf-navbar-mobile .lf-navbar-mobile-items .lf-navbar-item{height:56px!important}.lf-navbar-item{width:72px;height:72px;display:flex;align-items:center;justify-content:center;flex-flow:column;border-radius:16px;cursor:pointer}.lf-navbar-item.lf-navbar-item-active{color:var(--color-primary)}.lf-navbar-item .lf-navbar-item-icon{width:24px;height:24px;overflow:visible!important}.lf-navbar-item .lf-navbar-item-label{max-width:72px;white-space:nowrap!important;overflow:hidden;text-overflow:ellipsis;text-transform:none;vertical-align:top;font-size:12px;font-weight:500}\n"] }]
565
+ }], propDecorators: { libraryConfig: [{
566
+ type: Input
567
+ }], navbarConfig: [{
547
568
  type: Input
548
569
  }], isMobile: [{
549
570
  type: Input
@@ -636,7 +657,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.5", ngImpor
636
657
 
637
658
  class Logger {
638
659
  constructor() {
639
- this.config = inject(CONFIG, { optional: true });
660
+ this.libraryConfig = inject(CONFIG, { optional: true });
640
661
  }
641
662
  /**
642
663
  * Uses the regular console log but can be automatically disabled during production by using the ScaffoldLibraryConfig in the ScaffoldModule.forRoot
@@ -645,7 +666,7 @@ class Logger {
645
666
  * @param args arguments of the log
646
667
  */
647
668
  log(message, ...args) {
648
- if (this.config?.production === false) {
669
+ if (this.libraryConfig?.production === false) {
649
670
  console.log(message, ...args); // eslint-disable-line no-console
650
671
  }
651
672
  }
@@ -656,7 +677,7 @@ class Logger {
656
677
  * @param args arguments of the warn
657
678
  */
658
679
  warn(message, ...args) {
659
- if (this.config?.production === false) {
680
+ if (this.libraryConfig?.production === false) {
660
681
  console.warn(message, ...args); // eslint-disable-line no-console
661
682
  }
662
683
  }
@@ -667,7 +688,7 @@ class Logger {
667
688
  * @param args arguments of the error
668
689
  */
669
690
  error(message, ...args) {
670
- if (this.config?.production === false) {
691
+ if (this.libraryConfig?.production === false) {
671
692
  console.error(message, ...args); // eslint-disable-line no-console
672
693
  }
673
694
  }
@@ -681,8 +702,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.5", ngImpor
681
702
 
682
703
  class LocalStorageService {
683
704
  constructor() {
705
+ this.libraryConfig = inject(CONFIG, { optional: true });
684
706
  this.logger = inject(Logger);
685
- this.config = inject(CONFIG, { optional: true });
686
707
  }
687
708
  /**
688
709
  * Set an item into the browser's local storage
@@ -693,7 +714,7 @@ class LocalStorageService {
693
714
  setItem(key, value) {
694
715
  try {
695
716
  const stringValue = JSON.stringify(value);
696
- if (this.config?.debugging)
717
+ if (this.libraryConfig?.debugging)
697
718
  this.logger.log(`[SET ITEM] ${key} with value:`, stringValue);
698
719
  localStorage.setItem(key, stringValue);
699
720
  }
@@ -710,7 +731,7 @@ class LocalStorageService {
710
731
  setItemEncoded(key, value) {
711
732
  try {
712
733
  const encodedValue = btoa(JSON.stringify(value));
713
- if (this.config?.debugging)
734
+ if (this.libraryConfig?.debugging)
714
735
  this.logger.log(`[SET ITEM] ${key} with value:`, encodedValue);
715
736
  localStorage.setItem(key, encodedValue);
716
737
  }
@@ -727,7 +748,7 @@ class LocalStorageService {
727
748
  getItem(key) {
728
749
  try {
729
750
  const item = localStorage.getItem(key);
730
- if (this.config?.debugging)
751
+ if (this.libraryConfig?.debugging)
731
752
  this.logger.log(`[GET ITEM] ${key} with value:`, item);
732
753
  return item ? JSON.parse(item, this.dateReviver) : null;
733
754
  }
@@ -745,7 +766,7 @@ class LocalStorageService {
745
766
  getItemDecoded(key) {
746
767
  try {
747
768
  const item = localStorage.getItem(key);
748
- if (this.config?.debugging)
769
+ if (this.libraryConfig?.debugging)
749
770
  this.logger.log(`[GET ITEM] ${key} with value:`, item);
750
771
  return item ? JSON.parse(atob(item), this.dateReviver) : null;
751
772
  }
@@ -762,7 +783,7 @@ class LocalStorageService {
762
783
  getItemUnparsed(key) {
763
784
  try {
764
785
  const item = localStorage.getItem(key);
765
- if (this.config?.debugging)
786
+ if (this.libraryConfig?.debugging)
766
787
  this.logger.log(`[GET ITEM] ${key} with value:`, item);
767
788
  return item || null;
768
789
  }
@@ -779,7 +800,7 @@ class LocalStorageService {
779
800
  */
780
801
  removeItem(key) {
781
802
  try {
782
- if (this.config?.debugging)
803
+ if (this.libraryConfig?.debugging)
783
804
  this.logger.log(`[REMOVE ITEM] ${key}`);
784
805
  localStorage.removeItem(key);
785
806
  }
@@ -889,8 +910,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.5", ngImpor
889
910
 
890
911
  class ScaffoldService {
891
912
  constructor() {
913
+ this.libraryConfig = inject(CONFIG, { optional: true });
892
914
  this.logger = inject(Logger);
893
- this.config = inject(CONFIG, { optional: true });
894
915
  // Scaffold Config
895
916
  this._scaffoldConfig$ = new BehaviorSubject({});
896
917
  // Header Input Change
@@ -936,7 +957,7 @@ class ScaffoldService {
936
957
  return;
937
958
  }
938
959
  const updatedState = { ...currentState, [property]: value };
939
- if (this.config?.debugging)
960
+ if (this.libraryConfig?.debugging)
940
961
  this.logger.log(`[UPDATE] ScaffoldConfig.${property}`, value);
941
962
  this._scaffoldConfig$.next(updatedState);
942
963
  }
@@ -1033,15 +1054,15 @@ class SnackbarService {
1033
1054
  verticalPosition: this.SNACKBAR_POSITION_VERTICAL
1034
1055
  };
1035
1056
  }
1057
+ // Opens a generic snackbar with a message
1058
+ openSnackbar(message, closeLabel, config) {
1059
+ this.snackbar.open(message, closeLabel, config ? config : this.defaultConfig);
1060
+ }
1036
1061
  // Opens a snackbar with an action to wait for
1037
1062
  openSnackbarWithAction(message, action, config) {
1038
1063
  const snackbarRef = this.snackbar.open(message, action, config ? config : this.actionConfig);
1039
1064
  return firstValueFrom(snackbarRef.onAction());
1040
1065
  }
1041
- // Opens a generic snackbar with a message
1042
- openSnackbar(message, config) {
1043
- this.snackbar.open(message, '', config ? config : this.defaultConfig);
1044
- }
1045
1066
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.5", ngImport: i0, type: SnackbarService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
1046
1067
  static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.0.5", ngImport: i0, type: SnackbarService, providedIn: 'root' }); }
1047
1068
  }
@@ -1113,13 +1134,13 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.5", ngImpor
1113
1134
 
1114
1135
  class ScaffoldComponent {
1115
1136
  constructor() {
1137
+ this.libraryConfig = inject(CONFIG, { optional: true });
1116
1138
  this.scaffoldService = inject(ScaffoldService);
1117
1139
  this.breakpointService = inject(BreakpointService);
1118
1140
  this.routerService = inject(RouterService);
1119
1141
  this.logger = inject(Logger);
1120
1142
  this.route = inject(ActivatedRoute);
1121
1143
  this.document = inject(DOCUMENT);
1122
- this.config = inject(CONFIG, { optional: true });
1123
1144
  this.headerButtonClickEvent = new EventEmitter();
1124
1145
  this.headerInputSubmitEvent = new EventEmitter();
1125
1146
  this.headerInputChangeEvent = new EventEmitter();
@@ -1143,7 +1164,7 @@ class ScaffoldComponent {
1143
1164
  ngOnInit() {
1144
1165
  // Listen for config changes
1145
1166
  this._subscription.add(this.scaffoldService.scaffoldConfig$.subscribe((scaffoldConfig) => {
1146
- if (this.config?.debugging)
1167
+ if (this.libraryConfig?.debugging)
1147
1168
  this.logger.log('[ScaffoldConfig]', scaffoldConfig);
1148
1169
  this.scaffoldConfig = scaffoldConfig;
1149
1170
  this.headerConfig = this.scaffoldConfig.headerConfig;
@@ -1156,13 +1177,13 @@ class ScaffoldComponent {
1156
1177
  }));
1157
1178
  // Listen for drawer portal changes
1158
1179
  this._subscription.add(this.scaffoldService.drawerPortal$.subscribe((drawerPortal) => {
1159
- if (this.config?.debugging)
1180
+ if (this.libraryConfig?.debugging)
1160
1181
  this.logger.log('[DrawerPortal]', drawerPortal);
1161
1182
  this.drawerPortal = drawerPortal;
1162
1183
  }));
1163
1184
  // Listen for breakpoint changes
1164
1185
  this._subscription.add(this.breakpointService.breakpoint$.subscribe((breakpointState) => {
1165
- if (this.config?.debugging)
1186
+ if (this.libraryConfig?.debugging)
1166
1187
  this.logger.log('[BreakpointState]', breakpointState);
1167
1188
  if (breakpointState.breakpoints[Breakpoints.XSmall]) {
1168
1189
  this.isMobile = true;
@@ -1179,7 +1200,7 @@ class ScaffoldComponent {
1179
1200
  }));
1180
1201
  // Listen for route changes
1181
1202
  this._subscription.add(this.routerService.routeHistory$.subscribe((routeHistory) => {
1182
- if (this.config?.debugging)
1203
+ if (this.libraryConfig?.debugging)
1183
1204
  this.logger.log('[RouteHistory]', routeHistory);
1184
1205
  if (routeHistory) {
1185
1206
  this.routeHistory = routeHistory;
@@ -1208,7 +1229,7 @@ class ScaffoldComponent {
1208
1229
  if (this.scaffoldConfig?.anchorScrolling) {
1209
1230
  this._subscription.add(this.route.fragment.subscribe((fragment) => {
1210
1231
  if (fragment) {
1211
- if (this.config?.debugging)
1232
+ if (this.libraryConfig?.debugging)
1212
1233
  this.logger.log('[RouteFragment]', fragment);
1213
1234
  setTimeout(() => {
1214
1235
  const element = this.document.querySelector(`#${fragment}`);
@@ -1261,11 +1282,11 @@ class ScaffoldComponent {
1261
1282
  this.bottomBarButtonClickEvent.emit(id);
1262
1283
  }
1263
1284
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.5", ngImport: i0, type: ScaffoldComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
1264
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.5", type: ScaffoldComponent, isStandalone: false, selector: "lf-scaffold", outputs: { headerButtonClickEvent: "headerButtonClickEvent", headerInputSubmitEvent: "headerInputSubmitEvent", headerInputChangeEvent: "headerInputChangeEvent", navbarButtonClickEvent: "navbarButtonClickEvent", floatingButtonClickEvent: "floatingButtonClickEvent", bottomBarButtonClickEvent: "bottomBarButtonClickEvent" }, viewQueries: [{ propertyName: "scrollContainer", first: true, predicate: ["scrollContainer"], descendants: true, static: true }, { propertyName: "content", first: true, predicate: ["content"], descendants: true, static: true }], ngImport: i0, template: "<!-- header-height: 64px; navbar-size: 80px; floating-button-bottom: 24px -->\r\n\r\n<div class=\"lf-scaffold mat-app-background mat-typography\" [ngClass]=\"scaffoldConfig?.class\">\r\n <!-- loading overlay -->\r\n @if (scaffoldConfig?.loading) {\r\n <lf-loading-overlay></lf-loading-overlay>\r\n }\r\n <!-- header -->\r\n <lf-header\r\n [headerConfig]=\"headerConfig\"\r\n [isMobile]=\"isMobile\"\r\n [routeLoading]=\"routeLoading\"\r\n [currentRoute]=\"currentRoute\"\r\n (headerButtonClickEvent)=\"headerButtonClicked($event)\"\r\n (headerInputSubmitEvent)=\"headerInputSubmitted($event)\"\r\n (headerInputChangeEvent)=\"headerInputChanged($event)\"></lf-header>\r\n <!-- navbar -->\r\n <lf-navbar\r\n [navbarConfig]=\"navbarConfig\"\r\n [isMobile]=\"isMobile\"\r\n [currentRoute]=\"currentRoute\"\r\n (navbarButtonClickEvent)=\"navbarButtonClicked($event)\"></lf-navbar>\r\n <!-- content wrapper -->\r\n <div\r\n class=\"lf-content-wrapper\"\r\n [class.lf-show-navbar]=\"navbarConfig?.enable && !isMobile\"\r\n [class.lf-show-header]=\"headerConfig?.enable && !(navbarConfig?.enable && isMobile)\"\r\n [class.lf-show-navbar-mobile]=\"navbarConfig?.enable && isMobile && !headerConfig?.enable\"\r\n [class.lf-show-header-and-navbar-mobile]=\"\r\n headerConfig?.enable && navbarConfig?.enable && isMobile\r\n \"\r\n #scrollContainer\r\n cdkScrollable>\r\n <!-- drawer -->\r\n <lf-drawer\r\n [drawerConfig]=\"drawerConfig\"\r\n [drawerPortal]=\"drawerPortal\"\r\n [isMobile]=\"isMobile\"\r\n [fixedOffset]=\"headerConfig?.enable ? 64 : 0\">\r\n <!-- drawer content -->\r\n <ng-content select=\"[drawerContent]\" drawerContent></ng-content>\r\n <!-- content title card -->\r\n <lf-content-title-card\r\n [contentTitleCardConfig]=\"contentTitleCardConfig\"\r\n [isMobile]=\"isMobile\"\r\n [routeHistory]=\"routeHistory\"\r\n (backButtonClickEvent)=\"backButtonClicked()\"></lf-content-title-card>\r\n <!-- main content -->\r\n <div\r\n class=\"lf-content\"\r\n [class.lf-content-mobile]=\"isMobile\"\r\n [class.lf-show-footer]=\"footerConfig?.enable\"\r\n #content>\r\n <ng-content></ng-content>\r\n </div>\r\n <!-- footer -->\r\n <lf-footer [footerConfig]=\"footerConfig\"></lf-footer>\r\n </lf-drawer>\r\n </div>\r\n <!-- to top button -->\r\n <lf-floating-button\r\n [floatingButtonConfig]=\"floatingButtonConfig\"\r\n [onTop]=\"scrollTopPosition <= 0\"\r\n [isMobile]=\"isMobile && navbarConfig?.enable!\"\r\n [bottomBarEnabled]=\"bottomBarConfig?.enable!\"\r\n (floatingButtonClickEvent)=\"floatingButtonClicked($event)\"></lf-floating-button>\r\n <!-- bottom bar -->\r\n <lf-bottom-bar\r\n [bottomBarConfig]=\"bottomBarConfig\"\r\n [isMobile]=\"isMobile && navbarConfig?.enable!\"\r\n [navbarEnabled]=\"navbarConfig?.enable!\"\r\n (bottomBarCloseClickEvent)=\"bottomBarCloseClicked($event)\"\r\n (bottomBarButtonClickEvent)=\"bottomBarButtonClicked($event)\"></lf-bottom-bar>\r\n</div>\r\n", styles: [".lf-scaffold{height:100vh}.lf-scaffold .lf-content-wrapper{transition:height .3s;position:absolute;inset:0;overflow-y:auto}.lf-scaffold .lf-content-wrapper.lf-show-navbar{left:80px}.lf-scaffold .lf-content-wrapper.lf-show-header{top:64px;height:calc(100vh - 64px)}.lf-scaffold .lf-content-wrapper.lf-show-navbar-mobile{height:calc(100vh - 56px)}.lf-scaffold .lf-content-wrapper.lf-show-header-and-navbar-mobile{top:64px;height:calc(100vh - 120px)}.lf-scaffold .lf-content-wrapper .lf-content{padding-left:24px;padding-right:24px}.lf-scaffold .lf-content-wrapper .lf-content.lf-content-mobile{padding-left:16px;padding-right:16px}.lf-scaffold .lf-content-wrapper .lf-content.lf-show-footer{min-height:100%}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2$4.CdkScrollable, selector: "[cdk-scrollable], [cdkScrollable]" }, { kind: "component", type: LoadingOverlayComponent, selector: "lf-loading-overlay" }, { kind: "component", type: HeaderComponent, selector: "lf-header", inputs: ["headerConfig", "isMobile", "routeLoading", "currentRoute"], outputs: ["headerButtonClickEvent", "headerInputSubmitEvent", "headerInputChangeEvent"] }, { kind: "component", type: NavbarComponent, selector: "lf-navbar", inputs: ["navbarConfig", "isMobile", "currentRoute"], outputs: ["navbarButtonClickEvent"] }, { kind: "component", type: DrawerComponent, selector: "lf-drawer", inputs: ["drawerConfig", "isMobile", "fixedOffset", "drawerPortal"] }, { kind: "component", type: FooterComponent, selector: "lf-footer", inputs: ["footerConfig"] }, { kind: "component", type: ContentTitleCardComponent, selector: "lf-content-title-card", inputs: ["contentTitleCardConfig", "isMobile", "routeHistory"], outputs: ["backButtonClickEvent"] }, { kind: "component", type: FloatingButtonComponent, selector: "lf-floating-button", inputs: ["floatingButtonConfig", "onTop", "isMobile", "bottomBarEnabled"], outputs: ["floatingButtonClickEvent"] }, { kind: "component", type: BottomBarComponent, selector: "lf-bottom-bar", inputs: ["bottomBarConfig", "isMobile", "navbarEnabled"], outputs: ["bottomBarCloseClickEvent", "bottomBarButtonClickEvent"] }] }); }
1285
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.5", type: ScaffoldComponent, isStandalone: false, selector: "lf-scaffold", outputs: { headerButtonClickEvent: "headerButtonClickEvent", headerInputSubmitEvent: "headerInputSubmitEvent", headerInputChangeEvent: "headerInputChangeEvent", navbarButtonClickEvent: "navbarButtonClickEvent", floatingButtonClickEvent: "floatingButtonClickEvent", bottomBarButtonClickEvent: "bottomBarButtonClickEvent" }, viewQueries: [{ propertyName: "scrollContainer", first: true, predicate: ["scrollContainer"], descendants: true, static: true }, { propertyName: "content", first: true, predicate: ["content"], descendants: true, static: true }], ngImport: i0, template: "<!-- header-height: 64px; navbar-size: 80px; floating-button-bottom: 24px -->\r\n\r\n<div class=\"lf-scaffold mat-app-background mat-typography\" [ngClass]=\"scaffoldConfig?.class\">\r\n <!-- loading overlay -->\r\n @if (scaffoldConfig?.loading) {\r\n <lf-loading-overlay></lf-loading-overlay>\r\n }\r\n <!-- header -->\r\n <lf-header\r\n [libraryConfig]=\"libraryConfig\"\r\n [headerConfig]=\"headerConfig\"\r\n [isMobile]=\"isMobile\"\r\n [routeLoading]=\"routeLoading\"\r\n [currentRoute]=\"currentRoute\"\r\n (headerButtonClickEvent)=\"headerButtonClicked($event)\"\r\n (headerInputSubmitEvent)=\"headerInputSubmitted($event)\"\r\n (headerInputChangeEvent)=\"headerInputChanged($event)\"></lf-header>\r\n <!-- navbar -->\r\n <lf-navbar\r\n [libraryConfig]=\"libraryConfig\"\r\n [navbarConfig]=\"navbarConfig\"\r\n [isMobile]=\"isMobile\"\r\n [currentRoute]=\"currentRoute\"\r\n (navbarButtonClickEvent)=\"navbarButtonClicked($event)\"></lf-navbar>\r\n <!-- content wrapper -->\r\n <div\r\n class=\"lf-content-wrapper\"\r\n [class.lf-show-navbar]=\"navbarConfig?.enable && !isMobile\"\r\n [class.lf-show-header]=\"headerConfig?.enable && !(navbarConfig?.enable && isMobile)\"\r\n [class.lf-show-navbar-mobile]=\"navbarConfig?.enable && isMobile && !headerConfig?.enable\"\r\n [class.lf-show-header-and-navbar-mobile]=\"\r\n headerConfig?.enable && navbarConfig?.enable && isMobile\r\n \"\r\n #scrollContainer\r\n cdkScrollable>\r\n <!-- drawer -->\r\n <lf-drawer\r\n [libraryConfig]=\"libraryConfig\"\r\n [drawerConfig]=\"drawerConfig\"\r\n [drawerPortal]=\"drawerPortal\"\r\n [isMobile]=\"isMobile\"\r\n [fixedOffset]=\"headerConfig?.enable ? 64 : 0\">\r\n <!-- drawer content -->\r\n <ng-content select=\"[drawerContent]\" drawerContent></ng-content>\r\n <!-- content title card -->\r\n <lf-content-title-card\r\n [libraryConfig]=\"libraryConfig\"\r\n [contentTitleCardConfig]=\"contentTitleCardConfig\"\r\n [isMobile]=\"isMobile\"\r\n [routeHistory]=\"routeHistory\"\r\n (backButtonClickEvent)=\"backButtonClicked()\"></lf-content-title-card>\r\n <!-- main content -->\r\n <div\r\n class=\"lf-content\"\r\n [class.lf-content-mobile]=\"isMobile\"\r\n [class.lf-show-footer]=\"footerConfig?.enable\"\r\n #content>\r\n <ng-content></ng-content>\r\n </div>\r\n <!-- footer -->\r\n <lf-footer [libraryConfig]=\"libraryConfig\" [footerConfig]=\"footerConfig\"></lf-footer>\r\n </lf-drawer>\r\n </div>\r\n <!-- to top button -->\r\n <lf-floating-button\r\n [libraryConfig]=\"libraryConfig\"\r\n [floatingButtonConfig]=\"floatingButtonConfig\"\r\n [onTop]=\"scrollTopPosition <= 0\"\r\n [isMobile]=\"isMobile && navbarConfig?.enable!\"\r\n [bottomBarEnabled]=\"bottomBarConfig?.enable!\"\r\n (floatingButtonClickEvent)=\"floatingButtonClicked($event)\"></lf-floating-button>\r\n <!-- bottom bar -->\r\n <lf-bottom-bar\r\n [libraryConfig]=\"libraryConfig\"\r\n [bottomBarConfig]=\"bottomBarConfig\"\r\n [isMobile]=\"isMobile && navbarConfig?.enable!\"\r\n [navbarEnabled]=\"navbarConfig?.enable!\"\r\n (bottomBarCloseClickEvent)=\"bottomBarCloseClicked($event)\"\r\n (bottomBarButtonClickEvent)=\"bottomBarButtonClicked($event)\"></lf-bottom-bar>\r\n</div>\r\n", styles: [".lf-scaffold{height:100vh}.lf-scaffold .lf-content-wrapper{transition:height .3s;position:absolute;inset:0;overflow-y:auto}.lf-scaffold .lf-content-wrapper.lf-show-navbar{left:80px}.lf-scaffold .lf-content-wrapper.lf-show-header{top:64px;height:calc(100vh - 64px)}.lf-scaffold .lf-content-wrapper.lf-show-navbar-mobile{height:calc(100vh - 56px)}.lf-scaffold .lf-content-wrapper.lf-show-header-and-navbar-mobile{top:64px;height:calc(100vh - 120px)}.lf-scaffold .lf-content-wrapper .lf-content{padding-left:24px;padding-right:24px}.lf-scaffold .lf-content-wrapper .lf-content.lf-content-mobile{padding-left:16px;padding-right:16px}.lf-scaffold .lf-content-wrapper .lf-content.lf-show-footer{min-height:100%}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2$4.CdkScrollable, selector: "[cdk-scrollable], [cdkScrollable]" }, { kind: "component", type: LoadingOverlayComponent, selector: "lf-loading-overlay" }, { kind: "component", type: HeaderComponent, selector: "lf-header", inputs: ["libraryConfig", "headerConfig", "isMobile", "routeLoading", "currentRoute"], outputs: ["headerButtonClickEvent", "headerInputSubmitEvent", "headerInputChangeEvent"] }, { kind: "component", type: NavbarComponent, selector: "lf-navbar", inputs: ["libraryConfig", "navbarConfig", "isMobile", "currentRoute"], outputs: ["navbarButtonClickEvent"] }, { kind: "component", type: DrawerComponent, selector: "lf-drawer", inputs: ["libraryConfig", "drawerConfig", "isMobile", "fixedOffset", "drawerPortal"] }, { kind: "component", type: FooterComponent, selector: "lf-footer", inputs: ["libraryConfig", "footerConfig"] }, { kind: "component", type: ContentTitleCardComponent, selector: "lf-content-title-card", inputs: ["libraryConfig", "contentTitleCardConfig", "isMobile", "routeHistory"], outputs: ["backButtonClickEvent"] }, { kind: "component", type: FloatingButtonComponent, selector: "lf-floating-button", inputs: ["libraryConfig", "floatingButtonConfig", "onTop", "isMobile", "bottomBarEnabled"], outputs: ["floatingButtonClickEvent"] }, { kind: "component", type: BottomBarComponent, selector: "lf-bottom-bar", inputs: ["libraryConfig", "bottomBarConfig", "isMobile", "navbarEnabled"], outputs: ["bottomBarCloseClickEvent", "bottomBarButtonClickEvent"] }] }); }
1265
1286
  }
1266
1287
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.5", ngImport: i0, type: ScaffoldComponent, decorators: [{
1267
1288
  type: Component,
1268
- args: [{ selector: 'lf-scaffold', standalone: false, template: "<!-- header-height: 64px; navbar-size: 80px; floating-button-bottom: 24px -->\r\n\r\n<div class=\"lf-scaffold mat-app-background mat-typography\" [ngClass]=\"scaffoldConfig?.class\">\r\n <!-- loading overlay -->\r\n @if (scaffoldConfig?.loading) {\r\n <lf-loading-overlay></lf-loading-overlay>\r\n }\r\n <!-- header -->\r\n <lf-header\r\n [headerConfig]=\"headerConfig\"\r\n [isMobile]=\"isMobile\"\r\n [routeLoading]=\"routeLoading\"\r\n [currentRoute]=\"currentRoute\"\r\n (headerButtonClickEvent)=\"headerButtonClicked($event)\"\r\n (headerInputSubmitEvent)=\"headerInputSubmitted($event)\"\r\n (headerInputChangeEvent)=\"headerInputChanged($event)\"></lf-header>\r\n <!-- navbar -->\r\n <lf-navbar\r\n [navbarConfig]=\"navbarConfig\"\r\n [isMobile]=\"isMobile\"\r\n [currentRoute]=\"currentRoute\"\r\n (navbarButtonClickEvent)=\"navbarButtonClicked($event)\"></lf-navbar>\r\n <!-- content wrapper -->\r\n <div\r\n class=\"lf-content-wrapper\"\r\n [class.lf-show-navbar]=\"navbarConfig?.enable && !isMobile\"\r\n [class.lf-show-header]=\"headerConfig?.enable && !(navbarConfig?.enable && isMobile)\"\r\n [class.lf-show-navbar-mobile]=\"navbarConfig?.enable && isMobile && !headerConfig?.enable\"\r\n [class.lf-show-header-and-navbar-mobile]=\"\r\n headerConfig?.enable && navbarConfig?.enable && isMobile\r\n \"\r\n #scrollContainer\r\n cdkScrollable>\r\n <!-- drawer -->\r\n <lf-drawer\r\n [drawerConfig]=\"drawerConfig\"\r\n [drawerPortal]=\"drawerPortal\"\r\n [isMobile]=\"isMobile\"\r\n [fixedOffset]=\"headerConfig?.enable ? 64 : 0\">\r\n <!-- drawer content -->\r\n <ng-content select=\"[drawerContent]\" drawerContent></ng-content>\r\n <!-- content title card -->\r\n <lf-content-title-card\r\n [contentTitleCardConfig]=\"contentTitleCardConfig\"\r\n [isMobile]=\"isMobile\"\r\n [routeHistory]=\"routeHistory\"\r\n (backButtonClickEvent)=\"backButtonClicked()\"></lf-content-title-card>\r\n <!-- main content -->\r\n <div\r\n class=\"lf-content\"\r\n [class.lf-content-mobile]=\"isMobile\"\r\n [class.lf-show-footer]=\"footerConfig?.enable\"\r\n #content>\r\n <ng-content></ng-content>\r\n </div>\r\n <!-- footer -->\r\n <lf-footer [footerConfig]=\"footerConfig\"></lf-footer>\r\n </lf-drawer>\r\n </div>\r\n <!-- to top button -->\r\n <lf-floating-button\r\n [floatingButtonConfig]=\"floatingButtonConfig\"\r\n [onTop]=\"scrollTopPosition <= 0\"\r\n [isMobile]=\"isMobile && navbarConfig?.enable!\"\r\n [bottomBarEnabled]=\"bottomBarConfig?.enable!\"\r\n (floatingButtonClickEvent)=\"floatingButtonClicked($event)\"></lf-floating-button>\r\n <!-- bottom bar -->\r\n <lf-bottom-bar\r\n [bottomBarConfig]=\"bottomBarConfig\"\r\n [isMobile]=\"isMobile && navbarConfig?.enable!\"\r\n [navbarEnabled]=\"navbarConfig?.enable!\"\r\n (bottomBarCloseClickEvent)=\"bottomBarCloseClicked($event)\"\r\n (bottomBarButtonClickEvent)=\"bottomBarButtonClicked($event)\"></lf-bottom-bar>\r\n</div>\r\n", styles: [".lf-scaffold{height:100vh}.lf-scaffold .lf-content-wrapper{transition:height .3s;position:absolute;inset:0;overflow-y:auto}.lf-scaffold .lf-content-wrapper.lf-show-navbar{left:80px}.lf-scaffold .lf-content-wrapper.lf-show-header{top:64px;height:calc(100vh - 64px)}.lf-scaffold .lf-content-wrapper.lf-show-navbar-mobile{height:calc(100vh - 56px)}.lf-scaffold .lf-content-wrapper.lf-show-header-and-navbar-mobile{top:64px;height:calc(100vh - 120px)}.lf-scaffold .lf-content-wrapper .lf-content{padding-left:24px;padding-right:24px}.lf-scaffold .lf-content-wrapper .lf-content.lf-content-mobile{padding-left:16px;padding-right:16px}.lf-scaffold .lf-content-wrapper .lf-content.lf-show-footer{min-height:100%}\n"] }]
1289
+ args: [{ selector: 'lf-scaffold', standalone: false, template: "<!-- header-height: 64px; navbar-size: 80px; floating-button-bottom: 24px -->\r\n\r\n<div class=\"lf-scaffold mat-app-background mat-typography\" [ngClass]=\"scaffoldConfig?.class\">\r\n <!-- loading overlay -->\r\n @if (scaffoldConfig?.loading) {\r\n <lf-loading-overlay></lf-loading-overlay>\r\n }\r\n <!-- header -->\r\n <lf-header\r\n [libraryConfig]=\"libraryConfig\"\r\n [headerConfig]=\"headerConfig\"\r\n [isMobile]=\"isMobile\"\r\n [routeLoading]=\"routeLoading\"\r\n [currentRoute]=\"currentRoute\"\r\n (headerButtonClickEvent)=\"headerButtonClicked($event)\"\r\n (headerInputSubmitEvent)=\"headerInputSubmitted($event)\"\r\n (headerInputChangeEvent)=\"headerInputChanged($event)\"></lf-header>\r\n <!-- navbar -->\r\n <lf-navbar\r\n [libraryConfig]=\"libraryConfig\"\r\n [navbarConfig]=\"navbarConfig\"\r\n [isMobile]=\"isMobile\"\r\n [currentRoute]=\"currentRoute\"\r\n (navbarButtonClickEvent)=\"navbarButtonClicked($event)\"></lf-navbar>\r\n <!-- content wrapper -->\r\n <div\r\n class=\"lf-content-wrapper\"\r\n [class.lf-show-navbar]=\"navbarConfig?.enable && !isMobile\"\r\n [class.lf-show-header]=\"headerConfig?.enable && !(navbarConfig?.enable && isMobile)\"\r\n [class.lf-show-navbar-mobile]=\"navbarConfig?.enable && isMobile && !headerConfig?.enable\"\r\n [class.lf-show-header-and-navbar-mobile]=\"\r\n headerConfig?.enable && navbarConfig?.enable && isMobile\r\n \"\r\n #scrollContainer\r\n cdkScrollable>\r\n <!-- drawer -->\r\n <lf-drawer\r\n [libraryConfig]=\"libraryConfig\"\r\n [drawerConfig]=\"drawerConfig\"\r\n [drawerPortal]=\"drawerPortal\"\r\n [isMobile]=\"isMobile\"\r\n [fixedOffset]=\"headerConfig?.enable ? 64 : 0\">\r\n <!-- drawer content -->\r\n <ng-content select=\"[drawerContent]\" drawerContent></ng-content>\r\n <!-- content title card -->\r\n <lf-content-title-card\r\n [libraryConfig]=\"libraryConfig\"\r\n [contentTitleCardConfig]=\"contentTitleCardConfig\"\r\n [isMobile]=\"isMobile\"\r\n [routeHistory]=\"routeHistory\"\r\n (backButtonClickEvent)=\"backButtonClicked()\"></lf-content-title-card>\r\n <!-- main content -->\r\n <div\r\n class=\"lf-content\"\r\n [class.lf-content-mobile]=\"isMobile\"\r\n [class.lf-show-footer]=\"footerConfig?.enable\"\r\n #content>\r\n <ng-content></ng-content>\r\n </div>\r\n <!-- footer -->\r\n <lf-footer [libraryConfig]=\"libraryConfig\" [footerConfig]=\"footerConfig\"></lf-footer>\r\n </lf-drawer>\r\n </div>\r\n <!-- to top button -->\r\n <lf-floating-button\r\n [libraryConfig]=\"libraryConfig\"\r\n [floatingButtonConfig]=\"floatingButtonConfig\"\r\n [onTop]=\"scrollTopPosition <= 0\"\r\n [isMobile]=\"isMobile && navbarConfig?.enable!\"\r\n [bottomBarEnabled]=\"bottomBarConfig?.enable!\"\r\n (floatingButtonClickEvent)=\"floatingButtonClicked($event)\"></lf-floating-button>\r\n <!-- bottom bar -->\r\n <lf-bottom-bar\r\n [libraryConfig]=\"libraryConfig\"\r\n [bottomBarConfig]=\"bottomBarConfig\"\r\n [isMobile]=\"isMobile && navbarConfig?.enable!\"\r\n [navbarEnabled]=\"navbarConfig?.enable!\"\r\n (bottomBarCloseClickEvent)=\"bottomBarCloseClicked($event)\"\r\n (bottomBarButtonClickEvent)=\"bottomBarButtonClicked($event)\"></lf-bottom-bar>\r\n</div>\r\n", styles: [".lf-scaffold{height:100vh}.lf-scaffold .lf-content-wrapper{transition:height .3s;position:absolute;inset:0;overflow-y:auto}.lf-scaffold .lf-content-wrapper.lf-show-navbar{left:80px}.lf-scaffold .lf-content-wrapper.lf-show-header{top:64px;height:calc(100vh - 64px)}.lf-scaffold .lf-content-wrapper.lf-show-navbar-mobile{height:calc(100vh - 56px)}.lf-scaffold .lf-content-wrapper.lf-show-header-and-navbar-mobile{top:64px;height:calc(100vh - 120px)}.lf-scaffold .lf-content-wrapper .lf-content{padding-left:24px;padding-right:24px}.lf-scaffold .lf-content-wrapper .lf-content.lf-content-mobile{padding-left:16px;padding-right:16px}.lf-scaffold .lf-content-wrapper .lf-content.lf-show-footer{min-height:100%}\n"] }]
1269
1290
  }], propDecorators: { scrollContainer: [{
1270
1291
  type: ViewChild,
1271
1292
  args: ['scrollContainer', { static: true }]
@@ -1286,7 +1307,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.5", ngImpor
1286
1307
  type: Output
1287
1308
  }] } });
1288
1309
 
1289
- const CONFIG = new InjectionToken('config');
1290
1310
  class ScaffoldModule {
1291
1311
  static forRoot(config) {
1292
1312
  return {
@@ -1347,17 +1367,17 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.5", ngImpor
1347
1367
 
1348
1368
  class PlaceholderComponent {
1349
1369
  constructor() {
1350
- this.action = new EventEmitter();
1370
+ this.buttonClickEvent = new EventEmitter();
1351
1371
  }
1352
1372
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.5", ngImport: i0, type: PlaceholderComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
1353
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.5", type: PlaceholderComponent, isStandalone: true, selector: "lf-placeholder", inputs: { placeholderConfig: "placeholderConfig" }, outputs: { action: "action" }, ngImport: i0, template: "@if (placeholderConfig) {\r\n <div class=\"lf-placeholder px-6 pt-2 pb-6\">\r\n <!-- icon -->\r\n <lf-icon\r\n [matIcon]=\"placeholderConfig.matIcon!\"\r\n [svgIcon]=\"placeholderConfig.svgIcon!\"\r\n [outlineIcon]=\"placeholderConfig.outlineIcon!\"></lf-icon>\r\n <!-- heading -->\r\n @if (placeholderConfig.heading) {\r\n <p class=\"lf-placeholder-heading\">\r\n {{ placeholderConfig.heading }}\r\n </p>\r\n }\r\n <!-- message -->\r\n @if (placeholderConfig.message) {\r\n <p class=\"lf-placeholder-message\">\r\n {{ placeholderConfig.message }}\r\n </p>\r\n }\r\n <!-- action -->\r\n @if (placeholderConfig.actionLabel) {\r\n <button mat-button class=\"mt-4\" color=\"accent\" (click)=\"action.emit()\">\r\n {{ placeholderConfig.actionLabel }}\r\n </button>\r\n }\r\n </div>\r\n}\r\n", styles: [".lf-placeholder{display:flex;flex-flow:column;align-items:center;justify-content:center;text-align:center}.lf-placeholder ::ng-deep .lf-icon{width:128px;height:128px;font-size:128px;color:#808080cc}.lf-placeholder .lf-placeholder-heading{margin:0;font-size:32px;color:#808080cc}.lf-placeholder .lf-placeholder-message{margin:0;font-size:18px;color:#808080cc}\n"], dependencies: [{ kind: "ngmodule", type: SharedModule }, { kind: "component", type: i2.MatButton, selector: " button[matButton], a[matButton], button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button], a[mat-flat-button], a[mat-stroked-button] ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }, { kind: "component", type: IconComponent, selector: "lf-icon", inputs: ["matIcon", "svgIcon", "outlineIcon", "alignMiddle"] }] }); }
1373
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.5", type: PlaceholderComponent, isStandalone: true, selector: "lf-placeholder", inputs: { placeholderConfig: "placeholderConfig" }, outputs: { buttonClickEvent: "buttonClickEvent" }, ngImport: i0, template: "@if (placeholderConfig) {\r\n <div class=\"lf-placeholder px-6 pt-2 pb-6\" [ngClass]=\"placeholderConfig.class\">\r\n <!-- icon -->\r\n <lf-icon\r\n [matIcon]=\"placeholderConfig.matIcon!\"\r\n [svgIcon]=\"placeholderConfig.svgIcon!\"></lf-icon>\r\n <!-- heading -->\r\n @if (placeholderConfig.heading) {\r\n <p class=\"lf-placeholder-heading\">\r\n {{ placeholderConfig.heading }}\r\n </p>\r\n }\r\n <!-- message -->\r\n @if (placeholderConfig.message) {\r\n <p class=\"lf-placeholder-message\">\r\n {{ placeholderConfig.message }}\r\n </p>\r\n }\r\n <!-- action -->\r\n @if (placeholderConfig.buttonLabel) {\r\n <button mat-button class=\"mt-4\" color=\"accent\" (click)=\"buttonClickEvent.emit()\">\r\n {{ placeholderConfig.buttonLabel }}\r\n </button>\r\n }\r\n </div>\r\n}\r\n", styles: [".lf-placeholder{display:flex;flex-flow:column;align-items:center;justify-content:center;text-align:center}.lf-placeholder ::ng-deep .lf-icon{width:128px;height:128px;font-size:128px;color:#808080cc}.lf-placeholder .lf-placeholder-heading{margin:0;font-size:32px;color:#808080cc}.lf-placeholder .lf-placeholder-message{margin:0;font-size:18px;color:#808080cc}\n"], dependencies: [{ kind: "ngmodule", type: SharedModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: i2.MatButton, selector: " button[matButton], a[matButton], button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button], a[mat-flat-button], a[mat-stroked-button] ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }, { kind: "component", type: IconComponent, selector: "lf-icon", inputs: ["matIcon", "svgIcon", "alignMiddle"] }] }); }
1354
1374
  }
1355
1375
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.5", ngImport: i0, type: PlaceholderComponent, decorators: [{
1356
1376
  type: Component,
1357
- args: [{ selector: 'lf-placeholder', standalone: true, imports: [SharedModule, IconComponent], template: "@if (placeholderConfig) {\r\n <div class=\"lf-placeholder px-6 pt-2 pb-6\">\r\n <!-- icon -->\r\n <lf-icon\r\n [matIcon]=\"placeholderConfig.matIcon!\"\r\n [svgIcon]=\"placeholderConfig.svgIcon!\"\r\n [outlineIcon]=\"placeholderConfig.outlineIcon!\"></lf-icon>\r\n <!-- heading -->\r\n @if (placeholderConfig.heading) {\r\n <p class=\"lf-placeholder-heading\">\r\n {{ placeholderConfig.heading }}\r\n </p>\r\n }\r\n <!-- message -->\r\n @if (placeholderConfig.message) {\r\n <p class=\"lf-placeholder-message\">\r\n {{ placeholderConfig.message }}\r\n </p>\r\n }\r\n <!-- action -->\r\n @if (placeholderConfig.actionLabel) {\r\n <button mat-button class=\"mt-4\" color=\"accent\" (click)=\"action.emit()\">\r\n {{ placeholderConfig.actionLabel }}\r\n </button>\r\n }\r\n </div>\r\n}\r\n", styles: [".lf-placeholder{display:flex;flex-flow:column;align-items:center;justify-content:center;text-align:center}.lf-placeholder ::ng-deep .lf-icon{width:128px;height:128px;font-size:128px;color:#808080cc}.lf-placeholder .lf-placeholder-heading{margin:0;font-size:32px;color:#808080cc}.lf-placeholder .lf-placeholder-message{margin:0;font-size:18px;color:#808080cc}\n"] }]
1377
+ args: [{ selector: 'lf-placeholder', standalone: true, imports: [SharedModule, IconComponent], template: "@if (placeholderConfig) {\r\n <div class=\"lf-placeholder px-6 pt-2 pb-6\" [ngClass]=\"placeholderConfig.class\">\r\n <!-- icon -->\r\n <lf-icon\r\n [matIcon]=\"placeholderConfig.matIcon!\"\r\n [svgIcon]=\"placeholderConfig.svgIcon!\"></lf-icon>\r\n <!-- heading -->\r\n @if (placeholderConfig.heading) {\r\n <p class=\"lf-placeholder-heading\">\r\n {{ placeholderConfig.heading }}\r\n </p>\r\n }\r\n <!-- message -->\r\n @if (placeholderConfig.message) {\r\n <p class=\"lf-placeholder-message\">\r\n {{ placeholderConfig.message }}\r\n </p>\r\n }\r\n <!-- action -->\r\n @if (placeholderConfig.buttonLabel) {\r\n <button mat-button class=\"mt-4\" color=\"accent\" (click)=\"buttonClickEvent.emit()\">\r\n {{ placeholderConfig.buttonLabel }}\r\n </button>\r\n }\r\n </div>\r\n}\r\n", styles: [".lf-placeholder{display:flex;flex-flow:column;align-items:center;justify-content:center;text-align:center}.lf-placeholder ::ng-deep .lf-icon{width:128px;height:128px;font-size:128px;color:#808080cc}.lf-placeholder .lf-placeholder-heading{margin:0;font-size:32px;color:#808080cc}.lf-placeholder .lf-placeholder-message{margin:0;font-size:18px;color:#808080cc}\n"] }]
1358
1378
  }], propDecorators: { placeholderConfig: [{
1359
1379
  type: Input
1360
- }], action: [{
1380
+ }], buttonClickEvent: [{
1361
1381
  type: Output
1362
1382
  }] } });
1363
1383
 
@@ -1366,7 +1386,7 @@ class FileUploadComponent {
1366
1386
  this.logger = inject(Logger);
1367
1387
  this.color = 'primary';
1368
1388
  this.disabled = false;
1369
- this.fileChange = new EventEmitter();
1389
+ this.fileChangeEvent = new EventEmitter();
1370
1390
  }
1371
1391
  selectFile(event) {
1372
1392
  const input = event.target;
@@ -1376,13 +1396,13 @@ class FileUploadComponent {
1376
1396
  if (!file)
1377
1397
  return;
1378
1398
  this.logger.log('[FileUploadComponent]', file);
1379
- this.fileChange.emit(file);
1399
+ this.fileChangeEvent.emit(file);
1380
1400
  }
1381
1401
  triggerInput() {
1382
1402
  this.fileElement.nativeElement.click();
1383
1403
  }
1384
1404
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.5", ngImport: i0, type: FileUploadComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
1385
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.5", type: FileUploadComponent, isStandalone: true, selector: "lf-file-upload", inputs: { color: "color", label: "label", matIcon: "matIcon", disabled: "disabled", accept: "accept", tooltip: "tooltip" }, outputs: { fileChange: "fileChange" }, viewQueries: [{ propertyName: "fileElement", first: true, predicate: ["file"], descendants: true }], ngImport: i0, template: "<input\r\n hidden\r\n #file\r\n type=\"file\"\r\n [accept]=\"accept\"\r\n onclick=\"this.value=null\"\r\n (change)=\"selectFile($event)\" />\r\n\r\n<button\r\n mat-flat-button\r\n class=\"lf-button\"\r\n type=\"button\"\r\n [color]=\"color\"\r\n [disabled]=\"disabled\"\r\n (click)=\"triggerInput()\"\r\n [matTooltip]=\"tooltip\">\r\n @if (matIcon) {\r\n <mat-icon>{{ matIcon }}</mat-icon>\r\n }\r\n {{ label }}\r\n</button>\r\n", styles: [".lf-button{width:inherit}\n"], dependencies: [{ kind: "ngmodule", type: SharedModule }, { kind: "component", type: i2.MatButton, selector: " button[matButton], a[matButton], button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button], a[mat-flat-button], a[mat-stroked-button] ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }, { kind: "component", type: i4.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "directive", type: i4$1.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }] }); }
1405
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.5", type: FileUploadComponent, isStandalone: true, selector: "lf-file-upload", inputs: { color: "color", label: "label", matIcon: "matIcon", disabled: "disabled", accept: "accept", tooltip: "tooltip" }, outputs: { fileChangeEvent: "fileChangeEvent" }, viewQueries: [{ propertyName: "fileElement", first: true, predicate: ["file"], descendants: true }], ngImport: i0, template: "<input\r\n hidden\r\n #file\r\n type=\"file\"\r\n [accept]=\"accept\"\r\n onclick=\"this.value=null\"\r\n (change)=\"selectFile($event)\" />\r\n\r\n<button\r\n mat-flat-button\r\n class=\"lf-button\"\r\n type=\"button\"\r\n [color]=\"color\"\r\n [disabled]=\"disabled\"\r\n (click)=\"triggerInput()\"\r\n [matTooltip]=\"tooltip\">\r\n @if (matIcon) {\r\n <mat-icon>{{ matIcon }}</mat-icon>\r\n }\r\n {{ label }}\r\n</button>\r\n", styles: [".lf-button{width:inherit}\n"], dependencies: [{ kind: "ngmodule", type: SharedModule }, { kind: "component", type: i2.MatButton, selector: " button[matButton], a[matButton], button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button], a[mat-flat-button], a[mat-stroked-button] ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }, { kind: "component", type: i4.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "directive", type: i4$1.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }] }); }
1386
1406
  }
1387
1407
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.5", ngImport: i0, type: FileUploadComponent, decorators: [{
1388
1408
  type: Component,
@@ -1402,69 +1422,80 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.5", ngImpor
1402
1422
  type: Input
1403
1423
  }], tooltip: [{
1404
1424
  type: Input
1405
- }], fileChange: [{
1425
+ }], fileChangeEvent: [{
1406
1426
  type: Output
1407
1427
  }] } });
1408
1428
 
1409
1429
  class ListComponent {
1410
1430
  constructor() {
1431
+ this.header = null;
1411
1432
  this.items = [];
1412
- this.actions = [];
1413
- this.showHeader = false;
1414
- this.enableSorting = false;
1415
- this.enableCheckboxes = false;
1416
- this.actionClick = new EventEmitter();
1417
- this.selectionChange = new EventEmitter();
1433
+ this.buttons = [];
1434
+ // @Input() public avatarFallbackPath?: string;
1435
+ this.sortChangeEvent = new EventEmitter();
1436
+ this.selectionChangeEvent = new EventEmitter();
1437
+ this.itemClickEvent = new EventEmitter();
1438
+ this.buttonClickEvent = new EventEmitter();
1439
+ this.sortAsc = false;
1440
+ }
1441
+ get hasAvatars() {
1442
+ return !!this.items?.some((item) => item.avatar);
1418
1443
  }
1419
1444
  get allSelected() {
1420
- return this.items.length > 0 && this.items.every(i => i.checked);
1445
+ return this.items.length > 0 && this.items.every((item) => item.checked);
1421
1446
  }
1422
1447
  get someSelected() {
1423
- return this.items.some(i => i.checked) && !this.allSelected;
1448
+ return this.items.length > 0 && this.items.some((item) => item.checked) && !this.allSelected;
1424
1449
  }
1425
- toggleAll(event) {
1426
- const selected = event.checked;
1427
- this.items.forEach(i => (i.checked = selected));
1428
- this.emitSelection();
1450
+ getCombinedActions(item) {
1451
+ return [...(item.buttons ?? []), ...(this.buttons ?? [])];
1429
1452
  }
1430
- toggleItem() {
1453
+ updateSortToken(sortToken) {
1454
+ if (!sortToken)
1455
+ return;
1456
+ if (this.sortToken === sortToken)
1457
+ this.sortAsc = !this.sortAsc;
1458
+ this.sortToken = sortToken;
1459
+ this.sortChangeEvent.emit({ sortToken: this.sortToken, sortAsc: this.sortAsc });
1460
+ }
1461
+ selectAll(event) {
1462
+ // this.items.filter((item: ListItem) => !item.disabled).forEach((item: ListItem) => (item.checked = event.checked));
1463
+ this.items.forEach((item) => {
1464
+ if (!item.disabled)
1465
+ item.checked = event.checked;
1466
+ });
1431
1467
  this.emitSelection();
1432
1468
  }
1433
- onImageError(event) {
1434
- const target = event.target;
1435
- target.src = this.avatarFallbackPath || '';
1469
+ selectItem() {
1470
+ this.emitSelection();
1436
1471
  }
1437
1472
  emitSelection() {
1438
- const selected = this.items.filter(i => i.checked);
1439
- this.selectionChange.emit(selected);
1473
+ const selected = this.items.filter((item) => item.checked);
1474
+ this.selectionChangeEvent.emit(selected);
1440
1475
  }
1441
1476
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.5", ngImport: i0, type: ListComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
1442
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.5", type: ListComponent, isStandalone: true, selector: "lf-list", inputs: { items: "items", actions: "actions", showHeader: "showHeader", headerTitle: "headerTitle", enableSorting: "enableSorting", enableCheckboxes: "enableCheckboxes", avatarFallbackPath: "avatarFallbackPath" }, outputs: { actionClick: "actionClick", selectionChange: "selectionChange" }, ngImport: i0, template: "<!-- lf-list.component.html -->\r\n<div class=\"lf-table\">\r\n <!-- Header -->\r\n @if (showHeader) {\r\n <div class=\"lf-table-item lf-table-item-header\">\r\n <div class=\"lf-table-item-avatar\">\r\n <!-- <mat-icon class=\"material-icons-outlined margin-auto\">shopping_cart</mat-icon> -->\r\n </div>\r\n\r\n <div class=\"lf-table-item-title-wrapper flex-row\">\r\n <span>{{ headerTitle || \"Items\" }}</span>\r\n </div>\r\n\r\n <div class=\"lf-table-item-actions\"></div>\r\n\r\n @if (enableCheckboxes) {\r\n <div class=\"lf-table-item-checkbox\">\r\n <mat-checkbox\r\n [checked]=\"allSelected\"\r\n [indeterminate]=\"someSelected\"\r\n (change)=\"toggleAll($event)\"></mat-checkbox>\r\n </div>\r\n }\r\n </div>\r\n <mat-divider></mat-divider>\r\n }\r\n\r\n <!-- Items -->\r\n @for (item of items; track item.id ?? item.title) {\r\n <div class=\"lf-table-item lf-table-item-data\">\r\n <div class=\"lf-table-item-avatar\">\r\n <img\r\n [src]=\"item.avatarUrl\"\r\n [alt]=\"'Avatar of ' + item.title\"\r\n (error)=\"onImageError($event)\" />\r\n </div>\r\n\r\n <div class=\"lf-table-item-title-wrapper\">\r\n <span class=\"lf-table-item-title\">{{ item.title }}</span>\r\n @if (item.subtitle) {\r\n <span class=\"lf-table-item-subtitle\">{{ item.subtitle }}</span>\r\n }\r\n </div>\r\n\r\n <div class=\"lf-table-item-actions\">\r\n @for (action of actions; track action.id) {\r\n @if (!item.hiddenActions?.includes(action.id)) {\r\n <button\r\n mat-icon-button\r\n [color]=\"action.color\"\r\n [matTooltip]=\"action.tooltip\"\r\n [disabled]=\"action.disabled || item.disabledActions?.includes(action.id)\"\r\n (click)=\"actionClick.emit({ id: action.id, item })\">\r\n <lf-icon [matIcon]=\"action.matIcon\" [svgIcon]=\"action.svgIcon\"></lf-icon>\r\n </button>\r\n }\r\n }\r\n </div>\r\n\r\n @if (enableCheckboxes) {\r\n <div class=\"lf-table-item-checkbox\">\r\n <mat-checkbox [(ngModel)]=\"item.checked\" (ngModelChange)=\"toggleItem()\"></mat-checkbox>\r\n </div>\r\n }\r\n </div>\r\n } @empty {\r\n <div class=\"lf-table-item-no-items\">No items found.</div>\r\n }\r\n</div>\r\n", styles: [".lf-table{width:100%}.lf-table-item{width:100%;display:flex;flex-flow:row nowrap;align-items:center;justify-content:center;height:72px;border-radius:8px;box-sizing:border-box}.lf-table-item .lf-table-item-checkbox{flex:0 0 40px;margin-left:8px}.lf-table-item .lf-table-item-avatar{flex:0 0 48px;display:flex;padding:0 8px}.lf-table-item .lf-table-item-avatar img{width:48px;height:48px;border-radius:50%;object-fit:cover;background-color:#fff}.lf-table-item .lf-table-item-title-wrapper{display:flex;flex-flow:column;flex:1 1 200px;padding:0 8px;overflow:hidden}.lf-table-item .lf-table-item-title-wrapper .lf-table-item-title{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.lf-table-item .lf-table-item-title-wrapper .lf-table-item-subtitle{font-size:.8rem}.lf-table-item .lf-table-item-actions{flex:0 0 auto;display:flex;flex-flow:row nowrap;align-items:center;justify-content:space-between}.lf-table-item .lf-table-item-actions button:not(:last-child){margin-right:2px}.lf-table-item.lf-table-item-header{font-weight:500}.lf-table-item.lf-table-item-data:hover{background-color:#00000014}.lf-table-item .lf-table-item-no-items{text-align:center;padding:1rem;font-style:italic}\n"], dependencies: [{ kind: "ngmodule", type: SharedModule }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i2$5.MatCheckbox, selector: "mat-checkbox", inputs: ["aria-label", "aria-labelledby", "aria-describedby", "aria-expanded", "aria-controls", "aria-owns", "id", "required", "labelPosition", "name", "value", "disableRipple", "tabIndex", "color", "disabledInteractive", "checked", "disabled", "indeterminate"], outputs: ["change", "indeterminateChange"], exportAs: ["matCheckbox"] }, { kind: "component", type: i2.MatIconButton, selector: "button[mat-icon-button], a[mat-icon-button], button[matIconButton], a[matIconButton]", exportAs: ["matButton", "matAnchor"] }, { kind: "component", type: i4$3.MatDivider, selector: "mat-divider", inputs: ["vertical", "inset"] }, { kind: "directive", type: i4$1.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "component", type: IconComponent, selector: "lf-icon", inputs: ["matIcon", "svgIcon", "outlineIcon", "alignMiddle"] }] }); }
1477
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.5", type: ListComponent, isStandalone: true, selector: "lf-list", inputs: { header: "header", items: "items", buttons: "buttons" }, outputs: { sortChangeEvent: "sortChangeEvent", selectionChangeEvent: "selectionChangeEvent", itemClickEvent: "itemClickEvent", buttonClickEvent: "buttonClickEvent" }, ngImport: i0, template: "<!-- lf-list.component.html -->\r\n<div class=\"lf-table\">\r\n <!-- Header -->\r\n @if (header) {\r\n <div class=\"lf-table-item lf-table-item-header\">\r\n <!-- avatar -->\r\n @if (header.avatar) {\r\n <div class=\"lf-table-item-avatar\">\r\n <img [src]=\"header.avatar\" alt=\"Avatar of header\" />\r\n <!-- (error)=\"onImageError($event)\" -->\r\n </div>\r\n } @else if (header.matIcon || header.svgIcon) {\r\n <div class=\"lf-table-item-avatar\">\r\n <lf-icon [matIcon]=\"header.matIcon\" [svgIcon]=\"header.svgIcon\"></lf-icon>\r\n </div>\r\n } @else if (hasAvatars) {\r\n <div class=\"lf-table-item-avatar\"></div>\r\n }\r\n\r\n <!-- title -->\r\n <div class=\"lf-table-item-title-wrapper flex-row\">\r\n @for (item of header.items; track $index) {\r\n <span [class.clickable]=\"item.sortToken\" (click)=\"updateSortToken(item.sortToken)\">\r\n {{ item.title }}\r\n @if (sortToken === item.sortToken) {\r\n <mat-icon class=\"lf-table-item-sort-icon\">\r\n {{ sortAsc ? \"arrow_downward\" : \"arrow_upward\" }}\r\n </mat-icon>\r\n }\r\n </span>\r\n }\r\n </div>\r\n\r\n <!-- buttons -->\r\n <div class=\"lf-table-item-buttons\"></div>\r\n\r\n <!-- checkbox -->\r\n @if (header.enableSelection) {\r\n <div class=\"lf-table-item-checkbox\">\r\n <mat-checkbox\r\n [checked]=\"allSelected && !someSelected\"\r\n [indeterminate]=\"someSelected\"\r\n (change)=\"selectAll($event)\"></mat-checkbox>\r\n </div>\r\n }\r\n </div>\r\n <mat-divider></mat-divider>\r\n }\r\n\r\n <!-- Items -->\r\n @for (item of items; track item.id) {\r\n <div\r\n class=\"lf-table-item lf-table-item-data\"\r\n [class.active]=\"item.checked\"\r\n [class.disabled]=\"item.disabled\"\r\n [class.clickable]=\"item.clickable && !item.disabled\">\r\n <!-- avatar -->\r\n @if (item.avatar) {\r\n <div class=\"lf-table-item-avatar\">\r\n <img [src]=\"item.avatar\" [alt]=\"'Avatar of ' + item.title\" />\r\n <!-- (error)=\"onImageError($event)\" -->\r\n </div>\r\n } @else if (item.matIcon || item.svgIcon) {\r\n <div class=\"lf-table-item-avatar\">\r\n <lf-icon [matIcon]=\"item.matIcon\" [svgIcon]=\"item.svgIcon\"></lf-icon>\r\n </div>\r\n }\r\n\r\n <!-- title -->\r\n <div class=\"lf-table-item-title-wrapper\">\r\n <span\r\n class=\"lf-table-item-title\"\r\n (click)=\"item.clickable && !item.disabled ? itemClickEvent.emit(item) : null\">\r\n <span>{{ item.title }}</span>\r\n </span>\r\n @if (item.subtitle) {\r\n <span class=\"lf-table-item-subtitle\">{{ item.subtitle }}</span>\r\n }\r\n </div>\r\n\r\n <!-- buttons -->\r\n <div class=\"lf-table-item-buttons\">\r\n @let combinedButtons = getCombinedActions(item);\r\n @for (button of combinedButtons; track button.id) {\r\n @if (!item.hiddenButtons?.includes(button.id)) {\r\n @if (button.label) {\r\n <button\r\n mat-button\r\n class=\"lf-bottom-bar-button ml-2\"\r\n [ngClass]=\"button.class\"\r\n (click)=\"buttonClickEvent.emit({ buttonId: button.id, item })\"\r\n [disabled]=\"button.disabled || item.disabled\"\r\n [matTooltip]=\"button.tooltip\">\r\n @if (button.matIcon || button.svgIcon) {\r\n <lf-icon\r\n [matIcon]=\"button.matIcon\"\r\n [svgIcon]=\"button.svgIcon\"\r\n [alignMiddle]=\"true\"></lf-icon>\r\n }\r\n {{ button.label }}\r\n </button>\r\n } @else {\r\n <button\r\n mat-icon-button\r\n class=\"lf-bottom-bar-button-icon ml-2\"\r\n [ngClass]=\"!button.disabled && !item.disabled ? button.class : ''\"\r\n (click)=\"buttonClickEvent.emit({ buttonId: button.id, item })\"\r\n [disabled]=\"button.disabled || item.disabled\"\r\n [matTooltip]=\"button.tooltip\">\r\n <lf-icon [matIcon]=\"button.matIcon\" [svgIcon]=\"button.svgIcon\"></lf-icon>\r\n </button>\r\n }\r\n <!-- [color]=\"button.color\" -->\r\n }\r\n }\r\n </div>\r\n\r\n <!-- checkbox -->\r\n @if (header?.enableSelection) {\r\n <div class=\"lf-table-item-checkbox\">\r\n <mat-checkbox\r\n [(ngModel)]=\"item.checked\"\r\n (ngModelChange)=\"selectItem()\"\r\n [disabled]=\"item.disabled!\"></mat-checkbox>\r\n </div>\r\n }\r\n </div>\r\n } @empty {\r\n <div class=\"lf-table-item-no-items\">No items found.</div>\r\n }\r\n</div>\r\n", styles: [".lf-table{width:100%}.lf-table-item{width:100%;display:flex;flex-flow:row nowrap;align-items:center;justify-content:center;height:72px;border-radius:4px;box-sizing:border-box}.lf-table-item.disabled .lf-table-item-title-wrapper{opacity:.64}.lf-table-item.clickable .lf-table-item-title{cursor:pointer}.lf-table-item .lf-table-item-sort-icon{font-size:16px;width:16px;height:16px;vertical-align:text-top}.lf-table-item .lf-table-item-checkbox{flex:0 0 40px;margin-left:8px}.lf-table-item .lf-table-item-avatar{flex:0 0 48px;display:flex;align-items:center;justify-content:center;padding:0 8px}.lf-table-item .lf-table-item-avatar img{width:48px;height:48px;border-radius:50%;object-fit:cover;background-color:#fff}.lf-table-item .lf-table-item-title-wrapper{display:flex;flex-flow:column;flex:1 1 200px;padding:0 8px;overflow:hidden}.lf-table-item .lf-table-item-title-wrapper .lf-table-item-title{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.lf-table-item .lf-table-item-title-wrapper .lf-table-item-subtitle{font-size:.8rem}.lf-table-item .lf-table-item-buttons{flex:0 0 auto;display:flex;flex-flow:row nowrap;align-items:center;justify-content:space-between}.lf-table-item .lf-table-item-buttons button:not(:last-child){margin-right:2px}.lf-table-item.lf-table-item-header{font-weight:500}.lf-table-item.lf-table-item-header .lf-table-item-title-wrapper span{width:80px}.lf-table-item.lf-table-item-data:hover{background-color:#00000014}.lf-table-item .lf-table-item-no-items{text-align:center;padding:1rem;font-style:italic}.lf-table-item .clickable{cursor:pointer}.lf-table-item .flex-row{display:flex!important;flex-flow:row nowrap;align-items:center}\n"], dependencies: [{ kind: "ngmodule", type: SharedModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i3$3.MatCheckbox, selector: "mat-checkbox", inputs: ["aria-label", "aria-labelledby", "aria-describedby", "aria-expanded", "aria-controls", "aria-owns", "id", "required", "labelPosition", "name", "value", "disableRipple", "tabIndex", "color", "disabledInteractive", "checked", "disabled", "indeterminate"], outputs: ["change", "indeterminateChange"], exportAs: ["matCheckbox"] }, { kind: "component", type: i2.MatButton, selector: " button[matButton], a[matButton], button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button], a[mat-flat-button], a[mat-stroked-button] ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }, { kind: "component", type: i2.MatIconButton, selector: "button[mat-icon-button], a[mat-icon-button], button[matIconButton], a[matIconButton]", exportAs: ["matButton", "matAnchor"] }, { kind: "component", type: i5$1.MatDivider, selector: "mat-divider", inputs: ["vertical", "inset"] }, { kind: "component", type: i4.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "directive", type: i4$1.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "component", type: IconComponent, selector: "lf-icon", inputs: ["matIcon", "svgIcon", "alignMiddle"] }] }); }
1443
1478
  }
1444
1479
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.5", ngImport: i0, type: ListComponent, decorators: [{
1445
1480
  type: Component,
1446
- args: [{ selector: 'lf-list', standalone: true, imports: [SharedModule, IconComponent], template: "<!-- lf-list.component.html -->\r\n<div class=\"lf-table\">\r\n <!-- Header -->\r\n @if (showHeader) {\r\n <div class=\"lf-table-item lf-table-item-header\">\r\n <div class=\"lf-table-item-avatar\">\r\n <!-- <mat-icon class=\"material-icons-outlined margin-auto\">shopping_cart</mat-icon> -->\r\n </div>\r\n\r\n <div class=\"lf-table-item-title-wrapper flex-row\">\r\n <span>{{ headerTitle || \"Items\" }}</span>\r\n </div>\r\n\r\n <div class=\"lf-table-item-actions\"></div>\r\n\r\n @if (enableCheckboxes) {\r\n <div class=\"lf-table-item-checkbox\">\r\n <mat-checkbox\r\n [checked]=\"allSelected\"\r\n [indeterminate]=\"someSelected\"\r\n (change)=\"toggleAll($event)\"></mat-checkbox>\r\n </div>\r\n }\r\n </div>\r\n <mat-divider></mat-divider>\r\n }\r\n\r\n <!-- Items -->\r\n @for (item of items; track item.id ?? item.title) {\r\n <div class=\"lf-table-item lf-table-item-data\">\r\n <div class=\"lf-table-item-avatar\">\r\n <img\r\n [src]=\"item.avatarUrl\"\r\n [alt]=\"'Avatar of ' + item.title\"\r\n (error)=\"onImageError($event)\" />\r\n </div>\r\n\r\n <div class=\"lf-table-item-title-wrapper\">\r\n <span class=\"lf-table-item-title\">{{ item.title }}</span>\r\n @if (item.subtitle) {\r\n <span class=\"lf-table-item-subtitle\">{{ item.subtitle }}</span>\r\n }\r\n </div>\r\n\r\n <div class=\"lf-table-item-actions\">\r\n @for (action of actions; track action.id) {\r\n @if (!item.hiddenActions?.includes(action.id)) {\r\n <button\r\n mat-icon-button\r\n [color]=\"action.color\"\r\n [matTooltip]=\"action.tooltip\"\r\n [disabled]=\"action.disabled || item.disabledActions?.includes(action.id)\"\r\n (click)=\"actionClick.emit({ id: action.id, item })\">\r\n <lf-icon [matIcon]=\"action.matIcon\" [svgIcon]=\"action.svgIcon\"></lf-icon>\r\n </button>\r\n }\r\n }\r\n </div>\r\n\r\n @if (enableCheckboxes) {\r\n <div class=\"lf-table-item-checkbox\">\r\n <mat-checkbox [(ngModel)]=\"item.checked\" (ngModelChange)=\"toggleItem()\"></mat-checkbox>\r\n </div>\r\n }\r\n </div>\r\n } @empty {\r\n <div class=\"lf-table-item-no-items\">No items found.</div>\r\n }\r\n</div>\r\n", styles: [".lf-table{width:100%}.lf-table-item{width:100%;display:flex;flex-flow:row nowrap;align-items:center;justify-content:center;height:72px;border-radius:8px;box-sizing:border-box}.lf-table-item .lf-table-item-checkbox{flex:0 0 40px;margin-left:8px}.lf-table-item .lf-table-item-avatar{flex:0 0 48px;display:flex;padding:0 8px}.lf-table-item .lf-table-item-avatar img{width:48px;height:48px;border-radius:50%;object-fit:cover;background-color:#fff}.lf-table-item .lf-table-item-title-wrapper{display:flex;flex-flow:column;flex:1 1 200px;padding:0 8px;overflow:hidden}.lf-table-item .lf-table-item-title-wrapper .lf-table-item-title{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.lf-table-item .lf-table-item-title-wrapper .lf-table-item-subtitle{font-size:.8rem}.lf-table-item .lf-table-item-actions{flex:0 0 auto;display:flex;flex-flow:row nowrap;align-items:center;justify-content:space-between}.lf-table-item .lf-table-item-actions button:not(:last-child){margin-right:2px}.lf-table-item.lf-table-item-header{font-weight:500}.lf-table-item.lf-table-item-data:hover{background-color:#00000014}.lf-table-item .lf-table-item-no-items{text-align:center;padding:1rem;font-style:italic}\n"] }]
1447
- }], propDecorators: { items: [{
1481
+ args: [{ selector: 'lf-list', standalone: true, imports: [SharedModule, IconComponent], template: "<!-- lf-list.component.html -->\r\n<div class=\"lf-table\">\r\n <!-- Header -->\r\n @if (header) {\r\n <div class=\"lf-table-item lf-table-item-header\">\r\n <!-- avatar -->\r\n @if (header.avatar) {\r\n <div class=\"lf-table-item-avatar\">\r\n <img [src]=\"header.avatar\" alt=\"Avatar of header\" />\r\n <!-- (error)=\"onImageError($event)\" -->\r\n </div>\r\n } @else if (header.matIcon || header.svgIcon) {\r\n <div class=\"lf-table-item-avatar\">\r\n <lf-icon [matIcon]=\"header.matIcon\" [svgIcon]=\"header.svgIcon\"></lf-icon>\r\n </div>\r\n } @else if (hasAvatars) {\r\n <div class=\"lf-table-item-avatar\"></div>\r\n }\r\n\r\n <!-- title -->\r\n <div class=\"lf-table-item-title-wrapper flex-row\">\r\n @for (item of header.items; track $index) {\r\n <span [class.clickable]=\"item.sortToken\" (click)=\"updateSortToken(item.sortToken)\">\r\n {{ item.title }}\r\n @if (sortToken === item.sortToken) {\r\n <mat-icon class=\"lf-table-item-sort-icon\">\r\n {{ sortAsc ? \"arrow_downward\" : \"arrow_upward\" }}\r\n </mat-icon>\r\n }\r\n </span>\r\n }\r\n </div>\r\n\r\n <!-- buttons -->\r\n <div class=\"lf-table-item-buttons\"></div>\r\n\r\n <!-- checkbox -->\r\n @if (header.enableSelection) {\r\n <div class=\"lf-table-item-checkbox\">\r\n <mat-checkbox\r\n [checked]=\"allSelected && !someSelected\"\r\n [indeterminate]=\"someSelected\"\r\n (change)=\"selectAll($event)\"></mat-checkbox>\r\n </div>\r\n }\r\n </div>\r\n <mat-divider></mat-divider>\r\n }\r\n\r\n <!-- Items -->\r\n @for (item of items; track item.id) {\r\n <div\r\n class=\"lf-table-item lf-table-item-data\"\r\n [class.active]=\"item.checked\"\r\n [class.disabled]=\"item.disabled\"\r\n [class.clickable]=\"item.clickable && !item.disabled\">\r\n <!-- avatar -->\r\n @if (item.avatar) {\r\n <div class=\"lf-table-item-avatar\">\r\n <img [src]=\"item.avatar\" [alt]=\"'Avatar of ' + item.title\" />\r\n <!-- (error)=\"onImageError($event)\" -->\r\n </div>\r\n } @else if (item.matIcon || item.svgIcon) {\r\n <div class=\"lf-table-item-avatar\">\r\n <lf-icon [matIcon]=\"item.matIcon\" [svgIcon]=\"item.svgIcon\"></lf-icon>\r\n </div>\r\n }\r\n\r\n <!-- title -->\r\n <div class=\"lf-table-item-title-wrapper\">\r\n <span\r\n class=\"lf-table-item-title\"\r\n (click)=\"item.clickable && !item.disabled ? itemClickEvent.emit(item) : null\">\r\n <span>{{ item.title }}</span>\r\n </span>\r\n @if (item.subtitle) {\r\n <span class=\"lf-table-item-subtitle\">{{ item.subtitle }}</span>\r\n }\r\n </div>\r\n\r\n <!-- buttons -->\r\n <div class=\"lf-table-item-buttons\">\r\n @let combinedButtons = getCombinedActions(item);\r\n @for (button of combinedButtons; track button.id) {\r\n @if (!item.hiddenButtons?.includes(button.id)) {\r\n @if (button.label) {\r\n <button\r\n mat-button\r\n class=\"lf-bottom-bar-button ml-2\"\r\n [ngClass]=\"button.class\"\r\n (click)=\"buttonClickEvent.emit({ buttonId: button.id, item })\"\r\n [disabled]=\"button.disabled || item.disabled\"\r\n [matTooltip]=\"button.tooltip\">\r\n @if (button.matIcon || button.svgIcon) {\r\n <lf-icon\r\n [matIcon]=\"button.matIcon\"\r\n [svgIcon]=\"button.svgIcon\"\r\n [alignMiddle]=\"true\"></lf-icon>\r\n }\r\n {{ button.label }}\r\n </button>\r\n } @else {\r\n <button\r\n mat-icon-button\r\n class=\"lf-bottom-bar-button-icon ml-2\"\r\n [ngClass]=\"!button.disabled && !item.disabled ? button.class : ''\"\r\n (click)=\"buttonClickEvent.emit({ buttonId: button.id, item })\"\r\n [disabled]=\"button.disabled || item.disabled\"\r\n [matTooltip]=\"button.tooltip\">\r\n <lf-icon [matIcon]=\"button.matIcon\" [svgIcon]=\"button.svgIcon\"></lf-icon>\r\n </button>\r\n }\r\n <!-- [color]=\"button.color\" -->\r\n }\r\n }\r\n </div>\r\n\r\n <!-- checkbox -->\r\n @if (header?.enableSelection) {\r\n <div class=\"lf-table-item-checkbox\">\r\n <mat-checkbox\r\n [(ngModel)]=\"item.checked\"\r\n (ngModelChange)=\"selectItem()\"\r\n [disabled]=\"item.disabled!\"></mat-checkbox>\r\n </div>\r\n }\r\n </div>\r\n } @empty {\r\n <div class=\"lf-table-item-no-items\">No items found.</div>\r\n }\r\n</div>\r\n", styles: [".lf-table{width:100%}.lf-table-item{width:100%;display:flex;flex-flow:row nowrap;align-items:center;justify-content:center;height:72px;border-radius:4px;box-sizing:border-box}.lf-table-item.disabled .lf-table-item-title-wrapper{opacity:.64}.lf-table-item.clickable .lf-table-item-title{cursor:pointer}.lf-table-item .lf-table-item-sort-icon{font-size:16px;width:16px;height:16px;vertical-align:text-top}.lf-table-item .lf-table-item-checkbox{flex:0 0 40px;margin-left:8px}.lf-table-item .lf-table-item-avatar{flex:0 0 48px;display:flex;align-items:center;justify-content:center;padding:0 8px}.lf-table-item .lf-table-item-avatar img{width:48px;height:48px;border-radius:50%;object-fit:cover;background-color:#fff}.lf-table-item .lf-table-item-title-wrapper{display:flex;flex-flow:column;flex:1 1 200px;padding:0 8px;overflow:hidden}.lf-table-item .lf-table-item-title-wrapper .lf-table-item-title{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.lf-table-item .lf-table-item-title-wrapper .lf-table-item-subtitle{font-size:.8rem}.lf-table-item .lf-table-item-buttons{flex:0 0 auto;display:flex;flex-flow:row nowrap;align-items:center;justify-content:space-between}.lf-table-item .lf-table-item-buttons button:not(:last-child){margin-right:2px}.lf-table-item.lf-table-item-header{font-weight:500}.lf-table-item.lf-table-item-header .lf-table-item-title-wrapper span{width:80px}.lf-table-item.lf-table-item-data:hover{background-color:#00000014}.lf-table-item .lf-table-item-no-items{text-align:center;padding:1rem;font-style:italic}.lf-table-item .clickable{cursor:pointer}.lf-table-item .flex-row{display:flex!important;flex-flow:row nowrap;align-items:center}\n"] }]
1482
+ }], propDecorators: { header: [{
1448
1483
  type: Input
1449
- }], actions: [{
1484
+ }], items: [{
1450
1485
  type: Input
1451
- }], showHeader: [{
1486
+ }], buttons: [{
1452
1487
  type: Input
1453
- }], headerTitle: [{
1454
- type: Input
1455
- }], enableSorting: [{
1456
- type: Input
1457
- }], enableCheckboxes: [{
1458
- type: Input
1459
- }], avatarFallbackPath: [{
1460
- type: Input
1461
- }], actionClick: [{
1488
+ }], sortChangeEvent: [{
1489
+ type: Output
1490
+ }], selectionChangeEvent: [{
1491
+ type: Output
1492
+ }], itemClickEvent: [{
1462
1493
  type: Output
1463
- }], selectionChange: [{
1494
+ }], buttonClickEvent: [{
1464
1495
  type: Output
1465
1496
  }] } });
1466
1497
 
1467
- class LoadingInterceptor {
1498
+ class ScaffoldLoadingInterceptor {
1468
1499
  constructor() {
1469
1500
  this.scaffoldService = inject(ScaffoldService);
1470
1501
  this.activeRequests = 0;
@@ -1498,21 +1529,21 @@ class LoadingInterceptor {
1498
1529
  }
1499
1530
  }));
1500
1531
  }
1501
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.5", ngImport: i0, type: LoadingInterceptor, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
1502
- static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.0.5", ngImport: i0, type: LoadingInterceptor }); }
1532
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.5", ngImport: i0, type: ScaffoldLoadingInterceptor, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
1533
+ static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.0.5", ngImport: i0, type: ScaffoldLoadingInterceptor }); }
1503
1534
  }
1504
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.5", ngImport: i0, type: LoadingInterceptor, decorators: [{
1535
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.5", ngImport: i0, type: ScaffoldLoadingInterceptor, decorators: [{
1505
1536
  type: Injectable
1506
1537
  }] });
1507
1538
 
1508
1539
  /*
1509
1540
  * Public API Surface of components
1510
1541
  */
1511
- /* MODELS */
1542
+ /* CONFIG */
1512
1543
 
1513
1544
  /**
1514
1545
  * Generated bundle index. Do not edit.
1515
1546
  */
1516
1547
 
1517
- export { BreakpointService, CONFIG, DialogService, FileUploadComponent, ListComponent, LoadingInterceptor, LocalStorageService, Logger, PlaceholderComponent, RouterService, ScaffoldComponent, ScaffoldModule, ScaffoldService, SeoService, SnackbarService, ThemeService };
1548
+ export { BreakpointService, CONFIG, DialogService, FileUploadComponent, ListComponent, LocalStorageService, Logger, PlaceholderComponent, RouterService, ScaffoldComponent, ScaffoldLoadingInterceptor, ScaffoldModule, ScaffoldService, SeoService, SnackbarService, ThemeService };
1518
1549
  //# sourceMappingURL=lukfel-ng-scaffold.mjs.map