@villedemontreal/angular-ui 13.0.0 → 13.2.1

package/fesm2015/villedemontreal-angular-ui.mjs

@@ -1,5 +1,5 @@
 import * as i0 from '@angular/core';
-import { SecurityContext, Injectable, Inject, Component, ViewEncapsulation, ChangeDetectionStrategy, Input, NgModule, Directive, EventEmitter, Output, CUSTOM_ELEMENTS_SCHEMA, ViewChild, forwardRef, InjectionToken, ContentChildren, Optional, HostListener, ContentChild, Injector, TemplateRef, SkipSelf } from '@angular/core';
+import { SecurityContext, Injectable, Inject, Component, ViewEncapsulation, ChangeDetectionStrategy, Input, NgModule, Directive, EventEmitter, Output, CUSTOM_ELEMENTS_SCHEMA, ViewChild, forwardRef, InjectionToken, ContentChildren, Optional, HostListener, ContentChild, Injector, TemplateRef, SkipSelf, ViewChildren } from '@angular/core';
 import * as i1$1 from '@angular/common';
 import { DOCUMENT, CommonModule } from '@angular/common';
 import * as i1 from '@angular/platform-browser';
@@ -13,12 +13,10 @@ import * as i1$4 from '@angular/cdk/overlay';
 import { OverlayConfig, OverlayModule } from '@angular/cdk/overlay';
 import * as i3 from '@angular/cdk/portal';
 import { BasePortalOutlet, CdkPortalOutlet, ComponentPortal, TemplatePortal, PortalModule, DomPortal } from '@angular/cdk/portal';
-import { Subject, filter, take, defer, startWith, Subscription } from 'rxjs';
+import { Subject, filter, take, defer, startWith } from 'rxjs';
 import { __awaiter } from 'tslib';
 import { _getFocusedElementPierceShadowDom } from '@angular/cdk/platform';
-import { trigger, state, style, transition, group, animate, query, animateChild } from '@angular/animations';
 import { ESCAPE, hasModifierKey } from '@angular/cdk/keycodes';
-import { ANIMATION_MODULE_TYPE, BrowserAnimationsModule, NoopAnimationsModule } from '@angular/platform-browser/animations';
 
 function baoColorToHex(baoColor) {
     switch (baoColor) {
@@ -46,7 +44,7 @@ function baoColorToHex(baoColor) {
 }
 
 /*
- * Copyright (c) 2022 Ville de Montreal. All rights reserved.
+ * 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.
  */
@@ -63,6 +61,7 @@ const ICONS_DCT = {
     'icon-book': "<path fill-rule='evenodd' d='M11 7.5l-.4-.3A11 11 0 005 5.046v10.993a13 13 0 016 2.007V7.5zm2 0v10.546a13 13 0 016-2.007V5.046A11 11 0 0013.4 7.2l-.4.3zM3 7V4a1 1 0 011-1 13 13 0 017.8 2.6l.2.15.2-.15A13 13 0 0120 3a1 1 0 011 1v3h2a1 1 0 011 1v2a1 1 0 01-2 0V9h-1v8a1 1 0 01-1 1 11 11 0 00-4.583 1H22v-5a1 1 0 012 0v6a1 1 0 01-1 1H1a1 1 0 01-1-1V8a1 1 0 011-1h2zm0 2H2v10h6.583A11 11 0 004 18a1 1 0 01-1-1V9z'/>",
     'icon-briefcase': "<path fill-rule='evenodd' clip-rule='evenodd' d='M14 2h-4a3 3 0 00-3 3v1H4a3 3 0 00-3 3v2.977a1 1 0 000 .046V19a3 3 0 003 3h16a3 3 0 003-3v-3a1 1 0 10-2 0v3a1 1 0 01-1 1H4a1 1 0 01-1-1v-5.523l8.629 3.451a1 1 0 00.742 0l9.979-3.99a1.002 1.002 0 00.65-.961V9a3 3 0 00-3-3h-3V5a3 3 0 00-3-3zm7 9.323V9a1 1 0 00-1-1H4a1 1 0 00-1 1v2.323l9 3.6 9-3.6zM15 6H9V5a1 1 0 011-1h4a1 1 0 011 1v1z'/>",
     'icon-calendar': "<path fill-rule='evenodd' d='M20 10H4v9a1 1 0 001 1h14a1 1 0 001-1v-2a1 1 0 012 0v2a3 3 0 01-3 3H5a3 3 0 01-3-3V5a3 3 0 013-3h2V1a1 1 0 112 0v1h6V1a1 1 0 012 0v1h2a3 3 0 013 3v8a1 1 0 01-2 0v-3zm0-2V5a1 1 0 00-1-1h-2v1a1 1 0 01-2 0V4H9v1a1 1 0 11-2 0V4H5a1 1 0 00-1 1v3h16z'/>",
+    'icon-cell-phone': "<path fill-rule='evenodd' clip-rule='evenodd' d='M4 4C4 2.34315 5.34315 1 7 1H17C18.6569 1 20 2.34315 20 4V20C20 21.6569 18.6569 23 17 23H7C5.34315 23 4 21.6569 4 20V4ZM6 4C6 3.44772 6.44772 3 7 3H17C17.5523 3 18 3.44772 18 4V20C18 20.5523 17.5523 21 17 21H7C6.44771 21 6 20.5523 6 20V4ZM12 19C12.5523 19 13 18.5523 13 18C13 17.4477 12.5523 17 12 17C11.4477 17 11 17.4477 11 18C11 18.5523 11.4477 19 12 19Z' />",
     'icon-check-circle-full': "<path fill-rule='evenodd' d='M12 23C5.925 23 1 18.075 1 12S5.925 1 12 1s11 4.925 11 11-4.925 11-11 11zm3.293-13.707L11 13.586l-1.293-1.293a1 1 0 10-1.414 1.414l2 2a1 1 0 001.414 0l5-5a1 1 0 10-1.414-1.414z'/>",
     'icon-check-circle': "<path fill-rule='evenodd' d='M21.542 17.477a1 1 0 01-1.734-.997A8.953 8.953 0 0021 12a9 9 0 10-9 9 8.953 8.953 0 004.484-1.195 1 1 0 01.998 1.733A10.953 10.953 0 0112 23C5.925 23 1 18.075 1 12S5.925 1 12 1s11 4.925 11 11c0 1.948-.508 3.824-1.458 5.477zm-6.25-8.184a1 1 0 011.415 1.414l-5 5a1 1 0 01-1.414 0l-2-2a1 1 0 011.414-1.414L11 13.586l4.293-4.293z'/>",
     'icon-check': "<path fill-rule='evenodd' d='M19.293 6.293a1 1 0 011.414 1.414l-7.947 7.948a1 1 0 01-1.415-1.415l7.948-7.947zm-9.586 11a1 1 0 11-1.414 1.414l-5-5a1 1 0 011.414-1.414l5 5z'/>",
@@ -170,7 +169,7 @@ const ICONS_DCT = {
 };
 
 /*
- * Copyright (c) 2022 Ville de Montreal. All rights reserved.
+ * 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.
  */
@@ -211,7 +210,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImpo
     } });
 
 /*
- * Copyright (c) 2022 Ville de Montreal. All rights reserved.
+ * 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.
  */
@@ -363,7 +362,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImpo
             }] } });
 
 /*
- * Copyright (c) 2022 Ville de Montreal. All rights reserved.
+ * 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.
  */
@@ -383,7 +382,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImpo
         }] });
 
 /*
- * Copyright (c) 2022 Ville de Montreal. All rights reserved.
+ * 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.
  */
@@ -479,7 +478,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImpo
             }] } });
 
 /*
- * Copyright (c) 2022 Ville de Montreal. All rights reserved.
+ * 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.
  */
@@ -499,7 +498,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImpo
         }] });
 
 /*
- * Copyright (c) 2022 Ville de Montreal. All rights reserved.
+ * 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.
  */
@@ -656,7 +655,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImpo
             }] } });
 
 /*
- * Copyright (c) 2022 Ville de Montreal. All rights reserved.
+ * 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.
  */
@@ -691,13 +690,13 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImpo
         }] });
 
 /*
- * Copyright (c) 2022 Ville de Montreal. All rights reserved.
+ * 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) 2022 Ville de Montreal. All rights reserved.
+ * 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.
  */
@@ -730,7 +729,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImpo
             }] } });
 
 /*
- * Copyright (c) 2022 Ville de Montreal. All rights reserved.
+ * 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.
  */
@@ -750,19 +749,19 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImpo
         }] });
 
 /*
- * Copyright (c) 2022 Ville de Montreal. All rights reserved.
+ * 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) 2022 Ville de Montreal. All rights reserved.
+ * 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) 2022 Ville de Montreal. All rights reserved.
+ * 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.
  */
@@ -854,7 +853,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImpo
         }] });
 
 /*
- * Copyright (c) 2022 Ville de Montreal. All rights reserved.
+ * 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.
  */
@@ -888,13 +887,13 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImpo
         }] });
 
 /*
- * Copyright (c) 2022 Ville de Montreal. All rights reserved.
+ * 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) 2022 Ville de Montreal. All rights reserved.
+ * 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.
  */
@@ -908,7 +907,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImpo
         }] });
 
 /*
- * Copyright (c) 2022 Ville de Montreal. All rights reserved.
+ * 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.
  */
@@ -922,7 +921,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImpo
         }] });
 
 /*
- * Copyright (c) 2022 Ville de Montreal. All rights reserved.
+ * 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.
  */
@@ -932,16 +931,16 @@ class BaoLabelTextComponent {
     }
 }
 BaoLabelTextComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: BaoLabelTextComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-BaoLabelTextComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.12", type: BaoLabelTextComponent, selector: "bao-label, [bao-label]", inputs: { required: "required" }, host: { classAttribute: "bao-label" }, ngImport: i0, template: '<div class="bao-label"><ng-content></ng-content><span *ngIf="required">&nbsp;*</span></div>', isInline: true, styles: [".bao-label{color:#212529!important;font-weight:700;line-height:1.5em;font-size:1rem;margin-bottom:0}.bao-label span{color:#d3310a}\n"], directives: [{ type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], encapsulation: i0.ViewEncapsulation.None });
+BaoLabelTextComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.12", type: BaoLabelTextComponent, selector: "bao-label, [bao-label]", inputs: { required: "required" }, host: { classAttribute: "bao-label" }, ngImport: i0, template: '<ng-content></ng-content><span *ngIf="required">&nbsp;*</span>', isInline: true, styles: [".bao-label{color:#212529!important;font-weight:700;line-height:1.5em;font-size:1rem;margin-bottom:.5rem}.bao-label span{color:#d3310a;margin:0}\n"], directives: [{ type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], encapsulation: i0.ViewEncapsulation.None });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: BaoLabelTextComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'bao-label, [bao-label]', encapsulation: ViewEncapsulation.None, template: '<div class="bao-label"><ng-content></ng-content><span *ngIf="required">&nbsp;*</span></div>', host: { class: 'bao-label' }, styles: [".bao-label{color:#212529!important;font-weight:700;line-height:1.5em;font-size:1rem;margin-bottom:0}.bao-label span{color:#d3310a}\n"] }]
+            args: [{ selector: 'bao-label, [bao-label]', encapsulation: ViewEncapsulation.None, template: '<ng-content></ng-content><span *ngIf="required">&nbsp;*</span>', host: { class: 'bao-label' }, styles: [".bao-label{color:#212529!important;font-weight:700;line-height:1.5em;font-size:1rem;margin-bottom:.5rem}.bao-label span{color:#d3310a;margin:0}\n"] }]
         }], propDecorators: { required: [{
                 type: Input
             }] } });
 
 /*
- * Copyright (c) 2022 Ville de Montreal. All rights reserved.
+ * 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.
  */
@@ -955,13 +954,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImpo
         }] });
 
 /*
- * Copyright (c) 2022 Ville de Montreal. All rights reserved.
- * Licensed under the MIT license.
- * See LICENSE file in the project root for full license information.
- */
-
-/*
- * Copyright (c) 2022 Ville de Montreal. All rights reserved.
+ * 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.
  */
@@ -992,7 +985,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImpo
         }] });
 
 /*
- * Copyright (c) 2022 Ville de Montreal. All rights reserved.
+ * 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.
  */
@@ -1347,7 +1340,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImpo
         }] });
 
 /*
- * Copyright (c) 2022 Ville de Montreal. All rights reserved.
+ * 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.
  */
@@ -1375,13 +1368,19 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImpo
         }] });
 
 /*
- * Copyright (c) 2022 Ville de Montreal. All rights reserved.
+ * 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.
  * See LICENSE file in the project root for full license information.
  */
 
 /*
- * Copyright (c) 2022 Ville de Montreal. All rights reserved.
+ * 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.
  */
@@ -1482,7 +1481,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImpo
         }] });
 
 /*
- * Copyright (c) 2022 Ville de Montreal. All rights reserved.
+ * 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.
  */
@@ -1519,19 +1518,19 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImpo
         }] });
 
 /*
- * Copyright (c) 2022 Ville de Montreal. All rights reserved.
+ * 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) 2022 Ville de Montreal. All rights reserved.
+ * 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) 2022 Ville de Montreal. All rights reserved.
+ * 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.
  */
@@ -1602,7 +1601,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImpo
         }] });
 
 /*
- * Copyright (c) 2022 Ville de Montreal. All rights reserved.
+ * 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.
  */
@@ -1636,13 +1635,13 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImpo
         }] });
 
 /*
- * Copyright (c) 2022 Ville de Montreal. All rights reserved.
+ * 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) 2022 Ville de Montreal. All rights reserved.
+ * 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.
  */
@@ -2170,7 +2169,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImpo
         }] });
 
 /*
- * Copyright (c) 2022 Ville de Montreal. All rights reserved.
+ * 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.
  */
@@ -2217,13 +2216,13 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImpo
         }] });
 
 /*
- * Copyright (c) 2022 Ville de Montreal. All rights reserved.
+ * 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) 2022 Ville de Montreal. All rights reserved.
+ * 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.
  */
@@ -2296,7 +2295,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImpo
             }] } });
 
 /*
- * Copyright (c) 2022 Ville de Montreal. All rights reserved.
+ * 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.
  */
@@ -2316,13 +2315,13 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImpo
         }] });
 
 /*
- * Copyright (c) 2022 Ville de Montreal. All rights reserved.
+ * 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) 2022 Ville de Montreal. All rights reserved.
+ * 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.
  */
@@ -2413,7 +2412,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImpo
         }] });
 
 /*
- * Copyright (c) 2022 Ville de Montreal. All rights reserved.
+ * 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.
  */
@@ -2448,7 +2447,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImpo
         }] });
 
 /*
- * Copyright (c) 2022 Ville de Montreal. All rights reserved.
+ * 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.
  */
@@ -2479,13 +2478,13 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImpo
         }] });
 
 /*
- * Copyright (c) 2022 Ville de Montreal. All rights reserved.
+ * 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) 2022 Ville de Montreal. All rights reserved.
+ * 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.
  */
@@ -2585,7 +2584,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImpo
             }] } });
 
 /*
- * Copyright (c) 2022 Ville de Montreal. All rights reserved.
+ * 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.
  */
@@ -2605,13 +2604,13 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImpo
         }] });
 
 /*
- * Copyright (c) 2022 Ville de Montreal. All rights reserved.
+ * 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) 2022 Ville de Montreal. All rights reserved.
+ * 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.
  */
@@ -2904,7 +2903,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImpo
             }] } });
 
 /*
- * Copyright (c) 2022 Ville de Montreal. All rights reserved.
+ * 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.
  */
@@ -2935,41 +2934,13 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImpo
         }] });
 
 /*
- * Copyright (c) 2022 Ville de Montreal. All rights reserved.
+ * 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) 2022 Ville de Montreal. All rights reserved.
- * Licensed under the MIT license.
- * See LICENSE file in the project root for full license information.
- */
-/**
- * Animations used by MatDialog.
- * @docs-private
- */
-const baoModalAnimations = {
-    /** Animation that is applied on the modal container by default. */
-    modalContainer: trigger('modalContainer', [
-        // Note: The `enter` animation transitions to `transform: none`, because for some reason
-        // specifying the transform explicitly, causes IE both to blur the modal content and
-        // decimate the animation performance. Leaving it as `none` solves both issues.
-        state('void, exit', style({ opacity: 0, transform: 'scale(0.7)' })),
-        state('enter', style({ transform: 'none' })),
-        transition('* => enter', group([
-            animate('150ms cubic-bezier(0, 0, 0.2, 1)', style({ transform: 'none', opacity: 1 })),
-            query('@*', animateChild(), { optional: true })
-        ])),
-        transition('* => void, * => exit', group([
-            animate('75ms cubic-bezier(0.4, 0.0, 0.2, 1)', style({ opacity: 0 })),
-            query('@*', animateChild(), { optional: true })
-        ]))
-    ])
-};
-
-/*
- * Copyright (c) 2022 Ville de Montreal. All rights reserved.
+ * 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.
  */
@@ -3237,41 +3208,29 @@ class BaoModalContainer extends _BaoModalContainerBase {
         /** State of the modal animation. */
         this._state = 'enter';
     }
-    /** Callback, invoked whenever an animation on the host completes. */
-    _onAnimationDone({ toState, totalTime }) {
-        return __awaiter(this, void 0, void 0, function* () {
-            if (toState === 'enter') {
-                yield this._trapFocus();
-                this._animationStateChanged.next({ state: 'opened', totalTime });
-            }
-            else if (toState === 'exit') {
-                this._restoreFocus();
-                this._animationStateChanged.next({ state: 'closed', totalTime });
-            }
-        });
-    }
-    /** Callback, invoked when an animation on the host starts. */
-    _onAnimationStart({ toState, totalTime }) {
-        if (toState === 'enter') {
-            this._animationStateChanged.next({ state: 'opening', totalTime });
-        }
-        else if (toState === 'exit' || toState === 'void') {
-            this._animationStateChanged.next({ state: 'closing', totalTime });
-        }
+    _startOpenAnimation() {
+        this._animationStateChanged.emit({ state: 'opening', totalTime: 20 });
+        void Promise.resolve().then(() => this._finishDialogOpen());
     }
     /** Starts the modal exit animation. */
     _startExitAnimation() {
-        this._state = 'exit';
-        // Mark the container for check so it can react if the
-        // view container is using OnPush change detection.
-        this._changeDetectorRef.markForCheck();
+        this._animationStateChanged.emit({ state: 'closed', totalTime: 20 });
+    }
+    _finishDialogOpen() {
+        this._openAnimationDone(20);
+    }
+    _openAnimationDone(totalTime) {
+        if (this._config.delayFocusTrap) {
+            void this._trapFocus();
+        }
+        this._animationStateChanged.next({ state: 'opened', totalTime });
     }
 }
 BaoModalContainer.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: BaoModalContainer, deps: null, target: i0.ɵɵFactoryTarget.Component });
-BaoModalContainer.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.12", type: BaoModalContainer, selector: "bao-modal-container", host: { attributes: { "tabindex": "-1", "aria-modal": "true" }, listeners: { "@modalContainer.start": "_onAnimationStart($event)", "@modalContainer.done": "_onAnimationDone($event)" }, properties: { "id": "_id", "attr.role": "_config.role", "attr.aria-labelledby": "_config.ariaLabel ? null : _ariaLabelledBy", "attr.aria-label": "_config.ariaLabel", "attr.aria-describedby": "_config.ariaDescribedBy || null", "@modalContainer": "_state" }, classAttribute: "bao-modal-container" }, usesInheritance: true, ngImport: i0, template: "<ng-template cdkPortalOutlet></ng-template>\n", styles: [".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%}}.cdk-overlay-container,.cdk-global-overlay-wrapper{pointer-events:none;top:0;left:0;height:100%;width:100%}.cdk-overlay-container{position:fixed;z-index:1000}.cdk-overlay-container:empty{display:none}.cdk-global-overlay-wrapper{display:flex;position:absolute;z-index:1000}.cdk-overlay-pane{position:absolute;pointer-events:auto;box-sizing:border-box;z-index:1000;display:flex}.cdk-overlay-pane.bao-modal-mobil-full{width:100%;height:100%}.cdk-overlay-pane.bao-modal-mobil-compact{width:300px;height:100%}@media (min-width: 768px){.cdk-overlay-pane{width:500px;height:auto}.cdk-overlay-pane.bao-modal-lg{width:calc(100% - 4rem);height:calc(100% - 4rem)}.cdk-overlay-pane.bao-modal-md,.cdk-overlay-pane.bao-modal-sm{width:500px;height:auto}}@media (min-width: 992px){.cdk-overlay-pane{width:500px;height:auto}.cdk-overlay-pane.bao-modal-lg{width:calc(100% - 4rem);height:calc(100% - 4rem)}.cdk-overlay-pane.bao-modal-md{width:800px;height:auto}.cdk-overlay-pane.bao-modal-sm{width:500px;height:auto}}.cdk-overlay-backdrop{position:absolute;inset:0;z-index:1000;pointer-events:auto;-webkit-tap-highlight-color:transparent;transition:opacity .4s cubic-bezier(.25,.8,.25,1);opacity:0}.cdk-overlay-backdrop.cdk-overlay-backdrop-showing{opacity:.5}.cdk-high-contrast-active .cdk-overlay-backdrop.cdk-overlay-backdrop-showing{opacity:.6}.cdk-overlay-dark-backdrop{background:black}.cdk-overlay-transparent-backdrop,.cdk-overlay-transparent-backdrop.cdk-overlay-backdrop-showing{opacity:.5}.cdk-overlay-connected-position-bounding-box{position:absolute;z-index:1000;display:flex;flex-direction:column;min-width:1px;min-height:1px}.cdk-global-scrollblock{position:fixed;width:100%;overflow-y:scroll}.bao-modal-container{display:block;overflow:auto;width:100%;height:100%;min-height:inherit;max-height:inherit;background-color:#fff;background-clip:padding-box;border:0 solid rgba(0,0,0,.2);border-radius:.5rem;outline:0}.bao-modal-content{display:flex;flex-direction:column;height:100%}.bao-modal-header{flex:0 0 auto;display:flex;align-items:flex-start;justify-content:space-between;border-bottom:1px solid #ced4da;border-top-left-radius:.5rem;border-top-right-radius:.5rem}.bao-modal-header .bao-modal-title{font-size:1rem;line-height:1.5rem;margin:1rem 0 1rem 1rem}.bao-modal-header button{margin:.5rem}.bao-modal-body{display:block;padding:1rem;overflow:auto;flex-grow:1}@media (min-width: 768px){.bao-modal-body{padding:2rem}}.bao-modal-footer{display:flex;flex-wrap:wrap;padding:1rem;border-top:1px solid #ced4da;border-bottom-right-radius:.5rem;border-bottom-left-radius:.5rem}.bao-modal-footer.bao-modal-footer-order{justify-content:unset;flex-direction:column-reverse}.bao-modal-footer button{text-align:center}.bao-modal-footer .bao-button-primary,.bao-modal-footer .bao-button-secondary{width:100%;display:block}.bao-modal-footer .bao-button-secondary{margin-bottom:.5rem}.bao-modal-footer .bao-button-tertiary{display:none}@media (min-width: 768px){.bao-modal-footer{justify-content:flex-end}.bao-modal-footer.bao-modal-footer-order{flex-direction:row-reverse}.bao-modal-footer .bao-button-primary{margin-left:1rem}.bao-modal-footer .bao-button-secondary{margin-bottom:0}.bao-modal-footer .bao-button-primary,.bao-modal-footer .bao-button-secondary{width:auto}.bao-modal-footer .bao-button-tertiary{display:block}}\n"], directives: [{ type: i3.CdkPortalOutlet, selector: "[cdkPortalOutlet]", inputs: ["cdkPortalOutlet"], outputs: ["attached"], exportAs: ["cdkPortalOutlet"] }], animations: [baoModalAnimations.modalContainer], changeDetection: i0.ChangeDetectionStrategy.Default, encapsulation: i0.ViewEncapsulation.None });
+BaoModalContainer.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.12", type: BaoModalContainer, selector: "bao-modal-container", host: { attributes: { "tabindex": "-1", "aria-modal": "true" }, properties: { "id": "_id", "attr.role": "_config.role", "attr.aria-labelledby": "_config.ariaLabel ? null : _ariaLabelledBy", "attr.aria-label": "_config.ariaLabel", "attr.aria-describedby": "_config.ariaDescribedBy || null" }, classAttribute: "bao-modal-container" }, usesInheritance: true, ngImport: i0, template: "<ng-template cdkPortalOutlet></ng-template>\n", styles: [".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%}}.cdk-overlay-container,.cdk-global-overlay-wrapper{pointer-events:none;top:0;left:0;height:100%;width:100%}.cdk-overlay-container{position:fixed;z-index:1000}.cdk-overlay-container:empty{display:none}.cdk-global-overlay-wrapper{display:flex;position:absolute;z-index:1000}.cdk-overlay-pane{position:absolute;pointer-events:auto;box-sizing:border-box;z-index:1000;display:flex}.cdk-overlay-pane.bao-modal-mobil-full{width:100%;height:100%}.cdk-overlay-pane.bao-modal-mobil-compact{width:300px;height:100%}@media (min-width: 768px){.cdk-overlay-pane{width:500px;height:auto}.cdk-overlay-pane.bao-modal-lg{width:calc(100% - 4rem);height:calc(100% - 4rem)}.cdk-overlay-pane.bao-modal-md,.cdk-overlay-pane.bao-modal-sm{width:500px;height:auto}}@media (min-width: 992px){.cdk-overlay-pane{width:500px;height:auto}.cdk-overlay-pane.bao-modal-lg{width:calc(100% - 4rem);height:calc(100% - 4rem)}.cdk-overlay-pane.bao-modal-md{width:800px;height:auto}.cdk-overlay-pane.bao-modal-sm{width:500px;height:auto}}.cdk-overlay-backdrop{position:absolute;inset:0;z-index:1000;pointer-events:auto;-webkit-tap-highlight-color:transparent;transition:opacity .4s cubic-bezier(.25,.8,.25,1);opacity:0}.cdk-overlay-backdrop.cdk-overlay-backdrop-showing{opacity:.5}.cdk-high-contrast-active .cdk-overlay-backdrop.cdk-overlay-backdrop-showing{opacity:.6}.cdk-overlay-dark-backdrop{background:black}.cdk-overlay-transparent-backdrop,.cdk-overlay-transparent-backdrop.cdk-overlay-backdrop-showing{opacity:.5}.cdk-overlay-connected-position-bounding-box{position:absolute;z-index:1000;display:flex;flex-direction:column;min-width:1px;min-height:1px}.cdk-global-scrollblock{position:fixed;width:100%;overflow-y:scroll}.bao-modal-container{display:block;overflow:auto;width:100%;height:100%;min-height:inherit;max-height:inherit;background-color:#fff;background-clip:padding-box;border:0 solid rgba(0,0,0,.2);border-radius:.5rem;outline:0}.bao-modal-content{display:flex;flex-direction:column;height:100%}.bao-modal-header{flex:0 0 auto;display:flex;align-items:flex-start;justify-content:space-between;border-bottom:1px solid #ced4da;border-top-left-radius:.5rem;border-top-right-radius:.5rem}.bao-modal-header .bao-modal-title{font-size:1rem;line-height:1.5rem;margin:1rem 0 1rem 1rem}.bao-modal-header button{margin:.5rem}.bao-modal-body{display:block;padding:1rem;overflow:auto;flex-grow:1}@media (min-width: 768px){.bao-modal-body{padding:2rem}}.bao-modal-footer{display:flex;flex-wrap:wrap;padding:1rem;border-top:1px solid #ced4da;border-bottom-right-radius:.5rem;border-bottom-left-radius:.5rem}.bao-modal-footer.bao-modal-footer-order{justify-content:unset;flex-direction:column-reverse}.bao-modal-footer button{text-align:center}.bao-modal-footer .bao-button-primary,.bao-modal-footer .bao-button-secondary{width:100%;display:block}.bao-modal-footer .bao-button-secondary{margin-bottom:.5rem}.bao-modal-footer .bao-button-tertiary{display:none}@media (min-width: 768px){.bao-modal-footer{justify-content:flex-end}.bao-modal-footer.bao-modal-footer-order{flex-direction:row-reverse}.bao-modal-footer .bao-button-primary{margin-left:1rem}.bao-modal-footer .bao-button-secondary{margin-bottom:0}.bao-modal-footer .bao-button-primary,.bao-modal-footer .bao-button-secondary{width:auto}.bao-modal-footer .bao-button-tertiary{display:block}}\n"], directives: [{ type: i3.CdkPortalOutlet, selector: "[cdkPortalOutlet]", inputs: ["cdkPortalOutlet"], outputs: ["attached"], exportAs: ["cdkPortalOutlet"] }], changeDetection: i0.ChangeDetectionStrategy.Default, encapsulation: i0.ViewEncapsulation.None });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: BaoModalContainer, decorators: [{
             type: Component,
-            args: [{ selector: 'bao-modal-container', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.Default, animations: [baoModalAnimations.modalContainer], host: {
+            args: [{ selector: 'bao-modal-container', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.Default, host: {
                         class: 'bao-modal-container',
                         tabindex: '-1',
                         'aria-modal': 'true',
@@ -3279,10 +3238,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImpo
                         '[attr.role]': '_config.role',
                         '[attr.aria-labelledby]': '_config.ariaLabel ? null : _ariaLabelledBy',
                         '[attr.aria-label]': '_config.ariaLabel',
-                        '[attr.aria-describedby]': '_config.ariaDescribedBy || null',
-                        '[@modalContainer]': '_state',
-                        '(@modalContainer.start)': '_onAnimationStart($event)',
-                        '(@modalContainer.done)': '_onAnimationDone($event)'
+                        '[attr.aria-describedby]': '_config.ariaDescribedBy || null'
                     }, template: "<ng-template cdkPortalOutlet></ng-template>\n", styles: [".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%}}.cdk-overlay-container,.cdk-global-overlay-wrapper{pointer-events:none;top:0;left:0;height:100%;width:100%}.cdk-overlay-container{position:fixed;z-index:1000}.cdk-overlay-container:empty{display:none}.cdk-global-overlay-wrapper{display:flex;position:absolute;z-index:1000}.cdk-overlay-pane{position:absolute;pointer-events:auto;box-sizing:border-box;z-index:1000;display:flex}.cdk-overlay-pane.bao-modal-mobil-full{width:100%;height:100%}.cdk-overlay-pane.bao-modal-mobil-compact{width:300px;height:100%}@media (min-width: 768px){.cdk-overlay-pane{width:500px;height:auto}.cdk-overlay-pane.bao-modal-lg{width:calc(100% - 4rem);height:calc(100% - 4rem)}.cdk-overlay-pane.bao-modal-md,.cdk-overlay-pane.bao-modal-sm{width:500px;height:auto}}@media (min-width: 992px){.cdk-overlay-pane{width:500px;height:auto}.cdk-overlay-pane.bao-modal-lg{width:calc(100% - 4rem);height:calc(100% - 4rem)}.cdk-overlay-pane.bao-modal-md{width:800px;height:auto}.cdk-overlay-pane.bao-modal-sm{width:500px;height:auto}}.cdk-overlay-backdrop{position:absolute;inset:0;z-index:1000;pointer-events:auto;-webkit-tap-highlight-color:transparent;transition:opacity .4s cubic-bezier(.25,.8,.25,1);opacity:0}.cdk-overlay-backdrop.cdk-overlay-backdrop-showing{opacity:.5}.cdk-high-contrast-active .cdk-overlay-backdrop.cdk-overlay-backdrop-showing{opacity:.6}.cdk-overlay-dark-backdrop{background:black}.cdk-overlay-transparent-backdrop,.cdk-overlay-transparent-backdrop.cdk-overlay-backdrop-showing{opacity:.5}.cdk-overlay-connected-position-bounding-box{position:absolute;z-index:1000;display:flex;flex-direction:column;min-width:1px;min-height:1px}.cdk-global-scrollblock{position:fixed;width:100%;overflow-y:scroll}.bao-modal-container{display:block;overflow:auto;width:100%;height:100%;min-height:inherit;max-height:inherit;background-color:#fff;background-clip:padding-box;border:0 solid rgba(0,0,0,.2);border-radius:.5rem;outline:0}.bao-modal-content{display:flex;flex-direction:column;height:100%}.bao-modal-header{flex:0 0 auto;display:flex;align-items:flex-start;justify-content:space-between;border-bottom:1px solid #ced4da;border-top-left-radius:.5rem;border-top-right-radius:.5rem}.bao-modal-header .bao-modal-title{font-size:1rem;line-height:1.5rem;margin:1rem 0 1rem 1rem}.bao-modal-header button{margin:.5rem}.bao-modal-body{display:block;padding:1rem;overflow:auto;flex-grow:1}@media (min-width: 768px){.bao-modal-body{padding:2rem}}.bao-modal-footer{display:flex;flex-wrap:wrap;padding:1rem;border-top:1px solid #ced4da;border-bottom-right-radius:.5rem;border-bottom-left-radius:.5rem}.bao-modal-footer.bao-modal-footer-order{justify-content:unset;flex-direction:column-reverse}.bao-modal-footer button{text-align:center}.bao-modal-footer .bao-button-primary,.bao-modal-footer .bao-button-secondary{width:100%;display:block}.bao-modal-footer .bao-button-secondary{margin-bottom:.5rem}.bao-modal-footer .bao-button-tertiary{display:none}@media (min-width: 768px){.bao-modal-footer{justify-content:flex-end}.bao-modal-footer.bao-modal-footer-order{flex-direction:row-reverse}.bao-modal-footer .bao-button-primary{margin-left:1rem}.bao-modal-footer .bao-button-secondary{margin-bottom:0}.bao-modal-footer .bao-button-primary,.bao-modal-footer .bao-button-secondary{width:auto}.bao-modal-footer .bao-button-tertiary{display:block}}\n"] }]
         }] });
 
@@ -3375,6 +3331,9 @@ class BaoModalRef {
         this._state = 1 /* CLOSING */;
         this._containerInstance._startExitAnimation();
     }
+    startOpenAnimation() {
+        this._containerInstance._startOpenAnimation();
+    }
     /**
      * Gets an observable that is notified when the modal is finished opening.
      */
@@ -3480,14 +3439,14 @@ function _closeModalVia(ref, interactionType, result) {
 }
 
 /*
- * Copyright (c) 2022 Ville de Montreal. All rights reserved.
+ * 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.
  */
 /** Injection token that can be used to access the data that was passed in to a modal. */
 const BAO_MODAL_DATA = new InjectionToken('BaoModalData');
 class BaoModalBase {
-    constructor(_overlay, _injector, _parentModal, _overlayContainer, _modalRefConstructor, _modalContainerType, _modalDataToken, _animationMode) {
+    constructor(_overlay, _injector, _parentModal, _overlayContainer, _modalRefConstructor, _modalContainerType, _modalDataToken) {
         this._overlay = _overlay;
         this._injector = _injector;
         this._parentModal = _parentModal;
@@ -3495,7 +3454,6 @@ class BaoModalBase {
         this._modalRefConstructor = _modalRefConstructor;
         this._modalContainerType = _modalContainerType;
         this._modalDataToken = _modalDataToken;
-        this._animationMode = _animationMode;
         this.afterAllClosed = defer(() => this.openModals.length
             ? this.getAfterAllClosed()
             : this.getAfterAllClosed().pipe(startWith(undefined)));
@@ -3535,21 +3493,6 @@ class BaoModalBase {
         }
         const overlayRef = this._createOverlay(conf);
         const modalContainer = this._attachModalContainer(overlayRef, conf);
-        if (this._animationMode !== 'NoopAnimations') {
-            const animationStateSubscription = modalContainer._animationStateChanged.subscribe(modalAnimationEvent => {
-                if (modalAnimationEvent.state === 'opening') {
-                    this._modalAnimatingOpen = true;
-                }
-                if (modalAnimationEvent.state === 'opened') {
-                    this._modalAnimatingOpen = false;
-                    animationStateSubscription.unsubscribe();
-                }
-            });
-            if (!this._animationStateSubscriptions) {
-                this._animationStateSubscriptions = new Subscription();
-            }
-            this._animationStateSubscriptions.add(animationStateSubscription);
-        }
         const modalRef = this._attachModalContent(componentOrTemplateRef, modalContainer, overlayRef, conf);
         this._lastModalRef = modalRef;
         // If this is the first modal that we're opening, hide all the non-overlay content.
@@ -3620,6 +3563,7 @@ class BaoModalBase {
         });
         const containerPortal = new ComponentPortal(this._modalContainerType, config.viewContainerRef, injector);
         const containerRef = overlay.attach(containerPortal);
+        containerRef.instance._startOpenAnimation();
         return containerRef.instance;
     }
     /**
@@ -3734,16 +3678,16 @@ BaoModalBase.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "1
 BaoModalBase.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "13.3.12", type: BaoModalBase, ngImport: i0 });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: BaoModalBase, decorators: [{
             type: Directive
-        }], ctorParameters: function () { return [{ type: i1$4.Overlay }, { type: i0.Injector }, { type: undefined }, { type: i1$4.OverlayContainer }, { type: i0.Type }, { type: i0.Type }, { type: i0.InjectionToken }, { type: undefined }]; } });
+        }], ctorParameters: function () { return [{ type: i1$4.Overlay }, { type: i0.Injector }, { type: undefined }, { type: i1$4.OverlayContainer }, { type: i0.Type }, { type: i0.Type }, { type: i0.InjectionToken }]; } });
 /**
  * Service to open modal.
  */
 class BaoModal extends BaoModalBase {
-    constructor(overlay, injector, parentModal, overlayContainer, animationMode) {
-        super(overlay, injector, parentModal, overlayContainer, BaoModalRef, BaoModalContainer, BAO_MODAL_DATA, animationMode);
+    constructor(overlay, injector, parentModal, overlayContainer) {
+        super(overlay, injector, parentModal, overlayContainer, BaoModalRef, BaoModalContainer, BAO_MODAL_DATA);
     }
 }
-BaoModal.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: BaoModal, deps: [{ token: i1$4.Overlay }, { token: i0.Injector }, { token: BaoModal, optional: true, skipSelf: true }, { token: i1$4.OverlayContainer }, { token: ANIMATION_MODULE_TYPE, optional: true }], target: i0.ɵɵFactoryTarget.Injectable });
+BaoModal.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: BaoModal, deps: [{ token: i1$4.Overlay }, { token: i0.Injector }, { token: BaoModal, optional: true, skipSelf: true }, { token: i1$4.OverlayContainer }], target: i0.ɵɵFactoryTarget.Injectable });
 BaoModal.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: BaoModal });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: BaoModal, decorators: [{
             type: Injectable
@@ -3752,16 +3696,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImpo
                         type: Optional
                     }, {
                         type: SkipSelf
-                    }] }, { type: i1$4.OverlayContainer }, { type: undefined, decorators: [{
-                        type: Optional
-                    }, {
-                        type: Inject,
-                        args: [ANIMATION_MODULE_TYPE]
-                    }] }];
+                    }] }, { type: i1$4.OverlayContainer }];
     } });
 
 /*
- * Copyright (c) 2022 Ville de Montreal. All rights reserved.
+ * 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.
  */
@@ -3842,7 +3781,7 @@ function getClosestDialog(element, openDialogs) {
 }
 
 /*
- * Copyright (c) 2022 Ville de Montreal. All rights reserved.
+ * 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.
  */
@@ -3850,28 +3789,12 @@ const MODAL_DIRECTIVES = [BaoModalContainer, BaoModalClose];
 class BaoModalModule {
 }
 BaoModalModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: BaoModalModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-BaoModalModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: BaoModalModule, declarations: [BaoModalContainer, BaoModalClose], imports: [CommonModule,
-        OverlayModule,
-        PortalModule,
-        BrowserAnimationsModule,
-        NoopAnimationsModule], exports: [BaoModalContainer, BaoModalClose] });
-BaoModalModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: BaoModalModule, providers: [BaoModal], imports: [[
-            CommonModule,
-            OverlayModule,
-            PortalModule,
-            BrowserAnimationsModule,
-            NoopAnimationsModule
-        ]] });
+BaoModalModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: BaoModalModule, declarations: [BaoModalContainer, BaoModalClose], imports: [CommonModule, OverlayModule, PortalModule], exports: [BaoModalContainer, BaoModalClose] });
+BaoModalModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: BaoModalModule, providers: [BaoModal], imports: [[CommonModule, OverlayModule, PortalModule]] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: BaoModalModule, decorators: [{
             type: NgModule,
             args: [{
-                    imports: [
-                        CommonModule,
-                        OverlayModule,
-                        PortalModule,
-                        BrowserAnimationsModule,
-                        NoopAnimationsModule
-                    ],
+                    imports: [CommonModule, OverlayModule, PortalModule],
                     declarations: MODAL_DIRECTIVES,
                     exports: MODAL_DIRECTIVES,
                     providers: [BaoModal]
@@ -3879,7 +3802,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImpo
         }] });
 
 /*
- * Copyright (c) 2022 Ville de Montreal. All rights reserved.
+ * 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.
  */
@@ -3952,7 +3875,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImpo
             }] } });
 
 /*
- * Copyright (c) 2022 Ville de Montreal. All rights reserved.
+ * 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.
  */
@@ -3972,13 +3895,13 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImpo
         }] });
 
 /*
- * Copyright (c) 2022 Ville de Montreal. All rights reserved.
+ * 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) 2022 Ville de Montreal. All rights reserved.
+ * 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.
  */
@@ -3995,6 +3918,10 @@ class BaoDropdownMenuItem {
          * Is the list item disabled
          */
         this.disabled = false;
+        /**
+         * Emits when menu item is clicked
+         */
+        this.itemClicked = new EventEmitter();
     }
     get nativeElement() {
         return this.elementRef.nativeElement;
@@ -4075,19 +4002,25 @@ class BaoDropdownMenuItem {
         }
     }
     /**
-     * This method propagates a click event to menu item children with inputs (checkbox, radio button)
+     * This method propagates a click event to menu item children with inputs (checkbox, radio button).
+     * It emits event to close menu if item does not contain an input.
      */
     propagateClick() {
+        let closeMenu = true;
         for (let i = 0; i < this.nativeElement.children.length; i++) {
             if (this.nativeElement.children.item(i).firstElementChild.localName ==
                 'input') {
                 this.nativeElement.children.item(i).firstElementChild.click();
+                closeMenu = false;
             }
         }
+        if (closeMenu) {
+            this.itemClicked.emit();
+        }
     }
 }
 BaoDropdownMenuItem.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: BaoDropdownMenuItem, deps: [{ token: i0.Renderer2 }, { token: i0.ElementRef }, { token: BaoDropdownMenuComponent }], target: i0.ɵɵFactoryTarget.Directive });
-BaoDropdownMenuItem.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "13.3.12", type: BaoDropdownMenuItem, selector: "bao-dropdown-menu-item, [bao-dropdown-menu-item]", inputs: { disabled: "disabled" }, host: { listeners: { "window:keyup.space": "spaceKeyEvent()", "click": "onClick($event.target)", "window:keydown.enter": "enterKeyEvent()" }, properties: { "class.bao-dropdown-menu-item-disabled": "disabled===true" }, classAttribute: "bao-dropdown-menu-item" }, usesOnChanges: true, ngImport: i0 });
+BaoDropdownMenuItem.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "13.3.12", type: BaoDropdownMenuItem, selector: "bao-dropdown-menu-item, [bao-dropdown-menu-item]", inputs: { disabled: "disabled" }, outputs: { itemClicked: "itemClicked" }, host: { listeners: { "window:keyup.space": "spaceKeyEvent()", "click": "onClick($event.target)", "window:keyup.enter": "enterKeyEvent()" }, properties: { "class.bao-dropdown-menu-item-disabled": "disabled===true" }, classAttribute: "bao-dropdown-menu-item" }, usesOnChanges: true, ngImport: i0 });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: BaoDropdownMenuItem, decorators: [{
             type: Directive,
             args: [{
@@ -4099,6 +4032,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImpo
                 }]
         }], ctorParameters: function () { return [{ type: i0.Renderer2 }, { type: i0.ElementRef }, { type: BaoDropdownMenuComponent }]; }, propDecorators: { disabled: [{
                 type: Input
+            }], itemClicked: [{
+                type: Output
             }], spaceKeyEvent: [{
                 type: HostListener,
                 args: ['window:keyup.space']
@@ -4107,7 +4042,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImpo
                 args: ['click', ['$event.target']]
             }], enterKeyEvent: [{
                 type: HostListener,
-                args: ['window:keydown.enter']
+                args: ['window:keyup.enter']
             }] } });
 class BaoDropdownMenuComponent {
     constructor(cdr, renderer, elementRef) {
@@ -4185,6 +4120,9 @@ class BaoDropdownMenuComponent {
         this.renderer.setAttribute(this.nativeElement, 'id', this.menuId);
         this._menuPortal = new DomPortal(this._menuContent);
     }
+    ngAfterContentInit() {
+        this._listItems.forEach((item) => item.itemClicked.subscribe(() => this.isClosedByKeyEvent.emit()));
+    }
     focusFirstItem() {
         this._activeItemIndex = 0;
         this._listItems.first.nativeElement.focus();
@@ -4305,8 +4243,9 @@ class BaoDropdownMenuTrigger {
     }
     /** Enter key event triggers click event which opens menu,
      *  then focus is put on first item in the menu */
-    enterKeyEvent() {
+    enterKeyEvent(event) {
         if (this._isMenuOpen && document.activeElement === this.nativeElement) {
+            event.stopImmediatePropagation();
             this.menu.focusFirstItem();
         }
     }
@@ -4376,6 +4315,13 @@ class BaoDropdownMenuTrigger {
                     originY: 'top',
                     overlayX: 'start',
                     overlayY: 'bottom'
+                },
+                {
+                    // top-right of the overlay is connected to bottom-left of the origin;
+                    originX: 'start',
+                    originY: 'bottom',
+                    overlayX: 'end',
+                    overlayY: 'top'
                 }
             ]),
             backdropClass: 'bao-overlay-transparent-backdrop',
@@ -4385,7 +4331,7 @@ class BaoDropdownMenuTrigger {
     }
 }
 BaoDropdownMenuTrigger.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: BaoDropdownMenuTrigger, deps: [{ token: i0.Renderer2 }, { token: i0.ElementRef }, { token: i1$4.Overlay }], target: i0.ɵɵFactoryTarget.Directive });
-BaoDropdownMenuTrigger.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "13.3.12", type: BaoDropdownMenuTrigger, selector: "bao-dropdown-menu-trigger, [bao-dropdown-menu-trigger], [baoDropdownMenuTriggerFor]", inputs: { menu: ["baoDropdownMenuTriggerFor", "menu"] }, host: { listeners: { "window:keyup.escape": "escapeKeyEvent()", "window:keyup.enter": "enterKeyEvent()", "click": "onClick()" }, classAttribute: "bao-dropdown-menu-trigger" }, ngImport: i0 });
+BaoDropdownMenuTrigger.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "13.3.12", type: BaoDropdownMenuTrigger, selector: "bao-dropdown-menu-trigger, [bao-dropdown-menu-trigger], [baoDropdownMenuTriggerFor]", inputs: { menu: ["baoDropdownMenuTriggerFor", "menu"] }, host: { listeners: { "window:keyup.escape": "escapeKeyEvent()", "window:keyup.enter": "enterKeyEvent($event)", "click": "onClick()" }, classAttribute: "bao-dropdown-menu-trigger" }, ngImport: i0 });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: BaoDropdownMenuTrigger, decorators: [{
             type: Directive,
             args: [{
@@ -4400,7 +4346,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImpo
                 args: ['window:keyup.escape']
             }], enterKeyEvent: [{
                 type: HostListener,
-                args: ['window:keyup.enter']
+                args: ['window:keyup.enter', ['$event']]
             }], onClick: [{
                 type: HostListener,
                 args: ['click']
@@ -4495,7 +4441,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImpo
         }], ctorParameters: function () { return [{ type: i0.Renderer2 }, { type: i0.ElementRef }]; } });
 
 /*
- * Copyright (c) 2022 Ville de Montreal. All rights reserved.
+ * 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.
  */
@@ -4535,13 +4481,514 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImpo
         }] });
 
 /*
- * Copyright (c) 2022 Ville de Montreal. All rights reserved.
+ * 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.
+ * See LICENSE file in the project root for full license information.
+ */
+const KILO_THRESHOLD = 1000;
+const MEGA_THRESHOLD = 1000000;
+class BaoFilePreviewComponent {
+    constructor(elementRef, renderer) {
+        this.elementRef = elementRef;
+        this.renderer = renderer;
+        /**
+         * Is file loading
+         */
+        this.isLoading = false;
+        /**
+         * True if projected content has no icon and file does not have a thumbnail.
+         */
+        this.insertGenericIcon = false;
+        this.thumbnailURL = '';
+    }
+    get nativeElement() {
+        return this.elementRef.nativeElement;
+    }
+    get fileSize() {
+        return this.formatSize(this.file.size);
+    }
+    ngAfterContentInit() {
+        this.getThumbnail();
+        this.setIcon();
+    }
+    setIcon() {
+        // If no icon is in the projected content, generic icon is added
+        const contentIcon = Array.from(this.nativeElement.children.item(0).children).find((el) => el.localName === 'bao-icon');
+        if (!contentIcon) {
+            this.insertGenericIcon = true;
+        }
+        else {
+            this.renderer.addClass(contentIcon, 'bao-file-media');
+        }
+    }
+    getThumbnail() {
+        if (this.file &&
+            (this.file.type === 'image/png' || this.file.type === 'image/jpeg')) {
+            const reader = new FileReader();
+            reader.onload = (event) => {
+                this.thumbnailURL = event.target.result;
+            };
+            reader.onerror = () => {
+                this.thumbnailURL = '';
+            };
+            reader.readAsDataURL(this.file);
+        }
+    }
+    formatSize(size) {
+        if (size >= KILO_THRESHOLD && size / KILO_THRESHOLD < KILO_THRESHOLD) {
+            return this.getSizeAndUnit(size, KILO_THRESHOLD, 'Ko');
+        }
+        const sizeDividedByKoMultiplicator = size / KILO_THRESHOLD;
+        if (sizeDividedByKoMultiplicator >= KILO_THRESHOLD) {
+            const toFixed = sizeDividedByKoMultiplicator > 10 ? 0 : 1;
+            return this.getSizeAndUnit(size, MEGA_THRESHOLD, 'Mo', toFixed);
+        }
+        return `${size} octets`;
+    }
+    getSizeAndUnit(size, multiplicator, unit, toFixed = 0) {
+        return `${(size / multiplicator).toFixed(toFixed)} ${unit}`;
+    }
+}
+BaoFilePreviewComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: BaoFilePreviewComponent, deps: [{ token: i0.ElementRef }, { token: i0.Renderer2 }], target: i0.ɵɵFactoryTarget.Component });
+BaoFilePreviewComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.12", type: BaoFilePreviewComponent, selector: "bao-file-preview, [bao-file-preview]", inputs: { file: "file", isLoading: "isLoading" }, host: { classAttribute: "bao-file-preview" }, ngImport: i0, template: "<div class=\"bao-file-info\">\n  <ng-content select=\"bao-icon\"></ng-content>\n  <bao-icon\n    *ngIf=\"insertGenericIcon && !thumbnailURL\"\n    class=\"bao-file-media\"\n    svgIcon=\"icon-file\"\n  >\n  </bao-icon>\n  <ng-container *ngIf=\"thumbnailURL && !isLoading\">\n    <img\n      class=\"bao-file-media\"\n      [src]=\"thumbnailURL\"\n      width=\"40px\"\n      height=\"40px\"\n    />\n  </ng-container>\n  <div class=\"bao-file-text\">\n    <div class=\"bao-file-name\">{{ file.name }}</div>\n    <div class=\"bao-file-size\">{{ fileSize }}</div>\n  </div>\n</div>\n<ng-container *ngIf=\"!isLoading\">\n  <ng-content select=\"button[bao-button]\"></ng-content>\n  <ng-content select=\"baoDropdownTriggerFor\"></ng-content>\n</ng-container>\n<bao-icon\n  *ngIf=\"isLoading\"\n  class=\"loading-spinner\"\n  svgIcon=\"icon-spinner\"\n  title=\"chargement\"\n></bao-icon>\n", styles: [".bao-file-preview{display:flex;align-items:center;justify-content:space-between;padding-top:.625rem;padding-bottom:.625rem;list-style-type:none}.bao-file-preview>.bao-file-info{display:flex;align-items:center}.bao-file-preview>.bao-file-info>.bao-icon{color:#adb2bd;flex-shrink:0}.bao-file-preview>.bao-file-info>.bao-file-media{margin-right:1rem}.bao-file-preview>.bao-file-info>.bao-file-text{display:inline-flex;flex-direction:column;margin-right:1rem}.bao-file-preview>.bao-file-info>.bao-file-text>.bao-file-name{overflow:hidden;font-weight:700;font-size:.875rem;line-height:1.25rem;color:#212529}.bao-file-preview>.bao-file-info>.bao-file-text>.bao-file-size{font-weight:400;font-size:.75rem;line-height:1rem;color:#637381}.bao-file-preview .loading-spinner{color:#097d6c}.bao-file-preview .bao-dropdown-menu-container{position:absolute;margin-left:auto}\n"], components: [{ type: BaoIconComponent, selector: "bao-icon", inputs: ["color", "size", "svgIcon", "title"], exportAs: ["baoIcon"] }], directives: [{ type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], encapsulation: i0.ViewEncapsulation.None });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: BaoFilePreviewComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'bao-file-preview, [bao-file-preview]', encapsulation: ViewEncapsulation.None, host: {
+                        class: 'bao-file-preview'
+                    }, template: "<div class=\"bao-file-info\">\n  <ng-content select=\"bao-icon\"></ng-content>\n  <bao-icon\n    *ngIf=\"insertGenericIcon && !thumbnailURL\"\n    class=\"bao-file-media\"\n    svgIcon=\"icon-file\"\n  >\n  </bao-icon>\n  <ng-container *ngIf=\"thumbnailURL && !isLoading\">\n    <img\n      class=\"bao-file-media\"\n      [src]=\"thumbnailURL\"\n      width=\"40px\"\n      height=\"40px\"\n    />\n  </ng-container>\n  <div class=\"bao-file-text\">\n    <div class=\"bao-file-name\">{{ file.name }}</div>\n    <div class=\"bao-file-size\">{{ fileSize }}</div>\n  </div>\n</div>\n<ng-container *ngIf=\"!isLoading\">\n  <ng-content select=\"button[bao-button]\"></ng-content>\n  <ng-content select=\"baoDropdownTriggerFor\"></ng-content>\n</ng-container>\n<bao-icon\n  *ngIf=\"isLoading\"\n  class=\"loading-spinner\"\n  svgIcon=\"icon-spinner\"\n  title=\"chargement\"\n></bao-icon>\n", styles: [".bao-file-preview{display:flex;align-items:center;justify-content:space-between;padding-top:.625rem;padding-bottom:.625rem;list-style-type:none}.bao-file-preview>.bao-file-info{display:flex;align-items:center}.bao-file-preview>.bao-file-info>.bao-icon{color:#adb2bd;flex-shrink:0}.bao-file-preview>.bao-file-info>.bao-file-media{margin-right:1rem}.bao-file-preview>.bao-file-info>.bao-file-text{display:inline-flex;flex-direction:column;margin-right:1rem}.bao-file-preview>.bao-file-info>.bao-file-text>.bao-file-name{overflow:hidden;font-weight:700;font-size:.875rem;line-height:1.25rem;color:#212529}.bao-file-preview>.bao-file-info>.bao-file-text>.bao-file-size{font-weight:400;font-size:.75rem;line-height:1rem;color:#637381}.bao-file-preview .loading-spinner{color:#097d6c}.bao-file-preview .bao-dropdown-menu-container{position:absolute;margin-left:auto}\n"] }]
+        }], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: i0.Renderer2 }]; }, propDecorators: { file: [{
+                type: Input
+            }], isLoading: [{
+                type: Input
+            }] } });
+
+/*
+ * 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.
+ */
+/**
+ * To modify the labels and text displayed, create a new instance of BaoFileIntl and
+ * include it in a custom provider
+ */
+class BaoFileIntl {
+    constructor() {
+        /**
+         * Stream to emit from when labels are changed. Use this to notify components when the labels have
+         * changed after initialization.
+         */
+        this.changes = new Subject();
+        /** The label for button in dropzone */
+        this.dropzoneButtonLabel = 'Parcourir';
+        /** The default dropzone instructions */
+        this.defaultDropzoneInstructions = 'ou déposer votre fichier ici';
+        /** Error message displayed when uploaded file is too large */
+        this.fileTooBigErrorMessage = 'La taille de ce fichier est trop grande';
+        /** Error message displayed when uploaded file has an invalid type */
+        this.invalidFileTypeErrorMessage = "Ce format de fichier n'est pas autorisé";
+    }
+}
+BaoFileIntl.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: BaoFileIntl, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+BaoFileIntl.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: BaoFileIntl, providedIn: 'root' });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: BaoFileIntl, decorators: [{
+            type: Injectable,
+            args: [{ providedIn: 'root' }]
+        }] });
+class BaoFileIntlEnglish extends BaoFileIntl {
+    constructor() {
+        super(...arguments);
+        /** The label for button in dropzone */
+        this.dropzoneButtonLabel = 'Browse';
+        /** The default dropzone instructions */
+        this.defaultDropzoneInstructions = 'or drop your file here';
+        /** Error message displayed when uploaded file is too large */
+        this.fileTooBigErrorMessage = 'The size of this file is too large';
+        /** Error message displayed when uploaded file has an invalid type */
+        this.invalidFileTypeErrorMessage = 'The format of this file is unauthorized';
+    }
+}
+BaoFileIntlEnglish.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: BaoFileIntlEnglish, deps: null, target: i0.ɵɵFactoryTarget.Injectable });
+BaoFileIntlEnglish.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: BaoFileIntlEnglish });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: BaoFileIntlEnglish, decorators: [{
+            type: Injectable
+        }] });
+/** @docs-private */
+function BAO_FILE_INTL_PROVIDER_FACTORY(parentIntl) {
+    return parentIntl || new BaoFileIntl();
+}
+/** @docs-private */
+const BAO_FILE_INTL_PROVIDER = {
+    // If there is already an BaoFileIntl available, use that. Otherwise, provide a new one.
+    provide: BaoFileIntl,
+    deps: [[new Optional(), new SkipSelf(), BaoFileIntl]],
+    useFactory: BAO_FILE_INTL_PROVIDER_FACTORY
+};
+
+/*
+ * 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.
+ */
+/**
+ * Unique number to generate a unique ID
+ */
+let fileInputUniqueId = 0;
+let fileTextUniqueId = 0;
+class BaoFileInputComponent {
+    constructor(intl, elementRef, renderer, cdr) {
+        this.intl = intl;
+        this.elementRef = elementRef;
+        this.renderer = renderer;
+        this.cdr = cdr;
+        /**
+         * Size of the file input label
+         */
+        this.size = 'medium';
+        /**
+         * Maximum size accepted for uploaded files
+         */
+        this.maximalFileSize = -1;
+        /**
+         * Accepted types of files
+         */
+        this.acceptedMIMETypes = [];
+        /**
+         * Is field required
+         */
+        this.required = false;
+        /**
+         * Is field disabled
+         */
+        this.disabled = false;
+        /**
+         * File selected to be uploaded
+         */
+        this.uploadedFile = new EventEmitter();
+        this.insertDefaultInstructions = false;
+        this.isFileTooBig = false;
+        this.isFileTypeInvalid = false;
+        /**
+         * Saves the registerOnChange function so the component can call it whenever it wants.
+         */
+        // eslint-disable-next-line @typescript-eslint/no-empty-function, @typescript-eslint/no-unused-vars
+        this.propagateChange = (_) => { };
+        /**
+         * Saves the registerOnTouched function so the component can call it whenever it wants.
+         */
+        // eslint-disable-next-line @typescript-eslint/no-empty-function
+        this.propagateTouched = () => { };
+        this._intlChanges = intl.changes.subscribe(() => this.cdr.markForCheck());
+    }
+    get nativeElement() {
+        return this.elementRef.nativeElement;
+    }
+    enterKeyEvent() {
+        if (document.activeElement.id === this.inputId) {
+            document.getElementById(this.inputId).click();
+        }
+    }
+    tabKeyEvent() {
+        if (document.activeElement.id === this.inputId) {
+            this.renderer.addClass(this.dropzoneElement.nativeElement, 'dropzone-focus');
+        }
+    }
+    shiftTabKeyEvent() {
+        if (document.activeElement.id === this.inputId) {
+            this.renderer.addClass(this.dropzoneElement.nativeElement, 'dropzone-focus');
+        }
+    }
+    ngAfterContentInit() {
+        this._errorForm.changes.subscribe(() => this.setErrorTextsAttribute());
+        if (!this.inputId) {
+            this.inputId = `file-input-${fileInputUniqueId++}`;
+        }
+        // If no content was added for dropzone instructions, add default text.
+        const dropzoneElement = Array.from(this.nativeElement.children).find((el) => el.className === 'file-drop-zone');
+        if (!Array.from(dropzoneElement.children).find(el => el.localName === 'bao-file-dropzone-instructions')) {
+            this.insertDefaultInstructions = true;
+        }
+        this.setDescribedByAttribute();
+        this._files.changes.subscribe((files) => {
+            const filesList = files.map((el) => el.file);
+            this.setValue(filesList);
+        });
+    }
+    ngAfterViewInit() {
+        this._errorTexts.changes.subscribe(() => this.setErrorTextsAttribute());
+    }
+    ngOnDestroy() {
+        this._intlChanges.unsubscribe();
+    }
+    /**
+     * Implements ControlValueAccessor interface
+     */
+    writeValue(obj) {
+        this._value = obj;
+    }
+    /**
+     * Implements ControlValueAccessor interface
+     */
+    registerOnChange(fn) {
+        this.propagateChange = fn;
+    }
+    /**
+     * Implements ControlValueAccessor interface
+     */
+    registerOnTouched(fn) {
+        this.propagateTouched = fn;
+    }
+    /**
+     * Implements ControlValueAccessor interface
+     */
+    setDisabledState(isDisabled) {
+        this.disabled = isDisabled;
+    }
+    uploadFile(file) {
+        if (!this.disabled) {
+            this.isFileTypeInvalid = false;
+            this.isFileTooBig = false;
+            this.uploader.nativeElement.value = '';
+            if (this.maximalFileSize > 0 && file.size > this.maximalFileSize) {
+                this.isFileTooBig = true;
+            }
+            if (this.acceptedMIMETypes.length > 0 &&
+                this.acceptedMIMETypes.indexOf(file.type) < 0) {
+                this.isFileTypeInvalid = true;
+            }
+            if (!this.isFileTooBig && !this.isFileTypeInvalid) {
+                this.uploadedFile.emit(file);
+            }
+        }
+    }
+    setValue(value) {
+        this._value = value;
+        this.propagateChange(this._value);
+        this.propagateTouched();
+    }
+    setDescribedByAttribute() {
+        const helperText = Array.from(this.nativeElement.children).find((el) => el.localName === 'bao-guiding-text');
+        if (helperText) {
+            this._helperTextId = `bao-guiding-text-${fileTextUniqueId++}`;
+            this.renderer.setAttribute(helperText.firstElementChild, 'id', this._helperTextId);
+            const inputElement = Array.from(this.nativeElement.children)
+                .find((el) => el.className == 'file-drop-zone')
+                .children.item(1);
+            this.renderer.setAttribute(inputElement, 'aria-describedby', this._helperTextId);
+        }
+    }
+    setErrorTextsAttribute() {
+        const textsIds = [];
+        const errors = Array.from(this.nativeElement.children).filter((el) => el.localName == 'bao-error');
+        errors.forEach((errorText) => {
+            const errorTextId = `bao-error-${fileTextUniqueId++}`;
+            this.renderer.setAttribute(errorText.firstElementChild, 'id', errorTextId);
+            textsIds.push(errorTextId);
+        });
+        const inputElement = Array.from(this.nativeElement.children)
+            .find((el) => el.classList.contains('file-drop-zone'))
+            .children.item(1);
+        if (this._helperTextId) {
+            textsIds.unshift(this._helperTextId);
+        }
+        this.renderer.setAttribute(inputElement, 'aria-describedby', textsIds.join(' '));
+    }
+}
+BaoFileInputComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: BaoFileInputComponent, deps: [{ token: BaoFileIntl }, { token: i0.ElementRef }, { token: i0.Renderer2 }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
+BaoFileInputComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.12", type: BaoFileInputComponent, selector: "bao-file-input, [bao-file-input]", inputs: { inputId: ["id", "inputId"], label: "label", size: "size", maximalFileSize: "maximalFileSize", acceptedMIMETypes: "acceptedMIMETypes", required: "required", disabled: "disabled" }, outputs: { uploadedFile: "uploadedFile" }, host: { listeners: { "window:keyup.enter": "enterKeyEvent()", "window:keyup.tab": "tabKeyEvent()", "window:keyup.shift.tab": "shiftTabKeyEvent()" }, properties: { "class.bao-file-label-small": "size === \"small\"", "class.bao-file-label-medium": "size === \"medium\"", "class.bao-file-input-disabled": "disabled" }, classAttribute: "bao-file-input" }, providers: [
+        {
+            provide: NG_VALUE_ACCESSOR,
+            // tslint:disable-next-line:no-forward-ref
+            useExisting: forwardRef(() => BaoFileInputComponent),
+            multi: true
+        }
+    ], queries: [{ propertyName: "_files", predicate: BaoFilePreviewComponent, descendants: true }, { propertyName: "_errorForm", predicate: BaoErrorTextComponent, descendants: true }], viewQueries: [{ propertyName: "uploader", first: true, predicate: ["uploader"], descendants: true }, { propertyName: "dropzoneElement", first: true, predicate: ["dropzone"], descendants: true }, { propertyName: "_errorTexts", predicate: BaoErrorTextComponent, descendants: true }], ngImport: i0, template: "<label bao-label [required]=\"required\" [for]=\"inputId\">{{ label }}</label>\n<ng-content select=\"bao-guiding-text\"></ng-content>\n<div\n  baoFileDrop\n  class=\"file-drop-zone\"\n  (fileDrop)=\"uploadFile($event)\"\n  #dropzone\n>\n  <button\n    bao-button\n    type=\"button\"\n    displayType=\"utility\"\n    level=\"secondary\"\n    [disabled]=\"disabled\"\n    (click)=\"uploader.click()\"\n    aria-hidden=\"true\"\n    tabIndex=\"-1\"\n  >\n    {{ intl.dropzoneButtonLabel }}\n  </button>\n  <input\n    [id]=\"inputId\"\n    type=\"file\"\n    class=\"sr-only\"\n    [disabled]=\"disabled\"\n    (change)=\"uploadFile($event.target.files[0])\"\n    #uploader\n  />\n  <ng-container\n    ><div #ref>\n      <ng-content select=\"bao-file-dropzone-instructions\"></ng-content></div\n  ></ng-container>\n  <ng-container *ngIf=\"ref.childNodes.length === 0\"\n    ><bao-file-dropzone-instructions>{{\n      intl.defaultDropzoneInstructions\n    }}</bao-file-dropzone-instructions></ng-container\n  >\n</div>\n<bao-error *ngIf=\"isFileTooBig\">\n  {{ intl.fileTooBigErrorMessage }}\n</bao-error>\n<bao-error *ngIf=\"isFileTypeInvalid\">\n  {{ intl.invalidFileTypeErrorMessage }}\n</bao-error>\n<ng-content select=\"bao-error\"></ng-content>\n<ng-content></ng-content>\n", styles: ["bao-file-input{width:100%;display:inline-flex;flex-direction:column}bao-file-input>ul{padding:0;margin:0}bao-file-input .bao-label>span{font-size:inherit;font-weight:inherit}bao-file-input.bao-file-label-small label{font-weight:700;font-size:.875rem;line-height:1.25rem}bao-file-input.bao-file-label-medium label{font-weight:700;font-size:1rem;line-height:1.5rem}bao-file-input .bao-guiding-text{margin-bottom:.5rem}bao-file-input .file-drop-zone{padding:.5rem;background-color:#fff;border-radius:.25rem;border-style:dashed;border-color:#ced4da;border-width:1px;display:inline-flex;align-items:center}bao-file-input .file-drop-zone:focus-within.dropzone-focus{box-shadow:0 0 0 .1875rem #98bcde;background-color:#eefaf8}bao-file-input .file-drop-zone>.bao-button{margin-right:.5rem}bao-file-input .file-drop-zone.drag-over{background-color:#eefaf8;border-color:#097d6c;cursor:drag}bao-file-input .file-drop-zone.drag-over>.bao-button{background-color:#eefaf8}bao-file-input.bao-file-input-disabled .file-drop-zone{background-color:#f8f9fa;border-color:#ced4da}bao-file-input.bao-file-input-disabled .file-drop-zone .bao-button{background-color:#f8f9fa}bao-file-input.bao-file-input-disabled .file-drop-zone .bao-button:hover{background-color:#f8f9fa}bao-file-input .bao-file-preview:first-child{margin-top:1rem}bao-file-input .bao-error{margin-top:.5rem}\n"], components: [{ type: i0.forwardRef(function () { return BaoLabelTextComponent; }), selector: "bao-label, [bao-label]", inputs: ["required"] }, { type: i0.forwardRef(function () { return BaoButtonComponent; }), selector: "button[bao-button]", inputs: ["displayType", "level", "size", "loading", "reversed", "loadingSpinnerAriaLabel", "fullWidth"] }, { type: i0.forwardRef(function () { return BaoErrorTextComponent; }), selector: "bao-error, [bao-error]" }], directives: [{ type: i0.forwardRef(function () { return BaoFileDropDirective; }), selector: "[baoFileDrop]", outputs: ["fileDrop"] }, { type: i0.forwardRef(function () { return i1$1.NgIf; }), selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i0.forwardRef(function () { return BaoFileDropzoneIntructions; }), selector: "bao-file-dropzone-instructions, [bao-file-dropzone-instructions]" }], encapsulation: i0.ViewEncapsulation.None });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: BaoFileInputComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'bao-file-input, [bao-file-input]', providers: [
+                        {
+                            provide: NG_VALUE_ACCESSOR,
+                            // tslint:disable-next-line:no-forward-ref
+                            useExisting: forwardRef(() => BaoFileInputComponent),
+                            multi: true
+                        }
+                    ], encapsulation: ViewEncapsulation.None, host: {
+                        class: 'bao-file-input',
+                        '[class.bao-file-label-small]': 'size === "small"',
+                        '[class.bao-file-label-medium]': 'size === "medium"',
+                        '[class.bao-file-input-disabled]': 'disabled'
+                    }, template: "<label bao-label [required]=\"required\" [for]=\"inputId\">{{ label }}</label>\n<ng-content select=\"bao-guiding-text\"></ng-content>\n<div\n  baoFileDrop\n  class=\"file-drop-zone\"\n  (fileDrop)=\"uploadFile($event)\"\n  #dropzone\n>\n  <button\n    bao-button\n    type=\"button\"\n    displayType=\"utility\"\n    level=\"secondary\"\n    [disabled]=\"disabled\"\n    (click)=\"uploader.click()\"\n    aria-hidden=\"true\"\n    tabIndex=\"-1\"\n  >\n    {{ intl.dropzoneButtonLabel }}\n  </button>\n  <input\n    [id]=\"inputId\"\n    type=\"file\"\n    class=\"sr-only\"\n    [disabled]=\"disabled\"\n    (change)=\"uploadFile($event.target.files[0])\"\n    #uploader\n  />\n  <ng-container\n    ><div #ref>\n      <ng-content select=\"bao-file-dropzone-instructions\"></ng-content></div\n  ></ng-container>\n  <ng-container *ngIf=\"ref.childNodes.length === 0\"\n    ><bao-file-dropzone-instructions>{{\n      intl.defaultDropzoneInstructions\n    }}</bao-file-dropzone-instructions></ng-container\n  >\n</div>\n<bao-error *ngIf=\"isFileTooBig\">\n  {{ intl.fileTooBigErrorMessage }}\n</bao-error>\n<bao-error *ngIf=\"isFileTypeInvalid\">\n  {{ intl.invalidFileTypeErrorMessage }}\n</bao-error>\n<ng-content select=\"bao-error\"></ng-content>\n<ng-content></ng-content>\n", styles: ["bao-file-input{width:100%;display:inline-flex;flex-direction:column}bao-file-input>ul{padding:0;margin:0}bao-file-input .bao-label>span{font-size:inherit;font-weight:inherit}bao-file-input.bao-file-label-small label{font-weight:700;font-size:.875rem;line-height:1.25rem}bao-file-input.bao-file-label-medium label{font-weight:700;font-size:1rem;line-height:1.5rem}bao-file-input .bao-guiding-text{margin-bottom:.5rem}bao-file-input .file-drop-zone{padding:.5rem;background-color:#fff;border-radius:.25rem;border-style:dashed;border-color:#ced4da;border-width:1px;display:inline-flex;align-items:center}bao-file-input .file-drop-zone:focus-within.dropzone-focus{box-shadow:0 0 0 .1875rem #98bcde;background-color:#eefaf8}bao-file-input .file-drop-zone>.bao-button{margin-right:.5rem}bao-file-input .file-drop-zone.drag-over{background-color:#eefaf8;border-color:#097d6c;cursor:drag}bao-file-input .file-drop-zone.drag-over>.bao-button{background-color:#eefaf8}bao-file-input.bao-file-input-disabled .file-drop-zone{background-color:#f8f9fa;border-color:#ced4da}bao-file-input.bao-file-input-disabled .file-drop-zone .bao-button{background-color:#f8f9fa}bao-file-input.bao-file-input-disabled .file-drop-zone .bao-button:hover{background-color:#f8f9fa}bao-file-input .bao-file-preview:first-child{margin-top:1rem}bao-file-input .bao-error{margin-top:.5rem}\n"] }]
+        }], ctorParameters: function () { return [{ type: BaoFileIntl }, { type: i0.ElementRef }, { type: i0.Renderer2 }, { type: i0.ChangeDetectorRef }]; }, propDecorators: { inputId: [{
+                type: Input,
+                args: ['id']
+            }], label: [{
+                type: Input
+            }], size: [{
+                type: Input
+            }], maximalFileSize: [{
+                type: Input
+            }], acceptedMIMETypes: [{
+                type: Input
+            }], required: [{
+                type: Input
+            }], disabled: [{
+                type: Input
+            }], uploadedFile: [{
+                type: Output
+            }], _files: [{
+                type: ContentChildren,
+                args: [BaoFilePreviewComponent, { descendants: true }]
+            }], _errorForm: [{
+                type: ContentChildren,
+                args: [BaoErrorTextComponent, { descendants: true }]
+            }], _errorTexts: [{
+                type: ViewChildren,
+                args: [BaoErrorTextComponent]
+            }], uploader: [{
+                type: ViewChild,
+                args: ['uploader', { static: false }]
+            }], dropzoneElement: [{
+                type: ViewChild,
+                args: ['dropzone', { static: false }]
+            }], enterKeyEvent: [{
+                type: HostListener,
+                args: ['window:keyup.enter']
+            }], tabKeyEvent: [{
+                type: HostListener,
+                args: ['window:keyup.tab']
+            }], shiftTabKeyEvent: [{
+                type: HostListener,
+                args: ['window:keyup.shift.tab']
+            }] } });
+class BaoFileDropDirective {
+    constructor() {
+        this.fileDrop = new EventEmitter();
+        this._isDragOver = false;
+    }
+    onDragOver(event) {
+        this.preventAndStop(event);
+        this._isDragOver = true;
+    }
+    onDragLeave(event) {
+        this.preventAndStop(event);
+        this._isDragOver = false;
+    }
+    onDrop(event) {
+        this.preventAndStop(event);
+        this._isDragOver = false;
+        const transfer = this.getDataTransfer(event);
+        this.fileDrop.emit(transfer.files[0]);
+    }
+    preventAndStop(event) {
+        event.preventDefault();
+        event.stopPropagation();
+    }
+    getDataTransfer(event) {
+        // eslint-disable-next-line @typescript-eslint/no-unsafe-return
+        return event.dataTransfer
+            ? event.dataTransfer
+            : event.originalEvent.dataTransfer;
+    }
+}
+BaoFileDropDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: BaoFileDropDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+BaoFileDropDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "13.3.12", type: BaoFileDropDirective, selector: "[baoFileDrop]", outputs: { fileDrop: "fileDrop" }, host: { listeners: { "dragover": "onDragOver($event)", "dragleave": "onDragLeave($event)", "drop": "onDrop($event)" }, properties: { "class.drag-over": "_isDragOver == true" } }, ngImport: i0 });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: BaoFileDropDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: '[baoFileDrop]',
+                    host: { '[class.drag-over]': '_isDragOver == true' }
+                }]
+        }], propDecorators: { fileDrop: [{
+                type: Output
+            }], onDragOver: [{
+                type: HostListener,
+                args: ['dragover', ['$event']]
+            }], onDragLeave: [{
+                type: HostListener,
+                args: ['dragleave', ['$event']]
+            }], onDrop: [{
+                type: HostListener,
+                args: ['drop', ['$event']]
+            }] } });
+class BaoFileDropzoneIntructions {
+    constructor(renderer, elementRef) {
+        this.renderer = renderer;
+        this.elementRef = elementRef;
+    }
+    get nativeElement() {
+        return this.elementRef.nativeElement;
+    }
+    ngAfterContentInit() {
+        this.renderer.setAttribute(this.nativeElement, 'aria-hidden', 'true');
+    }
+}
+BaoFileDropzoneIntructions.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: BaoFileDropzoneIntructions, deps: [{ token: i0.Renderer2 }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive });
+BaoFileDropzoneIntructions.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "13.3.12", type: BaoFileDropzoneIntructions, selector: "bao-file-dropzone-instructions, [bao-file-dropzone-instructions]", host: { classAttribute: "bao-file-dropzone-instructions" }, ngImport: i0 });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: BaoFileDropzoneIntructions, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: 'bao-file-dropzone-instructions, [bao-file-dropzone-instructions]',
+                    host: {
+                        class: 'bao-file-dropzone-instructions'
+                    }
+                }]
+        }], ctorParameters: function () { return [{ type: i0.Renderer2 }, { type: i0.ElementRef }]; } });
+
+/*
+ * 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 FILE_DIRECTIVES = [
+    BaoFileInputComponent,
+    BaoFileDropzoneIntructions,
+    BaoFileDropDirective,
+    BaoFilePreviewComponent
+];
+class BaoFileModule {
+}
+BaoFileModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: BaoFileModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+BaoFileModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: BaoFileModule, declarations: [BaoFileInputComponent,
+        BaoFileDropzoneIntructions,
+        BaoFileDropDirective,
+        BaoFilePreviewComponent], imports: [CommonModule,
+        BaoDropdownMenuModule,
+        BaoCommonComponentsModule,
+        BaoIconModule,
+        BaoButtonModule], exports: [BaoFileInputComponent,
+        BaoFileDropzoneIntructions,
+        BaoFileDropDirective,
+        BaoFilePreviewComponent] });
+BaoFileModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: BaoFileModule, providers: [BAO_FILE_INTL_PROVIDER], imports: [[
+            CommonModule,
+            BaoDropdownMenuModule,
+            BaoCommonComponentsModule,
+            BaoIconModule,
+            BaoButtonModule
+        ]] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: BaoFileModule, decorators: [{
+            type: NgModule,
+            args: [{
+                    imports: [
+                        CommonModule,
+                        BaoDropdownMenuModule,
+                        BaoCommonComponentsModule,
+                        BaoIconModule,
+                        BaoButtonModule
+                    ],
+                    declarations: [FILE_DIRECTIVES],
+                    exports: [FILE_DIRECTIVES],
+                    providers: [BAO_FILE_INTL_PROVIDER]
+                }]
+        }] });
 
 /*
- * Copyright (c) 2022 Ville de Montreal. All rights reserved.
+ * 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.
  */
@@ -4552,7 +4999,8 @@ BaoModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.
         BaoButtonModule,
         BaoAlertModule,
         BaoCardModule,
-        BaoBreadcrumbModule], exports: [BaoIconModule,
+        BaoBreadcrumbModule,
+        BaoModalModule], exports: [BaoIconModule,
         BaoButtonModule,
         BaoAlertModule,
         BaoBreadcrumbModule,
@@ -4568,7 +5016,8 @@ BaoModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.
         BaoTabsModule,
         BaoModalModule,
         BaoHyperlinkModule,
-        BaoDropdownMenuModule
+        BaoDropdownMenuModule,
+        BaoFileModule
         // TODO: reactivate once component does not depend on global css BaoBadgeModule,
         // TODO: reactivate once component does not depend on global css BaoSnackBarModule,
     ] });
@@ -4577,7 +5026,8 @@ BaoModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.
             BaoButtonModule,
             BaoAlertModule,
             BaoCardModule,
-            BaoBreadcrumbModule
+            BaoBreadcrumbModule,
+            BaoModalModule
         ], BaoIconModule,
         BaoButtonModule,
         BaoAlertModule,
@@ -4594,7 +5044,8 @@ BaoModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.
         BaoTabsModule,
         BaoModalModule,
         BaoHyperlinkModule,
-        BaoDropdownMenuModule
+        BaoDropdownMenuModule,
+        BaoFileModule
         // TODO: reactivate once component does not depend on global css BaoBadgeModule,
         // TODO: reactivate once component does not depend on global css BaoSnackBarModule,
     ] });
@@ -4606,7 +5057,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImpo
                         BaoButtonModule,
                         BaoAlertModule,
                         BaoCardModule,
-                        BaoBreadcrumbModule
+                        BaoBreadcrumbModule,
+                        BaoModalModule
                     ],
                     exports: [
                         BaoIconModule,
@@ -4625,7 +5077,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImpo
                         BaoTabsModule,
                         BaoModalModule,
                         BaoHyperlinkModule,
-                        BaoDropdownMenuModule
+                        BaoDropdownMenuModule,
+                        BaoFileModule
                         // TODO: reactivate once component does not depend on global css BaoBadgeModule,
                         // TODO: reactivate once component does not depend on global css BaoSnackBarModule,
                     ]
@@ -4633,7 +5086,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImpo
         }] });
 
 /*
- * Copyright (c) 2022 Ville de Montreal. All rights reserved.
+ * 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.
  */
@@ -4658,7 +5111,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImpo
             }] } });
 
 /*
- * Copyright (c) 2022 Ville de Montreal. All rights reserved.
+ * 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.
  */
@@ -4678,25 +5131,31 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImpo
         }] });
 
 /*
- * Copyright (c) 2022 Ville de Montreal. All rights reserved.
+ * 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.
  * See LICENSE file in the project root for full license information.
  */
 
 /*
- * Copyright (c) 2022 Ville de Montreal. All rights reserved.
+ * 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) 2022 Ville de Montreal. All rights reserved.
+ * 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) 2022 Ville de Montreal. All rights reserved.
+ * 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.
  */
@@ -4705,5 +5164,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImpo
  * Generated bundle index. Do not edit.
  */
 
-export { BAO_MODAL_DATA, BAO_RADIO_GROUP, 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, 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, BaoSummaryComponent, BaoSummaryDescription, BaoSummaryModule, BaoTabHeader, BaoTabPanel, BaoTablistComponent, BaoTabsContainer, BaoTabsModule, BaoTagComponent, BaoTagModule, BaoTitleTextComponent, _BaoModalContainerBase, _closeModalVia, eModalDesktopWidthSize, eModalMobileWidthSize, throwBaoModalContentAlreadyAttachedError };
+export { BAO_FILE_INTL_PROVIDER, BAO_FILE_INTL_PROVIDER_FACTORY, BAO_MODAL_DATA, BAO_RADIO_GROUP, 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, BaoSummaryComponent, BaoSummaryDescription, BaoSummaryModule, BaoTabHeader, BaoTabPanel, BaoTablistComponent, BaoTabsContainer, BaoTabsModule, BaoTagComponent, BaoTagModule, BaoTitleTextComponent, _BaoModalContainerBase, _closeModalVia, eModalDesktopWidthSize, eModalMobileWidthSize, throwBaoModalContentAlreadyAttachedError };
 //# sourceMappingURL=villedemontreal-angular-ui.mjs.map