diff --git a/components/accordion.ts b/components/accordion.ts index 73928a897e..8fe3657e49 100644 --- a/components/accordion.ts +++ b/components/accordion.ts @@ -1,6 +1,6 @@ -import {Accordion} from './accordion/accordion.component'; -import {AccordionPanel} from './accordion/accordion-group.component'; +import {AccordionComponent} from './accordion/accordion.component'; +import {AccordionPanelComponent} from './accordion/accordion-group.component'; -export {Accordion} from './accordion/accordion.component'; -export {AccordionPanel} from './accordion/accordion-group.component'; -export const ACCORDION_DIRECTIVES:Array = [Accordion, AccordionPanel]; +export {AccordionComponent} from './accordion/accordion.component'; +export {AccordionPanelComponent} from './accordion/accordion-group.component'; +export const ACCORDION_DIRECTIVES:Array = [AccordionComponent, AccordionPanelComponent]; diff --git a/components/accordion/accordion-group.component.ts b/components/accordion/accordion-group.component.ts index e33abc7635..0c88134275 100644 --- a/components/accordion/accordion-group.component.ts +++ b/components/accordion/accordion-group.component.ts @@ -2,13 +2,13 @@ import { Component, OnInit, OnDestroy, Input, HostBinding, Inject } from 'angular2/core'; import {NgClass} from 'angular2/common'; -import {Collapse} from '../collapse'; -import {Accordion} from './accordion.component'; +import {CollapseDirective} from '../collapse'; +import {AccordionComponent} from './accordion.component'; /* tslint:disable:component-selector-name */ @Component({ selector: 'accordion-group, accordion-panel', - directives: [Collapse, NgClass], + directives: [CollapseDirective, NgClass], template: `
@@ -27,7 +27,7 @@ import {Accordion} from './accordion.component';
` }) -export class AccordionPanel implements OnInit, OnDestroy { +export class AccordionPanelComponent implements OnInit, OnDestroy { @Input() public heading:string; @Input() public panelClass:string; @Input() public isDisabled:boolean; @@ -46,9 +46,9 @@ export class AccordionPanel implements OnInit, OnDestroy { } private _isOpen:boolean; - private accordion:Accordion; + private accordion:AccordionComponent; - public constructor(@Inject(Accordion) accordion:Accordion) { + public constructor(@Inject(AccordionComponent) accordion:AccordionComponent) { this.accordion = accordion; } diff --git a/components/accordion/accordion.component.ts b/components/accordion/accordion.component.ts index 5bc943863b..baac7d249a 100644 --- a/components/accordion/accordion.component.ts +++ b/components/accordion/accordion.component.ts @@ -1,12 +1,12 @@ import {Component, Input, HostBinding} from 'angular2/core'; -import {AccordionPanel} from './accordion-group.component'; +import {AccordionPanelComponent} from './accordion-group.component'; // todo: support template url @Component({ selector: 'accordion', template: `` }) -export class Accordion { +export class AccordionComponent { @Input() public closeOthers:boolean; /* tslint:disable:no-unused-variable */ @@ -14,25 +14,25 @@ export class Accordion { private addClass:boolean = true; /* tslint:enable:no-unused-variable */ - private groups:Array = []; + private groups:Array = []; - public closeOtherPanels(openGroup:AccordionPanel):void { + public closeOtherPanels(openGroup:AccordionPanelComponent):void { if (!this.closeOthers) { return; } - this.groups.forEach((group:AccordionPanel) => { + this.groups.forEach((group:AccordionPanelComponent) => { if (group !== openGroup) { group.isOpen = false; } }); } - public addGroup(group:AccordionPanel):void { + public addGroup(group:AccordionPanelComponent):void { this.groups.push(group); } - public removeGroup(group:AccordionPanel):void { + public removeGroup(group:AccordionPanelComponent):void { let index = this.groups.indexOf(group); if (index !== -1) { this.groups.splice(index, 1); diff --git a/components/accordion/readme.md b/components/accordion/readme.md index 22b9baf2fe..459dc52e6b 100644 --- a/components/accordion/readme.md +++ b/components/accordion/readme.md @@ -12,7 +12,7 @@ import { ACCORDION_DIRECTIVES } from 'ng2-bootstrap/components/accordion'; selector: 'accordion', template: `` }) -export class Accordion { +export class AccordionComponent { @Input() public closeOthers:boolean; @HostBinding('class.panel-group') @@ -24,7 +24,7 @@ export class Accordion { selector: 'accordion-group', directives: [Collapse, NgClass] }) -export class AccordionGroup implements OnInit, OnDestroy { +export class AccordionGroupComponent implements OnInit, OnDestroy { @Input() public heading:string; @Input() public panelClass:string; @Input() public isDisabled:boolean; diff --git a/components/alert.ts b/components/alert.ts index a1dbc1634e..c1f16d1493 100644 --- a/components/alert.ts +++ b/components/alert.ts @@ -1 +1 @@ -export {Alert} from './alert/alert.component'; +export {AlertComponent} from './alert/alert.component'; diff --git a/components/alert/alert.component.spec.ts b/components/alert/alert.component.spec.ts index f70475a526..12bb9b28b0 100644 --- a/components/alert/alert.component.spec.ts +++ b/components/alert/alert.component.spec.ts @@ -1,12 +1,12 @@ import {it, inject, beforeEachProviders} from 'angular2/testing'; -import {Alert} from './alert.component'; +import {AlertComponent} from './alert.component'; describe('Alert', () => { beforeEachProviders(() => [ - Alert + AlertComponent ]); - it('should have default type', inject([Alert], (alert:Alert) => { + it('should have default type', inject([AlertComponent], (alert:AlertComponent) => { expect(alert.type) .toEqual('warning'); })); diff --git a/components/alert/alert.component.ts b/components/alert/alert.component.ts index 70cc5a5fe4..bab2084c50 100644 --- a/components/alert/alert.component.ts +++ b/components/alert/alert.component.ts @@ -17,12 +17,12 @@ const ALERT_TEMPLATE = ` directives: [NgIf, NgClass], template: ALERT_TEMPLATE }) -export class Alert implements OnInit { +export class AlertComponent implements OnInit { @Input() public type:string = 'warning'; @Input() public dismissible:boolean; @Input() public dismissOnTimeout:number; - @Output() public close:EventEmitter = new EventEmitter(false); + @Output() public close:EventEmitter = new EventEmitter(false); private closed:boolean; private classes:Array = []; diff --git a/components/alert/readme.md b/components/alert/readme.md index db15331e1c..c05d6ab21c 100644 --- a/components/alert/readme.md +++ b/components/alert/readme.md @@ -1,6 +1,8 @@ ### Usage ```typescript -import { Alert } from 'ng2-bootstrap/ng2-bootstrap'; +import { AlertComponent } from 'ng2-bootstrap/ng2-bootstrap'; +// or +import { AlertComponent } from 'ng2-bootstrap/components/alert'; ``` ### Annotations @@ -11,7 +13,7 @@ import { Alert } from 'ng2-bootstrap/ng2-bootstrap'; directives: [NgIf, NgClass], template: ALERT_TEMPLATE }) -export class Alert implements OnInit { +export class AlertComponent implements OnInit { @Input() public type:string = 'warning'; @Input() public dismissible:boolean; @Input() public dismissOnTimeout:number; diff --git a/components/buttons.ts b/components/buttons.ts index 70a8bfb830..a1dffc726b 100644 --- a/components/buttons.ts +++ b/components/buttons.ts @@ -1,6 +1,6 @@ -import {ButtonCheckbox} from './buttons/button-checkbox.component'; -import {ButtonRadio} from './buttons/button-radio.component'; +import {ButtonCheckboxDirective} from './buttons/button-checkbox.directive.ts'; +import {ButtonRadioDirective} from './buttons/button-radio.directive.ts'; -export {ButtonCheckbox} from './buttons/button-checkbox.component'; -export {ButtonRadio} from './buttons/button-radio.component'; -export const BUTTON_DIRECTIVES:Array = [ButtonCheckbox, ButtonRadio]; +export {ButtonCheckboxDirective} from './buttons/button-checkbox.directive.ts'; +export {ButtonRadioDirective} from './buttons/button-radio.directive.ts'; +export const BUTTON_DIRECTIVES:Array = [ButtonCheckboxDirective, ButtonRadioDirective]; diff --git a/components/buttons/button-checkbox.component.ts b/components/buttons/button-checkbox.directive.ts similarity index 95% rename from components/buttons/button-checkbox.component.ts rename to components/buttons/button-checkbox.directive.ts index d015f59ddc..672666a561 100644 --- a/components/buttons/button-checkbox.component.ts +++ b/components/buttons/button-checkbox.directive.ts @@ -4,7 +4,7 @@ import { import {ControlValueAccessor, NgModel} from 'angular2/common'; @Directive({selector: '[btnCheckbox][ngModel]'}) -export class ButtonCheckbox implements ControlValueAccessor, OnInit { +export class ButtonCheckboxDirective implements ControlValueAccessor, OnInit { public cd:NgModel; @Input() public btnCheckboxTrue:any; diff --git a/components/buttons/button-radio.component.ts b/components/buttons/button-radio.directive.ts similarity index 94% rename from components/buttons/button-radio.component.ts rename to components/buttons/button-radio.directive.ts index 248913c052..8b76a9cff8 100644 --- a/components/buttons/button-radio.component.ts +++ b/components/buttons/button-radio.directive.ts @@ -4,7 +4,7 @@ import { import {ControlValueAccessor, NgModel} from 'angular2/common'; @Directive({selector: '[btnRadio][ngModel]'}) -export class ButtonRadio implements ControlValueAccessor, OnInit { +export class ButtonRadioDirective implements ControlValueAccessor, OnInit { public cd:NgModel; public el:ElementRef; diff --git a/components/buttons/readme.md b/components/buttons/readme.md index 7ea3e56688..f52d26d483 100644 --- a/components/buttons/readme.md +++ b/components/buttons/readme.md @@ -2,13 +2,13 @@ ```typescript import {BUTTON_DIRECTIVES} from 'ng2-bootstrap/ng2-bootstrap'; // or -import { ButtonRadio, ButtonCheckbox } from 'ng2-bootstrap/ng2-bootstrap'; +import { ButtonRadioComponent, ButtonCheckboxComponent } from 'ng2-bootstrap/ng2-bootstrap'; ``` ### Annotations ```typescript // component ButtonRadio @Directive({ selector: '[btnRadio][ngModel]' }) -export class ButtonRadio implements ControlValueAccessor, OnInit { +export class ButtonRadioComponent implements ControlValueAccessor, OnInit { @Input() public btnRadio:string; @Input() public uncheckable:boolean; @@ -20,7 +20,7 @@ export class ButtonRadio implements ControlValueAccessor, OnInit { } // component ButtonCheckbox @Directive({ selector: '[btnCheckbox][ngModel]' }) -export class ButtonCheckbox implements ControlValueAccessor, OnInit { +export class ButtonCheckboxComponent implements ControlValueAccessor, OnInit { @Input() private btnCheckboxTrue:any; @Input() private btnCheckboxFalse:any; diff --git a/components/carousel.ts b/components/carousel.ts index 18fc6b33fb..7e9990f76d 100644 --- a/components/carousel.ts +++ b/components/carousel.ts @@ -1,6 +1,6 @@ -import {Slide} from './carousel/slide.component'; -import {Carousel} from './carousel/carousel.component'; +import {SlideComponent} from './carousel/slide.component'; +import {CarouselComponent} from './carousel/carousel.component'; -export {Slide} from './carousel/slide.component'; -export {Carousel} from './carousel/carousel.component'; -export const CAROUSEL_DIRECTIVES:Array = [Carousel, Slide]; +export {SlideComponent} from './carousel/slide.component'; +export {CarouselComponent} from './carousel/carousel.component'; +export const CAROUSEL_DIRECTIVES:Array = [CarouselComponent, SlideComponent]; diff --git a/components/carousel/carousel.component.ts b/components/carousel/carousel.component.ts index 741e6f39a5..21dba6f606 100644 --- a/components/carousel/carousel.component.ts +++ b/components/carousel/carousel.component.ts @@ -3,7 +3,7 @@ import {Component, OnDestroy, Input} from 'angular2/core'; import {NgFor} from 'angular2/common'; import {Ng2BootstrapConfig, Ng2BootstrapTheme} from '../ng2-bootstrap-config'; -import {Slide} from './slide.component'; +import {SlideComponent} from './slide.component'; export enum Direction {UNKNOWN, NEXT, PREV} @@ -43,7 +43,7 @@ const NAVIGATION:any = {
` }) -export class Carousel implements OnDestroy { +export class CarouselComponent implements OnDestroy { @Input() public noWrap:boolean; @Input() public noPause:boolean; @Input() public noTransition:boolean; @@ -58,18 +58,18 @@ export class Carousel implements OnDestroy { this.restartTimer(); } - private slides:Array = []; + private slides:Array = []; private currentInterval:any; private isPlaying:boolean; private destroyed:boolean = false; - private currentSlide:Slide; + private currentSlide:SlideComponent; private _interval:number; public ngOnDestroy():void { this.destroyed = true; } - public select(nextSlide:Slide, direction:Direction = Direction.UNKNOWN):void { + public select(nextSlide:SlideComponent, direction:Direction = Direction.UNKNOWN):void { let nextIndex = nextSlide.index; if (direction === Direction.UNKNOWN) { direction = nextIndex > this.getCurrentIndex() @@ -122,7 +122,7 @@ export class Carousel implements OnDestroy { return this.select(this.getSlideByIndex(newIndex), Direction.PREV); } - public addSlide(slide:Slide):void { + public addSlide(slide:SlideComponent):void { slide.index = this.slides.length; this.slides.push(slide); if (this.slides.length === 1 || slide.active) { @@ -135,7 +135,7 @@ export class Carousel implements OnDestroy { } } - public removeSlide(slide:Slide):void { + public removeSlide(slide:SlideComponent):void { this.slides.splice(slide.index, 1); if (this.slides.length === 0) { @@ -148,7 +148,7 @@ export class Carousel implements OnDestroy { } } - private goNext(slide:Slide, direction:Direction):void { + private goNext(slide:SlideComponent, direction:Direction):void { if (this.destroyed) { return; } diff --git a/components/carousel/readme.md b/components/carousel/readme.md index ab5158c585..f8013ac62d 100644 --- a/components/carousel/readme.md +++ b/components/carousel/readme.md @@ -1,6 +1,8 @@ ### Usage ```typescript import { CAROUSEL_DIRECTIVES } from 'ng2-bootstrap/ng2-bootstrap'; +// or +import { CAROUSEL_DIRECTIVES } from 'ng2-bootstrap/components/carousel'; ``` ### Annotations @@ -10,7 +12,7 @@ import { CAROUSEL_DIRECTIVES } from 'ng2-bootstrap/ng2-bootstrap'; selector: 'carousel', directives: [NgFor] }) -export class Carousel implements OnDestroy { +export class CarouselComponent implements OnDestroy { @Input() private noWrap:boolean; @Input() private noPause:boolean; @Input() private noTransition:boolean; @@ -23,7 +25,7 @@ export class Carousel implements OnDestroy { selector: 'slide', directives: [NgClass] }) -export class Slide implements OnInit, OnDestroy { +export class SlideComponent implements OnInit, OnDestroy { @Input() public index:number; @Input() public direction:Direction; diff --git a/components/carousel/slide.component.ts b/components/carousel/slide.component.ts index 15bb5bc24f..729ecfaaff 100644 --- a/components/carousel/slide.component.ts +++ b/components/carousel/slide.component.ts @@ -1,5 +1,5 @@ import {Component, OnInit, OnDestroy, Input, HostBinding} from 'angular2/core'; -import {Carousel, Direction} from './carousel.component'; +import {CarouselComponent, Direction} from './carousel.component'; @Component({ selector: 'slide', @@ -9,7 +9,7 @@ import {Carousel, Direction} from './carousel.component'; ` }) -export class Slide implements OnInit, OnDestroy { +export class SlideComponent implements OnInit, OnDestroy { @Input() public index:number; @Input() public direction:Direction; @@ -20,9 +20,9 @@ export class Slide implements OnInit, OnDestroy { @HostBinding('class.carousel-item') public addClass:boolean = true; - private carousel:Carousel; + private carousel:CarouselComponent; - public constructor(carousel:Carousel) { + public constructor(carousel:CarouselComponent) { this.carousel = carousel; } diff --git a/components/collapse.ts b/components/collapse.ts index 48e5b47982..7bebd985f9 100644 --- a/components/collapse.ts +++ b/components/collapse.ts @@ -1 +1 @@ -export {Collapse} from './collapse/collapse.component'; +export {CollapseDirective} from './collapse/collapse.directive'; diff --git a/components/collapse/collapse.component.ts b/components/collapse/collapse.directive.ts similarity index 98% rename from components/collapse/collapse.component.ts rename to components/collapse/collapse.directive.ts index 0f4c9246b5..d57e5c4228 100644 --- a/components/collapse/collapse.component.ts +++ b/components/collapse/collapse.directive.ts @@ -6,7 +6,7 @@ import {AnimationBuilder} from 'angular2/src/animate/animation_builder'; // TODO: remove ElementRef // TODO: add on change @Directive({selector: '[collapse]'}) -export class Collapse implements OnInit { +export class CollapseDirective implements OnInit { private animation:any; // style diff --git a/components/collapse/readme.md b/components/collapse/readme.md index 813ab1e490..619b8c24b3 100644 --- a/components/collapse/readme.md +++ b/components/collapse/readme.md @@ -1,13 +1,15 @@ ### Usage ```typescript -import { Collapse } from 'ng2-bootstrap/ng2-bootstrap'; +import { CollapseDirective } from 'ng2-bootstrap/ng2-bootstrap'; +// or +import { CollapseDirective } from 'ng2-bootstrap/components/collapse'; ``` ### Annotations ```typescript // class Collapse @Directive({ selector: '[collapse]' }) -export class Collapse { +export class CollapseDirective { @Input() public set collapse(value:boolean) {} } ``` diff --git a/components/common.ts b/components/common.ts index 93cc931d37..660b554f3e 100644 --- a/components/common.ts +++ b/components/common.ts @@ -8,7 +8,7 @@ export interface KeyAttribute { selector: '[ngTransclude]', properties: ['ngTransclude'] }) -export class NgTransclude { +export class NgTranscludeDirective { public viewRef:ViewContainerRef; private _ngTransclude:TemplateRef; diff --git a/components/datepicker.ts b/components/datepicker.ts index 6ee8919363..603f52c4cf 100644 --- a/components/datepicker.ts +++ b/components/datepicker.ts @@ -6,9 +6,9 @@ 4. date-disabled attribute support 5. template-url attribute support */ -import {DatePickerPopup} from './datepicker/datepicker-popup'; -import {DatePicker} from './datepicker/datepicker'; +import {DatePickerPopupDirective} from './datepicker/datepicker-popup.component'; +import {DatePickerComponent} from './datepicker/datepicker.component'; -export {DatePickerPopup} from './datepicker/datepicker-popup'; -export {DatePicker} from './datepicker/datepicker'; -export const DATEPICKER_DIRECTIVES:Array = [DatePicker, DatePickerPopup]; +export {DatePickerPopupDirective} from './datepicker/datepicker-popup.component'; +export {DatePickerComponent} from './datepicker/datepicker.component'; +export const DATEPICKER_DIRECTIVES:Array = [DatePickerComponent, DatePickerPopupDirective]; diff --git a/components/datepicker/datepicker-inner.ts b/components/datepicker/datepicker-inner.component.ts similarity index 99% rename from components/datepicker/datepicker-inner.ts rename to components/datepicker/datepicker-inner.component.ts index 7d45bf9859..9cad4cd242 100644 --- a/components/datepicker/datepicker-inner.ts +++ b/components/datepicker/datepicker-inner.component.ts @@ -48,7 +48,7 @@ const SHORTCUT_PROPAGATION = false; `, directives: [FORM_DIRECTIVES, CORE_DIRECTIVES, NgClass, NgModel] }) -export class DatePickerInner implements OnInit { +export class DatePickerInnerComponent implements OnInit { @Input() public datepickerMode:string; @Input() public startingDay:number; @Input() public yearRange:number; diff --git a/components/datepicker/datepicker-popup.ts b/components/datepicker/datepicker-popup.component.ts similarity index 93% rename from components/datepicker/datepicker-popup.ts rename to components/datepicker/datepicker-popup.component.ts index fcd21f50d6..059f8d1f56 100644 --- a/components/datepicker/datepicker-popup.ts +++ b/components/datepicker/datepicker-popup.component.ts @@ -7,7 +7,7 @@ import { } from 'angular2/common'; import {KeyAttribute} from '../common'; import {positionService} from '../position'; -import {DatePicker} from './datepicker'; +import {DatePickerComponent} from './datepicker.component'; // import {DatePickerInner} from './datepicker-inner'; // import {DayPicker} from './daypicker'; @@ -53,12 +53,11 @@ const datePickerPopupConfig:KeyAttribute = { `, - directives: [NgClass, NgStyle, DatePicker, FORM_DIRECTIVES, CORE_DIRECTIVES], + directives: [NgClass, NgStyle, DatePickerComponent, FORM_DIRECTIVES, CORE_DIRECTIVES], encapsulation: ViewEncapsulation.None }) - -class PopupContainer { - public popupComp:DatePickerPopup; +class PopupContainerComponent { + public popupComp:DatePickerPopupDirective; private classMap:any; private top:string; @@ -119,7 +118,7 @@ class PopupContainer { properties: ['datepickerPopup', 'isOpen']/*, host: {'(cupdate)': 'onUpdate1($event)'}*/ }) -export class DatePickerPopup { +export class DatePickerPopupDirective { public cd:NgModel; public viewContainerRef:ViewContainerRef; public renderer:Renderer; @@ -187,7 +186,7 @@ export class DatePickerPopup { ]); this.popup = this.loader - .loadNextToLocation(PopupContainer, this.viewContainerRef, binding) + .loadNextToLocation(PopupContainerComponent, this.viewContainerRef, binding) .then((componentRef:ComponentRef) => { componentRef.instance.position(this.viewContainerRef); componentRef.instance.popupComp = this; diff --git a/components/datepicker/datepicker.ts b/components/datepicker/datepicker.component.ts similarity index 89% rename from components/datepicker/datepicker.ts rename to components/datepicker/datepicker.component.ts index 345962e028..aadabddf73 100644 --- a/components/datepicker/datepicker.ts +++ b/components/datepicker/datepicker.component.ts @@ -1,9 +1,9 @@ import {Component, Self, Input} from 'angular2/core'; import {CORE_DIRECTIVES, FORM_DIRECTIVES, ControlValueAccessor, NgModel} from 'angular2/common'; -import {DatePickerInner} from './datepicker-inner'; -import {DayPicker} from './daypicker'; -import {MonthPicker} from './monthpicker'; -import {YearPicker} from './yearpicker'; +import {DatePickerInnerComponent} from './datepicker-inner.component'; +import {DayPickerComponent} from './daypicker.component'; +import {MonthPickerComponent} from './monthpicker.component'; +import {YearPickerComponent} from './yearpicker.component'; // import {DatePickerPopup} from './datepicker-popup'; /* tslint:disable:component-selector-name component-selector-type */ @@ -37,11 +37,11 @@ import {YearPicker} from './yearpicker'; `, - directives: [DatePickerInner, DayPicker, MonthPicker, YearPicker, + directives: [DatePickerInnerComponent, DayPickerComponent, MonthPickerComponent, YearPickerComponent, FORM_DIRECTIVES, CORE_DIRECTIVES] }) /* tslint:enable:component-selector-name component-selector-type */ -export class DatePicker implements ControlValueAccessor { +export class DatePickerComponent implements ControlValueAccessor { @Input() public datepickerMode:string; @Input() public initDate:Date; @Input() public minDate:Date; diff --git a/components/datepicker/daypicker.ts b/components/datepicker/daypicker.component.ts similarity index 97% rename from components/datepicker/daypicker.ts rename to components/datepicker/daypicker.component.ts index 4d324db1cd..7ae1198964 100644 --- a/components/datepicker/daypicker.ts +++ b/components/datepicker/daypicker.component.ts @@ -1,7 +1,7 @@ import {Component, OnInit} from 'angular2/core'; import {CORE_DIRECTIVES, FORM_DIRECTIVES, NgClass} from 'angular2/common'; import {Ng2BootstrapConfig, Ng2BootstrapTheme} from '../ng2-bootstrap-config'; -import {DatePickerInner} from './datepicker-inner'; +import {DatePickerInnerComponent} from './datepicker-inner.component'; // write an interface for template options const TEMPLATE_OPTIONS:any = { @@ -93,15 +93,15 @@ const CURRENT_THEME_TEMPLATE:any = TEMPLATE_OPTIONS[Ng2BootstrapConfig.theme || `, directives: [FORM_DIRECTIVES, CORE_DIRECTIVES, NgClass] }) -export class DayPicker implements OnInit { +export class DayPickerComponent implements OnInit { public labels:Array = []; public title:string; public rows:Array = []; public weekNumbers:Array = []; - public datePicker:DatePickerInner; + public datePicker:DatePickerInnerComponent; - public constructor(datePicker:DatePickerInner) { + public constructor(datePicker:DatePickerInnerComponent) { this.datePicker = datePicker; } diff --git a/components/datepicker/monthpicker.ts b/components/datepicker/monthpicker.component.ts similarity index 94% rename from components/datepicker/monthpicker.ts rename to components/datepicker/monthpicker.component.ts index be8eab4bd5..964a17206a 100644 --- a/components/datepicker/monthpicker.ts +++ b/components/datepicker/monthpicker.component.ts @@ -1,6 +1,6 @@ import {Component, OnInit} from 'angular2/core'; import {CORE_DIRECTIVES, FORM_DIRECTIVES, NgClass} from 'angular2/common'; -import {DatePickerInner} from './datepicker-inner'; +import {DatePickerInnerComponent} from './datepicker-inner.component'; import {Ng2BootstrapConfig} from '../ng2-bootstrap-config'; // write an interface for template options @@ -64,12 +64,12 @@ const CURRENT_THEME_TEMPLATE:any = TEMPLATE_OPTIONS[Ng2BootstrapConfig.theme] || `, directives: [FORM_DIRECTIVES, CORE_DIRECTIVES, NgClass] }) -export class MonthPicker implements OnInit { +export class MonthPickerComponent implements OnInit { public title:string; public rows:Array = []; - public datePicker:DatePickerInner; + public datePicker:DatePickerInnerComponent; - public constructor(datePicker:DatePickerInner) { + public constructor(datePicker:DatePickerInnerComponent) { this.datePicker = datePicker; } diff --git a/components/datepicker/yearpicker.ts b/components/datepicker/yearpicker.component.ts similarity index 94% rename from components/datepicker/yearpicker.ts rename to components/datepicker/yearpicker.component.ts index aa2def7cbb..3c852abc01 100644 --- a/components/datepicker/yearpicker.ts +++ b/components/datepicker/yearpicker.component.ts @@ -1,7 +1,7 @@ import {Component, OnInit} from 'angular2/core'; import {CORE_DIRECTIVES, FORM_DIRECTIVES, NgClass} from 'angular2/common'; import {Ng2BootstrapConfig} from '../ng2-bootstrap-config'; -import {DatePickerInner} from './datepicker-inner'; +import {DatePickerInnerComponent} from './datepicker-inner.component'; // write an interface for template options const TEMPLATE_OPTIONS:any = { @@ -69,12 +69,12 @@ const CURRENT_THEME_TEMPLATE:any = TEMPLATE_OPTIONS[Ng2BootstrapConfig.theme] || `, directives: [FORM_DIRECTIVES, CORE_DIRECTIVES, NgClass] }) -export class YearPicker implements OnInit { - public datePicker:DatePickerInner; +export class YearPickerComponent implements OnInit { + public datePicker:DatePickerInnerComponent; private title:string; private rows:Array = []; - public constructor(datePicker:DatePickerInner) { + public constructor(datePicker:DatePickerInnerComponent) { this.datePicker = datePicker; } diff --git a/components/dropdown.ts b/components/dropdown.ts index 79bdcc959f..ac4275cb91 100644 --- a/components/dropdown.ts +++ b/components/dropdown.ts @@ -1,8 +1,8 @@ -import {Dropdown} from './dropdown/dropdown.directive'; -import {DropdownMenu} from './dropdown/dropdown-menu.directive'; -import {DropdownToggle} from './dropdown/dropdown-toggle.directive'; +import {DropdownDirective} from './dropdown/dropdown.directive'; +import {DropdownMenuDirective} from './dropdown/dropdown-menu.directive'; +import {DropdownToggleDirective} from './dropdown/dropdown-toggle.directive'; -export {Dropdown} from './dropdown/dropdown.directive'; -export {DropdownMenu} from './dropdown/dropdown-menu.directive'; -export {DropdownToggle} from './dropdown/dropdown-toggle.directive'; -export const DROPDOWN_DIRECTIVES: Array = [Dropdown, DropdownToggle, DropdownMenu]; +export {DropdownDirective} from './dropdown/dropdown.directive'; +export {DropdownMenuDirective} from './dropdown/dropdown-menu.directive'; +export {DropdownToggleDirective} from './dropdown/dropdown-toggle.directive'; +export const DROPDOWN_DIRECTIVES: Array = [DropdownDirective, DropdownToggleDirective, DropdownMenuDirective]; diff --git a/components/dropdown/dropdown-keyboard-nav.ts b/components/dropdown/dropdown-keyboard-nav.directive.ts similarity index 86% rename from components/dropdown/dropdown-keyboard-nav.ts rename to components/dropdown/dropdown-keyboard-nav.directive.ts index 18bdb5413a..999820a285 100644 --- a/components/dropdown/dropdown-keyboard-nav.ts +++ b/components/dropdown/dropdown-keyboard-nav.directive.ts @@ -1,14 +1,14 @@ import {Directive, ElementRef, HostListener} from 'angular2/core'; -import {Dropdown} from './dropdown.directive'; +import {DropdownDirective} from './dropdown.directive'; @Directive({ selector: '[dropdown][dropdownKeyboardNav]' }) -export class KeyboardNav { - private dd:Dropdown; +export class KeyboardNavDirective { + private dd:DropdownDirective; private el:ElementRef; - public constructor(dd:Dropdown, el:ElementRef) { + public constructor(dd:DropdownDirective, el:ElementRef) { this.dd = dd; this.el = el; console.warn('keyboard-nav deprecated'); diff --git a/components/dropdown/dropdown-menu.directive.ts b/components/dropdown/dropdown-menu.directive.ts index 17f11e2256..80773d770f 100644 --- a/components/dropdown/dropdown-menu.directive.ts +++ b/components/dropdown/dropdown-menu.directive.ts @@ -1,11 +1,11 @@ import {Directive, ElementRef, Host, OnInit} from 'angular2/core'; -import {Dropdown} from './dropdown.directive'; +import {DropdownDirective} from './dropdown.directive'; @Directive({selector: '[dropdownMenu]'}) -export class DropdownMenu implements OnInit { - public dropdown:Dropdown; +export class DropdownMenuDirective implements OnInit { + public dropdown:DropdownDirective; public el:ElementRef; - public constructor(@Host() dropdown:Dropdown, el:ElementRef) { + public constructor(@Host() dropdown:DropdownDirective, el:ElementRef) { this.dropdown = dropdown; this.el = el; } diff --git a/components/dropdown/dropdown-toggle.directive.ts b/components/dropdown/dropdown-toggle.directive.ts index 593270add5..486b4821c2 100644 --- a/components/dropdown/dropdown-toggle.directive.ts +++ b/components/dropdown/dropdown-toggle.directive.ts @@ -1,10 +1,10 @@ import { Directive, ElementRef, Host, OnInit, Input, HostBinding, HostListener } from 'angular2/core'; -import {Dropdown} from './dropdown.directive'; +import {DropdownDirective} from './dropdown.directive'; @Directive({selector: '[dropdownToggle]'}) -export class DropdownToggle implements OnInit { +export class DropdownToggleDirective implements OnInit { @HostBinding('class.disabled') @Input() public disabled:boolean = false; @@ -12,9 +12,9 @@ export class DropdownToggle implements OnInit { @HostBinding('attr.aria-haspopup') public addClass:boolean = true; - public dropdown:Dropdown; + public dropdown:DropdownDirective; public el:ElementRef; - public constructor(@Host() dropdown:Dropdown, el:ElementRef) { + public constructor(@Host() dropdown:DropdownDirective, el:ElementRef) { this.dropdown = dropdown; this.el = el; } diff --git a/components/dropdown/dropdown.directive.ts b/components/dropdown/dropdown.directive.ts index 11a968cc14..d9421d15b4 100644 --- a/components/dropdown/dropdown.directive.ts +++ b/components/dropdown/dropdown.directive.ts @@ -5,7 +5,7 @@ import { import {dropdownService, NONINPUT} from './dropdown.service'; @Directive({selector: '[dropdown]'}) -export class Dropdown implements OnInit, OnDestroy { +export class DropdownDirective implements OnInit, OnDestroy { @HostBinding('class.open') @Input() public get isOpen():boolean { diff --git a/components/dropdown/dropdown.service.ts b/components/dropdown/dropdown.service.ts index 649701b5e3..401daac5ab 100644 --- a/components/dropdown/dropdown.service.ts +++ b/components/dropdown/dropdown.service.ts @@ -3,15 +3,15 @@ export const DISABLED = 'disabled'; export const OUTSIDECLICK = 'outsideClick'; export const NONINPUT = 'nonInput'; -import {Dropdown} from './dropdown.directive'; +import {DropdownDirective} from './dropdown.directive'; export class DropdownService { - private openScope:Dropdown; + private openScope:DropdownDirective; private closeDropdownBind:EventListener = this.closeDropdown.bind(this); private keybindFilterBind:EventListener = this.keybindFilter.bind(this); - public open(dropdownScope:Dropdown):void { + public open(dropdownScope:DropdownDirective):void { if (!this.openScope) { window.document.addEventListener('click', this.closeDropdownBind, true); window.document.addEventListener('keydown', this.keybindFilterBind); @@ -24,7 +24,7 @@ export class DropdownService { this.openScope = dropdownScope; } - public close(dropdownScope:Dropdown):void { + public close(dropdownScope:DropdownDirective):void { if (this.openScope !== dropdownScope) { return; } diff --git a/components/dropdown/readme.md b/components/dropdown/readme.md index eb0f42118b..0bd1e54251 100644 --- a/components/dropdown/readme.md +++ b/components/dropdown/readme.md @@ -1,6 +1,8 @@ ### Usage ```typescript import { DROPDOWN_DIRECTIVES } from 'ng2-bootstrap/ng2-bootstrap'; +// or +import { DROPDOWN_DIRECTIVES } from 'ng2-bootstrap/components/dropdown'; ``` ```html diff --git a/components/pagination.ts b/components/pagination.ts index 06b94fb47f..8f15bee956 100644 --- a/components/pagination.ts +++ b/components/pagination.ts @@ -1,6 +1,6 @@ -import {Pagination} from './pagination/pagination.component'; -import {Pager} from './pagination/pager.component'; +import {PaginationComponent} from './pagination/pagination.component'; +import {PagerComponent} from './pagination/pager.component'; -export {Pagination} from './pagination/pagination.component'; -export {Pager} from './pagination/pager.component'; -export const PAGINATION_DIRECTIVES:Array = [Pagination, Pager]; +export {PaginationComponent} from './pagination/pagination.component'; +export {PagerComponent} from './pagination/pager.component'; +export const PAGINATION_DIRECTIVES:Array = [PaginationComponent, PagerComponent]; diff --git a/components/pagination/pager.component.ts b/components/pagination/pager.component.ts index 693fc9cb26..ac4a6bfb95 100644 --- a/components/pagination/pager.component.ts +++ b/components/pagination/pager.component.ts @@ -1,6 +1,6 @@ import {Component, OnInit, ElementRef, Renderer, Self} from 'angular2/core'; import {NgModel, NgClass} from 'angular2/common'; -import {Pagination} from './pagination.component'; +import {PaginationComponent} from './pagination.component'; const pagerConfig = { itemsPerPage: 10, @@ -32,7 +32,7 @@ const PAGER_TEMPLATE = ` ] }) /* tslint:enable */ -export class Pager extends Pagination implements OnInit { +export class PagerComponent extends PaginationComponent implements OnInit { public config:any = pagerConfig; public constructor(@Self() cd:NgModel, renderer:Renderer, elementRef:ElementRef) { diff --git a/components/pagination/pagination.component.ts b/components/pagination/pagination.component.ts index 9891cb31a7..3d6655fa7b 100644 --- a/components/pagination/pagination.component.ts +++ b/components/pagination/pagination.component.ts @@ -77,7 +77,7 @@ const PAGINATION_TEMPLATE = ` directives: [NgFor, NgIf] }) /* tslint:enable */ -export class Pagination implements ControlValueAccessor, OnInit, PaginationConfig, KeyAttribute { +export class PaginationComponent implements ControlValueAccessor, OnInit, PaginationConfig, KeyAttribute { public config:any; @Input() public maxSize:number; diff --git a/components/pagination/readme.md b/components/pagination/readme.md index 1208d5edf5..0a2d037151 100644 --- a/components/pagination/readme.md +++ b/components/pagination/readme.md @@ -1,6 +1,8 @@ ### Usage ```typescript import { PAGINATION_DIRECTIVES } from 'ng2-bootstrap/ng2-bootstrap'; +// or +import { PAGINATION_DIRECTIVES } from 'ng2-bootstrap/components/pagination'; ``` ### Annotations @@ -11,7 +13,7 @@ import { PAGINATION_DIRECTIVES } from 'ng2-bootstrap/ng2-bootstrap'; template: PAGINATION_TEMPLATE, directives: [NgClass, NgFor] }) -export class Pagination implements ControlValueAccessor, OnInit, IPaginationConfig, IAttribute { +export class PaginationComponent implements ControlValueAccessor, OnInit, IPaginationConfig, IAttribute { @Input() public maxSize:number; @Input() public boundaryLinks:boolean; @@ -41,9 +43,9 @@ export class Pagination implements ControlValueAccessor, OnInit, IPaginationConf template: PAGER_TEMPLATE, directives: [NgClass] }) -export class Pager extends Pagination {} +export class PagerComponent extends Pagination {} -export const PAGINATION_DIRECTIVES:Array = [Pagination, Pager]; +export const PAGINATION_DIRECTIVES:Array = [PaginationComponent, PagerComponent]; ``` ### Pagination properties - `rotate` (`?boolean=true`) - if `true` current page will in the middle of pages list diff --git a/components/progressbar.ts b/components/progressbar.ts index 4aac0d32f7..98151da083 100644 --- a/components/progressbar.ts +++ b/components/progressbar.ts @@ -1,8 +1,8 @@ -import {Progress} from './progressbar/progress.directive'; -import {Bar} from './progressbar/bar.component'; -import {Progressbar} from './progressbar/progressbar.component'; +import {ProgressDirective} from './progressbar/progress.directive'; +import {BarComponent} from './progressbar/bar.component'; +import {ProgressbarComponent} from './progressbar/progressbar.component'; -export {Progress} from './progressbar/progress.directive'; -export {Bar} from './progressbar/bar.component'; -export {Progressbar} from './progressbar/progressbar.component'; -export const PROGRESSBAR_DIRECTIVES:Array = [Progress, Bar, Progressbar]; +export {ProgressDirective} from './progressbar/progress.directive'; +export {BarComponent} from './progressbar/bar.component'; +export {ProgressbarComponent} from './progressbar/progressbar.component'; +export const PROGRESSBAR_DIRECTIVES:Array = [ProgressDirective, BarComponent, ProgressbarComponent]; diff --git a/components/progressbar/bar.component.ts b/components/progressbar/bar.component.ts index 406e2975d8..871f49b7eb 100644 --- a/components/progressbar/bar.component.ts +++ b/components/progressbar/bar.component.ts @@ -1,6 +1,6 @@ import {Component, OnInit, OnDestroy, Input, Host} from 'angular2/core'; import {NgClass, NgStyle} from 'angular2/common'; -import {Progress} from './progress.directive'; +import {ProgressDirective} from './progress.directive'; // todo: number pipe // todo: use query from progress? @@ -19,7 +19,7 @@ import {Progress} from './progress.directive'; [attr.aria-valuemax]="max"> ` }) -export class Bar implements OnInit, OnDestroy { +export class BarComponent implements OnInit, OnDestroy { @Input() public type:string; @Input() @@ -37,10 +37,10 @@ export class Bar implements OnInit, OnDestroy { public percent:number = 0; public transition:string; - public progress:Progress; + public progress:ProgressDirective; private _value:number; - public constructor(@Host() progress:Progress) { + public constructor(@Host() progress:ProgressDirective) { this.progress = progress; } @@ -55,7 +55,7 @@ export class Bar implements OnInit, OnDestroy { public recalculatePercentage():void { this.percent = +(100 * this.value / this.progress.max).toFixed(2); - let totalPercentage = this.progress.bars.reduce(function (total:number, bar:Bar):number { + let totalPercentage = this.progress.bars.reduce(function (total:number, bar:BarComponent):number { return total + bar.percent; }, 0); diff --git a/components/progressbar/progress.directive.ts b/components/progressbar/progress.directive.ts index 1ada18669e..86ce4a7726 100644 --- a/components/progressbar/progress.directive.ts +++ b/components/progressbar/progress.directive.ts @@ -1,5 +1,5 @@ import {Directive, OnInit, Input, HostBinding} from 'angular2/core'; -import {Bar} from './bar.component'; +import {BarComponent} from './bar.component'; const progressConfig = { animate: true, @@ -11,7 +11,7 @@ const progressConfig = { /* tslint:disable */ @Directive({selector: 'bs-progress, [progress]'}) /* tslint:enable */ -export class Progress implements OnInit { +export class ProgressDirective implements OnInit { @Input() public animate:boolean; @HostBinding('attr.max') @@ -24,7 +24,7 @@ export class Progress implements OnInit { public set max(v:number) { this._max = v; - this.bars.forEach((bar:Bar) => { + this.bars.forEach((bar:BarComponent) => { bar.recalculatePercentage(); }); } @@ -38,14 +38,14 @@ export class Progress implements OnInit { this.max = typeof this.max === 'number' ? this.max : progressConfig.max; } - public addBar(bar:Bar):void { + public addBar(bar:BarComponent):void { if (!this.animate) { bar.transition = 'none'; } this.bars.push(bar); } - public removeBar(bar:Bar):void { + public removeBar(bar:BarComponent):void { this.bars.splice(this.bars.indexOf(bar), 1); } } diff --git a/components/progressbar/progressbar.component.ts b/components/progressbar/progressbar.component.ts index 25e0af3823..412477d994 100644 --- a/components/progressbar/progressbar.component.ts +++ b/components/progressbar/progressbar.component.ts @@ -1,10 +1,10 @@ import {Component, Input} from 'angular2/core'; -import {Progress} from './progress.directive'; -import {Bar} from './bar.component'; +import {ProgressDirective} from './progress.directive'; +import {BarComponent} from './bar.component'; @Component({ selector: 'progressbar', - directives: [Progress, Bar], + directives: [ProgressDirective, BarComponent], template: `
@@ -13,7 +13,7 @@ import {Bar} from './bar.component';
` }) -export class Progressbar { +export class ProgressbarComponent { @Input() public animate:boolean; @Input() public max:number; @Input() public type:string; diff --git a/components/progressbar/readme.md b/components/progressbar/readme.md index 6db83f67b5..36f2801598 100644 --- a/components/progressbar/readme.md +++ b/components/progressbar/readme.md @@ -7,7 +7,7 @@ import { PROGRESSBAR_DIRECTIVES } from 'ng2-bootstrap/ng2-bootstrap'; ```typescript // class Progress implements OnInit @Directive({ selector: 'bs-progress, [progress]' }) -export class Progress implements OnInit { +export class ProgressDirective implements OnInit { @Input() public animate:boolean; @HostBinding('attr.max') @@ -21,7 +21,7 @@ export class Progress implements OnInit { selector: 'bar, [bar]', directives: [NgClass, NgStyle] }) -export class Bar implements OnInit, OnDestroy { +export class BarComponent implements OnInit, OnDestroy { @Input() public type:string; @Input() public get value():number } @@ -31,7 +31,7 @@ export class Bar implements OnInit, OnDestroy { selector: 'progressbar, [progressbar]', directives: [Progress, Bar] }) -export class Progressbar { +export class ProgressbarComponent { @Input() private animate:boolean; @Input() private max:number; @Input() private type:string; diff --git a/components/rating.ts b/components/rating.ts index a9c0fb8b16..dce09eb597 100644 --- a/components/rating.ts +++ b/components/rating.ts @@ -1 +1 @@ -export {Rating} from './rating/rating.component'; +export {RatingComponent} from './rating/rating.component'; diff --git a/components/rating/rating.component.ts b/components/rating/rating.component.ts index ab02a8f7de..3fb8128f5d 100644 --- a/components/rating/rating.component.ts +++ b/components/rating/rating.component.ts @@ -17,7 +17,7 @@ import {NgFor, ControlValueAccessor, NgModel} from 'angular2/common'; ` }) -export class Rating implements ControlValueAccessor, OnInit { +export class RatingComponent implements ControlValueAccessor, OnInit { @Input() public max:number; @Input() public stateOn:string; @Input() public stateOff:string; diff --git a/components/rating/readme.md b/components/rating/readme.md index eeeb1509db..0132ef5dd8 100644 --- a/components/rating/readme.md +++ b/components/rating/readme.md @@ -1,6 +1,8 @@ ### Usage ```typescript -import { Rating } from 'ng2-bootstrap/ng2-bootstrap'; +import { RatingComponent } from 'ng2-bootstrap/ng2-bootstrap'; +// or +import { RatingComponent } from 'ng2-bootstrap/components/rating'; ``` ### Annotations @@ -10,7 +12,7 @@ import { Rating } from 'ng2-bootstrap/ng2-bootstrap'; selector: 'rating[ngModel]', directives: [NgFor] }) -export class Rating implements ControlValueAccessor, OnInit { +export class RatingComponent implements ControlValueAccessor, OnInit { @Input() private max:number; @Input() private stateOn:string; @Input() private stateOff:string; diff --git a/components/tabs.ts b/components/tabs.ts index cbc8576b14..471e658cfb 100644 --- a/components/tabs.ts +++ b/components/tabs.ts @@ -1,8 +1,8 @@ -import {Tab} from './tabs/tab.directive'; -import {Tabset} from './tabs/tabset.component'; -import {TabHeading} from './tabs/tab-heading.directive'; +import {TabDirective} from './tabs/tab.directive'; +import {TabsetComponent} from './tabs/tabset.component'; +import {TabHeadingDirective} from './tabs/tab-heading.directive'; -export {Tab} from './tabs/tab.directive'; -export {Tabset} from './tabs/tabset.component'; -export {TabHeading} from './tabs/tab-heading.directive'; -export const TAB_DIRECTIVES:Array = [Tab, TabHeading, Tabset]; +export {TabDirective} from './tabs/tab.directive'; +export {TabsetComponent} from './tabs/tabset.component'; +export {TabHeadingDirective} from './tabs/tab-heading.directive'; +export const TAB_DIRECTIVES:Array = [TabDirective, TabHeadingDirective, TabsetComponent]; diff --git a/components/tabs/readme.md b/components/tabs/readme.md index 251edee615..23ce50f610 100644 --- a/components/tabs/readme.md +++ b/components/tabs/readme.md @@ -1,6 +1,8 @@ ### Usage ```typescript import { TAB_DIRECTIVES } from 'ng2-bootstrap/ng2-bootstrap'; +// or +import { TAB_DIRECTIVES } from 'ng2-bootstrap/components/tabs'; ``` ```html @@ -20,7 +22,7 @@ import { TAB_DIRECTIVES } from 'ng2-bootstrap/ng2-bootstrap'; selector: 'tabset', directives: [NgClass, NgTransclude] }) -export class Tabset implements OnInit { +export class TabsetComponent implements OnInit { @Input() public vertical:boolean; @Input() public justified:boolean; @Input() public type:string; @@ -28,7 +30,7 @@ export class Tabset implements OnInit { // directive Tab @Directive({ selector: 'tab, [tab]' }) -export class Tab implements OnInit, OnDestroy, DoCheck { +export class TabDirective implements OnInit, OnDestroy, DoCheck { @Input() public heading:string; @Input() public disabled:boolean; @Input() public removable:boolean; @@ -44,7 +46,7 @@ export class Tab implements OnInit, OnDestroy, DoCheck { // directive TabHeading @Directive({selector: '[tab-heading]'}) -export class TabHeading {} +export class TabHeadingDirective {} export const TAB_DIRECTIVES:Array = [Tab, TabHeading, Tabset]; ``` diff --git a/components/tabs/tab-heading.directive.ts b/components/tabs/tab-heading.directive.ts index d73fe68a8d..663217072a 100644 --- a/components/tabs/tab-heading.directive.ts +++ b/components/tabs/tab-heading.directive.ts @@ -1,10 +1,10 @@ import {Directive, TemplateRef} from 'angular2/core'; -import {Tab} from './tab.directive'; +import {TabDirective} from './tab.directive'; @Directive({selector: '[tabHeading]'}) -export class TabHeading { +export class TabHeadingDirective { public templateRef:TemplateRef; - public constructor(templateRef:TemplateRef, tab:Tab) { + public constructor(templateRef:TemplateRef, tab:TabDirective) { tab.headingRef = templateRef; } } diff --git a/components/tabs/tab.directive.ts b/components/tabs/tab.directive.ts index 20778e4b30..04689faf78 100644 --- a/components/tabs/tab.directive.ts +++ b/components/tabs/tab.directive.ts @@ -1,12 +1,12 @@ import { Directive, OnDestroy, Input, Output, HostBinding, TemplateRef, EventEmitter } from 'angular2/core'; -import {Tabset} from './tabset.component'; +import {TabsetComponent} from './tabset.component'; /* tslint:disable */ @Directive({selector: 'tab, [tab]'}) /* tslint:enable */ -export class Tab implements OnDestroy { +export class TabDirective implements OnDestroy { @Input() public heading:string; @Input() public disabled:boolean; @Input() public removable:boolean; @@ -18,9 +18,9 @@ export class Tab implements OnDestroy { return this._active; } - @Output() public select:EventEmitter = new EventEmitter(false); - @Output() public deselect:EventEmitter = new EventEmitter(false); - @Output() public removed:EventEmitter = new EventEmitter(false); + @Output() public select:EventEmitter = new EventEmitter(false); + @Output() public deselect:EventEmitter = new EventEmitter(false); + @Output() public removed:EventEmitter = new EventEmitter(false); public set active(active:boolean) { if (this.disabled && active || !active) { @@ -34,7 +34,7 @@ export class Tab implements OnDestroy { this._active = active; this.select.emit(this); - this.tabset.tabs.forEach((tab:Tab) => { + this.tabset.tabs.forEach((tab:TabDirective) => { if (tab !== this) { tab.active = false; } @@ -44,10 +44,10 @@ export class Tab implements OnDestroy { @HostBinding('class.tab-pane') public addClass:boolean = true; public headingRef:TemplateRef; - public tabset:Tabset; + public tabset:TabsetComponent; private _active:boolean; - public constructor(tabset:Tabset) { + public constructor(tabset:TabsetComponent) { this.tabset = tabset; this.tabset.addTab(this); } diff --git a/components/tabs/tabset.component.ts b/components/tabs/tabset.component.ts index bbdf10ffb7..6a1993c957 100644 --- a/components/tabs/tabset.component.ts +++ b/components/tabs/tabset.component.ts @@ -1,12 +1,12 @@ import {Component, OnInit, OnDestroy, HostBinding, Input} from 'angular2/core'; import {NgClass} from 'angular2/common'; -import {NgTransclude} from '../common'; -import {Tab} from './tab.directive'; +import {NgTranscludeDirective} from '../common'; +import {TabDirective} from './tab.directive'; // todo: add active event to tab // todo: fix? mixing static and dynamic tabs position tabs in order of creation @Component({ selector: 'tabset', - directives: [NgClass, NgTransclude], + directives: [NgClass, NgTranscludeDirective], template: `
  • ` }) -export class Tabset implements OnInit, OnDestroy { +export class TabsetComponent implements OnInit, OnDestroy { @Input() public get vertical():boolean { return this._vertical;}; @@ -53,7 +53,7 @@ export class Tabset implements OnInit, OnDestroy { this.setClassMap(); } - public tabs:Array = []; + public tabs:Array = []; private isDestroyed:boolean; private _vertical:boolean; @@ -69,12 +69,12 @@ export class Tabset implements OnInit, OnDestroy { this.isDestroyed = true; } - public addTab(tab:Tab):void { + public addTab(tab:TabDirective):void { this.tabs.push(tab); tab.active = this.tabs.length === 1 && tab.active !== false; } - public removeTab(tab:Tab):void { + public removeTab(tab:TabDirective):void { let index = this.tabs.indexOf(tab); if (index === -1 || this.isDestroyed) { return; diff --git a/components/timepicker.ts b/components/timepicker.ts index bdbd8cd597..ceb7896d5a 100644 --- a/components/timepicker.ts +++ b/components/timepicker.ts @@ -1 +1 @@ -export {Timepicker} from './timepicker/timepicker.component'; +export {TimepickerComponent} from './timepicker/timepicker.component'; diff --git a/components/timepicker/readme.md b/components/timepicker/readme.md index d982575521..243a823c58 100644 --- a/components/timepicker/readme.md +++ b/components/timepicker/readme.md @@ -1,6 +1,8 @@ ### Usage ```typescript -import { Timepicker } from 'ng2-bootstrap/ng2-bootstrap'; +import { TimepickerComponent } from 'ng2-bootstrap/ng2-bootstrap'; +// or +import { TimepickerComponent } from 'ng2-bootstrap/components/timepicker'; ``` ### Annotations @@ -10,7 +12,7 @@ import { Timepicker } from 'ng2-bootstrap/ng2-bootstrap'; selector: 'timepicker[ngModel]', directives: [NgClass] }) -export class Timepicker implements ControlValueAccessor, OnInit { +export class TimepickerComponent implements ControlValueAccessor, OnInit { // config @Input() private hourStep:number; @Input() private minuteStep:number; diff --git a/components/timepicker/timepicker.component.ts b/components/timepicker/timepicker.component.ts index 79b1ecaad4..e44903783a 100644 --- a/components/timepicker/timepicker.component.ts +++ b/components/timepicker/timepicker.component.ts @@ -82,7 +82,7 @@ function addMinutes(date:any, minutes:number):Date { ` }) -export class Timepicker implements ControlValueAccessor, OnInit { +export class TimepickerComponent implements ControlValueAccessor, OnInit { public cd:NgModel; // config @Input() public hourStep:number; diff --git a/components/tooltip.ts b/components/tooltip.ts index 0d3faed712..838e6df611 100644 --- a/components/tooltip.ts +++ b/components/tooltip.ts @@ -1,6 +1,6 @@ -import {Tooltip} from './tooltip/tooltip.directive'; -import {TooltipContainer} from './tooltip/tooltip-container.component'; +import {TooltipDirective} from './tooltip/tooltip.directive'; +import {TooltipContainerComponent} from './tooltip/tooltip-container.component'; -export {Tooltip} from './tooltip/tooltip.directive'; -export {TooltipContainer} from './tooltip/tooltip-container.component'; -export const TOOLTIP_DIRECTIVES:Array = [Tooltip, TooltipContainer]; +export {TooltipDirective} from './tooltip/tooltip.directive'; +export {TooltipContainerComponent} from './tooltip/tooltip-container.component'; +export const TOOLTIP_DIRECTIVES:Array = [TooltipDirective, TooltipContainerComponent]; diff --git a/components/tooltip/readme.md b/components/tooltip/readme.md index 25c38294ff..0b53874424 100644 --- a/components/tooltip/readme.md +++ b/components/tooltip/readme.md @@ -7,7 +7,7 @@ import { TOOLTIP_DIRECTIVES } from 'ng2-bootstrap/ng2-bootstrap'; ```typescript // class Tooltip implements OnInit @Directive({ selector: '[tooltip]' }) -export class Tooltip implements OnInit { +export class TooltipDirective implements OnInit { @Input('tooltip') private content:string; @Input('tooltipPlacement') private placement:string = 'top'; @Input('tooltipIsOpen') private isOpen:boolean; diff --git a/components/tooltip/tooltip-container.component.ts b/components/tooltip/tooltip-container.component.ts index 26d874abe7..480392be2c 100644 --- a/components/tooltip/tooltip-container.component.ts +++ b/components/tooltip/tooltip-container.component.ts @@ -18,7 +18,7 @@ import {TooltipOptions} from './tooltip-options.class'; ` }) -export class TooltipContainer implements AfterViewInit { +export class TooltipContainerComponent implements AfterViewInit { /* tslint:disable */ private classMap:any; private top:string = '-1000px'; diff --git a/components/tooltip/tooltip.directive.ts b/components/tooltip/tooltip.directive.ts index 9988ec8196..ae25eb7c5d 100644 --- a/components/tooltip/tooltip.directive.ts +++ b/components/tooltip/tooltip.directive.ts @@ -3,10 +3,10 @@ import { ComponentRef, Provider, ReflectiveInjector, ViewContainerRef } from 'angular2/core'; import {TooltipOptions} from './tooltip-options.class'; -import {TooltipContainer} from './tooltip-container.component'; +import {TooltipContainerComponent} from './tooltip-container.component'; @Directive({selector: '[tooltip]'}) -export class Tooltip { +export class TooltipDirective { /* tslint:disable */ @Input('tooltip') public content:string; @Input('tooltipPlacement') public placement:string = 'top'; @@ -48,7 +48,7 @@ export class Tooltip { ]); this.tooltip = this.loader - .loadNextToLocation(TooltipContainer, this.viewContainerRef, binding) + .loadNextToLocation(TooltipContainerComponent, this.viewContainerRef, binding) .then((componentRef:ComponentRef) => { return componentRef; }); diff --git a/components/typeahead.ts b/components/typeahead.ts index d305efa9fb..c4ab96c77b 100644 --- a/components/typeahead.ts +++ b/components/typeahead.ts @@ -1,7 +1,7 @@ -import {Typeahead} from './typeahead/typeahead.directive'; -import {TypeaheadContainer} from './typeahead/typeahead-container.component'; +import {TypeaheadDirective} from './typeahead/typeahead.directive'; +import {TypeaheadContainerComponent} from './typeahead/typeahead-container.component'; -export {Typeahead} from './typeahead/typeahead.directive'; -export {TypeaheadContainer} from './typeahead/typeahead-container.component'; +export {TypeaheadDirective} from './typeahead/typeahead.directive'; +export {TypeaheadContainerComponent} from './typeahead/typeahead-container.component'; export {TypeaheadOptions} from './typeahead/typeahead-options.class'; -export const TYPEAHEAD_DIRECTIVES = [Typeahead, TypeaheadContainer]; +export const TYPEAHEAD_DIRECTIVES = [TypeaheadDirective, TypeaheadContainerComponent]; diff --git a/components/typeahead/readme.md b/components/typeahead/readme.md index d093c1370f..a136c2669b 100644 --- a/components/typeahead/readme.md +++ b/components/typeahead/readme.md @@ -9,7 +9,7 @@ import { TYPEAHEAD_DIRECTIVES } from 'ng2-bootstrap/ng2-bootstrap'; @Directive({ selector: 'typeahead, [typeahead]' }) -export class Typeahead implements OnInit { +export class TypeaheadDirective implements OnInit { @Output() public typeaheadLoading:EventEmitter; @Output() public typeaheadNoResults:EventEmitter; @Output() public typeaheadOnSelect:EventEmitter<{item: any}>; diff --git a/components/typeahead/typeahead-container.component.ts b/components/typeahead/typeahead-container.component.ts index 601b724687..87d5694935 100644 --- a/components/typeahead/typeahead-container.component.ts +++ b/components/typeahead/typeahead-container.component.ts @@ -1,7 +1,7 @@ import {Component, ElementRef, ViewEncapsulation} from 'angular2/core'; import {CORE_DIRECTIVES} from 'angular2/common'; import {TypeaheadUtils} from './typeahead-utils'; -import {Typeahead} from './typeahead.directive'; +import {TypeaheadDirective} from './typeahead.directive'; import {TypeaheadOptions} from './typeahead-options.class'; import {positionService} from '../position'; import {Ng2BootstrapConfig, Ng2BootstrapTheme} from '../ng2-bootstrap-config'; @@ -39,8 +39,8 @@ const TEMPLATE:any = { template: TEMPLATE[Ng2BootstrapConfig.theme], encapsulation: ViewEncapsulation.None }) -export class TypeaheadContainer { - public parent:Typeahead; +export class TypeaheadContainerComponent { + public parent:TypeaheadDirective; public query:any; public element:ElementRef; public isFocused:boolean = false; diff --git a/components/typeahead/typeahead-options.class.ts b/components/typeahead/typeahead-options.class.ts index 4d8db7787f..d6fd2c42cf 100644 --- a/components/typeahead/typeahead-options.class.ts +++ b/components/typeahead/typeahead-options.class.ts @@ -1,9 +1,9 @@ -import {Typeahead}from './typeahead.directive'; +import {TypeaheadDirective}from './typeahead.directive'; export class TypeaheadOptions { public placement:string; public animation:boolean; - public typeaheadRef:Typeahead; + public typeaheadRef:TypeaheadDirective; public constructor(options:TypeaheadOptions) { Object.assign(this, options); diff --git a/components/typeahead/typeahead.directive.ts b/components/typeahead/typeahead.directive.ts index 5e84d29586..08abecb0bf 100644 --- a/components/typeahead/typeahead.directive.ts +++ b/components/typeahead/typeahead.directive.ts @@ -4,7 +4,7 @@ import { } from 'angular2/core'; import {NgModel} from 'angular2/common'; import {TypeaheadUtils} from './typeahead-utils'; -import {TypeaheadContainer} from './typeahead-container.component'; +import {TypeaheadContainerComponent} from './typeahead-container.component'; import {TypeaheadOptions} from './typeahead-options.class'; // https://github.com/angular/angular/blob/master/modules/angular2/src/core/forms/directives/shared.ts @@ -15,7 +15,7 @@ function setProperty(renderer:Renderer, elementRef:ElementRef, propName:string, @Directive({ selector: '[typeahead][ngModel]' }) -export class Typeahead implements OnInit { +export class TypeaheadDirective implements OnInit { @Output() public typeaheadLoading:EventEmitter = new EventEmitter(false); @Output() public typeaheadNoResults:EventEmitter = new EventEmitter(false); @Output() public typeaheadOnSelect:EventEmitter<{item:any}> = new EventEmitter(false); @@ -40,7 +40,7 @@ export class Typeahead implements OnInit { // @Input() private typeaheadSelectOnBlur:boolean; // @Input() private typeaheadFocusOnSelect:boolean; - public container:TypeaheadContainer; + public container:TypeaheadContainerComponent; public isTypeaheadOptionsListActive:boolean = false; private debouncer:Function; @@ -214,7 +214,7 @@ export class Typeahead implements OnInit { ]); this.popup = this.loader - .loadNextToLocation(TypeaheadContainer, this.viewContainerRef, binding) + .loadNextToLocation(TypeaheadContainerComponent, this.viewContainerRef, binding) .then((componentRef:ComponentRef) => { componentRef.instance.position(this.viewContainerRef.element); this.container = componentRef.instance; diff --git a/demo/assets/css/style.css b/demo/assets/css/style.css index 7f85b9fba5..428701bc27 100644 --- a/demo/assets/css/style.css +++ b/demo/assets/css/style.css @@ -186,7 +186,7 @@ section { */ .scrollable-menu { - height: 90vh !important; + height: 90vh; width: 100vw; overflow-x: hidden; padding: 0 0 20px; diff --git a/demo/components/accordion-section.ts b/demo/components/accordion-section.ts index cf06fc57eb..7c6a50777f 100644 --- a/demo/components/accordion-section.ts +++ b/demo/components/accordion-section.ts @@ -2,7 +2,7 @@ import {Component} from 'angular2/core'; import {CORE_DIRECTIVES} from 'angular2/common'; import {TAB_DIRECTIVES} from '../../ng2-bootstrap'; -import {AccordionDemo} from './accordion/accordion-demo'; +import {AccordionDemoComponent} from './accordion/accordion-demo'; let name = 'Accordion'; let src = 'https://github.com/valor-software/ng2-bootstrap/blob/master/components/accordion/'; @@ -56,7 +56,7 @@ let html = require('!!prismjs?lang=markup!./accordion/accordion-demo.html'); `, - directives: [AccordionDemo, TAB_DIRECTIVES, CORE_DIRECTIVES] + directives: [AccordionDemoComponent, TAB_DIRECTIVES, CORE_DIRECTIVES] }) -export class AccordionSection { +export class AccordionSectionComponent { } diff --git a/demo/components/accordion/accordion-demo.ts b/demo/components/accordion/accordion-demo.ts index d7a6d434a6..07621ec7b2 100644 --- a/demo/components/accordion/accordion-demo.ts +++ b/demo/components/accordion/accordion-demo.ts @@ -11,7 +11,7 @@ let template = require('./accordion-demo.html'); template: template, directives: [ACCORDION_DIRECTIVES, CORE_DIRECTIVES, FORM_DIRECTIVES] }) -export class AccordionDemo { +export class AccordionDemoComponent { public oneAtATime:boolean = true; public items:Array = ['Item 1', 'Item 2', 'Item 3']; diff --git a/demo/components/alert-section.ts b/demo/components/alert-section.ts index 5f1e2e70c8..8196fb733e 100644 --- a/demo/components/alert-section.ts +++ b/demo/components/alert-section.ts @@ -2,7 +2,7 @@ import {Component} from 'angular2/core'; import {CORE_DIRECTIVES} from 'angular2/common'; import {TAB_DIRECTIVES} from '../../ng2-bootstrap'; -import {AlertDemo} from './alert/alert-demo'; +import {AlertDemoComponent} from './alert/alert-demo'; let name = 'Alerts'; let src = 'https://github.com/valor-software/ng2-bootstrap/blob/master/components/alert/alert.ts'; @@ -58,7 +58,7 @@ let html = require('!!prismjs?lang=markup!./alert/alert-demo.html'); `, - directives: [AlertDemo, TAB_DIRECTIVES, CORE_DIRECTIVES] + directives: [AlertDemoComponent, TAB_DIRECTIVES, CORE_DIRECTIVES] }) -export class AlertSection { +export class AlertSectionComponent { } diff --git a/demo/components/alert/alert-demo.ts b/demo/components/alert/alert-demo.ts index 81b5ba1d92..90a2136cbe 100644 --- a/demo/components/alert/alert-demo.ts +++ b/demo/components/alert/alert-demo.ts @@ -1,6 +1,6 @@ import {Component} from 'angular2/core'; import {CORE_DIRECTIVES} from 'angular2/common'; -import {Alert} from '../../../ng2-bootstrap'; +import {AlertComponent} from '../../../ng2-bootstrap'; // webpack html imports let template = require('./alert-demo.html'); @@ -8,9 +8,9 @@ let template = require('./alert-demo.html'); @Component({ selector: 'alert-demo', template: template, - directives: [Alert, CORE_DIRECTIVES] + directives: [AlertComponent, CORE_DIRECTIVES] }) -export class AlertDemo { +export class AlertDemoComponent { public alerts:Array = [ { type: 'danger', diff --git a/demo/components/buttons-section.ts b/demo/components/buttons-section.ts index 72e1d3e02d..eb0572f92a 100644 --- a/demo/components/buttons-section.ts +++ b/demo/components/buttons-section.ts @@ -2,7 +2,7 @@ import {Component} from 'angular2/core'; import {CORE_DIRECTIVES} from 'angular2/common'; import {TAB_DIRECTIVES} from '../../ng2-bootstrap'; -import {ButtonsDemo} from './buttons/buttons-demo'; +import {ButtonsDemoComponent} from './buttons/buttons-demo'; let name = 'Buttons'; let src = 'https://github.com/valor-software/ng2-bootstrap/blob/master/components/buttons/'; @@ -16,7 +16,7 @@ let html = require('!!prismjs?lang=markup!./buttons/buttons-demo.html'); @Component({ selector: 'buttons-section', - directives: [ButtonsDemo, TAB_DIRECTIVES, CORE_DIRECTIVES], + directives: [ButtonsDemoComponent, TAB_DIRECTIVES, CORE_DIRECTIVES], template: `

    ${name}(src)

    @@ -60,5 +60,5 @@ let html = require('!!prismjs?lang=markup!./buttons/buttons-demo.html');
    ` }) -export class ButtonsSection { +export class ButtonsSectionComponent { } diff --git a/demo/components/buttons/buttons-demo.ts b/demo/components/buttons/buttons-demo.ts index abfad66c7e..be4345dcfb 100644 --- a/demo/components/buttons/buttons-demo.ts +++ b/demo/components/buttons/buttons-demo.ts @@ -10,7 +10,7 @@ let template = require('./buttons-demo.html'); template: template, directives: [BUTTON_DIRECTIVES, CORE_DIRECTIVES, FORM_DIRECTIVES] }) -export class ButtonsDemo { +export class ButtonsDemoComponent { public singleModel:string = '1'; public radioModel:string = 'Middle'; public checkModel:any = {left: false, middle: true, right: false}; diff --git a/demo/components/carousel-section.ts b/demo/components/carousel-section.ts index 69e32829c3..f9b5ea2817 100644 --- a/demo/components/carousel-section.ts +++ b/demo/components/carousel-section.ts @@ -2,7 +2,7 @@ import {Component} from 'angular2/core'; import {CORE_DIRECTIVES} from 'angular2/common'; import {TAB_DIRECTIVES} from '../../ng2-bootstrap'; -import {CarouselDemo} from './carousel/carousel-demo'; +import {CarouselDemoComponent} from './carousel/carousel-demo'; let name = 'Carousel'; let src = 'https://github.com/valor-software/ng2-bootstrap/blob/master/components/carousel/'; @@ -16,7 +16,7 @@ let html = require('!!prismjs?lang=markup!./carousel/carousel-demo.html'); @Component({ selector: 'carousel-section', - directives: [CarouselDemo, TAB_DIRECTIVES, CORE_DIRECTIVES], + directives: [CarouselDemoComponent, TAB_DIRECTIVES, CORE_DIRECTIVES], template: `

    ${name}(src)

    @@ -60,5 +60,5 @@ let html = require('!!prismjs?lang=markup!./carousel/carousel-demo.html');
    ` }) -export class CarouselSection { +export class CarouselSectionComponent { } diff --git a/demo/components/carousel/carousel-demo.ts b/demo/components/carousel/carousel-demo.ts index 0f3f12235a..6be92d20c7 100644 --- a/demo/components/carousel/carousel-demo.ts +++ b/demo/components/carousel/carousel-demo.ts @@ -10,7 +10,7 @@ let template = require('./carousel-demo.html'); directives: [CAROUSEL_DIRECTIVES, CORE_DIRECTIVES, FORM_DIRECTIVES], template: template }) -export class CarouselDemo { +export class CarouselDemoComponent { public myInterval:number = 5000; public noWrapSlides:boolean = false; public slides:Array = []; diff --git a/demo/components/collapse-section.ts b/demo/components/collapse-section.ts index 657a5ec1a8..b1d8b40853 100644 --- a/demo/components/collapse-section.ts +++ b/demo/components/collapse-section.ts @@ -2,7 +2,7 @@ import {Component} from 'angular2/core'; import {CORE_DIRECTIVES} from 'angular2/common'; import {TAB_DIRECTIVES} from '../../ng2-bootstrap'; -import {CollapseDemo} from './collapse/collapse-demo'; +import {CollapseDemoComponent} from './collapse/collapse-demo'; let name = 'Collapse'; let src = 'https://github.com/valor-software/ng2-bootstrap/blob/master/components/collapse/'; @@ -16,7 +16,7 @@ let html = require('!!prismjs?lang=markup!./collapse/collapse-demo.html'); @Component({ selector: 'collapse-section', - directives: [CollapseDemo, TAB_DIRECTIVES, CORE_DIRECTIVES], + directives: [CollapseDemoComponent, TAB_DIRECTIVES, CORE_DIRECTIVES], template: `

    ${name}(src)

    @@ -60,5 +60,5 @@ let html = require('!!prismjs?lang=markup!./collapse/collapse-demo.html');
    ` }) -export class CollapseSection { +export class CollapseSectionComponent { } diff --git a/demo/components/collapse/collapse-demo.ts b/demo/components/collapse/collapse-demo.ts index c1c3c79225..3071884511 100644 --- a/demo/components/collapse/collapse-demo.ts +++ b/demo/components/collapse/collapse-demo.ts @@ -1,14 +1,14 @@ import {Component} from 'angular2/core'; -import {Collapse} from '../../../ng2-bootstrap'; +import {CollapseDirective} from '../../../ng2-bootstrap'; // webpack html imports let template = require('./collapse-demo.html'); @Component({ selector: 'collapse-demo', - directives: [Collapse], + directives: [CollapseDirective], template: template }) -export class CollapseDemo { +export class CollapseDemoComponent { public isCollapsed:boolean = false; } diff --git a/demo/components/datepicker-section.ts b/demo/components/datepicker-section.ts index 21685bbf04..517ba380df 100644 --- a/demo/components/datepicker-section.ts +++ b/demo/components/datepicker-section.ts @@ -2,7 +2,7 @@ import {Component} from 'angular2/core'; import {CORE_DIRECTIVES} from 'angular2/common'; import {TAB_DIRECTIVES} from '../../ng2-bootstrap'; -import {DatepickerDemo} from './datepicker/datepicker-demo'; +import {DatepickerDemoComponent} from './datepicker/datepicker-demo'; let name = 'Datepicker'; let src = 'https://github.com/valor-software/ng2-bootstrap/blob/master/components/datepicker/datepicker.ts'; @@ -58,7 +58,7 @@ let html = require('!!prismjs?lang=markup!./datepicker/datepicker-demo.html'); `, - directives: [DatepickerDemo, TAB_DIRECTIVES, CORE_DIRECTIVES] + directives: [DatepickerDemoComponent, TAB_DIRECTIVES, CORE_DIRECTIVES] }) -export class DatepickerSection { +export class DatepickerSectionComponent { } diff --git a/demo/components/datepicker/datepicker-demo.ts b/demo/components/datepicker/datepicker-demo.ts index dcbeca6960..8be50c6d6d 100644 --- a/demo/components/datepicker/datepicker-demo.ts +++ b/demo/components/datepicker/datepicker-demo.ts @@ -12,7 +12,7 @@ let template = require('./datepicker-demo.html'); template: template, directives: [DATEPICKER_DIRECTIVES, CORE_DIRECTIVES, FORM_DIRECTIVES] }) -export class DatepickerDemo { +export class DatepickerDemoComponent { public dt:Date = new Date(); public minDate:Date = void 0; public events:Array; diff --git a/demo/components/demo-header.ts b/demo/components/demo-header.ts index e7577d30d2..fbb3c953b1 100644 --- a/demo/components/demo-header.ts +++ b/demo/components/demo-header.ts @@ -1,7 +1,7 @@ import {Component} from 'angular2/core'; import {CORE_DIRECTIVES} from 'angular2/common'; import { - Collapse, DROPDOWN_DIRECTIVES, Ng2BootstrapConfig, Ng2BootstrapTheme + CollapseDirective, DROPDOWN_DIRECTIVES, Ng2BootstrapConfig, Ng2BootstrapTheme } from '../../ng2-bootstrap'; let components = [ @@ -50,11 +50,11 @@ let template = ` template: template, directives: [ CORE_DIRECTIVES, - Collapse, + CollapseDirective, DROPDOWN_DIRECTIVES ] }) -export class DemoHeader { +export class DemoHeaderComponent { public components:Array = components; public isCollapsed:boolean = true; public prefix:string; diff --git a/demo/components/demo-section.ts b/demo/components/demo-section.ts index e25100ba4c..29357a98d5 100644 --- a/demo/components/demo-section.ts +++ b/demo/components/demo-section.ts @@ -71,6 +71,6 @@ export class DemoSectionConfig { `, directives: [TAB_DIRECTIVES, CORE_DIRECTIVES] }) -export class DemoSection { +export class DemoSectionComponent { public demoSection:DemoSectionConfig; } diff --git a/demo/components/dropdown-section.ts b/demo/components/dropdown-section.ts index 4de1b8cd25..8d9fea6a4d 100644 --- a/demo/components/dropdown-section.ts +++ b/demo/components/dropdown-section.ts @@ -2,7 +2,7 @@ import {Component} from 'angular2/core'; import {CORE_DIRECTIVES} from 'angular2/common'; import {TAB_DIRECTIVES} from '../../ng2-bootstrap'; -import {DropdownDemo} from './dropdown/dropdown-demo'; +import {DropdownDemoComponent} from './dropdown/dropdown-demo'; let name = 'Dropdowns'; let src = 'https://github.com/valor-software/ng2-bootstrap/blob/master/components/dropdown'; @@ -16,7 +16,7 @@ let html = require('!!prismjs?lang=markup!./dropdown/dropdown-demo.html'); @Component({ selector: 'dropdown-section', - directives: [DropdownDemo, TAB_DIRECTIVES, CORE_DIRECTIVES], + directives: [DropdownDemoComponent, TAB_DIRECTIVES, CORE_DIRECTIVES], template: `

    ${name}(src)

    @@ -60,5 +60,5 @@ let html = require('!!prismjs?lang=markup!./dropdown/dropdown-demo.html');
    ` }) -export class DropdownSection { +export class DropdownSectionComponent { } diff --git a/demo/components/dropdown/dropdown-demo.ts b/demo/components/dropdown/dropdown-demo.ts index 1e25a984ae..1cde57764c 100644 --- a/demo/components/dropdown/dropdown-demo.ts +++ b/demo/components/dropdown/dropdown-demo.ts @@ -10,7 +10,7 @@ let template = require('./dropdown-demo.html'); directives: [DROPDOWN_DIRECTIVES, CORE_DIRECTIVES], template: template }) -export class DropdownDemo { +export class DropdownDemoComponent { public disabled:boolean = false; public status:{isopen:boolean} = {isopen: false}; public items:Array = ['The first choice!', diff --git a/demo/components/pagination-section.ts b/demo/components/pagination-section.ts index 0fc7e7ac2c..49016b6497 100644 --- a/demo/components/pagination-section.ts +++ b/demo/components/pagination-section.ts @@ -2,7 +2,7 @@ import {Component} from 'angular2/core'; import {CORE_DIRECTIVES} from 'angular2/common'; import {TAB_DIRECTIVES} from '../../ng2-bootstrap'; -import {PaginationDemo} from './pagination/pagination-demo'; +import {PaginationDemoComponent} from './pagination/pagination-demo'; let name = 'Pagination'; let src = 'https://github.com/valor-software/ng2-bootstrap/blob/master/components/pagination/'; @@ -16,7 +16,7 @@ let html = require('!!prismjs?lang=markup!./pagination/pagination-demo.html'); @Component({ selector: 'pagination-section', - directives: [PaginationDemo, TAB_DIRECTIVES, CORE_DIRECTIVES], + directives: [PaginationDemoComponent, TAB_DIRECTIVES, CORE_DIRECTIVES], template: `

    ${name}(src)

    @@ -60,5 +60,5 @@ let html = require('!!prismjs?lang=markup!./pagination/pagination-demo.html');
    ` }) -export class PaginationSection { +export class PaginationSectionComponent { } diff --git a/demo/components/pagination/pagination-demo.ts b/demo/components/pagination/pagination-demo.ts index 851d15f9c2..57accca6cc 100644 --- a/demo/components/pagination/pagination-demo.ts +++ b/demo/components/pagination/pagination-demo.ts @@ -10,7 +10,7 @@ let template = require('./pagination-demo.html'); directives: [PAGINATION_DIRECTIVES, FORM_DIRECTIVES, CORE_DIRECTIVES], template: template }) -export class PaginationDemo { +export class PaginationDemoComponent { public totalItems:number = 64; public currentPage:number = 4; diff --git a/demo/components/progressbar-section.ts b/demo/components/progressbar-section.ts index aadf36e4db..e885ffdc75 100644 --- a/demo/components/progressbar-section.ts +++ b/demo/components/progressbar-section.ts @@ -6,7 +6,7 @@ import { Ng2BootstrapConfig, Ng2BootstrapTheme } from '../../ng2-bootstrap'; -import {ProgressbarDemo} from './progressbar/progressbar-demo'; +import {ProgressbarDemoComponent} from './progressbar/progressbar-demo'; let name = 'Progressbar'; let src = 'https://github.com/valor-software/ng2-bootstrap/blob/master/components/progressbar/'; @@ -24,7 +24,7 @@ let html = templates[Ng2BootstrapConfig.theme]; @Component({ selector: 'progressbar-section', - directives: [ProgressbarDemo, TAB_DIRECTIVES, CORE_DIRECTIVES], + directives: [ProgressbarDemoComponent, TAB_DIRECTIVES, CORE_DIRECTIVES], template: `

    ${name}(src)

    @@ -68,5 +68,5 @@ let html = templates[Ng2BootstrapConfig.theme];
    ` }) -export class ProgressbarSection { +export class ProgressbarSectionComponent { } diff --git a/demo/components/progressbar/progressbar-demo.ts b/demo/components/progressbar/progressbar-demo.ts index c78c688d53..678919affc 100644 --- a/demo/components/progressbar/progressbar-demo.ts +++ b/demo/components/progressbar/progressbar-demo.ts @@ -17,7 +17,7 @@ let templates:any = { directives: [PROGRESSBAR_DIRECTIVES, CORE_DIRECTIVES], template: templates[Ng2BootstrapConfig.theme] }) -export class ProgressbarDemo { +export class ProgressbarDemoComponent { public max:number = 200; public showWarning:boolean; public dynamic:number; diff --git a/demo/components/rating-section.ts b/demo/components/rating-section.ts index 2061f1895b..93a024a9bd 100644 --- a/demo/components/rating-section.ts +++ b/demo/components/rating-section.ts @@ -2,7 +2,7 @@ import {Component} from 'angular2/core'; import {CORE_DIRECTIVES} from 'angular2/common'; import {TAB_DIRECTIVES} from '../../ng2-bootstrap'; -import {RatingDemo} from './rating/rating-demo'; +import {RatingDemoComponent} from './rating/rating-demo'; let name = 'Rating'; let src = 'https://github.com/valor-software/ng2-bootstrap/blob/master/components/rating/rating.ts'; @@ -16,7 +16,7 @@ let html = require('!!prismjs?lang=markup!./rating/rating-demo.html'); @Component({ selector: 'rating-section', - directives: [RatingDemo, TAB_DIRECTIVES, CORE_DIRECTIVES], + directives: [RatingDemoComponent, TAB_DIRECTIVES, CORE_DIRECTIVES], template: `

    ${name}(src)

    @@ -60,5 +60,5 @@ let html = require('!!prismjs?lang=markup!./rating/rating-demo.html');
    ` }) -export class RatingSection { +export class RatingSectionComponent { } diff --git a/demo/components/rating/rating-demo.ts b/demo/components/rating/rating-demo.ts index 577496fbaf..543544ab74 100644 --- a/demo/components/rating/rating-demo.ts +++ b/demo/components/rating/rating-demo.ts @@ -1,16 +1,16 @@ import {Component} from 'angular2/core'; import {CORE_DIRECTIVES, FORM_DIRECTIVES} from 'angular2/common'; -import {Rating} from '../../../ng2-bootstrap'; +import {RatingComponent} from '../../../ng2-bootstrap'; // webpack html imports let template = require('./rating-demo.html'); @Component({ selector: 'rating-demo', - directives: [Rating, FORM_DIRECTIVES, CORE_DIRECTIVES], + directives: [RatingComponent, FORM_DIRECTIVES, CORE_DIRECTIVES], template: template }) -export class RatingDemo { +export class RatingDemoComponent { public x:number = 5; public y:number = 2; public max:number = 10; diff --git a/demo/components/tabs-section.ts b/demo/components/tabs-section.ts index c6fa4c2704..4b37610301 100644 --- a/demo/components/tabs-section.ts +++ b/demo/components/tabs-section.ts @@ -2,7 +2,7 @@ import {Component} from 'angular2/core'; import {CORE_DIRECTIVES} from 'angular2/common'; import {TAB_DIRECTIVES} from '../../ng2-bootstrap'; -import {TabsDemo} from './tabs/tabs-demo'; +import {TabsDemoComponent} from './tabs/tabs-demo'; let name = 'Tabs'; let src = 'https://github.com/valor-software/ng2-bootstrap/blob/master/components/tabs/tabs.ts'; @@ -16,7 +16,7 @@ let html = require('!!prismjs?lang=markup!./tabs/tabs-demo.html'); @Component({ selector: 'tabs-section', - directives: [TabsDemo, TAB_DIRECTIVES, CORE_DIRECTIVES], + directives: [TabsDemoComponent, TAB_DIRECTIVES, CORE_DIRECTIVES], template: `

    ${name}(src)

    @@ -60,5 +60,5 @@ let html = require('!!prismjs?lang=markup!./tabs/tabs-demo.html');
    ` }) -export class TabsSection { +export class TabsSectionComponent { } diff --git a/demo/components/tabs/tabs-demo.ts b/demo/components/tabs/tabs-demo.ts index db682c1b16..b347d80399 100644 --- a/demo/components/tabs/tabs-demo.ts +++ b/demo/components/tabs/tabs-demo.ts @@ -11,7 +11,7 @@ let template = require('./tabs-demo.html'); changeDetection: ChangeDetectionStrategy.OnPush, template: template }) -export class TabsDemo { +export class TabsDemoComponent { public tabs:Array = [ {title: 'Dynamic Title 1', content: 'Dynamic content 1'}, {title: 'Dynamic Title 2', content: 'Dynamic content 2', disabled: true}, diff --git a/demo/components/timepicker-section.ts b/demo/components/timepicker-section.ts index 072dadd956..e170950277 100644 --- a/demo/components/timepicker-section.ts +++ b/demo/components/timepicker-section.ts @@ -2,7 +2,7 @@ import {Component} from 'angular2/core'; import {CORE_DIRECTIVES} from 'angular2/common'; import {TAB_DIRECTIVES} from '../../ng2-bootstrap'; -import {TimepickerDemo} from './timepicker/timepicker-demo'; +import {TimepickerDemoComponent} from './timepicker/timepicker-demo'; let name = 'Timepicker'; let src = 'https://github.com/valor-software/ng2-bootstrap/blob/master/components/timepicker/timepicker.ts'; @@ -16,7 +16,7 @@ let html = require('!!prismjs?lang=markup!./timepicker/timepicker-demo.html'); @Component({ selector: 'timepicker-section', - directives: [TimepickerDemo, TAB_DIRECTIVES, CORE_DIRECTIVES], + directives: [TimepickerDemoComponent, TAB_DIRECTIVES, CORE_DIRECTIVES], template: `

    ${name}(src)

    @@ -60,5 +60,5 @@ let html = require('!!prismjs?lang=markup!./timepicker/timepicker-demo.html');
    ` }) -export class TimepickerSection { +export class TimepickerSectionComponent { } diff --git a/demo/components/timepicker/timepicker-demo.ts b/demo/components/timepicker/timepicker-demo.ts index c587f289d0..027285dbdf 100644 --- a/demo/components/timepicker/timepicker-demo.ts +++ b/demo/components/timepicker/timepicker-demo.ts @@ -1,16 +1,16 @@ import {Component} from 'angular2/core'; import {CORE_DIRECTIVES, FORM_DIRECTIVES} from 'angular2/common'; -import {Timepicker} from '../../../ng2-bootstrap'; +import {TimepickerComponent} from '../../../ng2-bootstrap'; // webpack html imports let template = require('./timepicker-demo.html'); @Component({ selector: 'timepicker-demo', - directives: [Timepicker, CORE_DIRECTIVES, FORM_DIRECTIVES], + directives: [TimepickerComponent, CORE_DIRECTIVES, FORM_DIRECTIVES], template: template }) -export class TimepickerDemo { +export class TimepickerDemoComponent { public hstep:number = 1; public mstep:number = 15; public ismeridian:boolean = true; diff --git a/demo/components/tooltip-section.ts b/demo/components/tooltip-section.ts index 963badf023..9c96ea4d90 100644 --- a/demo/components/tooltip-section.ts +++ b/demo/components/tooltip-section.ts @@ -2,7 +2,7 @@ import {Component} from 'angular2/core'; import {CORE_DIRECTIVES} from 'angular2/common'; import {TAB_DIRECTIVES} from '../../ng2-bootstrap'; -import {TooltipDemo} from './tooltip/tooltip-demo'; +import {TooltipDemoComponent} from './tooltip/tooltip-demo'; let name = 'Tooltip'; let src = 'https://github.com/valor-software/ng2-bootstrap/blob/master/components/tooltip/tooltip.ts'; @@ -16,7 +16,7 @@ let html = require('!!prismjs?lang=markup!./tooltip/tooltip-demo.html'); @Component({ selector: 'tooltip-section', - directives: [TooltipDemo, TAB_DIRECTIVES, CORE_DIRECTIVES], + directives: [TooltipDemoComponent, TAB_DIRECTIVES, CORE_DIRECTIVES], template: `

    ${name}(src)

    @@ -60,5 +60,5 @@ let html = require('!!prismjs?lang=markup!./tooltip/tooltip-demo.html');
    ` }) -export class TooltipSection { +export class TooltipSectionComponent { } diff --git a/demo/components/tooltip/tooltip-demo.ts b/demo/components/tooltip/tooltip-demo.ts index 9838a2475d..b8ddc6c64d 100644 --- a/demo/components/tooltip/tooltip-demo.ts +++ b/demo/components/tooltip/tooltip-demo.ts @@ -23,7 +23,7 @@ let template = require('./tooltip-demo.html'); } `] }) -export class TooltipDemo { +export class TooltipDemoComponent { public dynamicTooltip:string = 'Hello, World!'; public dynamicTooltipText:string = 'dynamic'; public htmlTooltip:string = 'I\'ve been made bold!'; diff --git a/demo/components/typeahead-section.ts b/demo/components/typeahead-section.ts index fa1ead63d0..4d5072c682 100644 --- a/demo/components/typeahead-section.ts +++ b/demo/components/typeahead-section.ts @@ -2,7 +2,7 @@ import {Component} from 'angular2/core'; import {CORE_DIRECTIVES} from 'angular2/common'; import {TAB_DIRECTIVES} from '../../ng2-bootstrap'; -import {TypeaheadDemo} from './typeahead/typeahead-demo'; +import {TypeaheadDemoComponent} from './typeahead/typeahead-demo'; let name = 'Typeahead'; let src = 'https://github.com/valor-software/ng2-bootstrap/blob/master/components/typeahead/typeahead.ts'; @@ -16,7 +16,7 @@ let html = require('!!prismjs?lang=markup!./typeahead/typeahead-demo.html'); @Component({ selector: 'typeahead-section', - directives: [TypeaheadDemo, TAB_DIRECTIVES, CORE_DIRECTIVES], + directives: [TypeaheadDemoComponent, TAB_DIRECTIVES, CORE_DIRECTIVES], template: `

    ${name}(src)

    @@ -60,5 +60,5 @@ let html = require('!!prismjs?lang=markup!./typeahead/typeahead-demo.html');
    ` }) -export class TypeaheadSection { +export class TypeaheadSectionComponent { } diff --git a/demo/components/typeahead/typeahead-demo.ts b/demo/components/typeahead/typeahead-demo.ts index 11ff99a739..fe6d0a1c9f 100644 --- a/demo/components/typeahead/typeahead-demo.ts +++ b/demo/components/typeahead/typeahead-demo.ts @@ -10,7 +10,7 @@ let template = require('./typeahead-demo.html'); directives: [TYPEAHEAD_DIRECTIVES, CORE_DIRECTIVES, FORM_DIRECTIVES], template: template }) -export class TypeaheadDemo { +export class TypeaheadDemoComponent { public selected:string = ''; public asyncSelected:string = ''; public typeaheadLoading:boolean = false; diff --git a/demo/index.ts b/demo/index.ts index 63994fd1d4..7795f98a32 100644 --- a/demo/index.ts +++ b/demo/index.ts @@ -2,21 +2,21 @@ import {Component, enableProdMode} from 'angular2/core'; import {CORE_DIRECTIVES} from 'angular2/common'; import {bootstrap} from 'angular2/platform/browser'; import {Ng2BootstrapConfig, Ng2BootstrapTheme} from '../ng2-bootstrap'; -import {AccordionSection} from './components/accordion-section'; -import {AlertSection} from './components/alert-section'; -import {ButtonsSection} from './components/buttons-section'; -import {CarouselSection} from './components/carousel-section'; -import {CollapseSection} from './components/collapse-section'; -import {DatepickerSection} from './components/datepicker-section'; -import {DropdownSection} from './components/dropdown-section'; -import {PaginationSection} from './components/pagination-section'; -import {ProgressbarSection} from './components/progressbar-section'; -import {RatingSection} from './components/rating-section'; -import {TabsSection} from './components/tabs-section'; -import {TimepickerSection} from './components/timepicker-section'; -import {TooltipSection} from './components/tooltip-section'; -import {TypeaheadSection} from './components/typeahead-section'; -import {DemoHeader} from './components/demo-header'; +import {AccordionSectionComponent} from './components/accordion-section'; +import {AlertSectionComponent} from './components/alert-section'; +import {ButtonsSectionComponent} from './components/buttons-section'; +import {CarouselSectionComponent} from './components/carousel-section'; +import {CollapseSectionComponent} from './components/collapse-section'; +import {DatepickerSectionComponent} from './components/datepicker-section'; +import {DropdownSectionComponent} from './components/dropdown-section'; +import {PaginationSectionComponent} from './components/pagination-section'; +import {ProgressbarSectionComponent} from './components/progressbar-section'; +import {RatingSectionComponent} from './components/rating-section'; +import {TabsSectionComponent} from './components/tabs-section'; +import {TimepickerSectionComponent} from './components/timepicker-section'; +import {TooltipSectionComponent} from './components/tooltip-section'; +import {TypeaheadSectionComponent} from './components/typeahead-section'; +import {DemoHeaderComponent} from './components/demo-header'; // todo: enable prod mod only for prod build // if (false) { @@ -81,29 +81,29 @@ let gettingStarted = require('./getting-started.md'); `, directives: [ CORE_DIRECTIVES, - DemoHeader, + DemoHeaderComponent, - AccordionSection, - AlertSection, - ButtonsSection, - CarouselSection, - CollapseSection, + AccordionSectionComponent, + AlertSectionComponent, + ButtonsSectionComponent, + CarouselSectionComponent, + CollapseSectionComponent, // todo: fix it to much write value calls!!! - DatepickerSection, + DatepickerSectionComponent, - DropdownSection, - PaginationSection, - ProgressbarSection, - RatingSection, - TabsSection, - TimepickerSection, - TooltipSection, - TypeaheadSection + DropdownSectionComponent, + PaginationSectionComponent, + ProgressbarSectionComponent, + RatingSectionComponent, + TabsSectionComponent, + TimepickerSectionComponent, + TooltipSectionComponent, + TypeaheadSectionComponent ] }) -export class Demo { +export class DemoComponent { public isBs3:boolean = Ng2BootstrapConfig.theme === Ng2BootstrapTheme.BS3; } -bootstrap(Demo); +bootstrap(DemoComponent); diff --git a/ng2-bootstrap.ts b/ng2-bootstrap.ts index e2840e9bbb..83fdf0a6d1 100644 --- a/ng2-bootstrap.ts +++ b/ng2-bootstrap.ts @@ -1,15 +1,15 @@ import {ACCORDION_DIRECTIVES} from './components/accordion'; -import {Alert} from './components/alert'; +import {AlertComponent} from './components/alert'; import {BUTTON_DIRECTIVES} from './components/buttons'; import {CAROUSEL_DIRECTIVES} from './components/carousel'; -import {Collapse} from './components/collapse'; +import {CollapseDirective} from './components/collapse'; import {DATEPICKER_DIRECTIVES} from './components/datepicker'; import {DROPDOWN_DIRECTIVES} from './components/dropdown'; import {PAGINATION_DIRECTIVES} from './components/pagination'; import {PROGRESSBAR_DIRECTIVES} from './components/progressbar'; -import {Rating} from './components/rating'; +import {RatingComponent} from './components/rating'; import {TAB_DIRECTIVES} from './components/tabs'; -import {Timepicker} from './components/timepicker'; +import {TimepickerComponent} from './components/timepicker'; import {TOOLTIP_DIRECTIVES} from './components/tooltip'; import {TYPEAHEAD_DIRECTIVES} from './components/typeahead'; @@ -34,18 +34,18 @@ export * from './components/ng2-bootstrap-config'; export default { directives: [ - Alert, + AlertComponent, ACCORDION_DIRECTIVES, BUTTON_DIRECTIVES, CAROUSEL_DIRECTIVES, - Collapse, + CollapseDirective, DATEPICKER_DIRECTIVES, DROPDOWN_DIRECTIVES, PAGINATION_DIRECTIVES, PROGRESSBAR_DIRECTIVES, - Rating, + RatingComponent, TAB_DIRECTIVES, - Timepicker, + TimepickerComponent, TOOLTIP_DIRECTIVES, TYPEAHEAD_DIRECTIVES ]