feat(angular): upgraded angular and rxjs to v6

.travis.yml

@@ -44,8 +44,8 @@ install:
   - npm i -g npm@5.7.1
   - npm ci > /dev/null
   - npm run build > /dev/null
-  - if [[ "$NGV" == "latest" ]]; then  ./scripts/ci/npm-ng-latest.sh; fi
-  - if [[ "$NGV" == "next" ]]; then  ./scripts/ci/npm-ng-next.sh; fi
+#  - if [[ "$NGV" == "latest" ]]; then  ./scripts/ci/npm-ng-latest.sh; fi
+#  - if [[ "$NGV" == "next" ]]; then  ./scripts/ci/npm-ng-next.sh; fi
   - npm i ./dist  > /dev/null
   - if [[ "$TRAVIS_PULL_REQUEST" != false ]]; then export SAUCE_USERNAME=$SAUCE_USERNAME_PR; export SAUCE_ACCESS_KEY=$SAUCE_ACCESS_KEY_PR; fi
 
@@ -82,10 +82,10 @@ jobs:
       script: npm run test-coverage
       after_success:
         - ./node_modules/.bin/codecov
-    - <<: *test
-      env: NGV=latest
-    - <<: *test
-      env: NGV=next
+#    - <<: *test
+#      env: NGV=latest
+#    - <<: *test
+#      env: NGV=next
 
 #     test cypress
     - stage: cypress-tests
@@ -97,10 +97,10 @@ jobs:
     - &build
       stage: build
       script: npm run demo.ng-build
-    - <<: *build
-      env: NGV=latest
-    - <<: *build
-      env: NGV=next
+#    - <<: *build
+#      env: NGV=latest
+#    - <<: *build
+#      env: NGV=next
     - stage: sauce-tests
       env: SAUCE=true
       before_script:
@@ -120,13 +120,13 @@ jobs:
         project: ./gh-pages/
         domain: ngx-bootstrap.surge.sh
         on: development
-    - <<: *surge
-      env: NGV=latest
-      deploy:
-        provider: surge
-        project: ./gh-pages/
-        domain: ngx-bootstrap-latest.surge.sh
-        on: development
+#    - <<: *surge
+#      env: NGV=latest
+#      deploy:
+#        provider: surge
+#        project: ./gh-pages/
+#        domain: ngx-bootstrap-latest.surge.sh
+#        on: development
     - stage: deploy
       script: npm run build:dynamic
       before_deploy:

angular.json

@@ -0,0 +1,157 @@
+{
+  "$schema": "./node_modules/@angular/cli/lib/config/schema.json",
+  "version": 1,
+  "newProjectRoot": "projects",
+  "projects": {
+    "ngx-bootstrap": {
+      "root": "",
+      "sourceRoot": "demo/src",
+      "projectType": "application",
+      "architect": {
+        "build": {
+          "builder": "@angular-devkit/build-angular:browser",
+          "options": {
+            "outputPath": "demo/dist/browser",
+            "index": "demo/src/index.html",
+            "main": "demo/src/main.ts",
+            "tsConfig": "demo/src/tsconfig.json",
+            "polyfills": "demo/src/polyfills.ts",
+            "assets": [
+              "demo/src/assets"
+            ],
+            "styles": [
+              "src/datepicker/bs-datepicker.scss",
+              "demo/src/assets/css/style.scss",
+              "demo/src/assets/css/prettify-angulario.css"
+            ],
+            "scripts": []
+          },
+          "configurations": {
+            "production": {
+              "preserveSymlinks": true,
+              "optimization": true,
+              "outputHashing": "all",
+              "sourceMap": false,
+              "extractCss": true,
+              "namedChunks": true,
+              "aot": true,
+              "extractLicenses": true,
+              "vendorChunk": true,
+              "buildOptimizer": true,
+              "fileReplacements": [
+                {
+                  "replace": "demo/src/environments/environment.ts",
+                  "with": "demo/src/environments/environment.prod.ts"
+                }
+              ]
+            },
+            "server": {
+              "preserveSymlinks": true,
+              "optimization": true,
+              "outputHashing": "all",
+              "sourceMap": false,
+              "extractCss": true,
+              "namedChunks": true,
+              "aot": true,
+              "extractLicenses": true,
+              "vendorChunk": false,
+              "buildOptimizer": true,
+              "fileReplacements": [
+                {
+                  "replace": "demo/src/environments/environment.ts",
+                  "with": "demo/src/environments/environment.server.ts"
+                }
+              ]
+            }
+          }
+        },
+        "serve": {
+          "builder": "@angular-devkit/build-angular:dev-server",
+          "options": {
+            "browserTarget": "ngx-bootstrap:build"
+          },
+          "configurations": {
+            "production": {
+              "browserTarget": "ngx-bootstrap:build:production"
+            },
+            "server": {
+              "browserTarget": "ngx-bootstrap:build:server"
+            }
+          }
+        },
+        "extract-i18n": {
+          "builder": "@angular-devkit/build-angular:extract-i18n",
+          "options": {
+            "browserTarget": "ngx-bootstrap:build"
+          }
+        },
+        "test": {
+          "builder": "@angular-devkit/build-angular:karma",
+          "options": {
+            "main": "demo/src/../../scripts/test.ts",
+            "karmaConfig": "karma-demo.conf.js",
+            "polyfills": "demo/src/polyfills.ts",
+            "tsConfig": "demo/src/../../src/tsconfig.spec.json",
+            "scripts": [],
+            "styles": [
+              "src/datepicker/bs-datepicker.scss",
+              "demo/src/assets/css/style.scss",
+              "demo/src/assets/css/prettify-angulario.css"
+            ],
+            "assets": [
+              "demo/src/assets"
+            ]
+          }
+        },
+        "lint": {
+          "builder": "@angular-devkit/build-angular:tslint",
+          "options": {
+            "tsConfig": [
+              "../tslint.json"
+            ],
+            "exclude": []
+          }
+        },
+        "server": {
+          "builder": "@angular-devkit/build-angular:server",
+          "options": {
+            "outputPath": "demo/dist/server",
+            "main": "main.server.ts",
+            "tsConfig": "tsconfig.server.json"
+          }
+        }
+      }
+    },
+    "ngx-bootstrap-e2e": {
+      "root": "",
+      "sourceRoot": "",
+      "projectType": "application",
+      "architect": {
+        "e2e": {
+          "builder": "@angular-devkit/build-angular:protractor",
+          "options": {
+            "protractorConfig": "protractor.conf.js",
+            "devServerTarget": "ngx-bootstrap:serve"
+          }
+        },
+        "lint": {
+          "builder": "@angular-devkit/build-angular:tslint",
+          "options": {
+            "tsConfig": [],
+            "exclude": []
+          }
+        }
+      }
+    }
+  },
+  "defaultProject": "ngx-bootstrap",
+  "schematics": {
+    "@schematics/angular:component": {
+      "prefix": "",
+      "styleext": "scss"
+    },
+    "@schematics/angular:directive": {
+      "prefix": ""
+    }
+  }
+}

demo/src/app/app.component.ts

@@ -1,11 +1,11 @@
 import { DOCUMENT } from '@angular/common';
 import { AfterContentInit, Component, Inject } from '@angular/core';
 import { ActivatedRoute, NavigationEnd, Router, UrlSerializer } from '@angular/router';
-import { PageScrollConfig, PageScrollInstance, PageScrollService } from 'ng2-page-scroll';
+import { PageScrollConfig, PageScrollInstance, PageScrollService } from 'ngx-page-scroll';
 import { isBs3 } from 'ngx-bootstrap/utils';
 
 import { Analytics } from './docs/api-docs/analytics/analytics';
-import { filter } from 'rxjs';
+import { filter } from 'rxjs/operators';
 
 PageScrollConfig.defaultDuration = 11;
 PageScrollConfig.defaultScrollOffset = 70;
@@ -44,10 +44,9 @@ export class AppComponent implements AfterContentInit {
 
       const hash = this.route.snapshot.fragment;
       if (hash) {
-        const pageScrollInstance: PageScrollInstance = PageScrollInstance.simpleDirectionInstance(
+        const pageScrollInstance: PageScrollInstance = PageScrollInstance.simpleInstance(
           this.document,
-          `#${hash}`,
-          true
+          `#${hash}`
         );
         this.pageScrollService.start(pageScrollInstance);
       }

demo/src/app/app.module.ts

@@ -3,7 +3,7 @@ import { NgModule } from '@angular/core';
 import { FormsModule } from '@angular/forms';
 import { BrowserModule } from '@angular/platform-browser';
 import { RouterModule } from '@angular/router';
-import { Ng2PageScrollModule } from 'ng2-page-scroll/ng2-page-scroll';
+import { NgxPageScrollModule } from 'ngx-page-scroll';
 import { BsDropdownModule } from 'ngx-bootstrap/dropdown';
 
 import { environment } from '../environments/environment';
@@ -25,7 +25,7 @@ import { ThemeStorage } from './theme/theme-storage';
     FormsModule,
     HttpClientModule,
     RouterModule.forRoot(routes, { useHash: environment.useHash }),
-    Ng2PageScrollModule.forRoot(),
+    NgxPageScrollModule,
     BsDropdownModule.forRoot(),
     BrowserModule.withServerTransition({ appId: 'ngx-bootstrap' })
   ],

demo/src/app/common/sidebar/sidebar.component.ts

@@ -1,11 +1,11 @@
 import { Component, Inject, OnDestroy, Renderer } from '@angular/core';
-import { Router, NavigationEnd } from '@angular/router';
+import { NavigationEnd, Router } from '@angular/router';
 import { isBs3, setTheme } from 'ngx-bootstrap/utils';
 import { routes } from '../../app.routing';
 import { StyleManager } from '../../theme/style-manager';
 import { ThemeStorage } from '../../theme/theme-storage';
-import { DOCUMENT } from '@angular/platform-browser';
-import { Subscription } from 'rxjs/Subscription';
+import { DOCUMENT } from '@angular/common';
+import { Subscription } from 'rxjs';
 
 const _bs3Css = 'assets/css/bootstrap-3.3.7/css/bootstrap.min.css';
 const _bs4Css = 'assets/css/bootstrap-4.0.0/css/bootstrap.min.css';

demo/src/app/components/+modal/demos/service-events/service-events.ts

@@ -1,10 +1,6 @@
 import { ChangeDetectorRef, Component, TemplateRef } from '@angular/core';
-import { BsModalService } from 'ngx-bootstrap/modal';
-import { BsModalRef } from 'ngx-bootstrap/modal/bs-modal-ref.service';
-import { Subscription } from 'rxjs/Subscription';
-import { Observable } from 'rxjs/Observable';
-
-import 'rxjs/add/observable/combineLatest';
+import { BsModalRef, BsModalService } from 'ngx-bootstrap/modal';
+import { combineLatest, Subscription } from 'rxjs';
 
 @Component({
   selector: 'demo-modal-service-events',
@@ -27,7 +23,7 @@ export class DemoModalServiceEventsComponent {
   openModal(template: TemplateRef<any>) {
     this.messages = [];
 
-    const _combine = Observable.combineLatest(
+    const _combine = combineLatest(
       this.modalService.onShow,
       this.modalService.onShown,
       this.modalService.onHide,

demo/src/app/components/+typeahead/demos/async/async.ts

@@ -1,8 +1,8 @@
 import { Component } from '@angular/core';
 
-import { Observable } from 'rxjs/Observable';
-import 'rxjs/add/observable/of';
+import { Observable, of } from 'rxjs';
 import { TypeaheadMatch } from 'ngx-bootstrap/typeahead';
+import { mergeMap } from 'rxjs/operators';
 
 @Component({
   selector: 'demo-typeahead-async',
@@ -70,13 +70,16 @@ export class DemoTypeaheadAsyncComponent {
     this.dataSource = Observable.create((observer: any) => {
       // Runs on every search
       observer.next(this.asyncSelected);
-    }).mergeMap((token: string) => this.getStatesAsObservable(token));
+    })
+      .pipe(
+        mergeMap((token: string) => this.getStatesAsObservable(token))
+      );
   }
 
   getStatesAsObservable(token: string): Observable<any> {
-    let query = new RegExp(token, 'ig');
+    const query = new RegExp(token, 'ig');
 
-    return Observable.of(
+    return of(
       this.statesComplex.filter((state: any) => {
         return query.test(state.name);
       })

demo/src/app/components/+typeahead/demos/field/field.ts

@@ -1,5 +1,4 @@
 import { Component } from '@angular/core';
-import 'rxjs/add/observable/of';
 
 @Component({
   selector: 'demo-typeahead-field',

demo/src/app/components/+typeahead/demos/item-template/item-template.ts

@@ -1,5 +1,4 @@
 import { Component } from '@angular/core';
-import 'rxjs/add/observable/of';
 
 @Component({
   selector: 'demo-typeahead-item-template',

demo/src/app/components/+typeahead/demos/reactive-form/reactive-form.ts

@@ -1,8 +1,6 @@
 import { Component } from '@angular/core';
 import { FormControl, FormGroup } from '@angular/forms';
 
-import 'rxjs/add/observable/of';
-
 @Component({
   selector: 'demo-typeahead-reactive-form',
   templateUrl: './reactive-form.html'

demo/src/app/docs/api-docs/analytics/analytics.ts

@@ -5,7 +5,7 @@
 import { Injectable } from '@angular/core';
 import { NavigationEnd, Router } from '@angular/router';
 import { Location } from '@angular/common';
-import { filter } from 'rxjs';
+import { filter } from 'rxjs/operators';
 
 
 declare const ga: any;
@@ -35,7 +35,11 @@ export class Analytics {
     if (!this.enabled) {
       return;
     }
-    this.router.events.pipe(filter((event: any) => event instanceof NavigationEnd)).subscribe(() => {
+    this.router.events
+      .pipe(
+        filter((event: any) => event instanceof NavigationEnd)
+      )
+      .subscribe(() => {
       if (typeof ga !== 'undefined') {
         ga('send', { hitType: 'pageview', page: this.location.path() });
       }