codexly-ui 0.10.111 → 0.10.112

package/fesm2022/codexly-ui.mjs

@@ -10585,6 +10585,11 @@ class ClxMenuItemComponent {
         return this.nested() ? NAV_ITEM_L2 : NAV_ITEM_L1;
     }, ...(ngDevMode ? [{ debugName: "_geom" }] : /* istanbul ignore next */ []));
     _iconCls = computed(() => resolveColor(this._resolved().color).textSubtle, ...(ngDevMode ? [{ debugName: "_iconCls" }] : /* istanbul ignore next */ []));
+    // Idle-state label color: a neutral gray by default (matches every other sidebar item), but
+    // respects an explicit [style] color override — e.g. clx-profile's "Cerrar sesión" passing
+    // { color: 'red' } expects the label to actually read red, not fall back to gray like the
+    // icon-only styling used to leave it.
+    _idleLabelCls = computed(() => this.style()?.color ? resolveColor(this._resolved().color).textSubtle : 'text-clx-text-subtle', ...(ngDevMode ? [{ debugName: "_idleLabelCls" }] : /* istanbul ignore next */ []));
     _typography = computed(() => resolveNavZoneTypography(this._resolved()), ...(ngDevMode ? [{ debugName: "_typography" }] : /* istanbul ignore next */ []));
     // Nested items (children under a clx-menu module) stay flat — only the label/icon color
     // changes. Top-level items (e.g. Dashboard) get the same hover/active pill as clx-menu.
@@ -10618,7 +10623,7 @@ class ClxMenuItemComponent {
           <span clx-icon [name]="icon()" size="sm" [class]="_iconCls()"></span>
         }
         @if (!collapsed()) {
-          <span class="flex-1 text-left truncate" [class]="rla.isActive ? '' : 'text-clx-text-subtle'">{{ label() }}</span>
+          <span class="flex-1 text-left truncate" [class]="rla.isActive ? '' : _idleLabelCls()">{{ label() }}</span>
         }
       </a>
     } @else {
@@ -10631,7 +10636,7 @@ class ClxMenuItemComponent {
           <span clx-icon [name]="icon()" size="sm" [class]="_iconCls()"></span>
         }
         @if (!collapsed()) {
-          <span class="flex-1 text-left truncate" [class]="active() ? '' : 'text-clx-text-subtle'">{{ label() }}</span>
+          <span class="flex-1 text-left truncate" [class]="active() ? '' : _idleLabelCls()">{{ label() }}</span>
           <!-- Only rendered in button mode (no routerLink) — that's the only mode any consumer
                uses this slot with today; adding it to the <a> branch too would duplicate the same
                ng-content selector across two mutually-exclusive branches, which silently fails to
@@ -10661,7 +10666,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.15", ngImpo
           <span clx-icon [name]="icon()" size="sm" [class]="_iconCls()"></span>
         }
         @if (!collapsed()) {
-          <span class="flex-1 text-left truncate" [class]="rla.isActive ? '' : 'text-clx-text-subtle'">{{ label() }}</span>
+          <span class="flex-1 text-left truncate" [class]="rla.isActive ? '' : _idleLabelCls()">{{ label() }}</span>
         }
       </a>
     } @else {
@@ -10674,7 +10679,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.15", ngImpo
           <span clx-icon [name]="icon()" size="sm" [class]="_iconCls()"></span>
         }
         @if (!collapsed()) {
-          <span class="flex-1 text-left truncate" [class]="active() ? '' : 'text-clx-text-subtle'">{{ label() }}</span>
+          <span class="flex-1 text-left truncate" [class]="active() ? '' : _idleLabelCls()">{{ label() }}</span>
           <!-- Only rendered in button mode (no routerLink) — that's the only mode any consumer
                uses this slot with today; adding it to the <a> branch too would duplicate the same
                ng-content selector across two mutually-exclusive branches, which silently fails to