@norwegian/core-components 6.53.1 → 6.54.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/assets/icons/medium/clock--light.svg +1 -1
- package/assets/icons/small/clock.svg +1 -1
- package/esm2022/lib/components/datepicker-combo-new/datepicker-combo-new.component.mjs +8 -11
- package/esm2022/lib/components/datepicker-new/datepicker-new.component.mjs +13 -12
- package/esm2022/lib/components/filter-new/filter-new.component.mjs +6 -3
- package/esm2022/lib/components/filter-new/filter-new.module.mjs +8 -4
- package/fesm2022/norwegian-core-components.mjs +24 -19
- package/fesm2022/norwegian-core-components.mjs.map +1 -1
- package/lib/components/datepicker-combo-new/datepicker-combo-new.component.d.ts +7 -1
- package/lib/components/datepicker-new/datepicker-new.component.d.ts +8 -2
- package/lib/components/filter-new/filter-new.component.d.ts +7 -1
- package/lib/components/filter-new/filter-new.module.d.ts +2 -1
- package/package.json +1 -1
|
@@ -10073,8 +10073,6 @@ class DatepickerNewComponent extends NasComponentBase {
|
|
|
10073
10073
|
this.selectedTime = this.dateService.utcDate(option.value);
|
|
10074
10074
|
this.focusOnNextChange.emit();
|
|
10075
10075
|
}
|
|
10076
|
-
onTimeSelectorClick() {
|
|
10077
|
-
}
|
|
10078
10076
|
getMainClass() {
|
|
10079
10077
|
return this.getContainerClass('', [(this.exists(this.timeOptions) && 'has-time'),
|
|
10080
10078
|
(this.exists(this.compact) && 'compact')]);
|
|
@@ -10140,12 +10138,15 @@ class DatepickerNewComponent extends NasComponentBase {
|
|
|
10140
10138
|
const modelUtcDate = new UtcDate(modelDate.getFullYear(), modelDate.getMonth(), modelDate.getDate());
|
|
10141
10139
|
return modelUtcDate;
|
|
10142
10140
|
}
|
|
10141
|
+
onOpenTime() {
|
|
10142
|
+
this.showTimes = !this.showTimes;
|
|
10143
|
+
}
|
|
10143
10144
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.5", ngImport: i0, type: DatepickerNewComponent, deps: [{ token: i1.DatePipe }, { token: DateHelper }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
10144
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.5", type: DatepickerNewComponent, selector: "nas-datepicker-new", inputs: { ariaLabelBackdrop: "ariaLabelBackdrop", disableBackdrop: "disableBackdrop", noAvailableFlightsLabel: "noAvailableFlightsLabel", availableFlightsLabel: "availableFlightsLabel", disablePastSelection: "disablePastSelection", lowerLimitDate: "lowerLimitDate", availability: "availability", availableDates: "availableDates", disabled: "disabled", placeholder: "placeholder", required: "required", ariaDescribedby: "ariaDescribedby", ariaLabel: "ariaLabel", dateDisplayFormat: "dateDisplayFormat", timeDisplayFormat: "timeDisplayFormat", locale: "locale", compact: "compact", nasFormGroup: "nasFormGroup", nasFormControlName: "nasFormControlName", times: "times", open: "open", selectedMonth: "selectedMonth", selectedDate: "selectedDate", selectedTime: "selectedTime", ariaLabelPreviousMonth: "ariaLabelPreviousMonth", ariaLabelNextMonth: "ariaLabelNextMonth" }, outputs: { selectedDateChange: "selectedDateChange", selectedMonthChange: "selectedMonthChange", openChange: "openChange", focusOnNextChange: "focusOnNextChange", focusOnPreviousChange: "focusOnPreviousChange" }, viewQueries: [{ propertyName: "input", first: true, predicate: ["input"], descendants: true }, { propertyName: "calendar", first: true, predicate: ["calendar"], descendants: true }, { propertyName: "datePickerContent", first: true, predicate: ["datePickerContent"], descendants: true }, { propertyName: "timeSelector", first: true, predicate: ["timeSelector"], descendants: true }, { propertyName: "time", first: true, predicate: ["time"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<label [nasClass]=\"getMainClass()\">\n <div [nasClass]=\"getClass('date-picker-content')\">\n <div [nasClass]=\"getClass('date-picker-wrapper')\">\n <div [nasClass]=\"getClass('controls', [show && 'active', model && 'filled'])\"\n (mousedown)=\"onMouseDownDatepicker()\">\n <div #datePickerContent\n [nasClass]=\"getLabelClass()\">\n <ng-container *ngTemplateOutlet=\"content\"></ng-container>\n </div>\n <input #input\n [nasClass]=\"getClass('date-picker')\"\n [required]=\"required\"\n [disabled]=\"disabled\"\n [attr.placeholder]=\"placeholder\"\n [attr.aria-label]=\"ariaLabel\"\n [attr.aria-describedby]=\"ariaDescribedby\"\n [attr.aria-required]=\"required\"\n [attr.aria-haspopup]=\"true\"\n (keydown.tab)=\"selectDate($event)\"\n (keydown.shift.tab)=\"onInputKeydownShiftTab($event)\"\n (keydown.enter)=\"selectDate($event)\"\n (keydown.arrowdown)=\"onCalendarKeyDown($event)\"\n (keydown.arrowleft)=\"onCalendarKeyDown($event)\"\n (keydown.arrowright)=\"onCalendarKeyDown($event)\"\n (keydown.arrowup)=\"onCalendarKeyDown($event)\"\n (focus)=\"openCalendar()\"\n [(ngModel)]=\"model\" />\n </div>\n <div [nasClass]=\"getClass('calendar-icon')\">\n <nas-icon *ngIf=\"exists(disabled); else regularIcon\"\n [icon]=\"'calendar--disabled'\"\n [ngStyle]=\"{'pointer-events': 'none'}\">\n </nas-icon>\n <ng-template #regularIcon>\n <nas-icon icon=\"calendar\"\n (click)=\"openCalendar()\">\n </nas-icon>\n </ng-template>\n </div>\n <nas-calendar-new #calendar *ngIf=\"show\"\n [nasFormGroup]=\"nasFormGroup\"\n [nasFormControlName]=\"nasFormControlName\"\n [dateDisplayFormat]=\"dateDisplayFormat\"\n [noAvailableFlightsLabel]=\"noAvailableFlightsLabel\"\n [availableFlightsLabel]=\"availableFlightsLabel\"\n [availability]=\"exists(availability)\"\n [availableDates]=\"availableDates\"\n [lowerLimitDate]=\"lowerLimitDate\"\n [disablePastSelection]=\"exists(disablePastSelection)\"\n [locale]=\"locale\"\n [ariaLabelPreviousMonth]=\"ariaLabelPreviousMonth\"\n [ariaLabelNextMonth]=\"ariaLabelNextMonth\"\n [(activeDate)]=\"activeDate\"\n [(selectedDate)]=\"selectedDate\"\n (focusOnNextChange)=\"setFocusOnTimeSelectorOrNext($event)\"\n (keydown)=\"onCalendarKeyDown($event)\"\n (monthChange)=\"onMonthChange($event)\">\n </nas-calendar-new>\n </div>\n <nas-backdrop [ariaLabelBackdrop]=\"ariaLabelBackdrop\"\n [(showBackdrop)]=\"showBackdrop\"></nas-backdrop>\n </div>\n</label>\n<div *ngIf=\"timeOptions\"\n [nasClass]=\"getClass('time-selector-wrapper')\">\n <nas-select #timeSelector\n [nasClass]=\"getClass('time-picker')\"\n [selected]=\"selectedTimeOption\"\n (selectedChange)=\"onTimeSelected($event)\"\n (keydown)=\"onTimeSelectorKeydown($event)\">\n <div [nasClass]=\"getClass('arrow')\">\n <div [nasClass]=\"getClass('icon-left')\">\n <nas-icon [type]=\"'arrow-left'\"></nas-icon>\n </div>\n </div>\n <nas-option #time *ngFor=\"let time of timeOptions\"\n [option]=\"time\"></nas-option>\n <div [nasClass]=\"getClass('arrow')\">\n <div [nasClass]=\"getClass('icon-right')\">\n <nas-icon [type]=\"'arrow-right'\"></nas-icon>\n </div>\n </div>\n </nas-select>\n</div>\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)}}:host{display:flex}.nas-datepicker-new{position:relative;top:0;left:0;width:100%;height:100%;overflow-x:visible;overflow-y:auto;-webkit-overflow-scrolling:touch;padding:12px 16px;max-height:98vh;overflow-y:visible;margin-bottom:8px}.nas-datepicker-new__time-picker{display:flex;gap:12px;justify-content:center}.nas-datepicker-new__date-picker-wrapper{position:relative}.nas-datepicker-new__date-picker-wrapper .nas-datepicker-new__date-picker{display:block;width:100%;height:35px;padding:0 16px 9px;border:0;border-radius:0;transition:all .2s cubic-bezier(0,0,.1,1);font-family:inherit;outline:0;-webkit-appearance:none;appearance:none;box-sizing:border-box;color:#15273f;font-family:Apercu,Helvetica Neue,Helvetica,Arial,sans-serif;font-weight:400;font-size:16px;line-height:26px;position:relative;z-index:3;background-color:inherit}.nas-datepicker-new__date-picker-wrapper .nas-datepicker-new__date-picker[disabled]{color:#909090;background-color:#fff}.nas-datepicker-new__date-picker-wrapper .nas-datepicker-new__date-picker:-moz-placeholder{line-height:normal}.nas-datepicker-new__date-picker-wrapper .nas-datepicker-new__date-picker::-moz-placeholder{line-height:normal}.nas-datepicker-new__date-picker-wrapper .nas-datepicker-new__date-picker:-ms-input-placeholder{line-height:normal}.nas-datepicker-new__date-picker-wrapper .nas-datepicker-new__date-picker::-webkit-input-placeholder{line-height:normal}.nas-datepicker-new__date-picker-wrapper .nas-datepicker-new__date-picker:focus~.nas-datepicker-new__input-line{border-color:#15273f}.nas-datepicker-new__date-picker-wrapper .nas-datepicker-new__date-picker--active{background-color:#ebf4ff;border-color:#15273f}.nas-datepicker-new__date-picker-wrapper .nas-datepicker-new__calendar-icon{position:relative;margin:-44px 10px 0 0;vertical-align:middle;cursor:pointer;z-index:3;float:right}.nas-datepicker-new__date-picker-wrapper .nas-datepicker-new__date-picker-label{padding:9px 16px 0;position:relative;z-index:3;color:#15273f;font-family:Apercu,Helvetica Neue,Helvetica,Arial,sans-serif;font-weight:700;font-size:14px;line-height:20px;background-color:inherit;display:flex}.nas-datepicker-new__date-picker-wrapper .nas-datepicker-new__date-picker-label--disabled{color:#909090}.nas-datepicker-new__date-picker-wrapper nas-calendar-new{position:absolute;top:75px;vertical-align:middle;right:0px;z-index:4}@media (min-width: 640px){.nas-datepicker-new__date-picker-wrapper nas-calendar-new{right:-15px}}.nas-datepicker-new__date-picker-wrapper .nas-datepicker-new__controls{border:2px solid #6f6f6f;background-color:#fff}.nas-datepicker-new__date-picker-wrapper .nas-datepicker-new__controls--active{background-color:#ebf4ff;border-color:#15273f}.nas-datepicker-new__date-picker-wrapper .nas-datepicker-new__controls--filled{border-color:#15273f}.nas-datepicker-new__time-selector-wrapper nas-select{display:flex}.nas-datepicker-new__time-selector-wrapper nas-select ::ng-deep .nas-select{margin-bottom:0;margin-left:3px}.nas-datepicker-new__time-selector-wrapper nas-select ::ng-deep .nas-select:after{bottom:26px}.nas-datepicker-new__time-selector-wrapper nas-select ::ng-deep .nas-select select{border:3px solid #fff;background-color:#fff;height:64px}@media all and (-ms-high-contrast: none),(-ms-high-contrast: active){.nas-datepicker-new__time-selector-wrapper nas-select ::ng-deep .nas-select select{height:60px}}.nas-datepicker-new__time-selector-wrapper nas-select ::ng-deep .nas-select select:focus{border-color:#15273f}.nas-datepicker-new--has-time{padding-right:3px}.nas-datepicker-new nas-spinner{position:absolute;top:300px;left:45%;right:45%}.nas-datepicker-new__backdrop{display:block;position:fixed;z-index:2;top:0;left:0;width:100%;height:100%;color:transparent;background-color:#0b14202b;animation:datepicker-backdrop .7s ease-out both}.nas-datepicker-new--compact{padding:0;margin-bottom:6px}@keyframes datepicker-backdrop{0%{opacity:0}}\n"], dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { 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: "component", type: SelectComponent, selector: "nas-select", inputs: ["id", "inline", "label", "block", "spaceless", "stretch", "compact", "simple", "light", "fill", "error", "errorMessage", "disabled", "autogrow", "cssClass", "nasFormControlName", "nasFormGroup", "options", "selectedValue", "selected"], outputs: ["selectedChange", "keydown"] }, { kind: "component", type: OptionComponent, selector: "nas-option", inputs: ["option"] }, { kind: "component", type: IconComponent, selector: "nas-icon", inputs: ["icon", "type", "isIndicator", "lightCircularBackground", "cssClass"] }, { kind: "directive", type: NasClassDirective, selector: "[nasClass]", inputs: ["nasClass", "attr.class"] }, { kind: "directive", type: i3$1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i3$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3$1.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i3$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: BackdropComponent, selector: "nas-backdrop", inputs: ["showBackdrop", "ariaLabelBackdrop"], outputs: ["showBackdropChange"] }, { kind: "component", type: CalendarNewComponent, selector: "nas-calendar-new", inputs: ["noAvailableFlightsLabel", "availableFlightsLabel", "disablePastSelection", "lowerLimitDate", "date", "weekStart", "displayWeekNumbers", "availability", "locale", "availableDates", "activeDate", "selectedDate", "nasFormGroup", "nasFormControlName", "dateDisplayFormat", "ariaLabelPreviousMonth", "ariaLabelNextMonth"], outputs: ["monthChange", "focusOnNextChange", "selectedDateChange", "activeDateChange"] }], encapsulation: i0.ViewEncapsulation.None }); }
|
|
10145
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.5", type: DatepickerNewComponent, selector: "nas-datepicker-new", inputs: { ariaLabelBackdrop: "ariaLabelBackdrop", disableBackdrop: "disableBackdrop", noAvailableFlightsLabel: "noAvailableFlightsLabel", availableFlightsLabel: "availableFlightsLabel", disablePastSelection: "disablePastSelection", lowerLimitDate: "lowerLimitDate", availability: "availability", availableDates: "availableDates", disabled: "disabled", placeholder: "placeholder", required: "required", ariaDescribedby: "ariaDescribedby", ariaLabel: "ariaLabel", dateDisplayFormat: "dateDisplayFormat", timeDisplayFormat: "timeDisplayFormat", locale: "locale", compact: "compact", nasFormGroup: "nasFormGroup", nasFormControlName: "nasFormControlName", times: "times", open: "open", selectedMonth: "selectedMonth", selectedDate: "selectedDate", selectedTime: "selectedTime", ariaLabelPreviousMonth: "ariaLabelPreviousMonth", ariaLabelNextMonth: "ariaLabelNextMonth", timepickerLabel: "timepickerLabel" }, outputs: { selectedDateChange: "selectedDateChange", selectedMonthChange: "selectedMonthChange", openChange: "openChange", focusOnNextChange: "focusOnNextChange", focusOnPreviousChange: "focusOnPreviousChange" }, viewQueries: [{ propertyName: "input", first: true, predicate: ["input"], descendants: true }, { propertyName: "calendar", first: true, predicate: ["calendar"], descendants: true }, { propertyName: "datePickerContent", first: true, predicate: ["datePickerContent"], descendants: true }, { propertyName: "timeSelector", first: true, predicate: ["timeSelector"], descendants: true }, { propertyName: "time", first: true, predicate: ["time"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<label [nasClass]=\"getMainClass()\">\n <div [nasClass]=\"getClass('date-picker-content')\">\n <div [nasClass]=\"getClass('date-picker-wrapper')\">\n <div [nasClass]=\"getClass('controls', [show && 'active', model && 'filled'])\"\n (mousedown)=\"onMouseDownDatepicker()\">\n <div #datePickerContent\n [nasClass]=\"getLabelClass()\">\n <ng-container *ngTemplateOutlet=\"content\"></ng-container>\n </div>\n <input #input\n [nasClass]=\"getClass('date-picker')\"\n [required]=\"required\"\n [disabled]=\"disabled\"\n [attr.placeholder]=\"placeholder\"\n [attr.aria-label]=\"ariaLabel\"\n [attr.aria-describedby]=\"ariaDescribedby\"\n [attr.aria-required]=\"required\"\n [attr.aria-haspopup]=\"true\"\n (keydown.tab)=\"selectDate($event)\"\n (keydown.shift.tab)=\"onInputKeydownShiftTab($event)\"\n (keydown.enter)=\"selectDate($event)\"\n (keydown.arrowdown)=\"onCalendarKeyDown($event)\"\n (keydown.arrowleft)=\"onCalendarKeyDown($event)\"\n (keydown.arrowright)=\"onCalendarKeyDown($event)\"\n (keydown.arrowup)=\"onCalendarKeyDown($event)\"\n (focus)=\"openCalendar()\"\n [(ngModel)]=\"model\" />\n </div>\n <div [nasClass]=\"getClass('calendar-icon')\">\n <nas-icon *ngIf=\"exists(disabled); else regularIcon\"\n [icon]=\"'calendar--disabled'\"\n [ngStyle]=\"{'pointer-events': 'none'}\">\n </nas-icon>\n <ng-template #regularIcon>\n <nas-icon icon=\"calendar\"\n (click)=\"openCalendar()\">\n </nas-icon>\n </ng-template>\n </div>\n <nas-calendar-new #calendar *ngIf=\"show\"\n [nasFormGroup]=\"nasFormGroup\"\n [nasFormControlName]=\"nasFormControlName\"\n [dateDisplayFormat]=\"dateDisplayFormat\"\n [noAvailableFlightsLabel]=\"noAvailableFlightsLabel\"\n [availableFlightsLabel]=\"availableFlightsLabel\"\n [availability]=\"exists(availability)\"\n [availableDates]=\"availableDates\"\n [lowerLimitDate]=\"lowerLimitDate\"\n [disablePastSelection]=\"exists(disablePastSelection)\"\n [locale]=\"locale\"\n [ariaLabelPreviousMonth]=\"ariaLabelPreviousMonth\"\n [ariaLabelNextMonth]=\"ariaLabelNextMonth\"\n [(activeDate)]=\"activeDate\"\n [(selectedDate)]=\"selectedDate\"\n (focusOnNextChange)=\"setFocusOnTimeSelectorOrNext($event)\"\n (keydown)=\"onCalendarKeyDown($event)\"\n (monthChange)=\"onMonthChange($event)\">\n </nas-calendar-new>\n </div>\n <nas-backdrop [ariaLabelBackdrop]=\"ariaLabelBackdrop\"\n [(showBackdrop)]=\"showBackdrop\"></nas-backdrop>\n </div>\n</label>\n<div *ngIf=\"timeOptions\" [nasClass]=\"getClass('time-selector-wrapper')\">\n <nas-backdrop [ariaLabelBackdrop]=\"ariaLabelBackdrop\"\n [(showBackdrop)]=\"showTimes\"></nas-backdrop>\n <button #timeSelector [nasClass]=\"getClass('time-picker', showTimes && 'active')\" (click)=\"onOpenTime()\">\n <div [nasClass]=\"getClass('time-details')\">\n <p *ngIf=\"timepickerLabel\" [nasClass]=\"getClass('time-details', 'label')\">{{timepickerLabel}}</p>\n <p #timeSelector [nasClass]=\"getClass('time-details--time')\">{{selectedTimeOption?.title}}</p>\n </div>\n <div *ngIf=\"showTimes\" [nasClass]=\"getClass('times-wrapper')\">\n <span *ngFor=\"let time of timeOptions\" [nasClass]=\"getClass('span')\" (click)=\"onTimeSelected(time)\" #time>{{time?.title}}</span>\n </div>\n </button>\n</div>\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)}}:host{display:flex}.nas-datepicker-new{position:relative;top:0;left:0;width:100%;height:100%;overflow-x:visible;overflow-y:auto;-webkit-overflow-scrolling:touch;padding:12px 16px;max-height:98vh;overflow-y:visible;margin-bottom:8px}.nas-datepicker-new__date-picker-wrapper{position:relative}.nas-datepicker-new__date-picker-wrapper .nas-datepicker-new__date-picker{display:block;width:100%;height:35px;padding:0 16px 9px;border:0;border-radius:0;transition:all .2s cubic-bezier(0,0,.1,1);font-family:inherit;outline:0;-webkit-appearance:none;appearance:none;box-sizing:border-box;color:#15273f;font-family:Apercu,Helvetica Neue,Helvetica,Arial,sans-serif;font-weight:400;font-size:16px;line-height:26px;position:relative;z-index:3;background-color:inherit}.nas-datepicker-new__date-picker-wrapper .nas-datepicker-new__date-picker[disabled]{color:#909090;background-color:#fff}.nas-datepicker-new__date-picker-wrapper .nas-datepicker-new__date-picker:-moz-placeholder{line-height:normal}.nas-datepicker-new__date-picker-wrapper .nas-datepicker-new__date-picker::-moz-placeholder{line-height:normal}.nas-datepicker-new__date-picker-wrapper .nas-datepicker-new__date-picker:-ms-input-placeholder{line-height:normal}.nas-datepicker-new__date-picker-wrapper .nas-datepicker-new__date-picker::-webkit-input-placeholder{line-height:normal}.nas-datepicker-new__date-picker-wrapper .nas-datepicker-new__date-picker:focus~.nas-datepicker-new__input-line{border-color:#15273f}.nas-datepicker-new__date-picker-wrapper .nas-datepicker-new__date-picker--active{background-color:#ebf4ff;border-color:#15273f}.nas-datepicker-new__date-picker-wrapper .nas-datepicker-new__calendar-icon{position:relative;margin:-44px 10px 0 0;vertical-align:middle;cursor:pointer;z-index:3;float:right}.nas-datepicker-new__date-picker-wrapper .nas-datepicker-new__date-picker-label{padding:9px 16px 0;position:relative;z-index:3;color:#15273f;font-family:Apercu,Helvetica Neue,Helvetica,Arial,sans-serif;font-weight:700;font-size:14px;line-height:20px;background-color:inherit;display:flex}.nas-datepicker-new__date-picker-wrapper .nas-datepicker-new__date-picker-label--disabled{color:#909090}.nas-datepicker-new__date-picker-wrapper nas-calendar-new{position:absolute;top:75px;vertical-align:middle;right:0px;z-index:4}@media (min-width: 640px){.nas-datepicker-new__date-picker-wrapper nas-calendar-new{right:-15px}}.nas-datepicker-new__date-picker-wrapper .nas-datepicker-new__controls{border:2px solid #6f6f6f;background-color:#fff}.nas-datepicker-new__date-picker-wrapper .nas-datepicker-new__controls--active{background-color:#ebf4ff;border-color:#15273f}.nas-datepicker-new__date-picker-wrapper .nas-datepicker-new__controls--filled{border-color:#15273f}.nas-datepicker-new__times-wrapper{display:flex;flex-direction:column;border-left:2px solid #15273f;border-right:2px solid #15273f;border-bottom:2px solid #15273f;position:absolute;width:140px;top:66px;left:-2px;z-index:4;overflow-y:scroll;scrollbar-width:none;max-height:320px}.nas-datepicker-new__span{padding:12px 16px;text-align:left;background-color:#fff;font-weight:700}.nas-datepicker-new__span:not(:first-child){border-top:2px solid #e3e3e3}.nas-datepicker-new__time-selector-wrapper-new{padding:0 0 8px 8px;position:relative}.nas-datepicker-new__time-details{padding:9px 0 0 16px;text-align:left}.nas-datepicker-new__time-details p{margin:0}.nas-datepicker-new__time-details--label{padding:0;font-weight:700;font-size:14px;line-height:20px}.nas-datepicker-new__time-picker{position:relative;display:flex;border:2px solid #15273f;background-color:#fff;height:68px;width:140px}.nas-datepicker-new__time-picker:after{content:\"\";position:absolute;display:inline-block;pointer-events:none;z-index:3;bottom:18px;right:12px;width:24px;height:24px;background:url(\"data:image/svg+xml,%3Csvg xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22 width%3D%2224%22 height%3D%2224%22 viewBox%3D%220 0 24 24%22 fill%3D%22none%22%3E%3Cpath fill-rule%3D%22evenodd%22 clip-rule%3D%22evenodd%22 d%3D%22M3 12C3 7.02944 7.02944 3 12 3C16.9706 3 21 7.02944 21 12C21 16.9706 16.9706 21 12 21C7.02944 21 3 16.9706 3 12ZM12 1C5.92487 1 1 5.92487 1 12C1 18.0751 5.92487 23 12 23C18.0751 23 23 18.0751 23 12C23 5.92487 18.0751 1 12 1ZM13 6C13 5.44772 12.5523 5 12 5C11.4477 5 11 5.44772 11 6V12C11 12.3788 11.214 12.725 11.5528 12.8944L15.5528 14.8944C16.0468 15.1414 16.6474 14.9412 16.8944 14.4472C17.1414 13.9532 16.9412 13.3526 16.4472 13.1056L13 11.382V6Z%22 fill%3D%22%2315273F%22%2F%3E%3C%2Fsvg%3E\") 0 0 no-repeat}.nas-datepicker-new__time-picker--active{background-color:#ebf4ff}.nas-datepicker-new__time-selector-wrapper nas-select{display:flex}.nas-datepicker-new__time-selector-wrapper nas-select ::ng-deep .nas-select{margin-bottom:0;margin-left:3px}.nas-datepicker-new__time-selector-wrapper nas-select ::ng-deep .nas-select:after{bottom:26px}.nas-datepicker-new__time-selector-wrapper nas-select ::ng-deep .nas-select select{border:3px solid #fff;background-color:#fff;height:64px}@media all and (-ms-high-contrast: none),(-ms-high-contrast: active){.nas-datepicker-new__time-selector-wrapper nas-select ::ng-deep .nas-select select{height:60px}}.nas-datepicker-new__time-selector-wrapper nas-select ::ng-deep .nas-select select:focus{border-color:#15273f}.nas-datepicker-new--has-time{padding-right:3px}.nas-datepicker-new nas-spinner{position:absolute;top:300px;left:45%;right:45%}.nas-datepicker-new__backdrop{display:block;position:fixed;z-index:2;top:0;left:0;width:100%;height:100%;color:transparent;background-color:#0b14202b;animation:datepicker-backdrop .7s ease-out both}.nas-datepicker-new__backdrop{display:block;position:fixed;z-index:2;top:0;left:0;width:100%;height:100%;color:transparent;background-color:#0b14202b;animation:timepicker-backdrop .7s ease-out both}.nas-datepicker-new--compact{padding:0;margin-bottom:6px}@keyframes datepicker-backdrop{0%{opacity:0}}@keyframes timepicker-backdrop{0%{opacity:0}}\n"], dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { 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: "component", type: IconComponent, selector: "nas-icon", inputs: ["icon", "type", "isIndicator", "lightCircularBackground", "cssClass"] }, { kind: "directive", type: NasClassDirective, selector: "[nasClass]", inputs: ["nasClass", "attr.class"] }, { kind: "directive", type: i3$1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i3$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3$1.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i3$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: BackdropComponent, selector: "nas-backdrop", inputs: ["showBackdrop", "ariaLabelBackdrop"], outputs: ["showBackdropChange"] }, { kind: "component", type: CalendarNewComponent, selector: "nas-calendar-new", inputs: ["noAvailableFlightsLabel", "availableFlightsLabel", "disablePastSelection", "lowerLimitDate", "date", "weekStart", "displayWeekNumbers", "availability", "locale", "availableDates", "activeDate", "selectedDate", "nasFormGroup", "nasFormControlName", "dateDisplayFormat", "ariaLabelPreviousMonth", "ariaLabelNextMonth"], outputs: ["monthChange", "focusOnNextChange", "selectedDateChange", "activeDateChange"] }], encapsulation: i0.ViewEncapsulation.None }); }
|
|
10145
10146
|
}
|
|
10146
10147
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.5", ngImport: i0, type: DatepickerNewComponent, decorators: [{
|
|
10147
10148
|
type: Component,
|
|
10148
|
-
args: [{ selector: 'nas-datepicker-new', encapsulation: ViewEncapsulation.None, template: "<label [nasClass]=\"getMainClass()\">\n <div [nasClass]=\"getClass('date-picker-content')\">\n <div [nasClass]=\"getClass('date-picker-wrapper')\">\n <div [nasClass]=\"getClass('controls', [show && 'active', model && 'filled'])\"\n (mousedown)=\"onMouseDownDatepicker()\">\n <div #datePickerContent\n [nasClass]=\"getLabelClass()\">\n <ng-container *ngTemplateOutlet=\"content\"></ng-container>\n </div>\n <input #input\n [nasClass]=\"getClass('date-picker')\"\n [required]=\"required\"\n [disabled]=\"disabled\"\n [attr.placeholder]=\"placeholder\"\n [attr.aria-label]=\"ariaLabel\"\n [attr.aria-describedby]=\"ariaDescribedby\"\n [attr.aria-required]=\"required\"\n [attr.aria-haspopup]=\"true\"\n (keydown.tab)=\"selectDate($event)\"\n (keydown.shift.tab)=\"onInputKeydownShiftTab($event)\"\n (keydown.enter)=\"selectDate($event)\"\n (keydown.arrowdown)=\"onCalendarKeyDown($event)\"\n (keydown.arrowleft)=\"onCalendarKeyDown($event)\"\n (keydown.arrowright)=\"onCalendarKeyDown($event)\"\n (keydown.arrowup)=\"onCalendarKeyDown($event)\"\n (focus)=\"openCalendar()\"\n [(ngModel)]=\"model\" />\n </div>\n <div [nasClass]=\"getClass('calendar-icon')\">\n <nas-icon *ngIf=\"exists(disabled); else regularIcon\"\n [icon]=\"'calendar--disabled'\"\n [ngStyle]=\"{'pointer-events': 'none'}\">\n </nas-icon>\n <ng-template #regularIcon>\n <nas-icon icon=\"calendar\"\n (click)=\"openCalendar()\">\n </nas-icon>\n </ng-template>\n </div>\n <nas-calendar-new #calendar *ngIf=\"show\"\n [nasFormGroup]=\"nasFormGroup\"\n [nasFormControlName]=\"nasFormControlName\"\n [dateDisplayFormat]=\"dateDisplayFormat\"\n [noAvailableFlightsLabel]=\"noAvailableFlightsLabel\"\n [availableFlightsLabel]=\"availableFlightsLabel\"\n [availability]=\"exists(availability)\"\n [availableDates]=\"availableDates\"\n [lowerLimitDate]=\"lowerLimitDate\"\n [disablePastSelection]=\"exists(disablePastSelection)\"\n [locale]=\"locale\"\n [ariaLabelPreviousMonth]=\"ariaLabelPreviousMonth\"\n [ariaLabelNextMonth]=\"ariaLabelNextMonth\"\n [(activeDate)]=\"activeDate\"\n [(selectedDate)]=\"selectedDate\"\n (focusOnNextChange)=\"setFocusOnTimeSelectorOrNext($event)\"\n (keydown)=\"onCalendarKeyDown($event)\"\n (monthChange)=\"onMonthChange($event)\">\n </nas-calendar-new>\n </div>\n <nas-backdrop [ariaLabelBackdrop]=\"ariaLabelBackdrop\"\n [(showBackdrop)]=\"showBackdrop\"></nas-backdrop>\n </div>\n</label>\n<div *ngIf=\"timeOptions\"\n [nasClass]=\"getClass('time-selector-wrapper')\">\n <nas-select #timeSelector\n [nasClass]=\"getClass('time-picker')\"\n [selected]=\"selectedTimeOption\"\n (selectedChange)=\"onTimeSelected($event)\"\n (keydown)=\"onTimeSelectorKeydown($event)\">\n <div [nasClass]=\"getClass('arrow')\">\n <div [nasClass]=\"getClass('icon-left')\">\n <nas-icon [type]=\"'arrow-left'\"></nas-icon>\n </div>\n </div>\n <nas-option #time *ngFor=\"let time of timeOptions\"\n [option]=\"time\"></nas-option>\n <div [nasClass]=\"getClass('arrow')\">\n <div [nasClass]=\"getClass('icon-right')\">\n <nas-icon [type]=\"'arrow-right'\"></nas-icon>\n </div>\n </div>\n </nas-select>\n</div>\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)}}:host{display:flex}.nas-datepicker-new{position:relative;top:0;left:0;width:100%;height:100%;overflow-x:visible;overflow-y:auto;-webkit-overflow-scrolling:touch;padding:12px 16px;max-height:98vh;overflow-y:visible;margin-bottom:8px}.nas-datepicker-new__time-picker{display:flex;gap:12px;justify-content:center}.nas-datepicker-new__date-picker-wrapper{position:relative}.nas-datepicker-new__date-picker-wrapper .nas-datepicker-new__date-picker{display:block;width:100%;height:35px;padding:0 16px 9px;border:0;border-radius:0;transition:all .2s cubic-bezier(0,0,.1,1);font-family:inherit;outline:0;-webkit-appearance:none;appearance:none;box-sizing:border-box;color:#15273f;font-family:Apercu,Helvetica Neue,Helvetica,Arial,sans-serif;font-weight:400;font-size:16px;line-height:26px;position:relative;z-index:3;background-color:inherit}.nas-datepicker-new__date-picker-wrapper .nas-datepicker-new__date-picker[disabled]{color:#909090;background-color:#fff}.nas-datepicker-new__date-picker-wrapper .nas-datepicker-new__date-picker:-moz-placeholder{line-height:normal}.nas-datepicker-new__date-picker-wrapper .nas-datepicker-new__date-picker::-moz-placeholder{line-height:normal}.nas-datepicker-new__date-picker-wrapper .nas-datepicker-new__date-picker:-ms-input-placeholder{line-height:normal}.nas-datepicker-new__date-picker-wrapper .nas-datepicker-new__date-picker::-webkit-input-placeholder{line-height:normal}.nas-datepicker-new__date-picker-wrapper .nas-datepicker-new__date-picker:focus~.nas-datepicker-new__input-line{border-color:#15273f}.nas-datepicker-new__date-picker-wrapper .nas-datepicker-new__date-picker--active{background-color:#ebf4ff;border-color:#15273f}.nas-datepicker-new__date-picker-wrapper .nas-datepicker-new__calendar-icon{position:relative;margin:-44px 10px 0 0;vertical-align:middle;cursor:pointer;z-index:3;float:right}.nas-datepicker-new__date-picker-wrapper .nas-datepicker-new__date-picker-label{padding:9px 16px 0;position:relative;z-index:3;color:#15273f;font-family:Apercu,Helvetica Neue,Helvetica,Arial,sans-serif;font-weight:700;font-size:14px;line-height:20px;background-color:inherit;display:flex}.nas-datepicker-new__date-picker-wrapper .nas-datepicker-new__date-picker-label--disabled{color:#909090}.nas-datepicker-new__date-picker-wrapper nas-calendar-new{position:absolute;top:75px;vertical-align:middle;right:0px;z-index:4}@media (min-width: 640px){.nas-datepicker-new__date-picker-wrapper nas-calendar-new{right:-15px}}.nas-datepicker-new__date-picker-wrapper .nas-datepicker-new__controls{border:2px solid #6f6f6f;background-color:#fff}.nas-datepicker-new__date-picker-wrapper .nas-datepicker-new__controls--active{background-color:#ebf4ff;border-color:#15273f}.nas-datepicker-new__date-picker-wrapper .nas-datepicker-new__controls--filled{border-color:#15273f}.nas-datepicker-new__time-selector-wrapper nas-select{display:flex}.nas-datepicker-new__time-selector-wrapper nas-select ::ng-deep .nas-select{margin-bottom:0;margin-left:3px}.nas-datepicker-new__time-selector-wrapper nas-select ::ng-deep .nas-select:after{bottom:26px}.nas-datepicker-new__time-selector-wrapper nas-select ::ng-deep .nas-select select{border:3px solid #fff;background-color:#fff;height:64px}@media all and (-ms-high-contrast: none),(-ms-high-contrast: active){.nas-datepicker-new__time-selector-wrapper nas-select ::ng-deep .nas-select select{height:60px}}.nas-datepicker-new__time-selector-wrapper nas-select ::ng-deep .nas-select select:focus{border-color:#15273f}.nas-datepicker-new--has-time{padding-right:3px}.nas-datepicker-new nas-spinner{position:absolute;top:300px;left:45%;right:45%}.nas-datepicker-new__backdrop{display:block;position:fixed;z-index:2;top:0;left:0;width:100%;height:100%;color:transparent;background-color:#0b14202b;animation:datepicker-backdrop .7s ease-out both}.nas-datepicker-new--compact{padding:0;margin-bottom:6px}@keyframes datepicker-backdrop{0%{opacity:0}}\n"] }]
|
|
10149
|
+
args: [{ selector: 'nas-datepicker-new', encapsulation: ViewEncapsulation.None, template: "<label [nasClass]=\"getMainClass()\">\n <div [nasClass]=\"getClass('date-picker-content')\">\n <div [nasClass]=\"getClass('date-picker-wrapper')\">\n <div [nasClass]=\"getClass('controls', [show && 'active', model && 'filled'])\"\n (mousedown)=\"onMouseDownDatepicker()\">\n <div #datePickerContent\n [nasClass]=\"getLabelClass()\">\n <ng-container *ngTemplateOutlet=\"content\"></ng-container>\n </div>\n <input #input\n [nasClass]=\"getClass('date-picker')\"\n [required]=\"required\"\n [disabled]=\"disabled\"\n [attr.placeholder]=\"placeholder\"\n [attr.aria-label]=\"ariaLabel\"\n [attr.aria-describedby]=\"ariaDescribedby\"\n [attr.aria-required]=\"required\"\n [attr.aria-haspopup]=\"true\"\n (keydown.tab)=\"selectDate($event)\"\n (keydown.shift.tab)=\"onInputKeydownShiftTab($event)\"\n (keydown.enter)=\"selectDate($event)\"\n (keydown.arrowdown)=\"onCalendarKeyDown($event)\"\n (keydown.arrowleft)=\"onCalendarKeyDown($event)\"\n (keydown.arrowright)=\"onCalendarKeyDown($event)\"\n (keydown.arrowup)=\"onCalendarKeyDown($event)\"\n (focus)=\"openCalendar()\"\n [(ngModel)]=\"model\" />\n </div>\n <div [nasClass]=\"getClass('calendar-icon')\">\n <nas-icon *ngIf=\"exists(disabled); else regularIcon\"\n [icon]=\"'calendar--disabled'\"\n [ngStyle]=\"{'pointer-events': 'none'}\">\n </nas-icon>\n <ng-template #regularIcon>\n <nas-icon icon=\"calendar\"\n (click)=\"openCalendar()\">\n </nas-icon>\n </ng-template>\n </div>\n <nas-calendar-new #calendar *ngIf=\"show\"\n [nasFormGroup]=\"nasFormGroup\"\n [nasFormControlName]=\"nasFormControlName\"\n [dateDisplayFormat]=\"dateDisplayFormat\"\n [noAvailableFlightsLabel]=\"noAvailableFlightsLabel\"\n [availableFlightsLabel]=\"availableFlightsLabel\"\n [availability]=\"exists(availability)\"\n [availableDates]=\"availableDates\"\n [lowerLimitDate]=\"lowerLimitDate\"\n [disablePastSelection]=\"exists(disablePastSelection)\"\n [locale]=\"locale\"\n [ariaLabelPreviousMonth]=\"ariaLabelPreviousMonth\"\n [ariaLabelNextMonth]=\"ariaLabelNextMonth\"\n [(activeDate)]=\"activeDate\"\n [(selectedDate)]=\"selectedDate\"\n (focusOnNextChange)=\"setFocusOnTimeSelectorOrNext($event)\"\n (keydown)=\"onCalendarKeyDown($event)\"\n (monthChange)=\"onMonthChange($event)\">\n </nas-calendar-new>\n </div>\n <nas-backdrop [ariaLabelBackdrop]=\"ariaLabelBackdrop\"\n [(showBackdrop)]=\"showBackdrop\"></nas-backdrop>\n </div>\n</label>\n<div *ngIf=\"timeOptions\" [nasClass]=\"getClass('time-selector-wrapper')\">\n <nas-backdrop [ariaLabelBackdrop]=\"ariaLabelBackdrop\"\n [(showBackdrop)]=\"showTimes\"></nas-backdrop>\n <button #timeSelector [nasClass]=\"getClass('time-picker', showTimes && 'active')\" (click)=\"onOpenTime()\">\n <div [nasClass]=\"getClass('time-details')\">\n <p *ngIf=\"timepickerLabel\" [nasClass]=\"getClass('time-details', 'label')\">{{timepickerLabel}}</p>\n <p #timeSelector [nasClass]=\"getClass('time-details--time')\">{{selectedTimeOption?.title}}</p>\n </div>\n <div *ngIf=\"showTimes\" [nasClass]=\"getClass('times-wrapper')\">\n <span *ngFor=\"let time of timeOptions\" [nasClass]=\"getClass('span')\" (click)=\"onTimeSelected(time)\" #time>{{time?.title}}</span>\n </div>\n </button>\n</div>\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)}}:host{display:flex}.nas-datepicker-new{position:relative;top:0;left:0;width:100%;height:100%;overflow-x:visible;overflow-y:auto;-webkit-overflow-scrolling:touch;padding:12px 16px;max-height:98vh;overflow-y:visible;margin-bottom:8px}.nas-datepicker-new__date-picker-wrapper{position:relative}.nas-datepicker-new__date-picker-wrapper .nas-datepicker-new__date-picker{display:block;width:100%;height:35px;padding:0 16px 9px;border:0;border-radius:0;transition:all .2s cubic-bezier(0,0,.1,1);font-family:inherit;outline:0;-webkit-appearance:none;appearance:none;box-sizing:border-box;color:#15273f;font-family:Apercu,Helvetica Neue,Helvetica,Arial,sans-serif;font-weight:400;font-size:16px;line-height:26px;position:relative;z-index:3;background-color:inherit}.nas-datepicker-new__date-picker-wrapper .nas-datepicker-new__date-picker[disabled]{color:#909090;background-color:#fff}.nas-datepicker-new__date-picker-wrapper .nas-datepicker-new__date-picker:-moz-placeholder{line-height:normal}.nas-datepicker-new__date-picker-wrapper .nas-datepicker-new__date-picker::-moz-placeholder{line-height:normal}.nas-datepicker-new__date-picker-wrapper .nas-datepicker-new__date-picker:-ms-input-placeholder{line-height:normal}.nas-datepicker-new__date-picker-wrapper .nas-datepicker-new__date-picker::-webkit-input-placeholder{line-height:normal}.nas-datepicker-new__date-picker-wrapper .nas-datepicker-new__date-picker:focus~.nas-datepicker-new__input-line{border-color:#15273f}.nas-datepicker-new__date-picker-wrapper .nas-datepicker-new__date-picker--active{background-color:#ebf4ff;border-color:#15273f}.nas-datepicker-new__date-picker-wrapper .nas-datepicker-new__calendar-icon{position:relative;margin:-44px 10px 0 0;vertical-align:middle;cursor:pointer;z-index:3;float:right}.nas-datepicker-new__date-picker-wrapper .nas-datepicker-new__date-picker-label{padding:9px 16px 0;position:relative;z-index:3;color:#15273f;font-family:Apercu,Helvetica Neue,Helvetica,Arial,sans-serif;font-weight:700;font-size:14px;line-height:20px;background-color:inherit;display:flex}.nas-datepicker-new__date-picker-wrapper .nas-datepicker-new__date-picker-label--disabled{color:#909090}.nas-datepicker-new__date-picker-wrapper nas-calendar-new{position:absolute;top:75px;vertical-align:middle;right:0px;z-index:4}@media (min-width: 640px){.nas-datepicker-new__date-picker-wrapper nas-calendar-new{right:-15px}}.nas-datepicker-new__date-picker-wrapper .nas-datepicker-new__controls{border:2px solid #6f6f6f;background-color:#fff}.nas-datepicker-new__date-picker-wrapper .nas-datepicker-new__controls--active{background-color:#ebf4ff;border-color:#15273f}.nas-datepicker-new__date-picker-wrapper .nas-datepicker-new__controls--filled{border-color:#15273f}.nas-datepicker-new__times-wrapper{display:flex;flex-direction:column;border-left:2px solid #15273f;border-right:2px solid #15273f;border-bottom:2px solid #15273f;position:absolute;width:140px;top:66px;left:-2px;z-index:4;overflow-y:scroll;scrollbar-width:none;max-height:320px}.nas-datepicker-new__span{padding:12px 16px;text-align:left;background-color:#fff;font-weight:700}.nas-datepicker-new__span:not(:first-child){border-top:2px solid #e3e3e3}.nas-datepicker-new__time-selector-wrapper-new{padding:0 0 8px 8px;position:relative}.nas-datepicker-new__time-details{padding:9px 0 0 16px;text-align:left}.nas-datepicker-new__time-details p{margin:0}.nas-datepicker-new__time-details--label{padding:0;font-weight:700;font-size:14px;line-height:20px}.nas-datepicker-new__time-picker{position:relative;display:flex;border:2px solid #15273f;background-color:#fff;height:68px;width:140px}.nas-datepicker-new__time-picker:after{content:\"\";position:absolute;display:inline-block;pointer-events:none;z-index:3;bottom:18px;right:12px;width:24px;height:24px;background:url(\"data:image/svg+xml,%3Csvg xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22 width%3D%2224%22 height%3D%2224%22 viewBox%3D%220 0 24 24%22 fill%3D%22none%22%3E%3Cpath fill-rule%3D%22evenodd%22 clip-rule%3D%22evenodd%22 d%3D%22M3 12C3 7.02944 7.02944 3 12 3C16.9706 3 21 7.02944 21 12C21 16.9706 16.9706 21 12 21C7.02944 21 3 16.9706 3 12ZM12 1C5.92487 1 1 5.92487 1 12C1 18.0751 5.92487 23 12 23C18.0751 23 23 18.0751 23 12C23 5.92487 18.0751 1 12 1ZM13 6C13 5.44772 12.5523 5 12 5C11.4477 5 11 5.44772 11 6V12C11 12.3788 11.214 12.725 11.5528 12.8944L15.5528 14.8944C16.0468 15.1414 16.6474 14.9412 16.8944 14.4472C17.1414 13.9532 16.9412 13.3526 16.4472 13.1056L13 11.382V6Z%22 fill%3D%22%2315273F%22%2F%3E%3C%2Fsvg%3E\") 0 0 no-repeat}.nas-datepicker-new__time-picker--active{background-color:#ebf4ff}.nas-datepicker-new__time-selector-wrapper nas-select{display:flex}.nas-datepicker-new__time-selector-wrapper nas-select ::ng-deep .nas-select{margin-bottom:0;margin-left:3px}.nas-datepicker-new__time-selector-wrapper nas-select ::ng-deep .nas-select:after{bottom:26px}.nas-datepicker-new__time-selector-wrapper nas-select ::ng-deep .nas-select select{border:3px solid #fff;background-color:#fff;height:64px}@media all and (-ms-high-contrast: none),(-ms-high-contrast: active){.nas-datepicker-new__time-selector-wrapper nas-select ::ng-deep .nas-select select{height:60px}}.nas-datepicker-new__time-selector-wrapper nas-select ::ng-deep .nas-select select:focus{border-color:#15273f}.nas-datepicker-new--has-time{padding-right:3px}.nas-datepicker-new nas-spinner{position:absolute;top:300px;left:45%;right:45%}.nas-datepicker-new__backdrop{display:block;position:fixed;z-index:2;top:0;left:0;width:100%;height:100%;color:transparent;background-color:#0b14202b;animation:datepicker-backdrop .7s ease-out both}.nas-datepicker-new__backdrop{display:block;position:fixed;z-index:2;top:0;left:0;width:100%;height:100%;color:transparent;background-color:#0b14202b;animation:timepicker-backdrop .7s ease-out both}.nas-datepicker-new--compact{padding:0;margin-bottom:6px}@keyframes datepicker-backdrop{0%{opacity:0}}@keyframes timepicker-backdrop{0%{opacity:0}}\n"] }]
|
|
10149
10150
|
}], ctorParameters: function () { return [{ type: i1.DatePipe }, { type: DateHelper }]; }, propDecorators: { input: [{
|
|
10150
10151
|
type: ViewChild,
|
|
10151
10152
|
args: ['input']
|
|
@@ -10213,6 +10214,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.5", ngImpor
|
|
|
10213
10214
|
type: Input
|
|
10214
10215
|
}], ariaLabelNextMonth: [{
|
|
10215
10216
|
type: Input
|
|
10217
|
+
}], timepickerLabel: [{
|
|
10218
|
+
type: Input
|
|
10216
10219
|
}], selectedDateChange: [{
|
|
10217
10220
|
type: Output
|
|
10218
10221
|
}], selectedMonthChange: [{
|
|
@@ -10505,21 +10508,16 @@ class DatepickerComboNewComponent extends NasComponentBase {
|
|
|
10505
10508
|
}
|
|
10506
10509
|
setInlineFlex() {
|
|
10507
10510
|
const container = this.container.nativeElement;
|
|
10508
|
-
|
|
10509
|
-
|
|
10510
|
-
|
|
10511
|
-
}
|
|
10512
|
-
else {
|
|
10513
|
-
this.renderer.removeClass(container, 'nas-datepicker-combo-new--inline-flex');
|
|
10514
|
-
container.style.width = '100%';
|
|
10515
|
-
}
|
|
10511
|
+
const inlineFlex = this.inlineFlex > 0;
|
|
10512
|
+
this.renderer[inlineFlex ? 'addClass' : 'removeClass'](container, 'nas-datepicker-combo-new--inline-flex');
|
|
10513
|
+
container.style.width = inlineFlex ? `${this.inlineFlex}px` : '100%';
|
|
10516
10514
|
}
|
|
10517
10515
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.5", ngImport: i0, type: DatepickerComboNewComponent, deps: [{ token: DateHelper }, { token: DeviceHelper }, { token: i0.Renderer2 }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
10518
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.5", type: DatepickerComboNewComponent, selector: "nas-datepicker-combo-new", inputs: { ariaLabelBackdrop: "ariaLabelBackdrop", outboundOpen: "outboundOpen", inboundOpen: "inboundOpen", noAvailableFlightsLabel: "noAvailableFlightsLabel", availableFlightsLabel: "availableFlightsLabel", disablePastSelection: "disablePastSelection", outboundDisabled: "outboundDisabled", inboundDisabled: "inboundDisabled", outboundOnly: "outboundOnly", outboundLabel: "outboundLabel", inboundLabel: "inboundLabel", availability: "availability", outboundAvailableDates: "outboundAvailableDates", inboundAvailableDates: "inboundAvailableDates", times: "times", dateDisplayFormat: "dateDisplayFormat", timeDisplayFormat: "timeDisplayFormat", locale: "locale", compact: "compact", nasFormGroup: "nasFormGroup", nasFormControlNameOutbound: "nasFormControlNameOutbound", nasFormControlNameInbound: "nasFormControlNameInbound", outboundSelectedDate: "outboundSelectedDate", inboundSelectedDate: "inboundSelectedDate", disableBackdrop: "disableBackdrop", outboundSelectedTime: "outboundSelectedTime", inboundSelectedTime: "inboundSelectedTime", ariaLabelPreviousMonth: "ariaLabelPreviousMonth", ariaLabelNextMonth: "ariaLabelNextMonth", inboundLowerLimitDateOffset: "inboundLowerLimitDateOffset", inlineFlex: "inlineFlex" }, outputs: { outboundSelectedDateChange: "outboundSelectedDateChange", inboundSelectedDateChange: "inboundSelectedDateChange", outboundOpenChange: "outboundOpenChange", inboundOpenChange: "inboundOpenChange", outboundMonthChange: "outboundMonthChange", inboundMonthChange: "inboundMonthChange", focusOnNextChange: "focusOnNextChange", focusOnPreviousChange: "focusOnPreviousChange" }, viewQueries: [{ propertyName: "datepickerOutbound", first: true, predicate: ["datepickerOutbound"], descendants: true }, { propertyName: "datepickerInbound", first: true, predicate: ["datepickerInbound"], descendants: true }, { propertyName: "container", first: true, predicate: ["container"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<div [nasClass]=\"getMainClass()\" #container>\n <div [nasClass]=\"getClass('date-picker')\">\n <nas-datepicker-new #datepickerOutbound\n compact\n [disableBackdrop]=\"disableBackdrop\"\n [nasFormGroup]=\"nasFormGroup\"\n [nasFormControlName]=\"nasFormControlNameOutbound\"\n [noAvailableFlightsLabel]=\"noAvailableFlightsLabel\"\n [availableFlightsLabel]=\"availableFlightsLabel\"\n [disablePastSelection]=\"exists(disablePastSelection)\"\n [availability]=\"exists(availability)\"\n [availableDates]=\"outboundAvailableDates\"\n [times]=\"times\"\n [selectedTime]=\"outboundSelectedTime\"\n [dateDisplayFormat]=\"dateDisplayFormat\"\n [timeDisplayFormat]=\"timeDisplayFormat\"\n [locale]=\"locale\"\n [disabled]=\"exists(outboundDisabled)\"\n [ariaLabelBackdrop]=\"ariaLabelBackdrop\"\n [ariaLabelPreviousMonth]=\"ariaLabelPreviousMonth\"\n [ariaLabelNextMonth]=\"ariaLabelNextMonth\"\n (focusOnNextChange)=\"inboundOpen = true\"\n (focusOnPreviousChange)=\"onFocusOnPrevious($event)\"\n (selectedMonthChange)=\"onOutboundMonthChange($event)\"\n [(open)]=\"outboundOpen\"\n [(selectedDate)]=\"outboundSelectedDate\">{{outboundLabel}}</nas-datepicker-new>\n </div>\n <span [nasClass]=\"getClass('separator')\"></span>\n <div *ngIf=\"checkOutboundOnly()\"\n [nasClass]=\"getClass('date-picker')\">\n <nas-datepicker-new #datepickerInbound\n compact\n [disableBackdrop]=\"disableBackdrop\"\n [nasFormGroup]=\"nasFormGroup\"\n [nasFormControlName]=\"nasFormControlNameInbound\"\n [disabled]=\"checkInboundDisabled()\"\n [noAvailableFlightsLabel]=\"noAvailableFlightsLabel\"\n [availableFlightsLabel]=\"availableFlightsLabel\"\n [disablePastSelection]=\"exists(disablePastSelection)\"\n [availability]=\"exists(availability)\"\n [availableDates]=\"inboundAvailableDates\"\n [lowerLimitDate]=\"inboundLowerLimitDate\"\n [times]=\"times\"\n [selectedTime]=\"inboundSelectedTime\"\n [dateDisplayFormat]=\"dateDisplayFormat\"\n [timeDisplayFormat]=\"timeDisplayFormat\"\n [locale]=\"locale\"\n [ariaLabelBackdrop]=\"ariaLabelBackdrop\"\n [ariaLabelPreviousMonth]=\"ariaLabelPreviousMonth\"\n [ariaLabelNextMonth]=\"ariaLabelNextMonth\"\n (focusOnNextChange)=\"onFocusOnNext($event)\"\n (focusOnPreviousChange)=\"onInboundFocusOnPrevious()\"\n [(open)]=\"inboundOpen\"\n [(selectedMonth)]=\"inboundSelectedMonth\"\n [(selectedDate)]=\"inboundSelectedDate\">{{inboundLabel}}</nas-datepicker-new>\n </div>\n</div>", 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-datepicker-combo-new{display:flex;margin:24px auto;flex-wrap:wrap;flex-direction:column}.nas-datepicker-combo-new nas-datepicker-new{display:flex}.nas-datepicker-combo-new nas-datepicker-new ::ng-deep .nas-datepicker-new__time-selector-wrapper{padding-left:8px;padding-bottom:8px}.nas-datepicker-combo-new nas-datepicker-new ::ng-deep .nas-datepicker-new__time-selector-wrapper .nas-select{margin-bottom:0}.nas-datepicker-combo-new nas-datepicker-new ::ng-deep .nas-datepicker-new__time-selector-wrapper .nas-select:after{bottom:25px}.nas-datepicker-combo-new nas-datepicker-new ::ng-deep .nas-datepicker-new__time-selector-wrapper .nas-select select{background-color:#fff;height:68px;border:2px solid #15273f}.nas-datepicker-combo-new nas-datepicker-new ::ng-deep .nas-datepicker-new__time-selector-wrapper .nas-select select:focus{border-color:#15273f}.nas-datepicker-combo-new nas-datepicker-new ::ng-deep .nas-datepicker-new__date-picker-wrapper nas-calendar-new{top:68px;right:0;left:0;margin-inline:auto;width:-webkit-fit-content;width:-moz-fit-content;width:fit-content}.nas-datepicker-combo-new__date-picker{width:100%}.nas-datepicker-combo-new__date-picker:first-child nas-datepicker-new ::ng-deep .nas-datepicker__date-picker-wrapper{border-bottom:none}.nas-datepicker-combo-new__date-picker:first-child nas-datepicker-new ::ng-deep .nas-datepicker__time-selector-wrapper{border-bottom:none}.nas-datepicker-combo-new__separator{display:none}.nas-datepicker-combo-new--md,.nas-datepicker-combo-new--lg{flex-wrap:nowrap;flex-direction:row}.nas-datepicker-combo-new--md .nas-datepicker-combo-new__separator,.nas-datepicker-combo-new--lg .nas-datepicker-combo-new__separator{display:block;position:relative;align-self:flex-end;flex-shrink:0;width:3px}.nas-datepicker-combo-new--compact{margin:0 auto}.nas-datepicker-combo-new--inline-flex{flex-wrap:nowrap;flex-direction:row;gap:8px;position:relative;margin:0}.nas-datepicker-combo-new--inline-flex .nas-datepicker-combo-new__separator{display:none}.nas-datepicker-combo-new--inline-flex nas-datepicker-new ::ng-deep .nas-datepicker-new{position:unset}.nas-datepicker-combo-new--inline-flex nas-datepicker-new ::ng-deep .nas-datepicker-new__date-picker-wrapper{position:unset}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: DatepickerNewComponent, selector: "nas-datepicker-new", inputs: ["ariaLabelBackdrop", "disableBackdrop", "noAvailableFlightsLabel", "availableFlightsLabel", "disablePastSelection", "lowerLimitDate", "availability", "availableDates", "disabled", "placeholder", "required", "ariaDescribedby", "ariaLabel", "dateDisplayFormat", "timeDisplayFormat", "locale", "compact", "nasFormGroup", "nasFormControlName", "times", "open", "selectedMonth", "selectedDate", "selectedTime", "ariaLabelPreviousMonth", "ariaLabelNextMonth"], outputs: ["selectedDateChange", "selectedMonthChange", "openChange", "focusOnNextChange", "focusOnPreviousChange"] }, { kind: "directive", type: NasClassDirective, selector: "[nasClass]", inputs: ["nasClass", "attr.class"] }] }); }
|
|
10516
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.5", type: DatepickerComboNewComponent, selector: "nas-datepicker-combo-new", inputs: { ariaLabelBackdrop: "ariaLabelBackdrop", outboundOpen: "outboundOpen", inboundOpen: "inboundOpen", noAvailableFlightsLabel: "noAvailableFlightsLabel", availableFlightsLabel: "availableFlightsLabel", disablePastSelection: "disablePastSelection", outboundDisabled: "outboundDisabled", inboundDisabled: "inboundDisabled", outboundOnly: "outboundOnly", outboundLabel: "outboundLabel", inboundLabel: "inboundLabel", timepickerLabel: "timepickerLabel", availability: "availability", outboundAvailableDates: "outboundAvailableDates", inboundAvailableDates: "inboundAvailableDates", times: "times", dateDisplayFormat: "dateDisplayFormat", timeDisplayFormat: "timeDisplayFormat", locale: "locale", compact: "compact", nasFormGroup: "nasFormGroup", nasFormControlNameOutbound: "nasFormControlNameOutbound", nasFormControlNameInbound: "nasFormControlNameInbound", outboundSelectedDate: "outboundSelectedDate", inboundSelectedDate: "inboundSelectedDate", disableBackdrop: "disableBackdrop", outboundSelectedTime: "outboundSelectedTime", inboundSelectedTime: "inboundSelectedTime", ariaLabelPreviousMonth: "ariaLabelPreviousMonth", ariaLabelNextMonth: "ariaLabelNextMonth", inboundLowerLimitDateOffset: "inboundLowerLimitDateOffset", inlineFlex: "inlineFlex" }, outputs: { outboundSelectedDateChange: "outboundSelectedDateChange", inboundSelectedDateChange: "inboundSelectedDateChange", outboundOpenChange: "outboundOpenChange", inboundOpenChange: "inboundOpenChange", outboundMonthChange: "outboundMonthChange", inboundMonthChange: "inboundMonthChange", focusOnNextChange: "focusOnNextChange", focusOnPreviousChange: "focusOnPreviousChange" }, viewQueries: [{ propertyName: "datepickerOutbound", first: true, predicate: ["datepickerOutbound"], descendants: true }, { propertyName: "datepickerInbound", first: true, predicate: ["datepickerInbound"], descendants: true }, { propertyName: "container", first: true, predicate: ["container"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<div [nasClass]=\"getMainClass()\" #container>\n <div [nasClass]=\"getClass('date-picker')\">\n <nas-datepicker-new #datepickerOutbound\n compact\n [disableBackdrop]=\"disableBackdrop\"\n [nasFormGroup]=\"nasFormGroup\"\n [nasFormControlName]=\"nasFormControlNameOutbound\"\n [noAvailableFlightsLabel]=\"noAvailableFlightsLabel\"\n [availableFlightsLabel]=\"availableFlightsLabel\"\n [disablePastSelection]=\"exists(disablePastSelection)\"\n [availability]=\"exists(availability)\"\n [availableDates]=\"outboundAvailableDates\"\n [times]=\"times\"\n [timepickerLabel]=\"timepickerLabel\"\n [selectedTime]=\"outboundSelectedTime\"\n [dateDisplayFormat]=\"dateDisplayFormat\"\n [timeDisplayFormat]=\"timeDisplayFormat\"\n [locale]=\"locale\"\n [disabled]=\"exists(outboundDisabled)\"\n [ariaLabelBackdrop]=\"ariaLabelBackdrop\"\n [ariaLabelPreviousMonth]=\"ariaLabelPreviousMonth\"\n [ariaLabelNextMonth]=\"ariaLabelNextMonth\"\n (focusOnNextChange)=\"inboundOpen = true\"\n (focusOnPreviousChange)=\"onFocusOnPrevious($event)\"\n (selectedMonthChange)=\"onOutboundMonthChange($event)\"\n [(open)]=\"outboundOpen\"\n [(selectedDate)]=\"outboundSelectedDate\">{{outboundLabel}}</nas-datepicker-new>\n </div>\n <span [nasClass]=\"getClass('separator')\"></span>\n <div *ngIf=\"checkOutboundOnly()\"\n [nasClass]=\"getClass('date-picker', checkInboundDisabled() && 'hide')\">\n <nas-datepicker-new #datepickerInbound\n compact\n [disableBackdrop]=\"disableBackdrop\"\n [nasFormGroup]=\"nasFormGroup\"\n [nasFormControlName]=\"nasFormControlNameInbound\"\n [disabled]=\"checkInboundDisabled()\"\n [noAvailableFlightsLabel]=\"noAvailableFlightsLabel\"\n [availableFlightsLabel]=\"availableFlightsLabel\"\n [disablePastSelection]=\"exists(disablePastSelection)\"\n [availability]=\"exists(availability)\"\n [availableDates]=\"inboundAvailableDates\"\n [lowerLimitDate]=\"inboundLowerLimitDate\"\n [times]=\"times\"\n [timepickerLabel]=\"timepickerLabel\"\n [selectedTime]=\"inboundSelectedTime\"\n [dateDisplayFormat]=\"dateDisplayFormat\"\n [timeDisplayFormat]=\"timeDisplayFormat\"\n [locale]=\"locale\"\n [ariaLabelBackdrop]=\"ariaLabelBackdrop\"\n [ariaLabelPreviousMonth]=\"ariaLabelPreviousMonth\"\n [ariaLabelNextMonth]=\"ariaLabelNextMonth\"\n (focusOnNextChange)=\"onFocusOnNext($event)\"\n (focusOnPreviousChange)=\"onInboundFocusOnPrevious()\"\n [(open)]=\"inboundOpen\"\n [(selectedMonth)]=\"inboundSelectedMonth\"\n [(selectedDate)]=\"inboundSelectedDate\">{{inboundLabel}}</nas-datepicker-new>\n </div>\n</div>", 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-datepicker-combo-new{display:flex;margin:24px auto;flex-wrap:wrap;flex-direction:column}.nas-datepicker-combo-new nas-datepicker-new{display:flex}.nas-datepicker-combo-new nas-datepicker-new ::ng-deep .nas-datepicker-new__time-selector-wrapper{padding-left:8px;padding-bottom:8px}.nas-datepicker-combo-new nas-datepicker-new ::ng-deep .nas-datepicker-new__time-selector-wrapper .nas-select{margin-bottom:0}.nas-datepicker-combo-new nas-datepicker-new ::ng-deep .nas-datepicker-new__time-selector-wrapper .nas-select:after{bottom:25px}.nas-datepicker-combo-new nas-datepicker-new ::ng-deep .nas-datepicker-new__time-selector-wrapper .nas-select select{background-color:#fff;height:68px;border:2px solid #15273f}.nas-datepicker-combo-new nas-datepicker-new ::ng-deep .nas-datepicker-new__time-selector-wrapper .nas-select select:focus{border-color:#15273f}.nas-datepicker-combo-new nas-datepicker-new ::ng-deep .nas-datepicker-new__date-picker-wrapper nas-calendar-new{top:68px;right:0;left:0;margin-inline:auto;width:-webkit-fit-content;width:-moz-fit-content;width:fit-content}.nas-datepicker-combo-new__date-picker{width:100%}.nas-datepicker-combo-new__date-picker:first-child nas-datepicker-new ::ng-deep .nas-datepicker__date-picker-wrapper{border-bottom:none}.nas-datepicker-combo-new__date-picker:first-child nas-datepicker-new ::ng-deep .nas-datepicker__time-selector-wrapper{border-bottom:none}.nas-datepicker-combo-new__date-picker--hide,.nas-datepicker-combo-new__separator{display:none}.nas-datepicker-combo-new--md,.nas-datepicker-combo-new--lg{flex-wrap:nowrap;flex-direction:row}.nas-datepicker-combo-new--md .nas-datepicker-combo-new__separator,.nas-datepicker-combo-new--lg .nas-datepicker-combo-new__separator{display:block;position:relative;align-self:flex-end;flex-shrink:0;width:3px}.nas-datepicker-combo-new--compact{margin:0 auto}.nas-datepicker-combo-new--inline-flex{flex-wrap:nowrap;flex-direction:row;gap:8px;position:relative;margin:0}.nas-datepicker-combo-new--inline-flex .nas-datepicker-combo-new__separator{display:none}.nas-datepicker-combo-new--inline-flex nas-datepicker-new ::ng-deep .nas-datepicker-new{position:unset}.nas-datepicker-combo-new--inline-flex nas-datepicker-new ::ng-deep .nas-datepicker-new__date-picker-wrapper{position:unset}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: DatepickerNewComponent, selector: "nas-datepicker-new", inputs: ["ariaLabelBackdrop", "disableBackdrop", "noAvailableFlightsLabel", "availableFlightsLabel", "disablePastSelection", "lowerLimitDate", "availability", "availableDates", "disabled", "placeholder", "required", "ariaDescribedby", "ariaLabel", "dateDisplayFormat", "timeDisplayFormat", "locale", "compact", "nasFormGroup", "nasFormControlName", "times", "open", "selectedMonth", "selectedDate", "selectedTime", "ariaLabelPreviousMonth", "ariaLabelNextMonth", "timepickerLabel"], outputs: ["selectedDateChange", "selectedMonthChange", "openChange", "focusOnNextChange", "focusOnPreviousChange"] }, { kind: "directive", type: NasClassDirective, selector: "[nasClass]", inputs: ["nasClass", "attr.class"] }] }); }
|
|
10519
10517
|
}
|
|
10520
10518
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.5", ngImport: i0, type: DatepickerComboNewComponent, decorators: [{
|
|
10521
10519
|
type: Component,
|
|
10522
|
-
args: [{ selector: 'nas-datepicker-combo-new', encapsulation: ViewEncapsulation.Emulated, template: "<div [nasClass]=\"getMainClass()\" #container>\n <div [nasClass]=\"getClass('date-picker')\">\n <nas-datepicker-new #datepickerOutbound\n compact\n [disableBackdrop]=\"disableBackdrop\"\n [nasFormGroup]=\"nasFormGroup\"\n [nasFormControlName]=\"nasFormControlNameOutbound\"\n [noAvailableFlightsLabel]=\"noAvailableFlightsLabel\"\n [availableFlightsLabel]=\"availableFlightsLabel\"\n [disablePastSelection]=\"exists(disablePastSelection)\"\n [availability]=\"exists(availability)\"\n [availableDates]=\"outboundAvailableDates\"\n [times]=\"times\"\n [selectedTime]=\"outboundSelectedTime\"\n [dateDisplayFormat]=\"dateDisplayFormat\"\n [timeDisplayFormat]=\"timeDisplayFormat\"\n [locale]=\"locale\"\n [disabled]=\"exists(outboundDisabled)\"\n [ariaLabelBackdrop]=\"ariaLabelBackdrop\"\n [ariaLabelPreviousMonth]=\"ariaLabelPreviousMonth\"\n [ariaLabelNextMonth]=\"ariaLabelNextMonth\"\n (focusOnNextChange)=\"inboundOpen = true\"\n (focusOnPreviousChange)=\"onFocusOnPrevious($event)\"\n (selectedMonthChange)=\"onOutboundMonthChange($event)\"\n [(open)]=\"outboundOpen\"\n [(selectedDate)]=\"outboundSelectedDate\">{{outboundLabel}}</nas-datepicker-new>\n </div>\n <span [nasClass]=\"getClass('separator')\"></span>\n <div *ngIf=\"checkOutboundOnly()\"\n [nasClass]=\"getClass('date-picker')\">\n <nas-datepicker-new #datepickerInbound\n compact\n [disableBackdrop]=\"disableBackdrop\"\n [nasFormGroup]=\"nasFormGroup\"\n [nasFormControlName]=\"nasFormControlNameInbound\"\n [disabled]=\"checkInboundDisabled()\"\n [noAvailableFlightsLabel]=\"noAvailableFlightsLabel\"\n [availableFlightsLabel]=\"availableFlightsLabel\"\n [disablePastSelection]=\"exists(disablePastSelection)\"\n [availability]=\"exists(availability)\"\n [availableDates]=\"inboundAvailableDates\"\n [lowerLimitDate]=\"inboundLowerLimitDate\"\n [times]=\"times\"\n [selectedTime]=\"inboundSelectedTime\"\n [dateDisplayFormat]=\"dateDisplayFormat\"\n [timeDisplayFormat]=\"timeDisplayFormat\"\n [locale]=\"locale\"\n [ariaLabelBackdrop]=\"ariaLabelBackdrop\"\n [ariaLabelPreviousMonth]=\"ariaLabelPreviousMonth\"\n [ariaLabelNextMonth]=\"ariaLabelNextMonth\"\n (focusOnNextChange)=\"onFocusOnNext($event)\"\n (focusOnPreviousChange)=\"onInboundFocusOnPrevious()\"\n [(open)]=\"inboundOpen\"\n [(selectedMonth)]=\"inboundSelectedMonth\"\n [(selectedDate)]=\"inboundSelectedDate\">{{inboundLabel}}</nas-datepicker-new>\n </div>\n</div>", 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-datepicker-combo-new{display:flex;margin:24px auto;flex-wrap:wrap;flex-direction:column}.nas-datepicker-combo-new nas-datepicker-new{display:flex}.nas-datepicker-combo-new nas-datepicker-new ::ng-deep .nas-datepicker-new__time-selector-wrapper{padding-left:8px;padding-bottom:8px}.nas-datepicker-combo-new nas-datepicker-new ::ng-deep .nas-datepicker-new__time-selector-wrapper .nas-select{margin-bottom:0}.nas-datepicker-combo-new nas-datepicker-new ::ng-deep .nas-datepicker-new__time-selector-wrapper .nas-select:after{bottom:25px}.nas-datepicker-combo-new nas-datepicker-new ::ng-deep .nas-datepicker-new__time-selector-wrapper .nas-select select{background-color:#fff;height:68px;border:2px solid #15273f}.nas-datepicker-combo-new nas-datepicker-new ::ng-deep .nas-datepicker-new__time-selector-wrapper .nas-select select:focus{border-color:#15273f}.nas-datepicker-combo-new nas-datepicker-new ::ng-deep .nas-datepicker-new__date-picker-wrapper nas-calendar-new{top:68px;right:0;left:0;margin-inline:auto;width:-webkit-fit-content;width:-moz-fit-content;width:fit-content}.nas-datepicker-combo-new__date-picker{width:100%}.nas-datepicker-combo-new__date-picker:first-child nas-datepicker-new ::ng-deep .nas-datepicker__date-picker-wrapper{border-bottom:none}.nas-datepicker-combo-new__date-picker:first-child nas-datepicker-new ::ng-deep .nas-datepicker__time-selector-wrapper{border-bottom:none}.nas-datepicker-combo-new__separator{display:none}.nas-datepicker-combo-new--md,.nas-datepicker-combo-new--lg{flex-wrap:nowrap;flex-direction:row}.nas-datepicker-combo-new--md .nas-datepicker-combo-new__separator,.nas-datepicker-combo-new--lg .nas-datepicker-combo-new__separator{display:block;position:relative;align-self:flex-end;flex-shrink:0;width:3px}.nas-datepicker-combo-new--compact{margin:0 auto}.nas-datepicker-combo-new--inline-flex{flex-wrap:nowrap;flex-direction:row;gap:8px;position:relative;margin:0}.nas-datepicker-combo-new--inline-flex .nas-datepicker-combo-new__separator{display:none}.nas-datepicker-combo-new--inline-flex nas-datepicker-new ::ng-deep .nas-datepicker-new{position:unset}.nas-datepicker-combo-new--inline-flex nas-datepicker-new ::ng-deep .nas-datepicker-new__date-picker-wrapper{position:unset}\n"] }]
|
|
10520
|
+
args: [{ selector: 'nas-datepicker-combo-new', encapsulation: ViewEncapsulation.Emulated, template: "<div [nasClass]=\"getMainClass()\" #container>\n <div [nasClass]=\"getClass('date-picker')\">\n <nas-datepicker-new #datepickerOutbound\n compact\n [disableBackdrop]=\"disableBackdrop\"\n [nasFormGroup]=\"nasFormGroup\"\n [nasFormControlName]=\"nasFormControlNameOutbound\"\n [noAvailableFlightsLabel]=\"noAvailableFlightsLabel\"\n [availableFlightsLabel]=\"availableFlightsLabel\"\n [disablePastSelection]=\"exists(disablePastSelection)\"\n [availability]=\"exists(availability)\"\n [availableDates]=\"outboundAvailableDates\"\n [times]=\"times\"\n [timepickerLabel]=\"timepickerLabel\"\n [selectedTime]=\"outboundSelectedTime\"\n [dateDisplayFormat]=\"dateDisplayFormat\"\n [timeDisplayFormat]=\"timeDisplayFormat\"\n [locale]=\"locale\"\n [disabled]=\"exists(outboundDisabled)\"\n [ariaLabelBackdrop]=\"ariaLabelBackdrop\"\n [ariaLabelPreviousMonth]=\"ariaLabelPreviousMonth\"\n [ariaLabelNextMonth]=\"ariaLabelNextMonth\"\n (focusOnNextChange)=\"inboundOpen = true\"\n (focusOnPreviousChange)=\"onFocusOnPrevious($event)\"\n (selectedMonthChange)=\"onOutboundMonthChange($event)\"\n [(open)]=\"outboundOpen\"\n [(selectedDate)]=\"outboundSelectedDate\">{{outboundLabel}}</nas-datepicker-new>\n </div>\n <span [nasClass]=\"getClass('separator')\"></span>\n <div *ngIf=\"checkOutboundOnly()\"\n [nasClass]=\"getClass('date-picker', checkInboundDisabled() && 'hide')\">\n <nas-datepicker-new #datepickerInbound\n compact\n [disableBackdrop]=\"disableBackdrop\"\n [nasFormGroup]=\"nasFormGroup\"\n [nasFormControlName]=\"nasFormControlNameInbound\"\n [disabled]=\"checkInboundDisabled()\"\n [noAvailableFlightsLabel]=\"noAvailableFlightsLabel\"\n [availableFlightsLabel]=\"availableFlightsLabel\"\n [disablePastSelection]=\"exists(disablePastSelection)\"\n [availability]=\"exists(availability)\"\n [availableDates]=\"inboundAvailableDates\"\n [lowerLimitDate]=\"inboundLowerLimitDate\"\n [times]=\"times\"\n [timepickerLabel]=\"timepickerLabel\"\n [selectedTime]=\"inboundSelectedTime\"\n [dateDisplayFormat]=\"dateDisplayFormat\"\n [timeDisplayFormat]=\"timeDisplayFormat\"\n [locale]=\"locale\"\n [ariaLabelBackdrop]=\"ariaLabelBackdrop\"\n [ariaLabelPreviousMonth]=\"ariaLabelPreviousMonth\"\n [ariaLabelNextMonth]=\"ariaLabelNextMonth\"\n (focusOnNextChange)=\"onFocusOnNext($event)\"\n (focusOnPreviousChange)=\"onInboundFocusOnPrevious()\"\n [(open)]=\"inboundOpen\"\n [(selectedMonth)]=\"inboundSelectedMonth\"\n [(selectedDate)]=\"inboundSelectedDate\">{{inboundLabel}}</nas-datepicker-new>\n </div>\n</div>", 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-datepicker-combo-new{display:flex;margin:24px auto;flex-wrap:wrap;flex-direction:column}.nas-datepicker-combo-new nas-datepicker-new{display:flex}.nas-datepicker-combo-new nas-datepicker-new ::ng-deep .nas-datepicker-new__time-selector-wrapper{padding-left:8px;padding-bottom:8px}.nas-datepicker-combo-new nas-datepicker-new ::ng-deep .nas-datepicker-new__time-selector-wrapper .nas-select{margin-bottom:0}.nas-datepicker-combo-new nas-datepicker-new ::ng-deep .nas-datepicker-new__time-selector-wrapper .nas-select:after{bottom:25px}.nas-datepicker-combo-new nas-datepicker-new ::ng-deep .nas-datepicker-new__time-selector-wrapper .nas-select select{background-color:#fff;height:68px;border:2px solid #15273f}.nas-datepicker-combo-new nas-datepicker-new ::ng-deep .nas-datepicker-new__time-selector-wrapper .nas-select select:focus{border-color:#15273f}.nas-datepicker-combo-new nas-datepicker-new ::ng-deep .nas-datepicker-new__date-picker-wrapper nas-calendar-new{top:68px;right:0;left:0;margin-inline:auto;width:-webkit-fit-content;width:-moz-fit-content;width:fit-content}.nas-datepicker-combo-new__date-picker{width:100%}.nas-datepicker-combo-new__date-picker:first-child nas-datepicker-new ::ng-deep .nas-datepicker__date-picker-wrapper{border-bottom:none}.nas-datepicker-combo-new__date-picker:first-child nas-datepicker-new ::ng-deep .nas-datepicker__time-selector-wrapper{border-bottom:none}.nas-datepicker-combo-new__date-picker--hide,.nas-datepicker-combo-new__separator{display:none}.nas-datepicker-combo-new--md,.nas-datepicker-combo-new--lg{flex-wrap:nowrap;flex-direction:row}.nas-datepicker-combo-new--md .nas-datepicker-combo-new__separator,.nas-datepicker-combo-new--lg .nas-datepicker-combo-new__separator{display:block;position:relative;align-self:flex-end;flex-shrink:0;width:3px}.nas-datepicker-combo-new--compact{margin:0 auto}.nas-datepicker-combo-new--inline-flex{flex-wrap:nowrap;flex-direction:row;gap:8px;position:relative;margin:0}.nas-datepicker-combo-new--inline-flex .nas-datepicker-combo-new__separator{display:none}.nas-datepicker-combo-new--inline-flex nas-datepicker-new ::ng-deep .nas-datepicker-new{position:unset}.nas-datepicker-combo-new--inline-flex nas-datepicker-new ::ng-deep .nas-datepicker-new__date-picker-wrapper{position:unset}\n"] }]
|
|
10523
10521
|
}], ctorParameters: function () { return [{ type: DateHelper }, { type: DeviceHelper }, { type: i0.Renderer2 }]; }, propDecorators: { datepickerOutbound: [{
|
|
10524
10522
|
type: ViewChild,
|
|
10525
10523
|
args: ['datepickerOutbound']
|
|
@@ -10551,6 +10549,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.5", ngImpor
|
|
|
10551
10549
|
type: Input
|
|
10552
10550
|
}], inboundLabel: [{
|
|
10553
10551
|
type: Input
|
|
10552
|
+
}], timepickerLabel: [{
|
|
10553
|
+
type: Input
|
|
10554
10554
|
}], availability: [{
|
|
10555
10555
|
type: Input
|
|
10556
10556
|
}], outboundAvailableDates: [{
|
|
@@ -12511,11 +12511,11 @@ class FilterNewComponent extends NasComponentBase {
|
|
|
12511
12511
|
this.inlineFlex = this.container.nativeElement.offsetWidth > 290 ? this.container.nativeElement.offsetWidth : 0;
|
|
12512
12512
|
}
|
|
12513
12513
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.5", ngImport: i0, type: FilterNewComponent, deps: [{ token: DeviceHelper }, { token: SortService }, { token: AbandonedBasketService }, { token: DateHelper }, { token: i0.ElementRef }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
12514
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.5", type: FilterNewComponent, selector: "nas-filter-new", inputs: { airportRelations: "airportRelations", ariaLabelClear: "ariaLabelClear", ariaLabelSubtract: "ariaLabelSubtract", ariaLabelBackdrop: "ariaLabelBackdrop", ariaLabelAdd: "ariaLabelAdd", allowedOriginAirports: "allowedOriginAirports", allowedDestinationAirports: "allowedDestinationAirports", displayLatestSearches: "displayLatestSearches", useSwitch: "useSwitch", displayClosestAirports: "displayClosestAirports", originAirportCode: "originAirportCode", destinationAirportCode: "destinationAirportCode", passengerSelectLabel: "passengerSelectLabel", maxPaxCount: "maxPaxCount", passengers: "passengers", minAdultCount: "minAdultCount", tripSwitchRoundTripLabel: "tripSwitchRoundTripLabel", tripSwitchOneWayLabel: "tripSwitchOneWayLabel", directOnlyLabel: "directOnlyLabel", directTransitLabel: "directTransitLabel", minimizeOnMobile: "minimizeOnMobile", expandedAccordionMobile: "expandedAccordionMobile", defaultSummarySeparator: "defaultSummarySeparator", lastSummarySeparator: "lastSummarySeparator", passengerSelectTitle: "passengerSelectTitle", passengerSelectAdultsLabel: "passengerSelectAdultsLabel", passengerSelectYouthsLabel: "passengerSelectYouthsLabel", passengerSelectYoungAdultsLabel: "passengerSelectYoungAdultsLabel", passengerSelectChildrenLabel: "passengerSelectChildrenLabel", passengerSelectInfantsLabel: "passengerSelectInfantsLabel", groupBookingLabel: "groupBookingLabel", allAirportsLabel: "allAirportsLabel", latestSearchesLabel: "latestSearchesLabel", closestAirportsLabel: "closestAirportsLabel", selectOriginFirstLabel: "selectOriginFirstLabel", labelOrigin: "labelOrigin", placeholderOrigin: "placeholderOrigin", labelDestination: "labelDestination", geolocationLabel: "geolocationLabel", geolocationBlockedLabel: "geolocationBlockedLabel", placeholderDestination: "placeholderDestination", keepSelection: "keepSelection", editSearchTitle: "editSearchTitle", nasFormGroup: "nasFormGroup", nasFormControlNameOrigin: "nasFormControlNameOrigin", nasFormControlNameDestination: "nasFormControlNameDestination", nasFormControlNameTripType: "nasFormControlNameTripType", nasFormControlNameDirectOnly: "nasFormControlNameDirectOnly", nasFormControlNameOutbound: "nasFormControlNameOutbound", nasFormControlNameInbound: "nasFormControlNameInbound", nasFormControlGroupBooking: "nasFormControlGroupBooking", nasFormControlNameSubsidyDiscount: "nasFormControlNameSubsidyDiscount", overrideOrigin: "overrideOrigin", enableSuggestions: "enableSuggestions", closestAirports: "closestAirports", minimize: "minimize", airports: "airports", tripType: "tripType", directOnly: "directOnly", groupBookingLimit: "groupBookingLimit", subsidyDiscounts: "subsidyDiscounts", selectedSubsidyDiscount: "selectedSubsidyDiscount", subsidyDiscountLabel: "subsidyDiscountLabel", ariaLabelPreviousMonth: "ariaLabelPreviousMonth", ariaLabelNextMonth: "ariaLabelNextMonth", noAvailableFlightsLabel: "noAvailableFlightsLabel", availableFlightsLabel: "availableFlightsLabel", disablePastSelection: "disablePastSelection", outboundLabel: "outboundLabel", inboundLabel: "inboundLabel", availability: "availability", outboundAvailableDates: "outboundAvailableDates", inboundAvailableDates: "inboundAvailableDates", times: "times", dateDisplayFormat: "dateDisplayFormat", timeDisplayFormat: "timeDisplayFormat", locale: "locale", compact: "compact", outboundDisabled: "outboundDisabled", inboundDisabled: "inboundDisabled", enableDatepickers: "enableDatepickers", minimizingLabel: "minimizingLabel", maximizingLabel: "maximizingLabel", directOnlyMobileLabel: "directOnlyMobileLabel", orLabel: "orLabel", passengersTitleLabel: "passengersTitleLabel", invalidDestinationText: "invalidDestinationText", outboundSelectedDate: "outboundSelectedDate", inboundSelectedDate: "inboundSelectedDate", enableDestinationSelect: "enableDestinationSelect", enablePassengersSelect: "enablePassengersSelect", enableTripSwitch: "enableTripSwitch", enableTransitSwitch: "enableTransitSwitch" }, outputs: { originOpenChange: "originOpenChange", destinationOpenChange: "destinationOpenChange", passengerSelectOpenChange: "passengerSelectOpenChange", originChange: "originChange", destinationChange: "destinationChange", passengersChange: "passengersChange", tripTypeChange: "tripTypeChange", directOnlyChange: "directOnlyChange", outboundSelectedDateChange: "outboundSelectedDateChange", inboundSelectedDateChange: "inboundSelectedDateChange", outboundOpenChange: "outboundOpenChange", inboundOpenChange: "inboundOpenChange", outboundMonthChange: "outboundMonthChange", inboundMonthChange: "inboundMonthChange", focusOnNextChange: "focusOnNextChange", positionChange: "positionChange", subsidyDiscountInfoClick: "subsidyDiscountInfoClick" }, viewQueries: [{ propertyName: "passengerSelectDropdown", first: true, predicate: ["passengerSelectDropdown"], descendants: true }, { propertyName: "passengerSelect", first: true, predicate: ["passengerSelect"], descendants: true }, { propertyName: "tripSwitch", first: true, predicate: ["tripSwitch"], descendants: true }, { propertyName: "transitSwitch", first: true, predicate: ["transitSwitch"], descendants: true }, { propertyName: "airportSelect", first: true, predicate: ["airportSelect"], descendants: true }, { propertyName: "datepickerCombo", first: true, predicate: ["datepickerCombo"], descendants: true }, { propertyName: "container", first: true, predicate: ["container"], descendants: true }, { propertyName: "tripTypeOneway", first: true, predicate: ["tripTypeOneway"], descendants: true }, { propertyName: "tripTypeRoundTrip", first: true, predicate: ["tripTypeRoundTrip"], descendants: true }, { propertyName: "transitTypeDirectOnly", first: true, predicate: ["transitTypeDirectOnly"], descendants: true }, { propertyName: "transitTypeTransit", first: true, predicate: ["transitTypeTransit"], descendants: true }, { propertyName: "subsidyDiscount", first: true, predicate: ["subsidyDiscount"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<nas-accordion *ngIf=\"deviceHelper?.isMobile() && exists(minimizeOnMobile); else filterTemplate\"\n simple\n containerOnToggle\n transparent\n [expanded]=\"expandedAccordionMobile\"\n [title]=\"editSearchTitle\"\n (toggleChange)=\"onAccordionToggleChange($event)\">\n <ng-container *ngTemplateOutlet=\"filterTemplate\"></ng-container>\n</nas-accordion>\n<div class=\"container\"\n *ngIf=\"deviceHelper?.isMobile() && exists(minimizeOnMobile) && displaySummary\">{{getSummary()}}</div>\n\n<ng-template #filterTemplate>\n <div #container\n [nasClass]=\"getContainerClass()\">\n <div [nasClass]=\"getFilterClass('filters', [exists(minimize) && 'minimized', maximize && 'maximize'])\">\n <ng-container *ngIf=\"airports?.length > 0\">\n <nas-airport-select-new *ngIf=\"airports && airportRelations && (enableDestinationSelect)\"\n #airportSelect\n combo\n [ariaLabelClear]=\"ariaLabelClear\" \n [ariaLabelBackdrop]=\"ariaLabelBackdrop\"\n [nasFormGroup]=\"nasFormGroup\"\n [nasFormControlNameOrigin]=\"nasFormControlNameOrigin\"\n [nasFormControlNameDestination]=\"nasFormControlNameDestination\"\n [useSwitch]=\"useSwitch\"\n [nasClass]=\"getAirportSelectClass()\"\n [airports]=\"airports\"\n [allowedOriginAiports]=\"allowedOriginAirports\"\n [allowedDestinationAirports]=\"allowedDestinationAirports\"\n [airportRelations]=\"airportRelations\"\n [latestSearchesOrigin]=\"latestSearchesOrigin\"\n [latestSearchesDestination]=\"latestSearchesDestination\"\n [displayLatestSearches]=\"displayLatestSearches\"\n [displayClosestAirports]=\"displayClosestAirports\"\n [originAirportCode]=\"originAirportCode\"\n [destinationAirportCode]=\"destinationAirportCode\"\n [allAirportsLabel]=\"allAirportsLabel\"\n [latestSearchesLabel]=\"latestSearchesLabel\"\n [closestAirportsLabel]=\"closestAirportsLabel\"\n [closestAirports]=\"closestAirports\"\n [selectOriginFirstLabel]=\"selectOriginFirstLabel\"\n [labelOrigin]=\"labelOrigin\"\n [placeholderOrigin]=\"placeholderOrigin\"\n [labelDestination]=\"labelDestination\"\n [geolocationLabel]=\"geolocationLabel\"\n [geolocationBlockedLabel]=\"geolocationBlockedLabel\"\n [placeholderDestination]=\"placeholderDestination\"\n [keepSelection]=\"keepSelection\"\n [invalidDestinationText]=\"invalidDestinationText\"\n (originChange)=\"setSelectedOriginAirport($event)\"\n (destinationChange)=\"onDestinationChange($event)\"\n (focusOnNext)=\"setFocusOnPassengerSelect($event)\"\n (originOpenChange)=\"onOriginOpen($event)\"\n (destinationOpenChange)=\"onDestinationOpen($event)\"\n (positionChange)=\"getClosestAirports($event)\"></nas-airport-select-new>\n <nas-airport-select-new *ngIf=\"airports && (!enableDestinationSelect)\"\n #airportSelect\n [ariaLabelClear]=\"ariaLabelClear\"\n [ariaLabelBackdrop]=\"ariaLabelBackdrop\"\n [nasFormGroup]=\"nasFormGroup\"\n [nasFormControlNameOrigin]=\"nasFormControlNameOrigin\"\n [useSwitch]=\"useSwitch\"\n [nasClass]=\"getClass('airport-origin-select')\"\n [airports]=\"airports\"\n [allowedOriginAiports]=\"allowedOriginAirports\"\n [airportRelations]=\"airportRelations\"\n [latestSearchesOrigin]=\"latestSearchesOrigin\"\n [displayLatestSearches]=\"displayLatestSearches\"\n [displayClosestAirports]=\"displayClosestAirports\"\n [originAirportCode]=\"originAirportCode\"\n [allAirportsLabel]=\"allAirportsLabel\"\n [latestSearchesLabel]=\"latestSearchesLabel\"\n [closestAirportsLabel]=\"closestAirportsLabel\"\n [closestAirports]=\"closestAirports\"\n [selectOriginFirstLabel]=\"selectOriginFirstLabel\"\n [labelOrigin]=\"labelOrigin\"\n [placeholderOrigin]=\"placeholderOrigin\"\n [geolocationLabel]=\"geolocationLabel\"\n [geolocationBlockedLabel]=\"geolocationBlockedLabel\"\n [keepSelection]=\"keepSelection\"\n (originChange)=\"setSelectedOriginAirport($event)\"\n (focusOnNext)=\"setFocusOnPassengerSelect($event)\"\n (originOpenChange)=\"onOriginOpen($event)\"\n (positionChange)=\"getClosestAirports($event)\"></nas-airport-select-new>\n <nas-suggestions *ngIf=\"(closestAirports || latestSearchesOrigin) && exists(enableSuggestions)\"\n [nasClass]=\"getFilterClass('suggestions')\"\n [suggestions]=\"getSuggestions()\"\n [orLabel]=\"orLabel\"\n (airportSelect)=\"setSelectedOriginAirport($event)\"></nas-suggestions>\n </ng-container>\n <ng-container *ngIf=\"shouldMaximize()\">\n <div [nasClass]=\"!enableDestinationSelect ? getClass('origin-combined') :\n getTravelDetailsClass('', ['combined', exists(enableDatepickers) && 'no-border', exists(minimize) && 'minimized'])\">\n <ng-container *ngIf=\"enablePassengersSelect\">\n <button (click)=\"onPassengerSelectOpen($event)\" [nasClass]=\"getClass('passengers-button', openPassengerSelect && 'active')\">\n <div [nasClass]=\"getClass('label')\">\n <p [nasClass]=\"getClass('button-title')\">{{passengersTitleLabel}}</p>\n <p>{{passengerSelectLabel}}</p>\n </div>\n <div [nasClass]=\"getClass('traveler-icon')\"><nas-icon [icon]=\"'my-profile-compact'\" [type]=\"'small'\"></nas-icon></div>\n </button>\n <!-- <nas-dropdown #passengerSelectDropdown\n *ngIf=\"passengers?.length > 0\"\n [nasClass]=\"getTravelDetailsClass('dropdown', 'passengers')\"\n [cssClass]=\"getTravelDetailsClass('dropdown')\"\n [label]=\"passengerSelectLabel\"\n [labelStyle]=\"{'width': '102px'}\"\n [ariaLabelBackdrop]=\"ariaLabelBackdrop\"\n (openChange)=\"onPassengerSelectOpen($event)\"\n (keydown)=\"passengerKeyDown($event)\"> -->\n <div *ngIf=\"openPassengerSelect\">\n <nas-passenger-select-new\n [ariaLabelAdd]=\"ariaLabelAdd\"\n [ariaLabelSubtract]=\"ariaLabelSubtract\"\n [adultsLabel]=\"passengerSelectAdultsLabel\"\n [youthsLabel]=\"passengerSelectYouthsLabel\"\n [youngAdultsLabel]=\"passengerSelectYoungAdultsLabel\"\n [childrenLabel]=\"passengerSelectChildrenLabel\"\n [infantsLabel]=\"passengerSelectInfantsLabel\"\n [maxPaxCount]=\"maxPaxCount\"\n [minAdultCount]=\"minAdultCount\"\n [title]=\"passengerSelectTitle\"\n [nasFormGroup]=\"nasFormGroup\"\n [nasFormControlGroupBooking]=\"nasFormControlGroupBooking\"\n [groupBookingLabel]=\"groupBookingLabel\"\n [groupBookingLimit]=\"groupBookingLimit\"\n (focusOnNext)=\"onPassengersSelectFocusOnNext()\"\n (focusOnPrevious)=\"onPassengersSelectFocusOnPrevious()\"\n [(passengers)]=\"passengers\"></nas-passenger-select-new>\n <nas-button-new *ngIf=\"this.openPassengerSelect\" light block \n [disabled]=\"passengers[0].count === 0 && passengers[1].count === 0 && passengers[2].count === 0\" (click)=\"openPassengerSelect = false\">\n Done\n </nas-button-new>\n </div>\n </ng-container>\n <ng-container *ngIf=\"enableTripSwitch\">\n <form [nasClass]=\"getClass('radio')\">\n <nas-radio-new #tripTypeRoundTrip [name]=\"'tripType'\" [value]=\"2\" [checked]=\"true\" (checkedChange)=\"onTripTypeChange(2)\">\n {{tripSwitchRoundTripLabel}}\n </nas-radio-new>\n <nas-radio-new #tripTypeOneway [name]=\"'tripType'\" [value]=\"1\" (checkedChange)=\"onTripTypeChange(1)\">\n {{tripSwitchOneWayLabel}}\n </nas-radio-new>\n </form>\n </ng-container>\n <div *ngIf=\"exists(enableDatepickers)\"\n [nasClass]=\"getDatePickersClass()\">\n <nas-datepicker-combo-new #datepickerCombo\n compact\n [inlineFlex]=\"inlineFlex\"\n [nasFormGroup]=\"nasFormGroup\"\n [nasFormControlNameOutbound]=\"nasFormControlNameOutbound\"\n [nasFormControlNameInbound]=\"nasFormControlNameInbound\"\n [availability]=\"availability\"\n [availableFlightsLabel]=\"availableFlightsLabel\"\n [dateDisplayFormat]=\"dateDisplayFormat\"\n [disablePastSelection]=\"disablePastSelection\"\n [locale]=\"locale\"\n [noAvailableFlightsLabel]=\"noAvailableFlightsLabel\"\n [inboundAvailableDates]=\"inboundAvailableDates\"\n [inboundLabel]=\"inboundLabel\"\n [noAvailableFlightsLabel]=\"noAvailableFlightsLabel\"\n [outboundAvailableDates]=\"outboundAvailableDates\"\n [outboundLabel]=\"outboundLabel\"\n [timeDisplayFormat]=\"timeDisplayFormat\"\n [times]=\"times\"\n [outboundDisabled]=\"outboundDisabled\"\n [inboundDisabled]=\"inboundDisabled\"\n [outboundOnly]=\"tripType === 1\"\n [ariaLabelBackdrop]=\"ariaLabelBackdrop\"\n [ariaLabelPreviousMonth]=\"ariaLabelPreviousMonth\"\n [ariaLabelNextMonth]=\"ariaLabelNextMonth\"\n (focusOnNextChange)=\"onFocusOnNextChange($event)\"\n (focusOnPreviousChange)=\"onDatepickerFocusOnPrevious($event)\"\n (inboundMonthChange)=\"onInboundMonthChange($event)\"\n (outboundMonthChange)=\"onOutboundMonthChange($event)\"\n [(outboundOpen)]=\"outboundOpen\"\n [(inboundOpen)]=\"inboundOpen\"\n [(inboundSelectedDate)]=\"inboundSelectedDate\"\n [(outboundSelectedDate)]=\"outboundSelectedDate\">\n </nas-datepicker-combo-new>\n </div>\n <ng-container *ngIf=\"enableTransitSwitch\">\n <nas-button-new *ngIf=\"directOnlyLabel && directTransitLabel\"\n #transitSwitch\n block\n light\n [iconType]=\"'chevron-down'\"\n [label]=\"getTransitLabel()\"\n [nasClass]=\"getClass('transit', openTransitTypeSelect && 'active')\"\n [ariaLabelBackdrop]=\"ariaLabelBackdrop\"\n (click)=\"onTransitSwitchOpen($event)\"\n (keydown)=\"transitKeyDown($event)\">{{ getTransitLabel() }}\n </nas-button-new>\n <div *ngIf=\"openTransitTypeSelect\" [nasClass]=\"getClass('transit-type')\">\n <button [nasClass]=\"getTravelDetailsClass('action', directOnly && 'active')\"\n type=\"button\"\n #transitTypeDirectOnly\n (click)=\"onTransitChange(true)\">{{ directOnlyLabel }}\n </button>\n <button type=\"button\"\n #transitTypeTransit\n [nasClass]=\"getTravelDetailsClass('action', !directOnly && 'active')\"\n (click)=\"onTransitChange(false)\">{{ directTransitLabel }}\n </button>\n </div>\n </ng-container>\n </div>\n <div *ngIf=\"subsidyDiscounts && subsidyDiscounts.length > 0\"\n [nasClass]=\"getFilterClass('subsidy-discount')\">\n <nas-subsidy-discount #subsidyDiscount\n [discounts]=\"subsidyDiscounts\"\n [selectedDiscount]=\"selectedSubsidyDiscount\"\n [label]=\"subsidyDiscountLabel\"\n (infoButtonClick)=\"onSubsidyDiscountInfoClick()\"\n (discountSelectChange)=\"onSubsidyDiscountSelectChange($event)\"\n (infoButtonKeydown)=\"onSubsidyDiscountInfoButtonKeydown($event)\"></nas-subsidy-discount>\n </div>\n </ng-container>\n </div>\n </div>\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-filter-new{position:relative;z-index:6}.nas-filter-new ::ng-deep .nas-filter-new__transit .nas-button-new--light{border:2px solid #15273f}.nas-filter-new ::ng-deep .nas-filter-new__transit .nas-button-new__content{gap:0;justify-content:space-between;font-weight:400}.nas-filter-new ::ng-deep .nas-filter-new__transit--active .nas-button-new__icon{transform:rotate(180deg)}.nas-filter-new ::ng-deep .nas-filter-new__transit--active .nas-button-new{background-color:#ebf4ff;border:2px solid #15273f}.nas-filter-new__title{margin-top:24px;font-size:28px;line-height:34px}@media screen and (min-width: 640px){.nas-filter-new__title{font-size:32px;line-height:38px}}.nas-filter-new__title--md{margin-top:60px}.nas-filter-new__radio{display:flex;gap:24px;padding:12px}.nas-filter-new__passengers-button{display:flex;justify-content:space-between;background-color:#fff;border:2px solid #15273f;padding:9px 14px;width:100%}.nas-filter-new__passengers-button--active{background-color:#ebf4ff!important}.nas-filter-new__label{flex-direction:column;text-align:left}.nas-filter-new__label p{margin:0}.nas-filter-new__button-title{font-weight:700;font-size:14px}.nas-filter-new__traveler-icon{transform:scale(.85);margin-top:12px}.nas-filter-new__transit-type{border-left:2px solid #15273f;border-right:2px solid #15273f;border-bottom:2px solid #15273f}.nas-filter-new__transit-type button:first-child{border-bottom:2px solid #E9E7E4}.nas-filter-new__filters{margin-top:12px}.nas-filter-new__filters .nas-filter-new__date-combo{order:2;flex:1;z-index:2}.nas-filter-new__filters--minimized .nas-filter-new__airport-select:after{content:\"\";position:absolute;bottom:-3px;left:0px;width:100%;border-bottom:3px solid #c3c3c3}.nas-filter-new__filters--maximize .nas-filter-new__airport-select-new:after{display:none}.nas-filter-new__filters--md .nas-filter-new__date-combo{flex:0 0 100%}.nas-filter-new__filters--lg{align-items:stretch}.nas-filter-new__filters--lg .nas-filter-new__date-combo{order:3;flex:0 0 100%;z-index:1}.nas-filter-new__filters--lg .nas-filter-new__suggestions{order:3}.nas-filter-new__filters--lg .nas-filter-new__filters--minimized .nas-filter-new__airport-select{margin-right:0;flex:0 1 100%}.nas-filter-new__filters--lg .nas-filter-new__filters--maximize .nas-filter-new__airport-select{margin-right:3px;flex:auto}.nas-filter-new__filters--lg.nas-filter-new__filters--maximize .nas-filter-new__date-combo{border-bottom:3px solid #c3c3c3}.nas-filter-new__suggestions{flex-basis:100%;position:relative;margin-top:3px}.nas-filter-new__airport-select{order:0;flex:0 0 100%;position:relative}.nas-filter-new__airport-select--lg{width:0;margin:0 3px 0 0;flex:1 1 auto}.nas-filter-new__toggler{font-family:Apercu,Helvetica Neue,Helvetica,Arial,sans-serif;font-weight:400;font-size:18px;line-height:26px;color:#15273f;margin-top:6px;z-index:1}.nas-filter-new__toggler .nas-filter-new__toggle-action{cursor:pointer;margin-top:2px;float:right}.nas-filter-new__toggler .nas-filter-new__direct-only{display:inline-block}.travel-details{position:relative;margin:0;z-index:1}.travel-details__list{margin-top:12px}.travel-details__list-item{display:flex;align-items:center;justify-content:space-between;padding:6px 0 0}.travel-details__list-item:not(:last-child){padding:6px 0 9px;border-bottom:2px solid #f1f1f1}.travel-details__label{flex-grow:2;margin:0 6px 0 0}.travel-details__title{font-size:18px;line-height:26px;display:block;min-width:124px}.travel-details__title--small{font-size:16px;line-height:26px;margin:0}.travel-details__action{padding:12px;width:100%;background-color:#fff;font-weight:700}.travel-details__action:hover,.travel-details__action:focus{background-color:#f8f8f8}.travel-details__action--border{border-bottom:2px solid #f1f1f1}.travel-details__action:focus{outline:none;z-index:1}.travel-details__icon{margin-bottom:9px}.travel-details__dropdown{margin-right:0}.travel-details__dropdown:after{content:\"\";position:absolute;bottom:-3px;left:0px;width:100%;border-bottom:3px solid #c3c3c3}.travel-details__dropdown--trip-type{order:1;flex:1;margin-right:3px;margin-bottom:3px}.travel-details__dropdown--transit-type{order:2;flex:1;margin-bottom:3px}.travel-details__dropdown--passengers{order:3;flex:1 0 100%;margin-bottom:3px}.travel-details__dropdown--md.travel-details__dropdown--trip-type{order:2;flex:1;margin-right:3px}.travel-details__dropdown--md.travel-details__dropdown--transit-type{order:3;flex:1}.travel-details__dropdown--md.travel-details__dropdown--passengers{order:1;flex:1;margin-right:3px}.travel-details__dropdown--lg.travel-details__dropdown--trip-type{order:2;flex:1 1 auto;margin-right:3px}.travel-details__dropdown--lg.travel-details__dropdown--transit-type{order:3;flex:1 1 auto}.travel-details__dropdown--lg.travel-details__dropdown--passengers{order:1;flex:1 1 auto;margin-right:3px}.travel-details__dropdown--lg:focus{outline:none}.travel-details__dropdown--lg:after{display:none}.travel-details__transit-icon{position:relative;display:flex;justify-content:center;width:calc(100% - 48px);margin:12px auto;height:24px;background-color:inherit}.travel-details__transit-icon:before{content:\"\";position:absolute;height:2px;left:0;width:100%;top:calc(50% - 1px);background-color:currentColor}.travel-details__transit-icon:after{content:\"\";position:absolute;width:10px;height:10px;right:0;top:calc(50% - 5px);border-top:2px solid currentColor;border-right:2px solid currentColor;transform:rotate(45deg)}.travel-details__transit-icon-stop{position:relative;top:calc(50% - 5px);width:10px;height:10px;border:2px solid currentColor;border-radius:50%;background-color:inherit}.travel-details--combined{order:3;flex:0 0 100%}.travel-details--combined.travel-details--md:after{content:\"\";position:absolute;bottom:-6px;left:0px;width:100%;border-bottom:3px solid #c3c3c3}.travel-details--combined.travel-details--md .travel-details__dropdown{margin:0 3px 0 0}.travel-details--combined.travel-details--md .travel-details__dropdown:last-child{margin:0}.travel-details--combined.travel-details--md .dropdown__toggle{height:calc(100% - 3px);margin:0;padding-left:16px;padding-right:16px}.travel-details--combined.travel-details--lg{order:2;flex:0 0 auto;margin:0 0 0 -3px;padding-left:3px;z-index:2}.travel-details--combined.travel-details--lg:after{content:\"\";position:absolute;bottom:-3px;left:0px;width:100%;border-bottom:3px solid #c3c3c3}.travel-details--combined.travel-details--lg .dropdown__toggle{height:inherit}@media (min-width: 1000px){.travel-details--no-border:after{border-bottom:none}}::ng-deep .nas-passenger-select-new__list-item{padding:8px 16px!important}::ng-deep .nas-radio-new{margin:0!important}::ng-deep .nas-button-new{margin-top:6px}::ng-deep .nas-checkbox-new{background-color:#f1f1f1;padding:12px;width:100%;padding-left:42px!important;margin-bottom:12px!important}::ng-deep .nas-checkbox-new__indicator{left:12px!important}::ng-deep .nas-filter-new__filters .travel-details--no-border:after{display:none}::ng-deep .nas-filter-new__filters .nas-filter-new__date-combo .nas-datepicker__date-picker-wrapper{border-bottom:none!important}::ng-deep .nas-filter-new__filters .nas-filter-new__date-combo--side-by-side .nas-datepicker-combo-new__separator{display:block;border-bottom:none!important}::ng-deep .nas-filter-new__filters .nas-airport-select-new__input-line{border-top:none!important}::ng-deep .nas-filter-new__filters .nas-airport-select-new-combo__separator{border-bottom:none!important}::ng-deep .nas-filter-new__filters .nas-dropdown__toggle{height:64px!important}::ng-deep .nas-filter-new__filters .nas-datepicker-combo-new__separator{display:none}::ng-deep .nas-filter-new__filters--lg .nas-dropdown__toggle{display:flex}::ng-deep .nas-filter-new__filters--lg .nas-filter-new__date-combo .nas-datepicker__date-picker-wrapper{border-bottom:3px solid #c3c3c3}::ng-deep .nas-filter-new__filters--lg .nas-airport-select-new__input-line{border-top:3px solid #c3c3c3!important}::ng-deep .nas-filter-new__filters--lg .nas-datepicker-combo-new__separator{border-bottom:3px solid #c3c3c3!important}::ng-deep .nas-filter-new__filters--lg .nas-airport-select-new-combo__separator{border-bottom:3px solid #c3c3c3!important}::ng-deep .nas-filter-new__rotate{transform:rotate(180deg)}::ng-deep .nas-filter-new__rotate-enter,::ng-deep .nas-filter-new__rotate-leave-active{transform-origin:center top;transform-style:preserve-3d;-webkit-backface-visibility:hidden;backface-visibility:hidden}::ng-deep .nas-filter-new__rotate-enter{animation:flip-in .55s ease both}::ng-deep .nas-filter-new__rotate-leave-active{animation:flip-out .2s ease-out both}::ng-deep .nas-filter-new__airport-select--no-border .nas-airport-select-new__input-line{border-top:none}::ng-deep .nas-filter-new__airport-select--no-border .nas-airport-select-new-combo__separator{border-top:none}::ng-deep .nas-filter-new__airport-select--no-border .nas-airport-select-new__results-wrapper{margin-top:0}::ng-deep .nas-filter-new__airport-select--no-border .nas-airport-select-new__results{top:-3px}::ng-deep .nas-filter-new__airport-select--no-border .nas-airport-select-new__icon{bottom:18px}::ng-deep .nas-filter-new__airport-select--no-border .nas-airport-select-new:after{display:none}::ng-deep .nas-filter-new__airport-select .nas-airport-select-new__input-line{display:none}::ng-deep .nas-filter-new__airport-origin-select{width:100%;max-width:100%}::ng-deep .nas-filter-new__airport-origin-select .nas-airport-select-new:only-child{max-width:100%}@media (min-width: 640px){::ng-deep .nas-filter-new__airport-origin-select{max-width:360px;flex:auto;margin-right:3px}::ng-deep .nas-filter-new__airport-origin-select .nas-airport-select-new:only-child{width:auto;max-width:360px}}::ng-deep .nas-filter-new__origin-combined{border-bottom:3px solid #c3c3c3;order:3;flex:0 0 100%;display:flex;flex-wrap:wrap}@media (min-width: 1000px){::ng-deep .nas-filter-new__origin-combined{display:flex;flex:none}::ng-deep .nas-filter-new__origin-combined .nas-dropdown__toggle nas-icon{float:none!important}}::ng-deep .nas-filter-new__subsidy-discount{order:3}::ng-deep .nas-filter-new__subsidy-discount .nas-subsidy-discount{margin-top:16px}::ng-deep .nas-filter-new__subsidy-discount .nas-subsidy-discount__box{width:100%}\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: AccordionComponent, selector: "nas-accordion", inputs: ["expanded", "title", "badge", "icon", "simple", "spaced", "small", "inverted", "containerOnToggle", "nopadding", "transparent", "approve", "primary", "warning", "badgeInfo", "badgeSuccess", "badgeWarning", "badgeError", "cssClass", "cssStyle"], outputs: ["toggleChange"] }, { kind: "component", type: IconComponent, selector: "nas-icon", inputs: ["icon", "type", "isIndicator", "lightCircularBackground", "cssClass"] }, { kind: "directive", type: i3$1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i3$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "component", type: SubsidyDiscountComponent, selector: "nas-subsidy-discount", inputs: ["label", "icon", "selectedDiscount", "discounts"], outputs: ["infoButtonClick", "infoButtonKeydown", "discountSelectChange"] }, { kind: "component", type: SuggestionsComponent, selector: "nas-suggestions", inputs: ["suggestions", "orLabel"], outputs: ["airportSelect"] }, { kind: "component", type: AirportSelectNewComponent, selector: "nas-airport-select-new", inputs: ["airports", "airportRelations", "latestSearchesOrigin", "latestSearchesDestination", "closestAirports", "allowedOriginAiports", "allowedDestinationAirports", "displayLatestSearches", "displayClosestAirports", "combo", "useSwitch", "allAirportsLabel", "latestSearchesLabel", "closestAirportsLabel", "geolocationLabel", "geolocationBlockedLabel", "selectOriginFirstLabel", "invalidDestinationText", "labelOrigin", "placeholderOrigin", "labelDestination", "placeholderDestination", "keepSelection", "nasFormControlNameOrigin", "nasFormControlNameDestination", "nasFormGroup", "originAirportCode", "destinationAirportCode", "ariaLabelClear", "ariaLabelBackdrop"], outputs: ["originChange", "originOpenChange", "destinationChange", "destinationOpenChange", "focusOnNext", "positionChange"] }, { kind: "component", type: DatepickerComboNewComponent, selector: "nas-datepicker-combo-new", inputs: ["ariaLabelBackdrop", "outboundOpen", "inboundOpen", "noAvailableFlightsLabel", "availableFlightsLabel", "disablePastSelection", "outboundDisabled", "inboundDisabled", "outboundOnly", "outboundLabel", "inboundLabel", "availability", "outboundAvailableDates", "inboundAvailableDates", "times", "dateDisplayFormat", "timeDisplayFormat", "locale", "compact", "nasFormGroup", "nasFormControlNameOutbound", "nasFormControlNameInbound", "outboundSelectedDate", "inboundSelectedDate", "disableBackdrop", "outboundSelectedTime", "inboundSelectedTime", "ariaLabelPreviousMonth", "ariaLabelNextMonth", "inboundLowerLimitDateOffset", "inlineFlex"], outputs: ["outboundSelectedDateChange", "inboundSelectedDateChange", "outboundOpenChange", "inboundOpenChange", "outboundMonthChange", "inboundMonthChange", "focusOnNextChange", "focusOnPreviousChange"] }, { kind: "component", type: ButtonNewComponent, selector: "nas-button-new", inputs: ["primary", "secondary", "link", "light", "large", "block", "flex", "compact", "right", "spaceless", "href", "trackingvalue", "canContinueOnDisabled", "disabled", "type", "cssClass", "ariaLabel", "cssStyle", "tabindex", "overrideBaseCssClass", "useRouterLink", "id", "target", "icon", "iconLeft", "iconType", "buttonlink"], outputs: ["clickChange"] }, { kind: "component", type: PassengerSelectNewComponent, selector: "nas-passenger-select-new", inputs: ["passengers", "maxPaxCount", "minAdultCount", "groupBookingLimit", "title", "adultsLabel", "childrenLabel", "infantsLabel", "youthsLabel", "youngAdultsLabel", "groupBookingLabel", "nasFormGroup", "nasFormControlGroupBooking", "ariaLabelSubtract", "ariaLabelAdd"], outputs: ["passengersChange", "focusOnNext", "focusOnPrevious"] }, { kind: "component", type: RadioNewComponent, selector: "nas-radio-new", inputs: ["id", "value", "name", "error", "disabled", "strong", "block", "spaceless", "tabIndex", "required", "aria-label", "aria-describedby", "aria-labelledby", "checked", "nasFormControlName", "nasFormGroup"], outputs: ["checkedChange"] }] }); }
|
|
12514
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.5", type: FilterNewComponent, selector: "nas-filter-new", inputs: { airportRelations: "airportRelations", ariaLabelClear: "ariaLabelClear", ariaLabelSubtract: "ariaLabelSubtract", ariaLabelBackdrop: "ariaLabelBackdrop", ariaLabelAdd: "ariaLabelAdd", allowedOriginAirports: "allowedOriginAirports", allowedDestinationAirports: "allowedDestinationAirports", displayLatestSearches: "displayLatestSearches", useSwitch: "useSwitch", displayClosestAirports: "displayClosestAirports", originAirportCode: "originAirportCode", destinationAirportCode: "destinationAirportCode", passengerSelectLabel: "passengerSelectLabel", doneLabel: "doneLabel", maxPaxCount: "maxPaxCount", passengers: "passengers", minAdultCount: "minAdultCount", tripSwitchRoundTripLabel: "tripSwitchRoundTripLabel", tripSwitchOneWayLabel: "tripSwitchOneWayLabel", directOnlyLabel: "directOnlyLabel", directTransitLabel: "directTransitLabel", minimizeOnMobile: "minimizeOnMobile", expandedAccordionMobile: "expandedAccordionMobile", defaultSummarySeparator: "defaultSummarySeparator", lastSummarySeparator: "lastSummarySeparator", passengerSelectTitle: "passengerSelectTitle", passengerSelectAdultsLabel: "passengerSelectAdultsLabel", passengerSelectYouthsLabel: "passengerSelectYouthsLabel", passengerSelectYoungAdultsLabel: "passengerSelectYoungAdultsLabel", passengerSelectChildrenLabel: "passengerSelectChildrenLabel", passengerSelectInfantsLabel: "passengerSelectInfantsLabel", groupBookingLabel: "groupBookingLabel", allAirportsLabel: "allAirportsLabel", latestSearchesLabel: "latestSearchesLabel", closestAirportsLabel: "closestAirportsLabel", selectOriginFirstLabel: "selectOriginFirstLabel", labelOrigin: "labelOrigin", placeholderOrigin: "placeholderOrigin", labelDestination: "labelDestination", geolocationLabel: "geolocationLabel", geolocationBlockedLabel: "geolocationBlockedLabel", placeholderDestination: "placeholderDestination", keepSelection: "keepSelection", editSearchTitle: "editSearchTitle", nasFormGroup: "nasFormGroup", nasFormControlNameOrigin: "nasFormControlNameOrigin", nasFormControlNameDestination: "nasFormControlNameDestination", nasFormControlNameTripType: "nasFormControlNameTripType", nasFormControlNameDirectOnly: "nasFormControlNameDirectOnly", nasFormControlNameOutbound: "nasFormControlNameOutbound", nasFormControlNameInbound: "nasFormControlNameInbound", nasFormControlGroupBooking: "nasFormControlGroupBooking", nasFormControlNameSubsidyDiscount: "nasFormControlNameSubsidyDiscount", overrideOrigin: "overrideOrigin", enableSuggestions: "enableSuggestions", closestAirports: "closestAirports", minimize: "minimize", airports: "airports", tripType: "tripType", directOnly: "directOnly", groupBookingLimit: "groupBookingLimit", subsidyDiscounts: "subsidyDiscounts", selectedSubsidyDiscount: "selectedSubsidyDiscount", subsidyDiscountLabel: "subsidyDiscountLabel", ariaLabelPreviousMonth: "ariaLabelPreviousMonth", ariaLabelNextMonth: "ariaLabelNextMonth", noAvailableFlightsLabel: "noAvailableFlightsLabel", availableFlightsLabel: "availableFlightsLabel", disablePastSelection: "disablePastSelection", outboundLabel: "outboundLabel", inboundLabel: "inboundLabel", availability: "availability", outboundAvailableDates: "outboundAvailableDates", inboundAvailableDates: "inboundAvailableDates", times: "times", dateDisplayFormat: "dateDisplayFormat", timeDisplayFormat: "timeDisplayFormat", locale: "locale", compact: "compact", outboundDisabled: "outboundDisabled", inboundDisabled: "inboundDisabled", enableDatepickers: "enableDatepickers", minimizingLabel: "minimizingLabel", maximizingLabel: "maximizingLabel", directOnlyMobileLabel: "directOnlyMobileLabel", orLabel: "orLabel", passengersTitleLabel: "passengersTitleLabel", invalidDestinationText: "invalidDestinationText", outboundSelectedDate: "outboundSelectedDate", inboundSelectedDate: "inboundSelectedDate", enableDestinationSelect: "enableDestinationSelect", enablePassengersSelect: "enablePassengersSelect", enableTripSwitch: "enableTripSwitch", enableTransitSwitch: "enableTransitSwitch" }, outputs: { originOpenChange: "originOpenChange", destinationOpenChange: "destinationOpenChange", passengerSelectOpenChange: "passengerSelectOpenChange", originChange: "originChange", destinationChange: "destinationChange", passengersChange: "passengersChange", tripTypeChange: "tripTypeChange", directOnlyChange: "directOnlyChange", outboundSelectedDateChange: "outboundSelectedDateChange", inboundSelectedDateChange: "inboundSelectedDateChange", outboundOpenChange: "outboundOpenChange", inboundOpenChange: "inboundOpenChange", outboundMonthChange: "outboundMonthChange", inboundMonthChange: "inboundMonthChange", focusOnNextChange: "focusOnNextChange", positionChange: "positionChange", subsidyDiscountInfoClick: "subsidyDiscountInfoClick" }, viewQueries: [{ propertyName: "passengerSelectDropdown", first: true, predicate: ["passengerSelectDropdown"], descendants: true }, { propertyName: "passengerSelect", first: true, predicate: ["passengerSelect"], descendants: true }, { propertyName: "tripSwitch", first: true, predicate: ["tripSwitch"], descendants: true }, { propertyName: "transitSwitch", first: true, predicate: ["transitSwitch"], descendants: true }, { propertyName: "airportSelect", first: true, predicate: ["airportSelect"], descendants: true }, { propertyName: "datepickerCombo", first: true, predicate: ["datepickerCombo"], descendants: true }, { propertyName: "container", first: true, predicate: ["container"], descendants: true }, { propertyName: "tripTypeOneway", first: true, predicate: ["tripTypeOneway"], descendants: true }, { propertyName: "tripTypeRoundTrip", first: true, predicate: ["tripTypeRoundTrip"], descendants: true }, { propertyName: "transitTypeDirectOnly", first: true, predicate: ["transitTypeDirectOnly"], descendants: true }, { propertyName: "transitTypeTransit", first: true, predicate: ["transitTypeTransit"], descendants: true }, { propertyName: "subsidyDiscount", first: true, predicate: ["subsidyDiscount"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<nas-accordion *ngIf=\"deviceHelper?.isMobile() && exists(minimizeOnMobile); else filterTemplate\"\n simple\n containerOnToggle\n transparent\n [expanded]=\"expandedAccordionMobile\"\n [title]=\"editSearchTitle\"\n (toggleChange)=\"onAccordionToggleChange($event)\">\n <ng-container *ngTemplateOutlet=\"filterTemplate\"></ng-container>\n</nas-accordion>\n<div class=\"container\"\n *ngIf=\"deviceHelper?.isMobile() && exists(minimizeOnMobile) && displaySummary\">{{getSummary()}}</div>\n\n<ng-template #filterTemplate>\n <div #container\n [nasClass]=\"getContainerClass()\">\n <div [nasClass]=\"getFilterClass('filters', [exists(minimize) && 'minimized', maximize && 'maximize'])\">\n <ng-container *ngIf=\"airports?.length > 0\">\n <nas-airport-select-new *ngIf=\"airports && airportRelations && (enableDestinationSelect)\"\n #airportSelect\n combo\n [ariaLabelClear]=\"ariaLabelClear\" \n [ariaLabelBackdrop]=\"ariaLabelBackdrop\"\n [nasFormGroup]=\"nasFormGroup\"\n [nasFormControlNameOrigin]=\"nasFormControlNameOrigin\"\n [nasFormControlNameDestination]=\"nasFormControlNameDestination\"\n [useSwitch]=\"useSwitch\"\n [nasClass]=\"getAirportSelectClass()\"\n [airports]=\"airports\"\n [allowedOriginAiports]=\"allowedOriginAirports\"\n [allowedDestinationAirports]=\"allowedDestinationAirports\"\n [airportRelations]=\"airportRelations\"\n [latestSearchesOrigin]=\"latestSearchesOrigin\"\n [latestSearchesDestination]=\"latestSearchesDestination\"\n [displayLatestSearches]=\"displayLatestSearches\"\n [displayClosestAirports]=\"displayClosestAirports\"\n [originAirportCode]=\"originAirportCode\"\n [destinationAirportCode]=\"destinationAirportCode\"\n [allAirportsLabel]=\"allAirportsLabel\"\n [latestSearchesLabel]=\"latestSearchesLabel\"\n [closestAirportsLabel]=\"closestAirportsLabel\"\n [closestAirports]=\"closestAirports\"\n [selectOriginFirstLabel]=\"selectOriginFirstLabel\"\n [labelOrigin]=\"labelOrigin\"\n [placeholderOrigin]=\"placeholderOrigin\"\n [labelDestination]=\"labelDestination\"\n [geolocationLabel]=\"geolocationLabel\"\n [geolocationBlockedLabel]=\"geolocationBlockedLabel\"\n [placeholderDestination]=\"placeholderDestination\"\n [keepSelection]=\"keepSelection\"\n [invalidDestinationText]=\"invalidDestinationText\"\n (originChange)=\"setSelectedOriginAirport($event)\"\n (destinationChange)=\"onDestinationChange($event)\"\n (focusOnNext)=\"setFocusOnPassengerSelect($event)\"\n (originOpenChange)=\"onOriginOpen($event)\"\n (destinationOpenChange)=\"onDestinationOpen($event)\"\n (positionChange)=\"getClosestAirports($event)\"></nas-airport-select-new>\n <nas-airport-select-new *ngIf=\"airports && (!enableDestinationSelect)\"\n #airportSelect\n [ariaLabelClear]=\"ariaLabelClear\"\n [ariaLabelBackdrop]=\"ariaLabelBackdrop\"\n [nasFormGroup]=\"nasFormGroup\"\n [nasFormControlNameOrigin]=\"nasFormControlNameOrigin\"\n [useSwitch]=\"useSwitch\"\n [nasClass]=\"getClass('airport-origin-select')\"\n [airports]=\"airports\"\n [allowedOriginAiports]=\"allowedOriginAirports\"\n [airportRelations]=\"airportRelations\"\n [latestSearchesOrigin]=\"latestSearchesOrigin\"\n [displayLatestSearches]=\"displayLatestSearches\"\n [displayClosestAirports]=\"displayClosestAirports\"\n [originAirportCode]=\"originAirportCode\"\n [allAirportsLabel]=\"allAirportsLabel\"\n [latestSearchesLabel]=\"latestSearchesLabel\"\n [closestAirportsLabel]=\"closestAirportsLabel\"\n [closestAirports]=\"closestAirports\"\n [selectOriginFirstLabel]=\"selectOriginFirstLabel\"\n [labelOrigin]=\"labelOrigin\"\n [placeholderOrigin]=\"placeholderOrigin\"\n [geolocationLabel]=\"geolocationLabel\"\n [geolocationBlockedLabel]=\"geolocationBlockedLabel\"\n [keepSelection]=\"keepSelection\"\n (originChange)=\"setSelectedOriginAirport($event)\"\n (focusOnNext)=\"setFocusOnPassengerSelect($event)\"\n (originOpenChange)=\"onOriginOpen($event)\"\n (positionChange)=\"getClosestAirports($event)\"></nas-airport-select-new>\n <nas-suggestions *ngIf=\"(closestAirports || latestSearchesOrigin) && exists(enableSuggestions)\"\n [nasClass]=\"getFilterClass('suggestions')\"\n [suggestions]=\"getSuggestions()\"\n [orLabel]=\"orLabel\"\n (airportSelect)=\"setSelectedOriginAirport($event)\"></nas-suggestions>\n </ng-container>\n <ng-container *ngIf=\"shouldMaximize()\">\n <div [nasClass]=\"!enableDestinationSelect ? getClass('origin-combined') :\n getTravelDetailsClass('', ['combined', exists(enableDatepickers) && 'no-border', exists(minimize) && 'minimized'])\">\n <ng-container *ngIf=\"enablePassengersSelect\">\n <button (click)=\"onPassengerSelectOpen($event)\" [nasClass]=\"getClass('passengers-button', openPassengerSelect && 'active')\">\n <div [nasClass]=\"getClass('label')\">\n <p [nasClass]=\"getClass('button-title')\">{{passengersTitleLabel}}</p>\n <p>{{passengerSelectLabel}}</p>\n </div>\n <div [nasClass]=\"getClass('traveler-icon')\"><nas-icon [icon]=\"'my-profile-compact'\" [type]=\"'small'\"></nas-icon></div>\n </button>\n <div *ngIf=\"openPassengerSelect\">\n <nas-backdrop [ariaLabelBackdrop]=\"ariaLabelBackdrop\"\n [(showBackdrop)]=\"openPassengerSelect\"></nas-backdrop>\n <nas-passenger-select-new\n [ariaLabelAdd]=\"ariaLabelAdd\"\n [ariaLabelSubtract]=\"ariaLabelSubtract\"\n [adultsLabel]=\"passengerSelectAdultsLabel\"\n [youthsLabel]=\"passengerSelectYouthsLabel\"\n [youngAdultsLabel]=\"passengerSelectYoungAdultsLabel\"\n [childrenLabel]=\"passengerSelectChildrenLabel\"\n [infantsLabel]=\"passengerSelectInfantsLabel\"\n [maxPaxCount]=\"maxPaxCount\"\n [minAdultCount]=\"minAdultCount\"\n [title]=\"passengerSelectTitle\"\n [nasFormGroup]=\"nasFormGroup\"\n [nasFormControlGroupBooking]=\"nasFormControlGroupBooking\"\n [groupBookingLabel]=\"groupBookingLabel\"\n [groupBookingLimit]=\"groupBookingLimit\"\n (focusOnNext)=\"onPassengersSelectFocusOnNext()\"\n (focusOnPrevious)=\"onPassengersSelectFocusOnPrevious()\"\n [(passengers)]=\"passengers\"></nas-passenger-select-new>\n <nas-button-new *ngIf=\"this.openPassengerSelect\" light block \n [disabled]=\"passengers[0].count === 0 && passengers[1].count === 0 && passengers[2].count === 0\" (click)=\"openPassengerSelect = false\">\n {{doneLabel}}\n </nas-button-new>\n </div>\n </ng-container>\n <ng-container *ngIf=\"enableTripSwitch\">\n <form *ngIf=\"!openPassengerSelect\" [nasClass]=\"getClass('radio')\">\n <nas-radio-new #tripTypeRoundTrip [name]=\"'tripType'\" [value]=\"2\" [checked]=\"true\" (checkedChange)=\"onTripTypeChange(2)\">\n {{tripSwitchRoundTripLabel}}\n </nas-radio-new>\n <nas-radio-new #tripTypeOneway [name]=\"'tripType'\" [value]=\"1\" (checkedChange)=\"onTripTypeChange(1)\">\n {{tripSwitchOneWayLabel}}\n </nas-radio-new>\n </form>\n </ng-container>\n <div *ngIf=\"exists(enableDatepickers)\"\n [nasClass]=\"getDatePickersClass()\">\n <nas-datepicker-combo-new #datepickerCombo *ngIf=\"!openPassengerSelect\"\n compact\n [inlineFlex]=\"inlineFlex\"\n [nasFormGroup]=\"nasFormGroup\"\n [nasFormControlNameOutbound]=\"nasFormControlNameOutbound\"\n [nasFormControlNameInbound]=\"nasFormControlNameInbound\"\n [availability]=\"availability\"\n [availableFlightsLabel]=\"availableFlightsLabel\"\n [dateDisplayFormat]=\"dateDisplayFormat\"\n [disablePastSelection]=\"disablePastSelection\"\n [locale]=\"locale\"\n [noAvailableFlightsLabel]=\"noAvailableFlightsLabel\"\n [inboundAvailableDates]=\"inboundAvailableDates\"\n [inboundLabel]=\"inboundLabel\"\n [noAvailableFlightsLabel]=\"noAvailableFlightsLabel\"\n [outboundAvailableDates]=\"outboundAvailableDates\"\n [outboundLabel]=\"outboundLabel\"\n [timeDisplayFormat]=\"timeDisplayFormat\"\n [times]=\"times\"\n [outboundDisabled]=\"outboundDisabled\"\n [inboundDisabled]=\"inboundDisabled\"\n [outboundOnly]=\"tripType === 1\"\n [ariaLabelBackdrop]=\"ariaLabelBackdrop\"\n [ariaLabelPreviousMonth]=\"ariaLabelPreviousMonth\"\n [ariaLabelNextMonth]=\"ariaLabelNextMonth\"\n (focusOnNextChange)=\"onFocusOnNextChange($event)\"\n (focusOnPreviousChange)=\"onDatepickerFocusOnPrevious($event)\"\n (inboundMonthChange)=\"onInboundMonthChange($event)\"\n (outboundMonthChange)=\"onOutboundMonthChange($event)\"\n [(outboundOpen)]=\"outboundOpen\"\n [(inboundOpen)]=\"inboundOpen\"\n [(inboundSelectedDate)]=\"inboundSelectedDate\"\n [(outboundSelectedDate)]=\"outboundSelectedDate\">\n </nas-datepicker-combo-new>\n </div>\n <ng-container *ngIf=\"enableTransitSwitch\">\n <nas-button-new *ngIf=\"directOnlyLabel && directTransitLabel && !openPassengerSelect\"\n #transitSwitch\n block\n light\n [iconType]=\"'chevron-down'\"\n [label]=\"getTransitLabel()\"\n [nasClass]=\"getClass('transit', openTransitTypeSelect && 'active')\"\n [ariaLabelBackdrop]=\"ariaLabelBackdrop\"\n (click)=\"onTransitSwitchOpen($event)\"\n (keydown)=\"transitKeyDown($event)\">{{ getTransitLabel() }}\n </nas-button-new>\n <div *ngIf=\"openTransitTypeSelect\" [nasClass]=\"getClass('transit-type')\">\n <button [nasClass]=\"getTravelDetailsClass('action', directOnly && 'active')\"\n type=\"button\"\n #transitTypeDirectOnly\n (click)=\"onTransitChange(true)\">{{ directOnlyLabel }}\n </button>\n <button type=\"button\"\n #transitTypeTransit\n [nasClass]=\"getTravelDetailsClass('action', !directOnly && 'active')\"\n (click)=\"onTransitChange(false)\">{{ directTransitLabel }}\n </button>\n </div>\n </ng-container>\n </div>\n <div *ngIf=\"subsidyDiscounts && subsidyDiscounts.length > 0 && !openPassengerSelect\"\n [nasClass]=\"getFilterClass('subsidy-discount')\">\n <nas-subsidy-discount #subsidyDiscount\n [discounts]=\"subsidyDiscounts\"\n [selectedDiscount]=\"selectedSubsidyDiscount\"\n [label]=\"subsidyDiscountLabel\"\n (infoButtonClick)=\"onSubsidyDiscountInfoClick()\"\n (discountSelectChange)=\"onSubsidyDiscountSelectChange($event)\"\n (infoButtonKeydown)=\"onSubsidyDiscountInfoButtonKeydown($event)\"></nas-subsidy-discount>\n </div>\n </ng-container>\n </div>\n </div>\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-filter-new{position:relative;z-index:6}.nas-filter-new ::ng-deep .nas-filter-new__transit .nas-button-new--light{border:2px solid #15273f}.nas-filter-new ::ng-deep .nas-filter-new__transit .nas-button-new__content{gap:0;justify-content:space-between;font-weight:400}.nas-filter-new ::ng-deep .nas-filter-new__transit--active .nas-button-new__icon{transform:rotate(180deg)}.nas-filter-new ::ng-deep .nas-filter-new__transit--active .nas-button-new{background-color:#ebf4ff;border:2px solid #15273f}.nas-filter-new__title{margin-top:24px;font-size:28px;line-height:34px}@media screen and (min-width: 640px){.nas-filter-new__title{font-size:32px;line-height:38px}}.nas-filter-new__title--md{margin-top:60px}.nas-filter-new__radio{display:flex;gap:24px;padding:12px}.nas-filter-new__passengers-button{display:flex;justify-content:space-between;background-color:#fff;border:2px solid #15273f;padding:9px 14px;width:100%}.nas-filter-new__passengers-button--active{background-color:#ebf4ff!important;position:relative;z-index:3}.nas-filter-new__label{flex-direction:column;text-align:left}.nas-filter-new__label p{margin:0}.nas-filter-new__button-title{font-weight:700;font-size:14px}.nas-filter-new__traveler-icon{transform:scale(.85);margin-top:12px}.nas-filter-new__transit-type{border-left:2px solid #15273f;border-right:2px solid #15273f;border-bottom:2px solid #15273f}.nas-filter-new__transit-type button:first-child{border-bottom:2px solid #E9E7E4}.nas-filter-new__filters .nas-filter-new__date-combo{order:2;flex:1;z-index:2}.nas-filter-new__filters--minimized .nas-filter-new__airport-select:after{content:\"\";position:absolute;bottom:-3px;left:0px;width:100%;border-bottom:3px solid #c3c3c3}.nas-filter-new__filters--maximize .nas-filter-new__airport-select-new:after{display:none}.nas-filter-new__filters--md .nas-filter-new__date-combo{flex:0 0 100%}.nas-filter-new__filters--lg{align-items:stretch}.nas-filter-new__filters--lg .nas-filter-new__date-combo{order:3;flex:0 0 100%;z-index:1}.nas-filter-new__filters--lg .nas-filter-new__suggestions{order:3}.nas-filter-new__filters--lg .nas-filter-new__filters--minimized .nas-filter-new__airport-select{margin-right:0;flex:0 1 100%}.nas-filter-new__filters--lg .nas-filter-new__filters--maximize .nas-filter-new__airport-select{margin-right:3px;flex:auto}.nas-filter-new__filters--lg.nas-filter-new__filters--maximize .nas-filter-new__date-combo{border-bottom:3px solid #c3c3c3}.nas-filter-new__suggestions{flex-basis:100%;position:relative;margin-top:3px}.nas-filter-new__airport-select{order:0;flex:0 0 100%;position:relative}.nas-filter-new__airport-select--lg{width:0;margin:0 3px 0 0;flex:1 1 auto}.nas-filter-new__toggler{font-family:Apercu,Helvetica Neue,Helvetica,Arial,sans-serif;font-weight:400;font-size:18px;line-height:26px;color:#15273f;margin-top:6px;z-index:1}.nas-filter-new__toggler .nas-filter-new__toggle-action{cursor:pointer;margin-top:2px;float:right}.nas-filter-new__toggler .nas-filter-new__direct-only{display:inline-block}.travel-details{position:relative;margin:0;z-index:1}.travel-details__list{margin-top:12px}.travel-details__list-item{display:flex;align-items:center;justify-content:space-between;padding:6px 0 0}.travel-details__list-item:not(:last-child){padding:6px 0 9px;border-bottom:2px solid #f1f1f1}.travel-details__label{flex-grow:2;margin:0 6px 0 0}.travel-details__title{font-size:18px;line-height:26px;display:block;min-width:124px}.travel-details__title--small{font-size:16px;line-height:26px;margin:0}.travel-details__action{padding:12px;width:100%;background-color:#fff;font-weight:700}.travel-details__action:hover,.travel-details__action:focus{background-color:#f8f8f8}.travel-details__action--border{border-bottom:2px solid #f1f1f1}.travel-details__action:focus{outline:none;z-index:1}.travel-details__icon{margin-bottom:9px}.travel-details__dropdown{margin-right:0}.travel-details__dropdown:after{content:\"\";position:absolute;bottom:-3px;left:0px;width:100%;border-bottom:3px solid #c3c3c3}.travel-details__dropdown--trip-type{order:1;flex:1;margin-right:3px;margin-bottom:3px}.travel-details__dropdown--transit-type{order:2;flex:1;margin-bottom:3px}.travel-details__dropdown--passengers{order:3;flex:1 0 100%;margin-bottom:3px}.travel-details__dropdown--md.travel-details__dropdown--trip-type{order:2;flex:1;margin-right:3px}.travel-details__dropdown--md.travel-details__dropdown--transit-type{order:3;flex:1}.travel-details__dropdown--md.travel-details__dropdown--passengers{order:1;flex:1;margin-right:3px}.travel-details__dropdown--lg.travel-details__dropdown--trip-type{order:2;flex:1 1 auto;margin-right:3px}.travel-details__dropdown--lg.travel-details__dropdown--transit-type{order:3;flex:1 1 auto}.travel-details__dropdown--lg.travel-details__dropdown--passengers{order:1;flex:1 1 auto;margin-right:3px}.travel-details__dropdown--lg:focus{outline:none}.travel-details__dropdown--lg:after{display:none}.travel-details__transit-icon{position:relative;display:flex;justify-content:center;width:calc(100% - 48px);margin:12px auto;height:24px;background-color:inherit}.travel-details__transit-icon:before{content:\"\";position:absolute;height:2px;left:0;width:100%;top:calc(50% - 1px);background-color:currentColor}.travel-details__transit-icon:after{content:\"\";position:absolute;width:10px;height:10px;right:0;top:calc(50% - 5px);border-top:2px solid currentColor;border-right:2px solid currentColor;transform:rotate(45deg)}.travel-details__transit-icon-stop{position:relative;top:calc(50% - 5px);width:10px;height:10px;border:2px solid currentColor;border-radius:50%;background-color:inherit}.travel-details--combined{order:3;flex:0 0 100%}.travel-details--combined.travel-details--md:after{content:\"\";position:absolute;bottom:-6px;left:0px;width:100%;border-bottom:3px solid #c3c3c3}.travel-details--combined.travel-details--md .travel-details__dropdown{margin:0 3px 0 0}.travel-details--combined.travel-details--md .travel-details__dropdown:last-child{margin:0}.travel-details--combined.travel-details--md .dropdown__toggle{height:calc(100% - 3px);margin:0;padding-left:16px;padding-right:16px}.travel-details--combined.travel-details--lg{order:2;flex:0 0 auto;margin:0 0 0 -3px;padding-left:3px;z-index:2}.travel-details--combined.travel-details--lg:after{content:\"\";position:absolute;bottom:-3px;left:0px;width:100%;border-bottom:3px solid #c3c3c3}.travel-details--combined.travel-details--lg .dropdown__toggle{height:inherit}@media (min-width: 1000px){.travel-details--no-border:after{border-bottom:none}}::ng-deep .nas-passenger-select-new__list-item{padding:8px 16px!important}::ng-deep .nas-radio-new{margin:0!important}::ng-deep .nas-button-new{margin-top:6px}::ng-deep .nas-checkbox-new{background-color:#f1f1f1;padding:12px;width:100%;padding-left:42px!important;margin-bottom:12px!important}::ng-deep .nas-checkbox-new__indicator{left:12px!important}::ng-deep .nas-filter-new__filters .travel-details--no-border:after{display:none}::ng-deep .nas-filter-new__filters .nas-filter-new__date-combo .nas-datepicker__date-picker-wrapper{border-bottom:none!important}::ng-deep .nas-filter-new__filters .nas-filter-new__date-combo--side-by-side .nas-datepicker-combo-new__separator{display:block;border-bottom:none!important}::ng-deep .nas-filter-new__filters .nas-airport-select-new__input-line{border-top:none!important}::ng-deep .nas-filter-new__filters .nas-airport-select-new-combo__separator{border-bottom:none!important}::ng-deep .nas-filter-new__filters .nas-dropdown__toggle{height:64px!important}::ng-deep .nas-filter-new__filters .nas-datepicker-combo-new__separator{display:none}::ng-deep .nas-filter-new__filters--lg .nas-dropdown__toggle{display:flex}::ng-deep .nas-filter-new__filters--lg .nas-filter-new__date-combo .nas-datepicker__date-picker-wrapper{border-bottom:3px solid #c3c3c3}::ng-deep .nas-filter-new__filters--lg .nas-airport-select-new__input-line{border-top:3px solid #c3c3c3!important}::ng-deep .nas-filter-new__filters--lg .nas-datepicker-combo-new__separator{border-bottom:3px solid #c3c3c3!important}::ng-deep .nas-filter-new__filters--lg .nas-airport-select-new-combo__separator{border-bottom:3px solid #c3c3c3!important}::ng-deep .nas-filter-new__rotate{transform:rotate(180deg)}::ng-deep .nas-filter-new__rotate-enter,::ng-deep .nas-filter-new__rotate-leave-active{transform-origin:center top;transform-style:preserve-3d;-webkit-backface-visibility:hidden;backface-visibility:hidden}::ng-deep .nas-filter-new__rotate-enter{animation:flip-in .55s ease both}::ng-deep .nas-filter-new__rotate-leave-active{animation:flip-out .2s ease-out both}::ng-deep .nas-filter-new__airport-select--no-border .nas-airport-select-new__input-line{border-top:none}::ng-deep .nas-filter-new__airport-select--no-border .nas-airport-select-new-combo__separator{border-top:none}::ng-deep .nas-filter-new__airport-select--no-border .nas-airport-select-new__results-wrapper{margin-top:0}::ng-deep .nas-filter-new__airport-select--no-border .nas-airport-select-new__results{top:-3px}::ng-deep .nas-filter-new__airport-select--no-border .nas-airport-select-new__icon{bottom:18px}::ng-deep .nas-filter-new__airport-select--no-border .nas-airport-select-new:after{display:none}::ng-deep .nas-filter-new__airport-select .nas-airport-select-new__input-line{display:none}::ng-deep .nas-filter-new__airport-origin-select{width:100%;max-width:100%}::ng-deep .nas-filter-new__airport-origin-select .nas-airport-select-new:only-child{max-width:100%}@media (min-width: 640px){::ng-deep .nas-filter-new__airport-origin-select{max-width:360px;flex:auto;margin-right:3px}::ng-deep .nas-filter-new__airport-origin-select .nas-airport-select-new:only-child{width:auto;max-width:360px}}::ng-deep .nas-filter-new__origin-combined{border-bottom:3px solid #c3c3c3;order:3;flex:0 0 100%;display:flex;flex-wrap:wrap}@media (min-width: 1000px){::ng-deep .nas-filter-new__origin-combined{display:flex;flex:none}::ng-deep .nas-filter-new__origin-combined .nas-dropdown__toggle nas-icon{float:none!important}}::ng-deep .nas-filter-new__subsidy-discount{order:3}::ng-deep .nas-filter-new__subsidy-discount .nas-subsidy-discount{margin-top:16px}::ng-deep .nas-filter-new__subsidy-discount .nas-subsidy-discount__box{width:100%}::ng-deep .nas-filter-new__backdrop{display:block;position:fixed;z-index:2;top:0;left:0;width:100%;height:100%;color:transparent;background-color:#0b14202b;animation:passenger-backdrop .7s ease-out both}@keyframes passenger-backdrop{0%{opacity: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: AccordionComponent, selector: "nas-accordion", inputs: ["expanded", "title", "badge", "icon", "simple", "spaced", "small", "inverted", "containerOnToggle", "nopadding", "transparent", "approve", "primary", "warning", "badgeInfo", "badgeSuccess", "badgeWarning", "badgeError", "cssClass", "cssStyle"], outputs: ["toggleChange"] }, { kind: "component", type: IconComponent, selector: "nas-icon", inputs: ["icon", "type", "isIndicator", "lightCircularBackground", "cssClass"] }, { kind: "directive", type: i3$1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i3$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "component", type: SubsidyDiscountComponent, selector: "nas-subsidy-discount", inputs: ["label", "icon", "selectedDiscount", "discounts"], outputs: ["infoButtonClick", "infoButtonKeydown", "discountSelectChange"] }, { kind: "component", type: SuggestionsComponent, selector: "nas-suggestions", inputs: ["suggestions", "orLabel"], outputs: ["airportSelect"] }, { kind: "component", type: AirportSelectNewComponent, selector: "nas-airport-select-new", inputs: ["airports", "airportRelations", "latestSearchesOrigin", "latestSearchesDestination", "closestAirports", "allowedOriginAiports", "allowedDestinationAirports", "displayLatestSearches", "displayClosestAirports", "combo", "useSwitch", "allAirportsLabel", "latestSearchesLabel", "closestAirportsLabel", "geolocationLabel", "geolocationBlockedLabel", "selectOriginFirstLabel", "invalidDestinationText", "labelOrigin", "placeholderOrigin", "labelDestination", "placeholderDestination", "keepSelection", "nasFormControlNameOrigin", "nasFormControlNameDestination", "nasFormGroup", "originAirportCode", "destinationAirportCode", "ariaLabelClear", "ariaLabelBackdrop"], outputs: ["originChange", "originOpenChange", "destinationChange", "destinationOpenChange", "focusOnNext", "positionChange"] }, { kind: "component", type: DatepickerComboNewComponent, selector: "nas-datepicker-combo-new", inputs: ["ariaLabelBackdrop", "outboundOpen", "inboundOpen", "noAvailableFlightsLabel", "availableFlightsLabel", "disablePastSelection", "outboundDisabled", "inboundDisabled", "outboundOnly", "outboundLabel", "inboundLabel", "timepickerLabel", "availability", "outboundAvailableDates", "inboundAvailableDates", "times", "dateDisplayFormat", "timeDisplayFormat", "locale", "compact", "nasFormGroup", "nasFormControlNameOutbound", "nasFormControlNameInbound", "outboundSelectedDate", "inboundSelectedDate", "disableBackdrop", "outboundSelectedTime", "inboundSelectedTime", "ariaLabelPreviousMonth", "ariaLabelNextMonth", "inboundLowerLimitDateOffset", "inlineFlex"], outputs: ["outboundSelectedDateChange", "inboundSelectedDateChange", "outboundOpenChange", "inboundOpenChange", "outboundMonthChange", "inboundMonthChange", "focusOnNextChange", "focusOnPreviousChange"] }, { kind: "component", type: ButtonNewComponent, selector: "nas-button-new", inputs: ["primary", "secondary", "link", "light", "large", "block", "flex", "compact", "right", "spaceless", "href", "trackingvalue", "canContinueOnDisabled", "disabled", "type", "cssClass", "ariaLabel", "cssStyle", "tabindex", "overrideBaseCssClass", "useRouterLink", "id", "target", "icon", "iconLeft", "iconType", "buttonlink"], outputs: ["clickChange"] }, { kind: "component", type: PassengerSelectNewComponent, selector: "nas-passenger-select-new", inputs: ["passengers", "maxPaxCount", "minAdultCount", "groupBookingLimit", "title", "adultsLabel", "childrenLabel", "infantsLabel", "youthsLabel", "youngAdultsLabel", "groupBookingLabel", "nasFormGroup", "nasFormControlGroupBooking", "ariaLabelSubtract", "ariaLabelAdd"], outputs: ["passengersChange", "focusOnNext", "focusOnPrevious"] }, { kind: "component", type: RadioNewComponent, selector: "nas-radio-new", inputs: ["id", "value", "name", "error", "disabled", "strong", "block", "spaceless", "tabIndex", "required", "aria-label", "aria-describedby", "aria-labelledby", "checked", "nasFormControlName", "nasFormGroup"], outputs: ["checkedChange"] }, { kind: "component", type: BackdropComponent, selector: "nas-backdrop", inputs: ["showBackdrop", "ariaLabelBackdrop"], outputs: ["showBackdropChange"] }] }); }
|
|
12515
12515
|
}
|
|
12516
12516
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.5", ngImport: i0, type: FilterNewComponent, decorators: [{
|
|
12517
12517
|
type: Component,
|
|
12518
|
-
args: [{ selector: 'nas-filter-new', template: "<nas-accordion *ngIf=\"deviceHelper?.isMobile() && exists(minimizeOnMobile); else filterTemplate\"\n simple\n containerOnToggle\n transparent\n [expanded]=\"expandedAccordionMobile\"\n [title]=\"editSearchTitle\"\n (toggleChange)=\"onAccordionToggleChange($event)\">\n <ng-container *ngTemplateOutlet=\"filterTemplate\"></ng-container>\n</nas-accordion>\n<div class=\"container\"\n *ngIf=\"deviceHelper?.isMobile() && exists(minimizeOnMobile) && displaySummary\">{{getSummary()}}</div>\n\n<ng-template #filterTemplate>\n <div #container\n [nasClass]=\"getContainerClass()\">\n <div [nasClass]=\"getFilterClass('filters', [exists(minimize) && 'minimized', maximize && 'maximize'])\">\n <ng-container *ngIf=\"airports?.length > 0\">\n <nas-airport-select-new *ngIf=\"airports && airportRelations && (enableDestinationSelect)\"\n #airportSelect\n combo\n [ariaLabelClear]=\"ariaLabelClear\" \n [ariaLabelBackdrop]=\"ariaLabelBackdrop\"\n [nasFormGroup]=\"nasFormGroup\"\n [nasFormControlNameOrigin]=\"nasFormControlNameOrigin\"\n [nasFormControlNameDestination]=\"nasFormControlNameDestination\"\n [useSwitch]=\"useSwitch\"\n [nasClass]=\"getAirportSelectClass()\"\n [airports]=\"airports\"\n [allowedOriginAiports]=\"allowedOriginAirports\"\n [allowedDestinationAirports]=\"allowedDestinationAirports\"\n [airportRelations]=\"airportRelations\"\n [latestSearchesOrigin]=\"latestSearchesOrigin\"\n [latestSearchesDestination]=\"latestSearchesDestination\"\n [displayLatestSearches]=\"displayLatestSearches\"\n [displayClosestAirports]=\"displayClosestAirports\"\n [originAirportCode]=\"originAirportCode\"\n [destinationAirportCode]=\"destinationAirportCode\"\n [allAirportsLabel]=\"allAirportsLabel\"\n [latestSearchesLabel]=\"latestSearchesLabel\"\n [closestAirportsLabel]=\"closestAirportsLabel\"\n [closestAirports]=\"closestAirports\"\n [selectOriginFirstLabel]=\"selectOriginFirstLabel\"\n [labelOrigin]=\"labelOrigin\"\n [placeholderOrigin]=\"placeholderOrigin\"\n [labelDestination]=\"labelDestination\"\n [geolocationLabel]=\"geolocationLabel\"\n [geolocationBlockedLabel]=\"geolocationBlockedLabel\"\n [placeholderDestination]=\"placeholderDestination\"\n [keepSelection]=\"keepSelection\"\n [invalidDestinationText]=\"invalidDestinationText\"\n (originChange)=\"setSelectedOriginAirport($event)\"\n (destinationChange)=\"onDestinationChange($event)\"\n (focusOnNext)=\"setFocusOnPassengerSelect($event)\"\n (originOpenChange)=\"onOriginOpen($event)\"\n (destinationOpenChange)=\"onDestinationOpen($event)\"\n (positionChange)=\"getClosestAirports($event)\"></nas-airport-select-new>\n <nas-airport-select-new *ngIf=\"airports && (!enableDestinationSelect)\"\n #airportSelect\n [ariaLabelClear]=\"ariaLabelClear\"\n [ariaLabelBackdrop]=\"ariaLabelBackdrop\"\n [nasFormGroup]=\"nasFormGroup\"\n [nasFormControlNameOrigin]=\"nasFormControlNameOrigin\"\n [useSwitch]=\"useSwitch\"\n [nasClass]=\"getClass('airport-origin-select')\"\n [airports]=\"airports\"\n [allowedOriginAiports]=\"allowedOriginAirports\"\n [airportRelations]=\"airportRelations\"\n [latestSearchesOrigin]=\"latestSearchesOrigin\"\n [displayLatestSearches]=\"displayLatestSearches\"\n [displayClosestAirports]=\"displayClosestAirports\"\n [originAirportCode]=\"originAirportCode\"\n [allAirportsLabel]=\"allAirportsLabel\"\n [latestSearchesLabel]=\"latestSearchesLabel\"\n [closestAirportsLabel]=\"closestAirportsLabel\"\n [closestAirports]=\"closestAirports\"\n [selectOriginFirstLabel]=\"selectOriginFirstLabel\"\n [labelOrigin]=\"labelOrigin\"\n [placeholderOrigin]=\"placeholderOrigin\"\n [geolocationLabel]=\"geolocationLabel\"\n [geolocationBlockedLabel]=\"geolocationBlockedLabel\"\n [keepSelection]=\"keepSelection\"\n (originChange)=\"setSelectedOriginAirport($event)\"\n (focusOnNext)=\"setFocusOnPassengerSelect($event)\"\n (originOpenChange)=\"onOriginOpen($event)\"\n (positionChange)=\"getClosestAirports($event)\"></nas-airport-select-new>\n <nas-suggestions *ngIf=\"(closestAirports || latestSearchesOrigin) && exists(enableSuggestions)\"\n [nasClass]=\"getFilterClass('suggestions')\"\n [suggestions]=\"getSuggestions()\"\n [orLabel]=\"orLabel\"\n (airportSelect)=\"setSelectedOriginAirport($event)\"></nas-suggestions>\n </ng-container>\n <ng-container *ngIf=\"shouldMaximize()\">\n <div [nasClass]=\"!enableDestinationSelect ? getClass('origin-combined') :\n getTravelDetailsClass('', ['combined', exists(enableDatepickers) && 'no-border', exists(minimize) && 'minimized'])\">\n <ng-container *ngIf=\"enablePassengersSelect\">\n <button (click)=\"onPassengerSelectOpen($event)\" [nasClass]=\"getClass('passengers-button', openPassengerSelect && 'active')\">\n <div [nasClass]=\"getClass('label')\">\n <p [nasClass]=\"getClass('button-title')\">{{passengersTitleLabel}}</p>\n <p>{{passengerSelectLabel}}</p>\n </div>\n <div [nasClass]=\"getClass('traveler-icon')\"><nas-icon [icon]=\"'my-profile-compact'\" [type]=\"'small'\"></nas-icon></div>\n </button>\n <!-- <nas-dropdown #passengerSelectDropdown\n *ngIf=\"passengers?.length > 0\"\n [nasClass]=\"getTravelDetailsClass('dropdown', 'passengers')\"\n [cssClass]=\"getTravelDetailsClass('dropdown')\"\n [label]=\"passengerSelectLabel\"\n [labelStyle]=\"{'width': '102px'}\"\n [ariaLabelBackdrop]=\"ariaLabelBackdrop\"\n (openChange)=\"onPassengerSelectOpen($event)\"\n (keydown)=\"passengerKeyDown($event)\"> -->\n <div *ngIf=\"openPassengerSelect\">\n <nas-passenger-select-new\n [ariaLabelAdd]=\"ariaLabelAdd\"\n [ariaLabelSubtract]=\"ariaLabelSubtract\"\n [adultsLabel]=\"passengerSelectAdultsLabel\"\n [youthsLabel]=\"passengerSelectYouthsLabel\"\n [youngAdultsLabel]=\"passengerSelectYoungAdultsLabel\"\n [childrenLabel]=\"passengerSelectChildrenLabel\"\n [infantsLabel]=\"passengerSelectInfantsLabel\"\n [maxPaxCount]=\"maxPaxCount\"\n [minAdultCount]=\"minAdultCount\"\n [title]=\"passengerSelectTitle\"\n [nasFormGroup]=\"nasFormGroup\"\n [nasFormControlGroupBooking]=\"nasFormControlGroupBooking\"\n [groupBookingLabel]=\"groupBookingLabel\"\n [groupBookingLimit]=\"groupBookingLimit\"\n (focusOnNext)=\"onPassengersSelectFocusOnNext()\"\n (focusOnPrevious)=\"onPassengersSelectFocusOnPrevious()\"\n [(passengers)]=\"passengers\"></nas-passenger-select-new>\n <nas-button-new *ngIf=\"this.openPassengerSelect\" light block \n [disabled]=\"passengers[0].count === 0 && passengers[1].count === 0 && passengers[2].count === 0\" (click)=\"openPassengerSelect = false\">\n Done\n </nas-button-new>\n </div>\n </ng-container>\n <ng-container *ngIf=\"enableTripSwitch\">\n <form [nasClass]=\"getClass('radio')\">\n <nas-radio-new #tripTypeRoundTrip [name]=\"'tripType'\" [value]=\"2\" [checked]=\"true\" (checkedChange)=\"onTripTypeChange(2)\">\n {{tripSwitchRoundTripLabel}}\n </nas-radio-new>\n <nas-radio-new #tripTypeOneway [name]=\"'tripType'\" [value]=\"1\" (checkedChange)=\"onTripTypeChange(1)\">\n {{tripSwitchOneWayLabel}}\n </nas-radio-new>\n </form>\n </ng-container>\n <div *ngIf=\"exists(enableDatepickers)\"\n [nasClass]=\"getDatePickersClass()\">\n <nas-datepicker-combo-new #datepickerCombo\n compact\n [inlineFlex]=\"inlineFlex\"\n [nasFormGroup]=\"nasFormGroup\"\n [nasFormControlNameOutbound]=\"nasFormControlNameOutbound\"\n [nasFormControlNameInbound]=\"nasFormControlNameInbound\"\n [availability]=\"availability\"\n [availableFlightsLabel]=\"availableFlightsLabel\"\n [dateDisplayFormat]=\"dateDisplayFormat\"\n [disablePastSelection]=\"disablePastSelection\"\n [locale]=\"locale\"\n [noAvailableFlightsLabel]=\"noAvailableFlightsLabel\"\n [inboundAvailableDates]=\"inboundAvailableDates\"\n [inboundLabel]=\"inboundLabel\"\n [noAvailableFlightsLabel]=\"noAvailableFlightsLabel\"\n [outboundAvailableDates]=\"outboundAvailableDates\"\n [outboundLabel]=\"outboundLabel\"\n [timeDisplayFormat]=\"timeDisplayFormat\"\n [times]=\"times\"\n [outboundDisabled]=\"outboundDisabled\"\n [inboundDisabled]=\"inboundDisabled\"\n [outboundOnly]=\"tripType === 1\"\n [ariaLabelBackdrop]=\"ariaLabelBackdrop\"\n [ariaLabelPreviousMonth]=\"ariaLabelPreviousMonth\"\n [ariaLabelNextMonth]=\"ariaLabelNextMonth\"\n (focusOnNextChange)=\"onFocusOnNextChange($event)\"\n (focusOnPreviousChange)=\"onDatepickerFocusOnPrevious($event)\"\n (inboundMonthChange)=\"onInboundMonthChange($event)\"\n (outboundMonthChange)=\"onOutboundMonthChange($event)\"\n [(outboundOpen)]=\"outboundOpen\"\n [(inboundOpen)]=\"inboundOpen\"\n [(inboundSelectedDate)]=\"inboundSelectedDate\"\n [(outboundSelectedDate)]=\"outboundSelectedDate\">\n </nas-datepicker-combo-new>\n </div>\n <ng-container *ngIf=\"enableTransitSwitch\">\n <nas-button-new *ngIf=\"directOnlyLabel && directTransitLabel\"\n #transitSwitch\n block\n light\n [iconType]=\"'chevron-down'\"\n [label]=\"getTransitLabel()\"\n [nasClass]=\"getClass('transit', openTransitTypeSelect && 'active')\"\n [ariaLabelBackdrop]=\"ariaLabelBackdrop\"\n (click)=\"onTransitSwitchOpen($event)\"\n (keydown)=\"transitKeyDown($event)\">{{ getTransitLabel() }}\n </nas-button-new>\n <div *ngIf=\"openTransitTypeSelect\" [nasClass]=\"getClass('transit-type')\">\n <button [nasClass]=\"getTravelDetailsClass('action', directOnly && 'active')\"\n type=\"button\"\n #transitTypeDirectOnly\n (click)=\"onTransitChange(true)\">{{ directOnlyLabel }}\n </button>\n <button type=\"button\"\n #transitTypeTransit\n [nasClass]=\"getTravelDetailsClass('action', !directOnly && 'active')\"\n (click)=\"onTransitChange(false)\">{{ directTransitLabel }}\n </button>\n </div>\n </ng-container>\n </div>\n <div *ngIf=\"subsidyDiscounts && subsidyDiscounts.length > 0\"\n [nasClass]=\"getFilterClass('subsidy-discount')\">\n <nas-subsidy-discount #subsidyDiscount\n [discounts]=\"subsidyDiscounts\"\n [selectedDiscount]=\"selectedSubsidyDiscount\"\n [label]=\"subsidyDiscountLabel\"\n (infoButtonClick)=\"onSubsidyDiscountInfoClick()\"\n (discountSelectChange)=\"onSubsidyDiscountSelectChange($event)\"\n (infoButtonKeydown)=\"onSubsidyDiscountInfoButtonKeydown($event)\"></nas-subsidy-discount>\n </div>\n </ng-container>\n </div>\n </div>\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-filter-new{position:relative;z-index:6}.nas-filter-new ::ng-deep .nas-filter-new__transit .nas-button-new--light{border:2px solid #15273f}.nas-filter-new ::ng-deep .nas-filter-new__transit .nas-button-new__content{gap:0;justify-content:space-between;font-weight:400}.nas-filter-new ::ng-deep .nas-filter-new__transit--active .nas-button-new__icon{transform:rotate(180deg)}.nas-filter-new ::ng-deep .nas-filter-new__transit--active .nas-button-new{background-color:#ebf4ff;border:2px solid #15273f}.nas-filter-new__title{margin-top:24px;font-size:28px;line-height:34px}@media screen and (min-width: 640px){.nas-filter-new__title{font-size:32px;line-height:38px}}.nas-filter-new__title--md{margin-top:60px}.nas-filter-new__radio{display:flex;gap:24px;padding:12px}.nas-filter-new__passengers-button{display:flex;justify-content:space-between;background-color:#fff;border:2px solid #15273f;padding:9px 14px;width:100%}.nas-filter-new__passengers-button--active{background-color:#ebf4ff!important}.nas-filter-new__label{flex-direction:column;text-align:left}.nas-filter-new__label p{margin:0}.nas-filter-new__button-title{font-weight:700;font-size:14px}.nas-filter-new__traveler-icon{transform:scale(.85);margin-top:12px}.nas-filter-new__transit-type{border-left:2px solid #15273f;border-right:2px solid #15273f;border-bottom:2px solid #15273f}.nas-filter-new__transit-type button:first-child{border-bottom:2px solid #E9E7E4}.nas-filter-new__filters{margin-top:12px}.nas-filter-new__filters .nas-filter-new__date-combo{order:2;flex:1;z-index:2}.nas-filter-new__filters--minimized .nas-filter-new__airport-select:after{content:\"\";position:absolute;bottom:-3px;left:0px;width:100%;border-bottom:3px solid #c3c3c3}.nas-filter-new__filters--maximize .nas-filter-new__airport-select-new:after{display:none}.nas-filter-new__filters--md .nas-filter-new__date-combo{flex:0 0 100%}.nas-filter-new__filters--lg{align-items:stretch}.nas-filter-new__filters--lg .nas-filter-new__date-combo{order:3;flex:0 0 100%;z-index:1}.nas-filter-new__filters--lg .nas-filter-new__suggestions{order:3}.nas-filter-new__filters--lg .nas-filter-new__filters--minimized .nas-filter-new__airport-select{margin-right:0;flex:0 1 100%}.nas-filter-new__filters--lg .nas-filter-new__filters--maximize .nas-filter-new__airport-select{margin-right:3px;flex:auto}.nas-filter-new__filters--lg.nas-filter-new__filters--maximize .nas-filter-new__date-combo{border-bottom:3px solid #c3c3c3}.nas-filter-new__suggestions{flex-basis:100%;position:relative;margin-top:3px}.nas-filter-new__airport-select{order:0;flex:0 0 100%;position:relative}.nas-filter-new__airport-select--lg{width:0;margin:0 3px 0 0;flex:1 1 auto}.nas-filter-new__toggler{font-family:Apercu,Helvetica Neue,Helvetica,Arial,sans-serif;font-weight:400;font-size:18px;line-height:26px;color:#15273f;margin-top:6px;z-index:1}.nas-filter-new__toggler .nas-filter-new__toggle-action{cursor:pointer;margin-top:2px;float:right}.nas-filter-new__toggler .nas-filter-new__direct-only{display:inline-block}.travel-details{position:relative;margin:0;z-index:1}.travel-details__list{margin-top:12px}.travel-details__list-item{display:flex;align-items:center;justify-content:space-between;padding:6px 0 0}.travel-details__list-item:not(:last-child){padding:6px 0 9px;border-bottom:2px solid #f1f1f1}.travel-details__label{flex-grow:2;margin:0 6px 0 0}.travel-details__title{font-size:18px;line-height:26px;display:block;min-width:124px}.travel-details__title--small{font-size:16px;line-height:26px;margin:0}.travel-details__action{padding:12px;width:100%;background-color:#fff;font-weight:700}.travel-details__action:hover,.travel-details__action:focus{background-color:#f8f8f8}.travel-details__action--border{border-bottom:2px solid #f1f1f1}.travel-details__action:focus{outline:none;z-index:1}.travel-details__icon{margin-bottom:9px}.travel-details__dropdown{margin-right:0}.travel-details__dropdown:after{content:\"\";position:absolute;bottom:-3px;left:0px;width:100%;border-bottom:3px solid #c3c3c3}.travel-details__dropdown--trip-type{order:1;flex:1;margin-right:3px;margin-bottom:3px}.travel-details__dropdown--transit-type{order:2;flex:1;margin-bottom:3px}.travel-details__dropdown--passengers{order:3;flex:1 0 100%;margin-bottom:3px}.travel-details__dropdown--md.travel-details__dropdown--trip-type{order:2;flex:1;margin-right:3px}.travel-details__dropdown--md.travel-details__dropdown--transit-type{order:3;flex:1}.travel-details__dropdown--md.travel-details__dropdown--passengers{order:1;flex:1;margin-right:3px}.travel-details__dropdown--lg.travel-details__dropdown--trip-type{order:2;flex:1 1 auto;margin-right:3px}.travel-details__dropdown--lg.travel-details__dropdown--transit-type{order:3;flex:1 1 auto}.travel-details__dropdown--lg.travel-details__dropdown--passengers{order:1;flex:1 1 auto;margin-right:3px}.travel-details__dropdown--lg:focus{outline:none}.travel-details__dropdown--lg:after{display:none}.travel-details__transit-icon{position:relative;display:flex;justify-content:center;width:calc(100% - 48px);margin:12px auto;height:24px;background-color:inherit}.travel-details__transit-icon:before{content:\"\";position:absolute;height:2px;left:0;width:100%;top:calc(50% - 1px);background-color:currentColor}.travel-details__transit-icon:after{content:\"\";position:absolute;width:10px;height:10px;right:0;top:calc(50% - 5px);border-top:2px solid currentColor;border-right:2px solid currentColor;transform:rotate(45deg)}.travel-details__transit-icon-stop{position:relative;top:calc(50% - 5px);width:10px;height:10px;border:2px solid currentColor;border-radius:50%;background-color:inherit}.travel-details--combined{order:3;flex:0 0 100%}.travel-details--combined.travel-details--md:after{content:\"\";position:absolute;bottom:-6px;left:0px;width:100%;border-bottom:3px solid #c3c3c3}.travel-details--combined.travel-details--md .travel-details__dropdown{margin:0 3px 0 0}.travel-details--combined.travel-details--md .travel-details__dropdown:last-child{margin:0}.travel-details--combined.travel-details--md .dropdown__toggle{height:calc(100% - 3px);margin:0;padding-left:16px;padding-right:16px}.travel-details--combined.travel-details--lg{order:2;flex:0 0 auto;margin:0 0 0 -3px;padding-left:3px;z-index:2}.travel-details--combined.travel-details--lg:after{content:\"\";position:absolute;bottom:-3px;left:0px;width:100%;border-bottom:3px solid #c3c3c3}.travel-details--combined.travel-details--lg .dropdown__toggle{height:inherit}@media (min-width: 1000px){.travel-details--no-border:after{border-bottom:none}}::ng-deep .nas-passenger-select-new__list-item{padding:8px 16px!important}::ng-deep .nas-radio-new{margin:0!important}::ng-deep .nas-button-new{margin-top:6px}::ng-deep .nas-checkbox-new{background-color:#f1f1f1;padding:12px;width:100%;padding-left:42px!important;margin-bottom:12px!important}::ng-deep .nas-checkbox-new__indicator{left:12px!important}::ng-deep .nas-filter-new__filters .travel-details--no-border:after{display:none}::ng-deep .nas-filter-new__filters .nas-filter-new__date-combo .nas-datepicker__date-picker-wrapper{border-bottom:none!important}::ng-deep .nas-filter-new__filters .nas-filter-new__date-combo--side-by-side .nas-datepicker-combo-new__separator{display:block;border-bottom:none!important}::ng-deep .nas-filter-new__filters .nas-airport-select-new__input-line{border-top:none!important}::ng-deep .nas-filter-new__filters .nas-airport-select-new-combo__separator{border-bottom:none!important}::ng-deep .nas-filter-new__filters .nas-dropdown__toggle{height:64px!important}::ng-deep .nas-filter-new__filters .nas-datepicker-combo-new__separator{display:none}::ng-deep .nas-filter-new__filters--lg .nas-dropdown__toggle{display:flex}::ng-deep .nas-filter-new__filters--lg .nas-filter-new__date-combo .nas-datepicker__date-picker-wrapper{border-bottom:3px solid #c3c3c3}::ng-deep .nas-filter-new__filters--lg .nas-airport-select-new__input-line{border-top:3px solid #c3c3c3!important}::ng-deep .nas-filter-new__filters--lg .nas-datepicker-combo-new__separator{border-bottom:3px solid #c3c3c3!important}::ng-deep .nas-filter-new__filters--lg .nas-airport-select-new-combo__separator{border-bottom:3px solid #c3c3c3!important}::ng-deep .nas-filter-new__rotate{transform:rotate(180deg)}::ng-deep .nas-filter-new__rotate-enter,::ng-deep .nas-filter-new__rotate-leave-active{transform-origin:center top;transform-style:preserve-3d;-webkit-backface-visibility:hidden;backface-visibility:hidden}::ng-deep .nas-filter-new__rotate-enter{animation:flip-in .55s ease both}::ng-deep .nas-filter-new__rotate-leave-active{animation:flip-out .2s ease-out both}::ng-deep .nas-filter-new__airport-select--no-border .nas-airport-select-new__input-line{border-top:none}::ng-deep .nas-filter-new__airport-select--no-border .nas-airport-select-new-combo__separator{border-top:none}::ng-deep .nas-filter-new__airport-select--no-border .nas-airport-select-new__results-wrapper{margin-top:0}::ng-deep .nas-filter-new__airport-select--no-border .nas-airport-select-new__results{top:-3px}::ng-deep .nas-filter-new__airport-select--no-border .nas-airport-select-new__icon{bottom:18px}::ng-deep .nas-filter-new__airport-select--no-border .nas-airport-select-new:after{display:none}::ng-deep .nas-filter-new__airport-select .nas-airport-select-new__input-line{display:none}::ng-deep .nas-filter-new__airport-origin-select{width:100%;max-width:100%}::ng-deep .nas-filter-new__airport-origin-select .nas-airport-select-new:only-child{max-width:100%}@media (min-width: 640px){::ng-deep .nas-filter-new__airport-origin-select{max-width:360px;flex:auto;margin-right:3px}::ng-deep .nas-filter-new__airport-origin-select .nas-airport-select-new:only-child{width:auto;max-width:360px}}::ng-deep .nas-filter-new__origin-combined{border-bottom:3px solid #c3c3c3;order:3;flex:0 0 100%;display:flex;flex-wrap:wrap}@media (min-width: 1000px){::ng-deep .nas-filter-new__origin-combined{display:flex;flex:none}::ng-deep .nas-filter-new__origin-combined .nas-dropdown__toggle nas-icon{float:none!important}}::ng-deep .nas-filter-new__subsidy-discount{order:3}::ng-deep .nas-filter-new__subsidy-discount .nas-subsidy-discount{margin-top:16px}::ng-deep .nas-filter-new__subsidy-discount .nas-subsidy-discount__box{width:100%}\n"] }]
|
|
12518
|
+
args: [{ selector: 'nas-filter-new', template: "<nas-accordion *ngIf=\"deviceHelper?.isMobile() && exists(minimizeOnMobile); else filterTemplate\"\n simple\n containerOnToggle\n transparent\n [expanded]=\"expandedAccordionMobile\"\n [title]=\"editSearchTitle\"\n (toggleChange)=\"onAccordionToggleChange($event)\">\n <ng-container *ngTemplateOutlet=\"filterTemplate\"></ng-container>\n</nas-accordion>\n<div class=\"container\"\n *ngIf=\"deviceHelper?.isMobile() && exists(minimizeOnMobile) && displaySummary\">{{getSummary()}}</div>\n\n<ng-template #filterTemplate>\n <div #container\n [nasClass]=\"getContainerClass()\">\n <div [nasClass]=\"getFilterClass('filters', [exists(minimize) && 'minimized', maximize && 'maximize'])\">\n <ng-container *ngIf=\"airports?.length > 0\">\n <nas-airport-select-new *ngIf=\"airports && airportRelations && (enableDestinationSelect)\"\n #airportSelect\n combo\n [ariaLabelClear]=\"ariaLabelClear\" \n [ariaLabelBackdrop]=\"ariaLabelBackdrop\"\n [nasFormGroup]=\"nasFormGroup\"\n [nasFormControlNameOrigin]=\"nasFormControlNameOrigin\"\n [nasFormControlNameDestination]=\"nasFormControlNameDestination\"\n [useSwitch]=\"useSwitch\"\n [nasClass]=\"getAirportSelectClass()\"\n [airports]=\"airports\"\n [allowedOriginAiports]=\"allowedOriginAirports\"\n [allowedDestinationAirports]=\"allowedDestinationAirports\"\n [airportRelations]=\"airportRelations\"\n [latestSearchesOrigin]=\"latestSearchesOrigin\"\n [latestSearchesDestination]=\"latestSearchesDestination\"\n [displayLatestSearches]=\"displayLatestSearches\"\n [displayClosestAirports]=\"displayClosestAirports\"\n [originAirportCode]=\"originAirportCode\"\n [destinationAirportCode]=\"destinationAirportCode\"\n [allAirportsLabel]=\"allAirportsLabel\"\n [latestSearchesLabel]=\"latestSearchesLabel\"\n [closestAirportsLabel]=\"closestAirportsLabel\"\n [closestAirports]=\"closestAirports\"\n [selectOriginFirstLabel]=\"selectOriginFirstLabel\"\n [labelOrigin]=\"labelOrigin\"\n [placeholderOrigin]=\"placeholderOrigin\"\n [labelDestination]=\"labelDestination\"\n [geolocationLabel]=\"geolocationLabel\"\n [geolocationBlockedLabel]=\"geolocationBlockedLabel\"\n [placeholderDestination]=\"placeholderDestination\"\n [keepSelection]=\"keepSelection\"\n [invalidDestinationText]=\"invalidDestinationText\"\n (originChange)=\"setSelectedOriginAirport($event)\"\n (destinationChange)=\"onDestinationChange($event)\"\n (focusOnNext)=\"setFocusOnPassengerSelect($event)\"\n (originOpenChange)=\"onOriginOpen($event)\"\n (destinationOpenChange)=\"onDestinationOpen($event)\"\n (positionChange)=\"getClosestAirports($event)\"></nas-airport-select-new>\n <nas-airport-select-new *ngIf=\"airports && (!enableDestinationSelect)\"\n #airportSelect\n [ariaLabelClear]=\"ariaLabelClear\"\n [ariaLabelBackdrop]=\"ariaLabelBackdrop\"\n [nasFormGroup]=\"nasFormGroup\"\n [nasFormControlNameOrigin]=\"nasFormControlNameOrigin\"\n [useSwitch]=\"useSwitch\"\n [nasClass]=\"getClass('airport-origin-select')\"\n [airports]=\"airports\"\n [allowedOriginAiports]=\"allowedOriginAirports\"\n [airportRelations]=\"airportRelations\"\n [latestSearchesOrigin]=\"latestSearchesOrigin\"\n [displayLatestSearches]=\"displayLatestSearches\"\n [displayClosestAirports]=\"displayClosestAirports\"\n [originAirportCode]=\"originAirportCode\"\n [allAirportsLabel]=\"allAirportsLabel\"\n [latestSearchesLabel]=\"latestSearchesLabel\"\n [closestAirportsLabel]=\"closestAirportsLabel\"\n [closestAirports]=\"closestAirports\"\n [selectOriginFirstLabel]=\"selectOriginFirstLabel\"\n [labelOrigin]=\"labelOrigin\"\n [placeholderOrigin]=\"placeholderOrigin\"\n [geolocationLabel]=\"geolocationLabel\"\n [geolocationBlockedLabel]=\"geolocationBlockedLabel\"\n [keepSelection]=\"keepSelection\"\n (originChange)=\"setSelectedOriginAirport($event)\"\n (focusOnNext)=\"setFocusOnPassengerSelect($event)\"\n (originOpenChange)=\"onOriginOpen($event)\"\n (positionChange)=\"getClosestAirports($event)\"></nas-airport-select-new>\n <nas-suggestions *ngIf=\"(closestAirports || latestSearchesOrigin) && exists(enableSuggestions)\"\n [nasClass]=\"getFilterClass('suggestions')\"\n [suggestions]=\"getSuggestions()\"\n [orLabel]=\"orLabel\"\n (airportSelect)=\"setSelectedOriginAirport($event)\"></nas-suggestions>\n </ng-container>\n <ng-container *ngIf=\"shouldMaximize()\">\n <div [nasClass]=\"!enableDestinationSelect ? getClass('origin-combined') :\n getTravelDetailsClass('', ['combined', exists(enableDatepickers) && 'no-border', exists(minimize) && 'minimized'])\">\n <ng-container *ngIf=\"enablePassengersSelect\">\n <button (click)=\"onPassengerSelectOpen($event)\" [nasClass]=\"getClass('passengers-button', openPassengerSelect && 'active')\">\n <div [nasClass]=\"getClass('label')\">\n <p [nasClass]=\"getClass('button-title')\">{{passengersTitleLabel}}</p>\n <p>{{passengerSelectLabel}}</p>\n </div>\n <div [nasClass]=\"getClass('traveler-icon')\"><nas-icon [icon]=\"'my-profile-compact'\" [type]=\"'small'\"></nas-icon></div>\n </button>\n <div *ngIf=\"openPassengerSelect\">\n <nas-backdrop [ariaLabelBackdrop]=\"ariaLabelBackdrop\"\n [(showBackdrop)]=\"openPassengerSelect\"></nas-backdrop>\n <nas-passenger-select-new\n [ariaLabelAdd]=\"ariaLabelAdd\"\n [ariaLabelSubtract]=\"ariaLabelSubtract\"\n [adultsLabel]=\"passengerSelectAdultsLabel\"\n [youthsLabel]=\"passengerSelectYouthsLabel\"\n [youngAdultsLabel]=\"passengerSelectYoungAdultsLabel\"\n [childrenLabel]=\"passengerSelectChildrenLabel\"\n [infantsLabel]=\"passengerSelectInfantsLabel\"\n [maxPaxCount]=\"maxPaxCount\"\n [minAdultCount]=\"minAdultCount\"\n [title]=\"passengerSelectTitle\"\n [nasFormGroup]=\"nasFormGroup\"\n [nasFormControlGroupBooking]=\"nasFormControlGroupBooking\"\n [groupBookingLabel]=\"groupBookingLabel\"\n [groupBookingLimit]=\"groupBookingLimit\"\n (focusOnNext)=\"onPassengersSelectFocusOnNext()\"\n (focusOnPrevious)=\"onPassengersSelectFocusOnPrevious()\"\n [(passengers)]=\"passengers\"></nas-passenger-select-new>\n <nas-button-new *ngIf=\"this.openPassengerSelect\" light block \n [disabled]=\"passengers[0].count === 0 && passengers[1].count === 0 && passengers[2].count === 0\" (click)=\"openPassengerSelect = false\">\n {{doneLabel}}\n </nas-button-new>\n </div>\n </ng-container>\n <ng-container *ngIf=\"enableTripSwitch\">\n <form *ngIf=\"!openPassengerSelect\" [nasClass]=\"getClass('radio')\">\n <nas-radio-new #tripTypeRoundTrip [name]=\"'tripType'\" [value]=\"2\" [checked]=\"true\" (checkedChange)=\"onTripTypeChange(2)\">\n {{tripSwitchRoundTripLabel}}\n </nas-radio-new>\n <nas-radio-new #tripTypeOneway [name]=\"'tripType'\" [value]=\"1\" (checkedChange)=\"onTripTypeChange(1)\">\n {{tripSwitchOneWayLabel}}\n </nas-radio-new>\n </form>\n </ng-container>\n <div *ngIf=\"exists(enableDatepickers)\"\n [nasClass]=\"getDatePickersClass()\">\n <nas-datepicker-combo-new #datepickerCombo *ngIf=\"!openPassengerSelect\"\n compact\n [inlineFlex]=\"inlineFlex\"\n [nasFormGroup]=\"nasFormGroup\"\n [nasFormControlNameOutbound]=\"nasFormControlNameOutbound\"\n [nasFormControlNameInbound]=\"nasFormControlNameInbound\"\n [availability]=\"availability\"\n [availableFlightsLabel]=\"availableFlightsLabel\"\n [dateDisplayFormat]=\"dateDisplayFormat\"\n [disablePastSelection]=\"disablePastSelection\"\n [locale]=\"locale\"\n [noAvailableFlightsLabel]=\"noAvailableFlightsLabel\"\n [inboundAvailableDates]=\"inboundAvailableDates\"\n [inboundLabel]=\"inboundLabel\"\n [noAvailableFlightsLabel]=\"noAvailableFlightsLabel\"\n [outboundAvailableDates]=\"outboundAvailableDates\"\n [outboundLabel]=\"outboundLabel\"\n [timeDisplayFormat]=\"timeDisplayFormat\"\n [times]=\"times\"\n [outboundDisabled]=\"outboundDisabled\"\n [inboundDisabled]=\"inboundDisabled\"\n [outboundOnly]=\"tripType === 1\"\n [ariaLabelBackdrop]=\"ariaLabelBackdrop\"\n [ariaLabelPreviousMonth]=\"ariaLabelPreviousMonth\"\n [ariaLabelNextMonth]=\"ariaLabelNextMonth\"\n (focusOnNextChange)=\"onFocusOnNextChange($event)\"\n (focusOnPreviousChange)=\"onDatepickerFocusOnPrevious($event)\"\n (inboundMonthChange)=\"onInboundMonthChange($event)\"\n (outboundMonthChange)=\"onOutboundMonthChange($event)\"\n [(outboundOpen)]=\"outboundOpen\"\n [(inboundOpen)]=\"inboundOpen\"\n [(inboundSelectedDate)]=\"inboundSelectedDate\"\n [(outboundSelectedDate)]=\"outboundSelectedDate\">\n </nas-datepicker-combo-new>\n </div>\n <ng-container *ngIf=\"enableTransitSwitch\">\n <nas-button-new *ngIf=\"directOnlyLabel && directTransitLabel && !openPassengerSelect\"\n #transitSwitch\n block\n light\n [iconType]=\"'chevron-down'\"\n [label]=\"getTransitLabel()\"\n [nasClass]=\"getClass('transit', openTransitTypeSelect && 'active')\"\n [ariaLabelBackdrop]=\"ariaLabelBackdrop\"\n (click)=\"onTransitSwitchOpen($event)\"\n (keydown)=\"transitKeyDown($event)\">{{ getTransitLabel() }}\n </nas-button-new>\n <div *ngIf=\"openTransitTypeSelect\" [nasClass]=\"getClass('transit-type')\">\n <button [nasClass]=\"getTravelDetailsClass('action', directOnly && 'active')\"\n type=\"button\"\n #transitTypeDirectOnly\n (click)=\"onTransitChange(true)\">{{ directOnlyLabel }}\n </button>\n <button type=\"button\"\n #transitTypeTransit\n [nasClass]=\"getTravelDetailsClass('action', !directOnly && 'active')\"\n (click)=\"onTransitChange(false)\">{{ directTransitLabel }}\n </button>\n </div>\n </ng-container>\n </div>\n <div *ngIf=\"subsidyDiscounts && subsidyDiscounts.length > 0 && !openPassengerSelect\"\n [nasClass]=\"getFilterClass('subsidy-discount')\">\n <nas-subsidy-discount #subsidyDiscount\n [discounts]=\"subsidyDiscounts\"\n [selectedDiscount]=\"selectedSubsidyDiscount\"\n [label]=\"subsidyDiscountLabel\"\n (infoButtonClick)=\"onSubsidyDiscountInfoClick()\"\n (discountSelectChange)=\"onSubsidyDiscountSelectChange($event)\"\n (infoButtonKeydown)=\"onSubsidyDiscountInfoButtonKeydown($event)\"></nas-subsidy-discount>\n </div>\n </ng-container>\n </div>\n </div>\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-filter-new{position:relative;z-index:6}.nas-filter-new ::ng-deep .nas-filter-new__transit .nas-button-new--light{border:2px solid #15273f}.nas-filter-new ::ng-deep .nas-filter-new__transit .nas-button-new__content{gap:0;justify-content:space-between;font-weight:400}.nas-filter-new ::ng-deep .nas-filter-new__transit--active .nas-button-new__icon{transform:rotate(180deg)}.nas-filter-new ::ng-deep .nas-filter-new__transit--active .nas-button-new{background-color:#ebf4ff;border:2px solid #15273f}.nas-filter-new__title{margin-top:24px;font-size:28px;line-height:34px}@media screen and (min-width: 640px){.nas-filter-new__title{font-size:32px;line-height:38px}}.nas-filter-new__title--md{margin-top:60px}.nas-filter-new__radio{display:flex;gap:24px;padding:12px}.nas-filter-new__passengers-button{display:flex;justify-content:space-between;background-color:#fff;border:2px solid #15273f;padding:9px 14px;width:100%}.nas-filter-new__passengers-button--active{background-color:#ebf4ff!important;position:relative;z-index:3}.nas-filter-new__label{flex-direction:column;text-align:left}.nas-filter-new__label p{margin:0}.nas-filter-new__button-title{font-weight:700;font-size:14px}.nas-filter-new__traveler-icon{transform:scale(.85);margin-top:12px}.nas-filter-new__transit-type{border-left:2px solid #15273f;border-right:2px solid #15273f;border-bottom:2px solid #15273f}.nas-filter-new__transit-type button:first-child{border-bottom:2px solid #E9E7E4}.nas-filter-new__filters .nas-filter-new__date-combo{order:2;flex:1;z-index:2}.nas-filter-new__filters--minimized .nas-filter-new__airport-select:after{content:\"\";position:absolute;bottom:-3px;left:0px;width:100%;border-bottom:3px solid #c3c3c3}.nas-filter-new__filters--maximize .nas-filter-new__airport-select-new:after{display:none}.nas-filter-new__filters--md .nas-filter-new__date-combo{flex:0 0 100%}.nas-filter-new__filters--lg{align-items:stretch}.nas-filter-new__filters--lg .nas-filter-new__date-combo{order:3;flex:0 0 100%;z-index:1}.nas-filter-new__filters--lg .nas-filter-new__suggestions{order:3}.nas-filter-new__filters--lg .nas-filter-new__filters--minimized .nas-filter-new__airport-select{margin-right:0;flex:0 1 100%}.nas-filter-new__filters--lg .nas-filter-new__filters--maximize .nas-filter-new__airport-select{margin-right:3px;flex:auto}.nas-filter-new__filters--lg.nas-filter-new__filters--maximize .nas-filter-new__date-combo{border-bottom:3px solid #c3c3c3}.nas-filter-new__suggestions{flex-basis:100%;position:relative;margin-top:3px}.nas-filter-new__airport-select{order:0;flex:0 0 100%;position:relative}.nas-filter-new__airport-select--lg{width:0;margin:0 3px 0 0;flex:1 1 auto}.nas-filter-new__toggler{font-family:Apercu,Helvetica Neue,Helvetica,Arial,sans-serif;font-weight:400;font-size:18px;line-height:26px;color:#15273f;margin-top:6px;z-index:1}.nas-filter-new__toggler .nas-filter-new__toggle-action{cursor:pointer;margin-top:2px;float:right}.nas-filter-new__toggler .nas-filter-new__direct-only{display:inline-block}.travel-details{position:relative;margin:0;z-index:1}.travel-details__list{margin-top:12px}.travel-details__list-item{display:flex;align-items:center;justify-content:space-between;padding:6px 0 0}.travel-details__list-item:not(:last-child){padding:6px 0 9px;border-bottom:2px solid #f1f1f1}.travel-details__label{flex-grow:2;margin:0 6px 0 0}.travel-details__title{font-size:18px;line-height:26px;display:block;min-width:124px}.travel-details__title--small{font-size:16px;line-height:26px;margin:0}.travel-details__action{padding:12px;width:100%;background-color:#fff;font-weight:700}.travel-details__action:hover,.travel-details__action:focus{background-color:#f8f8f8}.travel-details__action--border{border-bottom:2px solid #f1f1f1}.travel-details__action:focus{outline:none;z-index:1}.travel-details__icon{margin-bottom:9px}.travel-details__dropdown{margin-right:0}.travel-details__dropdown:after{content:\"\";position:absolute;bottom:-3px;left:0px;width:100%;border-bottom:3px solid #c3c3c3}.travel-details__dropdown--trip-type{order:1;flex:1;margin-right:3px;margin-bottom:3px}.travel-details__dropdown--transit-type{order:2;flex:1;margin-bottom:3px}.travel-details__dropdown--passengers{order:3;flex:1 0 100%;margin-bottom:3px}.travel-details__dropdown--md.travel-details__dropdown--trip-type{order:2;flex:1;margin-right:3px}.travel-details__dropdown--md.travel-details__dropdown--transit-type{order:3;flex:1}.travel-details__dropdown--md.travel-details__dropdown--passengers{order:1;flex:1;margin-right:3px}.travel-details__dropdown--lg.travel-details__dropdown--trip-type{order:2;flex:1 1 auto;margin-right:3px}.travel-details__dropdown--lg.travel-details__dropdown--transit-type{order:3;flex:1 1 auto}.travel-details__dropdown--lg.travel-details__dropdown--passengers{order:1;flex:1 1 auto;margin-right:3px}.travel-details__dropdown--lg:focus{outline:none}.travel-details__dropdown--lg:after{display:none}.travel-details__transit-icon{position:relative;display:flex;justify-content:center;width:calc(100% - 48px);margin:12px auto;height:24px;background-color:inherit}.travel-details__transit-icon:before{content:\"\";position:absolute;height:2px;left:0;width:100%;top:calc(50% - 1px);background-color:currentColor}.travel-details__transit-icon:after{content:\"\";position:absolute;width:10px;height:10px;right:0;top:calc(50% - 5px);border-top:2px solid currentColor;border-right:2px solid currentColor;transform:rotate(45deg)}.travel-details__transit-icon-stop{position:relative;top:calc(50% - 5px);width:10px;height:10px;border:2px solid currentColor;border-radius:50%;background-color:inherit}.travel-details--combined{order:3;flex:0 0 100%}.travel-details--combined.travel-details--md:after{content:\"\";position:absolute;bottom:-6px;left:0px;width:100%;border-bottom:3px solid #c3c3c3}.travel-details--combined.travel-details--md .travel-details__dropdown{margin:0 3px 0 0}.travel-details--combined.travel-details--md .travel-details__dropdown:last-child{margin:0}.travel-details--combined.travel-details--md .dropdown__toggle{height:calc(100% - 3px);margin:0;padding-left:16px;padding-right:16px}.travel-details--combined.travel-details--lg{order:2;flex:0 0 auto;margin:0 0 0 -3px;padding-left:3px;z-index:2}.travel-details--combined.travel-details--lg:after{content:\"\";position:absolute;bottom:-3px;left:0px;width:100%;border-bottom:3px solid #c3c3c3}.travel-details--combined.travel-details--lg .dropdown__toggle{height:inherit}@media (min-width: 1000px){.travel-details--no-border:after{border-bottom:none}}::ng-deep .nas-passenger-select-new__list-item{padding:8px 16px!important}::ng-deep .nas-radio-new{margin:0!important}::ng-deep .nas-button-new{margin-top:6px}::ng-deep .nas-checkbox-new{background-color:#f1f1f1;padding:12px;width:100%;padding-left:42px!important;margin-bottom:12px!important}::ng-deep .nas-checkbox-new__indicator{left:12px!important}::ng-deep .nas-filter-new__filters .travel-details--no-border:after{display:none}::ng-deep .nas-filter-new__filters .nas-filter-new__date-combo .nas-datepicker__date-picker-wrapper{border-bottom:none!important}::ng-deep .nas-filter-new__filters .nas-filter-new__date-combo--side-by-side .nas-datepicker-combo-new__separator{display:block;border-bottom:none!important}::ng-deep .nas-filter-new__filters .nas-airport-select-new__input-line{border-top:none!important}::ng-deep .nas-filter-new__filters .nas-airport-select-new-combo__separator{border-bottom:none!important}::ng-deep .nas-filter-new__filters .nas-dropdown__toggle{height:64px!important}::ng-deep .nas-filter-new__filters .nas-datepicker-combo-new__separator{display:none}::ng-deep .nas-filter-new__filters--lg .nas-dropdown__toggle{display:flex}::ng-deep .nas-filter-new__filters--lg .nas-filter-new__date-combo .nas-datepicker__date-picker-wrapper{border-bottom:3px solid #c3c3c3}::ng-deep .nas-filter-new__filters--lg .nas-airport-select-new__input-line{border-top:3px solid #c3c3c3!important}::ng-deep .nas-filter-new__filters--lg .nas-datepicker-combo-new__separator{border-bottom:3px solid #c3c3c3!important}::ng-deep .nas-filter-new__filters--lg .nas-airport-select-new-combo__separator{border-bottom:3px solid #c3c3c3!important}::ng-deep .nas-filter-new__rotate{transform:rotate(180deg)}::ng-deep .nas-filter-new__rotate-enter,::ng-deep .nas-filter-new__rotate-leave-active{transform-origin:center top;transform-style:preserve-3d;-webkit-backface-visibility:hidden;backface-visibility:hidden}::ng-deep .nas-filter-new__rotate-enter{animation:flip-in .55s ease both}::ng-deep .nas-filter-new__rotate-leave-active{animation:flip-out .2s ease-out both}::ng-deep .nas-filter-new__airport-select--no-border .nas-airport-select-new__input-line{border-top:none}::ng-deep .nas-filter-new__airport-select--no-border .nas-airport-select-new-combo__separator{border-top:none}::ng-deep .nas-filter-new__airport-select--no-border .nas-airport-select-new__results-wrapper{margin-top:0}::ng-deep .nas-filter-new__airport-select--no-border .nas-airport-select-new__results{top:-3px}::ng-deep .nas-filter-new__airport-select--no-border .nas-airport-select-new__icon{bottom:18px}::ng-deep .nas-filter-new__airport-select--no-border .nas-airport-select-new:after{display:none}::ng-deep .nas-filter-new__airport-select .nas-airport-select-new__input-line{display:none}::ng-deep .nas-filter-new__airport-origin-select{width:100%;max-width:100%}::ng-deep .nas-filter-new__airport-origin-select .nas-airport-select-new:only-child{max-width:100%}@media (min-width: 640px){::ng-deep .nas-filter-new__airport-origin-select{max-width:360px;flex:auto;margin-right:3px}::ng-deep .nas-filter-new__airport-origin-select .nas-airport-select-new:only-child{width:auto;max-width:360px}}::ng-deep .nas-filter-new__origin-combined{border-bottom:3px solid #c3c3c3;order:3;flex:0 0 100%;display:flex;flex-wrap:wrap}@media (min-width: 1000px){::ng-deep .nas-filter-new__origin-combined{display:flex;flex:none}::ng-deep .nas-filter-new__origin-combined .nas-dropdown__toggle nas-icon{float:none!important}}::ng-deep .nas-filter-new__subsidy-discount{order:3}::ng-deep .nas-filter-new__subsidy-discount .nas-subsidy-discount{margin-top:16px}::ng-deep .nas-filter-new__subsidy-discount .nas-subsidy-discount__box{width:100%}::ng-deep .nas-filter-new__backdrop{display:block;position:fixed;z-index:2;top:0;left:0;width:100%;height:100%;color:transparent;background-color:#0b14202b;animation:passenger-backdrop .7s ease-out both}@keyframes passenger-backdrop{0%{opacity:0}}\n"] }]
|
|
12519
12519
|
}], ctorParameters: function () { return [{ type: DeviceHelper }, { type: SortService }, { type: AbandonedBasketService }, { type: DateHelper }, { type: i0.ElementRef }, { type: i0.ChangeDetectorRef }]; }, propDecorators: { passengerSelectDropdown: [{
|
|
12520
12520
|
type: ViewChild,
|
|
12521
12521
|
args: ['passengerSelectDropdown']
|
|
@@ -12578,6 +12578,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.5", ngImpor
|
|
|
12578
12578
|
type: Input
|
|
12579
12579
|
}], passengerSelectLabel: [{
|
|
12580
12580
|
type: Input
|
|
12581
|
+
}], doneLabel: [{
|
|
12582
|
+
type: Input
|
|
12581
12583
|
}], maxPaxCount: [{
|
|
12582
12584
|
type: Input
|
|
12583
12585
|
}], passengers: [{
|
|
@@ -13067,7 +13069,8 @@ class FilterNewModule {
|
|
|
13067
13069
|
ButtonNewModule,
|
|
13068
13070
|
PassengerSelectNewModule,
|
|
13069
13071
|
RadioNewModule,
|
|
13070
|
-
CheckboxNewModule
|
|
13072
|
+
CheckboxNewModule,
|
|
13073
|
+
BackdropModule], exports: [FilterNewComponent] }); }
|
|
13071
13074
|
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "16.1.5", ngImport: i0, type: FilterNewModule, providers: [SortService, AbandonedBasketService, DateHelper, DeviceHelper], imports: [CommonModule,
|
|
13072
13075
|
NasClassModule,
|
|
13073
13076
|
AirportSelectModule,
|
|
@@ -13087,7 +13090,8 @@ class FilterNewModule {
|
|
|
13087
13090
|
ButtonNewModule,
|
|
13088
13091
|
PassengerSelectNewModule,
|
|
13089
13092
|
RadioNewModule,
|
|
13090
|
-
CheckboxNewModule
|
|
13093
|
+
CheckboxNewModule,
|
|
13094
|
+
BackdropModule] }); }
|
|
13091
13095
|
}
|
|
13092
13096
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.5", ngImport: i0, type: FilterNewModule, decorators: [{
|
|
13093
13097
|
type: NgModule,
|
|
@@ -13112,7 +13116,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.5", ngImpor
|
|
|
13112
13116
|
ButtonNewModule,
|
|
13113
13117
|
PassengerSelectNewModule,
|
|
13114
13118
|
RadioNewModule,
|
|
13115
|
-
CheckboxNewModule
|
|
13119
|
+
CheckboxNewModule,
|
|
13120
|
+
BackdropModule
|
|
13116
13121
|
],
|
|
13117
13122
|
declarations: [FilterNewComponent],
|
|
13118
13123
|
exports: [FilterNewComponent],
|