import { Component, Input, TemplateRef, ViewChild } from '@angular/core';
import { RowSelectorSettings } from '@mobilize/wms-framework';

/**
 * Placeholder for the row selector settings component
 *
 * @export
 * @class XamGridRowSelectorSettingsComponent
 */
@Component({
  selector: 'wm-xam-grid-row-selector-settings',
  template: `<ng-content></ng-content>`,
})
export class XamGridRowSelectorSettingsComponent {}

/**
 * Xam grid row selection settings as template.
 */
@Component({
  selector: 'wm-row-selector-settings',
  template: `
    <ng-template #rowNumbering let-context>
      <div class="igx-grid__cbx-padding">{{ context.index + 1 }}</div>
    </ng-template>
  `,
})
export class RowSelectorSettingsComponent {
  /**
   * Enables row numbering
   *
   * @memberof RowSelectorSettingsComponent
   */
  @Input()
  enableRowNumbering = true;

  /**
   * The default template when enable row numbering is enabled.
   *
   * @protected
   * @type {TemplateRef<any>}
   * @memberof RowSelectorSettingsComponent
   */
  @ViewChild('rowNumbering')
  public template: TemplateRef<any>;

  /**
   * RowSelector settings model
   *
   * @memberof RowSelectorSettingsComponent
   */
  public model = new RowSelectorSettings();
}