@villedemontreal/angular-ui 3.1.1 → 3.2.0-pre.build.1

package/fesm2020/villedemontreal-angular-ui.mjs

@@ -17,7 +17,7 @@ import { Subject, filter, take, defer, startWith, Subscription } from 'rxjs';
 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';
+import { ANIMATION_MODULE_TYPE } from '@angular/platform-browser/animations';
 
 function baoColorToHex(baoColor) {
     switch (baoColor) {
@@ -2223,7 +2223,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.1", ngImpor
 const SPAN = 'span';
 const SPAN_TEXT_PROPERTY$1 = 'textContent';
 const SCREEN_READER_CLASS_NAME$1 = 'sr-only';
-const BAO_ICON = 'bao-icon';
+const BAO_ICON$1 = 'bao-icon';
 const HAS_ICON = 'has-icon';
 class BaoTagComponent {
     constructor(renderer, elementRef) {
@@ -2258,7 +2258,7 @@ class BaoTagComponent {
     }
     addIconClass() {
         const children = Array.from(this.nativeElement.children);
-        if (children.some(c => c.localName === BAO_ICON)) {
+        if (children.some(c => c.localName === BAO_ICON$1)) {
             this.renderer.addClass(this.nativeElement, HAS_ICON);
         }
     }
@@ -3827,32 +3827,117 @@ const MODAL_DIRECTIVES = [BaoModalContainer, BaoModalClose];
 class BaoModalModule {
 }
 BaoModalModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.1", ngImport: i0, type: BaoModalModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-BaoModalModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "14.2.1", 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: "14.2.1", ngImport: i0, type: BaoModalModule, providers: [BaoModal], imports: [CommonModule,
-        OverlayModule,
-        PortalModule,
-        BrowserAnimationsModule,
-        NoopAnimationsModule] });
+BaoModalModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "14.2.1", ngImport: i0, type: BaoModalModule, declarations: [BaoModalContainer, BaoModalClose], imports: [CommonModule, OverlayModule, PortalModule], exports: [BaoModalContainer, BaoModalClose] });
+BaoModalModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "14.2.1", ngImport: i0, type: BaoModalModule, providers: [BaoModal], imports: [CommonModule, OverlayModule, PortalModule] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.1", 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]
                 }]
         }] });
 
+/*
+ * 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.
+ */
+const BAO_ICON = 'bao-icon';
+const LINK_ELEMENT = 'a';
+const HAS_LEFT_ICON = 'has-left-icon';
+const HAS_RIGHT_ICON = 'has-right-icon';
+const LIST_PARENT = 'bao-hyperlink-list-parent';
+class BaoHyperlinkComponent {
+    constructor(renderer, elementRef) {
+        this.renderer = renderer;
+        this.elementRef = elementRef;
+        /**
+         * Size of the link when it's in a list.
+         */
+        this.size = 'medium';
+    }
+    get nativeElement() {
+        return this.elementRef.nativeElement;
+    }
+    ngAfterViewInit() {
+        this.setIcon();
+        this.addIconClass();
+    }
+    setIcon() {
+        const parentName = this.nativeElement.parentElement.localName;
+        if (parentName === 'ul') {
+            this.renderer.addClass(this.nativeElement.parentElement, LIST_PARENT);
+        }
+        else {
+            // Icon in inline hyperlink must always be positioned after label.
+            const children = Array.from(this.nativeElement.children);
+            const iconIndex = children.findIndex(c => c.localName === BAO_ICON);
+            if (iconIndex > -1) {
+                const labelIndex = children.findIndex(c => c.localName === LINK_ELEMENT);
+                // Set icon's size to match text's lineHeight.
+                const lineHeight = getComputedStyle(children[labelIndex])['lineHeight'];
+                this.renderer.setStyle(children[iconIndex], 'height', lineHeight);
+                this.renderer.setStyle(children[iconIndex], 'width', lineHeight);
+                if (iconIndex < labelIndex) {
+                    const iconElement = children[iconIndex];
+                    this.renderer.removeChild(this.nativeElement, children[iconIndex]);
+                    this.renderer.appendChild(this.nativeElement, iconElement);
+                }
+            }
+        }
+    }
+    addIconClass() {
+        const children = Array.from(this.nativeElement.children);
+        const iconIndex = children.findIndex(c => c.localName === BAO_ICON);
+        if (iconIndex > -1) {
+            const labelIndex = children.findIndex(c => c.localName === LINK_ELEMENT);
+            const iconClass = iconIndex < labelIndex ? HAS_LEFT_ICON : HAS_RIGHT_ICON;
+            this.renderer.addClass(this.nativeElement, iconClass);
+        }
+    }
+}
+BaoHyperlinkComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.1", ngImport: i0, type: BaoHyperlinkComponent, deps: [{ token: i0.Renderer2 }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
+BaoHyperlinkComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.1", type: BaoHyperlinkComponent, selector: "bao-hyperlink, [bao-hyperlink]", inputs: { size: "size" }, host: { properties: { "class.bao-hyperlink-medium": "size === \"medium\"", "class.bao-hyperlink-small": "size === \"small\"", "class.bao-hyperlink-extra-small": "size === \"extra-small\"" }, classAttribute: "bao-hyperlink" }, ngImport: i0, template: "<ng-content></ng-content>\n", styles: [".bao-hyperlink:not(li){display:inline-flex;font-size:inherit;line-height:inherit}.bao-hyperlink:not(li)>a{box-shadow:inset 0 -1px #097d6c;text-decoration:none;border-bottom:none;font-size:inherit}li.bao-hyperlink{display:flex}li.bao-hyperlink>a{text-decoration:none;border-bottom:none}li.bao-hyperlink>a:hover{box-shadow:inset 0 -1px #097d6c}li.bao-hyperlink.bao-hyperlink-extra-small a{font-weight:700;font-size:.75rem;line-height:1rem}li.bao-hyperlink.bao-hyperlink-extra-small .bao-icon{height:1rem;width:1rem}li.bao-hyperlink.bao-hyperlink-small a{font-weight:700;font-size:.875rem;line-height:1.25rem}li.bao-hyperlink.bao-hyperlink-small .bao-icon{height:1.25rem;width:1.25rem}li.bao-hyperlink.bao-hyperlink-medium a{font-weight:700;font-size:1rem;line-height:1.5rem}li.bao-hyperlink.bao-hyperlink-medium .bao-icon{height:1.5rem;width:1.5rem}.bao-hyperlink{align-items:center}.bao-hyperlink>.bao-icon{color:#097d6c;flex-shrink:0}.bao-hyperlink.has-right-icon>.bao-icon{margin-left:.25rem}.bao-hyperlink.has-left-icon>.bao-icon{margin-right:.5rem}ul.bao-hyperlink-list-parent{list-style-type:none}\n"], encapsulation: i0.ViewEncapsulation.None });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.1", ngImport: i0, type: BaoHyperlinkComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'bao-hyperlink, [bao-hyperlink]', encapsulation: ViewEncapsulation.None, host: {
+                        class: 'bao-hyperlink',
+                        '[class.bao-hyperlink-medium]': 'size === "medium"',
+                        '[class.bao-hyperlink-small]': 'size === "small"',
+                        '[class.bao-hyperlink-extra-small]': 'size === "extra-small"'
+                    }, template: "<ng-content></ng-content>\n", styles: [".bao-hyperlink:not(li){display:inline-flex;font-size:inherit;line-height:inherit}.bao-hyperlink:not(li)>a{box-shadow:inset 0 -1px #097d6c;text-decoration:none;border-bottom:none;font-size:inherit}li.bao-hyperlink{display:flex}li.bao-hyperlink>a{text-decoration:none;border-bottom:none}li.bao-hyperlink>a:hover{box-shadow:inset 0 -1px #097d6c}li.bao-hyperlink.bao-hyperlink-extra-small a{font-weight:700;font-size:.75rem;line-height:1rem}li.bao-hyperlink.bao-hyperlink-extra-small .bao-icon{height:1rem;width:1rem}li.bao-hyperlink.bao-hyperlink-small a{font-weight:700;font-size:.875rem;line-height:1.25rem}li.bao-hyperlink.bao-hyperlink-small .bao-icon{height:1.25rem;width:1.25rem}li.bao-hyperlink.bao-hyperlink-medium a{font-weight:700;font-size:1rem;line-height:1.5rem}li.bao-hyperlink.bao-hyperlink-medium .bao-icon{height:1.5rem;width:1.5rem}.bao-hyperlink{align-items:center}.bao-hyperlink>.bao-icon{color:#097d6c;flex-shrink:0}.bao-hyperlink.has-right-icon>.bao-icon{margin-left:.25rem}.bao-hyperlink.has-left-icon>.bao-icon{margin-right:.5rem}ul.bao-hyperlink-list-parent{list-style-type:none}\n"] }]
+        }], ctorParameters: function () { return [{ type: i0.Renderer2 }, { type: i0.ElementRef }]; }, propDecorators: { size: [{
+                type: Input
+            }] } });
+
+/*
+ * 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.
+ */
+const HYPERLINK_DIRECTIVES = [BaoHyperlinkComponent];
+class BaoHyperlinkModule {
+}
+BaoHyperlinkModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.1", ngImport: i0, type: BaoHyperlinkModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+BaoHyperlinkModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "14.2.1", ngImport: i0, type: BaoHyperlinkModule, declarations: [BaoHyperlinkComponent], imports: [CommonModule], exports: [BaoHyperlinkComponent] });
+BaoHyperlinkModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "14.2.1", ngImport: i0, type: BaoHyperlinkModule, imports: [CommonModule] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.1", ngImport: i0, type: BaoHyperlinkModule, decorators: [{
+            type: NgModule,
+            args: [{
+                    imports: [CommonModule],
+                    declarations: [HYPERLINK_DIRECTIVES],
+                    exports: [HYPERLINK_DIRECTIVES]
+                }]
+        }] });
+
+/*
+ * 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.
  * Licensed under the MIT license.
@@ -3865,7 +3950,8 @@ BaoModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "14.
         BaoButtonModule,
         BaoAlertModule,
         BaoCardModule,
-        BaoBreadcrumbModule], exports: [BaoIconModule,
+        BaoBreadcrumbModule,
+        BaoModalModule], exports: [BaoIconModule,
         BaoButtonModule,
         BaoAlertModule,
         BaoBreadcrumbModule,
@@ -3879,7 +3965,8 @@ BaoModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "14.
         BaoSummaryModule,
         BaoAvatarModule,
         BaoTabsModule,
-        BaoModalModule
+        BaoModalModule,
+        BaoHyperlinkModule
         // TODO: reactivate once component does not depend on global css BaoBadgeModule,
         // TODO: reactivate once component does not depend on global css BaoSnackBarModule,
     ] });
@@ -3887,7 +3974,8 @@ BaoModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "14.
         BaoButtonModule,
         BaoAlertModule,
         BaoCardModule,
-        BaoBreadcrumbModule, BaoIconModule,
+        BaoBreadcrumbModule,
+        BaoModalModule, BaoIconModule,
         BaoButtonModule,
         BaoAlertModule,
         BaoBreadcrumbModule,
@@ -3901,7 +3989,8 @@ BaoModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "14.
         BaoSummaryModule,
         BaoAvatarModule,
         BaoTabsModule,
-        BaoModalModule
+        BaoModalModule,
+        BaoHyperlinkModule
         // TODO: reactivate once component does not depend on global css BaoBadgeModule,
         // TODO: reactivate once component does not depend on global css BaoSnackBarModule,
     ] });
@@ -3913,7 +4002,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.1", ngImpor
                         BaoButtonModule,
                         BaoAlertModule,
                         BaoCardModule,
-                        BaoBreadcrumbModule
+                        BaoBreadcrumbModule,
+                        BaoModalModule
                     ],
                     exports: [
                         BaoIconModule,
@@ -3930,7 +4020,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.1", ngImpor
                         BaoSummaryModule,
                         BaoAvatarModule,
                         BaoTabsModule,
-                        BaoModalModule
+                        BaoModalModule,
+                        BaoHyperlinkModule
                         // TODO: reactivate once component does not depend on global css BaoBadgeModule,
                         // TODO: reactivate once component does not depend on global css BaoSnackBarModule,
                     ]
@@ -4010,5 +4101,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.1", ngImpor
  * 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, BaoErrorTextComponent, BaoGuidingTextComponent, BaoHeaderInfoComponent, BaoHeaderInfoContent, BaoHeaderInfoModule, BaoHeaderInfoSubtitle, BaoHeaderInfoSurtitle, BaoHeaderInfoTitle, BaoHeaderInfoTitleGroupComponent, 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_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, 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 };
 //# sourceMappingURL=villedemontreal-angular-ui.mjs.map