@villedemontreal/angular-ui 16.0.8 → 16.1.0

package/fesm2022/villedemontreal-angular-ui.mjs

@@ -3825,6 +3825,15 @@ class BaoHyperlinkComponent {
     ngAfterViewInit() {
         this.setIcon();
         this.addIconClass();
+        this.addTabIndex();
+    }
+    addTabIndex() {
+        if (!this.nativeElement)
+            return;
+        const anchorElement = Array.from(this.nativeElement.children).find(el => el.localName === 'a');
+        if (!anchorElement)
+            return;
+        this.renderer.setAttribute(anchorElement, 'tabIndex', '0');
     }
     setIcon() {
         const parentName = this.nativeElement.parentElement.localName;
@@ -4119,9 +4128,11 @@ class BaoDropdownMenuComponent {
         }
     }
     /** Prevents focus to be lost when SHIFT + TAB has reached beginning of menu  */
-    shiftTabKeyEvent() {
+    shiftTabKeyEvent(event) {
         if (this.isOpen) {
             if (document.activeElement === this._listItems.first.nativeElement) {
+                event.preventDefault();
+                event.stopPropagation();
                 this.isClosedByKeyEvent.emit();
             }
         }
@@ -4213,7 +4224,7 @@ class BaoDropdownMenuComponent {
         }
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.6", ngImport: i0, type: BaoDropdownMenuComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.Renderer2 }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.6", type: BaoDropdownMenuComponent, selector: "bao-dropdown-menu", outputs: { isOpenChange: "isOpenChange", isClosedByKeyEvent: "isClosedByKeyEvent" }, host: { listeners: { "window:keyup.arrowup": "upKeyEvent()", "window:keyup.arrowdown": "downKeyEvent()", "window:keydown.tab": "tabKeyEvent()", "window:keyup.tab": "tabUpKeyEvent()", "window:keydown.shift.tab": "shiftTabKeyEvent()" }, properties: { "class.bao-overlay-transparent-backdrop": "isOpen===false", "class.bao-dropdown-menu-closed": "isOpen===false", "attr.aria-expanded": "isOpen" }, classAttribute: "bao-dropdown-menu-container" }, queries: [{ propertyName: "_listItems", predicate: BaoDropdownMenuItem, descendants: true }], viewQueries: [{ propertyName: "_menuContent", first: true, predicate: ["menuContent"], descendants: true }], ngImport: i0, template: "<div #menuContent class=\"bao-dropdown-menu\" tabindex=\"-1\">\n  <ng-content></ng-content>\n</div>\n", styles: [".bao-dropdown-menu-container.bao-dropdown-menu-closed{display:none}.bao-dropdown-menu{min-width:16rem;max-width:32rem;overflow-y:auto;background:#ffffff;box-shadow:0 .5rem 2rem #0000001a;border-radius:.25rem;margin-top:.25rem;margin-bottom:.25rem;padding-top:.5rem;padding-bottom:.5rem}.bao-dropdown-menu:focus-visible{outline:none}.bao-dropdown-menu .bao-overlay-transparent-backdrop{background-color:#fff0;display:none}.bao-dropdown-menu ul{list-style-type:none;padding:0;margin:0}.bao-dropdown-menu h5{padding:.5rem 0 .5rem 1rem;margin:0}.bao-dropdown-menu .bao-dropdown-menu-item{display:flex;align-items:center;text-decoration:none;border-bottom:none;cursor:default}.bao-dropdown-menu .bao-dropdown-menu-item:hover{background-color:#f8f9fa}.bao-dropdown-menu .bao-dropdown-menu-item:active{background-color:#eefaf8}.bao-dropdown-menu .bao-dropdown-menu-item:focus{box-shadow:inset 0 0 0 .25rem #98bcde}.bao-dropdown-menu .bao-dropdown-menu-item.active-link{background-color:#eefaf8}.bao-dropdown-menu .bao-dropdown-menu-item.has-element-right{padding-right:1.5rem}.bao-dropdown-menu .bao-dropdown-menu-item.has-element-left{padding-left:1rem}.bao-dropdown-menu .bao-dropdown-menu-item.bao-dropdown-menu-item-disabled{cursor:not-allowed;pointer-events:none}.bao-dropdown-menu .bao-dropdown-menu-item.bao-dropdown-menu-item-disabled:hover,.bao-dropdown-menu .bao-dropdown-menu-item.bao-dropdown-menu-item-disabled:active{background:#ffffff}.bao-dropdown-menu .bao-dropdown-menu-item.bao-dropdown-menu-item-disabled .bao-dropdown-menu-item-content .bao-dropdown-menu-item-label,.bao-dropdown-menu .bao-dropdown-menu-item.bao-dropdown-menu-item-disabled .bao-dropdown-menu-item-content .bao-dropdown-menu-item-description{color:#adb2bd}.bao-dropdown-menu .bao-dropdown-menu-item>.bao-dropdown-menu-item-content{display:flex;flex-direction:column;margin:.5rem 1rem;background-color:inherit}.bao-dropdown-menu .bao-dropdown-menu-item>.bao-dropdown-menu-item-content .bao-dropdown-menu-item-label{font-weight:400;font-size:1rem;line-height:1.5rem;color:#212529}.bao-dropdown-menu .bao-dropdown-menu-item>.bao-dropdown-menu-item-content .bao-dropdown-menu-item-description{font-weight:400;font-size:.875rem;line-height:1.25rem;color:#637381}.bao-dropdown-menu .bao-dropdown-menu-item>.bao-icon{color:#adb2bd;flex-shrink:0}.bao-dropdown-menu .bao-dropdown-menu-divider hr{margin-top:.5rem;margin-bottom:.5rem}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.6", type: BaoDropdownMenuComponent, selector: "bao-dropdown-menu", outputs: { isOpenChange: "isOpenChange", isClosedByKeyEvent: "isClosedByKeyEvent" }, host: { listeners: { "window:keyup.arrowup": "upKeyEvent()", "window:keyup.arrowdown": "downKeyEvent()", "window:keydown.tab": "tabKeyEvent()", "window:keyup.tab": "tabUpKeyEvent()", "window:keydown.shift.tab": "shiftTabKeyEvent($event)" }, properties: { "class.bao-overlay-transparent-backdrop": "isOpen===false", "class.bao-dropdown-menu-closed": "isOpen===false", "attr.aria-expanded": "isOpen" }, classAttribute: "bao-dropdown-menu-container" }, queries: [{ propertyName: "_listItems", predicate: BaoDropdownMenuItem, descendants: true }], viewQueries: [{ propertyName: "_menuContent", first: true, predicate: ["menuContent"], descendants: true }], ngImport: i0, template: "<div #menuContent class=\"bao-dropdown-menu\" tabindex=\"-1\">\n  <ng-content></ng-content>\n</div>\n", styles: [".bao-dropdown-menu-container.bao-dropdown-menu-closed{display:none}.bao-dropdown-menu{min-width:16rem;max-width:32rem;overflow-y:auto;background:#ffffff;box-shadow:0 .5rem 2rem #0000001a;border-radius:.25rem;margin-top:.25rem;margin-bottom:.25rem;padding-top:.5rem;padding-bottom:.5rem}.bao-dropdown-menu:focus-visible{outline:none}.bao-dropdown-menu .bao-overlay-transparent-backdrop{background-color:#fff0;display:none}.bao-dropdown-menu ul{list-style-type:none;padding:0;margin:0}.bao-dropdown-menu h5{padding:.5rem 0 .5rem 1rem;margin:0}.bao-dropdown-menu .bao-dropdown-menu-item{display:flex;align-items:center;text-decoration:none;border-bottom:none;cursor:default}.bao-dropdown-menu .bao-dropdown-menu-item:hover{background-color:#f8f9fa}.bao-dropdown-menu .bao-dropdown-menu-item:active{background-color:#eefaf8}.bao-dropdown-menu .bao-dropdown-menu-item:focus{box-shadow:inset 0 0 0 .25rem #98bcde}.bao-dropdown-menu .bao-dropdown-menu-item.active-link{background-color:#eefaf8}.bao-dropdown-menu .bao-dropdown-menu-item.has-element-right{padding-right:1.5rem}.bao-dropdown-menu .bao-dropdown-menu-item.has-element-left{padding-left:1rem}.bao-dropdown-menu .bao-dropdown-menu-item.bao-dropdown-menu-item-disabled{cursor:not-allowed;pointer-events:none}.bao-dropdown-menu .bao-dropdown-menu-item.bao-dropdown-menu-item-disabled:hover,.bao-dropdown-menu .bao-dropdown-menu-item.bao-dropdown-menu-item-disabled:active{background:#ffffff}.bao-dropdown-menu .bao-dropdown-menu-item.bao-dropdown-menu-item-disabled .bao-dropdown-menu-item-content .bao-dropdown-menu-item-label,.bao-dropdown-menu .bao-dropdown-menu-item.bao-dropdown-menu-item-disabled .bao-dropdown-menu-item-content .bao-dropdown-menu-item-description{color:#adb2bd}.bao-dropdown-menu .bao-dropdown-menu-item>.bao-dropdown-menu-item-content{display:flex;flex-direction:column;margin:.5rem 1rem;background-color:inherit}.bao-dropdown-menu .bao-dropdown-menu-item>.bao-dropdown-menu-item-content .bao-dropdown-menu-item-label{font-weight:400;font-size:1rem;line-height:1.5rem;color:#212529}.bao-dropdown-menu .bao-dropdown-menu-item>.bao-dropdown-menu-item-content .bao-dropdown-menu-item-description{font-weight:400;font-size:.875rem;line-height:1.25rem;color:#637381}.bao-dropdown-menu .bao-dropdown-menu-item>.bao-icon{color:#adb2bd;flex-shrink:0}.bao-dropdown-menu .bao-dropdown-menu-divider hr{margin-top:.5rem;margin-bottom:.5rem}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.6", ngImport: i0, type: BaoDropdownMenuComponent, decorators: [{
             type: Component,
@@ -4247,7 +4258,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.6", ngImpor
                 args: ['window:keyup.tab']
             }], shiftTabKeyEvent: [{
                 type: HostListener,
-                args: ['window:keydown.shift.tab']
+                args: ['window:keydown.shift.tab', ['$event']]
             }] } });
 /**
  * Directive to be applied on element that will trigger the opening and closing of menu.
@@ -4259,7 +4270,6 @@ class BaoDropdownMenuTrigger {
         this.overlay = overlay;
         this._overlayRef = null;
         this._isMenuOpen = false;
-        this.animationDelay = 50;
     }
     get nativeElement() {
         return this.elementRef.nativeElement;
@@ -4278,7 +4288,7 @@ class BaoDropdownMenuTrigger {
         this.renderer.setAttribute(this.nativeElement, 'aria-controls', `bao-dropdown-menu-${dropdownMenuUniqueId}`);
         this.menu.isClosedByKeyEvent.subscribe(() => {
             this.closeMenu();
-            setTimeout(() => this.nativeElement.focus(), this.animationDelay);
+            this.nativeElement.focus();
         });
     }
     ngOnDestroy() {
@@ -4304,7 +4314,7 @@ class BaoDropdownMenuTrigger {
         overlayRef.attach(this.menu.menuPortal);
         this._isMenuOpen = true;
         this.menu.open();
-        setTimeout(() => this.menu.focus(), this.animationDelay);
+        this.menu.focus();
     }
     createOverlay() {
         if (!this._overlayRef) {
@@ -6141,6 +6151,114 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.6", ngImpor
  * See LICENSE file in the project root for full license information.
  */
 
+/*
+ * Copyright (c) 2025 Ville de Montreal. All rights reserved.
+ * Licensed under the MIT license.
+ * See LICENSE file in the project root for full license information.
+ */
+/**
+ * The BaoMessageBarContent directive is used within the <bao-message-bar>
+ * It ensures consistency in text formatting and spacing.
+ *
+ * This directive is purely visual and does not provide any additional behaviors.
+ */
+class BaoMessageBarContent {
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.6", ngImport: i0, type: BaoMessageBarContent, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.2.6", type: BaoMessageBarContent, selector: "bao-message-content", host: { classAttribute: "bao-message-content" }, ngImport: i0 }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.6", ngImport: i0, type: BaoMessageBarContent, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: 'bao-message-content',
+                    host: { class: 'bao-message-content' }
+                }]
+        }] });
+class BaoMessageBarComponent {
+    constructor(elementRef) {
+        this.elementRef = elementRef;
+        this.type = 'info';
+        this.dismissible = false;
+        this.dismissibleButtonAriaLabel = 'Cacher le message';
+        this.dismiss = new EventEmitter();
+    }
+    ngOnChanges(changes) {
+        if (changes['type']) {
+            this.iconType = this.getIconType(changes['type'].currentValue);
+            this.iconTitle = this.getIconTitle(changes['type'].currentValue);
+        }
+    }
+    onDismissClicked() {
+        const messageBar = this.elementRef.nativeElement;
+        messageBar.classList.add('bao-fade-out');
+        setTimeout(() => {
+            this.dismiss.emit();
+        }, 300);
+    }
+    getIconType(value) {
+        const icons = {
+            info: 'icon-info',
+            alert: 'icon-warning',
+            urgent: 'icon-emergency',
+            neutral: 'icon-info'
+        };
+        return icons[value] || 'icon-info';
+    }
+    getIconTitle(value) {
+        const titles = {
+            info: 'Information',
+            alert: 'Alerte',
+            urgent: 'Urgence',
+            neutral: 'Information'
+        };
+        return titles[value] || 'Information';
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.6", ngImport: i0, type: BaoMessageBarComponent, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.6", type: BaoMessageBarComponent, selector: "bao-message-bar", inputs: { type: "type", dismissible: "dismissible", dismissibleButtonAriaLabel: "dismissibleButtonAriaLabel" }, outputs: { dismiss: "dismiss" }, host: { properties: { "class.bao-message-bar-info": "type === \"info\"", "class.bao-message-bar-alert": "type === \"alert\"", "class.bao-message-bar-urgent": "type === \"urgent\"", "class.bao-message-bar-neutral": "type === \"neutral\"" }, classAttribute: "bao-message-bar message-bar-dismissible bao-fade-in" }, usesOnChanges: true, ngImport: i0, template: "<bao-icon [svgIcon]=\"iconType\" [title]=\"iconTitle\"></bao-icon>\n\n<div class=\"bao-message-content\">\n  <ng-content></ng-content>\n</div>\n\n<button\n  *ngIf=\"dismissible\"\n  class=\"bao-message-close\"\n  type=\"button\"\n  data-dismiss=\"message\"\n  role=\"button\"\n  [attr.aria-label]=\"dismissibleButtonAriaLabel\"\n  (click)=\"onDismissClicked()\"\n>\n  <bao-icon svgIcon=\"icon-x\"></bao-icon>\n</button>\n", styles: ["@keyframes bao-fade-in{0%{opacity:0}to{opacity:1}}@keyframes bao-fade-out{0%{opacity:1}to{opacity:0}}.bao-fade-in{animation:bao-fade-in .3s ease-in-out}.bao-fade-out{animation:bao-fade-out .3s ease-in-out;pointer-events:none}.bao-message-bar{display:flex;align-items:flex-start;padding:1rem;width:100%;position:relative;border-left-width:4px;justify-content:flex-start;gap:12px;padding-left:32px}.bao-message-bar .bao-message-icon{flex-shrink:0;width:1.5rem;height:1.5rem}.bao-message-bar .bao-message-icon svg{fill:#fff;width:100%;height:100%}@media (max-width: 768px){.bao-message-bar{padding-left:16px}}.bao-message-bar .bao-message-content{display:inline;word-break:break-word;white-space:normal;max-width:calc(100% - 5rem);margin-right:1rem;justify-content:space-between}.bao-message-bar .bao-message-content>*{display:inline}.bao-message-bar a,.bao-message-bar bao-hyperlink{text-decoration:none;font-weight:700;border-bottom:1px solid currentColor;white-space:nowrap;display:inline-block;flex-shrink:0;outline:none;padding:2px}.bao-message-bar .bao-message-close{background:rgba(255,255,255,.0001);border:none;cursor:pointer;font-size:1.5rem;color:#fff;display:flex;align-items:center;justify-content:center;flex-shrink:0;position:absolute;right:1rem;top:1rem}.bao-message-bar .bao-message-close:hover,.bao-message-bar .bao-message-close:focus{opacity:.75}.bao-message-bar-info{background-color:#0079c4;border-left:4px solid #0079c4;color:#fff}.bao-message-bar-info a,.bao-message-bar-info bao-hyperlink{color:#fff;margin:3px}.bao-message-bar-info a:hover,.bao-message-bar-info bao-hyperlink:hover{background-color:#005a91}.bao-message-bar-info a:focus,.bao-message-bar-info bao-hyperlink:focus{outline:3px solid #ffb833;outline-offset:3px;background-color:#ffffff1a;box-shadow:0 0 0 3px #000}.bao-message-bar-info .bao-message-icon svg{fill:#fff}.bao-message-bar-info .bao-message-close{color:#fff;background-color:#fff0;border-radius:0rem;height:2.5rem;width:2.5rem;margin-left:auto;margin-right:-.5rem;margin-top:-.5rem}.bao-message-bar-info .bao-message-close:hover{opacity:.8}.bao-message-bar-info .bao-message-close:focus{outline:3px solid #ffb833;outline-offset:3px;background-color:#ffffff1a;box-shadow:0 0 0 3px #000;border-radius:4px}.bao-message-bar-alert{background-color:#ffb833;border-left:4px solid #ffb833;color:#212529}.bao-message-bar-alert a,.bao-message-bar-alert bao-hyperlink{color:#212529;margin:3px}.bao-message-bar-alert a:hover,.bao-message-bar-alert bao-hyperlink:hover{background-color:#ffca66}.bao-message-bar-alert a:focus,.bao-message-bar-alert bao-hyperlink:focus{outline:3px solid #0079c4;outline-offset:3px;background-color:#2125291a;box-shadow:0 0 0 3px #fff}.bao-message-bar-alert .bao-message-icon svg{fill:#212529}.bao-message-bar-alert .bao-message-close{color:#212529;background-color:#fff0;border-radius:0rem;height:2.5rem;width:2.5rem;margin-left:auto;margin-right:-.5rem;margin-top:-.5rem}.bao-message-bar-alert .bao-message-close:hover{opacity:.8}.bao-message-bar-alert .bao-message-close:focus{outline:3px solid #0079c4;outline-offset:3px;background-color:#2125291a;box-shadow:0 0 0 3px #fff;border-radius:2px}.bao-message-bar-urgent{background-color:#d3310a;border-left:4px solid #d3310a;color:#fff}.bao-message-bar-urgent a,.bao-message-bar-urgent bao-hyperlink{color:#fff;margin:3px}.bao-message-bar-urgent a:hover,.bao-message-bar-urgent bao-hyperlink:hover{background-color:#a22608}.bao-message-bar-urgent a:focus,.bao-message-bar-urgent bao-hyperlink:focus{outline:3px solid #ffb833;outline-offset:3px;background-color:#ffffff1a;box-shadow:0 0 0 3px #000}.bao-message-bar-urgent .bao-message-icon svg{fill:#fff}.bao-message-bar-urgent .bao-message-close{color:#fff;background-color:#fff0;border-radius:0rem;height:2.5rem;width:2.5rem;margin-left:auto;margin-right:-.5rem;margin-top:-.5rem}.bao-message-bar-urgent .bao-message-close:hover{opacity:.8}.bao-message-bar-urgent .bao-message-close:focus{outline:3px solid #ffb833;outline-offset:3px;background-color:#ffffff1a;box-shadow:0 0 0 3px #000;border-radius:4px}.bao-message-bar-neutral{background-color:#212529;border-left:4px solid #212529;color:#fff}.bao-message-bar-neutral a,.bao-message-bar-neutral bao-hyperlink{color:#fff;margin:3px}.bao-message-bar-neutral a:hover,.bao-message-bar-neutral bao-hyperlink:hover{background-color:#637381}.bao-message-bar-neutral a:focus,.bao-message-bar-neutral bao-hyperlink:focus{outline:3px solid #ffb833;outline-offset:3px;background-color:#ffffff1a;box-shadow:0 0 0 3px #000}.bao-message-bar-neutral .bao-message-icon svg{fill:#fff}.bao-message-bar-neutral .bao-message-close{color:#fff;background-color:#fff0;border-radius:0rem;height:2.5rem;width:2.5rem;margin-left:auto;margin-right:-.5rem;margin-top:-.5rem}.bao-message-bar-neutral .bao-message-close:hover{opacity:.8}.bao-message-bar-neutral .bao-message-close:focus{outline:3px solid #ffb833;outline-offset:3px;background-color:#ffffff1a;box-shadow:0 0 0 3px #000;border-radius:4px}\n"], dependencies: [{ kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: BaoIconComponent, selector: "bao-icon", inputs: ["color", "size", "svgIcon", "title"], exportAs: ["baoIcon"] }], encapsulation: i0.ViewEncapsulation.None }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.6", ngImport: i0, type: BaoMessageBarComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'bao-message-bar', encapsulation: ViewEncapsulation.None, host: {
+                        class: 'bao-message-bar message-bar-dismissible bao-fade-in',
+                        '[class.bao-message-bar-info]': 'type === "info"',
+                        '[class.bao-message-bar-alert]': 'type === "alert"',
+                        '[class.bao-message-bar-urgent]': 'type === "urgent"',
+                        '[class.bao-message-bar-neutral]': 'type === "neutral"'
+                    }, template: "<bao-icon [svgIcon]=\"iconType\" [title]=\"iconTitle\"></bao-icon>\n\n<div class=\"bao-message-content\">\n  <ng-content></ng-content>\n</div>\n\n<button\n  *ngIf=\"dismissible\"\n  class=\"bao-message-close\"\n  type=\"button\"\n  data-dismiss=\"message\"\n  role=\"button\"\n  [attr.aria-label]=\"dismissibleButtonAriaLabel\"\n  (click)=\"onDismissClicked()\"\n>\n  <bao-icon svgIcon=\"icon-x\"></bao-icon>\n</button>\n", styles: ["@keyframes bao-fade-in{0%{opacity:0}to{opacity:1}}@keyframes bao-fade-out{0%{opacity:1}to{opacity:0}}.bao-fade-in{animation:bao-fade-in .3s ease-in-out}.bao-fade-out{animation:bao-fade-out .3s ease-in-out;pointer-events:none}.bao-message-bar{display:flex;align-items:flex-start;padding:1rem;width:100%;position:relative;border-left-width:4px;justify-content:flex-start;gap:12px;padding-left:32px}.bao-message-bar .bao-message-icon{flex-shrink:0;width:1.5rem;height:1.5rem}.bao-message-bar .bao-message-icon svg{fill:#fff;width:100%;height:100%}@media (max-width: 768px){.bao-message-bar{padding-left:16px}}.bao-message-bar .bao-message-content{display:inline;word-break:break-word;white-space:normal;max-width:calc(100% - 5rem);margin-right:1rem;justify-content:space-between}.bao-message-bar .bao-message-content>*{display:inline}.bao-message-bar a,.bao-message-bar bao-hyperlink{text-decoration:none;font-weight:700;border-bottom:1px solid currentColor;white-space:nowrap;display:inline-block;flex-shrink:0;outline:none;padding:2px}.bao-message-bar .bao-message-close{background:rgba(255,255,255,.0001);border:none;cursor:pointer;font-size:1.5rem;color:#fff;display:flex;align-items:center;justify-content:center;flex-shrink:0;position:absolute;right:1rem;top:1rem}.bao-message-bar .bao-message-close:hover,.bao-message-bar .bao-message-close:focus{opacity:.75}.bao-message-bar-info{background-color:#0079c4;border-left:4px solid #0079c4;color:#fff}.bao-message-bar-info a,.bao-message-bar-info bao-hyperlink{color:#fff;margin:3px}.bao-message-bar-info a:hover,.bao-message-bar-info bao-hyperlink:hover{background-color:#005a91}.bao-message-bar-info a:focus,.bao-message-bar-info bao-hyperlink:focus{outline:3px solid #ffb833;outline-offset:3px;background-color:#ffffff1a;box-shadow:0 0 0 3px #000}.bao-message-bar-info .bao-message-icon svg{fill:#fff}.bao-message-bar-info .bao-message-close{color:#fff;background-color:#fff0;border-radius:0rem;height:2.5rem;width:2.5rem;margin-left:auto;margin-right:-.5rem;margin-top:-.5rem}.bao-message-bar-info .bao-message-close:hover{opacity:.8}.bao-message-bar-info .bao-message-close:focus{outline:3px solid #ffb833;outline-offset:3px;background-color:#ffffff1a;box-shadow:0 0 0 3px #000;border-radius:4px}.bao-message-bar-alert{background-color:#ffb833;border-left:4px solid #ffb833;color:#212529}.bao-message-bar-alert a,.bao-message-bar-alert bao-hyperlink{color:#212529;margin:3px}.bao-message-bar-alert a:hover,.bao-message-bar-alert bao-hyperlink:hover{background-color:#ffca66}.bao-message-bar-alert a:focus,.bao-message-bar-alert bao-hyperlink:focus{outline:3px solid #0079c4;outline-offset:3px;background-color:#2125291a;box-shadow:0 0 0 3px #fff}.bao-message-bar-alert .bao-message-icon svg{fill:#212529}.bao-message-bar-alert .bao-message-close{color:#212529;background-color:#fff0;border-radius:0rem;height:2.5rem;width:2.5rem;margin-left:auto;margin-right:-.5rem;margin-top:-.5rem}.bao-message-bar-alert .bao-message-close:hover{opacity:.8}.bao-message-bar-alert .bao-message-close:focus{outline:3px solid #0079c4;outline-offset:3px;background-color:#2125291a;box-shadow:0 0 0 3px #fff;border-radius:2px}.bao-message-bar-urgent{background-color:#d3310a;border-left:4px solid #d3310a;color:#fff}.bao-message-bar-urgent a,.bao-message-bar-urgent bao-hyperlink{color:#fff;margin:3px}.bao-message-bar-urgent a:hover,.bao-message-bar-urgent bao-hyperlink:hover{background-color:#a22608}.bao-message-bar-urgent a:focus,.bao-message-bar-urgent bao-hyperlink:focus{outline:3px solid #ffb833;outline-offset:3px;background-color:#ffffff1a;box-shadow:0 0 0 3px #000}.bao-message-bar-urgent .bao-message-icon svg{fill:#fff}.bao-message-bar-urgent .bao-message-close{color:#fff;background-color:#fff0;border-radius:0rem;height:2.5rem;width:2.5rem;margin-left:auto;margin-right:-.5rem;margin-top:-.5rem}.bao-message-bar-urgent .bao-message-close:hover{opacity:.8}.bao-message-bar-urgent .bao-message-close:focus{outline:3px solid #ffb833;outline-offset:3px;background-color:#ffffff1a;box-shadow:0 0 0 3px #000;border-radius:4px}.bao-message-bar-neutral{background-color:#212529;border-left:4px solid #212529;color:#fff}.bao-message-bar-neutral a,.bao-message-bar-neutral bao-hyperlink{color:#fff;margin:3px}.bao-message-bar-neutral a:hover,.bao-message-bar-neutral bao-hyperlink:hover{background-color:#637381}.bao-message-bar-neutral a:focus,.bao-message-bar-neutral bao-hyperlink:focus{outline:3px solid #ffb833;outline-offset:3px;background-color:#ffffff1a;box-shadow:0 0 0 3px #000}.bao-message-bar-neutral .bao-message-icon svg{fill:#fff}.bao-message-bar-neutral .bao-message-close{color:#fff;background-color:#fff0;border-radius:0rem;height:2.5rem;width:2.5rem;margin-left:auto;margin-right:-.5rem;margin-top:-.5rem}.bao-message-bar-neutral .bao-message-close:hover{opacity:.8}.bao-message-bar-neutral .bao-message-close:focus{outline:3px solid #ffb833;outline-offset:3px;background-color:#ffffff1a;box-shadow:0 0 0 3px #000;border-radius:4px}\n"] }]
+        }], ctorParameters: function () { return [{ type: i0.ElementRef }]; }, propDecorators: { type: [{
+                type: Input
+            }], dismissible: [{
+                type: Input
+            }], dismissibleButtonAriaLabel: [{
+                type: Input
+            }], dismiss: [{
+                type: Output
+            }] } });
+
+/*
+ * Copyright (c) 2025 Ville de Montreal. All rights reserved.
+ * Licensed under the MIT license.
+ * See LICENSE file in the project root for full license information.
+ */
+class BaoMessageBarModule {
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.6", ngImport: i0, type: BaoMessageBarModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "16.2.6", ngImport: i0, type: BaoMessageBarModule, declarations: [BaoMessageBarComponent, BaoMessageBarContent], imports: [CommonModule, BaoIconModule, BaoButtonModule, BaoHyperlinkModule], exports: [BaoMessageBarComponent, BaoMessageBarContent] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "16.2.6", ngImport: i0, type: BaoMessageBarModule, imports: [CommonModule, BaoIconModule, BaoButtonModule, BaoHyperlinkModule] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.6", ngImport: i0, type: BaoMessageBarModule, decorators: [{
+            type: NgModule,
+            args: [{
+                    imports: [CommonModule, BaoIconModule, BaoButtonModule, BaoHyperlinkModule],
+                    declarations: [BaoMessageBarComponent, BaoMessageBarContent],
+                    exports: [BaoMessageBarComponent, BaoMessageBarContent]
+                }]
+        }] });
+
+/*
+ * Copyright (c) 2025 Ville de Montreal. All rights reserved.
+ * Licensed under the MIT license.
+ * See LICENSE file in the project root for full license information.
+ */
+
 /*
  * Copyright (c) 2025 Ville de Montreal. All rights reserved.
  * Licensed under the MIT license.
@@ -6151,5 +6269,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.6", 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, 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 };
+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, BaoMessageBarComponent, BaoMessageBarContent, BaoMessageBarModule, 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