feat(datepicker): datepicker now is a directive not a component (#3125)

serving datepicker as a component will get back as an inline more only

 BREAKING CHANGE:
  - datepicker and daterange component selectors was removed
  - now datepicker available only as directive

demo/src/app/components/+datepicker/datepicker-section.list.ts

@@ -128,12 +128,12 @@ export const demoComponentContent: ContentSection[] = [
     outlet: ApiSectionsComponent,
     content: [
       {
-        title: 'BsDatepickerComponent',
+        title: 'BsDatepickerDirective',
         anchor: 'bs-datepicker-component',
         outlet: NgApiDocComponent
       },
       {
-        title: 'BsDaterangepickerComponent',
+        title: 'BsDaterangepickerDirective',
         anchor: 'bs-daterangepicker',
         outlet: NgApiDocComponent
       },

demo/src/ng-api-doc.ts

@@ -506,11 +506,11 @@ export const ngdoc: any = {
     "properties": [],
     "methods": []
   },
-  "BsDatepickerComponent": {
+  "BsDatepickerDirective": {
     "fileName": "src/datepicker/bs-datepicker.component.ts",
-    "className": "BsDatepickerComponent",
+    "className": "BsDatepickerDirective",
     "description": "",
-    "selector": "bs-datepicker,[bsDatepicker]",
+    "selector": "[bsDatepicker]",
     "exportAs": "bsDatepicker",
     "inputs": [
       {
@@ -656,11 +656,11 @@ export const ngdoc: any = {
     "properties": [],
     "methods": []
   },
-  "BsDaterangepickerComponent": {
+  "BsDaterangepickerDirective": {
     "fileName": "src/datepicker/bs-daterangepicker.component.ts",
-    "className": "BsDaterangepickerComponent",
+    "className": "BsDaterangepickerDirective",
     "description": "",
-    "selector": "bs-daterangepicker,[bsDaterangepicker]",
+    "selector": "[bsDaterangepicker]",
     "exportAs": "bsDaterangepicker",
     "inputs": [
       {

src/datepicker/bs-datepicker-input.directive.ts

@@ -1,6 +1,6 @@
 import { ChangeDetectorRef, Directive, ElementRef, forwardRef, Host, Renderer2 } from '@angular/core';
 import { ControlValueAccessor, NG_VALUE_ACCESSOR } from '@angular/forms';
-import { BsDatepickerComponent } from './bs-datepicker.component';
+import { BsDatepickerDirective } from './bs-datepicker.component';
 import { formatDate } from '../bs-moment/format';
 import { getLocale } from '../bs-moment/locale/locales.service';
 
@@ -26,7 +26,7 @@ export class BsDatepickerInputDirective
   private _onTouched = Function.prototype;
   private _value: Date;
 
-  constructor(@Host() private _picker: BsDatepickerComponent,
+  constructor(@Host() private _picker: BsDatepickerDirective,
               private _renderer: Renderer2,
               private _elRef: ElementRef,
               private changeDetection: ChangeDetectorRef) {

src/datepicker/bs-datepicker.component.ts

@@ -1,5 +1,5 @@
 import {
-  Component, ComponentRef, ElementRef, EventEmitter, Input, OnChanges,
+  ComponentRef, Directive, ElementRef, EventEmitter, Input, OnChanges,
   OnDestroy, OnInit, Output, Renderer2, SimpleChanges, ViewContainerRef
 } from '@angular/core';
 import { ComponentLoader } from '../component-loader/component-loader.class';
@@ -9,12 +9,11 @@ import { Subscription } from 'rxjs/Subscription';
 import 'rxjs/add/operator/filter';
 import { BsDatepickerConfig } from './bs-datepicker.config';
 
-@Component({
-  selector: 'bs-datepicker,[bsDatepicker]',
-  exportAs: 'bsDatepicker',
-  template: '<ng-content></ng-content>'
+@Directive({
+  selector: '[bsDatepicker]',
+  exportAs: 'bsDatepicker'
 })
-export class BsDatepickerComponent implements OnInit, OnDestroy, OnChanges {
+export class BsDatepickerDirective implements OnInit, OnDestroy, OnChanges {
   /**
    * Placement of a datepicker. Accepts: "top", "bottom", "left", "right"
    */

src/datepicker/bs-datepicker.module.ts

@@ -7,8 +7,8 @@ import { BsDatepickerNavigationViewComponent } from './themes/bs/bs-datepicker-n
 import { BsDaysCalendarViewComponent } from './themes/bs/bs-days-calendar-view.component';
 import { BsDatepickerEffects } from './reducer/bs-datepicker.effects';
 import { BsDaterangepickerContainerComponent } from './themes/bs/bs-daterangepicker-container.component';
-import { BsDaterangepickerComponent } from './bs-daterangepicker.component';
-import { BsDatepickerComponent } from './bs-datepicker.component';
+import { BsDaterangepickerDirective } from './bs-daterangepicker.component';
+import { BsDatepickerDirective } from './bs-datepicker.component';
 import { ComponentLoaderFactory } from '../component-loader/component-loader.factory';
 import { PositioningService } from '../positioning/positioning.service';
 import { BsDatepickerDayDecoratorComponent } from './themes/bs/bs-datepicker-day-decorator.directive';
@@ -28,11 +28,11 @@ const _exports = [
   BsDatepickerContainerComponent,
   BsDaterangepickerContainerComponent,
 
-  BsDatepickerComponent,
+  BsDatepickerDirective,
   BsDatepickerInputDirective,
 
   BsDaterangepickerInputDirective,
-  BsDaterangepickerComponent
+  BsDaterangepickerDirective
 ];
 
 @NgModule({

src/datepicker/bs-daterangepicker-input.directive.ts

@@ -2,7 +2,7 @@ import { ChangeDetectorRef, Directive, ElementRef, forwardRef, Host, OnInit, Ren
 import { ControlValueAccessor, NG_VALUE_ACCESSOR } from '@angular/forms';
 import { formatDate } from '../bs-moment/format';
 import { getLocale } from '../bs-moment/locale/locales.service';
-import { BsDaterangepickerComponent } from './bs-daterangepicker.component';
+import { BsDaterangepickerDirective } from './bs-daterangepicker.component';
 
 const BS_DATERANGEPICKER_VALUE_ACCESSOR = {
   provide: NG_VALUE_ACCESSOR,
@@ -26,7 +26,7 @@ export class BsDaterangepickerInputDirective
   private _onTouched = Function.prototype;
   private _value: Date[];
 
-  constructor(@Host() private _picker: BsDaterangepickerComponent,
+  constructor(@Host() private _picker: BsDaterangepickerDirective,
               private _renderer: Renderer2,
               private _elRef: ElementRef,
               private changeDetection: ChangeDetectorRef)  {

src/datepicker/bs-daterangepicker.component.ts

@@ -1,5 +1,5 @@
 import {
-  Component, ComponentRef, ElementRef, EventEmitter, Input, OnChanges,
+  ComponentRef, Directive, ElementRef, EventEmitter, Input, OnChanges,
   OnDestroy, OnInit, Output, Renderer2, SimpleChanges, ViewContainerRef
 } from '@angular/core';
 import { BsDaterangepickerContainerComponent } from './themes/bs/bs-daterangepicker-container.component';
@@ -8,12 +8,11 @@ import { ComponentLoaderFactory } from '../component-loader/component-loader.fac
 import { ComponentLoader } from '../component-loader/component-loader.class';
 import { BsDatepickerConfig } from './bs-datepicker.config';
 
-@Component({
-  selector: 'bs-daterangepicker,[bsDaterangepicker]',
-  exportAs: 'bsDaterangepicker',
-  template: ' '
+@Directive({
+  selector: '[bsDaterangepicker]',
+  exportAs: 'bsDaterangepicker'
 })
-export class BsDaterangepickerComponent
+export class BsDaterangepickerDirective
   implements OnInit, OnDestroy, OnChanges {
   /**
    * Placement of a daterangepicker. Accepts: "top", "bottom", "left", "right"

src/datepicker/index.ts

@@ -7,6 +7,6 @@ export { DateFormatter } from './date-formatter';
 export { DatepickerConfig } from './datepicker.config';
 
 export { BsDatepickerModule } from './bs-datepicker.module';
-export { BsDatepickerComponent } from './bs-datepicker.component';
-export { BsDaterangepickerComponent } from './bs-daterangepicker.component';
+export { BsDatepickerDirective } from './bs-datepicker.component';
+export { BsDaterangepickerDirective } from './bs-daterangepicker.component';
 export { BsDatepickerConfig } from './bs-datepicker.config';