Merge branch 'development' of github.com:valor-software/ngx-bootstrap…

… into 4622-branch

.editorconfig

@@ -1,4 +1,4 @@
-# http://editorconfig.org
+# https://editorconfig.org
 
 root = true
 
@@ -8,4 +8,4 @@ indent_style = space
 indent_size = 2
 end_of_line = lf
 insert_final_newline = true
-trim_trailing_whitespace = true
+trim_trailing_whitespace = true

cypress/full/modals_service_page_spec.ts

@@ -133,8 +133,8 @@ describe('Modals demo page test suite: Service examples', () => {
     "onHide event has been fired" and "onHidden event has been fired"`, () => {
         modals.clickByText(eventsDemo, btnText);
         modals.isModalVisible(modals.modalContainer, true);
-        modals.clickOnBackdrop();
-        modals.clickOutside('modal-container');
+        modals.clickOnModalCorner('topLeft');
+        modals.clickOutside(modals.modalContainer);
         modals.isDemoContainsTxt(eventsDemo, demoOnHideFired);
         modals.isDemoContainsTxt(eventsDemo, demoHideDismissed);
         modals.isDemoContainsTxt(eventsDemo, demoHiddenDismissed);

cypress/integration/modals_page_spec.ts

@@ -44,5 +44,11 @@ describe('Modals demo page test suite', () => {
       modals.isModalEnabled(modals.modalContainer, false);
       modals.isBackdropExist(false);
     });
+
+    it('when user starts to click on body then release click on backdrop then the modal is not closed', () => {
+      modals.clickByText(templateDemo, btnText);
+      modals.startClickOnModalReleaseOnBackdrop(modals.modalContainer);
+      modals.isModalVisible(modals.modalContainerVisible, true);
+    });
   });
 });

cypress/support/datepicker.po.ts

@@ -442,12 +442,22 @@ export class DatepickerPo extends BaseComponent {
         actualMonthArr = globalLocales.mnLocale.months;
         break;
 
+      case 'ka' :
+        actualMonthArr = globalLocales.kaLocale.months;
+        break;
+
       default:
         actualMonthArr = undefined;
     }
+
+    if (actualMonthArr) {
+      actualMonthArr = Array.isArray(actualMonthArr) ? actualMonthArr : actualMonthArr.standalone;
+    }
+
     cy.get(`${baseSelector}>${
       pickerType === 'datepicker' ? this.datepickerContainer : this.daterangepickerContainer} tbody td`)
-      .eq(0).each((month, monthIndex) => {
+      .eq(0)
+      .each((month, monthIndex) => {
       expect(month.text().toLowerCase()).to.contains(
         actualMonthArr ? actualMonthArr[monthIndex].toLowerCase() :
           new Date(2017, monthIndex)
@@ -554,7 +564,7 @@ export class DatepickerPo extends BaseComponent {
         .should(disabled ? 'have.class' : 'not.to.have.class', 'disabled');
     }
   }
-        
+
   isTodayHaveClass(className: string) {
     cy.get(`body>${this.datepickerContainer} tbody td`)
       .not('.week')

cypress/support/modals.po.ts

@@ -6,6 +6,7 @@ export class ModalsPo extends BaseComponent {
   ghLinkToComponent = 'https://github.com/valor-software/ngx-bootstrap/tree/development/src/modal';
 
   modalContainer = 'modal-container';
+  modalContainerVisible = 'modal-container.show';
   modalContent = '.modal-content';
   modalDialog = '.modal-dialog';
   modalBody = '.modal-body';
@@ -77,6 +78,18 @@ export class ModalsPo extends BaseComponent {
     cy.get(`${baseSelector} .modal`).click();
   }
 
+  clickOnModalCorner(position: string) {
+    cy.get(this.modalContainer).click(position);
+  }
+
+  startClickOnModalReleaseOnBackdrop(baseSelector: string) {
+    cy.get(`${baseSelector} .modal-content`)
+      .trigger('mousedown')
+      .wait(100)
+      .get(this.modalContainer)
+      .trigger('mouseup');
+  }
+
   checkElementsQuantity(elementsSelector: string, expectedQuantity: number) {
     cy.get(elementsSelector).should('have.length', expectedQuantity);
   }

demo/src/app/components/+datepicker/demo-datepicker.module.ts

@@ -9,7 +9,7 @@ import { BsDatepickerModule, DatepickerModule } from 'ngx-bootstrap/datepicker';
 import {
   arLocale, bgLocale, caLocale, csLocale, daLocale, deLocale, enGbLocale, esDoLocale, esLocale, esUsLocale, etLocale, frLocale, heLocale,
   hiLocale, hrLocale, fiLocale, glLocale, huLocale, idLocale, itLocale, jaLocale, kaLocale, koLocale, ltLocale, lvLocale, mnLocale, nbLocale,
-  nlBeLocale, nlLocale, plLocale, ptBrLocale, ruLocale, roLocale, skLocale, slLocale, svLocale, thLocale, trLocale, viLocale,
+  nlBeLocale, nlLocale, plLocale, ptBrLocale, ruLocale, roLocale, skLocale, slLocale, svLocale, thLocale, thBeLocale, trLocale, viLocale,
   zhCnLocale, ukLocale
 } from 'ngx-bootstrap/locale';
 
@@ -23,7 +23,7 @@ import { DEMO_COMPONENTS } from './demos';
 const locales = [
   arLocale, bgLocale, caLocale, csLocale, daLocale, deLocale, enGbLocale, esDoLocale, esLocale, esUsLocale, etLocale, frLocale,
   heLocale, hiLocale, hrLocale, fiLocale, glLocale, huLocale, idLocale, itLocale, jaLocale, kaLocale, koLocale, ltLocale, lvLocale, mnLocale,
-  nbLocale, nlBeLocale, nlLocale, plLocale, ptBrLocale, ruLocale, roLocale, skLocale, slLocale, svLocale, thLocale,
+  nbLocale, nlBeLocale, nlLocale, plLocale, ptBrLocale, ruLocale, roLocale, skLocale, slLocale, svLocale, thLocale, thBeLocale,
   trLocale, ukLocale, viLocale, zhCnLocale
 ];
 

demo/src/app/components/+rating/demos/config/config.html

@@ -0,0 +1,4 @@
+<rating [(ngModel)]="rate" [max]="max"></rating>
+<div class="card">
+  <pre class="card-block card-header" style="margin:15px 0;">Rate: <b>{{rate}}</b> </pre>
+</div>

demo/src/app/components/+rating/demos/config/config.ts

@@ -0,0 +1,17 @@
+import { Component } from '@angular/core';
+import { RatingConfig } from 'ngx-bootstrap/rating';
+
+// such override allows to keep some initial values
+export function getRatingConfig(): RatingConfig {
+  return Object.assign(new RatingConfig(), { ariaLabel: 'My Rating' });
+}
+
+@Component({
+  selector: 'demo-rating-config',
+  templateUrl: './config.html',
+  providers: [{ provide: RatingConfig, useFactory: getRatingConfig }]
+})
+export class DemoRatingConfigComponent {
+  max = 10;
+  rate = 7;
+}

demo/src/app/components/+rating/demos/index.ts

@@ -2,10 +2,12 @@ import { DemoRatingBasicComponent } from './basic/basic';
 import { DemoRatingCustomComponent } from './custom/custom';
 import { DemoRatingDynamicComponent } from './dynamic/dynamic';
 import { DemoRatingSelectOnEnterComponent } from './select-on-enter/select-on-enter';
+import { DemoRatingConfigComponent } from './config/config';
 
 export const DEMO_COMPONENTS = [
   DemoRatingBasicComponent,
   DemoRatingCustomComponent,
   DemoRatingDynamicComponent,
-  DemoRatingSelectOnEnterComponent
+  DemoRatingSelectOnEnterComponent,
+  DemoRatingConfigComponent
 ];

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

@@ -2,13 +2,14 @@ import { DemoRatingBasicComponent } from './demos/basic/basic';
 import { DemoRatingCustomComponent } from './demos/custom/custom';
 import { DemoRatingDynamicComponent } from './demos/dynamic/dynamic';
 import { DemoRatingSelectOnEnterComponent } from './demos/select-on-enter/select-on-enter';
+import { DemoRatingConfigComponent } from './demos/config/config';
 
 import { ContentSection } from '../../docs/models/content-section.model';
 import { DemoTopSectionComponent } from '../../docs/demo-section-components/demo-top-section/index';
 import { ExamplesComponent } from '../../docs/demo-section-components/demo-examples-section/index';
 import { ApiSectionsComponent } from '../../docs/demo-section-components/demo-api-section/index';
 
-import { NgApiDocComponent } from '../../docs/api-docs';
+import { NgApiDocComponent, NgApiDocConfigComponent } from '../../docs/api-docs';
 
 export const demoComponentContent: ContentSection[] = [
   {
@@ -53,6 +54,13 @@ export const demoComponentContent: ContentSection[] = [
         component: require('!!raw-loader!./demos/select-on-enter/select-on-enter'),
         html: require('!!raw-loader!./demos/select-on-enter/select-on-enter.html'),
         outlet: DemoRatingSelectOnEnterComponent
+      },
+      {
+        title: 'Configuring defaults',
+        anchor: 'demo-rating-config',
+        component: require('!!raw-loader!./demos/config/config'),
+        html: require('!!raw-loader!./demos/config/config.html'),
+        outlet: DemoRatingConfigComponent
       }
     ]
   },
@@ -65,6 +73,11 @@ export const demoComponentContent: ContentSection[] = [
         title: 'RatingComponent',
         anchor: 'rating-component',
         outlet: NgApiDocComponent
+      },
+      {
+        title: 'RatingConfig',
+        anchor: 'rating-config',
+        outlet: NgApiDocConfigComponent
       }
     ]
   }

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

@@ -1,12 +1,8 @@
-<pre class="card card-block card-header">Model: {{asyncSelected | json}}</pre>
+<pre class="card card-block card-header">Model: {{ asyncSelected | json }}</pre>
 
 <input [(ngModel)]="asyncSelected"
-       [typeaheadAsync]="true"
        [typeahead]="dataSource"
-       (typeaheadLoading)="changeTypeaheadLoading($event)"
-       (typeaheadOnSelect)="typeaheadOnSelect($event)"
-       [typeaheadOptionsLimit]="7"
+       [typeaheadAsync]="true"
        typeaheadOptionField="name"
-       placeholder="Locations loaded with timeout"
+       placeholder="Locations loaded via observable"
        class="form-control">
-<div *ngIf="typeaheadLoading">Loading</div>

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

@@ -1,19 +1,21 @@
 import { Component } from '@angular/core';
 
 import { Observable, of } from 'rxjs';
-import { TypeaheadMatch } from 'ngx-bootstrap/typeahead';
-import { mergeMap, delay } from 'rxjs/operators';
+
+interface DataSourceType {
+  id: number;
+  name: string;
+  region: string;
+}
 
 @Component({
   selector: 'demo-typeahead-async',
   templateUrl: './async.html'
 })
 export class DemoTypeaheadAsyncComponent {
   asyncSelected: string;
-  typeaheadLoading: boolean;
-  typeaheadNoResults: boolean;
-  dataSource: Observable<any>;
-  statesComplex: any[] = [
+  dataSource: Observable<DataSourceType[]>;
+  statesComplex: DataSourceType[] = [
     { id: 1, name: 'Alabama', region: 'South' },
     { id: 2, name: 'Alaska', region: 'West' },
     { id: 3, name: 'Arizona', region: 'West' },
@@ -67,31 +69,6 @@ export class DemoTypeaheadAsyncComponent {
   ];
 
   constructor() {
-    this.dataSource = Observable.create((observer: any) => {
-      // Runs on every search
-      observer.next(this.asyncSelected);
-    })
-      .pipe(
-        mergeMap((token: string) => this.getStatesAsObservable(token)),
-        delay(1000)
-      );
-  }
-
-  getStatesAsObservable(token: string): Observable<any> {
-    const query = new RegExp(token, 'i');
-
-    return of(
-      this.statesComplex.filter((state: any) => {
-        return query.test(state.name);
-      })
-    );
-  }
-
-  changeTypeaheadLoading(e: boolean): void {
-    this.typeaheadLoading = e;
-  }
-
-  typeaheadOnSelect(e: TypeaheadMatch): void {
-    console.log('Selected value: ', e.value);
+    this.dataSource = of(this.statesComplex)
   }
 }