@byuhbll/components 7.1.0 → 7.1.1
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.
- package/fesm2022/byuhbll-components.mjs +33 -20
- package/fesm2022/byuhbll-components.mjs.map +1 -1
- package/index.d.ts +4 -0
- package/package.json +1 -1
- package/styles/scss/_vars.scss +16 -16
|
@@ -112,11 +112,11 @@ class NavBarDropdownComponent {
|
|
|
112
112
|
this.isOpen = false;
|
|
113
113
|
}
|
|
114
114
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: NavBarDropdownComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
115
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.15", 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 }, isInteracting: { classPropertyName: "isInteracting", publicName: "isInteracting", isSignal: false, isRequired: false, transformFunction: null } }, outputs: { openEvent: "openEvent", hoverStarted: "hoverStarted" }, ngImport: i0, template: "<span\n class=\"hbll-header-dropdown-wrapper\"\n data-testid=\"wrapper\"\n [ngClass]=\"{ 'hbll-header-desktop': !isSmallScreen() }\"\n (mouseenter)=\"handleMouseEnter()\"\n (mouseleave)=\"handleMouseLeave()\"\n>\n <button (click)=\"handleClick()\" data-testid=\"btn\" aria-haspopup=\"true\">\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 <div [class.collapsed]=\"!isOpen\" [attr.inert]=\"!isOpen ? true : null\" class=\"hbll-header-dropdown\" data-testid=\"dropdown\">\n <ng-container *ngTemplateOutlet=\"content\"></ng-container>\n </div>\n } @else {\n <lib-expand-collapse [isExpanded]=\"isOpen\" [attr.inert]=\"!isOpen ? true : null\">\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:#
|
|
115
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.15", 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 }, isInteracting: { classPropertyName: "isInteracting", publicName: "isInteracting", isSignal: false, isRequired: false, transformFunction: null } }, outputs: { openEvent: "openEvent", hoverStarted: "hoverStarted" }, ngImport: i0, template: "<span\n class=\"hbll-header-dropdown-wrapper\"\n data-testid=\"wrapper\"\n [ngClass]=\"{ 'hbll-header-desktop': !isSmallScreen() }\"\n (mouseenter)=\"handleMouseEnter()\"\n (mouseleave)=\"handleMouseLeave()\"\n>\n <button (click)=\"handleClick()\" data-testid=\"btn\" aria-haspopup=\"true\">\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 <div [class.collapsed]=\"!isOpen\" [attr.inert]=\"!isOpen ? true : null\" class=\"hbll-header-dropdown\" data-testid=\"dropdown\">\n <ng-container *ngTemplateOutlet=\"content\"></ng-container>\n </div>\n } @else {\n <lib-expand-collapse [isExpanded]=\"isOpen\" [attr.inert]=\"!isOpen ? true : null\">\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:#00245d;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}.hbll-header-dropdown-wrapper.hbll-header-desktop button:focus-visible{outline:.1875rem solid #b967c7;outline-offset:-.1875rem;border-radius:.25rem}*{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 button:focus-visible{outline:.1875rem solid #b967c7;outline-offset:-.1875rem;border-radius:.25rem}.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%;min-width:10em;top:100%;left:0;height:auto;overflow:visible;background-color:#0047ba}.hbll-header-dropdown-wrapper.hbll-header-desktop .hbll-header-dropdown.collapsed{left:-9999px;top:auto;width:1px;height:1px;overflow:hidden}\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"] }] }); }
|
|
116
116
|
}
|
|
117
117
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: NavBarDropdownComponent, decorators: [{
|
|
118
118
|
type: Component,
|
|
119
|
-
args: [{ selector: 'lib-nav-bar-dropdown', imports: [ExpandCollapseComponent, CommonModule], template: "<span\n class=\"hbll-header-dropdown-wrapper\"\n data-testid=\"wrapper\"\n [ngClass]=\"{ 'hbll-header-desktop': !isSmallScreen() }\"\n (mouseenter)=\"handleMouseEnter()\"\n (mouseleave)=\"handleMouseLeave()\"\n>\n <button (click)=\"handleClick()\" data-testid=\"btn\" aria-haspopup=\"true\">\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 <div [class.collapsed]=\"!isOpen\" [attr.inert]=\"!isOpen ? true : null\" class=\"hbll-header-dropdown\" data-testid=\"dropdown\">\n <ng-container *ngTemplateOutlet=\"content\"></ng-container>\n </div>\n } @else {\n <lib-expand-collapse [isExpanded]=\"isOpen\" [attr.inert]=\"!isOpen ? true : null\">\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:#
|
|
119
|
+
args: [{ selector: 'lib-nav-bar-dropdown', imports: [ExpandCollapseComponent, CommonModule], template: "<span\n class=\"hbll-header-dropdown-wrapper\"\n data-testid=\"wrapper\"\n [ngClass]=\"{ 'hbll-header-desktop': !isSmallScreen() }\"\n (mouseenter)=\"handleMouseEnter()\"\n (mouseleave)=\"handleMouseLeave()\"\n>\n <button (click)=\"handleClick()\" data-testid=\"btn\" aria-haspopup=\"true\">\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 <div [class.collapsed]=\"!isOpen\" [attr.inert]=\"!isOpen ? true : null\" class=\"hbll-header-dropdown\" data-testid=\"dropdown\">\n <ng-container *ngTemplateOutlet=\"content\"></ng-container>\n </div>\n } @else {\n <lib-expand-collapse [isExpanded]=\"isOpen\" [attr.inert]=\"!isOpen ? true : null\">\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:#00245d;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}.hbll-header-dropdown-wrapper.hbll-header-desktop button:focus-visible{outline:.1875rem solid #b967c7;outline-offset:-.1875rem;border-radius:.25rem}*{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 button:focus-visible{outline:.1875rem solid #b967c7;outline-offset:-.1875rem;border-radius:.25rem}.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%;min-width:10em;top:100%;left:0;height:auto;overflow:visible;background-color:#0047ba}.hbll-header-dropdown-wrapper.hbll-header-desktop .hbll-header-dropdown.collapsed{left:-9999px;top:auto;width:1px;height:1px;overflow:hidden}\n"] }]
|
|
120
120
|
}], propDecorators: { title: [{ type: i0.Input, args: [{ isSignal: true, alias: "title", required: true }] }], isSmallScreen: [{ type: i0.Input, args: [{ isSignal: true, alias: "isSmallScreen", required: false }] }], openEvent: [{
|
|
121
121
|
type: Output
|
|
122
122
|
}], hoverStarted: [{
|
|
@@ -465,11 +465,11 @@ class NavBarComponent {
|
|
|
465
465
|
this.isInteractingWithNavbar = false;
|
|
466
466
|
}
|
|
467
467
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: NavBarComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
468
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.15", 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 (mouseleave)=\"handleNavbarMouseLeave()\"\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 [isInteracting]=\"isInteractingWithNavbar\"\n (openEvent)=\"handleDropdownOpenEvent($event)\"\n (hoverStarted)=\"handleHoverStarted()\"\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 tabindex=\"0\">{{ navInfo.mainSection.title }}</h2>\n <div class=\"hbll-header-main hbll-header-links\">\n @for (link of navInfo.mainSection.links; track link.label) {\n <a [href]=\"link.url\">\n {{ link.label }}\n </a>\n }\n </div>\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 tabindex=\"0\">{{ section.title }}</h3>\n <div class=\"hbll-header-links\">\n @for (link of section.links; track link.label) {\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 }\n </div>\n @if (section.auxiliaryLink) {\n <a\n class=\"hbll-header-see-all\"\n [href]=\"section.auxiliaryLink.url\"\n >\n {{ section.auxiliaryLink.label }}\n <span class=\"material-symbols-outlined hbll-header-icon\">\n chevron_right\n </span>\n </a>\n }\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}nav.hbll-header-desktop .hbll-header-nav-bar li#navHome a:focus-visible,nav.hbll-header-desktop .hbll-header-nav-bar li #navSearch:focus-visible{outline:.1875rem solid #b967c7;outline-offset:-.1875rem;border-radius:.25rem}*{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;transition:background-color .1s ease-in-out}nav .hbll-header-nav-bar li a:hover{background-color:#fff3}nav .hbll-header-nav-bar li a:focus-visible{outline:.1875rem solid #b967c7;outline-offset:-.1875rem;border-radius:.25rem}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 #navSearch:focus-visible{outline:.1875rem solid #b967c7;outline-offset:-.1875rem;border-radius:.25rem}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 h2:focus-visible,nav .hbll-header-nav-bar li .hbll-header-content section h3:focus-visible{outline:.1875rem solid #b967c7;outline-offset:-.1875rem;border-radius:.25rem}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 li a:focus-visible{outline:.1875rem solid #b967c7;outline-offset:-.1875rem;border-radius:.25rem}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 #navSearch:focus-visible{outline:.1875rem solid #b967c7;outline-offset:-.1875rem;border-radius:.25rem}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", "isInteracting"], outputs: ["openEvent", "hoverStarted"] }] }); }
|
|
468
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.15", 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 (mouseleave)=\"handleNavbarMouseLeave()\"\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 [isInteracting]=\"isInteractingWithNavbar\"\n (openEvent)=\"handleDropdownOpenEvent($event)\"\n (hoverStarted)=\"handleHoverStarted()\"\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 tabindex=\"0\">{{ navInfo.mainSection.title }}</h2>\n <div class=\"hbll-header-main hbll-header-links\">\n @for (link of navInfo.mainSection.links; track link.label) {\n <a [href]=\"link.url\">\n {{ link.label }}\n </a>\n }\n </div>\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 tabindex=\"0\">{{ section.title }}</h3>\n <div class=\"hbll-header-links\">\n @for (link of section.links; track link.label) {\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 }\n </div>\n @if (section.auxiliaryLink) {\n <a\n class=\"hbll-header-see-all\"\n [href]=\"section.auxiliaryLink.url\"\n >\n {{ section.auxiliaryLink.label }}\n <span class=\"material-symbols-outlined hbll-header-icon\">\n chevron_right\n </span>\n </a>\n }\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:#00245d;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}nav.hbll-header-desktop .hbll-header-nav-bar li#navHome a:focus-visible,nav.hbll-header-desktop .hbll-header-nav-bar li #navSearch:focus-visible{outline:.1875rem solid #b967c7;outline-offset:-.1875rem;border-radius:.25rem}*{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;transition:background-color .1s ease-in-out}nav .hbll-header-nav-bar li a:hover{background-color:#fff3}nav .hbll-header-nav-bar li a:focus-visible{outline:.1875rem solid #b967c7;outline-offset:-.1875rem;border-radius:.25rem}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 #navSearch:focus-visible{outline:.1875rem solid #b967c7;outline-offset:-.1875rem;border-radius:.25rem}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 h2:focus-visible,nav .hbll-header-nav-bar li .hbll-header-content section h3:focus-visible{outline:.1875rem solid #b967c7;outline-offset:-.1875rem;border-radius:.25rem}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 li a:focus-visible{outline:.1875rem solid #b967c7;outline-offset:-.1875rem;border-radius:.25rem}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 #navSearch:focus-visible{outline:.1875rem solid #b967c7;outline-offset:-.1875rem;border-radius:.25rem}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", "isInteracting"], outputs: ["openEvent", "hoverStarted"] }] }); }
|
|
469
469
|
}
|
|
470
470
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: NavBarComponent, decorators: [{
|
|
471
471
|
type: Component,
|
|
472
|
-
args: [{ selector: 'lib-nav-bar', imports: [CommonModule, NavBarDropdownComponent], template: "<nav\n [style]=\"{ height: height() ? height() + 'px' : 'auto' }\"\n [ngClass]=\"{ 'hbll-header-desktop': !isScreenSmall() }\"\n data-testid=\"nav\"\n (mouseleave)=\"handleNavbarMouseLeave()\"\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 [isInteracting]=\"isInteractingWithNavbar\"\n (openEvent)=\"handleDropdownOpenEvent($event)\"\n (hoverStarted)=\"handleHoverStarted()\"\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 tabindex=\"0\">{{ navInfo.mainSection.title }}</h2>\n <div class=\"hbll-header-main hbll-header-links\">\n @for (link of navInfo.mainSection.links; track link.label) {\n <a [href]=\"link.url\">\n {{ link.label }}\n </a>\n }\n </div>\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 tabindex=\"0\">{{ section.title }}</h3>\n <div class=\"hbll-header-links\">\n @for (link of section.links; track link.label) {\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 }\n </div>\n @if (section.auxiliaryLink) {\n <a\n class=\"hbll-header-see-all\"\n [href]=\"section.auxiliaryLink.url\"\n >\n {{ section.auxiliaryLink.label }}\n <span class=\"material-symbols-outlined hbll-header-icon\">\n chevron_right\n </span>\n </a>\n }\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}nav.hbll-header-desktop .hbll-header-nav-bar li#navHome a:focus-visible,nav.hbll-header-desktop .hbll-header-nav-bar li #navSearch:focus-visible{outline:.1875rem solid #b967c7;outline-offset:-.1875rem;border-radius:.25rem}*{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;transition:background-color .1s ease-in-out}nav .hbll-header-nav-bar li a:hover{background-color:#fff3}nav .hbll-header-nav-bar li a:focus-visible{outline:.1875rem solid #b967c7;outline-offset:-.1875rem;border-radius:.25rem}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 #navSearch:focus-visible{outline:.1875rem solid #b967c7;outline-offset:-.1875rem;border-radius:.25rem}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 h2:focus-visible,nav .hbll-header-nav-bar li .hbll-header-content section h3:focus-visible{outline:.1875rem solid #b967c7;outline-offset:-.1875rem;border-radius:.25rem}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 li a:focus-visible{outline:.1875rem solid #b967c7;outline-offset:-.1875rem;border-radius:.25rem}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 #navSearch:focus-visible{outline:.1875rem solid #b967c7;outline-offset:-.1875rem;border-radius:.25rem}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"] }]
|
|
472
|
+
args: [{ selector: 'lib-nav-bar', imports: [CommonModule, NavBarDropdownComponent], template: "<nav\n [style]=\"{ height: height() ? height() + 'px' : 'auto' }\"\n [ngClass]=\"{ 'hbll-header-desktop': !isScreenSmall() }\"\n data-testid=\"nav\"\n (mouseleave)=\"handleNavbarMouseLeave()\"\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 [isInteracting]=\"isInteractingWithNavbar\"\n (openEvent)=\"handleDropdownOpenEvent($event)\"\n (hoverStarted)=\"handleHoverStarted()\"\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 tabindex=\"0\">{{ navInfo.mainSection.title }}</h2>\n <div class=\"hbll-header-main hbll-header-links\">\n @for (link of navInfo.mainSection.links; track link.label) {\n <a [href]=\"link.url\">\n {{ link.label }}\n </a>\n }\n </div>\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 tabindex=\"0\">{{ section.title }}</h3>\n <div class=\"hbll-header-links\">\n @for (link of section.links; track link.label) {\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 }\n </div>\n @if (section.auxiliaryLink) {\n <a\n class=\"hbll-header-see-all\"\n [href]=\"section.auxiliaryLink.url\"\n >\n {{ section.auxiliaryLink.label }}\n <span class=\"material-symbols-outlined hbll-header-icon\">\n chevron_right\n </span>\n </a>\n }\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:#00245d;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}nav.hbll-header-desktop .hbll-header-nav-bar li#navHome a:focus-visible,nav.hbll-header-desktop .hbll-header-nav-bar li #navSearch:focus-visible{outline:.1875rem solid #b967c7;outline-offset:-.1875rem;border-radius:.25rem}*{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;transition:background-color .1s ease-in-out}nav .hbll-header-nav-bar li a:hover{background-color:#fff3}nav .hbll-header-nav-bar li a:focus-visible{outline:.1875rem solid #b967c7;outline-offset:-.1875rem;border-radius:.25rem}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 #navSearch:focus-visible{outline:.1875rem solid #b967c7;outline-offset:-.1875rem;border-radius:.25rem}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 h2:focus-visible,nav .hbll-header-nav-bar li .hbll-header-content section h3:focus-visible{outline:.1875rem solid #b967c7;outline-offset:-.1875rem;border-radius:.25rem}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 li a:focus-visible{outline:.1875rem solid #b967c7;outline-offset:-.1875rem;border-radius:.25rem}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 #navSearch:focus-visible{outline:.1875rem solid #b967c7;outline-offset:-.1875rem;border-radius:.25rem}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"] }]
|
|
473
473
|
}], propDecorators: { mainSiteBaseUrl: [{ type: i0.Input, args: [{ isSignal: true, alias: "mainSiteBaseUrl", required: true }] }], height: [{ type: i0.Input, args: [{ isSignal: true, alias: "height", required: false }] }], dropdownComps: [{
|
|
474
474
|
type: ViewChildren,
|
|
475
475
|
args: [NavBarDropdownComponent]
|
|
@@ -606,11 +606,11 @@ class HbllHeaderComponent {
|
|
|
606
606
|
}
|
|
607
607
|
}
|
|
608
608
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: HbllHeaderComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
609
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.15", 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": "setMobileSidebarHeight()" } }, 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 }, { propertyName: "navWrapper", first: true, predicate: ["navWrapper"], descendants: true }, { propertyName: "backdrop", first: true, predicate: ["backdrop"], 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 <button (click)=\"focusMainContent()\" class=\"sr-only sr-only-focusable skip-link\">Skip to main content</button>\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:00 a.m. - 11:45 p.m.</div>\n <div class=\"hbll-header-item\">8:00 a.m. - 11:45 p.m.</div>\n <div class=\"hbll-header-item\">Closed*</div>\n </div>\n <div class=\"hbll-header-hours-note\">\n * Family history ONLY 4:00 p.m. - 8:00 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, y' }}\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 [attr.title]=\"exception.exception_title\"\n [attr.aria-label]=\"exception.exception_title\">\n {{ exception.exception_title | truncate:32:'...' }}\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:00 a.m. - 11:00 p.m.</div>\n <div class=\"hbll-header-item\">10:30 a.m. - 2:00 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-left-icon\"> person </span>\n @if (!isScreenSmall()) {\n <span class=\"hbll-header-name\" data-testid=\"name\">{{\n isLoggedIn ? ' ' + 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/courses'\">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\" [class.collapsed]=\"!showNavBar\">\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 <div\n #navWrapper\n id=\"navWrapper\"\n data-testid=\"mobileNav\"\n [class.open]=\"showNavBar\"\n [attr.inert]=\"!showNavBar ? true : null\"\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 #backdrop\n (click)=\"closeSidebarNav()\"\n class=\"hbll-nav-backdrop\"\n [class.open]=\"showNavBar\"\n data-testid=\"mobileNavBackdrop\"\n ></div>\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}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);border:0}.sr-only.sr-only-focusable:focus,.sr-only.sr-only-focusable:focus-within,.sr-only.sr-only-focusable:active{position:static;width:auto;height:auto;margin:0;overflow:visible;clip:auto}.hbll-header-wrapper{display:flex;align-items:center;font-size:1em}.skip-link{margin-left:.625rem;background:#fff;color:#00285b;font-size:.9375rem;font-weight:580;padding:.3125rem .625rem;text-decoration:none;border:.1171875rem solid #0050b7;border-radius:.15625rem;cursor:pointer;outline:.1875rem solid #b967c7;outline-offset:-.1875rem;border-radius:.25rem}.skip-link:hover{color:#00285b;background-color:#e3edf8;border:.1171875rem solid #e3edf8}.hbll-nav-backdrop{background-color:#000;opacity:.3;height:100vh;width:100vw;left:0;top:0;transform:translate(-100vw);position:absolute;z-index:-1}.hbll-nav-backdrop.open{animation-name:fadeIn;animation-duration:.15s;animation-timing-function:ease-in;animation-fill-mode:forwards}.hbll-nav-backdrop.is-closing{animation-name:fadeOut;animation-duration:.15s;animation-timing-function:ease-out;animation-fill-mode:forwards}#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:#00245d;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.collapsed #navWrapper{left:-9999px;top:auto;overflow:hidden;width:1px;height:1px}header #libraryInfo #mobileNav.collapsed .hbll-nav-backdrop{display:none}header #libraryInfo #mobileNav.collapsed nav{left:-9999px;top:auto;overflow:hidden;width:1px;height:1px}header #libraryInfo #mobileNav #navWrapper{color:#fff;position:fixed;top:0}header #libraryInfo #mobileNav #navWrapper.open{animation-name:slideInFromRight;animation-duration:.2s;animation-timing-function:ease-in-out;animation-fill-mode:forwards}header #libraryInfo #mobileNav #navWrapper.is-closing{animation-name:slideOutToRight;animation-duration:.2s;animation-timing-function:ease-in-out;animation-fill-mode:forwards}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:#00245d;top:100%;right:-32px;z-index:11}header #libraryInfo #accountInfo #accountDropdown .hbll-header-impersonate-btn{color:#bd72cb}header #libraryInfo #accountInfo #accountDropdown .hbll-header-impersonate-btn:hover{color:#d68fe2}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:12;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;margin-right:1.25rem}header.hbll-header-desktop #libraryInfo #mainLibraryHours #libraryHoursDropdown .hbll-header-section{display:grid;grid-template-columns:repeat(4,7.5em);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/-1;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{position:relative}header.hbll-header-desktop #libraryInfo #mainLibraryHours #libraryHoursDropdown .hbll-header-section .hbll-header-header{font-weight:600;font-size:1em}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}button:focus-visible{outline:.1875rem solid #b967c7;outline-offset:-.1875rem;border-radius:.25rem}a:focus-visible{outline:.1875rem solid #b967c7;outline-offset:-.1875rem;border-radius:.25rem}@keyframes slideInFromRight{0%{transform:translate(calc(min(100vw,400px) - 55px))}to{transform:translate(0)}}@keyframes slideOutToRight{0%{transform:translate(0)}to{transform:translate(min(100vw,400px))}}@keyframes fadeIn{0%{opacity:0}to{opacity:.3}}@keyframes fadeOut{0%{opacity:.3}to{opacity:0}}\n"], dependencies: [{ 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: "component", type: NavBarComponent, selector: "lib-nav-bar", inputs: ["mainSiteBaseUrl", "height"] }, { kind: "pipe", type: DatePipe, name: "date" }, { kind: "pipe", type: LibraryHoursPipe, name: "libraryHours" }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }, { kind: "pipe", type: TruncatePipe, name: "truncate" }], animations: [libHbllFadeInOut] }); }
|
|
609
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.15", 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": "setMobileSidebarHeight()" } }, 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 }, { propertyName: "navWrapper", first: true, predicate: ["navWrapper"], descendants: true }, { propertyName: "backdrop", first: true, predicate: ["backdrop"], 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 <button (click)=\"focusMainContent()\" class=\"sr-only sr-only-focusable skip-link\">Skip to main content</button>\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:00 a.m. - 11:45 p.m.</div>\n <div class=\"hbll-header-item\">8:00 a.m. - 11:45 p.m.</div>\n <div class=\"hbll-header-item\">Closed*</div>\n </div>\n <div class=\"hbll-header-hours-note\">\n * Family history ONLY 4:00 p.m. - 8:00 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, y' }}\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 [attr.title]=\"exception.exception_title\"\n [attr.aria-label]=\"exception.exception_title\">\n {{ exception.exception_title | truncate:32:'...' }}\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:00 a.m. - 11:00 p.m.</div>\n <div class=\"hbll-header-item\">10:30 a.m. - 2:00 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-left-icon\"> person </span>\n @if (!isScreenSmall()) {\n <span class=\"hbll-header-name\" data-testid=\"name\">{{\n isLoggedIn ? ' ' + 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/courses'\">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\" [class.collapsed]=\"!showNavBar\">\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 <div\n #navWrapper\n id=\"navWrapper\"\n data-testid=\"mobileNav\"\n [class.open]=\"showNavBar\"\n [attr.inert]=\"!showNavBar ? true : null\"\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 #backdrop\n (click)=\"closeSidebarNav()\"\n class=\"hbll-nav-backdrop\"\n [class.open]=\"showNavBar\"\n data-testid=\"mobileNavBackdrop\"\n ></div>\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 #457fa6;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}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);border:0}.sr-only.sr-only-focusable:focus,.sr-only.sr-only-focusable:focus-within,.sr-only.sr-only-focusable:active{position:static;width:auto;height:auto;margin:0;overflow:visible;clip:auto}.hbll-header-wrapper{display:flex;align-items:center;font-size:1em}.skip-link{margin-left:.625rem;background:#fff;color:#00285b;font-size:.9375rem;font-weight:580;padding:.3125rem .625rem;text-decoration:none;border:.1171875rem solid #0050b7;border-radius:.15625rem;cursor:pointer;outline:.1875rem solid #b967c7;outline-offset:-.1875rem;border-radius:.25rem}.skip-link:hover{color:#00285b;background-color:#e3edf8;border:.1171875rem solid #e3edf8}.hbll-nav-backdrop{background-color:#000;opacity:.3;height:100vh;width:100vw;left:0;top:0;transform:translate(-100vw);position:absolute;z-index:-1}.hbll-nav-backdrop.open{animation-name:fadeIn;animation-duration:.15s;animation-timing-function:ease-in;animation-fill-mode:forwards}.hbll-nav-backdrop.is-closing{animation-name:fadeOut;animation-duration:.15s;animation-timing-function:ease-out;animation-fill-mode:forwards}#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:#00245d;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.collapsed #navWrapper{left:-9999px;top:auto;overflow:hidden;width:1px;height:1px}header #libraryInfo #mobileNav.collapsed .hbll-nav-backdrop{display:none}header #libraryInfo #mobileNav.collapsed nav{left:-9999px;top:auto;overflow:hidden;width:1px;height:1px}header #libraryInfo #mobileNav #navWrapper{color:#fff;position:fixed;top:0}header #libraryInfo #mobileNav #navWrapper.open{animation-name:slideInFromRight;animation-duration:.2s;animation-timing-function:ease-in-out;animation-fill-mode:forwards}header #libraryInfo #mobileNav #navWrapper.is-closing{animation-name:slideOutToRight;animation-duration:.2s;animation-timing-function:ease-in-out;animation-fill-mode:forwards}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:#00245d;top:100%;right:-32px;z-index:11}header #libraryInfo #accountInfo #accountDropdown .hbll-header-impersonate-btn{color:#bd72cb}header #libraryInfo #accountInfo #accountDropdown .hbll-header-impersonate-btn:hover{color:#d68fe2}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:12;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;margin-right:1.25rem}header.hbll-header-desktop #libraryInfo #mainLibraryHours #libraryHoursDropdown .hbll-header-section{display:grid;grid-template-columns:repeat(4,7.5em);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/-1;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{position:relative}header.hbll-header-desktop #libraryInfo #mainLibraryHours #libraryHoursDropdown .hbll-header-section .hbll-header-header{font-weight:600;font-size:1em}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:#457fa6;display:flex;align-items:center;float:right}header.hbll-header-desktop #libraryInfo #mainLibraryHours #libraryHoursDropdown a:hover{color:#a2bfd3}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}button:focus-visible{outline:.1875rem solid #b967c7;outline-offset:-.1875rem;border-radius:.25rem}a:focus-visible{outline:.1875rem solid #b967c7;outline-offset:-.1875rem;border-radius:.25rem}@keyframes slideInFromRight{0%{transform:translate(calc(min(100vw,400px) - 55px))}to{transform:translate(0)}}@keyframes slideOutToRight{0%{transform:translate(0)}to{transform:translate(min(100vw,400px))}}@keyframes fadeIn{0%{opacity:0}to{opacity:.3}}@keyframes fadeOut{0%{opacity:.3}to{opacity:0}}\n"], dependencies: [{ 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: "component", type: NavBarComponent, selector: "lib-nav-bar", inputs: ["mainSiteBaseUrl", "height"] }, { kind: "pipe", type: DatePipe, name: "date" }, { kind: "pipe", type: LibraryHoursPipe, name: "libraryHours" }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }, { kind: "pipe", type: TruncatePipe, name: "truncate" }], animations: [libHbllFadeInOut] }); }
|
|
610
610
|
}
|
|
611
611
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: HbllHeaderComponent, decorators: [{
|
|
612
612
|
type: Component,
|
|
613
|
-
args: [{ selector: 'lib-hbll-header', imports: [DatePipe, LibraryHoursPipe, CommonModule, NavBarComponent, TruncatePipe], animations: [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 <button (click)=\"focusMainContent()\" class=\"sr-only sr-only-focusable skip-link\">Skip to main content</button>\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:00 a.m. - 11:45 p.m.</div>\n <div class=\"hbll-header-item\">8:00 a.m. - 11:45 p.m.</div>\n <div class=\"hbll-header-item\">Closed*</div>\n </div>\n <div class=\"hbll-header-hours-note\">\n * Family history ONLY 4:00 p.m. - 8:00 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, y' }}\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 [attr.title]=\"exception.exception_title\"\n [attr.aria-label]=\"exception.exception_title\">\n {{ exception.exception_title | truncate:32:'...' }}\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:00 a.m. - 11:00 p.m.</div>\n <div class=\"hbll-header-item\">10:30 a.m. - 2:00 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-left-icon\"> person </span>\n @if (!isScreenSmall()) {\n <span class=\"hbll-header-name\" data-testid=\"name\">{{\n isLoggedIn ? ' ' + 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/courses'\">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\" [class.collapsed]=\"!showNavBar\">\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 <div\n #navWrapper\n id=\"navWrapper\"\n data-testid=\"mobileNav\"\n [class.open]=\"showNavBar\"\n [attr.inert]=\"!showNavBar ? true : null\"\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 #backdrop\n (click)=\"closeSidebarNav()\"\n class=\"hbll-nav-backdrop\"\n [class.open]=\"showNavBar\"\n data-testid=\"mobileNavBackdrop\"\n ></div>\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}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);border:0}.sr-only.sr-only-focusable:focus,.sr-only.sr-only-focusable:focus-within,.sr-only.sr-only-focusable:active{position:static;width:auto;height:auto;margin:0;overflow:visible;clip:auto}.hbll-header-wrapper{display:flex;align-items:center;font-size:1em}.skip-link{margin-left:.625rem;background:#fff;color:#00285b;font-size:.9375rem;font-weight:580;padding:.3125rem .625rem;text-decoration:none;border:.1171875rem solid #0050b7;border-radius:.15625rem;cursor:pointer;outline:.1875rem solid #b967c7;outline-offset:-.1875rem;border-radius:.25rem}.skip-link:hover{color:#00285b;background-color:#e3edf8;border:.1171875rem solid #e3edf8}.hbll-nav-backdrop{background-color:#000;opacity:.3;height:100vh;width:100vw;left:0;top:0;transform:translate(-100vw);position:absolute;z-index:-1}.hbll-nav-backdrop.open{animation-name:fadeIn;animation-duration:.15s;animation-timing-function:ease-in;animation-fill-mode:forwards}.hbll-nav-backdrop.is-closing{animation-name:fadeOut;animation-duration:.15s;animation-timing-function:ease-out;animation-fill-mode:forwards}#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:#00245d;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.collapsed #navWrapper{left:-9999px;top:auto;overflow:hidden;width:1px;height:1px}header #libraryInfo #mobileNav.collapsed .hbll-nav-backdrop{display:none}header #libraryInfo #mobileNav.collapsed nav{left:-9999px;top:auto;overflow:hidden;width:1px;height:1px}header #libraryInfo #mobileNav #navWrapper{color:#fff;position:fixed;top:0}header #libraryInfo #mobileNav #navWrapper.open{animation-name:slideInFromRight;animation-duration:.2s;animation-timing-function:ease-in-out;animation-fill-mode:forwards}header #libraryInfo #mobileNav #navWrapper.is-closing{animation-name:slideOutToRight;animation-duration:.2s;animation-timing-function:ease-in-out;animation-fill-mode:forwards}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:#00245d;top:100%;right:-32px;z-index:11}header #libraryInfo #accountInfo #accountDropdown .hbll-header-impersonate-btn{color:#bd72cb}header #libraryInfo #accountInfo #accountDropdown .hbll-header-impersonate-btn:hover{color:#d68fe2}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:12;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;margin-right:1.25rem}header.hbll-header-desktop #libraryInfo #mainLibraryHours #libraryHoursDropdown .hbll-header-section{display:grid;grid-template-columns:repeat(4,7.5em);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/-1;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{position:relative}header.hbll-header-desktop #libraryInfo #mainLibraryHours #libraryHoursDropdown .hbll-header-section .hbll-header-header{font-weight:600;font-size:1em}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}button:focus-visible{outline:.1875rem solid #b967c7;outline-offset:-.1875rem;border-radius:.25rem}a:focus-visible{outline:.1875rem solid #b967c7;outline-offset:-.1875rem;border-radius:.25rem}@keyframes slideInFromRight{0%{transform:translate(calc(min(100vw,400px) - 55px))}to{transform:translate(0)}}@keyframes slideOutToRight{0%{transform:translate(0)}to{transform:translate(min(100vw,400px))}}@keyframes fadeIn{0%{opacity:0}to{opacity:.3}}@keyframes fadeOut{0%{opacity:.3}to{opacity:0}}\n"] }]
|
|
613
|
+
args: [{ selector: 'lib-hbll-header', imports: [DatePipe, LibraryHoursPipe, CommonModule, NavBarComponent, TruncatePipe], animations: [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 <button (click)=\"focusMainContent()\" class=\"sr-only sr-only-focusable skip-link\">Skip to main content</button>\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:00 a.m. - 11:45 p.m.</div>\n <div class=\"hbll-header-item\">8:00 a.m. - 11:45 p.m.</div>\n <div class=\"hbll-header-item\">Closed*</div>\n </div>\n <div class=\"hbll-header-hours-note\">\n * Family history ONLY 4:00 p.m. - 8:00 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, y' }}\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 [attr.title]=\"exception.exception_title\"\n [attr.aria-label]=\"exception.exception_title\">\n {{ exception.exception_title | truncate:32:'...' }}\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:00 a.m. - 11:00 p.m.</div>\n <div class=\"hbll-header-item\">10:30 a.m. - 2:00 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-left-icon\"> person </span>\n @if (!isScreenSmall()) {\n <span class=\"hbll-header-name\" data-testid=\"name\">{{\n isLoggedIn ? ' ' + 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/courses'\">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\" [class.collapsed]=\"!showNavBar\">\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 <div\n #navWrapper\n id=\"navWrapper\"\n data-testid=\"mobileNav\"\n [class.open]=\"showNavBar\"\n [attr.inert]=\"!showNavBar ? true : null\"\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 #backdrop\n (click)=\"closeSidebarNav()\"\n class=\"hbll-nav-backdrop\"\n [class.open]=\"showNavBar\"\n data-testid=\"mobileNavBackdrop\"\n ></div>\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 #457fa6;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}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);border:0}.sr-only.sr-only-focusable:focus,.sr-only.sr-only-focusable:focus-within,.sr-only.sr-only-focusable:active{position:static;width:auto;height:auto;margin:0;overflow:visible;clip:auto}.hbll-header-wrapper{display:flex;align-items:center;font-size:1em}.skip-link{margin-left:.625rem;background:#fff;color:#00285b;font-size:.9375rem;font-weight:580;padding:.3125rem .625rem;text-decoration:none;border:.1171875rem solid #0050b7;border-radius:.15625rem;cursor:pointer;outline:.1875rem solid #b967c7;outline-offset:-.1875rem;border-radius:.25rem}.skip-link:hover{color:#00285b;background-color:#e3edf8;border:.1171875rem solid #e3edf8}.hbll-nav-backdrop{background-color:#000;opacity:.3;height:100vh;width:100vw;left:0;top:0;transform:translate(-100vw);position:absolute;z-index:-1}.hbll-nav-backdrop.open{animation-name:fadeIn;animation-duration:.15s;animation-timing-function:ease-in;animation-fill-mode:forwards}.hbll-nav-backdrop.is-closing{animation-name:fadeOut;animation-duration:.15s;animation-timing-function:ease-out;animation-fill-mode:forwards}#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:#00245d;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.collapsed #navWrapper{left:-9999px;top:auto;overflow:hidden;width:1px;height:1px}header #libraryInfo #mobileNav.collapsed .hbll-nav-backdrop{display:none}header #libraryInfo #mobileNav.collapsed nav{left:-9999px;top:auto;overflow:hidden;width:1px;height:1px}header #libraryInfo #mobileNav #navWrapper{color:#fff;position:fixed;top:0}header #libraryInfo #mobileNav #navWrapper.open{animation-name:slideInFromRight;animation-duration:.2s;animation-timing-function:ease-in-out;animation-fill-mode:forwards}header #libraryInfo #mobileNav #navWrapper.is-closing{animation-name:slideOutToRight;animation-duration:.2s;animation-timing-function:ease-in-out;animation-fill-mode:forwards}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:#00245d;top:100%;right:-32px;z-index:11}header #libraryInfo #accountInfo #accountDropdown .hbll-header-impersonate-btn{color:#bd72cb}header #libraryInfo #accountInfo #accountDropdown .hbll-header-impersonate-btn:hover{color:#d68fe2}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:12;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;margin-right:1.25rem}header.hbll-header-desktop #libraryInfo #mainLibraryHours #libraryHoursDropdown .hbll-header-section{display:grid;grid-template-columns:repeat(4,7.5em);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/-1;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{position:relative}header.hbll-header-desktop #libraryInfo #mainLibraryHours #libraryHoursDropdown .hbll-header-section .hbll-header-header{font-weight:600;font-size:1em}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:#457fa6;display:flex;align-items:center;float:right}header.hbll-header-desktop #libraryInfo #mainLibraryHours #libraryHoursDropdown a:hover{color:#a2bfd3}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}button:focus-visible{outline:.1875rem solid #b967c7;outline-offset:-.1875rem;border-radius:.25rem}a:focus-visible{outline:.1875rem solid #b967c7;outline-offset:-.1875rem;border-radius:.25rem}@keyframes slideInFromRight{0%{transform:translate(calc(min(100vw,400px) - 55px))}to{transform:translate(0)}}@keyframes slideOutToRight{0%{transform:translate(0)}to{transform:translate(min(100vw,400px))}}@keyframes fadeIn{0%{opacity:0}to{opacity:.3}}@keyframes fadeOut{0%{opacity:.3}to{opacity:0}}\n"] }]
|
|
614
614
|
}], propDecorators: { header: [{
|
|
615
615
|
type: ViewChild,
|
|
616
616
|
args: ['header']
|
|
@@ -1124,11 +1124,11 @@ class HbllFooterComponent {
|
|
|
1124
1124
|
}
|
|
1125
1125
|
}
|
|
1126
1126
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: HbllFooterComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
1127
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.15", type: HbllFooterComponent, isStandalone: true, selector: "lib-hbll-footer", inputs: { mainsitebaseurl: "mainsitebaseurl", myaccountapibaseuri: "myaccountapibaseuri", byuid: "byuid", emailname: "emailname", emailemail: "emailemail", emailmessage: "emailmessage", emailstatus: "emailstatus" }, viewQueries: [{ propertyName: "emailDialog", first: true, predicate: ["emailDialog"], descendants: true }], ngImport: i0, template: "<footer>\n <div class=\"hbll-footer-wrapper\">\n <div class=\"skip-link-footer\">\n <lib-button\n class=\"skip-link-footer sr-only sr-only-focusable\"\n buttonType=\"secondary\"\n [isThin]=\"true\"\n title=\"Skip footer\"\n (buttonClick)=\"skipFooter()\"\n ></lib-button>\n </div>\n <div class=\"hbll-footer-links\">\n <section aria-labelledby=\"footerContactHeading\">\n <h3 id=\"footerContactHeading\">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 <lib-link\n href=\"tel:801-422-6061\"\n textHtml=\"<strong>Call</strong> (801) 422-6061\"\n ariaLabel=\"Call (801) 422-6061\"\n leftIcon=\"phone_in_talk\"\n >\n </lib-link>\n </li>\n <li>\n <lib-link\n href=\"sms:801-623-6838\"\n textHtml=\"<strong>Text</strong> (801) 623-6838\"\n ariaLabel=\"Text (801) 623-6838\"\n leftIcon=\"sms\"\n ></lib-link>\n </li>\n <li>\n <lib-link\n href=\"javascript:void(0)\"\n textHtml=\"<strong>Email us</strong>\"\n ariaLabel=\"Email us\"\n leftIcon=\"mail\"\n (linkClick)=\"emailDialog.showModal()\"\n data-testid=\"emailUsBtn\"\n ></lib-link>\n </li>\n </ul>\n </section>\n <section aria-labelledby=\"footerResourcesHeading\">\n <h3 id=\"footerResourcesHeading\">Resources</h3>\n <ul>\n <li>\n <lib-link\n href=\"{{ mainsitebaseurl }}/site-index/\"\n target=\"_blank\"\n text=\"A-Z Site Index\"\n ></lib-link>\n </li>\n <li>\n <lib-link\n href=\"{{ mainsitebaseurl }}/about/policies/\"\n target=\"_blank\"\n text=\"Policies\"\n ></lib-link>\n </li>\n <li>\n <lib-link\n href=\"{{ mainsitebaseurl }}/about/location/\"\n target=\"_blank\"\n text=\"Parking & Directions\"\n ></lib-link>\n </li>\n <li>\n <lib-link\n href=\"https://uac.byu.edu/accessibility-lab\"\n target=\"_blank\"\n text=\"Accessibility Resources\"\n ></lib-link>\n </li>\n <li>\n <lib-link\n href=\"https://hr.lib.byu.edu/byu-library-jobs\"\n target=\"_blank\"\n text=\"Employment Opportunities\"\n ></lib-link>\n </li>\n </ul>\n </section>\n <section aria-labelledby=\"footerFriendsHeading\">\n <h3 id=\"footerFriendsHeading\">Friends in the Library</h3>\n <ul>\n <li>\n <lib-link\n href=\"https://ctl.byu.edu\"\n target=\"_blank\"\n text=\"Center for Teaching and Learning\"\n ></lib-link>\n </li>\n <li>\n <lib-link\n href=\"https://copyright.byu.edu\"\n target=\"_blank\"\n text=\"Copyright Licensing Office\"\n ></lib-link>\n </li>\n <li>\n <lib-link\n href=\"https://facultycenter.byu.edu/aboutus\"\n target=\"_blank\"\n text=\"Faculty Center\"\n ></lib-link>\n </li>\n <li>\n <lib-link\n href=\"https://dining.byu.edu/library-cafe\"\n target=\"_blank\"\n text=\"Library Cafe\"\n ></lib-link>\n </li>\n </ul>\n </section>\n <section aria-labelledby=\"footerConnectHeading\">\n <h3 id=\"footerConnectHeading\">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 <ul>\n <li>\n <lib-link\n href=\"https://lib.byu.edu/announcements\"\n leftIcon=\"featured_seasonal_and_gifts\"\n text=\"Explore what\u2019s new\"\n ></lib-link>\n </li>\n </ul>\n </section>\n </div>\n <section class=\"hbll-footer-bottom\" aria-label=\"Bottom-most part of the footer\">\n <div class=\"hbll-footer-title\">\n <lib-link\n href=\"https://byu.edu\"\n target=\"_blank\"\n text=\"BRIGHAM YOUNG UNIVERSITY\"\n ></lib-link>\n </div>\n <br />\n PROVO, UT 84602, USA |\n <lib-link href=\"sms:801-422-6061\" text=\"(801) 422-6061\"></lib-link>\n <br />© {{ date | date: 'yyyy' }}\n ALL RIGHTS RESERVED\n <div class=\"hbll-footer-privacy\">\n <lib-link\n href=\"https://privacy.byu.edu/\"\n target=\"_blank\"\n text=\"Privacy Notice\"\n ></lib-link>\n |\n <span id=\"teconsent\"></span>\n </div>\n </section>\n </div>\n <div id=\"consent-banner\"></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=\"hbllFooterEmailName\">Name</label>\n <input\n id=\"hbllFooterEmailName\"\n type=\"text\"\n formControlName=\"name\"\n data-testid=\"emailNameInput\"\n />\n <label for=\"hbllFooterEmailEmail\">\n Email (please provide if you would like a response)</label\n >\n <input\n id=\"hbllFooterEmailEmail\"\n type=\"text\"\n formControlName=\"email\"\n data-testid=\"emailEmailInput\"\n />\n <label for=\"hbllFooterEmailQuestionComment\">\n Question or comment <span class=\"hbll-footer-email-required\">*</span>\n </label>\n <textarea\n id=\"hbllFooterEmailQuestionComment\"\n type=\"text\"\n formControlName=\"message\"\n data-testid=\"emailMessageInput\"\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=\"hbllFooterEmailStatus\">Role</label>\n <span class=\"hbll-footer-select-wrapper\">\n <select\n id=\"hbllFooterEmailStatus\"\n formControlName=\"status\"\n data-testid=\"emailStatusInput\"\n >\n <option selected value=\"\"></option>\n @for (status of userStatuses | slice: 1; track status) {\n <option [value]=\"status\">{{ status }}</option>\n }\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=IBM+Plex+Sans:ital,wght@0,100..700;1,100..700&display=swap\";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 .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}*{box-sizing:border-box;text-decoration:none;font-size:1em}*:not(.material-symbols-outlined){font-family:inherit}.pill-btn--components{border-radius:100em;padding:.4em 1.3em}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);border:0}.sr-only.sr-only-focusable:focus,.sr-only.sr-only-focusable:focus-within,.sr-only.sr-only-focusable:active{position:static;width:auto;height:auto;margin:0;overflow:visible;clip:auto}button{border:none;background-color:transparent;font-size:1em}button :hover{cursor:pointer}.skip-link-footer{position:absolute;top:30px;left:30px}footer{line-height:1.2em;background-color:#e6e6e6}footer a{padding:4px}footer ::ng-deep #consent-banner{z-index:11;position:fixed}footer .hbll-footer-wrapper{display:flex;flex-direction:column;align-items:center;position:relative}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:1.25rem!important;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 a{border-radius:.25rem;display:inline-flex;outline:none}footer .hbll-footer-wrapper .hbll-footer-links .hbll-footer-social-list a:focus-visible{outline:2px solid var(--color-purple-focus, #b967c7);outline-offset:2px}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 .hbll-footer-links .social-icon{font-size:20px;padding:2px}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:IBM Plex Sans,sans-serif;font-optical-sizing:auto;font-weight:300;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 ::ng-deep lib-link .link{color:#fff}footer .hbll-footer-wrapper .hbll-footer-bottom ::ng-deep lib-link .link:hover,footer .hbll-footer-wrapper .hbll-footer-bottom ::ng-deep lib-link .link:focus-visible{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;display:flex;align-items:center;justify-content:center;gap:5px}footer .hbll-footer-wrapper .hbll-footer-bottom .hbll-footer-privacy a{text-decoration:underline}footer .hbll-footer-wrapper .hbll-footer-bottom .hbll-footer-privacy ::ng-deep lib-link .link__text{text-decoration:underline}footer .hbll-footer-wrapper .hbll-footer-bottom .hbll-footer-privacy ::ng-deep #teconsent a{color:#fff;text-decoration:underline;padding:4px}footer .hbll-footer-wrapper .hbll-footer-bottom .hbll-footer-privacy ::ng-deep #teconsent a:hover{color:#fff}@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: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$1.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i1$1.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i1$1.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: i1$1.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: ButtonComponent, selector: "lib-button", inputs: ["buttonType", "title", "iconBefore", "iconAfter", "disabled", "isThin", "ariaLabel", "minWidth", "pill", "color"], outputs: ["buttonClick"] }, { kind: "component", type: LinkComponent, selector: "lib-link", inputs: ["text", "textHtml", "imageSrc", "imageAlt", "imageTitle", "imageClass", "href", "target", "rel", "type", "state", "disabled", "leftIcon", "rightIcon", "ariaLabel"], outputs: ["linkClick"] }, { kind: "pipe", type: i1.SlicePipe, name: "slice" }, { kind: "pipe", type: i1.DatePipe, name: "date" }] }); }
|
|
1127
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.15", type: HbllFooterComponent, isStandalone: true, selector: "lib-hbll-footer", inputs: { mainsitebaseurl: "mainsitebaseurl", myaccountapibaseuri: "myaccountapibaseuri", byuid: "byuid", emailname: "emailname", emailemail: "emailemail", emailmessage: "emailmessage", emailstatus: "emailstatus" }, viewQueries: [{ propertyName: "emailDialog", first: true, predicate: ["emailDialog"], descendants: true }], ngImport: i0, template: "<footer>\n <div class=\"hbll-footer-wrapper\">\n <div class=\"skip-link-footer\">\n <lib-button\n class=\"skip-link-footer sr-only sr-only-focusable\"\n buttonType=\"secondary\"\n [isThin]=\"true\"\n title=\"Skip footer\"\n (buttonClick)=\"skipFooter()\"\n ></lib-button>\n </div>\n <div class=\"hbll-footer-links\">\n <section aria-labelledby=\"footerContactHeading\">\n <h3 id=\"footerContactHeading\">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 <lib-link\n href=\"tel:801-422-6061\"\n textHtml=\"<strong>Call</strong> (801) 422-6061\"\n ariaLabel=\"Call (801) 422-6061\"\n leftIcon=\"phone_in_talk\"\n >\n </lib-link>\n </li>\n <li>\n <lib-link\n href=\"sms:801-623-6838\"\n textHtml=\"<strong>Text</strong> (801) 623-6838\"\n ariaLabel=\"Text (801) 623-6838\"\n leftIcon=\"sms\"\n ></lib-link>\n </li>\n <li>\n <lib-link\n href=\"javascript:void(0)\"\n textHtml=\"<strong>Email us</strong>\"\n ariaLabel=\"Email us\"\n leftIcon=\"mail\"\n (linkClick)=\"emailDialog.showModal()\"\n data-testid=\"emailUsBtn\"\n ></lib-link>\n </li>\n </ul>\n </section>\n <section aria-labelledby=\"footerResourcesHeading\">\n <h3 id=\"footerResourcesHeading\">Resources</h3>\n <ul>\n <li>\n <lib-link\n href=\"{{ mainsitebaseurl }}/site-index/\"\n target=\"_blank\"\n text=\"A-Z Site Index\"\n ></lib-link>\n </li>\n <li>\n <lib-link\n href=\"{{ mainsitebaseurl }}/about/policies/\"\n target=\"_blank\"\n text=\"Policies\"\n ></lib-link>\n </li>\n <li>\n <lib-link\n href=\"{{ mainsitebaseurl }}/about/location/\"\n target=\"_blank\"\n text=\"Parking & Directions\"\n ></lib-link>\n </li>\n <li>\n <lib-link\n href=\"https://uac.byu.edu/accessibility-lab\"\n target=\"_blank\"\n text=\"Accessibility Resources\"\n ></lib-link>\n </li>\n <li>\n <lib-link\n href=\"https://hr.lib.byu.edu/byu-library-jobs\"\n target=\"_blank\"\n text=\"Employment Opportunities\"\n ></lib-link>\n </li>\n </ul>\n </section>\n <section aria-labelledby=\"footerFriendsHeading\">\n <h3 id=\"footerFriendsHeading\">Friends in the Library</h3>\n <ul>\n <li>\n <lib-link\n href=\"https://ctl.byu.edu\"\n target=\"_blank\"\n text=\"Center for Teaching and Learning\"\n ></lib-link>\n </li>\n <li>\n <lib-link\n href=\"https://copyright.byu.edu\"\n target=\"_blank\"\n text=\"Copyright Licensing Office\"\n ></lib-link>\n </li>\n <li>\n <lib-link\n href=\"https://facultycenter.byu.edu/aboutus\"\n target=\"_blank\"\n text=\"Faculty Center\"\n ></lib-link>\n </li>\n <li>\n <lib-link\n href=\"https://dining.byu.edu/library-cafe\"\n target=\"_blank\"\n text=\"Library Cafe\"\n ></lib-link>\n </li>\n </ul>\n </section>\n <section aria-labelledby=\"footerConnectHeading\">\n <h3 id=\"footerConnectHeading\">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 <ul>\n <li>\n <lib-link\n href=\"https://lib.byu.edu/announcements\"\n leftIcon=\"featured_seasonal_and_gifts\"\n text=\"Explore what\u2019s new\"\n ></lib-link>\n </li>\n </ul>\n </section>\n </div>\n <section class=\"hbll-footer-bottom\" aria-label=\"Bottom-most part of the footer\">\n <div class=\"hbll-footer-title\">\n <lib-link\n href=\"https://byu.edu\"\n target=\"_blank\"\n text=\"BRIGHAM YOUNG UNIVERSITY\"\n ></lib-link>\n </div>\n <br />\n PROVO, UT 84602, USA |\n <lib-link href=\"sms:801-422-6061\" text=\"(801) 422-6061\"></lib-link>\n <br />© {{ date | date: 'yyyy' }}\n ALL RIGHTS RESERVED\n <div class=\"hbll-footer-privacy\">\n <lib-link\n href=\"https://privacy.byu.edu/\"\n target=\"_blank\"\n text=\"Privacy Notice\"\n ></lib-link>\n |\n <span id=\"teconsent\"></span>\n </div>\n </section>\n </div>\n <div id=\"consent-banner\"></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=\"hbllFooterEmailName\">Name</label>\n <input\n id=\"hbllFooterEmailName\"\n type=\"text\"\n formControlName=\"name\"\n data-testid=\"emailNameInput\"\n />\n <label for=\"hbllFooterEmailEmail\">\n Email (please provide if you would like a response)</label\n >\n <input\n id=\"hbllFooterEmailEmail\"\n type=\"text\"\n formControlName=\"email\"\n data-testid=\"emailEmailInput\"\n />\n <label for=\"hbllFooterEmailQuestionComment\">\n Question or comment <span class=\"hbll-footer-email-required\">*</span>\n </label>\n <textarea\n id=\"hbllFooterEmailQuestionComment\"\n type=\"text\"\n formControlName=\"message\"\n data-testid=\"emailMessageInput\"\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=\"hbllFooterEmailStatus\">Role</label>\n <span class=\"hbll-footer-select-wrapper\">\n <select\n id=\"hbllFooterEmailStatus\"\n formControlName=\"status\"\n data-testid=\"emailStatusInput\"\n >\n <option selected value=\"\"></option>\n @for (status of userStatuses | slice: 1; track status) {\n <option [value]=\"status\">{{ status }}</option>\n }\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=IBM+Plex+Sans:ital,wght@0,100..700;1,100..700&display=swap\";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 .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:#457fa6;font-size:1em;transition:all .15s;color:#fff;cursor:pointer;font-weight:600;text-align:center}.pill-btn--components:disabled{color:#676767;background-color:#e7e7e7;pointer-events:none}.pill-btn--components:hover{background-color:#a2bfd3;color:#fff}.destructive.pill-btn--components{background-color:#b33837}.destructive.pill-btn--components:hover{background-color:#c73e3d}*{box-sizing:border-box;text-decoration:none;font-size:1em}*:not(.material-symbols-outlined){font-family:inherit}.pill-btn--components{border-radius:100em;padding:.4em 1.3em}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);border:0}.sr-only.sr-only-focusable:focus,.sr-only.sr-only-focusable:focus-within,.sr-only.sr-only-focusable:active{position:static;width:auto;height:auto;margin:0;overflow:visible;clip:auto}button{border:none;background-color:transparent;font-size:1em}button :hover{cursor:pointer}.skip-link-footer{position:absolute;top:30px;left:30px}footer{line-height:1.2em;background-color:#e6e6e6}footer a{padding:4px}footer ::ng-deep #consent-banner{z-index:11;position:fixed}footer .hbll-footer-wrapper{display:flex;flex-direction:column;align-items:center;position:relative}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:1.25rem!important;margin-right:.2em;color:#00245d}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 a{border-radius:.25rem;display:inline-flex;outline:none}footer .hbll-footer-wrapper .hbll-footer-links .hbll-footer-social-list a:focus-visible{outline:2px solid var(--color-purple-focus, #b967c7);outline-offset:2px}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 .hbll-footer-links .social-icon{font-size:20px;padding:2px}footer .hbll-footer-wrapper h3{font-weight:600;color:#00245d;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:#00245d;color:#fff;font-family:IBM Plex Sans,sans-serif;font-optical-sizing:auto;font-weight:300;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 ::ng-deep lib-link .link{color:#fff}footer .hbll-footer-wrapper .hbll-footer-bottom ::ng-deep lib-link .link:hover,footer .hbll-footer-wrapper .hbll-footer-bottom ::ng-deep lib-link .link:focus-visible{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;display:flex;align-items:center;justify-content:center;gap:5px}footer .hbll-footer-wrapper .hbll-footer-bottom .hbll-footer-privacy a{text-decoration:underline}footer .hbll-footer-wrapper .hbll-footer-bottom .hbll-footer-privacy ::ng-deep lib-link .link__text{text-decoration:underline}footer .hbll-footer-wrapper .hbll-footer-bottom .hbll-footer-privacy ::ng-deep #teconsent a{color:#fff;text-decoration:underline;padding:4px}footer .hbll-footer-wrapper .hbll-footer-bottom .hbll-footer-privacy ::ng-deep #teconsent a:hover{color:#fff}@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: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$1.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i1$1.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i1$1.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: i1$1.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: ButtonComponent, selector: "lib-button", inputs: ["buttonType", "title", "iconBefore", "iconAfter", "disabled", "isThin", "ariaLabel", "minWidth", "pill", "color"], outputs: ["buttonClick"] }, { kind: "component", type: LinkComponent, selector: "lib-link", inputs: ["text", "textHtml", "imageSrc", "imageAlt", "imageTitle", "imageClass", "href", "target", "rel", "type", "state", "disabled", "leftIcon", "rightIcon", "ariaLabel"], outputs: ["linkClick"] }, { kind: "pipe", type: i1.SlicePipe, name: "slice" }, { kind: "pipe", type: i1.DatePipe, name: "date" }] }); }
|
|
1128
1128
|
}
|
|
1129
1129
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: HbllFooterComponent, decorators: [{
|
|
1130
1130
|
type: Component,
|
|
1131
|
-
args: [{ selector: 'lib-hbll-footer', imports: [CommonModule, ReactiveFormsModule, ButtonComponent, LinkComponent], template: "<footer>\n <div class=\"hbll-footer-wrapper\">\n <div class=\"skip-link-footer\">\n <lib-button\n class=\"skip-link-footer sr-only sr-only-focusable\"\n buttonType=\"secondary\"\n [isThin]=\"true\"\n title=\"Skip footer\"\n (buttonClick)=\"skipFooter()\"\n ></lib-button>\n </div>\n <div class=\"hbll-footer-links\">\n <section aria-labelledby=\"footerContactHeading\">\n <h3 id=\"footerContactHeading\">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 <lib-link\n href=\"tel:801-422-6061\"\n textHtml=\"<strong>Call</strong> (801) 422-6061\"\n ariaLabel=\"Call (801) 422-6061\"\n leftIcon=\"phone_in_talk\"\n >\n </lib-link>\n </li>\n <li>\n <lib-link\n href=\"sms:801-623-6838\"\n textHtml=\"<strong>Text</strong> (801) 623-6838\"\n ariaLabel=\"Text (801) 623-6838\"\n leftIcon=\"sms\"\n ></lib-link>\n </li>\n <li>\n <lib-link\n href=\"javascript:void(0)\"\n textHtml=\"<strong>Email us</strong>\"\n ariaLabel=\"Email us\"\n leftIcon=\"mail\"\n (linkClick)=\"emailDialog.showModal()\"\n data-testid=\"emailUsBtn\"\n ></lib-link>\n </li>\n </ul>\n </section>\n <section aria-labelledby=\"footerResourcesHeading\">\n <h3 id=\"footerResourcesHeading\">Resources</h3>\n <ul>\n <li>\n <lib-link\n href=\"{{ mainsitebaseurl }}/site-index/\"\n target=\"_blank\"\n text=\"A-Z Site Index\"\n ></lib-link>\n </li>\n <li>\n <lib-link\n href=\"{{ mainsitebaseurl }}/about/policies/\"\n target=\"_blank\"\n text=\"Policies\"\n ></lib-link>\n </li>\n <li>\n <lib-link\n href=\"{{ mainsitebaseurl }}/about/location/\"\n target=\"_blank\"\n text=\"Parking & Directions\"\n ></lib-link>\n </li>\n <li>\n <lib-link\n href=\"https://uac.byu.edu/accessibility-lab\"\n target=\"_blank\"\n text=\"Accessibility Resources\"\n ></lib-link>\n </li>\n <li>\n <lib-link\n href=\"https://hr.lib.byu.edu/byu-library-jobs\"\n target=\"_blank\"\n text=\"Employment Opportunities\"\n ></lib-link>\n </li>\n </ul>\n </section>\n <section aria-labelledby=\"footerFriendsHeading\">\n <h3 id=\"footerFriendsHeading\">Friends in the Library</h3>\n <ul>\n <li>\n <lib-link\n href=\"https://ctl.byu.edu\"\n target=\"_blank\"\n text=\"Center for Teaching and Learning\"\n ></lib-link>\n </li>\n <li>\n <lib-link\n href=\"https://copyright.byu.edu\"\n target=\"_blank\"\n text=\"Copyright Licensing Office\"\n ></lib-link>\n </li>\n <li>\n <lib-link\n href=\"https://facultycenter.byu.edu/aboutus\"\n target=\"_blank\"\n text=\"Faculty Center\"\n ></lib-link>\n </li>\n <li>\n <lib-link\n href=\"https://dining.byu.edu/library-cafe\"\n target=\"_blank\"\n text=\"Library Cafe\"\n ></lib-link>\n </li>\n </ul>\n </section>\n <section aria-labelledby=\"footerConnectHeading\">\n <h3 id=\"footerConnectHeading\">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 <ul>\n <li>\n <lib-link\n href=\"https://lib.byu.edu/announcements\"\n leftIcon=\"featured_seasonal_and_gifts\"\n text=\"Explore what\u2019s new\"\n ></lib-link>\n </li>\n </ul>\n </section>\n </div>\n <section class=\"hbll-footer-bottom\" aria-label=\"Bottom-most part of the footer\">\n <div class=\"hbll-footer-title\">\n <lib-link\n href=\"https://byu.edu\"\n target=\"_blank\"\n text=\"BRIGHAM YOUNG UNIVERSITY\"\n ></lib-link>\n </div>\n <br />\n PROVO, UT 84602, USA |\n <lib-link href=\"sms:801-422-6061\" text=\"(801) 422-6061\"></lib-link>\n <br />© {{ date | date: 'yyyy' }}\n ALL RIGHTS RESERVED\n <div class=\"hbll-footer-privacy\">\n <lib-link\n href=\"https://privacy.byu.edu/\"\n target=\"_blank\"\n text=\"Privacy Notice\"\n ></lib-link>\n |\n <span id=\"teconsent\"></span>\n </div>\n </section>\n </div>\n <div id=\"consent-banner\"></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=\"hbllFooterEmailName\">Name</label>\n <input\n id=\"hbllFooterEmailName\"\n type=\"text\"\n formControlName=\"name\"\n data-testid=\"emailNameInput\"\n />\n <label for=\"hbllFooterEmailEmail\">\n Email (please provide if you would like a response)</label\n >\n <input\n id=\"hbllFooterEmailEmail\"\n type=\"text\"\n formControlName=\"email\"\n data-testid=\"emailEmailInput\"\n />\n <label for=\"hbllFooterEmailQuestionComment\">\n Question or comment <span class=\"hbll-footer-email-required\">*</span>\n </label>\n <textarea\n id=\"hbllFooterEmailQuestionComment\"\n type=\"text\"\n formControlName=\"message\"\n data-testid=\"emailMessageInput\"\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=\"hbllFooterEmailStatus\">Role</label>\n <span class=\"hbll-footer-select-wrapper\">\n <select\n id=\"hbllFooterEmailStatus\"\n formControlName=\"status\"\n data-testid=\"emailStatusInput\"\n >\n <option selected value=\"\"></option>\n @for (status of userStatuses | slice: 1; track status) {\n <option [value]=\"status\">{{ status }}</option>\n }\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=IBM+Plex+Sans:ital,wght@0,100..700;1,100..700&display=swap\";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 .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}*{box-sizing:border-box;text-decoration:none;font-size:1em}*:not(.material-symbols-outlined){font-family:inherit}.pill-btn--components{border-radius:100em;padding:.4em 1.3em}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);border:0}.sr-only.sr-only-focusable:focus,.sr-only.sr-only-focusable:focus-within,.sr-only.sr-only-focusable:active{position:static;width:auto;height:auto;margin:0;overflow:visible;clip:auto}button{border:none;background-color:transparent;font-size:1em}button :hover{cursor:pointer}.skip-link-footer{position:absolute;top:30px;left:30px}footer{line-height:1.2em;background-color:#e6e6e6}footer a{padding:4px}footer ::ng-deep #consent-banner{z-index:11;position:fixed}footer .hbll-footer-wrapper{display:flex;flex-direction:column;align-items:center;position:relative}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:1.25rem!important;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 a{border-radius:.25rem;display:inline-flex;outline:none}footer .hbll-footer-wrapper .hbll-footer-links .hbll-footer-social-list a:focus-visible{outline:2px solid var(--color-purple-focus, #b967c7);outline-offset:2px}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 .hbll-footer-links .social-icon{font-size:20px;padding:2px}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:IBM Plex Sans,sans-serif;font-optical-sizing:auto;font-weight:300;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 ::ng-deep lib-link .link{color:#fff}footer .hbll-footer-wrapper .hbll-footer-bottom ::ng-deep lib-link .link:hover,footer .hbll-footer-wrapper .hbll-footer-bottom ::ng-deep lib-link .link:focus-visible{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;display:flex;align-items:center;justify-content:center;gap:5px}footer .hbll-footer-wrapper .hbll-footer-bottom .hbll-footer-privacy a{text-decoration:underline}footer .hbll-footer-wrapper .hbll-footer-bottom .hbll-footer-privacy ::ng-deep lib-link .link__text{text-decoration:underline}footer .hbll-footer-wrapper .hbll-footer-bottom .hbll-footer-privacy ::ng-deep #teconsent a{color:#fff;text-decoration:underline;padding:4px}footer .hbll-footer-wrapper .hbll-footer-bottom .hbll-footer-privacy ::ng-deep #teconsent a:hover{color:#fff}@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"] }]
|
|
1131
|
+
args: [{ selector: 'lib-hbll-footer', imports: [CommonModule, ReactiveFormsModule, ButtonComponent, LinkComponent], template: "<footer>\n <div class=\"hbll-footer-wrapper\">\n <div class=\"skip-link-footer\">\n <lib-button\n class=\"skip-link-footer sr-only sr-only-focusable\"\n buttonType=\"secondary\"\n [isThin]=\"true\"\n title=\"Skip footer\"\n (buttonClick)=\"skipFooter()\"\n ></lib-button>\n </div>\n <div class=\"hbll-footer-links\">\n <section aria-labelledby=\"footerContactHeading\">\n <h3 id=\"footerContactHeading\">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 <lib-link\n href=\"tel:801-422-6061\"\n textHtml=\"<strong>Call</strong> (801) 422-6061\"\n ariaLabel=\"Call (801) 422-6061\"\n leftIcon=\"phone_in_talk\"\n >\n </lib-link>\n </li>\n <li>\n <lib-link\n href=\"sms:801-623-6838\"\n textHtml=\"<strong>Text</strong> (801) 623-6838\"\n ariaLabel=\"Text (801) 623-6838\"\n leftIcon=\"sms\"\n ></lib-link>\n </li>\n <li>\n <lib-link\n href=\"javascript:void(0)\"\n textHtml=\"<strong>Email us</strong>\"\n ariaLabel=\"Email us\"\n leftIcon=\"mail\"\n (linkClick)=\"emailDialog.showModal()\"\n data-testid=\"emailUsBtn\"\n ></lib-link>\n </li>\n </ul>\n </section>\n <section aria-labelledby=\"footerResourcesHeading\">\n <h3 id=\"footerResourcesHeading\">Resources</h3>\n <ul>\n <li>\n <lib-link\n href=\"{{ mainsitebaseurl }}/site-index/\"\n target=\"_blank\"\n text=\"A-Z Site Index\"\n ></lib-link>\n </li>\n <li>\n <lib-link\n href=\"{{ mainsitebaseurl }}/about/policies/\"\n target=\"_blank\"\n text=\"Policies\"\n ></lib-link>\n </li>\n <li>\n <lib-link\n href=\"{{ mainsitebaseurl }}/about/location/\"\n target=\"_blank\"\n text=\"Parking & Directions\"\n ></lib-link>\n </li>\n <li>\n <lib-link\n href=\"https://uac.byu.edu/accessibility-lab\"\n target=\"_blank\"\n text=\"Accessibility Resources\"\n ></lib-link>\n </li>\n <li>\n <lib-link\n href=\"https://hr.lib.byu.edu/byu-library-jobs\"\n target=\"_blank\"\n text=\"Employment Opportunities\"\n ></lib-link>\n </li>\n </ul>\n </section>\n <section aria-labelledby=\"footerFriendsHeading\">\n <h3 id=\"footerFriendsHeading\">Friends in the Library</h3>\n <ul>\n <li>\n <lib-link\n href=\"https://ctl.byu.edu\"\n target=\"_blank\"\n text=\"Center for Teaching and Learning\"\n ></lib-link>\n </li>\n <li>\n <lib-link\n href=\"https://copyright.byu.edu\"\n target=\"_blank\"\n text=\"Copyright Licensing Office\"\n ></lib-link>\n </li>\n <li>\n <lib-link\n href=\"https://facultycenter.byu.edu/aboutus\"\n target=\"_blank\"\n text=\"Faculty Center\"\n ></lib-link>\n </li>\n <li>\n <lib-link\n href=\"https://dining.byu.edu/library-cafe\"\n target=\"_blank\"\n text=\"Library Cafe\"\n ></lib-link>\n </li>\n </ul>\n </section>\n <section aria-labelledby=\"footerConnectHeading\">\n <h3 id=\"footerConnectHeading\">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 <ul>\n <li>\n <lib-link\n href=\"https://lib.byu.edu/announcements\"\n leftIcon=\"featured_seasonal_and_gifts\"\n text=\"Explore what\u2019s new\"\n ></lib-link>\n </li>\n </ul>\n </section>\n </div>\n <section class=\"hbll-footer-bottom\" aria-label=\"Bottom-most part of the footer\">\n <div class=\"hbll-footer-title\">\n <lib-link\n href=\"https://byu.edu\"\n target=\"_blank\"\n text=\"BRIGHAM YOUNG UNIVERSITY\"\n ></lib-link>\n </div>\n <br />\n PROVO, UT 84602, USA |\n <lib-link href=\"sms:801-422-6061\" text=\"(801) 422-6061\"></lib-link>\n <br />© {{ date | date: 'yyyy' }}\n ALL RIGHTS RESERVED\n <div class=\"hbll-footer-privacy\">\n <lib-link\n href=\"https://privacy.byu.edu/\"\n target=\"_blank\"\n text=\"Privacy Notice\"\n ></lib-link>\n |\n <span id=\"teconsent\"></span>\n </div>\n </section>\n </div>\n <div id=\"consent-banner\"></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=\"hbllFooterEmailName\">Name</label>\n <input\n id=\"hbllFooterEmailName\"\n type=\"text\"\n formControlName=\"name\"\n data-testid=\"emailNameInput\"\n />\n <label for=\"hbllFooterEmailEmail\">\n Email (please provide if you would like a response)</label\n >\n <input\n id=\"hbllFooterEmailEmail\"\n type=\"text\"\n formControlName=\"email\"\n data-testid=\"emailEmailInput\"\n />\n <label for=\"hbllFooterEmailQuestionComment\">\n Question or comment <span class=\"hbll-footer-email-required\">*</span>\n </label>\n <textarea\n id=\"hbllFooterEmailQuestionComment\"\n type=\"text\"\n formControlName=\"message\"\n data-testid=\"emailMessageInput\"\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=\"hbllFooterEmailStatus\">Role</label>\n <span class=\"hbll-footer-select-wrapper\">\n <select\n id=\"hbllFooterEmailStatus\"\n formControlName=\"status\"\n data-testid=\"emailStatusInput\"\n >\n <option selected value=\"\"></option>\n @for (status of userStatuses | slice: 1; track status) {\n <option [value]=\"status\">{{ status }}</option>\n }\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=IBM+Plex+Sans:ital,wght@0,100..700;1,100..700&display=swap\";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 .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:#457fa6;font-size:1em;transition:all .15s;color:#fff;cursor:pointer;font-weight:600;text-align:center}.pill-btn--components:disabled{color:#676767;background-color:#e7e7e7;pointer-events:none}.pill-btn--components:hover{background-color:#a2bfd3;color:#fff}.destructive.pill-btn--components{background-color:#b33837}.destructive.pill-btn--components:hover{background-color:#c73e3d}*{box-sizing:border-box;text-decoration:none;font-size:1em}*:not(.material-symbols-outlined){font-family:inherit}.pill-btn--components{border-radius:100em;padding:.4em 1.3em}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);border:0}.sr-only.sr-only-focusable:focus,.sr-only.sr-only-focusable:focus-within,.sr-only.sr-only-focusable:active{position:static;width:auto;height:auto;margin:0;overflow:visible;clip:auto}button{border:none;background-color:transparent;font-size:1em}button :hover{cursor:pointer}.skip-link-footer{position:absolute;top:30px;left:30px}footer{line-height:1.2em;background-color:#e6e6e6}footer a{padding:4px}footer ::ng-deep #consent-banner{z-index:11;position:fixed}footer .hbll-footer-wrapper{display:flex;flex-direction:column;align-items:center;position:relative}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:1.25rem!important;margin-right:.2em;color:#00245d}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 a{border-radius:.25rem;display:inline-flex;outline:none}footer .hbll-footer-wrapper .hbll-footer-links .hbll-footer-social-list a:focus-visible{outline:2px solid var(--color-purple-focus, #b967c7);outline-offset:2px}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 .hbll-footer-links .social-icon{font-size:20px;padding:2px}footer .hbll-footer-wrapper h3{font-weight:600;color:#00245d;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:#00245d;color:#fff;font-family:IBM Plex Sans,sans-serif;font-optical-sizing:auto;font-weight:300;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 ::ng-deep lib-link .link{color:#fff}footer .hbll-footer-wrapper .hbll-footer-bottom ::ng-deep lib-link .link:hover,footer .hbll-footer-wrapper .hbll-footer-bottom ::ng-deep lib-link .link:focus-visible{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;display:flex;align-items:center;justify-content:center;gap:5px}footer .hbll-footer-wrapper .hbll-footer-bottom .hbll-footer-privacy a{text-decoration:underline}footer .hbll-footer-wrapper .hbll-footer-bottom .hbll-footer-privacy ::ng-deep lib-link .link__text{text-decoration:underline}footer .hbll-footer-wrapper .hbll-footer-bottom .hbll-footer-privacy ::ng-deep #teconsent a{color:#fff;text-decoration:underline;padding:4px}footer .hbll-footer-wrapper .hbll-footer-bottom .hbll-footer-privacy ::ng-deep #teconsent a:hover{color:#fff}@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"] }]
|
|
1132
1132
|
}], propDecorators: { emailDialog: [{
|
|
1133
1133
|
type: ViewChild,
|
|
1134
1134
|
args: ['emailDialog']
|
|
@@ -1564,6 +1564,19 @@ class FieldComponent {
|
|
|
1564
1564
|
this.iconAfterClick.emit();
|
|
1565
1565
|
}
|
|
1566
1566
|
}
|
|
1567
|
+
/**
|
|
1568
|
+
* Handles keyboard activation for the right icon (Enter / Space).
|
|
1569
|
+
*/
|
|
1570
|
+
onIconAfterKeydown(event) {
|
|
1571
|
+
if (!this.iconAfterClickable || this.disabled) {
|
|
1572
|
+
return;
|
|
1573
|
+
}
|
|
1574
|
+
const key = event.key || '';
|
|
1575
|
+
if (key === 'Enter' || key === ' ' || key === 'Spacebar' || key === 'Space') {
|
|
1576
|
+
event.preventDefault();
|
|
1577
|
+
this.onIconAfterClick();
|
|
1578
|
+
}
|
|
1579
|
+
}
|
|
1567
1580
|
// ControlValueAccessor implementation
|
|
1568
1581
|
writeValue(value) {
|
|
1569
1582
|
// Accept empty strings and reset status appropriately.
|
|
@@ -1597,7 +1610,7 @@ class FieldComponent {
|
|
|
1597
1610
|
useExisting: forwardRef(() => FieldComponent),
|
|
1598
1611
|
multi: true,
|
|
1599
1612
|
},
|
|
1600
|
-
], ngImport: i0, template: "<div\n class=\"field-wrapper\"\n [ngClass]=\"'field-' + state + ' field-' + status + (isFocused ? ' is-focused' : '')\"\n [style.min-width]=\"minWidth\"\n [style.max-width]=\"maxWidth\"\n [style.min-height]=\"minHeight\"\n [style.max-height]=\"maxHeight\"\n>\n <!-- Content projection for pre-tab -->\n <ng-content select=\"lib-pre-tab\"></ng-content>\n\n @if (iconBefore) {\n <span\n class=\"icon icon-before material-symbols-outlined\"\n (click)=\"onIconBeforeClick()\"\n [ngClass]=\"{ clickable: iconBeforeClickable, disabled: disabled }\"\n >\n {{ iconBefore }}\n </span>\n }\n\n @if (isFullText) {\n <textarea\n class=\"field-input field-textarea\"\n [id]=\"inputId\"\n [placeholder]=\"placeholder ? placeholder : ''\"\n [value]=\"value\"\n [disabled]=\"disabled\"\n [rows]=\"rows\"\n [attr.aria-label]=\"ariaLabel ? ariaLabel : null\"\n (input)=\"onValueChange($event)\"\n (focus)=\"onFocus()\"\n (blur)=\"onBlur()\"\n ></textarea>\n } @else {\n <input\n [type]=\"inputType\"\n [id]=\"inputId\"\n class=\"field-input\"\n [placeholder]=\"placeholder ? placeholder : ''\"\n [value]=\"value\"\n [disabled]=\"disabled\"\n [attr.aria-label]=\"ariaLabel ? ariaLabel : null\"\n (input)=\"onValueChange($event)\"\n (focus)=\"onFocus()\"\n (blur)=\"onBlur()\"\n />\n }\n\n @if (iconAfter) {\n <span\n class=\"icon icon-after material-symbols-outlined\"\n (click)=\"onIconAfterClick()\"\n [ngClass]=\"{ clickable: iconAfterClickable, disabled: disabled }\"\n >\n {{ iconAfter }}\n </span>\n }\n\n <!-- Content projection for post-tab -->\n <ng-content select=\"lib-post-tab\"></ng-content>\n</div>\n", styles: ["*{box-sizing:border-box;text-decoration:none;font-size:1em}*:not(.material-symbols-outlined){font-family:inherit}html{border:0;margin:0;padding:0;-webkit-text-size-adjust:100%}body{margin:0;padding:0}*,*:before,*:after{box-sizing:border-box}:root{--color-navy: #00245d;--color-royal: #0047ba;--color-white: #ffffff;--color-blue-500: #00245d;--color-blue-400: #003995;--color-blue-300: #0047ba;--color-blue-200: #336cc8;--color-blue-150: #ccdaf1;--color-blue-100: #e5edf8;--color-gray-500: #141414;--color-gray-400: #676767;--color-gray-300: #8f8f8f;--color-gray-200: #d0d0d0;--color-gray-100: #e7e7e7;--color-gray-50: #f9f9f9;--color-gray-brand-400: #676767;--color-green-500: #1d562e;--color-green-400: #2e8545;--color-green-300: #3ba35a;--color-green-200: #9dd1ac;--color-green-100: #ebf6ee;--color-teal-500: #26485f;--color-teal-400: #3e7295;--color-teal-300: #457fa6;--color-teal-200: #a2bfd3;--color-teal-100: #ecf2f6;--color-red-500: #702121;--color-red-400: #b33837;--color-red-300: #c73e3d;--color-red-200: #e39e9e;--color-red-100: #f9ecec;--color-yellow-500: #635f04;--color-yellow-400: #928c30;--color-yellow-300: #d1c844;--color-yellow-200: #e8e3a1;--color-yellow-100: #faf9ec;--color-purple-focus: #b967c7;--text-heading: #002e5d;--text-secondary-heading: #737373;--text-body: #141414;--text-disabled: #676767;--text-link: #336cc8;--text-on-action: #ffffff;--text-success: #1d562e;--text-info: #26485f;--text-error: #702121;--text-warning: #635f04;--surface-success: #ebf6ee;--surface-info: #ecf2f6;--surface-error: #f9ecec;--surface-warning: #faf9ec;--focus-ring-color: #b967c7}@font-face{font-family:Source Sans Pro;font-style:normal;font-weight:300;src:url(https://media.lib.byu.edu/web-assets/fonts/sourcesanspro/1.0.0/SourceSansPro-Light.ttf) format(\"truetype\");font-display:swap}@font-face{font-family:Source Sans Pro;font-style:normal;font-weight:400;src:url(https://media.lib.byu.edu/web-assets/fonts/sourcesanspro/1.0.0/SourceSansPro-Regular.ttf) format(\"truetype\");font-display:swap}@font-face{font-family:Source Sans Pro;font-style:normal;font-weight:600;src:url(https://media.lib.byu.edu/web-assets/fonts/sourcesanspro/1.0.0/SourceSansPro-Semibold.ttf) format(\"truetype\");font-display:swap}@font-face{font-family:Source Sans Pro;font-style:normal;font-weight:700;src:url(https://media.lib.byu.edu/web-assets/fonts/sourcesanspro/1.0.0/SourceSansPro-Bold.ttf) format(\"truetype\");font-display:swap}@font-face{font-family:Source Sans Pro;font-style:italic;font-weight:300;src:url(https://media.lib.byu.edu/web-assets/fonts/sourcesanspro/1.0.0/SourceSansPro-LightItalic.ttf) format(\"truetype\");font-display:swap}@font-face{font-family:Source Sans Pro;font-style:italic;font-weight:400;src:url(https://media.lib.byu.edu/web-assets/fonts/sourcesanspro/1.0.0/SourceSansPro-Italic.ttf) format(\"truetype\");font-display:swap}@font-face{font-family:Source Sans Pro;font-style:italic;font-weight:600;src:url(https://media.lib.byu.edu/web-assets/fonts/sourcesanspro/1.0.0/SourceSansPro-SemiboldItalic.ttf) format(\"truetype\");font-display:swap}@font-face{font-family:Source Sans Pro;font-style:italic;font-weight:700;src:url(https://media.lib.byu.edu/web-assets/fonts/sourcesanspro/1.0.0/SourceSansPro-BoldItalic.ttf) format(\"truetype\");font-display:swap}h1,h2,h3,h4,h5,h6,span:not(.material-symbols-outlined),a,p{font-family:Source Sans Pro}h1{font-weight:300;font-style:normal;color:var(--text-heading)}h2{font-weight:400;font-style:normal;color:var(--text-heading)}h3{font-weight:700;font-style:normal;color:var(--text-heading)}h4,h5,h6{font-weight:600;font-style:normal;color:var(--text-secondary-heading)}.hbll-default-body{font-weight:400;font-style:normal;max-width:35rem;min-width:22.25rem;color:var(--text-body)}.hbll-caption{font-weight:400;font-style:normal;max-width:25.25rem;min-width:17.5rem;color:var(--text-body)}.hbll-large{font-weight:400;font-style:normal;max-width:41.25rem;min-width:26.5rem;color:var(--text-body)}a{color:var(--text-link);text-decoration:underline}.hbll-emphasis{font-weight:600}h1{font-size:2rem;line-height:2.5rem}h2{font-size:1.75rem;line-height:2.25rem}h3,h4{font-size:1.5rem;line-height:2rem}h5,h6{font-size:1.25rem;line-height:1.75rem}.hbll-default-body{font-size:.875rem;line-height:1.25rem}.hbll-caption{font-size:.75rem;line-height:1rem}.hbll-large{font-size:1rem;line-height:1.5rem}@media screen and (min-width: 52.125em){h1{font-size:3rem;line-height:3.5rem}h2{font-size:2.5rem;line-height:3rem}h3{font-size:2rem;line-height:3rem}h4{font-size:1.75rem;line-height:2.5rem}h5{font-size:1.5rem;line-height:2rem}h6{font-size:1.25rem;line-height:1.75rem}.hbll-default-body{font-size:1rem;line-height:1.5rem}.hbll-caption{font-size:.75rem;line-height:1rem}.hbll-large{font-size:1.25rem;line-height:1.75rem}}@media screen and (min-width: 90em){h1{font-size:3.75rem;line-height:4.25rem}h2{font-size:3rem;line-height:3.5rem}h3{font-size:2.5rem;line-height:3rem}h4{font-size:2rem;line-height:2.5rem}h5{font-size:1.5rem;line-height:2rem}h6{font-size:1.25rem;line-height:1.75rem}.hbll-default-body{font-size:1rem;line-height:1.5rem}.hbll-caption{font-size:.75rem;line-height:1rem}.hbll-large{font-size:1.25rem;line-height:1.75rem}}:focus-visible{outline:.125rem solid var(--focus-ring-color);outline-offset:.125rem}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);border:0}.sr-only.sr-only-focusable:focus,.sr-only.sr-only-focusable:focus-within,.sr-only.sr-only-focusable:active{position:static;width:auto;height:auto;margin:0;overflow:visible;clip:auto}.field-wrapper{display:flex;flex-direction:row;align-items:center;padding:.25rem .75rem;gap:.5rem;box-sizing:border-box;border-radius:.25rem;width:100%;min-height:2rem;transition:all .2s ease}.field-wrapper .field-input{flex:1;flex-grow:1;min-width:0;border:none;outline:none;padding:0;resize:none;font-family:Source Sans Pro,sans-serif;font-size:1rem;background:inherit}.field-wrapper .field-input:disabled{cursor:not-allowed}.field-wrapper .field-input.field-textarea{align-self:flex-start;padding:.5rem 0}.field-wrapper .icon{display:flex;align-items:center;justify-content:center;width:1.5rem;height:1.5rem;flex-shrink:0;font-size:1.5rem;color:inherit}.field-wrapper .icon.clickable{cursor:pointer;transition:color .2s ease}.field-wrapper .icon.clickable:hover:not(.disabled){color:#0047ba}.field-wrapper .icon.icon-before{order:0}.field-wrapper .icon.icon-after{order:2}.field-wrapper.field-default{background:#fff;border:1px solid #d0d0d0;color:#141414}.field-wrapper.field-hover{background:#fff;border:1px solid #0047ba;color:#141414}.field-wrapper.field-focused{background:#fff;border:1px solid #d0d0d0;color:#141414}.field-wrapper.is-focused{outline:.125rem solid #b967c7;outline-offset:.125rem}.field-wrapper.field-error.field-not-filled{background:#fff;border:1px solid #c73e3d;color:#676767}.field-wrapper.field-error.field-not-filled .icon{color:#b33837}.field-wrapper.field-error.field-filled{background:#f9ecec;border:1px solid #c73e3d;color:#141414}.field-wrapper.field-error.field-filled .icon{color:#b33837}.field-wrapper.field-success.field-not-filled{background:#fff;border:1px solid #3ba35a;color:#676767}.field-wrapper.field-success.field-not-filled .icon{color:#2e8545}.field-wrapper.field-success.field-filled{background:#ebf6ee;border:1px solid #3ba35a;color:#141414}.field-wrapper.field-success.field-filled .icon{color:#2e8545}.field-wrapper.field-disabled{background:#f9f9f9;border:1px solid #676767;color:#676767;cursor:not-allowed}.field-wrapper.field-disabled .icon{color:#8f8f8f}.field-wrapper.field-disabled .icon.clickable{cursor:not-allowed}.field-wrapper.field-disabled .icon.clickable:hover{color:inherit}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }] }); }
|
|
1613
|
+
], ngImport: i0, template: "<div\n class=\"field-wrapper\"\n [ngClass]=\"'field-' + state + ' field-' + status + (isFocused ? ' is-focused' : '')\"\n [style.min-width]=\"minWidth\"\n [style.max-width]=\"maxWidth\"\n [style.min-height]=\"minHeight\"\n [style.max-height]=\"maxHeight\"\n>\n <!-- Content projection for pre-tab -->\n <ng-content select=\"lib-pre-tab\"></ng-content>\n\n @if (iconBefore) {\n <span\n class=\"icon icon-before material-symbols-outlined\"\n (click)=\"onIconBeforeClick()\"\n [ngClass]=\"{ clickable: iconBeforeClickable, disabled: disabled }\"\n >\n {{ iconBefore }}\n </span>\n }\n\n @if (isFullText) {\n <textarea\n class=\"field-input field-textarea\"\n [id]=\"inputId\"\n [placeholder]=\"placeholder ? placeholder : ''\"\n [value]=\"value\"\n [disabled]=\"disabled\"\n [rows]=\"rows\"\n [attr.aria-label]=\"ariaLabel ? ariaLabel : null\"\n (input)=\"onValueChange($event)\"\n (focus)=\"onFocus()\"\n (blur)=\"onBlur()\"\n ></textarea>\n } @else {\n <input\n [type]=\"inputType\"\n [id]=\"inputId\"\n class=\"field-input\"\n [placeholder]=\"placeholder ? placeholder : ''\"\n [value]=\"value\"\n [disabled]=\"disabled\"\n [attr.aria-label]=\"ariaLabel ? ariaLabel : null\"\n (input)=\"onValueChange($event)\"\n (focus)=\"onFocus()\"\n (blur)=\"onBlur()\"\n />\n }\n\n @if (iconAfter) {\n <span\n class=\"icon icon-after material-symbols-outlined\"\n (click)=\"onIconAfterClick()\"\n (keydown)=\"onIconAfterKeydown($event)\"\n [ngClass]=\"{ clickable: iconAfterClickable, disabled: disabled }\"\n [attr.tabindex]=\"iconAfterClickable && !disabled ? 0 : null\"\n [attr.role]=\"iconAfterClickable ? 'button' : null\"\n [attr.aria-disabled]=\"disabled ? 'true' : null\"\n >\n {{ iconAfter }}\n </span>\n }\n\n <!-- Content projection for post-tab -->\n <ng-content select=\"lib-post-tab\"></ng-content>\n</div>\n", styles: ["*{box-sizing:border-box;text-decoration:none;font-size:1em}*:not(.material-symbols-outlined){font-family:inherit}html{border:0;margin:0;padding:0;-webkit-text-size-adjust:100%}body{margin:0;padding:0}*,*:before,*:after{box-sizing:border-box}:root{--color-navy: #00245d;--color-royal: #0047ba;--color-white: #ffffff;--color-blue-500: #00245d;--color-blue-400: #003995;--color-blue-300: #0047ba;--color-blue-200: #336cc8;--color-blue-150: #ccdaf1;--color-blue-100: #e5edf8;--color-gray-500: #141414;--color-gray-400: #676767;--color-gray-300: #8f8f8f;--color-gray-200: #d0d0d0;--color-gray-100: #e7e7e7;--color-gray-50: #f9f9f9;--color-gray-brand-400: #676767;--color-green-500: #1d562e;--color-green-400: #2e8545;--color-green-300: #3ba35a;--color-green-200: #9dd1ac;--color-green-100: #ebf6ee;--color-teal-500: #26485f;--color-teal-400: #3e7295;--color-teal-300: #457fa6;--color-teal-200: #a2bfd3;--color-teal-100: #ecf2f6;--color-red-500: #702121;--color-red-400: #b33837;--color-red-300: #c73e3d;--color-red-200: #e39e9e;--color-red-100: #f9ecec;--color-yellow-500: #635f04;--color-yellow-400: #928c30;--color-yellow-300: #d1c844;--color-yellow-200: #e8e3a1;--color-yellow-100: #faf9ec;--color-purple-focus: #b967c7;--text-heading: #002e5d;--text-secondary-heading: #737373;--text-body: #141414;--text-disabled: #676767;--text-link: #336cc8;--text-on-action: #ffffff;--text-success: #1d562e;--text-info: #26485f;--text-error: #702121;--text-warning: #635f04;--surface-success: #ebf6ee;--surface-info: #ecf2f6;--surface-error: #f9ecec;--surface-warning: #faf9ec;--focus-ring-color: #b967c7}@font-face{font-family:Source Sans Pro;font-style:normal;font-weight:300;src:url(https://media.lib.byu.edu/web-assets/fonts/sourcesanspro/1.0.0/SourceSansPro-Light.ttf) format(\"truetype\");font-display:swap}@font-face{font-family:Source Sans Pro;font-style:normal;font-weight:400;src:url(https://media.lib.byu.edu/web-assets/fonts/sourcesanspro/1.0.0/SourceSansPro-Regular.ttf) format(\"truetype\");font-display:swap}@font-face{font-family:Source Sans Pro;font-style:normal;font-weight:600;src:url(https://media.lib.byu.edu/web-assets/fonts/sourcesanspro/1.0.0/SourceSansPro-Semibold.ttf) format(\"truetype\");font-display:swap}@font-face{font-family:Source Sans Pro;font-style:normal;font-weight:700;src:url(https://media.lib.byu.edu/web-assets/fonts/sourcesanspro/1.0.0/SourceSansPro-Bold.ttf) format(\"truetype\");font-display:swap}@font-face{font-family:Source Sans Pro;font-style:italic;font-weight:300;src:url(https://media.lib.byu.edu/web-assets/fonts/sourcesanspro/1.0.0/SourceSansPro-LightItalic.ttf) format(\"truetype\");font-display:swap}@font-face{font-family:Source Sans Pro;font-style:italic;font-weight:400;src:url(https://media.lib.byu.edu/web-assets/fonts/sourcesanspro/1.0.0/SourceSansPro-Italic.ttf) format(\"truetype\");font-display:swap}@font-face{font-family:Source Sans Pro;font-style:italic;font-weight:600;src:url(https://media.lib.byu.edu/web-assets/fonts/sourcesanspro/1.0.0/SourceSansPro-SemiboldItalic.ttf) format(\"truetype\");font-display:swap}@font-face{font-family:Source Sans Pro;font-style:italic;font-weight:700;src:url(https://media.lib.byu.edu/web-assets/fonts/sourcesanspro/1.0.0/SourceSansPro-BoldItalic.ttf) format(\"truetype\");font-display:swap}h1,h2,h3,h4,h5,h6,span:not(.material-symbols-outlined),a,p{font-family:Source Sans Pro}h1{font-weight:300;font-style:normal;color:var(--text-heading)}h2{font-weight:400;font-style:normal;color:var(--text-heading)}h3{font-weight:700;font-style:normal;color:var(--text-heading)}h4,h5,h6{font-weight:600;font-style:normal;color:var(--text-secondary-heading)}.hbll-default-body{font-weight:400;font-style:normal;max-width:35rem;min-width:22.25rem;color:var(--text-body)}.hbll-caption{font-weight:400;font-style:normal;max-width:25.25rem;min-width:17.5rem;color:var(--text-body)}.hbll-large{font-weight:400;font-style:normal;max-width:41.25rem;min-width:26.5rem;color:var(--text-body)}a{color:var(--text-link);text-decoration:underline}.hbll-emphasis{font-weight:600}h1{font-size:2rem;line-height:2.5rem}h2{font-size:1.75rem;line-height:2.25rem}h3,h4{font-size:1.5rem;line-height:2rem}h5,h6{font-size:1.25rem;line-height:1.75rem}.hbll-default-body{font-size:.875rem;line-height:1.25rem}.hbll-caption{font-size:.75rem;line-height:1rem}.hbll-large{font-size:1rem;line-height:1.5rem}@media screen and (min-width: 52.125em){h1{font-size:3rem;line-height:3.5rem}h2{font-size:2.5rem;line-height:3rem}h3{font-size:2rem;line-height:3rem}h4{font-size:1.75rem;line-height:2.5rem}h5{font-size:1.5rem;line-height:2rem}h6{font-size:1.25rem;line-height:1.75rem}.hbll-default-body{font-size:1rem;line-height:1.5rem}.hbll-caption{font-size:.75rem;line-height:1rem}.hbll-large{font-size:1.25rem;line-height:1.75rem}}@media screen and (min-width: 90em){h1{font-size:3.75rem;line-height:4.25rem}h2{font-size:3rem;line-height:3.5rem}h3{font-size:2.5rem;line-height:3rem}h4{font-size:2rem;line-height:2.5rem}h5{font-size:1.5rem;line-height:2rem}h6{font-size:1.25rem;line-height:1.75rem}.hbll-default-body{font-size:1rem;line-height:1.5rem}.hbll-caption{font-size:.75rem;line-height:1rem}.hbll-large{font-size:1.25rem;line-height:1.75rem}}:focus-visible{outline:.125rem solid var(--focus-ring-color);outline-offset:.125rem}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);border:0}.sr-only.sr-only-focusable:focus,.sr-only.sr-only-focusable:focus-within,.sr-only.sr-only-focusable:active{position:static;width:auto;height:auto;margin:0;overflow:visible;clip:auto}.field-wrapper{display:flex;flex-direction:row;align-items:center;padding:.25rem .75rem;gap:.5rem;box-sizing:border-box;border-radius:.25rem;width:100%;min-height:2rem;transition:all .2s ease}.field-wrapper .field-input{flex:1;flex-grow:1;min-width:0;border:none;outline:none;padding:0;resize:none;font-family:Source Sans Pro,sans-serif;font-size:1rem;background:inherit}.field-wrapper .field-input:disabled{cursor:not-allowed}.field-wrapper .field-input.field-textarea{align-self:flex-start;padding:.5rem 0}.field-wrapper .icon{display:flex;align-items:center;justify-content:center;width:1.5rem;height:1.5rem;flex-shrink:0;font-size:1.5rem;color:inherit}.field-wrapper .icon.clickable{cursor:pointer;transition:color .2s ease}.field-wrapper .icon.clickable:hover:not(.disabled){color:#0047ba}.field-wrapper .icon.icon-before{order:0}.field-wrapper .icon.icon-after{order:2}.field-wrapper.field-default{background:#fff;border:1px solid #d0d0d0;color:#141414}.field-wrapper.field-hover{background:#fff;border:1px solid #0047ba;color:#141414}.field-wrapper.field-focused{background:#fff;border:1px solid #d0d0d0;color:#141414}.field-wrapper.is-focused{outline:.125rem solid #b967c7;outline-offset:.125rem}.field-wrapper.field-error.field-not-filled{background:#fff;border:1px solid #c73e3d;color:#676767}.field-wrapper.field-error.field-not-filled .icon{color:#b33837}.field-wrapper.field-error.field-filled{background:#f9ecec;border:1px solid #c73e3d;color:#141414}.field-wrapper.field-error.field-filled .icon{color:#b33837}.field-wrapper.field-success.field-not-filled{background:#fff;border:1px solid #3ba35a;color:#676767}.field-wrapper.field-success.field-not-filled .icon{color:#2e8545}.field-wrapper.field-success.field-filled{background:#ebf6ee;border:1px solid #3ba35a;color:#141414}.field-wrapper.field-success.field-filled .icon{color:#2e8545}.field-wrapper.field-disabled{background:#f9f9f9;border:1px solid #676767;color:#676767;cursor:not-allowed}.field-wrapper.field-disabled .icon{color:#8f8f8f}.field-wrapper.field-disabled .icon.clickable{cursor:not-allowed}.field-wrapper.field-disabled .icon.clickable:hover{color:inherit}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }] }); }
|
|
1601
1614
|
}
|
|
1602
1615
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: FieldComponent, decorators: [{
|
|
1603
1616
|
type: Component,
|
|
@@ -1607,7 +1620,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImpo
|
|
|
1607
1620
|
useExisting: forwardRef(() => FieldComponent),
|
|
1608
1621
|
multi: true,
|
|
1609
1622
|
},
|
|
1610
|
-
], template: "<div\n class=\"field-wrapper\"\n [ngClass]=\"'field-' + state + ' field-' + status + (isFocused ? ' is-focused' : '')\"\n [style.min-width]=\"minWidth\"\n [style.max-width]=\"maxWidth\"\n [style.min-height]=\"minHeight\"\n [style.max-height]=\"maxHeight\"\n>\n <!-- Content projection for pre-tab -->\n <ng-content select=\"lib-pre-tab\"></ng-content>\n\n @if (iconBefore) {\n <span\n class=\"icon icon-before material-symbols-outlined\"\n (click)=\"onIconBeforeClick()\"\n [ngClass]=\"{ clickable: iconBeforeClickable, disabled: disabled }\"\n >\n {{ iconBefore }}\n </span>\n }\n\n @if (isFullText) {\n <textarea\n class=\"field-input field-textarea\"\n [id]=\"inputId\"\n [placeholder]=\"placeholder ? placeholder : ''\"\n [value]=\"value\"\n [disabled]=\"disabled\"\n [rows]=\"rows\"\n [attr.aria-label]=\"ariaLabel ? ariaLabel : null\"\n (input)=\"onValueChange($event)\"\n (focus)=\"onFocus()\"\n (blur)=\"onBlur()\"\n ></textarea>\n } @else {\n <input\n [type]=\"inputType\"\n [id]=\"inputId\"\n class=\"field-input\"\n [placeholder]=\"placeholder ? placeholder : ''\"\n [value]=\"value\"\n [disabled]=\"disabled\"\n [attr.aria-label]=\"ariaLabel ? ariaLabel : null\"\n (input)=\"onValueChange($event)\"\n (focus)=\"onFocus()\"\n (blur)=\"onBlur()\"\n />\n }\n\n @if (iconAfter) {\n <span\n class=\"icon icon-after material-symbols-outlined\"\n (click)=\"onIconAfterClick()\"\n [ngClass]=\"{ clickable: iconAfterClickable, disabled: disabled }\"\n >\n {{ iconAfter }}\n </span>\n }\n\n <!-- Content projection for post-tab -->\n <ng-content select=\"lib-post-tab\"></ng-content>\n</div>\n", styles: ["*{box-sizing:border-box;text-decoration:none;font-size:1em}*:not(.material-symbols-outlined){font-family:inherit}html{border:0;margin:0;padding:0;-webkit-text-size-adjust:100%}body{margin:0;padding:0}*,*:before,*:after{box-sizing:border-box}:root{--color-navy: #00245d;--color-royal: #0047ba;--color-white: #ffffff;--color-blue-500: #00245d;--color-blue-400: #003995;--color-blue-300: #0047ba;--color-blue-200: #336cc8;--color-blue-150: #ccdaf1;--color-blue-100: #e5edf8;--color-gray-500: #141414;--color-gray-400: #676767;--color-gray-300: #8f8f8f;--color-gray-200: #d0d0d0;--color-gray-100: #e7e7e7;--color-gray-50: #f9f9f9;--color-gray-brand-400: #676767;--color-green-500: #1d562e;--color-green-400: #2e8545;--color-green-300: #3ba35a;--color-green-200: #9dd1ac;--color-green-100: #ebf6ee;--color-teal-500: #26485f;--color-teal-400: #3e7295;--color-teal-300: #457fa6;--color-teal-200: #a2bfd3;--color-teal-100: #ecf2f6;--color-red-500: #702121;--color-red-400: #b33837;--color-red-300: #c73e3d;--color-red-200: #e39e9e;--color-red-100: #f9ecec;--color-yellow-500: #635f04;--color-yellow-400: #928c30;--color-yellow-300: #d1c844;--color-yellow-200: #e8e3a1;--color-yellow-100: #faf9ec;--color-purple-focus: #b967c7;--text-heading: #002e5d;--text-secondary-heading: #737373;--text-body: #141414;--text-disabled: #676767;--text-link: #336cc8;--text-on-action: #ffffff;--text-success: #1d562e;--text-info: #26485f;--text-error: #702121;--text-warning: #635f04;--surface-success: #ebf6ee;--surface-info: #ecf2f6;--surface-error: #f9ecec;--surface-warning: #faf9ec;--focus-ring-color: #b967c7}@font-face{font-family:Source Sans Pro;font-style:normal;font-weight:300;src:url(https://media.lib.byu.edu/web-assets/fonts/sourcesanspro/1.0.0/SourceSansPro-Light.ttf) format(\"truetype\");font-display:swap}@font-face{font-family:Source Sans Pro;font-style:normal;font-weight:400;src:url(https://media.lib.byu.edu/web-assets/fonts/sourcesanspro/1.0.0/SourceSansPro-Regular.ttf) format(\"truetype\");font-display:swap}@font-face{font-family:Source Sans Pro;font-style:normal;font-weight:600;src:url(https://media.lib.byu.edu/web-assets/fonts/sourcesanspro/1.0.0/SourceSansPro-Semibold.ttf) format(\"truetype\");font-display:swap}@font-face{font-family:Source Sans Pro;font-style:normal;font-weight:700;src:url(https://media.lib.byu.edu/web-assets/fonts/sourcesanspro/1.0.0/SourceSansPro-Bold.ttf) format(\"truetype\");font-display:swap}@font-face{font-family:Source Sans Pro;font-style:italic;font-weight:300;src:url(https://media.lib.byu.edu/web-assets/fonts/sourcesanspro/1.0.0/SourceSansPro-LightItalic.ttf) format(\"truetype\");font-display:swap}@font-face{font-family:Source Sans Pro;font-style:italic;font-weight:400;src:url(https://media.lib.byu.edu/web-assets/fonts/sourcesanspro/1.0.0/SourceSansPro-Italic.ttf) format(\"truetype\");font-display:swap}@font-face{font-family:Source Sans Pro;font-style:italic;font-weight:600;src:url(https://media.lib.byu.edu/web-assets/fonts/sourcesanspro/1.0.0/SourceSansPro-SemiboldItalic.ttf) format(\"truetype\");font-display:swap}@font-face{font-family:Source Sans Pro;font-style:italic;font-weight:700;src:url(https://media.lib.byu.edu/web-assets/fonts/sourcesanspro/1.0.0/SourceSansPro-BoldItalic.ttf) format(\"truetype\");font-display:swap}h1,h2,h3,h4,h5,h6,span:not(.material-symbols-outlined),a,p{font-family:Source Sans Pro}h1{font-weight:300;font-style:normal;color:var(--text-heading)}h2{font-weight:400;font-style:normal;color:var(--text-heading)}h3{font-weight:700;font-style:normal;color:var(--text-heading)}h4,h5,h6{font-weight:600;font-style:normal;color:var(--text-secondary-heading)}.hbll-default-body{font-weight:400;font-style:normal;max-width:35rem;min-width:22.25rem;color:var(--text-body)}.hbll-caption{font-weight:400;font-style:normal;max-width:25.25rem;min-width:17.5rem;color:var(--text-body)}.hbll-large{font-weight:400;font-style:normal;max-width:41.25rem;min-width:26.5rem;color:var(--text-body)}a{color:var(--text-link);text-decoration:underline}.hbll-emphasis{font-weight:600}h1{font-size:2rem;line-height:2.5rem}h2{font-size:1.75rem;line-height:2.25rem}h3,h4{font-size:1.5rem;line-height:2rem}h5,h6{font-size:1.25rem;line-height:1.75rem}.hbll-default-body{font-size:.875rem;line-height:1.25rem}.hbll-caption{font-size:.75rem;line-height:1rem}.hbll-large{font-size:1rem;line-height:1.5rem}@media screen and (min-width: 52.125em){h1{font-size:3rem;line-height:3.5rem}h2{font-size:2.5rem;line-height:3rem}h3{font-size:2rem;line-height:3rem}h4{font-size:1.75rem;line-height:2.5rem}h5{font-size:1.5rem;line-height:2rem}h6{font-size:1.25rem;line-height:1.75rem}.hbll-default-body{font-size:1rem;line-height:1.5rem}.hbll-caption{font-size:.75rem;line-height:1rem}.hbll-large{font-size:1.25rem;line-height:1.75rem}}@media screen and (min-width: 90em){h1{font-size:3.75rem;line-height:4.25rem}h2{font-size:3rem;line-height:3.5rem}h3{font-size:2.5rem;line-height:3rem}h4{font-size:2rem;line-height:2.5rem}h5{font-size:1.5rem;line-height:2rem}h6{font-size:1.25rem;line-height:1.75rem}.hbll-default-body{font-size:1rem;line-height:1.5rem}.hbll-caption{font-size:.75rem;line-height:1rem}.hbll-large{font-size:1.25rem;line-height:1.75rem}}:focus-visible{outline:.125rem solid var(--focus-ring-color);outline-offset:.125rem}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);border:0}.sr-only.sr-only-focusable:focus,.sr-only.sr-only-focusable:focus-within,.sr-only.sr-only-focusable:active{position:static;width:auto;height:auto;margin:0;overflow:visible;clip:auto}.field-wrapper{display:flex;flex-direction:row;align-items:center;padding:.25rem .75rem;gap:.5rem;box-sizing:border-box;border-radius:.25rem;width:100%;min-height:2rem;transition:all .2s ease}.field-wrapper .field-input{flex:1;flex-grow:1;min-width:0;border:none;outline:none;padding:0;resize:none;font-family:Source Sans Pro,sans-serif;font-size:1rem;background:inherit}.field-wrapper .field-input:disabled{cursor:not-allowed}.field-wrapper .field-input.field-textarea{align-self:flex-start;padding:.5rem 0}.field-wrapper .icon{display:flex;align-items:center;justify-content:center;width:1.5rem;height:1.5rem;flex-shrink:0;font-size:1.5rem;color:inherit}.field-wrapper .icon.clickable{cursor:pointer;transition:color .2s ease}.field-wrapper .icon.clickable:hover:not(.disabled){color:#0047ba}.field-wrapper .icon.icon-before{order:0}.field-wrapper .icon.icon-after{order:2}.field-wrapper.field-default{background:#fff;border:1px solid #d0d0d0;color:#141414}.field-wrapper.field-hover{background:#fff;border:1px solid #0047ba;color:#141414}.field-wrapper.field-focused{background:#fff;border:1px solid #d0d0d0;color:#141414}.field-wrapper.is-focused{outline:.125rem solid #b967c7;outline-offset:.125rem}.field-wrapper.field-error.field-not-filled{background:#fff;border:1px solid #c73e3d;color:#676767}.field-wrapper.field-error.field-not-filled .icon{color:#b33837}.field-wrapper.field-error.field-filled{background:#f9ecec;border:1px solid #c73e3d;color:#141414}.field-wrapper.field-error.field-filled .icon{color:#b33837}.field-wrapper.field-success.field-not-filled{background:#fff;border:1px solid #3ba35a;color:#676767}.field-wrapper.field-success.field-not-filled .icon{color:#2e8545}.field-wrapper.field-success.field-filled{background:#ebf6ee;border:1px solid #3ba35a;color:#141414}.field-wrapper.field-success.field-filled .icon{color:#2e8545}.field-wrapper.field-disabled{background:#f9f9f9;border:1px solid #676767;color:#676767;cursor:not-allowed}.field-wrapper.field-disabled .icon{color:#8f8f8f}.field-wrapper.field-disabled .icon.clickable{cursor:not-allowed}.field-wrapper.field-disabled .icon.clickable:hover{color:inherit}\n"] }]
|
|
1623
|
+
], template: "<div\n class=\"field-wrapper\"\n [ngClass]=\"'field-' + state + ' field-' + status + (isFocused ? ' is-focused' : '')\"\n [style.min-width]=\"minWidth\"\n [style.max-width]=\"maxWidth\"\n [style.min-height]=\"minHeight\"\n [style.max-height]=\"maxHeight\"\n>\n <!-- Content projection for pre-tab -->\n <ng-content select=\"lib-pre-tab\"></ng-content>\n\n @if (iconBefore) {\n <span\n class=\"icon icon-before material-symbols-outlined\"\n (click)=\"onIconBeforeClick()\"\n [ngClass]=\"{ clickable: iconBeforeClickable, disabled: disabled }\"\n >\n {{ iconBefore }}\n </span>\n }\n\n @if (isFullText) {\n <textarea\n class=\"field-input field-textarea\"\n [id]=\"inputId\"\n [placeholder]=\"placeholder ? placeholder : ''\"\n [value]=\"value\"\n [disabled]=\"disabled\"\n [rows]=\"rows\"\n [attr.aria-label]=\"ariaLabel ? ariaLabel : null\"\n (input)=\"onValueChange($event)\"\n (focus)=\"onFocus()\"\n (blur)=\"onBlur()\"\n ></textarea>\n } @else {\n <input\n [type]=\"inputType\"\n [id]=\"inputId\"\n class=\"field-input\"\n [placeholder]=\"placeholder ? placeholder : ''\"\n [value]=\"value\"\n [disabled]=\"disabled\"\n [attr.aria-label]=\"ariaLabel ? ariaLabel : null\"\n (input)=\"onValueChange($event)\"\n (focus)=\"onFocus()\"\n (blur)=\"onBlur()\"\n />\n }\n\n @if (iconAfter) {\n <span\n class=\"icon icon-after material-symbols-outlined\"\n (click)=\"onIconAfterClick()\"\n (keydown)=\"onIconAfterKeydown($event)\"\n [ngClass]=\"{ clickable: iconAfterClickable, disabled: disabled }\"\n [attr.tabindex]=\"iconAfterClickable && !disabled ? 0 : null\"\n [attr.role]=\"iconAfterClickable ? 'button' : null\"\n [attr.aria-disabled]=\"disabled ? 'true' : null\"\n >\n {{ iconAfter }}\n </span>\n }\n\n <!-- Content projection for post-tab -->\n <ng-content select=\"lib-post-tab\"></ng-content>\n</div>\n", styles: ["*{box-sizing:border-box;text-decoration:none;font-size:1em}*:not(.material-symbols-outlined){font-family:inherit}html{border:0;margin:0;padding:0;-webkit-text-size-adjust:100%}body{margin:0;padding:0}*,*:before,*:after{box-sizing:border-box}:root{--color-navy: #00245d;--color-royal: #0047ba;--color-white: #ffffff;--color-blue-500: #00245d;--color-blue-400: #003995;--color-blue-300: #0047ba;--color-blue-200: #336cc8;--color-blue-150: #ccdaf1;--color-blue-100: #e5edf8;--color-gray-500: #141414;--color-gray-400: #676767;--color-gray-300: #8f8f8f;--color-gray-200: #d0d0d0;--color-gray-100: #e7e7e7;--color-gray-50: #f9f9f9;--color-gray-brand-400: #676767;--color-green-500: #1d562e;--color-green-400: #2e8545;--color-green-300: #3ba35a;--color-green-200: #9dd1ac;--color-green-100: #ebf6ee;--color-teal-500: #26485f;--color-teal-400: #3e7295;--color-teal-300: #457fa6;--color-teal-200: #a2bfd3;--color-teal-100: #ecf2f6;--color-red-500: #702121;--color-red-400: #b33837;--color-red-300: #c73e3d;--color-red-200: #e39e9e;--color-red-100: #f9ecec;--color-yellow-500: #635f04;--color-yellow-400: #928c30;--color-yellow-300: #d1c844;--color-yellow-200: #e8e3a1;--color-yellow-100: #faf9ec;--color-purple-focus: #b967c7;--text-heading: #002e5d;--text-secondary-heading: #737373;--text-body: #141414;--text-disabled: #676767;--text-link: #336cc8;--text-on-action: #ffffff;--text-success: #1d562e;--text-info: #26485f;--text-error: #702121;--text-warning: #635f04;--surface-success: #ebf6ee;--surface-info: #ecf2f6;--surface-error: #f9ecec;--surface-warning: #faf9ec;--focus-ring-color: #b967c7}@font-face{font-family:Source Sans Pro;font-style:normal;font-weight:300;src:url(https://media.lib.byu.edu/web-assets/fonts/sourcesanspro/1.0.0/SourceSansPro-Light.ttf) format(\"truetype\");font-display:swap}@font-face{font-family:Source Sans Pro;font-style:normal;font-weight:400;src:url(https://media.lib.byu.edu/web-assets/fonts/sourcesanspro/1.0.0/SourceSansPro-Regular.ttf) format(\"truetype\");font-display:swap}@font-face{font-family:Source Sans Pro;font-style:normal;font-weight:600;src:url(https://media.lib.byu.edu/web-assets/fonts/sourcesanspro/1.0.0/SourceSansPro-Semibold.ttf) format(\"truetype\");font-display:swap}@font-face{font-family:Source Sans Pro;font-style:normal;font-weight:700;src:url(https://media.lib.byu.edu/web-assets/fonts/sourcesanspro/1.0.0/SourceSansPro-Bold.ttf) format(\"truetype\");font-display:swap}@font-face{font-family:Source Sans Pro;font-style:italic;font-weight:300;src:url(https://media.lib.byu.edu/web-assets/fonts/sourcesanspro/1.0.0/SourceSansPro-LightItalic.ttf) format(\"truetype\");font-display:swap}@font-face{font-family:Source Sans Pro;font-style:italic;font-weight:400;src:url(https://media.lib.byu.edu/web-assets/fonts/sourcesanspro/1.0.0/SourceSansPro-Italic.ttf) format(\"truetype\");font-display:swap}@font-face{font-family:Source Sans Pro;font-style:italic;font-weight:600;src:url(https://media.lib.byu.edu/web-assets/fonts/sourcesanspro/1.0.0/SourceSansPro-SemiboldItalic.ttf) format(\"truetype\");font-display:swap}@font-face{font-family:Source Sans Pro;font-style:italic;font-weight:700;src:url(https://media.lib.byu.edu/web-assets/fonts/sourcesanspro/1.0.0/SourceSansPro-BoldItalic.ttf) format(\"truetype\");font-display:swap}h1,h2,h3,h4,h5,h6,span:not(.material-symbols-outlined),a,p{font-family:Source Sans Pro}h1{font-weight:300;font-style:normal;color:var(--text-heading)}h2{font-weight:400;font-style:normal;color:var(--text-heading)}h3{font-weight:700;font-style:normal;color:var(--text-heading)}h4,h5,h6{font-weight:600;font-style:normal;color:var(--text-secondary-heading)}.hbll-default-body{font-weight:400;font-style:normal;max-width:35rem;min-width:22.25rem;color:var(--text-body)}.hbll-caption{font-weight:400;font-style:normal;max-width:25.25rem;min-width:17.5rem;color:var(--text-body)}.hbll-large{font-weight:400;font-style:normal;max-width:41.25rem;min-width:26.5rem;color:var(--text-body)}a{color:var(--text-link);text-decoration:underline}.hbll-emphasis{font-weight:600}h1{font-size:2rem;line-height:2.5rem}h2{font-size:1.75rem;line-height:2.25rem}h3,h4{font-size:1.5rem;line-height:2rem}h5,h6{font-size:1.25rem;line-height:1.75rem}.hbll-default-body{font-size:.875rem;line-height:1.25rem}.hbll-caption{font-size:.75rem;line-height:1rem}.hbll-large{font-size:1rem;line-height:1.5rem}@media screen and (min-width: 52.125em){h1{font-size:3rem;line-height:3.5rem}h2{font-size:2.5rem;line-height:3rem}h3{font-size:2rem;line-height:3rem}h4{font-size:1.75rem;line-height:2.5rem}h5{font-size:1.5rem;line-height:2rem}h6{font-size:1.25rem;line-height:1.75rem}.hbll-default-body{font-size:1rem;line-height:1.5rem}.hbll-caption{font-size:.75rem;line-height:1rem}.hbll-large{font-size:1.25rem;line-height:1.75rem}}@media screen and (min-width: 90em){h1{font-size:3.75rem;line-height:4.25rem}h2{font-size:3rem;line-height:3.5rem}h3{font-size:2.5rem;line-height:3rem}h4{font-size:2rem;line-height:2.5rem}h5{font-size:1.5rem;line-height:2rem}h6{font-size:1.25rem;line-height:1.75rem}.hbll-default-body{font-size:1rem;line-height:1.5rem}.hbll-caption{font-size:.75rem;line-height:1rem}.hbll-large{font-size:1.25rem;line-height:1.75rem}}:focus-visible{outline:.125rem solid var(--focus-ring-color);outline-offset:.125rem}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);border:0}.sr-only.sr-only-focusable:focus,.sr-only.sr-only-focusable:focus-within,.sr-only.sr-only-focusable:active{position:static;width:auto;height:auto;margin:0;overflow:visible;clip:auto}.field-wrapper{display:flex;flex-direction:row;align-items:center;padding:.25rem .75rem;gap:.5rem;box-sizing:border-box;border-radius:.25rem;width:100%;min-height:2rem;transition:all .2s ease}.field-wrapper .field-input{flex:1;flex-grow:1;min-width:0;border:none;outline:none;padding:0;resize:none;font-family:Source Sans Pro,sans-serif;font-size:1rem;background:inherit}.field-wrapper .field-input:disabled{cursor:not-allowed}.field-wrapper .field-input.field-textarea{align-self:flex-start;padding:.5rem 0}.field-wrapper .icon{display:flex;align-items:center;justify-content:center;width:1.5rem;height:1.5rem;flex-shrink:0;font-size:1.5rem;color:inherit}.field-wrapper .icon.clickable{cursor:pointer;transition:color .2s ease}.field-wrapper .icon.clickable:hover:not(.disabled){color:#0047ba}.field-wrapper .icon.icon-before{order:0}.field-wrapper .icon.icon-after{order:2}.field-wrapper.field-default{background:#fff;border:1px solid #d0d0d0;color:#141414}.field-wrapper.field-hover{background:#fff;border:1px solid #0047ba;color:#141414}.field-wrapper.field-focused{background:#fff;border:1px solid #d0d0d0;color:#141414}.field-wrapper.is-focused{outline:.125rem solid #b967c7;outline-offset:.125rem}.field-wrapper.field-error.field-not-filled{background:#fff;border:1px solid #c73e3d;color:#676767}.field-wrapper.field-error.field-not-filled .icon{color:#b33837}.field-wrapper.field-error.field-filled{background:#f9ecec;border:1px solid #c73e3d;color:#141414}.field-wrapper.field-error.field-filled .icon{color:#b33837}.field-wrapper.field-success.field-not-filled{background:#fff;border:1px solid #3ba35a;color:#676767}.field-wrapper.field-success.field-not-filled .icon{color:#2e8545}.field-wrapper.field-success.field-filled{background:#ebf6ee;border:1px solid #3ba35a;color:#141414}.field-wrapper.field-success.field-filled .icon{color:#2e8545}.field-wrapper.field-disabled{background:#f9f9f9;border:1px solid #676767;color:#676767;cursor:not-allowed}.field-wrapper.field-disabled .icon{color:#8f8f8f}.field-wrapper.field-disabled .icon.clickable{cursor:not-allowed}.field-wrapper.field-disabled .icon.clickable:hover{color:inherit}\n"] }]
|
|
1611
1624
|
}], propDecorators: { inputType: [{
|
|
1612
1625
|
type: Input
|
|
1613
1626
|
}], inputId: [{
|
|
@@ -1860,7 +1873,7 @@ class ImpersonateModalComponent {
|
|
|
1860
1873
|
this.subs.unsubscribe();
|
|
1861
1874
|
}
|
|
1862
1875
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: ImpersonateModalComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
1863
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.15", 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\" cdkTrapFocus [cdkTrapFocusAutoCapture]=\"true\">\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 <div class=\"search-field-wrapper\">\n <lib-label\n text=\"Search patrons\"\n [for]=\"'searchInput'\"\n type=\"none\"\n class=\"sr-only\"\n ></lib-label>\n <lib-field\n inputId=\"searchInput\"\n placeholder=\"Search patrons...\"\n formControlName=\"search\"\n iconBefore=\"search\"\n [iconAfter]=\"searchIconAfter\"\n [iconAfterClickable]=\"isIconAfterClickable\"\n (iconAfterClick)=\"handleIconAfterClick()\"\n (keydown)=\"handleSearchKeyPress($event)\"\n [state]=\"fieldState\"\n data-testid=\"searchInput\"\n ></lib-field>\n </div>\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 \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 tabindex=\"-1\"\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: ["html{border:0;margin:0;padding:0;-webkit-text-size-adjust:100%}body{margin:0;padding:0}*,*:before,*:after{box-sizing:border-box}:root{--color-navy: #00245d;--color-royal: #0047ba;--color-white: #ffffff;--color-blue-500: #00245d;--color-blue-400: #003995;--color-blue-300: #0047ba;--color-blue-200: #336cc8;--color-blue-150: #ccdaf1;--color-blue-100: #e5edf8;--color-gray-500: #141414;--color-gray-400: #676767;--color-gray-300: #8f8f8f;--color-gray-200: #d0d0d0;--color-gray-100: #e7e7e7;--color-gray-50: #f9f9f9;--color-gray-brand-400: #676767;--color-green-500: #1d562e;--color-green-400: #2e8545;--color-green-300: #3ba35a;--color-green-200: #9dd1ac;--color-green-100: #ebf6ee;--color-teal-500: #26485f;--color-teal-400: #3e7295;--color-teal-300: #457fa6;--color-teal-200: #a2bfd3;--color-teal-100: #ecf2f6;--color-red-500: #702121;--color-red-400: #b33837;--color-red-300: #c73e3d;--color-red-200: #e39e9e;--color-red-100: #f9ecec;--color-yellow-500: #635f04;--color-yellow-400: #928c30;--color-yellow-300: #d1c844;--color-yellow-200: #e8e3a1;--color-yellow-100: #faf9ec;--color-purple-focus: #b967c7;--text-heading: #002e5d;--text-secondary-heading: #737373;--text-body: #141414;--text-disabled: #676767;--text-link: #336cc8;--text-on-action: #ffffff;--text-success: #1d562e;--text-info: #26485f;--text-error: #702121;--text-warning: #635f04;--surface-success: #ebf6ee;--surface-info: #ecf2f6;--surface-error: #f9ecec;--surface-warning: #faf9ec;--focus-ring-color: #b967c7}@font-face{font-family:Source Sans Pro;font-style:normal;font-weight:300;src:url(https://media.lib.byu.edu/web-assets/fonts/sourcesanspro/1.0.0/SourceSansPro-Light.ttf) format(\"truetype\");font-display:swap}@font-face{font-family:Source Sans Pro;font-style:normal;font-weight:400;src:url(https://media.lib.byu.edu/web-assets/fonts/sourcesanspro/1.0.0/SourceSansPro-Regular.ttf) format(\"truetype\");font-display:swap}@font-face{font-family:Source Sans Pro;font-style:normal;font-weight:600;src:url(https://media.lib.byu.edu/web-assets/fonts/sourcesanspro/1.0.0/SourceSansPro-Semibold.ttf) format(\"truetype\");font-display:swap}@font-face{font-family:Source Sans Pro;font-style:normal;font-weight:700;src:url(https://media.lib.byu.edu/web-assets/fonts/sourcesanspro/1.0.0/SourceSansPro-Bold.ttf) format(\"truetype\");font-display:swap}@font-face{font-family:Source Sans Pro;font-style:italic;font-weight:300;src:url(https://media.lib.byu.edu/web-assets/fonts/sourcesanspro/1.0.0/SourceSansPro-LightItalic.ttf) format(\"truetype\");font-display:swap}@font-face{font-family:Source Sans Pro;font-style:italic;font-weight:400;src:url(https://media.lib.byu.edu/web-assets/fonts/sourcesanspro/1.0.0/SourceSansPro-Italic.ttf) format(\"truetype\");font-display:swap}@font-face{font-family:Source Sans Pro;font-style:italic;font-weight:600;src:url(https://media.lib.byu.edu/web-assets/fonts/sourcesanspro/1.0.0/SourceSansPro-SemiboldItalic.ttf) format(\"truetype\");font-display:swap}@font-face{font-family:Source Sans Pro;font-style:italic;font-weight:700;src:url(https://media.lib.byu.edu/web-assets/fonts/sourcesanspro/1.0.0/SourceSansPro-BoldItalic.ttf) format(\"truetype\");font-display:swap}h1,h2,h3,h4,h5,h6,span:not(.material-symbols-outlined),a,p{font-family:Source Sans Pro}h1{font-weight:300;font-style:normal;color:var(--text-heading)}h2{font-weight:400;font-style:normal;color:var(--text-heading)}h3{font-weight:700;font-style:normal;color:var(--text-heading)}h4,h5,h6{font-weight:600;font-style:normal;color:var(--text-secondary-heading)}.hbll-default-body{font-weight:400;font-style:normal;max-width:35rem;min-width:22.25rem;color:var(--text-body)}.hbll-caption{font-weight:400;font-style:normal;max-width:25.25rem;min-width:17.5rem;color:var(--text-body)}.hbll-large{font-weight:400;font-style:normal;max-width:41.25rem;min-width:26.5rem;color:var(--text-body)}a{color:var(--text-link);text-decoration:underline}.hbll-emphasis{font-weight:600}h1{font-size:2rem;line-height:2.5rem}h2{font-size:1.75rem;line-height:2.25rem}h3,h4{font-size:1.5rem;line-height:2rem}h5,h6{font-size:1.25rem;line-height:1.75rem}.hbll-default-body{font-size:.875rem;line-height:1.25rem}.hbll-caption{font-size:.75rem;line-height:1rem}.hbll-large{font-size:1rem;line-height:1.5rem}@media screen and (min-width: 52.125em){h1{font-size:3rem;line-height:3.5rem}h2{font-size:2.5rem;line-height:3rem}h3{font-size:2rem;line-height:3rem}h4{font-size:1.75rem;line-height:2.5rem}h5{font-size:1.5rem;line-height:2rem}h6{font-size:1.25rem;line-height:1.75rem}.hbll-default-body{font-size:1rem;line-height:1.5rem}.hbll-caption{font-size:.75rem;line-height:1rem}.hbll-large{font-size:1.25rem;line-height:1.75rem}}@media screen and (min-width: 90em){h1{font-size:3.75rem;line-height:4.25rem}h2{font-size:3rem;line-height:3.5rem}h3{font-size:2.5rem;line-height:3rem}h4{font-size:2rem;line-height:2.5rem}h5{font-size:1.5rem;line-height:2rem}h6{font-size:1.25rem;line-height:1.75rem}.hbll-default-body{font-size:1rem;line-height:1.5rem}.hbll-caption{font-size:.75rem;line-height:1rem}.hbll-large{font-size:1.25rem;line-height:1.75rem}}:focus-visible{outline:.125rem solid var(--focus-ring-color);outline-offset:.125rem}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);border:0}.sr-only.sr-only-focusable:focus,.sr-only.sr-only-focusable:focus-within,.sr-only.sr-only-focusable:active{position:static;width:auto;height:auto;margin:0;overflow:visible;clip:auto}.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>button{background:transparent;border:none;padding:.25rem;height:2rem;width:2rem;display:inline-flex;align-items:center;justify-content:center;border-radius:4px}.modal-container .modal-header>button:focus{outline:2px solid #7040aa;outline-offset:2px}.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:#676767}.modal-container .search-header .keyboard-key{padding:.1em .4em;border:1px solid #676767;border-radius:4px}.modal-container .search-field-wrapper{display:flex;flex-direction:column;gap:.5rem}.modal-container .search-field-wrapper .sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border-width:0}.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:inline-flex;color:#7040aa;padding:.1em .6em;border:1px solid #8f8f8f;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:#b967c7;background-color:#fff8}.modal-container .search-results-wrapper .result-field.result:active,.modal-container .search-results-wrapper .result-field.result.focus{background:#f2f2f2}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: LabelComponent, selector: "lib-label", inputs: ["text", "type", "showHelpIcon", "ariaLabel", "position", "isRequired", "for", "subtext"], outputs: ["helpIconClick"] }, { kind: "component", type: FieldComponent, selector: "lib-field", inputs: ["inputType", "inputId", "placeholder", "state", "status", "iconBefore", "iconAfter", "iconBeforeClickable", "iconAfterClickable", "iconBeforeAction", "iconAfterAction", "disabled", "ariaLabel", "value", "isFullText", "rows", "minWidth", "maxWidth", "minHeight", "maxHeight"], outputs: ["valueChange", "iconBeforeClick", "iconAfterClick", "fieldFocus", "fieldBlur"] }, { kind: "ngmodule", type: A11yModule }, { kind: "directive", type: i2.CdkTrapFocus, selector: "[cdkTrapFocus]", inputs: ["cdkTrapFocus", "cdkTrapFocusAutoCapture"], exportAs: ["cdkTrapFocus"] }, { kind: "pipe", type: ImpersonateUserPipe, name: "impersonateUser" }], animations: [libHbllFadeInOut] }); }
|
|
1876
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.15", 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\" cdkTrapFocus [cdkTrapFocusAutoCapture]=\"true\">\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 <div class=\"search-field-wrapper\">\n <lib-label\n text=\"Search patrons\"\n [for]=\"'searchInput'\"\n type=\"none\"\n class=\"sr-only\"\n ></lib-label>\n <lib-field\n inputId=\"searchInput\"\n placeholder=\"Search patrons...\"\n formControlName=\"search\"\n iconBefore=\"search\"\n [iconAfter]=\"searchIconAfter\"\n [iconAfterClickable]=\"isIconAfterClickable\"\n (iconAfterClick)=\"handleIconAfterClick()\"\n (keydown)=\"handleSearchKeyPress($event)\"\n [state]=\"fieldState\"\n data-testid=\"searchInput\"\n ></lib-field>\n </div>\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 \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 tabindex=\"-1\"\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: ["html{border:0;margin:0;padding:0;-webkit-text-size-adjust:100%}body{margin:0;padding:0}*,*:before,*:after{box-sizing:border-box}:root{--color-navy: #00245d;--color-royal: #0047ba;--color-white: #ffffff;--color-blue-500: #00245d;--color-blue-400: #003995;--color-blue-300: #0047ba;--color-blue-200: #336cc8;--color-blue-150: #ccdaf1;--color-blue-100: #e5edf8;--color-gray-500: #141414;--color-gray-400: #676767;--color-gray-300: #8f8f8f;--color-gray-200: #d0d0d0;--color-gray-100: #e7e7e7;--color-gray-50: #f9f9f9;--color-gray-brand-400: #676767;--color-green-500: #1d562e;--color-green-400: #2e8545;--color-green-300: #3ba35a;--color-green-200: #9dd1ac;--color-green-100: #ebf6ee;--color-teal-500: #26485f;--color-teal-400: #3e7295;--color-teal-300: #457fa6;--color-teal-200: #a2bfd3;--color-teal-100: #ecf2f6;--color-red-500: #702121;--color-red-400: #b33837;--color-red-300: #c73e3d;--color-red-200: #e39e9e;--color-red-100: #f9ecec;--color-yellow-500: #635f04;--color-yellow-400: #928c30;--color-yellow-300: #d1c844;--color-yellow-200: #e8e3a1;--color-yellow-100: #faf9ec;--color-purple-focus: #b967c7;--text-heading: #002e5d;--text-secondary-heading: #737373;--text-body: #141414;--text-disabled: #676767;--text-link: #336cc8;--text-on-action: #ffffff;--text-success: #1d562e;--text-info: #26485f;--text-error: #702121;--text-warning: #635f04;--surface-success: #ebf6ee;--surface-info: #ecf2f6;--surface-error: #f9ecec;--surface-warning: #faf9ec;--focus-ring-color: #b967c7}@font-face{font-family:Source Sans Pro;font-style:normal;font-weight:300;src:url(https://media.lib.byu.edu/web-assets/fonts/sourcesanspro/1.0.0/SourceSansPro-Light.ttf) format(\"truetype\");font-display:swap}@font-face{font-family:Source Sans Pro;font-style:normal;font-weight:400;src:url(https://media.lib.byu.edu/web-assets/fonts/sourcesanspro/1.0.0/SourceSansPro-Regular.ttf) format(\"truetype\");font-display:swap}@font-face{font-family:Source Sans Pro;font-style:normal;font-weight:600;src:url(https://media.lib.byu.edu/web-assets/fonts/sourcesanspro/1.0.0/SourceSansPro-Semibold.ttf) format(\"truetype\");font-display:swap}@font-face{font-family:Source Sans Pro;font-style:normal;font-weight:700;src:url(https://media.lib.byu.edu/web-assets/fonts/sourcesanspro/1.0.0/SourceSansPro-Bold.ttf) format(\"truetype\");font-display:swap}@font-face{font-family:Source Sans Pro;font-style:italic;font-weight:300;src:url(https://media.lib.byu.edu/web-assets/fonts/sourcesanspro/1.0.0/SourceSansPro-LightItalic.ttf) format(\"truetype\");font-display:swap}@font-face{font-family:Source Sans Pro;font-style:italic;font-weight:400;src:url(https://media.lib.byu.edu/web-assets/fonts/sourcesanspro/1.0.0/SourceSansPro-Italic.ttf) format(\"truetype\");font-display:swap}@font-face{font-family:Source Sans Pro;font-style:italic;font-weight:600;src:url(https://media.lib.byu.edu/web-assets/fonts/sourcesanspro/1.0.0/SourceSansPro-SemiboldItalic.ttf) format(\"truetype\");font-display:swap}@font-face{font-family:Source Sans Pro;font-style:italic;font-weight:700;src:url(https://media.lib.byu.edu/web-assets/fonts/sourcesanspro/1.0.0/SourceSansPro-BoldItalic.ttf) format(\"truetype\");font-display:swap}h1,h2,h3,h4,h5,h6,span:not(.material-symbols-outlined),a,p{font-family:Source Sans Pro}h1{font-weight:300;font-style:normal;color:var(--text-heading)}h2{font-weight:400;font-style:normal;color:var(--text-heading)}h3{font-weight:700;font-style:normal;color:var(--text-heading)}h4,h5,h6{font-weight:600;font-style:normal;color:var(--text-secondary-heading)}.hbll-default-body{font-weight:400;font-style:normal;max-width:35rem;min-width:22.25rem;color:var(--text-body)}.hbll-caption{font-weight:400;font-style:normal;max-width:25.25rem;min-width:17.5rem;color:var(--text-body)}.hbll-large{font-weight:400;font-style:normal;max-width:41.25rem;min-width:26.5rem;color:var(--text-body)}a{color:var(--text-link);text-decoration:underline}.hbll-emphasis{font-weight:600}h1{font-size:2rem;line-height:2.5rem}h2{font-size:1.75rem;line-height:2.25rem}h3,h4{font-size:1.5rem;line-height:2rem}h5,h6{font-size:1.25rem;line-height:1.75rem}.hbll-default-body{font-size:.875rem;line-height:1.25rem}.hbll-caption{font-size:.75rem;line-height:1rem}.hbll-large{font-size:1rem;line-height:1.5rem}@media screen and (min-width: 52.125em){h1{font-size:3rem;line-height:3.5rem}h2{font-size:2.5rem;line-height:3rem}h3{font-size:2rem;line-height:3rem}h4{font-size:1.75rem;line-height:2.5rem}h5{font-size:1.5rem;line-height:2rem}h6{font-size:1.25rem;line-height:1.75rem}.hbll-default-body{font-size:1rem;line-height:1.5rem}.hbll-caption{font-size:.75rem;line-height:1rem}.hbll-large{font-size:1.25rem;line-height:1.75rem}}@media screen and (min-width: 90em){h1{font-size:3.75rem;line-height:4.25rem}h2{font-size:3rem;line-height:3.5rem}h3{font-size:2.5rem;line-height:3rem}h4{font-size:2rem;line-height:2.5rem}h5{font-size:1.5rem;line-height:2rem}h6{font-size:1.25rem;line-height:1.75rem}.hbll-default-body{font-size:1rem;line-height:1.5rem}.hbll-caption{font-size:.75rem;line-height:1rem}.hbll-large{font-size:1.25rem;line-height:1.75rem}}:focus-visible{outline:.125rem solid var(--focus-ring-color);outline-offset:.125rem}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);border:0}.sr-only.sr-only-focusable:focus,.sr-only.sr-only-focusable:focus-within,.sr-only.sr-only-focusable:active{position:static;width:auto;height:auto;margin:0;overflow:visible;clip:auto}.lib-spinner{border:.3em solid #dfe9f7;border-top:.3em solid #457fa6;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:#b33837}.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 #d0d0d0;box-shadow:0 3px 6px #00245d20;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 #e7e7e7;padding-bottom:.8em}.modal-container .modal-header>button{background:transparent;border:none;padding:.25rem;height:2rem;width:2rem;display:inline-flex;align-items:center;justify-content:center;border-radius:4px}.modal-container .modal-header>button:focus{outline:2px solid #7040aa;outline-offset:2px}.modal-container .modal-header .icon-close{transition:opacity .15s;color:#676767;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:#676767}.modal-container .search-header .keyboard-key{padding:.1em .4em;border:1px solid #676767;border-radius:4px}.modal-container .search-field-wrapper{display:flex;flex-direction:column;gap:.5rem}.modal-container .search-field-wrapper .sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border-width:0}.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:inline-flex;color:#7040aa;padding:.1em .6em;border:1px solid #8f8f8f;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:#b967c7;background-color:#fff8}.modal-container .search-results-wrapper .result-field.result:active,.modal-container .search-results-wrapper .result-field.result.focus{background:#f2f2f2}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: LabelComponent, selector: "lib-label", inputs: ["text", "type", "showHelpIcon", "ariaLabel", "position", "isRequired", "for", "subtext"], outputs: ["helpIconClick"] }, { kind: "component", type: FieldComponent, selector: "lib-field", inputs: ["inputType", "inputId", "placeholder", "state", "status", "iconBefore", "iconAfter", "iconBeforeClickable", "iconAfterClickable", "iconBeforeAction", "iconAfterAction", "disabled", "ariaLabel", "value", "isFullText", "rows", "minWidth", "maxWidth", "minHeight", "maxHeight"], outputs: ["valueChange", "iconBeforeClick", "iconAfterClick", "fieldFocus", "fieldBlur"] }, { kind: "ngmodule", type: A11yModule }, { kind: "directive", type: i2.CdkTrapFocus, selector: "[cdkTrapFocus]", inputs: ["cdkTrapFocus", "cdkTrapFocusAutoCapture"], exportAs: ["cdkTrapFocus"] }, { kind: "pipe", type: ImpersonateUserPipe, name: "impersonateUser" }], animations: [libHbllFadeInOut] }); }
|
|
1864
1877
|
}
|
|
1865
1878
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: ImpersonateModalComponent, decorators: [{
|
|
1866
1879
|
type: Component,
|
|
@@ -1871,7 +1884,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImpo
|
|
|
1871
1884
|
LabelComponent,
|
|
1872
1885
|
FieldComponent,
|
|
1873
1886
|
A11yModule,
|
|
1874
|
-
], 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\" cdkTrapFocus [cdkTrapFocusAutoCapture]=\"true\">\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 <div class=\"search-field-wrapper\">\n <lib-label\n text=\"Search patrons\"\n [for]=\"'searchInput'\"\n type=\"none\"\n class=\"sr-only\"\n ></lib-label>\n <lib-field\n inputId=\"searchInput\"\n placeholder=\"Search patrons...\"\n formControlName=\"search\"\n iconBefore=\"search\"\n [iconAfter]=\"searchIconAfter\"\n [iconAfterClickable]=\"isIconAfterClickable\"\n (iconAfterClick)=\"handleIconAfterClick()\"\n (keydown)=\"handleSearchKeyPress($event)\"\n [state]=\"fieldState\"\n data-testid=\"searchInput\"\n ></lib-field>\n </div>\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 \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 tabindex=\"-1\"\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: ["html{border:0;margin:0;padding:0;-webkit-text-size-adjust:100%}body{margin:0;padding:0}*,*:before,*:after{box-sizing:border-box}:root{--color-navy: #00245d;--color-royal: #0047ba;--color-white: #ffffff;--color-blue-500: #00245d;--color-blue-400: #003995;--color-blue-300: #0047ba;--color-blue-200: #336cc8;--color-blue-150: #ccdaf1;--color-blue-100: #e5edf8;--color-gray-500: #141414;--color-gray-400: #676767;--color-gray-300: #8f8f8f;--color-gray-200: #d0d0d0;--color-gray-100: #e7e7e7;--color-gray-50: #f9f9f9;--color-gray-brand-400: #676767;--color-green-500: #1d562e;--color-green-400: #2e8545;--color-green-300: #3ba35a;--color-green-200: #9dd1ac;--color-green-100: #ebf6ee;--color-teal-500: #26485f;--color-teal-400: #3e7295;--color-teal-300: #457fa6;--color-teal-200: #a2bfd3;--color-teal-100: #ecf2f6;--color-red-500: #702121;--color-red-400: #b33837;--color-red-300: #c73e3d;--color-red-200: #e39e9e;--color-red-100: #f9ecec;--color-yellow-500: #635f04;--color-yellow-400: #928c30;--color-yellow-300: #d1c844;--color-yellow-200: #e8e3a1;--color-yellow-100: #faf9ec;--color-purple-focus: #b967c7;--text-heading: #002e5d;--text-secondary-heading: #737373;--text-body: #141414;--text-disabled: #676767;--text-link: #336cc8;--text-on-action: #ffffff;--text-success: #1d562e;--text-info: #26485f;--text-error: #702121;--text-warning: #635f04;--surface-success: #ebf6ee;--surface-info: #ecf2f6;--surface-error: #f9ecec;--surface-warning: #faf9ec;--focus-ring-color: #b967c7}@font-face{font-family:Source Sans Pro;font-style:normal;font-weight:300;src:url(https://media.lib.byu.edu/web-assets/fonts/sourcesanspro/1.0.0/SourceSansPro-Light.ttf) format(\"truetype\");font-display:swap}@font-face{font-family:Source Sans Pro;font-style:normal;font-weight:400;src:url(https://media.lib.byu.edu/web-assets/fonts/sourcesanspro/1.0.0/SourceSansPro-Regular.ttf) format(\"truetype\");font-display:swap}@font-face{font-family:Source Sans Pro;font-style:normal;font-weight:600;src:url(https://media.lib.byu.edu/web-assets/fonts/sourcesanspro/1.0.0/SourceSansPro-Semibold.ttf) format(\"truetype\");font-display:swap}@font-face{font-family:Source Sans Pro;font-style:normal;font-weight:700;src:url(https://media.lib.byu.edu/web-assets/fonts/sourcesanspro/1.0.0/SourceSansPro-Bold.ttf) format(\"truetype\");font-display:swap}@font-face{font-family:Source Sans Pro;font-style:italic;font-weight:300;src:url(https://media.lib.byu.edu/web-assets/fonts/sourcesanspro/1.0.0/SourceSansPro-LightItalic.ttf) format(\"truetype\");font-display:swap}@font-face{font-family:Source Sans Pro;font-style:italic;font-weight:400;src:url(https://media.lib.byu.edu/web-assets/fonts/sourcesanspro/1.0.0/SourceSansPro-Italic.ttf) format(\"truetype\");font-display:swap}@font-face{font-family:Source Sans Pro;font-style:italic;font-weight:600;src:url(https://media.lib.byu.edu/web-assets/fonts/sourcesanspro/1.0.0/SourceSansPro-SemiboldItalic.ttf) format(\"truetype\");font-display:swap}@font-face{font-family:Source Sans Pro;font-style:italic;font-weight:700;src:url(https://media.lib.byu.edu/web-assets/fonts/sourcesanspro/1.0.0/SourceSansPro-BoldItalic.ttf) format(\"truetype\");font-display:swap}h1,h2,h3,h4,h5,h6,span:not(.material-symbols-outlined),a,p{font-family:Source Sans Pro}h1{font-weight:300;font-style:normal;color:var(--text-heading)}h2{font-weight:400;font-style:normal;color:var(--text-heading)}h3{font-weight:700;font-style:normal;color:var(--text-heading)}h4,h5,h6{font-weight:600;font-style:normal;color:var(--text-secondary-heading)}.hbll-default-body{font-weight:400;font-style:normal;max-width:35rem;min-width:22.25rem;color:var(--text-body)}.hbll-caption{font-weight:400;font-style:normal;max-width:25.25rem;min-width:17.5rem;color:var(--text-body)}.hbll-large{font-weight:400;font-style:normal;max-width:41.25rem;min-width:26.5rem;color:var(--text-body)}a{color:var(--text-link);text-decoration:underline}.hbll-emphasis{font-weight:600}h1{font-size:2rem;line-height:2.5rem}h2{font-size:1.75rem;line-height:2.25rem}h3,h4{font-size:1.5rem;line-height:2rem}h5,h6{font-size:1.25rem;line-height:1.75rem}.hbll-default-body{font-size:.875rem;line-height:1.25rem}.hbll-caption{font-size:.75rem;line-height:1rem}.hbll-large{font-size:1rem;line-height:1.5rem}@media screen and (min-width: 52.125em){h1{font-size:3rem;line-height:3.5rem}h2{font-size:2.5rem;line-height:3rem}h3{font-size:2rem;line-height:3rem}h4{font-size:1.75rem;line-height:2.5rem}h5{font-size:1.5rem;line-height:2rem}h6{font-size:1.25rem;line-height:1.75rem}.hbll-default-body{font-size:1rem;line-height:1.5rem}.hbll-caption{font-size:.75rem;line-height:1rem}.hbll-large{font-size:1.25rem;line-height:1.75rem}}@media screen and (min-width: 90em){h1{font-size:3.75rem;line-height:4.25rem}h2{font-size:3rem;line-height:3.5rem}h3{font-size:2.5rem;line-height:3rem}h4{font-size:2rem;line-height:2.5rem}h5{font-size:1.5rem;line-height:2rem}h6{font-size:1.25rem;line-height:1.75rem}.hbll-default-body{font-size:1rem;line-height:1.5rem}.hbll-caption{font-size:.75rem;line-height:1rem}.hbll-large{font-size:1.25rem;line-height:1.75rem}}:focus-visible{outline:.125rem solid var(--focus-ring-color);outline-offset:.125rem}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);border:0}.sr-only.sr-only-focusable:focus,.sr-only.sr-only-focusable:focus-within,.sr-only.sr-only-focusable:active{position:static;width:auto;height:auto;margin:0;overflow:visible;clip:auto}.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>button{background:transparent;border:none;padding:.25rem;height:2rem;width:2rem;display:inline-flex;align-items:center;justify-content:center;border-radius:4px}.modal-container .modal-header>button:focus{outline:2px solid #7040aa;outline-offset:2px}.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:#676767}.modal-container .search-header .keyboard-key{padding:.1em .4em;border:1px solid #676767;border-radius:4px}.modal-container .search-field-wrapper{display:flex;flex-direction:column;gap:.5rem}.modal-container .search-field-wrapper .sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border-width:0}.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:inline-flex;color:#7040aa;padding:.1em .6em;border:1px solid #8f8f8f;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:#b967c7;background-color:#fff8}.modal-container .search-results-wrapper .result-field.result:active,.modal-container .search-results-wrapper .result-field.result.focus{background:#f2f2f2}\n"] }]
|
|
1887
|
+
], 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\" cdkTrapFocus [cdkTrapFocusAutoCapture]=\"true\">\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 <div class=\"search-field-wrapper\">\n <lib-label\n text=\"Search patrons\"\n [for]=\"'searchInput'\"\n type=\"none\"\n class=\"sr-only\"\n ></lib-label>\n <lib-field\n inputId=\"searchInput\"\n placeholder=\"Search patrons...\"\n formControlName=\"search\"\n iconBefore=\"search\"\n [iconAfter]=\"searchIconAfter\"\n [iconAfterClickable]=\"isIconAfterClickable\"\n (iconAfterClick)=\"handleIconAfterClick()\"\n (keydown)=\"handleSearchKeyPress($event)\"\n [state]=\"fieldState\"\n data-testid=\"searchInput\"\n ></lib-field>\n </div>\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 \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 tabindex=\"-1\"\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: ["html{border:0;margin:0;padding:0;-webkit-text-size-adjust:100%}body{margin:0;padding:0}*,*:before,*:after{box-sizing:border-box}:root{--color-navy: #00245d;--color-royal: #0047ba;--color-white: #ffffff;--color-blue-500: #00245d;--color-blue-400: #003995;--color-blue-300: #0047ba;--color-blue-200: #336cc8;--color-blue-150: #ccdaf1;--color-blue-100: #e5edf8;--color-gray-500: #141414;--color-gray-400: #676767;--color-gray-300: #8f8f8f;--color-gray-200: #d0d0d0;--color-gray-100: #e7e7e7;--color-gray-50: #f9f9f9;--color-gray-brand-400: #676767;--color-green-500: #1d562e;--color-green-400: #2e8545;--color-green-300: #3ba35a;--color-green-200: #9dd1ac;--color-green-100: #ebf6ee;--color-teal-500: #26485f;--color-teal-400: #3e7295;--color-teal-300: #457fa6;--color-teal-200: #a2bfd3;--color-teal-100: #ecf2f6;--color-red-500: #702121;--color-red-400: #b33837;--color-red-300: #c73e3d;--color-red-200: #e39e9e;--color-red-100: #f9ecec;--color-yellow-500: #635f04;--color-yellow-400: #928c30;--color-yellow-300: #d1c844;--color-yellow-200: #e8e3a1;--color-yellow-100: #faf9ec;--color-purple-focus: #b967c7;--text-heading: #002e5d;--text-secondary-heading: #737373;--text-body: #141414;--text-disabled: #676767;--text-link: #336cc8;--text-on-action: #ffffff;--text-success: #1d562e;--text-info: #26485f;--text-error: #702121;--text-warning: #635f04;--surface-success: #ebf6ee;--surface-info: #ecf2f6;--surface-error: #f9ecec;--surface-warning: #faf9ec;--focus-ring-color: #b967c7}@font-face{font-family:Source Sans Pro;font-style:normal;font-weight:300;src:url(https://media.lib.byu.edu/web-assets/fonts/sourcesanspro/1.0.0/SourceSansPro-Light.ttf) format(\"truetype\");font-display:swap}@font-face{font-family:Source Sans Pro;font-style:normal;font-weight:400;src:url(https://media.lib.byu.edu/web-assets/fonts/sourcesanspro/1.0.0/SourceSansPro-Regular.ttf) format(\"truetype\");font-display:swap}@font-face{font-family:Source Sans Pro;font-style:normal;font-weight:600;src:url(https://media.lib.byu.edu/web-assets/fonts/sourcesanspro/1.0.0/SourceSansPro-Semibold.ttf) format(\"truetype\");font-display:swap}@font-face{font-family:Source Sans Pro;font-style:normal;font-weight:700;src:url(https://media.lib.byu.edu/web-assets/fonts/sourcesanspro/1.0.0/SourceSansPro-Bold.ttf) format(\"truetype\");font-display:swap}@font-face{font-family:Source Sans Pro;font-style:italic;font-weight:300;src:url(https://media.lib.byu.edu/web-assets/fonts/sourcesanspro/1.0.0/SourceSansPro-LightItalic.ttf) format(\"truetype\");font-display:swap}@font-face{font-family:Source Sans Pro;font-style:italic;font-weight:400;src:url(https://media.lib.byu.edu/web-assets/fonts/sourcesanspro/1.0.0/SourceSansPro-Italic.ttf) format(\"truetype\");font-display:swap}@font-face{font-family:Source Sans Pro;font-style:italic;font-weight:600;src:url(https://media.lib.byu.edu/web-assets/fonts/sourcesanspro/1.0.0/SourceSansPro-SemiboldItalic.ttf) format(\"truetype\");font-display:swap}@font-face{font-family:Source Sans Pro;font-style:italic;font-weight:700;src:url(https://media.lib.byu.edu/web-assets/fonts/sourcesanspro/1.0.0/SourceSansPro-BoldItalic.ttf) format(\"truetype\");font-display:swap}h1,h2,h3,h4,h5,h6,span:not(.material-symbols-outlined),a,p{font-family:Source Sans Pro}h1{font-weight:300;font-style:normal;color:var(--text-heading)}h2{font-weight:400;font-style:normal;color:var(--text-heading)}h3{font-weight:700;font-style:normal;color:var(--text-heading)}h4,h5,h6{font-weight:600;font-style:normal;color:var(--text-secondary-heading)}.hbll-default-body{font-weight:400;font-style:normal;max-width:35rem;min-width:22.25rem;color:var(--text-body)}.hbll-caption{font-weight:400;font-style:normal;max-width:25.25rem;min-width:17.5rem;color:var(--text-body)}.hbll-large{font-weight:400;font-style:normal;max-width:41.25rem;min-width:26.5rem;color:var(--text-body)}a{color:var(--text-link);text-decoration:underline}.hbll-emphasis{font-weight:600}h1{font-size:2rem;line-height:2.5rem}h2{font-size:1.75rem;line-height:2.25rem}h3,h4{font-size:1.5rem;line-height:2rem}h5,h6{font-size:1.25rem;line-height:1.75rem}.hbll-default-body{font-size:.875rem;line-height:1.25rem}.hbll-caption{font-size:.75rem;line-height:1rem}.hbll-large{font-size:1rem;line-height:1.5rem}@media screen and (min-width: 52.125em){h1{font-size:3rem;line-height:3.5rem}h2{font-size:2.5rem;line-height:3rem}h3{font-size:2rem;line-height:3rem}h4{font-size:1.75rem;line-height:2.5rem}h5{font-size:1.5rem;line-height:2rem}h6{font-size:1.25rem;line-height:1.75rem}.hbll-default-body{font-size:1rem;line-height:1.5rem}.hbll-caption{font-size:.75rem;line-height:1rem}.hbll-large{font-size:1.25rem;line-height:1.75rem}}@media screen and (min-width: 90em){h1{font-size:3.75rem;line-height:4.25rem}h2{font-size:3rem;line-height:3.5rem}h3{font-size:2.5rem;line-height:3rem}h4{font-size:2rem;line-height:2.5rem}h5{font-size:1.5rem;line-height:2rem}h6{font-size:1.25rem;line-height:1.75rem}.hbll-default-body{font-size:1rem;line-height:1.5rem}.hbll-caption{font-size:.75rem;line-height:1rem}.hbll-large{font-size:1.25rem;line-height:1.75rem}}:focus-visible{outline:.125rem solid var(--focus-ring-color);outline-offset:.125rem}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);border:0}.sr-only.sr-only-focusable:focus,.sr-only.sr-only-focusable:focus-within,.sr-only.sr-only-focusable:active{position:static;width:auto;height:auto;margin:0;overflow:visible;clip:auto}.lib-spinner{border:.3em solid #dfe9f7;border-top:.3em solid #457fa6;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:#b33837}.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 #d0d0d0;box-shadow:0 3px 6px #00245d20;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 #e7e7e7;padding-bottom:.8em}.modal-container .modal-header>button{background:transparent;border:none;padding:.25rem;height:2rem;width:2rem;display:inline-flex;align-items:center;justify-content:center;border-radius:4px}.modal-container .modal-header>button:focus{outline:2px solid #7040aa;outline-offset:2px}.modal-container .modal-header .icon-close{transition:opacity .15s;color:#676767;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:#676767}.modal-container .search-header .keyboard-key{padding:.1em .4em;border:1px solid #676767;border-radius:4px}.modal-container .search-field-wrapper{display:flex;flex-direction:column;gap:.5rem}.modal-container .search-field-wrapper .sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border-width:0}.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:inline-flex;color:#7040aa;padding:.1em .6em;border:1px solid #8f8f8f;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:#b967c7;background-color:#fff8}.modal-container .search-results-wrapper .result-field.result:active,.modal-container .search-results-wrapper .result-field.result.focus{background:#f2f2f2}\n"] }]
|
|
1875
1888
|
}], propDecorators: { showModal: [{
|
|
1876
1889
|
type: Input
|
|
1877
1890
|
}], oidcBaseUri: [{ type: i0.Input, args: [{ isSignal: true, alias: "oidcBaseUri", required: false }] }], oidcDefaultIdp: [{ type: i0.Input, args: [{ isSignal: true, alias: "oidcDefaultIdp", required: false }] }], accessTokenPayload: [{ type: i0.Input, args: [{ isSignal: true, alias: "accessTokenPayload", required: true }] }], dismiss: [{
|
|
@@ -2479,11 +2492,11 @@ class DateRangeComponent {
|
|
|
2479
2492
|
this.dateForm.controls.to.setValue(to);
|
|
2480
2493
|
}
|
|
2481
2494
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: DateRangeComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
2482
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.15", type: DateRangeComponent, isStandalone: true, selector: "lib-date-range", inputs: { from: "from", to: "to" }, outputs: { validDateChange: "validDateChange", fromChange: "fromChange", toChange: "toChange" }, ngImport: i0, template: "<form id=\"fromTo\" data-testid=\"fromTo\" [formGroup]=\"dateForm\">\n <label for=\"fromFacet\">Between</label>\n <input\n formControlName=\"from\"\n id=\"fromFacet\"\n name=\"fromFacet\"\n data-testid=\"from\"\n placeholder=\"YYYY\"\n inputmode=\"numeric\"\n minlength=\"4\"\n maxlength=\"4\"\n (input)=\"onFromChange()\"\n [class.error]=\"\n dateForm.errors?.['fromInvalid'] || dateForm.controls.from.errors?.['pattern']\n \"\n />\n <label for=\"toFacet\">and</label>\n <input\n formControlName=\"to\"\n id=\"toFacet\"\n name=\"toFacet\"\n data-testid=\"to\"\n placeholder=\"YYYY\"\n inputmode=\"numeric\"\n minlength=\"4\"\n maxlength=\"4\"\n (input)=\"onToChange()\"\n [class.error]=\"dateForm.errors?.['toInvalid'] || dateForm.controls.to.errors?.['pattern']\"\n />\n</form>\n", styles: ["input{appearance:none;font-family:inherit;padding:.38em;border:solid 1px #707070;border-radius:4px;font-size:1em;background-color:#fff}#fromTo{margin-top:.375rem;margin-bottom:.5rem}#fromTo label{margin-right:.7em}#fromTo label:not(:first-of-type){margin-left:.7em}#fromTo input{font-size:inherit;width:3.5em}#fromTo input.error{border-color:#
|
|
2495
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.15", type: DateRangeComponent, isStandalone: true, selector: "lib-date-range", inputs: { from: "from", to: "to" }, outputs: { validDateChange: "validDateChange", fromChange: "fromChange", toChange: "toChange" }, ngImport: i0, template: "<form id=\"fromTo\" data-testid=\"fromTo\" [formGroup]=\"dateForm\">\n <label for=\"fromFacet\">Between</label>\n <input\n formControlName=\"from\"\n id=\"fromFacet\"\n name=\"fromFacet\"\n data-testid=\"from\"\n placeholder=\"YYYY\"\n inputmode=\"numeric\"\n minlength=\"4\"\n maxlength=\"4\"\n (input)=\"onFromChange()\"\n [class.error]=\"\n dateForm.errors?.['fromInvalid'] || dateForm.controls.from.errors?.['pattern']\n \"\n />\n <label for=\"toFacet\">and</label>\n <input\n formControlName=\"to\"\n id=\"toFacet\"\n name=\"toFacet\"\n data-testid=\"to\"\n placeholder=\"YYYY\"\n inputmode=\"numeric\"\n minlength=\"4\"\n maxlength=\"4\"\n (input)=\"onToChange()\"\n [class.error]=\"dateForm.errors?.['toInvalid'] || dateForm.controls.to.errors?.['pattern']\"\n />\n</form>\n", styles: ["input{appearance:none;font-family:inherit;padding:.38em;border:solid 1px #707070;border-radius:4px;font-size:1em;background-color:#fff}#fromTo{margin-top:.375rem;margin-bottom:.5rem}#fromTo label{margin-right:.7em}#fromTo label:not(:first-of-type){margin-left:.7em}#fromTo input{font-size:inherit;width:3.5em}#fromTo input.error{border-color:#b33837}@media screen and (min-width: 690px){#fromTo{margin-bottom:.875rem}#fromTo label{margin-right:.65em}#fromTo label:not(:first-of-type){margin-left:.65em}}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$1.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: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$1.MinLengthValidator, selector: "[minlength][formControlName],[minlength][formControl],[minlength][ngModel]", inputs: ["minlength"] }, { kind: "directive", type: i1$1.MaxLengthValidator, selector: "[maxlength][formControlName],[maxlength][formControl],[maxlength][ngModel]", inputs: ["maxlength"] }, { kind: "directive", type: i1$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }], animations: [libHbllFadeInOut], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
2483
2496
|
}
|
|
2484
2497
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: DateRangeComponent, decorators: [{
|
|
2485
2498
|
type: Component,
|
|
2486
|
-
args: [{ selector: 'lib-date-range', changeDetection: ChangeDetectionStrategy.OnPush, imports: [CommonModule, ReactiveFormsModule], animations: [libHbllFadeInOut], template: "<form id=\"fromTo\" data-testid=\"fromTo\" [formGroup]=\"dateForm\">\n <label for=\"fromFacet\">Between</label>\n <input\n formControlName=\"from\"\n id=\"fromFacet\"\n name=\"fromFacet\"\n data-testid=\"from\"\n placeholder=\"YYYY\"\n inputmode=\"numeric\"\n minlength=\"4\"\n maxlength=\"4\"\n (input)=\"onFromChange()\"\n [class.error]=\"\n dateForm.errors?.['fromInvalid'] || dateForm.controls.from.errors?.['pattern']\n \"\n />\n <label for=\"toFacet\">and</label>\n <input\n formControlName=\"to\"\n id=\"toFacet\"\n name=\"toFacet\"\n data-testid=\"to\"\n placeholder=\"YYYY\"\n inputmode=\"numeric\"\n minlength=\"4\"\n maxlength=\"4\"\n (input)=\"onToChange()\"\n [class.error]=\"dateForm.errors?.['toInvalid'] || dateForm.controls.to.errors?.['pattern']\"\n />\n</form>\n", styles: ["input{appearance:none;font-family:inherit;padding:.38em;border:solid 1px #707070;border-radius:4px;font-size:1em;background-color:#fff}#fromTo{margin-top:.375rem;margin-bottom:.5rem}#fromTo label{margin-right:.7em}#fromTo label:not(:first-of-type){margin-left:.7em}#fromTo input{font-size:inherit;width:3.5em}#fromTo input.error{border-color:#
|
|
2499
|
+
args: [{ selector: 'lib-date-range', changeDetection: ChangeDetectionStrategy.OnPush, imports: [CommonModule, ReactiveFormsModule], animations: [libHbllFadeInOut], template: "<form id=\"fromTo\" data-testid=\"fromTo\" [formGroup]=\"dateForm\">\n <label for=\"fromFacet\">Between</label>\n <input\n formControlName=\"from\"\n id=\"fromFacet\"\n name=\"fromFacet\"\n data-testid=\"from\"\n placeholder=\"YYYY\"\n inputmode=\"numeric\"\n minlength=\"4\"\n maxlength=\"4\"\n (input)=\"onFromChange()\"\n [class.error]=\"\n dateForm.errors?.['fromInvalid'] || dateForm.controls.from.errors?.['pattern']\n \"\n />\n <label for=\"toFacet\">and</label>\n <input\n formControlName=\"to\"\n id=\"toFacet\"\n name=\"toFacet\"\n data-testid=\"to\"\n placeholder=\"YYYY\"\n inputmode=\"numeric\"\n minlength=\"4\"\n maxlength=\"4\"\n (input)=\"onToChange()\"\n [class.error]=\"dateForm.errors?.['toInvalid'] || dateForm.controls.to.errors?.['pattern']\"\n />\n</form>\n", styles: ["input{appearance:none;font-family:inherit;padding:.38em;border:solid 1px #707070;border-radius:4px;font-size:1em;background-color:#fff}#fromTo{margin-top:.375rem;margin-bottom:.5rem}#fromTo label{margin-right:.7em}#fromTo label:not(:first-of-type){margin-left:.7em}#fromTo input{font-size:inherit;width:3.5em}#fromTo input.error{border-color:#b33837}@media screen and (min-width: 690px){#fromTo{margin-bottom:.875rem}#fromTo label{margin-right:.65em}#fromTo label:not(:first-of-type){margin-left:.65em}}\n"] }]
|
|
2487
2500
|
}], propDecorators: { validDateChange: [{
|
|
2488
2501
|
type: Output
|
|
2489
2502
|
}], fromChange: [{
|
|
@@ -2742,7 +2755,7 @@ class AdvancedSearchComponent {
|
|
|
2742
2755
|
return `Search terms for ${fieldLabel}`;
|
|
2743
2756
|
}
|
|
2744
2757
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: AdvancedSearchComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
2745
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.15", type: AdvancedSearchComponent, isStandalone: true, selector: "lib-ss-advanced-search", inputs: { config: "config" }, outputs: { advancedSearch: "advancedSearch" }, viewQueries: [{ propertyName: "searchInput", first: true, predicate: ["searchInput"], descendants: true }, { propertyName: "inputTooltip", first: true, predicate: MatTooltip, descendants: true }], ngImport: i0, template: "<form\n data-testid=\"advancedSearchForm\"\n (submit)=\"config.scope === 'local' ? doLocalAdvancedSearch() : doExternalAdvancedSearch()\"\n [formGroup]=\"advancedSearchForm\"\n class=\"ss-adv-search-wrapper\"\n>\n <h3>Advanced Search</h3>\n <!-- Queries -->\n @for (query of queries.controls; track $index; let queryIndex = $index) {\n <div class=\"ss-adv-search-row\" [formGroup]=\"query\">\n <!-- Boolean operator -->\n <!-- Add boolean for each row except for first -->\n @if (!$first) {\n <div class=\"ss-select-wrapper\">\n <select\n [id]=\"'boolean' + queryIndex\"\n [formControlName]=\"'boolean'\"\n [attr.data-testid]=\"'boolean' + queryIndex\"\n >\n @for (boolean of advancedSearchOptions.boolean; track boolean) {\n <option [ngValue]=\"boolean\">\n {{ boolean }}\n </option>\n }\n </select>\n </div>\n }\n <!-- Field -->\n <label [for]=\"'field' + queryIndex\" class=\"sr-only\">Field {{ queryIndex }}</label>\n <div class=\"ss-select-wrapper\">\n <select\n [id]=\"'field' + queryIndex\"\n [formControlName]=\"'field'\"\n [attr.data-testid]=\"'field' + queryIndex\"\n >\n @for (field of advancedSearchOptions.fields; track field) {\n <option [ngValue]=\"field\">\n {{ advancedSearchFieldMap[field] }}\n </option>\n }\n <optgroup\n [label]=\"(config.scope === 'external' ? 'Online' : 'Library') + ' Specific'\"\n >\n @for (\n field of config.scope === 'external'\n ? advancedSearchOptions.externalFields\n : advancedSearchOptions.localFields;\n track field\n ) {\n <option [ngValue]=\"field\">\n {{ advancedSearchFieldMap[field] }}\n </option>\n }\n </optgroup>\n </select>\n </div>\n <!-- Qualifiers are only available for local searches -->\n @if (config.scope === 'local') {\n <label [for]=\"'qualifier' + queryIndex\" class=\"sr-only\"\n >Match Criteria {{ queryIndex }}</label\n >\n <div class=\"ss-select-wrapper\">\n <select\n [id]=\"'qualifier' + queryIndex\"\n [formControlName]=\"'qualifier'\"\n [attr.data-testid]=\"'qualifier' + queryIndex\"\n >\n <!-- $any because a field can technically be local or external, though this block is scoped strictly to local fields -->\n @for (\n qualifier of $any(advancedSearchOptions.qualifiers)[\n query.controls.field.value\n ];\n track qualifier;\n let optionIndex = $index\n ) {\n <option\n [ngValue]=\"qualifier\"\n [attr.data-testid]=\"\n 'qualifier' + queryIndex + '-option' + optionIndex\n \"\n >\n {{ $any(advancedSearchQualifierMap)[qualifier] }}\n </option>\n }\n </select>\n </div>\n }\n <!-- Query -->\n <label [for]=\"'query' + queryIndex\" class=\"sr-only\">\n {{ getQueryLabel(queryIndex) }}\n </label>\n <div class=\"ss-query-input\">\n <input\n #searchInput\n [id]=\"'query' + queryIndex\"\n [formControlName]=\"'query'\"\n [attr.data-testid]=\"'query' + queryIndex\"\n required\n aria-required=\"true\"\n matTooltip=\"Fill out this field\"\n [matTooltipPosition]=\"'above'\"\n [matTooltipDisabled]=\"true\"\n [attr.aria-invalid]=\"isSubmitted && query.controls.query.invalid\"\n [attr.aria-describedby]=\"isSubmitted && query.controls.query.invalid ? ('invalidInputDesc' + queryIndex) : null\"\n />\n </div>\n @if (!$first) {\n <button\n class=\"ss-row-cancel\"\n type=\"button\"\n (click)=\"removeQuery(queryIndex)\"\n [attr.data-testid]=\"'cancelRow' + queryIndex\"\n >\n <span class=\"material-symbols-outlined ss-icon\"> cancel </span>\n </button>\n }\n </div>\n }\n <button\n type=\"button\"\n (click)=\"addQuery()\"\n id=\"addQueryBtn\"\n data-testid=\"addQuery\"\n [disabled]=\"queries.length > 11\"\n >\n <span class=\"material-symbols-outlined ss-icon\"> add </span>\n Add a row\n </button>\n <!-- OTHER OPTIONS -->\n <div class=\"ss-other-options\">\n <!-- LOCAL -->\n @if (config.scope === 'local') {\n <!-- Type -->\n <div data-testid=\"resourceType\">\n <h4>Resource Type</h4>\n <div class=\"ss-multi-select-wrapper\">\n <lib-multi-select\n elementId=\"resourceType\"\n [label]=\"'Resource Type'\"\n [allOptions]=\"advancedSearchOptions.types[config.institution]\"\n [selectedKeys]=\"types.value\"\n (selectedKeysChange)=\"types.setValue($event)\"\n ></lib-multi-select>\n </div>\n </div>\n <!-- Collection -->\n <div data-testid=\"collection\">\n <h4>Collection</h4>\n <div class=\"ss-multi-select-wrapper\">\n <lib-multi-select\n elementId=\"collection\"\n [label]=\"'Collection'\"\n [allOptions]=\"advancedSearchOptions.collections[config.institution]\"\n [selectedKeys]=\"collections.value\"\n (selectedKeysChange)=\"collections.setValue($event)\"\n ></lib-multi-select>\n </div>\n </div>\n <!-- Language -->\n <ng-container *ngTemplateOutlet=\"languageBlock\"></ng-container>\n <!-- Date -->\n <ng-container\n *ngTemplateOutlet=\"dateBlock; context: { header: 'Creation Date' }\"\n ></ng-container>\n }\n <!-- EXTERNAL -->\n @if (config.scope === 'external') {\n <div formGroupName=\"limitResults\" class=\"ss-checkbox-section\">\n <h4>For Fewer Results Try</h4>\n <!-- Peer reviewed -->\n <label class=\"ss-checkbox-label\" for=\"peerReviewed\">\n <input\n class=\"ss-hidden\"\n id=\"peerReviewed\"\n type=\"checkbox\"\n [formControlName]=\"'peerReviewed'\"\n data-testid=\"peerReviewed\"\n />\n <lib-checkbox inputId=\"peerReviewed\" [isChecked]=\"peerReviewed.value\" aria-hidden=\"true\"></lib-checkbox>\n <span class=\"ss-label-text\">Peer reviewed journal articles</span>\n </label>\n </div>\n <div formGroupName=\"expandResults\" class=\"ss-checkbox-section\">\n <h4>For More Results Try</h4>\n <!-- Apply equivalent subjects -->\n <label class=\"ss-checkbox-label\" for=\"applyEquivalentSubjects\">\n <input\n class=\"ss-hidden\"\n id=\"applyEquivalentSubjects\"\n type=\"checkbox\"\n [formControlName]=\"'applyEquivalentSubjects'\"\n data-testid=\"applyEquivalentSubjects\"\n />\n <lib-checkbox inputId=\"applyEquivalentSubjects\" [isChecked]=\"applyEquivalentSubjects.value\" aria-hidden=\"true\"></lib-checkbox>\n <span class=\"ss-label-text\">Apply equivalent subjects</span>\n </label>\n <!-- Full text -->\n <label class=\"ss-checkbox-label\" for=\"fullText\">\n <input\n class=\"ss-hidden\"\n id=\"fullText\"\n type=\"checkbox\"\n [formControlName]=\"'fullText'\"\n data-testid=\"fullText\"\n />\n <lib-checkbox inputId=\"fullText\" [isChecked]=\"fullText.value\" aria-hidden=\"true\"></lib-checkbox>\n <span class=\"ss-label-text\"\n >Include results the library doesn't have access to</span\n >\n </label>\n </div>\n <!-- Date -->\n <ng-container\n *ngTemplateOutlet=\"dateBlock; context: { header: 'Date Published' }\"\n ></ng-container>\n <!-- Language -->\n <ng-container *ngTemplateOutlet=\"languageBlock\"></ng-container>\n }\n </div>\n <div id=\"advSearchFooter\">\n <a [href]=\"'https://lib.byu.edu/browse/' + config.institution\">Alphabetic Browse</a>\n <button\n class=\"pill-btn--components\"\n [ngClass]=\"{\n ensign: config.institution === 'ensign',\n }\"\n type=\"submit\"\n data-testid=\"advSearchSubmitButton\"\n >\n Search\n </button>\n </div>\n</form>\n\n<ng-template #languageBlock>\n <div>\n <h4>Language</h4>\n <lib-multi-select\n elementId=\"language\"\n [label]=\"'language'\"\n [allOptions]=\"advancedSearchOptions.languages\"\n [selectedKeys]=\"languages.value\"\n (selectedKeysChange)=\"languages.setValue($any($event))\"\n ></lib-multi-select>\n </div>\n</ng-template>\n<ng-template #dateBlock let-header=\"header\">\n <div id=\"dateOptions\" class=\"external\">\n <h4>{{ header }}</h4>\n <lib-date-range\n [from]=\"from.value\"\n [to]=\"to.value\"\n (fromChange)=\"from.setValue($event)\"\n (toChange)=\"to.setValue($event)\"\n ></lib-date-range>\n </div>\n</ng-template>\n", styles: ["select,textarea,input{appearance:none;font-family:inherit;padding:.38em;border:solid 1px #707070;border-radius:4px;font-size:1em;background-color:#fff}.ss-select-wrapper{position:relative}.ss-select-wrapper select{cursor:pointer;padding-right:2em}.ss-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}button.ensign{background-color:#2b6042!important;border-color:#2a6142}button.ensign:hover{background-color:#357551!important}html{border:0;margin:0;padding:0;-webkit-text-size-adjust:100%}body{margin:0;padding:0}*,*:before,*:after{box-sizing:border-box}:root{--color-navy: #00245d;--color-royal: #0047ba;--color-white: #ffffff;--color-blue-500: #00245d;--color-blue-400: #003995;--color-blue-300: #0047ba;--color-blue-200: #336cc8;--color-blue-150: #ccdaf1;--color-blue-100: #e5edf8;--color-gray-500: #141414;--color-gray-400: #676767;--color-gray-300: #8f8f8f;--color-gray-200: #d0d0d0;--color-gray-100: #e7e7e7;--color-gray-50: #f9f9f9;--color-gray-brand-400: #676767;--color-green-500: #1d562e;--color-green-400: #2e8545;--color-green-300: #3ba35a;--color-green-200: #9dd1ac;--color-green-100: #ebf6ee;--color-teal-500: #26485f;--color-teal-400: #3e7295;--color-teal-300: #457fa6;--color-teal-200: #a2bfd3;--color-teal-100: #ecf2f6;--color-red-500: #702121;--color-red-400: #b33837;--color-red-300: #c73e3d;--color-red-200: #e39e9e;--color-red-100: #f9ecec;--color-yellow-500: #635f04;--color-yellow-400: #928c30;--color-yellow-300: #d1c844;--color-yellow-200: #e8e3a1;--color-yellow-100: #faf9ec;--color-purple-focus: #b967c7;--text-heading: #002e5d;--text-secondary-heading: #737373;--text-body: #141414;--text-disabled: #676767;--text-link: #336cc8;--text-on-action: #ffffff;--text-success: #1d562e;--text-info: #26485f;--text-error: #702121;--text-warning: #635f04;--surface-success: #ebf6ee;--surface-info: #ecf2f6;--surface-error: #f9ecec;--surface-warning: #faf9ec;--focus-ring-color: #b967c7}@font-face{font-family:Source Sans Pro;font-style:normal;font-weight:300;src:url(https://media.lib.byu.edu/web-assets/fonts/sourcesanspro/1.0.0/SourceSansPro-Light.ttf) format(\"truetype\");font-display:swap}@font-face{font-family:Source Sans Pro;font-style:normal;font-weight:400;src:url(https://media.lib.byu.edu/web-assets/fonts/sourcesanspro/1.0.0/SourceSansPro-Regular.ttf) format(\"truetype\");font-display:swap}@font-face{font-family:Source Sans Pro;font-style:normal;font-weight:600;src:url(https://media.lib.byu.edu/web-assets/fonts/sourcesanspro/1.0.0/SourceSansPro-Semibold.ttf) format(\"truetype\");font-display:swap}@font-face{font-family:Source Sans Pro;font-style:normal;font-weight:700;src:url(https://media.lib.byu.edu/web-assets/fonts/sourcesanspro/1.0.0/SourceSansPro-Bold.ttf) format(\"truetype\");font-display:swap}@font-face{font-family:Source Sans Pro;font-style:italic;font-weight:300;src:url(https://media.lib.byu.edu/web-assets/fonts/sourcesanspro/1.0.0/SourceSansPro-LightItalic.ttf) format(\"truetype\");font-display:swap}@font-face{font-family:Source Sans Pro;font-style:italic;font-weight:400;src:url(https://media.lib.byu.edu/web-assets/fonts/sourcesanspro/1.0.0/SourceSansPro-Italic.ttf) format(\"truetype\");font-display:swap}@font-face{font-family:Source Sans Pro;font-style:italic;font-weight:600;src:url(https://media.lib.byu.edu/web-assets/fonts/sourcesanspro/1.0.0/SourceSansPro-SemiboldItalic.ttf) format(\"truetype\");font-display:swap}@font-face{font-family:Source Sans Pro;font-style:italic;font-weight:700;src:url(https://media.lib.byu.edu/web-assets/fonts/sourcesanspro/1.0.0/SourceSansPro-BoldItalic.ttf) format(\"truetype\");font-display:swap}h1,h2,h3,h4,h5,h6,span:not(.material-symbols-outlined),a,p{font-family:Source Sans Pro}h1{font-weight:300;font-style:normal;color:var(--text-heading)}h2{font-weight:400;font-style:normal;color:var(--text-heading)}h3{font-weight:700;font-style:normal;color:var(--text-heading)}h4,h5,h6{font-weight:600;font-style:normal;color:var(--text-secondary-heading)}.hbll-default-body{font-weight:400;font-style:normal;max-width:35rem;min-width:22.25rem;color:var(--text-body)}.hbll-caption{font-weight:400;font-style:normal;max-width:25.25rem;min-width:17.5rem;color:var(--text-body)}.hbll-large{font-weight:400;font-style:normal;max-width:41.25rem;min-width:26.5rem;color:var(--text-body)}a{color:var(--text-link);text-decoration:underline}.hbll-emphasis{font-weight:600}h1{font-size:2rem;line-height:2.5rem}h2{font-size:1.75rem;line-height:2.25rem}h3,h4{font-size:1.5rem;line-height:2rem}h5,h6{font-size:1.25rem;line-height:1.75rem}.hbll-default-body{font-size:.875rem;line-height:1.25rem}.hbll-caption{font-size:.75rem;line-height:1rem}.hbll-large{font-size:1rem;line-height:1.5rem}@media screen and (min-width: 52.125em){h1{font-size:3rem;line-height:3.5rem}h2{font-size:2.5rem;line-height:3rem}h3{font-size:2rem;line-height:3rem}h4{font-size:1.75rem;line-height:2.5rem}h5{font-size:1.5rem;line-height:2rem}h6{font-size:1.25rem;line-height:1.75rem}.hbll-default-body{font-size:1rem;line-height:1.5rem}.hbll-caption{font-size:.75rem;line-height:1rem}.hbll-large{font-size:1.25rem;line-height:1.75rem}}@media screen and (min-width: 90em){h1{font-size:3.75rem;line-height:4.25rem}h2{font-size:3rem;line-height:3.5rem}h3{font-size:2.5rem;line-height:3rem}h4{font-size:2rem;line-height:2.5rem}h5{font-size:1.5rem;line-height:2rem}h6{font-size:1.25rem;line-height:1.75rem}.hbll-default-body{font-size:1rem;line-height:1.5rem}.hbll-caption{font-size:.75rem;line-height:1rem}.hbll-large{font-size:1.25rem;line-height:1.75rem}}:focus-visible{outline:.125rem solid var(--focus-ring-color);outline-offset:.125rem}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);border:0}.sr-only.sr-only-focusable:focus,.sr-only.sr-only-focusable:focus-within,.sr-only.sr-only-focusable:active{position:static;width:auto;height:auto;margin:0;overflow:visible;clip:auto}a,button{border:none;background:none;font-family:inherit;padding:0;margin:0;font-size:inherit;color:#0047ba;text-decoration:none;cursor:pointer}a:hover,button:hover{color:#003995}.pill-btn--components{border-radius:100em;padding:.4em 1.3em}:host{box-sizing:border-box}:host *{box-sizing:inherit}.ss-select-wrapper{margin-right:.3em}.ss-row-cancel{color:#aaa;margin-left:.4em;margin-top:.4em}.ss-row-cancel:hover{color:#666}.ss-row-cancel .ss-icon{font-size:1em}.ss-hidden{display:none}#addQueryBtn{display:flex;align-items:center}#addQueryBtn:disabled{color:#999;pointer-events:none}#addQueryBtn .icon{font-size:1em}.ss-adv-search-wrapper{width:100%}h3{font-size:1.13em;font-weight:300;margin-bottom:.7em;margin-top:0}h4{font:inherit;margin-bottom:.75em;font-weight:600}#dateOptions h4{margin-bottom:.8em}.ss-adv-search-row{display:flex;flex-wrap:wrap;width:100%;margin-bottom:.6em}.ss-query-input{display:inline-block;width:100%;margin-top:.25rem}.ss-query-input input{width:100%}.ss-other-options{display:grid;grid-template-columns:repeat(1,1fr);gap:.6em 1.6em;grid-auto-rows:minmax(1em,auto);margin-top:1.4em}.ss-other-options label{margin-right:.625rem}.ss-checkbox-label{display:inline-flex;align-items:flex-start;cursor:pointer}.ss-checkbox-label:not(:last-of-type){margin-bottom:.75em}.ss-checkbox-label .ss-label-text{margin-top:-.1em;margin-left:.45em}.ss-checkbox-section{margin-bottom:.8em}#advSearchFooter{margin-bottom:.5em;display:flex;justify-content:space-between;align-items:center;font-size:1.2em}#advSearchFooter a{font-size:.8em}@media screen and (min-width: 615px){.ss-adv-search-row{flex-wrap:nowrap}.ss-other-options{grid-template-columns:repeat(2,1fr)}.ss-query-input{margin-top:0}#dateOptions .external{grid-column:span 2}}\n"], dependencies: [{ 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: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$1.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i1$1.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i1$1.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: i1$1.CheckboxControlValueAccessor, selector: "input[type=checkbox][formControlName],input[type=checkbox][formControl],input[type=checkbox][ngModel]" }, { kind: "directive", type: i1$1.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$1.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i1$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: i1$1.FormGroupName, selector: "[formGroupName]", inputs: ["formGroupName"] }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "directive", type: i1$2.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: HbllMultiSelectComponent, selector: "lib-multi-select", inputs: ["elementId", "allOptions", "label", "selectedKeys"], outputs: ["selectedKeysChange"] }, { kind: "component", type: CheckboxComponent, selector: "lib-checkbox", inputs: ["isChecked", "isIndeterminate", "isSmall", "disabled", "isError", "inputId"], outputs: ["checkedChange"] }, { kind: "component", type: DateRangeComponent, selector: "lib-date-range", inputs: ["from", "to"], outputs: ["validDateChange", "fromChange", "toChange"] }] }); }
|
|
2758
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.15", type: AdvancedSearchComponent, isStandalone: true, selector: "lib-ss-advanced-search", inputs: { config: "config" }, outputs: { advancedSearch: "advancedSearch" }, viewQueries: [{ propertyName: "searchInput", first: true, predicate: ["searchInput"], descendants: true }, { propertyName: "inputTooltip", first: true, predicate: MatTooltip, descendants: true }], ngImport: i0, template: "<form\n data-testid=\"advancedSearchForm\"\n (submit)=\"config.scope === 'local' ? doLocalAdvancedSearch() : doExternalAdvancedSearch()\"\n [formGroup]=\"advancedSearchForm\"\n class=\"ss-adv-search-wrapper\"\n>\n <h3>Advanced Search</h3>\n <!-- Queries -->\n @for (query of queries.controls; track $index; let queryIndex = $index) {\n <div class=\"ss-adv-search-row\" [formGroup]=\"query\">\n <!-- Boolean operator -->\n <!-- Add boolean for each row except for first -->\n @if (!$first) {\n <div class=\"ss-select-wrapper\">\n <select\n [id]=\"'boolean' + queryIndex\"\n [formControlName]=\"'boolean'\"\n [attr.data-testid]=\"'boolean' + queryIndex\"\n >\n @for (boolean of advancedSearchOptions.boolean; track boolean) {\n <option [ngValue]=\"boolean\">\n {{ boolean }}\n </option>\n }\n </select>\n </div>\n }\n <!-- Field -->\n <label [for]=\"'field' + queryIndex\" class=\"sr-only\">Field {{ queryIndex }}</label>\n <div class=\"ss-select-wrapper\">\n <select\n [id]=\"'field' + queryIndex\"\n [formControlName]=\"'field'\"\n [attr.data-testid]=\"'field' + queryIndex\"\n >\n @for (field of advancedSearchOptions.fields; track field) {\n <option [ngValue]=\"field\">\n {{ advancedSearchFieldMap[field] }}\n </option>\n }\n <optgroup\n [label]=\"(config.scope === 'external' ? 'Online' : 'Library') + ' Specific'\"\n >\n @for (\n field of config.scope === 'external'\n ? advancedSearchOptions.externalFields\n : advancedSearchOptions.localFields;\n track field\n ) {\n <option [ngValue]=\"field\">\n {{ advancedSearchFieldMap[field] }}\n </option>\n }\n </optgroup>\n </select>\n </div>\n <!-- Qualifiers are only available for local searches -->\n @if (config.scope === 'local') {\n <label [for]=\"'qualifier' + queryIndex\" class=\"sr-only\"\n >Match Criteria {{ queryIndex }}</label\n >\n <div class=\"ss-select-wrapper\">\n <select\n [id]=\"'qualifier' + queryIndex\"\n [formControlName]=\"'qualifier'\"\n [attr.data-testid]=\"'qualifier' + queryIndex\"\n >\n <!-- $any because a field can technically be local or external, though this block is scoped strictly to local fields -->\n @for (\n qualifier of $any(advancedSearchOptions.qualifiers)[\n query.controls.field.value\n ];\n track qualifier;\n let optionIndex = $index\n ) {\n <option\n [ngValue]=\"qualifier\"\n [attr.data-testid]=\"\n 'qualifier' + queryIndex + '-option' + optionIndex\n \"\n >\n {{ $any(advancedSearchQualifierMap)[qualifier] }}\n </option>\n }\n </select>\n </div>\n }\n <!-- Query -->\n <label [for]=\"'query' + queryIndex\" class=\"sr-only\">\n {{ getQueryLabel(queryIndex) }}\n </label>\n <div class=\"ss-query-input\">\n <input\n #searchInput\n [id]=\"'query' + queryIndex\"\n [formControlName]=\"'query'\"\n [attr.data-testid]=\"'query' + queryIndex\"\n required\n aria-required=\"true\"\n matTooltip=\"Fill out this field\"\n [matTooltipPosition]=\"'above'\"\n [matTooltipDisabled]=\"true\"\n [attr.aria-invalid]=\"isSubmitted && query.controls.query.invalid\"\n [attr.aria-describedby]=\"isSubmitted && query.controls.query.invalid ? ('invalidInputDesc' + queryIndex) : null\"\n />\n </div>\n @if (!$first) {\n <button\n class=\"ss-row-cancel\"\n type=\"button\"\n (click)=\"removeQuery(queryIndex)\"\n [attr.data-testid]=\"'cancelRow' + queryIndex\"\n >\n <span class=\"material-symbols-outlined ss-icon\"> cancel </span>\n </button>\n }\n </div>\n }\n <button\n type=\"button\"\n (click)=\"addQuery()\"\n id=\"addQueryBtn\"\n data-testid=\"addQuery\"\n [disabled]=\"queries.length > 11\"\n >\n <span class=\"material-symbols-outlined ss-icon\"> add </span>\n Add a row\n </button>\n <!-- OTHER OPTIONS -->\n <div class=\"ss-other-options\">\n <!-- LOCAL -->\n @if (config.scope === 'local') {\n <!-- Type -->\n <div data-testid=\"resourceType\">\n <h4>Resource Type</h4>\n <div class=\"ss-multi-select-wrapper\">\n <lib-multi-select\n elementId=\"resourceType\"\n [label]=\"'Resource Type'\"\n [allOptions]=\"advancedSearchOptions.types[config.institution]\"\n [selectedKeys]=\"types.value\"\n (selectedKeysChange)=\"types.setValue($event)\"\n ></lib-multi-select>\n </div>\n </div>\n <!-- Collection -->\n <div data-testid=\"collection\">\n <h4>Collection</h4>\n <div class=\"ss-multi-select-wrapper\">\n <lib-multi-select\n elementId=\"collection\"\n [label]=\"'Collection'\"\n [allOptions]=\"advancedSearchOptions.collections[config.institution]\"\n [selectedKeys]=\"collections.value\"\n (selectedKeysChange)=\"collections.setValue($event)\"\n ></lib-multi-select>\n </div>\n </div>\n <!-- Language -->\n <ng-container *ngTemplateOutlet=\"languageBlock\"></ng-container>\n <!-- Date -->\n <ng-container\n *ngTemplateOutlet=\"dateBlock; context: { header: 'Creation Date' }\"\n ></ng-container>\n }\n <!-- EXTERNAL -->\n @if (config.scope === 'external') {\n <div formGroupName=\"limitResults\" class=\"ss-checkbox-section\">\n <h4>For Fewer Results Try</h4>\n <!-- Peer reviewed -->\n <label class=\"ss-checkbox-label\" for=\"peerReviewed\">\n <input\n class=\"ss-hidden\"\n id=\"peerReviewed\"\n type=\"checkbox\"\n [formControlName]=\"'peerReviewed'\"\n data-testid=\"peerReviewed\"\n />\n <lib-checkbox inputId=\"peerReviewed\" [isChecked]=\"peerReviewed.value\" aria-hidden=\"true\"></lib-checkbox>\n <span class=\"ss-label-text\">Peer reviewed journal articles</span>\n </label>\n </div>\n <div formGroupName=\"expandResults\" class=\"ss-checkbox-section\">\n <h4>For More Results Try</h4>\n <!-- Apply equivalent subjects -->\n <label class=\"ss-checkbox-label\" for=\"applyEquivalentSubjects\">\n <input\n class=\"ss-hidden\"\n id=\"applyEquivalentSubjects\"\n type=\"checkbox\"\n [formControlName]=\"'applyEquivalentSubjects'\"\n data-testid=\"applyEquivalentSubjects\"\n />\n <lib-checkbox inputId=\"applyEquivalentSubjects\" [isChecked]=\"applyEquivalentSubjects.value\" aria-hidden=\"true\"></lib-checkbox>\n <span class=\"ss-label-text\">Apply equivalent subjects</span>\n </label>\n <!-- Full text -->\n <label class=\"ss-checkbox-label\" for=\"fullText\">\n <input\n class=\"ss-hidden\"\n id=\"fullText\"\n type=\"checkbox\"\n [formControlName]=\"'fullText'\"\n data-testid=\"fullText\"\n />\n <lib-checkbox inputId=\"fullText\" [isChecked]=\"fullText.value\" aria-hidden=\"true\"></lib-checkbox>\n <span class=\"ss-label-text\"\n >Include results the library doesn't have access to</span\n >\n </label>\n </div>\n <!-- Date -->\n <ng-container\n *ngTemplateOutlet=\"dateBlock; context: { header: 'Date Published' }\"\n ></ng-container>\n <!-- Language -->\n <ng-container *ngTemplateOutlet=\"languageBlock\"></ng-container>\n }\n </div>\n <div id=\"advSearchFooter\">\n <a [href]=\"'https://lib.byu.edu/browse/' + config.institution\">Alphabetic Browse</a>\n <button\n class=\"pill-btn--components\"\n [ngClass]=\"{\n ensign: config.institution === 'ensign',\n }\"\n type=\"submit\"\n data-testid=\"advSearchSubmitButton\"\n >\n Search\n </button>\n </div>\n</form>\n\n<ng-template #languageBlock>\n <div>\n <h4>Language</h4>\n <lib-multi-select\n elementId=\"language\"\n [label]=\"'language'\"\n [allOptions]=\"advancedSearchOptions.languages\"\n [selectedKeys]=\"languages.value\"\n (selectedKeysChange)=\"languages.setValue($any($event))\"\n ></lib-multi-select>\n </div>\n</ng-template>\n<ng-template #dateBlock let-header=\"header\">\n <div id=\"dateOptions\" class=\"external\">\n <h4>{{ header }}</h4>\n <lib-date-range\n [from]=\"from.value\"\n [to]=\"to.value\"\n (fromChange)=\"from.setValue($event)\"\n (toChange)=\"to.setValue($event)\"\n ></lib-date-range>\n </div>\n</ng-template>\n", styles: ["select,textarea,input{appearance:none;font-family:inherit;padding:.38em;border:solid 1px #707070;border-radius:4px;font-size:1em;background-color:#fff}.ss-select-wrapper{position:relative}.ss-select-wrapper select{cursor:pointer;padding-right:2em}.ss-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:#457fa6;font-size:1em;transition:all .15s;color:#fff;cursor:pointer;font-weight:600;text-align:center}.pill-btn--components:disabled{color:#676767;background-color:#e7e7e7;pointer-events:none}.pill-btn--components:hover{background-color:#a2bfd3;color:#fff}.destructive.pill-btn--components{background-color:#b33837}.destructive.pill-btn--components:hover{background-color:#c73e3d}button.ensign{background-color:#2b6042!important;border-color:#2a6142}button.ensign:hover{background-color:#357551!important}html{border:0;margin:0;padding:0;-webkit-text-size-adjust:100%}body{margin:0;padding:0}*,*:before,*:after{box-sizing:border-box}:root{--color-navy: #00245d;--color-royal: #0047ba;--color-white: #ffffff;--color-blue-500: #00245d;--color-blue-400: #003995;--color-blue-300: #0047ba;--color-blue-200: #336cc8;--color-blue-150: #ccdaf1;--color-blue-100: #e5edf8;--color-gray-500: #141414;--color-gray-400: #676767;--color-gray-300: #8f8f8f;--color-gray-200: #d0d0d0;--color-gray-100: #e7e7e7;--color-gray-50: #f9f9f9;--color-gray-brand-400: #676767;--color-green-500: #1d562e;--color-green-400: #2e8545;--color-green-300: #3ba35a;--color-green-200: #9dd1ac;--color-green-100: #ebf6ee;--color-teal-500: #26485f;--color-teal-400: #3e7295;--color-teal-300: #457fa6;--color-teal-200: #a2bfd3;--color-teal-100: #ecf2f6;--color-red-500: #702121;--color-red-400: #b33837;--color-red-300: #c73e3d;--color-red-200: #e39e9e;--color-red-100: #f9ecec;--color-yellow-500: #635f04;--color-yellow-400: #928c30;--color-yellow-300: #d1c844;--color-yellow-200: #e8e3a1;--color-yellow-100: #faf9ec;--color-purple-focus: #b967c7;--text-heading: #002e5d;--text-secondary-heading: #737373;--text-body: #141414;--text-disabled: #676767;--text-link: #336cc8;--text-on-action: #ffffff;--text-success: #1d562e;--text-info: #26485f;--text-error: #702121;--text-warning: #635f04;--surface-success: #ebf6ee;--surface-info: #ecf2f6;--surface-error: #f9ecec;--surface-warning: #faf9ec;--focus-ring-color: #b967c7}@font-face{font-family:Source Sans Pro;font-style:normal;font-weight:300;src:url(https://media.lib.byu.edu/web-assets/fonts/sourcesanspro/1.0.0/SourceSansPro-Light.ttf) format(\"truetype\");font-display:swap}@font-face{font-family:Source Sans Pro;font-style:normal;font-weight:400;src:url(https://media.lib.byu.edu/web-assets/fonts/sourcesanspro/1.0.0/SourceSansPro-Regular.ttf) format(\"truetype\");font-display:swap}@font-face{font-family:Source Sans Pro;font-style:normal;font-weight:600;src:url(https://media.lib.byu.edu/web-assets/fonts/sourcesanspro/1.0.0/SourceSansPro-Semibold.ttf) format(\"truetype\");font-display:swap}@font-face{font-family:Source Sans Pro;font-style:normal;font-weight:700;src:url(https://media.lib.byu.edu/web-assets/fonts/sourcesanspro/1.0.0/SourceSansPro-Bold.ttf) format(\"truetype\");font-display:swap}@font-face{font-family:Source Sans Pro;font-style:italic;font-weight:300;src:url(https://media.lib.byu.edu/web-assets/fonts/sourcesanspro/1.0.0/SourceSansPro-LightItalic.ttf) format(\"truetype\");font-display:swap}@font-face{font-family:Source Sans Pro;font-style:italic;font-weight:400;src:url(https://media.lib.byu.edu/web-assets/fonts/sourcesanspro/1.0.0/SourceSansPro-Italic.ttf) format(\"truetype\");font-display:swap}@font-face{font-family:Source Sans Pro;font-style:italic;font-weight:600;src:url(https://media.lib.byu.edu/web-assets/fonts/sourcesanspro/1.0.0/SourceSansPro-SemiboldItalic.ttf) format(\"truetype\");font-display:swap}@font-face{font-family:Source Sans Pro;font-style:italic;font-weight:700;src:url(https://media.lib.byu.edu/web-assets/fonts/sourcesanspro/1.0.0/SourceSansPro-BoldItalic.ttf) format(\"truetype\");font-display:swap}h1,h2,h3,h4,h5,h6,span:not(.material-symbols-outlined),a,p{font-family:Source Sans Pro}h1{font-weight:300;font-style:normal;color:var(--text-heading)}h2{font-weight:400;font-style:normal;color:var(--text-heading)}h3{font-weight:700;font-style:normal;color:var(--text-heading)}h4,h5,h6{font-weight:600;font-style:normal;color:var(--text-secondary-heading)}.hbll-default-body{font-weight:400;font-style:normal;max-width:35rem;min-width:22.25rem;color:var(--text-body)}.hbll-caption{font-weight:400;font-style:normal;max-width:25.25rem;min-width:17.5rem;color:var(--text-body)}.hbll-large{font-weight:400;font-style:normal;max-width:41.25rem;min-width:26.5rem;color:var(--text-body)}a{color:var(--text-link);text-decoration:underline}.hbll-emphasis{font-weight:600}h1{font-size:2rem;line-height:2.5rem}h2{font-size:1.75rem;line-height:2.25rem}h3,h4{font-size:1.5rem;line-height:2rem}h5,h6{font-size:1.25rem;line-height:1.75rem}.hbll-default-body{font-size:.875rem;line-height:1.25rem}.hbll-caption{font-size:.75rem;line-height:1rem}.hbll-large{font-size:1rem;line-height:1.5rem}@media screen and (min-width: 52.125em){h1{font-size:3rem;line-height:3.5rem}h2{font-size:2.5rem;line-height:3rem}h3{font-size:2rem;line-height:3rem}h4{font-size:1.75rem;line-height:2.5rem}h5{font-size:1.5rem;line-height:2rem}h6{font-size:1.25rem;line-height:1.75rem}.hbll-default-body{font-size:1rem;line-height:1.5rem}.hbll-caption{font-size:.75rem;line-height:1rem}.hbll-large{font-size:1.25rem;line-height:1.75rem}}@media screen and (min-width: 90em){h1{font-size:3.75rem;line-height:4.25rem}h2{font-size:3rem;line-height:3.5rem}h3{font-size:2.5rem;line-height:3rem}h4{font-size:2rem;line-height:2.5rem}h5{font-size:1.5rem;line-height:2rem}h6{font-size:1.25rem;line-height:1.75rem}.hbll-default-body{font-size:1rem;line-height:1.5rem}.hbll-caption{font-size:.75rem;line-height:1rem}.hbll-large{font-size:1.25rem;line-height:1.75rem}}:focus-visible{outline:.125rem solid var(--focus-ring-color);outline-offset:.125rem}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);border:0}.sr-only.sr-only-focusable:focus,.sr-only.sr-only-focusable:focus-within,.sr-only.sr-only-focusable:active{position:static;width:auto;height:auto;margin:0;overflow:visible;clip:auto}a,button{border:none;background:none;font-family:inherit;padding:0;margin:0;font-size:inherit;color:#0047ba;text-decoration:none;cursor:pointer}a:hover,button:hover{color:#003995}.pill-btn--components{border-radius:100em;padding:.4em 1.3em}:host{box-sizing:border-box}:host *{box-sizing:inherit}.ss-select-wrapper{margin-right:.3em}.ss-row-cancel{color:#aaa;margin-left:.4em;margin-top:.4em}.ss-row-cancel:hover{color:#666}.ss-row-cancel .ss-icon{font-size:1em}.ss-hidden{display:none}#addQueryBtn{display:flex;align-items:center}#addQueryBtn:disabled{color:#999;pointer-events:none}#addQueryBtn .icon{font-size:1em}.ss-adv-search-wrapper{width:100%}h3{font-size:1.13em;font-weight:300;margin-bottom:.7em;margin-top:0}h4{font:inherit;margin-bottom:.75em;font-weight:600}#dateOptions h4{margin-bottom:.8em}.ss-adv-search-row{display:flex;flex-wrap:wrap;width:100%;margin-bottom:.6em}.ss-query-input{display:inline-block;width:100%;margin-top:.25rem}.ss-query-input input{width:100%}.ss-other-options{display:grid;grid-template-columns:repeat(1,1fr);gap:.6em 1.6em;grid-auto-rows:minmax(1em,auto);margin-top:1.4em}.ss-other-options label{margin-right:.625rem}.ss-checkbox-label{display:inline-flex;align-items:flex-start;cursor:pointer}.ss-checkbox-label:not(:last-of-type){margin-bottom:.75em}.ss-checkbox-label .ss-label-text{margin-top:-.1em;margin-left:.45em}.ss-checkbox-section{margin-bottom:.8em}#advSearchFooter{margin-bottom:.5em;display:flex;justify-content:space-between;align-items:center;font-size:1.2em}#advSearchFooter a{font-size:.8em}@media screen and (min-width: 615px){.ss-adv-search-row{flex-wrap:nowrap}.ss-other-options{grid-template-columns:repeat(2,1fr)}.ss-query-input{margin-top:0}#dateOptions .external{grid-column:span 2}}\n"], dependencies: [{ 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: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$1.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i1$1.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i1$1.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: i1$1.CheckboxControlValueAccessor, selector: "input[type=checkbox][formControlName],input[type=checkbox][formControl],input[type=checkbox][ngModel]" }, { kind: "directive", type: i1$1.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$1.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i1$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: i1$1.FormGroupName, selector: "[formGroupName]", inputs: ["formGroupName"] }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "directive", type: i1$2.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: HbllMultiSelectComponent, selector: "lib-multi-select", inputs: ["elementId", "allOptions", "label", "selectedKeys"], outputs: ["selectedKeysChange"] }, { kind: "component", type: CheckboxComponent, selector: "lib-checkbox", inputs: ["isChecked", "isIndeterminate", "isSmall", "disabled", "isError", "inputId"], outputs: ["checkedChange"] }, { kind: "component", type: DateRangeComponent, selector: "lib-date-range", inputs: ["from", "to"], outputs: ["validDateChange", "fromChange", "toChange"] }] }); }
|
|
2746
2759
|
}
|
|
2747
2760
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: AdvancedSearchComponent, decorators: [{
|
|
2748
2761
|
type: Component,
|
|
@@ -2754,7 +2767,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImpo
|
|
|
2754
2767
|
HbllMultiSelectComponent,
|
|
2755
2768
|
CheckboxComponent,
|
|
2756
2769
|
DateRangeComponent,
|
|
2757
|
-
], template: "<form\n data-testid=\"advancedSearchForm\"\n (submit)=\"config.scope === 'local' ? doLocalAdvancedSearch() : doExternalAdvancedSearch()\"\n [formGroup]=\"advancedSearchForm\"\n class=\"ss-adv-search-wrapper\"\n>\n <h3>Advanced Search</h3>\n <!-- Queries -->\n @for (query of queries.controls; track $index; let queryIndex = $index) {\n <div class=\"ss-adv-search-row\" [formGroup]=\"query\">\n <!-- Boolean operator -->\n <!-- Add boolean for each row except for first -->\n @if (!$first) {\n <div class=\"ss-select-wrapper\">\n <select\n [id]=\"'boolean' + queryIndex\"\n [formControlName]=\"'boolean'\"\n [attr.data-testid]=\"'boolean' + queryIndex\"\n >\n @for (boolean of advancedSearchOptions.boolean; track boolean) {\n <option [ngValue]=\"boolean\">\n {{ boolean }}\n </option>\n }\n </select>\n </div>\n }\n <!-- Field -->\n <label [for]=\"'field' + queryIndex\" class=\"sr-only\">Field {{ queryIndex }}</label>\n <div class=\"ss-select-wrapper\">\n <select\n [id]=\"'field' + queryIndex\"\n [formControlName]=\"'field'\"\n [attr.data-testid]=\"'field' + queryIndex\"\n >\n @for (field of advancedSearchOptions.fields; track field) {\n <option [ngValue]=\"field\">\n {{ advancedSearchFieldMap[field] }}\n </option>\n }\n <optgroup\n [label]=\"(config.scope === 'external' ? 'Online' : 'Library') + ' Specific'\"\n >\n @for (\n field of config.scope === 'external'\n ? advancedSearchOptions.externalFields\n : advancedSearchOptions.localFields;\n track field\n ) {\n <option [ngValue]=\"field\">\n {{ advancedSearchFieldMap[field] }}\n </option>\n }\n </optgroup>\n </select>\n </div>\n <!-- Qualifiers are only available for local searches -->\n @if (config.scope === 'local') {\n <label [for]=\"'qualifier' + queryIndex\" class=\"sr-only\"\n >Match Criteria {{ queryIndex }}</label\n >\n <div class=\"ss-select-wrapper\">\n <select\n [id]=\"'qualifier' + queryIndex\"\n [formControlName]=\"'qualifier'\"\n [attr.data-testid]=\"'qualifier' + queryIndex\"\n >\n <!-- $any because a field can technically be local or external, though this block is scoped strictly to local fields -->\n @for (\n qualifier of $any(advancedSearchOptions.qualifiers)[\n query.controls.field.value\n ];\n track qualifier;\n let optionIndex = $index\n ) {\n <option\n [ngValue]=\"qualifier\"\n [attr.data-testid]=\"\n 'qualifier' + queryIndex + '-option' + optionIndex\n \"\n >\n {{ $any(advancedSearchQualifierMap)[qualifier] }}\n </option>\n }\n </select>\n </div>\n }\n <!-- Query -->\n <label [for]=\"'query' + queryIndex\" class=\"sr-only\">\n {{ getQueryLabel(queryIndex) }}\n </label>\n <div class=\"ss-query-input\">\n <input\n #searchInput\n [id]=\"'query' + queryIndex\"\n [formControlName]=\"'query'\"\n [attr.data-testid]=\"'query' + queryIndex\"\n required\n aria-required=\"true\"\n matTooltip=\"Fill out this field\"\n [matTooltipPosition]=\"'above'\"\n [matTooltipDisabled]=\"true\"\n [attr.aria-invalid]=\"isSubmitted && query.controls.query.invalid\"\n [attr.aria-describedby]=\"isSubmitted && query.controls.query.invalid ? ('invalidInputDesc' + queryIndex) : null\"\n />\n </div>\n @if (!$first) {\n <button\n class=\"ss-row-cancel\"\n type=\"button\"\n (click)=\"removeQuery(queryIndex)\"\n [attr.data-testid]=\"'cancelRow' + queryIndex\"\n >\n <span class=\"material-symbols-outlined ss-icon\"> cancel </span>\n </button>\n }\n </div>\n }\n <button\n type=\"button\"\n (click)=\"addQuery()\"\n id=\"addQueryBtn\"\n data-testid=\"addQuery\"\n [disabled]=\"queries.length > 11\"\n >\n <span class=\"material-symbols-outlined ss-icon\"> add </span>\n Add a row\n </button>\n <!-- OTHER OPTIONS -->\n <div class=\"ss-other-options\">\n <!-- LOCAL -->\n @if (config.scope === 'local') {\n <!-- Type -->\n <div data-testid=\"resourceType\">\n <h4>Resource Type</h4>\n <div class=\"ss-multi-select-wrapper\">\n <lib-multi-select\n elementId=\"resourceType\"\n [label]=\"'Resource Type'\"\n [allOptions]=\"advancedSearchOptions.types[config.institution]\"\n [selectedKeys]=\"types.value\"\n (selectedKeysChange)=\"types.setValue($event)\"\n ></lib-multi-select>\n </div>\n </div>\n <!-- Collection -->\n <div data-testid=\"collection\">\n <h4>Collection</h4>\n <div class=\"ss-multi-select-wrapper\">\n <lib-multi-select\n elementId=\"collection\"\n [label]=\"'Collection'\"\n [allOptions]=\"advancedSearchOptions.collections[config.institution]\"\n [selectedKeys]=\"collections.value\"\n (selectedKeysChange)=\"collections.setValue($event)\"\n ></lib-multi-select>\n </div>\n </div>\n <!-- Language -->\n <ng-container *ngTemplateOutlet=\"languageBlock\"></ng-container>\n <!-- Date -->\n <ng-container\n *ngTemplateOutlet=\"dateBlock; context: { header: 'Creation Date' }\"\n ></ng-container>\n }\n <!-- EXTERNAL -->\n @if (config.scope === 'external') {\n <div formGroupName=\"limitResults\" class=\"ss-checkbox-section\">\n <h4>For Fewer Results Try</h4>\n <!-- Peer reviewed -->\n <label class=\"ss-checkbox-label\" for=\"peerReviewed\">\n <input\n class=\"ss-hidden\"\n id=\"peerReviewed\"\n type=\"checkbox\"\n [formControlName]=\"'peerReviewed'\"\n data-testid=\"peerReviewed\"\n />\n <lib-checkbox inputId=\"peerReviewed\" [isChecked]=\"peerReviewed.value\" aria-hidden=\"true\"></lib-checkbox>\n <span class=\"ss-label-text\">Peer reviewed journal articles</span>\n </label>\n </div>\n <div formGroupName=\"expandResults\" class=\"ss-checkbox-section\">\n <h4>For More Results Try</h4>\n <!-- Apply equivalent subjects -->\n <label class=\"ss-checkbox-label\" for=\"applyEquivalentSubjects\">\n <input\n class=\"ss-hidden\"\n id=\"applyEquivalentSubjects\"\n type=\"checkbox\"\n [formControlName]=\"'applyEquivalentSubjects'\"\n data-testid=\"applyEquivalentSubjects\"\n />\n <lib-checkbox inputId=\"applyEquivalentSubjects\" [isChecked]=\"applyEquivalentSubjects.value\" aria-hidden=\"true\"></lib-checkbox>\n <span class=\"ss-label-text\">Apply equivalent subjects</span>\n </label>\n <!-- Full text -->\n <label class=\"ss-checkbox-label\" for=\"fullText\">\n <input\n class=\"ss-hidden\"\n id=\"fullText\"\n type=\"checkbox\"\n [formControlName]=\"'fullText'\"\n data-testid=\"fullText\"\n />\n <lib-checkbox inputId=\"fullText\" [isChecked]=\"fullText.value\" aria-hidden=\"true\"></lib-checkbox>\n <span class=\"ss-label-text\"\n >Include results the library doesn't have access to</span\n >\n </label>\n </div>\n <!-- Date -->\n <ng-container\n *ngTemplateOutlet=\"dateBlock; context: { header: 'Date Published' }\"\n ></ng-container>\n <!-- Language -->\n <ng-container *ngTemplateOutlet=\"languageBlock\"></ng-container>\n }\n </div>\n <div id=\"advSearchFooter\">\n <a [href]=\"'https://lib.byu.edu/browse/' + config.institution\">Alphabetic Browse</a>\n <button\n class=\"pill-btn--components\"\n [ngClass]=\"{\n ensign: config.institution === 'ensign',\n }\"\n type=\"submit\"\n data-testid=\"advSearchSubmitButton\"\n >\n Search\n </button>\n </div>\n</form>\n\n<ng-template #languageBlock>\n <div>\n <h4>Language</h4>\n <lib-multi-select\n elementId=\"language\"\n [label]=\"'language'\"\n [allOptions]=\"advancedSearchOptions.languages\"\n [selectedKeys]=\"languages.value\"\n (selectedKeysChange)=\"languages.setValue($any($event))\"\n ></lib-multi-select>\n </div>\n</ng-template>\n<ng-template #dateBlock let-header=\"header\">\n <div id=\"dateOptions\" class=\"external\">\n <h4>{{ header }}</h4>\n <lib-date-range\n [from]=\"from.value\"\n [to]=\"to.value\"\n (fromChange)=\"from.setValue($event)\"\n (toChange)=\"to.setValue($event)\"\n ></lib-date-range>\n </div>\n</ng-template>\n", styles: ["select,textarea,input{appearance:none;font-family:inherit;padding:.38em;border:solid 1px #707070;border-radius:4px;font-size:1em;background-color:#fff}.ss-select-wrapper{position:relative}.ss-select-wrapper select{cursor:pointer;padding-right:2em}.ss-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}button.ensign{background-color:#2b6042!important;border-color:#2a6142}button.ensign:hover{background-color:#357551!important}html{border:0;margin:0;padding:0;-webkit-text-size-adjust:100%}body{margin:0;padding:0}*,*:before,*:after{box-sizing:border-box}:root{--color-navy: #00245d;--color-royal: #0047ba;--color-white: #ffffff;--color-blue-500: #00245d;--color-blue-400: #003995;--color-blue-300: #0047ba;--color-blue-200: #336cc8;--color-blue-150: #ccdaf1;--color-blue-100: #e5edf8;--color-gray-500: #141414;--color-gray-400: #676767;--color-gray-300: #8f8f8f;--color-gray-200: #d0d0d0;--color-gray-100: #e7e7e7;--color-gray-50: #f9f9f9;--color-gray-brand-400: #676767;--color-green-500: #1d562e;--color-green-400: #2e8545;--color-green-300: #3ba35a;--color-green-200: #9dd1ac;--color-green-100: #ebf6ee;--color-teal-500: #26485f;--color-teal-400: #3e7295;--color-teal-300: #457fa6;--color-teal-200: #a2bfd3;--color-teal-100: #ecf2f6;--color-red-500: #702121;--color-red-400: #b33837;--color-red-300: #c73e3d;--color-red-200: #e39e9e;--color-red-100: #f9ecec;--color-yellow-500: #635f04;--color-yellow-400: #928c30;--color-yellow-300: #d1c844;--color-yellow-200: #e8e3a1;--color-yellow-100: #faf9ec;--color-purple-focus: #b967c7;--text-heading: #002e5d;--text-secondary-heading: #737373;--text-body: #141414;--text-disabled: #676767;--text-link: #336cc8;--text-on-action: #ffffff;--text-success: #1d562e;--text-info: #26485f;--text-error: #702121;--text-warning: #635f04;--surface-success: #ebf6ee;--surface-info: #ecf2f6;--surface-error: #f9ecec;--surface-warning: #faf9ec;--focus-ring-color: #b967c7}@font-face{font-family:Source Sans Pro;font-style:normal;font-weight:300;src:url(https://media.lib.byu.edu/web-assets/fonts/sourcesanspro/1.0.0/SourceSansPro-Light.ttf) format(\"truetype\");font-display:swap}@font-face{font-family:Source Sans Pro;font-style:normal;font-weight:400;src:url(https://media.lib.byu.edu/web-assets/fonts/sourcesanspro/1.0.0/SourceSansPro-Regular.ttf) format(\"truetype\");font-display:swap}@font-face{font-family:Source Sans Pro;font-style:normal;font-weight:600;src:url(https://media.lib.byu.edu/web-assets/fonts/sourcesanspro/1.0.0/SourceSansPro-Semibold.ttf) format(\"truetype\");font-display:swap}@font-face{font-family:Source Sans Pro;font-style:normal;font-weight:700;src:url(https://media.lib.byu.edu/web-assets/fonts/sourcesanspro/1.0.0/SourceSansPro-Bold.ttf) format(\"truetype\");font-display:swap}@font-face{font-family:Source Sans Pro;font-style:italic;font-weight:300;src:url(https://media.lib.byu.edu/web-assets/fonts/sourcesanspro/1.0.0/SourceSansPro-LightItalic.ttf) format(\"truetype\");font-display:swap}@font-face{font-family:Source Sans Pro;font-style:italic;font-weight:400;src:url(https://media.lib.byu.edu/web-assets/fonts/sourcesanspro/1.0.0/SourceSansPro-Italic.ttf) format(\"truetype\");font-display:swap}@font-face{font-family:Source Sans Pro;font-style:italic;font-weight:600;src:url(https://media.lib.byu.edu/web-assets/fonts/sourcesanspro/1.0.0/SourceSansPro-SemiboldItalic.ttf) format(\"truetype\");font-display:swap}@font-face{font-family:Source Sans Pro;font-style:italic;font-weight:700;src:url(https://media.lib.byu.edu/web-assets/fonts/sourcesanspro/1.0.0/SourceSansPro-BoldItalic.ttf) format(\"truetype\");font-display:swap}h1,h2,h3,h4,h5,h6,span:not(.material-symbols-outlined),a,p{font-family:Source Sans Pro}h1{font-weight:300;font-style:normal;color:var(--text-heading)}h2{font-weight:400;font-style:normal;color:var(--text-heading)}h3{font-weight:700;font-style:normal;color:var(--text-heading)}h4,h5,h6{font-weight:600;font-style:normal;color:var(--text-secondary-heading)}.hbll-default-body{font-weight:400;font-style:normal;max-width:35rem;min-width:22.25rem;color:var(--text-body)}.hbll-caption{font-weight:400;font-style:normal;max-width:25.25rem;min-width:17.5rem;color:var(--text-body)}.hbll-large{font-weight:400;font-style:normal;max-width:41.25rem;min-width:26.5rem;color:var(--text-body)}a{color:var(--text-link);text-decoration:underline}.hbll-emphasis{font-weight:600}h1{font-size:2rem;line-height:2.5rem}h2{font-size:1.75rem;line-height:2.25rem}h3,h4{font-size:1.5rem;line-height:2rem}h5,h6{font-size:1.25rem;line-height:1.75rem}.hbll-default-body{font-size:.875rem;line-height:1.25rem}.hbll-caption{font-size:.75rem;line-height:1rem}.hbll-large{font-size:1rem;line-height:1.5rem}@media screen and (min-width: 52.125em){h1{font-size:3rem;line-height:3.5rem}h2{font-size:2.5rem;line-height:3rem}h3{font-size:2rem;line-height:3rem}h4{font-size:1.75rem;line-height:2.5rem}h5{font-size:1.5rem;line-height:2rem}h6{font-size:1.25rem;line-height:1.75rem}.hbll-default-body{font-size:1rem;line-height:1.5rem}.hbll-caption{font-size:.75rem;line-height:1rem}.hbll-large{font-size:1.25rem;line-height:1.75rem}}@media screen and (min-width: 90em){h1{font-size:3.75rem;line-height:4.25rem}h2{font-size:3rem;line-height:3.5rem}h3{font-size:2.5rem;line-height:3rem}h4{font-size:2rem;line-height:2.5rem}h5{font-size:1.5rem;line-height:2rem}h6{font-size:1.25rem;line-height:1.75rem}.hbll-default-body{font-size:1rem;line-height:1.5rem}.hbll-caption{font-size:.75rem;line-height:1rem}.hbll-large{font-size:1.25rem;line-height:1.75rem}}:focus-visible{outline:.125rem solid var(--focus-ring-color);outline-offset:.125rem}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);border:0}.sr-only.sr-only-focusable:focus,.sr-only.sr-only-focusable:focus-within,.sr-only.sr-only-focusable:active{position:static;width:auto;height:auto;margin:0;overflow:visible;clip:auto}a,button{border:none;background:none;font-family:inherit;padding:0;margin:0;font-size:inherit;color:#0047ba;text-decoration:none;cursor:pointer}a:hover,button:hover{color:#003995}.pill-btn--components{border-radius:100em;padding:.4em 1.3em}:host{box-sizing:border-box}:host *{box-sizing:inherit}.ss-select-wrapper{margin-right:.3em}.ss-row-cancel{color:#aaa;margin-left:.4em;margin-top:.4em}.ss-row-cancel:hover{color:#666}.ss-row-cancel .ss-icon{font-size:1em}.ss-hidden{display:none}#addQueryBtn{display:flex;align-items:center}#addQueryBtn:disabled{color:#999;pointer-events:none}#addQueryBtn .icon{font-size:1em}.ss-adv-search-wrapper{width:100%}h3{font-size:1.13em;font-weight:300;margin-bottom:.7em;margin-top:0}h4{font:inherit;margin-bottom:.75em;font-weight:600}#dateOptions h4{margin-bottom:.8em}.ss-adv-search-row{display:flex;flex-wrap:wrap;width:100%;margin-bottom:.6em}.ss-query-input{display:inline-block;width:100%;margin-top:.25rem}.ss-query-input input{width:100%}.ss-other-options{display:grid;grid-template-columns:repeat(1,1fr);gap:.6em 1.6em;grid-auto-rows:minmax(1em,auto);margin-top:1.4em}.ss-other-options label{margin-right:.625rem}.ss-checkbox-label{display:inline-flex;align-items:flex-start;cursor:pointer}.ss-checkbox-label:not(:last-of-type){margin-bottom:.75em}.ss-checkbox-label .ss-label-text{margin-top:-.1em;margin-left:.45em}.ss-checkbox-section{margin-bottom:.8em}#advSearchFooter{margin-bottom:.5em;display:flex;justify-content:space-between;align-items:center;font-size:1.2em}#advSearchFooter a{font-size:.8em}@media screen and (min-width: 615px){.ss-adv-search-row{flex-wrap:nowrap}.ss-other-options{grid-template-columns:repeat(2,1fr)}.ss-query-input{margin-top:0}#dateOptions .external{grid-column:span 2}}\n"] }]
|
|
2770
|
+
], template: "<form\n data-testid=\"advancedSearchForm\"\n (submit)=\"config.scope === 'local' ? doLocalAdvancedSearch() : doExternalAdvancedSearch()\"\n [formGroup]=\"advancedSearchForm\"\n class=\"ss-adv-search-wrapper\"\n>\n <h3>Advanced Search</h3>\n <!-- Queries -->\n @for (query of queries.controls; track $index; let queryIndex = $index) {\n <div class=\"ss-adv-search-row\" [formGroup]=\"query\">\n <!-- Boolean operator -->\n <!-- Add boolean for each row except for first -->\n @if (!$first) {\n <div class=\"ss-select-wrapper\">\n <select\n [id]=\"'boolean' + queryIndex\"\n [formControlName]=\"'boolean'\"\n [attr.data-testid]=\"'boolean' + queryIndex\"\n >\n @for (boolean of advancedSearchOptions.boolean; track boolean) {\n <option [ngValue]=\"boolean\">\n {{ boolean }}\n </option>\n }\n </select>\n </div>\n }\n <!-- Field -->\n <label [for]=\"'field' + queryIndex\" class=\"sr-only\">Field {{ queryIndex }}</label>\n <div class=\"ss-select-wrapper\">\n <select\n [id]=\"'field' + queryIndex\"\n [formControlName]=\"'field'\"\n [attr.data-testid]=\"'field' + queryIndex\"\n >\n @for (field of advancedSearchOptions.fields; track field) {\n <option [ngValue]=\"field\">\n {{ advancedSearchFieldMap[field] }}\n </option>\n }\n <optgroup\n [label]=\"(config.scope === 'external' ? 'Online' : 'Library') + ' Specific'\"\n >\n @for (\n field of config.scope === 'external'\n ? advancedSearchOptions.externalFields\n : advancedSearchOptions.localFields;\n track field\n ) {\n <option [ngValue]=\"field\">\n {{ advancedSearchFieldMap[field] }}\n </option>\n }\n </optgroup>\n </select>\n </div>\n <!-- Qualifiers are only available for local searches -->\n @if (config.scope === 'local') {\n <label [for]=\"'qualifier' + queryIndex\" class=\"sr-only\"\n >Match Criteria {{ queryIndex }}</label\n >\n <div class=\"ss-select-wrapper\">\n <select\n [id]=\"'qualifier' + queryIndex\"\n [formControlName]=\"'qualifier'\"\n [attr.data-testid]=\"'qualifier' + queryIndex\"\n >\n <!-- $any because a field can technically be local or external, though this block is scoped strictly to local fields -->\n @for (\n qualifier of $any(advancedSearchOptions.qualifiers)[\n query.controls.field.value\n ];\n track qualifier;\n let optionIndex = $index\n ) {\n <option\n [ngValue]=\"qualifier\"\n [attr.data-testid]=\"\n 'qualifier' + queryIndex + '-option' + optionIndex\n \"\n >\n {{ $any(advancedSearchQualifierMap)[qualifier] }}\n </option>\n }\n </select>\n </div>\n }\n <!-- Query -->\n <label [for]=\"'query' + queryIndex\" class=\"sr-only\">\n {{ getQueryLabel(queryIndex) }}\n </label>\n <div class=\"ss-query-input\">\n <input\n #searchInput\n [id]=\"'query' + queryIndex\"\n [formControlName]=\"'query'\"\n [attr.data-testid]=\"'query' + queryIndex\"\n required\n aria-required=\"true\"\n matTooltip=\"Fill out this field\"\n [matTooltipPosition]=\"'above'\"\n [matTooltipDisabled]=\"true\"\n [attr.aria-invalid]=\"isSubmitted && query.controls.query.invalid\"\n [attr.aria-describedby]=\"isSubmitted && query.controls.query.invalid ? ('invalidInputDesc' + queryIndex) : null\"\n />\n </div>\n @if (!$first) {\n <button\n class=\"ss-row-cancel\"\n type=\"button\"\n (click)=\"removeQuery(queryIndex)\"\n [attr.data-testid]=\"'cancelRow' + queryIndex\"\n >\n <span class=\"material-symbols-outlined ss-icon\"> cancel </span>\n </button>\n }\n </div>\n }\n <button\n type=\"button\"\n (click)=\"addQuery()\"\n id=\"addQueryBtn\"\n data-testid=\"addQuery\"\n [disabled]=\"queries.length > 11\"\n >\n <span class=\"material-symbols-outlined ss-icon\"> add </span>\n Add a row\n </button>\n <!-- OTHER OPTIONS -->\n <div class=\"ss-other-options\">\n <!-- LOCAL -->\n @if (config.scope === 'local') {\n <!-- Type -->\n <div data-testid=\"resourceType\">\n <h4>Resource Type</h4>\n <div class=\"ss-multi-select-wrapper\">\n <lib-multi-select\n elementId=\"resourceType\"\n [label]=\"'Resource Type'\"\n [allOptions]=\"advancedSearchOptions.types[config.institution]\"\n [selectedKeys]=\"types.value\"\n (selectedKeysChange)=\"types.setValue($event)\"\n ></lib-multi-select>\n </div>\n </div>\n <!-- Collection -->\n <div data-testid=\"collection\">\n <h4>Collection</h4>\n <div class=\"ss-multi-select-wrapper\">\n <lib-multi-select\n elementId=\"collection\"\n [label]=\"'Collection'\"\n [allOptions]=\"advancedSearchOptions.collections[config.institution]\"\n [selectedKeys]=\"collections.value\"\n (selectedKeysChange)=\"collections.setValue($event)\"\n ></lib-multi-select>\n </div>\n </div>\n <!-- Language -->\n <ng-container *ngTemplateOutlet=\"languageBlock\"></ng-container>\n <!-- Date -->\n <ng-container\n *ngTemplateOutlet=\"dateBlock; context: { header: 'Creation Date' }\"\n ></ng-container>\n }\n <!-- EXTERNAL -->\n @if (config.scope === 'external') {\n <div formGroupName=\"limitResults\" class=\"ss-checkbox-section\">\n <h4>For Fewer Results Try</h4>\n <!-- Peer reviewed -->\n <label class=\"ss-checkbox-label\" for=\"peerReviewed\">\n <input\n class=\"ss-hidden\"\n id=\"peerReviewed\"\n type=\"checkbox\"\n [formControlName]=\"'peerReviewed'\"\n data-testid=\"peerReviewed\"\n />\n <lib-checkbox inputId=\"peerReviewed\" [isChecked]=\"peerReviewed.value\" aria-hidden=\"true\"></lib-checkbox>\n <span class=\"ss-label-text\">Peer reviewed journal articles</span>\n </label>\n </div>\n <div formGroupName=\"expandResults\" class=\"ss-checkbox-section\">\n <h4>For More Results Try</h4>\n <!-- Apply equivalent subjects -->\n <label class=\"ss-checkbox-label\" for=\"applyEquivalentSubjects\">\n <input\n class=\"ss-hidden\"\n id=\"applyEquivalentSubjects\"\n type=\"checkbox\"\n [formControlName]=\"'applyEquivalentSubjects'\"\n data-testid=\"applyEquivalentSubjects\"\n />\n <lib-checkbox inputId=\"applyEquivalentSubjects\" [isChecked]=\"applyEquivalentSubjects.value\" aria-hidden=\"true\"></lib-checkbox>\n <span class=\"ss-label-text\">Apply equivalent subjects</span>\n </label>\n <!-- Full text -->\n <label class=\"ss-checkbox-label\" for=\"fullText\">\n <input\n class=\"ss-hidden\"\n id=\"fullText\"\n type=\"checkbox\"\n [formControlName]=\"'fullText'\"\n data-testid=\"fullText\"\n />\n <lib-checkbox inputId=\"fullText\" [isChecked]=\"fullText.value\" aria-hidden=\"true\"></lib-checkbox>\n <span class=\"ss-label-text\"\n >Include results the library doesn't have access to</span\n >\n </label>\n </div>\n <!-- Date -->\n <ng-container\n *ngTemplateOutlet=\"dateBlock; context: { header: 'Date Published' }\"\n ></ng-container>\n <!-- Language -->\n <ng-container *ngTemplateOutlet=\"languageBlock\"></ng-container>\n }\n </div>\n <div id=\"advSearchFooter\">\n <a [href]=\"'https://lib.byu.edu/browse/' + config.institution\">Alphabetic Browse</a>\n <button\n class=\"pill-btn--components\"\n [ngClass]=\"{\n ensign: config.institution === 'ensign',\n }\"\n type=\"submit\"\n data-testid=\"advSearchSubmitButton\"\n >\n Search\n </button>\n </div>\n</form>\n\n<ng-template #languageBlock>\n <div>\n <h4>Language</h4>\n <lib-multi-select\n elementId=\"language\"\n [label]=\"'language'\"\n [allOptions]=\"advancedSearchOptions.languages\"\n [selectedKeys]=\"languages.value\"\n (selectedKeysChange)=\"languages.setValue($any($event))\"\n ></lib-multi-select>\n </div>\n</ng-template>\n<ng-template #dateBlock let-header=\"header\">\n <div id=\"dateOptions\" class=\"external\">\n <h4>{{ header }}</h4>\n <lib-date-range\n [from]=\"from.value\"\n [to]=\"to.value\"\n (fromChange)=\"from.setValue($event)\"\n (toChange)=\"to.setValue($event)\"\n ></lib-date-range>\n </div>\n</ng-template>\n", styles: ["select,textarea,input{appearance:none;font-family:inherit;padding:.38em;border:solid 1px #707070;border-radius:4px;font-size:1em;background-color:#fff}.ss-select-wrapper{position:relative}.ss-select-wrapper select{cursor:pointer;padding-right:2em}.ss-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:#457fa6;font-size:1em;transition:all .15s;color:#fff;cursor:pointer;font-weight:600;text-align:center}.pill-btn--components:disabled{color:#676767;background-color:#e7e7e7;pointer-events:none}.pill-btn--components:hover{background-color:#a2bfd3;color:#fff}.destructive.pill-btn--components{background-color:#b33837}.destructive.pill-btn--components:hover{background-color:#c73e3d}button.ensign{background-color:#2b6042!important;border-color:#2a6142}button.ensign:hover{background-color:#357551!important}html{border:0;margin:0;padding:0;-webkit-text-size-adjust:100%}body{margin:0;padding:0}*,*:before,*:after{box-sizing:border-box}:root{--color-navy: #00245d;--color-royal: #0047ba;--color-white: #ffffff;--color-blue-500: #00245d;--color-blue-400: #003995;--color-blue-300: #0047ba;--color-blue-200: #336cc8;--color-blue-150: #ccdaf1;--color-blue-100: #e5edf8;--color-gray-500: #141414;--color-gray-400: #676767;--color-gray-300: #8f8f8f;--color-gray-200: #d0d0d0;--color-gray-100: #e7e7e7;--color-gray-50: #f9f9f9;--color-gray-brand-400: #676767;--color-green-500: #1d562e;--color-green-400: #2e8545;--color-green-300: #3ba35a;--color-green-200: #9dd1ac;--color-green-100: #ebf6ee;--color-teal-500: #26485f;--color-teal-400: #3e7295;--color-teal-300: #457fa6;--color-teal-200: #a2bfd3;--color-teal-100: #ecf2f6;--color-red-500: #702121;--color-red-400: #b33837;--color-red-300: #c73e3d;--color-red-200: #e39e9e;--color-red-100: #f9ecec;--color-yellow-500: #635f04;--color-yellow-400: #928c30;--color-yellow-300: #d1c844;--color-yellow-200: #e8e3a1;--color-yellow-100: #faf9ec;--color-purple-focus: #b967c7;--text-heading: #002e5d;--text-secondary-heading: #737373;--text-body: #141414;--text-disabled: #676767;--text-link: #336cc8;--text-on-action: #ffffff;--text-success: #1d562e;--text-info: #26485f;--text-error: #702121;--text-warning: #635f04;--surface-success: #ebf6ee;--surface-info: #ecf2f6;--surface-error: #f9ecec;--surface-warning: #faf9ec;--focus-ring-color: #b967c7}@font-face{font-family:Source Sans Pro;font-style:normal;font-weight:300;src:url(https://media.lib.byu.edu/web-assets/fonts/sourcesanspro/1.0.0/SourceSansPro-Light.ttf) format(\"truetype\");font-display:swap}@font-face{font-family:Source Sans Pro;font-style:normal;font-weight:400;src:url(https://media.lib.byu.edu/web-assets/fonts/sourcesanspro/1.0.0/SourceSansPro-Regular.ttf) format(\"truetype\");font-display:swap}@font-face{font-family:Source Sans Pro;font-style:normal;font-weight:600;src:url(https://media.lib.byu.edu/web-assets/fonts/sourcesanspro/1.0.0/SourceSansPro-Semibold.ttf) format(\"truetype\");font-display:swap}@font-face{font-family:Source Sans Pro;font-style:normal;font-weight:700;src:url(https://media.lib.byu.edu/web-assets/fonts/sourcesanspro/1.0.0/SourceSansPro-Bold.ttf) format(\"truetype\");font-display:swap}@font-face{font-family:Source Sans Pro;font-style:italic;font-weight:300;src:url(https://media.lib.byu.edu/web-assets/fonts/sourcesanspro/1.0.0/SourceSansPro-LightItalic.ttf) format(\"truetype\");font-display:swap}@font-face{font-family:Source Sans Pro;font-style:italic;font-weight:400;src:url(https://media.lib.byu.edu/web-assets/fonts/sourcesanspro/1.0.0/SourceSansPro-Italic.ttf) format(\"truetype\");font-display:swap}@font-face{font-family:Source Sans Pro;font-style:italic;font-weight:600;src:url(https://media.lib.byu.edu/web-assets/fonts/sourcesanspro/1.0.0/SourceSansPro-SemiboldItalic.ttf) format(\"truetype\");font-display:swap}@font-face{font-family:Source Sans Pro;font-style:italic;font-weight:700;src:url(https://media.lib.byu.edu/web-assets/fonts/sourcesanspro/1.0.0/SourceSansPro-BoldItalic.ttf) format(\"truetype\");font-display:swap}h1,h2,h3,h4,h5,h6,span:not(.material-symbols-outlined),a,p{font-family:Source Sans Pro}h1{font-weight:300;font-style:normal;color:var(--text-heading)}h2{font-weight:400;font-style:normal;color:var(--text-heading)}h3{font-weight:700;font-style:normal;color:var(--text-heading)}h4,h5,h6{font-weight:600;font-style:normal;color:var(--text-secondary-heading)}.hbll-default-body{font-weight:400;font-style:normal;max-width:35rem;min-width:22.25rem;color:var(--text-body)}.hbll-caption{font-weight:400;font-style:normal;max-width:25.25rem;min-width:17.5rem;color:var(--text-body)}.hbll-large{font-weight:400;font-style:normal;max-width:41.25rem;min-width:26.5rem;color:var(--text-body)}a{color:var(--text-link);text-decoration:underline}.hbll-emphasis{font-weight:600}h1{font-size:2rem;line-height:2.5rem}h2{font-size:1.75rem;line-height:2.25rem}h3,h4{font-size:1.5rem;line-height:2rem}h5,h6{font-size:1.25rem;line-height:1.75rem}.hbll-default-body{font-size:.875rem;line-height:1.25rem}.hbll-caption{font-size:.75rem;line-height:1rem}.hbll-large{font-size:1rem;line-height:1.5rem}@media screen and (min-width: 52.125em){h1{font-size:3rem;line-height:3.5rem}h2{font-size:2.5rem;line-height:3rem}h3{font-size:2rem;line-height:3rem}h4{font-size:1.75rem;line-height:2.5rem}h5{font-size:1.5rem;line-height:2rem}h6{font-size:1.25rem;line-height:1.75rem}.hbll-default-body{font-size:1rem;line-height:1.5rem}.hbll-caption{font-size:.75rem;line-height:1rem}.hbll-large{font-size:1.25rem;line-height:1.75rem}}@media screen and (min-width: 90em){h1{font-size:3.75rem;line-height:4.25rem}h2{font-size:3rem;line-height:3.5rem}h3{font-size:2.5rem;line-height:3rem}h4{font-size:2rem;line-height:2.5rem}h5{font-size:1.5rem;line-height:2rem}h6{font-size:1.25rem;line-height:1.75rem}.hbll-default-body{font-size:1rem;line-height:1.5rem}.hbll-caption{font-size:.75rem;line-height:1rem}.hbll-large{font-size:1.25rem;line-height:1.75rem}}:focus-visible{outline:.125rem solid var(--focus-ring-color);outline-offset:.125rem}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);border:0}.sr-only.sr-only-focusable:focus,.sr-only.sr-only-focusable:focus-within,.sr-only.sr-only-focusable:active{position:static;width:auto;height:auto;margin:0;overflow:visible;clip:auto}a,button{border:none;background:none;font-family:inherit;padding:0;margin:0;font-size:inherit;color:#0047ba;text-decoration:none;cursor:pointer}a:hover,button:hover{color:#003995}.pill-btn--components{border-radius:100em;padding:.4em 1.3em}:host{box-sizing:border-box}:host *{box-sizing:inherit}.ss-select-wrapper{margin-right:.3em}.ss-row-cancel{color:#aaa;margin-left:.4em;margin-top:.4em}.ss-row-cancel:hover{color:#666}.ss-row-cancel .ss-icon{font-size:1em}.ss-hidden{display:none}#addQueryBtn{display:flex;align-items:center}#addQueryBtn:disabled{color:#999;pointer-events:none}#addQueryBtn .icon{font-size:1em}.ss-adv-search-wrapper{width:100%}h3{font-size:1.13em;font-weight:300;margin-bottom:.7em;margin-top:0}h4{font:inherit;margin-bottom:.75em;font-weight:600}#dateOptions h4{margin-bottom:.8em}.ss-adv-search-row{display:flex;flex-wrap:wrap;width:100%;margin-bottom:.6em}.ss-query-input{display:inline-block;width:100%;margin-top:.25rem}.ss-query-input input{width:100%}.ss-other-options{display:grid;grid-template-columns:repeat(1,1fr);gap:.6em 1.6em;grid-auto-rows:minmax(1em,auto);margin-top:1.4em}.ss-other-options label{margin-right:.625rem}.ss-checkbox-label{display:inline-flex;align-items:flex-start;cursor:pointer}.ss-checkbox-label:not(:last-of-type){margin-bottom:.75em}.ss-checkbox-label .ss-label-text{margin-top:-.1em;margin-left:.45em}.ss-checkbox-section{margin-bottom:.8em}#advSearchFooter{margin-bottom:.5em;display:flex;justify-content:space-between;align-items:center;font-size:1.2em}#advSearchFooter a{font-size:.8em}@media screen and (min-width: 615px){.ss-adv-search-row{flex-wrap:nowrap}.ss-other-options{grid-template-columns:repeat(2,1fr)}.ss-query-input{margin-top:0}#dateOptions .external{grid-column:span 2}}\n"] }]
|
|
2758
2771
|
}], propDecorators: { config: [{
|
|
2759
2772
|
type: Input,
|
|
2760
2773
|
args: [{ required: true }]
|
|
@@ -2932,11 +2945,11 @@ class SimpleSearchComponent {
|
|
|
2932
2945
|
}
|
|
2933
2946
|
}
|
|
2934
2947
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: SimpleSearchComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
2935
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.15", type: SimpleSearchComponent, isStandalone: true, selector: "lib-ss-simple-search", inputs: { searchText: { classPropertyName: "searchText", publicName: "searchText", isSignal: true, isRequired: false, transformFunction: null }, config: { classPropertyName: "config", publicName: "config", isSignal: false, isRequired: true, transformFunction: null }, supportedSuggestionScopes: { classPropertyName: "supportedSuggestionScopes", publicName: "supportedSuggestionScopes", isSignal: false, isRequired: false, transformFunction: null }, suggestions: { classPropertyName: "suggestions", publicName: "suggestions", isSignal: false, isRequired: false, transformFunction: null } }, outputs: { searchText: "searchTextChange", simpleSearch: "simpleSearch", clearSimpleSearch: "clearSimpleSearch", suggest: "suggest" }, host: { listeners: { "document:click": "onDocumentClick($event)", "focusout": "onFocusOut($event)" } }, viewQueries: [{ propertyName: "searchInput", first: true, predicate: ["searchInput"], descendants: true }, { propertyName: "inputTooltip", first: true, predicate: MatTooltip, descendants: true }, { propertyName: "suggestionItems", predicate: ["suggestionItem"], descendants: true }], ngImport: i0, template: "<div class=\"ss-container\">\n <form [formGroup]=\"searchForm\" (submit)=\"emitSimpleSearch()\" data-testid=\"searchForm\">\n <input\n #searchInput\n data-testid=\"searchInput\"\n id=\"q\"\n name=\"q\"\n type=\"text\"\n autocomplete=\"off\"\n required\n aria-required=\"true\"\n aria-label=\"search input\"\n autocapitalize=\"off\"\n formControlName=\"simpleQuery\"\n matTooltip=\"Fill out this field\"\n [matTooltipPosition]=\"'above'\"\n [matTooltipDisabled]=\"true\"\n [attr.aria-invalid]=\"isSubmitted && simpleQuery.invalid\"\n (keydown)=\"onInputKeydown($event)\"\n />\n <label for=\"q\" data-testid=\"label\">{{\n config.scope === 'local'\n ? 'Books, media, special collections and more'\n : 'Ebooks, articles, journals, databases, streaming media and more'\n }}</label>\n <button\n type=\"submit\"\n aria-label=\"search\"\n data-testid=\"searchBtn\"\n [ngClass]=\"{ ensign: config.institution === 'ensign' }\"\n >\n <span class=\"material-symbols-outlined ss-icon\"> search </span>\n </button>\n </form>\n\n @if (simpleQuery.value) {\n <button id=\"clear\" (click)=\"clearQuery()\" data-testid=\"clearBtn\">\n <span class=\"material-symbols-outlined ss-icon\"> cancel </span>\n </button>\n }\n\n @if (showSuggestions && suggestions.length > 0) {\n <ul class=\"suggestions-list\" role=\"listbox\" data-testid=\"suggestionsList\">\n @for (suggestion of suggestions; track $index; let i = $index) {\n <li\n #suggestionItem\n class=\"suggestion-item\"\n [class.selected]=\"i === selectedSuggestionIndex\"\n (click)=\"selectSuggestion(suggestion)\"\n (keydown.enter)=\"selectSuggestion(suggestion)\"\n (keydown.space)=\"selectSuggestion(suggestion); $event.preventDefault()\"\n role=\"option\"\n tabindex=\"0\"\n [attr.aria-selected]=\"i === selectedSuggestionIndex\"\n data-testid=\"suggestionItem\"\n >\n <span class=\"suggestion-text\" [title]=\"suggestion\">\n {{\n expandedSuggestions.has(i) || suggestion.length <= 500\n ? suggestion\n : (suggestion | slice: 0 : 500) + '...'\n }}\n </span>\n @if (suggestion.length > 500) {\n <button\n class=\"expand-btn\"\n (click)=\"toggleExpand(i, $event)\"\n [attr.aria-label]=\"\n expandedSuggestions.has(i) ? 'Collapse' : 'Expand suggestion'\n \"\n >\n <span class=\"material-symbols-outlined\">\n {{ expandedSuggestions.has(i) ? 'expand_less' : 'expand_more' }}\n </span>\n </button>\n }\n </li>\n }\n </ul>\n }\n</div>\n", styles: ["html{border:0;margin:0;padding:0;-webkit-text-size-adjust:100%}body{margin:0;padding:0}*,*:before,*:after{box-sizing:border-box}:root{--color-navy: #00245d;--color-royal: #0047ba;--color-white: #ffffff;--color-blue-500: #00245d;--color-blue-400: #003995;--color-blue-300: #0047ba;--color-blue-200: #336cc8;--color-blue-150: #ccdaf1;--color-blue-100: #e5edf8;--color-gray-500: #141414;--color-gray-400: #676767;--color-gray-300: #8f8f8f;--color-gray-200: #d0d0d0;--color-gray-100: #e7e7e7;--color-gray-50: #f9f9f9;--color-gray-brand-400: #676767;--color-green-500: #1d562e;--color-green-400: #2e8545;--color-green-300: #3ba35a;--color-green-200: #9dd1ac;--color-green-100: #ebf6ee;--color-teal-500: #26485f;--color-teal-400: #3e7295;--color-teal-300: #457fa6;--color-teal-200: #a2bfd3;--color-teal-100: #ecf2f6;--color-red-500: #702121;--color-red-400: #b33837;--color-red-300: #c73e3d;--color-red-200: #e39e9e;--color-red-100: #f9ecec;--color-yellow-500: #635f04;--color-yellow-400: #928c30;--color-yellow-300: #d1c844;--color-yellow-200: #e8e3a1;--color-yellow-100: #faf9ec;--color-purple-focus: #b967c7;--text-heading: #002e5d;--text-secondary-heading: #737373;--text-body: #141414;--text-disabled: #676767;--text-link: #336cc8;--text-on-action: #ffffff;--text-success: #1d562e;--text-info: #26485f;--text-error: #702121;--text-warning: #635f04;--surface-success: #ebf6ee;--surface-info: #ecf2f6;--surface-error: #f9ecec;--surface-warning: #faf9ec;--focus-ring-color: #b967c7}@font-face{font-family:Source Sans Pro;font-style:normal;font-weight:300;src:url(https://media.lib.byu.edu/web-assets/fonts/sourcesanspro/1.0.0/SourceSansPro-Light.ttf) format(\"truetype\");font-display:swap}@font-face{font-family:Source Sans Pro;font-style:normal;font-weight:400;src:url(https://media.lib.byu.edu/web-assets/fonts/sourcesanspro/1.0.0/SourceSansPro-Regular.ttf) format(\"truetype\");font-display:swap}@font-face{font-family:Source Sans Pro;font-style:normal;font-weight:600;src:url(https://media.lib.byu.edu/web-assets/fonts/sourcesanspro/1.0.0/SourceSansPro-Semibold.ttf) format(\"truetype\");font-display:swap}@font-face{font-family:Source Sans Pro;font-style:normal;font-weight:700;src:url(https://media.lib.byu.edu/web-assets/fonts/sourcesanspro/1.0.0/SourceSansPro-Bold.ttf) format(\"truetype\");font-display:swap}@font-face{font-family:Source Sans Pro;font-style:italic;font-weight:300;src:url(https://media.lib.byu.edu/web-assets/fonts/sourcesanspro/1.0.0/SourceSansPro-LightItalic.ttf) format(\"truetype\");font-display:swap}@font-face{font-family:Source Sans Pro;font-style:italic;font-weight:400;src:url(https://media.lib.byu.edu/web-assets/fonts/sourcesanspro/1.0.0/SourceSansPro-Italic.ttf) format(\"truetype\");font-display:swap}@font-face{font-family:Source Sans Pro;font-style:italic;font-weight:600;src:url(https://media.lib.byu.edu/web-assets/fonts/sourcesanspro/1.0.0/SourceSansPro-SemiboldItalic.ttf) format(\"truetype\");font-display:swap}@font-face{font-family:Source Sans Pro;font-style:italic;font-weight:700;src:url(https://media.lib.byu.edu/web-assets/fonts/sourcesanspro/1.0.0/SourceSansPro-BoldItalic.ttf) format(\"truetype\");font-display:swap}h1,h2,h3,h4,h5,h6,span:not(.material-symbols-outlined),a,p{font-family:Source Sans Pro}h1{font-weight:300;font-style:normal;color:var(--text-heading)}h2{font-weight:400;font-style:normal;color:var(--text-heading)}h3{font-weight:700;font-style:normal;color:var(--text-heading)}h4,h5,h6{font-weight:600;font-style:normal;color:var(--text-secondary-heading)}.hbll-default-body{font-weight:400;font-style:normal;max-width:35rem;min-width:22.25rem;color:var(--text-body)}.hbll-caption{font-weight:400;font-style:normal;max-width:25.25rem;min-width:17.5rem;color:var(--text-body)}.hbll-large{font-weight:400;font-style:normal;max-width:41.25rem;min-width:26.5rem;color:var(--text-body)}a{color:var(--text-link);text-decoration:underline}.hbll-emphasis{font-weight:600}h1{font-size:2rem;line-height:2.5rem}h2{font-size:1.75rem;line-height:2.25rem}h3,h4{font-size:1.5rem;line-height:2rem}h5,h6{font-size:1.25rem;line-height:1.75rem}.hbll-default-body{font-size:.875rem;line-height:1.25rem}.hbll-caption{font-size:.75rem;line-height:1rem}.hbll-large{font-size:1rem;line-height:1.5rem}@media screen and (min-width: 52.125em){h1{font-size:3rem;line-height:3.5rem}h2{font-size:2.5rem;line-height:3rem}h3{font-size:2rem;line-height:3rem}h4{font-size:1.75rem;line-height:2.5rem}h5{font-size:1.5rem;line-height:2rem}h6{font-size:1.25rem;line-height:1.75rem}.hbll-default-body{font-size:1rem;line-height:1.5rem}.hbll-caption{font-size:.75rem;line-height:1rem}.hbll-large{font-size:1.25rem;line-height:1.75rem}}@media screen and (min-width: 90em){h1{font-size:3.75rem;line-height:4.25rem}h2{font-size:3rem;line-height:3.5rem}h3{font-size:2.5rem;line-height:3rem}h4{font-size:2rem;line-height:2.5rem}h5{font-size:1.5rem;line-height:2rem}h6{font-size:1.25rem;line-height:1.75rem}.hbll-default-body{font-size:1rem;line-height:1.5rem}.hbll-caption{font-size:.75rem;line-height:1rem}.hbll-large{font-size:1.25rem;line-height:1.75rem}}:focus-visible{outline:.125rem solid var(--focus-ring-color);outline-offset:.125rem}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);border:0}.sr-only.sr-only-focusable:focus,.sr-only.sr-only-focusable:focus-within,.sr-only.sr-only-focusable:active{position:static;width:auto;height:auto;margin:0;overflow:visible;clip:auto}a,button{border:none;background:none;font-family:inherit;padding:0;margin:0;font-size:inherit;color:#0047ba;text-decoration:none;cursor:pointer}a:hover,button:hover{color:#003995}.ss-container{position:relative}form{display:flex}.ss-icon{font-size:1em}button[type=submit]{background:#fff;border-radius:0 4px 4px 0;margin:0;width:3em;cursor:pointer;display:flex;justify-content:center;align-items:center;transition:color .2s,background-color .2s}button[type=submit] .ss-icon{color:#0047ba;font-size:1.7em}button[type=submit]:hover .ss-icon{color:#6892ca}button[type=submit].ensign .ss-icon{color:#2b6042}button[type=submit].ensign .ss-icon:hover{color:#357551}#clear{position:absolute;right:3em;top:0%;height:100%;display:flex;justify-content:center;align-items:center;padding:0 0 0 .375rem}#clear .ss-icon{height:auto;color:#acacac;transition:color ease-in-out .05s}#clear:hover .ss-icon{color:#666}input[type=text]{background-color:#fff;color:#000;font-family:inherit;border:none;font-weight:600;margin:0;overflow:hidden;cursor:text;width:calc(100% - 3em);font-size:1em;border-radius:4px 0 0 4px;padding:.56em 2em .56em .56em}input[type=text]:focus{outline:none}input[type=text]:valid+label,input[type=text]:focus+label{font-size:.75em;top:-.8em;padding-top:0;padding-bottom:0;pointer-events:none;margin-top:0;margin-left:.56em;cursor:default}input[type=text]:valid+label:before,input[type=text]:focus+label:before{opacity:1}label{cursor:text;transition:all .1s ease-in-out;position:absolute;padding:.5em .28em;margin-left:.28em;left:0;color:#707070;z-index:1;max-width:calc(100% - 3.4em);white-space:nowrap;line-height:normal;overflow:hidden;text-overflow:ellipsis;border-radius:4px}label:before{transition:all .1s ease-in-out;background-color:#fff;content:\"\";position:absolute;inset:0;opacity:0;z-index:-1}.suggestions-list{position:absolute;top:100%;left:0;right:0;background:#fff;border:1px solid #d0d0d0;border-top:none;border-radius:0 0 4px 4px;list-style:none;margin:0;padding:0;max-height:300px;overflow-y:auto;box-shadow:0 4px 6px #0000001a;z-index:1000}.suggestion-item{padding:.75em 1em;cursor:pointer;transition:background-color .15s ease;color:#333;font-size:1em;display:flex;align-items:center;gap:.5em}.suggestion-item:hover,.suggestion-item.selected{background-color:#f0f0f0}.suggestion-item.selected{background-color:#e6f2ff}.suggestion-item:last-child{border-radius:0 0 4px 4px}.suggestion-text{flex:1;overflow-wrap:break-word}.expand-btn{background:none;border:none;cursor:pointer;padding:2px;display:flex;align-items:center;justify-content:center;color:#707070;border-radius:50%;transition:background-color .2s}.expand-btn:hover{background-color:#0000000d;color:#0047ba}.expand-btn .material-symbols-outlined{font-size:1.25em}\n"], dependencies: [{ kind: "ngmodule", type: MatTooltipModule }, { kind: "directive", type: i1$2.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$1.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: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$1.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i1$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "pipe", type: i1.SlicePipe, name: "slice" }] }); }
|
|
2948
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.15", type: SimpleSearchComponent, isStandalone: true, selector: "lib-ss-simple-search", inputs: { searchText: { classPropertyName: "searchText", publicName: "searchText", isSignal: true, isRequired: false, transformFunction: null }, config: { classPropertyName: "config", publicName: "config", isSignal: false, isRequired: true, transformFunction: null }, supportedSuggestionScopes: { classPropertyName: "supportedSuggestionScopes", publicName: "supportedSuggestionScopes", isSignal: false, isRequired: false, transformFunction: null }, suggestions: { classPropertyName: "suggestions", publicName: "suggestions", isSignal: false, isRequired: false, transformFunction: null } }, outputs: { searchText: "searchTextChange", simpleSearch: "simpleSearch", clearSimpleSearch: "clearSimpleSearch", suggest: "suggest" }, host: { listeners: { "document:click": "onDocumentClick($event)", "focusout": "onFocusOut($event)" } }, viewQueries: [{ propertyName: "searchInput", first: true, predicate: ["searchInput"], descendants: true }, { propertyName: "inputTooltip", first: true, predicate: MatTooltip, descendants: true }, { propertyName: "suggestionItems", predicate: ["suggestionItem"], descendants: true }], ngImport: i0, template: "<div class=\"ss-container\">\n <form [formGroup]=\"searchForm\" (submit)=\"emitSimpleSearch()\" data-testid=\"searchForm\">\n <input\n #searchInput\n data-testid=\"searchInput\"\n id=\"q\"\n name=\"q\"\n type=\"text\"\n autocomplete=\"off\"\n required\n aria-required=\"true\"\n aria-label=\"search input\"\n autocapitalize=\"off\"\n formControlName=\"simpleQuery\"\n matTooltip=\"Fill out this field\"\n [matTooltipPosition]=\"'above'\"\n [matTooltipDisabled]=\"true\"\n [attr.aria-invalid]=\"isSubmitted && simpleQuery.invalid\"\n (keydown)=\"onInputKeydown($event)\"\n />\n <label for=\"q\" data-testid=\"label\">{{\n config.scope === 'local'\n ? 'Books, media, special collections and more'\n : 'Ebooks, articles, journals, databases, streaming media and more'\n }}</label>\n <button\n type=\"submit\"\n aria-label=\"search\"\n data-testid=\"searchBtn\"\n [ngClass]=\"{ ensign: config.institution === 'ensign' }\"\n >\n <span class=\"material-symbols-outlined ss-icon\"> search </span>\n </button>\n </form>\n\n @if (simpleQuery.value) {\n <button id=\"clear\" (click)=\"clearQuery()\" data-testid=\"clearBtn\">\n <span class=\"material-symbols-outlined ss-icon\"> cancel </span>\n </button>\n }\n\n @if (showSuggestions && suggestions.length > 0) {\n <ul class=\"suggestions-list\" role=\"listbox\" data-testid=\"suggestionsList\">\n @for (suggestion of suggestions; track $index; let i = $index) {\n <li\n #suggestionItem\n class=\"suggestion-item\"\n [class.selected]=\"i === selectedSuggestionIndex\"\n (click)=\"selectSuggestion(suggestion)\"\n (keydown.enter)=\"selectSuggestion(suggestion)\"\n (keydown.space)=\"selectSuggestion(suggestion); $event.preventDefault()\"\n role=\"option\"\n tabindex=\"0\"\n [attr.aria-selected]=\"i === selectedSuggestionIndex\"\n data-testid=\"suggestionItem\"\n >\n <span class=\"suggestion-text\" [title]=\"suggestion\">\n {{\n expandedSuggestions.has(i) || suggestion.length <= 500\n ? suggestion\n : (suggestion | slice: 0 : 500) + '...'\n }}\n </span>\n @if (suggestion.length > 500) {\n <button\n class=\"expand-btn\"\n (click)=\"toggleExpand(i, $event)\"\n [attr.aria-label]=\"\n expandedSuggestions.has(i) ? 'Collapse' : 'Expand suggestion'\n \"\n >\n <span class=\"material-symbols-outlined\">\n {{ expandedSuggestions.has(i) ? 'expand_less' : 'expand_more' }}\n </span>\n </button>\n }\n </li>\n }\n </ul>\n }\n</div>\n", styles: ["html{border:0;margin:0;padding:0;-webkit-text-size-adjust:100%}body{margin:0;padding:0}*,*:before,*:after{box-sizing:border-box}:root{--color-navy: #00245d;--color-royal: #0047ba;--color-white: #ffffff;--color-blue-500: #00245d;--color-blue-400: #003995;--color-blue-300: #0047ba;--color-blue-200: #336cc8;--color-blue-150: #ccdaf1;--color-blue-100: #e5edf8;--color-gray-500: #141414;--color-gray-400: #676767;--color-gray-300: #8f8f8f;--color-gray-200: #d0d0d0;--color-gray-100: #e7e7e7;--color-gray-50: #f9f9f9;--color-gray-brand-400: #676767;--color-green-500: #1d562e;--color-green-400: #2e8545;--color-green-300: #3ba35a;--color-green-200: #9dd1ac;--color-green-100: #ebf6ee;--color-teal-500: #26485f;--color-teal-400: #3e7295;--color-teal-300: #457fa6;--color-teal-200: #a2bfd3;--color-teal-100: #ecf2f6;--color-red-500: #702121;--color-red-400: #b33837;--color-red-300: #c73e3d;--color-red-200: #e39e9e;--color-red-100: #f9ecec;--color-yellow-500: #635f04;--color-yellow-400: #928c30;--color-yellow-300: #d1c844;--color-yellow-200: #e8e3a1;--color-yellow-100: #faf9ec;--color-purple-focus: #b967c7;--text-heading: #002e5d;--text-secondary-heading: #737373;--text-body: #141414;--text-disabled: #676767;--text-link: #336cc8;--text-on-action: #ffffff;--text-success: #1d562e;--text-info: #26485f;--text-error: #702121;--text-warning: #635f04;--surface-success: #ebf6ee;--surface-info: #ecf2f6;--surface-error: #f9ecec;--surface-warning: #faf9ec;--focus-ring-color: #b967c7}@font-face{font-family:Source Sans Pro;font-style:normal;font-weight:300;src:url(https://media.lib.byu.edu/web-assets/fonts/sourcesanspro/1.0.0/SourceSansPro-Light.ttf) format(\"truetype\");font-display:swap}@font-face{font-family:Source Sans Pro;font-style:normal;font-weight:400;src:url(https://media.lib.byu.edu/web-assets/fonts/sourcesanspro/1.0.0/SourceSansPro-Regular.ttf) format(\"truetype\");font-display:swap}@font-face{font-family:Source Sans Pro;font-style:normal;font-weight:600;src:url(https://media.lib.byu.edu/web-assets/fonts/sourcesanspro/1.0.0/SourceSansPro-Semibold.ttf) format(\"truetype\");font-display:swap}@font-face{font-family:Source Sans Pro;font-style:normal;font-weight:700;src:url(https://media.lib.byu.edu/web-assets/fonts/sourcesanspro/1.0.0/SourceSansPro-Bold.ttf) format(\"truetype\");font-display:swap}@font-face{font-family:Source Sans Pro;font-style:italic;font-weight:300;src:url(https://media.lib.byu.edu/web-assets/fonts/sourcesanspro/1.0.0/SourceSansPro-LightItalic.ttf) format(\"truetype\");font-display:swap}@font-face{font-family:Source Sans Pro;font-style:italic;font-weight:400;src:url(https://media.lib.byu.edu/web-assets/fonts/sourcesanspro/1.0.0/SourceSansPro-Italic.ttf) format(\"truetype\");font-display:swap}@font-face{font-family:Source Sans Pro;font-style:italic;font-weight:600;src:url(https://media.lib.byu.edu/web-assets/fonts/sourcesanspro/1.0.0/SourceSansPro-SemiboldItalic.ttf) format(\"truetype\");font-display:swap}@font-face{font-family:Source Sans Pro;font-style:italic;font-weight:700;src:url(https://media.lib.byu.edu/web-assets/fonts/sourcesanspro/1.0.0/SourceSansPro-BoldItalic.ttf) format(\"truetype\");font-display:swap}h1,h2,h3,h4,h5,h6,span:not(.material-symbols-outlined),a,p{font-family:Source Sans Pro}h1{font-weight:300;font-style:normal;color:var(--text-heading)}h2{font-weight:400;font-style:normal;color:var(--text-heading)}h3{font-weight:700;font-style:normal;color:var(--text-heading)}h4,h5,h6{font-weight:600;font-style:normal;color:var(--text-secondary-heading)}.hbll-default-body{font-weight:400;font-style:normal;max-width:35rem;min-width:22.25rem;color:var(--text-body)}.hbll-caption{font-weight:400;font-style:normal;max-width:25.25rem;min-width:17.5rem;color:var(--text-body)}.hbll-large{font-weight:400;font-style:normal;max-width:41.25rem;min-width:26.5rem;color:var(--text-body)}a{color:var(--text-link);text-decoration:underline}.hbll-emphasis{font-weight:600}h1{font-size:2rem;line-height:2.5rem}h2{font-size:1.75rem;line-height:2.25rem}h3,h4{font-size:1.5rem;line-height:2rem}h5,h6{font-size:1.25rem;line-height:1.75rem}.hbll-default-body{font-size:.875rem;line-height:1.25rem}.hbll-caption{font-size:.75rem;line-height:1rem}.hbll-large{font-size:1rem;line-height:1.5rem}@media screen and (min-width: 52.125em){h1{font-size:3rem;line-height:3.5rem}h2{font-size:2.5rem;line-height:3rem}h3{font-size:2rem;line-height:3rem}h4{font-size:1.75rem;line-height:2.5rem}h5{font-size:1.5rem;line-height:2rem}h6{font-size:1.25rem;line-height:1.75rem}.hbll-default-body{font-size:1rem;line-height:1.5rem}.hbll-caption{font-size:.75rem;line-height:1rem}.hbll-large{font-size:1.25rem;line-height:1.75rem}}@media screen and (min-width: 90em){h1{font-size:3.75rem;line-height:4.25rem}h2{font-size:3rem;line-height:3.5rem}h3{font-size:2.5rem;line-height:3rem}h4{font-size:2rem;line-height:2.5rem}h5{font-size:1.5rem;line-height:2rem}h6{font-size:1.25rem;line-height:1.75rem}.hbll-default-body{font-size:1rem;line-height:1.5rem}.hbll-caption{font-size:.75rem;line-height:1rem}.hbll-large{font-size:1.25rem;line-height:1.75rem}}:focus-visible{outline:.125rem solid var(--focus-ring-color);outline-offset:.125rem}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);border:0}.sr-only.sr-only-focusable:focus,.sr-only.sr-only-focusable:focus-within,.sr-only.sr-only-focusable:active{position:static;width:auto;height:auto;margin:0;overflow:visible;clip:auto}a,button{border:none;background:none;font-family:inherit;padding:0;margin:0;font-size:inherit;color:#0047ba;text-decoration:none;cursor:pointer}a:hover,button:hover{color:#003995}.ss-container{position:relative}form{display:flex}.ss-icon{font-size:1em}button[type=submit]{background:#fff;border-radius:0 4px 4px 0;margin:0;width:3em;cursor:pointer;display:flex;justify-content:center;align-items:center;transition:color .2s,background-color .2s}button[type=submit] .ss-icon{color:#0047ba;font-size:1.7em}button[type=submit]:hover .ss-icon{color:#a2bfd3}button[type=submit].ensign .ss-icon{color:#2b6042}button[type=submit].ensign .ss-icon:hover{color:#357551}#clear{position:absolute;right:3em;top:0%;height:100%;display:flex;justify-content:center;align-items:center;padding:0 0 0 .375rem}#clear .ss-icon{height:auto;color:#acacac;transition:color ease-in-out .05s}#clear:hover .ss-icon{color:#666}input[type=text]{background-color:#fff;color:#000;font-family:inherit;border:none;font-weight:600;margin:0;overflow:hidden;cursor:text;width:calc(100% - 3em);font-size:1em;border-radius:4px 0 0 4px;padding:.56em 2em .56em .56em}input[type=text]:focus{outline:none}input[type=text]:valid+label,input[type=text]:focus+label{font-size:.75em;top:-.8em;padding-top:0;padding-bottom:0;pointer-events:none;margin-top:0;margin-left:.56em;cursor:default}input[type=text]:valid+label:before,input[type=text]:focus+label:before{opacity:1}label{cursor:text;transition:all .1s ease-in-out;position:absolute;padding:.5em .28em;margin-left:.28em;left:0;color:#707070;z-index:1;max-width:calc(100% - 3.4em);white-space:nowrap;line-height:normal;overflow:hidden;text-overflow:ellipsis;border-radius:4px}label:before{transition:all .1s ease-in-out;background-color:#fff;content:\"\";position:absolute;inset:0;opacity:0;z-index:-1}.suggestions-list{position:absolute;top:100%;left:0;right:0;background:#fff;border:1px solid #d0d0d0;border-top:none;border-radius:0 0 4px 4px;list-style:none;margin:0;padding:0;max-height:300px;overflow-y:auto;box-shadow:0 4px 6px #0000001a;z-index:1000}.suggestion-item{padding:.75em 1em;cursor:pointer;transition:background-color .15s ease;color:#333;font-size:1em;display:flex;align-items:center;gap:.5em}.suggestion-item:hover,.suggestion-item.selected{background-color:#f0f0f0}.suggestion-item.selected{background-color:#e6f2ff}.suggestion-item:last-child{border-radius:0 0 4px 4px}.suggestion-text{flex:1;overflow-wrap:break-word}.expand-btn{background:none;border:none;cursor:pointer;padding:2px;display:flex;align-items:center;justify-content:center;color:#707070;border-radius:50%;transition:background-color .2s}.expand-btn:hover{background-color:#0000000d;color:#0047ba}.expand-btn .material-symbols-outlined{font-size:1.25em}\n"], dependencies: [{ kind: "ngmodule", type: MatTooltipModule }, { kind: "directive", type: i1$2.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$1.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: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$1.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i1$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "pipe", type: i1.SlicePipe, name: "slice" }] }); }
|
|
2936
2949
|
}
|
|
2937
2950
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: SimpleSearchComponent, decorators: [{
|
|
2938
2951
|
type: Component,
|
|
2939
|
-
args: [{ selector: 'lib-ss-simple-search', imports: [MatTooltipModule, MatIconModule, ReactiveFormsModule, CommonModule], template: "<div class=\"ss-container\">\n <form [formGroup]=\"searchForm\" (submit)=\"emitSimpleSearch()\" data-testid=\"searchForm\">\n <input\n #searchInput\n data-testid=\"searchInput\"\n id=\"q\"\n name=\"q\"\n type=\"text\"\n autocomplete=\"off\"\n required\n aria-required=\"true\"\n aria-label=\"search input\"\n autocapitalize=\"off\"\n formControlName=\"simpleQuery\"\n matTooltip=\"Fill out this field\"\n [matTooltipPosition]=\"'above'\"\n [matTooltipDisabled]=\"true\"\n [attr.aria-invalid]=\"isSubmitted && simpleQuery.invalid\"\n (keydown)=\"onInputKeydown($event)\"\n />\n <label for=\"q\" data-testid=\"label\">{{\n config.scope === 'local'\n ? 'Books, media, special collections and more'\n : 'Ebooks, articles, journals, databases, streaming media and more'\n }}</label>\n <button\n type=\"submit\"\n aria-label=\"search\"\n data-testid=\"searchBtn\"\n [ngClass]=\"{ ensign: config.institution === 'ensign' }\"\n >\n <span class=\"material-symbols-outlined ss-icon\"> search </span>\n </button>\n </form>\n\n @if (simpleQuery.value) {\n <button id=\"clear\" (click)=\"clearQuery()\" data-testid=\"clearBtn\">\n <span class=\"material-symbols-outlined ss-icon\"> cancel </span>\n </button>\n }\n\n @if (showSuggestions && suggestions.length > 0) {\n <ul class=\"suggestions-list\" role=\"listbox\" data-testid=\"suggestionsList\">\n @for (suggestion of suggestions; track $index; let i = $index) {\n <li\n #suggestionItem\n class=\"suggestion-item\"\n [class.selected]=\"i === selectedSuggestionIndex\"\n (click)=\"selectSuggestion(suggestion)\"\n (keydown.enter)=\"selectSuggestion(suggestion)\"\n (keydown.space)=\"selectSuggestion(suggestion); $event.preventDefault()\"\n role=\"option\"\n tabindex=\"0\"\n [attr.aria-selected]=\"i === selectedSuggestionIndex\"\n data-testid=\"suggestionItem\"\n >\n <span class=\"suggestion-text\" [title]=\"suggestion\">\n {{\n expandedSuggestions.has(i) || suggestion.length <= 500\n ? suggestion\n : (suggestion | slice: 0 : 500) + '...'\n }}\n </span>\n @if (suggestion.length > 500) {\n <button\n class=\"expand-btn\"\n (click)=\"toggleExpand(i, $event)\"\n [attr.aria-label]=\"\n expandedSuggestions.has(i) ? 'Collapse' : 'Expand suggestion'\n \"\n >\n <span class=\"material-symbols-outlined\">\n {{ expandedSuggestions.has(i) ? 'expand_less' : 'expand_more' }}\n </span>\n </button>\n }\n </li>\n }\n </ul>\n }\n</div>\n", styles: ["html{border:0;margin:0;padding:0;-webkit-text-size-adjust:100%}body{margin:0;padding:0}*,*:before,*:after{box-sizing:border-box}:root{--color-navy: #00245d;--color-royal: #0047ba;--color-white: #ffffff;--color-blue-500: #00245d;--color-blue-400: #003995;--color-blue-300: #0047ba;--color-blue-200: #336cc8;--color-blue-150: #ccdaf1;--color-blue-100: #e5edf8;--color-gray-500: #141414;--color-gray-400: #676767;--color-gray-300: #8f8f8f;--color-gray-200: #d0d0d0;--color-gray-100: #e7e7e7;--color-gray-50: #f9f9f9;--color-gray-brand-400: #676767;--color-green-500: #1d562e;--color-green-400: #2e8545;--color-green-300: #3ba35a;--color-green-200: #9dd1ac;--color-green-100: #ebf6ee;--color-teal-500: #26485f;--color-teal-400: #3e7295;--color-teal-300: #457fa6;--color-teal-200: #a2bfd3;--color-teal-100: #ecf2f6;--color-red-500: #702121;--color-red-400: #b33837;--color-red-300: #c73e3d;--color-red-200: #e39e9e;--color-red-100: #f9ecec;--color-yellow-500: #635f04;--color-yellow-400: #928c30;--color-yellow-300: #d1c844;--color-yellow-200: #e8e3a1;--color-yellow-100: #faf9ec;--color-purple-focus: #b967c7;--text-heading: #002e5d;--text-secondary-heading: #737373;--text-body: #141414;--text-disabled: #676767;--text-link: #336cc8;--text-on-action: #ffffff;--text-success: #1d562e;--text-info: #26485f;--text-error: #702121;--text-warning: #635f04;--surface-success: #ebf6ee;--surface-info: #ecf2f6;--surface-error: #f9ecec;--surface-warning: #faf9ec;--focus-ring-color: #b967c7}@font-face{font-family:Source Sans Pro;font-style:normal;font-weight:300;src:url(https://media.lib.byu.edu/web-assets/fonts/sourcesanspro/1.0.0/SourceSansPro-Light.ttf) format(\"truetype\");font-display:swap}@font-face{font-family:Source Sans Pro;font-style:normal;font-weight:400;src:url(https://media.lib.byu.edu/web-assets/fonts/sourcesanspro/1.0.0/SourceSansPro-Regular.ttf) format(\"truetype\");font-display:swap}@font-face{font-family:Source Sans Pro;font-style:normal;font-weight:600;src:url(https://media.lib.byu.edu/web-assets/fonts/sourcesanspro/1.0.0/SourceSansPro-Semibold.ttf) format(\"truetype\");font-display:swap}@font-face{font-family:Source Sans Pro;font-style:normal;font-weight:700;src:url(https://media.lib.byu.edu/web-assets/fonts/sourcesanspro/1.0.0/SourceSansPro-Bold.ttf) format(\"truetype\");font-display:swap}@font-face{font-family:Source Sans Pro;font-style:italic;font-weight:300;src:url(https://media.lib.byu.edu/web-assets/fonts/sourcesanspro/1.0.0/SourceSansPro-LightItalic.ttf) format(\"truetype\");font-display:swap}@font-face{font-family:Source Sans Pro;font-style:italic;font-weight:400;src:url(https://media.lib.byu.edu/web-assets/fonts/sourcesanspro/1.0.0/SourceSansPro-Italic.ttf) format(\"truetype\");font-display:swap}@font-face{font-family:Source Sans Pro;font-style:italic;font-weight:600;src:url(https://media.lib.byu.edu/web-assets/fonts/sourcesanspro/1.0.0/SourceSansPro-SemiboldItalic.ttf) format(\"truetype\");font-display:swap}@font-face{font-family:Source Sans Pro;font-style:italic;font-weight:700;src:url(https://media.lib.byu.edu/web-assets/fonts/sourcesanspro/1.0.0/SourceSansPro-BoldItalic.ttf) format(\"truetype\");font-display:swap}h1,h2,h3,h4,h5,h6,span:not(.material-symbols-outlined),a,p{font-family:Source Sans Pro}h1{font-weight:300;font-style:normal;color:var(--text-heading)}h2{font-weight:400;font-style:normal;color:var(--text-heading)}h3{font-weight:700;font-style:normal;color:var(--text-heading)}h4,h5,h6{font-weight:600;font-style:normal;color:var(--text-secondary-heading)}.hbll-default-body{font-weight:400;font-style:normal;max-width:35rem;min-width:22.25rem;color:var(--text-body)}.hbll-caption{font-weight:400;font-style:normal;max-width:25.25rem;min-width:17.5rem;color:var(--text-body)}.hbll-large{font-weight:400;font-style:normal;max-width:41.25rem;min-width:26.5rem;color:var(--text-body)}a{color:var(--text-link);text-decoration:underline}.hbll-emphasis{font-weight:600}h1{font-size:2rem;line-height:2.5rem}h2{font-size:1.75rem;line-height:2.25rem}h3,h4{font-size:1.5rem;line-height:2rem}h5,h6{font-size:1.25rem;line-height:1.75rem}.hbll-default-body{font-size:.875rem;line-height:1.25rem}.hbll-caption{font-size:.75rem;line-height:1rem}.hbll-large{font-size:1rem;line-height:1.5rem}@media screen and (min-width: 52.125em){h1{font-size:3rem;line-height:3.5rem}h2{font-size:2.5rem;line-height:3rem}h3{font-size:2rem;line-height:3rem}h4{font-size:1.75rem;line-height:2.5rem}h5{font-size:1.5rem;line-height:2rem}h6{font-size:1.25rem;line-height:1.75rem}.hbll-default-body{font-size:1rem;line-height:1.5rem}.hbll-caption{font-size:.75rem;line-height:1rem}.hbll-large{font-size:1.25rem;line-height:1.75rem}}@media screen and (min-width: 90em){h1{font-size:3.75rem;line-height:4.25rem}h2{font-size:3rem;line-height:3.5rem}h3{font-size:2.5rem;line-height:3rem}h4{font-size:2rem;line-height:2.5rem}h5{font-size:1.5rem;line-height:2rem}h6{font-size:1.25rem;line-height:1.75rem}.hbll-default-body{font-size:1rem;line-height:1.5rem}.hbll-caption{font-size:.75rem;line-height:1rem}.hbll-large{font-size:1.25rem;line-height:1.75rem}}:focus-visible{outline:.125rem solid var(--focus-ring-color);outline-offset:.125rem}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);border:0}.sr-only.sr-only-focusable:focus,.sr-only.sr-only-focusable:focus-within,.sr-only.sr-only-focusable:active{position:static;width:auto;height:auto;margin:0;overflow:visible;clip:auto}a,button{border:none;background:none;font-family:inherit;padding:0;margin:0;font-size:inherit;color:#0047ba;text-decoration:none;cursor:pointer}a:hover,button:hover{color:#003995}.ss-container{position:relative}form{display:flex}.ss-icon{font-size:1em}button[type=submit]{background:#fff;border-radius:0 4px 4px 0;margin:0;width:3em;cursor:pointer;display:flex;justify-content:center;align-items:center;transition:color .2s,background-color .2s}button[type=submit] .ss-icon{color:#0047ba;font-size:1.7em}button[type=submit]:hover .ss-icon{color:#6892ca}button[type=submit].ensign .ss-icon{color:#2b6042}button[type=submit].ensign .ss-icon:hover{color:#357551}#clear{position:absolute;right:3em;top:0%;height:100%;display:flex;justify-content:center;align-items:center;padding:0 0 0 .375rem}#clear .ss-icon{height:auto;color:#acacac;transition:color ease-in-out .05s}#clear:hover .ss-icon{color:#666}input[type=text]{background-color:#fff;color:#000;font-family:inherit;border:none;font-weight:600;margin:0;overflow:hidden;cursor:text;width:calc(100% - 3em);font-size:1em;border-radius:4px 0 0 4px;padding:.56em 2em .56em .56em}input[type=text]:focus{outline:none}input[type=text]:valid+label,input[type=text]:focus+label{font-size:.75em;top:-.8em;padding-top:0;padding-bottom:0;pointer-events:none;margin-top:0;margin-left:.56em;cursor:default}input[type=text]:valid+label:before,input[type=text]:focus+label:before{opacity:1}label{cursor:text;transition:all .1s ease-in-out;position:absolute;padding:.5em .28em;margin-left:.28em;left:0;color:#707070;z-index:1;max-width:calc(100% - 3.4em);white-space:nowrap;line-height:normal;overflow:hidden;text-overflow:ellipsis;border-radius:4px}label:before{transition:all .1s ease-in-out;background-color:#fff;content:\"\";position:absolute;inset:0;opacity:0;z-index:-1}.suggestions-list{position:absolute;top:100%;left:0;right:0;background:#fff;border:1px solid #d0d0d0;border-top:none;border-radius:0 0 4px 4px;list-style:none;margin:0;padding:0;max-height:300px;overflow-y:auto;box-shadow:0 4px 6px #0000001a;z-index:1000}.suggestion-item{padding:.75em 1em;cursor:pointer;transition:background-color .15s ease;color:#333;font-size:1em;display:flex;align-items:center;gap:.5em}.suggestion-item:hover,.suggestion-item.selected{background-color:#f0f0f0}.suggestion-item.selected{background-color:#e6f2ff}.suggestion-item:last-child{border-radius:0 0 4px 4px}.suggestion-text{flex:1;overflow-wrap:break-word}.expand-btn{background:none;border:none;cursor:pointer;padding:2px;display:flex;align-items:center;justify-content:center;color:#707070;border-radius:50%;transition:background-color .2s}.expand-btn:hover{background-color:#0000000d;color:#0047ba}.expand-btn .material-symbols-outlined{font-size:1.25em}\n"] }]
|
|
2952
|
+
args: [{ selector: 'lib-ss-simple-search', imports: [MatTooltipModule, MatIconModule, ReactiveFormsModule, CommonModule], template: "<div class=\"ss-container\">\n <form [formGroup]=\"searchForm\" (submit)=\"emitSimpleSearch()\" data-testid=\"searchForm\">\n <input\n #searchInput\n data-testid=\"searchInput\"\n id=\"q\"\n name=\"q\"\n type=\"text\"\n autocomplete=\"off\"\n required\n aria-required=\"true\"\n aria-label=\"search input\"\n autocapitalize=\"off\"\n formControlName=\"simpleQuery\"\n matTooltip=\"Fill out this field\"\n [matTooltipPosition]=\"'above'\"\n [matTooltipDisabled]=\"true\"\n [attr.aria-invalid]=\"isSubmitted && simpleQuery.invalid\"\n (keydown)=\"onInputKeydown($event)\"\n />\n <label for=\"q\" data-testid=\"label\">{{\n config.scope === 'local'\n ? 'Books, media, special collections and more'\n : 'Ebooks, articles, journals, databases, streaming media and more'\n }}</label>\n <button\n type=\"submit\"\n aria-label=\"search\"\n data-testid=\"searchBtn\"\n [ngClass]=\"{ ensign: config.institution === 'ensign' }\"\n >\n <span class=\"material-symbols-outlined ss-icon\"> search </span>\n </button>\n </form>\n\n @if (simpleQuery.value) {\n <button id=\"clear\" (click)=\"clearQuery()\" data-testid=\"clearBtn\">\n <span class=\"material-symbols-outlined ss-icon\"> cancel </span>\n </button>\n }\n\n @if (showSuggestions && suggestions.length > 0) {\n <ul class=\"suggestions-list\" role=\"listbox\" data-testid=\"suggestionsList\">\n @for (suggestion of suggestions; track $index; let i = $index) {\n <li\n #suggestionItem\n class=\"suggestion-item\"\n [class.selected]=\"i === selectedSuggestionIndex\"\n (click)=\"selectSuggestion(suggestion)\"\n (keydown.enter)=\"selectSuggestion(suggestion)\"\n (keydown.space)=\"selectSuggestion(suggestion); $event.preventDefault()\"\n role=\"option\"\n tabindex=\"0\"\n [attr.aria-selected]=\"i === selectedSuggestionIndex\"\n data-testid=\"suggestionItem\"\n >\n <span class=\"suggestion-text\" [title]=\"suggestion\">\n {{\n expandedSuggestions.has(i) || suggestion.length <= 500\n ? suggestion\n : (suggestion | slice: 0 : 500) + '...'\n }}\n </span>\n @if (suggestion.length > 500) {\n <button\n class=\"expand-btn\"\n (click)=\"toggleExpand(i, $event)\"\n [attr.aria-label]=\"\n expandedSuggestions.has(i) ? 'Collapse' : 'Expand suggestion'\n \"\n >\n <span class=\"material-symbols-outlined\">\n {{ expandedSuggestions.has(i) ? 'expand_less' : 'expand_more' }}\n </span>\n </button>\n }\n </li>\n }\n </ul>\n }\n</div>\n", styles: ["html{border:0;margin:0;padding:0;-webkit-text-size-adjust:100%}body{margin:0;padding:0}*,*:before,*:after{box-sizing:border-box}:root{--color-navy: #00245d;--color-royal: #0047ba;--color-white: #ffffff;--color-blue-500: #00245d;--color-blue-400: #003995;--color-blue-300: #0047ba;--color-blue-200: #336cc8;--color-blue-150: #ccdaf1;--color-blue-100: #e5edf8;--color-gray-500: #141414;--color-gray-400: #676767;--color-gray-300: #8f8f8f;--color-gray-200: #d0d0d0;--color-gray-100: #e7e7e7;--color-gray-50: #f9f9f9;--color-gray-brand-400: #676767;--color-green-500: #1d562e;--color-green-400: #2e8545;--color-green-300: #3ba35a;--color-green-200: #9dd1ac;--color-green-100: #ebf6ee;--color-teal-500: #26485f;--color-teal-400: #3e7295;--color-teal-300: #457fa6;--color-teal-200: #a2bfd3;--color-teal-100: #ecf2f6;--color-red-500: #702121;--color-red-400: #b33837;--color-red-300: #c73e3d;--color-red-200: #e39e9e;--color-red-100: #f9ecec;--color-yellow-500: #635f04;--color-yellow-400: #928c30;--color-yellow-300: #d1c844;--color-yellow-200: #e8e3a1;--color-yellow-100: #faf9ec;--color-purple-focus: #b967c7;--text-heading: #002e5d;--text-secondary-heading: #737373;--text-body: #141414;--text-disabled: #676767;--text-link: #336cc8;--text-on-action: #ffffff;--text-success: #1d562e;--text-info: #26485f;--text-error: #702121;--text-warning: #635f04;--surface-success: #ebf6ee;--surface-info: #ecf2f6;--surface-error: #f9ecec;--surface-warning: #faf9ec;--focus-ring-color: #b967c7}@font-face{font-family:Source Sans Pro;font-style:normal;font-weight:300;src:url(https://media.lib.byu.edu/web-assets/fonts/sourcesanspro/1.0.0/SourceSansPro-Light.ttf) format(\"truetype\");font-display:swap}@font-face{font-family:Source Sans Pro;font-style:normal;font-weight:400;src:url(https://media.lib.byu.edu/web-assets/fonts/sourcesanspro/1.0.0/SourceSansPro-Regular.ttf) format(\"truetype\");font-display:swap}@font-face{font-family:Source Sans Pro;font-style:normal;font-weight:600;src:url(https://media.lib.byu.edu/web-assets/fonts/sourcesanspro/1.0.0/SourceSansPro-Semibold.ttf) format(\"truetype\");font-display:swap}@font-face{font-family:Source Sans Pro;font-style:normal;font-weight:700;src:url(https://media.lib.byu.edu/web-assets/fonts/sourcesanspro/1.0.0/SourceSansPro-Bold.ttf) format(\"truetype\");font-display:swap}@font-face{font-family:Source Sans Pro;font-style:italic;font-weight:300;src:url(https://media.lib.byu.edu/web-assets/fonts/sourcesanspro/1.0.0/SourceSansPro-LightItalic.ttf) format(\"truetype\");font-display:swap}@font-face{font-family:Source Sans Pro;font-style:italic;font-weight:400;src:url(https://media.lib.byu.edu/web-assets/fonts/sourcesanspro/1.0.0/SourceSansPro-Italic.ttf) format(\"truetype\");font-display:swap}@font-face{font-family:Source Sans Pro;font-style:italic;font-weight:600;src:url(https://media.lib.byu.edu/web-assets/fonts/sourcesanspro/1.0.0/SourceSansPro-SemiboldItalic.ttf) format(\"truetype\");font-display:swap}@font-face{font-family:Source Sans Pro;font-style:italic;font-weight:700;src:url(https://media.lib.byu.edu/web-assets/fonts/sourcesanspro/1.0.0/SourceSansPro-BoldItalic.ttf) format(\"truetype\");font-display:swap}h1,h2,h3,h4,h5,h6,span:not(.material-symbols-outlined),a,p{font-family:Source Sans Pro}h1{font-weight:300;font-style:normal;color:var(--text-heading)}h2{font-weight:400;font-style:normal;color:var(--text-heading)}h3{font-weight:700;font-style:normal;color:var(--text-heading)}h4,h5,h6{font-weight:600;font-style:normal;color:var(--text-secondary-heading)}.hbll-default-body{font-weight:400;font-style:normal;max-width:35rem;min-width:22.25rem;color:var(--text-body)}.hbll-caption{font-weight:400;font-style:normal;max-width:25.25rem;min-width:17.5rem;color:var(--text-body)}.hbll-large{font-weight:400;font-style:normal;max-width:41.25rem;min-width:26.5rem;color:var(--text-body)}a{color:var(--text-link);text-decoration:underline}.hbll-emphasis{font-weight:600}h1{font-size:2rem;line-height:2.5rem}h2{font-size:1.75rem;line-height:2.25rem}h3,h4{font-size:1.5rem;line-height:2rem}h5,h6{font-size:1.25rem;line-height:1.75rem}.hbll-default-body{font-size:.875rem;line-height:1.25rem}.hbll-caption{font-size:.75rem;line-height:1rem}.hbll-large{font-size:1rem;line-height:1.5rem}@media screen and (min-width: 52.125em){h1{font-size:3rem;line-height:3.5rem}h2{font-size:2.5rem;line-height:3rem}h3{font-size:2rem;line-height:3rem}h4{font-size:1.75rem;line-height:2.5rem}h5{font-size:1.5rem;line-height:2rem}h6{font-size:1.25rem;line-height:1.75rem}.hbll-default-body{font-size:1rem;line-height:1.5rem}.hbll-caption{font-size:.75rem;line-height:1rem}.hbll-large{font-size:1.25rem;line-height:1.75rem}}@media screen and (min-width: 90em){h1{font-size:3.75rem;line-height:4.25rem}h2{font-size:3rem;line-height:3.5rem}h3{font-size:2.5rem;line-height:3rem}h4{font-size:2rem;line-height:2.5rem}h5{font-size:1.5rem;line-height:2rem}h6{font-size:1.25rem;line-height:1.75rem}.hbll-default-body{font-size:1rem;line-height:1.5rem}.hbll-caption{font-size:.75rem;line-height:1rem}.hbll-large{font-size:1.25rem;line-height:1.75rem}}:focus-visible{outline:.125rem solid var(--focus-ring-color);outline-offset:.125rem}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);border:0}.sr-only.sr-only-focusable:focus,.sr-only.sr-only-focusable:focus-within,.sr-only.sr-only-focusable:active{position:static;width:auto;height:auto;margin:0;overflow:visible;clip:auto}a,button{border:none;background:none;font-family:inherit;padding:0;margin:0;font-size:inherit;color:#0047ba;text-decoration:none;cursor:pointer}a:hover,button:hover{color:#003995}.ss-container{position:relative}form{display:flex}.ss-icon{font-size:1em}button[type=submit]{background:#fff;border-radius:0 4px 4px 0;margin:0;width:3em;cursor:pointer;display:flex;justify-content:center;align-items:center;transition:color .2s,background-color .2s}button[type=submit] .ss-icon{color:#0047ba;font-size:1.7em}button[type=submit]:hover .ss-icon{color:#a2bfd3}button[type=submit].ensign .ss-icon{color:#2b6042}button[type=submit].ensign .ss-icon:hover{color:#357551}#clear{position:absolute;right:3em;top:0%;height:100%;display:flex;justify-content:center;align-items:center;padding:0 0 0 .375rem}#clear .ss-icon{height:auto;color:#acacac;transition:color ease-in-out .05s}#clear:hover .ss-icon{color:#666}input[type=text]{background-color:#fff;color:#000;font-family:inherit;border:none;font-weight:600;margin:0;overflow:hidden;cursor:text;width:calc(100% - 3em);font-size:1em;border-radius:4px 0 0 4px;padding:.56em 2em .56em .56em}input[type=text]:focus{outline:none}input[type=text]:valid+label,input[type=text]:focus+label{font-size:.75em;top:-.8em;padding-top:0;padding-bottom:0;pointer-events:none;margin-top:0;margin-left:.56em;cursor:default}input[type=text]:valid+label:before,input[type=text]:focus+label:before{opacity:1}label{cursor:text;transition:all .1s ease-in-out;position:absolute;padding:.5em .28em;margin-left:.28em;left:0;color:#707070;z-index:1;max-width:calc(100% - 3.4em);white-space:nowrap;line-height:normal;overflow:hidden;text-overflow:ellipsis;border-radius:4px}label:before{transition:all .1s ease-in-out;background-color:#fff;content:\"\";position:absolute;inset:0;opacity:0;z-index:-1}.suggestions-list{position:absolute;top:100%;left:0;right:0;background:#fff;border:1px solid #d0d0d0;border-top:none;border-radius:0 0 4px 4px;list-style:none;margin:0;padding:0;max-height:300px;overflow-y:auto;box-shadow:0 4px 6px #0000001a;z-index:1000}.suggestion-item{padding:.75em 1em;cursor:pointer;transition:background-color .15s ease;color:#333;font-size:1em;display:flex;align-items:center;gap:.5em}.suggestion-item:hover,.suggestion-item.selected{background-color:#f0f0f0}.suggestion-item.selected{background-color:#e6f2ff}.suggestion-item:last-child{border-radius:0 0 4px 4px}.suggestion-text{flex:1;overflow-wrap:break-word}.expand-btn{background:none;border:none;cursor:pointer;padding:2px;display:flex;align-items:center;justify-content:center;color:#707070;border-radius:50%;transition:background-color .2s}.expand-btn:hover{background-color:#0000000d;color:#0047ba}.expand-btn .material-symbols-outlined{font-size:1.25em}\n"] }]
|
|
2940
2953
|
}], ctorParameters: () => [], propDecorators: { searchText: [{ type: i0.Input, args: [{ isSignal: true, alias: "searchText", required: false }] }, { type: i0.Output, args: ["searchTextChange"] }], searchInput: [{
|
|
2941
2954
|
type: ViewChild,
|
|
2942
2955
|
args: ['searchInput']
|
|
@@ -3070,7 +3083,7 @@ class SsSearchBarComponent {
|
|
|
3070
3083
|
}
|
|
3071
3084
|
}
|
|
3072
3085
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: SsSearchBarComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
3073
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.15", type: SsSearchBarComponent, isStandalone: true, selector: "lib-ss-search-bar", inputs: { searchText: { classPropertyName: "searchText", publicName: "searchText", isSignal: true, isRequired: false, transformFunction: null }, config: { classPropertyName: "config", publicName: "config", isSignal: false, isRequired: true, transformFunction: null }, supportedSuggestionScopes: { classPropertyName: "supportedSuggestionScopes", publicName: "supportedSuggestionScopes", isSignal: false, isRequired: false, transformFunction: null }, suggestions: { classPropertyName: "suggestions", publicName: "suggestions", isSignal: false, isRequired: false, transformFunction: null } }, outputs: { searchText: "searchTextChange", simpleSearch: "simpleSearch", clearSimpleSearch: "clearSimpleSearch", advancedSearch: "advancedSearch", advancedSearchClosed: "advancedSearchClosed", advancedSearchOpen: "advancedSearchOpen", tabChange: "tabChange", suggest: "suggest" }, providers: [FieldByScopePipe], viewQueries: [{ propertyName: "barWrapperRef", first: true, predicate: ["barWrapperRef"], descendants: true }, { propertyName: "advSearchCloseBtn", first: true, predicate: ["advSearchCloseBtn"], descendants: true }], ngImport: i0, template: "<div id=\"ssSearchBar\">\n <div class=\"tabs\">\n <button\n (click)=\"emitTabChange('local')\"\n class=\"ss-tab\"\n id=\"localTab\"\n [ngClass]=\"{\n 'ss-active': config.scope === 'local',\n ensign: config.institution === 'ensign' && config.scope !== 'local',\n }\"\n data-testid=\"localTab\"\n [disabled]=\"config.scope === 'local'\"\n >\n In the Library\n </button>\n @if (config.institution !== 'law') {\n <div class=\"tab-spacer\"></div>\n <button\n (click)=\"emitTabChange('external')\"\n class=\"ss-tab\"\n id=\"externalTab\"\n [ngClass]=\"{\n 'ss-active': config.scope === 'external',\n ensign: config.institution === 'ensign' && config.scope !== 'external',\n }\"\n data-testid=\"externalTab\"\n [disabled]=\"config.scope === 'external'\"\n >\n Available Online\n </button>\n }\n <div class=\"tab-spacer full\"></div>\n </div>\n <div\n class=\"ss-bar-wrapper\"\n #barWrapperRef\n [@libHbllExpandCollapse]=\"{\n value: config.showAdvancedSearch ? (!config.showAdvancedSearchAsText ? 1 : 2) : 3,\n params: { startHeight: heightOfContainer },\n }\"\n >\n <div class=\"ss-bar-content\" data-testid=\"searchForm\">\n @if (!config.showAdvancedSearch) {\n <div class=\"ss-search-bar\">\n <lib-ss-simple-search\n [config]=\"config\"\n [supportedSuggestionScopes]=\"supportedSuggestionScopes\"\n [suggestions]=\"suggestions\"\n (simpleSearch)=\"emitSimpleSearch($event)\"\n (clearSimpleSearch)=\"emitClearSimpleSearch()\"\n (suggest)=\"suggest.emit($event)\"\n [(searchText)]=\"searchText\"\n ></lib-ss-simple-search>\n </div>\n } @else {\n <button\n #advSearchCloseBtn\n id=\"advSearchCloseBtn\"\n (click)=\"emitAdvancedSearchClosed()\"\n data-testid=\"advSearchCloseBtn\"\n >\n <span class=\"material-symbols-outlined ss-icon\"> close </span>\n </button>\n <div id=\"advSearchWrapper\">\n @if (config.showAdvancedSearch && !config.showAdvancedSearchAsText) {\n <div>\n <lib-ss-advanced-search\n [config]=\"config\"\n (advancedSearch)=\"emitAdvancedSearch($event)\"\n ></lib-ss-advanced-search>\n </div>\n } @else {\n <div\n class=\"ss-adv-search-text\"\n data-testid=\"advancedSearchText\"\n [innerHTML]=\"\n config.advancedSearchQueryRows | ssAdvancedQueries: config.scope\n \"\n ></div>\n <div\n [innerHTML]=\"\n config.advancedSearchQueryRows | advancedFieldWarning: config.scope\n \"\n ></div>\n }\n </div>\n }\n </div>\n @if (!config.showAdvancedSearch || config.showAdvancedSearchAsText) {\n <button\n data-testid=\"toggleAdvSearchButton\"\n class=\"ss-adv-search-btn\"\n id=\"advSearchBtn\"\n (click)=\"emitAdvancedSearchOpen()\"\n >\n Advanced\n <span class=\"material-symbols-outlined ss-icon\"> keyboard_arrow_down </span>\n </button>\n }\n </div>\n</div>\n", styles: ["#ssSearchBar .tabs .ss-tab.ensign{background-color:#2b6042!important;border-color:#2a6142}#ssSearchBar .tabs .ss-tab.ensign:hover{background-color:#357551!important}html{border:0;margin:0;padding:0;-webkit-text-size-adjust:100%}body{margin:0;padding:0}*,*:before,*:after{box-sizing:border-box}:root{--color-navy: #00245d;--color-royal: #0047ba;--color-white: #ffffff;--color-blue-500: #00245d;--color-blue-400: #003995;--color-blue-300: #0047ba;--color-blue-200: #336cc8;--color-blue-150: #ccdaf1;--color-blue-100: #e5edf8;--color-gray-500: #141414;--color-gray-400: #676767;--color-gray-300: #8f8f8f;--color-gray-200: #d0d0d0;--color-gray-100: #e7e7e7;--color-gray-50: #f9f9f9;--color-gray-brand-400: #676767;--color-green-500: #1d562e;--color-green-400: #2e8545;--color-green-300: #3ba35a;--color-green-200: #9dd1ac;--color-green-100: #ebf6ee;--color-teal-500: #26485f;--color-teal-400: #3e7295;--color-teal-300: #457fa6;--color-teal-200: #a2bfd3;--color-teal-100: #ecf2f6;--color-red-500: #702121;--color-red-400: #b33837;--color-red-300: #c73e3d;--color-red-200: #e39e9e;--color-red-100: #f9ecec;--color-yellow-500: #635f04;--color-yellow-400: #928c30;--color-yellow-300: #d1c844;--color-yellow-200: #e8e3a1;--color-yellow-100: #faf9ec;--color-purple-focus: #b967c7;--text-heading: #002e5d;--text-secondary-heading: #737373;--text-body: #141414;--text-disabled: #676767;--text-link: #336cc8;--text-on-action: #ffffff;--text-success: #1d562e;--text-info: #26485f;--text-error: #702121;--text-warning: #635f04;--surface-success: #ebf6ee;--surface-info: #ecf2f6;--surface-error: #f9ecec;--surface-warning: #faf9ec;--focus-ring-color: #b967c7}@font-face{font-family:Source Sans Pro;font-style:normal;font-weight:300;src:url(https://media.lib.byu.edu/web-assets/fonts/sourcesanspro/1.0.0/SourceSansPro-Light.ttf) format(\"truetype\");font-display:swap}@font-face{font-family:Source Sans Pro;font-style:normal;font-weight:400;src:url(https://media.lib.byu.edu/web-assets/fonts/sourcesanspro/1.0.0/SourceSansPro-Regular.ttf) format(\"truetype\");font-display:swap}@font-face{font-family:Source Sans Pro;font-style:normal;font-weight:600;src:url(https://media.lib.byu.edu/web-assets/fonts/sourcesanspro/1.0.0/SourceSansPro-Semibold.ttf) format(\"truetype\");font-display:swap}@font-face{font-family:Source Sans Pro;font-style:normal;font-weight:700;src:url(https://media.lib.byu.edu/web-assets/fonts/sourcesanspro/1.0.0/SourceSansPro-Bold.ttf) format(\"truetype\");font-display:swap}@font-face{font-family:Source Sans Pro;font-style:italic;font-weight:300;src:url(https://media.lib.byu.edu/web-assets/fonts/sourcesanspro/1.0.0/SourceSansPro-LightItalic.ttf) format(\"truetype\");font-display:swap}@font-face{font-family:Source Sans Pro;font-style:italic;font-weight:400;src:url(https://media.lib.byu.edu/web-assets/fonts/sourcesanspro/1.0.0/SourceSansPro-Italic.ttf) format(\"truetype\");font-display:swap}@font-face{font-family:Source Sans Pro;font-style:italic;font-weight:600;src:url(https://media.lib.byu.edu/web-assets/fonts/sourcesanspro/1.0.0/SourceSansPro-SemiboldItalic.ttf) format(\"truetype\");font-display:swap}@font-face{font-family:Source Sans Pro;font-style:italic;font-weight:700;src:url(https://media.lib.byu.edu/web-assets/fonts/sourcesanspro/1.0.0/SourceSansPro-BoldItalic.ttf) format(\"truetype\");font-display:swap}h1,h2,h3,h4,h5,h6,span:not(.material-symbols-outlined),a,p{font-family:Source Sans Pro}h1{font-weight:300;font-style:normal;color:var(--text-heading)}h2{font-weight:400;font-style:normal;color:var(--text-heading)}h3{font-weight:700;font-style:normal;color:var(--text-heading)}h4,h5,h6{font-weight:600;font-style:normal;color:var(--text-secondary-heading)}.hbll-default-body{font-weight:400;font-style:normal;max-width:35rem;min-width:22.25rem;color:var(--text-body)}.hbll-caption{font-weight:400;font-style:normal;max-width:25.25rem;min-width:17.5rem;color:var(--text-body)}.hbll-large{font-weight:400;font-style:normal;max-width:41.25rem;min-width:26.5rem;color:var(--text-body)}a{color:var(--text-link);text-decoration:underline}.hbll-emphasis{font-weight:600}h1{font-size:2rem;line-height:2.5rem}h2{font-size:1.75rem;line-height:2.25rem}h3,h4{font-size:1.5rem;line-height:2rem}h5,h6{font-size:1.25rem;line-height:1.75rem}.hbll-default-body{font-size:.875rem;line-height:1.25rem}.hbll-caption{font-size:.75rem;line-height:1rem}.hbll-large{font-size:1rem;line-height:1.5rem}@media screen and (min-width: 52.125em){h1{font-size:3rem;line-height:3.5rem}h2{font-size:2.5rem;line-height:3rem}h3{font-size:2rem;line-height:3rem}h4{font-size:1.75rem;line-height:2.5rem}h5{font-size:1.5rem;line-height:2rem}h6{font-size:1.25rem;line-height:1.75rem}.hbll-default-body{font-size:1rem;line-height:1.5rem}.hbll-caption{font-size:.75rem;line-height:1rem}.hbll-large{font-size:1.25rem;line-height:1.75rem}}@media screen and (min-width: 90em){h1{font-size:3.75rem;line-height:4.25rem}h2{font-size:3rem;line-height:3.5rem}h3{font-size:2.5rem;line-height:3rem}h4{font-size:2rem;line-height:2.5rem}h5{font-size:1.5rem;line-height:2rem}h6{font-size:1.25rem;line-height:1.75rem}.hbll-default-body{font-size:1rem;line-height:1.5rem}.hbll-caption{font-size:.75rem;line-height:1rem}.hbll-large{font-size:1.25rem;line-height:1.75rem}}:focus-visible{outline:.125rem solid var(--focus-ring-color);outline-offset:.125rem}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);border:0}.sr-only.sr-only-focusable:focus,.sr-only.sr-only-focusable:focus-within,.sr-only.sr-only-focusable:active{position:static;width:auto;height:auto;margin:0;overflow:visible;clip:auto}a,button{border:none;background:none;font-family:inherit;padding:0;margin:0;font-size:inherit;color:#0047ba;text-decoration:none;cursor:pointer}a:hover,button:hover{color:#003995}.mat-mdc-tooltip-surface{background-color:#333!important;border-radius:3px!important;color:#fff!important;font:inherit!important;font-size:.8em!important}#ssSearchBar{display:flex;align-items:flex-start;flex-wrap:wrap;position:relative;color:#444}#ssSearchBar .tabs{display:flex;width:100%;margin-bottom:-1px;z-index:10;pointer-events:none}#ssSearchBar .tabs .ss-tab{border-radius:4px 4px 0 0;border:#b7b7b7 solid 1px;border-color:#1967e5;border-bottom:none;padding:.3em 1.4em;font-size:.94em;letter-spacing:.4px;font-weight:600;background-color:#0047ba;color:#fff;white-space:nowrap;position:relative;pointer-events:auto}#ssSearchBar .tabs .ss-tab:after{content:\"\";height:1px;width:calc(100% + 2px);position:absolute;bottom:0;left:-1px;background-color:#b7b7b7}#ssSearchBar .tabs .ss-tab:hover{background-color:#1967e5}#ssSearchBar .tabs .ss-tab.ss-active{color:#002e5d;margin-bottom:1px;border-color:#b7b7b7;background-color:#fffffff2}#ssSearchBar .tabs .ss-tab.ss-active:after{display:none}#ssSearchBar .tabs .ss-tab:disabled{cursor:auto}#ssSearchBar .tabs .tab-spacer{width:.3em;border-bottom:#b7b7b7 solid 1px;position:relative}#ssSearchBar .tabs .tab-spacer:before{content:\"\";position:absolute;left:-1px;bottom:-1px;width:1px;height:1px;background-color:#b7b7b7}#ssSearchBar .tabs .tab-spacer:after{content:\"\";position:absolute;right:-1px;bottom:-1px;width:1px;height:1px;background-color:#b7b7b7}#ssSearchBar .tabs .tab-spacer.full{width:100%;margin-right:4px;position:relative}#ssSearchBar .ss-adv-search-text{padding-bottom:1em;padding-right:1.25rem;pointer-events:none}#ssSearchBar .ss-bar-wrapper{padding:1em 1em .25em;border-right:#b7b7b7 solid 1px;border-left:#b7b7b7 solid 1px;border-bottom:#b7b7b7 solid 1px;width:100%;display:flex;align-items:center;flex-wrap:wrap;position:relative;background-color:#fffffff2;border-radius:0 4px 4px}#ssSearchBar .ss-bar-wrapper:after{content:\"\";position:absolute;top:0;right:-1px;background-color:transparent;border-radius:0 4px 0 0;width:4px;height:4px;border-top:#b7b7b7 solid 1px;border-right:#b7b7b7 solid 1px}#ssSearchBar .ss-bar-content{position:relative;width:100%;height:initial}#ssSearchBar .ss-search-bar{border-radius:4px;border:#b7b7b7 solid 1px;width:100%}#ssSearchBar #advSearchCloseBtn{float:right;padding:.4em;margin:-.4em 0;color:#666;transition:all .1s}#ssSearchBar #advSearchCloseBtn:hover{color:#292929}#ssSearchBar #advSearchCloseBtn .ss-icon{font-size:1.2em;font-weight:600}#ssSearchBar .ss-adv-search-btn{font-size:.9em;color:#4070b0;margin:.2em 4em 0 auto;padding-right:.25rem;padding-top:2px;padding-bottom:2px;display:flex;justify-content:center;align-items:center}#ssSearchBar .ss-adv-search-btn .ss-icon{font-size:1.4em;opacity:.75;margin-top:.125rem}#ssSearchBar .ss-adv-search-btn:hover{color:#6892ca}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: AdvancedSearchComponent, selector: "lib-ss-advanced-search", inputs: ["config"], outputs: ["advancedSearch"] }, { kind: "component", type: SimpleSearchComponent, selector: "lib-ss-simple-search", inputs: ["searchText", "config", "supportedSuggestionScopes", "suggestions"], outputs: ["searchTextChange", "simpleSearch", "clearSimpleSearch", "suggest"] }, { kind: "pipe", type: SsAdvancedQueriesPipe, name: "ssAdvancedQueries" }, { kind: "pipe", type: AdvancedFieldWarningPipe, name: "advancedFieldWarning" }], animations: [libHbllExpandCollapse], encapsulation: i0.ViewEncapsulation.None }); }
|
|
3086
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.15", type: SsSearchBarComponent, isStandalone: true, selector: "lib-ss-search-bar", inputs: { searchText: { classPropertyName: "searchText", publicName: "searchText", isSignal: true, isRequired: false, transformFunction: null }, config: { classPropertyName: "config", publicName: "config", isSignal: false, isRequired: true, transformFunction: null }, supportedSuggestionScopes: { classPropertyName: "supportedSuggestionScopes", publicName: "supportedSuggestionScopes", isSignal: false, isRequired: false, transformFunction: null }, suggestions: { classPropertyName: "suggestions", publicName: "suggestions", isSignal: false, isRequired: false, transformFunction: null } }, outputs: { searchText: "searchTextChange", simpleSearch: "simpleSearch", clearSimpleSearch: "clearSimpleSearch", advancedSearch: "advancedSearch", advancedSearchClosed: "advancedSearchClosed", advancedSearchOpen: "advancedSearchOpen", tabChange: "tabChange", suggest: "suggest" }, providers: [FieldByScopePipe], viewQueries: [{ propertyName: "barWrapperRef", first: true, predicate: ["barWrapperRef"], descendants: true }, { propertyName: "advSearchCloseBtn", first: true, predicate: ["advSearchCloseBtn"], descendants: true }], ngImport: i0, template: "<div id=\"ssSearchBar\">\n <div class=\"tabs\">\n <button\n (click)=\"emitTabChange('local')\"\n class=\"ss-tab\"\n id=\"localTab\"\n [ngClass]=\"{\n 'ss-active': config.scope === 'local',\n ensign: config.institution === 'ensign' && config.scope !== 'local',\n }\"\n data-testid=\"localTab\"\n [disabled]=\"config.scope === 'local'\"\n >\n In the Library\n </button>\n @if (config.institution !== 'law') {\n <div class=\"tab-spacer\"></div>\n <button\n (click)=\"emitTabChange('external')\"\n class=\"ss-tab\"\n id=\"externalTab\"\n [ngClass]=\"{\n 'ss-active': config.scope === 'external',\n ensign: config.institution === 'ensign' && config.scope !== 'external',\n }\"\n data-testid=\"externalTab\"\n [disabled]=\"config.scope === 'external'\"\n >\n Available Online\n </button>\n }\n <div class=\"tab-spacer full\"></div>\n </div>\n <div\n class=\"ss-bar-wrapper\"\n #barWrapperRef\n [@libHbllExpandCollapse]=\"{\n value: config.showAdvancedSearch ? (!config.showAdvancedSearchAsText ? 1 : 2) : 3,\n params: { startHeight: heightOfContainer },\n }\"\n >\n <div class=\"ss-bar-content\" data-testid=\"searchForm\">\n @if (!config.showAdvancedSearch) {\n <div class=\"ss-search-bar\">\n <lib-ss-simple-search\n [config]=\"config\"\n [supportedSuggestionScopes]=\"supportedSuggestionScopes\"\n [suggestions]=\"suggestions\"\n (simpleSearch)=\"emitSimpleSearch($event)\"\n (clearSimpleSearch)=\"emitClearSimpleSearch()\"\n (suggest)=\"suggest.emit($event)\"\n [(searchText)]=\"searchText\"\n ></lib-ss-simple-search>\n </div>\n } @else {\n <button\n #advSearchCloseBtn\n id=\"advSearchCloseBtn\"\n (click)=\"emitAdvancedSearchClosed()\"\n data-testid=\"advSearchCloseBtn\"\n >\n <span class=\"material-symbols-outlined ss-icon\"> close </span>\n </button>\n <div id=\"advSearchWrapper\">\n @if (config.showAdvancedSearch && !config.showAdvancedSearchAsText) {\n <div>\n <lib-ss-advanced-search\n [config]=\"config\"\n (advancedSearch)=\"emitAdvancedSearch($event)\"\n ></lib-ss-advanced-search>\n </div>\n } @else {\n <div\n class=\"ss-adv-search-text\"\n data-testid=\"advancedSearchText\"\n [innerHTML]=\"\n config.advancedSearchQueryRows | ssAdvancedQueries: config.scope\n \"\n ></div>\n <div\n [innerHTML]=\"\n config.advancedSearchQueryRows | advancedFieldWarning: config.scope\n \"\n ></div>\n }\n </div>\n }\n </div>\n @if (!config.showAdvancedSearch || config.showAdvancedSearchAsText) {\n <button\n data-testid=\"toggleAdvSearchButton\"\n class=\"ss-adv-search-btn\"\n id=\"advSearchBtn\"\n (click)=\"emitAdvancedSearchOpen()\"\n >\n Advanced\n <span class=\"material-symbols-outlined ss-icon\"> keyboard_arrow_down </span>\n </button>\n }\n </div>\n</div>\n", styles: ["#ssSearchBar .tabs .ss-tab.ensign{background-color:#2b6042!important;border-color:#2a6142}#ssSearchBar .tabs .ss-tab.ensign:hover{background-color:#357551!important}html{border:0;margin:0;padding:0;-webkit-text-size-adjust:100%}body{margin:0;padding:0}*,*:before,*:after{box-sizing:border-box}:root{--color-navy: #00245d;--color-royal: #0047ba;--color-white: #ffffff;--color-blue-500: #00245d;--color-blue-400: #003995;--color-blue-300: #0047ba;--color-blue-200: #336cc8;--color-blue-150: #ccdaf1;--color-blue-100: #e5edf8;--color-gray-500: #141414;--color-gray-400: #676767;--color-gray-300: #8f8f8f;--color-gray-200: #d0d0d0;--color-gray-100: #e7e7e7;--color-gray-50: #f9f9f9;--color-gray-brand-400: #676767;--color-green-500: #1d562e;--color-green-400: #2e8545;--color-green-300: #3ba35a;--color-green-200: #9dd1ac;--color-green-100: #ebf6ee;--color-teal-500: #26485f;--color-teal-400: #3e7295;--color-teal-300: #457fa6;--color-teal-200: #a2bfd3;--color-teal-100: #ecf2f6;--color-red-500: #702121;--color-red-400: #b33837;--color-red-300: #c73e3d;--color-red-200: #e39e9e;--color-red-100: #f9ecec;--color-yellow-500: #635f04;--color-yellow-400: #928c30;--color-yellow-300: #d1c844;--color-yellow-200: #e8e3a1;--color-yellow-100: #faf9ec;--color-purple-focus: #b967c7;--text-heading: #002e5d;--text-secondary-heading: #737373;--text-body: #141414;--text-disabled: #676767;--text-link: #336cc8;--text-on-action: #ffffff;--text-success: #1d562e;--text-info: #26485f;--text-error: #702121;--text-warning: #635f04;--surface-success: #ebf6ee;--surface-info: #ecf2f6;--surface-error: #f9ecec;--surface-warning: #faf9ec;--focus-ring-color: #b967c7}@font-face{font-family:Source Sans Pro;font-style:normal;font-weight:300;src:url(https://media.lib.byu.edu/web-assets/fonts/sourcesanspro/1.0.0/SourceSansPro-Light.ttf) format(\"truetype\");font-display:swap}@font-face{font-family:Source Sans Pro;font-style:normal;font-weight:400;src:url(https://media.lib.byu.edu/web-assets/fonts/sourcesanspro/1.0.0/SourceSansPro-Regular.ttf) format(\"truetype\");font-display:swap}@font-face{font-family:Source Sans Pro;font-style:normal;font-weight:600;src:url(https://media.lib.byu.edu/web-assets/fonts/sourcesanspro/1.0.0/SourceSansPro-Semibold.ttf) format(\"truetype\");font-display:swap}@font-face{font-family:Source Sans Pro;font-style:normal;font-weight:700;src:url(https://media.lib.byu.edu/web-assets/fonts/sourcesanspro/1.0.0/SourceSansPro-Bold.ttf) format(\"truetype\");font-display:swap}@font-face{font-family:Source Sans Pro;font-style:italic;font-weight:300;src:url(https://media.lib.byu.edu/web-assets/fonts/sourcesanspro/1.0.0/SourceSansPro-LightItalic.ttf) format(\"truetype\");font-display:swap}@font-face{font-family:Source Sans Pro;font-style:italic;font-weight:400;src:url(https://media.lib.byu.edu/web-assets/fonts/sourcesanspro/1.0.0/SourceSansPro-Italic.ttf) format(\"truetype\");font-display:swap}@font-face{font-family:Source Sans Pro;font-style:italic;font-weight:600;src:url(https://media.lib.byu.edu/web-assets/fonts/sourcesanspro/1.0.0/SourceSansPro-SemiboldItalic.ttf) format(\"truetype\");font-display:swap}@font-face{font-family:Source Sans Pro;font-style:italic;font-weight:700;src:url(https://media.lib.byu.edu/web-assets/fonts/sourcesanspro/1.0.0/SourceSansPro-BoldItalic.ttf) format(\"truetype\");font-display:swap}h1,h2,h3,h4,h5,h6,span:not(.material-symbols-outlined),a,p{font-family:Source Sans Pro}h1{font-weight:300;font-style:normal;color:var(--text-heading)}h2{font-weight:400;font-style:normal;color:var(--text-heading)}h3{font-weight:700;font-style:normal;color:var(--text-heading)}h4,h5,h6{font-weight:600;font-style:normal;color:var(--text-secondary-heading)}.hbll-default-body{font-weight:400;font-style:normal;max-width:35rem;min-width:22.25rem;color:var(--text-body)}.hbll-caption{font-weight:400;font-style:normal;max-width:25.25rem;min-width:17.5rem;color:var(--text-body)}.hbll-large{font-weight:400;font-style:normal;max-width:41.25rem;min-width:26.5rem;color:var(--text-body)}a{color:var(--text-link);text-decoration:underline}.hbll-emphasis{font-weight:600}h1{font-size:2rem;line-height:2.5rem}h2{font-size:1.75rem;line-height:2.25rem}h3,h4{font-size:1.5rem;line-height:2rem}h5,h6{font-size:1.25rem;line-height:1.75rem}.hbll-default-body{font-size:.875rem;line-height:1.25rem}.hbll-caption{font-size:.75rem;line-height:1rem}.hbll-large{font-size:1rem;line-height:1.5rem}@media screen and (min-width: 52.125em){h1{font-size:3rem;line-height:3.5rem}h2{font-size:2.5rem;line-height:3rem}h3{font-size:2rem;line-height:3rem}h4{font-size:1.75rem;line-height:2.5rem}h5{font-size:1.5rem;line-height:2rem}h6{font-size:1.25rem;line-height:1.75rem}.hbll-default-body{font-size:1rem;line-height:1.5rem}.hbll-caption{font-size:.75rem;line-height:1rem}.hbll-large{font-size:1.25rem;line-height:1.75rem}}@media screen and (min-width: 90em){h1{font-size:3.75rem;line-height:4.25rem}h2{font-size:3rem;line-height:3.5rem}h3{font-size:2.5rem;line-height:3rem}h4{font-size:2rem;line-height:2.5rem}h5{font-size:1.5rem;line-height:2rem}h6{font-size:1.25rem;line-height:1.75rem}.hbll-default-body{font-size:1rem;line-height:1.5rem}.hbll-caption{font-size:.75rem;line-height:1rem}.hbll-large{font-size:1.25rem;line-height:1.75rem}}:focus-visible{outline:.125rem solid var(--focus-ring-color);outline-offset:.125rem}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);border:0}.sr-only.sr-only-focusable:focus,.sr-only.sr-only-focusable:focus-within,.sr-only.sr-only-focusable:active{position:static;width:auto;height:auto;margin:0;overflow:visible;clip:auto}a,button{border:none;background:none;font-family:inherit;padding:0;margin:0;font-size:inherit;color:#0047ba;text-decoration:none;cursor:pointer}a:hover,button:hover{color:#003995}.mat-mdc-tooltip-surface{background-color:#333!important;border-radius:3px!important;color:#fff!important;font:inherit!important;font-size:.8em!important}#ssSearchBar{display:flex;align-items:flex-start;flex-wrap:wrap;position:relative;color:#444}#ssSearchBar .tabs{display:flex;width:100%;margin-bottom:-1px;z-index:10;pointer-events:none}#ssSearchBar .tabs .ss-tab{border-radius:4px 4px 0 0;border:#d0d0d0 solid 1px;border-color:#336cc8;border-bottom:none;padding:.3em 1.4em;font-size:.94em;letter-spacing:.4px;font-weight:600;background-color:#0047ba;color:#fff;white-space:nowrap;position:relative;pointer-events:auto}#ssSearchBar .tabs .ss-tab:after{content:\"\";height:1px;width:calc(100% + 2px);position:absolute;bottom:0;left:-1px;background-color:#d0d0d0}#ssSearchBar .tabs .ss-tab:hover{background-color:#336cc8}#ssSearchBar .tabs .ss-tab.ss-active{color:#00245d;margin-bottom:1px;border-color:#d0d0d0;background-color:#fffffff2}#ssSearchBar .tabs .ss-tab.ss-active:after{display:none}#ssSearchBar .tabs .ss-tab:disabled{cursor:auto}#ssSearchBar .tabs .tab-spacer{width:.3em;border-bottom:#d0d0d0 solid 1px;position:relative}#ssSearchBar .tabs .tab-spacer:before{content:\"\";position:absolute;left:-1px;bottom:-1px;width:1px;height:1px;background-color:#d0d0d0}#ssSearchBar .tabs .tab-spacer:after{content:\"\";position:absolute;right:-1px;bottom:-1px;width:1px;height:1px;background-color:#d0d0d0}#ssSearchBar .tabs .tab-spacer.full{width:100%;margin-right:4px;position:relative}#ssSearchBar .ss-adv-search-text{padding-bottom:1em;padding-right:1.25rem;pointer-events:none}#ssSearchBar .ss-bar-wrapper{padding:1em 1em .25em;border-right:#d0d0d0 solid 1px;border-left:#d0d0d0 solid 1px;border-bottom:#d0d0d0 solid 1px;width:100%;display:flex;align-items:center;flex-wrap:wrap;position:relative;background-color:#fffffff2;border-radius:0 4px 4px}#ssSearchBar .ss-bar-wrapper:after{content:\"\";position:absolute;top:0;right:-1px;background-color:transparent;border-radius:0 4px 0 0;width:4px;height:4px;border-top:#d0d0d0 solid 1px;border-right:#d0d0d0 solid 1px}#ssSearchBar .ss-bar-content{position:relative;width:100%;height:initial}#ssSearchBar .ss-search-bar{border-radius:4px;border:#d0d0d0 solid 1px;width:100%}#ssSearchBar #advSearchCloseBtn{float:right;padding:.4em;margin:-.4em 0;color:#666;transition:all .1s}#ssSearchBar #advSearchCloseBtn:hover{color:#292929}#ssSearchBar #advSearchCloseBtn .ss-icon{font-size:1.2em;font-weight:600}#ssSearchBar .ss-adv-search-btn{font-size:.9em;color:#457fa6;margin:.2em 4em 0 auto;padding-right:.25rem;padding-top:2px;padding-bottom:2px;display:flex;justify-content:center;align-items:center}#ssSearchBar .ss-adv-search-btn .ss-icon{font-size:1.4em;opacity:.75;margin-top:.125rem}#ssSearchBar .ss-adv-search-btn:hover{color:#a2bfd3}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: AdvancedSearchComponent, selector: "lib-ss-advanced-search", inputs: ["config"], outputs: ["advancedSearch"] }, { kind: "component", type: SimpleSearchComponent, selector: "lib-ss-simple-search", inputs: ["searchText", "config", "supportedSuggestionScopes", "suggestions"], outputs: ["searchTextChange", "simpleSearch", "clearSimpleSearch", "suggest"] }, { kind: "pipe", type: SsAdvancedQueriesPipe, name: "ssAdvancedQueries" }, { kind: "pipe", type: AdvancedFieldWarningPipe, name: "advancedFieldWarning" }], animations: [libHbllExpandCollapse], encapsulation: i0.ViewEncapsulation.None }); }
|
|
3074
3087
|
}
|
|
3075
3088
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: SsSearchBarComponent, decorators: [{
|
|
3076
3089
|
type: Component,
|
|
@@ -3080,7 +3093,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImpo
|
|
|
3080
3093
|
AdvancedSearchComponent,
|
|
3081
3094
|
SimpleSearchComponent,
|
|
3082
3095
|
AdvancedFieldWarningPipe,
|
|
3083
|
-
], providers: [FieldByScopePipe], animations: [libHbllExpandCollapse], encapsulation: ViewEncapsulation.None, template: "<div id=\"ssSearchBar\">\n <div class=\"tabs\">\n <button\n (click)=\"emitTabChange('local')\"\n class=\"ss-tab\"\n id=\"localTab\"\n [ngClass]=\"{\n 'ss-active': config.scope === 'local',\n ensign: config.institution === 'ensign' && config.scope !== 'local',\n }\"\n data-testid=\"localTab\"\n [disabled]=\"config.scope === 'local'\"\n >\n In the Library\n </button>\n @if (config.institution !== 'law') {\n <div class=\"tab-spacer\"></div>\n <button\n (click)=\"emitTabChange('external')\"\n class=\"ss-tab\"\n id=\"externalTab\"\n [ngClass]=\"{\n 'ss-active': config.scope === 'external',\n ensign: config.institution === 'ensign' && config.scope !== 'external',\n }\"\n data-testid=\"externalTab\"\n [disabled]=\"config.scope === 'external'\"\n >\n Available Online\n </button>\n }\n <div class=\"tab-spacer full\"></div>\n </div>\n <div\n class=\"ss-bar-wrapper\"\n #barWrapperRef\n [@libHbllExpandCollapse]=\"{\n value: config.showAdvancedSearch ? (!config.showAdvancedSearchAsText ? 1 : 2) : 3,\n params: { startHeight: heightOfContainer },\n }\"\n >\n <div class=\"ss-bar-content\" data-testid=\"searchForm\">\n @if (!config.showAdvancedSearch) {\n <div class=\"ss-search-bar\">\n <lib-ss-simple-search\n [config]=\"config\"\n [supportedSuggestionScopes]=\"supportedSuggestionScopes\"\n [suggestions]=\"suggestions\"\n (simpleSearch)=\"emitSimpleSearch($event)\"\n (clearSimpleSearch)=\"emitClearSimpleSearch()\"\n (suggest)=\"suggest.emit($event)\"\n [(searchText)]=\"searchText\"\n ></lib-ss-simple-search>\n </div>\n } @else {\n <button\n #advSearchCloseBtn\n id=\"advSearchCloseBtn\"\n (click)=\"emitAdvancedSearchClosed()\"\n data-testid=\"advSearchCloseBtn\"\n >\n <span class=\"material-symbols-outlined ss-icon\"> close </span>\n </button>\n <div id=\"advSearchWrapper\">\n @if (config.showAdvancedSearch && !config.showAdvancedSearchAsText) {\n <div>\n <lib-ss-advanced-search\n [config]=\"config\"\n (advancedSearch)=\"emitAdvancedSearch($event)\"\n ></lib-ss-advanced-search>\n </div>\n } @else {\n <div\n class=\"ss-adv-search-text\"\n data-testid=\"advancedSearchText\"\n [innerHTML]=\"\n config.advancedSearchQueryRows | ssAdvancedQueries: config.scope\n \"\n ></div>\n <div\n [innerHTML]=\"\n config.advancedSearchQueryRows | advancedFieldWarning: config.scope\n \"\n ></div>\n }\n </div>\n }\n </div>\n @if (!config.showAdvancedSearch || config.showAdvancedSearchAsText) {\n <button\n data-testid=\"toggleAdvSearchButton\"\n class=\"ss-adv-search-btn\"\n id=\"advSearchBtn\"\n (click)=\"emitAdvancedSearchOpen()\"\n >\n Advanced\n <span class=\"material-symbols-outlined ss-icon\"> keyboard_arrow_down </span>\n </button>\n }\n </div>\n</div>\n", styles: ["#ssSearchBar .tabs .ss-tab.ensign{background-color:#2b6042!important;border-color:#2a6142}#ssSearchBar .tabs .ss-tab.ensign:hover{background-color:#357551!important}html{border:0;margin:0;padding:0;-webkit-text-size-adjust:100%}body{margin:0;padding:0}*,*:before,*:after{box-sizing:border-box}:root{--color-navy: #00245d;--color-royal: #0047ba;--color-white: #ffffff;--color-blue-500: #00245d;--color-blue-400: #003995;--color-blue-300: #0047ba;--color-blue-200: #336cc8;--color-blue-150: #ccdaf1;--color-blue-100: #e5edf8;--color-gray-500: #141414;--color-gray-400: #676767;--color-gray-300: #8f8f8f;--color-gray-200: #d0d0d0;--color-gray-100: #e7e7e7;--color-gray-50: #f9f9f9;--color-gray-brand-400: #676767;--color-green-500: #1d562e;--color-green-400: #2e8545;--color-green-300: #3ba35a;--color-green-200: #9dd1ac;--color-green-100: #ebf6ee;--color-teal-500: #26485f;--color-teal-400: #3e7295;--color-teal-300: #457fa6;--color-teal-200: #a2bfd3;--color-teal-100: #ecf2f6;--color-red-500: #702121;--color-red-400: #b33837;--color-red-300: #c73e3d;--color-red-200: #e39e9e;--color-red-100: #f9ecec;--color-yellow-500: #635f04;--color-yellow-400: #928c30;--color-yellow-300: #d1c844;--color-yellow-200: #e8e3a1;--color-yellow-100: #faf9ec;--color-purple-focus: #b967c7;--text-heading: #002e5d;--text-secondary-heading: #737373;--text-body: #141414;--text-disabled: #676767;--text-link: #336cc8;--text-on-action: #ffffff;--text-success: #1d562e;--text-info: #26485f;--text-error: #702121;--text-warning: #635f04;--surface-success: #ebf6ee;--surface-info: #ecf2f6;--surface-error: #f9ecec;--surface-warning: #faf9ec;--focus-ring-color: #b967c7}@font-face{font-family:Source Sans Pro;font-style:normal;font-weight:300;src:url(https://media.lib.byu.edu/web-assets/fonts/sourcesanspro/1.0.0/SourceSansPro-Light.ttf) format(\"truetype\");font-display:swap}@font-face{font-family:Source Sans Pro;font-style:normal;font-weight:400;src:url(https://media.lib.byu.edu/web-assets/fonts/sourcesanspro/1.0.0/SourceSansPro-Regular.ttf) format(\"truetype\");font-display:swap}@font-face{font-family:Source Sans Pro;font-style:normal;font-weight:600;src:url(https://media.lib.byu.edu/web-assets/fonts/sourcesanspro/1.0.0/SourceSansPro-Semibold.ttf) format(\"truetype\");font-display:swap}@font-face{font-family:Source Sans Pro;font-style:normal;font-weight:700;src:url(https://media.lib.byu.edu/web-assets/fonts/sourcesanspro/1.0.0/SourceSansPro-Bold.ttf) format(\"truetype\");font-display:swap}@font-face{font-family:Source Sans Pro;font-style:italic;font-weight:300;src:url(https://media.lib.byu.edu/web-assets/fonts/sourcesanspro/1.0.0/SourceSansPro-LightItalic.ttf) format(\"truetype\");font-display:swap}@font-face{font-family:Source Sans Pro;font-style:italic;font-weight:400;src:url(https://media.lib.byu.edu/web-assets/fonts/sourcesanspro/1.0.0/SourceSansPro-Italic.ttf) format(\"truetype\");font-display:swap}@font-face{font-family:Source Sans Pro;font-style:italic;font-weight:600;src:url(https://media.lib.byu.edu/web-assets/fonts/sourcesanspro/1.0.0/SourceSansPro-SemiboldItalic.ttf) format(\"truetype\");font-display:swap}@font-face{font-family:Source Sans Pro;font-style:italic;font-weight:700;src:url(https://media.lib.byu.edu/web-assets/fonts/sourcesanspro/1.0.0/SourceSansPro-BoldItalic.ttf) format(\"truetype\");font-display:swap}h1,h2,h3,h4,h5,h6,span:not(.material-symbols-outlined),a,p{font-family:Source Sans Pro}h1{font-weight:300;font-style:normal;color:var(--text-heading)}h2{font-weight:400;font-style:normal;color:var(--text-heading)}h3{font-weight:700;font-style:normal;color:var(--text-heading)}h4,h5,h6{font-weight:600;font-style:normal;color:var(--text-secondary-heading)}.hbll-default-body{font-weight:400;font-style:normal;max-width:35rem;min-width:22.25rem;color:var(--text-body)}.hbll-caption{font-weight:400;font-style:normal;max-width:25.25rem;min-width:17.5rem;color:var(--text-body)}.hbll-large{font-weight:400;font-style:normal;max-width:41.25rem;min-width:26.5rem;color:var(--text-body)}a{color:var(--text-link);text-decoration:underline}.hbll-emphasis{font-weight:600}h1{font-size:2rem;line-height:2.5rem}h2{font-size:1.75rem;line-height:2.25rem}h3,h4{font-size:1.5rem;line-height:2rem}h5,h6{font-size:1.25rem;line-height:1.75rem}.hbll-default-body{font-size:.875rem;line-height:1.25rem}.hbll-caption{font-size:.75rem;line-height:1rem}.hbll-large{font-size:1rem;line-height:1.5rem}@media screen and (min-width: 52.125em){h1{font-size:3rem;line-height:3.5rem}h2{font-size:2.5rem;line-height:3rem}h3{font-size:2rem;line-height:3rem}h4{font-size:1.75rem;line-height:2.5rem}h5{font-size:1.5rem;line-height:2rem}h6{font-size:1.25rem;line-height:1.75rem}.hbll-default-body{font-size:1rem;line-height:1.5rem}.hbll-caption{font-size:.75rem;line-height:1rem}.hbll-large{font-size:1.25rem;line-height:1.75rem}}@media screen and (min-width: 90em){h1{font-size:3.75rem;line-height:4.25rem}h2{font-size:3rem;line-height:3.5rem}h3{font-size:2.5rem;line-height:3rem}h4{font-size:2rem;line-height:2.5rem}h5{font-size:1.5rem;line-height:2rem}h6{font-size:1.25rem;line-height:1.75rem}.hbll-default-body{font-size:1rem;line-height:1.5rem}.hbll-caption{font-size:.75rem;line-height:1rem}.hbll-large{font-size:1.25rem;line-height:1.75rem}}:focus-visible{outline:.125rem solid var(--focus-ring-color);outline-offset:.125rem}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);border:0}.sr-only.sr-only-focusable:focus,.sr-only.sr-only-focusable:focus-within,.sr-only.sr-only-focusable:active{position:static;width:auto;height:auto;margin:0;overflow:visible;clip:auto}a,button{border:none;background:none;font-family:inherit;padding:0;margin:0;font-size:inherit;color:#0047ba;text-decoration:none;cursor:pointer}a:hover,button:hover{color:#003995}.mat-mdc-tooltip-surface{background-color:#333!important;border-radius:3px!important;color:#fff!important;font:inherit!important;font-size:.8em!important}#ssSearchBar{display:flex;align-items:flex-start;flex-wrap:wrap;position:relative;color:#444}#ssSearchBar .tabs{display:flex;width:100%;margin-bottom:-1px;z-index:10;pointer-events:none}#ssSearchBar .tabs .ss-tab{border-radius:4px 4px 0 0;border:#b7b7b7 solid 1px;border-color:#1967e5;border-bottom:none;padding:.3em 1.4em;font-size:.94em;letter-spacing:.4px;font-weight:600;background-color:#0047ba;color:#fff;white-space:nowrap;position:relative;pointer-events:auto}#ssSearchBar .tabs .ss-tab:after{content:\"\";height:1px;width:calc(100% + 2px);position:absolute;bottom:0;left:-1px;background-color:#b7b7b7}#ssSearchBar .tabs .ss-tab:hover{background-color:#1967e5}#ssSearchBar .tabs .ss-tab.ss-active{color:#002e5d;margin-bottom:1px;border-color:#b7b7b7;background-color:#fffffff2}#ssSearchBar .tabs .ss-tab.ss-active:after{display:none}#ssSearchBar .tabs .ss-tab:disabled{cursor:auto}#ssSearchBar .tabs .tab-spacer{width:.3em;border-bottom:#b7b7b7 solid 1px;position:relative}#ssSearchBar .tabs .tab-spacer:before{content:\"\";position:absolute;left:-1px;bottom:-1px;width:1px;height:1px;background-color:#b7b7b7}#ssSearchBar .tabs .tab-spacer:after{content:\"\";position:absolute;right:-1px;bottom:-1px;width:1px;height:1px;background-color:#b7b7b7}#ssSearchBar .tabs .tab-spacer.full{width:100%;margin-right:4px;position:relative}#ssSearchBar .ss-adv-search-text{padding-bottom:1em;padding-right:1.25rem;pointer-events:none}#ssSearchBar .ss-bar-wrapper{padding:1em 1em .25em;border-right:#b7b7b7 solid 1px;border-left:#b7b7b7 solid 1px;border-bottom:#b7b7b7 solid 1px;width:100%;display:flex;align-items:center;flex-wrap:wrap;position:relative;background-color:#fffffff2;border-radius:0 4px 4px}#ssSearchBar .ss-bar-wrapper:after{content:\"\";position:absolute;top:0;right:-1px;background-color:transparent;border-radius:0 4px 0 0;width:4px;height:4px;border-top:#b7b7b7 solid 1px;border-right:#b7b7b7 solid 1px}#ssSearchBar .ss-bar-content{position:relative;width:100%;height:initial}#ssSearchBar .ss-search-bar{border-radius:4px;border:#b7b7b7 solid 1px;width:100%}#ssSearchBar #advSearchCloseBtn{float:right;padding:.4em;margin:-.4em 0;color:#666;transition:all .1s}#ssSearchBar #advSearchCloseBtn:hover{color:#292929}#ssSearchBar #advSearchCloseBtn .ss-icon{font-size:1.2em;font-weight:600}#ssSearchBar .ss-adv-search-btn{font-size:.9em;color:#4070b0;margin:.2em 4em 0 auto;padding-right:.25rem;padding-top:2px;padding-bottom:2px;display:flex;justify-content:center;align-items:center}#ssSearchBar .ss-adv-search-btn .ss-icon{font-size:1.4em;opacity:.75;margin-top:.125rem}#ssSearchBar .ss-adv-search-btn:hover{color:#6892ca}\n"] }]
|
|
3096
|
+
], providers: [FieldByScopePipe], animations: [libHbllExpandCollapse], encapsulation: ViewEncapsulation.None, template: "<div id=\"ssSearchBar\">\n <div class=\"tabs\">\n <button\n (click)=\"emitTabChange('local')\"\n class=\"ss-tab\"\n id=\"localTab\"\n [ngClass]=\"{\n 'ss-active': config.scope === 'local',\n ensign: config.institution === 'ensign' && config.scope !== 'local',\n }\"\n data-testid=\"localTab\"\n [disabled]=\"config.scope === 'local'\"\n >\n In the Library\n </button>\n @if (config.institution !== 'law') {\n <div class=\"tab-spacer\"></div>\n <button\n (click)=\"emitTabChange('external')\"\n class=\"ss-tab\"\n id=\"externalTab\"\n [ngClass]=\"{\n 'ss-active': config.scope === 'external',\n ensign: config.institution === 'ensign' && config.scope !== 'external',\n }\"\n data-testid=\"externalTab\"\n [disabled]=\"config.scope === 'external'\"\n >\n Available Online\n </button>\n }\n <div class=\"tab-spacer full\"></div>\n </div>\n <div\n class=\"ss-bar-wrapper\"\n #barWrapperRef\n [@libHbllExpandCollapse]=\"{\n value: config.showAdvancedSearch ? (!config.showAdvancedSearchAsText ? 1 : 2) : 3,\n params: { startHeight: heightOfContainer },\n }\"\n >\n <div class=\"ss-bar-content\" data-testid=\"searchForm\">\n @if (!config.showAdvancedSearch) {\n <div class=\"ss-search-bar\">\n <lib-ss-simple-search\n [config]=\"config\"\n [supportedSuggestionScopes]=\"supportedSuggestionScopes\"\n [suggestions]=\"suggestions\"\n (simpleSearch)=\"emitSimpleSearch($event)\"\n (clearSimpleSearch)=\"emitClearSimpleSearch()\"\n (suggest)=\"suggest.emit($event)\"\n [(searchText)]=\"searchText\"\n ></lib-ss-simple-search>\n </div>\n } @else {\n <button\n #advSearchCloseBtn\n id=\"advSearchCloseBtn\"\n (click)=\"emitAdvancedSearchClosed()\"\n data-testid=\"advSearchCloseBtn\"\n >\n <span class=\"material-symbols-outlined ss-icon\"> close </span>\n </button>\n <div id=\"advSearchWrapper\">\n @if (config.showAdvancedSearch && !config.showAdvancedSearchAsText) {\n <div>\n <lib-ss-advanced-search\n [config]=\"config\"\n (advancedSearch)=\"emitAdvancedSearch($event)\"\n ></lib-ss-advanced-search>\n </div>\n } @else {\n <div\n class=\"ss-adv-search-text\"\n data-testid=\"advancedSearchText\"\n [innerHTML]=\"\n config.advancedSearchQueryRows | ssAdvancedQueries: config.scope\n \"\n ></div>\n <div\n [innerHTML]=\"\n config.advancedSearchQueryRows | advancedFieldWarning: config.scope\n \"\n ></div>\n }\n </div>\n }\n </div>\n @if (!config.showAdvancedSearch || config.showAdvancedSearchAsText) {\n <button\n data-testid=\"toggleAdvSearchButton\"\n class=\"ss-adv-search-btn\"\n id=\"advSearchBtn\"\n (click)=\"emitAdvancedSearchOpen()\"\n >\n Advanced\n <span class=\"material-symbols-outlined ss-icon\"> keyboard_arrow_down </span>\n </button>\n }\n </div>\n</div>\n", styles: ["#ssSearchBar .tabs .ss-tab.ensign{background-color:#2b6042!important;border-color:#2a6142}#ssSearchBar .tabs .ss-tab.ensign:hover{background-color:#357551!important}html{border:0;margin:0;padding:0;-webkit-text-size-adjust:100%}body{margin:0;padding:0}*,*:before,*:after{box-sizing:border-box}:root{--color-navy: #00245d;--color-royal: #0047ba;--color-white: #ffffff;--color-blue-500: #00245d;--color-blue-400: #003995;--color-blue-300: #0047ba;--color-blue-200: #336cc8;--color-blue-150: #ccdaf1;--color-blue-100: #e5edf8;--color-gray-500: #141414;--color-gray-400: #676767;--color-gray-300: #8f8f8f;--color-gray-200: #d0d0d0;--color-gray-100: #e7e7e7;--color-gray-50: #f9f9f9;--color-gray-brand-400: #676767;--color-green-500: #1d562e;--color-green-400: #2e8545;--color-green-300: #3ba35a;--color-green-200: #9dd1ac;--color-green-100: #ebf6ee;--color-teal-500: #26485f;--color-teal-400: #3e7295;--color-teal-300: #457fa6;--color-teal-200: #a2bfd3;--color-teal-100: #ecf2f6;--color-red-500: #702121;--color-red-400: #b33837;--color-red-300: #c73e3d;--color-red-200: #e39e9e;--color-red-100: #f9ecec;--color-yellow-500: #635f04;--color-yellow-400: #928c30;--color-yellow-300: #d1c844;--color-yellow-200: #e8e3a1;--color-yellow-100: #faf9ec;--color-purple-focus: #b967c7;--text-heading: #002e5d;--text-secondary-heading: #737373;--text-body: #141414;--text-disabled: #676767;--text-link: #336cc8;--text-on-action: #ffffff;--text-success: #1d562e;--text-info: #26485f;--text-error: #702121;--text-warning: #635f04;--surface-success: #ebf6ee;--surface-info: #ecf2f6;--surface-error: #f9ecec;--surface-warning: #faf9ec;--focus-ring-color: #b967c7}@font-face{font-family:Source Sans Pro;font-style:normal;font-weight:300;src:url(https://media.lib.byu.edu/web-assets/fonts/sourcesanspro/1.0.0/SourceSansPro-Light.ttf) format(\"truetype\");font-display:swap}@font-face{font-family:Source Sans Pro;font-style:normal;font-weight:400;src:url(https://media.lib.byu.edu/web-assets/fonts/sourcesanspro/1.0.0/SourceSansPro-Regular.ttf) format(\"truetype\");font-display:swap}@font-face{font-family:Source Sans Pro;font-style:normal;font-weight:600;src:url(https://media.lib.byu.edu/web-assets/fonts/sourcesanspro/1.0.0/SourceSansPro-Semibold.ttf) format(\"truetype\");font-display:swap}@font-face{font-family:Source Sans Pro;font-style:normal;font-weight:700;src:url(https://media.lib.byu.edu/web-assets/fonts/sourcesanspro/1.0.0/SourceSansPro-Bold.ttf) format(\"truetype\");font-display:swap}@font-face{font-family:Source Sans Pro;font-style:italic;font-weight:300;src:url(https://media.lib.byu.edu/web-assets/fonts/sourcesanspro/1.0.0/SourceSansPro-LightItalic.ttf) format(\"truetype\");font-display:swap}@font-face{font-family:Source Sans Pro;font-style:italic;font-weight:400;src:url(https://media.lib.byu.edu/web-assets/fonts/sourcesanspro/1.0.0/SourceSansPro-Italic.ttf) format(\"truetype\");font-display:swap}@font-face{font-family:Source Sans Pro;font-style:italic;font-weight:600;src:url(https://media.lib.byu.edu/web-assets/fonts/sourcesanspro/1.0.0/SourceSansPro-SemiboldItalic.ttf) format(\"truetype\");font-display:swap}@font-face{font-family:Source Sans Pro;font-style:italic;font-weight:700;src:url(https://media.lib.byu.edu/web-assets/fonts/sourcesanspro/1.0.0/SourceSansPro-BoldItalic.ttf) format(\"truetype\");font-display:swap}h1,h2,h3,h4,h5,h6,span:not(.material-symbols-outlined),a,p{font-family:Source Sans Pro}h1{font-weight:300;font-style:normal;color:var(--text-heading)}h2{font-weight:400;font-style:normal;color:var(--text-heading)}h3{font-weight:700;font-style:normal;color:var(--text-heading)}h4,h5,h6{font-weight:600;font-style:normal;color:var(--text-secondary-heading)}.hbll-default-body{font-weight:400;font-style:normal;max-width:35rem;min-width:22.25rem;color:var(--text-body)}.hbll-caption{font-weight:400;font-style:normal;max-width:25.25rem;min-width:17.5rem;color:var(--text-body)}.hbll-large{font-weight:400;font-style:normal;max-width:41.25rem;min-width:26.5rem;color:var(--text-body)}a{color:var(--text-link);text-decoration:underline}.hbll-emphasis{font-weight:600}h1{font-size:2rem;line-height:2.5rem}h2{font-size:1.75rem;line-height:2.25rem}h3,h4{font-size:1.5rem;line-height:2rem}h5,h6{font-size:1.25rem;line-height:1.75rem}.hbll-default-body{font-size:.875rem;line-height:1.25rem}.hbll-caption{font-size:.75rem;line-height:1rem}.hbll-large{font-size:1rem;line-height:1.5rem}@media screen and (min-width: 52.125em){h1{font-size:3rem;line-height:3.5rem}h2{font-size:2.5rem;line-height:3rem}h3{font-size:2rem;line-height:3rem}h4{font-size:1.75rem;line-height:2.5rem}h5{font-size:1.5rem;line-height:2rem}h6{font-size:1.25rem;line-height:1.75rem}.hbll-default-body{font-size:1rem;line-height:1.5rem}.hbll-caption{font-size:.75rem;line-height:1rem}.hbll-large{font-size:1.25rem;line-height:1.75rem}}@media screen and (min-width: 90em){h1{font-size:3.75rem;line-height:4.25rem}h2{font-size:3rem;line-height:3.5rem}h3{font-size:2.5rem;line-height:3rem}h4{font-size:2rem;line-height:2.5rem}h5{font-size:1.5rem;line-height:2rem}h6{font-size:1.25rem;line-height:1.75rem}.hbll-default-body{font-size:1rem;line-height:1.5rem}.hbll-caption{font-size:.75rem;line-height:1rem}.hbll-large{font-size:1.25rem;line-height:1.75rem}}:focus-visible{outline:.125rem solid var(--focus-ring-color);outline-offset:.125rem}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);border:0}.sr-only.sr-only-focusable:focus,.sr-only.sr-only-focusable:focus-within,.sr-only.sr-only-focusable:active{position:static;width:auto;height:auto;margin:0;overflow:visible;clip:auto}a,button{border:none;background:none;font-family:inherit;padding:0;margin:0;font-size:inherit;color:#0047ba;text-decoration:none;cursor:pointer}a:hover,button:hover{color:#003995}.mat-mdc-tooltip-surface{background-color:#333!important;border-radius:3px!important;color:#fff!important;font:inherit!important;font-size:.8em!important}#ssSearchBar{display:flex;align-items:flex-start;flex-wrap:wrap;position:relative;color:#444}#ssSearchBar .tabs{display:flex;width:100%;margin-bottom:-1px;z-index:10;pointer-events:none}#ssSearchBar .tabs .ss-tab{border-radius:4px 4px 0 0;border:#d0d0d0 solid 1px;border-color:#336cc8;border-bottom:none;padding:.3em 1.4em;font-size:.94em;letter-spacing:.4px;font-weight:600;background-color:#0047ba;color:#fff;white-space:nowrap;position:relative;pointer-events:auto}#ssSearchBar .tabs .ss-tab:after{content:\"\";height:1px;width:calc(100% + 2px);position:absolute;bottom:0;left:-1px;background-color:#d0d0d0}#ssSearchBar .tabs .ss-tab:hover{background-color:#336cc8}#ssSearchBar .tabs .ss-tab.ss-active{color:#00245d;margin-bottom:1px;border-color:#d0d0d0;background-color:#fffffff2}#ssSearchBar .tabs .ss-tab.ss-active:after{display:none}#ssSearchBar .tabs .ss-tab:disabled{cursor:auto}#ssSearchBar .tabs .tab-spacer{width:.3em;border-bottom:#d0d0d0 solid 1px;position:relative}#ssSearchBar .tabs .tab-spacer:before{content:\"\";position:absolute;left:-1px;bottom:-1px;width:1px;height:1px;background-color:#d0d0d0}#ssSearchBar .tabs .tab-spacer:after{content:\"\";position:absolute;right:-1px;bottom:-1px;width:1px;height:1px;background-color:#d0d0d0}#ssSearchBar .tabs .tab-spacer.full{width:100%;margin-right:4px;position:relative}#ssSearchBar .ss-adv-search-text{padding-bottom:1em;padding-right:1.25rem;pointer-events:none}#ssSearchBar .ss-bar-wrapper{padding:1em 1em .25em;border-right:#d0d0d0 solid 1px;border-left:#d0d0d0 solid 1px;border-bottom:#d0d0d0 solid 1px;width:100%;display:flex;align-items:center;flex-wrap:wrap;position:relative;background-color:#fffffff2;border-radius:0 4px 4px}#ssSearchBar .ss-bar-wrapper:after{content:\"\";position:absolute;top:0;right:-1px;background-color:transparent;border-radius:0 4px 0 0;width:4px;height:4px;border-top:#d0d0d0 solid 1px;border-right:#d0d0d0 solid 1px}#ssSearchBar .ss-bar-content{position:relative;width:100%;height:initial}#ssSearchBar .ss-search-bar{border-radius:4px;border:#d0d0d0 solid 1px;width:100%}#ssSearchBar #advSearchCloseBtn{float:right;padding:.4em;margin:-.4em 0;color:#666;transition:all .1s}#ssSearchBar #advSearchCloseBtn:hover{color:#292929}#ssSearchBar #advSearchCloseBtn .ss-icon{font-size:1.2em;font-weight:600}#ssSearchBar .ss-adv-search-btn{font-size:.9em;color:#457fa6;margin:.2em 4em 0 auto;padding-right:.25rem;padding-top:2px;padding-bottom:2px;display:flex;justify-content:center;align-items:center}#ssSearchBar .ss-adv-search-btn .ss-icon{font-size:1.4em;opacity:.75;margin-top:.125rem}#ssSearchBar .ss-adv-search-btn:hover{color:#a2bfd3}\n"] }]
|
|
3084
3097
|
}], propDecorators: { searchText: [{ type: i0.Input, args: [{ isSignal: true, alias: "searchText", required: false }] }, { type: i0.Output, args: ["searchTextChange"] }], config: [{
|
|
3085
3098
|
type: Input,
|
|
3086
3099
|
args: [{ required: true }]
|