@byuhbll/components 4.0.0-alpha.26 → 4.0.0-alpha.28

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (14) hide show
  1. package/esm2022/lib/contact-utils.mjs +13 -0
  2. package/esm2022/lib/hbll-footer/hbll-footer.component.mjs +8 -19
  3. package/esm2022/lib/hbll-header/hbll-header.component.mjs +3 -3
  4. package/esm2022/lib/hbll-header/nav-bar/nav-bar.component.mjs +3 -3
  5. package/esm2022/lib/hbll-header/nav-bar-dropdown/nav-bar-dropdown.component.mjs +3 -3
  6. package/esm2022/lib/impersonate-modal/impersonate-modal.component.mjs +3 -3
  7. package/esm2022/lib/impersonation-banner/impersonation-banner.component.mjs +2 -2
  8. package/esm2022/lib/pipes/hbll-item-type-icon.pipe.mjs +103 -201
  9. package/fesm2022/byuhbll-components.mjs +129 -227
  10. package/fesm2022/byuhbll-components.mjs.map +1 -1
  11. package/lib/contact-utils.d.ts +16 -0
  12. package/lib/hbll-footer/hbll-footer.component.d.ts +1 -7
  13. package/package.json +1 -1
  14. package/styles/scss/shared.scss +1 -0
package/fesm2022/byuhbll-components.mjs CHANGED
@@ -8,7 +8,7 @@ import { trigger, transition, group, style, query, animateChild, animate } from
8
8
  import { map, of, switchMap, shareReplay, combineLatest, Subject, Subscription } from 'rxjs';
9
9
  import { BreakpointObserver } from '@angular/cdk/layout';
10
10
  import * as i2 from '@angular/forms';
11
- import { FormBuilder, Validators, ReactiveFormsModule, FormControl, NonNullableFormBuilder } from '@angular/forms';
11
+ import { Validators, FormBuilder, ReactiveFormsModule, FormControl, NonNullableFormBuilder } from '@angular/forms';
12
12
  import { switchMap as switchMap$1, map as map$1, startWith, catchError, tap, filter } from 'rxjs/operators';
13
13
  import { jwtDecode } from 'jwt-decode';
14
14
  import urlcat from 'urlcat';
@@ -104,11 +104,11 @@ class NavBarDropdownComponent {
104
104
  };
105
105
  }
106
106
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.1.0", ngImport: i0, type: NavBarDropdownComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
107
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.1.0", type: NavBarDropdownComponent, isStandalone: true, selector: "lib-nav-bar-dropdown", inputs: { title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired: true, transformFunction: null }, isSmallScreen: { classPropertyName: "isSmallScreen", publicName: "isSmallScreen", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { openEvent: "openEvent" }, ngImport: i0, template: "<span\n class=\"hbll-header-dropdown-wrapper\"\n data-testid=\"wrapper\"\n [ngClass]=\"{ 'hbll-header-desktop': !isSmallScreen() }\"\n (mouseenter)=\"!isSmallScreen() && (this.isOpen = true)\"\n (mouseleave)=\"!isSmallScreen() && (this.isOpen = false)\"\n>\n <button (click)=\"handleClick()\" data-testid=\"btn\">\n {{ title() }}\n <span class=\"material-symbols-outlined hbll-header-icon\">\n {{ 'keyboard_arrow_' + (isOpen ? 'up' : 'down') }}\n </span>\n </button>\n @if (!isSmallScreen()) {\n @if (isOpen) {\n <div class=\"hbll-header-dropdown\" data-testid=\"dropdown\">\n <ng-container *ngTemplateOutlet=\"content\"></ng-container>\n </div>\n }\n } @else {\n <lib-expand-collapse [isExpanded]=\"isOpen\">\n <ng-container *ngTemplateOutlet=\"content\"></ng-container>\n </lib-expand-collapse>\n }\n</span>\n\n<ng-template #content>\n <ng-content></ng-content>\n</ng-template>\n", styles: [".hbll-header-dropdown-wrapper.hbll-header-desktop button{color:#002e5d;background-color:#fff;display:flex;justify-content:center;align-items:center;font-size:1.1em;font-weight:500;border:none;padding:.4em 1em;line-height:1.4em}.hbll-header-dropdown-wrapper.hbll-header-desktop button .hbll-header-icon{font-size:1.3em;margin-bottom:-.1em}.hbll-header-dropdown-wrapper.hbll-header-desktop button:hover{background-color:#0047ba;color:#fff}*{box-sizing:border-box;text-decoration:none}*:not(.material-symbols-outlined){font-family:inherit}.hbll-header-dropdown-wrapper button{justify-content:flex-end;font-size:1.3em;color:#fff;display:flex;align-items:center;background-color:#0047ba;width:100%;padding:.6em;border-bottom:1px solid rgba(255,255,255,.3);border-left:none;border-right:none;border-top:none;white-space:nowrap;cursor:pointer}.hbll-header-dropdown-wrapper button .hbll-header-icon{margin-left:.2em}.hbll-header-dropdown-wrapper.hbll-header-desktop:hover button{background-color:#0047ba;color:#fff}.hbll-header-dropdown-wrapper.hbll-header-desktop .hbll-header-dropdown{position:absolute;z-index:11;width:100%;top:100%;left:0;background-color:#0047ba}\n"], dependencies: [{ kind: "component", type: ExpandCollapseComponent, selector: "lib-expand-collapse", inputs: ["isExpanded"] }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }] }); }
107
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.1.0", type: NavBarDropdownComponent, isStandalone: true, selector: "lib-nav-bar-dropdown", inputs: { title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired: true, transformFunction: null }, isSmallScreen: { classPropertyName: "isSmallScreen", publicName: "isSmallScreen", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { openEvent: "openEvent" }, ngImport: i0, template: "<span\n class=\"hbll-header-dropdown-wrapper\"\n data-testid=\"wrapper\"\n [ngClass]=\"{ 'hbll-header-desktop': !isSmallScreen() }\"\n (mouseenter)=\"!isSmallScreen() && (this.isOpen = true)\"\n (mouseleave)=\"!isSmallScreen() && (this.isOpen = false)\"\n>\n <button (click)=\"handleClick()\" data-testid=\"btn\">\n {{ title() }}\n <span class=\"material-symbols-outlined hbll-header-icon\">\n {{ 'keyboard_arrow_' + (isOpen ? 'up' : 'down') }}\n </span>\n </button>\n @if (!isSmallScreen()) {\n @if (isOpen) {\n <div class=\"hbll-header-dropdown\" data-testid=\"dropdown\">\n <ng-container *ngTemplateOutlet=\"content\"></ng-container>\n </div>\n }\n } @else {\n <lib-expand-collapse [isExpanded]=\"isOpen\">\n <ng-container *ngTemplateOutlet=\"content\"></ng-container>\n </lib-expand-collapse>\n }\n</span>\n\n<ng-template #content>\n <ng-content></ng-content>\n</ng-template>\n", styles: [".hbll-header-dropdown-wrapper.hbll-header-desktop button{color:#002e5d;background-color:#fff;display:flex;justify-content:center;align-items:center;font-size:1.1em;font-weight:500;border:none;padding:.4em 1em;line-height:1.4em}.hbll-header-dropdown-wrapper.hbll-header-desktop button .hbll-header-icon{font-size:1.3em;margin-bottom:-.1em}.hbll-header-dropdown-wrapper.hbll-header-desktop button:hover{background-color:#0047ba;color:#fff}*{box-sizing:border-box;text-decoration:none;font-size:1em}*:not(.material-symbols-outlined){font-family:inherit}.hbll-header-dropdown-wrapper button{justify-content:flex-end;font-size:1.3em;color:#fff;display:flex;align-items:center;background-color:#0047ba;width:100%;padding:.6em;border-bottom:1px solid rgba(255,255,255,.3);border-left:none;border-right:none;border-top:none;white-space:nowrap;cursor:pointer}.hbll-header-dropdown-wrapper button .hbll-header-icon{margin-left:.2em}.hbll-header-dropdown-wrapper.hbll-header-desktop:hover button{background-color:#0047ba;color:#fff}.hbll-header-dropdown-wrapper.hbll-header-desktop .hbll-header-dropdown{position:absolute;z-index:11;width:100%;top:100%;left:0;background-color:#0047ba}\n"], dependencies: [{ kind: "component", type: ExpandCollapseComponent, selector: "lib-expand-collapse", inputs: ["isExpanded"] }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }] }); }
108
108
  }
109
109
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.1.0", ngImport: i0, type: NavBarDropdownComponent, decorators: [{
110
110
  type: Component,
111
- args: [{ selector: 'lib-nav-bar-dropdown', standalone: true, imports: [ExpandCollapseComponent, CommonModule], template: "<span\n class=\"hbll-header-dropdown-wrapper\"\n data-testid=\"wrapper\"\n [ngClass]=\"{ 'hbll-header-desktop': !isSmallScreen() }\"\n (mouseenter)=\"!isSmallScreen() && (this.isOpen = true)\"\n (mouseleave)=\"!isSmallScreen() && (this.isOpen = false)\"\n>\n <button (click)=\"handleClick()\" data-testid=\"btn\">\n {{ title() }}\n <span class=\"material-symbols-outlined hbll-header-icon\">\n {{ 'keyboard_arrow_' + (isOpen ? 'up' : 'down') }}\n </span>\n </button>\n @if (!isSmallScreen()) {\n @if (isOpen) {\n <div class=\"hbll-header-dropdown\" data-testid=\"dropdown\">\n <ng-container *ngTemplateOutlet=\"content\"></ng-container>\n </div>\n }\n } @else {\n <lib-expand-collapse [isExpanded]=\"isOpen\">\n <ng-container *ngTemplateOutlet=\"content\"></ng-container>\n </lib-expand-collapse>\n }\n</span>\n\n<ng-template #content>\n <ng-content></ng-content>\n</ng-template>\n", styles: [".hbll-header-dropdown-wrapper.hbll-header-desktop button{color:#002e5d;background-color:#fff;display:flex;justify-content:center;align-items:center;font-size:1.1em;font-weight:500;border:none;padding:.4em 1em;line-height:1.4em}.hbll-header-dropdown-wrapper.hbll-header-desktop button .hbll-header-icon{font-size:1.3em;margin-bottom:-.1em}.hbll-header-dropdown-wrapper.hbll-header-desktop button:hover{background-color:#0047ba;color:#fff}*{box-sizing:border-box;text-decoration:none}*:not(.material-symbols-outlined){font-family:inherit}.hbll-header-dropdown-wrapper button{justify-content:flex-end;font-size:1.3em;color:#fff;display:flex;align-items:center;background-color:#0047ba;width:100%;padding:.6em;border-bottom:1px solid rgba(255,255,255,.3);border-left:none;border-right:none;border-top:none;white-space:nowrap;cursor:pointer}.hbll-header-dropdown-wrapper button .hbll-header-icon{margin-left:.2em}.hbll-header-dropdown-wrapper.hbll-header-desktop:hover button{background-color:#0047ba;color:#fff}.hbll-header-dropdown-wrapper.hbll-header-desktop .hbll-header-dropdown{position:absolute;z-index:11;width:100%;top:100%;left:0;background-color:#0047ba}\n"] }]
111
+ args: [{ selector: 'lib-nav-bar-dropdown', standalone: true, imports: [ExpandCollapseComponent, CommonModule], template: "<span\n class=\"hbll-header-dropdown-wrapper\"\n data-testid=\"wrapper\"\n [ngClass]=\"{ 'hbll-header-desktop': !isSmallScreen() }\"\n (mouseenter)=\"!isSmallScreen() && (this.isOpen = true)\"\n (mouseleave)=\"!isSmallScreen() && (this.isOpen = false)\"\n>\n <button (click)=\"handleClick()\" data-testid=\"btn\">\n {{ title() }}\n <span class=\"material-symbols-outlined hbll-header-icon\">\n {{ 'keyboard_arrow_' + (isOpen ? 'up' : 'down') }}\n </span>\n </button>\n @if (!isSmallScreen()) {\n @if (isOpen) {\n <div class=\"hbll-header-dropdown\" data-testid=\"dropdown\">\n <ng-container *ngTemplateOutlet=\"content\"></ng-container>\n </div>\n }\n } @else {\n <lib-expand-collapse [isExpanded]=\"isOpen\">\n <ng-container *ngTemplateOutlet=\"content\"></ng-container>\n </lib-expand-collapse>\n }\n</span>\n\n<ng-template #content>\n <ng-content></ng-content>\n</ng-template>\n", styles: [".hbll-header-dropdown-wrapper.hbll-header-desktop button{color:#002e5d;background-color:#fff;display:flex;justify-content:center;align-items:center;font-size:1.1em;font-weight:500;border:none;padding:.4em 1em;line-height:1.4em}.hbll-header-dropdown-wrapper.hbll-header-desktop button .hbll-header-icon{font-size:1.3em;margin-bottom:-.1em}.hbll-header-dropdown-wrapper.hbll-header-desktop button:hover{background-color:#0047ba;color:#fff}*{box-sizing:border-box;text-decoration:none;font-size:1em}*:not(.material-symbols-outlined){font-family:inherit}.hbll-header-dropdown-wrapper button{justify-content:flex-end;font-size:1.3em;color:#fff;display:flex;align-items:center;background-color:#0047ba;width:100%;padding:.6em;border-bottom:1px solid rgba(255,255,255,.3);border-left:none;border-right:none;border-top:none;white-space:nowrap;cursor:pointer}.hbll-header-dropdown-wrapper button .hbll-header-icon{margin-left:.2em}.hbll-header-dropdown-wrapper.hbll-header-desktop:hover button{background-color:#0047ba;color:#fff}.hbll-header-dropdown-wrapper.hbll-header-desktop .hbll-header-dropdown{position:absolute;z-index:11;width:100%;top:100%;left:0;background-color:#0047ba}\n"] }]
112
112
  }], propDecorators: { openEvent: [{
113
113
  type: Output
114
114
  }] } });
@@ -434,11 +434,11 @@ class NavBarComponent {
434
434
  });
435
435
  }
436
436
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.1.0", ngImport: i0, type: NavBarComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
437
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.1.0", type: NavBarComponent, isStandalone: true, selector: "lib-nav-bar", inputs: { mainSiteBaseUrl: { classPropertyName: "mainSiteBaseUrl", publicName: "mainSiteBaseUrl", isSignal: true, isRequired: true, transformFunction: null }, height: { classPropertyName: "height", publicName: "height", isSignal: true, isRequired: false, transformFunction: null } }, viewQueries: [{ propertyName: "dropdownComps", predicate: NavBarDropdownComponent, descendants: true }], ngImport: i0, template: "<nav\n [style]=\"{ height: height() ? height() + 'px' : 'auto' }\"\n [ngClass]=\"{ 'hbll-header-desktop': !isScreenSmall() }\"\n data-testid=\"nav\"\n>\n <ul class=\"hbll-header-nav-bar\">\n <li id=\"navHome\">\n <a [href]=\"mainSiteBaseUrl()\">\n @if (isScreenSmall()) {\n <span class=\"material-symbols-outlined hbll-header-icon\"> home </span>\n }\n Home\n </a>\n </li>\n @for (navInfo of navInfos(); track navInfo.title) {\n <li>\n <lib-nav-bar-dropdown\n [title]=\"navInfo.title\"\n [isSmallScreen]=\"isScreenSmall() ?? true\"\n (openEvent)=\"handleDropdownOpenEvent($event)\"\n >\n <div\n class=\"hbll-header-content\"\n [ngStyle]=\"{\n 'background-color': isScreenSmall() ? '#336cc8' : 'inherit',\n }\"\n >\n @if (navInfo.mainSection) {\n <section>\n <h2>{{ navInfo.mainSection.title }}</h2>\n <ul class=\"hbll-header-main hbll-header-links\">\n @for (link of navInfo.mainSection.links; track link.label) {\n <li>\n <a [href]=\"link.url\">\n {{ link.label }}\n </a>\n </li>\n }\n </ul>\n @if (navInfo.mainSection.auxiliaryLink) {\n <a\n class=\"hbll-header-see-all\"\n [href]=\"navInfo.mainSection.auxiliaryLink.url\"\n >\n {{ navInfo.mainSection.auxiliaryLink.label }}\n <span class=\"material-symbols-outlined hbll-header-icon\">\n chevron_right\n </span>\n </a>\n }\n </section>\n }\n @for (section of navInfo.otherSections; track section.title) {\n <section>\n <h3>{{ section.title }}</h3>\n <ul class=\"hbll-header-links\">\n @for (link of section.links; track link.label) {\n <li>\n <a [href]=\"link.url\">\n {{ link.label }}\n @if (link.icon) {\n <span\n class=\"material-symbols-outlined hbll-header-icon-right\"\n >\n {{ link.icon }}\n </span>\n }\n </a>\n </li>\n }\n </ul>\n </section>\n }\n </div>\n </lib-nav-bar-dropdown>\n </li>\n }\n <li>\n <a id=\"navSearch\" [href]=\"mainSiteBaseUrl + '/search'\">\n @if (isScreenSmall()) {\n Search\n }\n <span\n class=\"material-symbols-outlined\"\n [ngClass]=\"{ 'hbll-header-icon': isScreenSmall() }\"\n >\n search\n </span>\n </a>\n </li>\n </ul>\n</nav>\n", styles: ["nav.hbll-header-desktop .hbll-header-nav-bar li#navHome a,nav.hbll-header-desktop .hbll-header-nav-bar li #navSearch{color:#002e5d;background-color:#fff;display:flex;justify-content:center;align-items:center;font-size:1.1em;font-weight:500;border:none;padding:.4em 1em;line-height:1.4em}nav.hbll-header-desktop .hbll-header-nav-bar li#navHome a .hbll-header-icon,nav.hbll-header-desktop .hbll-header-nav-bar li #navSearch .hbll-header-icon{font-size:1.3em;margin-bottom:-.1em}nav.hbll-header-desktop .hbll-header-nav-bar li#navHome a:hover,nav.hbll-header-desktop .hbll-header-nav-bar li #navSearch:hover{background-color:#0047ba;color:#fff}*{box-sizing:border-box;text-decoration:none}*:not(.material-symbols-outlined){font-family:inherit}.hbll-header-icon-right{margin-left:.4em;font-size:1.2em}nav{background-color:#0047ba;position:absolute;overflow-y:scroll;overflow-x:hidden;scrollbar-width:none;width:100vw;max-width:400px;right:0}nav li{list-style-type:none}nav ::-webkit-scrollbar{display:none}nav .hbll-header-nav-bar{display:flex;flex-direction:column;align-items:flex-end;margin:0;padding:0}nav .hbll-header-nav-bar .hbll-header-links{padding:0}nav .hbll-header-nav-bar li{width:100%}nav .hbll-header-nav-bar li#navHome .hbll-header-icon{margin-right:.2em}nav .hbll-header-nav-bar li a{color:#fff;display:flex;align-items:center;width:100%;padding:.6em}nav .hbll-header-nav-bar li #navSearch{justify-content:flex-end;font-size:1.3em}nav .hbll-header-nav-bar li #navSearch .hbll-header-icon{margin-left:.2em}nav .hbll-header-nav-bar li .hbll-header-content{border-bottom:1px solid rgba(255,255,255,.3);padding-bottom:1.4em}nav .hbll-header-nav-bar li .hbll-header-content section{padding-left:3em}nav .hbll-header-nav-bar li .hbll-header-content section:first-of-type{padding-top:1em}nav .hbll-header-nav-bar li .hbll-header-content section h2,nav .hbll-header-nav-bar li .hbll-header-content section h3{font-weight:600;font-size:1.4em;margin-bottom:.4em}nav .hbll-header-nav-bar li .hbll-header-content section+section{margin-top:1.8em}nav .hbll-header-nav-bar li .hbll-header-content section li a{padding:.6em .8em;margin:.2em 0}nav .hbll-header-nav-bar li .hbll-header-content section .hbll-header-see-all{border-top:1px solid rgba(255,255,255,.3);justify-content:flex-end}nav .hbll-header-nav-bar li .hbll-header-content section .hbll-header-no-see-all{margin-bottom:1em}nav .hbll-header-nav-bar li .hbll-header-content section .hbll-header-main{padding-bottom:.4em}nav.hbll-header-desktop{overflow:initial;background-color:#fff;padding:0 2em;position:relative;max-width:100%}nav.hbll-header-desktop .hbll-header-nav-bar{flex-direction:row;align-items:center}nav.hbll-header-desktop .hbll-header-nav-bar .hbll-header-links{background-color:#0047ba;display:flex;flex-direction:column;align-items:flex-start}nav.hbll-header-desktop .hbll-header-nav-bar .hbll-header-links li{width:100%}nav.hbll-header-desktop .hbll-header-nav-bar .hbll-header-links li a{transition:background-color .1s ease-in-out}nav.hbll-header-desktop .hbll-header-nav-bar .hbll-header-links li a:hover{background-color:#fff3;width:100%}nav.hbll-header-desktop .hbll-header-nav-bar li{width:auto;height:100%}nav.hbll-header-desktop .hbll-header-nav-bar li #navSearch{transition:all .2s ease-in-out;font-size:.8em;background-color:transparent}nav.hbll-header-desktop .hbll-header-nav-bar li #navSearch:hover{background-color:transparent;transform:scale(115%);color:#0047ba}nav.hbll-header-desktop .hbll-header-nav-bar li .hbll-header-content{display:flex;justify-content:center;padding-top:1.4em;padding-right:10%;padding-left:10%}nav.hbll-header-desktop .hbll-header-nav-bar li .hbll-header-content section{padding-top:0;padding-left:5%;width:30em}nav.hbll-header-desktop .hbll-header-nav-bar li .hbll-header-content section+section{border-left:1px solid rgba(255,255,255,.3);margin-top:0}nav.hbll-header-desktop .hbll-header-nav-bar li .hbll-header-content section .hbll-header-see-all{margin-right:1em;transition:color .1s ease-in-out;width:auto}nav.hbll-header-desktop .hbll-header-nav-bar li .hbll-header-content section .hbll-header-see-all:hover{color:#ffffffd9}nav.hbll-header-desktop .hbll-header-nav-bar li .hbll-header-content h2,nav.hbll-header-desktop .hbll-header-nav-bar li .hbll-header-content h3{color:#fff}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "component", type: NavBarDropdownComponent, selector: "lib-nav-bar-dropdown", inputs: ["title", "isSmallScreen"], outputs: ["openEvent"] }] }); }
437
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.1.0", type: NavBarComponent, isStandalone: true, selector: "lib-nav-bar", inputs: { mainSiteBaseUrl: { classPropertyName: "mainSiteBaseUrl", publicName: "mainSiteBaseUrl", isSignal: true, isRequired: true, transformFunction: null }, height: { classPropertyName: "height", publicName: "height", isSignal: true, isRequired: false, transformFunction: null } }, viewQueries: [{ propertyName: "dropdownComps", predicate: NavBarDropdownComponent, descendants: true }], ngImport: i0, template: "<nav\n [style]=\"{ height: height() ? height() + 'px' : 'auto' }\"\n [ngClass]=\"{ 'hbll-header-desktop': !isScreenSmall() }\"\n data-testid=\"nav\"\n>\n <ul class=\"hbll-header-nav-bar\">\n <li id=\"navHome\">\n <a [href]=\"mainSiteBaseUrl()\">\n @if (isScreenSmall()) {\n <span class=\"material-symbols-outlined hbll-header-icon\"> home </span>\n }\n Home\n </a>\n </li>\n @for (navInfo of navInfos(); track navInfo.title) {\n <li>\n <lib-nav-bar-dropdown\n [title]=\"navInfo.title\"\n [isSmallScreen]=\"isScreenSmall() ?? true\"\n (openEvent)=\"handleDropdownOpenEvent($event)\"\n >\n <div\n class=\"hbll-header-content\"\n [ngStyle]=\"{\n 'background-color': isScreenSmall() ? '#336cc8' : 'inherit',\n }\"\n >\n @if (navInfo.mainSection) {\n <section>\n <h2>{{ navInfo.mainSection.title }}</h2>\n <ul class=\"hbll-header-main hbll-header-links\">\n @for (link of navInfo.mainSection.links; track link.label) {\n <li>\n <a [href]=\"link.url\">\n {{ link.label }}\n </a>\n </li>\n }\n </ul>\n @if (navInfo.mainSection.auxiliaryLink) {\n <a\n class=\"hbll-header-see-all\"\n [href]=\"navInfo.mainSection.auxiliaryLink.url\"\n >\n {{ navInfo.mainSection.auxiliaryLink.label }}\n <span class=\"material-symbols-outlined hbll-header-icon\">\n chevron_right\n </span>\n </a>\n }\n </section>\n }\n @for (section of navInfo.otherSections; track section.title) {\n <section>\n <h3>{{ section.title }}</h3>\n <ul class=\"hbll-header-links\">\n @for (link of section.links; track link.label) {\n <li>\n <a [href]=\"link.url\">\n {{ link.label }}\n @if (link.icon) {\n <span\n class=\"material-symbols-outlined hbll-header-icon-right\"\n >\n {{ link.icon }}\n </span>\n }\n </a>\n </li>\n }\n </ul>\n </section>\n }\n </div>\n </lib-nav-bar-dropdown>\n </li>\n }\n <li>\n <a id=\"navSearch\" href=\"https://lib.byu.edu/search\">\n @if (isScreenSmall()) {\n Search\n }\n <span\n class=\"material-symbols-outlined\"\n [ngClass]=\"{ 'hbll-header-icon': isScreenSmall() }\"\n >\n search\n </span>\n </a>\n </li>\n </ul>\n</nav>\n", styles: ["nav.hbll-header-desktop .hbll-header-nav-bar li#navHome a,nav.hbll-header-desktop .hbll-header-nav-bar li #navSearch{color:#002e5d;background-color:#fff;display:flex;justify-content:center;align-items:center;font-size:1.1em;font-weight:500;border:none;padding:.4em 1em;line-height:1.4em}nav.hbll-header-desktop .hbll-header-nav-bar li#navHome a .hbll-header-icon,nav.hbll-header-desktop .hbll-header-nav-bar li #navSearch .hbll-header-icon{font-size:1.3em;margin-bottom:-.1em}nav.hbll-header-desktop .hbll-header-nav-bar li#navHome a:hover,nav.hbll-header-desktop .hbll-header-nav-bar li #navSearch:hover{background-color:#0047ba;color:#fff}*{box-sizing:border-box;text-decoration:none;font-size:1em}*:not(.material-symbols-outlined){font-family:inherit}.hbll-header-icon-right{margin-left:.4em;font-size:1.2em}nav{background-color:#0047ba;position:absolute;overflow-y:scroll;overflow-x:hidden;scrollbar-width:none;width:100vw;max-width:400px;right:0}nav li{list-style-type:none}nav ::-webkit-scrollbar{display:none}nav .hbll-header-nav-bar{display:flex;flex-direction:column;align-items:flex-end;margin:0;padding:0}nav .hbll-header-nav-bar .hbll-header-links{padding:0}nav .hbll-header-nav-bar li{width:100%}nav .hbll-header-nav-bar li#navHome .hbll-header-icon{margin-right:.2em}nav .hbll-header-nav-bar li a{color:#fff;display:flex;align-items:center;width:100%;padding:.6em}nav .hbll-header-nav-bar li #navSearch{justify-content:flex-end;font-size:1.3em}nav .hbll-header-nav-bar li #navSearch .hbll-header-icon{margin-left:.2em}nav .hbll-header-nav-bar li .hbll-header-content{border-bottom:1px solid rgba(255,255,255,.3);padding-bottom:1.4em}nav .hbll-header-nav-bar li .hbll-header-content section{padding-left:3em}nav .hbll-header-nav-bar li .hbll-header-content section:first-of-type{padding-top:1em}nav .hbll-header-nav-bar li .hbll-header-content section h2,nav .hbll-header-nav-bar li .hbll-header-content section h3{font-weight:600;font-size:1.4em;margin-bottom:.4em}nav .hbll-header-nav-bar li .hbll-header-content section+section{margin-top:1.8em}nav .hbll-header-nav-bar li .hbll-header-content section li a{padding:.6em .8em;margin:.2em 0}nav .hbll-header-nav-bar li .hbll-header-content section .hbll-header-see-all{border-top:1px solid rgba(255,255,255,.3);justify-content:flex-end}nav .hbll-header-nav-bar li .hbll-header-content section .hbll-header-no-see-all{margin-bottom:1em}nav .hbll-header-nav-bar li .hbll-header-content section .hbll-header-main{padding-bottom:.4em}nav.hbll-header-desktop{overflow:initial;background-color:#fff;padding:0 2em;position:relative;max-width:100%}nav.hbll-header-desktop .hbll-header-nav-bar{flex-direction:row;align-items:center}nav.hbll-header-desktop .hbll-header-nav-bar .hbll-header-links{background-color:#0047ba;display:flex;flex-direction:column;align-items:flex-start}nav.hbll-header-desktop .hbll-header-nav-bar .hbll-header-links li{width:100%}nav.hbll-header-desktop .hbll-header-nav-bar .hbll-header-links li a{transition:background-color .1s ease-in-out}nav.hbll-header-desktop .hbll-header-nav-bar .hbll-header-links li a:hover{background-color:#fff3;width:100%}nav.hbll-header-desktop .hbll-header-nav-bar li{width:auto;height:100%}nav.hbll-header-desktop .hbll-header-nav-bar li #navSearch{transition:all .2s ease-in-out;font-size:1.2em;background-color:transparent}nav.hbll-header-desktop .hbll-header-nav-bar li #navSearch:hover{background-color:transparent;transform:scale(115%);color:#0047ba}nav.hbll-header-desktop .hbll-header-nav-bar li .hbll-header-content{display:flex;justify-content:center;padding-top:1.4em;padding-right:10%;padding-left:10%}nav.hbll-header-desktop .hbll-header-nav-bar li .hbll-header-content section{padding-top:0;padding-left:5%;width:30em}nav.hbll-header-desktop .hbll-header-nav-bar li .hbll-header-content section+section{border-left:1px solid rgba(255,255,255,.3);margin-top:0}nav.hbll-header-desktop .hbll-header-nav-bar li .hbll-header-content section .hbll-header-see-all{margin-right:1em;transition:color .1s ease-in-out;width:auto}nav.hbll-header-desktop .hbll-header-nav-bar li .hbll-header-content section .hbll-header-see-all:hover{color:#ffffffd9}nav.hbll-header-desktop .hbll-header-nav-bar li .hbll-header-content h2,nav.hbll-header-desktop .hbll-header-nav-bar li .hbll-header-content h3{color:#fff}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "component", type: NavBarDropdownComponent, selector: "lib-nav-bar-dropdown", inputs: ["title", "isSmallScreen"], outputs: ["openEvent"] }] }); }
438
438
  }
439
439
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.1.0", ngImport: i0, type: NavBarComponent, decorators: [{
440
440
  type: Component,
441
- args: [{ selector: 'lib-nav-bar', standalone: true, imports: [CommonModule, NavBarDropdownComponent], template: "<nav\n [style]=\"{ height: height() ? height() + 'px' : 'auto' }\"\n [ngClass]=\"{ 'hbll-header-desktop': !isScreenSmall() }\"\n data-testid=\"nav\"\n>\n <ul class=\"hbll-header-nav-bar\">\n <li id=\"navHome\">\n <a [href]=\"mainSiteBaseUrl()\">\n @if (isScreenSmall()) {\n <span class=\"material-symbols-outlined hbll-header-icon\"> home </span>\n }\n Home\n </a>\n </li>\n @for (navInfo of navInfos(); track navInfo.title) {\n <li>\n <lib-nav-bar-dropdown\n [title]=\"navInfo.title\"\n [isSmallScreen]=\"isScreenSmall() ?? true\"\n (openEvent)=\"handleDropdownOpenEvent($event)\"\n >\n <div\n class=\"hbll-header-content\"\n [ngStyle]=\"{\n 'background-color': isScreenSmall() ? '#336cc8' : 'inherit',\n }\"\n >\n @if (navInfo.mainSection) {\n <section>\n <h2>{{ navInfo.mainSection.title }}</h2>\n <ul class=\"hbll-header-main hbll-header-links\">\n @for (link of navInfo.mainSection.links; track link.label) {\n <li>\n <a [href]=\"link.url\">\n {{ link.label }}\n </a>\n </li>\n }\n </ul>\n @if (navInfo.mainSection.auxiliaryLink) {\n <a\n class=\"hbll-header-see-all\"\n [href]=\"navInfo.mainSection.auxiliaryLink.url\"\n >\n {{ navInfo.mainSection.auxiliaryLink.label }}\n <span class=\"material-symbols-outlined hbll-header-icon\">\n chevron_right\n </span>\n </a>\n }\n </section>\n }\n @for (section of navInfo.otherSections; track section.title) {\n <section>\n <h3>{{ section.title }}</h3>\n <ul class=\"hbll-header-links\">\n @for (link of section.links; track link.label) {\n <li>\n <a [href]=\"link.url\">\n {{ link.label }}\n @if (link.icon) {\n <span\n class=\"material-symbols-outlined hbll-header-icon-right\"\n >\n {{ link.icon }}\n </span>\n }\n </a>\n </li>\n }\n </ul>\n </section>\n }\n </div>\n </lib-nav-bar-dropdown>\n </li>\n }\n <li>\n <a id=\"navSearch\" [href]=\"mainSiteBaseUrl + '/search'\">\n @if (isScreenSmall()) {\n Search\n }\n <span\n class=\"material-symbols-outlined\"\n [ngClass]=\"{ 'hbll-header-icon': isScreenSmall() }\"\n >\n search\n </span>\n </a>\n </li>\n </ul>\n</nav>\n", styles: ["nav.hbll-header-desktop .hbll-header-nav-bar li#navHome a,nav.hbll-header-desktop .hbll-header-nav-bar li #navSearch{color:#002e5d;background-color:#fff;display:flex;justify-content:center;align-items:center;font-size:1.1em;font-weight:500;border:none;padding:.4em 1em;line-height:1.4em}nav.hbll-header-desktop .hbll-header-nav-bar li#navHome a .hbll-header-icon,nav.hbll-header-desktop .hbll-header-nav-bar li #navSearch .hbll-header-icon{font-size:1.3em;margin-bottom:-.1em}nav.hbll-header-desktop .hbll-header-nav-bar li#navHome a:hover,nav.hbll-header-desktop .hbll-header-nav-bar li #navSearch:hover{background-color:#0047ba;color:#fff}*{box-sizing:border-box;text-decoration:none}*:not(.material-symbols-outlined){font-family:inherit}.hbll-header-icon-right{margin-left:.4em;font-size:1.2em}nav{background-color:#0047ba;position:absolute;overflow-y:scroll;overflow-x:hidden;scrollbar-width:none;width:100vw;max-width:400px;right:0}nav li{list-style-type:none}nav ::-webkit-scrollbar{display:none}nav .hbll-header-nav-bar{display:flex;flex-direction:column;align-items:flex-end;margin:0;padding:0}nav .hbll-header-nav-bar .hbll-header-links{padding:0}nav .hbll-header-nav-bar li{width:100%}nav .hbll-header-nav-bar li#navHome .hbll-header-icon{margin-right:.2em}nav .hbll-header-nav-bar li a{color:#fff;display:flex;align-items:center;width:100%;padding:.6em}nav .hbll-header-nav-bar li #navSearch{justify-content:flex-end;font-size:1.3em}nav .hbll-header-nav-bar li #navSearch .hbll-header-icon{margin-left:.2em}nav .hbll-header-nav-bar li .hbll-header-content{border-bottom:1px solid rgba(255,255,255,.3);padding-bottom:1.4em}nav .hbll-header-nav-bar li .hbll-header-content section{padding-left:3em}nav .hbll-header-nav-bar li .hbll-header-content section:first-of-type{padding-top:1em}nav .hbll-header-nav-bar li .hbll-header-content section h2,nav .hbll-header-nav-bar li .hbll-header-content section h3{font-weight:600;font-size:1.4em;margin-bottom:.4em}nav .hbll-header-nav-bar li .hbll-header-content section+section{margin-top:1.8em}nav .hbll-header-nav-bar li .hbll-header-content section li a{padding:.6em .8em;margin:.2em 0}nav .hbll-header-nav-bar li .hbll-header-content section .hbll-header-see-all{border-top:1px solid rgba(255,255,255,.3);justify-content:flex-end}nav .hbll-header-nav-bar li .hbll-header-content section .hbll-header-no-see-all{margin-bottom:1em}nav .hbll-header-nav-bar li .hbll-header-content section .hbll-header-main{padding-bottom:.4em}nav.hbll-header-desktop{overflow:initial;background-color:#fff;padding:0 2em;position:relative;max-width:100%}nav.hbll-header-desktop .hbll-header-nav-bar{flex-direction:row;align-items:center}nav.hbll-header-desktop .hbll-header-nav-bar .hbll-header-links{background-color:#0047ba;display:flex;flex-direction:column;align-items:flex-start}nav.hbll-header-desktop .hbll-header-nav-bar .hbll-header-links li{width:100%}nav.hbll-header-desktop .hbll-header-nav-bar .hbll-header-links li a{transition:background-color .1s ease-in-out}nav.hbll-header-desktop .hbll-header-nav-bar .hbll-header-links li a:hover{background-color:#fff3;width:100%}nav.hbll-header-desktop .hbll-header-nav-bar li{width:auto;height:100%}nav.hbll-header-desktop .hbll-header-nav-bar li #navSearch{transition:all .2s ease-in-out;font-size:.8em;background-color:transparent}nav.hbll-header-desktop .hbll-header-nav-bar li #navSearch:hover{background-color:transparent;transform:scale(115%);color:#0047ba}nav.hbll-header-desktop .hbll-header-nav-bar li .hbll-header-content{display:flex;justify-content:center;padding-top:1.4em;padding-right:10%;padding-left:10%}nav.hbll-header-desktop .hbll-header-nav-bar li .hbll-header-content section{padding-top:0;padding-left:5%;width:30em}nav.hbll-header-desktop .hbll-header-nav-bar li .hbll-header-content section+section{border-left:1px solid rgba(255,255,255,.3);margin-top:0}nav.hbll-header-desktop .hbll-header-nav-bar li .hbll-header-content section .hbll-header-see-all{margin-right:1em;transition:color .1s ease-in-out;width:auto}nav.hbll-header-desktop .hbll-header-nav-bar li .hbll-header-content section .hbll-header-see-all:hover{color:#ffffffd9}nav.hbll-header-desktop .hbll-header-nav-bar li .hbll-header-content h2,nav.hbll-header-desktop .hbll-header-nav-bar li .hbll-header-content h3{color:#fff}\n"] }]
441
+ args: [{ selector: 'lib-nav-bar', standalone: true, imports: [CommonModule, NavBarDropdownComponent], template: "<nav\n [style]=\"{ height: height() ? height() + 'px' : 'auto' }\"\n [ngClass]=\"{ 'hbll-header-desktop': !isScreenSmall() }\"\n data-testid=\"nav\"\n>\n <ul class=\"hbll-header-nav-bar\">\n <li id=\"navHome\">\n <a [href]=\"mainSiteBaseUrl()\">\n @if (isScreenSmall()) {\n <span class=\"material-symbols-outlined hbll-header-icon\"> home </span>\n }\n Home\n </a>\n </li>\n @for (navInfo of navInfos(); track navInfo.title) {\n <li>\n <lib-nav-bar-dropdown\n [title]=\"navInfo.title\"\n [isSmallScreen]=\"isScreenSmall() ?? true\"\n (openEvent)=\"handleDropdownOpenEvent($event)\"\n >\n <div\n class=\"hbll-header-content\"\n [ngStyle]=\"{\n 'background-color': isScreenSmall() ? '#336cc8' : 'inherit',\n }\"\n >\n @if (navInfo.mainSection) {\n <section>\n <h2>{{ navInfo.mainSection.title }}</h2>\n <ul class=\"hbll-header-main hbll-header-links\">\n @for (link of navInfo.mainSection.links; track link.label) {\n <li>\n <a [href]=\"link.url\">\n {{ link.label }}\n </a>\n </li>\n }\n </ul>\n @if (navInfo.mainSection.auxiliaryLink) {\n <a\n class=\"hbll-header-see-all\"\n [href]=\"navInfo.mainSection.auxiliaryLink.url\"\n >\n {{ navInfo.mainSection.auxiliaryLink.label }}\n <span class=\"material-symbols-outlined hbll-header-icon\">\n chevron_right\n </span>\n </a>\n }\n </section>\n }\n @for (section of navInfo.otherSections; track section.title) {\n <section>\n <h3>{{ section.title }}</h3>\n <ul class=\"hbll-header-links\">\n @for (link of section.links; track link.label) {\n <li>\n <a [href]=\"link.url\">\n {{ link.label }}\n @if (link.icon) {\n <span\n class=\"material-symbols-outlined hbll-header-icon-right\"\n >\n {{ link.icon }}\n </span>\n }\n </a>\n </li>\n }\n </ul>\n </section>\n }\n </div>\n </lib-nav-bar-dropdown>\n </li>\n }\n <li>\n <a id=\"navSearch\" href=\"https://lib.byu.edu/search\">\n @if (isScreenSmall()) {\n Search\n }\n <span\n class=\"material-symbols-outlined\"\n [ngClass]=\"{ 'hbll-header-icon': isScreenSmall() }\"\n >\n search\n </span>\n </a>\n </li>\n </ul>\n</nav>\n", styles: ["nav.hbll-header-desktop .hbll-header-nav-bar li#navHome a,nav.hbll-header-desktop .hbll-header-nav-bar li #navSearch{color:#002e5d;background-color:#fff;display:flex;justify-content:center;align-items:center;font-size:1.1em;font-weight:500;border:none;padding:.4em 1em;line-height:1.4em}nav.hbll-header-desktop .hbll-header-nav-bar li#navHome a .hbll-header-icon,nav.hbll-header-desktop .hbll-header-nav-bar li #navSearch .hbll-header-icon{font-size:1.3em;margin-bottom:-.1em}nav.hbll-header-desktop .hbll-header-nav-bar li#navHome a:hover,nav.hbll-header-desktop .hbll-header-nav-bar li #navSearch:hover{background-color:#0047ba;color:#fff}*{box-sizing:border-box;text-decoration:none;font-size:1em}*:not(.material-symbols-outlined){font-family:inherit}.hbll-header-icon-right{margin-left:.4em;font-size:1.2em}nav{background-color:#0047ba;position:absolute;overflow-y:scroll;overflow-x:hidden;scrollbar-width:none;width:100vw;max-width:400px;right:0}nav li{list-style-type:none}nav ::-webkit-scrollbar{display:none}nav .hbll-header-nav-bar{display:flex;flex-direction:column;align-items:flex-end;margin:0;padding:0}nav .hbll-header-nav-bar .hbll-header-links{padding:0}nav .hbll-header-nav-bar li{width:100%}nav .hbll-header-nav-bar li#navHome .hbll-header-icon{margin-right:.2em}nav .hbll-header-nav-bar li a{color:#fff;display:flex;align-items:center;width:100%;padding:.6em}nav .hbll-header-nav-bar li #navSearch{justify-content:flex-end;font-size:1.3em}nav .hbll-header-nav-bar li #navSearch .hbll-header-icon{margin-left:.2em}nav .hbll-header-nav-bar li .hbll-header-content{border-bottom:1px solid rgba(255,255,255,.3);padding-bottom:1.4em}nav .hbll-header-nav-bar li .hbll-header-content section{padding-left:3em}nav .hbll-header-nav-bar li .hbll-header-content section:first-of-type{padding-top:1em}nav .hbll-header-nav-bar li .hbll-header-content section h2,nav .hbll-header-nav-bar li .hbll-header-content section h3{font-weight:600;font-size:1.4em;margin-bottom:.4em}nav .hbll-header-nav-bar li .hbll-header-content section+section{margin-top:1.8em}nav .hbll-header-nav-bar li .hbll-header-content section li a{padding:.6em .8em;margin:.2em 0}nav .hbll-header-nav-bar li .hbll-header-content section .hbll-header-see-all{border-top:1px solid rgba(255,255,255,.3);justify-content:flex-end}nav .hbll-header-nav-bar li .hbll-header-content section .hbll-header-no-see-all{margin-bottom:1em}nav .hbll-header-nav-bar li .hbll-header-content section .hbll-header-main{padding-bottom:.4em}nav.hbll-header-desktop{overflow:initial;background-color:#fff;padding:0 2em;position:relative;max-width:100%}nav.hbll-header-desktop .hbll-header-nav-bar{flex-direction:row;align-items:center}nav.hbll-header-desktop .hbll-header-nav-bar .hbll-header-links{background-color:#0047ba;display:flex;flex-direction:column;align-items:flex-start}nav.hbll-header-desktop .hbll-header-nav-bar .hbll-header-links li{width:100%}nav.hbll-header-desktop .hbll-header-nav-bar .hbll-header-links li a{transition:background-color .1s ease-in-out}nav.hbll-header-desktop .hbll-header-nav-bar .hbll-header-links li a:hover{background-color:#fff3;width:100%}nav.hbll-header-desktop .hbll-header-nav-bar li{width:auto;height:100%}nav.hbll-header-desktop .hbll-header-nav-bar li #navSearch{transition:all .2s ease-in-out;font-size:1.2em;background-color:transparent}nav.hbll-header-desktop .hbll-header-nav-bar li #navSearch:hover{background-color:transparent;transform:scale(115%);color:#0047ba}nav.hbll-header-desktop .hbll-header-nav-bar li .hbll-header-content{display:flex;justify-content:center;padding-top:1.4em;padding-right:10%;padding-left:10%}nav.hbll-header-desktop .hbll-header-nav-bar li .hbll-header-content section{padding-top:0;padding-left:5%;width:30em}nav.hbll-header-desktop .hbll-header-nav-bar li .hbll-header-content section+section{border-left:1px solid rgba(255,255,255,.3);margin-top:0}nav.hbll-header-desktop .hbll-header-nav-bar li .hbll-header-content section .hbll-header-see-all{margin-right:1em;transition:color .1s ease-in-out;width:auto}nav.hbll-header-desktop .hbll-header-nav-bar li .hbll-header-content section .hbll-header-see-all:hover{color:#ffffffd9}nav.hbll-header-desktop .hbll-header-nav-bar li .hbll-header-content h2,nav.hbll-header-desktop .hbll-header-nav-bar li .hbll-header-content h3{color:#fff}\n"] }]
442
442
  }], propDecorators: { dropdownComps: [{
443
443
  type: ViewChildren,
444
444
  args: [NavBarDropdownComponent]
@@ -539,7 +539,7 @@ class HbllHeaderComponent {
539
539
  this.setMobileSidebarHeight();
540
540
  }
541
541
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.1.0", ngImport: i0, type: HbllHeaderComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
542
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.1.0", type: HbllHeaderComponent, isStandalone: true, selector: "lib-hbll-header", inputs: { name: { classPropertyName: "name", publicName: "name", isSignal: false, isRequired: false, transformFunction: null }, mainsitebaseurl: { classPropertyName: "mainsitebaseurl", publicName: "mainsitebaseurl", isSignal: false, isRequired: false, transformFunction: null }, showImpersonateButton: { classPropertyName: "showImpersonateButton", publicName: "showImpersonateButton", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { openImpersonationModal: "openImpersonationModal", login: "login", logout: "logout" }, host: { listeners: { "window:resize": "onResize($event)" } }, viewQueries: [{ propertyName: "accountInfoEl", first: true, predicate: ["accountInfo"], descendants: true, isSignal: true }, { propertyName: "hoursEl", first: true, predicate: ["hours"], descendants: true, isSignal: true }, { propertyName: "header", first: true, predicate: ["header"], descendants: true }], ngImport: i0, template: "<header\n role=\"banner\"\n class=\"hbll-header-wrapper\"\n #header\n [ngClass]=\"{ 'hbll-header-desktop': !isScreenSmall() }\"\n>\n <a [href]=\"mainsitebaseurl\">\n <h1>\n <img\n src=\"https://media.lib.byu.edu/web-assets/images/2.0.0/byu-hbll-logo-full.svg\"\n alt=\"BYU Library Logo\"\n />\n </h1>\n </a>\n <div id=\"libraryInfo\" class=\"hbll-header-wrapper\">\n @if (!isScreenSmall()) {\n <div #hours id=\"mainLibraryHours\" data-testid=\"desktopHours\">\n <button\n (click)=\"showLibraryHours = !showLibraryHours\"\n class=\"hbll-header-wrapper\"\n data-testid=\"hoursBtn\"\n >\n <ng-container *ngTemplateOutlet=\"hoursTextBlock\"></ng-container>\n </button>\n @if (!isScreenSmall() && showLibraryHours) {\n <div\n @libHbllFadeInOut\n id=\"libraryHoursDropdown\"\n data-testid=\"libraryHoursDropdown\"\n >\n <section class=\"hbll-header-section\">\n <h2 class=\"hbll-header-header\">Regular Hours</h2>\n <div class=\"hbll-header-detail\">\n <h3 class=\"hbll-header-item\">Monday - Friday</h3>\n <h3 class=\"hbll-header-item\">Saturday</h3>\n <h3 class=\"hbll-header-item\">Sunday</h3>\n </div>\n <div class=\"hbll-header-hours\">\n <div class=\"hbll-header-item\">7 a.m - midnight</div>\n <div class=\"hbll-header-item\">8 a.m - midnight</div>\n <div class=\"hbll-header-item\">Closed*</div>\n </div>\n <div class=\"hbll-header-hours-note\">\n * Family history ONLY 4 p.m. - 8 p.m\n <ul>\n <li><span>No checkouts after 11:45 p.m.</span></li>\n <li>\n <span>All services closed 10:45 to noon on Tuesdays</span>\n </li>\n </ul>\n </div>\n </section>\n <section class=\"hbll-header-section\">\n <h2 class=\"hbll-header-header\">Upcoming Exceptions</h2>\n @if (hoursExceptions$ | async; as exceptions) {\n <div class=\"hbll-header-detail\" data-testid=\"exceptionsDetail\">\n @for (exception of exceptions; track exception.date) {\n <h3 class=\"hbll-header-item\">\n {{ exception.date | date: 'MMM. d, YYYY' }}\n </h3>\n } @empty {\n No upcoming exceptions\n }\n </div>\n <div class=\"hbll-header-hours\" data-testid=\"exceptionsHours\">\n @for (exception of exceptions; track exception.date) {\n <div class=\"hbll-header-item\">\n {{ exception.exception_title }}\n </div>\n }\n </div>\n } @else {\n <div class=\"lib-spinner\" data-testid=\"exceptionsSpinner\"></div>\n }\n </section>\n <section class=\"hbll-header-section\">\n <h2 class=\"hbll-header-header\">Library Cafe</h2>\n <div class=\"hbll-header-detail\">\n <h3 class=\"hbll-header-item\">Bagel Bubble</h3>\n <h3 class=\"hbll-header-item\">Provecho</h3>\n </div>\n <div class=\"hbll-header-hours\">\n <div class=\"hbll-header-item\">7 a.m - 11 p.m.</div>\n <div class=\"hbll-header-item\">10:30 a.m - 2 p.m.</div>\n </div>\n </section>\n <a [href]=\"mainsitebaseurl + '/about/hours'\"\n >See all hours\n <span class=\"material-symbols-outlined\"> chevron_right </span></a\n >\n </div>\n }\n </div>\n }\n <div id=\"accountInfo\" #accountInfo>\n <button\n (click)=\"isLoggedIn ? (showAccountDropdown = !showAccountDropdown) : login.emit()\"\n class=\"hbll-header-wrapper\"\n id=\"accountBtn\"\n data-testid=\"accountBtn\"\n >\n <span class=\"material-symbols-outlined hbll-header-icon\"> person </span>\n @if (!isScreenSmall()) {\n <span class=\"hbll-header-name\" data-testid=\"name\">{{\n isLoggedIn ? '&nbsp;' + name : 'Login'\n }}</span>\n }\n @if (isLoggedIn) {\n <span class=\"material-symbols-outlined\" data-testid=\"loginDropdown\">\n arrow_drop_down\n </span>\n }\n </button>\n @if (isLoggedIn && showAccountDropdown) {\n <div @libHbllFadeInOut id=\"accountDropdown\" data-testid=\"accountDropdown\">\n <a [href]=\"mainsitebaseurl + '/account'\">My Account</a>\n <a [href]=\"mainsitebaseurl + '/account'\">My Items</a>\n <a [href]=\"mainsitebaseurl + '/account/request'\">Request an item</a>\n <a [href]=\"mainsitebaseurl + '/account/saved'\">Saved</a>\n <a [href]=\"mainsitebaseurl + '/account/course'\">Courses</a>\n <a [href]=\"mainsitebaseurl + '/account/rooms'\">Rooms</a>\n <a [href]=\"mainsitebaseurl + '/account/preferences'\">Preferences</a>\n @if (showImpersonateButton()) {\n <button\n (click)=\"openImpersonationModal.emit(); showAccountDropdown = false\"\n class=\"hbll-header-impersonate-btn\"\n >\n Impersonate\n </button>\n }\n <button (click)=\"logout.emit()\" data-testid=\"logout\">Logout</button>\n </div>\n }\n </div>\n @if (isScreenSmall()) {\n <div id=\"mobileNav\">\n <button\n class=\"hbll-header-wrapper\"\n data-testid=\"mobileNavBtn\"\n (click)=\"openSidebarNav()\"\n >\n <span class=\"material-symbols-outlined hbll-header-icon\"> menu </span>\n </button>\n @if (showNavBar) {\n <div\n id=\"navWrapper\"\n data-testid=\"mobileNav\"\n [@libHbllSlideInOutRightLeft]=\"{\n value: '',\n params: { xOffset: '400px' },\n }\"\n >\n <button\n id=\"closeMobileNavBtn\"\n class=\"hbll-header-wrapper\"\n data-testid=\"closeMobileNavBtn\"\n (click)=\"closeSidebarNav()\"\n >\n <span class=\"material-symbols-outlined hbll-header-icon\"> close </span>\n </button>\n <lib-nav-bar\n [mainSiteBaseUrl]=\"mainsitebaseurl\"\n [height]=\"mobileSidebarHeight\"\n />\n </div>\n <div\n @libHbllFadeInOut\n (click)=\"showNavBar = false\"\n class=\"hbll-nav-backdrop\"\n data-testid=\"mobileNavBackdrop\"\n ></div>\n }\n </div>\n }\n </div>\n</header>\n\n@if (!isScreenSmall()) {\n <div id=\"mainNav\">\n <lib-nav-bar [mainSiteBaseUrl]=\"mainsitebaseurl\" />\n </div>\n}\n@if (isScreenSmall()) {\n <a\n id=\"mobileLibraryHours\"\n [href]=\"mainsitebaseurl + '/about/hours'\"\n class=\"hbll-header-wrapper\"\n data-testid=\"mobileHours\"\n >\n <ng-container *ngTemplateOutlet=\"hoursTextBlock\"></ng-container>\n </a>\n}\n\n<ng-template #hoursTextBlock>\n @if (libraryHours()) {\n <span class=\"material-symbols-outlined hbll-header-left-icon\"> schedule </span>\n {{\n libraryHours()?.is_closed\n ? 'CLOSED'\n : \"Today's hours: \" +\n (libraryHours()!.date | libraryHours: libraryHours()!.open_time) +\n ' - ' +\n (libraryHours()!.date | libraryHours: libraryHours()!.close_time)\n }}\n }\n</ng-template>\n", styles: [".lib-spinner{border:.3em solid #dfe9f7;border-top:.3em solid #4070b0;border-radius:100%;width:30px;height:30px;animation:loadingSpinnerAnimate 1s ease infinite;position:relative}@keyframes loadingSpinnerAnimate{0%{transform:rotate(0)}to{transform:rotate(360deg)}}*{box-sizing:border-box;text-decoration:none}*:not(.material-symbols-outlined){font-family:inherit}.hbll-header-wrapper{display:flex;align-items:center;font-size:1em}.hbll-nav-backdrop{background-color:#000;opacity:.3;height:100vh;width:100vw;left:0;top:0;transform:translate(-100vw);position:absolute;z-index:-1}#mobileLibraryHours{color:#141414;background-color:#e6e6e6;font-size:1em;min-height:2em}#mobileLibraryHours.hbll-header-wrapper{width:100%;justify-content:center;padding:.2em}.hbll-header-icon,.hbll-header-left-icon{font-size:1.2em}.hbll-header-left-icon{margin-right:.2em}header{background-color:#002e5d;display:flex;align-items:center;position:relative;z-index:10000}header a h1{font-size:100%;margin:0;height:1.8em}header a h1 img{height:100%;padding:0 0 0 .6em}header #libraryInfo{margin-left:auto;color:#fff}header #libraryInfo a,header #libraryInfo button{transition:color .2s ease-in-out;color:#fffc}header #libraryInfo a:hover,header #libraryInfo button:hover{color:#fff}header #libraryInfo #accountInfo button,header #libraryInfo #mobileNav button{padding:.8em .6em}header #libraryInfo #accountBtn .name{margin-left:.4em}header #libraryInfo #mobileNav{position:relative;z-index:11}header #libraryInfo #mobileNav #navWrapper{color:#fff;position:absolute;top:0;right:0}header #libraryInfo #mobileNav #navWrapper #closeMobileNavBtn{background-color:#0047ba;margin-left:auto;padding-left:.9em}header #libraryInfo :last-child button{padding-right:1em!important}header #libraryInfo .hbll-header-icon,header #libraryInfo .hbll-header-left-icon{font-size:1.6em}header #libraryInfo #accountInfo{position:relative}header #libraryInfo #accountInfo #accountDropdown{font-size:1em;text-wrap:nowrap;position:absolute;background-color:#002e5d;top:100%;right:-32px;z-index:11;background-color:#233753}header #libraryInfo #accountInfo #accountDropdown .hbll-header-impersonate-btn{color:#ca7ad1cc}header #libraryInfo #accountInfo #accountDropdown .hbll-header-impersonate-btn:hover{color:#ca7ad1}header #libraryInfo #accountInfo #accountDropdown a,header #libraryInfo #accountInfo #accountDropdown button{display:block;width:100%;text-align:left;padding:.4em 1.2em;font-size:1.1em}header #libraryInfo #accountInfo #accountDropdown a:first-child,header #libraryInfo #accountInfo #accountDropdown button:first-child{margin-bottom:.4em;padding-top:.6em;padding-bottom:.6em;border-bottom:1px solid rgba(255,255,255,.3)}header #libraryInfo #accountInfo #accountDropdown a:last-child,header #libraryInfo #accountInfo #accountDropdown button:last-child{margin-top:.4em;border-top:1px solid rgba(255,255,255,.3);padding-top:.6em;padding-bottom:.6em}header #libraryInfo #accountInfo #accountDropdown:before{content:\"\";width:0;height:0;border-style:solid;border-width:0 .6em .6em .6em;border-color:transparent transparent hsl(214,41%,23%) transparent;position:absolute;bottom:100%;right:50%;transform:translate(50%);z-index:inherit}header.hbll-header-desktop{padding:0 2em}header.hbll-header-desktop #libraryInfo #mainLibraryHours{position:relative;margin-right:1em}header.hbll-header-desktop #libraryInfo #mainLibraryHours #libraryHoursDropdown{z-index:11;background-color:#fff;border-radius:4px;border:1px solid #d2d2d2;position:absolute;color:#000;padding:2em;top:100%;max-width:400%;right:50%;transform:translate(50%);margin-top:.6em}header.hbll-header-desktop #libraryInfo #mainLibraryHours #libraryHoursDropdown .hbll-header-section{display:grid;grid-template-columns:repeat(3,9em);grid-template-rows:1fr;grid-column-gap:0px;grid-row-gap:0px;margin-bottom:1em}header.hbll-header-desktop #libraryInfo #mainLibraryHours #libraryHoursDropdown .hbll-header-section h2{margin:0}header.hbll-header-desktop #libraryInfo #mainLibraryHours #libraryHoursDropdown .hbll-header-section .hbll-header-hours-note{grid-column:2/4;font-size:.8em;margin-top:1em}header.hbll-header-desktop #libraryInfo #mainLibraryHours #libraryHoursDropdown .hbll-header-section .hbll-header-hours-note ul{list-style-type:disc;list-style-position:inside;margin-left:.8em;padding:0}header.hbll-header-desktop #libraryInfo #mainLibraryHours #libraryHoursDropdown .hbll-header-section .hbll-header-hours-note ul li span{left:-8px;position:relative}header.hbll-header-desktop #libraryInfo #mainLibraryHours #libraryHoursDropdown .hbll-header-section .hbll-header-header{font-weight:600;font-size:1.2em}header.hbll-header-desktop #libraryInfo #mainLibraryHours #libraryHoursDropdown .hbll-header-section .hbll-header-detail,header.hbll-header-desktop #libraryInfo #mainLibraryHours #libraryHoursDropdown .hbll-header-section .hbll-header-hours{margin-top:.2em}header.hbll-header-desktop #libraryInfo #mainLibraryHours #libraryHoursDropdown .hbll-header-section .hbll-header-detail .hbll-header-item+.hbll-header-item,header.hbll-header-desktop #libraryInfo #mainLibraryHours #libraryHoursDropdown .hbll-header-section .hbll-header-hours .hbll-header-item+.hbll-header-item{margin-top:.3em}header.hbll-header-desktop #libraryInfo #mainLibraryHours #libraryHoursDropdown .hbll-header-section .hbll-header-detail h3,header.hbll-header-desktop #libraryInfo #mainLibraryHours #libraryHoursDropdown .hbll-header-section .hbll-header-hours h3{margin:0;font-size:inherit}header.hbll-header-desktop #libraryInfo #mainLibraryHours #libraryHoursDropdown .hbll-header-section .hbll-header-detail{font-weight:600;white-space:nowrap}header.hbll-header-desktop #libraryInfo #mainLibraryHours #libraryHoursDropdown .hbll-header-section .hbll-header-hours{white-space:nowrap}header.hbll-header-desktop #libraryInfo #mainLibraryHours #libraryHoursDropdown a{color:#4070b0;display:flex;align-items:center;float:right}header.hbll-header-desktop #libraryInfo #mainLibraryHours #libraryHoursDropdown a:hover{color:#6892ca}header.hbll-header-desktop #libraryInfo #accountInfo #accountDropdown{right:auto;left:50%;transform:translate(-50%)}button{background-color:transparent;border:none;cursor:pointer;font-family:inherit;font-size:inherit;color:inherit;padding:0}\n"], dependencies: [{ kind: "pipe", type: DatePipe, name: "date" }, { kind: "pipe", type: LibraryHoursPipe, name: "libraryHours" }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }, { kind: "component", type: NavBarComponent, selector: "lib-nav-bar", inputs: ["mainSiteBaseUrl", "height"] }], animations: [libHbllSlideInOutRightLeft, libHbllFadeInOut] }); }
542
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.1.0", type: HbllHeaderComponent, isStandalone: true, selector: "lib-hbll-header", inputs: { name: { classPropertyName: "name", publicName: "name", isSignal: false, isRequired: false, transformFunction: null }, mainsitebaseurl: { classPropertyName: "mainsitebaseurl", publicName: "mainsitebaseurl", isSignal: false, isRequired: false, transformFunction: null }, showImpersonateButton: { classPropertyName: "showImpersonateButton", publicName: "showImpersonateButton", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { openImpersonationModal: "openImpersonationModal", login: "login", logout: "logout" }, host: { listeners: { "window:resize": "onResize($event)" } }, viewQueries: [{ propertyName: "accountInfoEl", first: true, predicate: ["accountInfo"], descendants: true, isSignal: true }, { propertyName: "hoursEl", first: true, predicate: ["hours"], descendants: true, isSignal: true }, { propertyName: "header", first: true, predicate: ["header"], descendants: true }], ngImport: i0, template: "<header\n role=\"banner\"\n class=\"hbll-header-wrapper\"\n #header\n [ngClass]=\"{ 'hbll-header-desktop': !isScreenSmall() }\"\n>\n <a [href]=\"mainsitebaseurl\">\n <h1>\n <img\n src=\"https://media.lib.byu.edu/web-assets/images/2.0.0/byu-hbll-logo-full.svg\"\n alt=\"BYU Library Logo\"\n />\n </h1>\n </a>\n <div id=\"libraryInfo\" class=\"hbll-header-wrapper\">\n @if (!isScreenSmall()) {\n <div #hours id=\"mainLibraryHours\" data-testid=\"desktopHours\">\n <button\n (click)=\"showLibraryHours = !showLibraryHours\"\n class=\"hbll-header-wrapper\"\n data-testid=\"hoursBtn\"\n >\n <ng-container *ngTemplateOutlet=\"hoursTextBlock\"></ng-container>\n </button>\n @if (!isScreenSmall() && showLibraryHours) {\n <div\n @libHbllFadeInOut\n id=\"libraryHoursDropdown\"\n data-testid=\"libraryHoursDropdown\"\n >\n <section class=\"hbll-header-section\">\n <h2 class=\"hbll-header-header\">Regular Hours</h2>\n <div class=\"hbll-header-detail\">\n <h3 class=\"hbll-header-item\">Monday - Friday</h3>\n <h3 class=\"hbll-header-item\">Saturday</h3>\n <h3 class=\"hbll-header-item\">Sunday</h3>\n </div>\n <div class=\"hbll-header-hours\">\n <div class=\"hbll-header-item\">7 a.m - midnight</div>\n <div class=\"hbll-header-item\">8 a.m - midnight</div>\n <div class=\"hbll-header-item\">Closed*</div>\n </div>\n <div class=\"hbll-header-hours-note\">\n * Family history ONLY 4 p.m. - 8 p.m\n <ul>\n <li><span>No checkouts after 11:45 p.m.</span></li>\n <li>\n <span>All services closed 10:45 to noon on Tuesdays</span>\n </li>\n </ul>\n </div>\n </section>\n <section class=\"hbll-header-section\">\n <h2 class=\"hbll-header-header\">Upcoming Exceptions</h2>\n @if (hoursExceptions$ | async; as exceptions) {\n <div class=\"hbll-header-detail\" data-testid=\"exceptionsDetail\">\n @for (exception of exceptions; track exception.date) {\n <h3 class=\"hbll-header-item\">\n {{ exception.date | date: 'MMM. d, YYYY' }}\n </h3>\n } @empty {\n No upcoming exceptions\n }\n </div>\n <div class=\"hbll-header-hours\" data-testid=\"exceptionsHours\">\n @for (exception of exceptions; track exception.date) {\n <div class=\"hbll-header-item\">\n {{ exception.exception_title }}\n </div>\n }\n </div>\n } @else {\n <div class=\"lib-spinner\" data-testid=\"exceptionsSpinner\"></div>\n }\n </section>\n <section class=\"hbll-header-section\">\n <h2 class=\"hbll-header-header\">Library Cafe</h2>\n <div class=\"hbll-header-detail\">\n <h3 class=\"hbll-header-item\">Bagel Bubble</h3>\n <h3 class=\"hbll-header-item\">Provecho</h3>\n </div>\n <div class=\"hbll-header-hours\">\n <div class=\"hbll-header-item\">7 a.m - 11 p.m.</div>\n <div class=\"hbll-header-item\">10:30 a.m - 2 p.m.</div>\n </div>\n </section>\n <a [href]=\"mainsitebaseurl + '/about/hours'\"\n >See all hours\n <span class=\"material-symbols-outlined\"> chevron_right </span></a\n >\n </div>\n }\n </div>\n }\n <div id=\"accountInfo\" #accountInfo>\n <button\n (click)=\"isLoggedIn ? (showAccountDropdown = !showAccountDropdown) : login.emit()\"\n class=\"hbll-header-wrapper\"\n id=\"accountBtn\"\n data-testid=\"accountBtn\"\n >\n <span class=\"material-symbols-outlined hbll-header-icon\"> person </span>\n @if (!isScreenSmall()) {\n <span class=\"hbll-header-name\" data-testid=\"name\">{{\n isLoggedIn ? '&nbsp;' + name : 'Login'\n }}</span>\n }\n @if (isLoggedIn) {\n <span class=\"material-symbols-outlined\" data-testid=\"loginDropdown\">\n arrow_drop_down\n </span>\n }\n </button>\n @if (isLoggedIn && showAccountDropdown) {\n <div @libHbllFadeInOut id=\"accountDropdown\" data-testid=\"accountDropdown\">\n <a [href]=\"mainsitebaseurl + '/account'\">My Account</a>\n <a [href]=\"mainsitebaseurl + '/account'\">My Items</a>\n <a [href]=\"mainsitebaseurl + '/account/request'\">Request an item</a>\n <a [href]=\"mainsitebaseurl + '/account/saved'\">Saved</a>\n <a [href]=\"mainsitebaseurl + '/account/course'\">Courses</a>\n <a [href]=\"mainsitebaseurl + '/account/rooms'\">Rooms</a>\n <a [href]=\"mainsitebaseurl + '/account/preferences'\">Preferences</a>\n @if (showImpersonateButton()) {\n <button\n (click)=\"openImpersonationModal.emit(); showAccountDropdown = false\"\n class=\"hbll-header-impersonate-btn\"\n >\n Impersonate\n </button>\n }\n <button (click)=\"logout.emit()\" data-testid=\"logout\">Logout</button>\n </div>\n }\n </div>\n @if (isScreenSmall()) {\n <div id=\"mobileNav\">\n <button\n class=\"hbll-header-wrapper\"\n data-testid=\"mobileNavBtn\"\n (click)=\"openSidebarNav()\"\n >\n <span class=\"material-symbols-outlined hbll-header-icon\"> menu </span>\n </button>\n @if (showNavBar) {\n <div\n id=\"navWrapper\"\n data-testid=\"mobileNav\"\n [@libHbllSlideInOutRightLeft]=\"{\n value: '',\n params: { xOffset: '400px' },\n }\"\n >\n <button\n id=\"closeMobileNavBtn\"\n class=\"hbll-header-wrapper\"\n data-testid=\"closeMobileNavBtn\"\n (click)=\"closeSidebarNav()\"\n >\n <span class=\"material-symbols-outlined hbll-header-icon\"> close </span>\n </button>\n <lib-nav-bar\n [mainSiteBaseUrl]=\"mainsitebaseurl\"\n [height]=\"mobileSidebarHeight\"\n />\n </div>\n <div\n @libHbllFadeInOut\n (click)=\"showNavBar = false\"\n class=\"hbll-nav-backdrop\"\n data-testid=\"mobileNavBackdrop\"\n ></div>\n }\n </div>\n }\n </div>\n</header>\n\n@if (!isScreenSmall()) {\n <div id=\"mainNav\">\n <lib-nav-bar [mainSiteBaseUrl]=\"mainsitebaseurl\" />\n </div>\n}\n@if (isScreenSmall()) {\n <a\n id=\"mobileLibraryHours\"\n [href]=\"mainsitebaseurl + '/about/hours'\"\n class=\"hbll-header-wrapper\"\n data-testid=\"mobileHours\"\n >\n <ng-container *ngTemplateOutlet=\"hoursTextBlock\"></ng-container>\n </a>\n}\n\n<ng-template #hoursTextBlock>\n @if (libraryHours()) {\n <span class=\"material-symbols-outlined hbll-header-left-icon\"> schedule </span>\n {{\n libraryHours()?.is_closed\n ? 'CLOSED'\n : \"Today's hours: \" +\n (libraryHours()!.date | libraryHours: libraryHours()!.open_time) +\n ' - ' +\n (libraryHours()!.date | libraryHours: libraryHours()!.close_time)\n }}\n }\n</ng-template>\n", styles: [".lib-spinner{border:.3em solid #dfe9f7;border-top:.3em solid #4070b0;border-radius:100%;width:30px;height:30px;animation:loadingSpinnerAnimate 1s ease infinite;position:relative}@keyframes loadingSpinnerAnimate{0%{transform:rotate(0)}to{transform:rotate(360deg)}}*{box-sizing:border-box;text-decoration:none;font-size:1em}*:not(.material-symbols-outlined){font-family:inherit}:host{position:relative;z-index:10000}.hbll-header-wrapper{display:flex;align-items:center;font-size:1em}.hbll-nav-backdrop{background-color:#000;opacity:.3;height:100vh;width:100vw;left:0;top:0;transform:translate(-100vw);position:absolute;z-index:-1}#mobileLibraryHours{color:#141414;background-color:#e6e6e6;font-size:1em;min-height:2em}#mobileLibraryHours.hbll-header-wrapper{width:100%;justify-content:center;padding:.2em}.hbll-header-icon,.hbll-header-left-icon{font-size:1.2em}.hbll-header-left-icon{margin-right:.2em}header{background-color:#002e5d;display:flex;align-items:center}header a h1{font-size:100%;margin:0;height:1.8em}header a h1 img{height:100%;padding:0 0 0 .6em}header #libraryInfo{margin-left:auto;color:#fff}header #libraryInfo a,header #libraryInfo button{transition:color .2s ease-in-out;color:#fffc}header #libraryInfo a:hover,header #libraryInfo button:hover{color:#fff}header #libraryInfo #accountInfo button,header #libraryInfo #mobileNav button{padding:.8em .6em}header #libraryInfo #accountBtn .name{margin-left:.4em}header #libraryInfo #mobileNav{position:relative;z-index:11}header #libraryInfo #mobileNav #navWrapper{color:#fff;position:absolute;top:0;right:0}header #libraryInfo #mobileNav #navWrapper #closeMobileNavBtn{background-color:#0047ba;margin-left:auto;padding-left:.9em}header #libraryInfo :last-child button{padding-right:1em!important}header #libraryInfo .hbll-header-icon,header #libraryInfo .hbll-header-left-icon{font-size:1.6em}header #libraryInfo #accountInfo{position:relative}header #libraryInfo #accountInfo #accountDropdown{font-size:1em;text-wrap:nowrap;position:absolute;background-color:#002e5d;top:100%;right:-32px;z-index:11;background-color:#233753}header #libraryInfo #accountInfo #accountDropdown .hbll-header-impersonate-btn{color:#ca7ad1cc}header #libraryInfo #accountInfo #accountDropdown .hbll-header-impersonate-btn:hover{color:#ca7ad1}header #libraryInfo #accountInfo #accountDropdown a,header #libraryInfo #accountInfo #accountDropdown button{display:block;width:100%;text-align:left;padding:.4em 1.2em;font-size:1.1em}header #libraryInfo #accountInfo #accountDropdown a:first-child,header #libraryInfo #accountInfo #accountDropdown button:first-child{margin-bottom:.4em;padding-top:.6em;padding-bottom:.6em;border-bottom:1px solid rgba(255,255,255,.3)}header #libraryInfo #accountInfo #accountDropdown a:last-child,header #libraryInfo #accountInfo #accountDropdown button:last-child{margin-top:.4em;border-top:1px solid rgba(255,255,255,.3);padding-top:.6em;padding-bottom:.6em}header #libraryInfo #accountInfo #accountDropdown:before{content:\"\";width:0;height:0;border-style:solid;border-width:0 .6em .6em .6em;border-color:transparent transparent hsl(214,41%,23%) transparent;position:absolute;bottom:100%;right:50%;transform:translate(50%);z-index:inherit}header.hbll-header-desktop{padding:0 2em}header.hbll-header-desktop #libraryInfo #mainLibraryHours{position:relative;margin-right:1em}header.hbll-header-desktop #libraryInfo #mainLibraryHours #libraryHoursDropdown{z-index:11;background-color:#fff;border-radius:4px;border:1px solid #d2d2d2;position:absolute;color:#000;padding:2em;top:100%;max-width:400%;right:50%;transform:translate(50%);margin-top:.6em}header.hbll-header-desktop #libraryInfo #mainLibraryHours #libraryHoursDropdown .hbll-header-section{display:grid;grid-template-columns:repeat(3,9em);grid-template-rows:1fr;grid-column-gap:0px;grid-row-gap:0px;margin-bottom:1em}header.hbll-header-desktop #libraryInfo #mainLibraryHours #libraryHoursDropdown .hbll-header-section h2{margin:0}header.hbll-header-desktop #libraryInfo #mainLibraryHours #libraryHoursDropdown .hbll-header-section .hbll-header-hours-note{grid-column:2/4;font-size:.8em;margin-top:1em}header.hbll-header-desktop #libraryInfo #mainLibraryHours #libraryHoursDropdown .hbll-header-section .hbll-header-hours-note ul{list-style-type:disc;list-style-position:inside;margin-left:.8em;padding:0}header.hbll-header-desktop #libraryInfo #mainLibraryHours #libraryHoursDropdown .hbll-header-section .hbll-header-hours-note ul li span{left:-8px;position:relative}header.hbll-header-desktop #libraryInfo #mainLibraryHours #libraryHoursDropdown .hbll-header-section .hbll-header-header{font-weight:600;font-size:1.2em}header.hbll-header-desktop #libraryInfo #mainLibraryHours #libraryHoursDropdown .hbll-header-section .hbll-header-detail,header.hbll-header-desktop #libraryInfo #mainLibraryHours #libraryHoursDropdown .hbll-header-section .hbll-header-hours{margin-top:.2em}header.hbll-header-desktop #libraryInfo #mainLibraryHours #libraryHoursDropdown .hbll-header-section .hbll-header-detail .hbll-header-item+.hbll-header-item,header.hbll-header-desktop #libraryInfo #mainLibraryHours #libraryHoursDropdown .hbll-header-section .hbll-header-hours .hbll-header-item+.hbll-header-item{margin-top:.3em}header.hbll-header-desktop #libraryInfo #mainLibraryHours #libraryHoursDropdown .hbll-header-section .hbll-header-detail h3,header.hbll-header-desktop #libraryInfo #mainLibraryHours #libraryHoursDropdown .hbll-header-section .hbll-header-hours h3{margin:0;font-size:inherit}header.hbll-header-desktop #libraryInfo #mainLibraryHours #libraryHoursDropdown .hbll-header-section .hbll-header-detail{font-weight:600;white-space:nowrap}header.hbll-header-desktop #libraryInfo #mainLibraryHours #libraryHoursDropdown .hbll-header-section .hbll-header-hours{white-space:nowrap}header.hbll-header-desktop #libraryInfo #mainLibraryHours #libraryHoursDropdown a{color:#4070b0;display:flex;align-items:center;float:right}header.hbll-header-desktop #libraryInfo #mainLibraryHours #libraryHoursDropdown a:hover{color:#6892ca}header.hbll-header-desktop #libraryInfo #accountInfo #accountDropdown{right:auto;left:50%;transform:translate(-50%)}button{background-color:transparent;border:none;cursor:pointer;font-family:inherit;font-size:inherit;color:inherit;padding:0}\n"], dependencies: [{ kind: "pipe", type: DatePipe, name: "date" }, { kind: "pipe", type: LibraryHoursPipe, name: "libraryHours" }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }, { kind: "component", type: NavBarComponent, selector: "lib-nav-bar", inputs: ["mainSiteBaseUrl", "height"] }], animations: [libHbllSlideInOutRightLeft, libHbllFadeInOut] }); }
543
543
  }
544
544
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.1.0", ngImport: i0, type: HbllHeaderComponent, decorators: [{
545
545
  type: Component,
@@ -550,7 +550,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.1.0", ngImpor
550
550
  CommonModule,
551
551
  NavBarComponent,
552
552
  ExpandCollapseComponent,
553
- ], animations: [libHbllSlideInOutRightLeft, libHbllFadeInOut], template: "<header\n role=\"banner\"\n class=\"hbll-header-wrapper\"\n #header\n [ngClass]=\"{ 'hbll-header-desktop': !isScreenSmall() }\"\n>\n <a [href]=\"mainsitebaseurl\">\n <h1>\n <img\n src=\"https://media.lib.byu.edu/web-assets/images/2.0.0/byu-hbll-logo-full.svg\"\n alt=\"BYU Library Logo\"\n />\n </h1>\n </a>\n <div id=\"libraryInfo\" class=\"hbll-header-wrapper\">\n @if (!isScreenSmall()) {\n <div #hours id=\"mainLibraryHours\" data-testid=\"desktopHours\">\n <button\n (click)=\"showLibraryHours = !showLibraryHours\"\n class=\"hbll-header-wrapper\"\n data-testid=\"hoursBtn\"\n >\n <ng-container *ngTemplateOutlet=\"hoursTextBlock\"></ng-container>\n </button>\n @if (!isScreenSmall() && showLibraryHours) {\n <div\n @libHbllFadeInOut\n id=\"libraryHoursDropdown\"\n data-testid=\"libraryHoursDropdown\"\n >\n <section class=\"hbll-header-section\">\n <h2 class=\"hbll-header-header\">Regular Hours</h2>\n <div class=\"hbll-header-detail\">\n <h3 class=\"hbll-header-item\">Monday - Friday</h3>\n <h3 class=\"hbll-header-item\">Saturday</h3>\n <h3 class=\"hbll-header-item\">Sunday</h3>\n </div>\n <div class=\"hbll-header-hours\">\n <div class=\"hbll-header-item\">7 a.m - midnight</div>\n <div class=\"hbll-header-item\">8 a.m - midnight</div>\n <div class=\"hbll-header-item\">Closed*</div>\n </div>\n <div class=\"hbll-header-hours-note\">\n * Family history ONLY 4 p.m. - 8 p.m\n <ul>\n <li><span>No checkouts after 11:45 p.m.</span></li>\n <li>\n <span>All services closed 10:45 to noon on Tuesdays</span>\n </li>\n </ul>\n </div>\n </section>\n <section class=\"hbll-header-section\">\n <h2 class=\"hbll-header-header\">Upcoming Exceptions</h2>\n @if (hoursExceptions$ | async; as exceptions) {\n <div class=\"hbll-header-detail\" data-testid=\"exceptionsDetail\">\n @for (exception of exceptions; track exception.date) {\n <h3 class=\"hbll-header-item\">\n {{ exception.date | date: 'MMM. d, YYYY' }}\n </h3>\n } @empty {\n No upcoming exceptions\n }\n </div>\n <div class=\"hbll-header-hours\" data-testid=\"exceptionsHours\">\n @for (exception of exceptions; track exception.date) {\n <div class=\"hbll-header-item\">\n {{ exception.exception_title }}\n </div>\n }\n </div>\n } @else {\n <div class=\"lib-spinner\" data-testid=\"exceptionsSpinner\"></div>\n }\n </section>\n <section class=\"hbll-header-section\">\n <h2 class=\"hbll-header-header\">Library Cafe</h2>\n <div class=\"hbll-header-detail\">\n <h3 class=\"hbll-header-item\">Bagel Bubble</h3>\n <h3 class=\"hbll-header-item\">Provecho</h3>\n </div>\n <div class=\"hbll-header-hours\">\n <div class=\"hbll-header-item\">7 a.m - 11 p.m.</div>\n <div class=\"hbll-header-item\">10:30 a.m - 2 p.m.</div>\n </div>\n </section>\n <a [href]=\"mainsitebaseurl + '/about/hours'\"\n >See all hours\n <span class=\"material-symbols-outlined\"> chevron_right </span></a\n >\n </div>\n }\n </div>\n }\n <div id=\"accountInfo\" #accountInfo>\n <button\n (click)=\"isLoggedIn ? (showAccountDropdown = !showAccountDropdown) : login.emit()\"\n class=\"hbll-header-wrapper\"\n id=\"accountBtn\"\n data-testid=\"accountBtn\"\n >\n <span class=\"material-symbols-outlined hbll-header-icon\"> person </span>\n @if (!isScreenSmall()) {\n <span class=\"hbll-header-name\" data-testid=\"name\">{{\n isLoggedIn ? '&nbsp;' + name : 'Login'\n }}</span>\n }\n @if (isLoggedIn) {\n <span class=\"material-symbols-outlined\" data-testid=\"loginDropdown\">\n arrow_drop_down\n </span>\n }\n </button>\n @if (isLoggedIn && showAccountDropdown) {\n <div @libHbllFadeInOut id=\"accountDropdown\" data-testid=\"accountDropdown\">\n <a [href]=\"mainsitebaseurl + '/account'\">My Account</a>\n <a [href]=\"mainsitebaseurl + '/account'\">My Items</a>\n <a [href]=\"mainsitebaseurl + '/account/request'\">Request an item</a>\n <a [href]=\"mainsitebaseurl + '/account/saved'\">Saved</a>\n <a [href]=\"mainsitebaseurl + '/account/course'\">Courses</a>\n <a [href]=\"mainsitebaseurl + '/account/rooms'\">Rooms</a>\n <a [href]=\"mainsitebaseurl + '/account/preferences'\">Preferences</a>\n @if (showImpersonateButton()) {\n <button\n (click)=\"openImpersonationModal.emit(); showAccountDropdown = false\"\n class=\"hbll-header-impersonate-btn\"\n >\n Impersonate\n </button>\n }\n <button (click)=\"logout.emit()\" data-testid=\"logout\">Logout</button>\n </div>\n }\n </div>\n @if (isScreenSmall()) {\n <div id=\"mobileNav\">\n <button\n class=\"hbll-header-wrapper\"\n data-testid=\"mobileNavBtn\"\n (click)=\"openSidebarNav()\"\n >\n <span class=\"material-symbols-outlined hbll-header-icon\"> menu </span>\n </button>\n @if (showNavBar) {\n <div\n id=\"navWrapper\"\n data-testid=\"mobileNav\"\n [@libHbllSlideInOutRightLeft]=\"{\n value: '',\n params: { xOffset: '400px' },\n }\"\n >\n <button\n id=\"closeMobileNavBtn\"\n class=\"hbll-header-wrapper\"\n data-testid=\"closeMobileNavBtn\"\n (click)=\"closeSidebarNav()\"\n >\n <span class=\"material-symbols-outlined hbll-header-icon\"> close </span>\n </button>\n <lib-nav-bar\n [mainSiteBaseUrl]=\"mainsitebaseurl\"\n [height]=\"mobileSidebarHeight\"\n />\n </div>\n <div\n @libHbllFadeInOut\n (click)=\"showNavBar = false\"\n class=\"hbll-nav-backdrop\"\n data-testid=\"mobileNavBackdrop\"\n ></div>\n }\n </div>\n }\n </div>\n</header>\n\n@if (!isScreenSmall()) {\n <div id=\"mainNav\">\n <lib-nav-bar [mainSiteBaseUrl]=\"mainsitebaseurl\" />\n </div>\n}\n@if (isScreenSmall()) {\n <a\n id=\"mobileLibraryHours\"\n [href]=\"mainsitebaseurl + '/about/hours'\"\n class=\"hbll-header-wrapper\"\n data-testid=\"mobileHours\"\n >\n <ng-container *ngTemplateOutlet=\"hoursTextBlock\"></ng-container>\n </a>\n}\n\n<ng-template #hoursTextBlock>\n @if (libraryHours()) {\n <span class=\"material-symbols-outlined hbll-header-left-icon\"> schedule </span>\n {{\n libraryHours()?.is_closed\n ? 'CLOSED'\n : \"Today's hours: \" +\n (libraryHours()!.date | libraryHours: libraryHours()!.open_time) +\n ' - ' +\n (libraryHours()!.date | libraryHours: libraryHours()!.close_time)\n }}\n }\n</ng-template>\n", styles: [".lib-spinner{border:.3em solid #dfe9f7;border-top:.3em solid #4070b0;border-radius:100%;width:30px;height:30px;animation:loadingSpinnerAnimate 1s ease infinite;position:relative}@keyframes loadingSpinnerAnimate{0%{transform:rotate(0)}to{transform:rotate(360deg)}}*{box-sizing:border-box;text-decoration:none}*:not(.material-symbols-outlined){font-family:inherit}.hbll-header-wrapper{display:flex;align-items:center;font-size:1em}.hbll-nav-backdrop{background-color:#000;opacity:.3;height:100vh;width:100vw;left:0;top:0;transform:translate(-100vw);position:absolute;z-index:-1}#mobileLibraryHours{color:#141414;background-color:#e6e6e6;font-size:1em;min-height:2em}#mobileLibraryHours.hbll-header-wrapper{width:100%;justify-content:center;padding:.2em}.hbll-header-icon,.hbll-header-left-icon{font-size:1.2em}.hbll-header-left-icon{margin-right:.2em}header{background-color:#002e5d;display:flex;align-items:center;position:relative;z-index:10000}header a h1{font-size:100%;margin:0;height:1.8em}header a h1 img{height:100%;padding:0 0 0 .6em}header #libraryInfo{margin-left:auto;color:#fff}header #libraryInfo a,header #libraryInfo button{transition:color .2s ease-in-out;color:#fffc}header #libraryInfo a:hover,header #libraryInfo button:hover{color:#fff}header #libraryInfo #accountInfo button,header #libraryInfo #mobileNav button{padding:.8em .6em}header #libraryInfo #accountBtn .name{margin-left:.4em}header #libraryInfo #mobileNav{position:relative;z-index:11}header #libraryInfo #mobileNav #navWrapper{color:#fff;position:absolute;top:0;right:0}header #libraryInfo #mobileNav #navWrapper #closeMobileNavBtn{background-color:#0047ba;margin-left:auto;padding-left:.9em}header #libraryInfo :last-child button{padding-right:1em!important}header #libraryInfo .hbll-header-icon,header #libraryInfo .hbll-header-left-icon{font-size:1.6em}header #libraryInfo #accountInfo{position:relative}header #libraryInfo #accountInfo #accountDropdown{font-size:1em;text-wrap:nowrap;position:absolute;background-color:#002e5d;top:100%;right:-32px;z-index:11;background-color:#233753}header #libraryInfo #accountInfo #accountDropdown .hbll-header-impersonate-btn{color:#ca7ad1cc}header #libraryInfo #accountInfo #accountDropdown .hbll-header-impersonate-btn:hover{color:#ca7ad1}header #libraryInfo #accountInfo #accountDropdown a,header #libraryInfo #accountInfo #accountDropdown button{display:block;width:100%;text-align:left;padding:.4em 1.2em;font-size:1.1em}header #libraryInfo #accountInfo #accountDropdown a:first-child,header #libraryInfo #accountInfo #accountDropdown button:first-child{margin-bottom:.4em;padding-top:.6em;padding-bottom:.6em;border-bottom:1px solid rgba(255,255,255,.3)}header #libraryInfo #accountInfo #accountDropdown a:last-child,header #libraryInfo #accountInfo #accountDropdown button:last-child{margin-top:.4em;border-top:1px solid rgba(255,255,255,.3);padding-top:.6em;padding-bottom:.6em}header #libraryInfo #accountInfo #accountDropdown:before{content:\"\";width:0;height:0;border-style:solid;border-width:0 .6em .6em .6em;border-color:transparent transparent hsl(214,41%,23%) transparent;position:absolute;bottom:100%;right:50%;transform:translate(50%);z-index:inherit}header.hbll-header-desktop{padding:0 2em}header.hbll-header-desktop #libraryInfo #mainLibraryHours{position:relative;margin-right:1em}header.hbll-header-desktop #libraryInfo #mainLibraryHours #libraryHoursDropdown{z-index:11;background-color:#fff;border-radius:4px;border:1px solid #d2d2d2;position:absolute;color:#000;padding:2em;top:100%;max-width:400%;right:50%;transform:translate(50%);margin-top:.6em}header.hbll-header-desktop #libraryInfo #mainLibraryHours #libraryHoursDropdown .hbll-header-section{display:grid;grid-template-columns:repeat(3,9em);grid-template-rows:1fr;grid-column-gap:0px;grid-row-gap:0px;margin-bottom:1em}header.hbll-header-desktop #libraryInfo #mainLibraryHours #libraryHoursDropdown .hbll-header-section h2{margin:0}header.hbll-header-desktop #libraryInfo #mainLibraryHours #libraryHoursDropdown .hbll-header-section .hbll-header-hours-note{grid-column:2/4;font-size:.8em;margin-top:1em}header.hbll-header-desktop #libraryInfo #mainLibraryHours #libraryHoursDropdown .hbll-header-section .hbll-header-hours-note ul{list-style-type:disc;list-style-position:inside;margin-left:.8em;padding:0}header.hbll-header-desktop #libraryInfo #mainLibraryHours #libraryHoursDropdown .hbll-header-section .hbll-header-hours-note ul li span{left:-8px;position:relative}header.hbll-header-desktop #libraryInfo #mainLibraryHours #libraryHoursDropdown .hbll-header-section .hbll-header-header{font-weight:600;font-size:1.2em}header.hbll-header-desktop #libraryInfo #mainLibraryHours #libraryHoursDropdown .hbll-header-section .hbll-header-detail,header.hbll-header-desktop #libraryInfo #mainLibraryHours #libraryHoursDropdown .hbll-header-section .hbll-header-hours{margin-top:.2em}header.hbll-header-desktop #libraryInfo #mainLibraryHours #libraryHoursDropdown .hbll-header-section .hbll-header-detail .hbll-header-item+.hbll-header-item,header.hbll-header-desktop #libraryInfo #mainLibraryHours #libraryHoursDropdown .hbll-header-section .hbll-header-hours .hbll-header-item+.hbll-header-item{margin-top:.3em}header.hbll-header-desktop #libraryInfo #mainLibraryHours #libraryHoursDropdown .hbll-header-section .hbll-header-detail h3,header.hbll-header-desktop #libraryInfo #mainLibraryHours #libraryHoursDropdown .hbll-header-section .hbll-header-hours h3{margin:0;font-size:inherit}header.hbll-header-desktop #libraryInfo #mainLibraryHours #libraryHoursDropdown .hbll-header-section .hbll-header-detail{font-weight:600;white-space:nowrap}header.hbll-header-desktop #libraryInfo #mainLibraryHours #libraryHoursDropdown .hbll-header-section .hbll-header-hours{white-space:nowrap}header.hbll-header-desktop #libraryInfo #mainLibraryHours #libraryHoursDropdown a{color:#4070b0;display:flex;align-items:center;float:right}header.hbll-header-desktop #libraryInfo #mainLibraryHours #libraryHoursDropdown a:hover{color:#6892ca}header.hbll-header-desktop #libraryInfo #accountInfo #accountDropdown{right:auto;left:50%;transform:translate(-50%)}button{background-color:transparent;border:none;cursor:pointer;font-family:inherit;font-size:inherit;color:inherit;padding:0}\n"] }]
553
+ ], animations: [libHbllSlideInOutRightLeft, libHbllFadeInOut], template: "<header\n role=\"banner\"\n class=\"hbll-header-wrapper\"\n #header\n [ngClass]=\"{ 'hbll-header-desktop': !isScreenSmall() }\"\n>\n <a [href]=\"mainsitebaseurl\">\n <h1>\n <img\n src=\"https://media.lib.byu.edu/web-assets/images/2.0.0/byu-hbll-logo-full.svg\"\n alt=\"BYU Library Logo\"\n />\n </h1>\n </a>\n <div id=\"libraryInfo\" class=\"hbll-header-wrapper\">\n @if (!isScreenSmall()) {\n <div #hours id=\"mainLibraryHours\" data-testid=\"desktopHours\">\n <button\n (click)=\"showLibraryHours = !showLibraryHours\"\n class=\"hbll-header-wrapper\"\n data-testid=\"hoursBtn\"\n >\n <ng-container *ngTemplateOutlet=\"hoursTextBlock\"></ng-container>\n </button>\n @if (!isScreenSmall() && showLibraryHours) {\n <div\n @libHbllFadeInOut\n id=\"libraryHoursDropdown\"\n data-testid=\"libraryHoursDropdown\"\n >\n <section class=\"hbll-header-section\">\n <h2 class=\"hbll-header-header\">Regular Hours</h2>\n <div class=\"hbll-header-detail\">\n <h3 class=\"hbll-header-item\">Monday - Friday</h3>\n <h3 class=\"hbll-header-item\">Saturday</h3>\n <h3 class=\"hbll-header-item\">Sunday</h3>\n </div>\n <div class=\"hbll-header-hours\">\n <div class=\"hbll-header-item\">7 a.m - midnight</div>\n <div class=\"hbll-header-item\">8 a.m - midnight</div>\n <div class=\"hbll-header-item\">Closed*</div>\n </div>\n <div class=\"hbll-header-hours-note\">\n * Family history ONLY 4 p.m. - 8 p.m\n <ul>\n <li><span>No checkouts after 11:45 p.m.</span></li>\n <li>\n <span>All services closed 10:45 to noon on Tuesdays</span>\n </li>\n </ul>\n </div>\n </section>\n <section class=\"hbll-header-section\">\n <h2 class=\"hbll-header-header\">Upcoming Exceptions</h2>\n @if (hoursExceptions$ | async; as exceptions) {\n <div class=\"hbll-header-detail\" data-testid=\"exceptionsDetail\">\n @for (exception of exceptions; track exception.date) {\n <h3 class=\"hbll-header-item\">\n {{ exception.date | date: 'MMM. d, YYYY' }}\n </h3>\n } @empty {\n No upcoming exceptions\n }\n </div>\n <div class=\"hbll-header-hours\" data-testid=\"exceptionsHours\">\n @for (exception of exceptions; track exception.date) {\n <div class=\"hbll-header-item\">\n {{ exception.exception_title }}\n </div>\n }\n </div>\n } @else {\n <div class=\"lib-spinner\" data-testid=\"exceptionsSpinner\"></div>\n }\n </section>\n <section class=\"hbll-header-section\">\n <h2 class=\"hbll-header-header\">Library Cafe</h2>\n <div class=\"hbll-header-detail\">\n <h3 class=\"hbll-header-item\">Bagel Bubble</h3>\n <h3 class=\"hbll-header-item\">Provecho</h3>\n </div>\n <div class=\"hbll-header-hours\">\n <div class=\"hbll-header-item\">7 a.m - 11 p.m.</div>\n <div class=\"hbll-header-item\">10:30 a.m - 2 p.m.</div>\n </div>\n </section>\n <a [href]=\"mainsitebaseurl + '/about/hours'\"\n >See all hours\n <span class=\"material-symbols-outlined\"> chevron_right </span></a\n >\n </div>\n }\n </div>\n }\n <div id=\"accountInfo\" #accountInfo>\n <button\n (click)=\"isLoggedIn ? (showAccountDropdown = !showAccountDropdown) : login.emit()\"\n class=\"hbll-header-wrapper\"\n id=\"accountBtn\"\n data-testid=\"accountBtn\"\n >\n <span class=\"material-symbols-outlined hbll-header-icon\"> person </span>\n @if (!isScreenSmall()) {\n <span class=\"hbll-header-name\" data-testid=\"name\">{{\n isLoggedIn ? '&nbsp;' + name : 'Login'\n }}</span>\n }\n @if (isLoggedIn) {\n <span class=\"material-symbols-outlined\" data-testid=\"loginDropdown\">\n arrow_drop_down\n </span>\n }\n </button>\n @if (isLoggedIn && showAccountDropdown) {\n <div @libHbllFadeInOut id=\"accountDropdown\" data-testid=\"accountDropdown\">\n <a [href]=\"mainsitebaseurl + '/account'\">My Account</a>\n <a [href]=\"mainsitebaseurl + '/account'\">My Items</a>\n <a [href]=\"mainsitebaseurl + '/account/request'\">Request an item</a>\n <a [href]=\"mainsitebaseurl + '/account/saved'\">Saved</a>\n <a [href]=\"mainsitebaseurl + '/account/course'\">Courses</a>\n <a [href]=\"mainsitebaseurl + '/account/rooms'\">Rooms</a>\n <a [href]=\"mainsitebaseurl + '/account/preferences'\">Preferences</a>\n @if (showImpersonateButton()) {\n <button\n (click)=\"openImpersonationModal.emit(); showAccountDropdown = false\"\n class=\"hbll-header-impersonate-btn\"\n >\n Impersonate\n </button>\n }\n <button (click)=\"logout.emit()\" data-testid=\"logout\">Logout</button>\n </div>\n }\n </div>\n @if (isScreenSmall()) {\n <div id=\"mobileNav\">\n <button\n class=\"hbll-header-wrapper\"\n data-testid=\"mobileNavBtn\"\n (click)=\"openSidebarNav()\"\n >\n <span class=\"material-symbols-outlined hbll-header-icon\"> menu </span>\n </button>\n @if (showNavBar) {\n <div\n id=\"navWrapper\"\n data-testid=\"mobileNav\"\n [@libHbllSlideInOutRightLeft]=\"{\n value: '',\n params: { xOffset: '400px' },\n }\"\n >\n <button\n id=\"closeMobileNavBtn\"\n class=\"hbll-header-wrapper\"\n data-testid=\"closeMobileNavBtn\"\n (click)=\"closeSidebarNav()\"\n >\n <span class=\"material-symbols-outlined hbll-header-icon\"> close </span>\n </button>\n <lib-nav-bar\n [mainSiteBaseUrl]=\"mainsitebaseurl\"\n [height]=\"mobileSidebarHeight\"\n />\n </div>\n <div\n @libHbllFadeInOut\n (click)=\"showNavBar = false\"\n class=\"hbll-nav-backdrop\"\n data-testid=\"mobileNavBackdrop\"\n ></div>\n }\n </div>\n }\n </div>\n</header>\n\n@if (!isScreenSmall()) {\n <div id=\"mainNav\">\n <lib-nav-bar [mainSiteBaseUrl]=\"mainsitebaseurl\" />\n </div>\n}\n@if (isScreenSmall()) {\n <a\n id=\"mobileLibraryHours\"\n [href]=\"mainsitebaseurl + '/about/hours'\"\n class=\"hbll-header-wrapper\"\n data-testid=\"mobileHours\"\n >\n <ng-container *ngTemplateOutlet=\"hoursTextBlock\"></ng-container>\n </a>\n}\n\n<ng-template #hoursTextBlock>\n @if (libraryHours()) {\n <span class=\"material-symbols-outlined hbll-header-left-icon\"> schedule </span>\n {{\n libraryHours()?.is_closed\n ? 'CLOSED'\n : \"Today's hours: \" +\n (libraryHours()!.date | libraryHours: libraryHours()!.open_time) +\n ' - ' +\n (libraryHours()!.date | libraryHours: libraryHours()!.close_time)\n }}\n }\n</ng-template>\n", styles: [".lib-spinner{border:.3em solid #dfe9f7;border-top:.3em solid #4070b0;border-radius:100%;width:30px;height:30px;animation:loadingSpinnerAnimate 1s ease infinite;position:relative}@keyframes loadingSpinnerAnimate{0%{transform:rotate(0)}to{transform:rotate(360deg)}}*{box-sizing:border-box;text-decoration:none;font-size:1em}*:not(.material-symbols-outlined){font-family:inherit}:host{position:relative;z-index:10000}.hbll-header-wrapper{display:flex;align-items:center;font-size:1em}.hbll-nav-backdrop{background-color:#000;opacity:.3;height:100vh;width:100vw;left:0;top:0;transform:translate(-100vw);position:absolute;z-index:-1}#mobileLibraryHours{color:#141414;background-color:#e6e6e6;font-size:1em;min-height:2em}#mobileLibraryHours.hbll-header-wrapper{width:100%;justify-content:center;padding:.2em}.hbll-header-icon,.hbll-header-left-icon{font-size:1.2em}.hbll-header-left-icon{margin-right:.2em}header{background-color:#002e5d;display:flex;align-items:center}header a h1{font-size:100%;margin:0;height:1.8em}header a h1 img{height:100%;padding:0 0 0 .6em}header #libraryInfo{margin-left:auto;color:#fff}header #libraryInfo a,header #libraryInfo button{transition:color .2s ease-in-out;color:#fffc}header #libraryInfo a:hover,header #libraryInfo button:hover{color:#fff}header #libraryInfo #accountInfo button,header #libraryInfo #mobileNav button{padding:.8em .6em}header #libraryInfo #accountBtn .name{margin-left:.4em}header #libraryInfo #mobileNav{position:relative;z-index:11}header #libraryInfo #mobileNav #navWrapper{color:#fff;position:absolute;top:0;right:0}header #libraryInfo #mobileNav #navWrapper #closeMobileNavBtn{background-color:#0047ba;margin-left:auto;padding-left:.9em}header #libraryInfo :last-child button{padding-right:1em!important}header #libraryInfo .hbll-header-icon,header #libraryInfo .hbll-header-left-icon{font-size:1.6em}header #libraryInfo #accountInfo{position:relative}header #libraryInfo #accountInfo #accountDropdown{font-size:1em;text-wrap:nowrap;position:absolute;background-color:#002e5d;top:100%;right:-32px;z-index:11;background-color:#233753}header #libraryInfo #accountInfo #accountDropdown .hbll-header-impersonate-btn{color:#ca7ad1cc}header #libraryInfo #accountInfo #accountDropdown .hbll-header-impersonate-btn:hover{color:#ca7ad1}header #libraryInfo #accountInfo #accountDropdown a,header #libraryInfo #accountInfo #accountDropdown button{display:block;width:100%;text-align:left;padding:.4em 1.2em;font-size:1.1em}header #libraryInfo #accountInfo #accountDropdown a:first-child,header #libraryInfo #accountInfo #accountDropdown button:first-child{margin-bottom:.4em;padding-top:.6em;padding-bottom:.6em;border-bottom:1px solid rgba(255,255,255,.3)}header #libraryInfo #accountInfo #accountDropdown a:last-child,header #libraryInfo #accountInfo #accountDropdown button:last-child{margin-top:.4em;border-top:1px solid rgba(255,255,255,.3);padding-top:.6em;padding-bottom:.6em}header #libraryInfo #accountInfo #accountDropdown:before{content:\"\";width:0;height:0;border-style:solid;border-width:0 .6em .6em .6em;border-color:transparent transparent hsl(214,41%,23%) transparent;position:absolute;bottom:100%;right:50%;transform:translate(50%);z-index:inherit}header.hbll-header-desktop{padding:0 2em}header.hbll-header-desktop #libraryInfo #mainLibraryHours{position:relative;margin-right:1em}header.hbll-header-desktop #libraryInfo #mainLibraryHours #libraryHoursDropdown{z-index:11;background-color:#fff;border-radius:4px;border:1px solid #d2d2d2;position:absolute;color:#000;padding:2em;top:100%;max-width:400%;right:50%;transform:translate(50%);margin-top:.6em}header.hbll-header-desktop #libraryInfo #mainLibraryHours #libraryHoursDropdown .hbll-header-section{display:grid;grid-template-columns:repeat(3,9em);grid-template-rows:1fr;grid-column-gap:0px;grid-row-gap:0px;margin-bottom:1em}header.hbll-header-desktop #libraryInfo #mainLibraryHours #libraryHoursDropdown .hbll-header-section h2{margin:0}header.hbll-header-desktop #libraryInfo #mainLibraryHours #libraryHoursDropdown .hbll-header-section .hbll-header-hours-note{grid-column:2/4;font-size:.8em;margin-top:1em}header.hbll-header-desktop #libraryInfo #mainLibraryHours #libraryHoursDropdown .hbll-header-section .hbll-header-hours-note ul{list-style-type:disc;list-style-position:inside;margin-left:.8em;padding:0}header.hbll-header-desktop #libraryInfo #mainLibraryHours #libraryHoursDropdown .hbll-header-section .hbll-header-hours-note ul li span{left:-8px;position:relative}header.hbll-header-desktop #libraryInfo #mainLibraryHours #libraryHoursDropdown .hbll-header-section .hbll-header-header{font-weight:600;font-size:1.2em}header.hbll-header-desktop #libraryInfo #mainLibraryHours #libraryHoursDropdown .hbll-header-section .hbll-header-detail,header.hbll-header-desktop #libraryInfo #mainLibraryHours #libraryHoursDropdown .hbll-header-section .hbll-header-hours{margin-top:.2em}header.hbll-header-desktop #libraryInfo #mainLibraryHours #libraryHoursDropdown .hbll-header-section .hbll-header-detail .hbll-header-item+.hbll-header-item,header.hbll-header-desktop #libraryInfo #mainLibraryHours #libraryHoursDropdown .hbll-header-section .hbll-header-hours .hbll-header-item+.hbll-header-item{margin-top:.3em}header.hbll-header-desktop #libraryInfo #mainLibraryHours #libraryHoursDropdown .hbll-header-section .hbll-header-detail h3,header.hbll-header-desktop #libraryInfo #mainLibraryHours #libraryHoursDropdown .hbll-header-section .hbll-header-hours h3{margin:0;font-size:inherit}header.hbll-header-desktop #libraryInfo #mainLibraryHours #libraryHoursDropdown .hbll-header-section .hbll-header-detail{font-weight:600;white-space:nowrap}header.hbll-header-desktop #libraryInfo #mainLibraryHours #libraryHoursDropdown .hbll-header-section .hbll-header-hours{white-space:nowrap}header.hbll-header-desktop #libraryInfo #mainLibraryHours #libraryHoursDropdown a{color:#4070b0;display:flex;align-items:center;float:right}header.hbll-header-desktop #libraryInfo #mainLibraryHours #libraryHoursDropdown a:hover{color:#6892ca}header.hbll-header-desktop #libraryInfo #accountInfo #accountDropdown{right:auto;left:50%;transform:translate(-50%)}button{background-color:transparent;border:none;cursor:pointer;font-family:inherit;font-size:inherit;color:inherit;padding:0}\n"] }]
554
554
  }], propDecorators: { header: [{
555
555
  type: ViewChild,
556
556
  args: ['header']
@@ -569,6 +569,106 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.1.0", ngImpor
569
569
  args: ['window:resize', ['$event']]
570
570
  }] } });
571
571
 
572
+ const typeToIconMap = {
573
+ archive: 'inventory_2',
574
+ article: 'article',
575
+ audio: 'mic',
576
+ audiobook: 'mic',
577
+ 'blu-ray': 'album',
578
+ book: 'book_4',
579
+ 'book-chapter': 'book_6',
580
+ 'book-review': 'reviews',
581
+ broadside: 'image',
582
+ calculator: 'calculate',
583
+ cassette: 'album',
584
+ cd: 'album',
585
+ 'cd-rom': 'album',
586
+ clothing: 'album',
587
+ 'clothing-pattern': 'album',
588
+ collection: 'library_books',
589
+ conference: 'podium',
590
+ 'conference-proceeding': 'podium',
591
+ cuneiform: 'aod_tablet',
592
+ curricula: 'aod_tablet',
593
+ database: 'database',
594
+ dataset: 'dataset',
595
+ diary: 'book_2',
596
+ dissertation: 'school',
597
+ dvd: 'album',
598
+ ebook: 'two_pager',
599
+ ebookreader: 'chrome_reader_mode',
600
+ ejournal: 'two_pager',
601
+ 'electronic-resource': 'description',
602
+ equipment: 'service_toolbox',
603
+ filmstrip: 'theaters',
604
+ 'finding-aid': 'travel_explore',
605
+ 'government-document': 'travel_explore',
606
+ 'government-novel': 'book_4',
607
+ guide: 'travel_explore',
608
+ image: 'image',
609
+ index: 'list',
610
+ journal: 'book_2',
611
+ 'juv-book': 'book_4',
612
+ kit: 'home_repair_service',
613
+ laserdisc: 'album',
614
+ 'legal-document': 'gavel',
615
+ letter: 'mail',
616
+ magazine: 'newsmode',
617
+ manuscript: 'article',
618
+ 'manuscript-archive': 'inventory_2',
619
+ map: 'map',
620
+ media: 'play_circle',
621
+ microfiche: 'theaters',
622
+ microfilm: 'theaters',
623
+ microform: 'theaters',
624
+ model: 'modeling',
625
+ movie: 'movie',
626
+ multimedia: 'play_circle',
627
+ 'music-recording': 'album',
628
+ 'musical-recording': 'play_circle',
629
+ newsletter: 'article',
630
+ newspaper: 'newspaper',
631
+ 'newspaper-article': 'newspaper',
632
+ ostracon: 'description',
633
+ other: 'description',
634
+ painting: 'palette',
635
+ palmleaf: 'eco',
636
+ pamphlet: 'article',
637
+ papyrus: 'article',
638
+ performance: 'music_note',
639
+ periodical: 'article',
640
+ photograph: 'image',
641
+ picture: 'image',
642
+ poem: 'article',
643
+ poster: 'image',
644
+ presentation: 'slideshow',
645
+ 'primary-source': 'inventory_2',
646
+ 'primary-source-document': 'article',
647
+ record: 'album',
648
+ 'reel-to-reel': 'video_camera_back',
649
+ 'reference-entry': 'article',
650
+ report: 'summarize',
651
+ 'research-data-set': 'dataset',
652
+ review: 'summarize',
653
+ score: 'music_note',
654
+ script: 'article',
655
+ serial: 'article',
656
+ slide: 'slideshow',
657
+ software: 'terminal',
658
+ 'sound-recording': 'mic',
659
+ standards: 'article',
660
+ 'statistical-data-set': 'dataset',
661
+ 'streaming-audio': 'play_circle',
662
+ 'streaming-media': 'play_circle',
663
+ 'streaming-video': 'play_circle',
664
+ 'student-project': 'article',
665
+ 'technical-report': 'summarize',
666
+ 'text-resource': 'summarize',
667
+ unknown: 'article',
668
+ vhs: 'theaters',
669
+ video: 'movie',
670
+ website: 'globe',
671
+ };
572
672
  /**
573
673
  * Converts an item type to an icon type to be used with Google Material Icons
574
674
  *
@@ -581,206 +681,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.1.0", ngImpor
581
681
  */
582
682
  class HbllItemTypeIconPipe {
583
683
  transform(itemType) {
584
- switch (itemType.replace(/_/g, '-').toLowerCase()) {
585
- case 'archive':
586
- return 'inventory_2';
587
- case 'article':
588
- return 'article';
589
- case 'audio':
590
- return 'mic';
591
- case 'audiobook':
592
- return 'mic';
593
- case 'blu-ray':
594
- return 'album';
595
- case 'book':
596
- return 'book_4';
597
- case 'book-chapter':
598
- return 'book_6';
599
- case 'book-review':
600
- return 'reviews';
601
- case 'broadside':
602
- return 'image';
603
- case 'calculator':
604
- return 'calculate';
605
- case 'cassette':
606
- return 'album';
607
- case 'cd':
608
- return 'album';
609
- case 'cd-rom':
610
- return 'album';
611
- case 'clothing':
612
- return 'album';
613
- case 'clothing-pattern':
614
- return 'album';
615
- case 'collection':
616
- return 'library_books';
617
- case 'conference':
618
- return 'podium';
619
- case 'conference-proceeding':
620
- return 'podium';
621
- case 'cuneiform':
622
- return 'aod_tablet';
623
- case 'curricula':
624
- return 'aod_tablet';
625
- case 'database':
626
- return 'database';
627
- case 'dataset':
628
- return 'dataset';
629
- case 'diary':
630
- return 'book_2';
631
- case 'dissertation':
632
- return 'school';
633
- case 'dvd':
634
- return 'album';
635
- case 'ebook':
636
- return 'two_pager';
637
- case 'ebookreader':
638
- return 'chrome_reader_mode';
639
- case 'ejournal':
640
- return 'two_pager';
641
- case 'electronic-resource':
642
- return 'description';
643
- case 'equipment':
644
- return 'service_toolbox';
645
- case 'filmstrip':
646
- return 'theaters';
647
- case 'finding-aid':
648
- return 'travel_explore';
649
- case 'government-document':
650
- return 'travel_explore';
651
- case 'government-novel':
652
- return 'book_4';
653
- case 'guide':
654
- return 'travel_explore';
655
- case 'image':
656
- return 'image';
657
- case 'index':
658
- return 'list';
659
- case 'journal':
660
- return 'book_2';
661
- case 'juv-book':
662
- return 'book_4';
663
- case 'kit':
664
- return 'home_repair_service';
665
- case 'laserdisc':
666
- return 'album';
667
- case 'legal-document':
668
- return 'gavel';
669
- case 'letter':
670
- return 'mail';
671
- case 'magazine':
672
- return 'newsmode';
673
- case 'manuscript':
674
- return 'article';
675
- case 'manuscript-archive':
676
- return 'inventory_2';
677
- case 'map':
678
- return 'map';
679
- case 'media':
680
- return 'play_circle';
681
- case 'microfiche':
682
- return 'theaters';
683
- case 'microfilm':
684
- return 'theaters';
685
- case 'microform':
686
- return 'theaters';
687
- case 'model':
688
- return 'modeling';
689
- case 'movie':
690
- return 'movie';
691
- case 'multimedia':
692
- return 'play_circle';
693
- case 'music-recording':
694
- return 'album';
695
- case 'musical-recording':
696
- return 'play_circle';
697
- case 'newsletter':
698
- return 'article';
699
- case 'newspaper':
700
- return 'newspaper';
701
- case 'newspaper-article':
702
- return 'newspaper';
703
- case 'ostracon':
704
- return 'description';
705
- case 'other':
706
- return 'description';
707
- case 'painting':
708
- return 'palette';
709
- case 'palmleaf':
710
- return 'eco';
711
- case 'pamphlet':
712
- return 'article';
713
- case 'papyrus':
714
- return 'article';
715
- case 'performance':
716
- return 'music_note';
717
- case 'periodical':
718
- return 'article';
719
- case 'photograph':
720
- return 'image';
721
- case 'picture':
722
- return 'image';
723
- case 'poem':
724
- return 'article';
725
- case 'poster':
726
- return 'image';
727
- case 'presentation':
728
- return 'slideshow';
729
- case 'primary-source':
730
- return 'inventory_2';
731
- case 'primary-source-document':
732
- return 'article';
733
- case 'record':
734
- return 'album';
735
- case 'reel-to-reel':
736
- return 'video_camera_back';
737
- case 'reference-entry':
738
- return 'article';
739
- case 'report':
740
- return 'summarize';
741
- case 'research-data-set':
742
- return 'dataset';
743
- case 'review':
744
- return 'summarize';
745
- case 'score':
746
- return 'music_note';
747
- case 'script':
748
- return 'article';
749
- case 'serial':
750
- return 'article';
751
- case 'slide':
752
- return 'slideshow';
753
- case 'software':
754
- return 'terminal';
755
- case 'sound-recording':
756
- return 'mic';
757
- case 'standards':
758
- return 'article';
759
- case 'statistical-data-set':
760
- return 'dataset';
761
- case 'streaming-audio':
762
- return 'play_circle';
763
- case 'streaming-media':
764
- return 'play_circle';
765
- case 'streaming-video':
766
- return 'play_circle';
767
- case 'student-project':
768
- return 'article';
769
- case 'technical-report':
770
- return 'summarize';
771
- case 'text-resource':
772
- return 'summarize';
773
- case 'unknown':
774
- return 'article';
775
- case 'vhs':
776
- return 'theaters';
777
- case 'video':
778
- return 'movie';
779
- case 'website':
780
- return 'globe';
781
- default:
782
- return 'article';
783
- }
684
+ const type = itemType.replace(/_/g, '-').toLowerCase();
685
+ return typeToIconMap[type] ?? 'article';
784
686
  }
785
687
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.1.0", ngImport: i0, type: HbllItemTypeIconPipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe }); }
786
688
  static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "18.1.0", ngImport: i0, type: HbllItemTypeIconPipe, isStandalone: true, name: "libByuItemTypeIcon" }); }
@@ -793,7 +695,18 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.1.0", ngImpor
793
695
  }]
794
696
  }] });
795
697
 
796
- const EMAIL_PATH = '/email';
698
+ const EMAIL_PATH = 'email';
699
+ const FEEDBACK_PATH = 'feedback';
700
+ const createContactForm = (fb) => fb.nonNullable.group({
701
+ name: [''],
702
+ email: [''],
703
+ message: ['', Validators.required],
704
+ status: [''],
705
+ });
706
+ const submitEmail = (payload, http, apiBaseUrl) => submitContactForm(payload, http, EMAIL_PATH, apiBaseUrl);
707
+ const submitFeedback = (payload, http, apiBaseUrl) => submitContactForm({ ...payload, origin: location.href }, http, FEEDBACK_PATH, apiBaseUrl);
708
+ const submitContactForm = (payload, http, path, apiBaseUrl) => http.post(`${apiBaseUrl}/${path}`, payload);
709
+
797
710
  class HbllFooterComponent {
798
711
  constructor() {
799
712
  this.fb = inject(FormBuilder);
@@ -806,24 +719,13 @@ class HbllFooterComponent {
806
719
  this.isLoading = false;
807
720
  this.hasConnectionError = false;
808
721
  this.isEmailSent = false;
809
- this.emailForm = this.fb.nonNullable.group({
810
- name: [''],
811
- email: [''],
812
- comment: ['', Validators.required],
813
- status: [''],
814
- });
722
+ this.emailForm = createContactForm(this.fb);
815
723
  this.sendEmail = () => {
816
724
  this.isSubmitted = true;
817
725
  if (this.emailForm.invalid)
818
726
  return;
819
- const email = {
820
- email: this.emailForm.controls.email.value,
821
- message: this.emailForm.controls.comment.value,
822
- name: this.emailForm.controls.name.value,
823
- status: this.emailForm.controls.status.value,
824
- };
825
727
  this.isLoading = true;
826
- this.http.post(this.libraryapibaseuri + EMAIL_PATH, email).subscribe({
728
+ submitEmail(this.emailForm.value, this.http, this.libraryapibaseuri).subscribe({
827
729
  error: () => {
828
730
  this.hasConnectionError = true;
829
731
  this.isLoading = false;
@@ -846,14 +748,14 @@ class HbllFooterComponent {
846
748
  };
847
749
  }
848
750
  set emailtext(text) {
849
- this.emailForm.controls.comment.setValue(text);
751
+ this.emailForm.controls.message.setValue(text);
850
752
  }
851
753
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.1.0", ngImport: i0, type: HbllFooterComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
852
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.1.0", type: HbllFooterComponent, isStandalone: true, selector: "lib-hbll-footer", inputs: { mainsitebaseurl: "mainsitebaseurl", libraryapibaseuri: "libraryapibaseuri", emailtext: "emailtext" }, ngImport: i0, template: "<footer>\n <div class=\"hbll-footer-wrapper\">\n <div class=\"hbll-footer-links\">\n <section>\n <h3>Contact</h3>\n <ul>\n <li>\n <address>\n P.O. Box 26800<br />\n Provo, UT 84602-6800\n </address>\n </li>\n <li>\n <span class=\"material-symbols-outlined hbll-footer-icon\">\n phone_in_talk </span\n >&nbsp;\n <a href=\"tel:801-422-6061\"><strong>Call</strong>&nbsp;(801) 422-6061</a>\n </li>\n <li>\n <span class=\"material-symbols-outlined hbll-footer-icon\"> sms </span>&nbsp;\n <a href=\"sms:801-623-6838\"><strong>Text</strong>&nbsp;(801) 623-6838</a>\n </li>\n <li>\n <span class=\"material-symbols-outlined hbll-footer-icon\"> mail </span\n >&nbsp;<button (click)=\"emailDialog.showModal()\" data-testid=\"emailUsBtn\">\n <strong>Email us</strong>\n </button>\n </li>\n </ul>\n </section>\n <section>\n <h3>Resources</h3>\n <ul>\n <li>\n <a target=\"_blank\" href=\"{{ mainsitebaseurl }}/site-index/\"\n >A-Z Site Index</a\n >\n </li>\n <li>\n <a target=\"_blank\" href=\"{{ mainsitebaseurl }}/about/policies/\">Policies</a>\n </li>\n <li>\n <a target=\"_blank\" href=\"{{ mainsitebaseurl }}/about/location/\"\n >Parking & Directions</a\n >\n </li>\n <li>\n <a target=\"_blank\" href=\"https://uac.byu.edu/accessibility-lab\"\n >Accessibility Resources</a\n >\n </li>\n </ul>\n </section>\n <section>\n <h3>Friends in the Library</h3>\n <ul>\n <li>\n <a target=\"_blank\" href=\"https://ctl.byu.edu\"\n >Center for Teaching and Learning</a\n >\n </li>\n <li>\n <a target=\"_blank\" href=\"https://copyright.byu.edu\"\n >Copyright Licensing Office</a\n >\n </li>\n <li>\n <a target=\"_blank\" href=\"https://facultycenter.byu.edu/aboutus\"\n >Faculty Center</a\n >\n </li>\n <li>\n <a target=\"_blank\" href=\"https://dining.byu.edu/library-cafe\"\n >Library Cafe</a\n >\n </li>\n </ul>\n </section>\n <section>\n <h3>Connect</h3>\n <ul class=\"hbll-footer-social-list\">\n <li>\n <a target=\"_blank\" href=\"https://www.facebook.com/byuhbll\">\n <img\n class=\"hbll-footer-social\"\n src=\"https://media.lib.byu.edu/web-assets/images/1.0.0/facebook-color-round.svg\"\n alt=\"Facebook\"\n title=\"Facebook\"\n />\n </a>\n </li>\n <li>\n <a target=\"_blank\" href=\"https://www.instagram.com/byu_hbll/\">\n <img\n class=\"hbll-footer-social\"\n src=\"https://media.lib.byu.edu/web-assets/images/1.0.0/instagram-color.svg\"\n alt=\"Instagram\"\n title=\"Instagram\"\n />\n </a>\n </li>\n </ul>\n </section>\n </div>\n <section class=\"hbll-footer-bottom\">\n <div class=\"hbll-footer-title\">\n <a href=\"https://byu.edu\" target=\"_blank\">BRIGHAM YOUNG UNIVERSITY</a>\n </div>\n <br />\n PROVO, UT 84602, USA | <a href=\"sms:801-422-6061\">(801) 422-6061</a>\n <br />&copy;&nbsp;{{ date | date: 'yyyy' }}\n ALL RIGHTS RESERVED\n <div class=\"hbll-footer-privacy\">\n <a href=\"https://privacy.byu.edu/\" target=\"_blank\">Privacy Notice</a>\n |\n <a href=\"https://infosec.byu.edu/cookie-prefs\" target=\"_blank\"\n >Cookie Preferences</a\n >\n </div>\n </section>\n </div>\n</footer>\n\n<dialog\n #emailDialog\n onmousedown=\"event.target === this && this.close()\"\n (close)=\"handleClose()\"\n data-testid=\"dialog\"\n>\n @if (!isEmailSent) {\n <form [formGroup]=\"emailForm\" (submit)=\"sendEmail()\" data-testid=\"form\">\n <div class=\"hbll-footer-email-top\">\n <h1>Email Us</h1>\n <button (click)=\"emailDialog.close()\" type=\"button\" data-testid=\"closeBtn\">\n <span class=\"material-symbols-outlined\"> close </span>\n </button>\n </div>\n <label for=\"emailName\">Name </label>\n <input\n id=\"emailName\"\n type=\"text\"\n name=\"name\"\n formControlName=\"name\"\n data-testid=\"emailNameInput\"\n />\n <label for=\"emailEmail\"> Email (please provide if you would like a response)</label>\n <input\n id=\"emailEmail\"\n type=\"text\"\n formControlName=\"email\"\n data-testid=\"emailEmailInput\"\n />\n <label for=\"emailComment\">\n Question or comment&nbsp;<span class=\"hbll-footer-email-required\">*</span>\n </label>\n <textarea\n id=\"emailComment\"\n type=\"text\"\n formControlName=\"comment\"\n data-testid=\"emailCommentInput\"\n ></textarea>\n @if (isSubmitted && emailForm.controls.comment.invalid) {\n <div\n class=\"hbll-footer-email-required hbll-footer-email-error\"\n data-testid=\"commentError\"\n >\n <span class=\"material-symbols-outlined hbll-footer-email-error-icon\">\n warning\n </span>\n <strong>Please fill out this field</strong>\n </div>\n }\n <label for=\"emailStatus\"> Status</label>\n <span class=\"hbll-footer-select-wrapper\">\n <select id=\"emailStatus\" formControlName=\"status\" data-testid=\"emailStatusInput\">\n <option selected value=\"\"></option>\n <option>Undergraduate</option>\n <option>Graduate Student</option>\n <option>Faculty</option>\n <option>Staff</option>\n <option>Library Employee</option>\n <option>Other</option>\n </select>\n </span>\n <div class=\"hbll-footer-email-bottom-bar\">\n @if (hasConnectionError) {\n <p class=\"hbll-footer-connection-error\" data-testid=\"connectionError\">\n <i>There was an error sending your email. Please try again later.</i>\n </p>\n }\n <button\n class=\"pill-btn--components\"\n type=\"submit\"\n [disabled]=\"isLoading\"\n data-testid=\"sendEmailBtn\"\n >\n Send\n </button>\n </div>\n </form>\n } @else {\n <div class=\"hbll-footer-email-success\" data-testid=\"successMessage\">\n <p>\n Your email was sent successfully. If you supplied your email address, we will get\n back to you shortly.<br />Thank you!\n </p>\n <button class=\"pill-btn--components\" (click)=\"emailDialog.close()\" type=\"button\">\n Close\n </button>\n </div>\n }\n</dialog>\n", styles: ["@import\"https://fonts.googleapis.com/css2?family=Public+Sans:ital,wght@0,200..400;1,200..400&display=swap\";*{box-sizing:border-box;text-decoration:none}*:not(.material-symbols-outlined){font-family:inherit}dialog form input,dialog form textarea,dialog form select{appearance:none;font-family:inherit;padding:.38em;border:solid 1px #707070;border-radius:4px;font-size:1em;background-color:#fff}dialog form input:focus,dialog form textarea:focus,dialog form select:focus{outline-color:#3a6093}dialog form .hbll-footer-select-wrapper{position:relative}dialog form .hbll-footer-select-wrapper select{cursor:pointer;padding-right:2em}dialog form .hbll-footer-select-wrapper:after{font-family:Material Symbols Outlined;content:\"arrow_drop_down\";pointer-events:none;top:0;font-size:1.5em;right:.2em;height:100%;position:absolute;display:flex;align-items:center;opacity:70%}.pill-btn--components{background-color:#4070b0;font-size:1em;transition:all .15s;color:#fff;cursor:pointer;font-weight:600;text-align:center}.pill-btn--components:disabled{color:#707070;background-color:#e6e6e6;pointer-events:none}.pill-btn--components:hover{background-color:#6892ca;color:#fff}.destructive.pill-btn--components{background-color:#b04940}.destructive.pill-btn--components:hover{background-color:#c7574d}.pill-btn--components{border-radius:100em;padding:.4em 1.3em}button{border:none;background-color:transparent;font-size:1em}button :hover{cursor:pointer}footer{line-height:1.2em;background-color:#e6e6e6}footer .hbll-footer-wrapper{display:flex;flex-direction:column;align-items:center}footer .hbll-footer-wrapper .hbll-footer-links{max-width:90em;display:flex;align-items:flex-start;justify-content:flex-start;flex-wrap:wrap;padding-bottom:2em;white-space:nowrap}footer .hbll-footer-wrapper .hbll-footer-links strong{font-weight:600}footer .hbll-footer-wrapper .hbll-footer-links address{font-style:normal}footer .hbll-footer-wrapper .hbll-footer-links .hbll-footer-icon{font-size:1em;margin-right:.2em;color:#002e5d}footer .hbll-footer-wrapper .hbll-footer-links section{padding:2em 1.8em 0;background-color:#e6e6e6;flex:1}footer .hbll-footer-wrapper .hbll-footer-links .hbll-footer-social-list{display:flex}footer .hbll-footer-wrapper .hbll-footer-links .hbll-footer-social-list .hbll-footer-social{height:1.5em;margin-right:1em}footer .hbll-footer-wrapper .hbll-footer-links .hbll-footer-social-list li{margin-bottom:0}footer .hbll-footer-wrapper h3{font-weight:600;color:#002e5d;font-size:1.4em;margin-bottom:1em;margin-top:0}footer .hbll-footer-wrapper ul{list-style:none;margin:.4em 0 0;padding:0}footer .hbll-footer-wrapper ul li{display:flex;align-items:center}footer .hbll-footer-wrapper ul li a,footer .hbll-footer-wrapper ul li button{display:inline-flex;align-items:center;color:#305f9c}footer .hbll-footer-wrapper ul li a:hover,footer .hbll-footer-wrapper ul li button:hover{color:#6892ca}footer .hbll-footer-wrapper ul li:not(:last-of-type){margin-bottom:.6em}footer .hbll-footer-wrapper .hbll-footer-bottom{text-align:center;background-color:#002e5d;color:#fff;font-family:Public Sans,sans-serif;font-optical-sizing:auto;font-weight:200;font-style:normal;font-size:.9em;line-height:1.6em;padding:1.8em;width:100%}footer .hbll-footer-wrapper .hbll-footer-bottom a{color:#fff}footer .hbll-footer-wrapper .hbll-footer-bottom .hbll-footer-title{font-size:2em;font-weight:400;line-height:1em}footer .hbll-footer-wrapper .hbll-footer-bottom .hbll-footer-privacy{margin-top:.4em}footer .hbll-footer-wrapper .hbll-footer-bottom .hbll-footer-privacy a{text-decoration:underline}@media screen and (max-width: 40em){.hbll-footer-links{flex-direction:column;justify-content:flex-start;width:100%}}dialog{border:solid 1px #888;border-radius:4px;width:90%;max-width:50em;padding:0;transition:all 5s ease-in-out}dialog .hbll-footer-email-success,dialog form{padding:1.6em 2em}dialog .hbll-footer-email-success p,dialog form p{text-align:center;line-height:1.4em}dialog .hbll-footer-email-success{display:flex;justify-content:center;align-items:center;flex-direction:column}dialog .hbll-footer-email-success button{margin-top:1em}dialog form{display:flex;flex-direction:column;position:relative}dialog form textarea{min-height:100px;resize:vertical}dialog form input,dialog form textarea,dialog form .hbll-footer-select-wrapper{margin-bottom:.6em}dialog form .hbll-footer-email-bottom-bar{display:flex;align-items:center;justify-content:flex-end}dialog form .hbll-footer-email-bottom-bar .hbll-footer-connection-error{text-align:right;flex-grow:1;margin:0 1em 0 0}dialog form label{margin-bottom:.4em;margin-top:.4em}dialog form .hbll-footer-email-error{display:flex;justify-content:center;align-items:center;margin-right:auto;margin-bottom:.6em;font-size:.8em}dialog form .hbll-footer-email-error .hbll-footer-email-error-icon{font-size:1.2em;margin-right:.2em}dialog form .hbll-footer-email-top{width:100%;display:flex;flex-direction:row;flex-wrap:nowrap;justify-content:space-between;align-items:center;margin-bottom:1em}dialog form .hbll-footer-email-top h1{font-size:1.4em;margin:0}dialog form .hbll-footer-email-required-message{float:right}dialog form .hbll-footer-select-wrapper{margin-right:auto}dialog form .hbll-footer-email-required{color:#d03a3a}dialog form button:not([type=submit]){color:#333}dialog form button:not([type=submit]):hover{color:#696969}dialog form button[type=submit]{margin-left:auto}dialog::backdrop{background-color:#000;opacity:.75}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "pipe", type: i1.DatePipe, name: "date" }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i2.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i2.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }] }); }
754
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.1.0", type: HbllFooterComponent, isStandalone: true, selector: "lib-hbll-footer", inputs: { mainsitebaseurl: "mainsitebaseurl", libraryapibaseuri: "libraryapibaseuri", emailtext: "emailtext" }, ngImport: i0, template: "<footer>\n <div class=\"hbll-footer-wrapper\">\n <div class=\"hbll-footer-links\">\n <section>\n <h3>Contact</h3>\n <ul>\n <li>\n <address>\n P.O. Box 26800<br />\n Provo, UT 84602-6800\n </address>\n </li>\n <li>\n <span class=\"material-symbols-outlined hbll-footer-icon\">\n phone_in_talk </span\n >&nbsp;\n <a href=\"tel:801-422-6061\"><strong>Call</strong>&nbsp;(801) 422-6061</a>\n </li>\n <li>\n <span class=\"material-symbols-outlined hbll-footer-icon\"> sms </span>&nbsp;\n <a href=\"sms:801-623-6838\"><strong>Text</strong>&nbsp;(801) 623-6838</a>\n </li>\n <li>\n <span class=\"material-symbols-outlined hbll-footer-icon\"> mail </span\n >&nbsp;<button (click)=\"emailDialog.showModal()\" data-testid=\"emailUsBtn\">\n <strong>Email us</strong>\n </button>\n </li>\n </ul>\n </section>\n <section>\n <h3>Resources</h3>\n <ul>\n <li>\n <a target=\"_blank\" href=\"{{ mainsitebaseurl }}/site-index/\"\n >A-Z Site Index</a\n >\n </li>\n <li>\n <a target=\"_blank\" href=\"{{ mainsitebaseurl }}/about/policies/\">Policies</a>\n </li>\n <li>\n <a target=\"_blank\" href=\"{{ mainsitebaseurl }}/about/location/\"\n >Parking & Directions</a\n >\n </li>\n <li>\n <a target=\"_blank\" href=\"https://uac.byu.edu/accessibility-lab\"\n >Accessibility Resources</a\n >\n </li>\n </ul>\n </section>\n <section>\n <h3>Friends in the Library</h3>\n <ul>\n <li>\n <a target=\"_blank\" href=\"https://ctl.byu.edu\"\n >Center for Teaching and Learning</a\n >\n </li>\n <li>\n <a target=\"_blank\" href=\"https://copyright.byu.edu\"\n >Copyright Licensing Office</a\n >\n </li>\n <li>\n <a target=\"_blank\" href=\"https://facultycenter.byu.edu/aboutus\"\n >Faculty Center</a\n >\n </li>\n <li>\n <a target=\"_blank\" href=\"https://dining.byu.edu/library-cafe\"\n >Library Cafe</a\n >\n </li>\n </ul>\n </section>\n <section>\n <h3>Connect</h3>\n <ul class=\"hbll-footer-social-list\">\n <li>\n <a target=\"_blank\" href=\"https://www.facebook.com/byuhbll\">\n <img\n class=\"hbll-footer-social\"\n src=\"https://media.lib.byu.edu/web-assets/images/1.0.0/facebook-color-round.svg\"\n alt=\"Facebook\"\n title=\"Facebook\"\n />\n </a>\n </li>\n <li>\n <a target=\"_blank\" href=\"https://www.instagram.com/byu_hbll/\">\n <img\n class=\"hbll-footer-social\"\n src=\"https://media.lib.byu.edu/web-assets/images/1.0.0/instagram-color.svg\"\n alt=\"Instagram\"\n title=\"Instagram\"\n />\n </a>\n </li>\n </ul>\n </section>\n </div>\n <section class=\"hbll-footer-bottom\">\n <div class=\"hbll-footer-title\">\n <a href=\"https://byu.edu\" target=\"_blank\">BRIGHAM YOUNG UNIVERSITY</a>\n </div>\n <br />\n PROVO, UT 84602, USA | <a href=\"sms:801-422-6061\">(801) 422-6061</a>\n <br />&copy;&nbsp;{{ date | date: 'yyyy' }}\n ALL RIGHTS RESERVED\n <div class=\"hbll-footer-privacy\">\n <a href=\"https://privacy.byu.edu/\" target=\"_blank\">Privacy Notice</a>\n |\n <a href=\"https://infosec.byu.edu/cookie-prefs\" target=\"_blank\"\n >Cookie Preferences</a\n >\n </div>\n </section>\n </div>\n</footer>\n\n<dialog\n #emailDialog\n onmousedown=\"event.target === this && this.close()\"\n (close)=\"handleClose()\"\n data-testid=\"dialog\"\n>\n @if (!isEmailSent) {\n <form [formGroup]=\"emailForm\" (submit)=\"sendEmail()\" data-testid=\"form\">\n <div class=\"hbll-footer-email-top\">\n <h1>Email Us</h1>\n <button (click)=\"emailDialog.close()\" type=\"button\" data-testid=\"closeBtn\">\n <span class=\"material-symbols-outlined\"> close </span>\n </button>\n </div>\n <label for=\"emailName\">Name</label>\n <input\n id=\"emailName\"\n type=\"text\"\n name=\"name\"\n formControlName=\"name\"\n data-testid=\"emailNameInput\"\n />\n <label for=\"emailEmail\"> Email (please provide if you would like a response)</label>\n <input\n id=\"emailEmail\"\n type=\"text\"\n formControlName=\"email\"\n data-testid=\"emailEmailInput\"\n />\n <label for=\"emailMessage\">\n Question or comment&nbsp;<span class=\"hbll-footer-email-required\">*</span>\n </label>\n <textarea\n id=\"emailMessage\"\n type=\"text\"\n formControlName=\"message\"\n data-testid=\"emailCommentInput\"\n ></textarea>\n @if (isSubmitted && emailForm.controls.message.invalid) {\n <div\n class=\"hbll-footer-email-required hbll-footer-email-error\"\n data-testid=\"commentError\"\n >\n <span class=\"material-symbols-outlined hbll-footer-email-error-icon\">\n warning\n </span>\n <strong>Please fill out this field</strong>\n </div>\n }\n <label for=\"emailStatus\">Role</label>\n <span class=\"hbll-footer-select-wrapper\">\n <select id=\"emailStatus\" formControlName=\"status\" data-testid=\"emailStatusInput\">\n <option selected value=\"\"></option>\n <option>Undergraduate</option>\n <option>Graduate Student</option>\n <option>Faculty</option>\n <option>Staff</option>\n <option>Library Employee</option>\n <option>Other</option>\n </select>\n </span>\n <div class=\"hbll-footer-email-bottom-bar\">\n @if (hasConnectionError) {\n <p class=\"hbll-footer-connection-error\" data-testid=\"connectionError\">\n <i>There was an error sending your email. Please try again later.</i>\n </p>\n }\n <button\n class=\"pill-btn--components\"\n type=\"submit\"\n [disabled]=\"isLoading\"\n data-testid=\"sendEmailBtn\"\n >\n Send\n </button>\n </div>\n </form>\n } @else {\n <div class=\"hbll-footer-email-success\" data-testid=\"successMessage\">\n <p>\n Your email was sent successfully. If you supplied your email address, we will get\n back to you shortly.<br />Thank you!\n </p>\n <button class=\"pill-btn--components\" (click)=\"emailDialog.close()\" type=\"button\">\n Close\n </button>\n </div>\n }\n</dialog>\n", styles: ["@import\"https://fonts.googleapis.com/css2?family=Public+Sans:ital,wght@0,200..400;1,200..400&display=swap\";*{box-sizing:border-box;text-decoration:none;font-size:1em}*:not(.material-symbols-outlined){font-family:inherit}dialog form input,dialog form textarea,dialog form select{appearance:none;font-family:inherit;padding:.38em;border:solid 1px #707070;border-radius:4px;font-size:1em;background-color:#fff}dialog form input:focus,dialog form textarea:focus,dialog form select:focus{outline-color:#3a6093}dialog form .hbll-footer-select-wrapper{position:relative}dialog form .hbll-footer-select-wrapper select{cursor:pointer;padding-right:2em}dialog form .hbll-footer-select-wrapper:after{font-family:Material Symbols Outlined;content:\"arrow_drop_down\";pointer-events:none;top:0;font-size:1.5em;right:.2em;height:100%;position:absolute;display:flex;align-items:center;opacity:70%}.pill-btn--components{background-color:#4070b0;font-size:1em;transition:all .15s;color:#fff;cursor:pointer;font-weight:600;text-align:center}.pill-btn--components:disabled{color:#707070;background-color:#e6e6e6;pointer-events:none}.pill-btn--components:hover{background-color:#6892ca;color:#fff}.destructive.pill-btn--components{background-color:#b04940}.destructive.pill-btn--components:hover{background-color:#c7574d}.pill-btn--components{border-radius:100em;padding:.4em 1.3em}button{border:none;background-color:transparent;font-size:1em}button :hover{cursor:pointer}footer{line-height:1.2em;background-color:#e6e6e6}footer .hbll-footer-wrapper{display:flex;flex-direction:column;align-items:center}footer .hbll-footer-wrapper .hbll-footer-links{max-width:90em;display:flex;align-items:flex-start;justify-content:flex-start;flex-wrap:wrap;padding-bottom:2em;white-space:nowrap}footer .hbll-footer-wrapper .hbll-footer-links strong{font-weight:600}footer .hbll-footer-wrapper .hbll-footer-links address{font-style:normal}footer .hbll-footer-wrapper .hbll-footer-links .hbll-footer-icon{font-size:1em;margin-right:.2em;color:#002e5d}footer .hbll-footer-wrapper .hbll-footer-links section{padding:2em 1.8em 0;background-color:#e6e6e6;flex:1}footer .hbll-footer-wrapper .hbll-footer-links .hbll-footer-social-list{display:flex}footer .hbll-footer-wrapper .hbll-footer-links .hbll-footer-social-list .hbll-footer-social{height:1.5em;margin-right:1em}footer .hbll-footer-wrapper .hbll-footer-links .hbll-footer-social-list li{margin-bottom:0}footer .hbll-footer-wrapper h3{font-weight:600;color:#002e5d;font-size:1.4em;margin-bottom:1em;margin-top:0}footer .hbll-footer-wrapper ul{list-style:none;margin:.4em 0 0;padding:0}footer .hbll-footer-wrapper ul li{display:flex;align-items:center}footer .hbll-footer-wrapper ul li a,footer .hbll-footer-wrapper ul li button{display:inline-flex;align-items:center;color:#305f9c}footer .hbll-footer-wrapper ul li a:hover,footer .hbll-footer-wrapper ul li button:hover{color:#6892ca}footer .hbll-footer-wrapper ul li:not(:last-of-type){margin-bottom:.6em}footer .hbll-footer-wrapper .hbll-footer-bottom{text-align:center;background-color:#002e5d;color:#fff;font-family:Public Sans,sans-serif;font-optical-sizing:auto;font-weight:200;font-style:normal;font-size:.9em;line-height:1.6em;padding:1.8em;width:100%}footer .hbll-footer-wrapper .hbll-footer-bottom a{color:#fff}footer .hbll-footer-wrapper .hbll-footer-bottom .hbll-footer-title{font-size:2em;font-weight:400;line-height:1em}footer .hbll-footer-wrapper .hbll-footer-bottom .hbll-footer-privacy{margin-top:.4em}footer .hbll-footer-wrapper .hbll-footer-bottom .hbll-footer-privacy a{text-decoration:underline}@media screen and (max-width: 40em){.hbll-footer-links{flex-direction:column;justify-content:flex-start;width:100%}}dialog{border:solid 1px #888;border-radius:4px;width:90%;max-width:50em;padding:0;transition:all 5s ease-in-out}dialog .hbll-footer-email-success,dialog form{padding:1.6em 2em}dialog .hbll-footer-email-success p,dialog form p{text-align:center;line-height:1.4em}dialog .hbll-footer-email-success{display:flex;justify-content:center;align-items:center;flex-direction:column}dialog .hbll-footer-email-success button{margin-top:1em}dialog form{display:flex;flex-direction:column;position:relative}dialog form textarea{min-height:100px;resize:vertical}dialog form input,dialog form textarea,dialog form .hbll-footer-select-wrapper{margin-bottom:.6em}dialog form .hbll-footer-email-bottom-bar{display:flex;align-items:center;justify-content:flex-end}dialog form .hbll-footer-email-bottom-bar .hbll-footer-connection-error{text-align:right;flex-grow:1;margin:0 1em 0 0}dialog form label{margin-bottom:.4em;margin-top:.4em}dialog form .hbll-footer-email-error{display:flex;justify-content:center;align-items:center;margin-right:auto;margin-bottom:.6em;font-size:.8em}dialog form .hbll-footer-email-error .hbll-footer-email-error-icon{font-size:1.2em;margin-right:.2em}dialog form .hbll-footer-email-top{width:100%;display:flex;flex-direction:row;flex-wrap:nowrap;justify-content:space-between;align-items:center;margin-bottom:1em}dialog form .hbll-footer-email-top h1{font-size:1.4em;margin:0}dialog form .hbll-footer-email-required-message{float:right}dialog form .hbll-footer-select-wrapper{margin-right:auto}dialog form .hbll-footer-email-required{color:#d03a3a}dialog form button:not([type=submit]){color:#333}dialog form button:not([type=submit]):hover{color:#696969}dialog form button[type=submit]{margin-left:auto}dialog::backdrop{background-color:#000;opacity:.75}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "pipe", type: i1.DatePipe, name: "date" }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i2.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i2.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }] }); }
853
755
  }
854
756
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.1.0", ngImport: i0, type: HbllFooterComponent, decorators: [{
855
757
  type: Component,
856
- args: [{ selector: 'lib-hbll-footer', standalone: true, imports: [CommonModule, ReactiveFormsModule], template: "<footer>\n <div class=\"hbll-footer-wrapper\">\n <div class=\"hbll-footer-links\">\n <section>\n <h3>Contact</h3>\n <ul>\n <li>\n <address>\n P.O. Box 26800<br />\n Provo, UT 84602-6800\n </address>\n </li>\n <li>\n <span class=\"material-symbols-outlined hbll-footer-icon\">\n phone_in_talk </span\n >&nbsp;\n <a href=\"tel:801-422-6061\"><strong>Call</strong>&nbsp;(801) 422-6061</a>\n </li>\n <li>\n <span class=\"material-symbols-outlined hbll-footer-icon\"> sms </span>&nbsp;\n <a href=\"sms:801-623-6838\"><strong>Text</strong>&nbsp;(801) 623-6838</a>\n </li>\n <li>\n <span class=\"material-symbols-outlined hbll-footer-icon\"> mail </span\n >&nbsp;<button (click)=\"emailDialog.showModal()\" data-testid=\"emailUsBtn\">\n <strong>Email us</strong>\n </button>\n </li>\n </ul>\n </section>\n <section>\n <h3>Resources</h3>\n <ul>\n <li>\n <a target=\"_blank\" href=\"{{ mainsitebaseurl }}/site-index/\"\n >A-Z Site Index</a\n >\n </li>\n <li>\n <a target=\"_blank\" href=\"{{ mainsitebaseurl }}/about/policies/\">Policies</a>\n </li>\n <li>\n <a target=\"_blank\" href=\"{{ mainsitebaseurl }}/about/location/\"\n >Parking & Directions</a\n >\n </li>\n <li>\n <a target=\"_blank\" href=\"https://uac.byu.edu/accessibility-lab\"\n >Accessibility Resources</a\n >\n </li>\n </ul>\n </section>\n <section>\n <h3>Friends in the Library</h3>\n <ul>\n <li>\n <a target=\"_blank\" href=\"https://ctl.byu.edu\"\n >Center for Teaching and Learning</a\n >\n </li>\n <li>\n <a target=\"_blank\" href=\"https://copyright.byu.edu\"\n >Copyright Licensing Office</a\n >\n </li>\n <li>\n <a target=\"_blank\" href=\"https://facultycenter.byu.edu/aboutus\"\n >Faculty Center</a\n >\n </li>\n <li>\n <a target=\"_blank\" href=\"https://dining.byu.edu/library-cafe\"\n >Library Cafe</a\n >\n </li>\n </ul>\n </section>\n <section>\n <h3>Connect</h3>\n <ul class=\"hbll-footer-social-list\">\n <li>\n <a target=\"_blank\" href=\"https://www.facebook.com/byuhbll\">\n <img\n class=\"hbll-footer-social\"\n src=\"https://media.lib.byu.edu/web-assets/images/1.0.0/facebook-color-round.svg\"\n alt=\"Facebook\"\n title=\"Facebook\"\n />\n </a>\n </li>\n <li>\n <a target=\"_blank\" href=\"https://www.instagram.com/byu_hbll/\">\n <img\n class=\"hbll-footer-social\"\n src=\"https://media.lib.byu.edu/web-assets/images/1.0.0/instagram-color.svg\"\n alt=\"Instagram\"\n title=\"Instagram\"\n />\n </a>\n </li>\n </ul>\n </section>\n </div>\n <section class=\"hbll-footer-bottom\">\n <div class=\"hbll-footer-title\">\n <a href=\"https://byu.edu\" target=\"_blank\">BRIGHAM YOUNG UNIVERSITY</a>\n </div>\n <br />\n PROVO, UT 84602, USA | <a href=\"sms:801-422-6061\">(801) 422-6061</a>\n <br />&copy;&nbsp;{{ date | date: 'yyyy' }}\n ALL RIGHTS RESERVED\n <div class=\"hbll-footer-privacy\">\n <a href=\"https://privacy.byu.edu/\" target=\"_blank\">Privacy Notice</a>\n |\n <a href=\"https://infosec.byu.edu/cookie-prefs\" target=\"_blank\"\n >Cookie Preferences</a\n >\n </div>\n </section>\n </div>\n</footer>\n\n<dialog\n #emailDialog\n onmousedown=\"event.target === this && this.close()\"\n (close)=\"handleClose()\"\n data-testid=\"dialog\"\n>\n @if (!isEmailSent) {\n <form [formGroup]=\"emailForm\" (submit)=\"sendEmail()\" data-testid=\"form\">\n <div class=\"hbll-footer-email-top\">\n <h1>Email Us</h1>\n <button (click)=\"emailDialog.close()\" type=\"button\" data-testid=\"closeBtn\">\n <span class=\"material-symbols-outlined\"> close </span>\n </button>\n </div>\n <label for=\"emailName\">Name </label>\n <input\n id=\"emailName\"\n type=\"text\"\n name=\"name\"\n formControlName=\"name\"\n data-testid=\"emailNameInput\"\n />\n <label for=\"emailEmail\"> Email (please provide if you would like a response)</label>\n <input\n id=\"emailEmail\"\n type=\"text\"\n formControlName=\"email\"\n data-testid=\"emailEmailInput\"\n />\n <label for=\"emailComment\">\n Question or comment&nbsp;<span class=\"hbll-footer-email-required\">*</span>\n </label>\n <textarea\n id=\"emailComment\"\n type=\"text\"\n formControlName=\"comment\"\n data-testid=\"emailCommentInput\"\n ></textarea>\n @if (isSubmitted && emailForm.controls.comment.invalid) {\n <div\n class=\"hbll-footer-email-required hbll-footer-email-error\"\n data-testid=\"commentError\"\n >\n <span class=\"material-symbols-outlined hbll-footer-email-error-icon\">\n warning\n </span>\n <strong>Please fill out this field</strong>\n </div>\n }\n <label for=\"emailStatus\"> Status</label>\n <span class=\"hbll-footer-select-wrapper\">\n <select id=\"emailStatus\" formControlName=\"status\" data-testid=\"emailStatusInput\">\n <option selected value=\"\"></option>\n <option>Undergraduate</option>\n <option>Graduate Student</option>\n <option>Faculty</option>\n <option>Staff</option>\n <option>Library Employee</option>\n <option>Other</option>\n </select>\n </span>\n <div class=\"hbll-footer-email-bottom-bar\">\n @if (hasConnectionError) {\n <p class=\"hbll-footer-connection-error\" data-testid=\"connectionError\">\n <i>There was an error sending your email. Please try again later.</i>\n </p>\n }\n <button\n class=\"pill-btn--components\"\n type=\"submit\"\n [disabled]=\"isLoading\"\n data-testid=\"sendEmailBtn\"\n >\n Send\n </button>\n </div>\n </form>\n } @else {\n <div class=\"hbll-footer-email-success\" data-testid=\"successMessage\">\n <p>\n Your email was sent successfully. If you supplied your email address, we will get\n back to you shortly.<br />Thank you!\n </p>\n <button class=\"pill-btn--components\" (click)=\"emailDialog.close()\" type=\"button\">\n Close\n </button>\n </div>\n }\n</dialog>\n", styles: ["@import\"https://fonts.googleapis.com/css2?family=Public+Sans:ital,wght@0,200..400;1,200..400&display=swap\";*{box-sizing:border-box;text-decoration:none}*:not(.material-symbols-outlined){font-family:inherit}dialog form input,dialog form textarea,dialog form select{appearance:none;font-family:inherit;padding:.38em;border:solid 1px #707070;border-radius:4px;font-size:1em;background-color:#fff}dialog form input:focus,dialog form textarea:focus,dialog form select:focus{outline-color:#3a6093}dialog form .hbll-footer-select-wrapper{position:relative}dialog form .hbll-footer-select-wrapper select{cursor:pointer;padding-right:2em}dialog form .hbll-footer-select-wrapper:after{font-family:Material Symbols Outlined;content:\"arrow_drop_down\";pointer-events:none;top:0;font-size:1.5em;right:.2em;height:100%;position:absolute;display:flex;align-items:center;opacity:70%}.pill-btn--components{background-color:#4070b0;font-size:1em;transition:all .15s;color:#fff;cursor:pointer;font-weight:600;text-align:center}.pill-btn--components:disabled{color:#707070;background-color:#e6e6e6;pointer-events:none}.pill-btn--components:hover{background-color:#6892ca;color:#fff}.destructive.pill-btn--components{background-color:#b04940}.destructive.pill-btn--components:hover{background-color:#c7574d}.pill-btn--components{border-radius:100em;padding:.4em 1.3em}button{border:none;background-color:transparent;font-size:1em}button :hover{cursor:pointer}footer{line-height:1.2em;background-color:#e6e6e6}footer .hbll-footer-wrapper{display:flex;flex-direction:column;align-items:center}footer .hbll-footer-wrapper .hbll-footer-links{max-width:90em;display:flex;align-items:flex-start;justify-content:flex-start;flex-wrap:wrap;padding-bottom:2em;white-space:nowrap}footer .hbll-footer-wrapper .hbll-footer-links strong{font-weight:600}footer .hbll-footer-wrapper .hbll-footer-links address{font-style:normal}footer .hbll-footer-wrapper .hbll-footer-links .hbll-footer-icon{font-size:1em;margin-right:.2em;color:#002e5d}footer .hbll-footer-wrapper .hbll-footer-links section{padding:2em 1.8em 0;background-color:#e6e6e6;flex:1}footer .hbll-footer-wrapper .hbll-footer-links .hbll-footer-social-list{display:flex}footer .hbll-footer-wrapper .hbll-footer-links .hbll-footer-social-list .hbll-footer-social{height:1.5em;margin-right:1em}footer .hbll-footer-wrapper .hbll-footer-links .hbll-footer-social-list li{margin-bottom:0}footer .hbll-footer-wrapper h3{font-weight:600;color:#002e5d;font-size:1.4em;margin-bottom:1em;margin-top:0}footer .hbll-footer-wrapper ul{list-style:none;margin:.4em 0 0;padding:0}footer .hbll-footer-wrapper ul li{display:flex;align-items:center}footer .hbll-footer-wrapper ul li a,footer .hbll-footer-wrapper ul li button{display:inline-flex;align-items:center;color:#305f9c}footer .hbll-footer-wrapper ul li a:hover,footer .hbll-footer-wrapper ul li button:hover{color:#6892ca}footer .hbll-footer-wrapper ul li:not(:last-of-type){margin-bottom:.6em}footer .hbll-footer-wrapper .hbll-footer-bottom{text-align:center;background-color:#002e5d;color:#fff;font-family:Public Sans,sans-serif;font-optical-sizing:auto;font-weight:200;font-style:normal;font-size:.9em;line-height:1.6em;padding:1.8em;width:100%}footer .hbll-footer-wrapper .hbll-footer-bottom a{color:#fff}footer .hbll-footer-wrapper .hbll-footer-bottom .hbll-footer-title{font-size:2em;font-weight:400;line-height:1em}footer .hbll-footer-wrapper .hbll-footer-bottom .hbll-footer-privacy{margin-top:.4em}footer .hbll-footer-wrapper .hbll-footer-bottom .hbll-footer-privacy a{text-decoration:underline}@media screen and (max-width: 40em){.hbll-footer-links{flex-direction:column;justify-content:flex-start;width:100%}}dialog{border:solid 1px #888;border-radius:4px;width:90%;max-width:50em;padding:0;transition:all 5s ease-in-out}dialog .hbll-footer-email-success,dialog form{padding:1.6em 2em}dialog .hbll-footer-email-success p,dialog form p{text-align:center;line-height:1.4em}dialog .hbll-footer-email-success{display:flex;justify-content:center;align-items:center;flex-direction:column}dialog .hbll-footer-email-success button{margin-top:1em}dialog form{display:flex;flex-direction:column;position:relative}dialog form textarea{min-height:100px;resize:vertical}dialog form input,dialog form textarea,dialog form .hbll-footer-select-wrapper{margin-bottom:.6em}dialog form .hbll-footer-email-bottom-bar{display:flex;align-items:center;justify-content:flex-end}dialog form .hbll-footer-email-bottom-bar .hbll-footer-connection-error{text-align:right;flex-grow:1;margin:0 1em 0 0}dialog form label{margin-bottom:.4em;margin-top:.4em}dialog form .hbll-footer-email-error{display:flex;justify-content:center;align-items:center;margin-right:auto;margin-bottom:.6em;font-size:.8em}dialog form .hbll-footer-email-error .hbll-footer-email-error-icon{font-size:1.2em;margin-right:.2em}dialog form .hbll-footer-email-top{width:100%;display:flex;flex-direction:row;flex-wrap:nowrap;justify-content:space-between;align-items:center;margin-bottom:1em}dialog form .hbll-footer-email-top h1{font-size:1.4em;margin:0}dialog form .hbll-footer-email-required-message{float:right}dialog form .hbll-footer-select-wrapper{margin-right:auto}dialog form .hbll-footer-email-required{color:#d03a3a}dialog form button:not([type=submit]){color:#333}dialog form button:not([type=submit]):hover{color:#696969}dialog form button[type=submit]{margin-left:auto}dialog::backdrop{background-color:#000;opacity:.75}\n"] }]
758
+ args: [{ selector: 'lib-hbll-footer', standalone: true, imports: [CommonModule, ReactiveFormsModule], template: "<footer>\n <div class=\"hbll-footer-wrapper\">\n <div class=\"hbll-footer-links\">\n <section>\n <h3>Contact</h3>\n <ul>\n <li>\n <address>\n P.O. Box 26800<br />\n Provo, UT 84602-6800\n </address>\n </li>\n <li>\n <span class=\"material-symbols-outlined hbll-footer-icon\">\n phone_in_talk </span\n >&nbsp;\n <a href=\"tel:801-422-6061\"><strong>Call</strong>&nbsp;(801) 422-6061</a>\n </li>\n <li>\n <span class=\"material-symbols-outlined hbll-footer-icon\"> sms </span>&nbsp;\n <a href=\"sms:801-623-6838\"><strong>Text</strong>&nbsp;(801) 623-6838</a>\n </li>\n <li>\n <span class=\"material-symbols-outlined hbll-footer-icon\"> mail </span\n >&nbsp;<button (click)=\"emailDialog.showModal()\" data-testid=\"emailUsBtn\">\n <strong>Email us</strong>\n </button>\n </li>\n </ul>\n </section>\n <section>\n <h3>Resources</h3>\n <ul>\n <li>\n <a target=\"_blank\" href=\"{{ mainsitebaseurl }}/site-index/\"\n >A-Z Site Index</a\n >\n </li>\n <li>\n <a target=\"_blank\" href=\"{{ mainsitebaseurl }}/about/policies/\">Policies</a>\n </li>\n <li>\n <a target=\"_blank\" href=\"{{ mainsitebaseurl }}/about/location/\"\n >Parking & Directions</a\n >\n </li>\n <li>\n <a target=\"_blank\" href=\"https://uac.byu.edu/accessibility-lab\"\n >Accessibility Resources</a\n >\n </li>\n </ul>\n </section>\n <section>\n <h3>Friends in the Library</h3>\n <ul>\n <li>\n <a target=\"_blank\" href=\"https://ctl.byu.edu\"\n >Center for Teaching and Learning</a\n >\n </li>\n <li>\n <a target=\"_blank\" href=\"https://copyright.byu.edu\"\n >Copyright Licensing Office</a\n >\n </li>\n <li>\n <a target=\"_blank\" href=\"https://facultycenter.byu.edu/aboutus\"\n >Faculty Center</a\n >\n </li>\n <li>\n <a target=\"_blank\" href=\"https://dining.byu.edu/library-cafe\"\n >Library Cafe</a\n >\n </li>\n </ul>\n </section>\n <section>\n <h3>Connect</h3>\n <ul class=\"hbll-footer-social-list\">\n <li>\n <a target=\"_blank\" href=\"https://www.facebook.com/byuhbll\">\n <img\n class=\"hbll-footer-social\"\n src=\"https://media.lib.byu.edu/web-assets/images/1.0.0/facebook-color-round.svg\"\n alt=\"Facebook\"\n title=\"Facebook\"\n />\n </a>\n </li>\n <li>\n <a target=\"_blank\" href=\"https://www.instagram.com/byu_hbll/\">\n <img\n class=\"hbll-footer-social\"\n src=\"https://media.lib.byu.edu/web-assets/images/1.0.0/instagram-color.svg\"\n alt=\"Instagram\"\n title=\"Instagram\"\n />\n </a>\n </li>\n </ul>\n </section>\n </div>\n <section class=\"hbll-footer-bottom\">\n <div class=\"hbll-footer-title\">\n <a href=\"https://byu.edu\" target=\"_blank\">BRIGHAM YOUNG UNIVERSITY</a>\n </div>\n <br />\n PROVO, UT 84602, USA | <a href=\"sms:801-422-6061\">(801) 422-6061</a>\n <br />&copy;&nbsp;{{ date | date: 'yyyy' }}\n ALL RIGHTS RESERVED\n <div class=\"hbll-footer-privacy\">\n <a href=\"https://privacy.byu.edu/\" target=\"_blank\">Privacy Notice</a>\n |\n <a href=\"https://infosec.byu.edu/cookie-prefs\" target=\"_blank\"\n >Cookie Preferences</a\n >\n </div>\n </section>\n </div>\n</footer>\n\n<dialog\n #emailDialog\n onmousedown=\"event.target === this && this.close()\"\n (close)=\"handleClose()\"\n data-testid=\"dialog\"\n>\n @if (!isEmailSent) {\n <form [formGroup]=\"emailForm\" (submit)=\"sendEmail()\" data-testid=\"form\">\n <div class=\"hbll-footer-email-top\">\n <h1>Email Us</h1>\n <button (click)=\"emailDialog.close()\" type=\"button\" data-testid=\"closeBtn\">\n <span class=\"material-symbols-outlined\"> close </span>\n </button>\n </div>\n <label for=\"emailName\">Name</label>\n <input\n id=\"emailName\"\n type=\"text\"\n name=\"name\"\n formControlName=\"name\"\n data-testid=\"emailNameInput\"\n />\n <label for=\"emailEmail\"> Email (please provide if you would like a response)</label>\n <input\n id=\"emailEmail\"\n type=\"text\"\n formControlName=\"email\"\n data-testid=\"emailEmailInput\"\n />\n <label for=\"emailMessage\">\n Question or comment&nbsp;<span class=\"hbll-footer-email-required\">*</span>\n </label>\n <textarea\n id=\"emailMessage\"\n type=\"text\"\n formControlName=\"message\"\n data-testid=\"emailCommentInput\"\n ></textarea>\n @if (isSubmitted && emailForm.controls.message.invalid) {\n <div\n class=\"hbll-footer-email-required hbll-footer-email-error\"\n data-testid=\"commentError\"\n >\n <span class=\"material-symbols-outlined hbll-footer-email-error-icon\">\n warning\n </span>\n <strong>Please fill out this field</strong>\n </div>\n }\n <label for=\"emailStatus\">Role</label>\n <span class=\"hbll-footer-select-wrapper\">\n <select id=\"emailStatus\" formControlName=\"status\" data-testid=\"emailStatusInput\">\n <option selected value=\"\"></option>\n <option>Undergraduate</option>\n <option>Graduate Student</option>\n <option>Faculty</option>\n <option>Staff</option>\n <option>Library Employee</option>\n <option>Other</option>\n </select>\n </span>\n <div class=\"hbll-footer-email-bottom-bar\">\n @if (hasConnectionError) {\n <p class=\"hbll-footer-connection-error\" data-testid=\"connectionError\">\n <i>There was an error sending your email. Please try again later.</i>\n </p>\n }\n <button\n class=\"pill-btn--components\"\n type=\"submit\"\n [disabled]=\"isLoading\"\n data-testid=\"sendEmailBtn\"\n >\n Send\n </button>\n </div>\n </form>\n } @else {\n <div class=\"hbll-footer-email-success\" data-testid=\"successMessage\">\n <p>\n Your email was sent successfully. If you supplied your email address, we will get\n back to you shortly.<br />Thank you!\n </p>\n <button class=\"pill-btn--components\" (click)=\"emailDialog.close()\" type=\"button\">\n Close\n </button>\n </div>\n }\n</dialog>\n", styles: ["@import\"https://fonts.googleapis.com/css2?family=Public+Sans:ital,wght@0,200..400;1,200..400&display=swap\";*{box-sizing:border-box;text-decoration:none;font-size:1em}*:not(.material-symbols-outlined){font-family:inherit}dialog form input,dialog form textarea,dialog form select{appearance:none;font-family:inherit;padding:.38em;border:solid 1px #707070;border-radius:4px;font-size:1em;background-color:#fff}dialog form input:focus,dialog form textarea:focus,dialog form select:focus{outline-color:#3a6093}dialog form .hbll-footer-select-wrapper{position:relative}dialog form .hbll-footer-select-wrapper select{cursor:pointer;padding-right:2em}dialog form .hbll-footer-select-wrapper:after{font-family:Material Symbols Outlined;content:\"arrow_drop_down\";pointer-events:none;top:0;font-size:1.5em;right:.2em;height:100%;position:absolute;display:flex;align-items:center;opacity:70%}.pill-btn--components{background-color:#4070b0;font-size:1em;transition:all .15s;color:#fff;cursor:pointer;font-weight:600;text-align:center}.pill-btn--components:disabled{color:#707070;background-color:#e6e6e6;pointer-events:none}.pill-btn--components:hover{background-color:#6892ca;color:#fff}.destructive.pill-btn--components{background-color:#b04940}.destructive.pill-btn--components:hover{background-color:#c7574d}.pill-btn--components{border-radius:100em;padding:.4em 1.3em}button{border:none;background-color:transparent;font-size:1em}button :hover{cursor:pointer}footer{line-height:1.2em;background-color:#e6e6e6}footer .hbll-footer-wrapper{display:flex;flex-direction:column;align-items:center}footer .hbll-footer-wrapper .hbll-footer-links{max-width:90em;display:flex;align-items:flex-start;justify-content:flex-start;flex-wrap:wrap;padding-bottom:2em;white-space:nowrap}footer .hbll-footer-wrapper .hbll-footer-links strong{font-weight:600}footer .hbll-footer-wrapper .hbll-footer-links address{font-style:normal}footer .hbll-footer-wrapper .hbll-footer-links .hbll-footer-icon{font-size:1em;margin-right:.2em;color:#002e5d}footer .hbll-footer-wrapper .hbll-footer-links section{padding:2em 1.8em 0;background-color:#e6e6e6;flex:1}footer .hbll-footer-wrapper .hbll-footer-links .hbll-footer-social-list{display:flex}footer .hbll-footer-wrapper .hbll-footer-links .hbll-footer-social-list .hbll-footer-social{height:1.5em;margin-right:1em}footer .hbll-footer-wrapper .hbll-footer-links .hbll-footer-social-list li{margin-bottom:0}footer .hbll-footer-wrapper h3{font-weight:600;color:#002e5d;font-size:1.4em;margin-bottom:1em;margin-top:0}footer .hbll-footer-wrapper ul{list-style:none;margin:.4em 0 0;padding:0}footer .hbll-footer-wrapper ul li{display:flex;align-items:center}footer .hbll-footer-wrapper ul li a,footer .hbll-footer-wrapper ul li button{display:inline-flex;align-items:center;color:#305f9c}footer .hbll-footer-wrapper ul li a:hover,footer .hbll-footer-wrapper ul li button:hover{color:#6892ca}footer .hbll-footer-wrapper ul li:not(:last-of-type){margin-bottom:.6em}footer .hbll-footer-wrapper .hbll-footer-bottom{text-align:center;background-color:#002e5d;color:#fff;font-family:Public Sans,sans-serif;font-optical-sizing:auto;font-weight:200;font-style:normal;font-size:.9em;line-height:1.6em;padding:1.8em;width:100%}footer .hbll-footer-wrapper .hbll-footer-bottom a{color:#fff}footer .hbll-footer-wrapper .hbll-footer-bottom .hbll-footer-title{font-size:2em;font-weight:400;line-height:1em}footer .hbll-footer-wrapper .hbll-footer-bottom .hbll-footer-privacy{margin-top:.4em}footer .hbll-footer-wrapper .hbll-footer-bottom .hbll-footer-privacy a{text-decoration:underline}@media screen and (max-width: 40em){.hbll-footer-links{flex-direction:column;justify-content:flex-start;width:100%}}dialog{border:solid 1px #888;border-radius:4px;width:90%;max-width:50em;padding:0;transition:all 5s ease-in-out}dialog .hbll-footer-email-success,dialog form{padding:1.6em 2em}dialog .hbll-footer-email-success p,dialog form p{text-align:center;line-height:1.4em}dialog .hbll-footer-email-success{display:flex;justify-content:center;align-items:center;flex-direction:column}dialog .hbll-footer-email-success button{margin-top:1em}dialog form{display:flex;flex-direction:column;position:relative}dialog form textarea{min-height:100px;resize:vertical}dialog form input,dialog form textarea,dialog form .hbll-footer-select-wrapper{margin-bottom:.6em}dialog form .hbll-footer-email-bottom-bar{display:flex;align-items:center;justify-content:flex-end}dialog form .hbll-footer-email-bottom-bar .hbll-footer-connection-error{text-align:right;flex-grow:1;margin:0 1em 0 0}dialog form label{margin-bottom:.4em;margin-top:.4em}dialog form .hbll-footer-email-error{display:flex;justify-content:center;align-items:center;margin-right:auto;margin-bottom:.6em;font-size:.8em}dialog form .hbll-footer-email-error .hbll-footer-email-error-icon{font-size:1.2em;margin-right:.2em}dialog form .hbll-footer-email-top{width:100%;display:flex;flex-direction:row;flex-wrap:nowrap;justify-content:space-between;align-items:center;margin-bottom:1em}dialog form .hbll-footer-email-top h1{font-size:1.4em;margin:0}dialog form .hbll-footer-email-required-message{float:right}dialog form .hbll-footer-select-wrapper{margin-right:auto}dialog form .hbll-footer-email-required{color:#d03a3a}dialog form button:not([type=submit]){color:#333}dialog form button:not([type=submit]):hover{color:#696969}dialog form button[type=submit]{margin-left:auto}dialog::backdrop{background-color:#000;opacity:.75}\n"] }]
857
759
  }], propDecorators: { mainsitebaseurl: [{
858
760
  type: Input
859
761
  }], libraryapibaseuri: [{
@@ -922,7 +824,7 @@ class ImpersonationBannerComponent {
922
824
  this.http = inject(HttpClient);
923
825
  this.accessTokenPayload = input.required();
924
826
  this.personBaseUri = input('https://apps.lib.byu.edu/person/v2/');
925
- this.libraryApiBaseUri = input('https://staging.lib.byu.edu/v1');
827
+ this.libraryApiBaseUri = input('https://apps.lib.byu.edu/v1');
926
828
  this.endImpersonation = new EventEmitter();
927
829
  // eslint-disable-next-line @typescript-eslint/no-explicit-any
928
830
  this.parsedToken = computed(() => this.accessTokenPayload().token ? jwtDecode(this.accessTokenPayload().token) : {});
@@ -1189,11 +1091,11 @@ class ImpersonateModalComponent {
1189
1091
  this.subs.unsubscribe();
1190
1092
  }
1191
1093
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.1.0", ngImport: i0, type: ImpersonateModalComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
1192
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.1.0", type: ImpersonateModalComponent, isStandalone: true, selector: "lib-impersonate-modal", inputs: { showModal: { classPropertyName: "showModal", publicName: "showModal", isSignal: false, isRequired: false, transformFunction: null }, oidcBaseUri: { classPropertyName: "oidcBaseUri", publicName: "oidcBaseUri", isSignal: true, isRequired: false, transformFunction: null }, oidcDefaultIdp: { classPropertyName: "oidcDefaultIdp", publicName: "oidcDefaultIdp", isSignal: true, isRequired: false, transformFunction: null }, accessTokenPayload: { classPropertyName: "accessTokenPayload", publicName: "accessTokenPayload", isSignal: true, isRequired: true, transformFunction: null } }, outputs: { dismiss: "dismiss", init: "init" }, host: { listeners: { "document:mousedown": "outsideClick($event)", "document:keydown": "handleKeyDown($event)" } }, ngImport: i0, template: "@if (isOpen) {\n <div @libHbllFadeInOut class=\"modal-wrapper\" id=\"modalBackdrop\" data-testid=\"backdrop\">\n <div class=\"modal-container\" data-testid=\"modal\">\n <div class=\"modal-header\">\n <h2>Impersonate</h2>\n <button type=\"button\" (click)=\"close()\" aria-label=\"Close\" data-testid=\"close\">\n <span class=\"material-symbols-outlined icon-close\"> close </span>\n </button>\n </div>\n <form [formGroup]=\"form\" (submit)=\"handleFormSubmit($event)\" data-testid=\"searchForm\">\n <div class=\"search-header\">\n <div class=\"secondary\" [class.disabled]=\"!form.valid\">\n <span class=\"keyboard-key\">Enter</span> to search\n </div>\n </div>\n <label\n for=\"searchInput\"\n class=\"search-wrapper\"\n [class.invalid]=\"form.invalid && form.dirty\"\n >\n <span class=\"material-symbols-outlined icon-search\"> search </span>\n <input\n id=\"searchInput\"\n type=\"text\"\n autocomplete=\"off\"\n formControlName=\"search\"\n placeholder=\"Search patrons...\"\n (keydown)=\"handleSearchKeyPress($event)\"\n #searchBox\n data-testid=\"searchInput\"\n />\n @if (!!searchBox.value && form.valid) {\n <span class=\"material-symbols-outlined icon-checkmark\"> check </span>\n }\n @if (searchBox.value.length) {\n <span\n (click)=\"clearSearch()\"\n @libHbllFadeInOut\n class=\"material-symbols-outlined icon-close\"\n >\n close\n </span>\n }\n </label>\n </form>\n <fieldset\n class=\"search-results-wrapper\"\n id=\"resultsScrollContainer\"\n (change)=\"handleSelectUser($event)\"\n >\n @if (!loading && results()) {\n @for (user of results(); track user.netId; let idx = $index) {\n <div\n class=\"result-field result\"\n [class.focus]=\"user.username === selectedUsername\"\n data-testid=\"result\"\n >\n <label\n [for]=\"'result_' + idx\"\n [class.warning]=\"user.restricted\"\n (mouseover)=\"selectedUsername = user.username\"\n >\n @if (user.restricted) {\n <span class=\"material-symbols-outlined icon\"> warning </span>\n } @else {\n <span class=\"material-symbols-outlined icon\"> person </span>\n }\n &nbsp; &nbsp;\n <span [title]=\"user\" data-testid=\"resultText\">{{\n user | impersonateUser\n }}</span>\n <input\n type=\"radio\"\n [value]=\"user.username\"\n class=\"hidden\"\n [id]=\"'result_' + idx\"\n name=\"resultSelect\"\n (keydown)=\"handleResultKeyPress($event)\"\n />\n </label>\n <button\n class=\"impersonate-button\"\n data-testid=\"impersonateBtn\"\n (click)=\"startImpersonation(user.username)\"\n >\n Impersonate\n </button>\n </div>\n } @empty {\n <div class=\"result-field\">\n No results. Try searching by Net ID or BYU ID.\n </div>\n }\n }\n @if (loading) {\n <div class=\"result-field\">\n <div class=\"lib-spinner\"></div>\n </div>\n }\n @if (hasError) {\n <div class=\"result-field\">Something went wrong. We'll keep trying.</div>\n }\n </fieldset>\n </div>\n </div>\n}\n", styles: [".lib-spinner{border:.3em solid #dfe9f7;border-top:.3em solid #4070b0;border-radius:100%;width:30px;height:30px;animation:loadingSpinnerAnimate 1s ease infinite;position:relative}@keyframes loadingSpinnerAnimate{0%{transform:rotate(0)}to{transform:rotate(360deg)}}*{box-sizing:border-box}h2{font-size:1.2em;font-weight:600;margin:0;color:#404040}.warning{color:#b04940}.modal-wrapper{position:fixed;inset:0;background-color:#0000007f;z-index:6001;display:grid;place-items:center}.modal-container{color:#404040;padding:1.2em 1.4em;width:90%;max-width:30em;border-radius:4px;border:1px solid #b7b7b7;box-shadow:0 3px 6px #002e5d20;background-color:#fff;display:grid;grid-template-columns:1fr;gap:1em}.modal-container .modal-header{display:flex;justify-content:space-between;border-bottom:1px solid #e6e6e6;padding-bottom:.8em}.modal-container .modal-header .icon-close{transition:opacity .15s;color:#707070;opacity:1;cursor:pointer}.modal-container .modal-header .icon-close:hover{opacity:.8}.modal-container .hidden{opacity:0;width:0;height:0}.modal-container .search-header{display:flex;align-items:center;justify-content:flex-end;margin-bottom:.8em}.modal-container .search-header .secondary{color:#70707095}.modal-container .search-header .keyboard-key{padding:.1em .4em;border:1px solid currentColor;border-radius:4px}.modal-container .search-wrapper{display:flex;align-items:center;border-radius:4px;border:solid 1px currentColor;color:#ca7ad1cc;background-color:#e6e6e655;padding:.1em .3em .1em .5em;transition:background-color .15s,color .15s}.modal-container .search-wrapper.invalid{background-color:#b0494022}.modal-container .search-wrapper .icon-search{font-size:1.2em}.modal-container .search-wrapper .icon-checkmark{color:#1dce7b}.modal-container .search-wrapper .icon-close{color:#ca7ad1cc;cursor:pointer}.modal-container .search-wrapper .icon-close:hover{color:#ca7ad1}.modal-container .search-wrapper input[type=text]{background:transparent;border:none;outline:none;width:100%;color:#404040;padding:.5em .4em;font-size:1em}.modal-container .search-wrapper input[type=text]:focus{background-color:transparent}.modal-container .search-results-wrapper{border:none;margin:0;padding:0;max-height:25em;overflow-y:auto;overflow-x:hidden;scrollbar-width:thin;display:flex;flex-direction:column;align-items:stretch;min-width:0}.modal-container .search-results-wrapper::-webkit-scrollbar{width:6px}.modal-container .search-results-wrapper::-webkit-scrollbar-track{background:#e6e6e6}.modal-container .search-results-wrapper::-webkit-scrollbar-thumb{background-color:#b3b3b3;border-radius:5px}.modal-container .search-results-wrapper::-webkit-scrollbar-thumb:hover{background-color:#888}.modal-container .search-results-wrapper .result-field{font-style:italic;display:flex;align-items:center;justify-content:space-between;padding:.8em}.modal-container .search-results-wrapper .result-field .lib-spinner{margin:auto;display:grid;place-items:center}.modal-container .search-results-wrapper .result-field.result{font-style:normal;padding:0}.modal-container .search-results-wrapper .result-field.result label{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;flex-grow:1;padding:.8em;display:flex;align-items:center}.modal-container .search-results-wrapper .result-field.result label .icon{font-size:1.2em;margin-right:.4em}.modal-container .search-results-wrapper .result-field.result .impersonate-button{cursor:pointer;display:none;color:#ca7ad1cc;padding:.1em .6em;border:1px solid currentColor;border-radius:4px;background-color:#fff;flex-shrink:0;margin-block:.6em;margin-right:.8em}.modal-container .search-results-wrapper .result-field.result .impersonate-button:hover{color:#ca7ad1;background-color:#fff8}.modal-container .search-results-wrapper .result-field.result:active,.modal-container .search-results-wrapper .result-field.result.focus{background:#f2f2f2}.modal-container .search-results-wrapper .result-field.result.focus .impersonate-button{display:block}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "pipe", type: ImpersonateUserPipe, name: "impersonateUser" }], animations: [libHbllFadeInOut] }); }
1094
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.1.0", type: ImpersonateModalComponent, isStandalone: true, selector: "lib-impersonate-modal", inputs: { showModal: { classPropertyName: "showModal", publicName: "showModal", isSignal: false, isRequired: false, transformFunction: null }, oidcBaseUri: { classPropertyName: "oidcBaseUri", publicName: "oidcBaseUri", isSignal: true, isRequired: false, transformFunction: null }, oidcDefaultIdp: { classPropertyName: "oidcDefaultIdp", publicName: "oidcDefaultIdp", isSignal: true, isRequired: false, transformFunction: null }, accessTokenPayload: { classPropertyName: "accessTokenPayload", publicName: "accessTokenPayload", isSignal: true, isRequired: true, transformFunction: null } }, outputs: { dismiss: "dismiss", init: "init" }, host: { listeners: { "document:mousedown": "outsideClick($event)", "document:keydown": "handleKeyDown($event)" } }, ngImport: i0, template: "@if (isOpen) {\n <div @libHbllFadeInOut class=\"modal-wrapper\" id=\"modalBackdrop\" data-testid=\"backdrop\">\n <div class=\"modal-container\" data-testid=\"modal\">\n <div class=\"modal-header\">\n <h2>Impersonate</h2>\n <button type=\"button\" (click)=\"close()\" aria-label=\"Close\" data-testid=\"close\">\n <span class=\"material-symbols-outlined icon-close\"> close </span>\n </button>\n </div>\n <form [formGroup]=\"form\" (submit)=\"handleFormSubmit($event)\" data-testid=\"searchForm\">\n <div class=\"search-header\">\n <div class=\"secondary\" [class.disabled]=\"!form.valid\">\n <span class=\"keyboard-key\">Enter</span> to search\n </div>\n </div>\n <label\n for=\"searchInput\"\n class=\"search-wrapper\"\n [class.invalid]=\"form.invalid && form.dirty\"\n >\n <span class=\"material-symbols-outlined icon-search\"> search </span>\n <input\n id=\"searchInput\"\n type=\"text\"\n autocomplete=\"off\"\n formControlName=\"search\"\n placeholder=\"Search patrons...\"\n (keydown)=\"handleSearchKeyPress($event)\"\n #searchBox\n data-testid=\"searchInput\"\n />\n @if (!!searchBox.value && form.valid) {\n <span class=\"material-symbols-outlined icon-checkmark\"> check </span>\n }\n @if (searchBox.value.length) {\n <span\n (click)=\"clearSearch()\"\n @libHbllFadeInOut\n class=\"material-symbols-outlined icon-close\"\n >\n close\n </span>\n }\n </label>\n </form>\n <fieldset\n class=\"search-results-wrapper\"\n id=\"resultsScrollContainer\"\n (change)=\"handleSelectUser($event)\"\n >\n @if (!loading && results()) {\n @for (user of results(); track user.netId; let idx = $index) {\n <div\n class=\"result-field result\"\n [class.focus]=\"user.username === selectedUsername\"\n data-testid=\"result\"\n >\n <label\n [for]=\"'result_' + idx\"\n [class.warning]=\"user.restricted\"\n (mouseover)=\"selectedUsername = user.username\"\n >\n @if (user.restricted) {\n <span class=\"material-symbols-outlined icon\"> warning </span>\n } @else {\n <span class=\"material-symbols-outlined icon\"> person </span>\n }\n &nbsp; &nbsp;\n <span [title]=\"user\" data-testid=\"resultText\">{{\n user | impersonateUser\n }}</span>\n <input\n type=\"radio\"\n [value]=\"user.username\"\n class=\"hidden\"\n [id]=\"'result_' + idx\"\n name=\"resultSelect\"\n (keydown)=\"handleResultKeyPress($event)\"\n />\n </label>\n <button\n class=\"impersonate-button\"\n data-testid=\"impersonateBtn\"\n (click)=\"startImpersonation(user.username)\"\n >\n Impersonate\n </button>\n </div>\n } @empty {\n <div class=\"result-field\">\n No results. Try searching by Net ID or BYU ID.\n </div>\n }\n }\n @if (loading) {\n <div class=\"result-field\">\n <div class=\"lib-spinner\"></div>\n </div>\n }\n @if (hasError) {\n <div class=\"result-field\">Something went wrong. We'll keep trying.</div>\n }\n </fieldset>\n </div>\n </div>\n}\n", styles: [".lib-spinner{border:.3em solid #dfe9f7;border-top:.3em solid #4070b0;border-radius:100%;width:30px;height:30px;animation:loadingSpinnerAnimate 1s ease infinite;position:relative}@keyframes loadingSpinnerAnimate{0%{transform:rotate(0)}to{transform:rotate(360deg)}}*{box-sizing:border-box}h2{font-size:1.2em;font-weight:600;margin:0;color:#404040}.warning{color:#b04940}.modal-wrapper{position:fixed;inset:0;background-color:#0000007f;z-index:10000;display:grid;place-items:center}.modal-container{color:#404040;padding:1.2em 1.4em;width:90%;max-width:30em;border-radius:4px;border:1px solid #b7b7b7;box-shadow:0 3px 6px #002e5d20;background-color:#fff;display:grid;grid-template-columns:1fr;gap:1em}.modal-container .modal-header{display:flex;justify-content:space-between;border-bottom:1px solid #e6e6e6;padding-bottom:.8em}.modal-container .modal-header .icon-close{transition:opacity .15s;color:#707070;opacity:1;cursor:pointer}.modal-container .modal-header .icon-close:hover{opacity:.8}.modal-container .hidden{opacity:0;width:0;height:0}.modal-container .search-header{display:flex;align-items:center;justify-content:flex-end;margin-bottom:.8em}.modal-container .search-header .secondary{color:#70707095}.modal-container .search-header .keyboard-key{padding:.1em .4em;border:1px solid currentColor;border-radius:4px}.modal-container .search-wrapper{display:flex;align-items:center;border-radius:4px;border:solid 1px currentColor;color:#ca7ad1cc;background-color:#e6e6e655;padding:.1em .3em .1em .5em;transition:background-color .15s,color .15s}.modal-container .search-wrapper.invalid{background-color:#b0494022}.modal-container .search-wrapper .icon-search{font-size:1.2em}.modal-container .search-wrapper .icon-checkmark{color:#1dce7b}.modal-container .search-wrapper .icon-close{color:#ca7ad1cc;cursor:pointer}.modal-container .search-wrapper .icon-close:hover{color:#ca7ad1}.modal-container .search-wrapper input[type=text]{background:transparent;border:none;outline:none;width:100%;color:#404040;padding:.5em .4em;font-size:1em}.modal-container .search-wrapper input[type=text]:focus{background-color:transparent}.modal-container .search-results-wrapper{border:none;margin:0;padding:0;max-height:25em;overflow-y:auto;overflow-x:hidden;scrollbar-width:thin;display:flex;flex-direction:column;align-items:stretch;min-width:0}.modal-container .search-results-wrapper::-webkit-scrollbar{width:6px}.modal-container .search-results-wrapper::-webkit-scrollbar-track{background:#e6e6e6}.modal-container .search-results-wrapper::-webkit-scrollbar-thumb{background-color:#b3b3b3;border-radius:5px}.modal-container .search-results-wrapper::-webkit-scrollbar-thumb:hover{background-color:#888}.modal-container .search-results-wrapper .result-field{font-style:italic;display:flex;align-items:center;justify-content:space-between;padding:.8em}.modal-container .search-results-wrapper .result-field .lib-spinner{margin:auto;display:grid;place-items:center}.modal-container .search-results-wrapper .result-field.result{font-style:normal;padding:0}.modal-container .search-results-wrapper .result-field.result label{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;flex-grow:1;padding:.8em;display:flex;align-items:center}.modal-container .search-results-wrapper .result-field.result label .icon{font-size:1.2em;margin-right:.4em}.modal-container .search-results-wrapper .result-field.result .impersonate-button{cursor:pointer;display:none;color:#ca7ad1cc;padding:.1em .6em;border:1px solid currentColor;border-radius:4px;background-color:#fff;flex-shrink:0;margin-block:.6em;margin-right:.8em}.modal-container .search-results-wrapper .result-field.result .impersonate-button:hover{color:#ca7ad1;background-color:#fff8}.modal-container .search-results-wrapper .result-field.result:active,.modal-container .search-results-wrapper .result-field.result.focus{background:#f2f2f2}.modal-container .search-results-wrapper .result-field.result.focus .impersonate-button{display:block}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "pipe", type: ImpersonateUserPipe, name: "impersonateUser" }], animations: [libHbllFadeInOut] }); }
1193
1095
  }
1194
1096
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.1.0", ngImport: i0, type: ImpersonateModalComponent, decorators: [{
1195
1097
  type: Component,
1196
- args: [{ standalone: true, imports: [CommonModule, ReactiveFormsModule, ImpersonateUserPipe], selector: 'lib-impersonate-modal', animations: [libHbllFadeInOut], template: "@if (isOpen) {\n <div @libHbllFadeInOut class=\"modal-wrapper\" id=\"modalBackdrop\" data-testid=\"backdrop\">\n <div class=\"modal-container\" data-testid=\"modal\">\n <div class=\"modal-header\">\n <h2>Impersonate</h2>\n <button type=\"button\" (click)=\"close()\" aria-label=\"Close\" data-testid=\"close\">\n <span class=\"material-symbols-outlined icon-close\"> close </span>\n </button>\n </div>\n <form [formGroup]=\"form\" (submit)=\"handleFormSubmit($event)\" data-testid=\"searchForm\">\n <div class=\"search-header\">\n <div class=\"secondary\" [class.disabled]=\"!form.valid\">\n <span class=\"keyboard-key\">Enter</span> to search\n </div>\n </div>\n <label\n for=\"searchInput\"\n class=\"search-wrapper\"\n [class.invalid]=\"form.invalid && form.dirty\"\n >\n <span class=\"material-symbols-outlined icon-search\"> search </span>\n <input\n id=\"searchInput\"\n type=\"text\"\n autocomplete=\"off\"\n formControlName=\"search\"\n placeholder=\"Search patrons...\"\n (keydown)=\"handleSearchKeyPress($event)\"\n #searchBox\n data-testid=\"searchInput\"\n />\n @if (!!searchBox.value && form.valid) {\n <span class=\"material-symbols-outlined icon-checkmark\"> check </span>\n }\n @if (searchBox.value.length) {\n <span\n (click)=\"clearSearch()\"\n @libHbllFadeInOut\n class=\"material-symbols-outlined icon-close\"\n >\n close\n </span>\n }\n </label>\n </form>\n <fieldset\n class=\"search-results-wrapper\"\n id=\"resultsScrollContainer\"\n (change)=\"handleSelectUser($event)\"\n >\n @if (!loading && results()) {\n @for (user of results(); track user.netId; let idx = $index) {\n <div\n class=\"result-field result\"\n [class.focus]=\"user.username === selectedUsername\"\n data-testid=\"result\"\n >\n <label\n [for]=\"'result_' + idx\"\n [class.warning]=\"user.restricted\"\n (mouseover)=\"selectedUsername = user.username\"\n >\n @if (user.restricted) {\n <span class=\"material-symbols-outlined icon\"> warning </span>\n } @else {\n <span class=\"material-symbols-outlined icon\"> person </span>\n }\n &nbsp; &nbsp;\n <span [title]=\"user\" data-testid=\"resultText\">{{\n user | impersonateUser\n }}</span>\n <input\n type=\"radio\"\n [value]=\"user.username\"\n class=\"hidden\"\n [id]=\"'result_' + idx\"\n name=\"resultSelect\"\n (keydown)=\"handleResultKeyPress($event)\"\n />\n </label>\n <button\n class=\"impersonate-button\"\n data-testid=\"impersonateBtn\"\n (click)=\"startImpersonation(user.username)\"\n >\n Impersonate\n </button>\n </div>\n } @empty {\n <div class=\"result-field\">\n No results. Try searching by Net ID or BYU ID.\n </div>\n }\n }\n @if (loading) {\n <div class=\"result-field\">\n <div class=\"lib-spinner\"></div>\n </div>\n }\n @if (hasError) {\n <div class=\"result-field\">Something went wrong. We'll keep trying.</div>\n }\n </fieldset>\n </div>\n </div>\n}\n", styles: [".lib-spinner{border:.3em solid #dfe9f7;border-top:.3em solid #4070b0;border-radius:100%;width:30px;height:30px;animation:loadingSpinnerAnimate 1s ease infinite;position:relative}@keyframes loadingSpinnerAnimate{0%{transform:rotate(0)}to{transform:rotate(360deg)}}*{box-sizing:border-box}h2{font-size:1.2em;font-weight:600;margin:0;color:#404040}.warning{color:#b04940}.modal-wrapper{position:fixed;inset:0;background-color:#0000007f;z-index:6001;display:grid;place-items:center}.modal-container{color:#404040;padding:1.2em 1.4em;width:90%;max-width:30em;border-radius:4px;border:1px solid #b7b7b7;box-shadow:0 3px 6px #002e5d20;background-color:#fff;display:grid;grid-template-columns:1fr;gap:1em}.modal-container .modal-header{display:flex;justify-content:space-between;border-bottom:1px solid #e6e6e6;padding-bottom:.8em}.modal-container .modal-header .icon-close{transition:opacity .15s;color:#707070;opacity:1;cursor:pointer}.modal-container .modal-header .icon-close:hover{opacity:.8}.modal-container .hidden{opacity:0;width:0;height:0}.modal-container .search-header{display:flex;align-items:center;justify-content:flex-end;margin-bottom:.8em}.modal-container .search-header .secondary{color:#70707095}.modal-container .search-header .keyboard-key{padding:.1em .4em;border:1px solid currentColor;border-radius:4px}.modal-container .search-wrapper{display:flex;align-items:center;border-radius:4px;border:solid 1px currentColor;color:#ca7ad1cc;background-color:#e6e6e655;padding:.1em .3em .1em .5em;transition:background-color .15s,color .15s}.modal-container .search-wrapper.invalid{background-color:#b0494022}.modal-container .search-wrapper .icon-search{font-size:1.2em}.modal-container .search-wrapper .icon-checkmark{color:#1dce7b}.modal-container .search-wrapper .icon-close{color:#ca7ad1cc;cursor:pointer}.modal-container .search-wrapper .icon-close:hover{color:#ca7ad1}.modal-container .search-wrapper input[type=text]{background:transparent;border:none;outline:none;width:100%;color:#404040;padding:.5em .4em;font-size:1em}.modal-container .search-wrapper input[type=text]:focus{background-color:transparent}.modal-container .search-results-wrapper{border:none;margin:0;padding:0;max-height:25em;overflow-y:auto;overflow-x:hidden;scrollbar-width:thin;display:flex;flex-direction:column;align-items:stretch;min-width:0}.modal-container .search-results-wrapper::-webkit-scrollbar{width:6px}.modal-container .search-results-wrapper::-webkit-scrollbar-track{background:#e6e6e6}.modal-container .search-results-wrapper::-webkit-scrollbar-thumb{background-color:#b3b3b3;border-radius:5px}.modal-container .search-results-wrapper::-webkit-scrollbar-thumb:hover{background-color:#888}.modal-container .search-results-wrapper .result-field{font-style:italic;display:flex;align-items:center;justify-content:space-between;padding:.8em}.modal-container .search-results-wrapper .result-field .lib-spinner{margin:auto;display:grid;place-items:center}.modal-container .search-results-wrapper .result-field.result{font-style:normal;padding:0}.modal-container .search-results-wrapper .result-field.result label{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;flex-grow:1;padding:.8em;display:flex;align-items:center}.modal-container .search-results-wrapper .result-field.result label .icon{font-size:1.2em;margin-right:.4em}.modal-container .search-results-wrapper .result-field.result .impersonate-button{cursor:pointer;display:none;color:#ca7ad1cc;padding:.1em .6em;border:1px solid currentColor;border-radius:4px;background-color:#fff;flex-shrink:0;margin-block:.6em;margin-right:.8em}.modal-container .search-results-wrapper .result-field.result .impersonate-button:hover{color:#ca7ad1;background-color:#fff8}.modal-container .search-results-wrapper .result-field.result:active,.modal-container .search-results-wrapper .result-field.result.focus{background:#f2f2f2}.modal-container .search-results-wrapper .result-field.result.focus .impersonate-button{display:block}\n"] }]
1098
+ args: [{ standalone: true, imports: [CommonModule, ReactiveFormsModule, ImpersonateUserPipe], selector: 'lib-impersonate-modal', animations: [libHbllFadeInOut], template: "@if (isOpen) {\n <div @libHbllFadeInOut class=\"modal-wrapper\" id=\"modalBackdrop\" data-testid=\"backdrop\">\n <div class=\"modal-container\" data-testid=\"modal\">\n <div class=\"modal-header\">\n <h2>Impersonate</h2>\n <button type=\"button\" (click)=\"close()\" aria-label=\"Close\" data-testid=\"close\">\n <span class=\"material-symbols-outlined icon-close\"> close </span>\n </button>\n </div>\n <form [formGroup]=\"form\" (submit)=\"handleFormSubmit($event)\" data-testid=\"searchForm\">\n <div class=\"search-header\">\n <div class=\"secondary\" [class.disabled]=\"!form.valid\">\n <span class=\"keyboard-key\">Enter</span> to search\n </div>\n </div>\n <label\n for=\"searchInput\"\n class=\"search-wrapper\"\n [class.invalid]=\"form.invalid && form.dirty\"\n >\n <span class=\"material-symbols-outlined icon-search\"> search </span>\n <input\n id=\"searchInput\"\n type=\"text\"\n autocomplete=\"off\"\n formControlName=\"search\"\n placeholder=\"Search patrons...\"\n (keydown)=\"handleSearchKeyPress($event)\"\n #searchBox\n data-testid=\"searchInput\"\n />\n @if (!!searchBox.value && form.valid) {\n <span class=\"material-symbols-outlined icon-checkmark\"> check </span>\n }\n @if (searchBox.value.length) {\n <span\n (click)=\"clearSearch()\"\n @libHbllFadeInOut\n class=\"material-symbols-outlined icon-close\"\n >\n close\n </span>\n }\n </label>\n </form>\n <fieldset\n class=\"search-results-wrapper\"\n id=\"resultsScrollContainer\"\n (change)=\"handleSelectUser($event)\"\n >\n @if (!loading && results()) {\n @for (user of results(); track user.netId; let idx = $index) {\n <div\n class=\"result-field result\"\n [class.focus]=\"user.username === selectedUsername\"\n data-testid=\"result\"\n >\n <label\n [for]=\"'result_' + idx\"\n [class.warning]=\"user.restricted\"\n (mouseover)=\"selectedUsername = user.username\"\n >\n @if (user.restricted) {\n <span class=\"material-symbols-outlined icon\"> warning </span>\n } @else {\n <span class=\"material-symbols-outlined icon\"> person </span>\n }\n &nbsp; &nbsp;\n <span [title]=\"user\" data-testid=\"resultText\">{{\n user | impersonateUser\n }}</span>\n <input\n type=\"radio\"\n [value]=\"user.username\"\n class=\"hidden\"\n [id]=\"'result_' + idx\"\n name=\"resultSelect\"\n (keydown)=\"handleResultKeyPress($event)\"\n />\n </label>\n <button\n class=\"impersonate-button\"\n data-testid=\"impersonateBtn\"\n (click)=\"startImpersonation(user.username)\"\n >\n Impersonate\n </button>\n </div>\n } @empty {\n <div class=\"result-field\">\n No results. Try searching by Net ID or BYU ID.\n </div>\n }\n }\n @if (loading) {\n <div class=\"result-field\">\n <div class=\"lib-spinner\"></div>\n </div>\n }\n @if (hasError) {\n <div class=\"result-field\">Something went wrong. We'll keep trying.</div>\n }\n </fieldset>\n </div>\n </div>\n}\n", styles: [".lib-spinner{border:.3em solid #dfe9f7;border-top:.3em solid #4070b0;border-radius:100%;width:30px;height:30px;animation:loadingSpinnerAnimate 1s ease infinite;position:relative}@keyframes loadingSpinnerAnimate{0%{transform:rotate(0)}to{transform:rotate(360deg)}}*{box-sizing:border-box}h2{font-size:1.2em;font-weight:600;margin:0;color:#404040}.warning{color:#b04940}.modal-wrapper{position:fixed;inset:0;background-color:#0000007f;z-index:10000;display:grid;place-items:center}.modal-container{color:#404040;padding:1.2em 1.4em;width:90%;max-width:30em;border-radius:4px;border:1px solid #b7b7b7;box-shadow:0 3px 6px #002e5d20;background-color:#fff;display:grid;grid-template-columns:1fr;gap:1em}.modal-container .modal-header{display:flex;justify-content:space-between;border-bottom:1px solid #e6e6e6;padding-bottom:.8em}.modal-container .modal-header .icon-close{transition:opacity .15s;color:#707070;opacity:1;cursor:pointer}.modal-container .modal-header .icon-close:hover{opacity:.8}.modal-container .hidden{opacity:0;width:0;height:0}.modal-container .search-header{display:flex;align-items:center;justify-content:flex-end;margin-bottom:.8em}.modal-container .search-header .secondary{color:#70707095}.modal-container .search-header .keyboard-key{padding:.1em .4em;border:1px solid currentColor;border-radius:4px}.modal-container .search-wrapper{display:flex;align-items:center;border-radius:4px;border:solid 1px currentColor;color:#ca7ad1cc;background-color:#e6e6e655;padding:.1em .3em .1em .5em;transition:background-color .15s,color .15s}.modal-container .search-wrapper.invalid{background-color:#b0494022}.modal-container .search-wrapper .icon-search{font-size:1.2em}.modal-container .search-wrapper .icon-checkmark{color:#1dce7b}.modal-container .search-wrapper .icon-close{color:#ca7ad1cc;cursor:pointer}.modal-container .search-wrapper .icon-close:hover{color:#ca7ad1}.modal-container .search-wrapper input[type=text]{background:transparent;border:none;outline:none;width:100%;color:#404040;padding:.5em .4em;font-size:1em}.modal-container .search-wrapper input[type=text]:focus{background-color:transparent}.modal-container .search-results-wrapper{border:none;margin:0;padding:0;max-height:25em;overflow-y:auto;overflow-x:hidden;scrollbar-width:thin;display:flex;flex-direction:column;align-items:stretch;min-width:0}.modal-container .search-results-wrapper::-webkit-scrollbar{width:6px}.modal-container .search-results-wrapper::-webkit-scrollbar-track{background:#e6e6e6}.modal-container .search-results-wrapper::-webkit-scrollbar-thumb{background-color:#b3b3b3;border-radius:5px}.modal-container .search-results-wrapper::-webkit-scrollbar-thumb:hover{background-color:#888}.modal-container .search-results-wrapper .result-field{font-style:italic;display:flex;align-items:center;justify-content:space-between;padding:.8em}.modal-container .search-results-wrapper .result-field .lib-spinner{margin:auto;display:grid;place-items:center}.modal-container .search-results-wrapper .result-field.result{font-style:normal;padding:0}.modal-container .search-results-wrapper .result-field.result label{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;flex-grow:1;padding:.8em;display:flex;align-items:center}.modal-container .search-results-wrapper .result-field.result label .icon{font-size:1.2em;margin-right:.4em}.modal-container .search-results-wrapper .result-field.result .impersonate-button{cursor:pointer;display:none;color:#ca7ad1cc;padding:.1em .6em;border:1px solid currentColor;border-radius:4px;background-color:#fff;flex-shrink:0;margin-block:.6em;margin-right:.8em}.modal-container .search-results-wrapper .result-field.result .impersonate-button:hover{color:#ca7ad1;background-color:#fff8}.modal-container .search-results-wrapper .result-field.result:active,.modal-container .search-results-wrapper .result-field.result.focus{background:#f2f2f2}.modal-container .search-results-wrapper .result-field.result.focus .impersonate-button{display:block}\n"] }]
1197
1099
  }], propDecorators: { showModal: [{
1198
1100
  type: Input
1199
1101
  }], dismiss: [{