oip-common 0.0.14 → 0.0.16

package/fesm2022/oip-common.mjs

@@ -1,9 +1,10 @@
 import * as i0 from '@angular/core';
 import { Injectable, inject, ChangeDetectorRef, signal, effect, Component, Input, computed, PLATFORM_ID, HostBinding, EventEmitter, Output, ViewChild, Renderer2, Pipe } from '@angular/core';
-import * as i2$3 from 'primeng/api';
+import * as i2$4 from 'primeng/api';
 import { MessageService, ConfirmationService, PrimeIcons, SharedModule } from 'primeng/api';
 import { HttpErrorResponse, HttpClient as HttpClient$1, HttpHeaders } from '@angular/common/http';
-import { TranslateService, TranslatePipe } from '@ngx-translate/core';
+import * as i2$2 from '@ngx-translate/core';
+import { TranslateService, TranslatePipe, TranslateModule } from '@ngx-translate/core';
 import * as i1$3 from '@angular/router';
 import { ActivatedRoute, Router, RouterModule, NavigationEnd, RouterLinkActive, RouterLink } from '@angular/router';
 import { lastValueFrom, BehaviorSubject, Subject, filter as filter$1, combineLatest, of, map as map$1, Observable } from 'rxjs';
@@ -18,7 +19,7 @@ import * as i5 from '@angular/forms';
 import { FormsModule, ReactiveFormsModule } from '@angular/forms';
 import * as i1$2 from '@angular/common';
 import { isPlatformBrowser, CommonModule, NgIf, NgClass, NgFor } from '@angular/common';
-import * as i4 from 'primeng/styleclass';
+import * as i3$1 from 'primeng/styleclass';
 import { StyleClassModule } from 'primeng/styleclass';
 import { updatePreset, updateSurfacePalette, $t } from '@primeng/themes';
 import Aura from '@primeng/themes/aura';
@@ -30,16 +31,16 @@ import { SelectButtonModule } from 'primeng/selectbutton';
 import { OidcSecurityService, PublicEventsService, EventTypes, StsConfigHttpLoader } from 'angular-auth-oidc-client';
 import { filter, map, switchMap, catchError } from 'rxjs/operators';
 import { Tabs, TabList, Tab } from 'primeng/tabs';
-import * as i5$1 from 'primeng/avatar';
+import * as i4 from 'primeng/avatar';
 import { AvatarModule } from 'primeng/avatar';
 import * as i1$4 from 'primeng/contextmenu';
 import { ContextMenuModule, ContextMenu } from 'primeng/contextmenu';
 import * as i2$1 from 'primeng/dialog';
 import { DialogModule } from 'primeng/dialog';
-import * as i3$2 from 'primeng/inputtext';
+import * as i3$3 from 'primeng/inputtext';
 import { InputTextModule } from 'primeng/inputtext';
 import { trigger, state, transition, style, animate } from '@angular/animations';
-import * as i3$1 from 'primeng/ripple';
+import * as i3$2 from 'primeng/ripple';
 import { RippleModule } from 'primeng/ripple';
 import { ConfirmDialog } from 'primeng/confirmdialog';
 import * as i4$1 from 'primeng/select';
@@ -50,7 +51,7 @@ import { ImageModule } from 'primeng/image';
 import { Fluid } from 'primeng/fluid';
 import * as i1$6 from 'primeng/table';
 import { TableModule } from 'primeng/table';
-import * as i2$2 from 'primeng/toggleswitch';
+import * as i2$3 from 'primeng/toggleswitch';
 import { ToggleSwitchModule } from 'primeng/toggleswitch';
 import { TagModule, Tag } from 'primeng/tag';
 import { TextareaModule } from 'primeng/textarea';
@@ -1226,7 +1227,7 @@ class AppConfiguratorComponent {
     static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.2", type: AppConfiguratorComponent, isStandalone: true, selector: "app-configurator", host: { classAttribute: "hidden absolute top-[3.25rem] right-0 w-72 p-4 bg-surface-0 dark:bg-surface-900 border border-surface rounded-border origin-top shadow-[0px_3px_5px_rgba(0,0,0,0.02),0px_0px_2px_rgba(0,0,0,0.05),0px_1px_4px_rgba(0,0,0,0.08)]" }, ngImport: i0, template: `
     <div class="flex flex-col gap-4">
       <div>
-        <span class="text-sm text-muted-color font-semibold">Primary</span>
+        <span class="text-sm text-muted-color font-semibold">{{ 'app-configurator.primary' | translate }}</span>
         <div class="pt-2 flex gap-2 flex-wrap justify-start">
           @for (primaryColor of primaryColors(); track primaryColor.name) {
             <button
@@ -1245,7 +1246,7 @@ class AppConfiguratorComponent {
         </div>
       </div>
       <div>
-        <span class="text-sm text-muted-color font-semibold">Surface</span>
+        <span class="text-sm text-muted-color font-semibold">{{ 'app-configurator.surface' | translate }}</span>
         <div class="pt-2 flex gap-2 flex-wrap justify-start">
           @for (surface of surfaces; track surface.name) {
             <button
@@ -1268,7 +1269,7 @@ class AppConfiguratorComponent {
         </div>
       </div>
       <div class="flex flex-col gap-2">
-        <span class="text-sm text-muted-color font-semibold">Presets</span>
+        <span class="text-sm text-muted-color font-semibold">{{ 'app-configurator.presets' | translate }}</span>
         <p-selectButton
           id="oip-app-configurator-preset-select-button"
           size="small"
@@ -1279,7 +1280,7 @@ class AppConfiguratorComponent {
       </div>
       @if (showMenuModeButton()) {
         <div class="flex flex-col gap-2">
-          <span class="text-sm text-muted-color font-semibold">Menu Mode</span>
+          <span class="text-sm text-muted-color font-semibold">{{ 'app-configurator.menuMode' | translate }}</span>
           <p-selectButton
             id="oip-app-configurator-menu-mode-select-button"
             size="small"
@@ -1290,18 +1291,18 @@ class AppConfiguratorComponent {
         </div>
       }
     </div>
-  `, isInline: true, dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i5.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: SelectButtonModule }, { kind: "component", type: i3.SelectButton, selector: "p-selectButton, p-selectbutton, p-select-button", inputs: ["options", "optionLabel", "optionValue", "optionDisabled", "unselectable", "tabindex", "multiple", "allowEmpty", "styleClass", "ariaLabelledBy", "dataKey", "autofocus", "size", "fluid"], outputs: ["onOptionClick", "onChange"] }] }); }
+  `, isInline: true, dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i5.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: SelectButtonModule }, { kind: "component", type: i3.SelectButton, selector: "p-selectButton, p-selectbutton, p-select-button", inputs: ["options", "optionLabel", "optionValue", "optionDisabled", "unselectable", "tabindex", "multiple", "allowEmpty", "styleClass", "ariaLabelledBy", "dataKey", "autofocus", "size", "fluid"], outputs: ["onOptionClick", "onChange"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.2", ngImport: i0, type: AppConfiguratorComponent, decorators: [{
             type: Component,
             args: [{
                     selector: 'app-configurator',
                     standalone: true,
-                    imports: [CommonModule, FormsModule, SelectButtonModule],
+                    imports: [CommonModule, FormsModule, SelectButtonModule, TranslatePipe],
                     template: `
     <div class="flex flex-col gap-4">
       <div>
-        <span class="text-sm text-muted-color font-semibold">Primary</span>
+        <span class="text-sm text-muted-color font-semibold">{{ 'app-configurator.primary' | translate }}</span>
         <div class="pt-2 flex gap-2 flex-wrap justify-start">
           @for (primaryColor of primaryColors(); track primaryColor.name) {
             <button
@@ -1320,7 +1321,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.2", ngImpor
         </div>
       </div>
       <div>
-        <span class="text-sm text-muted-color font-semibold">Surface</span>
+        <span class="text-sm text-muted-color font-semibold">{{ 'app-configurator.surface' | translate }}</span>
         <div class="pt-2 flex gap-2 flex-wrap justify-start">
           @for (surface of surfaces; track surface.name) {
             <button
@@ -1343,7 +1344,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.2", ngImpor
         </div>
       </div>
       <div class="flex flex-col gap-2">
-        <span class="text-sm text-muted-color font-semibold">Presets</span>
+        <span class="text-sm text-muted-color font-semibold">{{ 'app-configurator.presets' | translate }}</span>
         <p-selectButton
           id="oip-app-configurator-preset-select-button"
           size="small"
@@ -1354,7 +1355,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.2", ngImpor
       </div>
       @if (showMenuModeButton()) {
         <div class="flex flex-col gap-2">
-          <span class="text-sm text-muted-color font-semibold">Menu Mode</span>
+          <span class="text-sm text-muted-color font-semibold">{{ 'app-configurator.menuMode' | translate }}</span>
           <p-selectButton
             id="oip-app-configurator-menu-mode-select-button"
             size="small"
@@ -1595,11 +1596,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.2", ngImpor
         }], ctorParameters: () => [] });
 
 class AppTopbar {
-    constructor(layoutService) {
-        this.layoutService = layoutService;
+    constructor() {
         this.securityService = inject(SecurityService);
         this.topBarService = inject(TopBarService);
         this.userService = inject(UserService);
+        this.layoutService = inject(LayoutService);
     }
     toggleDarkMode() {
         this.layoutService.layoutConfig.update((state) => ({
@@ -1612,7 +1613,7 @@ class AppTopbar {
             this.securityService.logout();
         }
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.2", ngImport: i0, type: AppTopbar, deps: [{ token: LayoutService }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.2", ngImport: i0, type: AppTopbar, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
     static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.2", type: AppTopbar, isStandalone: true, selector: "app-topbar", ngImport: i0, template: `
     <div class="layout-topbar">
       <div class="layout-topbar-logo-container">
@@ -1621,7 +1622,7 @@ class AppTopbar {
         </button>
         <a class="layout-topbar-logo" id="oip-app-topbar-logo-link" routerLink="">
           <logo [height]="36" [width]="36"></logo>
-          <span>OIP</span>
+          <span>{{ 'app-info.title' | translate }}</span>
         </a>
       </div>
 
@@ -1692,7 +1693,7 @@ class AppTopbar {
               (click)="securityService.logout()"
               (keydown)="logoutKeyDown($event)">
               <i class="pi pi-sign-out"></i>
-              <span>Logout</span>
+              <span>{{ 'topbar.logout' | translate }}</span>
             </button>
             <button class="layout-topbar-action" routerLink="config">
               <p-avatar
@@ -1703,16 +1704,19 @@ class AppTopbar {
                 [image]="userService.photoLoaded ? userService.photo : null"
               >{{ !userService.photoLoaded ? userService.shortLabel : null }}
               </p-avatar>
-              <span class="ml-2">Profile</span>
+              <span class="ml-2">{{ 'topbar.profile' | translate }}</span>
             </button>
           </div>
         </div>
       </div>
-    </div>`, isInline: true, styles: [""], dependencies: [{ kind: "ngmodule", type: RouterModule }, { kind: "directive", type: i1$3.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: StyleClassModule }, { kind: "directive", type: i4.StyleClass, selector: "[pStyleClass]", inputs: ["pStyleClass", "enterFromClass", "enterActiveClass", "enterToClass", "leaveFromClass", "leaveActiveClass", "leaveToClass", "hideOnOutsideClick", "toggleClass", "hideOnEscape", "hideOnResize", "resizeSelector"] }, { kind: "component", type: AppConfiguratorComponent, selector: "app-configurator" }, { kind: "component", type: LogoComponent, selector: "logo", inputs: ["width", "height"] }, { kind: "component", type: Tabs, selector: "p-tabs", inputs: ["value", "scrollable", "lazy", "selectOnFocus", "showNavigators", "tabindex"], outputs: ["valueChange"] }, { kind: "component", type: TabList, selector: "p-tablist" }, { kind: "component", type: Tab, selector: "p-tab", inputs: ["value", "disabled"], outputs: ["valueChange"] }, { kind: "ngmodule", type: AvatarModule }, { kind: "component", type: i5$1.Avatar, selector: "p-avatar", inputs: ["label", "icon", "image", "size", "shape", "styleClass", "ariaLabel", "ariaLabelledBy"], outputs: ["onImageError"] }, { kind: "ngmodule", type: ButtonModule }, { kind: "component", type: i1$1.Button, selector: "p-button", inputs: ["type", "iconPos", "icon", "badge", "label", "disabled", "loading", "loadingIcon", "raised", "rounded", "text", "plain", "severity", "outlined", "link", "tabindex", "size", "variant", "style", "styleClass", "badgeClass", "badgeSeverity", "ariaLabel", "buttonProps", "autofocus", "fluid"], outputs: ["onClick", "onFocus", "onBlur"] }] }); }
+    </div>`, isInline: true, dependencies: [{ kind: "ngmodule", type: RouterModule }, { kind: "directive", type: i1$3.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: StyleClassModule }, { kind: "directive", type: i3$1.StyleClass, selector: "[pStyleClass]", inputs: ["pStyleClass", "enterFromClass", "enterActiveClass", "enterToClass", "leaveFromClass", "leaveActiveClass", "leaveToClass", "hideOnOutsideClick", "toggleClass", "hideOnEscape", "hideOnResize", "resizeSelector"] }, { kind: "component", type: AppConfiguratorComponent, selector: "app-configurator" }, { kind: "component", type: LogoComponent, selector: "logo", inputs: ["width", "height"] }, { kind: "component", type: Tabs, selector: "p-tabs", inputs: ["value", "scrollable", "lazy", "selectOnFocus", "showNavigators", "tabindex"], outputs: ["valueChange"] }, { kind: "component", type: TabList, selector: "p-tablist" }, { kind: "component", type: Tab, selector: "p-tab", inputs: ["value", "disabled"], outputs: ["valueChange"] }, { kind: "ngmodule", type: AvatarModule }, { kind: "component", type: i4.Avatar, selector: "p-avatar", inputs: ["label", "icon", "image", "size", "shape", "styleClass", "ariaLabel", "ariaLabelledBy"], outputs: ["onImageError"] }, { kind: "ngmodule", type: ButtonModule }, { kind: "component", type: i1$1.Button, selector: "p-button", inputs: ["type", "iconPos", "icon", "badge", "label", "disabled", "loading", "loadingIcon", "raised", "rounded", "text", "plain", "severity", "outlined", "link", "tabindex", "size", "variant", "style", "styleClass", "badgeClass", "badgeSeverity", "ariaLabel", "buttonProps", "autofocus", "fluid"], outputs: ["onClick", "onFocus", "onBlur"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.2", ngImport: i0, type: AppTopbar, decorators: [{
             type: Component,
-            args: [{ selector: 'app-topbar', standalone: true, imports: [
+            args: [{
+                    selector: 'app-topbar',
+                    standalone: true,
+                    imports: [
                         RouterModule,
                         CommonModule,
                         StyleClassModule,
@@ -1722,8 +1726,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.2", ngImpor
                         TabList,
                         Tab,
                         AvatarModule,
-                        ButtonModule
-                    ], template: `
+                        ButtonModule,
+                        TranslatePipe
+                    ],
+                    template: `
     <div class="layout-topbar">
       <div class="layout-topbar-logo-container">
         <button class="layout-menu-button layout-topbar-action" (click)="layoutService.onMenuToggle()">
@@ -1731,7 +1737,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.2", ngImpor
         </button>
         <a class="layout-topbar-logo" id="oip-app-topbar-logo-link" routerLink="">
           <logo [height]="36" [width]="36"></logo>
-          <span>OIP</span>
+          <span>{{ 'app-info.title' | translate }}</span>
         </a>
       </div>
 
@@ -1802,7 +1808,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.2", ngImpor
               (click)="securityService.logout()"
               (keydown)="logoutKeyDown($event)">
               <i class="pi pi-sign-out"></i>
-              <span>Logout</span>
+              <span>{{ 'topbar.logout' | translate }}</span>
             </button>
             <button class="layout-topbar-action" routerLink="config">
               <p-avatar
@@ -1813,23 +1819,26 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.2", ngImpor
                 [image]="userService.photoLoaded ? userService.photo : null"
               >{{ !userService.photoLoaded ? userService.shortLabel : null }}
               </p-avatar>
-              <span class="ml-2">Profile</span>
+              <span class="ml-2">{{ 'topbar.profile' | translate }}</span>
             </button>
           </div>
         </div>
       </div>
-    </div>` }]
-        }], ctorParameters: () => [{ type: LayoutService }] });
+    </div>`
+                }]
+        }] });
 
 class FooterComponent {
-    constructor() { }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.2", ngImport: i0, type: FooterComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
     static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.2", type: FooterComponent, isStandalone: true, selector: "app-footer", ngImport: i0, template: `
     <div class="layout-footer">
-      <logo class="mr-2" height="18" width="18"></logo>
-      <span class="font-medium">OIP</span>
+      <div class="flex justify-center flex-1">
+        <logo class="mr-2 -my-0.5" [height]="18" [width]="18"></logo>
+        <span class="font-medium">{{ 'app-info.footer' | translate }}</span>
+      </div>
+      <p class="mr-auto">{{ 'app-info.version' | translate }}</p>
     </div>
-  `, isInline: true, dependencies: [{ kind: "component", type: LogoComponent, selector: "logo", inputs: ["width", "height"] }] }); }
+  `, isInline: true, dependencies: [{ kind: "component", type: LogoComponent, selector: "logo", inputs: ["width", "height"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.2", ngImport: i0, type: FooterComponent, decorators: [{
             type: Component,
@@ -1837,14 +1846,17 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.2", ngImpor
                     selector: 'app-footer',
                     template: `
     <div class="layout-footer">
-      <logo class="mr-2" height="18" width="18"></logo>
-      <span class="font-medium">OIP</span>
+      <div class="flex justify-center flex-1">
+        <logo class="mr-2 -my-0.5" [height]="18" [width]="18"></logo>
+        <span class="font-medium">{{ 'app-info.footer' | translate }}</span>
+      </div>
+      <p class="mr-auto">{{ 'app-info.version' | translate }}</p>
     </div>
   `,
                     standalone: true,
-                    imports: [LogoComponent]
+                    imports: [LogoComponent, TranslatePipe]
                 }]
-        }], ctorParameters: () => [] });
+        }] });
 
 /* eslint-disable */
 /* tslint:disable */
@@ -2325,12 +2337,12 @@ class MenuItemComponent {
         });
     }
     editClick(event) {
-        this.menuItemEditDialogComponent.showDialog();
+        this.menuItemEditDialogComponent.showDialog().then();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.2", ngImport: i0, type: MenuItemComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: i1$3.Router }, { token: MenuService }], target: i0.ɵɵFactoryTarget.Component }); }
     static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.2", type: MenuItemComponent, isStandalone: true, selector: "[app-menuitem]", inputs: { item: "item", index: "index", root: "root", parentKey: "parentKey", menuItemCreateDialogComponent: "menuItemCreateDialogComponent", menuItemEditDialogComponent: "menuItemEditDialogComponent", contextMenu: "contextMenu" }, host: { properties: { "class.layout-root-menuitem": "this.root", "class.active-menuitem": "this.activeClass" } }, providers: [ConfirmationService], ngImport: i0, template: `
     <ng-container>
-      <p-confirm-dialog />
+      <p-confirm-dialog/>
       <div
         *ngIf="root && item.visible !== false"
         class="layout-menuitem-root-text"
@@ -2396,7 +2408,7 @@ class MenuItemComponent {
         </ng-template>
       </ul>
     </ng-container>
-  `, isInline: true, dependencies: [{ kind: "component", type: MenuItemComponent, selector: "[app-menuitem]", inputs: ["item", "index", "root", "parentKey", "menuItemCreateDialogComponent", "menuItemEditDialogComponent", "contextMenu"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: RippleModule }, { kind: "directive", type: i3$1.Ripple, selector: "[pRipple]" }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: RouterLinkActive, selector: "[routerLinkActive]", inputs: ["routerLinkActiveOptions", "ariaCurrentWhenActive", "routerLinkActive"], outputs: ["isActiveChange"], exportAs: ["routerLinkActive"] }, { kind: "directive", type: RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "directive", type: NgFor, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "ngmodule", type: ContextMenuModule }, { kind: "component", type: ConfirmDialog, selector: "p-confirmDialog, p-confirmdialog, p-confirm-dialog", inputs: ["header", "icon", "message", "style", "styleClass", "maskStyleClass", "acceptIcon", "acceptLabel", "closeAriaLabel", "acceptAriaLabel", "acceptVisible", "rejectIcon", "rejectLabel", "rejectAriaLabel", "rejectVisible", "acceptButtonStyleClass", "rejectButtonStyleClass", "closeOnEscape", "dismissableMask", "blockScroll", "rtl", "closable", "appendTo", "key", "autoZIndex", "baseZIndex", "transitionOptions", "focusTrap", "defaultFocus", "breakpoints", "visible", "position", "draggable"], outputs: ["onHide"] }], animations: [
+  `, isInline: true, dependencies: [{ kind: "component", type: MenuItemComponent, selector: "[app-menuitem]", inputs: ["item", "index", "root", "parentKey", "menuItemCreateDialogComponent", "menuItemEditDialogComponent", "contextMenu"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: RippleModule }, { kind: "directive", type: i3$2.Ripple, selector: "[pRipple]" }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: RouterLinkActive, selector: "[routerLinkActive]", inputs: ["routerLinkActiveOptions", "ariaCurrentWhenActive", "routerLinkActive"], outputs: ["isActiveChange"], exportAs: ["routerLinkActive"] }, { kind: "directive", type: RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "directive", type: NgFor, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "ngmodule", type: ContextMenuModule }, { kind: "component", type: ConfirmDialog, selector: "p-confirmDialog, p-confirmdialog, p-confirm-dialog", inputs: ["header", "icon", "message", "style", "styleClass", "maskStyleClass", "acceptIcon", "acceptLabel", "closeAriaLabel", "acceptAriaLabel", "acceptVisible", "rejectIcon", "rejectLabel", "rejectAriaLabel", "rejectVisible", "acceptButtonStyleClass", "rejectButtonStyleClass", "closeOnEscape", "dismissableMask", "blockScroll", "rtl", "closable", "appendTo", "key", "autoZIndex", "baseZIndex", "transitionOptions", "focusTrap", "defaultFocus", "breakpoints", "visible", "position", "draggable"], outputs: ["onHide"] }], animations: [
             trigger('children', [
                 state('collapsed', style({
                     height: '0'
@@ -2415,7 +2427,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.2", ngImpor
                     selector: '[app-menuitem]',
                     template: `
     <ng-container>
-      <p-confirm-dialog />
+      <p-confirm-dialog/>
       <div
         *ngIf="root && item.visible !== false"
         class="layout-menuitem-root-text"
@@ -2614,7 +2626,7 @@ class MenuItemCreateDialogComponent {
           (keydown)="save()" />
       </div>
     </p-dialog>
-  `, isInline: true, dependencies: [{ kind: "ngmodule", type: ButtonModule }, { kind: "component", type: i1$1.Button, selector: "p-button", inputs: ["type", "iconPos", "icon", "badge", "label", "disabled", "loading", "loadingIcon", "raised", "rounded", "text", "plain", "severity", "outlined", "link", "tabindex", "size", "variant", "style", "styleClass", "badgeClass", "badgeSeverity", "ariaLabel", "buttonProps", "autofocus", "fluid"], outputs: ["onClick", "onFocus", "onBlur"] }, { kind: "ngmodule", type: DialogModule }, { kind: "component", type: i2$1.Dialog, selector: "p-dialog", inputs: ["header", "draggable", "resizable", "contentStyle", "contentStyleClass", "modal", "closeOnEscape", "dismissableMask", "rtl", "closable", "breakpoints", "styleClass", "maskStyleClass", "maskStyle", "showHeader", "blockScroll", "autoZIndex", "baseZIndex", "minX", "minY", "focusOnShow", "maximizable", "keepInViewport", "focusTrap", "transitionOptions", "closeIcon", "closeAriaLabel", "closeTabindex", "minimizeIcon", "maximizeIcon", "closeButtonProps", "maximizeButtonProps", "visible", "style", "position", "role", "appendTo", "content", "contentTemplate", "footerTemplate", "closeIconTemplate", "maximizeIconTemplate", "minimizeIconTemplate", "headlessTemplate"], outputs: ["onShow", "onHide", "visibleChange", "onResizeInit", "onResizeEnd", "onDragEnd", "onMaximize"] }, { kind: "ngmodule", type: InputTextModule }, { kind: "directive", type: i3$2.InputText, selector: "[pInputText]", inputs: ["pSize", "variant", "fluid", "invalid"] }, { kind: "ngmodule", type: SelectModule }, { kind: "component", type: i4$1.Select, selector: "p-select", inputs: ["id", "scrollHeight", "filter", "panelStyle", "styleClass", "panelStyleClass", "readonly", "editable", "tabindex", "placeholder", "loadingIcon", "filterPlaceholder", "filterLocale", "inputId", "dataKey", "filterBy", "filterFields", "autofocus", "resetFilterOnHide", "checkmark", "dropdownIcon", "loading", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "group", "showClear", "emptyFilterMessage", "emptyMessage", "lazy", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "overlayOptions", "ariaFilterLabel", "ariaLabel", "ariaLabelledBy", "filterMatchMode", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "focusOnHover", "selectOnFocus", "autoOptionFocus", "autofocusFilter", "filterValue", "options", "appendTo"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onShow", "onHide", "onClear", "onLazyLoad"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i5.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: i5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i5.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }] }); }
+  `, isInline: true, dependencies: [{ kind: "ngmodule", type: ButtonModule }, { kind: "component", type: i1$1.Button, selector: "p-button", inputs: ["type", "iconPos", "icon", "badge", "label", "disabled", "loading", "loadingIcon", "raised", "rounded", "text", "plain", "severity", "outlined", "link", "tabindex", "size", "variant", "style", "styleClass", "badgeClass", "badgeSeverity", "ariaLabel", "buttonProps", "autofocus", "fluid"], outputs: ["onClick", "onFocus", "onBlur"] }, { kind: "ngmodule", type: DialogModule }, { kind: "component", type: i2$1.Dialog, selector: "p-dialog", inputs: ["header", "draggable", "resizable", "contentStyle", "contentStyleClass", "modal", "closeOnEscape", "dismissableMask", "rtl", "closable", "breakpoints", "styleClass", "maskStyleClass", "maskStyle", "showHeader", "blockScroll", "autoZIndex", "baseZIndex", "minX", "minY", "focusOnShow", "maximizable", "keepInViewport", "focusTrap", "transitionOptions", "closeIcon", "closeAriaLabel", "closeTabindex", "minimizeIcon", "maximizeIcon", "closeButtonProps", "maximizeButtonProps", "visible", "style", "position", "role", "appendTo", "content", "contentTemplate", "footerTemplate", "closeIconTemplate", "maximizeIconTemplate", "minimizeIconTemplate", "headlessTemplate"], outputs: ["onShow", "onHide", "visibleChange", "onResizeInit", "onResizeEnd", "onDragEnd", "onMaximize"] }, { kind: "ngmodule", type: InputTextModule }, { kind: "directive", type: i3$3.InputText, selector: "[pInputText]", inputs: ["pSize", "variant", "fluid", "invalid"] }, { kind: "ngmodule", type: SelectModule }, { kind: "component", type: i4$1.Select, selector: "p-select", inputs: ["id", "scrollHeight", "filter", "panelStyle", "styleClass", "panelStyleClass", "readonly", "editable", "tabindex", "placeholder", "loadingIcon", "filterPlaceholder", "filterLocale", "inputId", "dataKey", "filterBy", "filterFields", "autofocus", "resetFilterOnHide", "checkmark", "dropdownIcon", "loading", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "group", "showClear", "emptyFilterMessage", "emptyMessage", "lazy", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "overlayOptions", "ariaFilterLabel", "ariaLabel", "ariaLabelledBy", "filterMatchMode", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "focusOnHover", "selectOnFocus", "autoOptionFocus", "autofocusFilter", "filterValue", "options", "appendTo"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onShow", "onHide", "onClear", "onLazyLoad"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i5.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: i5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i5.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.2", ngImport: i0, type: MenuItemCreateDialogComponent, decorators: [{
             type: Component,
@@ -2791,7 +2803,7 @@ class MenuItemEditDialogComponent {
           (keydown)="save()" />
       </div>
     </p-dialog>
-  `, isInline: true, dependencies: [{ kind: "ngmodule", type: ButtonModule }, { kind: "component", type: i1$1.Button, selector: "p-button", inputs: ["type", "iconPos", "icon", "badge", "label", "disabled", "loading", "loadingIcon", "raised", "rounded", "text", "plain", "severity", "outlined", "link", "tabindex", "size", "variant", "style", "styleClass", "badgeClass", "badgeSeverity", "ariaLabel", "buttonProps", "autofocus", "fluid"], outputs: ["onClick", "onFocus", "onBlur"] }, { kind: "ngmodule", type: DialogModule }, { kind: "component", type: i2$1.Dialog, selector: "p-dialog", inputs: ["header", "draggable", "resizable", "contentStyle", "contentStyleClass", "modal", "closeOnEscape", "dismissableMask", "rtl", "closable", "breakpoints", "styleClass", "maskStyleClass", "maskStyle", "showHeader", "blockScroll", "autoZIndex", "baseZIndex", "minX", "minY", "focusOnShow", "maximizable", "keepInViewport", "focusTrap", "transitionOptions", "closeIcon", "closeAriaLabel", "closeTabindex", "minimizeIcon", "maximizeIcon", "closeButtonProps", "maximizeButtonProps", "visible", "style", "position", "role", "appendTo", "content", "contentTemplate", "footerTemplate", "closeIconTemplate", "maximizeIconTemplate", "minimizeIconTemplate", "headlessTemplate"], outputs: ["onShow", "onHide", "visibleChange", "onResizeInit", "onResizeEnd", "onDragEnd", "onMaximize"] }, { kind: "ngmodule", type: InputTextModule }, { kind: "directive", type: i3$2.InputText, selector: "[pInputText]", inputs: ["pSize", "variant", "fluid", "invalid"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i5.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: i5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i5.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: MultiSelectModule }, { kind: "component", type: i1.MultiSelect, selector: "p-multiSelect, p-multiselect, p-multi-select", inputs: ["id", "ariaLabel", "styleClass", "panelStyle", "panelStyleClass", "inputId", "readonly", "group", "filter", "filterPlaceHolder", "filterLocale", "overlayVisible", "tabindex", "dataKey", "ariaLabelledBy", "displaySelectedLabel", "maxSelectedLabels", "selectionLimit", "selectedItemsLabel", "showToggleAll", "emptyFilterMessage", "emptyMessage", "resetFilterOnHide", "dropdownIcon", "chipIcon", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "showHeader", "filterBy", "scrollHeight", "lazy", "virtualScroll", "loading", "virtualScrollItemSize", "loadingIcon", "virtualScrollOptions", "overlayOptions", "ariaFilterLabel", "filterMatchMode", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "autofocusFilter", "display", "autocomplete", "showClear", "autofocus", "placeholder", "options", "filterValue", "selectAll", "focusOnHover", "filterFields", "selectOnFocus", "autoOptionFocus", "highlightOnSelect", "size", "variant", "fluid", "appendTo"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onClear", "onPanelShow", "onPanelHide", "onLazyLoad", "onRemove", "onSelectAllChange"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }] }); }
+  `, isInline: true, dependencies: [{ kind: "ngmodule", type: ButtonModule }, { kind: "component", type: i1$1.Button, selector: "p-button", inputs: ["type", "iconPos", "icon", "badge", "label", "disabled", "loading", "loadingIcon", "raised", "rounded", "text", "plain", "severity", "outlined", "link", "tabindex", "size", "variant", "style", "styleClass", "badgeClass", "badgeSeverity", "ariaLabel", "buttonProps", "autofocus", "fluid"], outputs: ["onClick", "onFocus", "onBlur"] }, { kind: "ngmodule", type: DialogModule }, { kind: "component", type: i2$1.Dialog, selector: "p-dialog", inputs: ["header", "draggable", "resizable", "contentStyle", "contentStyleClass", "modal", "closeOnEscape", "dismissableMask", "rtl", "closable", "breakpoints", "styleClass", "maskStyleClass", "maskStyle", "showHeader", "blockScroll", "autoZIndex", "baseZIndex", "minX", "minY", "focusOnShow", "maximizable", "keepInViewport", "focusTrap", "transitionOptions", "closeIcon", "closeAriaLabel", "closeTabindex", "minimizeIcon", "maximizeIcon", "closeButtonProps", "maximizeButtonProps", "visible", "style", "position", "role", "appendTo", "content", "contentTemplate", "footerTemplate", "closeIconTemplate", "maximizeIconTemplate", "minimizeIconTemplate", "headlessTemplate"], outputs: ["onShow", "onHide", "visibleChange", "onResizeInit", "onResizeEnd", "onDragEnd", "onMaximize"] }, { kind: "ngmodule", type: InputTextModule }, { kind: "directive", type: i3$3.InputText, selector: "[pInputText]", inputs: ["pSize", "variant", "fluid", "invalid"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i5.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: i5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i5.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: MultiSelectModule }, { kind: "component", type: i1.MultiSelect, selector: "p-multiSelect, p-multiselect, p-multi-select", inputs: ["id", "ariaLabel", "styleClass", "panelStyle", "panelStyleClass", "inputId", "readonly", "group", "filter", "filterPlaceHolder", "filterLocale", "overlayVisible", "tabindex", "dataKey", "ariaLabelledBy", "displaySelectedLabel", "maxSelectedLabels", "selectionLimit", "selectedItemsLabel", "showToggleAll", "emptyFilterMessage", "emptyMessage", "resetFilterOnHide", "dropdownIcon", "chipIcon", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "showHeader", "filterBy", "scrollHeight", "lazy", "virtualScroll", "loading", "virtualScrollItemSize", "loadingIcon", "virtualScrollOptions", "overlayOptions", "ariaFilterLabel", "filterMatchMode", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "autofocusFilter", "display", "autocomplete", "showClear", "autofocus", "placeholder", "options", "filterValue", "selectAll", "focusOnHover", "filterFields", "selectOnFocus", "autoOptionFocus", "highlightOnSelect", "size", "variant", "fluid", "appendTo"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onClear", "onPanelShow", "onPanelHide", "onLazyLoad", "onRemove", "onSelectAllChange"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.2", ngImport: i0, type: MenuItemEditDialogComponent, decorators: [{
             type: Component,
@@ -2884,7 +2896,8 @@ class MenuComponent {
         ];
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.2", ngImport: i0, type: MenuComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.2", type: MenuComponent, isStandalone: true, selector: "app-menu", providers: [Menu], viewQueries: [{ propertyName: "menuItemCreateDialogComponent", first: true, predicate: MenuItemCreateDialogComponent, descendants: true }, { propertyName: "menuItemEditDialogComponent", first: true, predicate: MenuItemEditDialogComponent, descendants: true }, { propertyName: "contextMenu", first: true, predicate: ContextMenu, descendants: true }], ngImport: i0, template: ` <div #empty class="layout-sidebar" (contextmenu)="onContextMenu($event)">
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.2", type: MenuComponent, isStandalone: true, selector: "app-menu", providers: [Menu], viewQueries: [{ propertyName: "menuItemCreateDialogComponent", first: true, predicate: MenuItemCreateDialogComponent, descendants: true }, { propertyName: "menuItemEditDialogComponent", first: true, predicate: MenuItemEditDialogComponent, descendants: true }, { propertyName: "contextMenu", first: true, predicate: ContextMenu, descendants: true }], ngImport: i0, template: `
+    <div #empty class="layout-sidebar" (contextmenu)="onContextMenu($event)">
       <ul class="layout-menu">
         @for (item of menuService.menu; track item; let i = $index) {
           <ng-container>
@@ -2904,10 +2917,10 @@ class MenuComponent {
         }
       </ul>
     </div>
-    <p-contextMenu [target]="empty" />
+    <p-contextMenu [target]="empty"/>
     @if (securityService.isAdmin) {
-      <menu-item-create-dialog />
-      <menu-item-edit-dialog />
+      <menu-item-create-dialog/>
+      <menu-item-edit-dialog/>
     }`, isInline: true, dependencies: [{ kind: "component", type: MenuItemComponent, selector: "[app-menuitem]", inputs: ["item", "index", "root", "parentKey", "menuItemCreateDialogComponent", "menuItemEditDialogComponent", "contextMenu"] }, { kind: "ngmodule", type: ButtonModule }, { kind: "ngmodule", type: ContextMenuModule }, { kind: "component", type: i1$4.ContextMenu, selector: "p-contextMenu, p-contextmenu, p-context-menu", inputs: ["model", "triggerEvent", "target", "global", "style", "styleClass", "autoZIndex", "baseZIndex", "id", "breakpoint", "ariaLabel", "ariaLabelledBy", "pressDelay", "appendTo"], outputs: ["onShow", "onHide"] }, { kind: "ngmodule", type: DialogModule }, { kind: "ngmodule", type: InputTextModule }, { kind: "component", type: MenuItemCreateDialogComponent, selector: "menu-item-create-dialog", inputs: ["visible"], outputs: ["visibleChange"] }, { kind: "ngmodule", type: FormsModule }, { kind: "component", type: MenuItemEditDialogComponent, selector: "menu-item-edit-dialog", inputs: ["visible"], outputs: ["visibleChange"] }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.2", ngImport: i0, type: MenuComponent, decorators: [{
@@ -2926,7 +2939,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.2", ngImpor
                     providers: [Menu],
                     selector: 'app-menu',
                     standalone: true,
-                    template: ` <div #empty class="layout-sidebar" (contextmenu)="onContextMenu($event)">
+                    template: `
+    <div #empty class="layout-sidebar" (contextmenu)="onContextMenu($event)">
       <ul class="layout-menu">
         @for (item of menuService.menu; track item; let i = $index) {
           <ng-container>
@@ -2946,10 +2960,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.2", ngImpor
         }
       </ul>
     </div>
-    <p-contextMenu [target]="empty" />
+    <p-contextMenu [target]="empty"/>
     @if (securityService.isAdmin) {
-      <menu-item-create-dialog />
-      <menu-item-edit-dialog />
+      <menu-item-create-dialog/>
+      <menu-item-edit-dialog/>
     }`
                 }]
         }], propDecorators: { menuItemCreateDialogComponent: [{
@@ -3135,7 +3149,7 @@ class AppFloatingConfiguratorComponent {
         <app-configurator />
       </div>
     </div>
-  `, isInline: true, dependencies: [{ kind: "ngmodule", type: ButtonModule }, { kind: "component", type: i1$1.Button, selector: "p-button", inputs: ["type", "iconPos", "icon", "badge", "label", "disabled", "loading", "loadingIcon", "raised", "rounded", "text", "plain", "severity", "outlined", "link", "tabindex", "size", "variant", "style", "styleClass", "badgeClass", "badgeSeverity", "ariaLabel", "buttonProps", "autofocus", "fluid"], outputs: ["onClick", "onFocus", "onBlur"] }, { kind: "ngmodule", type: StyleClassModule }, { kind: "directive", type: i4.StyleClass, selector: "[pStyleClass]", inputs: ["pStyleClass", "enterFromClass", "enterActiveClass", "enterToClass", "leaveFromClass", "leaveActiveClass", "leaveToClass", "hideOnOutsideClick", "toggleClass", "hideOnEscape", "hideOnResize", "resizeSelector"] }, { kind: "component", type: AppConfiguratorComponent, selector: "app-configurator" }] }); }
+  `, isInline: true, dependencies: [{ kind: "ngmodule", type: ButtonModule }, { kind: "component", type: i1$1.Button, selector: "p-button", inputs: ["type", "iconPos", "icon", "badge", "label", "disabled", "loading", "loadingIcon", "raised", "rounded", "text", "plain", "severity", "outlined", "link", "tabindex", "size", "variant", "style", "styleClass", "badgeClass", "badgeSeverity", "ariaLabel", "buttonProps", "autofocus", "fluid"], outputs: ["onClick", "onFocus", "onBlur"] }, { kind: "ngmodule", type: StyleClassModule }, { kind: "directive", type: i3$1.StyleClass, selector: "[pStyleClass]", inputs: ["pStyleClass", "enterFromClass", "enterActiveClass", "enterToClass", "leaveFromClass", "leaveActiveClass", "leaveToClass", "hideOnOutsideClick", "toggleClass", "hideOnEscape", "hideOnResize", "resizeSelector"] }, { kind: "component", type: AppConfiguratorComponent, selector: "app-configurator" }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.2", ngImport: i0, type: AppFloatingConfiguratorComponent, decorators: [{
             type: Component,
@@ -3170,9 +3184,96 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.2", ngImpor
                 }]
         }] });
 
+/**
+ * Service for managing translation loading in the application
+ */
+class L10nService {
+    constructor() {
+        this.loadedTranslations = new Set();
+        this.httpClient = inject(HttpClient$1);
+        this.translateService = inject(TranslateService);
+        this.primeNg = inject(PrimeNG);
+        this.layoutService = inject(LayoutService);
+    }
+    /**
+     * Loads translations for a specific component
+     * @param component - Name of the component to load translations for
+     */
+    loadComponentTranslations(component) {
+        const lang = this.translateService.currentLang;
+        this.loadTranslations(component, lang);
+    }
+    /**
+     * Gets the translated value of a key (or an array of keys)
+     * @returns the translated key, or an object of translated keys
+     */
+    get(key) {
+        this.loadComponentTranslations(key.split('.')[0]);
+        return this.translateService.get(key);
+    }
+    /**
+     * Internal method to load translations from JSON files
+     * @param component - Component or translation namespace
+     * @param lang - Language code to load translations for
+     */
+    loadTranslations(component, lang) {
+        // Create unique key for this component-language combination
+        const key = `${component}.${lang}`;
+        // Skip if translations are already loaded
+        if (this.loadedTranslations.has(key)) {
+            return;
+        }
+        try {
+            // Load translation file from assets
+            this.httpClient.get(`./assets/i18n/${component}.${lang}.json`).subscribe((translations) => {
+                // Get existing translations for the language
+                const current = this.translateService.translations[lang] || {};
+                // Merge new translations with existing ones
+                this.translateService.setTranslation(lang, { ...current, ...translations }, true);
+                // Mark these translations as loaded
+                this.loadedTranslations.add(key);
+            });
+        }
+        catch (e) {
+            console.warn(`No translations found for ${component}.${lang}.json`);
+            console.error(e);
+        }
+    }
+    /**
+     * Changes the lang currently used
+     */
+    use(selectedLanguage, key = null) {
+        if (key) {
+            this.get(key);
+        }
+        this.translateService.use(selectedLanguage);
+    }
+    init(langs) {
+        this.translateService.addLangs(langs);
+        const lang = /en|ru/.exec(this.layoutService.language()) ? this.layoutService.language() : 'en';
+        this.translateService.setDefaultLang(lang);
+        this.translateService.use(lang);
+        this.loadComponentTranslations('app-info');
+        this.translateService.get('primeng').subscribe((res) => this.primeNg.setTranslation(res));
+    }
+    instant(key, interpolateParams) {
+        return this.translateService.instant(key, interpolateParams);
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.2", ngImport: i0, type: L10nService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.2", ngImport: i0, type: L10nService, providedIn: 'root' }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.2", ngImport: i0, type: L10nService, decorators: [{
+            type: Injectable,
+            args: [{ providedIn: 'root' }]
+        }] });
+
 class NotfoundComponent {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.2", ngImport: i0, type: NotfoundComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.2", type: NotfoundComponent, isStandalone: true, selector: "app-notfound", ngImport: i0, template: ` <app-floating-configurator />
+    constructor(l10nService) {
+        l10nService.get('notfound');
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.2", ngImport: i0, type: NotfoundComponent, deps: [{ token: L10nService }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.2", type: NotfoundComponent, isStandalone: true, selector: "app-notfound", ngImport: i0, template: `
+    <app-floating-configurator/>
     <div class="flex items-center justify-center min-h-screen overflow-hidden">
       <div class="flex flex-col items-center justify-center">
         <div
@@ -3181,22 +3282,23 @@ class NotfoundComponent {
             class="w-full bg-surface-0 dark:bg-surface-900 py-20 px-8 sm:px-20 flex flex-col items-center"
             style="border-radius: 53px">
             <div class="flex flex-col items-center justify-center">
-              <logo height="96" width="96"></logo>
+              <logo [height]="96" [width]="96"></logo>
             </div>
-            <span class="text-primary font-bold text-3xl">404</span>
-            <h1 class="text-surface-900 dark:text-surface-0 font-bold text-3xl lg:text-5xl mb-2">Not Found</h1>
-            <div class="text-surface-600 dark:text-surface-200 mb-8">Requested resource is not available.</div>
-            <p-button id="oip-app-notfound-go-to-home-button" label="Go to home" routerLink="/" />
+            <span class="text-primary font-bold text-3xl">{{ 'notfound.errorCode' | translate }}</span>
+            <h1 class="text-surface-900 dark:text-surface-0 font-bold text-3xl lg:text-5xl mb-2">{{ 'notfound.title' | translate }}</h1>
+            <div class="text-surface-600 dark:text-surface-200 mb-8">{{ 'notfound.description' | translate }}</div>
+            <p-button id="oip-app-notfound-go-to-home-button" [label]="'notfound.button' | translate" routerLink="/"/>
           </div>
         </div>
       </div>
-    </div>`, isInline: true, dependencies: [{ kind: "directive", type: RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "component", type: LogoComponent, selector: "logo", inputs: ["width", "height"] }, { kind: "component", type: Button, selector: "p-button", inputs: ["type", "iconPos", "icon", "badge", "label", "disabled", "loading", "loadingIcon", "raised", "rounded", "text", "plain", "severity", "outlined", "link", "tabindex", "size", "variant", "style", "styleClass", "badgeClass", "badgeSeverity", "ariaLabel", "buttonProps", "autofocus", "fluid"], outputs: ["onClick", "onFocus", "onBlur"] }, { kind: "component", type: AppFloatingConfiguratorComponent, selector: "app-floating-configurator" }] }); }
+    </div>`, isInline: true, dependencies: [{ kind: "directive", type: RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "component", type: LogoComponent, selector: "logo", inputs: ["width", "height"] }, { kind: "component", type: Button, selector: "p-button", inputs: ["type", "iconPos", "icon", "badge", "label", "disabled", "loading", "loadingIcon", "raised", "rounded", "text", "plain", "severity", "outlined", "link", "tabindex", "size", "variant", "style", "styleClass", "badgeClass", "badgeSeverity", "ariaLabel", "buttonProps", "autofocus", "fluid"], outputs: ["onClick", "onFocus", "onBlur"] }, { kind: "component", type: AppFloatingConfiguratorComponent, selector: "app-floating-configurator" }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i2$2.TranslatePipe, name: "translate" }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.2", ngImport: i0, type: NotfoundComponent, decorators: [{
             type: Component,
             args: [{
                     selector: 'app-notfound',
-                    template: ` <app-floating-configurator />
+                    template: `
+    <app-floating-configurator/>
     <div class="flex items-center justify-center min-h-screen overflow-hidden">
       <div class="flex flex-col items-center justify-center">
         <div
@@ -3205,20 +3307,20 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.2", ngImpor
             class="w-full bg-surface-0 dark:bg-surface-900 py-20 px-8 sm:px-20 flex flex-col items-center"
             style="border-radius: 53px">
             <div class="flex flex-col items-center justify-center">
-              <logo height="96" width="96"></logo>
+              <logo [height]="96" [width]="96"></logo>
             </div>
-            <span class="text-primary font-bold text-3xl">404</span>
-            <h1 class="text-surface-900 dark:text-surface-0 font-bold text-3xl lg:text-5xl mb-2">Not Found</h1>
-            <div class="text-surface-600 dark:text-surface-200 mb-8">Requested resource is not available.</div>
-            <p-button id="oip-app-notfound-go-to-home-button" label="Go to home" routerLink="/" />
+            <span class="text-primary font-bold text-3xl">{{ 'notfound.errorCode' | translate }}</span>
+            <h1 class="text-surface-900 dark:text-surface-0 font-bold text-3xl lg:text-5xl mb-2">{{ 'notfound.title' | translate }}</h1>
+            <div class="text-surface-600 dark:text-surface-200 mb-8">{{ 'notfound.description' | translate }}</div>
+            <p-button id="oip-app-notfound-go-to-home-button" [label]="'notfound.button' | translate" routerLink="/"/>
           </div>
         </div>
       </div>
     </div>`,
-                    imports: [RouterLink, LogoComponent, Button, AppFloatingConfiguratorComponent],
+                    imports: [RouterLink, LogoComponent, Button, AppFloatingConfiguratorComponent, TranslateModule],
                     standalone: true
                 }]
-        }] });
+        }], ctorParameters: () => [{ type: L10nService }] });
 
 class UnauthorizedComponent {
     constructor() {
@@ -3330,7 +3432,7 @@ class ErrorComponent {
         </div>
       </div>
     </div>
-  </div>`, isInline: true, dependencies: [{ kind: "ngmodule", type: ButtonModule }, { kind: "directive", type: i1$1.ButtonDirective, selector: "[pButton]", inputs: ["iconPos", "loadingIcon", "loading", "severity", "raised", "rounded", "text", "outlined", "size", "plain", "fluid", "label", "icon", "buttonProps"] }, { kind: "ngmodule", type: RippleModule }, { kind: "directive", type: i3$1.Ripple, selector: "[pRipple]" }, { kind: "directive", type: RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }] }); }
+  </div>`, isInline: true, dependencies: [{ kind: "ngmodule", type: ButtonModule }, { kind: "directive", type: i1$1.ButtonDirective, selector: "[pButton]", inputs: ["iconPos", "loadingIcon", "loading", "severity", "raised", "rounded", "text", "outlined", "size", "plain", "fluid", "label", "icon", "buttonProps"] }, { kind: "ngmodule", type: RippleModule }, { kind: "directive", type: i3$2.Ripple, selector: "[pRipple]" }, { kind: "directive", type: RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.2", ngImport: i0, type: ErrorComponent, decorators: [{
             type: Component,
@@ -3403,7 +3505,7 @@ class ProfileComponent {
         [auto]="true"
         (onUpload)="onBasicUploadAuto($event)" />
     </div>
-  `, isInline: true, dependencies: [{ kind: "ngmodule", type: FileUploadModule }, { kind: "component", type: i1$5.FileUpload, selector: "p-fileupload, p-fileUpload", inputs: ["name", "url", "method", "multiple", "accept", "disabled", "auto", "withCredentials", "maxFileSize", "invalidFileSizeMessageSummary", "invalidFileSizeMessageDetail", "invalidFileTypeMessageSummary", "invalidFileTypeMessageDetail", "invalidFileLimitMessageDetail", "invalidFileLimitMessageSummary", "style", "styleClass", "previewWidth", "chooseLabel", "uploadLabel", "cancelLabel", "chooseIcon", "uploadIcon", "cancelIcon", "showUploadButton", "showCancelButton", "mode", "headers", "customUpload", "fileLimit", "uploadStyleClass", "cancelStyleClass", "removeStyleClass", "chooseStyleClass", "chooseButtonProps", "uploadButtonProps", "cancelButtonProps", "files"], outputs: ["onBeforeUpload", "onSend", "onUpload", "onError", "onClear", "onRemove", "onSelect", "onProgress", "uploadHandler", "onImageError", "onRemoveUploadedFile"] }, { kind: "ngmodule", type: ImageModule }, { kind: "ngmodule", type: AvatarModule }, { kind: "component", type: i5$1.Avatar, selector: "p-avatar", inputs: ["label", "icon", "image", "size", "shape", "styleClass", "ariaLabel", "ariaLabelledBy"], outputs: ["onImageError"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }] }); }
+  `, isInline: true, dependencies: [{ kind: "ngmodule", type: FileUploadModule }, { kind: "component", type: i1$5.FileUpload, selector: "p-fileupload, p-fileUpload", inputs: ["name", "url", "method", "multiple", "accept", "disabled", "auto", "withCredentials", "maxFileSize", "invalidFileSizeMessageSummary", "invalidFileSizeMessageDetail", "invalidFileTypeMessageSummary", "invalidFileTypeMessageDetail", "invalidFileLimitMessageDetail", "invalidFileLimitMessageSummary", "style", "styleClass", "previewWidth", "chooseLabel", "uploadLabel", "cancelLabel", "chooseIcon", "uploadIcon", "cancelIcon", "showUploadButton", "showCancelButton", "mode", "headers", "customUpload", "fileLimit", "uploadStyleClass", "cancelStyleClass", "removeStyleClass", "chooseStyleClass", "chooseButtonProps", "uploadButtonProps", "cancelButtonProps", "files"], outputs: ["onBeforeUpload", "onSend", "onUpload", "onError", "onClear", "onRemove", "onSelect", "onProgress", "uploadHandler", "onImageError", "onRemoveUploadedFile"] }, { kind: "ngmodule", type: ImageModule }, { kind: "ngmodule", type: AvatarModule }, { kind: "component", type: i4.Avatar, selector: "p-avatar", inputs: ["label", "icon", "image", "size", "shape", "styleClass", "ariaLabel", "ariaLabelledBy"], outputs: ["onImageError"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.2", ngImport: i0, type: ProfileComponent, decorators: [{
             type: Component,
@@ -3436,72 +3538,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.2", ngImpor
                 }]
         }] });
 
-/**
- * Service for managing translation loading in the application
- */
-class L10nService {
-    constructor() {
-        this.loadedTranslations = new Set();
-        this.httpClient = inject(HttpClient$1);
-        this.translateService = inject(TranslateService);
-    }
-    /**
-     * Loads translations for a specific component
-     * @param component - Name of the component to load translations for
-     */
-    async loadComponentTranslations(component) {
-        const lang = this.translateService.currentLang;
-        await this.loadTranslations(component, lang);
-    }
-    /**
-     * Gets the translated value of a key (or an array of keys)
-     * @returns the translated key, or an object of translated keys
-     */
-    async get(key) {
-        await this.loadComponentTranslations(key);
-        return this.translateService.get(key);
-    }
-    /**
-     * Internal method to load translations from JSON files
-     * @param component - Component or translation namespace
-     * @param lang - Language code to load translations for
-     */
-    async loadTranslations(component, lang) {
-        // Create unique key for this component-language combination
-        const key = `${component}.${lang}`;
-        // Skip if translations are already loaded
-        if (this.loadedTranslations.has(key)) {
-            return;
-        }
-        try {
-            // Load translation file from assets
-            const translations = await lastValueFrom(this.httpClient.get(`./assets/i18n/${component}.${lang}.json`));
-            // Get existing translations for the language
-            const current = this.translateService.translations[lang] || {};
-            // Merge new translations with existing ones
-            this.translateService.setTranslation(lang, { ...current, ...translations }, true);
-            // Mark these translations as loaded
-            this.loadedTranslations.add(key);
-        }
-        catch (e) {
-            console.warn(`No translations found for ${component}.${lang}.json`);
-            console.error(e);
-        }
-    }
-    /**
-     * Changes the lang currently used
-     */
-    use(selectedLanguage) {
-        this.translateService.use(selectedLanguage);
-    }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.2", ngImport: i0, type: L10nService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
-    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.2", ngImport: i0, type: L10nService, providedIn: 'root' }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.2", ngImport: i0, type: L10nService, decorators: [{
-            type: Injectable,
-            args: [{ providedIn: 'root' }]
-        }] });
-
 class ConfigComponent {
     constructor() {
         this.layoutService = inject(LayoutService);
@@ -3514,12 +3550,10 @@ class ConfigComponent {
             { value: 'en', label: 'English' },
             { value: 'ru', label: 'Русский' }
         ];
+        this.l10nService.loadComponentTranslations('config');
         this.selectedLanguage = this.layoutService.language();
     }
     async ngOnInit() {
-        (await this.l10nService.get('config')).subscribe((l10n) => {
-            this.l10n = l10n;
-        });
     }
     /**
      * Changes the application's language.
@@ -3530,7 +3564,7 @@ class ConfigComponent {
             ...config,
             language: this.selectedLanguage
         }));
-        this.l10nService.use(this.selectedLanguage);
+        this.l10nService.use(this.selectedLanguage, 'config');
     }
     async onSwitchChange() {
         await this.menuService.loadMenu();
@@ -3541,15 +3575,15 @@ class ConfigComponent {
       <div class="flex flex-col md:flex-row gap-4">
         <div class="md:w-1/2">
           <div class="card flex flex-col gap-4">
-            <div class="font-semibold text-xl">{{ l10n.profile }}</div>
+            <div class="font-semibold text-xl">{{ 'config.profile' | translate }}</div>
             <div class="flex justify-content-end flex-wrap">
               {{ userService.userName }}
             </div>
             <label>
-              {{ l10n.photo }}
+              {{ 'config.photo' | translate }}
               <span
                 class="pi pi-question-circle"
-                pTooltip="{{ l10n.usePhoto256x256Pixel }}"
+                pTooltip="{{ 'config.usePhoto256x256Pixel' | translate }}"
                 tooltipPosition="right"></span>
             </label>
             <div class="flex justify-content-end flex-wrap">
@@ -3559,8 +3593,8 @@ class ConfigComponent {
         </div>
         <div class="md:w-1/2">
           <div class="card flex flex-col gap-4">
-            <div class="font-semibold text-xl">{{ l10n.localization }}</div>
-            <label> {{ l10n.selectLanguage }} </label>
+            <div class="font-semibold text-xl">{{ 'config.localization' | translate }}</div>
+            <label> {{ 'config.selectLanguage' | translate }} </label>
             <div class="flex justify-content-end flex-wrap">
               <p-select
                 class="w-full md:w-56"
@@ -3569,31 +3603,31 @@ class ConfigComponent {
                 optionValue="value"
                 [options]="languages"
                 [(ngModel)]="selectedLanguage"
-                (onChange)="changeLanguage()" />
+                (onChange)="changeLanguage()"/>
             </div>
           </div>
         </div>
         @if (securityService.isAdmin()) {
           <div class="md:w-1/2">
             <div class="card flex flex-col gap-4">
-              <div class="font-semibold text-xl">{{ l10n.menu }}</div>
+              <div class="font-semibold text-xl">{{ 'config.menu' | translate }}</div>
               <div class="flex items-center gap-2">
-                <label for="oip-app-config-admin-mode">{{ l10n.all }}</label>
+                <label for="oip-app-config-admin-mode">{{ 'config.all' | translate }}</label>
                 <p-toggle-switch
                   id="oip-app-config-admin-mode"
                   [(ngModel)]="menuService.adminMode"
                   (onChange)="onSwitchChange()"></p-toggle-switch>
               </div>
               <div class="flex items-center gap-2">
-                <label for="oip-app-config-admin-mode">{{ l10n.moduleManagement }}</label>
-                <p-button icon="pi pi-cog" label="{{ l10n.goTo }}" routerLink="/modules" />
+                <label for="oip-app-config-admin-mode">{{ 'config.moduleManagement' | translate }}</label>
+                <p-button icon="pi pi-cog" label="{{ 'config.goTo' | translate  }}" routerLink="/modules"/>
               </div>
             </div>
           </div>
         }
       </div>
     </p-fluid>
-  `, isInline: true, dependencies: [{ kind: "component", type: ProfileComponent, selector: "user-profile" }, { kind: "component", type: Fluid, selector: "p-fluid" }, { kind: "directive", type: Tooltip, selector: "[pTooltip]", inputs: ["tooltipPosition", "tooltipEvent", "positionStyle", "tooltipStyleClass", "tooltipZIndex", "escape", "showDelay", "hideDelay", "life", "positionTop", "positionLeft", "autoHide", "fitContent", "hideOnEscape", "pTooltip", "tooltipDisabled", "tooltipOptions", "appendTo"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i5.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: Select, selector: "p-select", inputs: ["id", "scrollHeight", "filter", "panelStyle", "styleClass", "panelStyleClass", "readonly", "editable", "tabindex", "placeholder", "loadingIcon", "filterPlaceholder", "filterLocale", "inputId", "dataKey", "filterBy", "filterFields", "autofocus", "resetFilterOnHide", "checkmark", "dropdownIcon", "loading", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "group", "showClear", "emptyFilterMessage", "emptyMessage", "lazy", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "overlayOptions", "ariaFilterLabel", "ariaLabel", "ariaLabelledBy", "filterMatchMode", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "focusOnHover", "selectOnFocus", "autoOptionFocus", "autofocusFilter", "filterValue", "options", "appendTo"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onShow", "onHide", "onClear", "onLazyLoad"] }, { kind: "ngmodule", type: TableModule }, { kind: "ngmodule", type: ToggleSwitchModule }, { kind: "component", type: i2$2.ToggleSwitch, selector: "p-toggleswitch, p-toggleSwitch, p-toggle-switch", inputs: ["styleClass", "tabindex", "inputId", "readonly", "trueValue", "falseValue", "ariaLabel", "size", "ariaLabelledBy", "autofocus"], outputs: ["onChange"] }, { kind: "directive", type: RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "component", type: Button, selector: "p-button", inputs: ["type", "iconPos", "icon", "badge", "label", "disabled", "loading", "loadingIcon", "raised", "rounded", "text", "plain", "severity", "outlined", "link", "tabindex", "size", "variant", "style", "styleClass", "badgeClass", "badgeSeverity", "ariaLabel", "buttonProps", "autofocus", "fluid"], outputs: ["onClick", "onFocus", "onBlur"] }] }); }
+  `, isInline: true, dependencies: [{ kind: "component", type: ProfileComponent, selector: "user-profile" }, { kind: "component", type: Fluid, selector: "p-fluid" }, { kind: "directive", type: Tooltip, selector: "[pTooltip]", inputs: ["tooltipPosition", "tooltipEvent", "positionStyle", "tooltipStyleClass", "tooltipZIndex", "escape", "showDelay", "hideDelay", "life", "positionTop", "positionLeft", "autoHide", "fitContent", "hideOnEscape", "pTooltip", "tooltipDisabled", "tooltipOptions", "appendTo"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i5.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: Select, selector: "p-select", inputs: ["id", "scrollHeight", "filter", "panelStyle", "styleClass", "panelStyleClass", "readonly", "editable", "tabindex", "placeholder", "loadingIcon", "filterPlaceholder", "filterLocale", "inputId", "dataKey", "filterBy", "filterFields", "autofocus", "resetFilterOnHide", "checkmark", "dropdownIcon", "loading", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "group", "showClear", "emptyFilterMessage", "emptyMessage", "lazy", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "overlayOptions", "ariaFilterLabel", "ariaLabel", "ariaLabelledBy", "filterMatchMode", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "focusOnHover", "selectOnFocus", "autoOptionFocus", "autofocusFilter", "filterValue", "options", "appendTo"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onShow", "onHide", "onClear", "onLazyLoad"] }, { kind: "ngmodule", type: TableModule }, { kind: "ngmodule", type: ToggleSwitchModule }, { kind: "component", type: i2$3.ToggleSwitch, selector: "p-toggleswitch, p-toggleSwitch, p-toggle-switch", inputs: ["styleClass", "tabindex", "inputId", "readonly", "trueValue", "falseValue", "ariaLabel", "size", "ariaLabelledBy", "autofocus"], outputs: ["onChange"] }, { kind: "directive", type: RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "component", type: Button, selector: "p-button", inputs: ["type", "iconPos", "icon", "badge", "label", "disabled", "loading", "loadingIcon", "raised", "rounded", "text", "plain", "severity", "outlined", "link", "tabindex", "size", "variant", "style", "styleClass", "badgeClass", "badgeSeverity", "ariaLabel", "buttonProps", "autofocus", "fluid"], outputs: ["onClick", "onFocus", "onBlur"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.2", ngImport: i0, type: ConfigComponent, decorators: [{
             type: Component,
@@ -3604,15 +3638,15 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.2", ngImpor
       <div class="flex flex-col md:flex-row gap-4">
         <div class="md:w-1/2">
           <div class="card flex flex-col gap-4">
-            <div class="font-semibold text-xl">{{ l10n.profile }}</div>
+            <div class="font-semibold text-xl">{{ 'config.profile' | translate }}</div>
             <div class="flex justify-content-end flex-wrap">
               {{ userService.userName }}
             </div>
             <label>
-              {{ l10n.photo }}
+              {{ 'config.photo' | translate }}
               <span
                 class="pi pi-question-circle"
-                pTooltip="{{ l10n.usePhoto256x256Pixel }}"
+                pTooltip="{{ 'config.usePhoto256x256Pixel' | translate }}"
                 tooltipPosition="right"></span>
             </label>
             <div class="flex justify-content-end flex-wrap">
@@ -3622,8 +3656,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.2", ngImpor
         </div>
         <div class="md:w-1/2">
           <div class="card flex flex-col gap-4">
-            <div class="font-semibold text-xl">{{ l10n.localization }}</div>
-            <label> {{ l10n.selectLanguage }} </label>
+            <div class="font-semibold text-xl">{{ 'config.localization' | translate }}</div>
+            <label> {{ 'config.selectLanguage' | translate }} </label>
             <div class="flex justify-content-end flex-wrap">
               <p-select
                 class="w-full md:w-56"
@@ -3632,24 +3666,24 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.2", ngImpor
                 optionValue="value"
                 [options]="languages"
                 [(ngModel)]="selectedLanguage"
-                (onChange)="changeLanguage()" />
+                (onChange)="changeLanguage()"/>
             </div>
           </div>
         </div>
         @if (securityService.isAdmin()) {
           <div class="md:w-1/2">
             <div class="card flex flex-col gap-4">
-              <div class="font-semibold text-xl">{{ l10n.menu }}</div>
+              <div class="font-semibold text-xl">{{ 'config.menu' | translate }}</div>
               <div class="flex items-center gap-2">
-                <label for="oip-app-config-admin-mode">{{ l10n.all }}</label>
+                <label for="oip-app-config-admin-mode">{{ 'config.all' | translate }}</label>
                 <p-toggle-switch
                   id="oip-app-config-admin-mode"
                   [(ngModel)]="menuService.adminMode"
                   (onChange)="onSwitchChange()"></p-toggle-switch>
               </div>
               <div class="flex items-center gap-2">
-                <label for="oip-app-config-admin-mode">{{ l10n.moduleManagement }}</label>
-                <p-button icon="pi pi-cog" label="{{ l10n.goTo }}" routerLink="/modules" />
+                <label for="oip-app-config-admin-mode">{{ 'config.moduleManagement' | translate }}</label>
+                <p-button icon="pi pi-cog" label="{{ 'config.goTo' | translate  }}" routerLink="/modules"/>
               </div>
             </div>
           </div>
@@ -3657,11 +3691,16 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.2", ngImpor
       </div>
     </p-fluid>
   `,
-                    imports: [ProfileComponent, Fluid, Tooltip, FormsModule, Select, TableModule, ToggleSwitchModule, RouterLink, Button]
+                    imports: [ProfileComponent, Fluid, Tooltip, FormsModule, Select, TableModule, ToggleSwitchModule, RouterLink, Button, TranslatePipe]
                 }]
         }], ctorParameters: () => [] });
 
 class DbMigrationComponent extends BaseModuleComponent {
+    constructor() {
+        super();
+        this.l10nService = inject(L10nService);
+        this.l10nService.loadComponentTranslations('db-migration');
+    }
     async ngOnInit() {
         await super.ngOnInit();
         await this.refreshAction();
@@ -3673,7 +3712,7 @@ class DbMigrationComponent extends BaseModuleComponent {
         })
             .catch((error) => {
             console.log(error);
-            this.msgService.error('Error refreshing database');
+            this.msgService.error(this.l10nService.instant('db-migration.messages.errorRefreshing'));
         });
     }
     async getData() {
@@ -3683,89 +3722,91 @@ class DbMigrationComponent extends BaseModuleComponent {
         const request = { name: rowData.name };
         return this.baseDataService.sendRequest(`api/${this.controller}/apply-migration`, 'POST', request);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.2", ngImport: i0, type: DbMigrationComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.2", ngImport: i0, type: DbMigrationComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
     static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.2", type: DbMigrationComponent, isStandalone: true, selector: "db-migration", providers: [ConfirmationService], usesInheritance: true, ngImport: i0, template: `
-    <div *ngIf="isContent" class="card" style="height: 100%">
-      <p-confirmDialog />
-      <div>
-        <h5>Migration manager</h5>
-        <div class="flex flex-row gap-2">
-          <p-button
-            icon="pi pi-refresh"
-            pTooltip="Refresh"
-            severity="secondary"
-            tooltipPosition="bottom"
-            [outlined]="true"
-            (click)="refreshAction()" />
-          <p-button
-            icon="pi pi-filter-slash"
-            pTooltip="Clean filter"
-            severity="secondary"
-            tooltipPosition="bottom"
-            [outlined]="true"
-            (click)="dt.clear()" />
-        </div>
+    @if (isContent) {
+      <div class="card" style="height: 100%">
+        <p-confirmDialog/>
         <div>
-          <p-table #dt dataKey="name" editMode="row" size="small" [scrollable]="true" [value]="data">
-            <ng-template let-columns pTemplate="header">
-              <tr>
-                <th pSortableColumn="name" scope="col">
-                  Migration name
-                  <p-columnFilter display="menu" field="name" type="text" />
-                </th>
-                <th scope="col">Applied</th>
-                <th scope="col">Exist</th>
-                <th>Pending</th>
-                <th scope="col"></th>
-              </tr>
-            </ng-template>
+          <h5>{{ 'db-migration.migrationManager' | translate }}</h5>
+          <div class="flex flex-row gap-2">
+            <p-button
+              icon="pi pi-refresh"
+              [pTooltip]="'db-migration.actions.refresh' | translate"
+              severity="secondary"
+              tooltipPosition="bottom"
+              [outlined]="true"
+              (click)="refreshAction()"/>
+            <p-button
+              icon="pi pi-filter-slash"
+              [pTooltip]="'db-migration.actions.cleanFilter' | translate"
+              severity="secondary"
+              tooltipPosition="bottom"
+              [outlined]="true"
+              (click)="dt.clear()"/>
+          </div>
+          <div>
+            <p-table #dt dataKey="name" editMode="row" size="small" [scrollable]="true" [value]="data">
+              <ng-template let-columns pTemplate="header">
+                <tr>
+                  <th pSortableColumn="name" scope="col">
+                    {{ 'db-migration.columns.name' | translate }}
+                    <p-columnFilter display="menu" field="name" type="text"/>
+                  </th>
+                  <th scope="col">{{ 'db-migration.columns.applied' | translate }}</th>
+                  <th scope="col">{{ 'db-migration.columns.exist' | translate }}</th>
+                  <th scope="col">{{ 'db-migration.columns.pending' | translate }}</th>
+                  <th scope="col"></th>
+                </tr>
+              </ng-template>
 
-            <ng-template #body let-columns="columns" let-editing="editing" let-ri="rowIndex" let-rowData>
-              <tr [pEditableRow]="rowData">
-                <td>
-                  {{ rowData.name }}
-                </td>
-                <td>
-                  <p-button
-                    *ngIf="rowData.applied"
-                    icon="pi pi-check"
-                    severity="success"
-                    [rounded]="true"
-                    [text]="true">
-                  </p-button>
-                </td>
-                <td>
-                  @if (rowData.exist) {
-                    <p-button icon="pi pi-check" severity="success" [rounded]="true" [text]="true" />
-                  }
-                </td>
-                <td>
-                  @if (rowData.pending) {
-                    <p-button icon="pi pi-check" severity="success" [rounded]="true" [text]="true"></p-button>
-                  }
-                </td>
-                <td>
-                  <p-button
-                    icon="pi pi-bolt"
-                    pCancelEditableRow
-                    pTooltip="Apply migration"
-                    severity="secondary"
-                    tooltipPosition="left"
-                    [rounded]="true"
-                    [text]="true"
-                    (click)="applyMigration(rowData)">
-                  </p-button>
-                </td>
-              </tr>
-            </ng-template>
-          </p-table>
+              <ng-template #body let-columns="columns" let-editing="editing" let-ri="rowIndex" let-rowData>
+                <tr [pEditableRow]="rowData">
+                  <td>
+                    {{ rowData.name }}
+                  </td>
+                  <td>
+                    @if (rowData.applied) {
+                      <p-button
+                        icon="pi pi-check"
+                        severity="success"
+                        [rounded]="true"
+                        [text]="true">
+                      </p-button>
+                    }
+                  </td>
+                  <td>
+                    @if (rowData.exist) {
+                      <p-button icon="pi pi-check" severity="success" [rounded]="true" [text]="true"/>
+                    }
+                  </td>
+                  <td>
+                    @if (rowData.pending) {
+                      <p-button icon="pi pi-check" severity="success" [rounded]="true" [text]="true"></p-button>
+                    }
+                  </td>
+                  <td>
+                    <p-button
+                      icon="pi pi-bolt"
+                      pCancelEditableRow
+                      pTooltip="{{'db-migration.actions.applyMigration' | translate}}"
+                      severity="secondary"
+                      tooltipPosition="left"
+                      [rounded]="true"
+                      [text]="true"
+                      (click)="applyMigration(rowData)">
+                    </p-button>
+                  </td>
+                </tr>
+              </ng-template>
+            </p-table>
+          </div>
         </div>
       </div>
-    </div>
-    @if (isSecurity) {
-      <security [controller]="controller" [id]="id" />
+    } @else if (isSecurity) {
+      <security [controller]="controller" [id]="id"/>
     }
-  `, isInline: true, dependencies: [{ kind: "ngmodule", type: TableModule }, { kind: "component", type: i1$6.Table, selector: "p-table", inputs: ["frozenColumns", "frozenValue", "styleClass", "tableStyle", "tableStyleClass", "paginator", "pageLinks", "rowsPerPageOptions", "alwaysShowPaginator", "paginatorPosition", "paginatorStyleClass", "paginatorDropdownAppendTo", "paginatorDropdownScrollHeight", "currentPageReportTemplate", "showCurrentPageReport", "showJumpToPageDropdown", "showJumpToPageInput", "showFirstLastIcon", "showPageLinks", "defaultSortOrder", "sortMode", "resetPageOnSort", "selectionMode", "selectionPageOnly", "contextMenuSelection", "contextMenuSelectionMode", "dataKey", "metaKeySelection", "rowSelectable", "rowTrackBy", "lazy", "lazyLoadOnInit", "compareSelectionBy", "csvSeparator", "exportFilename", "filters", "globalFilterFields", "filterDelay", "filterLocale", "expandedRowKeys", "editingRowKeys", "rowExpandMode", "scrollable", "rowGroupMode", "scrollHeight", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "virtualScrollDelay", "frozenWidth", "contextMenu", "resizableColumns", "columnResizeMode", "reorderableColumns", "loading", "loadingIcon", "showLoader", "rowHover", "customSort", "showInitialSortBadge", "exportFunction", "exportHeader", "stateKey", "stateStorage", "editMode", "groupRowsBy", "size", "showGridlines", "stripedRows", "groupRowsByOrder", "responsiveLayout", "breakpoint", "paginatorLocale", "value", "columns", "first", "rows", "totalRecords", "sortField", "sortOrder", "multiSortMeta", "selection", "selectAll"], outputs: ["contextMenuSelectionChange", "selectAllChange", "selectionChange", "onRowSelect", "onRowUnselect", "onPage", "onSort", "onFilter", "onLazyLoad", "onRowExpand", "onRowCollapse", "onContextMenuSelect", "onColResize", "onColReorder", "onRowReorder", "onEditInit", "onEditComplete", "onEditCancel", "onHeaderCheckboxToggle", "sortFunction", "firstChange", "rowsChange", "onStateSave", "onStateRestore"] }, { kind: "directive", type: i2$3.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "directive", type: i1$6.SortableColumn, selector: "[pSortableColumn]", inputs: ["pSortableColumn", "pSortableColumnDisabled"] }, { kind: "directive", type: i1$6.EditableRow, selector: "[pEditableRow]", inputs: ["pEditableRow", "pEditableRowDisabled"] }, { kind: "directive", type: i1$6.CancelEditableRow, selector: "[pCancelEditableRow]" }, { kind: "component", type: i1$6.ColumnFilter, selector: "p-columnFilter, p-column-filter, p-columnfilter", inputs: ["field", "type", "display", "showMenu", "matchMode", "operator", "showOperator", "showClearButton", "showApplyButton", "showMatchModes", "showAddButton", "hideOnClear", "placeholder", "matchModeOptions", "maxConstraints", "minFractionDigits", "maxFractionDigits", "prefix", "suffix", "locale", "localeMatcher", "currency", "currencyDisplay", "filterOn", "useGrouping", "showButtons", "ariaLabel", "filterButtonProps"], outputs: ["onShow", "onHide"] }, { kind: "ngmodule", type: SharedModule }, { kind: "ngmodule", type: TagModule }, { kind: "ngmodule", type: InputTextModule }, { kind: "ngmodule", type: TextareaModule }, { kind: "ngmodule", type: ButtonModule }, { kind: "component", type: i1$1.Button, selector: "p-button", inputs: ["type", "iconPos", "icon", "badge", "label", "disabled", "loading", "loadingIcon", "raised", "rounded", "text", "plain", "severity", "outlined", "link", "tabindex", "size", "variant", "style", "styleClass", "badgeClass", "badgeSeverity", "ariaLabel", "buttonProps", "autofocus", "fluid"], outputs: ["onClick", "onFocus", "onBlur"] }, { kind: "ngmodule", type: FormsModule }, { kind: "component", type: ConfirmDialog, selector: "p-confirmDialog, p-confirmdialog, p-confirm-dialog", inputs: ["header", "icon", "message", "style", "styleClass", "maskStyleClass", "acceptIcon", "acceptLabel", "closeAriaLabel", "acceptAriaLabel", "acceptVisible", "rejectIcon", "rejectLabel", "rejectAriaLabel", "rejectVisible", "acceptButtonStyleClass", "rejectButtonStyleClass", "closeOnEscape", "dismissableMask", "blockScroll", "rtl", "closable", "appendTo", "key", "autoZIndex", "baseZIndex", "transitionOptions", "focusTrap", "defaultFocus", "breakpoints", "visible", "position", "draggable"], outputs: ["onHide"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: SecurityComponent, selector: "security", inputs: ["id", "controller"] }, { kind: "directive", type: Tooltip, selector: "[pTooltip]", inputs: ["tooltipPosition", "tooltipEvent", "positionStyle", "tooltipStyleClass", "tooltipZIndex", "escape", "showDelay", "hideDelay", "life", "positionTop", "positionLeft", "autoHide", "fitContent", "hideOnEscape", "pTooltip", "tooltipDisabled", "tooltipOptions", "appendTo"] }] }); }
+  `, isInline: true, dependencies: [{ kind: "ngmodule", type: TableModule }, { kind: "component", type: i1$6.Table, selector: "p-table", inputs: ["frozenColumns", "frozenValue", "styleClass", "tableStyle", "tableStyleClass", "paginator", "pageLinks", "rowsPerPageOptions", "alwaysShowPaginator", "paginatorPosition", "paginatorStyleClass", "paginatorDropdownAppendTo", "paginatorDropdownScrollHeight", "currentPageReportTemplate", "showCurrentPageReport", "showJumpToPageDropdown", "showJumpToPageInput", "showFirstLastIcon", "showPageLinks", "defaultSortOrder", "sortMode", "resetPageOnSort", "selectionMode", "selectionPageOnly", "contextMenuSelection", "contextMenuSelectionMode", "dataKey", "metaKeySelection", "rowSelectable", "rowTrackBy", "lazy", "lazyLoadOnInit", "compareSelectionBy", "csvSeparator", "exportFilename", "filters", "globalFilterFields", "filterDelay", "filterLocale", "expandedRowKeys", "editingRowKeys", "rowExpandMode", "scrollable", "rowGroupMode", "scrollHeight", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "virtualScrollDelay", "frozenWidth", "contextMenu", "resizableColumns", "columnResizeMode", "reorderableColumns", "loading", "loadingIcon", "showLoader", "rowHover", "customSort", "showInitialSortBadge", "exportFunction", "exportHeader", "stateKey", "stateStorage", "editMode", "groupRowsBy", "size", "showGridlines", "stripedRows", "groupRowsByOrder", "responsiveLayout", "breakpoint", "paginatorLocale", "value", "columns", "first", "rows", "totalRecords", "sortField", "sortOrder", "multiSortMeta", "selection", "selectAll"], outputs: ["contextMenuSelectionChange", "selectAllChange", "selectionChange", "onRowSelect", "onRowUnselect", "onPage", "onSort", "onFilter", "onLazyLoad", "onRowExpand", "onRowCollapse", "onContextMenuSelect", "onColResize", "onColReorder", "onRowReorder", "onEditInit", "onEditComplete", "onEditCancel", "onHeaderCheckboxToggle", "sortFunction", "firstChange", "rowsChange", "onStateSave", "onStateRestore"] }, { kind: "directive", type: i2$4.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "directive", type: i1$6.SortableColumn, selector: "[pSortableColumn]", inputs: ["pSortableColumn", "pSortableColumnDisabled"] }, { kind: "directive", type: i1$6.EditableRow, selector: "[pEditableRow]", inputs: ["pEditableRow", "pEditableRowDisabled"] }, { kind: "directive", type: i1$6.CancelEditableRow, selector: "[pCancelEditableRow]" }, { kind: "component", type: i1$6.ColumnFilter, selector: "p-columnFilter, p-column-filter, p-columnfilter", inputs: ["field", "type", "display", "showMenu", "matchMode", "operator", "showOperator", "showClearButton", "showApplyButton", "showMatchModes", "showAddButton", "hideOnClear", "placeholder", "matchModeOptions", "maxConstraints", "minFractionDigits", "maxFractionDigits", "prefix", "suffix", "locale", "localeMatcher", "currency", "currencyDisplay", "filterOn", "useGrouping", "showButtons", "ariaLabel", "filterButtonProps"], outputs: ["onShow", "onHide"] }, { kind: "ngmodule", type: SharedModule }, { kind: "ngmodule", type: TagModule }, { kind: "ngmodule", type: InputTextModule }, { kind: "ngmodule", type: TextareaModule }, { kind: "ngmodule", type: ButtonModule }, { kind: "component", type: i1$1.Button, selector: "p-button", inputs: ["type", "iconPos", "icon", "badge", "label", "disabled", "loading", "loadingIcon", "raised", "rounded", "text", "plain", "severity", "outlined", "link", "tabindex", "size", "variant", "style", "styleClass", "badgeClass", "badgeSeverity", "ariaLabel", "buttonProps", "autofocus", "fluid"], outputs: ["onClick", "onFocus", "onBlur"] }, { kind: "ngmodule", type: FormsModule }, { kind: "component", type: ConfirmDialog, selector: "p-confirmDialog, p-confirmdialog, p-confirm-dialog", inputs: ["header", "icon", "message", "style", "styleClass", "maskStyleClass", "acceptIcon", "acceptLabel", "closeAriaLabel", "acceptAriaLabel", "acceptVisible", "rejectIcon", "rejectLabel", "rejectAriaLabel", "rejectVisible", "acceptButtonStyleClass", "rejectButtonStyleClass", "closeOnEscape", "dismissableMask", "blockScroll", "rtl", "closable", "appendTo", "key", "autoZIndex", "baseZIndex", "transitionOptions", "focusTrap", "defaultFocus", "breakpoints", "visible", "position", "draggable"], outputs: ["onHide"] }, { kind: "component", type: SecurityComponent, selector: "security", inputs: ["id", "controller"] }, { kind: "directive", type: Tooltip, selector: "[pTooltip]", inputs: ["tooltipPosition", "tooltipEvent", "positionStyle", "tooltipStyleClass", "tooltipZIndex", "escape", "showDelay", "hideDelay", "life", "positionTop", "positionLeft", "autoHide", "fitContent", "hideOnEscape", "pTooltip", "tooltipDisabled", "tooltipOptions", "appendTo"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.2", ngImport: i0, type: DbMigrationComponent, decorators: [{
             type: Component,
@@ -3779,96 +3820,98 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.2", ngImpor
                         ButtonModule,
                         FormsModule,
                         ConfirmDialog,
-                        NgIf,
                         SecurityComponent,
-                        Tooltip
+                        Tooltip,
+                        TranslatePipe
                     ],
                     selector: 'db-migration',
                     template: `
-    <div *ngIf="isContent" class="card" style="height: 100%">
-      <p-confirmDialog />
-      <div>
-        <h5>Migration manager</h5>
-        <div class="flex flex-row gap-2">
-          <p-button
-            icon="pi pi-refresh"
-            pTooltip="Refresh"
-            severity="secondary"
-            tooltipPosition="bottom"
-            [outlined]="true"
-            (click)="refreshAction()" />
-          <p-button
-            icon="pi pi-filter-slash"
-            pTooltip="Clean filter"
-            severity="secondary"
-            tooltipPosition="bottom"
-            [outlined]="true"
-            (click)="dt.clear()" />
-        </div>
+    @if (isContent) {
+      <div class="card" style="height: 100%">
+        <p-confirmDialog/>
         <div>
-          <p-table #dt dataKey="name" editMode="row" size="small" [scrollable]="true" [value]="data">
-            <ng-template let-columns pTemplate="header">
-              <tr>
-                <th pSortableColumn="name" scope="col">
-                  Migration name
-                  <p-columnFilter display="menu" field="name" type="text" />
-                </th>
-                <th scope="col">Applied</th>
-                <th scope="col">Exist</th>
-                <th>Pending</th>
-                <th scope="col"></th>
-              </tr>
-            </ng-template>
+          <h5>{{ 'db-migration.migrationManager' | translate }}</h5>
+          <div class="flex flex-row gap-2">
+            <p-button
+              icon="pi pi-refresh"
+              [pTooltip]="'db-migration.actions.refresh' | translate"
+              severity="secondary"
+              tooltipPosition="bottom"
+              [outlined]="true"
+              (click)="refreshAction()"/>
+            <p-button
+              icon="pi pi-filter-slash"
+              [pTooltip]="'db-migration.actions.cleanFilter' | translate"
+              severity="secondary"
+              tooltipPosition="bottom"
+              [outlined]="true"
+              (click)="dt.clear()"/>
+          </div>
+          <div>
+            <p-table #dt dataKey="name" editMode="row" size="small" [scrollable]="true" [value]="data">
+              <ng-template let-columns pTemplate="header">
+                <tr>
+                  <th pSortableColumn="name" scope="col">
+                    {{ 'db-migration.columns.name' | translate }}
+                    <p-columnFilter display="menu" field="name" type="text"/>
+                  </th>
+                  <th scope="col">{{ 'db-migration.columns.applied' | translate }}</th>
+                  <th scope="col">{{ 'db-migration.columns.exist' | translate }}</th>
+                  <th scope="col">{{ 'db-migration.columns.pending' | translate }}</th>
+                  <th scope="col"></th>
+                </tr>
+              </ng-template>
 
-            <ng-template #body let-columns="columns" let-editing="editing" let-ri="rowIndex" let-rowData>
-              <tr [pEditableRow]="rowData">
-                <td>
-                  {{ rowData.name }}
-                </td>
-                <td>
-                  <p-button
-                    *ngIf="rowData.applied"
-                    icon="pi pi-check"
-                    severity="success"
-                    [rounded]="true"
-                    [text]="true">
-                  </p-button>
-                </td>
-                <td>
-                  @if (rowData.exist) {
-                    <p-button icon="pi pi-check" severity="success" [rounded]="true" [text]="true" />
-                  }
-                </td>
-                <td>
-                  @if (rowData.pending) {
-                    <p-button icon="pi pi-check" severity="success" [rounded]="true" [text]="true"></p-button>
-                  }
-                </td>
-                <td>
-                  <p-button
-                    icon="pi pi-bolt"
-                    pCancelEditableRow
-                    pTooltip="Apply migration"
-                    severity="secondary"
-                    tooltipPosition="left"
-                    [rounded]="true"
-                    [text]="true"
-                    (click)="applyMigration(rowData)">
-                  </p-button>
-                </td>
-              </tr>
-            </ng-template>
-          </p-table>
+              <ng-template #body let-columns="columns" let-editing="editing" let-ri="rowIndex" let-rowData>
+                <tr [pEditableRow]="rowData">
+                  <td>
+                    {{ rowData.name }}
+                  </td>
+                  <td>
+                    @if (rowData.applied) {
+                      <p-button
+                        icon="pi pi-check"
+                        severity="success"
+                        [rounded]="true"
+                        [text]="true">
+                      </p-button>
+                    }
+                  </td>
+                  <td>
+                    @if (rowData.exist) {
+                      <p-button icon="pi pi-check" severity="success" [rounded]="true" [text]="true"/>
+                    }
+                  </td>
+                  <td>
+                    @if (rowData.pending) {
+                      <p-button icon="pi pi-check" severity="success" [rounded]="true" [text]="true"></p-button>
+                    }
+                  </td>
+                  <td>
+                    <p-button
+                      icon="pi pi-bolt"
+                      pCancelEditableRow
+                      pTooltip="{{'db-migration.actions.applyMigration' | translate}}"
+                      severity="secondary"
+                      tooltipPosition="left"
+                      [rounded]="true"
+                      [text]="true"
+                      (click)="applyMigration(rowData)">
+                    </p-button>
+                  </td>
+                </tr>
+              </ng-template>
+            </p-table>
+          </div>
         </div>
       </div>
-    </div>
-    @if (isSecurity) {
-      <security [controller]="controller" [id]="id" />
+    } @else if (isSecurity) {
+      <security [controller]="controller" [id]="id"/>
     }
   `,
                     providers: [ConfirmationService]
                 }]
-        }] });
+        }], ctorParameters: () => [] });
 
 /* eslint-disable */
 /* tslint:disable */
@@ -3966,8 +4009,8 @@ class AppModulesComponent {
         this.moduleService = inject(Module);
     }
     async ngOnInit() {
-        (await this.l10nService.get('app-modules')).subscribe((l) => {
-            this.l10n = l;
+        this.l10nService.get('app-modules').subscribe((l10n) => {
+            this.l10n = l10n;
         });
         this.titleService.setTitle(this.l10n.title);
         await this.refreshAction();
@@ -4016,16 +4059,16 @@ class AppModulesComponent {
               severity="secondary"
               text="true"
               tooltipPosition="bottom"
-              [pTooltip]="l10n.refreshTooltip"
+              [pTooltip]="'app-modules.refreshTooltip' | translate"
               (onClick)="refreshAction()"></p-button>
           </p-toolbar>
         </div>
         <p-table class="mt-4" [paginator]="true" [rows]="100" [value]="modules">
           <ng-template pTemplate="header">
             <tr>
-              <th>{{ l10n.table.moduleId }}</th>
-              <th>{{ l10n.table.name }}</th>
-              <th>{{ l10n.table.currentlyLoaded }}</th>
+              <th>{{ 'app-modules.table.moduleId' | translate }}</th>
+              <th>{{ 'app-modules.table.name' | translate }}</th>
+              <th>{{ 'app-modules.table.currentlyLoaded' | translate }}</th>
               <th style="width: 4rem"></th>
             </tr>
           </ng-template>
@@ -4036,7 +4079,7 @@ class AppModulesComponent {
               <td>
                 <p-tag
                   [severity]="module.currentlyLoaded ? 'success' : 'danger'"
-                  [value]="module.currentlyLoaded ? l10n.table.yes : l10n.table.no"></p-tag>
+                  [value]="(module.currentlyLoaded ? 'app-modules.table.yes' : 'app-modules.table.no') | translate"></p-tag>
               </td>
               <td>
                 <p-button
@@ -4045,7 +4088,7 @@ class AppModulesComponent {
                   severity="danger"
                   text="true"
                   tooltipPosition="bottom"
-                  [pTooltip]="l10n.table.deleteTooltip"
+                  [pTooltip]="'app-modules.table.deleteTooltip' | translate"
                   (onClick)="deleteModule(module)"></p-button>
               </td>
             </tr>
@@ -4053,12 +4096,12 @@ class AppModulesComponent {
         </p-table>
       </div>
     </div>
-  `, isInline: true, dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "ngmodule", type: TableModule }, { kind: "component", type: i1$6.Table, selector: "p-table", inputs: ["frozenColumns", "frozenValue", "styleClass", "tableStyle", "tableStyleClass", "paginator", "pageLinks", "rowsPerPageOptions", "alwaysShowPaginator", "paginatorPosition", "paginatorStyleClass", "paginatorDropdownAppendTo", "paginatorDropdownScrollHeight", "currentPageReportTemplate", "showCurrentPageReport", "showJumpToPageDropdown", "showJumpToPageInput", "showFirstLastIcon", "showPageLinks", "defaultSortOrder", "sortMode", "resetPageOnSort", "selectionMode", "selectionPageOnly", "contextMenuSelection", "contextMenuSelectionMode", "dataKey", "metaKeySelection", "rowSelectable", "rowTrackBy", "lazy", "lazyLoadOnInit", "compareSelectionBy", "csvSeparator", "exportFilename", "filters", "globalFilterFields", "filterDelay", "filterLocale", "expandedRowKeys", "editingRowKeys", "rowExpandMode", "scrollable", "rowGroupMode", "scrollHeight", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "virtualScrollDelay", "frozenWidth", "contextMenu", "resizableColumns", "columnResizeMode", "reorderableColumns", "loading", "loadingIcon", "showLoader", "rowHover", "customSort", "showInitialSortBadge", "exportFunction", "exportHeader", "stateKey", "stateStorage", "editMode", "groupRowsBy", "size", "showGridlines", "stripedRows", "groupRowsByOrder", "responsiveLayout", "breakpoint", "paginatorLocale", "value", "columns", "first", "rows", "totalRecords", "sortField", "sortOrder", "multiSortMeta", "selection", "selectAll"], outputs: ["contextMenuSelectionChange", "selectAllChange", "selectionChange", "onRowSelect", "onRowUnselect", "onPage", "onSort", "onFilter", "onLazyLoad", "onRowExpand", "onRowCollapse", "onContextMenuSelect", "onColResize", "onColReorder", "onRowReorder", "onEditInit", "onEditComplete", "onEditCancel", "onHeaderCheckboxToggle", "sortFunction", "firstChange", "rowsChange", "onStateSave", "onStateRestore"] }, { kind: "directive", type: i2$3.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "component", type: Tag, selector: "p-tag", inputs: ["styleClass", "severity", "value", "icon", "rounded"] }, { kind: "ngmodule", type: ButtonModule }, { kind: "component", type: i1$1.Button, selector: "p-button", inputs: ["type", "iconPos", "icon", "badge", "label", "disabled", "loading", "loadingIcon", "raised", "rounded", "text", "plain", "severity", "outlined", "link", "tabindex", "size", "variant", "style", "styleClass", "badgeClass", "badgeSeverity", "ariaLabel", "buttonProps", "autofocus", "fluid"], outputs: ["onClick", "onFocus", "onBlur"] }, { kind: "ngmodule", type: ToolbarModule }, { kind: "component", type: i4$2.Toolbar, selector: "p-toolbar", inputs: ["styleClass", "ariaLabelledBy"] }, { kind: "directive", type: Tooltip, selector: "[pTooltip]", inputs: ["tooltipPosition", "tooltipEvent", "positionStyle", "tooltipStyleClass", "tooltipZIndex", "escape", "showDelay", "hideDelay", "life", "positionTop", "positionLeft", "autoHide", "fitContent", "hideOnEscape", "pTooltip", "tooltipDisabled", "tooltipOptions", "appendTo"] }, { kind: "component", type: ConfirmDialog, selector: "p-confirmDialog, p-confirmdialog, p-confirm-dialog", inputs: ["header", "icon", "message", "style", "styleClass", "maskStyleClass", "acceptIcon", "acceptLabel", "closeAriaLabel", "acceptAriaLabel", "acceptVisible", "rejectIcon", "rejectLabel", "rejectAriaLabel", "rejectVisible", "acceptButtonStyleClass", "rejectButtonStyleClass", "closeOnEscape", "dismissableMask", "blockScroll", "rtl", "closable", "appendTo", "key", "autoZIndex", "baseZIndex", "transitionOptions", "focusTrap", "defaultFocus", "breakpoints", "visible", "position", "draggable"], outputs: ["onHide"] }] }); }
+  `, isInline: true, dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "ngmodule", type: TableModule }, { kind: "component", type: i1$6.Table, selector: "p-table", inputs: ["frozenColumns", "frozenValue", "styleClass", "tableStyle", "tableStyleClass", "paginator", "pageLinks", "rowsPerPageOptions", "alwaysShowPaginator", "paginatorPosition", "paginatorStyleClass", "paginatorDropdownAppendTo", "paginatorDropdownScrollHeight", "currentPageReportTemplate", "showCurrentPageReport", "showJumpToPageDropdown", "showJumpToPageInput", "showFirstLastIcon", "showPageLinks", "defaultSortOrder", "sortMode", "resetPageOnSort", "selectionMode", "selectionPageOnly", "contextMenuSelection", "contextMenuSelectionMode", "dataKey", "metaKeySelection", "rowSelectable", "rowTrackBy", "lazy", "lazyLoadOnInit", "compareSelectionBy", "csvSeparator", "exportFilename", "filters", "globalFilterFields", "filterDelay", "filterLocale", "expandedRowKeys", "editingRowKeys", "rowExpandMode", "scrollable", "rowGroupMode", "scrollHeight", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "virtualScrollDelay", "frozenWidth", "contextMenu", "resizableColumns", "columnResizeMode", "reorderableColumns", "loading", "loadingIcon", "showLoader", "rowHover", "customSort", "showInitialSortBadge", "exportFunction", "exportHeader", "stateKey", "stateStorage", "editMode", "groupRowsBy", "size", "showGridlines", "stripedRows", "groupRowsByOrder", "responsiveLayout", "breakpoint", "paginatorLocale", "value", "columns", "first", "rows", "totalRecords", "sortField", "sortOrder", "multiSortMeta", "selection", "selectAll"], outputs: ["contextMenuSelectionChange", "selectAllChange", "selectionChange", "onRowSelect", "onRowUnselect", "onPage", "onSort", "onFilter", "onLazyLoad", "onRowExpand", "onRowCollapse", "onContextMenuSelect", "onColResize", "onColReorder", "onRowReorder", "onEditInit", "onEditComplete", "onEditCancel", "onHeaderCheckboxToggle", "sortFunction", "firstChange", "rowsChange", "onStateSave", "onStateRestore"] }, { kind: "directive", type: i2$4.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "component", type: Tag, selector: "p-tag", inputs: ["styleClass", "severity", "value", "icon", "rounded"] }, { kind: "ngmodule", type: ButtonModule }, { kind: "component", type: i1$1.Button, selector: "p-button", inputs: ["type", "iconPos", "icon", "badge", "label", "disabled", "loading", "loadingIcon", "raised", "rounded", "text", "plain", "severity", "outlined", "link", "tabindex", "size", "variant", "style", "styleClass", "badgeClass", "badgeSeverity", "ariaLabel", "buttonProps", "autofocus", "fluid"], outputs: ["onClick", "onFocus", "onBlur"] }, { kind: "ngmodule", type: ToolbarModule }, { kind: "component", type: i4$2.Toolbar, selector: "p-toolbar", inputs: ["styleClass", "ariaLabelledBy"] }, { kind: "directive", type: Tooltip, selector: "[pTooltip]", inputs: ["tooltipPosition", "tooltipEvent", "positionStyle", "tooltipStyleClass", "tooltipZIndex", "escape", "showDelay", "hideDelay", "life", "positionTop", "positionLeft", "autoHide", "fitContent", "hideOnEscape", "pTooltip", "tooltipDisabled", "tooltipOptions", "appendTo"] }, { kind: "component", type: ConfirmDialog, selector: "p-confirmDialog, p-confirmdialog, p-confirm-dialog", inputs: ["header", "icon", "message", "style", "styleClass", "maskStyleClass", "acceptIcon", "acceptLabel", "closeAriaLabel", "acceptAriaLabel", "acceptVisible", "rejectIcon", "rejectLabel", "rejectAriaLabel", "rejectVisible", "acceptButtonStyleClass", "rejectButtonStyleClass", "closeOnEscape", "dismissableMask", "blockScroll", "rtl", "closable", "appendTo", "key", "autoZIndex", "baseZIndex", "transitionOptions", "focusTrap", "defaultFocus", "breakpoints", "visible", "position", "draggable"], outputs: ["onHide"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.2", ngImport: i0, type: AppModulesComponent, decorators: [{
             type: Component,
             args: [{
-                    imports: [FormsModule, TableModule, Tag, ButtonModule, ToolbarModule, Tooltip, ConfirmDialog],
+                    imports: [FormsModule, TableModule, Tag, ButtonModule, ToolbarModule, Tooltip, ConfirmDialog, TranslatePipe],
                     providers: [ConfirmationService, Module],
                     selector: 'app-modules',
                     template: `
@@ -4076,16 +4119,16 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.2", ngImpor
               severity="secondary"
               text="true"
               tooltipPosition="bottom"
-              [pTooltip]="l10n.refreshTooltip"
+              [pTooltip]="'app-modules.refreshTooltip' | translate"
               (onClick)="refreshAction()"></p-button>
           </p-toolbar>
         </div>
         <p-table class="mt-4" [paginator]="true" [rows]="100" [value]="modules">
           <ng-template pTemplate="header">
             <tr>
-              <th>{{ l10n.table.moduleId }}</th>
-              <th>{{ l10n.table.name }}</th>
-              <th>{{ l10n.table.currentlyLoaded }}</th>
+              <th>{{ 'app-modules.table.moduleId' | translate }}</th>
+              <th>{{ 'app-modules.table.name' | translate }}</th>
+              <th>{{ 'app-modules.table.currentlyLoaded' | translate }}</th>
               <th style="width: 4rem"></th>
             </tr>
           </ng-template>
@@ -4096,7 +4139,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.2", ngImpor
               <td>
                 <p-tag
                   [severity]="module.currentlyLoaded ? 'success' : 'danger'"
-                  [value]="module.currentlyLoaded ? l10n.table.yes : l10n.table.no"></p-tag>
+                  [value]="(module.currentlyLoaded ? 'app-modules.table.yes' : 'app-modules.table.no') | translate"></p-tag>
               </td>
               <td>
                 <p-button
@@ -4105,7 +4148,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.2", ngImpor
                   severity="danger"
                   text="true"
                   tooltipPosition="bottom"
-                  [pTooltip]="l10n.table.deleteTooltip"
+                  [pTooltip]="'app-modules.table.deleteTooltip' | translate"
                   (onClick)="deleteModule(module)"></p-button>
               </td>
             </tr>