feat(ng 2.0.37): ts errors fixed

README.md

@@ -46,15 +46,15 @@ tsd link
 - [x] Collapse
 - [+-] Datepicker (Datepicker popup not implemented)
 - [x] Dropdown
-- [ ] Modal
+- [ ] Modal (in progress...)
 - [x] Pagination
 - [ ] Popover
 - [x] Progressbar
 - [x] Rating
 - [x] Tabs
 - [x] Timepicker
 - [+-] Tooltip
-- [ ] Typeahead  (in progress...)
+- [x] Typeahead
 
 - [x] NgTransclude - to transclude templates
 - [x] positional service
@@ -66,7 +66,6 @@ Please read central `ng2` modules [readme](https://github.com/valor-software/ng2
 
 
 ### TODO
-- [ ] use lodash defaults and isDefined?
 - [ ] find a better way to detect is event handler is set (see alerts.ts)
 - [ ] support `templateUrl` for directives
 - [ ] support animation  (in progress...)

components/accordion/accordion.ts

@@ -51,7 +51,7 @@ export class Accordion {
 
 @Directive({
   selector: 'accordion-transclude, [accordion-transclude]',
-  properties: ['accordionTransclude'],
+  properties: ['accordionTransclude']
 })
 export class AccordionTransclude implements OnInit{
   private accordionTransclude:TemplateRef;
@@ -74,7 +74,7 @@ import {Collapse} from '../collapse/collapse';
   properties: ['templateUrl', 'heading', 'isOpen', 'isDisabled', 'panelClass'],
   host: {
     '[class.panel-open]': 'isOpen'
-  },
+  }
 })
 @View({
   template: `

components/alert/alert.ts

@@ -11,7 +11,7 @@ import {
 @Component({
   selector: 'alert',
   properties: ['type', 'dismissible', 'dismissOnTimeout'],
-  events: ['close'],
+  events: ['close']
 })
 @View({
   template: `
@@ -23,7 +23,7 @@ import {
     <ng-content></ng-content>
   </div>
   `,
-  directives: [NgIf, NgClass],
+  directives: [NgIf, NgClass]
 })
 export class Alert implements OnInit {
   type:string;

components/buttons/button-checkbox.ts

@@ -13,7 +13,7 @@ import {
   host: {
     '(click)': 'onClick()',
     '[class.active]': 'state'
-  },
+  }
 })
 export class ButtonCheckbox extends DefaultValueAccessor implements OnInit {
   private btnCheckboxTrue:any;

components/buttons/button-radio.ts

@@ -12,7 +12,7 @@ import {
   host: {
     '(click)': 'onClick()',
     '[class.active]': 'isActive'
-  },
+  }
 })
 export class ButtonRadio extends DefaultValueAccessor implements OnInit {
   private btnRadio:string;

components/carousel/carousel.ts

@@ -35,7 +35,7 @@ const NAVIGATION = {
 
 @Component({
   selector: 'carousel, [carousel]',
-  properties: ['interval', 'noTransition', 'noPause', 'noWrap'],
+  properties: ['interval', 'noTransition', 'noPause', 'noWrap']
 })
 // todo:
 // (ng-swipe-right)="prev()" (ng-swipe-left)="next()"
@@ -210,7 +210,7 @@ export class Carousel implements OnDestroy {
     '[class.active]': 'active',
     '[class.item]': 'true',
     '[class.carousel-item]': 'true'
-  },
+  }
 })
 @View({
   template: `

components/collapse/collapse.ts

@@ -2,7 +2,7 @@
 
 import {
   Component, View,
-  Directive, 
+  Directive,
   EventEmitter, ElementRef
 } from 'angular2/angular2';
 

components/datepicker/datepicker-inner.ts

@@ -68,7 +68,7 @@ const KEYS = {
     'customClass',
     'dateDisabled',
     'templateUrl'
-  ],
+  ]
 })
 @View({
   template: `

components/datepicker/datepicker-popup.ts

@@ -64,7 +64,7 @@ const datePickerPopupConfig:Object = {
         </li>
     </ul>`,
   directives: [NgClass, NgStyle, DatePicker, FORM_DIRECTIVES, CORE_DIRECTIVES],
-  encapsulation: ViewEncapsulation.NONE
+  encapsulation: ViewEncapsulation.None
 })
 class PopupContainer {
   public popupComp:DatePickerPopup;
@@ -119,7 +119,7 @@ class PopupContainer {
   selector: '[datepicker-popup][ng-model]',
   // prop -> datepickerPopup - format
   properties: ['datepickerPopup', 'isOpen'],
-  host: {'(cupdate)': 'onUpdate1($event)'},
+  host: {'(cupdate)': 'onUpdate1($event)'}
 })
 export class DatePickerPopup implements OnInit {
   private _activeDate:Date;

components/datepicker/daypicker.ts

@@ -35,10 +35,10 @@ const TEMPLATE_OPTIONS = {
   }
 };
 
-const CURRENT_THEME_TEMPLATE = TEMPLATE_OPTIONS[Ng2BootstrapConfig.theme] || TEMPLATE_OPTIONS.bs3;
+const CURRENT_THEME_TEMPLATE = TEMPLATE_OPTIONS[Ng2BootstrapConfig.theme || Ng2BootstrapTheme.BS3];
 
 @Component({
-  selector: 'daypicker, [daypicker]',
+  selector: 'daypicker, [daypicker]'
 })
 @View({
   template: `

components/datepicker/monthpicker.ts

@@ -34,7 +34,7 @@ const TEMPLATE_OPTIONS = {
 const CURRENT_THEME_TEMPLATE = TEMPLATE_OPTIONS[Ng2BootstrapConfig.theme] || TEMPLATE_OPTIONS.bs3;
 
 @Component({
-  selector: 'monthpicker, [monthpicker]',
+  selector: 'monthpicker, [monthpicker]'
 })
 @View({
   template: `

components/datepicker/yearpicker.ts

@@ -38,7 +38,7 @@ const TEMPLATE_OPTIONS = {
 const CURRENT_THEME_TEMPLATE = TEMPLATE_OPTIONS[Ng2BootstrapConfig.theme] || TEMPLATE_OPTIONS.bs3;
 
 @Component({
-  selector: 'yearpicker, [yearpicker]',
+  selector: 'yearpicker, [yearpicker]'
 })
 @View({
   template: `

components/dropdown/dropdown-menu.ts

@@ -5,7 +5,7 @@ import {Dropdown} from './dropdown';
 
 @Directive({
   selector: '[dropdown-menu], .dropdown-menu',
-  properties: ['templateUrl'],
+  properties: ['templateUrl']
 })
 export class DropdownMenu implements OnInit {
   public templateUrl:string;

components/dropdown/dropdown-toggle.ts

@@ -13,7 +13,7 @@ import {Dropdown} from './dropdown';
     '[class.disabled]': 'disabled',
     '[attr.aria-haspopup]': 'true',
     '[attr.aria-expanded]': 'isOpen'
-  },
+  }
 })
 export class DropdownToggle implements OnInit {
   private disabled:boolean = false;

components/pagination/pagination.ts

@@ -36,7 +36,7 @@ const paginationConfig = {
     'boundaryLinks', 'directionLinks',
     'firstText', 'previousText', 'nextText', 'lastText'
   ],
-  events: ['numPages'],
+  events: ['numPages']
 })
 @View({
   template: `
@@ -67,7 +67,7 @@ const paginationConfig = {
   </ul>
   `,
   directives: [CORE_DIRECTIVES, NgClass],
-  encapsulation: ViewEncapsulation.NONE
+  encapsulation: ViewEncapsulation.None
 })
 export class Pagination extends DefaultValueAccessor implements OnInit {
   public config:any;
@@ -259,7 +259,7 @@ const pagerConfig = {
     'align',
     'totalItems', 'itemsPerPage',
     'previousText', 'nextText',
-  ],
+  ]
 })
 @View({
   template: `

components/progressbar/progressbar.ts

@@ -23,11 +23,11 @@ const progressConfig = {
   host: {
     'class': 'progress',
     '[attr.max]': 'max'
-  },
+  }
 })
 // @View({
 //  template: `<div class="progress"><ng-content></ng-content></div>`,
-//  encapsulation: ViewEncapsulation.NONE
+//  encapsulation: ViewEncapsulation.None
 // })
 export class Progress implements OnInit {
   private _max:number;
@@ -69,7 +69,7 @@ export class Progress implements OnInit {
 // todo: use query from progress?
 @Component({
   selector: 'bar, [bar]',
-  properties: ['type', 'value'],
+  properties: ['type', 'value']
 })
 @View({
   template: `
@@ -85,7 +85,7 @@ export class Progress implements OnInit {
     ><ng-content></ng-content></div>
 `,
   directives: [NgStyle, NgClass],
-  encapsulation: ViewEncapsulation.NONE
+  encapsulation: ViewEncapsulation.None
 })
 export class Bar implements OnInit, OnDestroy {
   public type:string;

components/rating/rating.ts

@@ -18,7 +18,7 @@ import {
   events: ['onHover', 'onLeave'],
   host: {
     '(keydown)': 'onKeydown($event)'
-  },
+  }
 })
 @View({
   template: `

components/tabs/readme.md

@@ -21,7 +21,7 @@ import {tabs} from 'ng2-bootstrap';
   properties: ['vertical', 'justified', 'type'],
 })
 
-// class Tab implements OnInit, OnDestroy, OnCheck
+// class Tab implements OnInit, OnDestroy, DoCheck
 @Directive({
   selector: 'tab, [tab]',
   properties: ['active', 'disable', 'disabled', 'heading'],

components/tabs/tabs.ts

@@ -2,7 +2,7 @@
 
 import {
   Component, View, Directive,
-  OnInit, OnDestroy, OnCheck, EventEmitter,
+  OnInit, OnDestroy, DoCheck, EventEmitter,
   ElementRef, TemplateRef,
   CORE_DIRECTIVES, NgClass
 } from 'angular2/angular2';
@@ -13,7 +13,7 @@ import {NgTransclude} from '../common';
 // todo: fix? mixing static and dynamic tabs position tabs in order of creation
 @Component({
   selector: 'tabset',
-  properties: ['vertical', 'justified', 'type'],
+  properties: ['vertical', 'justified', 'type']
 })
 @View({
   template: `
@@ -82,9 +82,9 @@ export class Tabset implements OnInit{
   host: {
     '[class.tab-pane]': 'true',
     '[class.active]': 'active'
-  },
+  }
 })
-export class Tab implements OnInit, OnDestroy, OnCheck {
+export class Tab implements OnInit, OnDestroy, DoCheck {
   public _active:boolean;
   public disabled:boolean;
   public heading:string;
@@ -132,7 +132,8 @@ export class Tab implements OnInit, OnDestroy, OnCheck {
     });
   }
 
-  onCheck() {
+  doCheck():boolean {
+    return true;
   }
 
   onInit() {

components/timepicker/timepicker.ts

@@ -53,7 +53,7 @@ function addMinutes(date, minutes) {
     'mousewheel', 'arrowkeys',
     'showSpinners',
     'min', 'max'
-  ],
+  ]
 })
 @View({
   template: `

components/tooltip/tooltip.ts

@@ -40,7 +40,7 @@ class TooltipOptions {
       </div>
     </div>`,
   directives: [NgClass, NgStyle],
-  encapsulation: ViewEncapsulation.NONE
+  encapsulation: ViewEncapsulation.None
 })
 class TooltipContainer {
   private classMap:Object;
@@ -88,7 +88,7 @@ class TooltipContainer {
     '(mouseleave)': 'hide($event, $targe)',
     '(focusin)': 'show($event, $targe)',
     '(focusout)': 'hide($event, $targe)'
-  },
+  }
 })
 export class Tooltip implements OnInit {
   private visible:boolean = false;

components/typeahead/typeahead.ts

@@ -3,7 +3,7 @@
 import {
   Directive,
   Component, View, Self, NgModel,
-  LifecycleEvent, EventEmitter,
+  LifecycleEvent, EventEmitter, OnInit,
   ElementRef, DefaultValueAccessor,
   NgClass, NgStyle, Renderer, CORE_DIRECTIVES,
   ViewRef, ViewContainerRef, TemplateRef,
@@ -22,11 +22,11 @@ const TEMPLATE = {
   <div class="dropdown-menu"
       [ng-style]="{top: top, left: left, display: display}"
       style="display: block">
-      <a href
+      <a href="#"
          *ng-for="#match of matches"
+         (click)="selectMatch(match, $event)"
          [ng-class]="{active: isActive(match) }"
          (mouseenter)="selectActive(match)"
-         (^click)="selectMatch(match, $event)"
          class="dropdown-item"
          [inner-html]="hightlight(match, query)"></a>
   </div>
@@ -37,9 +37,8 @@ const TEMPLATE = {
       style="display: block">
     <li *ng-for="#match of matches"
         [ng-class]="{active: isActive(match) }"
-        (mouseenter)="selectActive(match)"
-        (^click)="selectMatch(match, $event)">
-        <a href tabindex="-1" [inner-html]="hightlight(match, query)"></a>
+        (mouseenter)="selectActive(match)">
+        <a href="#" (click)="selectMatch(match, $event)" tabindex="-1" [inner-html]="hightlight(match, query)"></a>
     </li>
   </ul>
   `
@@ -60,7 +59,7 @@ export class TypeaheadOptions {
 @View({
   template: TEMPLATE[Ng2BootstrapConfig.theme],
   directives: [CORE_DIRECTIVES, NgClass, NgStyle],
-  encapsulation: ViewEncapsulation.NONE
+  encapsulation: ViewEncapsulation.None
 })
 export class TypeaheadContainer {
   public parent:Typeahead;
@@ -132,6 +131,7 @@ export class TypeaheadContainer {
     this.parent.typeaheadOnSelect.next({
       item: value
     });
+    return false;
   }
 
   private escapeRegexp(queryToEscape) {
@@ -179,10 +179,9 @@ export class TypeaheadContainer {
   host: {
     '(keyup)': 'onChange($event)'
   },
-  lifecycle: [LifecycleEvent.onInit],
   directives: [CORE_DIRECTIVES, TypeaheadContainer]
 })
-export class Typeahead {
+export class Typeahead implements OnInit{
   public typeaheadLoading:EventEmitter = new EventEmitter();
   public typeaheadNoResults:EventEmitter = new EventEmitter();
   public typeaheadOnSelect:EventEmitter = new EventEmitter();