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

@Component({
  template: `
    <div>
      <dc-search-select (checkEvent)="checkEvent($event)" [required]="true" [multiple]="false" [currentValue]="currentValue"
                        [source]="source" [width]="'300px'" [maxHeight]="'200px'" [newStyle]="true"></dc-search-select>
      <dc-search-select (checkEvent)="checkEvent($event)" [multiple]="true" [currentValue]="currentValue" [source]="source"
                        [width]="'300px'" [maxHeight]="'200px'"></dc-search-select>
      <dc-search-select (checkEvent)="checkEvent($event)" [multiple]="true" [currentValue]="currentValue" [source]="source"
                        [width]="'300px'" [noSearch]="true" [maxHeight]="'200px'" [disable]="true"></dc-search-select>
    </div>
    <!--<div>
      <dc-search-select (checkEvent)="checkEvent($event)" [multiple]="false" [currentValue]="currentValue2" [source]="source1"
                        [width]="'300px'" [maxHeight]="'200px'"></dc-search-select>
    </div>-->
  `,
  selector: 'app-demo-button',
  styles: [`
  `]
})
export class DemoSearchSelectComponent implements OnInit {
  constructor() {
  }

  currentValue = [
    {
      name: 'List1',
      id: '1'
    }
  ];
  currentValue2 = [
    {
      name: 'List1',
      id: '1'
    }
  ];
  source = [
    {
      name: 'List1',
      id: '1'
    }, {
      name: 'List2',
      id: '2',
      noChecked: true
    }, {
      name: 'List3List3List3List3List3List3List3List3List3List3List3List3List3List3List3List3List3List3List3List3List3',
      id: '3',
      invalid: true
    }, {
      name: 'List4',
      id: '4'
    }, {
      name: 'List5',
      id: '5'
    }, {
      name: 'List6',
      id: '6'
    }, {
      name: 'List7',
      id: '7'
    }, {
      name: 'List8',
      id: '8'
    }, {
      name: 'List9',
      id: '9'
    }, {
      name: 'List10',
      id: '10'
    }, {
      name: 'List11',
      id: '11'
    }
  ];
  source1 = [
    {
      name: 'List1',
      id: '1'
    }, {
      name: 'List2',
      id: '2'
    }, {
      name: 'List3List3List3List3List3List3List3List3List3List3List3List3List3List3List3List3List3List3List3List3List3',
      id: '3'
    }, {
      name: 'List4',
      id: '4'
    }, {
      name: 'List5',
      id: '5'
    }, {
      name: 'List6',
      id: '6'
    }, {
      name: 'List7',
      id: '7'
    }, {
      name: 'List8',
      id: '8'
    }, {
      name: 'List9',
      id: '9'
    }, {
      name: 'List10',
      id: '10'
    }, {
      name: 'List11',
      id: '11'
    }
  ];

  ngOnInit() {
  }

  checkEvent(ev: any) {
    console.log('checkEvent', ev);
  }
}