import { computed, Input } from '@angular/core';
import { Component } from '@angular/core';
import { Theme } from 'src/app/core/services/theme';

@Component({
  selector: 'app-pmu-logo',
  imports: [],
  templateUrl: './pmu-logo.html',
  styleUrl: './pmu-logo.css',
  standalone: true,
})
export class PmuLogo {
  /** Variants: default | small | footer | hero ... */
  @Input() variant: 'default' | 'small' | 'footer' | 'hero' = 'default';

  isDark = computed(() => this.theme.mode() === 'dark');

  constructor(private theme: Theme) {}

  get logoSrc() {
    return this.isDark() ? '/assets/logos/pmu_logo_light.png' : '/assets/logos/pmu_logo_dark.png';
  }

  get logoAlt() {
    return 'PMU MALI';
  }

  get logoClass() {
    switch (this.variant) {
      case 'small':
        return 'h-10';
      case 'footer':
        return 'h-12 opacity-80';
      case 'hero':
        return 'h-24';
      default:
        return 'h-16';
    }
  }
}
