Release 8.9.0

Author: idzark

angular-bootstrap-md-8.8.2.tgz

@@ -1,3 +1,25 @@
+8.9.0
+In version 8.9.0 we added some fixes and features for the existing components. Check what changed below:
+
+**Fixes:**
+
+* Validation - resolved problem with styles of outline inputs,
+* Select - adjusted outline input height to the height of the inputs in other form controls,
+* Stepper - (stepChange) event will not be emitted for disabled steps,
+* Datepicker - resolved problems with global options,
+* Autocomplete - fixed dropdown bottom position in outline mode,
+* Timepicker - component will now return new value and change event when clear method is used,
+* Checkbox - resolved problem with label styles (removed unnecessary overflow and white-space properties),
+* Sidenav - resolved problem with styles of the links with waves effect,
+* Sortable plugin - input/textarea funcitonality will no longer be blocked by the sortable directive,
+* Sidenav/Accordion - added checks for window object to resolve problems with server side rendering.
+
+**New features:**
+
+* Dropdown - added new dynamicPosition input, when this option is active component will dynamically update dropdown position (if the menu does not fit the viewport),
+* Timepicker - added possibility to add custom styles for footer and AM/PM buttons and custom translation to buttons,
+* Timepicker - added possibility to add new button that will clear the current selected value.
+
 8.8.2
 In version 8.8.2 we added some fixes for the existing components and removed duplicated css styles. Check what changed below:
 

angular-bootstrap-md-8.9.0.tgz

@@ -1,6 +1,6 @@
 {
   "name": "angular-bootstrap-md-lib",
-  "version": "8.8.2",
+  "version": "8.9.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.8.2.tgz",
+    "angular-bootstrap-md": "file:angular-bootstrap-md-8.9.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.8.2",
+  "version": "8.9.0",
   "schematics": "./schematics/collection.json",
   "files": [
     "**/*"

package-lock.json

@@ -215,19 +215,24 @@
     top: 0;
     left: 0;
     font-size: 1rem;
-    transition: transform 0.2s ease-out, color 0.2s ease-out, max-width 0.2s ease-out;
+    transition: transform 0.2s ease-out, color 0.2s ease-out;
     transform-origin: 0% 100%;
     transform: translateY(12px);
     cursor: text;
     color: $input-label-color;
+    &.active {
+      transform: translateY(-14px) scale(0.8);
+    }
+  }
+
+  label:not(.form-check-label) {
+    transition: transform 0.2s ease-out, color 0.2s ease-out, max-width 0.2s ease-out;
     text-overflow: ellipsis;
     overflow: hidden;
     white-space: nowrap;
-    display: inline-block;
     max-width: 100%;
 
     &.active {
-      transform: translateY(-14px) scale(0.8);
       max-width: 123%;
     }
   }

package.json

@@ -1,3 +1,25 @@
+8.9.0
+In version 8.9.0 we added some fixes and features for the existing components. Check what changed below:
+
+**Fixes:**
+
+* Validation - resolved problem with styles of outline inputs,
+* Select - adjusted outline input height to the height of the inputs in other form controls,
+* Stepper - (stepChange) event will not be emitted for disabled steps,
+* Datepicker - resolved problems with global options,
+* Autocomplete - fixed dropdown bottom position in outline mode,
+* Timepicker - component will now return new value and change event when clear method is used,
+* Checkbox - resolved problem with label styles (removed unnecessary overflow and white-space properties),
+* Sidenav - resolved problem with styles of the links with waves effect,
+* Sortable plugin - input/textarea funcitonality will no longer be blocked by the sortable directive,
+* Sidenav/Accordion - added checks for window object to resolve problems with server side rendering.
+
+**New features:**
+
+* Dropdown - added new dynamicPosition input, when this option is active component will dynamically update dropdown position (if the menu does not fit the viewport),
+* Timepicker - added possibility to add custom styles for footer and AM/PM buttons and custom translation to buttons,
+* Timepicker - added possibility to add new button that will clear the current selected value.
+
 8.8.2
 In version 8.8.2 we added some fixes for the existing components and removed duplicated css styles. Check what changed below:
 

projects/angular-bootstrap-md/package.json

@@ -52,6 +52,7 @@ export class BsDropdownDirective implements OnInit, OnDestroy {
   @Input() container: string;
   @Input() dropup: boolean;
   @Input() dropupDefault = false;
+  @Input() dynamicPosition = false;
   /**
    * This attribute indicates that the dropdown should be opened upwards
    */
@@ -149,6 +150,7 @@ export class BsDropdownDirective implements OnInit, OnDestroy {
 
   _isDisabled: boolean;
   _dropdown: ComponentLoader<BsDropdownContainerComponent>;
+  _dropup: boolean;
   _subscriptions: Subscription[] = [];
   _isInited = false;
   _isDropupDefault: boolean;
@@ -192,6 +194,8 @@ export class BsDropdownDirective implements OnInit, OnDestroy {
 
     this._showInline = !this.container;
 
+    this._dropup = this.dropup;
+
     // attach DOM listeners
     this._dropdown.listen({
       triggers: this.triggers,
@@ -278,6 +282,20 @@ export class BsDropdownDirective implements OnInit, OnDestroy {
     }
     setTimeout(() => {
       container.classList.add('fadeInDropdown');
+
+      if (this.dynamicPosition) {
+        const bounding = container.getBoundingClientRect();
+        const out: { top: boolean; bottom: boolean } = {
+          top: bounding.top < 0,
+          bottom: bounding.bottom > (window.innerHeight || document.documentElement.clientHeight),
+        };
+
+        if (this.dropup && out.top) {
+          this.dropup = false;
+        } else if (!this.dropup && out.bottom) {
+          this.dropup = true;
+        }
+      }
     }, 0);
 
     if (this._showInline) {
@@ -330,6 +348,10 @@ export class BsDropdownDirective implements OnInit, OnDestroy {
       return;
     }
 
+    if (this.dropup !== this._dropup) {
+      this.dropup = this._dropup;
+    }
+
     const container = this._elementRef.nativeElement.querySelector('.dropdown-menu');
 
     container.classList.remove('fadeInDropdown');