@norwegian/core-components 7.12.0 → 7.12.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.
|
@@ -385,11 +385,11 @@ export class AirportSelectComponent extends NasComponentBase {
|
|
|
385
385
|
}
|
|
386
386
|
}
|
|
387
387
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: AirportSelectComponent, deps: [{ token: i1.DeviceHelper }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
388
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: AirportSelectComponent, selector: "nas-airport-select", inputs: { outboundId: "outboundId", inboundId: "inboundId", airports: "airports", airportRelations: "airportRelations", latestSearchesOrigin: "latestSearchesOrigin", latestSearchesDestination: "latestSearchesDestination", closestAirports: "closestAirports", allowedOriginAiports: "allowedOriginAiports", allowedDestinationAirports: "allowedDestinationAirports", displayLatestSearches: "displayLatestSearches", displayClosestAirports: "displayClosestAirports", combo: "combo", useSwitch: "useSwitch", allAirportsLabel: "allAirportsLabel", latestSearchesLabel: "latestSearchesLabel", closestAirportsLabel: "closestAirportsLabel", geolocationLabel: "geolocationLabel", geolocationBlockedLabel: "geolocationBlockedLabel", selectOriginFirstLabel: "selectOriginFirstLabel", invalidDestinationText: "invalidDestinationText", labelOrigin: "labelOrigin", placeholderOrigin: "placeholderOrigin", labelDestination: "labelDestination", placeholderDestination: "placeholderDestination", labelOutside: "labelOutside", keepSelection: "keepSelection", nasFormControlNameOrigin: "nasFormControlNameOrigin", nasFormControlNameDestination: "nasFormControlNameDestination", nasFormGroup: "nasFormGroup", originAirportCode: "originAirportCode", destinationAirportCode: "destinationAirportCode", ariaLabelClear: "ariaLabelClear", ariaLabelBackdrop: "ariaLabelBackdrop" }, outputs: { originChange: "originChange", originOpenChange: "originOpenChange", destinationChange: "destinationChange", destinationOpenChange: "destinationOpenChange", focusOnNext: "focusOnNext", positionChange: "positionChange" }, host: { listeners: { "window:resize": "onResize($event)" } }, viewQueries: [{ propertyName: "container", first: true, predicate: ["container"], descendants: true }, { propertyName: "switchButton", first: true, predicate: ["switchButton"], descendants: true }, { propertyName: "airportSelectDropdownOrigin", first: true, predicate: ["airportSelectDropdownOrigin"], descendants: true }, { propertyName: "airportSelectDropdownDestination", first: true, predicate: ["airportSelectDropdownDestination"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<div *ngIf=\"exists(combo); else airportSelectTemplate\"\n [nasClass]=\"getAirportSelectComboClass('', [inlineFlex && 'inline'])\" #container>\n <ng-container *ngTemplateOutlet=\"airportSelectTemplate\"></ng-container>\n</div>\n<ng-template #airportSelectTemplate>\n <div [nasClass]=\"getClass('', exists(useSwitch) && 'padding-origin')\" *ngIf=\"airportsOrigin\">\n <nas-airport-select-dropdown #airportSelectDropdownOrigin displayLatestSearches [id]=\"outboundId\"\n [enableGeolocation]=\"displayClosestAirports\" [displayClosestAirports]=\"displayClosestAirports\"\n [airportSelectLabel]=\"labelOrigin\" [latestSearches]=\"latestSearchesOrigin\" [closestAirports]=\"closestAirports\"\n [airport]=\"origin\" [airports]=\"airportsOrigin\" [resultsLabels]=\"resultsLabels\"\n [airportSelectPlaceholder]=\"placeholderOrigin\" [open]=\"originOpen\" [keepSelection]=\"keepSelection\"\n [airportSelectIconModifier]=\"'flight-departure'\" [nasFormControlName]=\"nasFormControlNameOrigin\"\n [nasFormGroup]=\"nasFormGroup\" [ariaLabelClear]=\"ariaLabelClear\" [ariaLabelBackdrop]=\"ariaLabelBackdrop\"\n [labelOutside]=\"labelOutside\" (clearedSelection)=\"onSelectionCleared()\" (selected)=\"setSelectedOrigin($event)\"\n (openChange)=\"onOriginOpen($event)\" (focusOnNext)=\"setDestinationOpen($event)\"\n (positionChange)=\"getClosestAirports($event)\"></nas-airport-select-dropdown>\n </div>\n <ng-container *ngIf=\"exists(combo)\">\n <div [nasClass]=\"getClass('', exists(useSwitch) && 'padding-destination')\"\n *ngIf=\"airportsDestination && airportsDestination.length > 0\">\n <nas-airport-select-dropdown #airportSelectDropdownDestination displayLatestSearches [id]=\"inboundId\"\n [airportSelectLabel]=\"labelDestination\" [displayClosestAirports]=\"false\"\n [latestSearches]=\"currentLatestSearchesDestination\" [airports]=\"airportsDestination\"\n [resultsLabels]=\"resultsLabels\" [airport]=\"destination\" [airportSelectPlaceholder]=\"placeholderDestination\"\n [open]=\"destinationOpen\" [keepSelection]=\"keepSelection\" [airportSelectIconModifier]=\"'flight-arrival'\"\n [nasFormControlName]=\"nasFormControlNameDestination\" [nasFormGroup]=\"nasFormGroup\"\n [ariaLabelClear]=\"ariaLabelClear\" [ariaLabelBackdrop]=\"ariaLabelBackdrop\" [isValid]=\"isDestinationValid\"\n [invalidText]=\"invalidDestinationText\" [labelOutside]=\"labelOutside\" (clearedSelection)=\"onSelectionCleared()\"\n (selected)=\"setSelectedDestination($event)\" (openChange)=\"onDestinationOpen($event)\"\n (focusOnNext)=\"setFocusOnNext($event)\" (focusOnPrevious)=\"onOriginFocus()\"></nas-airport-select-dropdown>\n </div>\n <div *ngIf=\"exists(useSwitch) && !(originOpen || destinationOpen || cleared)\" #switchButton\n [nasClass]=\"getAirportSelectComboClass('switcher', (originAirportCodeValue && destinationAirportCodeValue) && 'filled')\"\n (mouseover)=\"changeSwitchIcon()\" (mouseleave)=\"changeSwitchIcon()\" (keydown)=\"swapKeyDown($event)\"\n (click)=\"swapAirports()\">\n <nas-icon\n [type]=\"(this.destinationAirportCodeValue && this.originAirportCodeValue) ? 'vector--secondary' : 'vector'\"></nas-icon>\n </div>\n </ng-container>\n</ng-template>", styles: ["@keyframes fade-in{0%{opacity:0}}@keyframes fade-in-down{0%{opacity:0;transform:translateY(-30px)}}@keyframes fade-in-left{0%{opacity:0;transform:translate(-30px)}}@keyframes fade-in-right{0%{opacity:0;transform:translate(30px)}}@keyframes fade-out{to{opacity:0}}@keyframes flip-in{0%{opacity:0;transform:rotateX(-90deg)}40%{opacity:1;transform:rotateX(10deg)}}@keyframes flip-out{to{opacity:0;transform:rotateX(-90deg)}}@keyframes pop-in-from-top{0%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-100,1,1);opacity:0}6.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-30.227,1,1)}13.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,1.76,1,1)}20%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,7.08,1,1)}26.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,3.838,1,1)}33.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.902,1,1);opacity:1}40%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.237,1,1)}46.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.312,1,1)}53.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.141,1,1)}60%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.021,1,1)}66.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.015,1,1)}73.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.013,1,1)}80%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.005,1,1)}86.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,0,1,1)}93.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.001,1,1);-webkit-transform:translate3d(0,0,0)}to{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.001,1,1);-webkit-transform:translate3d(0,0,0)}}.nas-airport-select{position:relative;width:100%;text-align:left}.nas-airport-select label{margin-bottom:0;height:67px}.nas-airport-select:first-child{margin-bottom:0}.nas-airport-select:only-child{max-width:360px}.nas-airport-select--expanded{z-index:30}.nas-airport-select__wrapper{position:relative;display:block;z-index:3;background-color:#fff;border:2px solid #6F6F6F}.nas-airport-select__wrapper--active{background-color:#ebf4ff;border:2px solid #15273F}.nas-airport-select__wrapper--filled{border:2px solid #15273F}.nas-airport-select__wrapper--label-outside{background-color:transparent;border:0}.nas-airport-select__wrapper--label-outside input{height:50px!important;border:2px solid #6F6F6F}.nas-airport-select__wrapper--label-outside .nas-airport-select__icon{bottom:6px}.nas-airport-select__wrapper--label-outside .nas-airport-select__label{font-family:NorwegianTextPro,Arial,Helvetica Neue,Helvetica,sans-serif;font-weight:700;font-size:16px;margin-bottom:6px;padding:0}.nas-airport-select__wrapper--label-outside .nas-airport-select__label+.nas-airport-select__input[type=text]{padding:0 16px}.nas-airport-select__list-section-label{font-family:NorwegianTextPro,Arial,Helvetica Neue,Helvetica,sans-serif;font-weight:700;font-size:14px;line-height:20px;position:relative;z-index:2;text-align:center;padding:3px 12px;background-color:#e9e7e4}.nas-airport-select__list-section-label:not(:first-child){margin-top:-1px}.nas-airport-select__label{font-family:NorwegianTextPro,Arial,Helvetica Neue,Helvetica,sans-serif;font-weight:700;font-size:14px;line-height:20px;display:block;position:relative;z-index:3;padding:9px 16px 0;background-color:inherit}.nas-airport-select__input{height:64px;position:relative;z-index:3;line-height:1;margin:0;background-color:transparent}.nas-airport-select__input[type=text]{padding:0 16px 9px}.nas-airport-select__input[type=text]:focus{border-bottom:none}.nas-airport-select__label+.nas-airport-select__input{height:34px;position:relative;z-index:3;line-height:1;margin:0;background-color:transparent}.nas-airport-select__label+.nas-airport-select__input[type=text]{padding:0 16px 9px}.nas-airport-select__icon{position:absolute;z-index:4;right:18px;bottom:18px}.nas-airport-select__results-wrapper{position:relative;z-index:4;perspective:1000px;margin-top:-4px}.nas-airport-select__results-wrapper--label-outside{margin-top:9px}.nas-airport-select__results{position:absolute;z-index:3;width:100%;left:0;max-height:50vh;overflow-x:hidden;overflow-y:auto;scrollbar-width:none;-webkit-overflow-scrolling:touch;border:2px solid #15273F;background-color:#fff;transform-origin:center top;transform-style:preserve-3d;-webkit-backface-visibility:hidden;backface-visibility:hidden;animation:airport-select-results .65s ease both}.nas-airport-select__dummy{position:absolute;left:-100px}.nas-airport-select__backdrop{display:block;position:fixed;z-index:2;top:0;left:0;width:100%;height:100%;color:transparent;background-color:#0b14202b;animation:airport-select-backdrop .7s ease-out both}.nas-airport-select__list-item{border-bottom:2px solid #E9E7E4}.nas-airport-select__list-item:last-child{border-bottom:0}.nas-airport-select__list-item:not(:last-of-type):after{content:\"\";display:block;width:100%;position:absolute;bottom:0;border-bottom:1px solid #E9E7E4}.nas-airport-select__geolocation--label{align-self:center;padding-left:4px}.nas-airport-select__geolocation--icon{margin:3px 3px 0}.nas-airport-select__item{display:block;position:relative;z-index:2;width:100%;text-align:left;padding:16px;margin-top:-1px;display:flex;justify-content:space-between;outline:0}.nas-airport-select__item--focus,.nas-airport-select__item:hover,.nas-airport-select__item:focus{background-color:#15273f}.nas-airport-select__item--focus,.nas-airport-select__item--focus .nas-airport-select__name,.nas-airport-select__item--focus .nas-airport-select__code,.nas-airport-select__item:hover,.nas-airport-select__item:hover .nas-airport-select__name,.nas-airport-select__item:hover .nas-airport-select__code,.nas-airport-select__item:focus,.nas-airport-select__item:focus .nas-airport-select__name,.nas-airport-select__item:focus .nas-airport-select__code{color:#fff!important}.nas-airport-select__item--disabled{border-bottom-width:0}.nas-airport-select__item--disabled,.nas-airport-select__item--disabled .nas-airport-select__name,.nas-airport-select__item--disabled .nas-airport-select__code{color:#6f6f6f!important}.nas-airport-select__item--disabled:hover,.nas-airport-select__item--disabled:focus{background-color:#fff;cursor:auto}.nas-airport-select__item--disabled:hover,.nas-airport-select__item--disabled:hover .nas-airport-select__name,.nas-airport-select__item--disabled:hover .nas-airport-select__code,.nas-airport-select__item--disabled:focus,.nas-airport-select__item--disabled:focus .nas-airport-select__name,.nas-airport-select__item--disabled:focus .nas-airport-select__code{color:#6f6f6f!important}.nas-airport-select__item--geolocation{border-bottom:2px solid #E9E7E4}.nas-airport-select__name,.nas-airport-select__code{display:inline-block;font-family:NorwegianTextPro,Arial,Helvetica Neue,Helvetica,sans-serif;font-weight:700;line-height:1;color:#15273f;margin-bottom:3px}.nas-airport-select__name--invalid,.nas-airport-select__code--invalid{margin:12px}.nas-airport-select__code{margin-left:.12em}.nas-airport-select__country{display:block;font-size:14px}.nas-airport-select__empty{font-family:NorwegianTextPro,Arial,Helvetica Neue,Helvetica,sans-serif;font-weight:700;font-size:16px;line-height:1.4;color:#15273f;margin:0;padding:12px}.nas-icon-vector,.nas-icon-vector--secondary{margin-bottom:2px}.nas-filter .nas-airport-select-combo,.nas-search-filter .nas-airport-select-combo{margin:0 3px 0 0}.nas-airport-select-combo{position:relative;display:flex;flex-direction:column;width:100%;margin:8px auto;gap:8px}.nas-airport-select-combo--inline{flex-direction:row}.nas-airport-select-combo--inline .nas-airport-select-combo__switcher{left:48%;top:14px;transform:rotate(90deg)}.nas-airport-select-combo--inline .nas-airport-select--padding-destination .nas-airport-select__label{padding:12px 24px 0}.nas-airport-select-combo--inline .nas-airport-select--padding-destination .nas-airport-select__label+.nas-airport-select__input[type=text]{padding:0 24px 12px}.nas-airport-select-combo__switcher{position:absolute;top:48px;z-index:3;left:76%;cursor:pointer;border:2px solid #6F6F6F;border-radius:50%;width:40px;height:40px;background-color:#fff;justify-content:center;align-items:center;display:flex}.nas-airport-select-combo__switcher:focus{outline:none;box-shadow:0 0 1px 2px #e9e7e4,0 0 2px 3px #7ca4cd}.nas-airport-select-combo__switcher--filled{border:2px solid #15273F}@keyframes airport-select-backdrop{0%{opacity:0}}@keyframes airport-select-results{0%{transform:rotateX(-90deg)}40%{transform:rotateX(20deg)}to{transform:rotateX(0)}}\n"], dependencies: [{ kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i3.NasClassDirective, selector: "[nasClass]", inputs: ["nasClass", "attr.class"] }, { kind: "component", type: i4.IconComponent, selector: "nas-icon", inputs: ["icon", "type", "isIndicator", "lightCircularBackground", "cssClass"] }, { kind: "component", type: i5.AirportSelectDropdownComponent, selector: "nas-airport-select-dropdown", inputs: ["id", "displayLatestSearches", "displayClosestAirports", "latestSearches", "resultsLabels", "airportSelectLabel", "airportSelectPlaceholder", "airportSelectIconModifier", "labelOutside", "keepSelection", "nasFormControlName", "nasFormGroup", "enableGeolocation", "ariaLabelClear", "ariaLabelBackdrop", "isValid", "invalidText", "closestAirports", "airport", "open", "airports"], outputs: ["selected", "openChange", "focusOnNext", "focusOnPrevious", "positionChange", "clearedSelection"] }], encapsulation: i0.ViewEncapsulation.None }); }
|
|
388
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: AirportSelectComponent, selector: "nas-airport-select", inputs: { outboundId: "outboundId", inboundId: "inboundId", airports: "airports", airportRelations: "airportRelations", latestSearchesOrigin: "latestSearchesOrigin", latestSearchesDestination: "latestSearchesDestination", closestAirports: "closestAirports", allowedOriginAiports: "allowedOriginAiports", allowedDestinationAirports: "allowedDestinationAirports", displayLatestSearches: "displayLatestSearches", displayClosestAirports: "displayClosestAirports", combo: "combo", useSwitch: "useSwitch", allAirportsLabel: "allAirportsLabel", latestSearchesLabel: "latestSearchesLabel", closestAirportsLabel: "closestAirportsLabel", geolocationLabel: "geolocationLabel", geolocationBlockedLabel: "geolocationBlockedLabel", selectOriginFirstLabel: "selectOriginFirstLabel", invalidDestinationText: "invalidDestinationText", labelOrigin: "labelOrigin", placeholderOrigin: "placeholderOrigin", labelDestination: "labelDestination", placeholderDestination: "placeholderDestination", labelOutside: "labelOutside", keepSelection: "keepSelection", nasFormControlNameOrigin: "nasFormControlNameOrigin", nasFormControlNameDestination: "nasFormControlNameDestination", nasFormGroup: "nasFormGroup", originAirportCode: "originAirportCode", destinationAirportCode: "destinationAirportCode", ariaLabelClear: "ariaLabelClear", ariaLabelBackdrop: "ariaLabelBackdrop" }, outputs: { originChange: "originChange", originOpenChange: "originOpenChange", destinationChange: "destinationChange", destinationOpenChange: "destinationOpenChange", focusOnNext: "focusOnNext", positionChange: "positionChange" }, host: { listeners: { "window:resize": "onResize($event)" } }, viewQueries: [{ propertyName: "container", first: true, predicate: ["container"], descendants: true }, { propertyName: "switchButton", first: true, predicate: ["switchButton"], descendants: true }, { propertyName: "airportSelectDropdownOrigin", first: true, predicate: ["airportSelectDropdownOrigin"], descendants: true }, { propertyName: "airportSelectDropdownDestination", first: true, predicate: ["airportSelectDropdownDestination"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<div *ngIf=\"exists(combo); else airportSelectTemplate\"\n [nasClass]=\"getAirportSelectComboClass('', [inlineFlex && 'inline'])\" #container>\n <ng-container *ngTemplateOutlet=\"airportSelectTemplate\"></ng-container>\n</div>\n<ng-template #airportSelectTemplate>\n <div [nasClass]=\"getClass('', exists(useSwitch) && 'padding-origin')\" *ngIf=\"airportsOrigin\">\n <nas-airport-select-dropdown #airportSelectDropdownOrigin displayLatestSearches [id]=\"outboundId\"\n [enableGeolocation]=\"displayClosestAirports\" [displayClosestAirports]=\"displayClosestAirports\"\n [airportSelectLabel]=\"labelOrigin\" [latestSearches]=\"latestSearchesOrigin\" [closestAirports]=\"closestAirports\"\n [airport]=\"origin\" [airports]=\"airportsOrigin\" [resultsLabels]=\"resultsLabels\"\n [airportSelectPlaceholder]=\"placeholderOrigin\" [open]=\"originOpen\" [keepSelection]=\"keepSelection\"\n [airportSelectIconModifier]=\"'flight-departure'\" [nasFormControlName]=\"nasFormControlNameOrigin\"\n [nasFormGroup]=\"nasFormGroup\" [ariaLabelClear]=\"ariaLabelClear\" [ariaLabelBackdrop]=\"ariaLabelBackdrop\"\n [labelOutside]=\"labelOutside\" (clearedSelection)=\"onSelectionCleared()\" (selected)=\"setSelectedOrigin($event)\"\n (openChange)=\"onOriginOpen($event)\" (focusOnNext)=\"setDestinationOpen($event)\"\n (positionChange)=\"getClosestAirports($event)\"></nas-airport-select-dropdown>\n </div>\n <ng-container *ngIf=\"exists(combo)\">\n <div [nasClass]=\"getClass('', exists(useSwitch) && 'padding-destination')\"\n *ngIf=\"airportsDestination && airportsDestination.length > 0\">\n <nas-airport-select-dropdown #airportSelectDropdownDestination displayLatestSearches [id]=\"inboundId\"\n [airportSelectLabel]=\"labelDestination\" [displayClosestAirports]=\"false\"\n [latestSearches]=\"currentLatestSearchesDestination\" [airports]=\"airportsDestination\"\n [resultsLabels]=\"resultsLabels\" [airport]=\"destination\" [airportSelectPlaceholder]=\"placeholderDestination\"\n [open]=\"destinationOpen\" [keepSelection]=\"keepSelection\" [airportSelectIconModifier]=\"'flight-arrival'\"\n [nasFormControlName]=\"nasFormControlNameDestination\" [nasFormGroup]=\"nasFormGroup\"\n [ariaLabelClear]=\"ariaLabelClear\" [ariaLabelBackdrop]=\"ariaLabelBackdrop\" [isValid]=\"isDestinationValid\"\n [invalidText]=\"invalidDestinationText\" [labelOutside]=\"labelOutside\" (clearedSelection)=\"onSelectionCleared()\"\n (selected)=\"setSelectedDestination($event)\" (openChange)=\"onDestinationOpen($event)\"\n (focusOnNext)=\"setFocusOnNext($event)\" (focusOnPrevious)=\"onOriginFocus()\"></nas-airport-select-dropdown>\n </div>\n <div *ngIf=\"exists(useSwitch) && !(originOpen || destinationOpen || cleared)\" #switchButton\n [nasClass]=\"getAirportSelectComboClass('switcher', (originAirportCodeValue && destinationAirportCodeValue) && 'filled')\"\n (mouseover)=\"changeSwitchIcon()\" (mouseleave)=\"changeSwitchIcon()\" (keydown)=\"swapKeyDown($event)\"\n (click)=\"swapAirports()\">\n <nas-icon\n [type]=\"(this.destinationAirportCodeValue && this.originAirportCodeValue) ? 'vector--secondary' : 'vector'\"></nas-icon>\n </div>\n </ng-container>\n</ng-template>", styles: ["@keyframes fade-in{0%{opacity:0}}@keyframes fade-in-down{0%{opacity:0;transform:translateY(-30px)}}@keyframes fade-in-left{0%{opacity:0;transform:translate(-30px)}}@keyframes fade-in-right{0%{opacity:0;transform:translate(30px)}}@keyframes fade-out{to{opacity:0}}@keyframes flip-in{0%{opacity:0;transform:rotateX(-90deg)}40%{opacity:1;transform:rotateX(10deg)}}@keyframes flip-out{to{opacity:0;transform:rotateX(-90deg)}}@keyframes pop-in-from-top{0%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-100,1,1);opacity:0}6.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-30.227,1,1)}13.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,1.76,1,1)}20%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,7.08,1,1)}26.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,3.838,1,1)}33.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.902,1,1);opacity:1}40%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.237,1,1)}46.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.312,1,1)}53.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.141,1,1)}60%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.021,1,1)}66.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.015,1,1)}73.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.013,1,1)}80%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.005,1,1)}86.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,0,1,1)}93.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.001,1,1);-webkit-transform:translate3d(0,0,0)}to{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.001,1,1);-webkit-transform:translate3d(0,0,0)}}.nas-airport-select{position:relative;width:100%;text-align:left}.nas-airport-select label{margin-bottom:0;height:67px}.nas-airport-select:first-child{margin-bottom:0}.nas-airport-select:only-child{max-width:360px}.nas-airport-select--expanded{z-index:30}.nas-airport-select__wrapper{position:relative;display:block;z-index:3;background-color:#fff;border:2px solid #6F6F6F}.nas-airport-select__wrapper--active{background-color:#ebf4ff;border:2px solid #15273F}.nas-airport-select__wrapper--filled{border:2px solid #15273F}.nas-airport-select__wrapper--label-outside{background-color:transparent;border:0}.nas-airport-select__wrapper--label-outside input{height:50px!important;border:2px solid #6F6F6F}.nas-airport-select__wrapper--label-outside .nas-airport-select__icon{bottom:6px}.nas-airport-select__wrapper--label-outside .nas-airport-select__label{font-family:NorwegianTextPro,Arial,Helvetica Neue,Helvetica,sans-serif;font-weight:700;font-size:16px;margin-bottom:6px;padding:0}.nas-airport-select__wrapper--label-outside .nas-airport-select__label+.nas-airport-select__input[type=text]{padding:0 16px;background-color:#fff}.nas-airport-select__wrapper--label-outside .nas-airport-select__input[type=text]:focus{background-color:#ebf4ff;border:2px solid #15273F}.nas-airport-select__list-section-label{font-family:NorwegianTextPro,Arial,Helvetica Neue,Helvetica,sans-serif;font-weight:700;font-size:14px;line-height:20px;position:relative;z-index:2;text-align:center;padding:3px 12px;background-color:#e9e7e4}.nas-airport-select__list-section-label:not(:first-child){margin-top:-1px}.nas-airport-select__label{font-family:NorwegianTextPro,Arial,Helvetica Neue,Helvetica,sans-serif;font-weight:700;font-size:14px;line-height:20px;display:block;position:relative;z-index:3;padding:9px 16px 0;background-color:inherit}.nas-airport-select__input{height:64px;position:relative;z-index:3;line-height:1;margin:0;background-color:transparent}.nas-airport-select__input[type=text]{padding:0 16px 9px}.nas-airport-select__input[type=text]:focus{border-bottom:none}.nas-airport-select__label+.nas-airport-select__input{height:34px;position:relative;z-index:3;line-height:1;margin:0;background-color:transparent}.nas-airport-select__label+.nas-airport-select__input[type=text]{padding:0 16px 9px}.nas-airport-select__icon{position:absolute;z-index:4;right:18px;bottom:18px}.nas-airport-select__results-wrapper{position:relative;z-index:4;perspective:1000px;margin-top:-4px}.nas-airport-select__results-wrapper--label-outside{margin-top:9px}.nas-airport-select__results{position:absolute;z-index:3;width:100%;left:0;max-height:50vh;overflow-x:hidden;overflow-y:auto;scrollbar-width:none;-webkit-overflow-scrolling:touch;border:2px solid #15273F;background-color:#fff;transform-origin:center top;transform-style:preserve-3d;-webkit-backface-visibility:hidden;backface-visibility:hidden;animation:airport-select-results .65s ease both}.nas-airport-select__dummy{position:absolute;left:-100px}.nas-airport-select__backdrop{display:block;position:fixed;z-index:2;top:0;left:0;width:100%;height:100%;color:transparent;background-color:#0b14202b;animation:airport-select-backdrop .7s ease-out both}.nas-airport-select__list-item{border-bottom:2px solid #E9E7E4}.nas-airport-select__list-item:last-child{border-bottom:0}.nas-airport-select__list-item:not(:last-of-type):after{content:\"\";display:block;width:100%;position:absolute;bottom:0;border-bottom:1px solid #E9E7E4}.nas-airport-select__geolocation--label{align-self:center;padding-left:4px}.nas-airport-select__geolocation--icon{margin:3px 3px 0}.nas-airport-select__item{display:block;position:relative;z-index:2;width:100%;text-align:left;padding:16px;margin-top:-1px;display:flex;justify-content:space-between;outline:0}.nas-airport-select__item--focus,.nas-airport-select__item:hover,.nas-airport-select__item:focus{background-color:#15273f}.nas-airport-select__item--focus,.nas-airport-select__item--focus .nas-airport-select__name,.nas-airport-select__item--focus .nas-airport-select__code,.nas-airport-select__item:hover,.nas-airport-select__item:hover .nas-airport-select__name,.nas-airport-select__item:hover .nas-airport-select__code,.nas-airport-select__item:focus,.nas-airport-select__item:focus .nas-airport-select__name,.nas-airport-select__item:focus .nas-airport-select__code{color:#fff!important}.nas-airport-select__item--disabled{border-bottom-width:0}.nas-airport-select__item--disabled,.nas-airport-select__item--disabled .nas-airport-select__name,.nas-airport-select__item--disabled .nas-airport-select__code{color:#6f6f6f!important}.nas-airport-select__item--disabled:hover,.nas-airport-select__item--disabled:focus{background-color:#fff;cursor:auto}.nas-airport-select__item--disabled:hover,.nas-airport-select__item--disabled:hover .nas-airport-select__name,.nas-airport-select__item--disabled:hover .nas-airport-select__code,.nas-airport-select__item--disabled:focus,.nas-airport-select__item--disabled:focus .nas-airport-select__name,.nas-airport-select__item--disabled:focus .nas-airport-select__code{color:#6f6f6f!important}.nas-airport-select__item--geolocation{border-bottom:2px solid #E9E7E4}.nas-airport-select__name,.nas-airport-select__code{display:inline-block;font-family:NorwegianTextPro,Arial,Helvetica Neue,Helvetica,sans-serif;font-weight:700;line-height:1;color:#15273f;margin-bottom:3px}.nas-airport-select__name--invalid,.nas-airport-select__code--invalid{margin:12px}.nas-airport-select__code{margin-left:.12em}.nas-airport-select__country{display:block;font-size:14px}.nas-airport-select__empty{font-family:NorwegianTextPro,Arial,Helvetica Neue,Helvetica,sans-serif;font-weight:700;font-size:16px;line-height:1.4;color:#15273f;margin:0;padding:12px}.nas-icon-vector,.nas-icon-vector--secondary{margin-bottom:2px}.nas-filter .nas-airport-select-combo,.nas-search-filter .nas-airport-select-combo{margin:0 3px 0 0}.nas-airport-select-combo{position:relative;display:flex;flex-direction:column;width:100%;margin:8px auto;gap:8px}.nas-airport-select-combo--inline{flex-direction:row}.nas-airport-select-combo--inline .nas-airport-select-combo__switcher{left:48%;top:14px;transform:rotate(90deg)}.nas-airport-select-combo--inline .nas-airport-select--padding-destination .nas-airport-select__label{padding:12px 24px 0}.nas-airport-select-combo--inline .nas-airport-select--padding-destination .nas-airport-select__label+.nas-airport-select__input[type=text]{padding:0 24px 12px}.nas-airport-select-combo__switcher{position:absolute;top:48px;z-index:3;left:76%;cursor:pointer;border:2px solid #6F6F6F;border-radius:50%;width:40px;height:40px;background-color:#fff;justify-content:center;align-items:center;display:flex}.nas-airport-select-combo__switcher:focus{outline:none;box-shadow:0 0 1px 2px #e9e7e4,0 0 2px 3px #7ca4cd}.nas-airport-select-combo__switcher--filled{border:2px solid #15273F}@keyframes airport-select-backdrop{0%{opacity:0}}@keyframes airport-select-results{0%{transform:rotateX(-90deg)}40%{transform:rotateX(20deg)}to{transform:rotateX(0)}}\n"], dependencies: [{ kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i3.NasClassDirective, selector: "[nasClass]", inputs: ["nasClass", "attr.class"] }, { kind: "component", type: i4.IconComponent, selector: "nas-icon", inputs: ["icon", "type", "isIndicator", "lightCircularBackground", "cssClass"] }, { kind: "component", type: i5.AirportSelectDropdownComponent, selector: "nas-airport-select-dropdown", inputs: ["id", "displayLatestSearches", "displayClosestAirports", "latestSearches", "resultsLabels", "airportSelectLabel", "airportSelectPlaceholder", "airportSelectIconModifier", "labelOutside", "keepSelection", "nasFormControlName", "nasFormGroup", "enableGeolocation", "ariaLabelClear", "ariaLabelBackdrop", "isValid", "invalidText", "closestAirports", "airport", "open", "airports"], outputs: ["selected", "openChange", "focusOnNext", "focusOnPrevious", "positionChange", "clearedSelection"] }], encapsulation: i0.ViewEncapsulation.None }); }
|
|
389
389
|
}
|
|
390
390
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: AirportSelectComponent, decorators: [{
|
|
391
391
|
type: Component,
|
|
392
|
-
args: [{ selector: 'nas-airport-select', encapsulation: ViewEncapsulation.None, template: "<div *ngIf=\"exists(combo); else airportSelectTemplate\"\n [nasClass]=\"getAirportSelectComboClass('', [inlineFlex && 'inline'])\" #container>\n <ng-container *ngTemplateOutlet=\"airportSelectTemplate\"></ng-container>\n</div>\n<ng-template #airportSelectTemplate>\n <div [nasClass]=\"getClass('', exists(useSwitch) && 'padding-origin')\" *ngIf=\"airportsOrigin\">\n <nas-airport-select-dropdown #airportSelectDropdownOrigin displayLatestSearches [id]=\"outboundId\"\n [enableGeolocation]=\"displayClosestAirports\" [displayClosestAirports]=\"displayClosestAirports\"\n [airportSelectLabel]=\"labelOrigin\" [latestSearches]=\"latestSearchesOrigin\" [closestAirports]=\"closestAirports\"\n [airport]=\"origin\" [airports]=\"airportsOrigin\" [resultsLabels]=\"resultsLabels\"\n [airportSelectPlaceholder]=\"placeholderOrigin\" [open]=\"originOpen\" [keepSelection]=\"keepSelection\"\n [airportSelectIconModifier]=\"'flight-departure'\" [nasFormControlName]=\"nasFormControlNameOrigin\"\n [nasFormGroup]=\"nasFormGroup\" [ariaLabelClear]=\"ariaLabelClear\" [ariaLabelBackdrop]=\"ariaLabelBackdrop\"\n [labelOutside]=\"labelOutside\" (clearedSelection)=\"onSelectionCleared()\" (selected)=\"setSelectedOrigin($event)\"\n (openChange)=\"onOriginOpen($event)\" (focusOnNext)=\"setDestinationOpen($event)\"\n (positionChange)=\"getClosestAirports($event)\"></nas-airport-select-dropdown>\n </div>\n <ng-container *ngIf=\"exists(combo)\">\n <div [nasClass]=\"getClass('', exists(useSwitch) && 'padding-destination')\"\n *ngIf=\"airportsDestination && airportsDestination.length > 0\">\n <nas-airport-select-dropdown #airportSelectDropdownDestination displayLatestSearches [id]=\"inboundId\"\n [airportSelectLabel]=\"labelDestination\" [displayClosestAirports]=\"false\"\n [latestSearches]=\"currentLatestSearchesDestination\" [airports]=\"airportsDestination\"\n [resultsLabels]=\"resultsLabels\" [airport]=\"destination\" [airportSelectPlaceholder]=\"placeholderDestination\"\n [open]=\"destinationOpen\" [keepSelection]=\"keepSelection\" [airportSelectIconModifier]=\"'flight-arrival'\"\n [nasFormControlName]=\"nasFormControlNameDestination\" [nasFormGroup]=\"nasFormGroup\"\n [ariaLabelClear]=\"ariaLabelClear\" [ariaLabelBackdrop]=\"ariaLabelBackdrop\" [isValid]=\"isDestinationValid\"\n [invalidText]=\"invalidDestinationText\" [labelOutside]=\"labelOutside\" (clearedSelection)=\"onSelectionCleared()\"\n (selected)=\"setSelectedDestination($event)\" (openChange)=\"onDestinationOpen($event)\"\n (focusOnNext)=\"setFocusOnNext($event)\" (focusOnPrevious)=\"onOriginFocus()\"></nas-airport-select-dropdown>\n </div>\n <div *ngIf=\"exists(useSwitch) && !(originOpen || destinationOpen || cleared)\" #switchButton\n [nasClass]=\"getAirportSelectComboClass('switcher', (originAirportCodeValue && destinationAirportCodeValue) && 'filled')\"\n (mouseover)=\"changeSwitchIcon()\" (mouseleave)=\"changeSwitchIcon()\" (keydown)=\"swapKeyDown($event)\"\n (click)=\"swapAirports()\">\n <nas-icon\n [type]=\"(this.destinationAirportCodeValue && this.originAirportCodeValue) ? 'vector--secondary' : 'vector'\"></nas-icon>\n </div>\n </ng-container>\n</ng-template>", styles: ["@keyframes fade-in{0%{opacity:0}}@keyframes fade-in-down{0%{opacity:0;transform:translateY(-30px)}}@keyframes fade-in-left{0%{opacity:0;transform:translate(-30px)}}@keyframes fade-in-right{0%{opacity:0;transform:translate(30px)}}@keyframes fade-out{to{opacity:0}}@keyframes flip-in{0%{opacity:0;transform:rotateX(-90deg)}40%{opacity:1;transform:rotateX(10deg)}}@keyframes flip-out{to{opacity:0;transform:rotateX(-90deg)}}@keyframes pop-in-from-top{0%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-100,1,1);opacity:0}6.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-30.227,1,1)}13.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,1.76,1,1)}20%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,7.08,1,1)}26.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,3.838,1,1)}33.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.902,1,1);opacity:1}40%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.237,1,1)}46.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.312,1,1)}53.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.141,1,1)}60%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.021,1,1)}66.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.015,1,1)}73.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.013,1,1)}80%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.005,1,1)}86.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,0,1,1)}93.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.001,1,1);-webkit-transform:translate3d(0,0,0)}to{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.001,1,1);-webkit-transform:translate3d(0,0,0)}}.nas-airport-select{position:relative;width:100%;text-align:left}.nas-airport-select label{margin-bottom:0;height:67px}.nas-airport-select:first-child{margin-bottom:0}.nas-airport-select:only-child{max-width:360px}.nas-airport-select--expanded{z-index:30}.nas-airport-select__wrapper{position:relative;display:block;z-index:3;background-color:#fff;border:2px solid #6F6F6F}.nas-airport-select__wrapper--active{background-color:#ebf4ff;border:2px solid #15273F}.nas-airport-select__wrapper--filled{border:2px solid #15273F}.nas-airport-select__wrapper--label-outside{background-color:transparent;border:0}.nas-airport-select__wrapper--label-outside input{height:50px!important;border:2px solid #6F6F6F}.nas-airport-select__wrapper--label-outside .nas-airport-select__icon{bottom:6px}.nas-airport-select__wrapper--label-outside .nas-airport-select__label{font-family:NorwegianTextPro,Arial,Helvetica Neue,Helvetica,sans-serif;font-weight:700;font-size:16px;margin-bottom:6px;padding:0}.nas-airport-select__wrapper--label-outside .nas-airport-select__label+.nas-airport-select__input[type=text]{padding:0 16px}.nas-airport-select__list-section-label{font-family:NorwegianTextPro,Arial,Helvetica Neue,Helvetica,sans-serif;font-weight:700;font-size:14px;line-height:20px;position:relative;z-index:2;text-align:center;padding:3px 12px;background-color:#e9e7e4}.nas-airport-select__list-section-label:not(:first-child){margin-top:-1px}.nas-airport-select__label{font-family:NorwegianTextPro,Arial,Helvetica Neue,Helvetica,sans-serif;font-weight:700;font-size:14px;line-height:20px;display:block;position:relative;z-index:3;padding:9px 16px 0;background-color:inherit}.nas-airport-select__input{height:64px;position:relative;z-index:3;line-height:1;margin:0;background-color:transparent}.nas-airport-select__input[type=text]{padding:0 16px 9px}.nas-airport-select__input[type=text]:focus{border-bottom:none}.nas-airport-select__label+.nas-airport-select__input{height:34px;position:relative;z-index:3;line-height:1;margin:0;background-color:transparent}.nas-airport-select__label+.nas-airport-select__input[type=text]{padding:0 16px 9px}.nas-airport-select__icon{position:absolute;z-index:4;right:18px;bottom:18px}.nas-airport-select__results-wrapper{position:relative;z-index:4;perspective:1000px;margin-top:-4px}.nas-airport-select__results-wrapper--label-outside{margin-top:9px}.nas-airport-select__results{position:absolute;z-index:3;width:100%;left:0;max-height:50vh;overflow-x:hidden;overflow-y:auto;scrollbar-width:none;-webkit-overflow-scrolling:touch;border:2px solid #15273F;background-color:#fff;transform-origin:center top;transform-style:preserve-3d;-webkit-backface-visibility:hidden;backface-visibility:hidden;animation:airport-select-results .65s ease both}.nas-airport-select__dummy{position:absolute;left:-100px}.nas-airport-select__backdrop{display:block;position:fixed;z-index:2;top:0;left:0;width:100%;height:100%;color:transparent;background-color:#0b14202b;animation:airport-select-backdrop .7s ease-out both}.nas-airport-select__list-item{border-bottom:2px solid #E9E7E4}.nas-airport-select__list-item:last-child{border-bottom:0}.nas-airport-select__list-item:not(:last-of-type):after{content:\"\";display:block;width:100%;position:absolute;bottom:0;border-bottom:1px solid #E9E7E4}.nas-airport-select__geolocation--label{align-self:center;padding-left:4px}.nas-airport-select__geolocation--icon{margin:3px 3px 0}.nas-airport-select__item{display:block;position:relative;z-index:2;width:100%;text-align:left;padding:16px;margin-top:-1px;display:flex;justify-content:space-between;outline:0}.nas-airport-select__item--focus,.nas-airport-select__item:hover,.nas-airport-select__item:focus{background-color:#15273f}.nas-airport-select__item--focus,.nas-airport-select__item--focus .nas-airport-select__name,.nas-airport-select__item--focus .nas-airport-select__code,.nas-airport-select__item:hover,.nas-airport-select__item:hover .nas-airport-select__name,.nas-airport-select__item:hover .nas-airport-select__code,.nas-airport-select__item:focus,.nas-airport-select__item:focus .nas-airport-select__name,.nas-airport-select__item:focus .nas-airport-select__code{color:#fff!important}.nas-airport-select__item--disabled{border-bottom-width:0}.nas-airport-select__item--disabled,.nas-airport-select__item--disabled .nas-airport-select__name,.nas-airport-select__item--disabled .nas-airport-select__code{color:#6f6f6f!important}.nas-airport-select__item--disabled:hover,.nas-airport-select__item--disabled:focus{background-color:#fff;cursor:auto}.nas-airport-select__item--disabled:hover,.nas-airport-select__item--disabled:hover .nas-airport-select__name,.nas-airport-select__item--disabled:hover .nas-airport-select__code,.nas-airport-select__item--disabled:focus,.nas-airport-select__item--disabled:focus .nas-airport-select__name,.nas-airport-select__item--disabled:focus .nas-airport-select__code{color:#6f6f6f!important}.nas-airport-select__item--geolocation{border-bottom:2px solid #E9E7E4}.nas-airport-select__name,.nas-airport-select__code{display:inline-block;font-family:NorwegianTextPro,Arial,Helvetica Neue,Helvetica,sans-serif;font-weight:700;line-height:1;color:#15273f;margin-bottom:3px}.nas-airport-select__name--invalid,.nas-airport-select__code--invalid{margin:12px}.nas-airport-select__code{margin-left:.12em}.nas-airport-select__country{display:block;font-size:14px}.nas-airport-select__empty{font-family:NorwegianTextPro,Arial,Helvetica Neue,Helvetica,sans-serif;font-weight:700;font-size:16px;line-height:1.4;color:#15273f;margin:0;padding:12px}.nas-icon-vector,.nas-icon-vector--secondary{margin-bottom:2px}.nas-filter .nas-airport-select-combo,.nas-search-filter .nas-airport-select-combo{margin:0 3px 0 0}.nas-airport-select-combo{position:relative;display:flex;flex-direction:column;width:100%;margin:8px auto;gap:8px}.nas-airport-select-combo--inline{flex-direction:row}.nas-airport-select-combo--inline .nas-airport-select-combo__switcher{left:48%;top:14px;transform:rotate(90deg)}.nas-airport-select-combo--inline .nas-airport-select--padding-destination .nas-airport-select__label{padding:12px 24px 0}.nas-airport-select-combo--inline .nas-airport-select--padding-destination .nas-airport-select__label+.nas-airport-select__input[type=text]{padding:0 24px 12px}.nas-airport-select-combo__switcher{position:absolute;top:48px;z-index:3;left:76%;cursor:pointer;border:2px solid #6F6F6F;border-radius:50%;width:40px;height:40px;background-color:#fff;justify-content:center;align-items:center;display:flex}.nas-airport-select-combo__switcher:focus{outline:none;box-shadow:0 0 1px 2px #e9e7e4,0 0 2px 3px #7ca4cd}.nas-airport-select-combo__switcher--filled{border:2px solid #15273F}@keyframes airport-select-backdrop{0%{opacity:0}}@keyframes airport-select-results{0%{transform:rotateX(-90deg)}40%{transform:rotateX(20deg)}to{transform:rotateX(0)}}\n"] }]
|
|
392
|
+
args: [{ selector: 'nas-airport-select', encapsulation: ViewEncapsulation.None, template: "<div *ngIf=\"exists(combo); else airportSelectTemplate\"\n [nasClass]=\"getAirportSelectComboClass('', [inlineFlex && 'inline'])\" #container>\n <ng-container *ngTemplateOutlet=\"airportSelectTemplate\"></ng-container>\n</div>\n<ng-template #airportSelectTemplate>\n <div [nasClass]=\"getClass('', exists(useSwitch) && 'padding-origin')\" *ngIf=\"airportsOrigin\">\n <nas-airport-select-dropdown #airportSelectDropdownOrigin displayLatestSearches [id]=\"outboundId\"\n [enableGeolocation]=\"displayClosestAirports\" [displayClosestAirports]=\"displayClosestAirports\"\n [airportSelectLabel]=\"labelOrigin\" [latestSearches]=\"latestSearchesOrigin\" [closestAirports]=\"closestAirports\"\n [airport]=\"origin\" [airports]=\"airportsOrigin\" [resultsLabels]=\"resultsLabels\"\n [airportSelectPlaceholder]=\"placeholderOrigin\" [open]=\"originOpen\" [keepSelection]=\"keepSelection\"\n [airportSelectIconModifier]=\"'flight-departure'\" [nasFormControlName]=\"nasFormControlNameOrigin\"\n [nasFormGroup]=\"nasFormGroup\" [ariaLabelClear]=\"ariaLabelClear\" [ariaLabelBackdrop]=\"ariaLabelBackdrop\"\n [labelOutside]=\"labelOutside\" (clearedSelection)=\"onSelectionCleared()\" (selected)=\"setSelectedOrigin($event)\"\n (openChange)=\"onOriginOpen($event)\" (focusOnNext)=\"setDestinationOpen($event)\"\n (positionChange)=\"getClosestAirports($event)\"></nas-airport-select-dropdown>\n </div>\n <ng-container *ngIf=\"exists(combo)\">\n <div [nasClass]=\"getClass('', exists(useSwitch) && 'padding-destination')\"\n *ngIf=\"airportsDestination && airportsDestination.length > 0\">\n <nas-airport-select-dropdown #airportSelectDropdownDestination displayLatestSearches [id]=\"inboundId\"\n [airportSelectLabel]=\"labelDestination\" [displayClosestAirports]=\"false\"\n [latestSearches]=\"currentLatestSearchesDestination\" [airports]=\"airportsDestination\"\n [resultsLabels]=\"resultsLabels\" [airport]=\"destination\" [airportSelectPlaceholder]=\"placeholderDestination\"\n [open]=\"destinationOpen\" [keepSelection]=\"keepSelection\" [airportSelectIconModifier]=\"'flight-arrival'\"\n [nasFormControlName]=\"nasFormControlNameDestination\" [nasFormGroup]=\"nasFormGroup\"\n [ariaLabelClear]=\"ariaLabelClear\" [ariaLabelBackdrop]=\"ariaLabelBackdrop\" [isValid]=\"isDestinationValid\"\n [invalidText]=\"invalidDestinationText\" [labelOutside]=\"labelOutside\" (clearedSelection)=\"onSelectionCleared()\"\n (selected)=\"setSelectedDestination($event)\" (openChange)=\"onDestinationOpen($event)\"\n (focusOnNext)=\"setFocusOnNext($event)\" (focusOnPrevious)=\"onOriginFocus()\"></nas-airport-select-dropdown>\n </div>\n <div *ngIf=\"exists(useSwitch) && !(originOpen || destinationOpen || cleared)\" #switchButton\n [nasClass]=\"getAirportSelectComboClass('switcher', (originAirportCodeValue && destinationAirportCodeValue) && 'filled')\"\n (mouseover)=\"changeSwitchIcon()\" (mouseleave)=\"changeSwitchIcon()\" (keydown)=\"swapKeyDown($event)\"\n (click)=\"swapAirports()\">\n <nas-icon\n [type]=\"(this.destinationAirportCodeValue && this.originAirportCodeValue) ? 'vector--secondary' : 'vector'\"></nas-icon>\n </div>\n </ng-container>\n</ng-template>", styles: ["@keyframes fade-in{0%{opacity:0}}@keyframes fade-in-down{0%{opacity:0;transform:translateY(-30px)}}@keyframes fade-in-left{0%{opacity:0;transform:translate(-30px)}}@keyframes fade-in-right{0%{opacity:0;transform:translate(30px)}}@keyframes fade-out{to{opacity:0}}@keyframes flip-in{0%{opacity:0;transform:rotateX(-90deg)}40%{opacity:1;transform:rotateX(10deg)}}@keyframes flip-out{to{opacity:0;transform:rotateX(-90deg)}}@keyframes pop-in-from-top{0%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-100,1,1);opacity:0}6.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-30.227,1,1)}13.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,1.76,1,1)}20%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,7.08,1,1)}26.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,3.838,1,1)}33.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.902,1,1);opacity:1}40%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.237,1,1)}46.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.312,1,1)}53.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.141,1,1)}60%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.021,1,1)}66.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.015,1,1)}73.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.013,1,1)}80%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.005,1,1)}86.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,0,1,1)}93.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.001,1,1);-webkit-transform:translate3d(0,0,0)}to{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.001,1,1);-webkit-transform:translate3d(0,0,0)}}.nas-airport-select{position:relative;width:100%;text-align:left}.nas-airport-select label{margin-bottom:0;height:67px}.nas-airport-select:first-child{margin-bottom:0}.nas-airport-select:only-child{max-width:360px}.nas-airport-select--expanded{z-index:30}.nas-airport-select__wrapper{position:relative;display:block;z-index:3;background-color:#fff;border:2px solid #6F6F6F}.nas-airport-select__wrapper--active{background-color:#ebf4ff;border:2px solid #15273F}.nas-airport-select__wrapper--filled{border:2px solid #15273F}.nas-airport-select__wrapper--label-outside{background-color:transparent;border:0}.nas-airport-select__wrapper--label-outside input{height:50px!important;border:2px solid #6F6F6F}.nas-airport-select__wrapper--label-outside .nas-airport-select__icon{bottom:6px}.nas-airport-select__wrapper--label-outside .nas-airport-select__label{font-family:NorwegianTextPro,Arial,Helvetica Neue,Helvetica,sans-serif;font-weight:700;font-size:16px;margin-bottom:6px;padding:0}.nas-airport-select__wrapper--label-outside .nas-airport-select__label+.nas-airport-select__input[type=text]{padding:0 16px;background-color:#fff}.nas-airport-select__wrapper--label-outside .nas-airport-select__input[type=text]:focus{background-color:#ebf4ff;border:2px solid #15273F}.nas-airport-select__list-section-label{font-family:NorwegianTextPro,Arial,Helvetica Neue,Helvetica,sans-serif;font-weight:700;font-size:14px;line-height:20px;position:relative;z-index:2;text-align:center;padding:3px 12px;background-color:#e9e7e4}.nas-airport-select__list-section-label:not(:first-child){margin-top:-1px}.nas-airport-select__label{font-family:NorwegianTextPro,Arial,Helvetica Neue,Helvetica,sans-serif;font-weight:700;font-size:14px;line-height:20px;display:block;position:relative;z-index:3;padding:9px 16px 0;background-color:inherit}.nas-airport-select__input{height:64px;position:relative;z-index:3;line-height:1;margin:0;background-color:transparent}.nas-airport-select__input[type=text]{padding:0 16px 9px}.nas-airport-select__input[type=text]:focus{border-bottom:none}.nas-airport-select__label+.nas-airport-select__input{height:34px;position:relative;z-index:3;line-height:1;margin:0;background-color:transparent}.nas-airport-select__label+.nas-airport-select__input[type=text]{padding:0 16px 9px}.nas-airport-select__icon{position:absolute;z-index:4;right:18px;bottom:18px}.nas-airport-select__results-wrapper{position:relative;z-index:4;perspective:1000px;margin-top:-4px}.nas-airport-select__results-wrapper--label-outside{margin-top:9px}.nas-airport-select__results{position:absolute;z-index:3;width:100%;left:0;max-height:50vh;overflow-x:hidden;overflow-y:auto;scrollbar-width:none;-webkit-overflow-scrolling:touch;border:2px solid #15273F;background-color:#fff;transform-origin:center top;transform-style:preserve-3d;-webkit-backface-visibility:hidden;backface-visibility:hidden;animation:airport-select-results .65s ease both}.nas-airport-select__dummy{position:absolute;left:-100px}.nas-airport-select__backdrop{display:block;position:fixed;z-index:2;top:0;left:0;width:100%;height:100%;color:transparent;background-color:#0b14202b;animation:airport-select-backdrop .7s ease-out both}.nas-airport-select__list-item{border-bottom:2px solid #E9E7E4}.nas-airport-select__list-item:last-child{border-bottom:0}.nas-airport-select__list-item:not(:last-of-type):after{content:\"\";display:block;width:100%;position:absolute;bottom:0;border-bottom:1px solid #E9E7E4}.nas-airport-select__geolocation--label{align-self:center;padding-left:4px}.nas-airport-select__geolocation--icon{margin:3px 3px 0}.nas-airport-select__item{display:block;position:relative;z-index:2;width:100%;text-align:left;padding:16px;margin-top:-1px;display:flex;justify-content:space-between;outline:0}.nas-airport-select__item--focus,.nas-airport-select__item:hover,.nas-airport-select__item:focus{background-color:#15273f}.nas-airport-select__item--focus,.nas-airport-select__item--focus .nas-airport-select__name,.nas-airport-select__item--focus .nas-airport-select__code,.nas-airport-select__item:hover,.nas-airport-select__item:hover .nas-airport-select__name,.nas-airport-select__item:hover .nas-airport-select__code,.nas-airport-select__item:focus,.nas-airport-select__item:focus .nas-airport-select__name,.nas-airport-select__item:focus .nas-airport-select__code{color:#fff!important}.nas-airport-select__item--disabled{border-bottom-width:0}.nas-airport-select__item--disabled,.nas-airport-select__item--disabled .nas-airport-select__name,.nas-airport-select__item--disabled .nas-airport-select__code{color:#6f6f6f!important}.nas-airport-select__item--disabled:hover,.nas-airport-select__item--disabled:focus{background-color:#fff;cursor:auto}.nas-airport-select__item--disabled:hover,.nas-airport-select__item--disabled:hover .nas-airport-select__name,.nas-airport-select__item--disabled:hover .nas-airport-select__code,.nas-airport-select__item--disabled:focus,.nas-airport-select__item--disabled:focus .nas-airport-select__name,.nas-airport-select__item--disabled:focus .nas-airport-select__code{color:#6f6f6f!important}.nas-airport-select__item--geolocation{border-bottom:2px solid #E9E7E4}.nas-airport-select__name,.nas-airport-select__code{display:inline-block;font-family:NorwegianTextPro,Arial,Helvetica Neue,Helvetica,sans-serif;font-weight:700;line-height:1;color:#15273f;margin-bottom:3px}.nas-airport-select__name--invalid,.nas-airport-select__code--invalid{margin:12px}.nas-airport-select__code{margin-left:.12em}.nas-airport-select__country{display:block;font-size:14px}.nas-airport-select__empty{font-family:NorwegianTextPro,Arial,Helvetica Neue,Helvetica,sans-serif;font-weight:700;font-size:16px;line-height:1.4;color:#15273f;margin:0;padding:12px}.nas-icon-vector,.nas-icon-vector--secondary{margin-bottom:2px}.nas-filter .nas-airport-select-combo,.nas-search-filter .nas-airport-select-combo{margin:0 3px 0 0}.nas-airport-select-combo{position:relative;display:flex;flex-direction:column;width:100%;margin:8px auto;gap:8px}.nas-airport-select-combo--inline{flex-direction:row}.nas-airport-select-combo--inline .nas-airport-select-combo__switcher{left:48%;top:14px;transform:rotate(90deg)}.nas-airport-select-combo--inline .nas-airport-select--padding-destination .nas-airport-select__label{padding:12px 24px 0}.nas-airport-select-combo--inline .nas-airport-select--padding-destination .nas-airport-select__label+.nas-airport-select__input[type=text]{padding:0 24px 12px}.nas-airport-select-combo__switcher{position:absolute;top:48px;z-index:3;left:76%;cursor:pointer;border:2px solid #6F6F6F;border-radius:50%;width:40px;height:40px;background-color:#fff;justify-content:center;align-items:center;display:flex}.nas-airport-select-combo__switcher:focus{outline:none;box-shadow:0 0 1px 2px #e9e7e4,0 0 2px 3px #7ca4cd}.nas-airport-select-combo__switcher--filled{border:2px solid #15273F}@keyframes airport-select-backdrop{0%{opacity:0}}@keyframes airport-select-results{0%{transform:rotateX(-90deg)}40%{transform:rotateX(20deg)}to{transform:rotateX(0)}}\n"] }]
|
|
393
393
|
}], ctorParameters: function () { return [{ type: i1.DeviceHelper }, { type: i0.ChangeDetectorRef }]; }, propDecorators: { container: [{
|
|
394
394
|
type: ViewChild,
|
|
395
395
|
args: ['container']
|
|
@@ -120,11 +120,11 @@ export class ButtonComponent extends NasComponentBase {
|
|
|
120
120
|
this.focusOnNext.emit(event);
|
|
121
121
|
}
|
|
122
122
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: ButtonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
123
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: ButtonComponent, selector: "nas-button", inputs: { primary: "primary", secondary: "secondary", tertiary: "tertiary", link: "link", light: "light", large: "large", block: "block", flex: "flex", compact: "compact", right: "right", spaceless: "spaceless", href: "href", trackingvalue: "trackingvalue", canContinueOnDisabled: "canContinueOnDisabled", disabled: "disabled", type: "type", cssClass: "cssClass", ariaLabel: "ariaLabel", cssStyle: "cssStyle", tabindex: "tabindex", overrideBaseCssClass: "overrideBaseCssClass", useRouterLink: "useRouterLink", id: "id", target: "target", icon: "icon", iconLeft: "iconLeft", iconType: "iconType", buttonlink: "buttonlink" }, outputs: { clickChange: "clickChange", focusOnNext: "focusOnNext" }, viewQueries: [{ propertyName: "button", first: true, predicate: ["button"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<button #button *ngIf=\"!href\" [nasClass]=\"getClasses('', modifiers)\" [ngStyle]=\"buttonStyle\"\n [disabled]=\"!canContinueOnDisabled && disabled\" [class.disabled]=\"disabled\" [attr.type]=\"type\"\n [attr.aria-label]=\"ariaLabel\" [attr.tabindex]=\"tabindex\" [id]=\"buttonId\" (click)=\"emitTrackingAndClickEvent($event)\"\n (keydown)=\"onKeydown($event)\">\n <span [nasClass]=\"getClass('content', exists(iconLeft) && 'reverse')\">\n <ng-container *ngTemplateOutlet=\"content\"></ng-container>\n <span [nasClass]=\"getClass('icon')\" *ngIf=\"icon || iconType\">\n <nas-icon [icon]=\"icon\" [type]=\"iconType\"></nas-icon>\n </span>\n </span>\n</button>\n\n<ng-container *ngIf=\"href\">\n <ng-container *ngIf=\"exists(useRouterLink); else linksHref\">\n <a [nasClass]=\"getClasses('', modifiers)\" [attr.disabled]=\"disabled\" [routerLink]=\"href\" [id]=\"buttonId\"\n (click)=\"emitTrackingEvent();\" (keydown)=\"onKeydown($event)\">\n <ng-container *ngTemplateOutlet=\"content\"></ng-container>\n <span [nasClass]=\"getClass('icon')\" *ngIf=\"icon || iconType\">\n <nas-icon [icon]=\"icon\" [type]=\"iconType\"></nas-icon>\n </span>\n </a>\n </ng-container>\n</ng-container>\n\n<ng-template #linksHref>\n <a [nasClass]=\"getClasses('', modifiers)\" [attr.disabled]=\"disabled\" [href]=\"href\" [target]=\"target\" [id]=\"buttonId\"\n (click)=\"emitTrackingEvent();\" (keydown)=\"onKeydown($event)\">\n <span [nasClass]=\"getClass('content', exists(iconLeft) && 'reverse')\">\n <ng-container *ngTemplateOutlet=\"content\"></ng-container>\n <span [nasClass]=\"getClass('icon')\" *ngIf=\"icon || iconType\">\n <nas-icon [icon]=\"icon\" [type]=\"iconType\"></nas-icon>\n </span>\n </span>\n </a>\n</ng-template>\n\n<ng-template #content>\n <ng-content></ng-content>\n</ng-template>", styles: ["@keyframes fade-in{0%{opacity:0}}@keyframes fade-in-down{0%{opacity:0;transform:translateY(-30px)}}@keyframes fade-in-left{0%{opacity:0;transform:translate(-30px)}}@keyframes fade-in-right{0%{opacity:0;transform:translate(30px)}}@keyframes fade-out{to{opacity:0}}@keyframes flip-in{0%{opacity:0;transform:rotateX(-90deg)}40%{opacity:1;transform:rotateX(10deg)}}@keyframes flip-out{to{opacity:0;transform:rotateX(-90deg)}}@keyframes pop-in-from-top{0%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-100,1,1);opacity:0}6.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-30.227,1,1)}13.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,1.76,1,1)}20%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,7.08,1,1)}26.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,3.838,1,1)}33.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.902,1,1);opacity:1}40%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.237,1,1)}46.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.312,1,1)}53.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.141,1,1)}60%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.021,1,1)}66.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.015,1,1)}73.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.013,1,1)}80%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.005,1,1)}86.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,0,1,1)}93.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.001,1,1);-webkit-transform:translate3d(0,0,0)}to{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.001,1,1);-webkit-transform:translate3d(0,0,0)}}.nas-button{position:relative;display:inline-block;padding:12px 24px;width:-webkit-max-content;width:max-content;border:0;border-radius:0;font-family:NorwegianTextPro,Arial,Helvetica Neue,Helvetica,sans-serif;font-size:16px;font-weight:700;line-height:24px;text-align:center;color:#15273f;background-color:#e9e7e4;transition:all .15s cubic-bezier(0,0,.1,1)}.nas-button--container{background-color:#fff}.nas-button:before{content:\"\";display:block;position:absolute;width:100%;height:2px;bottom:-3.5px;left:0;background-color:#e9e7e4;transition:all .15s cubic-bezier(0,0,.1,1)}.nas-button:hover,.nas-button:focus{background-color:#e9e7e4}.nas-button:hover:before,.nas-button:focus:before{transform:translateY(0)}.nas-button[disabled]{cursor:default;pointer-events:none;color:#6f6f6f;background-color:#e9e7e4}.nas-button--primary{color:#fff;background-color:#e5212d}.nas-button--primary:before{background-color:#15273f}.nas-button--primary:hover,.nas-button--primary:focus{color:#fff;background-color:#b71530}.nas-button--primary:hover:before,.nas-button--primary:focus:before{background-color:#15273f}.nas-button--primary:active{color:#fff;background:#891024}.nas-button--primary:active:before{background-color:#15273f}.nas-button--primary:focus-visible{outline:2px solid #0978E8;outline-offset:2px}.nas-button--primary:focus-visible:before{display:none}.nas-button--primary:disabled{background-color:#e9e7e4}.nas-button--secondary{color:#fff;background-color:#15273f}.nas-button--secondary:before{background-color:#15273f}.nas-button--secondary:hover,.nas-button--secondary:focus{color:#fff;background-color:#0a2033}.nas-button--secondary:hover:before,.nas-button--secondary:focus:before{background-color:#0a2033}.nas-button--secondary:active{color:#fff;background:#071622}.nas-button--secondary:active:before{background-color:#071622}.nas-button--secondary:focus-visible{outline:2px solid #0978E8;outline-offset:2px}.nas-button--secondary:focus-visible:before{display:none}.nas-button--secondary:before{display:none}.nas-button--secondary:disabled{background-color:#e9e7e4}.nas-button--light{color:#15273f;background-color:#fff;border:2px solid #6F6F6F}.nas-button--light:before{background-color:#fff}.nas-button--light:hover,.nas-button--light:focus{color:#15273f;background-color:#f8f8f8}.nas-button--light:hover:before,.nas-button--light:focus:before{background-color:#f8f8f8}.nas-button--light:active{color:#15273f;background:#ebf4ff}.nas-button--light:active:before{background-color:#ebf4ff}.nas-button--light:focus-visible{outline:2px solid #0978E8;outline-offset:2px}.nas-button--light:focus-visible:before{display:none}.nas-button--light:before{display:none}.nas-button--light:hover{border:2px solid #15273F}.nas-button--light:disabled{border:0}.nas-button--buttonlink{color:#b12a0b;background-color:transparent}.nas-button--buttonlink:before{background-color:transparent}.nas-button--buttonlink:hover,.nas-button--buttonlink:focus{color:#b12a0b;background-color:#f8f8f8}.nas-button--buttonlink:hover:before,.nas-button--buttonlink:focus:before{background-color:#f8f8f8}.nas-button--buttonlink:active{color:#b12a0b;background:#ebf4ff}.nas-button--buttonlink:active:before{background-color:#ebf4ff}.nas-button--buttonlink:focus-visible{outline:2px solid #0978E8;outline-offset:2px}.nas-button--buttonlink:focus-visible:before{display:none}.nas-button--buttonlink:before{display:none}.nas-button--buttonlink:disabled{background-color:#f8f8f8}.nas-button--large{font-family:NorwegianTextPro,Arial,Helvetica Neue,Helvetica,sans-serif;font-weight:700;font-size:18px;line-height:24px;padding:16px 36px 13px}.nas-button--block{display:block;width:100%}.nas-button--flex{display:flex;width:100%}.nas-button--compact{margin-bottom:12px}.nas-button--compact:before{display:none}.nas-button--right{align-self:flex-end;float:right}.nas-button--spaceless{margin-bottom:0}.nas-button--transparent{color:#fff;background-color:#000000a6}.nas-button--transparent:before{background-color:inherit}.nas-button--transparent:hover,.nas-button--transparent:active,.nas-button--transparent:focus{background-color:#000c}.nas-button--link{font-size:inherit;padding:0;margin:0;background:none;color:#b12a0b}.nas-button--link:hover,.nas-button--link:focus{color:#891024;border-color:#15273f;background:none}.nas-button--link:before{display:none}.nas-button--link.nas-button--secondary{color:#15273f}.nas-button--link.nas-button--light{color:#fff}.nas-button--link.nas-button--light:hover,.nas-button--link.nas-button--light:focus{color:#f8f8f8}.nas-button--link.nas-button--tetiary{color:#ffc1b7}.nas-button--link.nas-button--tetiary:hover,.nas-button--link.nas-button--tetiary:focus{color:#ffe2d9}.nas-button__content{display:flex;justify-content:center;gap:4px}.nas-button__content--reverse{flex-direction:row-reverse}.nas-button__icon{position:relative}.nas-button__icon .nas-icon-small{margin:0;transform:scale(.8)}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "directive", type: i2.NasClassDirective, selector: "[nasClass]", inputs: ["nasClass", "attr.class"] }, { kind: "directive", type: i3.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "component", type: i4.IconComponent, selector: "nas-icon", inputs: ["icon", "type", "isIndicator", "lightCircularBackground", "cssClass"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
|
|
123
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: ButtonComponent, selector: "nas-button", inputs: { primary: "primary", secondary: "secondary", tertiary: "tertiary", link: "link", light: "light", large: "large", block: "block", flex: "flex", compact: "compact", right: "right", spaceless: "spaceless", href: "href", trackingvalue: "trackingvalue", canContinueOnDisabled: "canContinueOnDisabled", disabled: "disabled", type: "type", cssClass: "cssClass", ariaLabel: "ariaLabel", cssStyle: "cssStyle", tabindex: "tabindex", overrideBaseCssClass: "overrideBaseCssClass", useRouterLink: "useRouterLink", id: "id", target: "target", icon: "icon", iconLeft: "iconLeft", iconType: "iconType", buttonlink: "buttonlink" }, outputs: { clickChange: "clickChange", focusOnNext: "focusOnNext" }, viewQueries: [{ propertyName: "button", first: true, predicate: ["button"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<button #button *ngIf=\"!href\" [nasClass]=\"getClasses('', modifiers)\" [ngStyle]=\"buttonStyle\"\n [disabled]=\"!canContinueOnDisabled && disabled\" [class.disabled]=\"disabled\" [attr.type]=\"type\"\n [attr.aria-label]=\"ariaLabel\" [attr.tabindex]=\"tabindex\" [id]=\"buttonId\" (click)=\"emitTrackingAndClickEvent($event)\"\n (keydown)=\"onKeydown($event)\">\n <span [nasClass]=\"getClass('content', exists(iconLeft) && 'reverse')\">\n <ng-container *ngTemplateOutlet=\"content\"></ng-container>\n <span [nasClass]=\"getClass('icon')\" *ngIf=\"icon || iconType\">\n <nas-icon [icon]=\"icon\" [type]=\"iconType\"></nas-icon>\n </span>\n </span>\n</button>\n\n<ng-container *ngIf=\"href\">\n <ng-container *ngIf=\"exists(useRouterLink); else linksHref\">\n <a [nasClass]=\"getClasses('', modifiers)\" [attr.disabled]=\"disabled\" [routerLink]=\"href\" [id]=\"buttonId\"\n (click)=\"emitTrackingEvent();\" (keydown)=\"onKeydown($event)\">\n <ng-container *ngTemplateOutlet=\"content\"></ng-container>\n <span [nasClass]=\"getClass('icon')\" *ngIf=\"icon || iconType\">\n <nas-icon [icon]=\"icon\" [type]=\"iconType\"></nas-icon>\n </span>\n </a>\n </ng-container>\n</ng-container>\n\n<ng-template #linksHref>\n <a [nasClass]=\"getClasses('', modifiers)\" [attr.disabled]=\"disabled\" [href]=\"href\" [target]=\"target\" [id]=\"buttonId\"\n (click)=\"emitTrackingEvent();\" (keydown)=\"onKeydown($event)\">\n <span [nasClass]=\"getClass('content', exists(iconLeft) && 'reverse')\">\n <ng-container *ngTemplateOutlet=\"content\"></ng-container>\n <span [nasClass]=\"getClass('icon')\" *ngIf=\"icon || iconType\">\n <nas-icon [icon]=\"icon\" [type]=\"iconType\"></nas-icon>\n </span>\n </span>\n </a>\n</ng-template>\n\n<ng-template #content>\n <ng-content></ng-content>\n</ng-template>", styles: ["@keyframes fade-in{0%{opacity:0}}@keyframes fade-in-down{0%{opacity:0;transform:translateY(-30px)}}@keyframes fade-in-left{0%{opacity:0;transform:translate(-30px)}}@keyframes fade-in-right{0%{opacity:0;transform:translate(30px)}}@keyframes fade-out{to{opacity:0}}@keyframes flip-in{0%{opacity:0;transform:rotateX(-90deg)}40%{opacity:1;transform:rotateX(10deg)}}@keyframes flip-out{to{opacity:0;transform:rotateX(-90deg)}}@keyframes pop-in-from-top{0%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-100,1,1);opacity:0}6.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-30.227,1,1)}13.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,1.76,1,1)}20%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,7.08,1,1)}26.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,3.838,1,1)}33.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.902,1,1);opacity:1}40%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.237,1,1)}46.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.312,1,1)}53.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.141,1,1)}60%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.021,1,1)}66.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.015,1,1)}73.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.013,1,1)}80%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.005,1,1)}86.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,0,1,1)}93.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.001,1,1);-webkit-transform:translate3d(0,0,0)}to{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.001,1,1);-webkit-transform:translate3d(0,0,0)}}.nas-button{position:relative;display:inline-block;padding:12px 24px;width:-webkit-max-content;width:max-content;border:0;border-radius:0;font-family:NorwegianTextPro,Arial,Helvetica Neue,Helvetica,sans-serif;font-size:16px;font-weight:700;line-height:24px;text-align:center;color:#15273f;background-color:#e9e7e4;transition:all .15s cubic-bezier(0,0,.1,1)}.nas-button--container{background-color:#fff}.nas-button:before{content:\"\";display:block;position:absolute;width:100%;height:2px;bottom:-3.5px;left:0;background-color:#e9e7e4;transition:all .15s cubic-bezier(0,0,.1,1)}.nas-button:hover,.nas-button:focus{background-color:#e9e7e4}.nas-button:hover:before,.nas-button:focus:before{transform:translateY(0)}.nas-button[disabled]{cursor:default;pointer-events:none;color:#6f6f6f;background-color:#e9e7e4}.nas-button--primary{color:#fff;background-color:#e5212d}.nas-button--primary:before{background-color:#15273f}.nas-button--primary:hover,.nas-button--primary:focus{color:#fff;background-color:#b71530}.nas-button--primary:hover:before,.nas-button--primary:focus:before{background-color:#15273f}.nas-button--primary:active{color:#fff;background:#891024}.nas-button--primary:active:before{background-color:#15273f}.nas-button--primary:focus-visible{outline:2px solid #0978E8;outline-offset:2px}.nas-button--primary:focus-visible:before{display:none}.nas-button--primary:disabled{background-color:#e9e7e4}.nas-button--secondary{color:#fff;background-color:#15273f}.nas-button--secondary:before{background-color:#15273f}.nas-button--secondary:hover,.nas-button--secondary:focus{color:#fff;background-color:#0a2033}.nas-button--secondary:hover:before,.nas-button--secondary:focus:before{background-color:#0a2033}.nas-button--secondary:active{color:#fff;background:#071622}.nas-button--secondary:active:before{background-color:#071622}.nas-button--secondary:focus-visible{outline:2px solid #0978E8;outline-offset:2px}.nas-button--secondary:focus-visible:before{display:none}.nas-button--secondary:before{display:none}.nas-button--secondary:disabled{background-color:#e9e7e4}.nas-button--light{color:#15273f;background-color:#fff;border:2px solid #6F6F6F}.nas-button--light:before{background-color:#fff}.nas-button--light:hover,.nas-button--light:focus{color:#15273f;background-color:#f8f8f8}.nas-button--light:hover:before,.nas-button--light:focus:before{background-color:#f8f8f8}.nas-button--light:active{color:#15273f;background:#ebf4ff}.nas-button--light:active:before{background-color:#ebf4ff}.nas-button--light:focus-visible{outline:2px solid #0978E8;outline-offset:2px}.nas-button--light:focus-visible:before{display:none}.nas-button--light:before{display:none}.nas-button--light:hover{border:2px solid #15273F}.nas-button--light:disabled{border:0}.nas-button--buttonlink{color:#b12a0b;background-color:transparent}.nas-button--buttonlink:before{background-color:transparent}.nas-button--buttonlink:hover,.nas-button--buttonlink:focus{color:#b12a0b;background-color:#f8f8f8}.nas-button--buttonlink:hover:before,.nas-button--buttonlink:focus:before{background-color:#f8f8f8}.nas-button--buttonlink:active{color:#b12a0b;background:#ebf4ff}.nas-button--buttonlink:active:before{background-color:#ebf4ff}.nas-button--buttonlink:focus-visible{outline:2px solid #0978E8;outline-offset:2px}.nas-button--buttonlink:focus-visible:before{display:none}.nas-button--buttonlink:before{display:none}.nas-button--buttonlink:disabled{background-color:#f8f8f8}.nas-button--large{font-family:NorwegianTextPro,Arial,Helvetica Neue,Helvetica,sans-serif;font-weight:700;font-size:18px;line-height:24px;padding:16px 36px 13px}.nas-button--block{display:block;width:100%}.nas-button--flex{display:flex;width:100%}.nas-button--compact{margin-bottom:12px}.nas-button--compact:before{display:none}.nas-button--right{align-self:flex-end;float:right}.nas-button--spaceless{margin-bottom:0}.nas-button--transparent{color:#fff;background-color:#000000a6}.nas-button--transparent:before{background-color:inherit}.nas-button--transparent:hover,.nas-button--transparent:active,.nas-button--transparent:focus{background-color:#000c}.nas-button--link{font-size:inherit;padding:0;margin:0;background:none;color:#b12a0b;width:auto;text-align:unset}.nas-button--link:hover,.nas-button--link:focus{color:#891024;border-color:#15273f;background:none}.nas-button--link:before{display:none}.nas-button--link.nas-button--secondary{color:#15273f}.nas-button--link.nas-button--light{color:#fff}.nas-button--link.nas-button--light:hover,.nas-button--link.nas-button--light:focus{color:#f8f8f8}.nas-button--link.nas-button--tetiary{color:#ffc1b7}.nas-button--link.nas-button--tetiary:hover,.nas-button--link.nas-button--tetiary:focus{color:#ffe2d9}.nas-button__content{display:flex;justify-content:center;gap:4px}.nas-button__content--reverse{flex-direction:row-reverse}.nas-button__icon{position:relative}.nas-button__icon .nas-icon-small{margin:0;transform:scale(.8)}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "directive", type: i2.NasClassDirective, selector: "[nasClass]", inputs: ["nasClass", "attr.class"] }, { kind: "directive", type: i3.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "component", type: i4.IconComponent, selector: "nas-icon", inputs: ["icon", "type", "isIndicator", "lightCircularBackground", "cssClass"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
|
|
124
124
|
}
|
|
125
125
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: ButtonComponent, decorators: [{
|
|
126
126
|
type: Component,
|
|
127
|
-
args: [{ selector: 'nas-button', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, template: "<button #button *ngIf=\"!href\" [nasClass]=\"getClasses('', modifiers)\" [ngStyle]=\"buttonStyle\"\n [disabled]=\"!canContinueOnDisabled && disabled\" [class.disabled]=\"disabled\" [attr.type]=\"type\"\n [attr.aria-label]=\"ariaLabel\" [attr.tabindex]=\"tabindex\" [id]=\"buttonId\" (click)=\"emitTrackingAndClickEvent($event)\"\n (keydown)=\"onKeydown($event)\">\n <span [nasClass]=\"getClass('content', exists(iconLeft) && 'reverse')\">\n <ng-container *ngTemplateOutlet=\"content\"></ng-container>\n <span [nasClass]=\"getClass('icon')\" *ngIf=\"icon || iconType\">\n <nas-icon [icon]=\"icon\" [type]=\"iconType\"></nas-icon>\n </span>\n </span>\n</button>\n\n<ng-container *ngIf=\"href\">\n <ng-container *ngIf=\"exists(useRouterLink); else linksHref\">\n <a [nasClass]=\"getClasses('', modifiers)\" [attr.disabled]=\"disabled\" [routerLink]=\"href\" [id]=\"buttonId\"\n (click)=\"emitTrackingEvent();\" (keydown)=\"onKeydown($event)\">\n <ng-container *ngTemplateOutlet=\"content\"></ng-container>\n <span [nasClass]=\"getClass('icon')\" *ngIf=\"icon || iconType\">\n <nas-icon [icon]=\"icon\" [type]=\"iconType\"></nas-icon>\n </span>\n </a>\n </ng-container>\n</ng-container>\n\n<ng-template #linksHref>\n <a [nasClass]=\"getClasses('', modifiers)\" [attr.disabled]=\"disabled\" [href]=\"href\" [target]=\"target\" [id]=\"buttonId\"\n (click)=\"emitTrackingEvent();\" (keydown)=\"onKeydown($event)\">\n <span [nasClass]=\"getClass('content', exists(iconLeft) && 'reverse')\">\n <ng-container *ngTemplateOutlet=\"content\"></ng-container>\n <span [nasClass]=\"getClass('icon')\" *ngIf=\"icon || iconType\">\n <nas-icon [icon]=\"icon\" [type]=\"iconType\"></nas-icon>\n </span>\n </span>\n </a>\n</ng-template>\n\n<ng-template #content>\n <ng-content></ng-content>\n</ng-template>", styles: ["@keyframes fade-in{0%{opacity:0}}@keyframes fade-in-down{0%{opacity:0;transform:translateY(-30px)}}@keyframes fade-in-left{0%{opacity:0;transform:translate(-30px)}}@keyframes fade-in-right{0%{opacity:0;transform:translate(30px)}}@keyframes fade-out{to{opacity:0}}@keyframes flip-in{0%{opacity:0;transform:rotateX(-90deg)}40%{opacity:1;transform:rotateX(10deg)}}@keyframes flip-out{to{opacity:0;transform:rotateX(-90deg)}}@keyframes pop-in-from-top{0%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-100,1,1);opacity:0}6.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-30.227,1,1)}13.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,1.76,1,1)}20%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,7.08,1,1)}26.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,3.838,1,1)}33.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.902,1,1);opacity:1}40%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.237,1,1)}46.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.312,1,1)}53.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.141,1,1)}60%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.021,1,1)}66.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.015,1,1)}73.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.013,1,1)}80%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.005,1,1)}86.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,0,1,1)}93.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.001,1,1);-webkit-transform:translate3d(0,0,0)}to{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.001,1,1);-webkit-transform:translate3d(0,0,0)}}.nas-button{position:relative;display:inline-block;padding:12px 24px;width:-webkit-max-content;width:max-content;border:0;border-radius:0;font-family:NorwegianTextPro,Arial,Helvetica Neue,Helvetica,sans-serif;font-size:16px;font-weight:700;line-height:24px;text-align:center;color:#15273f;background-color:#e9e7e4;transition:all .15s cubic-bezier(0,0,.1,1)}.nas-button--container{background-color:#fff}.nas-button:before{content:\"\";display:block;position:absolute;width:100%;height:2px;bottom:-3.5px;left:0;background-color:#e9e7e4;transition:all .15s cubic-bezier(0,0,.1,1)}.nas-button:hover,.nas-button:focus{background-color:#e9e7e4}.nas-button:hover:before,.nas-button:focus:before{transform:translateY(0)}.nas-button[disabled]{cursor:default;pointer-events:none;color:#6f6f6f;background-color:#e9e7e4}.nas-button--primary{color:#fff;background-color:#e5212d}.nas-button--primary:before{background-color:#15273f}.nas-button--primary:hover,.nas-button--primary:focus{color:#fff;background-color:#b71530}.nas-button--primary:hover:before,.nas-button--primary:focus:before{background-color:#15273f}.nas-button--primary:active{color:#fff;background:#891024}.nas-button--primary:active:before{background-color:#15273f}.nas-button--primary:focus-visible{outline:2px solid #0978E8;outline-offset:2px}.nas-button--primary:focus-visible:before{display:none}.nas-button--primary:disabled{background-color:#e9e7e4}.nas-button--secondary{color:#fff;background-color:#15273f}.nas-button--secondary:before{background-color:#15273f}.nas-button--secondary:hover,.nas-button--secondary:focus{color:#fff;background-color:#0a2033}.nas-button--secondary:hover:before,.nas-button--secondary:focus:before{background-color:#0a2033}.nas-button--secondary:active{color:#fff;background:#071622}.nas-button--secondary:active:before{background-color:#071622}.nas-button--secondary:focus-visible{outline:2px solid #0978E8;outline-offset:2px}.nas-button--secondary:focus-visible:before{display:none}.nas-button--secondary:before{display:none}.nas-button--secondary:disabled{background-color:#e9e7e4}.nas-button--light{color:#15273f;background-color:#fff;border:2px solid #6F6F6F}.nas-button--light:before{background-color:#fff}.nas-button--light:hover,.nas-button--light:focus{color:#15273f;background-color:#f8f8f8}.nas-button--light:hover:before,.nas-button--light:focus:before{background-color:#f8f8f8}.nas-button--light:active{color:#15273f;background:#ebf4ff}.nas-button--light:active:before{background-color:#ebf4ff}.nas-button--light:focus-visible{outline:2px solid #0978E8;outline-offset:2px}.nas-button--light:focus-visible:before{display:none}.nas-button--light:before{display:none}.nas-button--light:hover{border:2px solid #15273F}.nas-button--light:disabled{border:0}.nas-button--buttonlink{color:#b12a0b;background-color:transparent}.nas-button--buttonlink:before{background-color:transparent}.nas-button--buttonlink:hover,.nas-button--buttonlink:focus{color:#b12a0b;background-color:#f8f8f8}.nas-button--buttonlink:hover:before,.nas-button--buttonlink:focus:before{background-color:#f8f8f8}.nas-button--buttonlink:active{color:#b12a0b;background:#ebf4ff}.nas-button--buttonlink:active:before{background-color:#ebf4ff}.nas-button--buttonlink:focus-visible{outline:2px solid #0978E8;outline-offset:2px}.nas-button--buttonlink:focus-visible:before{display:none}.nas-button--buttonlink:before{display:none}.nas-button--buttonlink:disabled{background-color:#f8f8f8}.nas-button--large{font-family:NorwegianTextPro,Arial,Helvetica Neue,Helvetica,sans-serif;font-weight:700;font-size:18px;line-height:24px;padding:16px 36px 13px}.nas-button--block{display:block;width:100%}.nas-button--flex{display:flex;width:100%}.nas-button--compact{margin-bottom:12px}.nas-button--compact:before{display:none}.nas-button--right{align-self:flex-end;float:right}.nas-button--spaceless{margin-bottom:0}.nas-button--transparent{color:#fff;background-color:#000000a6}.nas-button--transparent:before{background-color:inherit}.nas-button--transparent:hover,.nas-button--transparent:active,.nas-button--transparent:focus{background-color:#000c}.nas-button--link{font-size:inherit;padding:0;margin:0;background:none;color:#b12a0b}.nas-button--link:hover,.nas-button--link:focus{color:#891024;border-color:#15273f;background:none}.nas-button--link:before{display:none}.nas-button--link.nas-button--secondary{color:#15273f}.nas-button--link.nas-button--light{color:#fff}.nas-button--link.nas-button--light:hover,.nas-button--link.nas-button--light:focus{color:#f8f8f8}.nas-button--link.nas-button--tetiary{color:#ffc1b7}.nas-button--link.nas-button--tetiary:hover,.nas-button--link.nas-button--tetiary:focus{color:#ffe2d9}.nas-button__content{display:flex;justify-content:center;gap:4px}.nas-button__content--reverse{flex-direction:row-reverse}.nas-button__icon{position:relative}.nas-button__icon .nas-icon-small{margin:0;transform:scale(.8)}\n"] }]
|
|
127
|
+
args: [{ selector: 'nas-button', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, template: "<button #button *ngIf=\"!href\" [nasClass]=\"getClasses('', modifiers)\" [ngStyle]=\"buttonStyle\"\n [disabled]=\"!canContinueOnDisabled && disabled\" [class.disabled]=\"disabled\" [attr.type]=\"type\"\n [attr.aria-label]=\"ariaLabel\" [attr.tabindex]=\"tabindex\" [id]=\"buttonId\" (click)=\"emitTrackingAndClickEvent($event)\"\n (keydown)=\"onKeydown($event)\">\n <span [nasClass]=\"getClass('content', exists(iconLeft) && 'reverse')\">\n <ng-container *ngTemplateOutlet=\"content\"></ng-container>\n <span [nasClass]=\"getClass('icon')\" *ngIf=\"icon || iconType\">\n <nas-icon [icon]=\"icon\" [type]=\"iconType\"></nas-icon>\n </span>\n </span>\n</button>\n\n<ng-container *ngIf=\"href\">\n <ng-container *ngIf=\"exists(useRouterLink); else linksHref\">\n <a [nasClass]=\"getClasses('', modifiers)\" [attr.disabled]=\"disabled\" [routerLink]=\"href\" [id]=\"buttonId\"\n (click)=\"emitTrackingEvent();\" (keydown)=\"onKeydown($event)\">\n <ng-container *ngTemplateOutlet=\"content\"></ng-container>\n <span [nasClass]=\"getClass('icon')\" *ngIf=\"icon || iconType\">\n <nas-icon [icon]=\"icon\" [type]=\"iconType\"></nas-icon>\n </span>\n </a>\n </ng-container>\n</ng-container>\n\n<ng-template #linksHref>\n <a [nasClass]=\"getClasses('', modifiers)\" [attr.disabled]=\"disabled\" [href]=\"href\" [target]=\"target\" [id]=\"buttonId\"\n (click)=\"emitTrackingEvent();\" (keydown)=\"onKeydown($event)\">\n <span [nasClass]=\"getClass('content', exists(iconLeft) && 'reverse')\">\n <ng-container *ngTemplateOutlet=\"content\"></ng-container>\n <span [nasClass]=\"getClass('icon')\" *ngIf=\"icon || iconType\">\n <nas-icon [icon]=\"icon\" [type]=\"iconType\"></nas-icon>\n </span>\n </span>\n </a>\n</ng-template>\n\n<ng-template #content>\n <ng-content></ng-content>\n</ng-template>", styles: ["@keyframes fade-in{0%{opacity:0}}@keyframes fade-in-down{0%{opacity:0;transform:translateY(-30px)}}@keyframes fade-in-left{0%{opacity:0;transform:translate(-30px)}}@keyframes fade-in-right{0%{opacity:0;transform:translate(30px)}}@keyframes fade-out{to{opacity:0}}@keyframes flip-in{0%{opacity:0;transform:rotateX(-90deg)}40%{opacity:1;transform:rotateX(10deg)}}@keyframes flip-out{to{opacity:0;transform:rotateX(-90deg)}}@keyframes pop-in-from-top{0%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-100,1,1);opacity:0}6.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-30.227,1,1)}13.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,1.76,1,1)}20%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,7.08,1,1)}26.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,3.838,1,1)}33.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.902,1,1);opacity:1}40%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.237,1,1)}46.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.312,1,1)}53.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.141,1,1)}60%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.021,1,1)}66.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.015,1,1)}73.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.013,1,1)}80%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.005,1,1)}86.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,0,1,1)}93.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.001,1,1);-webkit-transform:translate3d(0,0,0)}to{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.001,1,1);-webkit-transform:translate3d(0,0,0)}}.nas-button{position:relative;display:inline-block;padding:12px 24px;width:-webkit-max-content;width:max-content;border:0;border-radius:0;font-family:NorwegianTextPro,Arial,Helvetica Neue,Helvetica,sans-serif;font-size:16px;font-weight:700;line-height:24px;text-align:center;color:#15273f;background-color:#e9e7e4;transition:all .15s cubic-bezier(0,0,.1,1)}.nas-button--container{background-color:#fff}.nas-button:before{content:\"\";display:block;position:absolute;width:100%;height:2px;bottom:-3.5px;left:0;background-color:#e9e7e4;transition:all .15s cubic-bezier(0,0,.1,1)}.nas-button:hover,.nas-button:focus{background-color:#e9e7e4}.nas-button:hover:before,.nas-button:focus:before{transform:translateY(0)}.nas-button[disabled]{cursor:default;pointer-events:none;color:#6f6f6f;background-color:#e9e7e4}.nas-button--primary{color:#fff;background-color:#e5212d}.nas-button--primary:before{background-color:#15273f}.nas-button--primary:hover,.nas-button--primary:focus{color:#fff;background-color:#b71530}.nas-button--primary:hover:before,.nas-button--primary:focus:before{background-color:#15273f}.nas-button--primary:active{color:#fff;background:#891024}.nas-button--primary:active:before{background-color:#15273f}.nas-button--primary:focus-visible{outline:2px solid #0978E8;outline-offset:2px}.nas-button--primary:focus-visible:before{display:none}.nas-button--primary:disabled{background-color:#e9e7e4}.nas-button--secondary{color:#fff;background-color:#15273f}.nas-button--secondary:before{background-color:#15273f}.nas-button--secondary:hover,.nas-button--secondary:focus{color:#fff;background-color:#0a2033}.nas-button--secondary:hover:before,.nas-button--secondary:focus:before{background-color:#0a2033}.nas-button--secondary:active{color:#fff;background:#071622}.nas-button--secondary:active:before{background-color:#071622}.nas-button--secondary:focus-visible{outline:2px solid #0978E8;outline-offset:2px}.nas-button--secondary:focus-visible:before{display:none}.nas-button--secondary:before{display:none}.nas-button--secondary:disabled{background-color:#e9e7e4}.nas-button--light{color:#15273f;background-color:#fff;border:2px solid #6F6F6F}.nas-button--light:before{background-color:#fff}.nas-button--light:hover,.nas-button--light:focus{color:#15273f;background-color:#f8f8f8}.nas-button--light:hover:before,.nas-button--light:focus:before{background-color:#f8f8f8}.nas-button--light:active{color:#15273f;background:#ebf4ff}.nas-button--light:active:before{background-color:#ebf4ff}.nas-button--light:focus-visible{outline:2px solid #0978E8;outline-offset:2px}.nas-button--light:focus-visible:before{display:none}.nas-button--light:before{display:none}.nas-button--light:hover{border:2px solid #15273F}.nas-button--light:disabled{border:0}.nas-button--buttonlink{color:#b12a0b;background-color:transparent}.nas-button--buttonlink:before{background-color:transparent}.nas-button--buttonlink:hover,.nas-button--buttonlink:focus{color:#b12a0b;background-color:#f8f8f8}.nas-button--buttonlink:hover:before,.nas-button--buttonlink:focus:before{background-color:#f8f8f8}.nas-button--buttonlink:active{color:#b12a0b;background:#ebf4ff}.nas-button--buttonlink:active:before{background-color:#ebf4ff}.nas-button--buttonlink:focus-visible{outline:2px solid #0978E8;outline-offset:2px}.nas-button--buttonlink:focus-visible:before{display:none}.nas-button--buttonlink:before{display:none}.nas-button--buttonlink:disabled{background-color:#f8f8f8}.nas-button--large{font-family:NorwegianTextPro,Arial,Helvetica Neue,Helvetica,sans-serif;font-weight:700;font-size:18px;line-height:24px;padding:16px 36px 13px}.nas-button--block{display:block;width:100%}.nas-button--flex{display:flex;width:100%}.nas-button--compact{margin-bottom:12px}.nas-button--compact:before{display:none}.nas-button--right{align-self:flex-end;float:right}.nas-button--spaceless{margin-bottom:0}.nas-button--transparent{color:#fff;background-color:#000000a6}.nas-button--transparent:before{background-color:inherit}.nas-button--transparent:hover,.nas-button--transparent:active,.nas-button--transparent:focus{background-color:#000c}.nas-button--link{font-size:inherit;padding:0;margin:0;background:none;color:#b12a0b;width:auto;text-align:unset}.nas-button--link:hover,.nas-button--link:focus{color:#891024;border-color:#15273f;background:none}.nas-button--link:before{display:none}.nas-button--link.nas-button--secondary{color:#15273f}.nas-button--link.nas-button--light{color:#fff}.nas-button--link.nas-button--light:hover,.nas-button--link.nas-button--light:focus{color:#f8f8f8}.nas-button--link.nas-button--tetiary{color:#ffc1b7}.nas-button--link.nas-button--tetiary:hover,.nas-button--link.nas-button--tetiary:focus{color:#ffe2d9}.nas-button__content{display:flex;justify-content:center;gap:4px}.nas-button__content--reverse{flex-direction:row-reverse}.nas-button__icon{position:relative}.nas-button__icon .nas-icon-small{margin:0;transform:scale(.8)}\n"] }]
|
|
128
128
|
}], ctorParameters: function () { return []; }, propDecorators: { button: [{
|
|
129
129
|
type: ViewChild,
|
|
130
130
|
args: ['button']
|
|
@@ -1225,11 +1225,11 @@ class ButtonComponent extends NasComponentBase {
|
|
|
1225
1225
|
this.focusOnNext.emit(event);
|
|
1226
1226
|
}
|
|
1227
1227
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: ButtonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
1228
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: ButtonComponent, selector: "nas-button", inputs: { primary: "primary", secondary: "secondary", tertiary: "tertiary", link: "link", light: "light", large: "large", block: "block", flex: "flex", compact: "compact", right: "right", spaceless: "spaceless", href: "href", trackingvalue: "trackingvalue", canContinueOnDisabled: "canContinueOnDisabled", disabled: "disabled", type: "type", cssClass: "cssClass", ariaLabel: "ariaLabel", cssStyle: "cssStyle", tabindex: "tabindex", overrideBaseCssClass: "overrideBaseCssClass", useRouterLink: "useRouterLink", id: "id", target: "target", icon: "icon", iconLeft: "iconLeft", iconType: "iconType", buttonlink: "buttonlink" }, outputs: { clickChange: "clickChange", focusOnNext: "focusOnNext" }, viewQueries: [{ propertyName: "button", first: true, predicate: ["button"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<button #button *ngIf=\"!href\" [nasClass]=\"getClasses('', modifiers)\" [ngStyle]=\"buttonStyle\"\n [disabled]=\"!canContinueOnDisabled && disabled\" [class.disabled]=\"disabled\" [attr.type]=\"type\"\n [attr.aria-label]=\"ariaLabel\" [attr.tabindex]=\"tabindex\" [id]=\"buttonId\" (click)=\"emitTrackingAndClickEvent($event)\"\n (keydown)=\"onKeydown($event)\">\n <span [nasClass]=\"getClass('content', exists(iconLeft) && 'reverse')\">\n <ng-container *ngTemplateOutlet=\"content\"></ng-container>\n <span [nasClass]=\"getClass('icon')\" *ngIf=\"icon || iconType\">\n <nas-icon [icon]=\"icon\" [type]=\"iconType\"></nas-icon>\n </span>\n </span>\n</button>\n\n<ng-container *ngIf=\"href\">\n <ng-container *ngIf=\"exists(useRouterLink); else linksHref\">\n <a [nasClass]=\"getClasses('', modifiers)\" [attr.disabled]=\"disabled\" [routerLink]=\"href\" [id]=\"buttonId\"\n (click)=\"emitTrackingEvent();\" (keydown)=\"onKeydown($event)\">\n <ng-container *ngTemplateOutlet=\"content\"></ng-container>\n <span [nasClass]=\"getClass('icon')\" *ngIf=\"icon || iconType\">\n <nas-icon [icon]=\"icon\" [type]=\"iconType\"></nas-icon>\n </span>\n </a>\n </ng-container>\n</ng-container>\n\n<ng-template #linksHref>\n <a [nasClass]=\"getClasses('', modifiers)\" [attr.disabled]=\"disabled\" [href]=\"href\" [target]=\"target\" [id]=\"buttonId\"\n (click)=\"emitTrackingEvent();\" (keydown)=\"onKeydown($event)\">\n <span [nasClass]=\"getClass('content', exists(iconLeft) && 'reverse')\">\n <ng-container *ngTemplateOutlet=\"content\"></ng-container>\n <span [nasClass]=\"getClass('icon')\" *ngIf=\"icon || iconType\">\n <nas-icon [icon]=\"icon\" [type]=\"iconType\"></nas-icon>\n </span>\n </span>\n </a>\n</ng-template>\n\n<ng-template #content>\n <ng-content></ng-content>\n</ng-template>", styles: ["@keyframes fade-in{0%{opacity:0}}@keyframes fade-in-down{0%{opacity:0;transform:translateY(-30px)}}@keyframes fade-in-left{0%{opacity:0;transform:translate(-30px)}}@keyframes fade-in-right{0%{opacity:0;transform:translate(30px)}}@keyframes fade-out{to{opacity:0}}@keyframes flip-in{0%{opacity:0;transform:rotateX(-90deg)}40%{opacity:1;transform:rotateX(10deg)}}@keyframes flip-out{to{opacity:0;transform:rotateX(-90deg)}}@keyframes pop-in-from-top{0%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-100,1,1);opacity:0}6.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-30.227,1,1)}13.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,1.76,1,1)}20%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,7.08,1,1)}26.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,3.838,1,1)}33.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.902,1,1);opacity:1}40%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.237,1,1)}46.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.312,1,1)}53.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.141,1,1)}60%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.021,1,1)}66.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.015,1,1)}73.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.013,1,1)}80%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.005,1,1)}86.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,0,1,1)}93.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.001,1,1);-webkit-transform:translate3d(0,0,0)}to{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.001,1,1);-webkit-transform:translate3d(0,0,0)}}.nas-button{position:relative;display:inline-block;padding:12px 24px;width:-webkit-max-content;width:max-content;border:0;border-radius:0;font-family:NorwegianTextPro,Arial,Helvetica Neue,Helvetica,sans-serif;font-size:16px;font-weight:700;line-height:24px;text-align:center;color:#15273f;background-color:#e9e7e4;transition:all .15s cubic-bezier(0,0,.1,1)}.nas-button--container{background-color:#fff}.nas-button:before{content:\"\";display:block;position:absolute;width:100%;height:2px;bottom:-3.5px;left:0;background-color:#e9e7e4;transition:all .15s cubic-bezier(0,0,.1,1)}.nas-button:hover,.nas-button:focus{background-color:#e9e7e4}.nas-button:hover:before,.nas-button:focus:before{transform:translateY(0)}.nas-button[disabled]{cursor:default;pointer-events:none;color:#6f6f6f;background-color:#e9e7e4}.nas-button--primary{color:#fff;background-color:#e5212d}.nas-button--primary:before{background-color:#15273f}.nas-button--primary:hover,.nas-button--primary:focus{color:#fff;background-color:#b71530}.nas-button--primary:hover:before,.nas-button--primary:focus:before{background-color:#15273f}.nas-button--primary:active{color:#fff;background:#891024}.nas-button--primary:active:before{background-color:#15273f}.nas-button--primary:focus-visible{outline:2px solid #0978E8;outline-offset:2px}.nas-button--primary:focus-visible:before{display:none}.nas-button--primary:disabled{background-color:#e9e7e4}.nas-button--secondary{color:#fff;background-color:#15273f}.nas-button--secondary:before{background-color:#15273f}.nas-button--secondary:hover,.nas-button--secondary:focus{color:#fff;background-color:#0a2033}.nas-button--secondary:hover:before,.nas-button--secondary:focus:before{background-color:#0a2033}.nas-button--secondary:active{color:#fff;background:#071622}.nas-button--secondary:active:before{background-color:#071622}.nas-button--secondary:focus-visible{outline:2px solid #0978E8;outline-offset:2px}.nas-button--secondary:focus-visible:before{display:none}.nas-button--secondary:before{display:none}.nas-button--secondary:disabled{background-color:#e9e7e4}.nas-button--light{color:#15273f;background-color:#fff;border:2px solid #6F6F6F}.nas-button--light:before{background-color:#fff}.nas-button--light:hover,.nas-button--light:focus{color:#15273f;background-color:#f8f8f8}.nas-button--light:hover:before,.nas-button--light:focus:before{background-color:#f8f8f8}.nas-button--light:active{color:#15273f;background:#ebf4ff}.nas-button--light:active:before{background-color:#ebf4ff}.nas-button--light:focus-visible{outline:2px solid #0978E8;outline-offset:2px}.nas-button--light:focus-visible:before{display:none}.nas-button--light:before{display:none}.nas-button--light:hover{border:2px solid #15273F}.nas-button--light:disabled{border:0}.nas-button--buttonlink{color:#b12a0b;background-color:transparent}.nas-button--buttonlink:before{background-color:transparent}.nas-button--buttonlink:hover,.nas-button--buttonlink:focus{color:#b12a0b;background-color:#f8f8f8}.nas-button--buttonlink:hover:before,.nas-button--buttonlink:focus:before{background-color:#f8f8f8}.nas-button--buttonlink:active{color:#b12a0b;background:#ebf4ff}.nas-button--buttonlink:active:before{background-color:#ebf4ff}.nas-button--buttonlink:focus-visible{outline:2px solid #0978E8;outline-offset:2px}.nas-button--buttonlink:focus-visible:before{display:none}.nas-button--buttonlink:before{display:none}.nas-button--buttonlink:disabled{background-color:#f8f8f8}.nas-button--large{font-family:NorwegianTextPro,Arial,Helvetica Neue,Helvetica,sans-serif;font-weight:700;font-size:18px;line-height:24px;padding:16px 36px 13px}.nas-button--block{display:block;width:100%}.nas-button--flex{display:flex;width:100%}.nas-button--compact{margin-bottom:12px}.nas-button--compact:before{display:none}.nas-button--right{align-self:flex-end;float:right}.nas-button--spaceless{margin-bottom:0}.nas-button--transparent{color:#fff;background-color:#000000a6}.nas-button--transparent:before{background-color:inherit}.nas-button--transparent:hover,.nas-button--transparent:active,.nas-button--transparent:focus{background-color:#000c}.nas-button--link{font-size:inherit;padding:0;margin:0;background:none;color:#b12a0b}.nas-button--link:hover,.nas-button--link:focus{color:#891024;border-color:#15273f;background:none}.nas-button--link:before{display:none}.nas-button--link.nas-button--secondary{color:#15273f}.nas-button--link.nas-button--light{color:#fff}.nas-button--link.nas-button--light:hover,.nas-button--link.nas-button--light:focus{color:#f8f8f8}.nas-button--link.nas-button--tetiary{color:#ffc1b7}.nas-button--link.nas-button--tetiary:hover,.nas-button--link.nas-button--tetiary:focus{color:#ffe2d9}.nas-button__content{display:flex;justify-content:center;gap:4px}.nas-button__content--reverse{flex-direction:row-reverse}.nas-button__icon{position:relative}.nas-button__icon .nas-icon-small{margin:0;transform:scale(.8)}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "directive", type: NasClassDirective, selector: "[nasClass]", inputs: ["nasClass", "attr.class"] }, { kind: "directive", type: i3.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "component", type: IconComponent, selector: "nas-icon", inputs: ["icon", "type", "isIndicator", "lightCircularBackground", "cssClass"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
|
|
1228
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: ButtonComponent, selector: "nas-button", inputs: { primary: "primary", secondary: "secondary", tertiary: "tertiary", link: "link", light: "light", large: "large", block: "block", flex: "flex", compact: "compact", right: "right", spaceless: "spaceless", href: "href", trackingvalue: "trackingvalue", canContinueOnDisabled: "canContinueOnDisabled", disabled: "disabled", type: "type", cssClass: "cssClass", ariaLabel: "ariaLabel", cssStyle: "cssStyle", tabindex: "tabindex", overrideBaseCssClass: "overrideBaseCssClass", useRouterLink: "useRouterLink", id: "id", target: "target", icon: "icon", iconLeft: "iconLeft", iconType: "iconType", buttonlink: "buttonlink" }, outputs: { clickChange: "clickChange", focusOnNext: "focusOnNext" }, viewQueries: [{ propertyName: "button", first: true, predicate: ["button"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<button #button *ngIf=\"!href\" [nasClass]=\"getClasses('', modifiers)\" [ngStyle]=\"buttonStyle\"\n [disabled]=\"!canContinueOnDisabled && disabled\" [class.disabled]=\"disabled\" [attr.type]=\"type\"\n [attr.aria-label]=\"ariaLabel\" [attr.tabindex]=\"tabindex\" [id]=\"buttonId\" (click)=\"emitTrackingAndClickEvent($event)\"\n (keydown)=\"onKeydown($event)\">\n <span [nasClass]=\"getClass('content', exists(iconLeft) && 'reverse')\">\n <ng-container *ngTemplateOutlet=\"content\"></ng-container>\n <span [nasClass]=\"getClass('icon')\" *ngIf=\"icon || iconType\">\n <nas-icon [icon]=\"icon\" [type]=\"iconType\"></nas-icon>\n </span>\n </span>\n</button>\n\n<ng-container *ngIf=\"href\">\n <ng-container *ngIf=\"exists(useRouterLink); else linksHref\">\n <a [nasClass]=\"getClasses('', modifiers)\" [attr.disabled]=\"disabled\" [routerLink]=\"href\" [id]=\"buttonId\"\n (click)=\"emitTrackingEvent();\" (keydown)=\"onKeydown($event)\">\n <ng-container *ngTemplateOutlet=\"content\"></ng-container>\n <span [nasClass]=\"getClass('icon')\" *ngIf=\"icon || iconType\">\n <nas-icon [icon]=\"icon\" [type]=\"iconType\"></nas-icon>\n </span>\n </a>\n </ng-container>\n</ng-container>\n\n<ng-template #linksHref>\n <a [nasClass]=\"getClasses('', modifiers)\" [attr.disabled]=\"disabled\" [href]=\"href\" [target]=\"target\" [id]=\"buttonId\"\n (click)=\"emitTrackingEvent();\" (keydown)=\"onKeydown($event)\">\n <span [nasClass]=\"getClass('content', exists(iconLeft) && 'reverse')\">\n <ng-container *ngTemplateOutlet=\"content\"></ng-container>\n <span [nasClass]=\"getClass('icon')\" *ngIf=\"icon || iconType\">\n <nas-icon [icon]=\"icon\" [type]=\"iconType\"></nas-icon>\n </span>\n </span>\n </a>\n</ng-template>\n\n<ng-template #content>\n <ng-content></ng-content>\n</ng-template>", styles: ["@keyframes fade-in{0%{opacity:0}}@keyframes fade-in-down{0%{opacity:0;transform:translateY(-30px)}}@keyframes fade-in-left{0%{opacity:0;transform:translate(-30px)}}@keyframes fade-in-right{0%{opacity:0;transform:translate(30px)}}@keyframes fade-out{to{opacity:0}}@keyframes flip-in{0%{opacity:0;transform:rotateX(-90deg)}40%{opacity:1;transform:rotateX(10deg)}}@keyframes flip-out{to{opacity:0;transform:rotateX(-90deg)}}@keyframes pop-in-from-top{0%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-100,1,1);opacity:0}6.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-30.227,1,1)}13.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,1.76,1,1)}20%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,7.08,1,1)}26.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,3.838,1,1)}33.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.902,1,1);opacity:1}40%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.237,1,1)}46.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.312,1,1)}53.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.141,1,1)}60%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.021,1,1)}66.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.015,1,1)}73.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.013,1,1)}80%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.005,1,1)}86.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,0,1,1)}93.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.001,1,1);-webkit-transform:translate3d(0,0,0)}to{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.001,1,1);-webkit-transform:translate3d(0,0,0)}}.nas-button{position:relative;display:inline-block;padding:12px 24px;width:-webkit-max-content;width:max-content;border:0;border-radius:0;font-family:NorwegianTextPro,Arial,Helvetica Neue,Helvetica,sans-serif;font-size:16px;font-weight:700;line-height:24px;text-align:center;color:#15273f;background-color:#e9e7e4;transition:all .15s cubic-bezier(0,0,.1,1)}.nas-button--container{background-color:#fff}.nas-button:before{content:\"\";display:block;position:absolute;width:100%;height:2px;bottom:-3.5px;left:0;background-color:#e9e7e4;transition:all .15s cubic-bezier(0,0,.1,1)}.nas-button:hover,.nas-button:focus{background-color:#e9e7e4}.nas-button:hover:before,.nas-button:focus:before{transform:translateY(0)}.nas-button[disabled]{cursor:default;pointer-events:none;color:#6f6f6f;background-color:#e9e7e4}.nas-button--primary{color:#fff;background-color:#e5212d}.nas-button--primary:before{background-color:#15273f}.nas-button--primary:hover,.nas-button--primary:focus{color:#fff;background-color:#b71530}.nas-button--primary:hover:before,.nas-button--primary:focus:before{background-color:#15273f}.nas-button--primary:active{color:#fff;background:#891024}.nas-button--primary:active:before{background-color:#15273f}.nas-button--primary:focus-visible{outline:2px solid #0978E8;outline-offset:2px}.nas-button--primary:focus-visible:before{display:none}.nas-button--primary:disabled{background-color:#e9e7e4}.nas-button--secondary{color:#fff;background-color:#15273f}.nas-button--secondary:before{background-color:#15273f}.nas-button--secondary:hover,.nas-button--secondary:focus{color:#fff;background-color:#0a2033}.nas-button--secondary:hover:before,.nas-button--secondary:focus:before{background-color:#0a2033}.nas-button--secondary:active{color:#fff;background:#071622}.nas-button--secondary:active:before{background-color:#071622}.nas-button--secondary:focus-visible{outline:2px solid #0978E8;outline-offset:2px}.nas-button--secondary:focus-visible:before{display:none}.nas-button--secondary:before{display:none}.nas-button--secondary:disabled{background-color:#e9e7e4}.nas-button--light{color:#15273f;background-color:#fff;border:2px solid #6F6F6F}.nas-button--light:before{background-color:#fff}.nas-button--light:hover,.nas-button--light:focus{color:#15273f;background-color:#f8f8f8}.nas-button--light:hover:before,.nas-button--light:focus:before{background-color:#f8f8f8}.nas-button--light:active{color:#15273f;background:#ebf4ff}.nas-button--light:active:before{background-color:#ebf4ff}.nas-button--light:focus-visible{outline:2px solid #0978E8;outline-offset:2px}.nas-button--light:focus-visible:before{display:none}.nas-button--light:before{display:none}.nas-button--light:hover{border:2px solid #15273F}.nas-button--light:disabled{border:0}.nas-button--buttonlink{color:#b12a0b;background-color:transparent}.nas-button--buttonlink:before{background-color:transparent}.nas-button--buttonlink:hover,.nas-button--buttonlink:focus{color:#b12a0b;background-color:#f8f8f8}.nas-button--buttonlink:hover:before,.nas-button--buttonlink:focus:before{background-color:#f8f8f8}.nas-button--buttonlink:active{color:#b12a0b;background:#ebf4ff}.nas-button--buttonlink:active:before{background-color:#ebf4ff}.nas-button--buttonlink:focus-visible{outline:2px solid #0978E8;outline-offset:2px}.nas-button--buttonlink:focus-visible:before{display:none}.nas-button--buttonlink:before{display:none}.nas-button--buttonlink:disabled{background-color:#f8f8f8}.nas-button--large{font-family:NorwegianTextPro,Arial,Helvetica Neue,Helvetica,sans-serif;font-weight:700;font-size:18px;line-height:24px;padding:16px 36px 13px}.nas-button--block{display:block;width:100%}.nas-button--flex{display:flex;width:100%}.nas-button--compact{margin-bottom:12px}.nas-button--compact:before{display:none}.nas-button--right{align-self:flex-end;float:right}.nas-button--spaceless{margin-bottom:0}.nas-button--transparent{color:#fff;background-color:#000000a6}.nas-button--transparent:before{background-color:inherit}.nas-button--transparent:hover,.nas-button--transparent:active,.nas-button--transparent:focus{background-color:#000c}.nas-button--link{font-size:inherit;padding:0;margin:0;background:none;color:#b12a0b;width:auto;text-align:unset}.nas-button--link:hover,.nas-button--link:focus{color:#891024;border-color:#15273f;background:none}.nas-button--link:before{display:none}.nas-button--link.nas-button--secondary{color:#15273f}.nas-button--link.nas-button--light{color:#fff}.nas-button--link.nas-button--light:hover,.nas-button--link.nas-button--light:focus{color:#f8f8f8}.nas-button--link.nas-button--tetiary{color:#ffc1b7}.nas-button--link.nas-button--tetiary:hover,.nas-button--link.nas-button--tetiary:focus{color:#ffe2d9}.nas-button__content{display:flex;justify-content:center;gap:4px}.nas-button__content--reverse{flex-direction:row-reverse}.nas-button__icon{position:relative}.nas-button__icon .nas-icon-small{margin:0;transform:scale(.8)}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "directive", type: NasClassDirective, selector: "[nasClass]", inputs: ["nasClass", "attr.class"] }, { kind: "directive", type: i3.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "component", type: IconComponent, selector: "nas-icon", inputs: ["icon", "type", "isIndicator", "lightCircularBackground", "cssClass"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
|
|
1229
1229
|
}
|
|
1230
1230
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: ButtonComponent, decorators: [{
|
|
1231
1231
|
type: Component,
|
|
1232
|
-
args: [{ selector: 'nas-button', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, template: "<button #button *ngIf=\"!href\" [nasClass]=\"getClasses('', modifiers)\" [ngStyle]=\"buttonStyle\"\n [disabled]=\"!canContinueOnDisabled && disabled\" [class.disabled]=\"disabled\" [attr.type]=\"type\"\n [attr.aria-label]=\"ariaLabel\" [attr.tabindex]=\"tabindex\" [id]=\"buttonId\" (click)=\"emitTrackingAndClickEvent($event)\"\n (keydown)=\"onKeydown($event)\">\n <span [nasClass]=\"getClass('content', exists(iconLeft) && 'reverse')\">\n <ng-container *ngTemplateOutlet=\"content\"></ng-container>\n <span [nasClass]=\"getClass('icon')\" *ngIf=\"icon || iconType\">\n <nas-icon [icon]=\"icon\" [type]=\"iconType\"></nas-icon>\n </span>\n </span>\n</button>\n\n<ng-container *ngIf=\"href\">\n <ng-container *ngIf=\"exists(useRouterLink); else linksHref\">\n <a [nasClass]=\"getClasses('', modifiers)\" [attr.disabled]=\"disabled\" [routerLink]=\"href\" [id]=\"buttonId\"\n (click)=\"emitTrackingEvent();\" (keydown)=\"onKeydown($event)\">\n <ng-container *ngTemplateOutlet=\"content\"></ng-container>\n <span [nasClass]=\"getClass('icon')\" *ngIf=\"icon || iconType\">\n <nas-icon [icon]=\"icon\" [type]=\"iconType\"></nas-icon>\n </span>\n </a>\n </ng-container>\n</ng-container>\n\n<ng-template #linksHref>\n <a [nasClass]=\"getClasses('', modifiers)\" [attr.disabled]=\"disabled\" [href]=\"href\" [target]=\"target\" [id]=\"buttonId\"\n (click)=\"emitTrackingEvent();\" (keydown)=\"onKeydown($event)\">\n <span [nasClass]=\"getClass('content', exists(iconLeft) && 'reverse')\">\n <ng-container *ngTemplateOutlet=\"content\"></ng-container>\n <span [nasClass]=\"getClass('icon')\" *ngIf=\"icon || iconType\">\n <nas-icon [icon]=\"icon\" [type]=\"iconType\"></nas-icon>\n </span>\n </span>\n </a>\n</ng-template>\n\n<ng-template #content>\n <ng-content></ng-content>\n</ng-template>", styles: ["@keyframes fade-in{0%{opacity:0}}@keyframes fade-in-down{0%{opacity:0;transform:translateY(-30px)}}@keyframes fade-in-left{0%{opacity:0;transform:translate(-30px)}}@keyframes fade-in-right{0%{opacity:0;transform:translate(30px)}}@keyframes fade-out{to{opacity:0}}@keyframes flip-in{0%{opacity:0;transform:rotateX(-90deg)}40%{opacity:1;transform:rotateX(10deg)}}@keyframes flip-out{to{opacity:0;transform:rotateX(-90deg)}}@keyframes pop-in-from-top{0%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-100,1,1);opacity:0}6.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-30.227,1,1)}13.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,1.76,1,1)}20%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,7.08,1,1)}26.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,3.838,1,1)}33.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.902,1,1);opacity:1}40%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.237,1,1)}46.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.312,1,1)}53.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.141,1,1)}60%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.021,1,1)}66.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.015,1,1)}73.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.013,1,1)}80%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.005,1,1)}86.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,0,1,1)}93.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.001,1,1);-webkit-transform:translate3d(0,0,0)}to{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.001,1,1);-webkit-transform:translate3d(0,0,0)}}.nas-button{position:relative;display:inline-block;padding:12px 24px;width:-webkit-max-content;width:max-content;border:0;border-radius:0;font-family:NorwegianTextPro,Arial,Helvetica Neue,Helvetica,sans-serif;font-size:16px;font-weight:700;line-height:24px;text-align:center;color:#15273f;background-color:#e9e7e4;transition:all .15s cubic-bezier(0,0,.1,1)}.nas-button--container{background-color:#fff}.nas-button:before{content:\"\";display:block;position:absolute;width:100%;height:2px;bottom:-3.5px;left:0;background-color:#e9e7e4;transition:all .15s cubic-bezier(0,0,.1,1)}.nas-button:hover,.nas-button:focus{background-color:#e9e7e4}.nas-button:hover:before,.nas-button:focus:before{transform:translateY(0)}.nas-button[disabled]{cursor:default;pointer-events:none;color:#6f6f6f;background-color:#e9e7e4}.nas-button--primary{color:#fff;background-color:#e5212d}.nas-button--primary:before{background-color:#15273f}.nas-button--primary:hover,.nas-button--primary:focus{color:#fff;background-color:#b71530}.nas-button--primary:hover:before,.nas-button--primary:focus:before{background-color:#15273f}.nas-button--primary:active{color:#fff;background:#891024}.nas-button--primary:active:before{background-color:#15273f}.nas-button--primary:focus-visible{outline:2px solid #0978E8;outline-offset:2px}.nas-button--primary:focus-visible:before{display:none}.nas-button--primary:disabled{background-color:#e9e7e4}.nas-button--secondary{color:#fff;background-color:#15273f}.nas-button--secondary:before{background-color:#15273f}.nas-button--secondary:hover,.nas-button--secondary:focus{color:#fff;background-color:#0a2033}.nas-button--secondary:hover:before,.nas-button--secondary:focus:before{background-color:#0a2033}.nas-button--secondary:active{color:#fff;background:#071622}.nas-button--secondary:active:before{background-color:#071622}.nas-button--secondary:focus-visible{outline:2px solid #0978E8;outline-offset:2px}.nas-button--secondary:focus-visible:before{display:none}.nas-button--secondary:before{display:none}.nas-button--secondary:disabled{background-color:#e9e7e4}.nas-button--light{color:#15273f;background-color:#fff;border:2px solid #6F6F6F}.nas-button--light:before{background-color:#fff}.nas-button--light:hover,.nas-button--light:focus{color:#15273f;background-color:#f8f8f8}.nas-button--light:hover:before,.nas-button--light:focus:before{background-color:#f8f8f8}.nas-button--light:active{color:#15273f;background:#ebf4ff}.nas-button--light:active:before{background-color:#ebf4ff}.nas-button--light:focus-visible{outline:2px solid #0978E8;outline-offset:2px}.nas-button--light:focus-visible:before{display:none}.nas-button--light:before{display:none}.nas-button--light:hover{border:2px solid #15273F}.nas-button--light:disabled{border:0}.nas-button--buttonlink{color:#b12a0b;background-color:transparent}.nas-button--buttonlink:before{background-color:transparent}.nas-button--buttonlink:hover,.nas-button--buttonlink:focus{color:#b12a0b;background-color:#f8f8f8}.nas-button--buttonlink:hover:before,.nas-button--buttonlink:focus:before{background-color:#f8f8f8}.nas-button--buttonlink:active{color:#b12a0b;background:#ebf4ff}.nas-button--buttonlink:active:before{background-color:#ebf4ff}.nas-button--buttonlink:focus-visible{outline:2px solid #0978E8;outline-offset:2px}.nas-button--buttonlink:focus-visible:before{display:none}.nas-button--buttonlink:before{display:none}.nas-button--buttonlink:disabled{background-color:#f8f8f8}.nas-button--large{font-family:NorwegianTextPro,Arial,Helvetica Neue,Helvetica,sans-serif;font-weight:700;font-size:18px;line-height:24px;padding:16px 36px 13px}.nas-button--block{display:block;width:100%}.nas-button--flex{display:flex;width:100%}.nas-button--compact{margin-bottom:12px}.nas-button--compact:before{display:none}.nas-button--right{align-self:flex-end;float:right}.nas-button--spaceless{margin-bottom:0}.nas-button--transparent{color:#fff;background-color:#000000a6}.nas-button--transparent:before{background-color:inherit}.nas-button--transparent:hover,.nas-button--transparent:active,.nas-button--transparent:focus{background-color:#000c}.nas-button--link{font-size:inherit;padding:0;margin:0;background:none;color:#b12a0b}.nas-button--link:hover,.nas-button--link:focus{color:#891024;border-color:#15273f;background:none}.nas-button--link:before{display:none}.nas-button--link.nas-button--secondary{color:#15273f}.nas-button--link.nas-button--light{color:#fff}.nas-button--link.nas-button--light:hover,.nas-button--link.nas-button--light:focus{color:#f8f8f8}.nas-button--link.nas-button--tetiary{color:#ffc1b7}.nas-button--link.nas-button--tetiary:hover,.nas-button--link.nas-button--tetiary:focus{color:#ffe2d9}.nas-button__content{display:flex;justify-content:center;gap:4px}.nas-button__content--reverse{flex-direction:row-reverse}.nas-button__icon{position:relative}.nas-button__icon .nas-icon-small{margin:0;transform:scale(.8)}\n"] }]
|
|
1232
|
+
args: [{ selector: 'nas-button', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, template: "<button #button *ngIf=\"!href\" [nasClass]=\"getClasses('', modifiers)\" [ngStyle]=\"buttonStyle\"\n [disabled]=\"!canContinueOnDisabled && disabled\" [class.disabled]=\"disabled\" [attr.type]=\"type\"\n [attr.aria-label]=\"ariaLabel\" [attr.tabindex]=\"tabindex\" [id]=\"buttonId\" (click)=\"emitTrackingAndClickEvent($event)\"\n (keydown)=\"onKeydown($event)\">\n <span [nasClass]=\"getClass('content', exists(iconLeft) && 'reverse')\">\n <ng-container *ngTemplateOutlet=\"content\"></ng-container>\n <span [nasClass]=\"getClass('icon')\" *ngIf=\"icon || iconType\">\n <nas-icon [icon]=\"icon\" [type]=\"iconType\"></nas-icon>\n </span>\n </span>\n</button>\n\n<ng-container *ngIf=\"href\">\n <ng-container *ngIf=\"exists(useRouterLink); else linksHref\">\n <a [nasClass]=\"getClasses('', modifiers)\" [attr.disabled]=\"disabled\" [routerLink]=\"href\" [id]=\"buttonId\"\n (click)=\"emitTrackingEvent();\" (keydown)=\"onKeydown($event)\">\n <ng-container *ngTemplateOutlet=\"content\"></ng-container>\n <span [nasClass]=\"getClass('icon')\" *ngIf=\"icon || iconType\">\n <nas-icon [icon]=\"icon\" [type]=\"iconType\"></nas-icon>\n </span>\n </a>\n </ng-container>\n</ng-container>\n\n<ng-template #linksHref>\n <a [nasClass]=\"getClasses('', modifiers)\" [attr.disabled]=\"disabled\" [href]=\"href\" [target]=\"target\" [id]=\"buttonId\"\n (click)=\"emitTrackingEvent();\" (keydown)=\"onKeydown($event)\">\n <span [nasClass]=\"getClass('content', exists(iconLeft) && 'reverse')\">\n <ng-container *ngTemplateOutlet=\"content\"></ng-container>\n <span [nasClass]=\"getClass('icon')\" *ngIf=\"icon || iconType\">\n <nas-icon [icon]=\"icon\" [type]=\"iconType\"></nas-icon>\n </span>\n </span>\n </a>\n</ng-template>\n\n<ng-template #content>\n <ng-content></ng-content>\n</ng-template>", styles: ["@keyframes fade-in{0%{opacity:0}}@keyframes fade-in-down{0%{opacity:0;transform:translateY(-30px)}}@keyframes fade-in-left{0%{opacity:0;transform:translate(-30px)}}@keyframes fade-in-right{0%{opacity:0;transform:translate(30px)}}@keyframes fade-out{to{opacity:0}}@keyframes flip-in{0%{opacity:0;transform:rotateX(-90deg)}40%{opacity:1;transform:rotateX(10deg)}}@keyframes flip-out{to{opacity:0;transform:rotateX(-90deg)}}@keyframes pop-in-from-top{0%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-100,1,1);opacity:0}6.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-30.227,1,1)}13.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,1.76,1,1)}20%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,7.08,1,1)}26.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,3.838,1,1)}33.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.902,1,1);opacity:1}40%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.237,1,1)}46.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.312,1,1)}53.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.141,1,1)}60%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.021,1,1)}66.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.015,1,1)}73.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.013,1,1)}80%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.005,1,1)}86.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,0,1,1)}93.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.001,1,1);-webkit-transform:translate3d(0,0,0)}to{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.001,1,1);-webkit-transform:translate3d(0,0,0)}}.nas-button{position:relative;display:inline-block;padding:12px 24px;width:-webkit-max-content;width:max-content;border:0;border-radius:0;font-family:NorwegianTextPro,Arial,Helvetica Neue,Helvetica,sans-serif;font-size:16px;font-weight:700;line-height:24px;text-align:center;color:#15273f;background-color:#e9e7e4;transition:all .15s cubic-bezier(0,0,.1,1)}.nas-button--container{background-color:#fff}.nas-button:before{content:\"\";display:block;position:absolute;width:100%;height:2px;bottom:-3.5px;left:0;background-color:#e9e7e4;transition:all .15s cubic-bezier(0,0,.1,1)}.nas-button:hover,.nas-button:focus{background-color:#e9e7e4}.nas-button:hover:before,.nas-button:focus:before{transform:translateY(0)}.nas-button[disabled]{cursor:default;pointer-events:none;color:#6f6f6f;background-color:#e9e7e4}.nas-button--primary{color:#fff;background-color:#e5212d}.nas-button--primary:before{background-color:#15273f}.nas-button--primary:hover,.nas-button--primary:focus{color:#fff;background-color:#b71530}.nas-button--primary:hover:before,.nas-button--primary:focus:before{background-color:#15273f}.nas-button--primary:active{color:#fff;background:#891024}.nas-button--primary:active:before{background-color:#15273f}.nas-button--primary:focus-visible{outline:2px solid #0978E8;outline-offset:2px}.nas-button--primary:focus-visible:before{display:none}.nas-button--primary:disabled{background-color:#e9e7e4}.nas-button--secondary{color:#fff;background-color:#15273f}.nas-button--secondary:before{background-color:#15273f}.nas-button--secondary:hover,.nas-button--secondary:focus{color:#fff;background-color:#0a2033}.nas-button--secondary:hover:before,.nas-button--secondary:focus:before{background-color:#0a2033}.nas-button--secondary:active{color:#fff;background:#071622}.nas-button--secondary:active:before{background-color:#071622}.nas-button--secondary:focus-visible{outline:2px solid #0978E8;outline-offset:2px}.nas-button--secondary:focus-visible:before{display:none}.nas-button--secondary:before{display:none}.nas-button--secondary:disabled{background-color:#e9e7e4}.nas-button--light{color:#15273f;background-color:#fff;border:2px solid #6F6F6F}.nas-button--light:before{background-color:#fff}.nas-button--light:hover,.nas-button--light:focus{color:#15273f;background-color:#f8f8f8}.nas-button--light:hover:before,.nas-button--light:focus:before{background-color:#f8f8f8}.nas-button--light:active{color:#15273f;background:#ebf4ff}.nas-button--light:active:before{background-color:#ebf4ff}.nas-button--light:focus-visible{outline:2px solid #0978E8;outline-offset:2px}.nas-button--light:focus-visible:before{display:none}.nas-button--light:before{display:none}.nas-button--light:hover{border:2px solid #15273F}.nas-button--light:disabled{border:0}.nas-button--buttonlink{color:#b12a0b;background-color:transparent}.nas-button--buttonlink:before{background-color:transparent}.nas-button--buttonlink:hover,.nas-button--buttonlink:focus{color:#b12a0b;background-color:#f8f8f8}.nas-button--buttonlink:hover:before,.nas-button--buttonlink:focus:before{background-color:#f8f8f8}.nas-button--buttonlink:active{color:#b12a0b;background:#ebf4ff}.nas-button--buttonlink:active:before{background-color:#ebf4ff}.nas-button--buttonlink:focus-visible{outline:2px solid #0978E8;outline-offset:2px}.nas-button--buttonlink:focus-visible:before{display:none}.nas-button--buttonlink:before{display:none}.nas-button--buttonlink:disabled{background-color:#f8f8f8}.nas-button--large{font-family:NorwegianTextPro,Arial,Helvetica Neue,Helvetica,sans-serif;font-weight:700;font-size:18px;line-height:24px;padding:16px 36px 13px}.nas-button--block{display:block;width:100%}.nas-button--flex{display:flex;width:100%}.nas-button--compact{margin-bottom:12px}.nas-button--compact:before{display:none}.nas-button--right{align-self:flex-end;float:right}.nas-button--spaceless{margin-bottom:0}.nas-button--transparent{color:#fff;background-color:#000000a6}.nas-button--transparent:before{background-color:inherit}.nas-button--transparent:hover,.nas-button--transparent:active,.nas-button--transparent:focus{background-color:#000c}.nas-button--link{font-size:inherit;padding:0;margin:0;background:none;color:#b12a0b;width:auto;text-align:unset}.nas-button--link:hover,.nas-button--link:focus{color:#891024;border-color:#15273f;background:none}.nas-button--link:before{display:none}.nas-button--link.nas-button--secondary{color:#15273f}.nas-button--link.nas-button--light{color:#fff}.nas-button--link.nas-button--light:hover,.nas-button--link.nas-button--light:focus{color:#f8f8f8}.nas-button--link.nas-button--tetiary{color:#ffc1b7}.nas-button--link.nas-button--tetiary:hover,.nas-button--link.nas-button--tetiary:focus{color:#ffe2d9}.nas-button__content{display:flex;justify-content:center;gap:4px}.nas-button__content--reverse{flex-direction:row-reverse}.nas-button__icon{position:relative}.nas-button__icon .nas-icon-small{margin:0;transform:scale(.8)}\n"] }]
|
|
1233
1233
|
}], ctorParameters: function () { return []; }, propDecorators: { button: [{
|
|
1234
1234
|
type: ViewChild,
|
|
1235
1235
|
args: ['button']
|
|
@@ -2279,11 +2279,11 @@ class AirportSelectComponent extends NasComponentBase {
|
|
|
2279
2279
|
}
|
|
2280
2280
|
}
|
|
2281
2281
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: AirportSelectComponent, deps: [{ token: DeviceHelper }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
2282
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: AirportSelectComponent, selector: "nas-airport-select", inputs: { outboundId: "outboundId", inboundId: "inboundId", airports: "airports", airportRelations: "airportRelations", latestSearchesOrigin: "latestSearchesOrigin", latestSearchesDestination: "latestSearchesDestination", closestAirports: "closestAirports", allowedOriginAiports: "allowedOriginAiports", allowedDestinationAirports: "allowedDestinationAirports", displayLatestSearches: "displayLatestSearches", displayClosestAirports: "displayClosestAirports", combo: "combo", useSwitch: "useSwitch", allAirportsLabel: "allAirportsLabel", latestSearchesLabel: "latestSearchesLabel", closestAirportsLabel: "closestAirportsLabel", geolocationLabel: "geolocationLabel", geolocationBlockedLabel: "geolocationBlockedLabel", selectOriginFirstLabel: "selectOriginFirstLabel", invalidDestinationText: "invalidDestinationText", labelOrigin: "labelOrigin", placeholderOrigin: "placeholderOrigin", labelDestination: "labelDestination", placeholderDestination: "placeholderDestination", labelOutside: "labelOutside", keepSelection: "keepSelection", nasFormControlNameOrigin: "nasFormControlNameOrigin", nasFormControlNameDestination: "nasFormControlNameDestination", nasFormGroup: "nasFormGroup", originAirportCode: "originAirportCode", destinationAirportCode: "destinationAirportCode", ariaLabelClear: "ariaLabelClear", ariaLabelBackdrop: "ariaLabelBackdrop" }, outputs: { originChange: "originChange", originOpenChange: "originOpenChange", destinationChange: "destinationChange", destinationOpenChange: "destinationOpenChange", focusOnNext: "focusOnNext", positionChange: "positionChange" }, host: { listeners: { "window:resize": "onResize($event)" } }, viewQueries: [{ propertyName: "container", first: true, predicate: ["container"], descendants: true }, { propertyName: "switchButton", first: true, predicate: ["switchButton"], descendants: true }, { propertyName: "airportSelectDropdownOrigin", first: true, predicate: ["airportSelectDropdownOrigin"], descendants: true }, { propertyName: "airportSelectDropdownDestination", first: true, predicate: ["airportSelectDropdownDestination"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<div *ngIf=\"exists(combo); else airportSelectTemplate\"\n [nasClass]=\"getAirportSelectComboClass('', [inlineFlex && 'inline'])\" #container>\n <ng-container *ngTemplateOutlet=\"airportSelectTemplate\"></ng-container>\n</div>\n<ng-template #airportSelectTemplate>\n <div [nasClass]=\"getClass('', exists(useSwitch) && 'padding-origin')\" *ngIf=\"airportsOrigin\">\n <nas-airport-select-dropdown #airportSelectDropdownOrigin displayLatestSearches [id]=\"outboundId\"\n [enableGeolocation]=\"displayClosestAirports\" [displayClosestAirports]=\"displayClosestAirports\"\n [airportSelectLabel]=\"labelOrigin\" [latestSearches]=\"latestSearchesOrigin\" [closestAirports]=\"closestAirports\"\n [airport]=\"origin\" [airports]=\"airportsOrigin\" [resultsLabels]=\"resultsLabels\"\n [airportSelectPlaceholder]=\"placeholderOrigin\" [open]=\"originOpen\" [keepSelection]=\"keepSelection\"\n [airportSelectIconModifier]=\"'flight-departure'\" [nasFormControlName]=\"nasFormControlNameOrigin\"\n [nasFormGroup]=\"nasFormGroup\" [ariaLabelClear]=\"ariaLabelClear\" [ariaLabelBackdrop]=\"ariaLabelBackdrop\"\n [labelOutside]=\"labelOutside\" (clearedSelection)=\"onSelectionCleared()\" (selected)=\"setSelectedOrigin($event)\"\n (openChange)=\"onOriginOpen($event)\" (focusOnNext)=\"setDestinationOpen($event)\"\n (positionChange)=\"getClosestAirports($event)\"></nas-airport-select-dropdown>\n </div>\n <ng-container *ngIf=\"exists(combo)\">\n <div [nasClass]=\"getClass('', exists(useSwitch) && 'padding-destination')\"\n *ngIf=\"airportsDestination && airportsDestination.length > 0\">\n <nas-airport-select-dropdown #airportSelectDropdownDestination displayLatestSearches [id]=\"inboundId\"\n [airportSelectLabel]=\"labelDestination\" [displayClosestAirports]=\"false\"\n [latestSearches]=\"currentLatestSearchesDestination\" [airports]=\"airportsDestination\"\n [resultsLabels]=\"resultsLabels\" [airport]=\"destination\" [airportSelectPlaceholder]=\"placeholderDestination\"\n [open]=\"destinationOpen\" [keepSelection]=\"keepSelection\" [airportSelectIconModifier]=\"'flight-arrival'\"\n [nasFormControlName]=\"nasFormControlNameDestination\" [nasFormGroup]=\"nasFormGroup\"\n [ariaLabelClear]=\"ariaLabelClear\" [ariaLabelBackdrop]=\"ariaLabelBackdrop\" [isValid]=\"isDestinationValid\"\n [invalidText]=\"invalidDestinationText\" [labelOutside]=\"labelOutside\" (clearedSelection)=\"onSelectionCleared()\"\n (selected)=\"setSelectedDestination($event)\" (openChange)=\"onDestinationOpen($event)\"\n (focusOnNext)=\"setFocusOnNext($event)\" (focusOnPrevious)=\"onOriginFocus()\"></nas-airport-select-dropdown>\n </div>\n <div *ngIf=\"exists(useSwitch) && !(originOpen || destinationOpen || cleared)\" #switchButton\n [nasClass]=\"getAirportSelectComboClass('switcher', (originAirportCodeValue && destinationAirportCodeValue) && 'filled')\"\n (mouseover)=\"changeSwitchIcon()\" (mouseleave)=\"changeSwitchIcon()\" (keydown)=\"swapKeyDown($event)\"\n (click)=\"swapAirports()\">\n <nas-icon\n [type]=\"(this.destinationAirportCodeValue && this.originAirportCodeValue) ? 'vector--secondary' : 'vector'\"></nas-icon>\n </div>\n </ng-container>\n</ng-template>", styles: ["@keyframes fade-in{0%{opacity:0}}@keyframes fade-in-down{0%{opacity:0;transform:translateY(-30px)}}@keyframes fade-in-left{0%{opacity:0;transform:translate(-30px)}}@keyframes fade-in-right{0%{opacity:0;transform:translate(30px)}}@keyframes fade-out{to{opacity:0}}@keyframes flip-in{0%{opacity:0;transform:rotateX(-90deg)}40%{opacity:1;transform:rotateX(10deg)}}@keyframes flip-out{to{opacity:0;transform:rotateX(-90deg)}}@keyframes pop-in-from-top{0%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-100,1,1);opacity:0}6.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-30.227,1,1)}13.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,1.76,1,1)}20%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,7.08,1,1)}26.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,3.838,1,1)}33.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.902,1,1);opacity:1}40%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.237,1,1)}46.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.312,1,1)}53.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.141,1,1)}60%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.021,1,1)}66.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.015,1,1)}73.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.013,1,1)}80%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.005,1,1)}86.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,0,1,1)}93.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.001,1,1);-webkit-transform:translate3d(0,0,0)}to{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.001,1,1);-webkit-transform:translate3d(0,0,0)}}.nas-airport-select{position:relative;width:100%;text-align:left}.nas-airport-select label{margin-bottom:0;height:67px}.nas-airport-select:first-child{margin-bottom:0}.nas-airport-select:only-child{max-width:360px}.nas-airport-select--expanded{z-index:30}.nas-airport-select__wrapper{position:relative;display:block;z-index:3;background-color:#fff;border:2px solid #6F6F6F}.nas-airport-select__wrapper--active{background-color:#ebf4ff;border:2px solid #15273F}.nas-airport-select__wrapper--filled{border:2px solid #15273F}.nas-airport-select__wrapper--label-outside{background-color:transparent;border:0}.nas-airport-select__wrapper--label-outside input{height:50px!important;border:2px solid #6F6F6F}.nas-airport-select__wrapper--label-outside .nas-airport-select__icon{bottom:6px}.nas-airport-select__wrapper--label-outside .nas-airport-select__label{font-family:NorwegianTextPro,Arial,Helvetica Neue,Helvetica,sans-serif;font-weight:700;font-size:16px;margin-bottom:6px;padding:0}.nas-airport-select__wrapper--label-outside .nas-airport-select__label+.nas-airport-select__input[type=text]{padding:0 16px}.nas-airport-select__list-section-label{font-family:NorwegianTextPro,Arial,Helvetica Neue,Helvetica,sans-serif;font-weight:700;font-size:14px;line-height:20px;position:relative;z-index:2;text-align:center;padding:3px 12px;background-color:#e9e7e4}.nas-airport-select__list-section-label:not(:first-child){margin-top:-1px}.nas-airport-select__label{font-family:NorwegianTextPro,Arial,Helvetica Neue,Helvetica,sans-serif;font-weight:700;font-size:14px;line-height:20px;display:block;position:relative;z-index:3;padding:9px 16px 0;background-color:inherit}.nas-airport-select__input{height:64px;position:relative;z-index:3;line-height:1;margin:0;background-color:transparent}.nas-airport-select__input[type=text]{padding:0 16px 9px}.nas-airport-select__input[type=text]:focus{border-bottom:none}.nas-airport-select__label+.nas-airport-select__input{height:34px;position:relative;z-index:3;line-height:1;margin:0;background-color:transparent}.nas-airport-select__label+.nas-airport-select__input[type=text]{padding:0 16px 9px}.nas-airport-select__icon{position:absolute;z-index:4;right:18px;bottom:18px}.nas-airport-select__results-wrapper{position:relative;z-index:4;perspective:1000px;margin-top:-4px}.nas-airport-select__results-wrapper--label-outside{margin-top:9px}.nas-airport-select__results{position:absolute;z-index:3;width:100%;left:0;max-height:50vh;overflow-x:hidden;overflow-y:auto;scrollbar-width:none;-webkit-overflow-scrolling:touch;border:2px solid #15273F;background-color:#fff;transform-origin:center top;transform-style:preserve-3d;-webkit-backface-visibility:hidden;backface-visibility:hidden;animation:airport-select-results .65s ease both}.nas-airport-select__dummy{position:absolute;left:-100px}.nas-airport-select__backdrop{display:block;position:fixed;z-index:2;top:0;left:0;width:100%;height:100%;color:transparent;background-color:#0b14202b;animation:airport-select-backdrop .7s ease-out both}.nas-airport-select__list-item{border-bottom:2px solid #E9E7E4}.nas-airport-select__list-item:last-child{border-bottom:0}.nas-airport-select__list-item:not(:last-of-type):after{content:\"\";display:block;width:100%;position:absolute;bottom:0;border-bottom:1px solid #E9E7E4}.nas-airport-select__geolocation--label{align-self:center;padding-left:4px}.nas-airport-select__geolocation--icon{margin:3px 3px 0}.nas-airport-select__item{display:block;position:relative;z-index:2;width:100%;text-align:left;padding:16px;margin-top:-1px;display:flex;justify-content:space-between;outline:0}.nas-airport-select__item--focus,.nas-airport-select__item:hover,.nas-airport-select__item:focus{background-color:#15273f}.nas-airport-select__item--focus,.nas-airport-select__item--focus .nas-airport-select__name,.nas-airport-select__item--focus .nas-airport-select__code,.nas-airport-select__item:hover,.nas-airport-select__item:hover .nas-airport-select__name,.nas-airport-select__item:hover .nas-airport-select__code,.nas-airport-select__item:focus,.nas-airport-select__item:focus .nas-airport-select__name,.nas-airport-select__item:focus .nas-airport-select__code{color:#fff!important}.nas-airport-select__item--disabled{border-bottom-width:0}.nas-airport-select__item--disabled,.nas-airport-select__item--disabled .nas-airport-select__name,.nas-airport-select__item--disabled .nas-airport-select__code{color:#6f6f6f!important}.nas-airport-select__item--disabled:hover,.nas-airport-select__item--disabled:focus{background-color:#fff;cursor:auto}.nas-airport-select__item--disabled:hover,.nas-airport-select__item--disabled:hover .nas-airport-select__name,.nas-airport-select__item--disabled:hover .nas-airport-select__code,.nas-airport-select__item--disabled:focus,.nas-airport-select__item--disabled:focus .nas-airport-select__name,.nas-airport-select__item--disabled:focus .nas-airport-select__code{color:#6f6f6f!important}.nas-airport-select__item--geolocation{border-bottom:2px solid #E9E7E4}.nas-airport-select__name,.nas-airport-select__code{display:inline-block;font-family:NorwegianTextPro,Arial,Helvetica Neue,Helvetica,sans-serif;font-weight:700;line-height:1;color:#15273f;margin-bottom:3px}.nas-airport-select__name--invalid,.nas-airport-select__code--invalid{margin:12px}.nas-airport-select__code{margin-left:.12em}.nas-airport-select__country{display:block;font-size:14px}.nas-airport-select__empty{font-family:NorwegianTextPro,Arial,Helvetica Neue,Helvetica,sans-serif;font-weight:700;font-size:16px;line-height:1.4;color:#15273f;margin:0;padding:12px}.nas-icon-vector,.nas-icon-vector--secondary{margin-bottom:2px}.nas-filter .nas-airport-select-combo,.nas-search-filter .nas-airport-select-combo{margin:0 3px 0 0}.nas-airport-select-combo{position:relative;display:flex;flex-direction:column;width:100%;margin:8px auto;gap:8px}.nas-airport-select-combo--inline{flex-direction:row}.nas-airport-select-combo--inline .nas-airport-select-combo__switcher{left:48%;top:14px;transform:rotate(90deg)}.nas-airport-select-combo--inline .nas-airport-select--padding-destination .nas-airport-select__label{padding:12px 24px 0}.nas-airport-select-combo--inline .nas-airport-select--padding-destination .nas-airport-select__label+.nas-airport-select__input[type=text]{padding:0 24px 12px}.nas-airport-select-combo__switcher{position:absolute;top:48px;z-index:3;left:76%;cursor:pointer;border:2px solid #6F6F6F;border-radius:50%;width:40px;height:40px;background-color:#fff;justify-content:center;align-items:center;display:flex}.nas-airport-select-combo__switcher:focus{outline:none;box-shadow:0 0 1px 2px #e9e7e4,0 0 2px 3px #7ca4cd}.nas-airport-select-combo__switcher--filled{border:2px solid #15273F}@keyframes airport-select-backdrop{0%{opacity:0}}@keyframes airport-select-results{0%{transform:rotateX(-90deg)}40%{transform:rotateX(20deg)}to{transform:rotateX(0)}}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: NasClassDirective, selector: "[nasClass]", inputs: ["nasClass", "attr.class"] }, { kind: "component", type: IconComponent, selector: "nas-icon", inputs: ["icon", "type", "isIndicator", "lightCircularBackground", "cssClass"] }, { kind: "component", type: AirportSelectDropdownComponent, selector: "nas-airport-select-dropdown", inputs: ["id", "displayLatestSearches", "displayClosestAirports", "latestSearches", "resultsLabels", "airportSelectLabel", "airportSelectPlaceholder", "airportSelectIconModifier", "labelOutside", "keepSelection", "nasFormControlName", "nasFormGroup", "enableGeolocation", "ariaLabelClear", "ariaLabelBackdrop", "isValid", "invalidText", "closestAirports", "airport", "open", "airports"], outputs: ["selected", "openChange", "focusOnNext", "focusOnPrevious", "positionChange", "clearedSelection"] }], encapsulation: i0.ViewEncapsulation.None }); }
|
|
2282
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: AirportSelectComponent, selector: "nas-airport-select", inputs: { outboundId: "outboundId", inboundId: "inboundId", airports: "airports", airportRelations: "airportRelations", latestSearchesOrigin: "latestSearchesOrigin", latestSearchesDestination: "latestSearchesDestination", closestAirports: "closestAirports", allowedOriginAiports: "allowedOriginAiports", allowedDestinationAirports: "allowedDestinationAirports", displayLatestSearches: "displayLatestSearches", displayClosestAirports: "displayClosestAirports", combo: "combo", useSwitch: "useSwitch", allAirportsLabel: "allAirportsLabel", latestSearchesLabel: "latestSearchesLabel", closestAirportsLabel: "closestAirportsLabel", geolocationLabel: "geolocationLabel", geolocationBlockedLabel: "geolocationBlockedLabel", selectOriginFirstLabel: "selectOriginFirstLabel", invalidDestinationText: "invalidDestinationText", labelOrigin: "labelOrigin", placeholderOrigin: "placeholderOrigin", labelDestination: "labelDestination", placeholderDestination: "placeholderDestination", labelOutside: "labelOutside", keepSelection: "keepSelection", nasFormControlNameOrigin: "nasFormControlNameOrigin", nasFormControlNameDestination: "nasFormControlNameDestination", nasFormGroup: "nasFormGroup", originAirportCode: "originAirportCode", destinationAirportCode: "destinationAirportCode", ariaLabelClear: "ariaLabelClear", ariaLabelBackdrop: "ariaLabelBackdrop" }, outputs: { originChange: "originChange", originOpenChange: "originOpenChange", destinationChange: "destinationChange", destinationOpenChange: "destinationOpenChange", focusOnNext: "focusOnNext", positionChange: "positionChange" }, host: { listeners: { "window:resize": "onResize($event)" } }, viewQueries: [{ propertyName: "container", first: true, predicate: ["container"], descendants: true }, { propertyName: "switchButton", first: true, predicate: ["switchButton"], descendants: true }, { propertyName: "airportSelectDropdownOrigin", first: true, predicate: ["airportSelectDropdownOrigin"], descendants: true }, { propertyName: "airportSelectDropdownDestination", first: true, predicate: ["airportSelectDropdownDestination"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<div *ngIf=\"exists(combo); else airportSelectTemplate\"\n [nasClass]=\"getAirportSelectComboClass('', [inlineFlex && 'inline'])\" #container>\n <ng-container *ngTemplateOutlet=\"airportSelectTemplate\"></ng-container>\n</div>\n<ng-template #airportSelectTemplate>\n <div [nasClass]=\"getClass('', exists(useSwitch) && 'padding-origin')\" *ngIf=\"airportsOrigin\">\n <nas-airport-select-dropdown #airportSelectDropdownOrigin displayLatestSearches [id]=\"outboundId\"\n [enableGeolocation]=\"displayClosestAirports\" [displayClosestAirports]=\"displayClosestAirports\"\n [airportSelectLabel]=\"labelOrigin\" [latestSearches]=\"latestSearchesOrigin\" [closestAirports]=\"closestAirports\"\n [airport]=\"origin\" [airports]=\"airportsOrigin\" [resultsLabels]=\"resultsLabels\"\n [airportSelectPlaceholder]=\"placeholderOrigin\" [open]=\"originOpen\" [keepSelection]=\"keepSelection\"\n [airportSelectIconModifier]=\"'flight-departure'\" [nasFormControlName]=\"nasFormControlNameOrigin\"\n [nasFormGroup]=\"nasFormGroup\" [ariaLabelClear]=\"ariaLabelClear\" [ariaLabelBackdrop]=\"ariaLabelBackdrop\"\n [labelOutside]=\"labelOutside\" (clearedSelection)=\"onSelectionCleared()\" (selected)=\"setSelectedOrigin($event)\"\n (openChange)=\"onOriginOpen($event)\" (focusOnNext)=\"setDestinationOpen($event)\"\n (positionChange)=\"getClosestAirports($event)\"></nas-airport-select-dropdown>\n </div>\n <ng-container *ngIf=\"exists(combo)\">\n <div [nasClass]=\"getClass('', exists(useSwitch) && 'padding-destination')\"\n *ngIf=\"airportsDestination && airportsDestination.length > 0\">\n <nas-airport-select-dropdown #airportSelectDropdownDestination displayLatestSearches [id]=\"inboundId\"\n [airportSelectLabel]=\"labelDestination\" [displayClosestAirports]=\"false\"\n [latestSearches]=\"currentLatestSearchesDestination\" [airports]=\"airportsDestination\"\n [resultsLabels]=\"resultsLabels\" [airport]=\"destination\" [airportSelectPlaceholder]=\"placeholderDestination\"\n [open]=\"destinationOpen\" [keepSelection]=\"keepSelection\" [airportSelectIconModifier]=\"'flight-arrival'\"\n [nasFormControlName]=\"nasFormControlNameDestination\" [nasFormGroup]=\"nasFormGroup\"\n [ariaLabelClear]=\"ariaLabelClear\" [ariaLabelBackdrop]=\"ariaLabelBackdrop\" [isValid]=\"isDestinationValid\"\n [invalidText]=\"invalidDestinationText\" [labelOutside]=\"labelOutside\" (clearedSelection)=\"onSelectionCleared()\"\n (selected)=\"setSelectedDestination($event)\" (openChange)=\"onDestinationOpen($event)\"\n (focusOnNext)=\"setFocusOnNext($event)\" (focusOnPrevious)=\"onOriginFocus()\"></nas-airport-select-dropdown>\n </div>\n <div *ngIf=\"exists(useSwitch) && !(originOpen || destinationOpen || cleared)\" #switchButton\n [nasClass]=\"getAirportSelectComboClass('switcher', (originAirportCodeValue && destinationAirportCodeValue) && 'filled')\"\n (mouseover)=\"changeSwitchIcon()\" (mouseleave)=\"changeSwitchIcon()\" (keydown)=\"swapKeyDown($event)\"\n (click)=\"swapAirports()\">\n <nas-icon\n [type]=\"(this.destinationAirportCodeValue && this.originAirportCodeValue) ? 'vector--secondary' : 'vector'\"></nas-icon>\n </div>\n </ng-container>\n</ng-template>", styles: ["@keyframes fade-in{0%{opacity:0}}@keyframes fade-in-down{0%{opacity:0;transform:translateY(-30px)}}@keyframes fade-in-left{0%{opacity:0;transform:translate(-30px)}}@keyframes fade-in-right{0%{opacity:0;transform:translate(30px)}}@keyframes fade-out{to{opacity:0}}@keyframes flip-in{0%{opacity:0;transform:rotateX(-90deg)}40%{opacity:1;transform:rotateX(10deg)}}@keyframes flip-out{to{opacity:0;transform:rotateX(-90deg)}}@keyframes pop-in-from-top{0%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-100,1,1);opacity:0}6.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-30.227,1,1)}13.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,1.76,1,1)}20%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,7.08,1,1)}26.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,3.838,1,1)}33.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.902,1,1);opacity:1}40%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.237,1,1)}46.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.312,1,1)}53.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.141,1,1)}60%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.021,1,1)}66.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.015,1,1)}73.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.013,1,1)}80%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.005,1,1)}86.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,0,1,1)}93.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.001,1,1);-webkit-transform:translate3d(0,0,0)}to{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.001,1,1);-webkit-transform:translate3d(0,0,0)}}.nas-airport-select{position:relative;width:100%;text-align:left}.nas-airport-select label{margin-bottom:0;height:67px}.nas-airport-select:first-child{margin-bottom:0}.nas-airport-select:only-child{max-width:360px}.nas-airport-select--expanded{z-index:30}.nas-airport-select__wrapper{position:relative;display:block;z-index:3;background-color:#fff;border:2px solid #6F6F6F}.nas-airport-select__wrapper--active{background-color:#ebf4ff;border:2px solid #15273F}.nas-airport-select__wrapper--filled{border:2px solid #15273F}.nas-airport-select__wrapper--label-outside{background-color:transparent;border:0}.nas-airport-select__wrapper--label-outside input{height:50px!important;border:2px solid #6F6F6F}.nas-airport-select__wrapper--label-outside .nas-airport-select__icon{bottom:6px}.nas-airport-select__wrapper--label-outside .nas-airport-select__label{font-family:NorwegianTextPro,Arial,Helvetica Neue,Helvetica,sans-serif;font-weight:700;font-size:16px;margin-bottom:6px;padding:0}.nas-airport-select__wrapper--label-outside .nas-airport-select__label+.nas-airport-select__input[type=text]{padding:0 16px;background-color:#fff}.nas-airport-select__wrapper--label-outside .nas-airport-select__input[type=text]:focus{background-color:#ebf4ff;border:2px solid #15273F}.nas-airport-select__list-section-label{font-family:NorwegianTextPro,Arial,Helvetica Neue,Helvetica,sans-serif;font-weight:700;font-size:14px;line-height:20px;position:relative;z-index:2;text-align:center;padding:3px 12px;background-color:#e9e7e4}.nas-airport-select__list-section-label:not(:first-child){margin-top:-1px}.nas-airport-select__label{font-family:NorwegianTextPro,Arial,Helvetica Neue,Helvetica,sans-serif;font-weight:700;font-size:14px;line-height:20px;display:block;position:relative;z-index:3;padding:9px 16px 0;background-color:inherit}.nas-airport-select__input{height:64px;position:relative;z-index:3;line-height:1;margin:0;background-color:transparent}.nas-airport-select__input[type=text]{padding:0 16px 9px}.nas-airport-select__input[type=text]:focus{border-bottom:none}.nas-airport-select__label+.nas-airport-select__input{height:34px;position:relative;z-index:3;line-height:1;margin:0;background-color:transparent}.nas-airport-select__label+.nas-airport-select__input[type=text]{padding:0 16px 9px}.nas-airport-select__icon{position:absolute;z-index:4;right:18px;bottom:18px}.nas-airport-select__results-wrapper{position:relative;z-index:4;perspective:1000px;margin-top:-4px}.nas-airport-select__results-wrapper--label-outside{margin-top:9px}.nas-airport-select__results{position:absolute;z-index:3;width:100%;left:0;max-height:50vh;overflow-x:hidden;overflow-y:auto;scrollbar-width:none;-webkit-overflow-scrolling:touch;border:2px solid #15273F;background-color:#fff;transform-origin:center top;transform-style:preserve-3d;-webkit-backface-visibility:hidden;backface-visibility:hidden;animation:airport-select-results .65s ease both}.nas-airport-select__dummy{position:absolute;left:-100px}.nas-airport-select__backdrop{display:block;position:fixed;z-index:2;top:0;left:0;width:100%;height:100%;color:transparent;background-color:#0b14202b;animation:airport-select-backdrop .7s ease-out both}.nas-airport-select__list-item{border-bottom:2px solid #E9E7E4}.nas-airport-select__list-item:last-child{border-bottom:0}.nas-airport-select__list-item:not(:last-of-type):after{content:\"\";display:block;width:100%;position:absolute;bottom:0;border-bottom:1px solid #E9E7E4}.nas-airport-select__geolocation--label{align-self:center;padding-left:4px}.nas-airport-select__geolocation--icon{margin:3px 3px 0}.nas-airport-select__item{display:block;position:relative;z-index:2;width:100%;text-align:left;padding:16px;margin-top:-1px;display:flex;justify-content:space-between;outline:0}.nas-airport-select__item--focus,.nas-airport-select__item:hover,.nas-airport-select__item:focus{background-color:#15273f}.nas-airport-select__item--focus,.nas-airport-select__item--focus .nas-airport-select__name,.nas-airport-select__item--focus .nas-airport-select__code,.nas-airport-select__item:hover,.nas-airport-select__item:hover .nas-airport-select__name,.nas-airport-select__item:hover .nas-airport-select__code,.nas-airport-select__item:focus,.nas-airport-select__item:focus .nas-airport-select__name,.nas-airport-select__item:focus .nas-airport-select__code{color:#fff!important}.nas-airport-select__item--disabled{border-bottom-width:0}.nas-airport-select__item--disabled,.nas-airport-select__item--disabled .nas-airport-select__name,.nas-airport-select__item--disabled .nas-airport-select__code{color:#6f6f6f!important}.nas-airport-select__item--disabled:hover,.nas-airport-select__item--disabled:focus{background-color:#fff;cursor:auto}.nas-airport-select__item--disabled:hover,.nas-airport-select__item--disabled:hover .nas-airport-select__name,.nas-airport-select__item--disabled:hover .nas-airport-select__code,.nas-airport-select__item--disabled:focus,.nas-airport-select__item--disabled:focus .nas-airport-select__name,.nas-airport-select__item--disabled:focus .nas-airport-select__code{color:#6f6f6f!important}.nas-airport-select__item--geolocation{border-bottom:2px solid #E9E7E4}.nas-airport-select__name,.nas-airport-select__code{display:inline-block;font-family:NorwegianTextPro,Arial,Helvetica Neue,Helvetica,sans-serif;font-weight:700;line-height:1;color:#15273f;margin-bottom:3px}.nas-airport-select__name--invalid,.nas-airport-select__code--invalid{margin:12px}.nas-airport-select__code{margin-left:.12em}.nas-airport-select__country{display:block;font-size:14px}.nas-airport-select__empty{font-family:NorwegianTextPro,Arial,Helvetica Neue,Helvetica,sans-serif;font-weight:700;font-size:16px;line-height:1.4;color:#15273f;margin:0;padding:12px}.nas-icon-vector,.nas-icon-vector--secondary{margin-bottom:2px}.nas-filter .nas-airport-select-combo,.nas-search-filter .nas-airport-select-combo{margin:0 3px 0 0}.nas-airport-select-combo{position:relative;display:flex;flex-direction:column;width:100%;margin:8px auto;gap:8px}.nas-airport-select-combo--inline{flex-direction:row}.nas-airport-select-combo--inline .nas-airport-select-combo__switcher{left:48%;top:14px;transform:rotate(90deg)}.nas-airport-select-combo--inline .nas-airport-select--padding-destination .nas-airport-select__label{padding:12px 24px 0}.nas-airport-select-combo--inline .nas-airport-select--padding-destination .nas-airport-select__label+.nas-airport-select__input[type=text]{padding:0 24px 12px}.nas-airport-select-combo__switcher{position:absolute;top:48px;z-index:3;left:76%;cursor:pointer;border:2px solid #6F6F6F;border-radius:50%;width:40px;height:40px;background-color:#fff;justify-content:center;align-items:center;display:flex}.nas-airport-select-combo__switcher:focus{outline:none;box-shadow:0 0 1px 2px #e9e7e4,0 0 2px 3px #7ca4cd}.nas-airport-select-combo__switcher--filled{border:2px solid #15273F}@keyframes airport-select-backdrop{0%{opacity:0}}@keyframes airport-select-results{0%{transform:rotateX(-90deg)}40%{transform:rotateX(20deg)}to{transform:rotateX(0)}}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: NasClassDirective, selector: "[nasClass]", inputs: ["nasClass", "attr.class"] }, { kind: "component", type: IconComponent, selector: "nas-icon", inputs: ["icon", "type", "isIndicator", "lightCircularBackground", "cssClass"] }, { kind: "component", type: AirportSelectDropdownComponent, selector: "nas-airport-select-dropdown", inputs: ["id", "displayLatestSearches", "displayClosestAirports", "latestSearches", "resultsLabels", "airportSelectLabel", "airportSelectPlaceholder", "airportSelectIconModifier", "labelOutside", "keepSelection", "nasFormControlName", "nasFormGroup", "enableGeolocation", "ariaLabelClear", "ariaLabelBackdrop", "isValid", "invalidText", "closestAirports", "airport", "open", "airports"], outputs: ["selected", "openChange", "focusOnNext", "focusOnPrevious", "positionChange", "clearedSelection"] }], encapsulation: i0.ViewEncapsulation.None }); }
|
|
2283
2283
|
}
|
|
2284
2284
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: AirportSelectComponent, decorators: [{
|
|
2285
2285
|
type: Component,
|
|
2286
|
-
args: [{ selector: 'nas-airport-select', encapsulation: ViewEncapsulation.None, template: "<div *ngIf=\"exists(combo); else airportSelectTemplate\"\n [nasClass]=\"getAirportSelectComboClass('', [inlineFlex && 'inline'])\" #container>\n <ng-container *ngTemplateOutlet=\"airportSelectTemplate\"></ng-container>\n</div>\n<ng-template #airportSelectTemplate>\n <div [nasClass]=\"getClass('', exists(useSwitch) && 'padding-origin')\" *ngIf=\"airportsOrigin\">\n <nas-airport-select-dropdown #airportSelectDropdownOrigin displayLatestSearches [id]=\"outboundId\"\n [enableGeolocation]=\"displayClosestAirports\" [displayClosestAirports]=\"displayClosestAirports\"\n [airportSelectLabel]=\"labelOrigin\" [latestSearches]=\"latestSearchesOrigin\" [closestAirports]=\"closestAirports\"\n [airport]=\"origin\" [airports]=\"airportsOrigin\" [resultsLabels]=\"resultsLabels\"\n [airportSelectPlaceholder]=\"placeholderOrigin\" [open]=\"originOpen\" [keepSelection]=\"keepSelection\"\n [airportSelectIconModifier]=\"'flight-departure'\" [nasFormControlName]=\"nasFormControlNameOrigin\"\n [nasFormGroup]=\"nasFormGroup\" [ariaLabelClear]=\"ariaLabelClear\" [ariaLabelBackdrop]=\"ariaLabelBackdrop\"\n [labelOutside]=\"labelOutside\" (clearedSelection)=\"onSelectionCleared()\" (selected)=\"setSelectedOrigin($event)\"\n (openChange)=\"onOriginOpen($event)\" (focusOnNext)=\"setDestinationOpen($event)\"\n (positionChange)=\"getClosestAirports($event)\"></nas-airport-select-dropdown>\n </div>\n <ng-container *ngIf=\"exists(combo)\">\n <div [nasClass]=\"getClass('', exists(useSwitch) && 'padding-destination')\"\n *ngIf=\"airportsDestination && airportsDestination.length > 0\">\n <nas-airport-select-dropdown #airportSelectDropdownDestination displayLatestSearches [id]=\"inboundId\"\n [airportSelectLabel]=\"labelDestination\" [displayClosestAirports]=\"false\"\n [latestSearches]=\"currentLatestSearchesDestination\" [airports]=\"airportsDestination\"\n [resultsLabels]=\"resultsLabels\" [airport]=\"destination\" [airportSelectPlaceholder]=\"placeholderDestination\"\n [open]=\"destinationOpen\" [keepSelection]=\"keepSelection\" [airportSelectIconModifier]=\"'flight-arrival'\"\n [nasFormControlName]=\"nasFormControlNameDestination\" [nasFormGroup]=\"nasFormGroup\"\n [ariaLabelClear]=\"ariaLabelClear\" [ariaLabelBackdrop]=\"ariaLabelBackdrop\" [isValid]=\"isDestinationValid\"\n [invalidText]=\"invalidDestinationText\" [labelOutside]=\"labelOutside\" (clearedSelection)=\"onSelectionCleared()\"\n (selected)=\"setSelectedDestination($event)\" (openChange)=\"onDestinationOpen($event)\"\n (focusOnNext)=\"setFocusOnNext($event)\" (focusOnPrevious)=\"onOriginFocus()\"></nas-airport-select-dropdown>\n </div>\n <div *ngIf=\"exists(useSwitch) && !(originOpen || destinationOpen || cleared)\" #switchButton\n [nasClass]=\"getAirportSelectComboClass('switcher', (originAirportCodeValue && destinationAirportCodeValue) && 'filled')\"\n (mouseover)=\"changeSwitchIcon()\" (mouseleave)=\"changeSwitchIcon()\" (keydown)=\"swapKeyDown($event)\"\n (click)=\"swapAirports()\">\n <nas-icon\n [type]=\"(this.destinationAirportCodeValue && this.originAirportCodeValue) ? 'vector--secondary' : 'vector'\"></nas-icon>\n </div>\n </ng-container>\n</ng-template>", styles: ["@keyframes fade-in{0%{opacity:0}}@keyframes fade-in-down{0%{opacity:0;transform:translateY(-30px)}}@keyframes fade-in-left{0%{opacity:0;transform:translate(-30px)}}@keyframes fade-in-right{0%{opacity:0;transform:translate(30px)}}@keyframes fade-out{to{opacity:0}}@keyframes flip-in{0%{opacity:0;transform:rotateX(-90deg)}40%{opacity:1;transform:rotateX(10deg)}}@keyframes flip-out{to{opacity:0;transform:rotateX(-90deg)}}@keyframes pop-in-from-top{0%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-100,1,1);opacity:0}6.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-30.227,1,1)}13.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,1.76,1,1)}20%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,7.08,1,1)}26.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,3.838,1,1)}33.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.902,1,1);opacity:1}40%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.237,1,1)}46.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.312,1,1)}53.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.141,1,1)}60%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.021,1,1)}66.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.015,1,1)}73.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.013,1,1)}80%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.005,1,1)}86.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,0,1,1)}93.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.001,1,1);-webkit-transform:translate3d(0,0,0)}to{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.001,1,1);-webkit-transform:translate3d(0,0,0)}}.nas-airport-select{position:relative;width:100%;text-align:left}.nas-airport-select label{margin-bottom:0;height:67px}.nas-airport-select:first-child{margin-bottom:0}.nas-airport-select:only-child{max-width:360px}.nas-airport-select--expanded{z-index:30}.nas-airport-select__wrapper{position:relative;display:block;z-index:3;background-color:#fff;border:2px solid #6F6F6F}.nas-airport-select__wrapper--active{background-color:#ebf4ff;border:2px solid #15273F}.nas-airport-select__wrapper--filled{border:2px solid #15273F}.nas-airport-select__wrapper--label-outside{background-color:transparent;border:0}.nas-airport-select__wrapper--label-outside input{height:50px!important;border:2px solid #6F6F6F}.nas-airport-select__wrapper--label-outside .nas-airport-select__icon{bottom:6px}.nas-airport-select__wrapper--label-outside .nas-airport-select__label{font-family:NorwegianTextPro,Arial,Helvetica Neue,Helvetica,sans-serif;font-weight:700;font-size:16px;margin-bottom:6px;padding:0}.nas-airport-select__wrapper--label-outside .nas-airport-select__label+.nas-airport-select__input[type=text]{padding:0 16px}.nas-airport-select__list-section-label{font-family:NorwegianTextPro,Arial,Helvetica Neue,Helvetica,sans-serif;font-weight:700;font-size:14px;line-height:20px;position:relative;z-index:2;text-align:center;padding:3px 12px;background-color:#e9e7e4}.nas-airport-select__list-section-label:not(:first-child){margin-top:-1px}.nas-airport-select__label{font-family:NorwegianTextPro,Arial,Helvetica Neue,Helvetica,sans-serif;font-weight:700;font-size:14px;line-height:20px;display:block;position:relative;z-index:3;padding:9px 16px 0;background-color:inherit}.nas-airport-select__input{height:64px;position:relative;z-index:3;line-height:1;margin:0;background-color:transparent}.nas-airport-select__input[type=text]{padding:0 16px 9px}.nas-airport-select__input[type=text]:focus{border-bottom:none}.nas-airport-select__label+.nas-airport-select__input{height:34px;position:relative;z-index:3;line-height:1;margin:0;background-color:transparent}.nas-airport-select__label+.nas-airport-select__input[type=text]{padding:0 16px 9px}.nas-airport-select__icon{position:absolute;z-index:4;right:18px;bottom:18px}.nas-airport-select__results-wrapper{position:relative;z-index:4;perspective:1000px;margin-top:-4px}.nas-airport-select__results-wrapper--label-outside{margin-top:9px}.nas-airport-select__results{position:absolute;z-index:3;width:100%;left:0;max-height:50vh;overflow-x:hidden;overflow-y:auto;scrollbar-width:none;-webkit-overflow-scrolling:touch;border:2px solid #15273F;background-color:#fff;transform-origin:center top;transform-style:preserve-3d;-webkit-backface-visibility:hidden;backface-visibility:hidden;animation:airport-select-results .65s ease both}.nas-airport-select__dummy{position:absolute;left:-100px}.nas-airport-select__backdrop{display:block;position:fixed;z-index:2;top:0;left:0;width:100%;height:100%;color:transparent;background-color:#0b14202b;animation:airport-select-backdrop .7s ease-out both}.nas-airport-select__list-item{border-bottom:2px solid #E9E7E4}.nas-airport-select__list-item:last-child{border-bottom:0}.nas-airport-select__list-item:not(:last-of-type):after{content:\"\";display:block;width:100%;position:absolute;bottom:0;border-bottom:1px solid #E9E7E4}.nas-airport-select__geolocation--label{align-self:center;padding-left:4px}.nas-airport-select__geolocation--icon{margin:3px 3px 0}.nas-airport-select__item{display:block;position:relative;z-index:2;width:100%;text-align:left;padding:16px;margin-top:-1px;display:flex;justify-content:space-between;outline:0}.nas-airport-select__item--focus,.nas-airport-select__item:hover,.nas-airport-select__item:focus{background-color:#15273f}.nas-airport-select__item--focus,.nas-airport-select__item--focus .nas-airport-select__name,.nas-airport-select__item--focus .nas-airport-select__code,.nas-airport-select__item:hover,.nas-airport-select__item:hover .nas-airport-select__name,.nas-airport-select__item:hover .nas-airport-select__code,.nas-airport-select__item:focus,.nas-airport-select__item:focus .nas-airport-select__name,.nas-airport-select__item:focus .nas-airport-select__code{color:#fff!important}.nas-airport-select__item--disabled{border-bottom-width:0}.nas-airport-select__item--disabled,.nas-airport-select__item--disabled .nas-airport-select__name,.nas-airport-select__item--disabled .nas-airport-select__code{color:#6f6f6f!important}.nas-airport-select__item--disabled:hover,.nas-airport-select__item--disabled:focus{background-color:#fff;cursor:auto}.nas-airport-select__item--disabled:hover,.nas-airport-select__item--disabled:hover .nas-airport-select__name,.nas-airport-select__item--disabled:hover .nas-airport-select__code,.nas-airport-select__item--disabled:focus,.nas-airport-select__item--disabled:focus .nas-airport-select__name,.nas-airport-select__item--disabled:focus .nas-airport-select__code{color:#6f6f6f!important}.nas-airport-select__item--geolocation{border-bottom:2px solid #E9E7E4}.nas-airport-select__name,.nas-airport-select__code{display:inline-block;font-family:NorwegianTextPro,Arial,Helvetica Neue,Helvetica,sans-serif;font-weight:700;line-height:1;color:#15273f;margin-bottom:3px}.nas-airport-select__name--invalid,.nas-airport-select__code--invalid{margin:12px}.nas-airport-select__code{margin-left:.12em}.nas-airport-select__country{display:block;font-size:14px}.nas-airport-select__empty{font-family:NorwegianTextPro,Arial,Helvetica Neue,Helvetica,sans-serif;font-weight:700;font-size:16px;line-height:1.4;color:#15273f;margin:0;padding:12px}.nas-icon-vector,.nas-icon-vector--secondary{margin-bottom:2px}.nas-filter .nas-airport-select-combo,.nas-search-filter .nas-airport-select-combo{margin:0 3px 0 0}.nas-airport-select-combo{position:relative;display:flex;flex-direction:column;width:100%;margin:8px auto;gap:8px}.nas-airport-select-combo--inline{flex-direction:row}.nas-airport-select-combo--inline .nas-airport-select-combo__switcher{left:48%;top:14px;transform:rotate(90deg)}.nas-airport-select-combo--inline .nas-airport-select--padding-destination .nas-airport-select__label{padding:12px 24px 0}.nas-airport-select-combo--inline .nas-airport-select--padding-destination .nas-airport-select__label+.nas-airport-select__input[type=text]{padding:0 24px 12px}.nas-airport-select-combo__switcher{position:absolute;top:48px;z-index:3;left:76%;cursor:pointer;border:2px solid #6F6F6F;border-radius:50%;width:40px;height:40px;background-color:#fff;justify-content:center;align-items:center;display:flex}.nas-airport-select-combo__switcher:focus{outline:none;box-shadow:0 0 1px 2px #e9e7e4,0 0 2px 3px #7ca4cd}.nas-airport-select-combo__switcher--filled{border:2px solid #15273F}@keyframes airport-select-backdrop{0%{opacity:0}}@keyframes airport-select-results{0%{transform:rotateX(-90deg)}40%{transform:rotateX(20deg)}to{transform:rotateX(0)}}\n"] }]
|
|
2286
|
+
args: [{ selector: 'nas-airport-select', encapsulation: ViewEncapsulation.None, template: "<div *ngIf=\"exists(combo); else airportSelectTemplate\"\n [nasClass]=\"getAirportSelectComboClass('', [inlineFlex && 'inline'])\" #container>\n <ng-container *ngTemplateOutlet=\"airportSelectTemplate\"></ng-container>\n</div>\n<ng-template #airportSelectTemplate>\n <div [nasClass]=\"getClass('', exists(useSwitch) && 'padding-origin')\" *ngIf=\"airportsOrigin\">\n <nas-airport-select-dropdown #airportSelectDropdownOrigin displayLatestSearches [id]=\"outboundId\"\n [enableGeolocation]=\"displayClosestAirports\" [displayClosestAirports]=\"displayClosestAirports\"\n [airportSelectLabel]=\"labelOrigin\" [latestSearches]=\"latestSearchesOrigin\" [closestAirports]=\"closestAirports\"\n [airport]=\"origin\" [airports]=\"airportsOrigin\" [resultsLabels]=\"resultsLabels\"\n [airportSelectPlaceholder]=\"placeholderOrigin\" [open]=\"originOpen\" [keepSelection]=\"keepSelection\"\n [airportSelectIconModifier]=\"'flight-departure'\" [nasFormControlName]=\"nasFormControlNameOrigin\"\n [nasFormGroup]=\"nasFormGroup\" [ariaLabelClear]=\"ariaLabelClear\" [ariaLabelBackdrop]=\"ariaLabelBackdrop\"\n [labelOutside]=\"labelOutside\" (clearedSelection)=\"onSelectionCleared()\" (selected)=\"setSelectedOrigin($event)\"\n (openChange)=\"onOriginOpen($event)\" (focusOnNext)=\"setDestinationOpen($event)\"\n (positionChange)=\"getClosestAirports($event)\"></nas-airport-select-dropdown>\n </div>\n <ng-container *ngIf=\"exists(combo)\">\n <div [nasClass]=\"getClass('', exists(useSwitch) && 'padding-destination')\"\n *ngIf=\"airportsDestination && airportsDestination.length > 0\">\n <nas-airport-select-dropdown #airportSelectDropdownDestination displayLatestSearches [id]=\"inboundId\"\n [airportSelectLabel]=\"labelDestination\" [displayClosestAirports]=\"false\"\n [latestSearches]=\"currentLatestSearchesDestination\" [airports]=\"airportsDestination\"\n [resultsLabels]=\"resultsLabels\" [airport]=\"destination\" [airportSelectPlaceholder]=\"placeholderDestination\"\n [open]=\"destinationOpen\" [keepSelection]=\"keepSelection\" [airportSelectIconModifier]=\"'flight-arrival'\"\n [nasFormControlName]=\"nasFormControlNameDestination\" [nasFormGroup]=\"nasFormGroup\"\n [ariaLabelClear]=\"ariaLabelClear\" [ariaLabelBackdrop]=\"ariaLabelBackdrop\" [isValid]=\"isDestinationValid\"\n [invalidText]=\"invalidDestinationText\" [labelOutside]=\"labelOutside\" (clearedSelection)=\"onSelectionCleared()\"\n (selected)=\"setSelectedDestination($event)\" (openChange)=\"onDestinationOpen($event)\"\n (focusOnNext)=\"setFocusOnNext($event)\" (focusOnPrevious)=\"onOriginFocus()\"></nas-airport-select-dropdown>\n </div>\n <div *ngIf=\"exists(useSwitch) && !(originOpen || destinationOpen || cleared)\" #switchButton\n [nasClass]=\"getAirportSelectComboClass('switcher', (originAirportCodeValue && destinationAirportCodeValue) && 'filled')\"\n (mouseover)=\"changeSwitchIcon()\" (mouseleave)=\"changeSwitchIcon()\" (keydown)=\"swapKeyDown($event)\"\n (click)=\"swapAirports()\">\n <nas-icon\n [type]=\"(this.destinationAirportCodeValue && this.originAirportCodeValue) ? 'vector--secondary' : 'vector'\"></nas-icon>\n </div>\n </ng-container>\n</ng-template>", styles: ["@keyframes fade-in{0%{opacity:0}}@keyframes fade-in-down{0%{opacity:0;transform:translateY(-30px)}}@keyframes fade-in-left{0%{opacity:0;transform:translate(-30px)}}@keyframes fade-in-right{0%{opacity:0;transform:translate(30px)}}@keyframes fade-out{to{opacity:0}}@keyframes flip-in{0%{opacity:0;transform:rotateX(-90deg)}40%{opacity:1;transform:rotateX(10deg)}}@keyframes flip-out{to{opacity:0;transform:rotateX(-90deg)}}@keyframes pop-in-from-top{0%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-100,1,1);opacity:0}6.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-30.227,1,1)}13.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,1.76,1,1)}20%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,7.08,1,1)}26.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,3.838,1,1)}33.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.902,1,1);opacity:1}40%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.237,1,1)}46.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.312,1,1)}53.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.141,1,1)}60%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.021,1,1)}66.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.015,1,1)}73.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.013,1,1)}80%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,.005,1,1)}86.67%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,0,1,1)}93.33%{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.001,1,1);-webkit-transform:translate3d(0,0,0)}to{transform:matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,-.001,1,1);-webkit-transform:translate3d(0,0,0)}}.nas-airport-select{position:relative;width:100%;text-align:left}.nas-airport-select label{margin-bottom:0;height:67px}.nas-airport-select:first-child{margin-bottom:0}.nas-airport-select:only-child{max-width:360px}.nas-airport-select--expanded{z-index:30}.nas-airport-select__wrapper{position:relative;display:block;z-index:3;background-color:#fff;border:2px solid #6F6F6F}.nas-airport-select__wrapper--active{background-color:#ebf4ff;border:2px solid #15273F}.nas-airport-select__wrapper--filled{border:2px solid #15273F}.nas-airport-select__wrapper--label-outside{background-color:transparent;border:0}.nas-airport-select__wrapper--label-outside input{height:50px!important;border:2px solid #6F6F6F}.nas-airport-select__wrapper--label-outside .nas-airport-select__icon{bottom:6px}.nas-airport-select__wrapper--label-outside .nas-airport-select__label{font-family:NorwegianTextPro,Arial,Helvetica Neue,Helvetica,sans-serif;font-weight:700;font-size:16px;margin-bottom:6px;padding:0}.nas-airport-select__wrapper--label-outside .nas-airport-select__label+.nas-airport-select__input[type=text]{padding:0 16px;background-color:#fff}.nas-airport-select__wrapper--label-outside .nas-airport-select__input[type=text]:focus{background-color:#ebf4ff;border:2px solid #15273F}.nas-airport-select__list-section-label{font-family:NorwegianTextPro,Arial,Helvetica Neue,Helvetica,sans-serif;font-weight:700;font-size:14px;line-height:20px;position:relative;z-index:2;text-align:center;padding:3px 12px;background-color:#e9e7e4}.nas-airport-select__list-section-label:not(:first-child){margin-top:-1px}.nas-airport-select__label{font-family:NorwegianTextPro,Arial,Helvetica Neue,Helvetica,sans-serif;font-weight:700;font-size:14px;line-height:20px;display:block;position:relative;z-index:3;padding:9px 16px 0;background-color:inherit}.nas-airport-select__input{height:64px;position:relative;z-index:3;line-height:1;margin:0;background-color:transparent}.nas-airport-select__input[type=text]{padding:0 16px 9px}.nas-airport-select__input[type=text]:focus{border-bottom:none}.nas-airport-select__label+.nas-airport-select__input{height:34px;position:relative;z-index:3;line-height:1;margin:0;background-color:transparent}.nas-airport-select__label+.nas-airport-select__input[type=text]{padding:0 16px 9px}.nas-airport-select__icon{position:absolute;z-index:4;right:18px;bottom:18px}.nas-airport-select__results-wrapper{position:relative;z-index:4;perspective:1000px;margin-top:-4px}.nas-airport-select__results-wrapper--label-outside{margin-top:9px}.nas-airport-select__results{position:absolute;z-index:3;width:100%;left:0;max-height:50vh;overflow-x:hidden;overflow-y:auto;scrollbar-width:none;-webkit-overflow-scrolling:touch;border:2px solid #15273F;background-color:#fff;transform-origin:center top;transform-style:preserve-3d;-webkit-backface-visibility:hidden;backface-visibility:hidden;animation:airport-select-results .65s ease both}.nas-airport-select__dummy{position:absolute;left:-100px}.nas-airport-select__backdrop{display:block;position:fixed;z-index:2;top:0;left:0;width:100%;height:100%;color:transparent;background-color:#0b14202b;animation:airport-select-backdrop .7s ease-out both}.nas-airport-select__list-item{border-bottom:2px solid #E9E7E4}.nas-airport-select__list-item:last-child{border-bottom:0}.nas-airport-select__list-item:not(:last-of-type):after{content:\"\";display:block;width:100%;position:absolute;bottom:0;border-bottom:1px solid #E9E7E4}.nas-airport-select__geolocation--label{align-self:center;padding-left:4px}.nas-airport-select__geolocation--icon{margin:3px 3px 0}.nas-airport-select__item{display:block;position:relative;z-index:2;width:100%;text-align:left;padding:16px;margin-top:-1px;display:flex;justify-content:space-between;outline:0}.nas-airport-select__item--focus,.nas-airport-select__item:hover,.nas-airport-select__item:focus{background-color:#15273f}.nas-airport-select__item--focus,.nas-airport-select__item--focus .nas-airport-select__name,.nas-airport-select__item--focus .nas-airport-select__code,.nas-airport-select__item:hover,.nas-airport-select__item:hover .nas-airport-select__name,.nas-airport-select__item:hover .nas-airport-select__code,.nas-airport-select__item:focus,.nas-airport-select__item:focus .nas-airport-select__name,.nas-airport-select__item:focus .nas-airport-select__code{color:#fff!important}.nas-airport-select__item--disabled{border-bottom-width:0}.nas-airport-select__item--disabled,.nas-airport-select__item--disabled .nas-airport-select__name,.nas-airport-select__item--disabled .nas-airport-select__code{color:#6f6f6f!important}.nas-airport-select__item--disabled:hover,.nas-airport-select__item--disabled:focus{background-color:#fff;cursor:auto}.nas-airport-select__item--disabled:hover,.nas-airport-select__item--disabled:hover .nas-airport-select__name,.nas-airport-select__item--disabled:hover .nas-airport-select__code,.nas-airport-select__item--disabled:focus,.nas-airport-select__item--disabled:focus .nas-airport-select__name,.nas-airport-select__item--disabled:focus .nas-airport-select__code{color:#6f6f6f!important}.nas-airport-select__item--geolocation{border-bottom:2px solid #E9E7E4}.nas-airport-select__name,.nas-airport-select__code{display:inline-block;font-family:NorwegianTextPro,Arial,Helvetica Neue,Helvetica,sans-serif;font-weight:700;line-height:1;color:#15273f;margin-bottom:3px}.nas-airport-select__name--invalid,.nas-airport-select__code--invalid{margin:12px}.nas-airport-select__code{margin-left:.12em}.nas-airport-select__country{display:block;font-size:14px}.nas-airport-select__empty{font-family:NorwegianTextPro,Arial,Helvetica Neue,Helvetica,sans-serif;font-weight:700;font-size:16px;line-height:1.4;color:#15273f;margin:0;padding:12px}.nas-icon-vector,.nas-icon-vector--secondary{margin-bottom:2px}.nas-filter .nas-airport-select-combo,.nas-search-filter .nas-airport-select-combo{margin:0 3px 0 0}.nas-airport-select-combo{position:relative;display:flex;flex-direction:column;width:100%;margin:8px auto;gap:8px}.nas-airport-select-combo--inline{flex-direction:row}.nas-airport-select-combo--inline .nas-airport-select-combo__switcher{left:48%;top:14px;transform:rotate(90deg)}.nas-airport-select-combo--inline .nas-airport-select--padding-destination .nas-airport-select__label{padding:12px 24px 0}.nas-airport-select-combo--inline .nas-airport-select--padding-destination .nas-airport-select__label+.nas-airport-select__input[type=text]{padding:0 24px 12px}.nas-airport-select-combo__switcher{position:absolute;top:48px;z-index:3;left:76%;cursor:pointer;border:2px solid #6F6F6F;border-radius:50%;width:40px;height:40px;background-color:#fff;justify-content:center;align-items:center;display:flex}.nas-airport-select-combo__switcher:focus{outline:none;box-shadow:0 0 1px 2px #e9e7e4,0 0 2px 3px #7ca4cd}.nas-airport-select-combo__switcher--filled{border:2px solid #15273F}@keyframes airport-select-backdrop{0%{opacity:0}}@keyframes airport-select-results{0%{transform:rotateX(-90deg)}40%{transform:rotateX(20deg)}to{transform:rotateX(0)}}\n"] }]
|
|
2287
2287
|
}], ctorParameters: function () { return [{ type: DeviceHelper }, { type: i0.ChangeDetectorRef }]; }, propDecorators: { container: [{
|
|
2288
2288
|
type: ViewChild,
|
|
2289
2289
|
args: ['container']
|