48 lines
1.4 KiB
TypeScript
48 lines
1.4 KiB
TypeScript
import { CommonModule } from '@angular/common';
|
|
import { ChangeDetectionStrategy, Component, EventEmitter, Input, Output } from '@angular/core';
|
|
import { SectionConfig } from '../../shared/models/config';
|
|
import { FooterWidgetData } from '../contracts/widget-data.contract';
|
|
|
|
export interface FooterNavigationLink {
|
|
id: string;
|
|
label: string;
|
|
href: string;
|
|
}
|
|
|
|
@Component({
|
|
selector: 'app-footer-navigation-widget',
|
|
standalone: true,
|
|
imports: [CommonModule],
|
|
template: `
|
|
<footer class="footer-nav-widget">
|
|
<nav>
|
|
<ul>
|
|
@for (link of data?.links ?? []; track link.id) {
|
|
<li>
|
|
<button type="button" (click)="onLinkClick(link)">{{ link.label }}</button>
|
|
</li>
|
|
}
|
|
</ul>
|
|
</nav>
|
|
</footer>
|
|
`,
|
|
styles: [
|
|
`
|
|
.footer-nav-widget { padding: 1rem; border-top: 1px solid var(--border-color, #d3dad9); }
|
|
ul { display: flex; gap: 1rem; list-style: none; margin: 0; padding: 0; flex-wrap: wrap; }
|
|
button { background: transparent; border: none; color: var(--text-secondary, #667a77); cursor: pointer; }
|
|
`
|
|
],
|
|
changeDetection: ChangeDetectionStrategy.OnPush
|
|
})
|
|
export class FooterNavigationWidgetComponent {
|
|
@Input() section: SectionConfig | null = null;
|
|
@Input() data: FooterWidgetData | null = null;
|
|
|
|
@Output() linkSelected = new EventEmitter<FooterNavigationLink>();
|
|
|
|
onLinkClick(link: FooterNavigationLink): void {
|
|
this.linkSelected.emit(link);
|
|
}
|
|
}
|