@solcre-org/core-ui 2.15.35 → 2.15.36

package/assets/css/inc/components/main-nav.css

@@ -59,20 +59,6 @@
     display: none;
 }
 
-/* TODO: User menu - Take this outside the scrollable and leave it pos.fixed */
-
-.c-main-nav__user {
-    /* Temp */
-    width: 2.8rem;
-    height: 2.8rem;
-    background-color: white;
-    opacity: 0.5;
-    border-radius: 50%;
-    margin-left: calc(var(--_left-col-w) / 4);
-    margin-bottom: 1.2rem;
-}
-
-
 
 /* ********************** MOBILE & TABLET ********************** */
 

package/assets/css/inc/components/main-nav.nav.css

@@ -17,6 +17,27 @@
     font-size: var(--_fz);
     font-weight: var(--_fw);
 }
+
+.c-mn-user{
+    padding-inline: calc(var(--_left-col-w)/2 - 1rem);
+    font-size: var(--fz-200);
+    font-weight: 500;
+    margin-top: var(--_gap-y);
+}
+
+.c-mn-user__welcome{
+    font-size: 0.9em;
+    opacity: .8;
+}
+
+.c-mn-user__name{
+    font-weight: 700;
+    display: block;
+    white-space: nowrap;
+    overflow: hidden;
+    text-overflow: ellipsis;
+}
+
 .c-mn-nav__list{
     display: grid;
     gap: var(--_gap);
@@ -286,7 +307,7 @@ button:is(.c-mn-nav__link, .c-mn-nav__sublink){
 
 @media (hover: hover) {
 
-    :is(.c-mn-nav__link, .c-mn-nav__sublink):hover{
+    :is(.c-mn-nav__link, .c-mn-nav__sublink):not(:disabled):hover{
         color: hsl( var(--_color-alt-hsl) );
     }
     :is(.c-mn-nav__link, .c-mn-nav__sublink):active{

package/assets/css/inc/components/placeholder.css

@@ -18,6 +18,7 @@
     font-size: var(--_fz);
     font-weight: var(--_fw);
     letter-spacing: 0.05em;
+    text-align: left;
     line-height: 1.2;
     color: hsl(var(--_color-main-hsl) / 40%);
 }

package/fesm2022/solcre-org-core-ui.mjs

@@ -734,11 +734,11 @@ class DateFieldComponent extends BaseFieldComponent {
         }
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: DateFieldComponent, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.6", type: DateFieldComponent, isStandalone: true, selector: "core-date-field", usesInheritance: true, hostDirectives: [{ directive: CoreHostDirective }], ngImport: i0, template: "<label class=\"c-entry-item\" [class.c-entry-item--inline]=\"field().inline\">\n  <span class=\"c-entry-text\" *ngIf=\"field().label\">\n    {{ field().label | translate }}\n    @if (hasRequiredValidators()) {\n      <span class=\"c-required\">*</span>\n    }\n  </span>\n\n  <span class=\"c-entry-input\"\n      [class.is-placeholder]=\"!formControl().value\"\n      style=\"--chars: 10\"\n      [class.is-invalid]=\"hasError()\">\n      \n      <input type=\"date\"\n        [id]=\"field().key.toString()\"\n        [name]=\"field().key.toString()\"\n        [formControl]=\"formControl()\"\n        [min]=\"minDate()\"\n        [max]=\"maxDate()\"\n        (blur)=\"onBlurInput()\"\n        [placeholder]=\"(field().placeholder ?? '') | translate\">\n      \n      <button class=\"c-entry-input__addon icon-calendar-thin\" \n        tabindex=\"-1\"\n        type=\"button\"\n        (click)=\"onCalendarClick($event)\"></button>\n\n        \n    </span>\n    <core-field-errors [errors]=\"errors()\" />\n</label>\n", dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i3$1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i3$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i3.TranslatePipe, name: "translate" }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i3$1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "component", type: FieldErrorsComponent, selector: "core-field-errors", inputs: ["errors"] }] });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.6", type: DateFieldComponent, isStandalone: true, selector: "core-date-field", usesInheritance: true, hostDirectives: [{ directive: CoreHostDirective }], ngImport: i0, template: "<label class=\"c-entry-item\" [class.c-entry-item--inline]=\"field().inline\">\n  <span class=\"c-entry-text\" *ngIf=\"field().label\">\n    {{ field().label | translate }}\n    @if (hasRequiredValidators()) {\n      <span class=\"c-required\">*</span>\n    }\n  </span>\n\n  <span class=\"c-entry-input\"\n      [class.is-placeholder]=\"!formControl().value\"\n      [class.is-invalid]=\"hasError()\">\n      \n      <input type=\"date\"\n        [id]=\"field().key.toString()\"\n        [name]=\"field().key.toString()\"\n        [formControl]=\"formControl()\"\n        [min]=\"minDate()\"\n        [max]=\"maxDate()\"\n        (blur)=\"onBlurInput()\"\n        [placeholder]=\"(field().placeholder ?? '') | translate\">\n      \n      <button class=\"c-entry-input__addon icon-calendar-thin\" \n        tabindex=\"-1\"\n        type=\"button\"\n        (click)=\"onCalendarClick($event)\"></button>\n\n        \n    </span>\n    <core-field-errors [errors]=\"errors()\" />\n</label>\n", dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i3$1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i3$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i3.TranslatePipe, name: "translate" }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i3$1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "component", type: FieldErrorsComponent, selector: "core-field-errors", inputs: ["errors"] }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: DateFieldComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'core-date-field', standalone: true, imports: [CommonModule, FormsModule, TranslateModule, ReactiveFormsModule, FieldErrorsComponent], hostDirectives: [CoreHostDirective], template: "<label class=\"c-entry-item\" [class.c-entry-item--inline]=\"field().inline\">\n  <span class=\"c-entry-text\" *ngIf=\"field().label\">\n    {{ field().label | translate }}\n    @if (hasRequiredValidators()) {\n      <span class=\"c-required\">*</span>\n    }\n  </span>\n\n  <span class=\"c-entry-input\"\n      [class.is-placeholder]=\"!formControl().value\"\n      style=\"--chars: 10\"\n      [class.is-invalid]=\"hasError()\">\n      \n      <input type=\"date\"\n        [id]=\"field().key.toString()\"\n        [name]=\"field().key.toString()\"\n        [formControl]=\"formControl()\"\n        [min]=\"minDate()\"\n        [max]=\"maxDate()\"\n        (blur)=\"onBlurInput()\"\n        [placeholder]=\"(field().placeholder ?? '') | translate\">\n      \n      <button class=\"c-entry-input__addon icon-calendar-thin\" \n        tabindex=\"-1\"\n        type=\"button\"\n        (click)=\"onCalendarClick($event)\"></button>\n\n        \n    </span>\n    <core-field-errors [errors]=\"errors()\" />\n</label>\n" }]
+            args: [{ selector: 'core-date-field', standalone: true, imports: [CommonModule, FormsModule, TranslateModule, ReactiveFormsModule, FieldErrorsComponent], hostDirectives: [CoreHostDirective], template: "<label class=\"c-entry-item\" [class.c-entry-item--inline]=\"field().inline\">\n  <span class=\"c-entry-text\" *ngIf=\"field().label\">\n    {{ field().label | translate }}\n    @if (hasRequiredValidators()) {\n      <span class=\"c-required\">*</span>\n    }\n  </span>\n\n  <span class=\"c-entry-input\"\n      [class.is-placeholder]=\"!formControl().value\"\n      [class.is-invalid]=\"hasError()\">\n      \n      <input type=\"date\"\n        [id]=\"field().key.toString()\"\n        [name]=\"field().key.toString()\"\n        [formControl]=\"formControl()\"\n        [min]=\"minDate()\"\n        [max]=\"maxDate()\"\n        (blur)=\"onBlurInput()\"\n        [placeholder]=\"(field().placeholder ?? '') | translate\">\n      \n      <button class=\"c-entry-input__addon icon-calendar-thin\" \n        tabindex=\"-1\"\n        type=\"button\"\n        (click)=\"onCalendarClick($event)\"></button>\n\n        \n    </span>\n    <core-field-errors [errors]=\"errors()\" />\n</label>\n" }]
         }], ctorParameters: () => [{ type: i0.ElementRef }] });
 
 var TimeInterval;
@@ -1168,11 +1168,11 @@ class DocumentFieldComponent extends BaseFieldComponent {
         return this.fieldConfig().documentNumberPlaceholder || 'Ingrese el número de documento';
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: DocumentFieldComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.6", type: DocumentFieldComponent, isStandalone: true, selector: "core-document-field", usesInheritance: true, hostDirectives: [{ directive: CoreHostDirective }], ngImport: i0, template: "<div class=\"c-entry-group\">\n  <label class=\"c-entry-item\" [class.c-entry-item--inline]=\"field().inline\">\n    <span class=\"c-entry-text\" *ngIf=\"field().label\">\n      {{ field().label | translate }}\n      @if (hasRequiredValidators()) {\n        <span class=\"c-required\">*</span>\n      }\n    </span>\n    <div class=\"c-entry-grid\">\n      <span class=\"c-entry-select\" [style.--chars]=\"documentTypeChars()\">\n        <select \n          [value]=\"documentTypeControl.value\"\n          [disabled]=\"isDisabled()\"\n          (focus)=\"onDocumentTypeFocus()\"\n          (change)=\"onDocumentTypeChange($event)\"\n          (blur)=\"onDocumentTypeBlur()\">\n          <option value=\"\" disabled>{{ getDocumentTypePlaceholder() | translate }}</option>\n          @for (option of documentTypeOptions(); track option.value) {\n            <option [value]=\"option.value\">{{ option.label | translate }}</option>\n          }\n        </select>\n        <span class=\"c-entry-select__arrow icon-arrow-down\"></span>\n      </span>\n      <span class=\"c-entry-input\" [style.--chars]=\"documentNumberChars()\">\n        <input \n          type=\"text\" \n          [value]=\"documentNumberControl.value\"\n          [placeholder]=\"getDocumentNumberPlaceholder() | translate\"\n          [disabled]=\"isDisabled()\"\n          (focus)=\"onDocumentNumberFocus()\"\n          (input)=\"onDocumentNumberChange($event)\"\n          (blur)=\"onDocumentNumberBlur()\">\n      </span>\n    </div>\n  </label>\n</div>\n\n@if (hasError()) {\n  <core-field-errors [errors]=\"errors()\"></core-field-errors>\n}\n", dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i3$1.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i3$1.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i3.TranslatePipe, name: "translate" }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "component", type: FieldErrorsComponent, selector: "core-field-errors", inputs: ["errors"] }] });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.6", type: DocumentFieldComponent, isStandalone: true, selector: "core-document-field", usesInheritance: true, hostDirectives: [{ directive: CoreHostDirective }], ngImport: i0, template: "<div class=\"c-entry-group\">\n  <label class=\"c-entry-item\" [class.c-entry-item--inline]=\"field().inline\">\n    <span class=\"c-entry-text\" *ngIf=\"field().label\">\n      {{ field().label | translate }}\n      @if (hasRequiredValidators()) {\n        <span class=\"c-required\">*</span>\n      }\n    </span>\n    <div class=\"c-entry-grid\">\n      <span class=\"c-entry-select\" [style.--chars]=\"documentTypeChars()\">\n        <select \n          [value]=\"documentTypeControl.value\"\n          [disabled]=\"isDisabled()\"\n          (focus)=\"onDocumentTypeFocus()\"\n          (change)=\"onDocumentTypeChange($event)\"\n          (blur)=\"onDocumentTypeBlur()\">\n          <option value=\"\" disabled>{{ getDocumentTypePlaceholder() | translate }}</option>\n          @for (option of documentTypeOptions(); track option.value) {\n            <option [value]=\"option.value\">{{ option.label | translate }}</option>\n          }\n        </select>\n        <span class=\"c-entry-select__arrow icon-arrow-down\"></span>\n      </span>\n      <span class=\"c-entry-input\" [style.--chars]=\"documentNumberChars()\">\n        <input \n          type=\"text\" \n          [value]=\"documentNumberControl.value\"\n          [placeholder]=\"getDocumentNumberPlaceholder() | translate\"\n          [disabled]=\"isDisabled()\"\n          (focus)=\"onDocumentNumberFocus()\"\n          (input)=\"onDocumentNumberChange($event)\"\n          (blur)=\"onDocumentNumberBlur()\">\n      </span>\n    </div>\n    @if (hasError()) {\n      <core-field-errors [errors]=\"errors()\"></core-field-errors>\n    }\n  </label>\n</div>\n\n\n", dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i3$1.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i3$1.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i3.TranslatePipe, name: "translate" }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "component", type: FieldErrorsComponent, selector: "core-field-errors", inputs: ["errors"] }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: DocumentFieldComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'core-document-field', standalone: true, imports: [CommonModule, FormsModule, TranslateModule, ReactiveFormsModule, FieldErrorsComponent], hostDirectives: [CoreHostDirective], template: "<div class=\"c-entry-group\">\n  <label class=\"c-entry-item\" [class.c-entry-item--inline]=\"field().inline\">\n    <span class=\"c-entry-text\" *ngIf=\"field().label\">\n      {{ field().label | translate }}\n      @if (hasRequiredValidators()) {\n        <span class=\"c-required\">*</span>\n      }\n    </span>\n    <div class=\"c-entry-grid\">\n      <span class=\"c-entry-select\" [style.--chars]=\"documentTypeChars()\">\n        <select \n          [value]=\"documentTypeControl.value\"\n          [disabled]=\"isDisabled()\"\n          (focus)=\"onDocumentTypeFocus()\"\n          (change)=\"onDocumentTypeChange($event)\"\n          (blur)=\"onDocumentTypeBlur()\">\n          <option value=\"\" disabled>{{ getDocumentTypePlaceholder() | translate }}</option>\n          @for (option of documentTypeOptions(); track option.value) {\n            <option [value]=\"option.value\">{{ option.label | translate }}</option>\n          }\n        </select>\n        <span class=\"c-entry-select__arrow icon-arrow-down\"></span>\n      </span>\n      <span class=\"c-entry-input\" [style.--chars]=\"documentNumberChars()\">\n        <input \n          type=\"text\" \n          [value]=\"documentNumberControl.value\"\n          [placeholder]=\"getDocumentNumberPlaceholder() | translate\"\n          [disabled]=\"isDisabled()\"\n          (focus)=\"onDocumentNumberFocus()\"\n          (input)=\"onDocumentNumberChange($event)\"\n          (blur)=\"onDocumentNumberBlur()\">\n      </span>\n    </div>\n  </label>\n</div>\n\n@if (hasError()) {\n  <core-field-errors [errors]=\"errors()\"></core-field-errors>\n}\n" }]
+            args: [{ selector: 'core-document-field', standalone: true, imports: [CommonModule, FormsModule, TranslateModule, ReactiveFormsModule, FieldErrorsComponent], hostDirectives: [CoreHostDirective], template: "<div class=\"c-entry-group\">\n  <label class=\"c-entry-item\" [class.c-entry-item--inline]=\"field().inline\">\n    <span class=\"c-entry-text\" *ngIf=\"field().label\">\n      {{ field().label | translate }}\n      @if (hasRequiredValidators()) {\n        <span class=\"c-required\">*</span>\n      }\n    </span>\n    <div class=\"c-entry-grid\">\n      <span class=\"c-entry-select\" [style.--chars]=\"documentTypeChars()\">\n        <select \n          [value]=\"documentTypeControl.value\"\n          [disabled]=\"isDisabled()\"\n          (focus)=\"onDocumentTypeFocus()\"\n          (change)=\"onDocumentTypeChange($event)\"\n          (blur)=\"onDocumentTypeBlur()\">\n          <option value=\"\" disabled>{{ getDocumentTypePlaceholder() | translate }}</option>\n          @for (option of documentTypeOptions(); track option.value) {\n            <option [value]=\"option.value\">{{ option.label | translate }}</option>\n          }\n        </select>\n        <span class=\"c-entry-select__arrow icon-arrow-down\"></span>\n      </span>\n      <span class=\"c-entry-input\" [style.--chars]=\"documentNumberChars()\">\n        <input \n          type=\"text\" \n          [value]=\"documentNumberControl.value\"\n          [placeholder]=\"getDocumentNumberPlaceholder() | translate\"\n          [disabled]=\"isDisabled()\"\n          (focus)=\"onDocumentNumberFocus()\"\n          (input)=\"onDocumentNumberChange($event)\"\n          (blur)=\"onDocumentNumberBlur()\">\n      </span>\n    </div>\n    @if (hasError()) {\n      <core-field-errors [errors]=\"errors()\"></core-field-errors>\n    }\n  </label>\n</div>\n\n\n" }]
         }], ctorParameters: () => [] });
 
 // icon-compat.pipe.ts
@@ -6353,14 +6353,16 @@ class GenericStepsComponent {
     }
     getStepClasses(step) {
         const classes = ['c-steps__item'];
-        if (!step.disabled) {
+        const currentActiveId = this.currentActiveStepId();
+        const isCurrentStep = step.id === currentActiveId;
+        const hasInteractiveStatus = step.status === StepStatus.ACTIVE || step.status === StepStatus.COMPLETE;
+        if (!step.disabled && (hasInteractiveStatus || isCurrentStep)) {
             classes.push('is-active');
         }
         if (step.status === StepStatus.COMPLETE) {
             classes.push('is-complete');
         }
-        const currentActiveId = this.currentActiveStepId();
-        if (step.id === currentActiveId) {
+        if (isCurrentStep) {
             classes.push('is-active-step');
         }
         if (step.status === StepStatus.PENDING) {
@@ -10783,12 +10785,15 @@ class TableActionService {
     initializeDefaultData(fields, template, isEditMode = false) {
         const newData = Object.create(Object.getPrototypeOf(template));
         const defaultValues = {};
-        if (isEditMode) {
+        // En EDIT mode, copiar todos los valores del template
+        // En CREATE mode, también copiar valores que vengan del template (datos prellenados por IA)
+        if (isEditMode || template) {
             Object.assign(defaultValues, template);
         }
         fields.forEach(field => {
             const key = field.key;
-            if (isEditMode && defaultValues[key] !== undefined && defaultValues[key] !== null) {
+            // Si ya hay un valor (de template), usarlo
+            if (defaultValues[key] !== undefined && defaultValues[key] !== null) {
                 if (field.type === FieldType.SELECT) {
                     const value = defaultValues[key];
                     if (field.multiple) {
@@ -10811,8 +10816,9 @@ class TableActionService {
                             : '');
                     }
                 }
-                return;
+                return; // Ya tiene valor, no asignar defaultValue del campo
             }
+            // Solo si NO hay valor del template, usar el defaultValue del campo
             switch (field.type) {
                 case FieldType.CHECKBOX:
                     defaultValues[key] = (field.defaultValue ?? false);
@@ -16276,12 +16282,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.6", ngImpor
 // Este archivo es generado automáticamente por scripts/update-version.js
 // No edites manualmente este archivo
 const VERSION = {
-    full: '2.15.35',
+    full: '2.15.36',
     major: 2,
     minor: 15,
-    patch: 35,
-    timestamp: '2025-11-14T15:54:22.049Z',
-    buildDate: '14/11/2025'
+    patch: 36,
+    timestamp: '2025-11-19T17:12:00.703Z',
+    buildDate: '19/11/2025'
 };
 
 class MainNavComponent {
@@ -16297,7 +16303,7 @@ class MainNavComponent {
     isBottomNavOpen = false;
     expandedSections = {};
     routerSubscription = new Subscription();
-    user = this.authService.getLoggedStartData();
+    authenticatedUser = this.authService.getLoggedStartData();
     navConfig = input({});
     appVersion = input({ full: VERSION.full });
     navItems = input([]);
@@ -16308,6 +16314,9 @@ class MainNavComponent {
     expandedLogo = input('');
     onLogout = output();
     constructor() { }
+    get userConfig() {
+        return this.navConfig().userInfo;
+    }
     getCollapsedLogoSrc() {
         return this.logoImagesConfig()?.collapsedSettings.image || this.collapsedLogo() || '';
     }
@@ -16372,6 +16381,23 @@ class MainNavComponent {
             this.updateSidebarWidth();
         }
     }
+    shouldShowUserSection() {
+        if (this.userConfig?.showUser === false) {
+            return false;
+        }
+        return Boolean(this.userConfig || this.getFallbackUserName());
+    }
+    getFallbackUserName() {
+        const user = this.authenticatedUser;
+        if (!user) {
+            return '';
+        }
+        return (user.full_name ||
+            user.name ||
+            user.username ||
+            user.email ||
+            '');
+    }
     hasPermission(item) {
         if (!item.requiredPermission) {
             return true;
@@ -16585,11 +16611,11 @@ class MainNavComponent {
         });
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: MainNavComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.6", type: MainNavComponent, isStandalone: true, selector: "core-main-nav", inputs: { navConfig: { classPropertyName: "navConfig", publicName: "navConfig", isSignal: true, isRequired: false, transformFunction: null }, appVersion: { classPropertyName: "appVersion", publicName: "appVersion", isSignal: true, isRequired: false, transformFunction: null }, navItems: { classPropertyName: "navItems", publicName: "navItems", isSignal: true, isRequired: false, transformFunction: null }, bottomNavItems: { classPropertyName: "bottomNavItems", publicName: "bottomNavItems", isSignal: true, isRequired: false, transformFunction: null }, isProduction: { classPropertyName: "isProduction", publicName: "isProduction", isSignal: true, isRequired: false, transformFunction: null }, logoImagesConfig: { classPropertyName: "logoImagesConfig", publicName: "logoImagesConfig", isSignal: true, isRequired: false, transformFunction: null }, collapsedLogo: { classPropertyName: "collapsedLogo", publicName: "collapsedLogo", isSignal: true, isRequired: false, transformFunction: null }, expandedLogo: { classPropertyName: "expandedLogo", publicName: "expandedLogo", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { onLogout: "onLogout" }, usesOnChanges: true, hostDirectives: [{ directive: CoreHostDirective }], ngImport: i0, template: "\n<!-- ! Refactor: Start -->\n<div class=\"c-nav-overlay\" (click)=\"toggleMobileNav()\"></div>\n<div class=\"o-layout__nav c-main-nav\"> <!-- [ngClass]=\"{'nav-expanded': !isCollapsed}\"> -->\n  <div class=\"c-main-nav__viewport\">\n\n    <!-- Toggle btn -->\n    <button (click)=\"onToggleSidebar()\"\n      class=\"c-main-nav__toggle c-mn-toggle\"\n      [title]=\"isCollapsed ? ('Expandir navegaci\u00F3n' | translate) : ('Colapsar navegaci\u00F3n' | translate )\"\n      aria-label=\"Expandir navegaci\u00F3n\"\n      ></button>\n\n    <!-- Brand -->\n    @if(navConfig().showLogo !== false) {\n      <div class=\"c-main-nav__brand c-mn-brand\">\n        @if(getCollapsedLogoSrc()) {\n          <img class=\"c-mn-brand__iso\" \n              [src]=\"getCollapsedLogoSrc()\" \n              [width]=\"getCollapsedLogoSettings().width\" \n              [height]=\"getCollapsedLogoSettings().height\" \n              [alt]=\"getCollapsedLogoSettings().alt\">\n        }\n        @if(getExpandedLogoSrc()) {\n          <img class=\"c-mn-brand__logo\" \n              [src]=\"getExpandedLogoSrc()\" \n              [width]=\"getExpandedLogoSettings().width\" \n              [height]=\"getExpandedLogoSettings().height\" \n              [alt]=\"getExpandedLogoSettings().alt\">\n        }\n      </div>\n    }\n\n    <!-- Nav -->\n    <nav class=\"c-main-nav__nav c-mn-nav\">\n      <ul class=\"c-mn-nav__list\">\n\n        <ng-template #menuItems let-items=\"items\" let-level=\"level\">\n          <ng-container *ngFor=\"let item of items; let i = index\">\n            <ng-container *ngIf=\"hasPermission(item) && !item.hidden && (!item.children || hasVisibleChildren(item))\">\n\n              <li class=\"c-mn-nav__item c-mn-nav__submenu\"\n                [ngClass]=\"{'is-expanded': isSectionExpanded(item.label, level)}\"\n                *ngIf=\"item.children && hasVisibleChildren(item); else singleLink\"\n                >\n                \n                <button class=\"c-mn-nav__link\"\n                  [ngClass]=\"{'is-active': isParentActive(item)}\"\n                  (click)=\"toggleSection(item.label, level)\"\n                  [title]=\"isCollapsed ? (item.label | translate) : ''\">\n                  <span class=\"c-mn-nav__icon\" [ngClass]=\"item.icon | coreIconCompat\"></span>\n                  <span class=\"c-mn-nav__text\">\n                    {{ item.label | translate }}\n                    <span class=\"c-mn-nav__plus\"></span>\n                  </span>\n                </button>\n\n                <div class=\"c-mn-nav__subholder\">\n                  <ul class=\"c-mn-nav__sublist\">\n\n                    <ng-container *ngFor=\"let child of item.children; let j = index\">\n                      <ng-container *ngIf=\"hasPermission(child) && !child.hidden && (!child.children || hasVisibleChildren(child))\">\n\n                        <ng-container *ngIf=\"!child.children; else nestedChild\">\n\n                          <li class=\"c-mn-nav__subitem\">\n                             <button class=\"c-mn-nav__sublink\"\n                                [routerLink]=\"child.disabled ? null : child.path\" \n                                routerLinkActive=\"is-active\"\n                                 [routerLinkActiveOptions]=\"{ exact: false }\" \n                                 [title]=\"isCollapsed ? (child.label | translate) : ''\"\n                                 [ngClass]=\"{'is-disabled': child.disabled}\"\n                                 [style.pointer-events]=\"child.disabled ? 'none' : 'auto'\"\n                                 [style.opacity]=\"child.disabled ? '0.5' : '1'\"\n                              >\n                              {{ child.label | translate }}\n                            </button>\n                          </li>\n                        </ng-container>\n\n                        <ng-template #nestedChild>\n                          \n                          <li class=\"c-mn-nav__subitem\"\n                            [ngClass]=\"{'submenu-open': isSectionExpanded(child.label, level + 1) && !isCollapsed}\"\n                            *ngIf=\"child.children && hasVisibleChildren(child)\"\n                            >\n                            <button class=\"c-mn-nav__sublink\"\n                              [ngClass]=\"{'is-active': isParentActive(child)}\"\n                              (click)=\"toggleSection(child.label, level + 1)\"\n                              [title]=\"isCollapsed ? (child.label | translate) : ''\"\n                              >\n                                {{ child.label | translate }}\n                            </button>\n\n                            <div class=\"c-mn-nav__subholder\">\n                              <ul class=\"c-mn-nav__sublist\">\n\n                                <ng-container *ngFor=\"let subItem of child.children\">\n                                  <li class=\"c-mn-nav__subitem\"\n                                    *ngIf=\"hasPermission(subItem) && !subItem.hidden\"\n                                    >\n                                    <button class=\"c-mn-nav__sublink\"\n                                      [routerLink]=\"subItem.path\"\n                                      routerLinkActive=\"is-active\"\n                                      >\n                                      {{ subItem.label | translate }}\n                                    </button>\n                                  </li>\n                                </ng-container>\n\n                              </ul>\n                            </div>\n                          </li>\n                        </ng-template>\n\n                      </ng-container>\n                    </ng-container>\n                  </ul>\n                </div>\n            </li>\n\n              <ng-template #singleLink>\n\n                <li class=\"c-mn-nav__item\">\n                  <button class=\"c-mn-nav__link\"\n                    [routerLink]=\"item.disabled ? null : item.path\" \n                    routerLinkActive=\"is-active\"\n                    [routerLinkActiveOptions]=\"{ exact: false }\" \n                    [title]=\"isCollapsed ? (item.label | translate) : ''\" \n                    [ngClass]=\"{'is-disabled': item.disabled}\"\n                    [disabled]=\"item.disabled\"\n                    [style.opacity]=\"item.disabled ? '0.5' : '1'\"\n                    >\n                    <span class=\"c-mn-nav__icon\" [ngClass]=\"item.icon | coreIconCompat\"></span>\n                    <span class=\"c-mn-nav__text\">\n                      {{ item.label | translate }}\n                    </span>\n                  </button>\n                </li>\n              </ng-template>\n\n\n            </ng-container>\n          </ng-container>\n        </ng-template>\n                \n        <ng-container *ngTemplateOutlet=\"menuItems; context: { items: navItems(), level: 0 }\"></ng-container>\n\n      </ul>\n    </nav> <!-- .c-mn-nav -->\n\n    <!-- TODO User -->\n\n    <nav class=\"c-main-nav__bottom c-mn-nav\">\n      <ul class=\"c-mn-nav__list\">\n        <li class=\"c-mn-nav__item\">\n          <button class=\"c-mn-nav__link\"\n            (click)=\"logout()\"\n            [title]=\"isCollapsed ? ('sidebar.logout' | translate) : ''\"\n            >\n            <span class=\"c-mn-nav__icon icon-logout\"></span>\n            <span class=\"c-mn-nav__text\">\n              {{ 'sidebar.logout' | translate }}\n            </span>\n          </button>\n        </li>\n        @if(navConfig().showVersion !== false) {\n          <li class=\"c-mn-nav__version\">\n              v{{ appVersion().full }}\n          </li>\n        }\n      </ul>\n    </nav>\n\n  </div> <!-- .c-main-nav__viewport -->\n</div> <!-- .c-main-nav -->\n\n<!-- ! Refactor: End -->\n\n", dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i3.TranslatePipe, name: "translate" }, { kind: "ngmodule", type: RouterModule }, { kind: "directive", type: i4.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "directive", type: i4.RouterLinkActive, selector: "[routerLinkActive]", inputs: ["routerLinkActiveOptions", "ariaCurrentWhenActive", "routerLinkActive"], outputs: ["isActiveChange"], exportAs: ["routerLinkActive"] }, { kind: "pipe", type: IconCompatPipe, name: "coreIconCompat" }] });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.6", type: MainNavComponent, isStandalone: true, selector: "core-main-nav", inputs: { navConfig: { classPropertyName: "navConfig", publicName: "navConfig", isSignal: true, isRequired: false, transformFunction: null }, appVersion: { classPropertyName: "appVersion", publicName: "appVersion", isSignal: true, isRequired: false, transformFunction: null }, navItems: { classPropertyName: "navItems", publicName: "navItems", isSignal: true, isRequired: false, transformFunction: null }, bottomNavItems: { classPropertyName: "bottomNavItems", publicName: "bottomNavItems", isSignal: true, isRequired: false, transformFunction: null }, isProduction: { classPropertyName: "isProduction", publicName: "isProduction", isSignal: true, isRequired: false, transformFunction: null }, logoImagesConfig: { classPropertyName: "logoImagesConfig", publicName: "logoImagesConfig", isSignal: true, isRequired: false, transformFunction: null }, collapsedLogo: { classPropertyName: "collapsedLogo", publicName: "collapsedLogo", isSignal: true, isRequired: false, transformFunction: null }, expandedLogo: { classPropertyName: "expandedLogo", publicName: "expandedLogo", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { onLogout: "onLogout" }, usesOnChanges: true, hostDirectives: [{ directive: CoreHostDirective }], ngImport: i0, template: "\n<!-- ! Refactor: Start -->\n<div class=\"c-nav-overlay\" (click)=\"toggleMobileNav()\"></div>\n<div class=\"o-layout__nav c-main-nav\"> <!-- [ngClass]=\"{'nav-expanded': !isCollapsed}\"> -->\n  <div class=\"c-main-nav__viewport\">\n\n    <!-- Toggle btn -->\n    <button (click)=\"onToggleSidebar()\"\n      class=\"c-main-nav__toggle c-mn-toggle\"\n      [title]=\"isCollapsed ? ('Expandir navegaci\u00F3n' | translate) : ('Colapsar navegaci\u00F3n' | translate )\"\n      aria-label=\"Expandir navegaci\u00F3n\"\n      ></button>\n\n    <!-- Brand -->\n    @if(navConfig().showLogo !== false) {\n      <div class=\"c-main-nav__brand c-mn-brand\">\n        @if(getCollapsedLogoSrc()) {\n          <img class=\"c-mn-brand__iso\" \n              [src]=\"getCollapsedLogoSrc()\" \n              [width]=\"getCollapsedLogoSettings().width\" \n              [height]=\"getCollapsedLogoSettings().height\" \n              [alt]=\"getCollapsedLogoSettings().alt\">\n        }\n        @if(getExpandedLogoSrc()) {\n          <img class=\"c-mn-brand__logo\" \n              [src]=\"getExpandedLogoSrc()\" \n              [width]=\"getExpandedLogoSettings().width\" \n              [height]=\"getExpandedLogoSettings().height\" \n              [alt]=\"getExpandedLogoSettings().alt\">\n        }\n      </div>\n    }\n\n    <!-- User -->\n    @if(shouldShowUserSection()) {\n      <div class=\"c-main-nav__user c-mn-user\">\n        <p class=\"c-mn-user__welcome\">\n          @if(userConfig?.greetingKey) {\n            {{ (userConfig?.greetingKey ?? '') | translate }}\n          } @else if(userConfig?.greetingText) {\n            {{ userConfig?.greetingText }}\n          } @else {\n            Bienvenido/a,\n          }\n        </p>\n        <p class=\"c-mn-user__name\">\n          @if(userConfig?.nameKey) {\n            {{ (userConfig?.nameKey ?? '') | translate }}\n          } @else if(userConfig?.name) {\n            {{ userConfig?.name }}\n          } @else {\n            {{ getFallbackUserName() }}\n          }\n        </p>\n      </div>\n    }\n\n    <!-- Nav -->\n    <nav class=\"c-main-nav__nav c-mn-nav\">\n      <ul class=\"c-mn-nav__list\">\n\n        <ng-template #menuItems let-items=\"items\" let-level=\"level\">\n          <ng-container *ngFor=\"let item of items; let i = index\">\n            <ng-container *ngIf=\"hasPermission(item) && !item.hidden && (!item.children || hasVisibleChildren(item))\">\n\n              <li class=\"c-mn-nav__item c-mn-nav__submenu\"\n                [ngClass]=\"{'is-expanded': isSectionExpanded(item.label, level)}\"\n                *ngIf=\"item.children && hasVisibleChildren(item); else singleLink\"\n                >\n                \n                <button class=\"c-mn-nav__link\"\n                  [ngClass]=\"{'is-active': isParentActive(item)}\"\n                  (click)=\"toggleSection(item.label, level)\"\n                  [title]=\"isCollapsed ? (item.label | translate) : ''\">\n                  <span class=\"c-mn-nav__icon\" [ngClass]=\"item.icon | coreIconCompat\"></span>\n                  <span class=\"c-mn-nav__text\">\n                    {{ item.label | translate }}\n                    <span class=\"c-mn-nav__plus\"></span>\n                  </span>\n                </button>\n\n                <div class=\"c-mn-nav__subholder\">\n                  <ul class=\"c-mn-nav__sublist\">\n\n                    <ng-container *ngFor=\"let child of item.children; let j = index\">\n                      <ng-container *ngIf=\"hasPermission(child) && !child.hidden && (!child.children || hasVisibleChildren(child))\">\n\n                        <ng-container *ngIf=\"!child.children; else nestedChild\">\n\n                          <li class=\"c-mn-nav__subitem\">\n                             <button class=\"c-mn-nav__sublink\"\n                                [routerLink]=\"child.disabled ? null : child.path\" \n                                routerLinkActive=\"is-active\"\n                                 [routerLinkActiveOptions]=\"{ exact: false }\" \n                                 [title]=\"isCollapsed ? (child.label | translate) : ''\"\n                                 [ngClass]=\"{'is-disabled': child.disabled}\"\n                                 [style.pointer-events]=\"child.disabled ? 'none' : 'auto'\"\n                                 [style.opacity]=\"child.disabled ? '0.5' : '1'\"\n                              >\n                              {{ child.label | translate }}\n                            </button>\n                          </li>\n                        </ng-container>\n\n                        <ng-template #nestedChild>\n                          \n                          <li class=\"c-mn-nav__subitem\"\n                            [ngClass]=\"{'submenu-open': isSectionExpanded(child.label, level + 1) && !isCollapsed}\"\n                            *ngIf=\"child.children && hasVisibleChildren(child)\"\n                            >\n                            <button class=\"c-mn-nav__sublink\"\n                              [ngClass]=\"{'is-active': isParentActive(child)}\"\n                              (click)=\"toggleSection(child.label, level + 1)\"\n                              [title]=\"isCollapsed ? (child.label | translate) : ''\"\n                              >\n                                {{ child.label | translate }}\n                            </button>\n\n                            <div class=\"c-mn-nav__subholder\">\n                              <ul class=\"c-mn-nav__sublist\">\n\n                                <ng-container *ngFor=\"let subItem of child.children\">\n                                  <li class=\"c-mn-nav__subitem\"\n                                    *ngIf=\"hasPermission(subItem) && !subItem.hidden\"\n                                    >\n                                    <button class=\"c-mn-nav__sublink\"\n                                      [routerLink]=\"subItem.path\"\n                                      routerLinkActive=\"is-active\"\n                                      >\n                                      {{ subItem.label | translate }}\n                                    </button>\n                                  </li>\n                                </ng-container>\n\n                              </ul>\n                            </div>\n                          </li>\n                        </ng-template>\n\n                      </ng-container>\n                    </ng-container>\n                  </ul>\n                </div>\n            </li>\n\n              <ng-template #singleLink>\n\n                <li class=\"c-mn-nav__item\">\n                  <button class=\"c-mn-nav__link\"\n                    [routerLink]=\"item.disabled ? null : item.path\" \n                    routerLinkActive=\"is-active\"\n                    [routerLinkActiveOptions]=\"{ exact: false }\" \n                    [title]=\"isCollapsed ? (item.label | translate) : ''\" \n                    [ngClass]=\"{'is-disabled': item.disabled}\"\n                    [disabled]=\"item.disabled\"\n                    [style.opacity]=\"item.disabled ? '0.5' : '1'\"\n                    >\n                    <span class=\"c-mn-nav__icon\" [ngClass]=\"item.icon | coreIconCompat\"></span>\n                    <span class=\"c-mn-nav__text\">\n                      {{ item.label | translate }}\n                    </span>\n                  </button>\n                </li>\n              </ng-template>\n\n\n            </ng-container>\n          </ng-container>\n        </ng-template>\n                \n        <ng-container *ngTemplateOutlet=\"menuItems; context: { items: navItems(), level: 0 }\"></ng-container>\n\n      </ul>\n    </nav> <!-- .c-mn-nav -->\n\n    <!-- TODO User -->\n\n    <nav class=\"c-main-nav__bottom c-mn-nav\">\n      <ul class=\"c-mn-nav__list\">\n        <li class=\"c-mn-nav__item\">\n          <button class=\"c-mn-nav__link\"\n            (click)=\"logout()\"\n            [title]=\"isCollapsed ? ('sidebar.logout' | translate) : ''\"\n            >\n            <span class=\"c-mn-nav__icon icon-logout\"></span>\n            <span class=\"c-mn-nav__text\">\n              {{ 'sidebar.logout' | translate }}\n            </span>\n          </button>\n        </li>\n        @if(navConfig().showVersion !== false) {\n          <li class=\"c-mn-nav__version\">\n              v{{ appVersion().full }}\n          </li>\n        }\n      </ul>\n    </nav>\n\n  </div> <!-- .c-main-nav__viewport -->\n</div> <!-- .c-main-nav -->\n\n<!-- ! Refactor: End -->\n\n", dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i3.TranslatePipe, name: "translate" }, { kind: "ngmodule", type: RouterModule }, { kind: "directive", type: i4.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "directive", type: i4.RouterLinkActive, selector: "[routerLinkActive]", inputs: ["routerLinkActiveOptions", "ariaCurrentWhenActive", "routerLinkActive"], outputs: ["isActiveChange"], exportAs: ["routerLinkActive"] }, { kind: "pipe", type: IconCompatPipe, name: "coreIconCompat" }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: MainNavComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'core-main-nav', standalone: true, imports: [CommonModule, TranslateModule, RouterModule, IconCompatPipe], hostDirectives: [CoreHostDirective], template: "\n<!-- ! Refactor: Start -->\n<div class=\"c-nav-overlay\" (click)=\"toggleMobileNav()\"></div>\n<div class=\"o-layout__nav c-main-nav\"> <!-- [ngClass]=\"{'nav-expanded': !isCollapsed}\"> -->\n  <div class=\"c-main-nav__viewport\">\n\n    <!-- Toggle btn -->\n    <button (click)=\"onToggleSidebar()\"\n      class=\"c-main-nav__toggle c-mn-toggle\"\n      [title]=\"isCollapsed ? ('Expandir navegaci\u00F3n' | translate) : ('Colapsar navegaci\u00F3n' | translate )\"\n      aria-label=\"Expandir navegaci\u00F3n\"\n      ></button>\n\n    <!-- Brand -->\n    @if(navConfig().showLogo !== false) {\n      <div class=\"c-main-nav__brand c-mn-brand\">\n        @if(getCollapsedLogoSrc()) {\n          <img class=\"c-mn-brand__iso\" \n              [src]=\"getCollapsedLogoSrc()\" \n              [width]=\"getCollapsedLogoSettings().width\" \n              [height]=\"getCollapsedLogoSettings().height\" \n              [alt]=\"getCollapsedLogoSettings().alt\">\n        }\n        @if(getExpandedLogoSrc()) {\n          <img class=\"c-mn-brand__logo\" \n              [src]=\"getExpandedLogoSrc()\" \n              [width]=\"getExpandedLogoSettings().width\" \n              [height]=\"getExpandedLogoSettings().height\" \n              [alt]=\"getExpandedLogoSettings().alt\">\n        }\n      </div>\n    }\n\n    <!-- Nav -->\n    <nav class=\"c-main-nav__nav c-mn-nav\">\n      <ul class=\"c-mn-nav__list\">\n\n        <ng-template #menuItems let-items=\"items\" let-level=\"level\">\n          <ng-container *ngFor=\"let item of items; let i = index\">\n            <ng-container *ngIf=\"hasPermission(item) && !item.hidden && (!item.children || hasVisibleChildren(item))\">\n\n              <li class=\"c-mn-nav__item c-mn-nav__submenu\"\n                [ngClass]=\"{'is-expanded': isSectionExpanded(item.label, level)}\"\n                *ngIf=\"item.children && hasVisibleChildren(item); else singleLink\"\n                >\n                \n                <button class=\"c-mn-nav__link\"\n                  [ngClass]=\"{'is-active': isParentActive(item)}\"\n                  (click)=\"toggleSection(item.label, level)\"\n                  [title]=\"isCollapsed ? (item.label | translate) : ''\">\n                  <span class=\"c-mn-nav__icon\" [ngClass]=\"item.icon | coreIconCompat\"></span>\n                  <span class=\"c-mn-nav__text\">\n                    {{ item.label | translate }}\n                    <span class=\"c-mn-nav__plus\"></span>\n                  </span>\n                </button>\n\n                <div class=\"c-mn-nav__subholder\">\n                  <ul class=\"c-mn-nav__sublist\">\n\n                    <ng-container *ngFor=\"let child of item.children; let j = index\">\n                      <ng-container *ngIf=\"hasPermission(child) && !child.hidden && (!child.children || hasVisibleChildren(child))\">\n\n                        <ng-container *ngIf=\"!child.children; else nestedChild\">\n\n                          <li class=\"c-mn-nav__subitem\">\n                             <button class=\"c-mn-nav__sublink\"\n                                [routerLink]=\"child.disabled ? null : child.path\" \n                                routerLinkActive=\"is-active\"\n                                 [routerLinkActiveOptions]=\"{ exact: false }\" \n                                 [title]=\"isCollapsed ? (child.label | translate) : ''\"\n                                 [ngClass]=\"{'is-disabled': child.disabled}\"\n                                 [style.pointer-events]=\"child.disabled ? 'none' : 'auto'\"\n                                 [style.opacity]=\"child.disabled ? '0.5' : '1'\"\n                              >\n                              {{ child.label | translate }}\n                            </button>\n                          </li>\n                        </ng-container>\n\n                        <ng-template #nestedChild>\n                          \n                          <li class=\"c-mn-nav__subitem\"\n                            [ngClass]=\"{'submenu-open': isSectionExpanded(child.label, level + 1) && !isCollapsed}\"\n                            *ngIf=\"child.children && hasVisibleChildren(child)\"\n                            >\n                            <button class=\"c-mn-nav__sublink\"\n                              [ngClass]=\"{'is-active': isParentActive(child)}\"\n                              (click)=\"toggleSection(child.label, level + 1)\"\n                              [title]=\"isCollapsed ? (child.label | translate) : ''\"\n                              >\n                                {{ child.label | translate }}\n                            </button>\n\n                            <div class=\"c-mn-nav__subholder\">\n                              <ul class=\"c-mn-nav__sublist\">\n\n                                <ng-container *ngFor=\"let subItem of child.children\">\n                                  <li class=\"c-mn-nav__subitem\"\n                                    *ngIf=\"hasPermission(subItem) && !subItem.hidden\"\n                                    >\n                                    <button class=\"c-mn-nav__sublink\"\n                                      [routerLink]=\"subItem.path\"\n                                      routerLinkActive=\"is-active\"\n                                      >\n                                      {{ subItem.label | translate }}\n                                    </button>\n                                  </li>\n                                </ng-container>\n\n                              </ul>\n                            </div>\n                          </li>\n                        </ng-template>\n\n                      </ng-container>\n                    </ng-container>\n                  </ul>\n                </div>\n            </li>\n\n              <ng-template #singleLink>\n\n                <li class=\"c-mn-nav__item\">\n                  <button class=\"c-mn-nav__link\"\n                    [routerLink]=\"item.disabled ? null : item.path\" \n                    routerLinkActive=\"is-active\"\n                    [routerLinkActiveOptions]=\"{ exact: false }\" \n                    [title]=\"isCollapsed ? (item.label | translate) : ''\" \n                    [ngClass]=\"{'is-disabled': item.disabled}\"\n                    [disabled]=\"item.disabled\"\n                    [style.opacity]=\"item.disabled ? '0.5' : '1'\"\n                    >\n                    <span class=\"c-mn-nav__icon\" [ngClass]=\"item.icon | coreIconCompat\"></span>\n                    <span class=\"c-mn-nav__text\">\n                      {{ item.label | translate }}\n                    </span>\n                  </button>\n                </li>\n              </ng-template>\n\n\n            </ng-container>\n          </ng-container>\n        </ng-template>\n                \n        <ng-container *ngTemplateOutlet=\"menuItems; context: { items: navItems(), level: 0 }\"></ng-container>\n\n      </ul>\n    </nav> <!-- .c-mn-nav -->\n\n    <!-- TODO User -->\n\n    <nav class=\"c-main-nav__bottom c-mn-nav\">\n      <ul class=\"c-mn-nav__list\">\n        <li class=\"c-mn-nav__item\">\n          <button class=\"c-mn-nav__link\"\n            (click)=\"logout()\"\n            [title]=\"isCollapsed ? ('sidebar.logout' | translate) : ''\"\n            >\n            <span class=\"c-mn-nav__icon icon-logout\"></span>\n            <span class=\"c-mn-nav__text\">\n              {{ 'sidebar.logout' | translate }}\n            </span>\n          </button>\n        </li>\n        @if(navConfig().showVersion !== false) {\n          <li class=\"c-mn-nav__version\">\n              v{{ appVersion().full }}\n          </li>\n        }\n      </ul>\n    </nav>\n\n  </div> <!-- .c-main-nav__viewport -->\n</div> <!-- .c-main-nav -->\n\n<!-- ! Refactor: End -->\n\n" }]
+            args: [{ selector: 'core-main-nav', standalone: true, imports: [CommonModule, TranslateModule, RouterModule, IconCompatPipe], hostDirectives: [CoreHostDirective], template: "\n<!-- ! Refactor: Start -->\n<div class=\"c-nav-overlay\" (click)=\"toggleMobileNav()\"></div>\n<div class=\"o-layout__nav c-main-nav\"> <!-- [ngClass]=\"{'nav-expanded': !isCollapsed}\"> -->\n  <div class=\"c-main-nav__viewport\">\n\n    <!-- Toggle btn -->\n    <button (click)=\"onToggleSidebar()\"\n      class=\"c-main-nav__toggle c-mn-toggle\"\n      [title]=\"isCollapsed ? ('Expandir navegaci\u00F3n' | translate) : ('Colapsar navegaci\u00F3n' | translate )\"\n      aria-label=\"Expandir navegaci\u00F3n\"\n      ></button>\n\n    <!-- Brand -->\n    @if(navConfig().showLogo !== false) {\n      <div class=\"c-main-nav__brand c-mn-brand\">\n        @if(getCollapsedLogoSrc()) {\n          <img class=\"c-mn-brand__iso\" \n              [src]=\"getCollapsedLogoSrc()\" \n              [width]=\"getCollapsedLogoSettings().width\" \n              [height]=\"getCollapsedLogoSettings().height\" \n              [alt]=\"getCollapsedLogoSettings().alt\">\n        }\n        @if(getExpandedLogoSrc()) {\n          <img class=\"c-mn-brand__logo\" \n              [src]=\"getExpandedLogoSrc()\" \n              [width]=\"getExpandedLogoSettings().width\" \n              [height]=\"getExpandedLogoSettings().height\" \n              [alt]=\"getExpandedLogoSettings().alt\">\n        }\n      </div>\n    }\n\n    <!-- User -->\n    @if(shouldShowUserSection()) {\n      <div class=\"c-main-nav__user c-mn-user\">\n        <p class=\"c-mn-user__welcome\">\n          @if(userConfig?.greetingKey) {\n            {{ (userConfig?.greetingKey ?? '') | translate }}\n          } @else if(userConfig?.greetingText) {\n            {{ userConfig?.greetingText }}\n          } @else {\n            Bienvenido/a,\n          }\n        </p>\n        <p class=\"c-mn-user__name\">\n          @if(userConfig?.nameKey) {\n            {{ (userConfig?.nameKey ?? '') | translate }}\n          } @else if(userConfig?.name) {\n            {{ userConfig?.name }}\n          } @else {\n            {{ getFallbackUserName() }}\n          }\n        </p>\n      </div>\n    }\n\n    <!-- Nav -->\n    <nav class=\"c-main-nav__nav c-mn-nav\">\n      <ul class=\"c-mn-nav__list\">\n\n        <ng-template #menuItems let-items=\"items\" let-level=\"level\">\n          <ng-container *ngFor=\"let item of items; let i = index\">\n            <ng-container *ngIf=\"hasPermission(item) && !item.hidden && (!item.children || hasVisibleChildren(item))\">\n\n              <li class=\"c-mn-nav__item c-mn-nav__submenu\"\n                [ngClass]=\"{'is-expanded': isSectionExpanded(item.label, level)}\"\n                *ngIf=\"item.children && hasVisibleChildren(item); else singleLink\"\n                >\n                \n                <button class=\"c-mn-nav__link\"\n                  [ngClass]=\"{'is-active': isParentActive(item)}\"\n                  (click)=\"toggleSection(item.label, level)\"\n                  [title]=\"isCollapsed ? (item.label | translate) : ''\">\n                  <span class=\"c-mn-nav__icon\" [ngClass]=\"item.icon | coreIconCompat\"></span>\n                  <span class=\"c-mn-nav__text\">\n                    {{ item.label | translate }}\n                    <span class=\"c-mn-nav__plus\"></span>\n                  </span>\n                </button>\n\n                <div class=\"c-mn-nav__subholder\">\n                  <ul class=\"c-mn-nav__sublist\">\n\n                    <ng-container *ngFor=\"let child of item.children; let j = index\">\n                      <ng-container *ngIf=\"hasPermission(child) && !child.hidden && (!child.children || hasVisibleChildren(child))\">\n\n                        <ng-container *ngIf=\"!child.children; else nestedChild\">\n\n                          <li class=\"c-mn-nav__subitem\">\n                             <button class=\"c-mn-nav__sublink\"\n                                [routerLink]=\"child.disabled ? null : child.path\" \n                                routerLinkActive=\"is-active\"\n                                 [routerLinkActiveOptions]=\"{ exact: false }\" \n                                 [title]=\"isCollapsed ? (child.label | translate) : ''\"\n                                 [ngClass]=\"{'is-disabled': child.disabled}\"\n                                 [style.pointer-events]=\"child.disabled ? 'none' : 'auto'\"\n                                 [style.opacity]=\"child.disabled ? '0.5' : '1'\"\n                              >\n                              {{ child.label | translate }}\n                            </button>\n                          </li>\n                        </ng-container>\n\n                        <ng-template #nestedChild>\n                          \n                          <li class=\"c-mn-nav__subitem\"\n                            [ngClass]=\"{'submenu-open': isSectionExpanded(child.label, level + 1) && !isCollapsed}\"\n                            *ngIf=\"child.children && hasVisibleChildren(child)\"\n                            >\n                            <button class=\"c-mn-nav__sublink\"\n                              [ngClass]=\"{'is-active': isParentActive(child)}\"\n                              (click)=\"toggleSection(child.label, level + 1)\"\n                              [title]=\"isCollapsed ? (child.label | translate) : ''\"\n                              >\n                                {{ child.label | translate }}\n                            </button>\n\n                            <div class=\"c-mn-nav__subholder\">\n                              <ul class=\"c-mn-nav__sublist\">\n\n                                <ng-container *ngFor=\"let subItem of child.children\">\n                                  <li class=\"c-mn-nav__subitem\"\n                                    *ngIf=\"hasPermission(subItem) && !subItem.hidden\"\n                                    >\n                                    <button class=\"c-mn-nav__sublink\"\n                                      [routerLink]=\"subItem.path\"\n                                      routerLinkActive=\"is-active\"\n                                      >\n                                      {{ subItem.label | translate }}\n                                    </button>\n                                  </li>\n                                </ng-container>\n\n                              </ul>\n                            </div>\n                          </li>\n                        </ng-template>\n\n                      </ng-container>\n                    </ng-container>\n                  </ul>\n                </div>\n            </li>\n\n              <ng-template #singleLink>\n\n                <li class=\"c-mn-nav__item\">\n                  <button class=\"c-mn-nav__link\"\n                    [routerLink]=\"item.disabled ? null : item.path\" \n                    routerLinkActive=\"is-active\"\n                    [routerLinkActiveOptions]=\"{ exact: false }\" \n                    [title]=\"isCollapsed ? (item.label | translate) : ''\" \n                    [ngClass]=\"{'is-disabled': item.disabled}\"\n                    [disabled]=\"item.disabled\"\n                    [style.opacity]=\"item.disabled ? '0.5' : '1'\"\n                    >\n                    <span class=\"c-mn-nav__icon\" [ngClass]=\"item.icon | coreIconCompat\"></span>\n                    <span class=\"c-mn-nav__text\">\n                      {{ item.label | translate }}\n                    </span>\n                  </button>\n                </li>\n              </ng-template>\n\n\n            </ng-container>\n          </ng-container>\n        </ng-template>\n                \n        <ng-container *ngTemplateOutlet=\"menuItems; context: { items: navItems(), level: 0 }\"></ng-container>\n\n      </ul>\n    </nav> <!-- .c-mn-nav -->\n\n    <!-- TODO User -->\n\n    <nav class=\"c-main-nav__bottom c-mn-nav\">\n      <ul class=\"c-mn-nav__list\">\n        <li class=\"c-mn-nav__item\">\n          <button class=\"c-mn-nav__link\"\n            (click)=\"logout()\"\n            [title]=\"isCollapsed ? ('sidebar.logout' | translate) : ''\"\n            >\n            <span class=\"c-mn-nav__icon icon-logout\"></span>\n            <span class=\"c-mn-nav__text\">\n              {{ 'sidebar.logout' | translate }}\n            </span>\n          </button>\n        </li>\n        @if(navConfig().showVersion !== false) {\n          <li class=\"c-mn-nav__version\">\n              v{{ appVersion().full }}\n          </li>\n        }\n      </ul>\n    </nav>\n\n  </div> <!-- .c-main-nav__viewport -->\n</div> <!-- .c-main-nav -->\n\n<!-- ! Refactor: End -->\n\n" }]
         }], ctorParameters: () => [] });
 
 class LayoutStateService {