Release 8.5.0

Author: idzark

angular-bootstrap-md-8.4.0.tgz

@@ -1,3 +1,26 @@
+8.5.0
+In version 8.5.0 we added some fixes and new features. Check what changed below:
+
+**Fixes:**
+
+* Datepicker - resolved problem with opening multiple datepickers on label click when inline mode is used,
+* Datepicker - resolved problem with styles of right and left arrows when date picker is rendered inside mdb-stepper,
+* Datepicker - resolved problem with z-index in inline mode (dropdown should no longer be overlapped by a footer),
+* Multiselect - resolved problem with styles of checkboxes when select is used inside element with md-form class,
+* Select - resolved problem with setting default value when change is detected in option array,
+* Select - component styles have been corrected to adapt its appearance to other MDB form elements,
+* Autocomplete - number of visible options will no longer be set by default. It resolves problem with options styles when mdb-options have a non-standard height.
+
+**New Features:**
+
+* Table sort - added new (sorted) output that emits data, sortDirection and sortBy parameters,
+* Autocomplete - added new [dropdownHeight] input that allows to customize dropdown height (it will only work if visibleOptions input is not used).
+
+**Docs:**
+
+* Modal - added list of options available for dynamic modals
+* MDB Angular Boilerplate - added guide on how to configure MDB Angular Pro version.
+
 8.4.0
 In version 8.4.0 we added some fixes and new features. Check what changed below:
 

angular-bootstrap-md-8.5.0.tgz

@@ -1,6 +1,6 @@
 {
   "name": "angular-bootstrap-md-lib",
-  "version": "8.4.0",
+  "version": "8.5.0",
   "scripts": {
     "ng": "ng",
     "start": "ng serve",
@@ -29,7 +29,7 @@
     "@angular/router": "~8.0.0",
     "@fortawesome/fontawesome-free": "^5.6.3",
     "@types/chart.js": "^2.7.42",
-    "angular-bootstrap-md": "file:angular-bootstrap-md-8.4.0.tgz",
+    "angular-bootstrap-md": "file:angular-bootstrap-md-8.5.0.tgz",
     "chart.js": "^2.5.0",
     "core-js": "^2.5.4",
     "hammerjs": "^2.0.8",

changelog

@@ -1,7 +1,7 @@
 {
   "name": "angular-bootstrap-md",
   "repository": "https://github.com/mdbootstrap/Angular-Bootstrap-with-Material-Design",
-  "version": "8.4.0",
+  "version": "8.5.0",
   "schematics": "./schematics/collection.json",
   "files": [
     "**/*"

package-lock.json

@@ -1,6 +1,6 @@
 /*!
  * Material Design for Bootstrap 4
- * Version: MDB FREE 4.8.5
+ * Version: MDB FREE 4.8.2
  *
  *
  * Copyright: Material Design for Bootstrap

package.json

@@ -1,3 +1,26 @@
+8.5.0
+In version 8.5.0 we added some fixes and new features. Check what changed below:
+
+**Fixes:**
+
+* Datepicker - resolved problem with opening multiple datepickers on label click when inline mode is used,
+* Datepicker - resolved problem with styles of right and left arrows when date picker is rendered inside mdb-stepper,
+* Datepicker - resolved problem with z-index in inline mode (dropdown should no longer be overlapped by a footer),
+* Multiselect - resolved problem with styles of checkboxes when select is used inside element with md-form class,
+* Select - resolved problem with setting default value when change is detected in option array,
+* Select - component styles have been corrected to adapt its appearance to other MDB form elements,
+* Autocomplete - number of visible options will no longer be set by default. It resolves problem with options styles when mdb-options have a non-standard height.
+
+**New Features:**
+
+* Table sort - added new (sorted) output that emits data, sortDirection and sortBy parameters,
+* Autocomplete - added new [dropdownHeight] input that allows to customize dropdown height (it will only work if visibleOptions input is not used).
+
+**Docs:**
+
+* Modal - added list of options available for dynamic modals
+* MDB Angular Boilerplate - added guide on how to configure MDB Angular Pro version.
+
 8.4.0
 In version 8.4.0 we added some fixes and new features. Check what changed below:
 

projects/angular-bootstrap-md/package.json

@@ -1,21 +1,47 @@
-import {Directive, EventEmitter, HostListener, Input, Output, ElementRef, Renderer2, OnInit} from '@angular/core';
+import {
+  Directive,
+  EventEmitter,
+  HostListener,
+  Input,
+  Output,
+  ElementRef,
+  Renderer2,
+  OnInit,
+} from '@angular/core';
+
+enum SortDirection {
+  ASC = 'ascending',
+  DESC = 'descending',
+}
+
+export interface SortedData {
+  data: any[];
+  sortOrder: string;
+  sortBy: string;
+}
 
 @Directive({
-  selector: '[mdbTableSort]'
+  selector: '[mdbTableSort]',
 })
 export class MdbTableSortDirective implements OnInit {
-  sorted = true;
+  sortedInto = true;
+  order: string;
 
   @Input('mdbTableSort') dataSource: Array<any> = [];
   @Input() sortBy: string;
 
   @Output() sortEnd: EventEmitter<any[]> = new EventEmitter<any[]>();
-
+  @Output() sorted: EventEmitter<SortedData> = new EventEmitter<SortedData>();
   constructor(private el: ElementRef, private renderer: Renderer2) {}
 
   @HostListener('click') onclick() {
     this.sortDataBy(this.trimWhiteSigns(this.sortBy.toString()));
     this.sortEnd.emit(this.dataSource);
+    this.sorted.emit({
+      data: this.dataSource,
+      sortOrder: this.order,
+      sortBy: this.sortBy,
+    });
   }
 
   trimWhiteSigns(headElement: any): string {
@@ -31,7 +57,7 @@ export class MdbTableSortDirective implements OnInit {
     }
     if (newIndex >= arr.length) {
       let k = newIndex - arr.length;
-      while ((k--) + 1) {
+      while (k-- + 1) {
         arr.push(null);
       }
     }
@@ -52,23 +78,40 @@ export class MdbTableSortDirective implements OnInit {
 
       if (a < b) {
         this.renderer.setAttribute(this.el.nativeElement, 'aria-sort', 'ascending');
-        this.renderer.setAttribute(this.el.nativeElement, 'aria-label', `${key}: activate to sort column descending`);
-        return this.sorted ? 1 : -1;
+        this.renderer.setAttribute(
+          this.el.nativeElement,
+          'aria-label',
+          `${key}: activate to sort column descending`
+        );
+        this.order = SortDirection.ASC;
+
+        return this.sortedInto ? 1 : -1;
       } else if (a > b) {
         this.renderer.setAttribute(this.el.nativeElement, 'aria-sort', 'descending');
-        this.renderer.setAttribute(this.el.nativeElement, 'aria-label', `${key}: activate to sort column ascending`);
-        return this.sorted ? -1 : 1;
+        this.renderer.setAttribute(
+          this.el.nativeElement,
+          'aria-label',
+          `${key}: activate to sort column ascending`
+        );
+        this.order = SortDirection.DESC;
+
+        return this.sortedInto ? -1 : 1;
       } else if (a == null || b == null) {
         return 1;
       } else {
         return 0;
       }
     });
-    this.sorted = !this.sorted;
+
+    this.sortedInto = !this.sortedInto;
   }
 
   ngOnInit() {
     const key = this.trimWhiteSigns(this.sortBy.toString()).split('.');
-    this.renderer.setAttribute(this.el.nativeElement, 'aria-label', `${key}: activate to sort column descending`);
+    this.renderer.setAttribute(
+      this.el.nativeElement,
+      'aria-label',
+      `${key}: activate to sort column descending`
+    );
   }
 }