@villedemontreal/angular-ui 15.2.1 → 15.3.1-pre.build.1

package/fesm2020/villedemontreal-angular-ui.mjs

@@ -19,6 +19,7 @@ import { _getFocusedElementPierceShadowDom } from '@angular/cdk/platform';
 import { ESCAPE, hasModifierKey } from '@angular/cdk/keycodes';
 import { take as take$1 } from 'rxjs/operators';
 import { trigger, state, style, transition, animate } from '@angular/animations';
+import * as i2$1 from '@angular/cdk/layout';
 
 function baoColorToHex(baoColor) {
     switch (baoColor) {
@@ -706,19 +707,10 @@ class BaoBreadcrumbComponent {
         this.renderer = renderer;
     }
     ngAfterViewInit() {
-        this.createLiElement();
+        this.setLastLinkAttribute();
     }
     onContentChange() {
-        this.createLiElement();
-    }
-    createLiElement() {
-        const children = Array.from(this.staticContainer.nativeElement.children);
         this.setLastLinkAttribute();
-        children.forEach(c => {
-            const liElement = this.renderer.createElement('li');
-            this.renderer.appendChild(liElement, c);
-            this.renderer.appendChild(this.staticContainer.nativeElement, liElement);
-        });
     }
     setLastLinkAttribute() {
         const children = Array.from(this.staticContainer.nativeElement.children);
@@ -726,12 +718,12 @@ class BaoBreadcrumbComponent {
     }
 }
 BaoBreadcrumbComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.1.3", ngImport: i0, type: BaoBreadcrumbComponent, deps: [{ token: i0.Renderer2 }], target: i0.ɵɵFactoryTarget.Component });
-BaoBreadcrumbComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.1.3", type: BaoBreadcrumbComponent, selector: "bao-breadcrumb", host: { classAttribute: "bao-breadcrumb" }, viewQueries: [{ propertyName: "staticContainer", first: true, predicate: ["container"], descendants: true }], ngImport: i0, template: "<nav class=\"bao-breadcrumb-nav\" aria-label=\"Breadcrumb\">\n  <ol #container (cdkObserveContent)=\"onContentChange()\">\n    <ng-content></ng-content>\n  </ol>\n</nav>\n", styles: [".bao-breadcrumb-nav{display:inline-flex;flex-direction:row;flex-wrap:wrap}.bao-breadcrumb-nav>ol{list-style:none;padding-left:0;margin-bottom:0}.bao-breadcrumb-nav>ol>li{line-height:1rem;display:inline-flex;margin-bottom:0;margin-right:.25rem}.bao-breadcrumb-nav>ol>li:last-child{margin-right:0}.bao-breadcrumb-nav>ol>li:last-child:after{content:none}.bao-breadcrumb-nav>ol>li:after{display:inline-block;content:url(\"data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23ADB5BD' fill-rule='evenodd'><path d='M12.586 12L9.293 8.707a1 1 0 011.414-1.414l4 4a1 1 0 010 1.414l-4 4a1 1 0 01-1.414-1.414L12.586 12z'/></svg>\");height:1rem;width:1rem;margin-left:.25rem;color:#637381;background-color:#fff0;cursor:default;flex-shrink:0}.bao-breadcrumb-nav>ol>li>a{font-weight:700;font-size:.75rem;line-height:1rem;align-items:end;text-decoration:none;text-transform:uppercase;color:#637381;border-bottom:none;background-color:#fff0}.bao-breadcrumb-nav>ol>li>a:hover{color:#097d6c}\n"], dependencies: [{ kind: "directive", type: i1$2.CdkObserveContent, selector: "[cdkObserveContent]", inputs: ["cdkObserveContentDisabled", "debounce"], outputs: ["cdkObserveContent"], exportAs: ["cdkObserveContent"] }], encapsulation: i0.ViewEncapsulation.None });
+BaoBreadcrumbComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.1.3", type: BaoBreadcrumbComponent, selector: "bao-breadcrumb", host: { classAttribute: "bao-breadcrumb" }, viewQueries: [{ propertyName: "staticContainer", first: true, predicate: ["container"], descendants: true }], ngImport: i0, template: "<nav\n  #container\n  class=\"bao-breadcrumb-nav\"\n  aria-label=\"Breadcrumb\"\n  (cdkObserveContent)=\"onContentChange()\"\n>\n  <ng-content></ng-content>\n</nav>\n", styles: [".bao-breadcrumb-nav{display:inline-flex;flex-direction:row;flex-wrap:wrap}.bao-breadcrumb-nav>a{font-weight:700;font-size:.75rem;line-height:1rem;display:inline-flex;align-items:end;text-decoration:none;text-transform:uppercase;color:#637381;margin-bottom:.5rem;margin-right:.25rem;border-bottom:none;background-color:#fff0}.bao-breadcrumb-nav>a:hover{color:#097d6c}.bao-breadcrumb-nav>a:last-child{margin-right:0}.bao-breadcrumb-nav>a:last-child:after{content:none}.bao-breadcrumb-nav>a:after{display:inline-block;content:url(\"data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23ADB5BD' fill-rule='evenodd'><path d='M12.586 12L9.293 8.707a1 1 0 011.414-1.414l4 4a1 1 0 010 1.414l-4 4a1 1 0 01-1.414-1.414L12.586 12z'/></svg>\");height:1rem;width:1rem;margin-left:.25rem;color:#637381;background-color:#fff0;cursor:default;flex-shrink:0}\n"], dependencies: [{ kind: "directive", type: i1$2.CdkObserveContent, selector: "[cdkObserveContent]", inputs: ["cdkObserveContentDisabled", "debounce"], outputs: ["cdkObserveContent"], exportAs: ["cdkObserveContent"] }], encapsulation: i0.ViewEncapsulation.None });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.1.3", ngImport: i0, type: BaoBreadcrumbComponent, decorators: [{
             type: Component,
             args: [{ selector: 'bao-breadcrumb', encapsulation: ViewEncapsulation.None, host: {
                         class: 'bao-breadcrumb'
-                    }, template: "<nav class=\"bao-breadcrumb-nav\" aria-label=\"Breadcrumb\">\n  <ol #container (cdkObserveContent)=\"onContentChange()\">\n    <ng-content></ng-content>\n  </ol>\n</nav>\n", styles: [".bao-breadcrumb-nav{display:inline-flex;flex-direction:row;flex-wrap:wrap}.bao-breadcrumb-nav>ol{list-style:none;padding-left:0;margin-bottom:0}.bao-breadcrumb-nav>ol>li{line-height:1rem;display:inline-flex;margin-bottom:0;margin-right:.25rem}.bao-breadcrumb-nav>ol>li:last-child{margin-right:0}.bao-breadcrumb-nav>ol>li:last-child:after{content:none}.bao-breadcrumb-nav>ol>li:after{display:inline-block;content:url(\"data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23ADB5BD' fill-rule='evenodd'><path d='M12.586 12L9.293 8.707a1 1 0 011.414-1.414l4 4a1 1 0 010 1.414l-4 4a1 1 0 01-1.414-1.414L12.586 12z'/></svg>\");height:1rem;width:1rem;margin-left:.25rem;color:#637381;background-color:#fff0;cursor:default;flex-shrink:0}.bao-breadcrumb-nav>ol>li>a{font-weight:700;font-size:.75rem;line-height:1rem;align-items:end;text-decoration:none;text-transform:uppercase;color:#637381;border-bottom:none;background-color:#fff0}.bao-breadcrumb-nav>ol>li>a:hover{color:#097d6c}\n"] }]
+                    }, template: "<nav\n  #container\n  class=\"bao-breadcrumb-nav\"\n  aria-label=\"Breadcrumb\"\n  (cdkObserveContent)=\"onContentChange()\"\n>\n  <ng-content></ng-content>\n</nav>\n", styles: [".bao-breadcrumb-nav{display:inline-flex;flex-direction:row;flex-wrap:wrap}.bao-breadcrumb-nav>a{font-weight:700;font-size:.75rem;line-height:1rem;display:inline-flex;align-items:end;text-decoration:none;text-transform:uppercase;color:#637381;margin-bottom:.5rem;margin-right:.25rem;border-bottom:none;background-color:#fff0}.bao-breadcrumb-nav>a:hover{color:#097d6c}.bao-breadcrumb-nav>a:last-child{margin-right:0}.bao-breadcrumb-nav>a:last-child:after{content:none}.bao-breadcrumb-nav>a:after{display:inline-block;content:url(\"data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23ADB5BD' fill-rule='evenodd'><path d='M12.586 12L9.293 8.707a1 1 0 011.414-1.414l4 4a1 1 0 010 1.414l-4 4a1 1 0 01-1.414-1.414L12.586 12z'/></svg>\");height:1rem;width:1rem;margin-left:.25rem;color:#637381;background-color:#fff0;cursor:default;flex-shrink:0}\n"] }]
         }], ctorParameters: function () { return [{ type: i0.Renderer2 }]; }, propDecorators: { staticContainer: [{
                 type: ViewChild,
                 args: ['container', { static: false }]
@@ -5747,6 +5739,182 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.1.3", ngImpor
                 }]
         }] });
 
+/*
+ * Copyright (c) 2023 Ville de Montreal. All rights reserved.
+ * Licensed under the MIT license.
+ * See LICENSE file in the project root for full license information.
+ */
+const Breakpoints = {
+    XSmall: '(max-width: 575.98px)',
+    Small: '(min-width: 576px) and (max-width: 767.98px)',
+    Medium: '(min-width: 768px) and (max-width: 991.98px)',
+    Large: '(min-width: 992px) and (max-width: 1199.98px)',
+    XLarge: '(min-width: 1200px)'
+};
+
+/*
+ * Copyright (c) 2023 Ville de Montreal. All rights reserved.
+ * Licensed under the MIT license.
+ * See LICENSE file in the project root for full license information.
+ */
+
+/**
+ * This component is dynamically added to replace breadcrumb when System Header is viewed on tablet or mobile screens.
+ * Used internally by BaoSystemHeaderComponent only, not to be used by host application.
+ */
+class BaoBackNavigationComponent {
+    constructor(renderer, elementRef) {
+        this.renderer = renderer;
+        this.elementRef = elementRef;
+    }
+    ngOnChanges(changes) {
+        if (changes['link'] && changes['link'].currentValue) {
+            this.renderer.setAttribute(this.elementRef.nativeElement.children[0], 'href', changes['link'].currentValue);
+        }
+    }
+}
+BaoBackNavigationComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.1.3", ngImport: i0, type: BaoBackNavigationComponent, deps: [{ token: i0.Renderer2 }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
+BaoBackNavigationComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.1.3", type: BaoBackNavigationComponent, selector: "bao-back-navigation-component", inputs: { link: "link" }, host: { classAttribute: "bao-system-header-back-button" }, usesOnChanges: true, ngImport: i0, template: ` <a>
+    <bao-icon
+      color="action"
+      title="arrow-left"
+      svgIcon="icon-arrow-left"
+      size="x-small"
+    ></bao-icon>
+  </a>`, isInline: true, dependencies: [{ kind: "component", type: BaoIconComponent, selector: "bao-icon", inputs: ["color", "size", "svgIcon", "title"], exportAs: ["baoIcon"] }] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.1.3", ngImport: i0, type: BaoBackNavigationComponent, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'bao-back-navigation-component',
+                    template: ` <a>
+    <bao-icon
+      color="action"
+      title="arrow-left"
+      svgIcon="icon-arrow-left"
+      size="x-small"
+    ></bao-icon>
+  </a>`,
+                    host: {
+                        class: 'bao-system-header-back-button'
+                    }
+                }]
+        }], ctorParameters: function () { return [{ type: i0.Renderer2 }, { type: i0.ElementRef }]; }, propDecorators: { link: [{
+                type: Input
+            }] } });
+/**
+ * This directive is to mark the template where the BaoBackNavigationComponent should be dynamically inserted,
+ * when a Breadcrumb component needs to be replaced
+ */
+class BaoBackNavigationInsert {
+    constructor(viewContainerRef) {
+        this.viewContainerRef = viewContainerRef;
+    }
+}
+BaoBackNavigationInsert.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.1.3", ngImport: i0, type: BaoBackNavigationInsert, deps: [{ token: i0.ViewContainerRef }], target: i0.ɵɵFactoryTarget.Directive });
+BaoBackNavigationInsert.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.1.3", type: BaoBackNavigationInsert, selector: "[backNavigationInsert]", ngImport: i0 });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.1.3", ngImport: i0, type: BaoBackNavigationInsert, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: '[backNavigationInsert]'
+                }]
+        }], ctorParameters: function () { return [{ type: i0.ViewContainerRef }]; } });
+class BaoSystemHeaderComponent {
+    constructor(breakpointObserver, renderer) {
+        this.breakpointObserver = breakpointObserver;
+        this.renderer = renderer;
+        this.screenType = 'desktop';
+    }
+    get textContainerChildren() {
+        return Array.from(this.textContainer.nativeElement.children);
+    }
+    ngOnInit() {
+        if ([Breakpoints.XSmall, Breakpoints.Small].some(size => this.breakpointObserver.isMatched(size))) {
+            this.screenType = 'mobile';
+        }
+        else if (this.breakpointObserver.isMatched(Breakpoints.Medium)) {
+            this.screenType = 'tablet';
+        }
+        else if ([Breakpoints.Large, Breakpoints.XLarge].some(size => this.breakpointObserver.isMatched(size))) {
+            this.screenType = 'desktop';
+        }
+    }
+    ngAfterViewInit() {
+        this.formatNavigation();
+        this.applySizeClass();
+    }
+    formatNavigation() {
+        // If view is rendered on a mobile/tablet screen
+        if (this.screenType == 'mobile' || this.screenType == 'tablet') {
+            if (this.textContainerChildren[0].className == 'bao-breadcrumb') {
+                // Retrieve link of parent page
+                const breadcrumbElementsList = this.textContainerChildren[0].children[0];
+                const breadcrumbLength = breadcrumbElementsList.children.length;
+                const parentLink = breadcrumbElementsList.children[breadcrumbLength - 2].attributes['href'].value;
+                // Remove Breadcrumb component and replace it with back button
+                this.renderer.removeChild(this.textContainer.nativeElement, this.textContainerChildren[0]);
+                const viewContainerRef = this.backButtonInsert.viewContainerRef;
+                viewContainerRef.clear();
+                const componentRef = viewContainerRef.createComponent(BaoBackNavigationComponent);
+                componentRef.setInput('link', parentLink);
+            }
+        }
+    }
+    applySizeClass() {
+        const tagInfoContainer = this.textContainer.nativeElement.childNodes[this.textContainerChildren.length - 1];
+        if (this.screenType === 'mobile') {
+            this.renderer.addClass(tagInfoContainer, 'mobile');
+        }
+    }
+}
+BaoSystemHeaderComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.1.3", ngImport: i0, type: BaoSystemHeaderComponent, deps: [{ token: i2$1.BreakpointObserver }, { token: i0.Renderer2 }], target: i0.ɵɵFactoryTarget.Component });
+BaoSystemHeaderComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.1.3", type: BaoSystemHeaderComponent, selector: "bao-system-header", host: { classAttribute: "bao-system-header" }, viewQueries: [{ propertyName: "textContainer", first: true, predicate: ["textContainer"], descendants: true }, { propertyName: "backButtonInsert", first: true, predicate: BaoBackNavigationInsert, descendants: true, static: true }], ngImport: i0, template: "<div class=\"left-side-content\">\n  <div class=\"back-navigation-container\">\n    <ng-content select=\"a\"></ng-content>\n    <ng-template backNavigationInsert></ng-template>\n  </div>\n  <div #textContainer class=\"text-content\">\n    <ng-content select=\"bao-breadcrumb\"></ng-content>\n    <ng-content select=\"h1\"></ng-content>\n    <div class=\"tag-info-container\">\n      <ng-content select=\"bao-tag\"></ng-content>\n      <span class=\"additional-info\">\n        <ng-content select=\"span\"></ng-content>\n      </span>\n    </div>\n  </div>\n</div>\n<div class=\"button-container\">\n  <ng-content></ng-content>\n</div>\n", styles: ["@charset \"UTF-8\";.bao-container{padding-right:16px;padding-left:16px;margin-right:auto;margin-left:auto;width:100%}@media (min-width: 576px){.bao-container{max-width:576px}}@media (min-width: 768px){.bao-container{max-width:768px}}@media (min-width: 992px){.bao-container{max-width:992px}}@media (min-width: 1200px){.bao-container{max-width:1200px}}.bao-row{display:flex;flex-wrap:wrap;margin-right:-16px;margin-left:-16px}.bao-col-12,.bao-col-lg-7{position:relative;width:100%;padding-right:1rem;padding-left:1rem}@media (min-width: 992px){.bao-col-lg-7{flex:0 0 58.33333%;max-width:58.33333%}}.bao-system-header{display:flex;justify-content:flex-start}.bao-system-header .left-side-content{display:inline-flex;width:75%}.bao-system-header .left-side-content .back-navigation-container a{margin-right:1.25rem;border-bottom:none}.bao-system-header .left-side-content .back-navigation-container a:hover{cursor:pointer}.bao-system-header .left-side-content .text-content{width:100%}.bao-system-header .left-side-content .text-content h1{font-weight:700;color:#212529;font-size:1.5rem;line-height:2rem;margin-bottom:.5rem}.bao-system-header .left-side-content .text-content .tag-info-container{width:100%;display:block}.bao-system-header .left-side-content .text-content .tag-info-container>span:nth-child(2):before{content:\"\\b7\";margin:0 .5rem}.bao-system-header .left-side-content .text-content .tag-info-container .additional-info>*{font-weight:400;font-size:.875rem;line-height:1.25rem}.bao-system-header .left-side-content .text-content .tag-info-container.mobile .bao-tag{margin-bottom:.25rem}.bao-system-header .left-side-content .text-content .tag-info-container.mobile .additional-info{display:block}.bao-system-header .left-side-content .text-content .tag-info-container.mobile .additional-info:before{content:none}.bao-system-header .left-side-content .text-content .tag-info-container>.bao-tag{max-width:100%}.bao-system-header .left-side-content .text-content .tag-info-container>.bao-tag>span{width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.bao-system-header .button-container{flex-shrink:0;margin-left:auto}.bao-system-header .button-container .bao-button{margin-left:1rem}\n"], dependencies: [{ kind: "directive", type: BaoBackNavigationInsert, selector: "[backNavigationInsert]" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.1.3", ngImport: i0, type: BaoSystemHeaderComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'bao-system-header', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, host: {
+                        class: 'bao-system-header'
+                    }, template: "<div class=\"left-side-content\">\n  <div class=\"back-navigation-container\">\n    <ng-content select=\"a\"></ng-content>\n    <ng-template backNavigationInsert></ng-template>\n  </div>\n  <div #textContainer class=\"text-content\">\n    <ng-content select=\"bao-breadcrumb\"></ng-content>\n    <ng-content select=\"h1\"></ng-content>\n    <div class=\"tag-info-container\">\n      <ng-content select=\"bao-tag\"></ng-content>\n      <span class=\"additional-info\">\n        <ng-content select=\"span\"></ng-content>\n      </span>\n    </div>\n  </div>\n</div>\n<div class=\"button-container\">\n  <ng-content></ng-content>\n</div>\n", styles: ["@charset \"UTF-8\";.bao-container{padding-right:16px;padding-left:16px;margin-right:auto;margin-left:auto;width:100%}@media (min-width: 576px){.bao-container{max-width:576px}}@media (min-width: 768px){.bao-container{max-width:768px}}@media (min-width: 992px){.bao-container{max-width:992px}}@media (min-width: 1200px){.bao-container{max-width:1200px}}.bao-row{display:flex;flex-wrap:wrap;margin-right:-16px;margin-left:-16px}.bao-col-12,.bao-col-lg-7{position:relative;width:100%;padding-right:1rem;padding-left:1rem}@media (min-width: 992px){.bao-col-lg-7{flex:0 0 58.33333%;max-width:58.33333%}}.bao-system-header{display:flex;justify-content:flex-start}.bao-system-header .left-side-content{display:inline-flex;width:75%}.bao-system-header .left-side-content .back-navigation-container a{margin-right:1.25rem;border-bottom:none}.bao-system-header .left-side-content .back-navigation-container a:hover{cursor:pointer}.bao-system-header .left-side-content .text-content{width:100%}.bao-system-header .left-side-content .text-content h1{font-weight:700;color:#212529;font-size:1.5rem;line-height:2rem;margin-bottom:.5rem}.bao-system-header .left-side-content .text-content .tag-info-container{width:100%;display:block}.bao-system-header .left-side-content .text-content .tag-info-container>span:nth-child(2):before{content:\"\\b7\";margin:0 .5rem}.bao-system-header .left-side-content .text-content .tag-info-container .additional-info>*{font-weight:400;font-size:.875rem;line-height:1.25rem}.bao-system-header .left-side-content .text-content .tag-info-container.mobile .bao-tag{margin-bottom:.25rem}.bao-system-header .left-side-content .text-content .tag-info-container.mobile .additional-info{display:block}.bao-system-header .left-side-content .text-content .tag-info-container.mobile .additional-info:before{content:none}.bao-system-header .left-side-content .text-content .tag-info-container>.bao-tag{max-width:100%}.bao-system-header .left-side-content .text-content .tag-info-container>.bao-tag>span{width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.bao-system-header .button-container{flex-shrink:0;margin-left:auto}.bao-system-header .button-container .bao-button{margin-left:1rem}\n"] }]
+        }], ctorParameters: function () { return [{ type: i2$1.BreakpointObserver }, { type: i0.Renderer2 }]; }, propDecorators: { textContainer: [{
+                type: ViewChild,
+                args: ['textContainer', { static: false }]
+            }], backButtonInsert: [{
+                type: ViewChild,
+                args: [BaoBackNavigationInsert, { static: true }]
+            }] } });
+
+/*
+ * Copyright (c) 2023 Ville de Montreal. All rights reserved.
+ * Licensed under the MIT license.
+ * See LICENSE file in the project root for full license information.
+ */
+const SYSTEM_HEADER_DIRECTIVES = [
+    BaoSystemHeaderComponent,
+    BaoBackNavigationInsert,
+    BaoBackNavigationComponent
+];
+class BaoSystemHeaderModule {
+}
+BaoSystemHeaderModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.1.3", ngImport: i0, type: BaoSystemHeaderModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+BaoSystemHeaderModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.1.3", ngImport: i0, type: BaoSystemHeaderModule, declarations: [BaoSystemHeaderComponent,
+        BaoBackNavigationInsert,
+        BaoBackNavigationComponent], imports: [CommonModule, BaoIconModule], exports: [BaoSystemHeaderComponent,
+        BaoBackNavigationInsert,
+        BaoBackNavigationComponent] });
+BaoSystemHeaderModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.1.3", ngImport: i0, type: BaoSystemHeaderModule, imports: [CommonModule, BaoIconModule] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.1.3", ngImport: i0, type: BaoSystemHeaderModule, decorators: [{
+            type: NgModule,
+            args: [{
+                    imports: [CommonModule, BaoIconModule],
+                    declarations: [SYSTEM_HEADER_DIRECTIVES],
+                    exports: [SYSTEM_HEADER_DIRECTIVES]
+                }]
+        }] });
+
+/*
+ * Copyright (c) 2023 Ville de Montreal. All rights reserved.
+ * Licensed under the MIT license.
+ * See LICENSE file in the project root for full license information.
+ */
+
 /*
  * Copyright (c) 2023 Ville de Montreal. All rights reserved.
  * Licensed under the MIT license.
@@ -5778,7 +5946,8 @@ BaoModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.
         BaoHyperlinkModule,
         BaoDropdownMenuModule,
         BaoFileModule,
-        BaoSnackBarModule
+        BaoSnackBarModule,
+        BaoSystemHeaderModule
         // TODO: reactivate once component does not depend on global css BaoBadgeModule,
     ] });
 BaoModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.1.3", ngImport: i0, type: BaoModule, imports: [BaoIconModule,
@@ -5804,7 +5973,8 @@ BaoModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.
         BaoHyperlinkModule,
         BaoDropdownMenuModule,
         BaoFileModule,
-        BaoSnackBarModule
+        BaoSnackBarModule,
+        BaoSystemHeaderModule
         // TODO: reactivate once component does not depend on global css BaoBadgeModule,
     ] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.1.3", ngImport: i0, type: BaoModule, decorators: [{
@@ -5837,7 +6007,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.1.3", ngImpor
                         BaoHyperlinkModule,
                         BaoDropdownMenuModule,
                         BaoFileModule,
-                        BaoSnackBarModule
+                        BaoSnackBarModule,
+                        BaoSystemHeaderModule
                         // TODO: reactivate once component does not depend on global css BaoBadgeModule,
                     ]
                 }]
@@ -5928,5 +6099,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.1.3", ngImpor
  * Generated bundle index. Do not edit.
  */
 
-export { BAO_FILE_INTL_PROVIDER, BAO_FILE_INTL_PROVIDER_FACTORY, BAO_MODAL_DATA, BAO_RADIO_GROUP, BAO_SNACK_BAR_DATA, BAO_SNACK_BAR_DEFAULT_OPTIONS, BaoAlertActions, BaoAlertComponent, BaoAlertContent, BaoAlertLink, BaoAlertModule, BaoAlertTitle, BaoAvatarComponent, BaoAvatarContent, BaoAvatarModule, BaoBadgeComponent, BaoBadgeModule, BaoBreadcrumbComponent, BaoBreadcrumbModule, BaoButtonComponent, BaoButtonModule, BaoCardComponent, BaoCardContent, BaoCardHeader, BaoCardModule, BaoCardTextInterface, BaoCardTitle, BaoCheckBoxDescription, BaoCheckboxComponent, BaoCheckboxGroupComponent, BaoCheckboxModule, BaoCommonComponentsModule, BaoDropdownMenuComponent, BaoDropdownMenuDivider, BaoDropdownMenuItem, BaoDropdownMenuItemDescription, BaoDropdownMenuItemLabel, BaoDropdownMenuModule, BaoDropdownMenuSection, BaoDropdownMenuTrigger, BaoErrorTextComponent, BaoFileDropDirective, BaoFileDropzoneIntructions, BaoFileInputComponent, BaoFileIntl, BaoFileIntlEnglish, BaoFileModule, BaoFilePreviewComponent, BaoGuidingTextComponent, BaoHeaderInfoComponent, BaoHeaderInfoContent, BaoHeaderInfoModule, BaoHeaderInfoSubtitle, BaoHeaderInfoSurtitle, BaoHeaderInfoTitle, BaoHeaderInfoTitleGroupComponent, BaoHyperlinkComponent, BaoHyperlinkModule, BaoIconComponent, BaoIconModule, BaoLabelTextComponent, BaoList, BaoListItem, BaoListItemDescription, BaoListItemTitle, BaoListModule, BaoListSummary, BaoListSummaryItem, BaoModal, BaoModalBase, BaoModalClose, BaoModalContainer, BaoModalInitialConfig, BaoModalModule, BaoModalRef, BaoModule, BaoNavList, BaoRadioButtonComponent, BaoRadioButtonGroupComponent, BaoRadioDescription, BaoRadioModule, BaoSimpleSnackBarComponent, BaoSnackBarConfig, BaoSnackBarContainerComponent, BaoSnackBarModule, BaoSnackBarRef, BaoSnackBarService, BaoSummaryComponent, BaoSummaryDescription, BaoSummaryModule, BaoTabHeader, BaoTabPanel, BaoTablistComponent, BaoTabsContainer, BaoTabsModule, BaoTagComponent, BaoTagModule, BaoTitleTextComponent, _BaoModalContainerBase, _closeModalVia, baoFactory, eModalDesktopWidthSize, eModalMobileWidthSize, throwBaoModalContentAlreadyAttachedError };
+export { BAO_FILE_INTL_PROVIDER, BAO_FILE_INTL_PROVIDER_FACTORY, BAO_MODAL_DATA, BAO_RADIO_GROUP, BAO_SNACK_BAR_DATA, BAO_SNACK_BAR_DEFAULT_OPTIONS, BaoAlertActions, BaoAlertComponent, BaoAlertContent, BaoAlertLink, BaoAlertModule, BaoAlertTitle, BaoAvatarComponent, BaoAvatarContent, BaoAvatarModule, BaoBackNavigationComponent, BaoBackNavigationInsert, BaoBadgeComponent, BaoBadgeModule, BaoBreadcrumbComponent, BaoBreadcrumbModule, BaoButtonComponent, BaoButtonModule, BaoCardComponent, BaoCardContent, BaoCardHeader, BaoCardModule, BaoCardTextInterface, BaoCardTitle, BaoCheckBoxDescription, BaoCheckboxComponent, BaoCheckboxGroupComponent, BaoCheckboxModule, BaoCommonComponentsModule, BaoDropdownMenuComponent, BaoDropdownMenuDivider, BaoDropdownMenuItem, BaoDropdownMenuItemDescription, BaoDropdownMenuItemLabel, BaoDropdownMenuModule, BaoDropdownMenuSection, BaoDropdownMenuTrigger, BaoErrorTextComponent, BaoFileDropDirective, BaoFileDropzoneIntructions, BaoFileInputComponent, BaoFileIntl, BaoFileIntlEnglish, BaoFileModule, BaoFilePreviewComponent, BaoGuidingTextComponent, BaoHeaderInfoComponent, BaoHeaderInfoContent, BaoHeaderInfoModule, BaoHeaderInfoSubtitle, BaoHeaderInfoSurtitle, BaoHeaderInfoTitle, BaoHeaderInfoTitleGroupComponent, BaoHyperlinkComponent, BaoHyperlinkModule, BaoIconComponent, BaoIconModule, BaoLabelTextComponent, BaoList, BaoListItem, BaoListItemDescription, BaoListItemTitle, BaoListModule, BaoListSummary, BaoListSummaryItem, BaoModal, BaoModalBase, BaoModalClose, BaoModalContainer, BaoModalInitialConfig, BaoModalModule, BaoModalRef, BaoModule, BaoNavList, BaoRadioButtonComponent, BaoRadioButtonGroupComponent, BaoRadioDescription, BaoRadioModule, BaoSimpleSnackBarComponent, BaoSnackBarConfig, BaoSnackBarContainerComponent, BaoSnackBarModule, BaoSnackBarRef, BaoSnackBarService, BaoSummaryComponent, BaoSummaryDescription, BaoSummaryModule, BaoSystemHeaderComponent, BaoSystemHeaderModule, BaoTabHeader, BaoTabPanel, BaoTablistComponent, BaoTabsContainer, BaoTabsModule, BaoTagComponent, BaoTagModule, BaoTitleTextComponent, _BaoModalContainerBase, _closeModalVia, baoFactory, eModalDesktopWidthSize, eModalMobileWidthSize, throwBaoModalContentAlreadyAttachedError };
 //# sourceMappingURL=villedemontreal-angular-ui.mjs.map