@solcre-org/core-ui 2.15.15 → 2.15.17

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

@@ -14867,6 +14867,22 @@ class GenericSidebarComponent {
         const maxItems = this.getMaxScrollItems();
         return this.getMobileType() === SidebarMobileType.SCROLL ? items.slice(0, maxItems) : items;
     });
+    getActiveItemId = computed(() => {
+        const items = this.getConfig()?.items || [];
+        for (const item of items) {
+            if (item.active) {
+                return item.id;
+            }
+            if (item.children) {
+                for (const subItem of item.children) {
+                    if (subItem.active) {
+                        return subItem.id;
+                    }
+                }
+            }
+        }
+        return '';
+    });
     modalState = this.mobileModalService.getModalState();
     hasValidConfiguration = computed(() => {
         const currentConfig = this.getConfig();
@@ -15037,11 +15053,11 @@ class GenericSidebarComponent {
         return this.customModalService.getIsOpen();
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: GenericSidebarComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.6", type: GenericSidebarComponent, isStandalone: true, selector: "core-generic-sidebar", inputs: { config: { classPropertyName: "config", publicName: "config", isSignal: true, isRequired: false, transformFunction: null }, position: { classPropertyName: "position", publicName: "position", isSignal: true, isRequired: false, transformFunction: null }, customTemplate: { classPropertyName: "customTemplate", publicName: "customTemplate", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { itemClicked: "itemClicked", subItemClicked: "subItemClicked" }, host: { listeners: { "window:resize": "onResize($event)" } }, viewQueries: [{ propertyName: "sidebarContentTemplate", first: true, predicate: ["sidebarContentTemplate"], descendants: true, isSignal: true }], hostDirectives: [{ directive: CoreHostDirective }], ngImport: i0, template: "@if(getConfig() && hasValidConfiguration() && shouldRenderSidebar()) {\n\n  @if(getConfig()?.backButton) {\n      <button class=\"c-back-link\" (click)=\"getConfig()?.backButton?.action()\">\n        <span class=\"icon-arrow-left\"></span>\n        @if(getConfig()?.backButton?.labelNeedsTranslation && getConfig()?.backButton?.label) {\n          {{ getConfig()!.backButton!.label | translate }}\n        } @else if(getConfig()?.backButton?.label) {\n          {{ getConfig()!.backButton!.label }}\n        }\n      </button>\n    }\n\n  @if (shouldShowMobileVersion()) {\n    \n    @if (getMobileType() === SidebarMobileType.SELECT) {\n      <div class=\"c-sidebar-mobile\">\n        <label class=\"c-entry-input\">\n          <select (change)=\"onMobileSelectChange($event)\">\n            <option value=\"\">Seleccionar...</option>\n            @for(item of getConfig()?.items || []; track item.id) {\n              @if(item.children && item.children.length > 0) {\n                <optgroup [label]=\"item.label\">\n                  @for(subItem of item.children; track subItem.id) {\n                    <option [disabled]=\"subItem.disabled\" [value]=\"subItem.id\">\n                      {{ subItem.label }}\n                    </option>\n                  }\n                </optgroup>\n              } @else {\n                <option [disabled]=\"item.disabled\" [value]=\"item.id\">\n                  {{ item.label }}\n                </option>\n              }\n            }\n          </select>\n          <span class=\"c-entry-input__addon icon-select-arrow\"></span>\n        </label>\n      </div>\n    }\n\n    @if (getMobileType() === SidebarMobileType.SCROLL) {\n      <div class=\"c-sidebar-mobile c-sidebar-mobile--scroll\">\n        <nav class=\"c-sidenav c-sidenav--mobile-scroll\">\n          @if(getConfig()?.title) {\n            <p class=\"c-sidenav__heading u-heading u-fz--300\">\n              <strong>\n                @if(shouldTranslateTitle()) {\n                  {{ getTitleDisplay() | translate }}\n                } @else {\n                  {{ getTitleDisplay() }}\n                }\n              </strong>\n            </p>\n          }\n          \n          <ul class=\"c-sidenav__list c-sidenav__list--scrollable\">\n            @for(item of getScrollableItems(); track item.id) {\n              <li class=\"c-sidenav__item\">\n                @if(item.children && item.children.length > 0) {\n                  <a class=\"c-sidenav__link\">{{ item.label }}</a>\n                  <ul class=\"c-sidenav__sublist\">\n                    @for(subItem of item.children; track subItem.id) {\n                      <li class=\"c-sidenav__subitem\">\n                        <a class=\"c-sidenav__sublink\"\n                           [class.is-disabled]=\"subItem.disabled\"\n                           [class.is-active]=\"subItem.active\"\n                           (click)=\"onSubItemClick(subItem)\">\n                          {{ subItem.label }}\n                        </a>\n                      </li>\n                    }\n                  </ul>\n                } @else {\n                  <a class=\"c-sidenav__link\"\n                     [class.is-disabled]=\"item.disabled\"\n                     [class.is-active]=\"item.active\"\n                     (click)=\"onItemClick(item)\">\n                    @if(item.icon) {\n                      <span [ngClass]=\"item.icon | coreIconCompat\"></span>\n                    }\n                    {{ item.label }}\n                  </a>\n                }\n              </li>\n            }\n          </ul>\n        </nav>\n      </div>\n    }\n\n    @if (getMobileType() === SidebarMobileType.MODAL) {\n      <!-- El modal se renderiza desde el componente layout usando el servicio -->\n      <!-- No renderizamos nada aqu\u00ED para ocultar completamente el sidebar -->\n    }\n  }\n\n  @if (shouldShowDesktopVersion()) {\n    <nav class=\"c-sidenav\" style=\"--_layout-padd-y: calc(var(--space-y) * 1.8);\">\n      \n      @if(getConfig()?.title) {\n        <p class=\"c-sidenav__heading u-heading u-fz--300\">\n          <strong>\n            @if(shouldTranslateTitle()) {\n              {{ getTitleDisplay() | translate }}\n            } @else {\n              {{ getTitleDisplay() }}\n            }\n          </strong>\n        </p>\n      }\n      \n      @if(shouldUseCustomTemplate() && isTemplateInsideNav()) {\n        <ng-container \n          [ngTemplateOutlet]=\"getActiveTemplate()\" \n          [ngTemplateOutletContext]=\"{\n            $implicit: getConfig(),\n            config: getConfig(),\n            position: position(),\n            onItemClick: onItemClick.bind(this),\n            onSubItemClick: onSubItemClick.bind(this)\n          }\">\n        </ng-container>\n      } @else if (!shouldUseCustomTemplate()) {\n        <ul class=\"c-sidenav__list\">\n          @for(item of getConfig()?.items || []; track item.id) {\n            <li class=\"c-sidenav__item\">\n              @if(item.children && item.children.length > 0) {\n                <a class=\"c-sidenav__link\">{{ item.label }}</a>\n                <ul class=\"c-sidenav__sublist\">\n                  @for(subItem of item.children; track subItem.id) {\n                    <li class=\"c-sidenav__subitem\">\n                      <a class=\"c-sidenav__sublink\"\n                         [class.is-disabled]=\"subItem.disabled\"\n                         [class.is-active]=\"subItem.active\"\n                         (click)=\"onSubItemClick(subItem)\">\n                        {{ subItem.label }}\n                      </a>\n                    </li>\n                  }\n                </ul>\n              } @else {\n                <a class=\"c-sidenav__link\"\n                   [class.is-disabled]=\"item.disabled\"\n                   [class.is-active]=\"item.active\"\n                   (click)=\"onItemClick(item)\">\n                  @if(item.icon) {\n                    <span [ngClass]=\"item.icon | coreIconCompat\"></span>\n                  }\n                  {{ item.label }}\n                </a>\n              }\n            </li>\n          }\n        </ul>\n      }\n    </nav>\n  }\n} \n\n<ng-template #sidebarContentTemplate>\n  <nav class=\"c-sidenav c-sidenav--modal\">\n    @if(shouldUseCustomTemplate() && isTemplateInsideNav()) {\n      <ng-container \n        [ngTemplateOutlet]=\"getActiveTemplate()\" \n        [ngTemplateOutletContext]=\"{\n          $implicit: getConfig(),\n          config: getConfig(),\n          position: position(),\n          onItemClick: onItemClick.bind(this),\n          onSubItemClick: onSubItemClick.bind(this)\n        }\">\n      </ng-container>\n    } @else if (!shouldUseCustomTemplate()) {\n      <ul class=\"c-sidenav__list\">\n        @for(item of getConfig()?.items || []; track item.id) {\n          <li class=\"c-sidenav__item\">\n            @if(item.children && item.children.length > 0) {\n              <a class=\"c-sidenav__link\">{{ item.label }}</a>\n              <ul class=\"c-sidenav__sublist\">\n                @for(subItem of item.children; track subItem.id) {\n                  <li class=\"c-sidenav__subitem\">\n                    <a class=\"c-sidenav__sublink\"\n                       [class.is-disabled]=\"subItem.disabled\"\n                       [class.is-active]=\"subItem.active\"\n                       (click)=\"onSubItemClick(subItem); modalService.closeModal()\">\n                      {{ subItem.label }}\n                    </a>\n                  </li>\n                }\n              </ul>\n            } @else {\n              <a class=\"c-sidenav__link\"\n                 [class.is-disabled]=\"item.disabled\"\n                 [class.is-active]=\"item.active\"\n                 (click)=\"onItemClick(item); modalService.closeModal()\">\n                @if(item.icon) {\n                  <span [ngClass]=\"item.icon | coreIconCompat\"></span>\n                }\n                {{ item.label }}\n              </a>\n            }\n          </li>\n        }\n      </ul>\n    }\n  </nav>\n</ng-template>\n\n@if(shouldUseCustomTemplate() && !isTemplateInsideNav()) {\n  <ng-container \n    [ngTemplateOutlet]=\"getActiveTemplate()\" \n    [ngTemplateOutletContext]=\"{\n      $implicit: getConfig(),\n      config: getConfig(),\n      position: position(),\n      onItemClick: onItemClick.bind(this),\n      onSubItemClick: onSubItemClick.bind(this)\n    }\">\n  </ng-container>\n}\n\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i3.TranslatePipe, name: "translate" }, { kind: "pipe", type: IconCompatPipe, name: "coreIconCompat" }] });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.6", type: GenericSidebarComponent, isStandalone: true, selector: "core-generic-sidebar", inputs: { config: { classPropertyName: "config", publicName: "config", isSignal: true, isRequired: false, transformFunction: null }, position: { classPropertyName: "position", publicName: "position", isSignal: true, isRequired: false, transformFunction: null }, customTemplate: { classPropertyName: "customTemplate", publicName: "customTemplate", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { itemClicked: "itemClicked", subItemClicked: "subItemClicked" }, host: { listeners: { "window:resize": "onResize($event)" } }, viewQueries: [{ propertyName: "sidebarContentTemplate", first: true, predicate: ["sidebarContentTemplate"], descendants: true, isSignal: true }], hostDirectives: [{ directive: CoreHostDirective }], ngImport: i0, template: "@if(getConfig() && hasValidConfiguration() && shouldRenderSidebar()) {\n\n  @if(getConfig()?.backButton) {\n      <button class=\"c-back-link\" (click)=\"getConfig()?.backButton?.action()\">\n        <span class=\"icon-arrow-left\"></span>\n        @if(getConfig()?.backButton?.labelNeedsTranslation && getConfig()?.backButton?.label) {\n          {{ getConfig()!.backButton!.label | translate }}\n        } @else if(getConfig()?.backButton?.label) {\n          {{ getConfig()!.backButton!.label }}\n        }\n      </button>\n    }\n\n  @if (shouldShowMobileVersion()) {\n    \n    @if (getMobileType() === SidebarMobileType.SELECT) {\n      <div class=\"c-sidebar-mobile\">\n        <label class=\"c-entry-input\">\n          <select (change)=\"onMobileSelectChange($event)\" [value]=\"getActiveItemId()\">\n            <option value=\"\">Seleccionar...</option>\n            @for(item of getConfig()?.items || []; track item.id) {\n              @if(item.children && item.children.length > 0) {\n                <optgroup [label]=\"item.label\">\n                  @for(subItem of item.children; track subItem.id) {\n                    <option [disabled]=\"subItem.disabled\" [value]=\"subItem.id\" [selected]=\"subItem.active\">\n                      {{ subItem.label }}\n                    </option>\n                  }\n                </optgroup>\n              } @else {\n                <option [disabled]=\"item.disabled\" [value]=\"item.id\" [selected]=\"item.active\">\n                  {{ item.label }}\n                </option>\n              }\n            }\n          </select>\n          <span class=\"c-entry-input__addon icon-select-arrow\"></span>\n        </label>\n      </div>\n    }\n\n    @if (getMobileType() === SidebarMobileType.SCROLL) {\n      <div class=\"c-sidebar-mobile c-sidebar-mobile--scroll\">\n        <nav class=\"c-sidenav c-sidenav--mobile-scroll\">\n          @if(getConfig()?.title) {\n            <p class=\"c-sidenav__heading u-heading u-fz--300\">\n              <strong>\n                @if(shouldTranslateTitle()) {\n                  {{ getTitleDisplay() | translate }}\n                } @else {\n                  {{ getTitleDisplay() }}\n                }\n              </strong>\n            </p>\n          }\n          \n          <ul class=\"c-sidenav__list c-sidenav__list--scrollable\">\n            @for(item of getScrollableItems(); track item.id) {\n              <li class=\"c-sidenav__item\">\n                @if(item.children && item.children.length > 0) {\n                  <a class=\"c-sidenav__link\">{{ item.label }}</a>\n                  <ul class=\"c-sidenav__sublist\">\n                    @for(subItem of item.children; track subItem.id) {\n                      <li class=\"c-sidenav__subitem\">\n                        <a class=\"c-sidenav__sublink\"\n                           [class.is-disabled]=\"subItem.disabled\"\n                           [class.is-active]=\"subItem.active\"\n                           (click)=\"onSubItemClick(subItem)\">\n                          {{ subItem.label }}\n                        </a>\n                      </li>\n                    }\n                  </ul>\n                } @else {\n                  <a class=\"c-sidenav__link\"\n                     [class.is-disabled]=\"item.disabled\"\n                     [class.is-active]=\"item.active\"\n                     (click)=\"onItemClick(item)\">\n                    @if(item.icon) {\n                      <span [ngClass]=\"item.icon | coreIconCompat\"></span>\n                    }\n                    {{ item.label }}\n                  </a>\n                }\n              </li>\n            }\n          </ul>\n        </nav>\n      </div>\n    }\n\n    @if (getMobileType() === SidebarMobileType.MODAL) {\n      <!-- El modal se renderiza desde el componente layout usando el servicio -->\n      <!-- No renderizamos nada aqu\u00ED para ocultar completamente el sidebar -->\n    }\n  }\n\n  @if (shouldShowDesktopVersion()) {\n    <nav class=\"c-sidenav\" style=\"--_layout-padd-y: calc(var(--space-y) * 1.8);\">\n      \n      @if(getConfig()?.title) {\n        <p class=\"c-sidenav__heading u-heading u-fz--300\">\n          <strong>\n            @if(shouldTranslateTitle()) {\n              {{ getTitleDisplay() | translate }}\n            } @else {\n              {{ getTitleDisplay() }}\n            }\n          </strong>\n        </p>\n      }\n      \n      @if(shouldUseCustomTemplate() && isTemplateInsideNav()) {\n        <ng-container \n          [ngTemplateOutlet]=\"getActiveTemplate()\" \n          [ngTemplateOutletContext]=\"{\n            $implicit: getConfig(),\n            config: getConfig(),\n            position: position(),\n            onItemClick: onItemClick.bind(this),\n            onSubItemClick: onSubItemClick.bind(this)\n          }\">\n        </ng-container>\n      } @else if (!shouldUseCustomTemplate()) {\n        <ul class=\"c-sidenav__list\">\n          @for(item of getConfig()?.items || []; track item.id) {\n            <li class=\"c-sidenav__item\">\n              @if(item.children && item.children.length > 0) {\n                <a class=\"c-sidenav__link\">{{ item.label }}</a>\n                <ul class=\"c-sidenav__sublist\">\n                  @for(subItem of item.children; track subItem.id) {\n                    <li class=\"c-sidenav__subitem\">\n                      <a class=\"c-sidenav__sublink\"\n                         [class.is-disabled]=\"subItem.disabled\"\n                         [class.is-active]=\"subItem.active\"\n                         (click)=\"onSubItemClick(subItem)\">\n                        {{ subItem.label }}\n                      </a>\n                    </li>\n                  }\n                </ul>\n              } @else {\n                <a class=\"c-sidenav__link\"\n                   [class.is-disabled]=\"item.disabled\"\n                   [class.is-active]=\"item.active\"\n                   (click)=\"onItemClick(item)\">\n                  @if(item.icon) {\n                    <span [ngClass]=\"item.icon | coreIconCompat\"></span>\n                  }\n                  {{ item.label }}\n                </a>\n              }\n            </li>\n          }\n        </ul>\n      }\n    </nav>\n  }\n} \n\n<ng-template #sidebarContentTemplate>\n  <nav class=\"c-sidenav c-sidenav--modal\">\n    @if(shouldUseCustomTemplate() && isTemplateInsideNav()) {\n      <ng-container \n        [ngTemplateOutlet]=\"getActiveTemplate()\" \n        [ngTemplateOutletContext]=\"{\n          $implicit: getConfig(),\n          config: getConfig(),\n          position: position(),\n          onItemClick: onItemClick.bind(this),\n          onSubItemClick: onSubItemClick.bind(this)\n        }\">\n      </ng-container>\n    } @else if (!shouldUseCustomTemplate()) {\n      <ul class=\"c-sidenav__list\">\n        @for(item of getConfig()?.items || []; track item.id) {\n          <li class=\"c-sidenav__item\">\n            @if(item.children && item.children.length > 0) {\n              <a class=\"c-sidenav__link\">{{ item.label }}</a>\n              <ul class=\"c-sidenav__sublist\">\n                @for(subItem of item.children; track subItem.id) {\n                  <li class=\"c-sidenav__subitem\">\n                    <a class=\"c-sidenav__sublink\"\n                       [class.is-disabled]=\"subItem.disabled\"\n                       [class.is-active]=\"subItem.active\"\n                       (click)=\"onSubItemClick(subItem); modalService.closeModal()\">\n                      {{ subItem.label }}\n                    </a>\n                  </li>\n                }\n              </ul>\n            } @else {\n              <a class=\"c-sidenav__link\"\n                 [class.is-disabled]=\"item.disabled\"\n                 [class.is-active]=\"item.active\"\n                 (click)=\"onItemClick(item); modalService.closeModal()\">\n                @if(item.icon) {\n                  <span [ngClass]=\"item.icon | coreIconCompat\"></span>\n                }\n                {{ item.label }}\n              </a>\n            }\n          </li>\n        }\n      </ul>\n    }\n  </nav>\n</ng-template>\n\n@if(shouldUseCustomTemplate() && !isTemplateInsideNav()) {\n  <ng-container \n    [ngTemplateOutlet]=\"getActiveTemplate()\" \n    [ngTemplateOutletContext]=\"{\n      $implicit: getConfig(),\n      config: getConfig(),\n      position: position(),\n      onItemClick: onItemClick.bind(this),\n      onSubItemClick: onSubItemClick.bind(this)\n    }\">\n  </ng-container>\n}\n\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i3.TranslatePipe, name: "translate" }, { kind: "pipe", type: IconCompatPipe, name: "coreIconCompat" }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: GenericSidebarComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'core-generic-sidebar', standalone: true, imports: [CommonModule, TranslateModule, IconCompatPipe], hostDirectives: [CoreHostDirective], template: "@if(getConfig() && hasValidConfiguration() && shouldRenderSidebar()) {\n\n  @if(getConfig()?.backButton) {\n      <button class=\"c-back-link\" (click)=\"getConfig()?.backButton?.action()\">\n        <span class=\"icon-arrow-left\"></span>\n        @if(getConfig()?.backButton?.labelNeedsTranslation && getConfig()?.backButton?.label) {\n          {{ getConfig()!.backButton!.label | translate }}\n        } @else if(getConfig()?.backButton?.label) {\n          {{ getConfig()!.backButton!.label }}\n        }\n      </button>\n    }\n\n  @if (shouldShowMobileVersion()) {\n    \n    @if (getMobileType() === SidebarMobileType.SELECT) {\n      <div class=\"c-sidebar-mobile\">\n        <label class=\"c-entry-input\">\n          <select (change)=\"onMobileSelectChange($event)\">\n            <option value=\"\">Seleccionar...</option>\n            @for(item of getConfig()?.items || []; track item.id) {\n              @if(item.children && item.children.length > 0) {\n                <optgroup [label]=\"item.label\">\n                  @for(subItem of item.children; track subItem.id) {\n                    <option [disabled]=\"subItem.disabled\" [value]=\"subItem.id\">\n                      {{ subItem.label }}\n                    </option>\n                  }\n                </optgroup>\n              } @else {\n                <option [disabled]=\"item.disabled\" [value]=\"item.id\">\n                  {{ item.label }}\n                </option>\n              }\n            }\n          </select>\n          <span class=\"c-entry-input__addon icon-select-arrow\"></span>\n        </label>\n      </div>\n    }\n\n    @if (getMobileType() === SidebarMobileType.SCROLL) {\n      <div class=\"c-sidebar-mobile c-sidebar-mobile--scroll\">\n        <nav class=\"c-sidenav c-sidenav--mobile-scroll\">\n          @if(getConfig()?.title) {\n            <p class=\"c-sidenav__heading u-heading u-fz--300\">\n              <strong>\n                @if(shouldTranslateTitle()) {\n                  {{ getTitleDisplay() | translate }}\n                } @else {\n                  {{ getTitleDisplay() }}\n                }\n              </strong>\n            </p>\n          }\n          \n          <ul class=\"c-sidenav__list c-sidenav__list--scrollable\">\n            @for(item of getScrollableItems(); track item.id) {\n              <li class=\"c-sidenav__item\">\n                @if(item.children && item.children.length > 0) {\n                  <a class=\"c-sidenav__link\">{{ item.label }}</a>\n                  <ul class=\"c-sidenav__sublist\">\n                    @for(subItem of item.children; track subItem.id) {\n                      <li class=\"c-sidenav__subitem\">\n                        <a class=\"c-sidenav__sublink\"\n                           [class.is-disabled]=\"subItem.disabled\"\n                           [class.is-active]=\"subItem.active\"\n                           (click)=\"onSubItemClick(subItem)\">\n                          {{ subItem.label }}\n                        </a>\n                      </li>\n                    }\n                  </ul>\n                } @else {\n                  <a class=\"c-sidenav__link\"\n                     [class.is-disabled]=\"item.disabled\"\n                     [class.is-active]=\"item.active\"\n                     (click)=\"onItemClick(item)\">\n                    @if(item.icon) {\n                      <span [ngClass]=\"item.icon | coreIconCompat\"></span>\n                    }\n                    {{ item.label }}\n                  </a>\n                }\n              </li>\n            }\n          </ul>\n        </nav>\n      </div>\n    }\n\n    @if (getMobileType() === SidebarMobileType.MODAL) {\n      <!-- El modal se renderiza desde el componente layout usando el servicio -->\n      <!-- No renderizamos nada aqu\u00ED para ocultar completamente el sidebar -->\n    }\n  }\n\n  @if (shouldShowDesktopVersion()) {\n    <nav class=\"c-sidenav\" style=\"--_layout-padd-y: calc(var(--space-y) * 1.8);\">\n      \n      @if(getConfig()?.title) {\n        <p class=\"c-sidenav__heading u-heading u-fz--300\">\n          <strong>\n            @if(shouldTranslateTitle()) {\n              {{ getTitleDisplay() | translate }}\n            } @else {\n              {{ getTitleDisplay() }}\n            }\n          </strong>\n        </p>\n      }\n      \n      @if(shouldUseCustomTemplate() && isTemplateInsideNav()) {\n        <ng-container \n          [ngTemplateOutlet]=\"getActiveTemplate()\" \n          [ngTemplateOutletContext]=\"{\n            $implicit: getConfig(),\n            config: getConfig(),\n            position: position(),\n            onItemClick: onItemClick.bind(this),\n            onSubItemClick: onSubItemClick.bind(this)\n          }\">\n        </ng-container>\n      } @else if (!shouldUseCustomTemplate()) {\n        <ul class=\"c-sidenav__list\">\n          @for(item of getConfig()?.items || []; track item.id) {\n            <li class=\"c-sidenav__item\">\n              @if(item.children && item.children.length > 0) {\n                <a class=\"c-sidenav__link\">{{ item.label }}</a>\n                <ul class=\"c-sidenav__sublist\">\n                  @for(subItem of item.children; track subItem.id) {\n                    <li class=\"c-sidenav__subitem\">\n                      <a class=\"c-sidenav__sublink\"\n                         [class.is-disabled]=\"subItem.disabled\"\n                         [class.is-active]=\"subItem.active\"\n                         (click)=\"onSubItemClick(subItem)\">\n                        {{ subItem.label }}\n                      </a>\n                    </li>\n                  }\n                </ul>\n              } @else {\n                <a class=\"c-sidenav__link\"\n                   [class.is-disabled]=\"item.disabled\"\n                   [class.is-active]=\"item.active\"\n                   (click)=\"onItemClick(item)\">\n                  @if(item.icon) {\n                    <span [ngClass]=\"item.icon | coreIconCompat\"></span>\n                  }\n                  {{ item.label }}\n                </a>\n              }\n            </li>\n          }\n        </ul>\n      }\n    </nav>\n  }\n} \n\n<ng-template #sidebarContentTemplate>\n  <nav class=\"c-sidenav c-sidenav--modal\">\n    @if(shouldUseCustomTemplate() && isTemplateInsideNav()) {\n      <ng-container \n        [ngTemplateOutlet]=\"getActiveTemplate()\" \n        [ngTemplateOutletContext]=\"{\n          $implicit: getConfig(),\n          config: getConfig(),\n          position: position(),\n          onItemClick: onItemClick.bind(this),\n          onSubItemClick: onSubItemClick.bind(this)\n        }\">\n      </ng-container>\n    } @else if (!shouldUseCustomTemplate()) {\n      <ul class=\"c-sidenav__list\">\n        @for(item of getConfig()?.items || []; track item.id) {\n          <li class=\"c-sidenav__item\">\n            @if(item.children && item.children.length > 0) {\n              <a class=\"c-sidenav__link\">{{ item.label }}</a>\n              <ul class=\"c-sidenav__sublist\">\n                @for(subItem of item.children; track subItem.id) {\n                  <li class=\"c-sidenav__subitem\">\n                    <a class=\"c-sidenav__sublink\"\n                       [class.is-disabled]=\"subItem.disabled\"\n                       [class.is-active]=\"subItem.active\"\n                       (click)=\"onSubItemClick(subItem); modalService.closeModal()\">\n                      {{ subItem.label }}\n                    </a>\n                  </li>\n                }\n              </ul>\n            } @else {\n              <a class=\"c-sidenav__link\"\n                 [class.is-disabled]=\"item.disabled\"\n                 [class.is-active]=\"item.active\"\n                 (click)=\"onItemClick(item); modalService.closeModal()\">\n                @if(item.icon) {\n                  <span [ngClass]=\"item.icon | coreIconCompat\"></span>\n                }\n                {{ item.label }}\n              </a>\n            }\n          </li>\n        }\n      </ul>\n    }\n  </nav>\n</ng-template>\n\n@if(shouldUseCustomTemplate() && !isTemplateInsideNav()) {\n  <ng-container \n    [ngTemplateOutlet]=\"getActiveTemplate()\" \n    [ngTemplateOutletContext]=\"{\n      $implicit: getConfig(),\n      config: getConfig(),\n      position: position(),\n      onItemClick: onItemClick.bind(this),\n      onSubItemClick: onSubItemClick.bind(this)\n    }\">\n  </ng-container>\n}\n\n" }]
+            args: [{ selector: 'core-generic-sidebar', standalone: true, imports: [CommonModule, TranslateModule, IconCompatPipe], hostDirectives: [CoreHostDirective], template: "@if(getConfig() && hasValidConfiguration() && shouldRenderSidebar()) {\n\n  @if(getConfig()?.backButton) {\n      <button class=\"c-back-link\" (click)=\"getConfig()?.backButton?.action()\">\n        <span class=\"icon-arrow-left\"></span>\n        @if(getConfig()?.backButton?.labelNeedsTranslation && getConfig()?.backButton?.label) {\n          {{ getConfig()!.backButton!.label | translate }}\n        } @else if(getConfig()?.backButton?.label) {\n          {{ getConfig()!.backButton!.label }}\n        }\n      </button>\n    }\n\n  @if (shouldShowMobileVersion()) {\n    \n    @if (getMobileType() === SidebarMobileType.SELECT) {\n      <div class=\"c-sidebar-mobile\">\n        <label class=\"c-entry-input\">\n          <select (change)=\"onMobileSelectChange($event)\" [value]=\"getActiveItemId()\">\n            <option value=\"\">Seleccionar...</option>\n            @for(item of getConfig()?.items || []; track item.id) {\n              @if(item.children && item.children.length > 0) {\n                <optgroup [label]=\"item.label\">\n                  @for(subItem of item.children; track subItem.id) {\n                    <option [disabled]=\"subItem.disabled\" [value]=\"subItem.id\" [selected]=\"subItem.active\">\n                      {{ subItem.label }}\n                    </option>\n                  }\n                </optgroup>\n              } @else {\n                <option [disabled]=\"item.disabled\" [value]=\"item.id\" [selected]=\"item.active\">\n                  {{ item.label }}\n                </option>\n              }\n            }\n          </select>\n          <span class=\"c-entry-input__addon icon-select-arrow\"></span>\n        </label>\n      </div>\n    }\n\n    @if (getMobileType() === SidebarMobileType.SCROLL) {\n      <div class=\"c-sidebar-mobile c-sidebar-mobile--scroll\">\n        <nav class=\"c-sidenav c-sidenav--mobile-scroll\">\n          @if(getConfig()?.title) {\n            <p class=\"c-sidenav__heading u-heading u-fz--300\">\n              <strong>\n                @if(shouldTranslateTitle()) {\n                  {{ getTitleDisplay() | translate }}\n                } @else {\n                  {{ getTitleDisplay() }}\n                }\n              </strong>\n            </p>\n          }\n          \n          <ul class=\"c-sidenav__list c-sidenav__list--scrollable\">\n            @for(item of getScrollableItems(); track item.id) {\n              <li class=\"c-sidenav__item\">\n                @if(item.children && item.children.length > 0) {\n                  <a class=\"c-sidenav__link\">{{ item.label }}</a>\n                  <ul class=\"c-sidenav__sublist\">\n                    @for(subItem of item.children; track subItem.id) {\n                      <li class=\"c-sidenav__subitem\">\n                        <a class=\"c-sidenav__sublink\"\n                           [class.is-disabled]=\"subItem.disabled\"\n                           [class.is-active]=\"subItem.active\"\n                           (click)=\"onSubItemClick(subItem)\">\n                          {{ subItem.label }}\n                        </a>\n                      </li>\n                    }\n                  </ul>\n                } @else {\n                  <a class=\"c-sidenav__link\"\n                     [class.is-disabled]=\"item.disabled\"\n                     [class.is-active]=\"item.active\"\n                     (click)=\"onItemClick(item)\">\n                    @if(item.icon) {\n                      <span [ngClass]=\"item.icon | coreIconCompat\"></span>\n                    }\n                    {{ item.label }}\n                  </a>\n                }\n              </li>\n            }\n          </ul>\n        </nav>\n      </div>\n    }\n\n    @if (getMobileType() === SidebarMobileType.MODAL) {\n      <!-- El modal se renderiza desde el componente layout usando el servicio -->\n      <!-- No renderizamos nada aqu\u00ED para ocultar completamente el sidebar -->\n    }\n  }\n\n  @if (shouldShowDesktopVersion()) {\n    <nav class=\"c-sidenav\" style=\"--_layout-padd-y: calc(var(--space-y) * 1.8);\">\n      \n      @if(getConfig()?.title) {\n        <p class=\"c-sidenav__heading u-heading u-fz--300\">\n          <strong>\n            @if(shouldTranslateTitle()) {\n              {{ getTitleDisplay() | translate }}\n            } @else {\n              {{ getTitleDisplay() }}\n            }\n          </strong>\n        </p>\n      }\n      \n      @if(shouldUseCustomTemplate() && isTemplateInsideNav()) {\n        <ng-container \n          [ngTemplateOutlet]=\"getActiveTemplate()\" \n          [ngTemplateOutletContext]=\"{\n            $implicit: getConfig(),\n            config: getConfig(),\n            position: position(),\n            onItemClick: onItemClick.bind(this),\n            onSubItemClick: onSubItemClick.bind(this)\n          }\">\n        </ng-container>\n      } @else if (!shouldUseCustomTemplate()) {\n        <ul class=\"c-sidenav__list\">\n          @for(item of getConfig()?.items || []; track item.id) {\n            <li class=\"c-sidenav__item\">\n              @if(item.children && item.children.length > 0) {\n                <a class=\"c-sidenav__link\">{{ item.label }}</a>\n                <ul class=\"c-sidenav__sublist\">\n                  @for(subItem of item.children; track subItem.id) {\n                    <li class=\"c-sidenav__subitem\">\n                      <a class=\"c-sidenav__sublink\"\n                         [class.is-disabled]=\"subItem.disabled\"\n                         [class.is-active]=\"subItem.active\"\n                         (click)=\"onSubItemClick(subItem)\">\n                        {{ subItem.label }}\n                      </a>\n                    </li>\n                  }\n                </ul>\n              } @else {\n                <a class=\"c-sidenav__link\"\n                   [class.is-disabled]=\"item.disabled\"\n                   [class.is-active]=\"item.active\"\n                   (click)=\"onItemClick(item)\">\n                  @if(item.icon) {\n                    <span [ngClass]=\"item.icon | coreIconCompat\"></span>\n                  }\n                  {{ item.label }}\n                </a>\n              }\n            </li>\n          }\n        </ul>\n      }\n    </nav>\n  }\n} \n\n<ng-template #sidebarContentTemplate>\n  <nav class=\"c-sidenav c-sidenav--modal\">\n    @if(shouldUseCustomTemplate() && isTemplateInsideNav()) {\n      <ng-container \n        [ngTemplateOutlet]=\"getActiveTemplate()\" \n        [ngTemplateOutletContext]=\"{\n          $implicit: getConfig(),\n          config: getConfig(),\n          position: position(),\n          onItemClick: onItemClick.bind(this),\n          onSubItemClick: onSubItemClick.bind(this)\n        }\">\n      </ng-container>\n    } @else if (!shouldUseCustomTemplate()) {\n      <ul class=\"c-sidenav__list\">\n        @for(item of getConfig()?.items || []; track item.id) {\n          <li class=\"c-sidenav__item\">\n            @if(item.children && item.children.length > 0) {\n              <a class=\"c-sidenav__link\">{{ item.label }}</a>\n              <ul class=\"c-sidenav__sublist\">\n                @for(subItem of item.children; track subItem.id) {\n                  <li class=\"c-sidenav__subitem\">\n                    <a class=\"c-sidenav__sublink\"\n                       [class.is-disabled]=\"subItem.disabled\"\n                       [class.is-active]=\"subItem.active\"\n                       (click)=\"onSubItemClick(subItem); modalService.closeModal()\">\n                      {{ subItem.label }}\n                    </a>\n                  </li>\n                }\n              </ul>\n            } @else {\n              <a class=\"c-sidenav__link\"\n                 [class.is-disabled]=\"item.disabled\"\n                 [class.is-active]=\"item.active\"\n                 (click)=\"onItemClick(item); modalService.closeModal()\">\n                @if(item.icon) {\n                  <span [ngClass]=\"item.icon | coreIconCompat\"></span>\n                }\n                {{ item.label }}\n              </a>\n            }\n          </li>\n        }\n      </ul>\n    }\n  </nav>\n</ng-template>\n\n@if(shouldUseCustomTemplate() && !isTemplateInsideNav()) {\n  <ng-container \n    [ngTemplateOutlet]=\"getActiveTemplate()\" \n    [ngTemplateOutletContext]=\"{\n      $implicit: getConfig(),\n      config: getConfig(),\n      position: position(),\n      onItemClick: onItemClick.bind(this),\n      onSubItemClick: onSubItemClick.bind(this)\n    }\">\n  </ng-container>\n}\n\n" }]
         }], propDecorators: { onResize: [{
                 type: HostListener,
                 args: ['window:resize', ['$event']]
@@ -15637,13 +15653,19 @@ class MainNavService {
     renderer;
     constructor(rendererFactory) {
         this.renderer = rendererFactory.createRenderer(null, null);
-        const savedState = this.getSidebarState();
+        const isMobile = typeof window !== 'undefined' && window.innerWidth <= 768;
+        let savedState = this.getSidebarState();
+        if (isMobile) {
+            savedState = SidebarState.COLLAPSED;
+            sessionStorage.setItem(this.SIDEBAR_STATE, savedState);
+        }
+        else if (!savedState) {
+            savedState = SidebarState.EXPANDED;
+            sessionStorage.setItem(this.SIDEBAR_STATE, savedState);
+        }
         const isCollapsed = savedState === SidebarState.COLLAPSED;
         this.isCollapsedSubject.next(isCollapsed);
         this.updateBodyClass(isCollapsed);
-        if (!savedState) {
-            this.setSidebarState(SidebarState.EXPANDED);
-        }
     }
     setSidebarState(state) {
         sessionStorage.setItem(this.SIDEBAR_STATE, state);
@@ -15666,15 +15688,19 @@ class MainNavService {
         this.setSidebarState(SidebarState.COLLAPSED);
     }
     clearSidebarState() {
+        const isMobile = typeof window !== 'undefined' && window.innerWidth <= 768;
         sessionStorage.removeItem(this.SIDEBAR_STATE);
-        this.isCollapsedSubject.next(false);
-        this.updateBodyClass(false);
+        const isCollapsed = isMobile;
+        this.isCollapsedSubject.next(isCollapsed);
+        this.updateBodyClass(isCollapsed);
     }
     updateBodyClass(isCollapsed) {
         if (isCollapsed) {
             this.renderer.removeClass(document.body, 'nav-expanded');
+            this.renderer.addClass(document.body, 'nav-collapsed');
         }
         else {
+            this.renderer.removeClass(document.body, 'nav-collapsed');
             this.renderer.addClass(document.body, 'nav-expanded');
         }
     }
@@ -15691,11 +15717,11 @@ 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.15',
+    full: '2.15.17',
     major: 2,
     minor: 15,
-    patch: 15,
-    timestamp: '2025-10-15T13:03:12.947Z',
+    patch: 17,
+    timestamp: '2025-10-15T13:49:10.034Z',
     buildDate: '15/10/2025'
 };
 
@@ -15895,6 +15921,9 @@ class MainNavComponent {
         return true;
     }
     logout() {
+        document.body.classList.remove('nav-expanded', 'bottom-nav-open', 'bottom-nav-closing');
+        document.documentElement.classList.remove('nav-expanded');
+        this.mainNavService.clearSidebarState();
         if (this.navConfig().customLogout) {
             this.onLogout.emit();
             return;