@norwegian/core-components 5.1.0

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

@@ -0,0 +1,115 @@
+/**
+ * @license
+ * Copyright Norwegian Air Shuttle. All Rights Reserved.
+ */
+import { AutocompleteModel } from './models/autocomplete.model';
+import { ElementRef, EventEmitter, OnInit } from '@angular/core';
+import { NasComponentBase } from '../../core';
+import { FormGroup } from '@angular/forms';
+/**
+ * @description
+ * Norwegian Airport Select Component | Form Controls
+ */
+export declare class AutocompleteComponent extends NasComponentBase implements OnInit {
+    private document;
+    filteredItems: Array<AutocompleteModel>;
+    focused: AutocompleteModel;
+    get showBackdrop(): boolean;
+    set showBackdrop(value: boolean);
+    input: ElementRef;
+    results: ElementRef;
+    /**
+     * @description
+     * A label that will appear inside the text field.
+     */
+    label: string;
+    /**
+     * @description
+     * A placeholder that will appear inside the text field.
+     */
+    placeholder: string;
+    /**
+     * @description
+     * An icon that will appear inside the text field.
+     */
+    icon: string;
+    /**
+     * @description
+     * An array of items that will appear inside the dropdown list.
+     */
+    get items(): Array<AutocompleteModel>;
+    set items(items: Array<AutocompleteModel>);
+    /**
+     * @description
+     * Can set and listen to wheather the dropdown list is or should be open or not.
+     */
+    get open(): boolean;
+    set open(open: boolean);
+    /**
+     * @description
+     * Can set and listen to changes in the model of the text field.
+     */
+    get model(): string;
+    set model(model: string);
+    /**
+     * @description
+     * Disables the backdrop on focus.
+     */
+    disableBackdrop: boolean;
+    /**
+     * @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.
+     */
+    nasFormControlName: 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
+     * Adds an aria-label attribute to the backdrop button.
+     */
+    ariaLabelBackdrop: string;
+    /**
+     * @description
+     * Adds 'aria-label' on the clear button inside input.
+     */
+    ariaLabelClear: string;
+    /**
+     * @description
+     * Is fired when the next element should be focused.
+     */
+    focusOnNext: EventEmitter<any>;
+    /**
+     * @description
+     * Is fired when the user selects an item in the dropdown list.
+     */
+    selectedChange: EventEmitter<AutocompleteModel>;
+    openChange: EventEmitter<boolean>;
+    modelChange: EventEmitter<string>;
+    private index;
+    private openValue;
+    private itemsValue;
+    private modelValue;
+    private componentId;
+    constructor(document: any);
+    ngOnInit(): void;
+    getResultsId(): string;
+    getLabelId(): string;
+    getInputId(): string;
+    setOpen(): void;
+    filter(): void;
+    onKeyDown(event: KeyboardEvent): void;
+    clearSelected(event: any): void;
+    select(item: AutocompleteModel): void;
+    blur(): void;
+    private focusDown;
+    private focusUp;
+    private pathReactiveFormControl;
+    private autoScroll;
+}

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

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

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

@@ -0,0 +1,3 @@
+export * from './autocomplete.component';
+export * from './autocomplete.module';
+export * from './models/autocomplete.model';

package/lib/components/autocomplete/models/autocomplete.model.d.ts

@@ -0,0 +1,5 @@
+export interface AutocompleteModel {
+    title: string;
+    preamble?: string;
+    id: string;
+}

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

@@ -0,0 +1,32 @@
+/**
+ * @license
+ * Copyright Norwegian Air Shuttle. All Rights Reserved.
+ */
+import { OnInit, EventEmitter } from '@angular/core';
+import { NasComponentBase } from '../../core/base/nas-component.base';
+/**
+ * @description
+ * Norwegian Back drop Component | Functional
+ */
+export declare class BackdropComponent extends NasComponentBase implements OnInit {
+    show: boolean;
+    /**
+     * @description
+     * Event emmitted when showBackdrop is changed.
+     */
+    showBackdropChange: EventEmitter<boolean>;
+    /**
+     * @description
+     * backdrop show/hide.
+     */
+    get showBackdrop(): boolean;
+    set showBackdrop(value: boolean);
+    /**
+     * @description
+     * Adds an aria-label attribute to the button
+     */
+    ariaLabelBackdrop: string;
+    constructor();
+    ngOnInit(): void;
+    onClose(event: KeyboardEvent): void;
+}

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

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

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

@@ -0,0 +1,2 @@
+export * from './backdrop.module';
+export * from './backdrop.component';

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

@@ -0,0 +1,69 @@
+/**
+ * @license
+ * Copyright Norwegian Air Shuttle. All Rights Reserved.
+ */
+import { NasComponentBase } from '../../core/base/nas-component.base';
+import { ClassModel } from '../../core/models/class.model';
+/**
+ * @description
+ * Norwegian Box Component | Layout
+ */
+export declare class BoxComponent extends NasComponentBase {
+    /**
+     * @description
+     * Boolean to set outlined style; white box with blue border.
+     */
+    outlined: boolean;
+    /**
+     * @description
+     * Boolean to set primary style; red box.
+     */
+    primary: boolean;
+    /**
+     * @description
+     * Boolean to set secondary style; blue box.
+     */
+    secondary: boolean;
+    /**
+     * @description
+     * Boolean to set light style; white box.
+     */
+    light: boolean;
+    /**
+     * @description
+     * Boolean to set transparent style. Box will be invisible, but include display properties as padding, margins etc.
+     */
+    transparent: boolean;
+    /**
+     * @description
+     * Boolean to give content of box center alignement.
+     */
+    center: boolean;
+    /**
+     * @description
+     * Boolean to remove all padding inside the box.
+     */
+    nopadding: boolean;
+    /**
+     * @description
+     * Boolean to remove all margins around the box.
+     */
+    nomargin: boolean;
+    /**
+     * @description
+     * Boolean to set 100% height of box.
+     */
+    stretch: boolean;
+    /**
+     * @description
+     * Boolean to set grey style.
+     */
+    grey: boolean;
+    /**
+   * Represent a box component.
+   * Will initiate correct block style.
+   */
+    constructor();
+    getModifiers(): Array<string>;
+    getClasses(element?: string, modifiers?: any): Array<ClassModel>;
+}

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

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

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

@@ -0,0 +1,2 @@
+export * from './box.component';
+export * from './box.module';

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

@@ -0,0 +1,238 @@
+/**
+ * @license
+ * Copyright Norwegian Air Shuttle. All Rights Reserved.
+ */
+import { EventEmitter, ElementRef } from '@angular/core';
+import { NasComponentBase } from '../../core/base/nas-component.base';
+import { ClassModel } from '../../core/models/class.model';
+/**
+ * @description
+ * Norwegian Button Component | Buttons and Indicators
+ */
+export declare class ButtonComponent extends NasComponentBase {
+    button: ElementRef<HTMLButtonElement>;
+    /**
+     * @description
+     * Boolean to set primary style of button (red).
+     *
+     * @example
+     * <nas-button primary>Click on me!</nas-button>
+     */
+    primary?: boolean;
+    /**
+     * @description
+     * Boolean to set secondary style of button (blue).
+     * Primary is default style.
+     *
+     * @example
+     * <nas-button secondary>Click on me!</nas-button>
+     */
+    secondary?: boolean;
+    /**
+     * @description
+     * Boolean to set link style of button. Button will look like a link, with underlined text.
+     *
+     * @example
+     * <nas-button link>Click on me!</nas-button>
+     */
+    link?: boolean;
+    /**
+     * @description
+     * Boolean to set approved style of button (green).
+     *
+     * @example
+     * <nas-button approve>Approve!</nas-button>
+     */
+    approve?: boolean;
+    /**
+     * @description
+     * Boolean to set light style of button (grey).
+     *
+     * @example
+     * <nas-button light>Click on me!</nas-button>
+     */
+    light?: boolean;
+    /**
+     * @description
+     * Boolean to set large style of button. Can be compined with primary, secondary, approved and light.
+     *
+     * @example
+     * <nas-button large>Click on me!</nas-button>
+     */
+    large?: boolean;
+    /**
+     * @description
+     * Boolean to set block style of button. Will have block behaviour.
+     * Can be compined with primary, secondary, approved and light.
+     *
+     * @example
+     * <nas-button block>Click on me!</nas-button>
+     */
+    block?: boolean;
+    /**
+     * @description
+     * Boolean to set flex style of button. Will have flex box behaviour.
+     * Can be compined with primary, secondary, approved and light.
+     *
+     * @example
+     * <nas-button flex>Click on me!</nas-button>
+     */
+    flex?: boolean;
+    /**
+     * @description
+     * Boolean to set compact style of button. Will be smaller, without "the line".
+     * Can be compined with primary, secondary, approved and light.
+     *
+     * @example
+     * <nas-button compact>Click on me!</nas-button>
+     */
+    compact?: boolean;
+    /**
+     * @description
+     * Boolean to set right style of button. Will be aligned at right.
+     * Can be compined with primary, secondary, approved and light.
+     *
+     * @example
+     * <nas-button right>Click on me!</nas-button>
+     */
+    right?: boolean;
+    /**
+     * @description
+     * Boolean to set spaceless style of button. Will remove space around button.
+     * Can be compined with primary, secondary, approved and light.
+     *
+     * @example
+     * <nas-button spaceless>Click on me!</nas-button>
+     */
+    spaceless?: boolean;
+    /**
+     * @description
+     * Boolean to set transparent style of button. Will be transparent.
+     *
+     * @example
+     * <nas-button transparent>Click on me!</nas-button>
+     */
+    transparent?: boolean;
+    /**
+     * @description
+     * String to support href.
+     * Can be combined with all other properties.
+     *
+     * @example
+     * <nas-button [href]="http://www.norwegian.com">Click on me!</nas-button>
+     */
+    href?: string;
+    /**
+     * @description
+     * String to be tracked by e.x. GTM og GA.
+     * Can be combined with all other properties.
+     *
+     * @example
+     * <nas-button [trackingValue]="trackingValue">Click on me!</nas-button>
+     */
+    trackingvalue?: string;
+    /**
+     * @description
+     * Boolean to override disabled. Button will be clickable even though disabled is set.
+     *
+     * @example
+     * <nas-button canContinueOnDisabled>Click on me!</nas-button>
+     */
+    canContinueOnDisabled?: boolean;
+    /**
+     * @description
+     * Boolean to set disabled. Button will get disabled styling.
+     *
+     * @example
+     * <nas-button disabled>Click on me!</nas-button>
+     */
+    disabled: boolean;
+    /**
+     * @description
+     * String to set button type. Default value is "button".
+     *
+     * @example
+     * <nas-button [type]="'submit'">Click on me!</nas-button>
+     */
+    type: string;
+    /**
+     * @description
+     * Adds custom CSS class to the button. Button will sett additional custom styling.
+     *
+     * @example
+     * <nas-button [cssClass]="'my-custom-class'">Click on me!</nas-button>
+     */
+    cssClass?: ClassModel;
+    /**
+     * @description
+     * String to set aria label on button.
+     *
+     * @example
+     * <nas-button [ariaLabel]="'this is my aria label'">Click on me!</nas-button>
+     */
+    ariaLabel?: string;
+    /**
+     * @description
+     * Property to set custom styling on button.
+     *
+     * @example
+     * <nas-button [cssStyle]="{'width': '300px', 'height': '40px'}">Click on me!</nas-button>
+     */
+    cssStyle: any;
+    /**
+     * @description
+     * Number to set custom tab index on button.
+     *
+     * @example
+     * <nas-button [tabIndex]="10">Click on me!</nas-button>
+     */
+    tabindex: number;
+    /**
+     * @description
+     * Boolean to override base css class.
+     *
+     * @example
+     * <nas-button [overrideBaseCssClass]="true">Click on me!</nas-button>
+     */
+    overrideBaseCssClass?: boolean;
+    /**
+     * @description
+     * Use router link instead of href on links
+     */
+    useRouterLink?: boolean;
+    /**
+     * @description
+     * The ID of the native button element
+     */
+    id: string;
+    /**
+     * @description
+     * The target attribute specifies where to open the link.
+     * @example
+     * <nas-button link href="https://www.norwegian.com" target="_blank">Click on me!</nas-button>
+     */
+    target: string;
+    /**
+     * @description
+     * Change event when clicking on button.
+     *
+     * @example
+     * <nas-button (clickChange)="myFunction()">Click on me!</nas-button>
+     */
+    clickChange: EventEmitter<Event>;
+    get buttonStyle(): any;
+    get buttonId(): string;
+    get modifiers(): Array<string>;
+    private trackingEventSource;
+    trackingEvent$: import("rxjs").Observable<string>;
+    private componentId;
+    /**
+     * @description
+     * Represent a button component.
+     * Will initiate correct block style.
+     */
+    constructor();
+    getClasses(element?: string, modifiers?: any): Array<ClassModel>;
+    emitTrackingEvent(): void;
+    emitTrackingAndClickEvent(event: Event): void;
+}

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

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

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

@@ -0,0 +1,2 @@
+export * from './button.component';
+export * from './button.module';

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

@@ -0,0 +1,119 @@
+/**
+ * @license
+ * Copyright Norwegian Air Shuttle. All Rights Reserved.
+ */
+import { FormGroup } from '@angular/forms';
+import { NasComponentBase } from '../../core/base/nas-component.base';
+import { ClassModel } from '../../core/models/class.model';
+import { EventEmitter, ElementRef, OnInit } from '@angular/core';
+/**
+ * @description
+ * Norwegian Checkbox Component | Form Controls
+ */
+export declare class CheckboxComponent extends NasComponentBase implements OnInit {
+    input: ElementRef;
+    inputReactive: ElementRef;
+    /**
+     * @description
+     * Sets the Id of the native input element
+     */
+    get inputId(): string;
+    set inputId(value: string);
+    /**
+     * @description
+     * The value attribute is bound to ngModel of the native input element.
+     */
+    value: string;
+    /**
+     * @description
+     * Boolean setting error styling of the checkbox. Usefull for validation.
+     */
+    error: boolean;
+    /**
+     * @description
+     * Boolean to disable the checkbox.
+     */
+    disabled: boolean;
+    /**
+     * @description
+     * Boolean to set display as block
+     */
+    block: boolean;
+    /**
+     * @description
+     * Boolean to set spaceless styling - remove space around component.
+     */
+    spaceless: boolean;
+    /**
+     * @description
+     * Boolean to set inverted styling.
+     */
+    inverted: boolean;
+    /**
+     * @description
+     * Boolean to set outlined styling
+     */
+    outlined: boolean;
+    /**
+     * @description
+     * Used to set the 'aria-label' attribute on the underlying input element.
+     */
+    ariaLabel: string;
+    /**
+     * @description
+     * The 'aria-labelledby' attribute takes precedence as the element's text alternative.
+     */
+    ariaDescribedby: string;
+    /**
+     * @description
+     * The 'aria-describedby' attribute is read after the element's label and field type.
+     */
+    ariaLabelledby: string;
+    /**
+     * @description
+     * String to set name on native input element
+     */
+    name: string;
+    /**
+     * @description
+     * String to set required on native input element
+     */
+    required: boolean;
+    /**
+     * @description
+     * String to set tabIndex on native input element
+     */
+    tabIndex: number;
+    get checked(): boolean;
+    set checked(value: boolean);
+    /**
+     * @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.
+     */
+    nasFormControlName: 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;
+    checkedChange: EventEmitter<boolean>;
+    focusOnPrevious: EventEmitter<KeyboardEvent>;
+    get mainClass(): ClassModel;
+    private checkedValue;
+    private componentId;
+    private inputIdValue;
+    /**
+     * @description
+     * Represent a checkbox component.
+     * Will initiate correct block style.
+     */
+    constructor();
+    ngOnInit(): void;
+    inputChanged(event: Event): void;
+    inputClicked(event: Event): void;
+    onKeydown(event: KeyboardEvent): void;
+}

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

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

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

@@ -0,0 +1,2 @@
+export * from './checkbox.component';
+export * from './checkbox.module';

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

@@ -0,0 +1,61 @@
+/**
+ * @license
+ * Copyright Norwegian Air Shuttle. All Rights Reserved.
+ */
+import { OnInit } from '@angular/core';
+import { NasComponentBase, ClassModel } from '../../core';
+/**
+ * @description
+ * Norwegian Chip Component | Buttons and Indicators
+ */
+export declare class ChipComponent extends NasComponentBase implements OnInit {
+    /**
+     * @description
+     * Boolean to set primary style of the chip (red).
+     *
+     * @example
+     *
+     * ```html
+     * <nas-chip primary>Primary</nas-chip>
+     * ```
+     *
+     */
+    primary?: boolean;
+    /**
+     * @description
+     * Boolean to set approve style of the chip (green).
+     *
+     * @example
+     *
+     * ```html
+     * <nas-chip approve>Approve</nas-chip>
+     * ```
+     *
+     */
+    approve?: boolean;
+    /**
+     * @description
+     * Property to set custom styling on button.
+     *
+     * @example
+     *
+     * ```html
+     * <nas-chip [cssStyle]="{'width': '300px', 'height': '40px'}"></nas-chip>
+     * ```
+     *
+     */
+    cssStyle: any;
+    /**
+     * @description
+     * Boolean to set the component style to small.
+     *
+     * @example
+     * ```html
+     * <nas-chip small>Small</nas-chip>
+     * ```
+     */
+    small?: boolean;
+    constructor();
+    ngOnInit(): void;
+    getChipClass(): ClassModel;
+}

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

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

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

@@ -0,0 +1,2 @@
+export * from './chip.component';
+export * from './chip.module';