import { Component } from '../component.js';
import yaml from 'yaml';

class Button extends Component {
  constructor (data) {
    super(data, 'button');
  }

  get ejsPath () {
    return 'src/dsfr/component/button/template/ejs/button.ejs';
  }

  async format () {
    const index = [, , 'secondary', 'tertiary', 'tertiary-no-outline'].indexOf(this.data.kind);
    const url = this.data.url ?? this.data.href;
    const blank = Boolean(this.data.blank) || /^(http|www)/.test(url);
    const classes = ['fr-mb-6v'];
    classes.push(...(this.data.classes || []));
    return {
      markup: url ? 'a' : this.data.markup,
      kind: index > -1 ? index : parseInt(this.data.kind),
      size: this.data.size,
      label: this.data.label ?? this.data.text,
      title: this.data.title,
      id: this.data.id,
      href: url,
      type: this.data.type,
      blank,
      self: !blank || Boolean(this.data.self),
      disabled: this.data.disabled,
      classes: classes,
      attributes: this.data.attributes,
      icon: this.data.icon,
      iconPlace: this.data['icon-place'],
    }
  }
}

export { Button };
