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

@Component({
  selector: "sam-list",
  template: `
    <ul [ngClass]="css_classes">
      <ng-content></ng-content>
    </ul>
  `,
  standalone: false,
})
export class SamListComponent implements OnInit {
  @Input() public bulleted: boolean;
  @Input() public bullet: boolean;
  @Input() public columns: string;
  @Input() public orientation: string;

  css_classes: string = "sam list";

  ngOnInit() {
    this.css_classes += this.bulleted ? " bulleted" : "";
    this.css_classes += this.columns ? ` ${this.columns} columns` : "";
    this.css_classes += this.orientation ? ` ${this.orientation}` : "";
    this.css_classes += this.bullet ? ` ${this.bullet}` : "";
  }
}

@Component({
  selector: "sam-list-item",
  template: `
    <li [ngClass]="bullet">
      <span class="bullet" *ngIf="bullet"></span>
      <ng-content></ng-content>
    </li>
  `,
  standalone: false,
})
export class SamListItemComponent {
  @Input() public bullet: string;
}