import { Component, Input } from '@angular/core';

@Component({
  selector: 'app-button-renderer',
  standalone: true,
  template: `
    <a [href]="config['link'] || '#'" class="inline-block text-center no-underline cursor-pointer"
       [style]="styleStr">
      {{ config['text'] }}
    </a>
  `,
})
export class ButtonRenderer {
  @Input() config: Record<string, unknown> = {};
  @Input() styles: Record<string, unknown> = {};
  get styleStr(): string {
    return Object.entries(this.styles).map(([k, v]) => `${k.replace(/[A-Z]/g, c => '-' + c.toLowerCase())}: ${v}`).join('; ');
  }
}