Release 15.0.0

Author: idzark

README.md

@@ -1,4 +1,4 @@
-Bootstrap 4 & Angular 11 UI KIT - 700+ components, MIT license, simple installation.
+Bootstrap 4 & Angular 15 UI KIT - 700+ components, MIT license, simple installation.
 
 MDB is a collection of free Bootstrap templates, themes, design tools & resources.
 
@@ -16,18 +16,18 @@ MDB is a collection of free Bootstrap templates, themes, design tools & resource
 
 ### [>> Get Started in 1 minute](https://mdbootstrap.com/docs/angular/getting-started/installation/)
 Simple installation via .zip, npm or cdnjs.
- 
-### [>> Install with MDBGO](https://mdbgo.com/) 
+
+### [>> Install with MDBGO](https://mdbgo.com/)
  Free Hosting, WordPress support, custom domains, SSL support, free database, frontend & backend templates, webpack starter included, git repostiory, FTP & jenkins support.
- 
+
 ### [>> Install with MDBGO + e-commerce shop integration](https://mdbgo.com/wordpress-shop/)
 One click setup! MDB GO allows you to create a WordPress page with a single click.
 Regardless whether you want to create a Travel Blog or an e-commerce shop to sell your product you can easily do that. You can even combine both into single page.
 
 
-## About Material Design for Bootstrap 4 & Angular 11
+## About Material Design for Bootstrap 4 & Angular 15
 
-<p>Created by <a href="https://mdbootstrap.com"><img height="30" src="https://mdbootstrap.com/img/Marketing/general/logo/medium/mdb-angular-r.png"></a>  
+<p>Created by <a href="https://mdbootstrap.com"><img height="30" src="https://mdbootstrap.com/img/Marketing/general/logo/medium/mdb-angular-r.png"></a>
 <a href="https://npmcharts.com/compare/angular-bootstrap-md?minimal=true"> <img src="https://img.shields.io/npm/dm/mdbootstrap.svg?label=NPM%20Downloads" alt="Downloads"></a>
 <a href="https://github.com/mdbootstrap/mdb4-angular-ui-kit/blob/master/LICENSE"><img src="https://img.shields.io/badge/license-MIT-green.svg" alt="License"></a>
 <a href="https://twitter.com/intent/tweet/?text=Thanks+@mdbootstrap+for+creating+amazing+and+free+Material+Design+for+Bootstrap+4+UI+KIT%20https://mdbootstrap.com/docs/angular/&hashtags=javascript,code,webdesign,bootstrap"><img src="https://img.shields.io/twitter/url/http/shields.io.svg?style=social&label=Let%20us%20know%20you%20were%20here%21&"></a>
@@ -64,7 +64,7 @@ Trusted by <b>2 000 000+</b> developers & designers. Used by companies & institu
       </td>
       <td>
         <ul>
-        <li><b><a href="https://mdbootstrap.com/docs/angular/">500+ UI components</a></b></li>          
+        <li><b><a href="https://mdbootstrap.com/docs/angular/">500+ UI components</a></b></li>
          <li>Super simple, 1 minute installation</li>
          <li>Detailed docs & practical examples</li>
          <li>Lots of tutorials</li>
@@ -241,29 +241,29 @@ ___
 <li><a href="https://mdbootstrap.com/docs/standard/extended/login/">Bootstrap Login Form</a></li>
 <li><a href="https://mdbootstrap.com/docs/standard/extended/maps/">Bootstrap Maps</a></li>
 <li><a href="https://mdbootstrap.com/docs/standard/extended/media-object/">Bootstrap Media Object</a></li>
-<li><a href="https://mdbootstrap.com/docs/standard/extended/mega-menu/">Bootstrap Mega Menu</a></li> 
-<li><a href="https://mdbootstrap.com/docs/standard/extended/multiselect/">Bootstrap Multiselect</a></li> 
-<li><a href="https://mdbootstrap.com/docs/standard/extended/news-feed/">Bootstrap News Feed</a></li> 
-<li><a href="https://mdbootstrap.com/docs/standard/extended/offcanvas/">Bootstrap Offcanvas</a></li> 
-<li><a href="https://mdbootstrap.com/docs/standard/extended/order-details/">Bootstrap Order Details</a></li> 
-<li><a href="https://mdbootstrap.com/docs/standard/extended/page-transitions/">Bootstrap Page Transitions</a></li> 
-<li><a href="https://mdbootstrap.com/docs/standard/extended/payment-forms/">Bootstrap Payment Forms</a></li> 
-<li><a href="https://mdbootstrap.com/docs/standard/extended/product-cards/">Bootstrap Product Cards</a></li> 
-<li><a href="https://mdbootstrap.com/docs/standard/extended/profiles/">Bootstrap Profiles</a></li>  
-<li><a href="https://mdbootstrap.com/docs/standard/extended/quotes/">Bootstrap Quotes</a></li> 
-<li><a href="https://mdbootstrap.com/docs/standard/extended/registration/">Bootstrap Registration Form</a></li> 
-<li><a href="https://mdbootstrap.com/docs/standard/extended/search-expanding/">Bootstrap Expanding Search Bar</a></li> 
-<li><a href="https://mdbootstrap.com/docs/standard/extended/shopping-carts/">Bootstrap Shopping Carts</a></li> 
-<li><a href="https://mdbootstrap.com/docs/standard/extended/side-navbar/">Bootstrap Side Navbar</a></li>  
-<li><a href="https://mdbootstrap.com/docs/standard/extended/sidebar/">Bootstrap Sidebar</a></li>  
-<li><a href="https://mdbootstrap.com/docs/standard/extended/social-media/">Bootstrap Social Media Icons & Buttons</a></li>  
-<li><a href="https://mdbootstrap.com/docs/standard/extended/square-buttons/">Bootstrap Square Buttons</a></li>  
-<li><a href="https://mdbootstrap.com/docs/standard/extended/bootstrap-survey-form/">Bootstrap Survey Form</a></li>  
-<li><a href="https://mdbootstrap.com/docs/standard/extended/testimonial-slider/">Bootstrap Testimonial Slider</a></li>  
-<li><a href="https://mdbootstrap.com/docs/standard/extended/testimonials/">Bootstrap Testimonials</a></li>  
-<li><a href="https://mdbootstrap.com/docs/standard/extended/textarea/">Bootstrap Textarea</a></li>  
-<li><a href="https://mdbootstrap.com/docs/standard/extended/timeline/">Bootstrap Timeline</a></li>  
-<li><a href="https://mdbootstrap.com/docs/standard/extended/to-do-list/">Bootstrap To Do List</a></li>  
-<li><a href="https://mdbootstrap.com/docs/standard/extended/video-carousel/">Bootstrap Video Carousel / Gallery</a></li>  
-<li><a href="https://mdbootstrap.com/docs/standard/extended/weather/">Bootstrap Weather</a></li>  
+<li><a href="https://mdbootstrap.com/docs/standard/extended/mega-menu/">Bootstrap Mega Menu</a></li>
+<li><a href="https://mdbootstrap.com/docs/standard/extended/multiselect/">Bootstrap Multiselect</a></li>
+<li><a href="https://mdbootstrap.com/docs/standard/extended/news-feed/">Bootstrap News Feed</a></li>
+<li><a href="https://mdbootstrap.com/docs/standard/extended/offcanvas/">Bootstrap Offcanvas</a></li>
+<li><a href="https://mdbootstrap.com/docs/standard/extended/order-details/">Bootstrap Order Details</a></li>
+<li><a href="https://mdbootstrap.com/docs/standard/extended/page-transitions/">Bootstrap Page Transitions</a></li>
+<li><a href="https://mdbootstrap.com/docs/standard/extended/payment-forms/">Bootstrap Payment Forms</a></li>
+<li><a href="https://mdbootstrap.com/docs/standard/extended/product-cards/">Bootstrap Product Cards</a></li>
+<li><a href="https://mdbootstrap.com/docs/standard/extended/profiles/">Bootstrap Profiles</a></li>
+<li><a href="https://mdbootstrap.com/docs/standard/extended/quotes/">Bootstrap Quotes</a></li>
+<li><a href="https://mdbootstrap.com/docs/standard/extended/registration/">Bootstrap Registration Form</a></li>
+<li><a href="https://mdbootstrap.com/docs/standard/extended/search-expanding/">Bootstrap Expanding Search Bar</a></li>
+<li><a href="https://mdbootstrap.com/docs/standard/extended/shopping-carts/">Bootstrap Shopping Carts</a></li>
+<li><a href="https://mdbootstrap.com/docs/standard/extended/side-navbar/">Bootstrap Side Navbar</a></li>
+<li><a href="https://mdbootstrap.com/docs/standard/extended/sidebar/">Bootstrap Sidebar</a></li>
+<li><a href="https://mdbootstrap.com/docs/standard/extended/social-media/">Bootstrap Social Media Icons & Buttons</a></li>
+<li><a href="https://mdbootstrap.com/docs/standard/extended/square-buttons/">Bootstrap Square Buttons</a></li>
+<li><a href="https://mdbootstrap.com/docs/standard/extended/bootstrap-survey-form/">Bootstrap Survey Form</a></li>
+<li><a href="https://mdbootstrap.com/docs/standard/extended/testimonial-slider/">Bootstrap Testimonial Slider</a></li>
+<li><a href="https://mdbootstrap.com/docs/standard/extended/testimonials/">Bootstrap Testimonials</a></li>
+<li><a href="https://mdbootstrap.com/docs/standard/extended/textarea/">Bootstrap Textarea</a></li>
+<li><a href="https://mdbootstrap.com/docs/standard/extended/timeline/">Bootstrap Timeline</a></li>
+<li><a href="https://mdbootstrap.com/docs/standard/extended/to-do-list/">Bootstrap To Do List</a></li>
+<li><a href="https://mdbootstrap.com/docs/standard/extended/video-carousel/">Bootstrap Video Carousel / Gallery</a></li>
+<li><a href="https://mdbootstrap.com/docs/standard/extended/weather/">Bootstrap Weather</a></li>
 </ul>

angular-bootstrap-md-14.0.0.tgz

@@ -1,3 +1,17 @@
+15.0.0
+
+This version requires Angular v15. Follow the Angular update guide to migrate your project to Angular 15.
+
+**Breaking changes:**
+
+* Added support for Angular 15, this Angular version is now required,
+
+**Fixes and improvements:**
+
+* Navbar - resolved problem with height of collapsed component on initialization,
+* Navbar - resolved problem with height of expanded menu on component initialization and window resize,
+* Sidenav - resolved problem with sidenav mask size in component with dynamic content.
+
 14.0.0
 
 This version requires Angular v14 and Node 14.15.0 (or later). Follow the Angular update guide to migrate your project to Angular 14:

angular-bootstrap-md-15.0.0.tgz

@@ -1,6 +1,6 @@
 {
   "name": "angular-bootstrap-md-lib",
-  "version": "14.0.0",
+  "version": "15.0.0",
   "scripts": {
     "ng": "ng",
     "start": "ng serve",
@@ -10,8 +10,8 @@
     "e2e": "ng e2e",
     "copy-scss": "cp -r projects/angular-bootstrap-md/src/lib/assets dist/angular-bootstrap-md/assets",
     "copy-files": "cp projects/angular-bootstrap-md/src/lib/changelog projects/angular-bootstrap-md/src/lib/License.pdf README.md dist/angular-bootstrap-md",
-    "pack-archive": "cd dist/angular-bootstrap-md && npm pack . && cp angular-bootstrap-md-14.*.tgz ../..",
-    "remove-archive": "rm dist/angular-bootstrap-md/angular-bootstrap-md-14.*.tgz && cd ../..",
+    "pack-archive": "cd dist/angular-bootstrap-md && npm pack . && cp angular-bootstrap-md-15.*.tgz ../..",
+    "remove-archive": "rm dist/angular-bootstrap-md/angular-bootstrap-md-15.*.tgz && cd ../..",
     "compile-lib": "ng-packagr -p projects/angular-bootstrap-md/ng-package.json && npm run copy-scss && npm run copy-files && npm run schematics:build && npm run pack-archive && npm run remove-archive",
     "schematics:build": "tsc -p projects/angular-bootstrap-md/tsconfig.schematics.json && npm run schematics:copy-schema && npm run schematics:copy-collection",
     "schematics:copy-schema": "cp projects/angular-bootstrap-md/schematics/ng-add/schema.json dist/angular-bootstrap-md/schematics/ng-add",
@@ -31,7 +31,7 @@
     "@angular/router": "^15.1.1",
     "@fortawesome/fontawesome-free": "^6.0.0",
     "@types/chart.js": "^2.7.42",
-    "angular-bootstrap-md": "file:angular-bootstrap-md-14.0.0.tgz",
+    "angular-bootstrap-md": "file:angular-bootstrap-md-15.0.0.tgz",
     "chart.js": "^2.5.0",
     "hammerjs": "^2.0.8",
     "rxjs": "~7.5.0",

changelog

@@ -1,17 +1,17 @@
 {
   "name": "angular-bootstrap-md",
   "repository": "https://github.com/mdbootstrap/Angular-Bootstrap-with-Material-Design",
-  "version": "14.0.0",
+  "version": "15.0.0",
   "schematics": "./schematics/collection.json",
   "dependencies": {
     "tslib": "^2.0.0"
   },
   "peerDependencies": {
-    "@angular/common": "^14.0.0",
-    "@angular/core": "^14.0.0",
-    "@angular/animations": "^14.0.0",
-    "@angular/forms": "^14.0.0",
-    "@angular/cdk": "^14.0.0"
+    "@angular/common": "^15.0.0",
+    "@angular/core": "^15.0.0",
+    "@angular/animations": "^15.0.0",
+    "@angular/forms": "^15.0.0",
+    "@angular/cdk": "^15.0.0"
   },
   "exports": {
     "./assets/img/*": {

package-lock.json

@@ -6,7 +6,7 @@ import { addPackageToPackageJson } from './package';
 // Just return the tree
 export function ngAdd(options: Schema): Rule {
   return (tree: Tree, context: SchematicContext) => {
-    const angularDependencyVersion = '^14.0.0';
+    const angularDependencyVersion = '^15.0.0';
 
     addPackageToPackageJson(tree, '@angular/cdk', angularDependencyVersion);
     addPackageToPackageJson(tree, '@angular/forms', angularDependencyVersion);

package.json

@@ -12,7 +12,7 @@
   display: block;
   min-height: $font-size-base * $line-height-base;
   padding-left: $custom-control-gutter + $custom-control-indicator-size;
-  color-adjust: exact; // Keep themed appearance for print
+  print-color-adjust: exact; // Keep themed appearance for print
 }
 
 .custom-control-inline {

projects/angular-bootstrap-md/package.json

@@ -1,3 +1,17 @@
+15.0.0
+
+This version requires Angular v15. Follow the Angular update guide to migrate your project to Angular 15.
+
+**Breaking changes:**
+
+* Added support for Angular 15, this Angular version is now required,
+
+**Fixes and improvements:**
+
+* Navbar - resolved problem with height of collapsed component on initialization,
+* Navbar - resolved problem with height of expanded menu on component initialization and window resize,
+* Sidenav - resolved problem with sidenav mask size in component with dynamic content.
+
 14.0.0
 
 This version requires Angular v14 and Node 14.15.0 (or later). Follow the Angular update guide to migrate your project to Angular 14:

projects/angular-bootstrap-md/schematics/ng-add/index.ts

@@ -14,9 +14,7 @@ import { RouterLink } from '@angular/router';
 @Component({
   // eslint-disable-next-line @angular-eslint/component-selector
   selector: 'links',
-  template: `
-    <ng-content></ng-content>
-  `,
+  template: ` <ng-content></ng-content> `,
 })
 export class LinksComponent implements AfterContentInit {
   @ContentChildren(RouterLink, { read: ElementRef, descendants: true })

projects/angular-bootstrap-md/src/lib/assets/scss/bootstrap/_custom-forms.scss

@@ -255,6 +255,7 @@ export class NavbarComponent implements AfterViewInit, OnInit, AfterContentCheck
           this.height = this.el.nativeElement.scrollHeight;
           this.collapse = true;
           this.renderer.setStyle(this.el.nativeElement, 'opacity', '');
+          this._cdRef.markForCheck();
         }, 4);
       }
     } else {
@@ -268,7 +269,7 @@ export class NavbarComponent implements AfterViewInit, OnInit, AfterContentCheck
   }
 
   ngAfterContentChecked() {
-    if (this.el.nativeElement.firstElementChild) {
+    if (this.el.nativeElement.firstElementChild && this.isShown) {
       if (
         this._itemsLength !==
         this.el.nativeElement.firstElementChild.firstElementChild.children.length

projects/angular-bootstrap-md/src/lib/changelog

@@ -14,9 +14,7 @@ import { RouterLink } from '@angular/router';
 @Component({
   // eslint-disable-next-line @angular-eslint/component-selector
   selector: 'navlinks',
-  template: `
-    <ng-content></ng-content>
-  `,
+  template: ` <ng-content></ng-content> `,
 })
 export class NavlinksComponent implements AfterContentInit {
   @ContentChildren(RouterLink, { read: ElementRef, descendants: true })