@norwegian/core-components 5.1.0

package/lib/components/filter/filter.component.d.ts

@@ -0,0 +1,693 @@
+/**
+ * @license
+ * Copyright Norwegian Air Shuttle. All Rights Reserved.
+ */
+import { AfterViewChecked, ElementRef, EventEmitter, OnInit, ChangeDetectorRef } from '@angular/core';
+import { FormGroup } from '@angular/forms';
+import { BehaviorSubject } from 'rxjs';
+import { TripType } from './enums/trip-type.enum';
+import { NasComponentBase } from '../../core/base/nas-component.base';
+import { ClassModel } from '../../core/models/class.model';
+import { UtcDate } from '../../core/models/utc-date.model';
+import { AbandonedBasketService } from '../../core/services/abandoned-basket/abandoned-basket.service';
+import { DateHelper } from '../../core/services/date/date-helper.service';
+import { DeviceHelper } from '../../core/services/device/device-helper.service';
+import { SortService } from '../../core/services/sort/sort.service';
+import { AirportSelectComponent } from '../airport-select/airport-select.component';
+import { AirportModel } from '../airport-select/models/airport.model';
+import { DatepickerComboComponent } from '../datepicker-combo/datepicker-combo.component';
+import { DropdownComponent } from '../dropdown/dropdown.component';
+import { PassengersModel } from '../passenger-select/models/passengers.model';
+import { SubsidyDiscountModel } from '../subsidy-discount/models/subsidy-discount.model';
+import { PassengerSelectComponent } from '../passenger-select/passenger-select.component';
+import { SubsidyDiscountComponent } from '../subsidy-discount/subsidy-discount.component';
+/**
+ * @description
+ * Norwegian Filter Component | Functional
+ */
+export declare class FilterComponent extends NasComponentBase implements OnInit, AfterViewChecked {
+    deviceHelper: DeviceHelper;
+    private sortService;
+    private abandonedBasketService;
+    private dateService;
+    elementRef: ElementRef;
+    private changeDetector;
+    passengerSelectDropdown: DropdownComponent;
+    passengerSelect: PassengerSelectComponent;
+    tripSwitch: DropdownComponent;
+    transitSwitch: DropdownComponent;
+    airportSelect: AirportSelectComponent;
+    datepickerCombo: DatepickerComboComponent;
+    container: ElementRef;
+    tripTypeOneway: ElementRef;
+    tripTypeRoundTrip: ElementRef;
+    transitTypeDirectOnly: ElementRef;
+    transitTypeTransit: ElementRef;
+    subsidyDiscount: SubsidyDiscountComponent;
+    latestSearchesOrigin: Array<AirportModel>;
+    latestSearchesDestination: Array<AirportModel>;
+    displaySummary: boolean;
+    nativeElement: HTMLElement;
+    inboundLowerLimitDate: UtcDate;
+    containerWidth: BehaviorSubject<number>;
+    maximize: boolean;
+    isNasGroupValid: boolean;
+    get outboundOpen(): boolean;
+    set outboundOpen(value: boolean);
+    get inboundOpen(): boolean;
+    set inboundOpen(value: boolean);
+    private inboundOpenTimeout;
+    /**
+     * @required
+     * @description
+     * A record containing keys with all airport codes with corresponding array of airport codes connected to the key.
+     */
+    airportRelations: Record<string, Array<string>>;
+    /**
+     * @description
+     * Adds 'aria-label' on the clear button inside the airport select inputs.
+     */
+    ariaLabelClear: string;
+    /**
+     * @description
+     * ARIA label for the subtract buttons.
+     */
+    ariaLabelSubtract: string;
+    /**
+     * @description
+     * Adds 'aria-label' to the backdrops.
+     */
+    ariaLabelBackdrop: string;
+    /**
+     * @description
+     * ARIA label for the add buttons.
+     */
+    ariaLabelAdd: string;
+    /**
+     * @description
+     * A list of airports that should be displayed in the origin dropdown.
+     * If not included, all airports will be displayed.
+     */
+    allowedOriginAirports: Array<AirportModel>;
+    /**
+     * @description
+     * An array of airports that are restricted for destination airports. It will default to airports if not set.
+     */
+    allowedDestinationAirports: Array<AirportModel>;
+    /**
+     * @description
+     * A boolean indicating if airports that the user allready has searh for should be displayed.
+     */
+    displayLatestSearches: boolean;
+    /**
+     * @description
+     * Display switch UI to interchange origin and destination airport.
+     */
+    useSwitch?: boolean;
+    /**
+     * @description
+     * A boolean indicating if airports that are close to the user should be displayed.
+     */
+    displayClosestAirports: boolean;
+    /**
+     * @description
+     * The airport code of the origin airport. It will set the selected origin airport based on this value.
+     */
+    originAirportCode: string;
+    /**
+     * @description
+     * The airport code of the destination airport. It will set the selected destination airport based on this value.
+     */
+    destinationAirportCode: string;
+    /**
+     * @description
+     * A label that will be added to the passenger select dropdown.
+     */
+    passengerSelectLabel: string;
+    /**
+     * @description
+     * The total maximum amount of passengers in the passenger select dropdown.
+     */
+    maxPaxCount: number;
+    /**
+     * @description
+     * An array of different passenger types that will be displayed.
+     */
+    get passengers(): Array<PassengersModel>;
+    set passengers(value: Array<PassengersModel>);
+    /**
+     * @description
+     * The minimum amount of adults that can be selected in the passenger select dropdown.
+     */
+    minAdultCount: number;
+    /**
+     * @description
+     * A label for round trip selection in the trip switch dropdown.
+     */
+    tripSwitchRoundTripLabel: string;
+    /**
+     * @description
+     * A label for one way selection in the trip switch dropdown.
+     */
+    tripSwitchOneWayLabel: string;
+    /**
+     * @description
+     * A label for direct only selection in the transit switch dropdown.
+     */
+    directOnlyLabel: string;
+    /**
+     * @description
+     * A label for both direct and transit selection in the transit switch dropdown.
+     */
+    directTransitLabel: string;
+    /**
+     * @description
+     * Indicates if the filter should be minimized on mobile screen sizes.
+     */
+    minimizeOnMobile?: boolean;
+    /**
+    * @description
+    * Indicates if the edit search of accordion should be expended on mobile screen sizes.
+    */
+    get expandedAccordionMobile(): boolean;
+    set expandedAccordionMobile(value: boolean);
+    /**
+     * @description
+     * A separator for the filter summary that is dispayed if minimizeOnMobile is true.
+     *
+     * ### Example
+     * 1 traveller, round trip and direct/transit
+     */
+    defaultSummarySeparator: string;
+    /**
+     * A separator for the filter summary is are dispayed if minimizeOnMobile is true.
+     *
+     * ### Example
+     * 1 traveller, round trip and direct/transit
+     */
+    lastSummarySeparator: string;
+    /**
+     * @description
+     * A title that will be added to the passenger select dropdown.
+     */
+    passengerSelectTitle: string;
+    /**
+     * @description
+     * A label for the adults passenger type in the passenger select dropdown.
+     */
+    passengerSelectAdultsLabel: string;
+    /**
+     * @description
+     * A label for the children passenger type in the passenger select dropdown.
+     */
+    passengerSelectChildrenLabel: string;
+    /**
+     * @description
+     * A label for the infants passenger type in the passenger select dropdown.
+     */
+    passengerSelectInfantsLabel: string;
+    /**
+     * @description
+     * A label that will appear when total number of selected passengers exceeds the group booking limit
+     */
+    groupBookingLabel: string;
+    /**
+     * @description
+     * A label that will appear on top of all airports in the airport select drop down lists.
+     */
+    allAirportsLabel: string;
+    /**
+     * @description
+     * A label that will appear on top of the latest searches in the airport select drop down lists.
+     */
+    latestSearchesLabel: string;
+    /**
+     * @description
+     * A label that will appear on top of the closest airports in the airport select drop down lists.
+     */
+    closestAirportsLabel: string;
+    /**
+     * @description
+     * A label that will appear in the destination input field in the airport select, if the
+     * user tries to select a destination airport without selecting an origin airport.
+     */
+    selectOriginFirstLabel: string;
+    /**
+     * @required
+     * @description
+     * A label that will appear on top of the origin airport input field.
+     */
+    labelOrigin: string;
+    /**
+     * @description
+     * A placeholder that will appear on the origin airport input field.
+     */
+    placeholderOrigin: string;
+    /**
+     * @required
+     * @description
+     * A label that will appear on top of the destination airport input field.
+     */
+    labelDestination: string;
+    /**
+     * @description
+     * A label that will appear in my location in the drop down list in airport select.
+     */
+    geolocationLabel: string;
+    /**
+     * @description
+     * A label that will appear in my location, in the drop down list in airport select if user has denied geolocation.
+     */
+    geolocationBlockedLabel: string;
+    /**
+     * @description
+     * A placeholder that will appear on the destination airport input field.
+     */
+    placeholderDestination: string;
+    /**
+     * @description
+     * A modifier that will allow always keeping the selected airport.
+     * The last selected airport will be shown once user clears the selection and blur.
+     */
+    keepSelection: boolean;
+    /**
+     * @description
+     * A title that will be assigned to edit search accordion.
+     */
+    editSearchTitle: string;
+    /**
+     * @description
+     * Adds the parent's form group.
+     * It requires that the consumer included ReactiveFormsModule in it's module.
+     * It is requiered to be filled if nasFormControlName added.
+     */
+    nasFormGroup: FormGroup;
+    /**
+     * @description
+     * Sets a formControlName directive to the input.
+     * It requires that the consumer included ReactiveFormsModule in it's module.
+     * It requiers that the nasFormGroup input is filled.
+     */
+    nasFormControlNameOrigin: string;
+    /**
+     * @description
+     * Sets a formControlName directive to the input.
+     * It requires that the consumer included ReactiveFormsModule in it's module.
+     * It requiers that the nasFormGroup input is filled.
+     */
+    nasFormControlNameDestination: string;
+    /**
+     * @description
+     * Sets a formControlName directive to the input.
+     * It requires that the consumer included ReactiveFormsModule in it's module.
+     * It requiers that the nasFormGroup input is filled.
+     */
+    nasFormControlNameTripType: string;
+    /**
+     * @description
+     * Sets a formControlName directive to the input.
+     * It requires that the consumer included ReactiveFormsModule in it's module.
+     * It requiers that the nasFormGroup input is filled.
+     */
+    nasFormControlNameDirectOnly: string;
+    /**
+     * @description
+     * Sets a formControlName directive to the input.
+     * It requires that the consumer included ReactiveFormsModule in it's module.
+     * It requiers that the nasFormGroup input is filled.
+     */
+    nasFormControlNameOutbound: string;
+    /**
+     * @description
+     * Sets a formControlName directive to the input.
+     * It requires that the consumer included ReactiveFormsModule in it's module.
+     * It requiers that the nasFormGroup input is filled.
+     */
+    nasFormControlNameInbound: string;
+    /**
+     * @description
+     * Sets a formControlName directive to the input.
+     * It requires that the consumer included ReactiveFormsModule in it's module.
+     * It requiers that the nasFormGroup input is filled.
+     */
+    nasFormControlGroupBooking: string;
+    /**
+     * @description
+     * Sets a formControlName directive to the input.
+     * It requires that the consumer included ReactiveFormsModule in it's module.
+     * It requiers that the nasFormGroup input is filled.
+     */
+    nasFormControlNameSubsidyDiscount: string;
+    /**
+     * @description
+     * Make latest searches and geolocation override default value in the origin airport selector.
+     */
+    overrideOrigin?: boolean;
+    /**
+     * @description
+     * This will make the filter display suggested airports based on geolocation and latest searches.
+     */
+    enableSuggestions?: boolean;
+    get closestAirports(): Array<AirportModel>;
+    set closestAirports(airports: Array<AirportModel>);
+    /**
+     * This will only display airport selection. When a city pair is selected, the rest of the filter will be visible.
+     */
+    minimize?: boolean;
+    /**
+     * @required
+     * @description
+     * All airports that will be populated into the dropdown lists.
+     * If displayLatestSearches is true, it will try to get the latest searches from the abandoned basket.
+     */
+    get airports(): Array<AirportModel>;
+    set airports(airports: Array<AirportModel>);
+    /**
+     * @description
+     * Sets and gets the selected trip type.
+     */
+    get tripType(): TripType;
+    set tripType(tripType: TripType);
+    /**
+     * @description
+     * Sets and gets whether the selected transit type is direct only or not.
+     */
+    get directOnly(): boolean;
+    set directOnly(directOnly: boolean);
+    /**
+     * @description
+     * The limit for when the total amount of passengers exceeds to be a group booking.
+     */
+    groupBookingLimit: number;
+    /**
+     * @description
+     * Subsidy discounts
+     */
+    subsidyDiscounts: Array<SubsidyDiscountModel>;
+    /**
+     * @description
+     * Selected subsidy discount
+     */
+    selectedSubsidyDiscount: SubsidyDiscountModel;
+    /**
+     * @description
+     * Subsidy discount label
+     */
+    subsidyDiscountLabel: string;
+    /**
+     * @description
+     * ARIA label for the previous month button in the calendar.
+     */
+    ariaLabelPreviousMonth: string;
+    /**
+     * @description
+     * ARIA label for the next month button in the calendar.
+     */
+    ariaLabelNextMonth: string;
+    /**
+     * @description
+     * An event that is fired every time the origin dropdown selector opens or closes.
+     */
+    originOpenChange: EventEmitter<boolean>;
+    /**
+    * @description
+    * An event that is fired every time the origin dropdown selector opens or closes.
+    */
+    destinationOpenChange: EventEmitter<boolean>;
+    /**
+     * @description
+     * An event that is fired every time the passenger select dropdown opens or closes.
+     */
+    passengerSelectOpenChange: EventEmitter<boolean>;
+    /**
+     * @description
+     * An event that is fired every time the selected origin airport changes.
+     */
+    originChange: EventEmitter<AirportModel>;
+    /**
+    * @description
+    * An event that is fired every time the selected destination airport changes.
+    */
+    destinationChange: EventEmitter<AirportModel>;
+    /**
+     * @description
+     * An event that is fired every time a passenger selection change is performed.
+     */
+    passengersChange: EventEmitter<PassengersModel[]>;
+    /**
+     * @description
+     * Sets and gets the selected trip type.
+     */
+    tripTypeChange: EventEmitter<TripType>;
+    /**
+     * @description
+     * Sets and gets whether the selected transit type is direct only or not.
+     */
+    directOnlyChange: EventEmitter<boolean>;
+    /**
+     * @description
+     * Label for no available flights.
+     */
+    noAvailableFlightsLabel: string;
+    /**
+     * @description
+     * Label for available flights.
+     */
+    availableFlightsLabel: string;
+    /**
+     * @description
+     * Disable possibility to select dates in the past.
+     */
+    disablePastSelection: boolean;
+    /**
+     * @description
+     * Label for outbound datepicker.
+     */
+    outboundLabel: string;
+    /**
+     * @description
+     * Label for inbound datepicker.
+     */
+    inboundLabel: string;
+    /**
+     * @description
+     * Sets the datepickers in availability mode where available dates can be added.
+     */
+    availability: boolean;
+    /**
+     * @description
+     * Available dates for outbound calendar.
+     */
+    outboundAvailableDates: Array<UtcDate>;
+    /**
+     * @description
+     * Available dates for inbound calendar.
+     */
+    inboundAvailableDates: Array<UtcDate>;
+    /**
+     * @description
+     * If set, Enables the time dropdown selector alongside datepicker.
+     */
+    times: Array<UtcDate>;
+    /**
+     * @description
+     * The display format of the date when user has selected the date and it is being shown in the input box for the date picker.
+     * Please look at the angular Date pipe for valid formats and variations.
+     */
+    dateDisplayFormat: string;
+    /**
+     * @description
+     * The time display format.
+     */
+    timeDisplayFormat: string;
+    /**
+     * @description
+     * A locale code for the locale format rules to use. When not supplied, uses the value of LOCALE_ID, which is en-US by default.
+     * This requires that registerLocaleData is called with the respective locale.
+     */
+    locale: string;
+    /**
+     * @description
+     * A modifier to remove the padding and margins around the element.
+     */
+    compact: boolean;
+    /**
+     * @description
+     * Disable possibility to select outbound dates.
+     */
+    outboundDisabled: boolean;
+    /**
+     * @description
+     * Disable possibility to select inbound dates.
+     */
+    inboundDisabled: boolean;
+    /**
+     * @description
+     * Show/Add date picker combo into the filter if set to true.
+     */
+    enableDatepickers: boolean;
+    /**
+     * @required
+     * @description
+     * Label for the toggle icon for minimizing filter.
+     */
+    minimizingLabel: string;
+    /**
+     * @required
+     * @description
+     * Label for the toggle icon for maximizing filter.
+     */
+    maximizingLabel: string;
+    /**
+     * @required
+     * @description
+     * Label for the toggling transit type when filter is minimized.
+     */
+    directOnlyMobileLabel: string;
+    /**
+     * @description
+     * Label for 'or' in the suggestioned airports.
+     */
+    orLabel: string;
+    /**
+     * @description
+     * A text that appears in the destinations dropdown list when origin airport is not set.
+     */
+    invalidDestinationText: string;
+    /**
+     * @description
+     * Selected datefor outbound calendar.
+     */
+    get outboundSelectedDate(): UtcDate;
+    set outboundSelectedDate(date: UtcDate);
+    /**
+     * @description
+     * Selected datefor inbound calendar.
+     */
+    get inboundSelectedDate(): UtcDate;
+    set inboundSelectedDate(date: UtcDate);
+    /**
+     * @description
+     * Will display passenger select, set this to false to remove it. It's true by default.
+     */
+    enablePassengersSelect: boolean;
+    /**
+     * @description
+     * Will display the trip switch, set this to false to remove it. It's true by default.
+     */
+    enableTripSwitch: boolean;
+    /**
+     * @description
+     * Will display the transit switch, set this to false to remove it. It's true by default.
+     */
+    enableTransitSwitch: boolean;
+    /**
+     * @description
+     * When selected datehas been changed on the outbound calendar.
+     */
+    outboundSelectedDateChange: EventEmitter<UtcDate>;
+    /**
+     * @description
+     * When selected datehas been changed on the inbound calendar.
+     */
+    inboundSelectedDateChange: EventEmitter<UtcDate>;
+    /**
+     * @description
+     * Outbound datepicker is open or closed.
+     */
+    outboundOpenChange: EventEmitter<boolean>;
+    /**
+     * @description
+     * Inbound datepicker is open or closed.
+     */
+    inboundOpenChange: EventEmitter<boolean>;
+    /**
+     * @description
+     * Outbound calendar changes month.
+     */
+    outboundMonthChange: EventEmitter<UtcDate>;
+    /**
+     * @description
+     * Inbound calendar changes month.
+     */
+    inboundMonthChange: EventEmitter<UtcDate>;
+    /**
+     * @description
+     * When a user has actively changed the date.
+     */
+    focusOnNextChange: EventEmitter<any>;
+    /**
+     * @description
+     * The geolocation of the user. Will be emitted if 'enableSuggestions' is true.
+     */
+    positionChange: EventEmitter<GeolocationPosition>;
+    /**
+     * @description
+     * An even that is fired every time the info button on the subsidy discount is clicked.
+     */
+    subsidyDiscountInfoClick: EventEmitter<any>;
+    get inboundSelectedMonth(): UtcDate;
+    set inboundSelectedMonth(month: UtcDate);
+    private outboundSelectedDateValue;
+    private inboundSelectedDateValue;
+    private inboundSelectedMonthValue;
+    private airportsValue;
+    private tripTypeValue;
+    private directOnlyValue;
+    private expandedAccordionMobileValue;
+    private closestAirportsValue;
+    private outboundOpenValue;
+    private inboundOpenValue;
+    private passengersValue;
+    private focusAsyncTimout;
+    private transitSwitchFocusTimeout;
+    private tripSwitchFocusTimeout;
+    constructor(deviceHelper: DeviceHelper, sortService: SortService, abandonedBasketService: AbandonedBasketService, dateService: DateHelper, elementRef: ElementRef, changeDetector: ChangeDetectorRef);
+    ngOnInit(): void;
+    ngAfterViewChecked(): void;
+    onSubsidyDiscountInfoClick(): void;
+    onSubsidyDiscountSelectChange(model: SubsidyDiscountModel): void;
+    getClosestAirports(position: GeolocationPosition): void;
+    getFilterClass(element?: string, modifiersInput?: any): ClassModel;
+    getAirportSelectClass(): ClassModel;
+    getSuggestions(): Array<AirportModel>;
+    getDatePickersClass(): ClassModel;
+    getTravelDetailsClass(element?: string, modifiersInput?: any): ClassModel;
+    onInboundMonthChange(month: UtcDate): void;
+    onOutboundMonthChange(month: UtcDate): void;
+    onPassengersSelectFocusOnPrevious(): void;
+    passengerKeyDown(event: KeyboardEvent): void;
+    onTripSwitchKeyDown(event: KeyboardEvent): void;
+    transitKeyDown(event: KeyboardEvent): void;
+    onSubsidyDiscountInfoButtonKeydown(event: KeyboardEvent): void;
+    onPassengersSelectFocusOnNext(): void;
+    focusAsync(refElement: ElementRef): void;
+    onDatepickerFocusOnPrevious(event: KeyboardEvent | MouseEvent): void;
+    selectPreviousControl(): void;
+    onFocusOnNextChange(event: KeyboardEvent | MouseEvent): void;
+    isMobileDisplay(): boolean;
+    isTabletDisplay(): boolean;
+    onOriginOpen(open: boolean): void;
+    validateAirportValues(): boolean;
+    updateMaximize(): void;
+    onDestinationOpen(open: boolean): void;
+    onPassengerSelectOpen(open: boolean): void;
+    onTripSwitchOpen(open: boolean): void;
+    onTransitSwitchOpen(open: boolean): void;
+    onOriginChange(airport: AirportModel): void;
+    setSelectedOriginAirport(airport: AirportModel): void;
+    onDestinationChange(airport: AirportModel): void;
+    setFocusOnPassengerSelect(event: KeyboardEvent): void;
+    setFocusOnNativeElement(element: ElementRef): void;
+    onTripTypeChange(tripType: TripType): void;
+    onTransitChange(directOnly: boolean): void;
+    getTravelDetailsTripSwitchIconClass(modifiers?: any): Array<ClassModel>;
+    getTripSwitchLabel(): string;
+    getTransitLabel(): string;
+    onAccordionToggleChange(expanded: boolean): void;
+    getSummary(): string;
+    shouldMaximize(): boolean;
+    private focusOnAirportSelectBackwards;
+    private setLatestSearches;
+    private closeDropdowns;
+}

package/lib/components/filter/filter.module.d.ts

@@ -0,0 +1,2 @@
+export declare class FilterModule {
+}

package/lib/components/filter/index.d.ts

@@ -0,0 +1,3 @@
+export * from './filter.component';
+export * from './filter.module';
+export * from './enums/trip-type.enum';