32 lines
975 B
TypeScript
32 lines
975 B
TypeScript
|
import { ChangeDetectionStrategy, Component, signal, HostListener } from '@angular/core';
|
||
|
|
import { RouterLink, RouterLinkActive } from '@angular/router';
|
||
|
|
import { MatIconModule } from '@angular/material/icon';
|
||
|
|
import { MatBadgeModule } from '@angular/material/badge';
|
||
|
|
import { NAV_DESTINATIONS } from '../../models/nav.model';
|
||
|
|
|
||
|
|
@Component({
|
||
|
|
selector: 'app-nav-rail',
|
||
|
|
standalone: true,
|
||
|
|
imports: [RouterLink, RouterLinkActive, MatIconModule, MatBadgeModule],
|
||
|
|
templateUrl: './nav-rail.component.html',
|
||
|
|
styleUrl: './nav-rail.component.scss',
|
||
|
|
changeDetection: ChangeDetectionStrategy.OnPush,
|
||
|
|
})
|
||
|
|
export class NavRailComponent {
|
||
|
|
protected readonly destinations = NAV_DESTINATIONS;
|
||
|
|
protected readonly expanded = signal(false);
|
||
|
|
|
||
|
|
@HostListener('mouseenter')
|
||
|
|
onHoverIn(): void {
|
||
|
|
this.expanded.set(true);
|
||
|
|
}
|
||
|
|
|
||
|
|
@HostListener('mouseleave')
|
||
|
|
onHoverOut(): void {
|
||
|
|
this.expanded.set(false);
|
||
|
|
}
|
||
|
|
|
||
|
|
toggleExpand(): void {
|
||
|
|
this.expanded.update(v => !v);
|
||
|
|
}
|
||
|
|
}
|