class Column {
  constructor(name, label, style = {}) {
    this.name = name;
    this.label = label;
    this.style = style;
  }

  // Method to convert style object to string; can be overridden or extended
  styleToString() {
    return Object.entries(this.style).map(([key, value]) => `${key}: ${value};`).join(' ');
  }

  // Render header cell (th)
  renderHeader() {
    const th = document.createElement('th');
    th.textContent = this.name;
    // Apply styles
    Object.entries(this.style).forEach(([key, value]) => {
      th.style[key] = value;
    });
    return th;
  }

  // Render data cell (td)
  renderCell(data) {
    const td = document.createElement('td');
    td.textContent = data;
    // Apply styles
    Object.entries(this.style).forEach(([key, value]) => {
      td.style[key] = value;
    });
    return td;
  }
}

class NumberColumn extends Column {
  constructor(header) {
    super(header, {'text-align': 'right'}); // Default style for number columns
  }
}

class Columns {
  constructor(columnJson) {
    this.columns = columnJson.map(def => {
      let style = def.style || {};
      switch (def.type) {
        case 'number':
          return new NumberColumn(def.name, def.label || def.name, style);
        case 'text':
        default:
          return new Column(def.name, def.label || def.name, style);
      }
    });
  }

  getColumns() {
    return this.columns;
  }
}

export default Columns;
