@elderbyte/ngx-starter 19.1.16 → 19.1.18

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 (26) hide show
  1. package/fesm2022/elderbyte-ngx-starter.mjs +21 -13
  2. package/fesm2022/elderbyte-ngx-starter.mjs.map +1 -1
  3. package/lib/components/data-view/common/elder-data-toolbar/elder-data-toolbar.component.d.ts +1 -1
  4. package/lib/components/navigation/toolbar/elder-toolbar-column.directive.d.ts +4 -0
  5. package/lib/components/time/elder-interval-picker/elder-interval-picker.component.d.ts +1 -1
  6. package/lib/components/time/elder-interval-picker/interval-picker-toggle/elder-interval-picker-toggle.component.d.ts +1 -1
  7. package/lib/components/url-fragment/url-fragment-switcher/elder-url-fragment-switcher.component.d.ts +1 -1
  8. package/package.json +1 -1
  9. package/src/lib/components/button-group/elder-button-group/elder-button-group.component.scss +8 -4
  10. package/src/lib/components/data-view/common/elder-data-toolbar/elder-data-toolbar.component.scss +2 -2
  11. package/src/lib/components/navigation/nav/nav-link/elder-nav-link.component.scss +3 -1
  12. package/src/lib/components/panels/toggle-panel/elder-toggle-panel.component.scss +1 -1
  13. package/src/lib/components/shell/shell/elder-shell.component.scss +1 -1
  14. package/src/lib/components/url-fragment/url-fragment-switcher/elder-url-fragment-switcher.component.scss +4 -0
  15. package/theming/abstracts/_elder-design-tokens.scss +1 -1
  16. package/theming/abstracts/_elder-starter-theme.scss +0 -1
  17. package/theming/abstracts/_elder-theme-main.scss +1 -4
  18. package/theming/base/_elder-fixes-base.scss +1 -1
  19. package/theming/base/_elder-root-base.scss +29 -29
  20. package/theming/components/_elder-select-theme.scss +1 -2
  21. package/theming/components/_elder-table-theme.scss +1 -1
  22. package/theming/components/_elder-toolbar-theme.scss +0 -7
  23. package/theming/utilities/_elder-color-utils.scss +1 -1
  24. package/theming/utilities/_elder-common-utils.scss +1 -1
  25. package/theming/utilities/_elder-flex-layout-utils.scss +1 -1
  26. package/theming/utilities/_elder-typography-utils.scss +60 -60
@@ -13402,11 +13402,11 @@ class ElderHeaderComponent {
13402
13402
  **************************************************************************/
13403
13403
  ngOnInit() { }
13404
13404
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.1.4", ngImport: i0, type: ElderHeaderComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
13405
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.1.4", type: ElderHeaderComponent, isStandalone: true, selector: "elder-header", inputs: { header: "header", subheader: "subheader" }, ngImport: i0, template: "<div class=\"layout-col\">\n <h2>{{ header ? header : ('-' | translate) }}</h2>\n <span class=\"mat-caption\">{{ subheader ? subheader : ('-' | translate) }}</span>\n</div>\n", styles: ["h2{margin:0;font:var(--md-sys-typescale-title-large);letter-spacing:var(--md-sys-typescale-title-large-tracking)}\n"], dependencies: [{ kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i1$2.TranslatePipe, name: "translate" }] }); }
13405
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.1.4", type: ElderHeaderComponent, isStandalone: true, selector: "elder-header", inputs: { header: "header", subheader: "subheader" }, ngImport: i0, template: "<div class=\"layout-col\">\n <h2 id=\"header\">{{ header ? header : ('-' | translate) }}</h2>\n <span id=\"subheader\" class=\"mat-caption\">{{ subheader ? subheader : ('-' | translate) }}</span>\n</div>\n", styles: ["h2{margin:0;font:var(--md-sys-typescale-title-large);letter-spacing:var(--md-sys-typescale-title-large-tracking)}:host(.truncate-headers) #header,:host(.truncate-headers) #subheader{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:100%}\n"], dependencies: [{ kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i1$2.TranslatePipe, name: "translate" }] }); }
13406
13406
  }
13407
13407
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.1.4", ngImport: i0, type: ElderHeaderComponent, decorators: [{
13408
13408
  type: Component,
13409
- args: [{ selector: 'elder-header', imports: [TranslateModule], template: "<div class=\"layout-col\">\n <h2>{{ header ? header : ('-' | translate) }}</h2>\n <span class=\"mat-caption\">{{ subheader ? subheader : ('-' | translate) }}</span>\n</div>\n", styles: ["h2{margin:0;font:var(--md-sys-typescale-title-large);letter-spacing:var(--md-sys-typescale-title-large-tracking)}\n"] }]
13409
+ args: [{ selector: 'elder-header', imports: [TranslateModule], template: "<div class=\"layout-col\">\n <h2 id=\"header\">{{ header ? header : ('-' | translate) }}</h2>\n <span id=\"subheader\" class=\"mat-caption\">{{ subheader ? subheader : ('-' | translate) }}</span>\n</div>\n", styles: ["h2{margin:0;font:var(--md-sys-typescale-title-large);letter-spacing:var(--md-sys-typescale-title-large-tracking)}:host(.truncate-headers) #header,:host(.truncate-headers) #subheader{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:100%}\n"] }]
13410
13410
  }], ctorParameters: () => [], propDecorators: { header: [{
13411
13411
  type: Input
13412
13412
  }], subheader: [{
@@ -13704,7 +13704,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.1.4", ngImpor
13704
13704
 
13705
13705
  /**
13706
13706
  * This directive projects content identified by a placeholder id
13707
- * into the toolbar at the corresponding place.
13707
+ * into the elder-data-toolbar at the corresponding ElderToolbarContentSlot.
13708
13708
  */
13709
13709
  class ElderToolbarContentDirective {
13710
13710
  constructor(templateRef) {
@@ -14779,7 +14779,7 @@ class ElderCompositeSortComponent {
14779
14779
  }
14780
14780
  }
14781
14781
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.1.4", ngImport: i0, type: ElderCompositeSortComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
14782
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.1.4", type: ElderCompositeSortComponent, isStandalone: true, selector: "elder-composite-sort", inputs: { availableSorts: { classPropertyName: "availableSorts", publicName: "availableSorts", isSignal: true, isRequired: true, transformFunction: null }, sorts: { classPropertyName: "sorts", publicName: "sorts", isSignal: true, isRequired: false, transformFunction: null }, translationPrefix: { classPropertyName: "translationPrefix", publicName: "translationPrefix", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { sorts: "sortsChange", sortsChange: "sortsChange" }, ngImport: i0, template: "<div class=\"layout-row place-start-center flex-none\">\n <button mat-button type=\"button\" [matMenuTriggerFor]=\"menu\">\n {{ translationPrefix() + selectedSort().id | translate }}\n\n <mat-icon style=\"font-size: 22px; height: 22px;\">sort</mat-icon>\n\n <mat-menu #menu=\"matMenu\">\n @for (namedSort of availableSorts(); track namedSort.id) {\n <button mat-menu-item type=\"button\" (click)=\"selectSort(namedSort)\">\n <mat-icon>sort</mat-icon>\n <span [class.mat-body-strong]=\"selectedSort()?.id === namedSort.id\">{{\n translationPrefix() + namedSort.id | translate\n }}</span>\n </button>\n }\n </mat-menu>\n </button>\n\n <button mat-icon-button type=\"button\" (click)=\"toggleSortDirection($event)\">\n <mat-icon style=\"font-size: 22px\">{{\n selectedSortDirection() === 'asc' ? 'arrow_downward' : 'arrow_upward'\n }}</mat-icon>\n </button>\n</div>\n", styles: [""], dependencies: [{ kind: "component", type: MatButton, selector: " button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button] ", exportAs: ["matButton"] }, { kind: "component", type: MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: MatIconButton, selector: "button[mat-icon-button]", exportAs: ["matButton"] }, { kind: "component", type: 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: MatMenuItem, selector: "[mat-menu-item]", inputs: ["role", "disabled", "disableRipple"], exportAs: ["matMenuItem"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i1$2.TranslatePipe, name: "translate" }, { kind: "directive", type: MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", inputs: ["mat-menu-trigger-for", "matMenuTriggerFor", "matMenuTriggerData", "matMenuTriggerRestoreFocus"], outputs: ["menuOpened", "onMenuOpen", "menuClosed", "onMenuClose"], exportAs: ["matMenuTrigger"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
14782
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.1.4", type: ElderCompositeSortComponent, isStandalone: true, selector: "elder-composite-sort", inputs: { availableSorts: { classPropertyName: "availableSorts", publicName: "availableSorts", isSignal: true, isRequired: true, transformFunction: null }, sorts: { classPropertyName: "sorts", publicName: "sorts", isSignal: true, isRequired: false, transformFunction: null }, translationPrefix: { classPropertyName: "translationPrefix", publicName: "translationPrefix", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { sorts: "sortsChange", sortsChange: "sortsChange" }, ngImport: i0, template: "<div class=\"layout-row place-start-center flex-none\">\n <button mat-button type=\"button\" [matMenuTriggerFor]=\"menu\">\n {{ translationPrefix() + selectedSort().id | translate }}\n\n <mat-icon style=\"font-size: 22px; height: 22px\">sort</mat-icon>\n\n <mat-menu #menu=\"matMenu\">\n @for (namedSort of availableSorts(); track namedSort.id) {\n <button mat-menu-item type=\"button\" (click)=\"selectSort(namedSort)\">\n <mat-icon>sort</mat-icon>\n <span [class.mat-body-strong]=\"selectedSort()?.id === namedSort.id\">{{\n translationPrefix() + namedSort.id | translate\n }}</span>\n </button>\n }\n </mat-menu>\n </button>\n\n <button mat-icon-button type=\"button\" (click)=\"toggleSortDirection($event)\">\n <mat-icon style=\"font-size: 22px\">{{\n selectedSortDirection() === 'asc' ? 'arrow_downward' : 'arrow_upward'\n }}</mat-icon>\n </button>\n</div>\n", styles: [""], dependencies: [{ kind: "component", type: MatButton, selector: " button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button] ", exportAs: ["matButton"] }, { kind: "component", type: MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: MatIconButton, selector: "button[mat-icon-button]", exportAs: ["matButton"] }, { kind: "component", type: 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: MatMenuItem, selector: "[mat-menu-item]", inputs: ["role", "disabled", "disableRipple"], exportAs: ["matMenuItem"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i1$2.TranslatePipe, name: "translate" }, { kind: "directive", type: MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", inputs: ["mat-menu-trigger-for", "matMenuTriggerFor", "matMenuTriggerData", "matMenuTriggerRestoreFocus"], outputs: ["menuOpened", "onMenuOpen", "menuClosed", "onMenuClose"], exportAs: ["matMenuTrigger"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
14783
14783
  }
14784
14784
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.1.4", ngImport: i0, type: ElderCompositeSortComponent, decorators: [{
14785
14785
  type: Component,
@@ -14791,7 +14791,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.1.4", ngImpor
14791
14791
  MatMenuItem,
14792
14792
  TranslateModule,
14793
14793
  MatMenuTrigger,
14794
- ], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"layout-row place-start-center flex-none\">\n <button mat-button type=\"button\" [matMenuTriggerFor]=\"menu\">\n {{ translationPrefix() + selectedSort().id | translate }}\n\n <mat-icon style=\"font-size: 22px; height: 22px;\">sort</mat-icon>\n\n <mat-menu #menu=\"matMenu\">\n @for (namedSort of availableSorts(); track namedSort.id) {\n <button mat-menu-item type=\"button\" (click)=\"selectSort(namedSort)\">\n <mat-icon>sort</mat-icon>\n <span [class.mat-body-strong]=\"selectedSort()?.id === namedSort.id\">{{\n translationPrefix() + namedSort.id | translate\n }}</span>\n </button>\n }\n </mat-menu>\n </button>\n\n <button mat-icon-button type=\"button\" (click)=\"toggleSortDirection($event)\">\n <mat-icon style=\"font-size: 22px\">{{\n selectedSortDirection() === 'asc' ? 'arrow_downward' : 'arrow_upward'\n }}</mat-icon>\n </button>\n</div>\n" }]
14794
+ ], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"layout-row place-start-center flex-none\">\n <button mat-button type=\"button\" [matMenuTriggerFor]=\"menu\">\n {{ translationPrefix() + selectedSort().id | translate }}\n\n <mat-icon style=\"font-size: 22px; height: 22px\">sort</mat-icon>\n\n <mat-menu #menu=\"matMenu\">\n @for (namedSort of availableSorts(); track namedSort.id) {\n <button mat-menu-item type=\"button\" (click)=\"selectSort(namedSort)\">\n <mat-icon>sort</mat-icon>\n <span [class.mat-body-strong]=\"selectedSort()?.id === namedSort.id\">{{\n translationPrefix() + namedSort.id | translate\n }}</span>\n </button>\n }\n </mat-menu>\n </button>\n\n <button mat-icon-button type=\"button\" (click)=\"toggleSortDirection($event)\">\n <mat-icon style=\"font-size: 22px\">{{\n selectedSortDirection() === 'asc' ? 'arrow_downward' : 'arrow_upward'\n }}</mat-icon>\n </button>\n</div>\n" }]
14795
14795
  }], ctorParameters: () => [] });
14796
14796
 
14797
14797
  class ElderCompositeSortDcDirective {
@@ -19520,6 +19520,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.1.4", ngImpor
19520
19520
  }]
19521
19521
  }], ctorParameters: () => [] });
19522
19522
 
19523
+ /**
19524
+ * This directive projects content identified by a placeholder id
19525
+ * into the elder-toolbar at the corresponding ToolbarColumnPosition.
19526
+ */
19523
19527
  class ElderToolbarColumnDirective {
19524
19528
  /***************************************************************************
19525
19529
  * *
@@ -19720,7 +19724,7 @@ class ElderLanguageSwitcherComponent {
19720
19724
  return this.language.isLanguageActive(lang);
19721
19725
  }
19722
19726
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.1.4", ngImport: i0, type: ElderLanguageSwitcherComponent, deps: [{ token: ElderLanguageService }], target: i0.ɵɵFactoryTarget.Component }); }
19723
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.1.4", type: ElderLanguageSwitcherComponent, isStandalone: true, selector: "elder-language-switcher", inputs: { slimMode: "slimMode" }, ngImport: i0, template: "<mat-menu #languageMenu=\"matMenu\">\n <button\n mat-menu-item\n type=\"button\"\n *ngFor=\"let lang of languages\"\n (click)=\"currentLanguage = lang\"\n >\n <mat-icon>language</mat-icon>\n <span class=\"text-body-large\" [class.active]=\"isLanguageActive(lang)\">{{ 'language.' + lang | translate }}</span>\n </button>\n</mat-menu>\n\n<button mat-button type=\"button\" *ngIf=\"slimMode\" [matMenuTriggerFor]=\"languageMenu\">\n <div class=\"layout-row place-start-center\">\n <mat-icon>language</mat-icon>\n <span class=\"language\">{{ currentLanguage }}</span>\n </div>\n</button>\n\n<mat-form-field *ngIf=\"!slimMode\">\n <mat-select\n placeholder=\"{{ 'language.language' | translate }}\"\n name=\"language\"\n [(ngModel)]=\"currentLanguage\"\n >\n <mat-option *ngFor=\"let lang of languages\" [value]=\"lang\">{{\n 'language.' + lang | translate\n }}</mat-option>\n </mat-select>\n</mat-form-field>\n", styles: [".language{font-size:16px;text-transform:uppercase}.active{font-weight:700}\n"], dependencies: [{ kind: "component", type: MatMenu, selector: "mat-menu", inputs: ["backdropClass", "aria-label", "aria-labelledby", "aria-describedby", "xPosition", "yPosition", "overlapTrigger", "hasBackdrop", "class", "classList"], outputs: ["closed", "close"], exportAs: ["matMenu"] }, { kind: "directive", type: NgFor, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "component", type: MatMenuItem, selector: "[mat-menu-item]", inputs: ["role", "disabled", "disableRipple"], exportAs: ["matMenuItem"] }, { kind: "component", type: MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: MatButton, selector: " button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button] ", exportAs: ["matButton"] }, { kind: "directive", type: 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: MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "component", type: MatSelect, selector: "mat-select", inputs: ["aria-describedby", "panelClass", "disabled", "disableRipple", "tabIndex", "hideSingleSelectionIndicator", "placeholder", "required", "multiple", "disableOptionCentering", "compareWith", "value", "aria-label", "aria-labelledby", "errorStateMatcher", "typeaheadDebounceInterval", "sortComparator", "id", "panelWidth", "canSelectNullableOptions"], outputs: ["openedChange", "opened", "closed", "selectionChange", "valueChange"], exportAs: ["matSelect"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i1$2.TranslatePipe, name: "translate" }] }); }
19727
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.1.4", type: ElderLanguageSwitcherComponent, isStandalone: true, selector: "elder-language-switcher", inputs: { slimMode: "slimMode" }, ngImport: i0, template: "<mat-menu #languageMenu=\"matMenu\">\n <button\n mat-menu-item\n type=\"button\"\n *ngFor=\"let lang of languages\"\n (click)=\"currentLanguage = lang\"\n >\n <mat-icon>language</mat-icon>\n <span class=\"text-body-large\" [class.active]=\"isLanguageActive(lang)\">{{\n 'language.' + lang | translate\n }}</span>\n </button>\n</mat-menu>\n\n<button mat-button type=\"button\" *ngIf=\"slimMode\" [matMenuTriggerFor]=\"languageMenu\">\n <div class=\"layout-row place-start-center\">\n <mat-icon>language</mat-icon>\n <span class=\"language\">{{ currentLanguage }}</span>\n </div>\n</button>\n\n<mat-form-field *ngIf=\"!slimMode\">\n <mat-select\n placeholder=\"{{ 'language.language' | translate }}\"\n name=\"language\"\n [(ngModel)]=\"currentLanguage\"\n >\n <mat-option *ngFor=\"let lang of languages\" [value]=\"lang\">{{\n 'language.' + lang | translate\n }}</mat-option>\n </mat-select>\n</mat-form-field>\n", styles: [".language{font-size:16px;text-transform:uppercase}.active{font-weight:700}\n"], dependencies: [{ kind: "component", type: MatMenu, selector: "mat-menu", inputs: ["backdropClass", "aria-label", "aria-labelledby", "aria-describedby", "xPosition", "yPosition", "overlapTrigger", "hasBackdrop", "class", "classList"], outputs: ["closed", "close"], exportAs: ["matMenu"] }, { kind: "directive", type: NgFor, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "component", type: MatMenuItem, selector: "[mat-menu-item]", inputs: ["role", "disabled", "disableRipple"], exportAs: ["matMenuItem"] }, { kind: "component", type: MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: MatButton, selector: " button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button] ", exportAs: ["matButton"] }, { kind: "directive", type: 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: MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "component", type: MatSelect, selector: "mat-select", inputs: ["aria-describedby", "panelClass", "disabled", "disableRipple", "tabIndex", "hideSingleSelectionIndicator", "placeholder", "required", "multiple", "disableOptionCentering", "compareWith", "value", "aria-label", "aria-labelledby", "errorStateMatcher", "typeaheadDebounceInterval", "sortComparator", "id", "panelWidth", "canSelectNullableOptions"], outputs: ["openedChange", "opened", "closed", "selectionChange", "valueChange"], exportAs: ["matSelect"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i1$2.TranslatePipe, name: "translate" }] }); }
19724
19728
  }
19725
19729
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.1.4", ngImport: i0, type: ElderLanguageSwitcherComponent, decorators: [{
19726
19730
  type: Component,
@@ -19737,7 +19741,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.1.4", ngImpor
19737
19741
  FormsModule,
19738
19742
  MatOption,
19739
19743
  TranslateModule,
19740
- ], template: "<mat-menu #languageMenu=\"matMenu\">\n <button\n mat-menu-item\n type=\"button\"\n *ngFor=\"let lang of languages\"\n (click)=\"currentLanguage = lang\"\n >\n <mat-icon>language</mat-icon>\n <span class=\"text-body-large\" [class.active]=\"isLanguageActive(lang)\">{{ 'language.' + lang | translate }}</span>\n </button>\n</mat-menu>\n\n<button mat-button type=\"button\" *ngIf=\"slimMode\" [matMenuTriggerFor]=\"languageMenu\">\n <div class=\"layout-row place-start-center\">\n <mat-icon>language</mat-icon>\n <span class=\"language\">{{ currentLanguage }}</span>\n </div>\n</button>\n\n<mat-form-field *ngIf=\"!slimMode\">\n <mat-select\n placeholder=\"{{ 'language.language' | translate }}\"\n name=\"language\"\n [(ngModel)]=\"currentLanguage\"\n >\n <mat-option *ngFor=\"let lang of languages\" [value]=\"lang\">{{\n 'language.' + lang | translate\n }}</mat-option>\n </mat-select>\n</mat-form-field>\n", styles: [".language{font-size:16px;text-transform:uppercase}.active{font-weight:700}\n"] }]
19744
+ ], template: "<mat-menu #languageMenu=\"matMenu\">\n <button\n mat-menu-item\n type=\"button\"\n *ngFor=\"let lang of languages\"\n (click)=\"currentLanguage = lang\"\n >\n <mat-icon>language</mat-icon>\n <span class=\"text-body-large\" [class.active]=\"isLanguageActive(lang)\">{{\n 'language.' + lang | translate\n }}</span>\n </button>\n</mat-menu>\n\n<button mat-button type=\"button\" *ngIf=\"slimMode\" [matMenuTriggerFor]=\"languageMenu\">\n <div class=\"layout-row place-start-center\">\n <mat-icon>language</mat-icon>\n <span class=\"language\">{{ currentLanguage }}</span>\n </div>\n</button>\n\n<mat-form-field *ngIf=\"!slimMode\">\n <mat-select\n placeholder=\"{{ 'language.language' | translate }}\"\n name=\"language\"\n [(ngModel)]=\"currentLanguage\"\n >\n <mat-option *ngFor=\"let lang of languages\" [value]=\"lang\">{{\n 'language.' + lang | translate\n }}</mat-option>\n </mat-select>\n</mat-form-field>\n", styles: [".language{font-size:16px;text-transform:uppercase}.active{font-weight:700}\n"] }]
19741
19745
  }], ctorParameters: () => [{ type: ElderLanguageService }], propDecorators: { slimMode: [{
19742
19746
  type: Input
19743
19747
  }] } });
@@ -31818,7 +31822,7 @@ class ElderSearchBoxComponent {
31818
31822
  this.searchContextDirective.reset();
31819
31823
  }
31820
31824
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.1.4", ngImport: i0, type: ElderSearchBoxComponent, deps: [{ token: ElderSearchContextDirective }], target: i0.ɵɵFactoryTarget.Component }); }
31821
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.1.4", type: ElderSearchBoxComponent, isStandalone: true, selector: "elder-search-box", inputs: { autoPanel: "autoPanel", name: "name", queryKey: "queryKey", placeholder: "placeholder", label: "label", hint: "hint", autocomplete: "autocomplete", appearance: "appearance", dense: "dense" }, host: { classAttribute: "elder-form-field-host" }, queries: [{ propertyName: "customSearchPanel", first: true, predicate: ElderSearchPanelComponent, descendants: true, isSignal: true }], viewQueries: [{ propertyName: "search", first: true, predicate: ["search"], descendants: true, isSignal: true }, { propertyName: "overlayComponent", first: true, predicate: ElderOverlayComponent, descendants: true, isSignal: true }], exportAs: ["elderSearchBox"], ngImport: i0, template: "<div class=\"layout-row place-stretch-center full flex\">\n <mat-form-field\n [appearance]=\"appearance\"\n class=\"elder-search-box-field flex-auto my-xs\"\n [class]=\"'elder-round-form-field'\"\n subscriptSizing=\"dynamic\"\n [elderDense]=\"dense\"\n >\n <button\n matPrefix\n mat-icon-button\n type=\"button\"\n [elderOverlayTrigger]=\"searchPanel\"\n (click)=\"blurFocus($event)\"\n >\n <mat-icon>search</mat-icon>\n </button>\n\n <input\n matInput\n type=\"text\"\n [name]=\"name\"\n [placeholder]=\"placeholder\"\n #search\n cdkFocusInitial\n ngModel\n elderSearchInput\n [elderSearchInputKey]=\"queryKey\"\n #searchInput=\"elderSearchInput\"\n [autocomplete]=\"autoPanel && customSearchPanel() ? 'off' : autocomplete\"\n [elderOverlayOrigin]=\"searchPanel\"\n [elderOverlayTrigger]=\"searchPanel\"\n [elderOverlayTriggerType]=\"'focus'\"\n [elderOverlayTriggerEnabled]=\"\n autoPanel && customSearchPanel() && (searchInput?.state$ | async)?.pristine\n \"\n />\n\n @if (hint) {\n <mat-hint>{{ hint }}</mat-hint>\n }\n\n <div class=\"layout-row\" matSuffix>\n @if (touchedSearchInputs$ | async; as touchedInputs) {\n @if (touchedInputs.length > 0) {\n <button\n mat-icon-button\n type=\"button\"\n (click)=\"clearSearch($event)\"\n name=\"clear\"\n aria-label=\"Clear\"\n >\n <mat-icon>close</mat-icon>\n </button>\n }\n\n @if (customSearchPanel()) {\n <button\n mat-icon-button\n type=\"button\"\n name=\"openPanel\"\n [elderOverlayTrigger]=\"searchPanel\"\n (click)=\"blurFocus($event)\"\n >\n <mat-icon\n [matBadge]=\"touchedInputs.length\"\n matBadgeSize=\"small\"\n [matBadgeOverlap]=\"true\"\n [matBadgeHidden]=\"touchedInputs.length === 0\"\n matBadgeColor=\"accent\"\n [color]=\"touchedInputs.length > 0 ? 'accent' : undefined\"\n >\n filter_list\n </mat-icon>\n </button>\n }\n }\n </div>\n </mat-form-field>\n</div>\n\n<!-- Overlay Panel for advanced search -->\n<elder-overlay #searchPanel=\"elderOverlay\">\n <elder-dialog-panel class=\"elder-search-panel-container\">\n <!-- Project the users custom search panel here -->\n <ng-content select=\"elder-search-panel\"></ng-content>\n\n <div class=\"layout-row place-between-center\">\n <button mat-stroked-button type=\"button\" name=\"clear\" (click)=\"clearSearch($event)\">\n {{ 'context.reset' | translate }}\n </button>\n\n <button\n mat-flat-button\n type=\"button\"\n name=\"ok\"\n color=\"primary\"\n (click)=\"searchPanel.closeOverlay()\"\n >\n Ok\n </button>\n </div>\n </elder-dialog-panel>\n</elder-overlay>\n", styles: [".elder-search-panel-container{min-width:250px;border-radius:var(--elder-pane-border-radius)}\n"], dependencies: [{ kind: "component", type: MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: ElderFormFieldDenseDirective, selector: "mat-form-field[elderDense]", inputs: ["elderDense", "subscriptSizing", "floatLabel"] }, { kind: "component", type: MatIconButton, selector: "button[mat-icon-button]", exportAs: ["matButton"] }, { kind: "directive", type: MatPrefix, selector: "[matPrefix], [matIconPrefix], [matTextPrefix]", inputs: ["matTextPrefix"] }, { kind: "directive", type: ElderOverlayTriggerDirective, selector: "[elderOverlayTrigger]", inputs: ["elderOverlayTrigger", "elderOverlayTriggerType", "elderOverlayTriggerEnabled"] }, { kind: "component", type: MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "directive", type: 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: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$4.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$4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: ElderSearchInputDirective, selector: "[elderSearchInput]", inputs: ["elderSearchInputTransform", "elderSearchInput", "elderSearchInputFallback", "valueAsId", "elderSearchInputKey"], exportAs: ["elderSearchInput"] }, { kind: "directive", type: ElderOverlayOriginDirective, selector: "[elderOverlayOrigin]", inputs: ["elderOverlayOrigin"] }, { kind: "directive", type: MatHint, selector: "mat-hint", inputs: ["align", "id"] }, { kind: "directive", type: MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "directive", type: MatBadge, selector: "[matBadge]", inputs: ["matBadgeColor", "matBadgeOverlap", "matBadgeDisabled", "matBadgePosition", "matBadge", "matBadgeDescription", "matBadgeSize", "matBadgeHidden"] }, { kind: "component", type: ElderOverlayComponent, selector: "elder-overlay", inputs: ["originX", "originY", "overlayX", "overlayY", "offsetY", "offsetX", "backdrop", "backdropVisible", "origin", "positionStrategy", "overlaySize"], outputs: ["keydownEvents", "attachedChange"], exportAs: ["elderOverlay"] }, { kind: "component", type: ElderDialogPanelComponent, selector: "elder-dialog-panel" }, { kind: "component", type: MatButton, selector: " button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button] ", exportAs: ["matButton"] }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i1$2.TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
31825
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.1.4", type: ElderSearchBoxComponent, isStandalone: true, selector: "elder-search-box", inputs: { autoPanel: "autoPanel", name: "name", queryKey: "queryKey", placeholder: "placeholder", label: "label", hint: "hint", autocomplete: "autocomplete", appearance: "appearance", dense: "dense" }, host: { classAttribute: "elder-form-field-host" }, queries: [{ propertyName: "customSearchPanel", first: true, predicate: ElderSearchPanelComponent, descendants: true, isSignal: true }], viewQueries: [{ propertyName: "search", first: true, predicate: ["search"], descendants: true, isSignal: true }, { propertyName: "overlayComponent", first: true, predicate: ElderOverlayComponent, descendants: true, isSignal: true }], exportAs: ["elderSearchBox"], ngImport: i0, template: "<div class=\"layout-row place-stretch-center full flex\">\n <mat-form-field\n [appearance]=\"appearance\"\n class=\"elder-search-box-field flex-auto my-xs\"\n [class]=\"'elder-round-form-field'\"\n subscriptSizing=\"dynamic\"\n [elderDense]=\"dense\"\n >\n <button\n matPrefix\n mat-icon-button\n type=\"button\"\n [elderOverlayTrigger]=\"searchPanel\"\n (click)=\"blurFocus($event)\"\n >\n <mat-icon>search</mat-icon>\n </button>\n\n <input\n matInput\n type=\"text\"\n [name]=\"name\"\n [placeholder]=\"placeholder\"\n #search\n cdkFocusInitial\n ngModel\n elderSearchInput\n [elderSearchInputKey]=\"queryKey\"\n #searchInput=\"elderSearchInput\"\n [autocomplete]=\"autoPanel && customSearchPanel() ? 'off' : autocomplete\"\n [elderOverlayOrigin]=\"searchPanel\"\n [elderOverlayTrigger]=\"searchPanel\"\n [elderOverlayTriggerType]=\"'focus'\"\n [elderOverlayTriggerEnabled]=\"\n autoPanel && customSearchPanel() && (searchInput?.state$ | async)?.pristine\n \"\n />\n\n @if (hint) {\n <mat-hint>{{ hint }}</mat-hint>\n }\n\n <div class=\"layout-row\" matSuffix>\n @if (touchedSearchInputs$ | async; as touchedInputs) {\n @if (touchedInputs.length > 0) {\n <button\n mat-icon-button\n type=\"button\"\n (click)=\"clearSearch($event)\"\n name=\"clear\"\n aria-label=\"Clear\"\n >\n <mat-icon>close</mat-icon>\n </button>\n }\n\n @if (customSearchPanel()) {\n <button\n mat-icon-button\n type=\"button\"\n name=\"openPanel\"\n [elderOverlayTrigger]=\"searchPanel\"\n (click)=\"blurFocus($event)\"\n >\n <mat-icon\n [matBadge]=\"touchedInputs.length\"\n matBadgeSize=\"small\"\n [matBadgeOverlap]=\"true\"\n [matBadgeHidden]=\"touchedInputs.length === 0\"\n matBadgeColor=\"accent\"\n [color]=\"touchedInputs.length > 0 ? 'accent' : undefined\"\n >\n filter_list\n </mat-icon>\n </button>\n }\n }\n </div>\n </mat-form-field>\n</div>\n\n<!-- Overlay Panel for advanced search -->\n<elder-overlay #searchPanel=\"elderOverlay\">\n <elder-dialog-panel class=\"elder-search-panel-container\">\n <!-- Project the users custom search panel here -->\n <ng-content select=\"elder-search-panel\"></ng-content>\n\n <div class=\"layout-row place-between-center\">\n <button mat-button type=\"button\" name=\"clear\" (click)=\"clearSearch($event)\">\n {{ 'context.reset' | translate }}\n </button>\n\n <button\n mat-flat-button\n type=\"button\"\n name=\"ok\"\n color=\"primary\"\n (click)=\"searchPanel.closeOverlay()\"\n >\n Ok\n </button>\n </div>\n </elder-dialog-panel>\n</elder-overlay>\n", styles: [".elder-search-panel-container{min-width:250px;border-radius:var(--elder-pane-border-radius)}\n"], dependencies: [{ kind: "component", type: MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: ElderFormFieldDenseDirective, selector: "mat-form-field[elderDense]", inputs: ["elderDense", "subscriptSizing", "floatLabel"] }, { kind: "component", type: MatIconButton, selector: "button[mat-icon-button]", exportAs: ["matButton"] }, { kind: "directive", type: MatPrefix, selector: "[matPrefix], [matIconPrefix], [matTextPrefix]", inputs: ["matTextPrefix"] }, { kind: "directive", type: ElderOverlayTriggerDirective, selector: "[elderOverlayTrigger]", inputs: ["elderOverlayTrigger", "elderOverlayTriggerType", "elderOverlayTriggerEnabled"] }, { kind: "component", type: MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "directive", type: 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: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$4.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$4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: ElderSearchInputDirective, selector: "[elderSearchInput]", inputs: ["elderSearchInputTransform", "elderSearchInput", "elderSearchInputFallback", "valueAsId", "elderSearchInputKey"], exportAs: ["elderSearchInput"] }, { kind: "directive", type: ElderOverlayOriginDirective, selector: "[elderOverlayOrigin]", inputs: ["elderOverlayOrigin"] }, { kind: "directive", type: MatHint, selector: "mat-hint", inputs: ["align", "id"] }, { kind: "directive", type: MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "directive", type: MatBadge, selector: "[matBadge]", inputs: ["matBadgeColor", "matBadgeOverlap", "matBadgeDisabled", "matBadgePosition", "matBadge", "matBadgeDescription", "matBadgeSize", "matBadgeHidden"] }, { kind: "component", type: ElderOverlayComponent, selector: "elder-overlay", inputs: ["originX", "originY", "overlayX", "overlayY", "offsetY", "offsetX", "backdrop", "backdropVisible", "origin", "positionStrategy", "overlaySize"], outputs: ["keydownEvents", "attachedChange"], exportAs: ["elderOverlay"] }, { kind: "component", type: ElderDialogPanelComponent, selector: "elder-dialog-panel" }, { kind: "component", type: MatButton, selector: " button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button] ", exportAs: ["matButton"] }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i1$2.TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
31822
31826
  }
31823
31827
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.1.4", ngImport: i0, type: ElderSearchBoxComponent, decorators: [{
31824
31828
  type: Component,
@@ -31842,7 +31846,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.1.4", ngImpor
31842
31846
  MatButton,
31843
31847
  AsyncPipe,
31844
31848
  TranslateModule,
31845
- ], template: "<div class=\"layout-row place-stretch-center full flex\">\n <mat-form-field\n [appearance]=\"appearance\"\n class=\"elder-search-box-field flex-auto my-xs\"\n [class]=\"'elder-round-form-field'\"\n subscriptSizing=\"dynamic\"\n [elderDense]=\"dense\"\n >\n <button\n matPrefix\n mat-icon-button\n type=\"button\"\n [elderOverlayTrigger]=\"searchPanel\"\n (click)=\"blurFocus($event)\"\n >\n <mat-icon>search</mat-icon>\n </button>\n\n <input\n matInput\n type=\"text\"\n [name]=\"name\"\n [placeholder]=\"placeholder\"\n #search\n cdkFocusInitial\n ngModel\n elderSearchInput\n [elderSearchInputKey]=\"queryKey\"\n #searchInput=\"elderSearchInput\"\n [autocomplete]=\"autoPanel && customSearchPanel() ? 'off' : autocomplete\"\n [elderOverlayOrigin]=\"searchPanel\"\n [elderOverlayTrigger]=\"searchPanel\"\n [elderOverlayTriggerType]=\"'focus'\"\n [elderOverlayTriggerEnabled]=\"\n autoPanel && customSearchPanel() && (searchInput?.state$ | async)?.pristine\n \"\n />\n\n @if (hint) {\n <mat-hint>{{ hint }}</mat-hint>\n }\n\n <div class=\"layout-row\" matSuffix>\n @if (touchedSearchInputs$ | async; as touchedInputs) {\n @if (touchedInputs.length > 0) {\n <button\n mat-icon-button\n type=\"button\"\n (click)=\"clearSearch($event)\"\n name=\"clear\"\n aria-label=\"Clear\"\n >\n <mat-icon>close</mat-icon>\n </button>\n }\n\n @if (customSearchPanel()) {\n <button\n mat-icon-button\n type=\"button\"\n name=\"openPanel\"\n [elderOverlayTrigger]=\"searchPanel\"\n (click)=\"blurFocus($event)\"\n >\n <mat-icon\n [matBadge]=\"touchedInputs.length\"\n matBadgeSize=\"small\"\n [matBadgeOverlap]=\"true\"\n [matBadgeHidden]=\"touchedInputs.length === 0\"\n matBadgeColor=\"accent\"\n [color]=\"touchedInputs.length > 0 ? 'accent' : undefined\"\n >\n filter_list\n </mat-icon>\n </button>\n }\n }\n </div>\n </mat-form-field>\n</div>\n\n<!-- Overlay Panel for advanced search -->\n<elder-overlay #searchPanel=\"elderOverlay\">\n <elder-dialog-panel class=\"elder-search-panel-container\">\n <!-- Project the users custom search panel here -->\n <ng-content select=\"elder-search-panel\"></ng-content>\n\n <div class=\"layout-row place-between-center\">\n <button mat-stroked-button type=\"button\" name=\"clear\" (click)=\"clearSearch($event)\">\n {{ 'context.reset' | translate }}\n </button>\n\n <button\n mat-flat-button\n type=\"button\"\n name=\"ok\"\n color=\"primary\"\n (click)=\"searchPanel.closeOverlay()\"\n >\n Ok\n </button>\n </div>\n </elder-dialog-panel>\n</elder-overlay>\n", styles: [".elder-search-panel-container{min-width:250px;border-radius:var(--elder-pane-border-radius)}\n"] }]
31849
+ ], template: "<div class=\"layout-row place-stretch-center full flex\">\n <mat-form-field\n [appearance]=\"appearance\"\n class=\"elder-search-box-field flex-auto my-xs\"\n [class]=\"'elder-round-form-field'\"\n subscriptSizing=\"dynamic\"\n [elderDense]=\"dense\"\n >\n <button\n matPrefix\n mat-icon-button\n type=\"button\"\n [elderOverlayTrigger]=\"searchPanel\"\n (click)=\"blurFocus($event)\"\n >\n <mat-icon>search</mat-icon>\n </button>\n\n <input\n matInput\n type=\"text\"\n [name]=\"name\"\n [placeholder]=\"placeholder\"\n #search\n cdkFocusInitial\n ngModel\n elderSearchInput\n [elderSearchInputKey]=\"queryKey\"\n #searchInput=\"elderSearchInput\"\n [autocomplete]=\"autoPanel && customSearchPanel() ? 'off' : autocomplete\"\n [elderOverlayOrigin]=\"searchPanel\"\n [elderOverlayTrigger]=\"searchPanel\"\n [elderOverlayTriggerType]=\"'focus'\"\n [elderOverlayTriggerEnabled]=\"\n autoPanel && customSearchPanel() && (searchInput?.state$ | async)?.pristine\n \"\n />\n\n @if (hint) {\n <mat-hint>{{ hint }}</mat-hint>\n }\n\n <div class=\"layout-row\" matSuffix>\n @if (touchedSearchInputs$ | async; as touchedInputs) {\n @if (touchedInputs.length > 0) {\n <button\n mat-icon-button\n type=\"button\"\n (click)=\"clearSearch($event)\"\n name=\"clear\"\n aria-label=\"Clear\"\n >\n <mat-icon>close</mat-icon>\n </button>\n }\n\n @if (customSearchPanel()) {\n <button\n mat-icon-button\n type=\"button\"\n name=\"openPanel\"\n [elderOverlayTrigger]=\"searchPanel\"\n (click)=\"blurFocus($event)\"\n >\n <mat-icon\n [matBadge]=\"touchedInputs.length\"\n matBadgeSize=\"small\"\n [matBadgeOverlap]=\"true\"\n [matBadgeHidden]=\"touchedInputs.length === 0\"\n matBadgeColor=\"accent\"\n [color]=\"touchedInputs.length > 0 ? 'accent' : undefined\"\n >\n filter_list\n </mat-icon>\n </button>\n }\n }\n </div>\n </mat-form-field>\n</div>\n\n<!-- Overlay Panel for advanced search -->\n<elder-overlay #searchPanel=\"elderOverlay\">\n <elder-dialog-panel class=\"elder-search-panel-container\">\n <!-- Project the users custom search panel here -->\n <ng-content select=\"elder-search-panel\"></ng-content>\n\n <div class=\"layout-row place-between-center\">\n <button mat-button type=\"button\" name=\"clear\" (click)=\"clearSearch($event)\">\n {{ 'context.reset' | translate }}\n </button>\n\n <button\n mat-flat-button\n type=\"button\"\n name=\"ok\"\n color=\"primary\"\n (click)=\"searchPanel.closeOverlay()\"\n >\n Ok\n </button>\n </div>\n </elder-dialog-panel>\n</elder-overlay>\n", styles: [".elder-search-panel-container{min-width:250px;border-radius:var(--elder-pane-border-radius)}\n"] }]
31846
31850
  }], ctorParameters: () => [{ type: ElderSearchContextDirective }], propDecorators: { autoPanel: [{
31847
31851
  type: Input
31848
31852
  }], name: [{
@@ -33966,11 +33970,11 @@ class ElderButtonGroupComponent {
33966
33970
  constructor() { }
33967
33971
  ngOnInit() { }
33968
33972
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.1.4", ngImport: i0, type: ElderButtonGroupComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
33969
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.1.4", type: ElderButtonGroupComponent, isStandalone: true, selector: "elder-button-group", ngImport: i0, template: "<div class=\"layout-row elder-button-group\">\n <ng-content></ng-content>\n</div>\n", styles: [".elder-button-group button{padding:0 8px;border:var(--elder-border-light)}.elder-button-group button:not(:first-child):not(:last-child){border-radius:0;border-left:0}.elder-button-group button:first-child:not(:last-child){border-radius:var(--elder-border-radius-sm) 0 0 var(--elder-border-radius-sm)}.elder-button-group button:last-child:not(:first-child){border-radius:0 4px 4px 0;border-left:0}.elder-button-group button:last-child:first-child{border-radius:var(--elder-border-radius-sm)}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
33973
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.1.4", type: ElderButtonGroupComponent, isStandalone: true, selector: "elder-button-group", ngImport: i0, template: "<div class=\"layout-row elder-button-group\">\n <ng-content></ng-content>\n</div>\n", styles: [".elder-button-group button{border:var(--elder-border-light);border-width:0!important;min-width:60px!important}.elder-button-group button:not(:first-child):not(:last-child){border-radius:0;border-left:0}.elder-button-group button:first-child:not(:last-child){border-radius:var(--mdc-filled-button-container-shape) 0 0 var(--mdc-filled-button-container-shape);border-right:0}.elder-button-group button:last-child:not(:first-child){border-radius:0 var(--mdc-filled-button-container-shape) var(--mdc-filled-button-container-shape) 0;border-left:0}.elder-button-group button:last-child:first-child{border-radius:var(--mdc-filled-button-container-shape)}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
33970
33974
  }
33971
33975
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.1.4", ngImport: i0, type: ElderButtonGroupComponent, decorators: [{
33972
33976
  type: Component,
33973
- args: [{ selector: 'elder-button-group', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, standalone: true, template: "<div class=\"layout-row elder-button-group\">\n <ng-content></ng-content>\n</div>\n", styles: [".elder-button-group button{padding:0 8px;border:var(--elder-border-light)}.elder-button-group button:not(:first-child):not(:last-child){border-radius:0;border-left:0}.elder-button-group button:first-child:not(:last-child){border-radius:var(--elder-border-radius-sm) 0 0 var(--elder-border-radius-sm)}.elder-button-group button:last-child:not(:first-child){border-radius:0 4px 4px 0;border-left:0}.elder-button-group button:last-child:first-child{border-radius:var(--elder-border-radius-sm)}\n"] }]
33977
+ args: [{ selector: 'elder-button-group', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, standalone: true, template: "<div class=\"layout-row elder-button-group\">\n <ng-content></ng-content>\n</div>\n", styles: [".elder-button-group button{border:var(--elder-border-light);border-width:0!important;min-width:60px!important}.elder-button-group button:not(:first-child):not(:last-child){border-radius:0;border-left:0}.elder-button-group button:first-child:not(:last-child){border-radius:var(--mdc-filled-button-container-shape) 0 0 var(--mdc-filled-button-container-shape);border-right:0}.elder-button-group button:last-child:not(:first-child){border-radius:0 var(--mdc-filled-button-container-shape) var(--mdc-filled-button-container-shape) 0;border-left:0}.elder-button-group button:last-child:first-child{border-radius:var(--mdc-filled-button-container-shape)}\n"] }]
33974
33978
  }], ctorParameters: () => [] });
33975
33979
 
33976
33980
  class ElderUrlFragmentSwitcherComponent {
@@ -34005,6 +34009,8 @@ class ElderUrlFragmentSwitcherComponent {
34005
34009
  **************************************************************************/
34006
34010
  ngOnInit() {
34007
34011
  if (!this.disable) {
34012
+ console.log('URL FRAGMEENTS');
34013
+ console.log(this.urlFragments);
34008
34014
  const urlFragment = this.urlFragments.find((c) => {
34009
34015
  try {
34010
34016
  return c.fragment === this.urlRegex.exec(window.location.href)[this.regexArrayIndex];
@@ -34013,6 +34019,8 @@ class ElderUrlFragmentSwitcherComponent {
34013
34019
  return false;
34014
34020
  }
34015
34021
  });
34022
+ console.log('URL FRAGMENT');
34023
+ console.log(urlFragment);
34016
34024
  if (urlFragment) {
34017
34025
  this.activeUrlFragment$.next(urlFragment);
34018
34026
  }
@@ -34028,7 +34036,7 @@ class ElderUrlFragmentSwitcherComponent {
34028
34036
  window.open(window.location.href.replace(this.urlRegex.exec(window.location.href)[this.regexArrayIndex], urlFragment), this.windowOpenIn);
34029
34037
  }
34030
34038
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.1.4", ngImport: i0, type: ElderUrlFragmentSwitcherComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
34031
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.1.4", type: ElderUrlFragmentSwitcherComponent, isStandalone: true, selector: "elder-url-fragment-switcher", inputs: { disable: "disable", urlFragments: "urlFragments", urlRegex: "urlRegex", regexArrayIndex: "regexArrayIndex", windowOpenIn: "windowOpenIn" }, ngImport: i0, template: "<ng-container *ngIf=\"activeUrlFragment$ | async as activeUrlFragment\">\n <elder-button-group>\n <button\n mat-stroked-button\n type=\"button\"\n disabled\n [ngStyle]=\"{ 'background-color': activeUrlFragment.color }\"\n >\n <div class=\"layout-col\">\n <span *ngIf=\"!disable\" class=\"caption\">{{ activeUrlFragment.name }}</span>\n </div>\n </button>\n\n <button\n mat-stroked-button\n type=\"button\"\n *ngIf=\"!disable\"\n [matMenuTriggerFor]=\"fragmentMenu\"\n [ngStyle]=\"{ 'background-color': activeUrlFragment.color }\"\n >\n <mat-icon>flip_camera_android</mat-icon>\n </button>\n </elder-button-group>\n</ng-container>\n\n<mat-menu #fragmentMenu=\"matMenu\">\n <button\n mat-menu-item\n type=\"button\"\n *ngFor=\"let urlFragment of urlFragments\"\n (click)=\"setActiveUrlFragment(urlFragment.fragment)\"\n >\n <mat-icon [ngStyle]=\"{ color: urlFragment.color }\">flip_camera_android</mat-icon>\n <span>{{ urlFragment.name }}</span>\n </button>\n</mat-menu>\n", styles: [".activeURlFragment{padding-left:6px}.mat-body-strong{line-height:5px;padding-top:10px;padding-bottom:8px;color:#000}.caption{color:#fff}.mat-body-strong-no-caption{line-height:5px;padding-top:15px;padding-bottom:14px;color:#000}\n"], dependencies: [{ kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: ElderButtonGroupComponent, selector: "elder-button-group" }, { kind: "component", type: MatButton, selector: " button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button] ", exportAs: ["matButton"] }, { kind: "directive", type: NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "directive", type: 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: MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: MatMenu, selector: "mat-menu", inputs: ["backdropClass", "aria-label", "aria-labelledby", "aria-describedby", "xPosition", "yPosition", "overlapTrigger", "hasBackdrop", "class", "classList"], outputs: ["closed", "close"], exportAs: ["matMenu"] }, { kind: "directive", type: NgFor, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "component", type: MatMenuItem, selector: "[mat-menu-item]", inputs: ["role", "disabled", "disableRipple"], exportAs: ["matMenuItem"] }, { kind: "pipe", type: AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
34039
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.1.4", type: ElderUrlFragmentSwitcherComponent, isStandalone: true, selector: "elder-url-fragment-switcher", inputs: { disable: "disable", urlFragments: "urlFragments", urlRegex: "urlRegex", regexArrayIndex: "regexArrayIndex", windowOpenIn: "windowOpenIn" }, ngImport: i0, template: "<ng-container *ngIf=\"activeUrlFragment$ | async as activeUrlFragment\">\n <elder-button-group>\n <button\n class=\"status-button\"\n mat-stroked-button\n type=\"button\"\n disabled\n [ngStyle]=\"{ 'background-color': activeUrlFragment.color }\"\n >\n <div class=\"layout-col\">\n <span *ngIf=\"!disable\" class=\"caption\">{{ activeUrlFragment.name }}</span>\n </div>\n </button>\n\n <button\n mat-stroked-button\n type=\"button\"\n *ngIf=\"!disable\"\n [matMenuTriggerFor]=\"fragmentMenu\"\n [ngStyle]=\"{ 'background-color': activeUrlFragment.color }\"\n >\n <mat-icon>flip_camera_android</mat-icon>\n </button>\n </elder-button-group>\n</ng-container>\n\n<mat-menu #fragmentMenu=\"matMenu\">\n <button\n mat-menu-item\n type=\"button\"\n *ngFor=\"let urlFragment of urlFragments\"\n (click)=\"setActiveUrlFragment(urlFragment.fragment)\"\n >\n <mat-icon [ngStyle]=\"{ color: urlFragment.color }\">flip_camera_android</mat-icon>\n <span>{{ urlFragment.name }}</span>\n </button>\n</mat-menu>\n", styles: [".activeURlFragment{padding-left:6px}.mat-body-strong{line-height:5px;padding-top:10px;padding-bottom:8px;color:#000}.caption{color:#fff}.mat-body-strong-no-caption{line-height:5px;padding-top:15px;padding-bottom:14px;color:#000}.status-button.status-button .caption{color:#f5f5f5!important}\n"], dependencies: [{ kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: ElderButtonGroupComponent, selector: "elder-button-group" }, { kind: "component", type: MatButton, selector: " button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button] ", exportAs: ["matButton"] }, { kind: "directive", type: NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "directive", type: 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: MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: MatMenu, selector: "mat-menu", inputs: ["backdropClass", "aria-label", "aria-labelledby", "aria-describedby", "xPosition", "yPosition", "overlapTrigger", "hasBackdrop", "class", "classList"], outputs: ["closed", "close"], exportAs: ["matMenu"] }, { kind: "directive", type: NgFor, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "component", type: MatMenuItem, selector: "[mat-menu-item]", inputs: ["role", "disabled", "disableRipple"], exportAs: ["matMenuItem"] }, { kind: "pipe", type: AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
34032
34040
  }
34033
34041
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.1.4", ngImport: i0, type: ElderUrlFragmentSwitcherComponent, decorators: [{
34034
34042
  type: Component,
@@ -34043,7 +34051,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.1.4", ngImpor
34043
34051
  NgFor,
34044
34052
  MatMenuItem,
34045
34053
  AsyncPipe,
34046
- ], template: "<ng-container *ngIf=\"activeUrlFragment$ | async as activeUrlFragment\">\n <elder-button-group>\n <button\n mat-stroked-button\n type=\"button\"\n disabled\n [ngStyle]=\"{ 'background-color': activeUrlFragment.color }\"\n >\n <div class=\"layout-col\">\n <span *ngIf=\"!disable\" class=\"caption\">{{ activeUrlFragment.name }}</span>\n </div>\n </button>\n\n <button\n mat-stroked-button\n type=\"button\"\n *ngIf=\"!disable\"\n [matMenuTriggerFor]=\"fragmentMenu\"\n [ngStyle]=\"{ 'background-color': activeUrlFragment.color }\"\n >\n <mat-icon>flip_camera_android</mat-icon>\n </button>\n </elder-button-group>\n</ng-container>\n\n<mat-menu #fragmentMenu=\"matMenu\">\n <button\n mat-menu-item\n type=\"button\"\n *ngFor=\"let urlFragment of urlFragments\"\n (click)=\"setActiveUrlFragment(urlFragment.fragment)\"\n >\n <mat-icon [ngStyle]=\"{ color: urlFragment.color }\">flip_camera_android</mat-icon>\n <span>{{ urlFragment.name }}</span>\n </button>\n</mat-menu>\n", styles: [".activeURlFragment{padding-left:6px}.mat-body-strong{line-height:5px;padding-top:10px;padding-bottom:8px;color:#000}.caption{color:#fff}.mat-body-strong-no-caption{line-height:5px;padding-top:15px;padding-bottom:14px;color:#000}\n"] }]
34054
+ ], template: "<ng-container *ngIf=\"activeUrlFragment$ | async as activeUrlFragment\">\n <elder-button-group>\n <button\n class=\"status-button\"\n mat-stroked-button\n type=\"button\"\n disabled\n [ngStyle]=\"{ 'background-color': activeUrlFragment.color }\"\n >\n <div class=\"layout-col\">\n <span *ngIf=\"!disable\" class=\"caption\">{{ activeUrlFragment.name }}</span>\n </div>\n </button>\n\n <button\n mat-stroked-button\n type=\"button\"\n *ngIf=\"!disable\"\n [matMenuTriggerFor]=\"fragmentMenu\"\n [ngStyle]=\"{ 'background-color': activeUrlFragment.color }\"\n >\n <mat-icon>flip_camera_android</mat-icon>\n </button>\n </elder-button-group>\n</ng-container>\n\n<mat-menu #fragmentMenu=\"matMenu\">\n <button\n mat-menu-item\n type=\"button\"\n *ngFor=\"let urlFragment of urlFragments\"\n (click)=\"setActiveUrlFragment(urlFragment.fragment)\"\n >\n <mat-icon [ngStyle]=\"{ color: urlFragment.color }\">flip_camera_android</mat-icon>\n <span>{{ urlFragment.name }}</span>\n </button>\n</mat-menu>\n", styles: [".activeURlFragment{padding-left:6px}.mat-body-strong{line-height:5px;padding-top:10px;padding-bottom:8px;color:#000}.caption{color:#fff}.mat-body-strong-no-caption{line-height:5px;padding-top:15px;padding-bottom:14px;color:#000}.status-button.status-button .caption{color:#f5f5f5!important}\n"] }]
34047
34055
  }], ctorParameters: () => [], propDecorators: { disable: [{
34048
34056
  type: Input
34049
34057
  }], urlFragments: [{