@testgorilla/tgo-ui 1.1.0 → 1.2.1

package/fesm2015/testgorilla-tgo-ui.mjs

@@ -1,4282 +0,0 @@
-import { trigger, transition, animate, style, state } from '@angular/animations';
-import * as i0 from '@angular/core';
-import { Component, ViewEncapsulation, Input, EventEmitter, Output, ChangeDetectionStrategy, NgModule, forwardRef, HostBinding, Directive, HostListener, Injectable, Inject, APP_INITIALIZER, Pipe, ViewChild } from '@angular/core';
-import * as i1$1 from '@angular/common';
-import { CommonModule } from '@angular/common';
-import * as i2$1 from '@angular/material/button';
-import { MatButtonModule } from '@angular/material/button';
-import * as i1 from '@angular/material/icon';
-import { MatIconModule } from '@angular/material/icon';
-import * as i2 from '@angular/platform-browser';
-import * as i4 from '@angular/material/progress-spinner';
-import { MatProgressSpinnerModule } from '@angular/material/progress-spinner';
-import { HttpClientModule } from '@angular/common/http';
-import * as i1$2 from '@angular/material/card';
-import { MatCardModule } from '@angular/material/card';
-import * as i1$3 from '@angular/forms';
-import { NG_VALUE_ACCESSOR, FormsModule, ReactiveFormsModule, Validators, FormGroup, FormControl } from '@angular/forms';
-import * as i2$2 from '@angular/material/checkbox';
-import { MatCheckboxModule } from '@angular/material/checkbox';
-import * as i2$3 from '@angular/material/form-field';
-import { MatFormFieldModule } from '@angular/material/form-field';
-import * as i3 from '@angular/material/input';
-import { MatInputModule } from '@angular/material/input';
-import * as i5 from '@angular-material-extensions/password-strength';
-import { MatPasswordStrengthModule } from '@angular-material-extensions/password-strength';
-import * as i1$4 from '@angular/material/dialog';
-import { MatDialogModule, MAT_DIALOG_DATA, MatDialogRef } from '@angular/material/dialog';
-import * as i1$5 from '@angular/material/progress-bar';
-import { MatProgressBarModule } from '@angular/material/progress-bar';
-import * as i2$4 from '@angular/material/toolbar';
-import { MatToolbarModule } from '@angular/material/toolbar';
-import * as i5$1 from '@angular/material/menu';
-import { MatMenuModule } from '@angular/material/menu';
-import * as i6$1 from '@angular/material/core';
-import { MatRippleModule, MatNativeDateModule } from '@angular/material/core';
-import * as i1$6 from '@angular/material/paginator';
-import { MatPaginatorModule } from '@angular/material/paginator';
-import * as i2$5 from '@angular/material/radio';
-import { MatRadioModule } from '@angular/material/radio';
-import * as i1$8 from '@angular/material/snack-bar';
-import { MAT_SNACK_BAR_DATA } from '@angular/material/snack-bar';
-import { __decorate } from 'tslib';
-import { UntilDestroy } from '@ngneat/until-destroy';
-import * as i1$7 from '@ngneat/transloco';
-import { TranslocoModule, TranslocoService } from '@ngneat/transloco';
-import { lastValueFrom, Subscription, ReplaySubject, debounceTime, map } from 'rxjs';
-import * as i4$1 from '@angular/material/sort';
-import { MatSort, MatSortModule } from '@angular/material/sort';
-import * as i3$1 from '@angular/material/table';
-import { MatTableDataSource, MatTableModule } from '@angular/material/table';
-import * as i6 from '@angular/material/tooltip';
-import { MatTooltipModule } from '@angular/material/tooltip';
-import * as i5$2 from '@angular/material/select';
-import { MatSelectModule } from '@angular/material/select';
-import * as i6$2 from '@angular/material/datepicker';
-import { MatDatepickerModule } from '@angular/material/datepicker';
-
-const alertBarsUtil = {
-    //Set css class and iconName according type
-    setIcon: (alertType) => {
-        if (alertType === 'success') {
-            return 'Round-check';
-        }
-        if (alertType === 'info') {
-            return 'Info';
-        }
-        if (alertType === 'warning') {
-            return 'Warning';
-        }
-        if (alertType === 'error') {
-            return 'Error';
-        }
-        return '';
-    },
-    //Set cssClass for fixed or static position
-    setPosition: (fixed) => {
-        if (fixed === true) {
-            return 'fixed';
-        }
-        else {
-            return 'static';
-        }
-    },
-    //Set css class for alertbanner
-    setCssClass: (fullWidth, type, position) => {
-        const isFullWidth = !!fullWidth ? 'full-width' : '';
-        return `${type} ${position} ${isFullWidth}`;
-    },
-};
-
-// Data of all tgoIcons
-const tgoIcons = [
-    'Add',
-    'Archive',
-    'Arrow_down',
-    'Arrow_left',
-    'Arrow_right',
-    'Arrow_up',
-    'Assessment',
-    'Attempts',
-    'Book',
-    'Calendar',
-    'Candidates',
-    'Chat-notifications',
-    'Chat',
-    'Check',
-    'Clone',
-    'Close',
-    'Code',
-    'Company',
-    'Copy',
-    'Custom-questions',
-    'Delete',
-    'Devices',
-    'Document',
-    'Download',
-    'Edit',
-    'Email-message',
-    'Empty-placeholder',
-    'Error',
-    'Essay',
-    'Eye-hide',
-    'Eye-view',
-    'Feedback-1',
-    'Feedback-2',
-    'Feedback-3',
-    'Feedback-4',
-    'Feedback-5',
-    'File-attach',
-    'File-upload',
-    'Filter',
-    'Folder',
-    'Format-add-file',
-    'Format-add-table',
-    'Format-align-L',
-    'Format-align-R',
-    'Format-align-center',
-    'Format-align-justify',
-    'Format-bold',
-    'Format-code-active',
-    'Format-code-block',
-    'Format-edit-table',
-    'Format-format',
-    'Format-function',
-    'Format-italics',
-    'Format-list-bulleted',
-    'Format-list-numbered',
-    'Format-picker',
-    'Format-quote',
-    'Format-subscript',
-    'Format-superscript',
-    'Format-text-direction-L',
-    'Format-text-direction-R',
-    'Format-text-size',
-    'Format-underline',
-    'Format-variable',
-    'Full-screen',
-    'Gender-female',
-    'Gender-male',
-    'Help-2',
-    'Help',
-    'Image',
-    'Info',
-    'Integration',
-    'Language',
-    'Layout',
-    'Learn',
-    'Level',
-    'Light-bulb',
-    'Link',
-    'Loading-spinner',
-    'Localisation',
-    'Location',
-    'Lock',
-    'Log-out',
-    'Menu-burger',
-    'Menu-ellipsis',
-    'Microphone',
-    'Minus',
-    'Mouse-cursor',
-    'Mouse-grab-cursor',
-    'Mouse',
-    'Multi-choice',
-    'Notifications',
-    'Password',
-    'Path',
-    'Plan-billing',
-    'Plus',
-    'Premium',
-    'Promotion',
-    'Question-count',
-    'Refer',
-    'Reset',
-    'Review',
-    'Round-check-filled',
-    'Round-check',
-    'Search',
-    'Secure-checkout',
-    'Send',
-    'Settings',
-    'Social-facebook',
-    'Social-instagram',
-    'Social-linkedin',
-    'Sorting-down-1',
-    'Sorting-down',
-    'Speedometer',
-    'Star-filled',
-    'Star-half',
-    'Star-outline',
-    'Support',
-    'Sync',
-    'Team',
-    'Test',
-    'Thunder',
-    'Timer',
-    'Type',
-    'Unarchive',
-    'Unlock',
-    'Upgrade',
-    'Upload',
-    'User-access',
-    'User-add',
-    'User-invite',
-    'User-profile',
-    'User-reject',
-    'User-switch',
-    'Video-pause',
-    'Video-play',
-    'Video-record',
-    'Video',
-    'Volume',
-    'Warning',
-    'Zoom-in',
-    'Zoom-out',
-];
-
-class IconComponent {
-    constructor(matIconRegistry, domSanitzer) {
-        this.matIconRegistry = matIconRegistry;
-        this.domSanitzer = domSanitzer;
-        /**
-         * Icon size
-         *
-         * @type {IconSize}
-         * @memberof IconComponent
-         */
-        this.size = '16';
-        /**
-         * Icon css class
-         *
-         * @memberof IconComponent
-         */
-        this.cssClass = '';
-        /**
-         * Icon color
-         *
-         * @type {IconColor}
-         * @memberof IconComponent
-         */
-        this.color = 'black';
-    }
-    ngOnInit() {
-        this.customCssClass = this.setCssClass();
-        this.addIcon();
-    }
-    ngOnChanges(changes) {
-        if (changes['size'] || changes['cssClass'] || changes['color']) {
-            this.customCssClass = this.setCssClass();
-        }
-        if (changes['name']) {
-            this.addIcon();
-        }
-    }
-    //set css class for size
-    setCssClass() {
-        return `${this.cssClass} size-${this.size} ${this.color}`;
-    }
-    //Add icon to matIcon registry
-    addIcon() {
-        const filename = tgoIcons.find(icon => icon === this.name);
-        if (filename) {
-            this.matIconRegistry.addSvgIcon(filename, this.domSanitzer.bypassSecurityTrustResourceUrl(`/icons/${filename}.svg`));
-        }
-    }
-}
-IconComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: IconComponent, deps: [{ token: i1.MatIconRegistry }, { token: i2.DomSanitizer }], target: i0.ɵɵFactoryTarget.Component });
-IconComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: IconComponent, selector: "ui-icon", inputs: { size: "size", cssClass: "cssClass", name: "name", color: "color" }, usesOnChanges: true, ngImport: i0, template: "<mat-icon [svgIcon]=\"name\" [attr.class]=\"customCssClass\"></mat-icon>\n", styles: ["mat-icon{display:flex}mat-icon.size-16 svg{width:16px;height:16px}mat-icon.size-24 svg{width:24px;height:24px}mat-icon.size-80 svg{width:80px;height:80px}mat-icon.dark svg{color:#888}mat-icon.white svg{color:#fff}mat-icon.teal svg{color:#46a997}mat-icon.petrol svg{color:#276678}mat-icon.black svg{color:#000}\n"], dependencies: [{ kind: "component", type: i1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }], encapsulation: i0.ViewEncapsulation.None });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: IconComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'ui-icon', encapsulation: ViewEncapsulation.None, template: "<mat-icon [svgIcon]=\"name\" [attr.class]=\"customCssClass\"></mat-icon>\n", styles: ["mat-icon{display:flex}mat-icon.size-16 svg{width:16px;height:16px}mat-icon.size-24 svg{width:24px;height:24px}mat-icon.size-80 svg{width:80px;height:80px}mat-icon.dark svg{color:#888}mat-icon.white svg{color:#fff}mat-icon.teal svg{color:#46a997}mat-icon.petrol svg{color:#276678}mat-icon.black svg{color:#000}\n"] }]
-        }], ctorParameters: function () { return [{ type: i1.MatIconRegistry }, { type: i2.DomSanitizer }]; }, propDecorators: { size: [{
-                type: Input
-            }], cssClass: [{
-                type: Input
-            }], name: [{
-                type: Input
-            }], color: [{
-                type: Input
-            }] } });
-
-/* eslint-disable @angular-eslint/use-lifecycle-interface */
-class ButtonComponent {
-    constructor() {
-        /**
-         * Define button height
-         *
-         * @type {ButtonSize}
-         * @memberof ButtonComponent
-         */
-        this.size = 'big';
-        /**
-         * Background color of the button while in active state
-         *
-         * @type {ButtonColor}
-         * @memberof ButtonComponent
-         */
-        this.type = 'primary';
-        /**
-         * Text content to appear on the button
-         *
-         * @memberof ButtonComponent
-         */
-        this.label = '';
-        /**
-         * Positioning of the icon (when existant)
-         *
-         * @type {ButtonIconPosition}
-         * @memberof ButtonComponent
-         */
-        this.iconPosition = 'right';
-        /**
-         * Define if button has only icon without text
-         *
-         * @memberof ButtonComponent
-         */
-        this.justIcon = false;
-        /**
-         * Name of ui-icon
-         *
-         * @type {IconName}
-         * @memberof ButtonComponent
-         */
-        this.iconName = '';
-        /**
-         * Indicator if the button should be disabled
-         *
-         * @memberof ButtonComponent
-         */
-        this.disabled = false;
-        /**
-         * Indicator if the loading icon should be shown
-         *
-         * @memberof ButtonComponent
-         */
-        this.loading = false;
-        /**
-         * Indicator of the button width
-         *
-         * @memberof ButtonComponent
-         */
-        this.fullWidth = false;
-        this.buttonClickEvent = new EventEmitter();
-        this.buttonHoverEvent = new EventEmitter();
-    }
-    ngOnInit() {
-        this.classCss = this.setCssClass();
-        this.isButtonLink = this.showButtonLink();
-        this.isLabel = this.showLabel();
-    }
-    ngOnChanges(changes) {
-        if (changes['type']) {
-            this.isButtonLink = this.showButtonLink();
-        }
-        if (changes['loading']) {
-            this.isLabel = this.showLabel();
-        }
-        if (changes['type'] ||
-            changes['fullWidth'] ||
-            changes['iconName'] ||
-            changes['justIcon'] ||
-            changes['iconPosition']) {
-            this.classCss = this.setCssClass();
-        }
-    }
-    buttonClick(event) {
-        this.buttonClickEvent.emit(event);
-    }
-    buttonHover(event) {
-        this.buttonHoverEvent.emit(event);
-    }
-    //Show or hide label
-    showLabel() {
-        return !this.loading;
-    }
-    //Set css class according inputs
-    setCssClass() {
-        const width = this.fullWidth ? 'full-width' : '';
-        const hasIcon = this.iconName === null ? '' : 'icon';
-        const justIcon = this.justIcon ? 'only-icon' : '';
-        const iconPosition = this.iconPosition === undefined ? '' : this.iconPosition;
-        return `${this.size} ${iconPosition} ${this.type} ${width} ${hasIcon} ${justIcon}`;
-    }
-    //Show or hide spinner
-    showSpinner() {
-        const isNotTab = this.type !== 'tab';
-        const isNotLink = this.type !== 'link';
-        const isLoading = this.loading === true;
-        return isLoading && isNotTab && isNotLink;
-    }
-    //Show button with <button> or <a> tag
-    showButtonLink() {
-        return this.type !== 'link';
-    }
-}
-ButtonComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: ButtonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-ButtonComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: ButtonComponent, selector: "ui-button", inputs: { size: "size", type: "type", label: "label", iconPosition: "iconPosition", justIcon: "justIcon", iconName: "iconName", disabled: "disabled", loading: "loading", fullWidth: "fullWidth", url: "url", urlTarget: "urlTarget", value: "value" }, outputs: { buttonClickEvent: "buttonClickEvent", buttonHoverEvent: "buttonHoverEvent" }, usesOnChanges: true, ngImport: i0, template: "<button\n  [ngClass]=\"classCss\"\n  [disabled]=\"disabled\"\n  (click)=\"buttonClick($event)\"\n  (mouseenter)=\"buttonHover($event)\"\n  [disableRipple]=\"true\"\n  *ngIf=\"isButtonLink\"\n  mat-flat-button>\n    <span class=\"icon-only-wrapper\" *ngIf=\"justIcon === true && !!iconName\">\n      <span class=\"icon only\" role=\"label\" [attr.aria-label]=\"label\"><ui-icon [name]=\"iconName\" size=\"24\"></ui-icon></span>\n    </span>\n    <span class=\"icon-label-wrapper\" [ngClass]=\"{'center-text': iconName === ''}\" *ngIf=\"justIcon === false\">\n      <span class=\"icon\" *ngIf=\"iconPosition === 'left' && !!iconName\" aria-hidden=\"true\"><ui-icon [name]=\"iconName\" size=\"24\"></ui-icon></span>\n      <span *ngIf=\"isLabel\" class=\"label\">{{ label }}</span>\n      <span class=\"icon\" *ngIf=\"iconPosition === 'right' && !!iconName\" aria-hidden=\"true\"><ui-icon [name]=\"iconName\" size=\"24\"></ui-icon></span>\n      <span class=\"spinner-wrapper\" *ngIf=\"showSpinner()\">\n        <mat-spinner class=\"position-spinner\" aria-label=\"loading\" mode=\"indeterminate\" diameter=\"24\"></mat-spinner>\n      </span>\n    </span>\n</button>\n<a\n  [ngClass]=\"classCss\"\n  [disabled]=\"disabled\"\n  (click)=\"buttonClick($event)\"\n  (mouseenter)=\"buttonHover($event)\"\n  [disableRipple]=\"true\"\n  *ngIf=\"!isButtonLink\"  \n  [href]=\"url\" \n  [target]=\"urlTarget\"\n  mat-flat-button>\n    <span class=\"icon-label-wrapper\">\n      {{ label }}\n    </span>\n</a>\n", styles: [":host{display:flex}button.mat-mdc-unelevated-button,a.mat-mdc-unelevated-button{font-size:14px;font-weight:600;line-height:normal;letter-spacing:normal}button.mat-mdc-unelevated-button .spinner-wrapper,a.mat-mdc-unelevated-button .spinner-wrapper{display:flex;align-items:center;flex-flow:column;width:100%}button.mat-mdc-unelevated-button .icon,a.mat-mdc-unelevated-button .icon{display:flex;height:100%;align-items:center}button.mat-mdc-unelevated-button .icon.only,a.mat-mdc-unelevated-button .icon.only{align-items:center;flex-flow:column;justify-content:center;margin-left:0}button.mat-mdc-unelevated-button .icon-label-wrapper,a.mat-mdc-unelevated-button .icon-label-wrapper{display:flex;align-items:center;justify-content:center;height:100%}button.mat-mdc-unelevated-button .icon-label-wrapper.center-text,a.mat-mdc-unelevated-button .icon-label-wrapper.center-text{flex-flow:column;width:100%}button.mat-mdc-unelevated-button .icon-label-wrapper .label,a.mat-mdc-unelevated-button .icon-label-wrapper .label{display:flex;height:100%;align-items:center}button.mat-mdc-unelevated-button.big,a.mat-mdc-unelevated-button.big{height:48px;padding:12px 16px}button.mat-mdc-unelevated-button.small,a.mat-mdc-unelevated-button.small{height:38px;padding:7px 11px}button.mat-mdc-unelevated-button.small.left .icon,button.mat-mdc-unelevated-button.big.left .icon,a.mat-mdc-unelevated-button.small.left .icon,a.mat-mdc-unelevated-button.big.left .icon{margin-right:8px}button.mat-mdc-unelevated-button.small.right .icon,button.mat-mdc-unelevated-button.big.right .icon,a.mat-mdc-unelevated-button.small.right .icon,a.mat-mdc-unelevated-button.big.right .icon{margin-left:8px}button.mat-mdc-unelevated-button.small.only-icon .icon,button.mat-mdc-unelevated-button.big.only-icon .icon,a.mat-mdc-unelevated-button.small.only-icon .icon,a.mat-mdc-unelevated-button.big.only-icon .icon{margin-left:0}button.mat-mdc-unelevated-button.primary,button.mat-mdc-unelevated-button.secondary,button.mat-mdc-unelevated-button.outlined,button.mat-mdc-unelevated-button.destructive,button.mat-mdc-unelevated-button.tertiary,button.mat-mdc-unelevated-button.link,a.mat-mdc-unelevated-button.primary,a.mat-mdc-unelevated-button.secondary,a.mat-mdc-unelevated-button.outlined,a.mat-mdc-unelevated-button.destructive,a.mat-mdc-unelevated-button.tertiary,a.mat-mdc-unelevated-button.link{min-width:80px}button.mat-mdc-unelevated-button.primary.only-icon,button.mat-mdc-unelevated-button.secondary.only-icon,button.mat-mdc-unelevated-button.outlined.only-icon,button.mat-mdc-unelevated-button.destructive.only-icon,button.mat-mdc-unelevated-button.tertiary.only-icon,button.mat-mdc-unelevated-button.link.only-icon,a.mat-mdc-unelevated-button.primary.only-icon,a.mat-mdc-unelevated-button.secondary.only-icon,a.mat-mdc-unelevated-button.outlined.only-icon,a.mat-mdc-unelevated-button.destructive.only-icon,a.mat-mdc-unelevated-button.tertiary.only-icon,a.mat-mdc-unelevated-button.link.only-icon{min-width:1px}button.mat-mdc-unelevated-button.primary.full-width,button.mat-mdc-unelevated-button.secondary.full-width,button.mat-mdc-unelevated-button.outlined.full-width,button.mat-mdc-unelevated-button.destructive.full-width,button.mat-mdc-unelevated-button.tertiary.full-width,button.mat-mdc-unelevated-button.link.full-width,a.mat-mdc-unelevated-button.primary.full-width,a.mat-mdc-unelevated-button.secondary.full-width,a.mat-mdc-unelevated-button.outlined.full-width,a.mat-mdc-unelevated-button.destructive.full-width,a.mat-mdc-unelevated-button.tertiary.full-width,a.mat-mdc-unelevated-button.link.full-width{width:100%;min-width:100%}button.mat-mdc-unelevated-button.primary.full-width .icon-label-wrapper,button.mat-mdc-unelevated-button.secondary.full-width .icon-label-wrapper,button.mat-mdc-unelevated-button.outlined.full-width .icon-label-wrapper,button.mat-mdc-unelevated-button.destructive.full-width .icon-label-wrapper,button.mat-mdc-unelevated-button.tertiary.full-width .icon-label-wrapper,button.mat-mdc-unelevated-button.link.full-width .icon-label-wrapper,a.mat-mdc-unelevated-button.primary.full-width .icon-label-wrapper,a.mat-mdc-unelevated-button.secondary.full-width .icon-label-wrapper,a.mat-mdc-unelevated-button.outlined.full-width .icon-label-wrapper,a.mat-mdc-unelevated-button.destructive.full-width .icon-label-wrapper,a.mat-mdc-unelevated-button.tertiary.full-width .icon-label-wrapper,a.mat-mdc-unelevated-button.link.full-width .icon-label-wrapper{justify-content:center}button.mat-mdc-unelevated-button.primary:focus,button.mat-mdc-unelevated-button.secondary:focus,button.mat-mdc-unelevated-button.outlined:focus,button.mat-mdc-unelevated-button.destructive:focus,button.mat-mdc-unelevated-button.tertiary:focus,button.mat-mdc-unelevated-button.link:focus,button.mat-mdc-unelevated-button.tab:focus,button.mat-mdc-unelevated-button.squareicon:focus,button.mat-mdc-unelevated-button.menuTrigger:focus,a.mat-mdc-unelevated-button.primary:focus,a.mat-mdc-unelevated-button.secondary:focus,a.mat-mdc-unelevated-button.outlined:focus,a.mat-mdc-unelevated-button.destructive:focus,a.mat-mdc-unelevated-button.tertiary:focus,a.mat-mdc-unelevated-button.link:focus,a.mat-mdc-unelevated-button.tab:focus,a.mat-mdc-unelevated-button.squareicon:focus,a.mat-mdc-unelevated-button.menuTrigger:focus{outline:1px dashed #888888;outline-offset:4px}button.mat-mdc-unelevated-button.menuCell:focus,a.mat-mdc-unelevated-button.menuCell:focus{outline:1px dashed #888888;outline-offset:-1px}button.mat-mdc-unelevated-button.primary,a.mat-mdc-unelevated-button.primary{background-color:#46a997;color:#fff}button.mat-mdc-unelevated-button.primary:hover,a.mat-mdc-unelevated-button.primary:hover{background-color:#31766a}button.mat-mdc-unelevated-button.primary:disabled,button.mat-mdc-unelevated-button.primary:disabled:hover,a.mat-mdc-unelevated-button.primary:disabled,a.mat-mdc-unelevated-button.primary:disabled:hover{background-color:#b5ddd5}button.mat-mdc-unelevated-button.primary:focus.cdk-focused.cdk-mouse-focused,a.mat-mdc-unelevated-button.primary:focus.cdk-focused.cdk-mouse-focused{background-color:#1c443c}button.mat-mdc-unelevated-button.primary ::ng-deep mat-icon.black svg,a.mat-mdc-unelevated-button.primary ::ng-deep mat-icon.black svg{color:#fff}button.mat-mdc-unelevated-button.primary .mat-mdc-progress-spinner ::ng-deep circle,a.mat-mdc-unelevated-button.primary .mat-mdc-progress-spinner ::ng-deep circle{stroke:#fff}button.mat-mdc-unelevated-button.secondary,a.mat-mdc-unelevated-button.secondary{background-color:#ededed;color:#000}button.mat-mdc-unelevated-button.secondary:hover,a.mat-mdc-unelevated-button.secondary:hover{background-color:#e0e0e0}button.mat-mdc-unelevated-button.secondary:disabled,button.mat-mdc-unelevated-button.secondary:disabled:hover,a.mat-mdc-unelevated-button.secondary:disabled,a.mat-mdc-unelevated-button.secondary:disabled:hover{background-color:#ededed;color:#888}button.mat-mdc-unelevated-button.secondary:disabled ::ng-deep mat-icon.black svg,button.mat-mdc-unelevated-button.secondary:disabled:hover ::ng-deep mat-icon.black svg,a.mat-mdc-unelevated-button.secondary:disabled ::ng-deep mat-icon.black svg,a.mat-mdc-unelevated-button.secondary:disabled:hover ::ng-deep mat-icon.black svg{color:#888}button.mat-mdc-unelevated-button.secondary:focus.cdk-focused.cdk-mouse-focused,a.mat-mdc-unelevated-button.secondary:focus.cdk-focused.cdk-mouse-focused{background-color:#888}button.mat-mdc-unelevated-button.secondary .mat-mdc-progress-spinner ::ng-deep circle,a.mat-mdc-unelevated-button.secondary .mat-mdc-progress-spinner ::ng-deep circle{stroke:#000}button.mat-mdc-unelevated-button.outlined,a.mat-mdc-unelevated-button.outlined{background-color:#fff;color:#000;border-width:1px;border-style:solid;border-color:#000}button.mat-mdc-unelevated-button.outlined:hover,a.mat-mdc-unelevated-button.outlined:hover{background-color:#f6f6f6}button.mat-mdc-unelevated-button.outlined:disabled,button.mat-mdc-unelevated-button.outlined:disabled:hover,a.mat-mdc-unelevated-button.outlined:disabled,a.mat-mdc-unelevated-button.outlined:disabled:hover{color:#ededed;border-color:#ededed}button.mat-mdc-unelevated-button.outlined:disabled ::ng-deep mat-icon.black svg,button.mat-mdc-unelevated-button.outlined:disabled:hover ::ng-deep mat-icon.black svg,a.mat-mdc-unelevated-button.outlined:disabled ::ng-deep mat-icon.black svg,a.mat-mdc-unelevated-button.outlined:disabled:hover ::ng-deep mat-icon.black svg{color:#888}button.mat-mdc-unelevated-button.outlined:focus.cdk-focused.cdk-mouse-focused,a.mat-mdc-unelevated-button.outlined:focus.cdk-focused.cdk-mouse-focused{background-color:#e0e0e0}button.mat-mdc-unelevated-button.outlined .mat-mdc-progress-spinner ::ng-deep circle,a.mat-mdc-unelevated-button.outlined .mat-mdc-progress-spinner ::ng-deep circle{stroke:#000}button.mat-mdc-unelevated-button.destructive,a.mat-mdc-unelevated-button.destructive{background-color:#cb7b7a;color:#fff}button.mat-mdc-unelevated-button.destructive:hover,a.mat-mdc-unelevated-button.destructive:hover{background-color:#8e5655}button.mat-mdc-unelevated-button.destructive:disabled,button.mat-mdc-unelevated-button.destructive:disabled:hover,a.mat-mdc-unelevated-button.destructive:disabled,a.mat-mdc-unelevated-button.destructive:disabled:hover{background-color:#e3c3c6}button.mat-mdc-unelevated-button.destructive:focus.cdk-focused.cdk-mouse-focused,a.mat-mdc-unelevated-button.destructive:focus.cdk-focused.cdk-mouse-focused{background-color:#513131}button.mat-mdc-unelevated-button.destructive ::ng-deep mat-icon.black svg,a.mat-mdc-unelevated-button.destructive ::ng-deep mat-icon.black svg{color:#fff}button.mat-mdc-unelevated-button.destructive .mat-mdc-progress-spinner ::ng-deep circle,a.mat-mdc-unelevated-button.destructive .mat-mdc-progress-spinner ::ng-deep circle{stroke:#000}button.mat-mdc-unelevated-button.tertiary,a.mat-mdc-unelevated-button.tertiary{background-color:transparent;color:#46a997}button.mat-mdc-unelevated-button.tertiary:hover,a.mat-mdc-unelevated-button.tertiary:hover{background-color:#f6f6f6;color:#31766a}button.mat-mdc-unelevated-button.tertiary:disabled,button.mat-mdc-unelevated-button.tertiary:disabled:hover,a.mat-mdc-unelevated-button.tertiary:disabled,a.mat-mdc-unelevated-button.tertiary:disabled:hover{background-color:#fff;color:#b5ddd5}button.mat-mdc-unelevated-button.tertiary:disabled ::ng-deep mat-icon.black svg,button.mat-mdc-unelevated-button.tertiary:disabled:hover ::ng-deep mat-icon.black svg,a.mat-mdc-unelevated-button.tertiary:disabled ::ng-deep mat-icon.black svg,a.mat-mdc-unelevated-button.tertiary:disabled:hover ::ng-deep mat-icon.black svg{color:#b5ddd5}button.mat-mdc-unelevated-button.tertiary:focus.cdk-focused.cdk-mouse-focused,a.mat-mdc-unelevated-button.tertiary:focus.cdk-focused.cdk-mouse-focused{background-color:#e0e0e0;color:#1c443c}button.mat-mdc-unelevated-button.tertiary ::ng-deep mat-icon.black svg,a.mat-mdc-unelevated-button.tertiary ::ng-deep mat-icon.black svg{color:#46a997}button.mat-mdc-unelevated-button.tertiary .mat-mdc-progress-spinner ::ng-deep circle,a.mat-mdc-unelevated-button.tertiary .mat-mdc-progress-spinner ::ng-deep circle{stroke:#000}button.mat-mdc-unelevated-button.link,a.mat-mdc-unelevated-button.link{background-color:transparent;color:#46a997;border-radius:0}button.mat-mdc-unelevated-button.link span.icon-label-wrapper,a.mat-mdc-unelevated-button.link span.icon-label-wrapper{text-decoration:underline}button.mat-mdc-unelevated-button.link:hover,a.mat-mdc-unelevated-button.link:hover{color:#31766a}button.mat-mdc-unelevated-button.link:disabled,button.mat-mdc-unelevated-button.link:disabled:hover,a.mat-mdc-unelevated-button.link:disabled,a.mat-mdc-unelevated-button.link:disabled:hover{color:#b5ddd5}button.mat-mdc-unelevated-button.link:focus.cdk-focused.cdk-mouse-focused,a.mat-mdc-unelevated-button.link:focus.cdk-focused.cdk-mouse-focused{color:#1c443c}button.mat-mdc-unelevated-button.link ::ng-deep mat-icon.black svg,a.mat-mdc-unelevated-button.link ::ng-deep mat-icon.black svg{color:#46a997}button.mat-mdc-unelevated-button.text,a.mat-mdc-unelevated-button.text{background-color:transparent;color:#000;border-radius:0;text-decoration:underline}button.mat-mdc-unelevated-button.text span.icon-label-wrapper,a.mat-mdc-unelevated-button.text span.icon-label-wrapper{text-decoration:underline}button.mat-mdc-unelevated-button.text:hover,a.mat-mdc-unelevated-button.text:hover{color:#000}button.mat-mdc-unelevated-button.text:disabled,button.mat-mdc-unelevated-button.text:disabled:hover,a.mat-mdc-unelevated-button.text:disabled,a.mat-mdc-unelevated-button.text:disabled:hover{color:#888}button.mat-mdc-unelevated-button.text:disabled ::ng-deep mat-icon.black svg,button.mat-mdc-unelevated-button.text:disabled:hover ::ng-deep mat-icon.black svg,a.mat-mdc-unelevated-button.text:disabled ::ng-deep mat-icon.black svg,a.mat-mdc-unelevated-button.text:disabled:hover ::ng-deep mat-icon.black svg{color:#888}button.mat-mdc-unelevated-button.text:focus.cdk-focused.cdk-mouse-focused,a.mat-mdc-unelevated-button.text:focus.cdk-focused.cdk-mouse-focused{color:#000}button.mat-mdc-unelevated-button.text .mat-mdc-progress-spinner ::ng-deep circle,a.mat-mdc-unelevated-button.text .mat-mdc-progress-spinner ::ng-deep circle{stroke:#000}button.mat-mdc-unelevated-button.squareicon,a.mat-mdc-unelevated-button.squareicon{background-color:#ededed;color:#000;min-width:56px}button.mat-mdc-unelevated-button.squareicon:hover,a.mat-mdc-unelevated-button.squareicon:hover{background-color:#e0e0e0}button.mat-mdc-unelevated-button.squareicon:disabled,button.mat-mdc-unelevated-button.squareicon:disabled:hover,a.mat-mdc-unelevated-button.squareicon:disabled,a.mat-mdc-unelevated-button.squareicon:disabled:hover{background-color:#ededed;color:#888}button.mat-mdc-unelevated-button.squareicon:focus.cdk-focused.cdk-mouse-focused,a.mat-mdc-unelevated-button.squareicon:focus.cdk-focused.cdk-mouse-focused{background-color:#ededed}button.mat-mdc-unelevated-button.squareicon .mat-mdc-progress-spinner ::ng-deep circle,a.mat-mdc-unelevated-button.squareicon .mat-mdc-progress-spinner ::ng-deep circle{stroke:#000}button.mat-mdc-unelevated-button.squareicon .icon-label-wrapper,a.mat-mdc-unelevated-button.squareicon .icon-label-wrapper{flex-flow:column}button.mat-mdc-unelevated-button.squareicon.left .icon,button.mat-mdc-unelevated-button.squareicon.right .icon,a.mat-mdc-unelevated-button.squareicon.left .icon,a.mat-mdc-unelevated-button.squareicon.right .icon{margin:0 auto}button.mat-mdc-unelevated-button.tab,a.mat-mdc-unelevated-button.tab{background-color:#fff;color:#000;border-bottom-width:1px;border-bottom-style:solid;border-bottom-color:#e0e0e0;border-radius:0}button.mat-mdc-unelevated-button.tab:hover .label,button.mat-mdc-unelevated-button.tab:hover .icon.only,a.mat-mdc-unelevated-button.tab:hover .label,a.mat-mdc-unelevated-button.tab:hover .icon.only{text-decoration:underline}button.mat-mdc-unelevated-button.tab:disabled,button.mat-mdc-unelevated-button.tab:disabled:hover,a.mat-mdc-unelevated-button.tab:disabled,a.mat-mdc-unelevated-button.tab:disabled:hover{color:#888}button.mat-mdc-unelevated-button.tab:disabled .label,button.mat-mdc-unelevated-button.tab:disabled:hover .label,a.mat-mdc-unelevated-button.tab:disabled .label,a.mat-mdc-unelevated-button.tab:disabled:hover .label{text-decoration:none}button.mat-mdc-unelevated-button.tab:disabled ::ng-deep mat-icon.black svg,button.mat-mdc-unelevated-button.tab:disabled:hover ::ng-deep mat-icon.black svg,a.mat-mdc-unelevated-button.tab:disabled ::ng-deep mat-icon.black svg,a.mat-mdc-unelevated-button.tab:disabled:hover ::ng-deep mat-icon.black svg{color:#888}button.mat-mdc-unelevated-button.tab:focus.cdk-focused.cdk-mouse-focused,a.mat-mdc-unelevated-button.tab:focus.cdk-focused.cdk-mouse-focused{font-weight:700;border-color:#276678}button.mat-mdc-unelevated-button.menuTrigger,a.mat-mdc-unelevated-button.menuTrigger{background:transparent;min-width:24px;height:24px;padding:0}button.mat-mdc-unelevated-button.menuTrigger:hover,a.mat-mdc-unelevated-button.menuTrigger:hover{background-color:#e0e0e0}button.mat-mdc-unelevated-button.menuTrigger:disabled,button.mat-mdc-unelevated-button.menuTrigger:disabled:hover,a.mat-mdc-unelevated-button.menuTrigger:disabled,a.mat-mdc-unelevated-button.menuTrigger:disabled:hover{background-color:#fff;color:#888}button.mat-mdc-unelevated-button.menuTrigger:focus.cdk-focused.cdk-mouse-focused,a.mat-mdc-unelevated-button.menuTrigger:focus.cdk-focused.cdk-mouse-focused{background-color:transparent}button.mat-mdc-unelevated-button.menuTrigger .icon-label-wrapper,a.mat-mdc-unelevated-button.menuTrigger .icon-label-wrapper{flex-flow:column}button.mat-mdc-unelevated-button.menuTrigger.left .icon,button.mat-mdc-unelevated-button.menuTrigger.right .icon,a.mat-mdc-unelevated-button.menuTrigger.left .icon,a.mat-mdc-unelevated-button.menuTrigger.right .icon{margin:0 auto}button.mat-mdc-unelevated-button.menuCell,a.mat-mdc-unelevated-button.menuCell{background-color:#fff;color:#000;font-weight:400;border-radius:0;min-width:100%;justify-content:flex-start}button.mat-mdc-unelevated-button.menuCell.big.left .icon,a.mat-mdc-unelevated-button.menuCell.big.left .icon{margin-right:16px}button.mat-mdc-unelevated-button.menuCell .icon-label-wrapper,a.mat-mdc-unelevated-button.menuCell .icon-label-wrapper{justify-content:flex-start}button.mat-mdc-unelevated-button.menuCell:hover,a.mat-mdc-unelevated-button.menuCell:hover{background-color:#e0e0e0}button.mat-mdc-unelevated-button.menuCell:disabled,button.mat-mdc-unelevated-button.menuCell:disabled:hover,a.mat-mdc-unelevated-button.menuCell:disabled,a.mat-mdc-unelevated-button.menuCell:disabled:hover{background-color:#fff;color:#888}button.mat-mdc-unelevated-button.menuCell:disabled ::ng-deep mat-icon.black svg,button.mat-mdc-unelevated-button.menuCell:disabled:hover ::ng-deep mat-icon.black svg,a.mat-mdc-unelevated-button.menuCell:disabled ::ng-deep mat-icon.black svg,a.mat-mdc-unelevated-button.menuCell:disabled:hover ::ng-deep mat-icon.black svg{color:#888}button.mat-mdc-unelevated-button.menuCell:focus.cdk-focused.cdk-mouse-focused,a.mat-mdc-unelevated-button.menuCell:focus.cdk-focused.cdk-mouse-focused{background-color:#888}button.mat-mdc-unelevated-button.menuCell .mat-mdc-progress-spinner ::ng-deep circle,a.mat-mdc-unelevated-button.menuCell .mat-mdc-progress-spinner ::ng-deep circle{stroke:#000}\n"], dependencies: [{ kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i2$1.MatAnchor, selector: "a[mat-button], a[mat-raised-button], a[mat-flat-button], a[mat-stroked-button]", inputs: ["disabled", "disableRipple", "color", "tabIndex"], exportAs: ["matButton", "matAnchor"] }, { kind: "component", type: i2$1.MatButton, selector: "    button[mat-button], button[mat-raised-button], button[mat-flat-button],    button[mat-stroked-button]  ", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "component", type: IconComponent, selector: "ui-icon", inputs: ["size", "cssClass", "name", "color"] }, { kind: "component", type: i4.MatProgressSpinner, selector: "mat-progress-spinner, mat-spinner", inputs: ["color", "mode", "value", "diameter", "strokeWidth"], exportAs: ["matProgressSpinner"] }] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: ButtonComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'ui-button', template: "<button\n  [ngClass]=\"classCss\"\n  [disabled]=\"disabled\"\n  (click)=\"buttonClick($event)\"\n  (mouseenter)=\"buttonHover($event)\"\n  [disableRipple]=\"true\"\n  *ngIf=\"isButtonLink\"\n  mat-flat-button>\n    <span class=\"icon-only-wrapper\" *ngIf=\"justIcon === true && !!iconName\">\n      <span class=\"icon only\" role=\"label\" [attr.aria-label]=\"label\"><ui-icon [name]=\"iconName\" size=\"24\"></ui-icon></span>\n    </span>\n    <span class=\"icon-label-wrapper\" [ngClass]=\"{'center-text': iconName === ''}\" *ngIf=\"justIcon === false\">\n      <span class=\"icon\" *ngIf=\"iconPosition === 'left' && !!iconName\" aria-hidden=\"true\"><ui-icon [name]=\"iconName\" size=\"24\"></ui-icon></span>\n      <span *ngIf=\"isLabel\" class=\"label\">{{ label }}</span>\n      <span class=\"icon\" *ngIf=\"iconPosition === 'right' && !!iconName\" aria-hidden=\"true\"><ui-icon [name]=\"iconName\" size=\"24\"></ui-icon></span>\n      <span class=\"spinner-wrapper\" *ngIf=\"showSpinner()\">\n        <mat-spinner class=\"position-spinner\" aria-label=\"loading\" mode=\"indeterminate\" diameter=\"24\"></mat-spinner>\n      </span>\n    </span>\n</button>\n<a\n  [ngClass]=\"classCss\"\n  [disabled]=\"disabled\"\n  (click)=\"buttonClick($event)\"\n  (mouseenter)=\"buttonHover($event)\"\n  [disableRipple]=\"true\"\n  *ngIf=\"!isButtonLink\"  \n  [href]=\"url\" \n  [target]=\"urlTarget\"\n  mat-flat-button>\n    <span class=\"icon-label-wrapper\">\n      {{ label }}\n    </span>\n</a>\n", styles: [":host{display:flex}button.mat-mdc-unelevated-button,a.mat-mdc-unelevated-button{font-size:14px;font-weight:600;line-height:normal;letter-spacing:normal}button.mat-mdc-unelevated-button .spinner-wrapper,a.mat-mdc-unelevated-button .spinner-wrapper{display:flex;align-items:center;flex-flow:column;width:100%}button.mat-mdc-unelevated-button .icon,a.mat-mdc-unelevated-button .icon{display:flex;height:100%;align-items:center}button.mat-mdc-unelevated-button .icon.only,a.mat-mdc-unelevated-button .icon.only{align-items:center;flex-flow:column;justify-content:center;margin-left:0}button.mat-mdc-unelevated-button .icon-label-wrapper,a.mat-mdc-unelevated-button .icon-label-wrapper{display:flex;align-items:center;justify-content:center;height:100%}button.mat-mdc-unelevated-button .icon-label-wrapper.center-text,a.mat-mdc-unelevated-button .icon-label-wrapper.center-text{flex-flow:column;width:100%}button.mat-mdc-unelevated-button .icon-label-wrapper .label,a.mat-mdc-unelevated-button .icon-label-wrapper .label{display:flex;height:100%;align-items:center}button.mat-mdc-unelevated-button.big,a.mat-mdc-unelevated-button.big{height:48px;padding:12px 16px}button.mat-mdc-unelevated-button.small,a.mat-mdc-unelevated-button.small{height:38px;padding:7px 11px}button.mat-mdc-unelevated-button.small.left .icon,button.mat-mdc-unelevated-button.big.left .icon,a.mat-mdc-unelevated-button.small.left .icon,a.mat-mdc-unelevated-button.big.left .icon{margin-right:8px}button.mat-mdc-unelevated-button.small.right .icon,button.mat-mdc-unelevated-button.big.right .icon,a.mat-mdc-unelevated-button.small.right .icon,a.mat-mdc-unelevated-button.big.right .icon{margin-left:8px}button.mat-mdc-unelevated-button.small.only-icon .icon,button.mat-mdc-unelevated-button.big.only-icon .icon,a.mat-mdc-unelevated-button.small.only-icon .icon,a.mat-mdc-unelevated-button.big.only-icon .icon{margin-left:0}button.mat-mdc-unelevated-button.primary,button.mat-mdc-unelevated-button.secondary,button.mat-mdc-unelevated-button.outlined,button.mat-mdc-unelevated-button.destructive,button.mat-mdc-unelevated-button.tertiary,button.mat-mdc-unelevated-button.link,a.mat-mdc-unelevated-button.primary,a.mat-mdc-unelevated-button.secondary,a.mat-mdc-unelevated-button.outlined,a.mat-mdc-unelevated-button.destructive,a.mat-mdc-unelevated-button.tertiary,a.mat-mdc-unelevated-button.link{min-width:80px}button.mat-mdc-unelevated-button.primary.only-icon,button.mat-mdc-unelevated-button.secondary.only-icon,button.mat-mdc-unelevated-button.outlined.only-icon,button.mat-mdc-unelevated-button.destructive.only-icon,button.mat-mdc-unelevated-button.tertiary.only-icon,button.mat-mdc-unelevated-button.link.only-icon,a.mat-mdc-unelevated-button.primary.only-icon,a.mat-mdc-unelevated-button.secondary.only-icon,a.mat-mdc-unelevated-button.outlined.only-icon,a.mat-mdc-unelevated-button.destructive.only-icon,a.mat-mdc-unelevated-button.tertiary.only-icon,a.mat-mdc-unelevated-button.link.only-icon{min-width:1px}button.mat-mdc-unelevated-button.primary.full-width,button.mat-mdc-unelevated-button.secondary.full-width,button.mat-mdc-unelevated-button.outlined.full-width,button.mat-mdc-unelevated-button.destructive.full-width,button.mat-mdc-unelevated-button.tertiary.full-width,button.mat-mdc-unelevated-button.link.full-width,a.mat-mdc-unelevated-button.primary.full-width,a.mat-mdc-unelevated-button.secondary.full-width,a.mat-mdc-unelevated-button.outlined.full-width,a.mat-mdc-unelevated-button.destructive.full-width,a.mat-mdc-unelevated-button.tertiary.full-width,a.mat-mdc-unelevated-button.link.full-width{width:100%;min-width:100%}button.mat-mdc-unelevated-button.primary.full-width .icon-label-wrapper,button.mat-mdc-unelevated-button.secondary.full-width .icon-label-wrapper,button.mat-mdc-unelevated-button.outlined.full-width .icon-label-wrapper,button.mat-mdc-unelevated-button.destructive.full-width .icon-label-wrapper,button.mat-mdc-unelevated-button.tertiary.full-width .icon-label-wrapper,button.mat-mdc-unelevated-button.link.full-width .icon-label-wrapper,a.mat-mdc-unelevated-button.primary.full-width .icon-label-wrapper,a.mat-mdc-unelevated-button.secondary.full-width .icon-label-wrapper,a.mat-mdc-unelevated-button.outlined.full-width .icon-label-wrapper,a.mat-mdc-unelevated-button.destructive.full-width .icon-label-wrapper,a.mat-mdc-unelevated-button.tertiary.full-width .icon-label-wrapper,a.mat-mdc-unelevated-button.link.full-width .icon-label-wrapper{justify-content:center}button.mat-mdc-unelevated-button.primary:focus,button.mat-mdc-unelevated-button.secondary:focus,button.mat-mdc-unelevated-button.outlined:focus,button.mat-mdc-unelevated-button.destructive:focus,button.mat-mdc-unelevated-button.tertiary:focus,button.mat-mdc-unelevated-button.link:focus,button.mat-mdc-unelevated-button.tab:focus,button.mat-mdc-unelevated-button.squareicon:focus,button.mat-mdc-unelevated-button.menuTrigger:focus,a.mat-mdc-unelevated-button.primary:focus,a.mat-mdc-unelevated-button.secondary:focus,a.mat-mdc-unelevated-button.outlined:focus,a.mat-mdc-unelevated-button.destructive:focus,a.mat-mdc-unelevated-button.tertiary:focus,a.mat-mdc-unelevated-button.link:focus,a.mat-mdc-unelevated-button.tab:focus,a.mat-mdc-unelevated-button.squareicon:focus,a.mat-mdc-unelevated-button.menuTrigger:focus{outline:1px dashed #888888;outline-offset:4px}button.mat-mdc-unelevated-button.menuCell:focus,a.mat-mdc-unelevated-button.menuCell:focus{outline:1px dashed #888888;outline-offset:-1px}button.mat-mdc-unelevated-button.primary,a.mat-mdc-unelevated-button.primary{background-color:#46a997;color:#fff}button.mat-mdc-unelevated-button.primary:hover,a.mat-mdc-unelevated-button.primary:hover{background-color:#31766a}button.mat-mdc-unelevated-button.primary:disabled,button.mat-mdc-unelevated-button.primary:disabled:hover,a.mat-mdc-unelevated-button.primary:disabled,a.mat-mdc-unelevated-button.primary:disabled:hover{background-color:#b5ddd5}button.mat-mdc-unelevated-button.primary:focus.cdk-focused.cdk-mouse-focused,a.mat-mdc-unelevated-button.primary:focus.cdk-focused.cdk-mouse-focused{background-color:#1c443c}button.mat-mdc-unelevated-button.primary ::ng-deep mat-icon.black svg,a.mat-mdc-unelevated-button.primary ::ng-deep mat-icon.black svg{color:#fff}button.mat-mdc-unelevated-button.primary .mat-mdc-progress-spinner ::ng-deep circle,a.mat-mdc-unelevated-button.primary .mat-mdc-progress-spinner ::ng-deep circle{stroke:#fff}button.mat-mdc-unelevated-button.secondary,a.mat-mdc-unelevated-button.secondary{background-color:#ededed;color:#000}button.mat-mdc-unelevated-button.secondary:hover,a.mat-mdc-unelevated-button.secondary:hover{background-color:#e0e0e0}button.mat-mdc-unelevated-button.secondary:disabled,button.mat-mdc-unelevated-button.secondary:disabled:hover,a.mat-mdc-unelevated-button.secondary:disabled,a.mat-mdc-unelevated-button.secondary:disabled:hover{background-color:#ededed;color:#888}button.mat-mdc-unelevated-button.secondary:disabled ::ng-deep mat-icon.black svg,button.mat-mdc-unelevated-button.secondary:disabled:hover ::ng-deep mat-icon.black svg,a.mat-mdc-unelevated-button.secondary:disabled ::ng-deep mat-icon.black svg,a.mat-mdc-unelevated-button.secondary:disabled:hover ::ng-deep mat-icon.black svg{color:#888}button.mat-mdc-unelevated-button.secondary:focus.cdk-focused.cdk-mouse-focused,a.mat-mdc-unelevated-button.secondary:focus.cdk-focused.cdk-mouse-focused{background-color:#888}button.mat-mdc-unelevated-button.secondary .mat-mdc-progress-spinner ::ng-deep circle,a.mat-mdc-unelevated-button.secondary .mat-mdc-progress-spinner ::ng-deep circle{stroke:#000}button.mat-mdc-unelevated-button.outlined,a.mat-mdc-unelevated-button.outlined{background-color:#fff;color:#000;border-width:1px;border-style:solid;border-color:#000}button.mat-mdc-unelevated-button.outlined:hover,a.mat-mdc-unelevated-button.outlined:hover{background-color:#f6f6f6}button.mat-mdc-unelevated-button.outlined:disabled,button.mat-mdc-unelevated-button.outlined:disabled:hover,a.mat-mdc-unelevated-button.outlined:disabled,a.mat-mdc-unelevated-button.outlined:disabled:hover{color:#ededed;border-color:#ededed}button.mat-mdc-unelevated-button.outlined:disabled ::ng-deep mat-icon.black svg,button.mat-mdc-unelevated-button.outlined:disabled:hover ::ng-deep mat-icon.black svg,a.mat-mdc-unelevated-button.outlined:disabled ::ng-deep mat-icon.black svg,a.mat-mdc-unelevated-button.outlined:disabled:hover ::ng-deep mat-icon.black svg{color:#888}button.mat-mdc-unelevated-button.outlined:focus.cdk-focused.cdk-mouse-focused,a.mat-mdc-unelevated-button.outlined:focus.cdk-focused.cdk-mouse-focused{background-color:#e0e0e0}button.mat-mdc-unelevated-button.outlined .mat-mdc-progress-spinner ::ng-deep circle,a.mat-mdc-unelevated-button.outlined .mat-mdc-progress-spinner ::ng-deep circle{stroke:#000}button.mat-mdc-unelevated-button.destructive,a.mat-mdc-unelevated-button.destructive{background-color:#cb7b7a;color:#fff}button.mat-mdc-unelevated-button.destructive:hover,a.mat-mdc-unelevated-button.destructive:hover{background-color:#8e5655}button.mat-mdc-unelevated-button.destructive:disabled,button.mat-mdc-unelevated-button.destructive:disabled:hover,a.mat-mdc-unelevated-button.destructive:disabled,a.mat-mdc-unelevated-button.destructive:disabled:hover{background-color:#e3c3c6}button.mat-mdc-unelevated-button.destructive:focus.cdk-focused.cdk-mouse-focused,a.mat-mdc-unelevated-button.destructive:focus.cdk-focused.cdk-mouse-focused{background-color:#513131}button.mat-mdc-unelevated-button.destructive ::ng-deep mat-icon.black svg,a.mat-mdc-unelevated-button.destructive ::ng-deep mat-icon.black svg{color:#fff}button.mat-mdc-unelevated-button.destructive .mat-mdc-progress-spinner ::ng-deep circle,a.mat-mdc-unelevated-button.destructive .mat-mdc-progress-spinner ::ng-deep circle{stroke:#000}button.mat-mdc-unelevated-button.tertiary,a.mat-mdc-unelevated-button.tertiary{background-color:transparent;color:#46a997}button.mat-mdc-unelevated-button.tertiary:hover,a.mat-mdc-unelevated-button.tertiary:hover{background-color:#f6f6f6;color:#31766a}button.mat-mdc-unelevated-button.tertiary:disabled,button.mat-mdc-unelevated-button.tertiary:disabled:hover,a.mat-mdc-unelevated-button.tertiary:disabled,a.mat-mdc-unelevated-button.tertiary:disabled:hover{background-color:#fff;color:#b5ddd5}button.mat-mdc-unelevated-button.tertiary:disabled ::ng-deep mat-icon.black svg,button.mat-mdc-unelevated-button.tertiary:disabled:hover ::ng-deep mat-icon.black svg,a.mat-mdc-unelevated-button.tertiary:disabled ::ng-deep mat-icon.black svg,a.mat-mdc-unelevated-button.tertiary:disabled:hover ::ng-deep mat-icon.black svg{color:#b5ddd5}button.mat-mdc-unelevated-button.tertiary:focus.cdk-focused.cdk-mouse-focused,a.mat-mdc-unelevated-button.tertiary:focus.cdk-focused.cdk-mouse-focused{background-color:#e0e0e0;color:#1c443c}button.mat-mdc-unelevated-button.tertiary ::ng-deep mat-icon.black svg,a.mat-mdc-unelevated-button.tertiary ::ng-deep mat-icon.black svg{color:#46a997}button.mat-mdc-unelevated-button.tertiary .mat-mdc-progress-spinner ::ng-deep circle,a.mat-mdc-unelevated-button.tertiary .mat-mdc-progress-spinner ::ng-deep circle{stroke:#000}button.mat-mdc-unelevated-button.link,a.mat-mdc-unelevated-button.link{background-color:transparent;color:#46a997;border-radius:0}button.mat-mdc-unelevated-button.link span.icon-label-wrapper,a.mat-mdc-unelevated-button.link span.icon-label-wrapper{text-decoration:underline}button.mat-mdc-unelevated-button.link:hover,a.mat-mdc-unelevated-button.link:hover{color:#31766a}button.mat-mdc-unelevated-button.link:disabled,button.mat-mdc-unelevated-button.link:disabled:hover,a.mat-mdc-unelevated-button.link:disabled,a.mat-mdc-unelevated-button.link:disabled:hover{color:#b5ddd5}button.mat-mdc-unelevated-button.link:focus.cdk-focused.cdk-mouse-focused,a.mat-mdc-unelevated-button.link:focus.cdk-focused.cdk-mouse-focused{color:#1c443c}button.mat-mdc-unelevated-button.link ::ng-deep mat-icon.black svg,a.mat-mdc-unelevated-button.link ::ng-deep mat-icon.black svg{color:#46a997}button.mat-mdc-unelevated-button.text,a.mat-mdc-unelevated-button.text{background-color:transparent;color:#000;border-radius:0;text-decoration:underline}button.mat-mdc-unelevated-button.text span.icon-label-wrapper,a.mat-mdc-unelevated-button.text span.icon-label-wrapper{text-decoration:underline}button.mat-mdc-unelevated-button.text:hover,a.mat-mdc-unelevated-button.text:hover{color:#000}button.mat-mdc-unelevated-button.text:disabled,button.mat-mdc-unelevated-button.text:disabled:hover,a.mat-mdc-unelevated-button.text:disabled,a.mat-mdc-unelevated-button.text:disabled:hover{color:#888}button.mat-mdc-unelevated-button.text:disabled ::ng-deep mat-icon.black svg,button.mat-mdc-unelevated-button.text:disabled:hover ::ng-deep mat-icon.black svg,a.mat-mdc-unelevated-button.text:disabled ::ng-deep mat-icon.black svg,a.mat-mdc-unelevated-button.text:disabled:hover ::ng-deep mat-icon.black svg{color:#888}button.mat-mdc-unelevated-button.text:focus.cdk-focused.cdk-mouse-focused,a.mat-mdc-unelevated-button.text:focus.cdk-focused.cdk-mouse-focused{color:#000}button.mat-mdc-unelevated-button.text .mat-mdc-progress-spinner ::ng-deep circle,a.mat-mdc-unelevated-button.text .mat-mdc-progress-spinner ::ng-deep circle{stroke:#000}button.mat-mdc-unelevated-button.squareicon,a.mat-mdc-unelevated-button.squareicon{background-color:#ededed;color:#000;min-width:56px}button.mat-mdc-unelevated-button.squareicon:hover,a.mat-mdc-unelevated-button.squareicon:hover{background-color:#e0e0e0}button.mat-mdc-unelevated-button.squareicon:disabled,button.mat-mdc-unelevated-button.squareicon:disabled:hover,a.mat-mdc-unelevated-button.squareicon:disabled,a.mat-mdc-unelevated-button.squareicon:disabled:hover{background-color:#ededed;color:#888}button.mat-mdc-unelevated-button.squareicon:focus.cdk-focused.cdk-mouse-focused,a.mat-mdc-unelevated-button.squareicon:focus.cdk-focused.cdk-mouse-focused{background-color:#ededed}button.mat-mdc-unelevated-button.squareicon .mat-mdc-progress-spinner ::ng-deep circle,a.mat-mdc-unelevated-button.squareicon .mat-mdc-progress-spinner ::ng-deep circle{stroke:#000}button.mat-mdc-unelevated-button.squareicon .icon-label-wrapper,a.mat-mdc-unelevated-button.squareicon .icon-label-wrapper{flex-flow:column}button.mat-mdc-unelevated-button.squareicon.left .icon,button.mat-mdc-unelevated-button.squareicon.right .icon,a.mat-mdc-unelevated-button.squareicon.left .icon,a.mat-mdc-unelevated-button.squareicon.right .icon{margin:0 auto}button.mat-mdc-unelevated-button.tab,a.mat-mdc-unelevated-button.tab{background-color:#fff;color:#000;border-bottom-width:1px;border-bottom-style:solid;border-bottom-color:#e0e0e0;border-radius:0}button.mat-mdc-unelevated-button.tab:hover .label,button.mat-mdc-unelevated-button.tab:hover .icon.only,a.mat-mdc-unelevated-button.tab:hover .label,a.mat-mdc-unelevated-button.tab:hover .icon.only{text-decoration:underline}button.mat-mdc-unelevated-button.tab:disabled,button.mat-mdc-unelevated-button.tab:disabled:hover,a.mat-mdc-unelevated-button.tab:disabled,a.mat-mdc-unelevated-button.tab:disabled:hover{color:#888}button.mat-mdc-unelevated-button.tab:disabled .label,button.mat-mdc-unelevated-button.tab:disabled:hover .label,a.mat-mdc-unelevated-button.tab:disabled .label,a.mat-mdc-unelevated-button.tab:disabled:hover .label{text-decoration:none}button.mat-mdc-unelevated-button.tab:disabled ::ng-deep mat-icon.black svg,button.mat-mdc-unelevated-button.tab:disabled:hover ::ng-deep mat-icon.black svg,a.mat-mdc-unelevated-button.tab:disabled ::ng-deep mat-icon.black svg,a.mat-mdc-unelevated-button.tab:disabled:hover ::ng-deep mat-icon.black svg{color:#888}button.mat-mdc-unelevated-button.tab:focus.cdk-focused.cdk-mouse-focused,a.mat-mdc-unelevated-button.tab:focus.cdk-focused.cdk-mouse-focused{font-weight:700;border-color:#276678}button.mat-mdc-unelevated-button.menuTrigger,a.mat-mdc-unelevated-button.menuTrigger{background:transparent;min-width:24px;height:24px;padding:0}button.mat-mdc-unelevated-button.menuTrigger:hover,a.mat-mdc-unelevated-button.menuTrigger:hover{background-color:#e0e0e0}button.mat-mdc-unelevated-button.menuTrigger:disabled,button.mat-mdc-unelevated-button.menuTrigger:disabled:hover,a.mat-mdc-unelevated-button.menuTrigger:disabled,a.mat-mdc-unelevated-button.menuTrigger:disabled:hover{background-color:#fff;color:#888}button.mat-mdc-unelevated-button.menuTrigger:focus.cdk-focused.cdk-mouse-focused,a.mat-mdc-unelevated-button.menuTrigger:focus.cdk-focused.cdk-mouse-focused{background-color:transparent}button.mat-mdc-unelevated-button.menuTrigger .icon-label-wrapper,a.mat-mdc-unelevated-button.menuTrigger .icon-label-wrapper{flex-flow:column}button.mat-mdc-unelevated-button.menuTrigger.left .icon,button.mat-mdc-unelevated-button.menuTrigger.right .icon,a.mat-mdc-unelevated-button.menuTrigger.left .icon,a.mat-mdc-unelevated-button.menuTrigger.right .icon{margin:0 auto}button.mat-mdc-unelevated-button.menuCell,a.mat-mdc-unelevated-button.menuCell{background-color:#fff;color:#000;font-weight:400;border-radius:0;min-width:100%;justify-content:flex-start}button.mat-mdc-unelevated-button.menuCell.big.left .icon,a.mat-mdc-unelevated-button.menuCell.big.left .icon{margin-right:16px}button.mat-mdc-unelevated-button.menuCell .icon-label-wrapper,a.mat-mdc-unelevated-button.menuCell .icon-label-wrapper{justify-content:flex-start}button.mat-mdc-unelevated-button.menuCell:hover,a.mat-mdc-unelevated-button.menuCell:hover{background-color:#e0e0e0}button.mat-mdc-unelevated-button.menuCell:disabled,button.mat-mdc-unelevated-button.menuCell:disabled:hover,a.mat-mdc-unelevated-button.menuCell:disabled,a.mat-mdc-unelevated-button.menuCell:disabled:hover{background-color:#fff;color:#888}button.mat-mdc-unelevated-button.menuCell:disabled ::ng-deep mat-icon.black svg,button.mat-mdc-unelevated-button.menuCell:disabled:hover ::ng-deep mat-icon.black svg,a.mat-mdc-unelevated-button.menuCell:disabled ::ng-deep mat-icon.black svg,a.mat-mdc-unelevated-button.menuCell:disabled:hover ::ng-deep mat-icon.black svg{color:#888}button.mat-mdc-unelevated-button.menuCell:focus.cdk-focused.cdk-mouse-focused,a.mat-mdc-unelevated-button.menuCell:focus.cdk-focused.cdk-mouse-focused{background-color:#888}button.mat-mdc-unelevated-button.menuCell .mat-mdc-progress-spinner ::ng-deep circle,a.mat-mdc-unelevated-button.menuCell .mat-mdc-progress-spinner ::ng-deep circle{stroke:#000}\n"] }]
-        }], ctorParameters: function () { return []; }, propDecorators: { size: [{
-                type: Input
-            }], type: [{
-                type: Input
-            }], label: [{
-                type: Input
-            }], iconPosition: [{
-                type: Input
-            }], justIcon: [{
-                type: Input
-            }], iconName: [{
-                type: Input
-            }], disabled: [{
-                type: Input
-            }], loading: [{
-                type: Input
-            }], fullWidth: [{
-                type: Input
-            }], url: [{
-                type: Input
-            }], urlTarget: [{
-                type: Input
-            }], value: [{
-                type: Input
-            }], buttonClickEvent: [{
-                type: Output
-            }], buttonHoverEvent: [{
-                type: Output
-            }] } });
-
-class AlertBannerComponent {
-    constructor() {
-        /**
-         * Alert Banner type
-         *
-         * @type {AlertBarType}
-         * @memberof AlertBannerComponent
-         */
-        this.alertType = 'success';
-        /**
-         * Alert banner message
-         *
-         * @memberof AlertBannerComponent
-         */
-        this.message = '';
-        /**
-         * Include dismmiss button
-         *
-         * @memberof AlertBannerComponent
-         */
-        this.includeDismissButton = true;
-        /**
-         * Static or fixed position
-         *
-         * @memberof AlertBannerComponent
-         */
-        this.fixed = false;
-        /**
-         * Full width for alert banner
-         *
-         * @memberof AlertBannerComponent
-         */
-        this.fullWidth = true;
-        /**
-         * Link text that will appended at the end of message
-         *
-         * @memberof AlertBannerComponent
-         */
-        this.linkText = '';
-        /**
-         * Link target
-         *
-         * @type {@type {LinkTargetType}}
-         * @memberof AlertBannerComponent
-         */
-        this.linkTarget = '_blank';
-        this.visible = true;
-    }
-    ngOnInit() {
-        this.iconName = alertBarsUtil.setIcon(this.alertType);
-        this.position = alertBarsUtil.setPosition(this.fixed);
-        this.cssClass = alertBarsUtil.setCssClass(this.fullWidth, this.alertType, this.position);
-    }
-    //Hide snackbar when dismiss button is clicked
-    dismissClick() {
-        this.visible = false;
-    }
-}
-AlertBannerComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: AlertBannerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-AlertBannerComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: AlertBannerComponent, selector: "ui-alert-banner", inputs: { alertType: "alertType", message: "message", includeDismissButton: "includeDismissButton", fixed: "fixed", fullWidth: "fullWidth", linkText: "linkText", linkUrl: "linkUrl", linkTarget: "linkTarget" }, ngImport: i0, template: "<div [ngClass]=\"cssClass\" [@openClose] *ngIf=\"visible\" class=\"alert-container\">\n  <div class=\"alert-text\">\n    <ui-icon [name]=\"iconName\" size=\"24\"></ui-icon>\n    {{ message }}\n    <a *ngIf=\"!!linkText\" [target]=\"linkTarget\" [href]=\"linkUrl\">{{ linkText }}</a>\n  </div>\n  <ui-button\n    *ngIf=\"includeDismissButton\"\n    type=\"text\"\n    [justIcon]=\"true\"\n    class=\"close\"\n    iconName=\"Close\"\n    (buttonClickEvent)=\"dismissClick()\"\n  ></ui-button>\n</div>\n", styles: [":host{display:flex;width:100%;justify-content:center}:host .snackbar-container{max-width:600px}:host .alert-container,:host .snackbar-container{margin:0 auto;display:flex;padding:0 14px;border-radius:4px;align-items:center;justify-content:space-between;opacity:1;min-height:48px}:host .alert-container.fixed,:host .snackbar-container.fixed{position:fixed}:host .alert-container.static,:host .snackbar-container.static{position:relative}:host .alert-container ui-icon,:host .snackbar-container ui-icon{margin-right:14px}:host .alert-container ui-button,:host .snackbar-container ui-button{margin-left:14px}:host .alert-container ::ng-deep button.mat-mdc-unelevated-button.big,:host .snackbar-container ::ng-deep button.mat-mdc-unelevated-button.big{padding:0;min-width:auto}:host .alert-container .alert-text,:host .alert-container .snackbar-text,:host .snackbar-container .alert-text,:host .snackbar-container .snackbar-text{display:flex;align-items:center;color:#000}:host .alert-container .alert-text a,:host .alert-container .snackbar-text a,:host .snackbar-container .alert-text a,:host .snackbar-container .snackbar-text a{color:#000;text-decoration:underline;font-weight:700}:host .alert-container .alert-text a:hover,:host .alert-container .alert-text a:visited,:host .alert-container .alert-text a:focus,:host .alert-container .snackbar-text a:hover,:host .alert-container .snackbar-text a:visited,:host .alert-container .snackbar-text a:focus,:host .snackbar-container .alert-text a:hover,:host .snackbar-container .alert-text a:visited,:host .snackbar-container .alert-text a:focus,:host .snackbar-container .snackbar-text a:hover,:host .snackbar-container .snackbar-text a:visited,:host .snackbar-container .snackbar-text a:focus{text-decoration:none}:host .alert-container.success,:host .snackbar-container.success{background-color:#cbd6cb}:host .alert-container.info,:host .snackbar-container.info{background-color:#c8d7de}:host .alert-container.warning,:host .snackbar-container.warning{background-color:#f0d6bb}:host .alert-container.error,:host .snackbar-container.error{background-color:#e3c3c6}@media (max-width: 600px){:host .alert-container,:host .snackbar-container{padding:8px 14px}}:host .alert-container.fixed{top:0;z-index:98}:host .alert-container.full-width{width:100%;min-width:100%}:host .alert-container a{margin-left:7px}\n"], dependencies: [{ kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: ButtonComponent, selector: "ui-button", inputs: ["size", "type", "label", "iconPosition", "justIcon", "iconName", "disabled", "loading", "fullWidth", "url", "urlTarget", "value"], outputs: ["buttonClickEvent", "buttonHoverEvent"] }, { kind: "component", type: IconComponent, selector: "ui-icon", inputs: ["size", "cssClass", "name", "color"] }], animations: [
-        trigger('openClose', [
-            transition(':enter', [animate('0.2s ease-out', style({ opacity: 1 }))]),
-            transition(':leave', [animate('0.2s ease-in', style({ opacity: 0 }))]),
-        ]),
-    ], changeDetection: i0.ChangeDetectionStrategy.OnPush });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: AlertBannerComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'ui-alert-banner', animations: [
-                        trigger('openClose', [
-                            transition(':enter', [animate('0.2s ease-out', style({ opacity: 1 }))]),
-                            transition(':leave', [animate('0.2s ease-in', style({ opacity: 0 }))]),
-                        ]),
-                    ], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div [ngClass]=\"cssClass\" [@openClose] *ngIf=\"visible\" class=\"alert-container\">\n  <div class=\"alert-text\">\n    <ui-icon [name]=\"iconName\" size=\"24\"></ui-icon>\n    {{ message }}\n    <a *ngIf=\"!!linkText\" [target]=\"linkTarget\" [href]=\"linkUrl\">{{ linkText }}</a>\n  </div>\n  <ui-button\n    *ngIf=\"includeDismissButton\"\n    type=\"text\"\n    [justIcon]=\"true\"\n    class=\"close\"\n    iconName=\"Close\"\n    (buttonClickEvent)=\"dismissClick()\"\n  ></ui-button>\n</div>\n", styles: [":host{display:flex;width:100%;justify-content:center}:host .snackbar-container{max-width:600px}:host .alert-container,:host .snackbar-container{margin:0 auto;display:flex;padding:0 14px;border-radius:4px;align-items:center;justify-content:space-between;opacity:1;min-height:48px}:host .alert-container.fixed,:host .snackbar-container.fixed{position:fixed}:host .alert-container.static,:host .snackbar-container.static{position:relative}:host .alert-container ui-icon,:host .snackbar-container ui-icon{margin-right:14px}:host .alert-container ui-button,:host .snackbar-container ui-button{margin-left:14px}:host .alert-container ::ng-deep button.mat-mdc-unelevated-button.big,:host .snackbar-container ::ng-deep button.mat-mdc-unelevated-button.big{padding:0;min-width:auto}:host .alert-container .alert-text,:host .alert-container .snackbar-text,:host .snackbar-container .alert-text,:host .snackbar-container .snackbar-text{display:flex;align-items:center;color:#000}:host .alert-container .alert-text a,:host .alert-container .snackbar-text a,:host .snackbar-container .alert-text a,:host .snackbar-container .snackbar-text a{color:#000;text-decoration:underline;font-weight:700}:host .alert-container .alert-text a:hover,:host .alert-container .alert-text a:visited,:host .alert-container .alert-text a:focus,:host .alert-container .snackbar-text a:hover,:host .alert-container .snackbar-text a:visited,:host .alert-container .snackbar-text a:focus,:host .snackbar-container .alert-text a:hover,:host .snackbar-container .alert-text a:visited,:host .snackbar-container .alert-text a:focus,:host .snackbar-container .snackbar-text a:hover,:host .snackbar-container .snackbar-text a:visited,:host .snackbar-container .snackbar-text a:focus{text-decoration:none}:host .alert-container.success,:host .snackbar-container.success{background-color:#cbd6cb}:host .alert-container.info,:host .snackbar-container.info{background-color:#c8d7de}:host .alert-container.warning,:host .snackbar-container.warning{background-color:#f0d6bb}:host .alert-container.error,:host .snackbar-container.error{background-color:#e3c3c6}@media (max-width: 600px){:host .alert-container,:host .snackbar-container{padding:8px 14px}}:host .alert-container.fixed{top:0;z-index:98}:host .alert-container.full-width{width:100%;min-width:100%}:host .alert-container a{margin-left:7px}\n"] }]
-        }], ctorParameters: function () { return []; }, propDecorators: { alertType: [{
-                type: Input
-            }], message: [{
-                type: Input
-            }], includeDismissButton: [{
-                type: Input
-            }], fixed: [{
-                type: Input
-            }], fullWidth: [{
-                type: Input
-            }], linkText: [{
-                type: Input
-            }], linkUrl: [{
-                type: Input
-            }], linkTarget: [{
-                type: Input
-            }] } });
-
-class IconComponentModule {
-}
-IconComponentModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: IconComponentModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-IconComponentModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.9", ngImport: i0, type: IconComponentModule, declarations: [IconComponent], imports: [CommonModule, MatIconModule, HttpClientModule], exports: [IconComponent] });
-IconComponentModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: IconComponentModule, providers: [HttpClientModule], imports: [CommonModule, MatIconModule, HttpClientModule] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: IconComponentModule, decorators: [{
-            type: NgModule,
-            args: [{
-                    declarations: [IconComponent],
-                    imports: [CommonModule, MatIconModule, HttpClientModule],
-                    exports: [IconComponent],
-                    providers: [HttpClientModule],
-                }]
-        }] });
-
-class ButtonComponentModule {
-}
-ButtonComponentModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: ButtonComponentModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-ButtonComponentModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.9", ngImport: i0, type: ButtonComponentModule, declarations: [ButtonComponent], imports: [CommonModule, MatButtonModule, IconComponentModule, MatProgressSpinnerModule], exports: [ButtonComponent] });
-ButtonComponentModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: ButtonComponentModule, imports: [CommonModule, MatButtonModule, IconComponentModule, MatProgressSpinnerModule] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: ButtonComponentModule, decorators: [{
-            type: NgModule,
-            args: [{
-                    declarations: [ButtonComponent],
-                    imports: [CommonModule, MatButtonModule, IconComponentModule, MatProgressSpinnerModule],
-                    exports: [ButtonComponent],
-                    providers: [],
-                }]
-        }] });
-
-class AlertBannerComponentModule {
-}
-AlertBannerComponentModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: AlertBannerComponentModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-AlertBannerComponentModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.9", ngImport: i0, type: AlertBannerComponentModule, declarations: [AlertBannerComponent], imports: [CommonModule, ButtonComponentModule, IconComponentModule], exports: [AlertBannerComponent] });
-AlertBannerComponentModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: AlertBannerComponentModule, imports: [CommonModule, ButtonComponentModule, IconComponentModule] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: AlertBannerComponentModule, decorators: [{
-            type: NgModule,
-            args: [{
-                    declarations: [AlertBannerComponent],
-                    imports: [CommonModule, ButtonComponentModule, IconComponentModule],
-                    exports: [AlertBannerComponent],
-                }]
-        }] });
-
-class BannerActionComponent {
-    constructor() {
-        /**
-         * BannerAction text
-         *
-         * @memberof BannerActionComponent
-         */
-        this.message = '';
-        /**
-         * BannerAction type
-         *
-         * @type {AlertBarType}
-         * @memberof BannerActionComponent
-         */
-        this.bannerActionType = 'success';
-        /**
-         * Static or fixed position
-         *
-         * @memberof AlertBannerComponent
-         */
-        this.fixed = false;
-        /**
-         * Full width for alert banner
-         *
-         * @memberof AlertBannerComponent
-         */
-        this.fullWidth = true;
-        this.buttonClickEvent = new EventEmitter();
-    }
-    buttonClick(event) {
-        this.buttonClickEvent.emit(event);
-    }
-    ngOnInit() {
-        this.iconName = alertBarsUtil.setIcon(this.bannerActionType);
-        this.position = alertBarsUtil.setPosition(this.fixed);
-        this.cssClass = alertBarsUtil.setCssClass(this.fullWidth, this.bannerActionType, this.position);
-    }
-}
-BannerActionComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: BannerActionComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-BannerActionComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: BannerActionComponent, selector: "ui-banner-action", inputs: { message: "message", bannerActionType: "bannerActionType", buttonText: "buttonText", fixed: "fixed", fullWidth: "fullWidth", buttonIcon: "buttonIcon" }, outputs: { buttonClickEvent: "buttonClickEvent" }, ngImport: i0, template: "<div id=\"banner-action\" class=\"banner-action-container\" [ngClass]=\"cssClass\">\n  <div class=\"banner-action-text\">\n    <ui-icon [name]=\"iconName\" size=\"24\"></ui-icon>\n    {{ message }}\n  </div>\n  <ui-button [label]=\"buttonText\" (buttonClickEvent)=\"buttonClick($event)\" [iconName]=\"buttonIcon\"></ui-button>\n</div>\n", styles: [":host{display:flex;width:100%;justify-content:center}:host .banner-action-container{height:72px;padding:0 16px;color:#000;font-size:14px;display:flex;align-items:center;background:#ffffff;border-radius:8px;justify-content:space-between;border-width:2px;border-style:solid}:host .banner-action-container.fixed{position:fixed;z-index:98;top:0}:host .banner-action-container.static{position:relative}:host .banner-action-container.full-width{width:100%;min-width:100%}:host .banner-action-container .banner-action-text{display:flex;align-items:center}:host .banner-action-container ui-icon{margin-right:14px}:host .banner-action-container ui-button{margin-left:14px}:host .banner-action-container.success{border-color:#46a997}:host .banner-action-container.info{border-color:#276678}:host .banner-action-container.warning{border-color:#cca45f}:host .banner-action-container.error{border-color:#cb7b7a}@media (max-width: 600px){:host .banner-action-container{height:auto;padding:16px;display:flex;flex-flow:column}:host .banner-action-container .banner-action-text{margin-bottom:10px}:host .banner-action-container ui-button{margin:0;width:100%}:host .banner-action-container ui-button ::ng-deep button{min-width:100%}}\n"], dependencies: [{ kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: ButtonComponent, selector: "ui-button", inputs: ["size", "type", "label", "iconPosition", "justIcon", "iconName", "disabled", "loading", "fullWidth", "url", "urlTarget", "value"], outputs: ["buttonClickEvent", "buttonHoverEvent"] }, { kind: "component", type: IconComponent, selector: "ui-icon", inputs: ["size", "cssClass", "name", "color"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: BannerActionComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'ui-banner-action', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div id=\"banner-action\" class=\"banner-action-container\" [ngClass]=\"cssClass\">\n  <div class=\"banner-action-text\">\n    <ui-icon [name]=\"iconName\" size=\"24\"></ui-icon>\n    {{ message }}\n  </div>\n  <ui-button [label]=\"buttonText\" (buttonClickEvent)=\"buttonClick($event)\" [iconName]=\"buttonIcon\"></ui-button>\n</div>\n", styles: [":host{display:flex;width:100%;justify-content:center}:host .banner-action-container{height:72px;padding:0 16px;color:#000;font-size:14px;display:flex;align-items:center;background:#ffffff;border-radius:8px;justify-content:space-between;border-width:2px;border-style:solid}:host .banner-action-container.fixed{position:fixed;z-index:98;top:0}:host .banner-action-container.static{position:relative}:host .banner-action-container.full-width{width:100%;min-width:100%}:host .banner-action-container .banner-action-text{display:flex;align-items:center}:host .banner-action-container ui-icon{margin-right:14px}:host .banner-action-container ui-button{margin-left:14px}:host .banner-action-container.success{border-color:#46a997}:host .banner-action-container.info{border-color:#276678}:host .banner-action-container.warning{border-color:#cca45f}:host .banner-action-container.error{border-color:#cb7b7a}@media (max-width: 600px){:host .banner-action-container{height:auto;padding:16px;display:flex;flex-flow:column}:host .banner-action-container .banner-action-text{margin-bottom:10px}:host .banner-action-container ui-button{margin:0;width:100%}:host .banner-action-container ui-button ::ng-deep button{min-width:100%}}\n"] }]
-        }], ctorParameters: function () { return []; }, propDecorators: { message: [{
-                type: Input
-            }], bannerActionType: [{
-                type: Input
-            }], buttonText: [{
-                type: Input
-            }], fixed: [{
-                type: Input
-            }], fullWidth: [{
-                type: Input
-            }], buttonIcon: [{
-                type: Input
-            }], buttonClickEvent: [{
-                type: Output
-            }] } });
-
-class BannerActionComponentModule {
-}
-BannerActionComponentModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: BannerActionComponentModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-BannerActionComponentModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.9", ngImport: i0, type: BannerActionComponentModule, declarations: [BannerActionComponent], imports: [CommonModule, ButtonComponentModule, IconComponentModule], exports: [BannerActionComponent] });
-BannerActionComponentModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: BannerActionComponentModule, imports: [CommonModule, ButtonComponentModule, IconComponentModule] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: BannerActionComponentModule, decorators: [{
-            type: NgModule,
-            args: [{
-                    declarations: [BannerActionComponent],
-                    imports: [CommonModule, ButtonComponentModule, IconComponentModule],
-                    exports: [BannerActionComponent],
-                    providers: [],
-                }]
-        }] });
-
-var LogoTypeEnum;
-(function (LogoTypeEnum) {
-    LogoTypeEnum["DEFAULT"] = "default";
-    LogoTypeEnum["POWEREDBY"] = "poweredby";
-    LogoTypeEnum["REVERSE"] = "reverse";
-})(LogoTypeEnum || (LogoTypeEnum = {}));
-;
-var LogoPathEnum;
-(function (LogoPathEnum) {
-    LogoPathEnum["DEFAULT"] = "/images/testgorilla.svg";
-    LogoPathEnum["POWEREDBY"] = "/images/poweredbyTG.svg";
-    LogoPathEnum["REVERSE"] = "/images/reverseTG.svg";
-})(LogoPathEnum || (LogoPathEnum = {}));
-
-class LogoComponent {
-    constructor() {
-        /**
-         * Logo type
-         *
-         * @type {LogoTypeEnum}
-         * @memberof LogoComponent
-         */
-        this.type = LogoTypeEnum.DEFAULT;
-        /**
-         * @ignore
-         */
-        this.setURL = () => {
-            switch (this.type) {
-                case LogoTypeEnum.POWEREDBY: {
-                    this.logoURL = LogoPathEnum.POWEREDBY;
-                    break;
-                }
-                case LogoTypeEnum.REVERSE: {
-                    this.logoURL = LogoPathEnum.REVERSE;
-                    break;
-                }
-                default: {
-                    this.logoURL = LogoPathEnum.DEFAULT;
-                    break;
-                }
-            }
-        };
-    }
-    /**
-     * @ignore
-     */
-    ngOnInit() {
-        this.setURL();
-    }
-    ;
-    /**
-     * @ignore
-     */
-    ngOnChanges() {
-        this.setURL();
-    }
-}
-LogoComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: LogoComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-LogoComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: LogoComponent, selector: "ui-logo", inputs: { type: "type" }, usesOnChanges: true, ngImport: i0, template: "<img [src]=\"logoURL\" [alt]=\"type\">\n", changeDetection: i0.ChangeDetectionStrategy.OnPush });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: LogoComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'ui-logo', changeDetection: ChangeDetectionStrategy.OnPush, template: "<img [src]=\"logoURL\" [alt]=\"type\">\n" }]
-        }], propDecorators: { type: [{
-                type: Input
-            }] } });
-
-class CardComponent {
-    constructor() {
-        this.title = '';
-        this.subTitle = '';
-    }
-}
-CardComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: CardComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-CardComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: CardComponent, selector: "ui-card", inputs: { title: "title", subTitle: "subTitle" }, ngImport: i0, template: "<mat-card appearance=\"outlined\" class=\"container\">\n  <ui-logo class=\"logo\"></ui-logo>\n  <mat-card-title>{{title}}</mat-card-title>\n  <mat-card-subtitle>{{subTitle}}</mat-card-subtitle>\n</mat-card>\n", styles: [".container{width:672px;box-sizing:border-box;padding:80px!important}.container .mat-mdc-card-title{margin-bottom:24px;font-weight:700;font-size:22px;line-height:135%;width:100%;word-wrap:break-word}.container .mat-mdc-card-subtitle{color:#000;font-weight:400;font-size:16px;line-height:135%}\n"], dependencies: [{ kind: "component", type: i1$2.MatCard, selector: "mat-card", inputs: ["appearance"], exportAs: ["matCard"] }, { kind: "directive", type: i1$2.MatCardSubtitle, selector: "mat-card-subtitle, [mat-card-subtitle], [matCardSubtitle]" }, { kind: "directive", type: i1$2.MatCardTitle, selector: "mat-card-title, [mat-card-title], [matCardTitle]" }, { kind: "component", type: LogoComponent, selector: "ui-logo", inputs: ["type"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: CardComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'ui-card', changeDetection: ChangeDetectionStrategy.OnPush, template: "<mat-card appearance=\"outlined\" class=\"container\">\n  <ui-logo class=\"logo\"></ui-logo>\n  <mat-card-title>{{title}}</mat-card-title>\n  <mat-card-subtitle>{{subTitle}}</mat-card-subtitle>\n</mat-card>\n", styles: [".container{width:672px;box-sizing:border-box;padding:80px!important}.container .mat-mdc-card-title{margin-bottom:24px;font-weight:700;font-size:22px;line-height:135%;width:100%;word-wrap:break-word}.container .mat-mdc-card-subtitle{color:#000;font-weight:400;font-size:16px;line-height:135%}\n"] }]
-        }], propDecorators: { title: [{
-                type: Input
-            }], subTitle: [{
-                type: Input
-            }] } });
-
-class LogoComponentModule {
-}
-LogoComponentModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: LogoComponentModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-LogoComponentModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.9", ngImport: i0, type: LogoComponentModule, declarations: [LogoComponent], exports: [LogoComponent] });
-LogoComponentModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: LogoComponentModule });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: LogoComponentModule, decorators: [{
-            type: NgModule,
-            args: [{
-                    declarations: [LogoComponent],
-                    imports: [],
-                    exports: [LogoComponent],
-                }]
-        }] });
-
-class CardComponentModule {
-}
-CardComponentModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: CardComponentModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-CardComponentModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.9", ngImport: i0, type: CardComponentModule, declarations: [CardComponent], imports: [CommonModule, MatCardModule, LogoComponentModule], exports: [CardComponent] });
-CardComponentModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: CardComponentModule, imports: [CommonModule, MatCardModule, LogoComponentModule] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: CardComponentModule, decorators: [{
-            type: NgModule,
-            args: [{
-                    declarations: [CardComponent],
-                    imports: [CommonModule, MatCardModule, LogoComponentModule],
-                    exports: [CardComponent],
-                }]
-        }] });
-
-class CheckboxComponent {
-    constructor() {
-        /**
-         * Determines whether the checkbox is disabled.
-         * Default: false.
-         *
-         * @type {boolean}
-         * @memberof CheckboxComponent
-         */
-        this.disabled = false;
-        /**
-         * Determines whether the checkbox is checked.
-         * Default: false.
-         *
-         * @type {boolean}
-         * @memberof CheckboxComponent
-         */
-        this.checked = false;
-        /**
-         * Determines whether the checkbox is indeterminate.
-         * It can be used to represent a checkbox with three states, e.g. a checkbox that represents a nested list of checkable items.
-         * Default: false.
-         *
-         * @type {boolean}
-         * @memberof CheckboxComponent
-         */
-        this.indeterminate = false;
-        /**
-         * Determines whether the checkbox color.
-         * Default: Test Gorilla primary color.
-         *
-         * @type {string}
-         * @memberof CheckboxComponent
-         */
-        this.color = '#46A997';
-        /**
-         * Name value will be applied to the input element if present.
-         *
-         * @type {string}
-         * @memberof CheckboxComponent
-         */
-        this.name = '';
-        /**
-         * Text content will be applied to the input element if present.
-         *
-         * @type {string}
-         * @memberof CheckboxComponent
-         */
-        this.label = '';
-        /**
-         * Determines whether the checkbox is a multiple choice cell.
-         * Default: false
-         *
-         * @type {boolean}
-         * @memberof CheckboxComponent
-         */
-        this.multiple = false;
-        /**
-         * Event emitted when the checkbox's checked value changes.
-         *
-         * @type {boolean}
-         * @memberof CheckboxComponent
-         */
-        this.changed = new EventEmitter();
-        /**
-         * @ignore
-         */
-        this.onChange = (_) => { };
-        /**
-         * @ignore
-         */
-        this.onTouch = () => { };
-    }
-    emitChange(event) {
-        this.changed.emit(event.checked);
-    }
-    ngOnInit() {
-        this.classMultiple = this.setClass();
-    }
-    toggleChecked(event) {
-        this.changed.emit(event.checked);
-        this.checked = event.checked;
-        this.onTouch();
-        this.onChange(this.checked);
-        if (!this.disabled) {
-            this.indeterminate = false;
-            this.classMultiple = this.setClass();
-        }
-    }
-    setClass() {
-        if (this.multiple) {
-            return this.checked || this.indeterminate ? 'multiple-checked' : 'multiple-unchecked';
-        }
-        return '';
-    }
-    writeValue(value) {
-        this.checked = value;
-    }
-    registerOnChange(fn) {
-        this.onChange = fn;
-    }
-    registerOnTouched(fn) {
-        this.onTouch = fn;
-    }
-    setDisabledState(isDisabled) {
-        this.disabled = isDisabled;
-    }
-}
-CheckboxComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: CheckboxComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-CheckboxComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: CheckboxComponent, selector: "ui-checkbox", inputs: { disabled: "disabled", checked: "checked", indeterminate: "indeterminate", color: "color", name: "name", label: "label", multiple: "multiple" }, outputs: { changed: "changed" }, host: { properties: { "style.--color": "this.color" } }, providers: [
-        {
-            provide: NG_VALUE_ACCESSOR,
-            useExisting: forwardRef(() => CheckboxComponent),
-            multi: true,
-        },
-    ], ngImport: i0, template: "<div [ngClass]=\"classMultiple\">\n  <mat-checkbox\n    [indeterminate]=\"indeterminate\"\n    [checked]=\"checked\"\n    [disabled]=\"disabled\"\n    [name]=\"name\"\n    (change)=\"toggleChecked($event)\"\n    [aria-label]=\"label\"\n    class=\"checkbox\"\n  >\n    {{ label }}\n  </mat-checkbox>\n</div>", styles: [".mat-mdc-checkbox.checkbox.mat-accent ::ng-deep .mdc-checkbox__native-control:indeterminate~.mdc-checkbox__background{background-color:var(--color)!important;border-color:var(--color)!important}::ng-deep .mat-mdc-checkbox.checkbox.mat-accent.mat-mdc-checkbox-checked .mdc-checkbox__background{background-color:var(--color)!important;border-color:var(--color)!important}.mat-mdc-checkbox.checkbox.mat-accent ::ng-deep .mdc-checkbox__ripple{background-color:var(--color)}::ng-deep .mat-mdc-checkbox.checkbox.mat-accent.mdc-checkbox__native-control:indeterminate~.mat-mdc-checkbox-disabled .mdc-checkbox__background{background-color:#888}::ng-deep .mat-mdc-checkbox.checkbox.mat-accent.mat-mdc-checkbox-checked.mat-mdc-checkbox-disabled .mdc-checkbox__background{background-color:#888}.multiple-checked{border:1px solid #46A997;display:flex;flex-direction:row;align-items:center;gap:16px;background:#46A997;border-radius:8px}.multiple-checked ::ng-deep .mat-mdc-checkbox{width:100%;height:100%}.multiple-checked ::ng-deep .mdc-form-field{padding:8px;width:100%;height:100%;align-items:center}.multiple-checked .mat-mdc-checkbox.checkbox.mat-accent ::ng-deep .mdc-checkbox__background{border:1px solid #ffffff!important;border-color:#fff!important}.multiple-checked ::ng-deep label{color:#fff}.multiple-unchecked{border:1px solid #E0E0E0;display:flex;flex-direction:row;align-items:center;gap:16px;background:#ffffff;border-radius:8px}.multiple-unchecked ::ng-deep .mat-mdc-checkbox{width:100%;height:100%}.multiple-unchecked ::ng-deep .mdc-form-field{padding:8px;width:100%;height:100%;align-items:center}.multiple-unchecked:hover{background:#F6F6F6;border:1px solid #E0E0E0}.multiple-unchecked ::ng-deep .mdc-checkbox__background{border:1px solid #000000}.multiple-unchecked ::ng-deep .mdc-checkbox__native-control:not([disabled]):focus~.mdc-checkbox__ripple{opacity:0!important}\n"], dependencies: [{ kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: i2$2.MatCheckbox, selector: "mat-checkbox", inputs: ["disableRipple", "color", "tabIndex"], exportAs: ["matCheckbox"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: CheckboxComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'ui-checkbox', providers: [
-                        {
-                            provide: NG_VALUE_ACCESSOR,
-                            useExisting: forwardRef(() => CheckboxComponent),
-                            multi: true,
-                        },
-                    ], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div [ngClass]=\"classMultiple\">\n  <mat-checkbox\n    [indeterminate]=\"indeterminate\"\n    [checked]=\"checked\"\n    [disabled]=\"disabled\"\n    [name]=\"name\"\n    (change)=\"toggleChecked($event)\"\n    [aria-label]=\"label\"\n    class=\"checkbox\"\n  >\n    {{ label }}\n  </mat-checkbox>\n</div>", styles: [".mat-mdc-checkbox.checkbox.mat-accent ::ng-deep .mdc-checkbox__native-control:indeterminate~.mdc-checkbox__background{background-color:var(--color)!important;border-color:var(--color)!important}::ng-deep .mat-mdc-checkbox.checkbox.mat-accent.mat-mdc-checkbox-checked .mdc-checkbox__background{background-color:var(--color)!important;border-color:var(--color)!important}.mat-mdc-checkbox.checkbox.mat-accent ::ng-deep .mdc-checkbox__ripple{background-color:var(--color)}::ng-deep .mat-mdc-checkbox.checkbox.mat-accent.mdc-checkbox__native-control:indeterminate~.mat-mdc-checkbox-disabled .mdc-checkbox__background{background-color:#888}::ng-deep .mat-mdc-checkbox.checkbox.mat-accent.mat-mdc-checkbox-checked.mat-mdc-checkbox-disabled .mdc-checkbox__background{background-color:#888}.multiple-checked{border:1px solid #46A997;display:flex;flex-direction:row;align-items:center;gap:16px;background:#46A997;border-radius:8px}.multiple-checked ::ng-deep .mat-mdc-checkbox{width:100%;height:100%}.multiple-checked ::ng-deep .mdc-form-field{padding:8px;width:100%;height:100%;align-items:center}.multiple-checked .mat-mdc-checkbox.checkbox.mat-accent ::ng-deep .mdc-checkbox__background{border:1px solid #ffffff!important;border-color:#fff!important}.multiple-checked ::ng-deep label{color:#fff}.multiple-unchecked{border:1px solid #E0E0E0;display:flex;flex-direction:row;align-items:center;gap:16px;background:#ffffff;border-radius:8px}.multiple-unchecked ::ng-deep .mat-mdc-checkbox{width:100%;height:100%}.multiple-unchecked ::ng-deep .mdc-form-field{padding:8px;width:100%;height:100%;align-items:center}.multiple-unchecked:hover{background:#F6F6F6;border:1px solid #E0E0E0}.multiple-unchecked ::ng-deep .mdc-checkbox__background{border:1px solid #000000}.multiple-unchecked ::ng-deep .mdc-checkbox__native-control:not([disabled]):focus~.mdc-checkbox__ripple{opacity:0!important}\n"] }]
-        }], propDecorators: { disabled: [{
-                type: Input
-            }], checked: [{
-                type: Input
-            }], indeterminate: [{
-                type: Input
-            }], color: [{
-                type: HostBinding,
-                args: ['style.--color']
-            }, {
-                type: Input
-            }], name: [{
-                type: Input
-            }], label: [{
-                type: Input
-            }], multiple: [{
-                type: Input
-            }], changed: [{
-                type: Output
-            }] } });
-
-class CheckboxComponentModule {
-}
-CheckboxComponentModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: CheckboxComponentModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-CheckboxComponentModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.9", ngImport: i0, type: CheckboxComponentModule, declarations: [CheckboxComponent], imports: [CommonModule, MatCheckboxModule, FormsModule, ReactiveFormsModule], exports: [CheckboxComponent] });
-CheckboxComponentModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: CheckboxComponentModule, imports: [CommonModule, MatCheckboxModule, FormsModule, ReactiveFormsModule] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: CheckboxComponentModule, decorators: [{
-            type: NgModule,
-            args: [{
-                    declarations: [CheckboxComponent],
-                    imports: [CommonModule, MatCheckboxModule, FormsModule, ReactiveFormsModule],
-                    exports: [CheckboxComponent],
-                }]
-        }] });
-
-const PASSWORD_REGEX = /^(?=\D*\d)(?=[^a-z]*[a-z])(?=.*[#$%&'()*+,\-./:;<=>?@!^_~|"`{}\[\]])(?=[^A-Z]*[A-Z]).{12,}$/;
-class ValidatorsUtil {
-    static validatePassword() {
-        return [Validators.required, Validators.minLength(12), Validators.pattern(PASSWORD_REGEX)];
-    }
-}
-
-const CREATE_ACCOUNT_i18n = {
-    title: 'Create your Career Passport',
-    subtitle: 'Enter the email address to which you received an assessment invite.',
-    email_label: 'Email',
-    password_label: 'Password',
-    terms_conditions: 'I have read and accepted the ',
-    terms_conditions_link_label: 'candidate terms',
-    privacy_policy_link_label: 'privacy policy',
-    terms_conditions_delimiter: 'and',
-    button_label: 'Next',
-    have_career_passport: 'Already have a Career Passport?',
-    login: 'Log in here',
-};
-
-class DigitsOnlyDirective {
-    constructor(el) {
-        this.el = el;
-        this.allowNegative = false;
-        this.allowDecimal = false;
-        this.allowOnlyDigits = false;
-    }
-    onKeyPress(event) {
-        this.validate(event, event.key);
-    }
-    onPaste(event) {
-        var _a;
-        const pastedText = event && ((_a = event === null || event === void 0 ? void 0 : event.clipboardData) === null || _a === void 0 ? void 0 : _a.getData('text/plain')); // Non-IE browsers
-        this.validate(event, pastedText || '');
-    }
-    validate(event, text) {
-        if (this.allowOnlyDigits) {
-            const txtInput = this.el.nativeElement;
-            const newValue = txtInput.value.substring(0, txtInput.selectionStart) + text + txtInput.value.substring(txtInput.selectionEnd);
-            if (!this.regex) {
-                this.regex = // eslint-disable-next-line no-eval
-                    eval(`/^${this.allowNegative ? '-?' : ''}${this.allowDecimal ? '((\\d+\\.?)|(\\.?))\\d*' : '\\d*'}$/g`);
-            }
-            if (!newValue.match(this.regex)) {
-                event.preventDefault();
-                return;
-            }
-        }
-    }
-}
-DigitsOnlyDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: DigitsOnlyDirective, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive });
-DigitsOnlyDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.2.9", type: DigitsOnlyDirective, selector: "[digitsOnly]", inputs: { allowNegative: "allowNegative", allowDecimal: "allowDecimal", allowOnlyDigits: "allowOnlyDigits" }, host: { listeners: { "keypress": "onKeyPress($event)", "paste": "onPaste($event)" } }, ngImport: i0 });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: DigitsOnlyDirective, decorators: [{
-            type: Directive,
-            args: [{
-                    selector: '[digitsOnly]',
-                }]
-        }], ctorParameters: function () { return [{ type: i0.ElementRef }]; }, propDecorators: { allowNegative: [{
-                type: Input
-            }], allowDecimal: [{
-                type: Input
-            }], allowOnlyDigits: [{
-                type: Input
-            }], onKeyPress: [{
-                type: HostListener,
-                args: ['keypress', ['$event']]
-            }], onPaste: [{
-                type: HostListener,
-                args: ['paste', ['$event']]
-            }] } });
-
-/* eslint-disable no-underscore-dangle */
-class FieldComponent {
-    /**
-     * Input field errors
-     *
-     * @type {string}
-     * @memberof FieldComponent
-     */
-    set errors(errors) {
-        this._errors = errors;
-        this.errorsLength = this.setErrorsLength();
-    }
-    constructor() {
-        this.class = 'ui-field';
-        /**
-         * Form field label
-         *
-         * @type {string}
-         * @memberof FieldComponent
-         */
-        this.label = '';
-        /**
-         * Input placeholder
-         *
-         * @type {string}
-         * @memberof FieldComponent
-         */
-        this.placeholder = '';
-        /**
-         * Input id
-         *
-         * @type {string}
-         * @memberof FieldComponent
-         */
-        this.id = '';
-        /**
-         * Input value
-         *
-         * @type {string}
-         * @memberof FieldComponent
-         */
-        this.value = '';
-        /**
-         * Hint text
-         *
-         * @type {string}
-         * @memberof FieldComponent
-         */
-        this.hintMessage = '';
-        /**
-         * Input type
-         *
-         * @type {FieldType}
-         * @memberof FieldComponent
-         */
-        this.type = 'text';
-        /**
-         * Input is update only on blur
-         *
-         * @type {Boolean}
-         * @memberof FieldComponent
-         */
-        this.updateOnBlur = false;
-        /**
-         * allow only digits in input
-         *
-         * @type {Boolean}
-         * @memberof FieldComponent
-         */
-        this.allowOnlyDigits = false;
-        /**
-         * @ignore
-         */
-        this.onChange = (_) => { };
-        /**
-         * @ignore
-         */
-        this.onTouch = () => { };
-    }
-    ngOnInit() {
-        this.setSearchInput();
-        this.currentType = this.getType();
-    }
-    //set search input initial value
-    setSearchInput() {
-        if (this.type === 'search') {
-            this.showSearch = true;
-        }
-        else {
-            this.showClose = false;
-            this.showSearch = false;
-        }
-    }
-    //change type for reveal password
-    getType() {
-        if (this.type === 'password' && this.showPassword) {
-            return 'text';
-        }
-        return this.type;
-    }
-    //Clear input value
-    clearValue() {
-        this.value = '';
-        this.onChangeInputSearch();
-    }
-    //toggle for password
-    showPasswordClick() {
-        this.showPassword = !this.showPassword;
-        this.currentType = this.getType();
-    }
-    //Set options for search input
-    onChangeInputSearch() {
-        if (this.type === 'search') {
-            if (!this.value) {
-                this.showClose = false;
-                this.showSearch = true;
-            }
-            if (this.value) {
-                this.showClose = true;
-                this.showSearch = false;
-            }
-        }
-    }
-    // Set errors length for validation
-    // Consider only those errors which which are not empty
-    setErrorsLength() {
-        if (!!this._errors) {
-            return this._errors.filter(err => !!err).length > 0 ? true : false;
-        }
-        return false;
-    }
-    //Save input value
-    onInput(event) {
-        this.value = event.target.value;
-        this.errorsLength = this.setErrorsLength();
-        if (!this.updateOnBlur) {
-            this.onTouch();
-        }
-        this.onChange(this.value);
-    }
-    writeValue(value) {
-        if (value) {
-            this.value = value || '';
-        }
-        else {
-            this.value = '';
-        }
-    }
-    registerOnChange(fn) {
-        this.onChange = fn;
-    }
-    registerOnTouched(fn) {
-        this.onTouch = fn;
-    }
-    setDisabledState(isDisabled) {
-        this.disabled = isDisabled;
-    }
-}
-FieldComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: FieldComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-FieldComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: FieldComponent, selector: "ui-field", inputs: { label: "label", fieldName: "fieldName", placeholder: "placeholder", id: "id", value: "value", errors: "errors", disabled: "disabled", required: "required", hintMessage: "hintMessage", type: "type", updateOnBlur: "updateOnBlur", allowOnlyDigits: "allowOnlyDigits" }, host: { properties: { "class": "this.class" } }, providers: [
-        {
-            provide: NG_VALUE_ACCESSOR,
-            useExisting: forwardRef(() => FieldComponent),
-            multi: true,
-        },
-    ], ngImport: i0, template: "<mat-form-field #uiField appearance=\"outline\" [color]=\"errorsLength ? 'warn' : 'accent'\">\n  <mat-label *ngIf=\"label\">{{ label }} <span *ngIf=\"required\">*</span></mat-label>\n  <input\n    matInput\n    (blur)=\"onTouch()\"\n    (input)=\"onInput($event)\"\n    [id]=\"id!\"\n    (keyup)=\"onChangeInputSearch()\"\n    [placeholder]=\"placeholder!\"\n    [value]=\"value\"\n    [disabled]=\"disabled\"\n    [type]=\"currentType\"\n    [name]=\"fieldName!\"\n    digitsOnly\n    [allowOnlyDigits]=\"allowOnlyDigits\"\n  />\n  <div class=\"options\" *ngIf=\"type === 'search' || type === 'password'\">\n    <div class=\"options-container\">\n      <ui-button\n        *ngIf=\"showClose\"\n        type=\"secondary\"\n        [justIcon]=\"true\"\n        class=\"close\"\n        iconName=\"Close\"\n        label=\"Clear\"\n        (buttonClickEvent)=\"clearValue()\"\n      ></ui-button>\n      <ui-icon *ngIf=\"showSearch\" size=\"24\" class=\"search\" name=\"Search\"></ui-icon>\n      <ui-button\n        *ngIf=\"type === 'password'\"\n        type=\"secondary\"\n        [justIcon]=\"true\"\n        class=\"password\"\n        [iconName]=\"showPassword ? 'Eye-hide' : 'Eye-view'\"\n        label=\"View password\"\n        (buttonClickEvent)=\"showPasswordClick()\"\n      ></ui-button>\n    </div>\n  </div>\n  <mat-hint class=\"info\" *ngIf=\"hintMessage && !_errors\">{{ hintMessage }}</mat-hint>\n  <mat-hint class=\"error\" *ngIf=\"errorsLength\">\n    <div class=\"errors\" *ngFor=\"let error of _errors\"><ui-icon name=\"Error\"></ui-icon>{{ error }}</div>\n  </mat-hint>\n</mat-form-field>\n", styles: [".ui-field input[type=search]::-webkit-search-decoration,.ui-field input[type=search]::-webkit-search-cancel-button,.ui-field input[type=search]::-webkit-search-results-button,.ui-field input[type=search]::-webkit-search-results-decoration{display:none}.ui-field .mat-mdc-form-field{margin-top:0;width:100%}.ui-field .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper{height:48px}.ui-field .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper .mat-mdc-form-field-flex .mat-mdc-floating-label{top:22px}.ui-field .mat-mdc-form-field.mat-form-field-appearance-outline .mdc-notched-outline{color:#888}.ui-field .mat-mdc-form-field.mat-form-field-appearance-outline .mdc-notched-outline .mdc-floating-label--float-above{transform:translateY(-30px) scale(.75)}.ui-field .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-form-field-infix{min-height:48px;padding:4px 0;line-height:22px;display:inline-flex;align-items:center}.ui-field .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-form-field-subscript-wrapper{padding:0 0 12px;margin-top:4px;font-size:12px;line-height:16px;position:relative}.ui-field .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-form-field-subscript-wrapper .mat-form-field-hint-spacer{display:none}.ui-field .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-form-field-hint.info{color:#888;width:100%;text-align:right}.ui-field .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-form-field-bottom-align:before{height:0}.ui-field .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-form-field-hint-wrapper{padding:0}.ui-field .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-form-field-hint.error,.ui-field .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-form-field-hint.error svg{color:#cb7b7a}.ui-field .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-form-field-hint.error{display:flex}.ui-field .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-form-field-hint.error ui-icon{margin-right:9px}.ui-field .mat-mdc-form-field.mat-warn.mat-form-field-appearance-outline:not(.mdc-text-field--disabled) .mat-mdc-form-field-flex:hover .mdc-notched-outline .mdc-notched-outline__leading,.ui-field .mat-mdc-form-field.mat-warn.mat-form-field-appearance-outline:not(.mdc-text-field--disabled) .mat-mdc-form-field-flex:hover .mdc-notched-outline .mdc-notched-outline__trailing,.ui-field .mat-mdc-form-field.mat-warn.mat-form-field-appearance-outline:not(.mdc-text-field--disabled) .mat-mdc-form-field-flex:hover .mdc-notched-outline .mdc-notched-outline__notch{border-color:#cb7b7a}.ui-field .mat-mdc-form-field.mat-warn.mat-form-field-appearance-outline .mdc-notched-outline .mdc-notched-outline__leading,.ui-field .mat-mdc-form-field.mat-warn.mat-form-field-appearance-outline .mdc-notched-outline .mdc-notched-outline__trailing,.ui-field .mat-mdc-form-field.mat-warn.mat-form-field-appearance-outline .mdc-notched-outline .mdc-notched-outline__notch{border-color:#cb7b7a}.ui-field .mat-mdc-form-field.mat-warn.mat-focused .mat-mdc-text-field-wrapper .mat-mdc-form-field-flex .mat-mdc-form-field-infix .mat-form-field-label mat-label{color:#cb7b7a}.ui-field .mat-mdc-form-field .mat-mdc-form-field-hint.error{display:flex;flex-flow:column;row-gap:4px}.ui-field .mat-mdc-form-field .mat-mdc-form-field-hint.error .errors{display:flex}.ui-field .mat-mdc-form-field.mat-accent.mat-form-field-appearance-outline:not(.mat-form-field-disabled) .mat-mdc-form-field-flex:hover .mdc-notched-outline{color:#276678}.ui-field .mat-mdc-form-field.mat-accent.mat-form-field-appearance-outline:not(.mat-form-field-disabled) .mat-mdc-form-field-flex:hover .options .options-container ui-button.search svg,.ui-field .mat-mdc-form-field.mat-accent.mat-form-field-appearance-outline:not(.mat-form-field-disabled) .mat-mdc-form-field-flex:hover .options .options-container ui-button.password svg{color:#276678}.ui-field .mat-mdc-form-field.mat-accent.mat-focused .mat-mdc-text-field-wrapper .mat-mdc-form-field-flex .mat-mdc-form-field-infix .mat-form-field-label mat-label{color:#276678}.ui-field .mat-mdc-form-field.mat-accent.mat-focused .options .options-container ui-button svg,.ui-field .mat-mdc-form-field.mat-accent.mat-focused .options .options-container ui-icon svg{color:#276678}.ui-field .mat-mdc-form-field.mat-accent.mat-focused .options .options-container ui-button.close svg{color:#888}.ui-field .mat-mdc-form-field .options{position:inline-flex}.ui-field .mat-mdc-form-field .options .options-container{display:flex;column-gap:8px;padding-left:8px}.ui-field .mat-mdc-form-field .options .options-container ui-button,.ui-field .mat-mdc-form-field .options .options-container ui-icon{display:flex}.ui-field .mat-mdc-form-field .options .options-container ui-button svg,.ui-field .mat-mdc-form-field .options .options-container ui-icon svg{color:#888}.ui-field .mat-mdc-form-field .options ui-button button.secondary.only-icon{padding:0;height:auto;background:transparent}.ui-field .mat-mdc-form-field .options ui-button button.secondary.only-icon:hover,.ui-field .mat-mdc-form-field .options ui-button button.secondary.only-icon:focus{background:transparent;color:inherit;border:none;outline:none}.ui-field .mat-mdc-form-field.mat-form-field-disabled.mat-form-field-appearance-outline .mdc-notched-outline{color:#e0e0e0}.ui-field .mat-mdc-form-field.mat-form-field-disabled .options .options-container ui-button svg,.ui-field .mat-mdc-form-field.mat-form-field-disabled .options .options-container ui-icon svg{color:#e0e0e0}\n"], dependencies: [{ kind: "directive", type: i1$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i2$3.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i2$3.MatLabel, selector: "mat-label" }, { kind: "directive", type: i2$3.MatHint, selector: "mat-hint", inputs: ["align", "id"] }, { kind: "directive", type: i3.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly"], exportAs: ["matInput"] }, { kind: "component", type: IconComponent, selector: "ui-icon", inputs: ["size", "cssClass", "name", "color"] }, { kind: "component", type: ButtonComponent, selector: "ui-button", inputs: ["size", "type", "label", "iconPosition", "justIcon", "iconName", "disabled", "loading", "fullWidth", "url", "urlTarget", "value"], outputs: ["buttonClickEvent", "buttonHoverEvent"] }, { kind: "directive", type: DigitsOnlyDirective, selector: "[digitsOnly]", inputs: ["allowNegative", "allowDecimal", "allowOnlyDigits"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: FieldComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'ui-field', encapsulation: ViewEncapsulation.None, providers: [
-                        {
-                            provide: NG_VALUE_ACCESSOR,
-                            useExisting: forwardRef(() => FieldComponent),
-                            multi: true,
-                        },
-                    ], changeDetection: ChangeDetectionStrategy.OnPush, template: "<mat-form-field #uiField appearance=\"outline\" [color]=\"errorsLength ? 'warn' : 'accent'\">\n  <mat-label *ngIf=\"label\">{{ label }} <span *ngIf=\"required\">*</span></mat-label>\n  <input\n    matInput\n    (blur)=\"onTouch()\"\n    (input)=\"onInput($event)\"\n    [id]=\"id!\"\n    (keyup)=\"onChangeInputSearch()\"\n    [placeholder]=\"placeholder!\"\n    [value]=\"value\"\n    [disabled]=\"disabled\"\n    [type]=\"currentType\"\n    [name]=\"fieldName!\"\n    digitsOnly\n    [allowOnlyDigits]=\"allowOnlyDigits\"\n  />\n  <div class=\"options\" *ngIf=\"type === 'search' || type === 'password'\">\n    <div class=\"options-container\">\n      <ui-button\n        *ngIf=\"showClose\"\n        type=\"secondary\"\n        [justIcon]=\"true\"\n        class=\"close\"\n        iconName=\"Close\"\n        label=\"Clear\"\n        (buttonClickEvent)=\"clearValue()\"\n      ></ui-button>\n      <ui-icon *ngIf=\"showSearch\" size=\"24\" class=\"search\" name=\"Search\"></ui-icon>\n      <ui-button\n        *ngIf=\"type === 'password'\"\n        type=\"secondary\"\n        [justIcon]=\"true\"\n        class=\"password\"\n        [iconName]=\"showPassword ? 'Eye-hide' : 'Eye-view'\"\n        label=\"View password\"\n        (buttonClickEvent)=\"showPasswordClick()\"\n      ></ui-button>\n    </div>\n  </div>\n  <mat-hint class=\"info\" *ngIf=\"hintMessage && !_errors\">{{ hintMessage }}</mat-hint>\n  <mat-hint class=\"error\" *ngIf=\"errorsLength\">\n    <div class=\"errors\" *ngFor=\"let error of _errors\"><ui-icon name=\"Error\"></ui-icon>{{ error }}</div>\n  </mat-hint>\n</mat-form-field>\n", styles: [".ui-field input[type=search]::-webkit-search-decoration,.ui-field input[type=search]::-webkit-search-cancel-button,.ui-field input[type=search]::-webkit-search-results-button,.ui-field input[type=search]::-webkit-search-results-decoration{display:none}.ui-field .mat-mdc-form-field{margin-top:0;width:100%}.ui-field .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper{height:48px}.ui-field .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper .mat-mdc-form-field-flex .mat-mdc-floating-label{top:22px}.ui-field .mat-mdc-form-field.mat-form-field-appearance-outline .mdc-notched-outline{color:#888}.ui-field .mat-mdc-form-field.mat-form-field-appearance-outline .mdc-notched-outline .mdc-floating-label--float-above{transform:translateY(-30px) scale(.75)}.ui-field .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-form-field-infix{min-height:48px;padding:4px 0;line-height:22px;display:inline-flex;align-items:center}.ui-field .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-form-field-subscript-wrapper{padding:0 0 12px;margin-top:4px;font-size:12px;line-height:16px;position:relative}.ui-field .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-form-field-subscript-wrapper .mat-form-field-hint-spacer{display:none}.ui-field .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-form-field-hint.info{color:#888;width:100%;text-align:right}.ui-field .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-form-field-bottom-align:before{height:0}.ui-field .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-form-field-hint-wrapper{padding:0}.ui-field .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-form-field-hint.error,.ui-field .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-form-field-hint.error svg{color:#cb7b7a}.ui-field .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-form-field-hint.error{display:flex}.ui-field .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-form-field-hint.error ui-icon{margin-right:9px}.ui-field .mat-mdc-form-field.mat-warn.mat-form-field-appearance-outline:not(.mdc-text-field--disabled) .mat-mdc-form-field-flex:hover .mdc-notched-outline .mdc-notched-outline__leading,.ui-field .mat-mdc-form-field.mat-warn.mat-form-field-appearance-outline:not(.mdc-text-field--disabled) .mat-mdc-form-field-flex:hover .mdc-notched-outline .mdc-notched-outline__trailing,.ui-field .mat-mdc-form-field.mat-warn.mat-form-field-appearance-outline:not(.mdc-text-field--disabled) .mat-mdc-form-field-flex:hover .mdc-notched-outline .mdc-notched-outline__notch{border-color:#cb7b7a}.ui-field .mat-mdc-form-field.mat-warn.mat-form-field-appearance-outline .mdc-notched-outline .mdc-notched-outline__leading,.ui-field .mat-mdc-form-field.mat-warn.mat-form-field-appearance-outline .mdc-notched-outline .mdc-notched-outline__trailing,.ui-field .mat-mdc-form-field.mat-warn.mat-form-field-appearance-outline .mdc-notched-outline .mdc-notched-outline__notch{border-color:#cb7b7a}.ui-field .mat-mdc-form-field.mat-warn.mat-focused .mat-mdc-text-field-wrapper .mat-mdc-form-field-flex .mat-mdc-form-field-infix .mat-form-field-label mat-label{color:#cb7b7a}.ui-field .mat-mdc-form-field .mat-mdc-form-field-hint.error{display:flex;flex-flow:column;row-gap:4px}.ui-field .mat-mdc-form-field .mat-mdc-form-field-hint.error .errors{display:flex}.ui-field .mat-mdc-form-field.mat-accent.mat-form-field-appearance-outline:not(.mat-form-field-disabled) .mat-mdc-form-field-flex:hover .mdc-notched-outline{color:#276678}.ui-field .mat-mdc-form-field.mat-accent.mat-form-field-appearance-outline:not(.mat-form-field-disabled) .mat-mdc-form-field-flex:hover .options .options-container ui-button.search svg,.ui-field .mat-mdc-form-field.mat-accent.mat-form-field-appearance-outline:not(.mat-form-field-disabled) .mat-mdc-form-field-flex:hover .options .options-container ui-button.password svg{color:#276678}.ui-field .mat-mdc-form-field.mat-accent.mat-focused .mat-mdc-text-field-wrapper .mat-mdc-form-field-flex .mat-mdc-form-field-infix .mat-form-field-label mat-label{color:#276678}.ui-field .mat-mdc-form-field.mat-accent.mat-focused .options .options-container ui-button svg,.ui-field .mat-mdc-form-field.mat-accent.mat-focused .options .options-container ui-icon svg{color:#276678}.ui-field .mat-mdc-form-field.mat-accent.mat-focused .options .options-container ui-button.close svg{color:#888}.ui-field .mat-mdc-form-field .options{position:inline-flex}.ui-field .mat-mdc-form-field .options .options-container{display:flex;column-gap:8px;padding-left:8px}.ui-field .mat-mdc-form-field .options .options-container ui-button,.ui-field .mat-mdc-form-field .options .options-container ui-icon{display:flex}.ui-field .mat-mdc-form-field .options .options-container ui-button svg,.ui-field .mat-mdc-form-field .options .options-container ui-icon svg{color:#888}.ui-field .mat-mdc-form-field .options ui-button button.secondary.only-icon{padding:0;height:auto;background:transparent}.ui-field .mat-mdc-form-field .options ui-button button.secondary.only-icon:hover,.ui-field .mat-mdc-form-field .options ui-button button.secondary.only-icon:focus{background:transparent;color:inherit;border:none;outline:none}.ui-field .mat-mdc-form-field.mat-form-field-disabled.mat-form-field-appearance-outline .mdc-notched-outline{color:#e0e0e0}.ui-field .mat-mdc-form-field.mat-form-field-disabled .options .options-container ui-button svg,.ui-field .mat-mdc-form-field.mat-form-field-disabled .options .options-container ui-icon svg{color:#e0e0e0}\n"] }]
-        }], ctorParameters: function () { return []; }, propDecorators: { class: [{
-                type: HostBinding
-            }], label: [{
-                type: Input
-            }], fieldName: [{
-                type: Input
-            }], placeholder: [{
-                type: Input
-            }], id: [{
-                type: Input
-            }], value: [{
-                type: Input
-            }], errors: [{
-                type: Input
-            }], disabled: [{
-                type: Input
-            }], required: [{
-                type: Input
-            }], hintMessage: [{
-                type: Input
-            }], type: [{
-                type: Input
-            }], updateOnBlur: [{
-                type: Input
-            }], allowOnlyDigits: [{
-                type: Input
-            }] } });
-
-class CreateAccountComponent {
-    /**
-     * @ignore
-     */
-    ngOnInit() {
-        var _a, _b;
-        if (this.email) {
-            (_a = this.registerForm.get('username')) === null || _a === void 0 ? void 0 : _a.setValue(this.email);
-        }
-        if (!this.emailEditable) {
-            (_b = this.registerForm.get('username')) === null || _b === void 0 ? void 0 : _b.disable();
-        }
-    }
-    constructor(fb) {
-        this.fb = fb;
-        // TODO: Some properties and methods are ignored on purpose because of a current issue with compodoc and angular 13
-        // https://github.com/storybookjs/storybook/issues/16865
-        // https://github.com/storybookjs/storybook/issues/17004
-        /**
-         * @ignore
-         */
-        this.email = '';
-        /**
-         * @ignore
-         */
-        this.emailEditable = true;
-        /**
-         * Path for candidate terms link
-         * @memberof CreateAccountComponent
-         */
-        this.termsOfusePath = 'https://www.testgorilla.com/candidate-terms/';
-        /**
-         * Path for privacy policy link
-         * @memberof CreateAccountComponent
-         */
-        this.privacyPolicyPath = 'https://www.testgorilla.com/privacy-policy/';
-        /**
-         * @ignore
-         */
-        this.registerForm = this.fb.group({
-            username: ['', [Validators.required, Validators.email]],
-            password: ['', ValidatorsUtil.validatePassword()],
-            agree_terms_and_conditions: [false, [Validators.requiredTrue]],
-        });
-        /**
-         * @ignore
-         */
-        this.formErrors = {
-            username: [''],
-            password: [''],
-        };
-        /**
-         * Indicator if the form is loading
-         *
-         * @memberof ButtonComponent
-         */
-        this.loading = false;
-        /**
-         *
-         * @description Object with the translations for the component.
-         * @type {Ii18nCreateAccount}
-         * @memberof CreateAccountComponent
-         */
-        this.i18n = CREATE_ACCOUNT_i18n;
-        /**
-         * @ignore
-         */
-        this.submitEvent = new EventEmitter();
-        /**
-         * @ignore
-         */
-        this.loginEvent = new EventEmitter();
-        /**
-         * @ignore
-         */
-        this.errorMessages = {
-            email: 'Enter a valid email',
-            required: 'This field is required',
-        };
-        /**
-         * @ignore
-         */
-        this.passwordErrorMessages = {
-            pattern: 'Password is invalid',
-        };
-    }
-    submit() {
-        var _a, _b;
-        this.submitEvent.emit({
-            username: (_a = this.registerForm.get('username')) === null || _a === void 0 ? void 0 : _a.value,
-            password: (_b = this.registerForm.get('password')) === null || _b === void 0 ? void 0 : _b.value,
-        });
-    }
-    login() {
-        this.loginEvent.emit();
-    }
-    checkErrors(field) {
-        const errorsMap = this.registerForm.controls[field].errors || {};
-        const errors = [];
-        for (const key in errorsMap) {
-            if (errorsMap[key] && this.errorMessages[key]) {
-                errors.push(this.errorMessages[key]);
-            }
-        }
-        if (field === 'password') {
-            for (const key in errorsMap) {
-                if (errorsMap[key] && this.passwordErrorMessages[key]) {
-                    errors.push(this.passwordErrorMessages[key]);
-                }
-            }
-        }
-        this.formErrors[field] = errors;
-    }
-}
-CreateAccountComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: CreateAccountComponent, deps: [{ token: i1$3.UntypedFormBuilder }], target: i0.ɵɵFactoryTarget.Component });
-CreateAccountComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: CreateAccountComponent, selector: "ui-create-account", inputs: { email: "email", emailEditable: "emailEditable", termsOfusePath: "termsOfusePath", privacyPolicyPath: "privacyPolicyPath", formErrors: "formErrors", loading: "loading", i18n: "i18n" }, outputs: { submitEvent: "submitEvent", loginEvent: "loginEvent" }, ngImport: i0, template: "<div class=\"form-box\">\n  <ui-logo></ui-logo>\n  <div class=\"title\">{{ i18n.title }}</div>\n  <div class=\"subtitle\">{{ i18n.subtitle }}</div>\n  <form [formGroup]=\"registerForm\">\n    <div class=\"field\">\n      <ui-field\n        formControlName=\"username\"\n        [label]=\"i18n.email_label\"\n        [type]=\"'email'\"\n        [required]=\"true\"\n        [errors]=\"formErrors['username']\"\n        (ngModelChange)=\"checkErrors('username')\"\n      ></ui-field>\n    </div>\n    <div class=\"field\">\n      <ui-field\n        formControlName=\"password\"\n        [label]=\"i18n.password_label\"\n        [type]=\"'password'\"\n        [required]=\"true\"\n        [errors]=\"formErrors['password']\"\n        (ngModelChange)=\"checkErrors('password')\"\n      ></ui-field>\n      <div class=\"password-strength-container\">\n        <mat-password-strength\n          [min]=\"12\"\n          #passwordComponentWithValidation\n          [password]=\"registerForm.controls['password'].value\"\n          aria-hidden=\"true\"\n        >\n        </mat-password-strength>\n      </div>\n      <mat-password-strength-info [passwordComponent]=\"passwordComponentWithValidation\"> </mat-password-strength-info>\n    </div>\n    <div class=\"terms-conditions-container\">\n      <ui-checkbox formControlName=\"agree_terms_and_conditions\" [label]=\"i18n.terms_conditions\"></ui-checkbox>\n      <a class=\"link\" [href]=\"termsOfusePath\" target=\"_blank\">{{ i18n.terms_conditions_link_label }}</a>\n      <span>{{i18n.terms_conditions_delimiter}}</span>\n      <a class=\"link\" [href]=\"privacyPolicyPath\" target=\"_blank\">{{ i18n.privacy_policy_link_label }}</a>\n    </div>\n    <div class=\"submit-button\">\n      <ui-button\n        [label]=\"i18n.button_label\"\n        [disabled]=\"registerForm.invalid\"\n        [fullWidth]=\"true\"\n        [loading]=\"loading\"\n        (buttonClickEvent)=\"submit()\"\n      ></ui-button>\n    </div>\n    <div>\n      {{ i18n.have_career_passport }} <span class=\"link\" (click)=\"login()\">{{ i18n.login }}</span>\n    </div>\n  </form>\n</div>\n", styles: [".form-box{width:672px;padding:64px;background:#ffffff;box-shadow:0 8px 16px #0000001a;border-radius:8px;margin:auto;color:#000}.form-box ui-logo{width:160px;display:inline-flex}.form-box .title{font-weight:700;font-size:22px;line-height:29.7px;margin-top:40px}.form-box .subtitle{font-weight:400;font-size:16px;line-height:21.6px;margin:24px 0}.form-box .field{width:100%}.form-box .password-strength-container{margin:2.7px 0 1px}.form-box .terms-conditions-container{display:flex;align-items:center;gap:4px;margin-left:-8px}.form-box .submit-button{margin:24px 0}.form-box .mat-mdc-checkbox{font-weight:400}.form-box .mat-mdc-checkbox ::ng-deep .mdc-checkbox{padding-left:4px}.form-box .mat-mdc-checkbox ::ng-deep .mdc-checkbox .mdc-checkbox__background{left:4px}.form-box .link{font-weight:600;cursor:pointer;color:#46a997;text-decoration:none}.form-box .link:hover{text-decoration:underline}.form-box ::ng-deep .mat-mdc-card-content{padding:0!important}.row{display:flex;flex-direction:row}.row.space-between{justify-content:space-between}\n"], dependencies: [{ kind: "directive", type: i1$3.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$3.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$3.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i1$3.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$3.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: FieldComponent, selector: "ui-field", inputs: ["label", "fieldName", "placeholder", "id", "value", "errors", "disabled", "required", "hintMessage", "type", "updateOnBlur", "allowOnlyDigits"] }, { kind: "component", type: ButtonComponent, selector: "ui-button", inputs: ["size", "type", "label", "iconPosition", "justIcon", "iconName", "disabled", "loading", "fullWidth", "url", "urlTarget", "value"], outputs: ["buttonClickEvent", "buttonHoverEvent"] }, { kind: "component", type: CheckboxComponent, selector: "ui-checkbox", inputs: ["disabled", "checked", "indeterminate", "color", "name", "label", "multiple"], outputs: ["changed"] }, { kind: "component", type: i5.MatPasswordStrengthComponent, selector: "mat-password-strength", inputs: ["password", "externalError", "enableLengthRule", "enableLowerCaseLetterRule", "enableUpperCaseLetterRule", "enableDigitRule", "enableSpecialCharRule", "min", "max", "customValidator", "warnThreshold", "accentThreshold"], outputs: ["onStrengthChanged"], exportAs: ["matPasswordStrength"] }, { kind: "component", type: i5.MatPasswordStrengthInfoComponent, selector: "mat-password-strength-info", inputs: ["passwordComponent", "enableScoreInfo", "lowerCaseCriteriaMsg", "upperCaseCriteriaMsg", "digitsCriteriaMsg", "specialCharsCriteriaMsg", "customCharsCriteriaMsg", "minCharsCriteriaMsg", "matIconDone", "matIconError"], exportAs: ["matPasswordStrengthInfo"] }, { kind: "component", type: LogoComponent, selector: "ui-logo", inputs: ["type"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: CreateAccountComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'ui-create-account', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"form-box\">\n  <ui-logo></ui-logo>\n  <div class=\"title\">{{ i18n.title }}</div>\n  <div class=\"subtitle\">{{ i18n.subtitle }}</div>\n  <form [formGroup]=\"registerForm\">\n    <div class=\"field\">\n      <ui-field\n        formControlName=\"username\"\n        [label]=\"i18n.email_label\"\n        [type]=\"'email'\"\n        [required]=\"true\"\n        [errors]=\"formErrors['username']\"\n        (ngModelChange)=\"checkErrors('username')\"\n      ></ui-field>\n    </div>\n    <div class=\"field\">\n      <ui-field\n        formControlName=\"password\"\n        [label]=\"i18n.password_label\"\n        [type]=\"'password'\"\n        [required]=\"true\"\n        [errors]=\"formErrors['password']\"\n        (ngModelChange)=\"checkErrors('password')\"\n      ></ui-field>\n      <div class=\"password-strength-container\">\n        <mat-password-strength\n          [min]=\"12\"\n          #passwordComponentWithValidation\n          [password]=\"registerForm.controls['password'].value\"\n          aria-hidden=\"true\"\n        >\n        </mat-password-strength>\n      </div>\n      <mat-password-strength-info [passwordComponent]=\"passwordComponentWithValidation\"> </mat-password-strength-info>\n    </div>\n    <div class=\"terms-conditions-container\">\n      <ui-checkbox formControlName=\"agree_terms_and_conditions\" [label]=\"i18n.terms_conditions\"></ui-checkbox>\n      <a class=\"link\" [href]=\"termsOfusePath\" target=\"_blank\">{{ i18n.terms_conditions_link_label }}</a>\n      <span>{{i18n.terms_conditions_delimiter}}</span>\n      <a class=\"link\" [href]=\"privacyPolicyPath\" target=\"_blank\">{{ i18n.privacy_policy_link_label }}</a>\n    </div>\n    <div class=\"submit-button\">\n      <ui-button\n        [label]=\"i18n.button_label\"\n        [disabled]=\"registerForm.invalid\"\n        [fullWidth]=\"true\"\n        [loading]=\"loading\"\n        (buttonClickEvent)=\"submit()\"\n      ></ui-button>\n    </div>\n    <div>\n      {{ i18n.have_career_passport }} <span class=\"link\" (click)=\"login()\">{{ i18n.login }}</span>\n    </div>\n  </form>\n</div>\n", styles: [".form-box{width:672px;padding:64px;background:#ffffff;box-shadow:0 8px 16px #0000001a;border-radius:8px;margin:auto;color:#000}.form-box ui-logo{width:160px;display:inline-flex}.form-box .title{font-weight:700;font-size:22px;line-height:29.7px;margin-top:40px}.form-box .subtitle{font-weight:400;font-size:16px;line-height:21.6px;margin:24px 0}.form-box .field{width:100%}.form-box .password-strength-container{margin:2.7px 0 1px}.form-box .terms-conditions-container{display:flex;align-items:center;gap:4px;margin-left:-8px}.form-box .submit-button{margin:24px 0}.form-box .mat-mdc-checkbox{font-weight:400}.form-box .mat-mdc-checkbox ::ng-deep .mdc-checkbox{padding-left:4px}.form-box .mat-mdc-checkbox ::ng-deep .mdc-checkbox .mdc-checkbox__background{left:4px}.form-box .link{font-weight:600;cursor:pointer;color:#46a997;text-decoration:none}.form-box .link:hover{text-decoration:underline}.form-box ::ng-deep .mat-mdc-card-content{padding:0!important}.row{display:flex;flex-direction:row}.row.space-between{justify-content:space-between}\n"] }]
-        }], ctorParameters: function () { return [{ type: i1$3.UntypedFormBuilder }]; }, propDecorators: { email: [{
-                type: Input
-            }], emailEditable: [{
-                type: Input
-            }], termsOfusePath: [{
-                type: Input
-            }], privacyPolicyPath: [{
-                type: Input
-            }], formErrors: [{
-                type: Input
-            }], loading: [{
-                type: Input
-            }], i18n: [{
-                type: Input
-            }], submitEvent: [{
-                type: Output
-            }], loginEvent: [{
-                type: Output
-            }] } });
-
-class FieldComponentModule {
-}
-FieldComponentModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: FieldComponentModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-FieldComponentModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.9", ngImport: i0, type: FieldComponentModule, declarations: [FieldComponent, DigitsOnlyDirective], imports: [CommonModule,
-        MatFormFieldModule,
-        MatInputModule,
-        IconComponentModule,
-        FormsModule,
-        ReactiveFormsModule,
-        ButtonComponentModule], exports: [FieldComponent] });
-FieldComponentModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: FieldComponentModule, imports: [CommonModule,
-        MatFormFieldModule,
-        MatInputModule,
-        IconComponentModule,
-        FormsModule,
-        ReactiveFormsModule,
-        ButtonComponentModule] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: FieldComponentModule, decorators: [{
-            type: NgModule,
-            args: [{
-                    declarations: [FieldComponent, DigitsOnlyDirective],
-                    imports: [
-                        CommonModule,
-                        MatFormFieldModule,
-                        MatInputModule,
-                        IconComponentModule,
-                        FormsModule,
-                        ReactiveFormsModule,
-                        ButtonComponentModule,
-                    ],
-                    exports: [FieldComponent],
-                    providers: [],
-                }]
-        }] });
-
-class CreateAccountComponentModule {
-}
-CreateAccountComponentModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: CreateAccountComponentModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-CreateAccountComponentModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.9", ngImport: i0, type: CreateAccountComponentModule, declarations: [CreateAccountComponent], imports: [CommonModule,
-        FormsModule,
-        ReactiveFormsModule,
-        FieldComponentModule,
-        ButtonComponentModule,
-        CheckboxComponentModule,
-        MatPasswordStrengthModule,
-        LogoComponentModule], exports: [CreateAccountComponent] });
-CreateAccountComponentModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: CreateAccountComponentModule, imports: [CommonModule,
-        FormsModule,
-        ReactiveFormsModule,
-        FieldComponentModule,
-        ButtonComponentModule,
-        CheckboxComponentModule,
-        MatPasswordStrengthModule,
-        LogoComponentModule] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: CreateAccountComponentModule, decorators: [{
-            type: NgModule,
-            args: [{
-                    declarations: [CreateAccountComponent],
-                    imports: [
-                        CommonModule,
-                        FormsModule,
-                        ReactiveFormsModule,
-                        FieldComponentModule,
-                        ButtonComponentModule,
-                        CheckboxComponentModule,
-                        MatPasswordStrengthModule,
-                        LogoComponentModule,
-                    ],
-                    exports: [CreateAccountComponent],
-                    providers: [],
-                }]
-        }] });
-
-const CREATE_PASSWORD_i18n = {
-    title: 'Please create a new password',
-    password_label: 'Set password',
-    button: 'Set new password',
-};
-
-class CreatePasswordComponent {
-    /**
-     * @ignore
-     */
-    ngOnInit() { }
-    constructor(fb) {
-        this.fb = fb;
-        // TODO: Some properties and methods are ignored on purpose because of a current issue with compodoc and angular 13
-        // https://github.com/storybookjs/storybook/issues/16865
-        // https://github.com/storybookjs/storybook/issues/17004
-        /**
-         * @ignore
-         */
-        this.createPasswordForm = this.fb.group({
-            password: ['', ValidatorsUtil.validatePassword()],
-        });
-        /**
-         * @ignore
-         */
-        this.formErrors = {
-            password: [''],
-        };
-        /**
-         * Indicator if the form is loading
-         *
-         * @memberof ButtonComponent
-         */
-        this.loading = false;
-        /**
-         *
-         * @description Object with the translations for the component.
-         * @type {Ii18nCreatePassword}
-         * @memberof CreatePasswordComponent
-         */
-        this.i18n = CREATE_PASSWORD_i18n;
-        /**
-         * @ignore
-         */
-        this.submitEvent = new EventEmitter();
-    }
-    submit() {
-        var _a;
-        this.submitEvent.emit({
-            password: (_a = this.createPasswordForm.get('password')) === null || _a === void 0 ? void 0 : _a.value,
-        });
-    }
-    checkErrors(field) {
-        if (this.createPasswordForm.controls[field].touched) {
-            if (this.createPasswordForm.controls[field].hasError('required')) {
-                this.formErrors[field] = ['This field is required'];
-                return;
-            }
-            if (field === 'password' && this.createPasswordForm.controls[field].hasError('pattern')) {
-                this.formErrors.password = ['Password is invalid'];
-                return;
-            }
-        }
-        this.formErrors[field] = [''];
-    }
-}
-CreatePasswordComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: CreatePasswordComponent, deps: [{ token: i1$3.UntypedFormBuilder }], target: i0.ɵɵFactoryTarget.Component });
-CreatePasswordComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: CreatePasswordComponent, selector: "ui-create-password", inputs: { formErrors: "formErrors", loading: "loading", i18n: "i18n" }, outputs: { submitEvent: "submitEvent" }, ngImport: i0, template: "<div class=\"form-box\">\n  <ui-logo></ui-logo>\n  <div class=\"title\">{{ i18n.title }}</div>\n  <form [formGroup]=\"createPasswordForm\">\n    <div class=\"field\">\n      <ui-field\n        formControlName=\"password\"\n        [label]=\"i18n.password_label\"\n        [type]=\"'password'\"\n        [required]=\"true\"\n        [errors]=\"formErrors.password\"\n        (ngModelChange)=\"checkErrors('password')\"\n      ></ui-field>\n      <mat-password-strength\n        [min]=\"12\"\n        #passwordComponentWithValidation\n        [password]=\"createPasswordForm.controls['password'].value\"\n        aria-hidden=\"true\"\n      >\n      </mat-password-strength>\n      <mat-password-strength-info [passwordComponent]=\"passwordComponentWithValidation\"> </mat-password-strength-info>\n    </div>\n    <div></div>\n    <div class=\"submit-button\">\n      <ui-button\n        [label]=\"i18n.button\"\n        [disabled]=\"createPasswordForm.invalid\"\n        [fullWidth]=\"true\"\n        [loading]=\"loading\"\n        (buttonClickEvent)=\"submit()\"\n      ></ui-button>\n    </div>\n  </form>\n</div>\n", styles: [".form-box{width:672px;padding:64px;background:#ffffff;box-shadow:0 8px 16px #0000001a;border-radius:8px;margin:auto;color:#000}.form-box ui-logo{width:160px;display:inline-flex}.form-box .title{font-weight:700;font-size:22px;line-height:29.7px;margin:40px 0 24px}.form-box .field{width:100%}.form-box .submit-button{margin-top:25px}.form-box ::ng-deep .mat-mdc-card-content{padding:0!important}\n"], dependencies: [{ kind: "directive", type: i1$3.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$3.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$3.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i1$3.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$3.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: FieldComponent, selector: "ui-field", inputs: ["label", "fieldName", "placeholder", "id", "value", "errors", "disabled", "required", "hintMessage", "type", "updateOnBlur", "allowOnlyDigits"] }, { kind: "component", type: ButtonComponent, selector: "ui-button", inputs: ["size", "type", "label", "iconPosition", "justIcon", "iconName", "disabled", "loading", "fullWidth", "url", "urlTarget", "value"], outputs: ["buttonClickEvent", "buttonHoverEvent"] }, { kind: "component", type: i5.MatPasswordStrengthComponent, selector: "mat-password-strength", inputs: ["password", "externalError", "enableLengthRule", "enableLowerCaseLetterRule", "enableUpperCaseLetterRule", "enableDigitRule", "enableSpecialCharRule", "min", "max", "customValidator", "warnThreshold", "accentThreshold"], outputs: ["onStrengthChanged"], exportAs: ["matPasswordStrength"] }, { kind: "component", type: i5.MatPasswordStrengthInfoComponent, selector: "mat-password-strength-info", inputs: ["passwordComponent", "enableScoreInfo", "lowerCaseCriteriaMsg", "upperCaseCriteriaMsg", "digitsCriteriaMsg", "specialCharsCriteriaMsg", "customCharsCriteriaMsg", "minCharsCriteriaMsg", "matIconDone", "matIconError"], exportAs: ["matPasswordStrengthInfo"] }, { kind: "component", type: LogoComponent, selector: "ui-logo", inputs: ["type"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: CreatePasswordComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'ui-create-password', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"form-box\">\n  <ui-logo></ui-logo>\n  <div class=\"title\">{{ i18n.title }}</div>\n  <form [formGroup]=\"createPasswordForm\">\n    <div class=\"field\">\n      <ui-field\n        formControlName=\"password\"\n        [label]=\"i18n.password_label\"\n        [type]=\"'password'\"\n        [required]=\"true\"\n        [errors]=\"formErrors.password\"\n        (ngModelChange)=\"checkErrors('password')\"\n      ></ui-field>\n      <mat-password-strength\n        [min]=\"12\"\n        #passwordComponentWithValidation\n        [password]=\"createPasswordForm.controls['password'].value\"\n        aria-hidden=\"true\"\n      >\n      </mat-password-strength>\n      <mat-password-strength-info [passwordComponent]=\"passwordComponentWithValidation\"> </mat-password-strength-info>\n    </div>\n    <div></div>\n    <div class=\"submit-button\">\n      <ui-button\n        [label]=\"i18n.button\"\n        [disabled]=\"createPasswordForm.invalid\"\n        [fullWidth]=\"true\"\n        [loading]=\"loading\"\n        (buttonClickEvent)=\"submit()\"\n      ></ui-button>\n    </div>\n  </form>\n</div>\n", styles: [".form-box{width:672px;padding:64px;background:#ffffff;box-shadow:0 8px 16px #0000001a;border-radius:8px;margin:auto;color:#000}.form-box ui-logo{width:160px;display:inline-flex}.form-box .title{font-weight:700;font-size:22px;line-height:29.7px;margin:40px 0 24px}.form-box .field{width:100%}.form-box .submit-button{margin-top:25px}.form-box ::ng-deep .mat-mdc-card-content{padding:0!important}\n"] }]
-        }], ctorParameters: function () { return [{ type: i1$3.UntypedFormBuilder }]; }, propDecorators: { formErrors: [{
-                type: Input
-            }], loading: [{
-                type: Input
-            }], i18n: [{
-                type: Input
-            }], submitEvent: [{
-                type: Output
-            }] } });
-
-class CreatePasswordComponentModule {
-}
-CreatePasswordComponentModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: CreatePasswordComponentModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-CreatePasswordComponentModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.9", ngImport: i0, type: CreatePasswordComponentModule, declarations: [CreatePasswordComponent], imports: [CommonModule,
-        FormsModule,
-        ReactiveFormsModule,
-        FieldComponentModule,
-        ButtonComponentModule,
-        MatPasswordStrengthModule,
-        LogoComponentModule], exports: [CreatePasswordComponent] });
-CreatePasswordComponentModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: CreatePasswordComponentModule, imports: [CommonModule,
-        FormsModule,
-        ReactiveFormsModule,
-        FieldComponentModule,
-        ButtonComponentModule,
-        MatPasswordStrengthModule,
-        LogoComponentModule] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: CreatePasswordComponentModule, decorators: [{
-            type: NgModule,
-            args: [{
-                    declarations: [CreatePasswordComponent],
-                    imports: [
-                        CommonModule,
-                        FormsModule,
-                        ReactiveFormsModule,
-                        FieldComponentModule,
-                        ButtonComponentModule,
-                        MatPasswordStrengthModule,
-                        LogoComponentModule,
-                    ],
-                    exports: [CreatePasswordComponent],
-                    providers: [],
-                }]
-        }] });
-
-class DialogComponent {
-    constructor(dialogRef) {
-        this.dialogRef = dialogRef;
-        /**
-         * Dialog title
-         *
-         * @memberof DialogComponent
-         */
-        this.title = '';
-        /**
-         * Show close button
-         *
-         * @memberof DialogComponent
-         */
-        this.showCloseButton = true;
-        /**
-         * Fuction called before dialgo is closed
-         *
-         * @memberof DialogComponent
-         */
-        this.canCloseFn = () => true;
-        /**
-         * Secondary button label
-         *
-         * @memberof DialogComponent
-         */
-        this.secondaryButtonLabel = '';
-        /**
-         * Primary button label
-         *
-         * @memberof DialogComponent
-         */
-        this.primaryButtonLabel = '';
-        /**
-         * Secondary button type
-         *
-         * @memberof DialogComponent
-         */
-        this.secondaryButtonType = 'secondary';
-        /**
-         * Primary button type
-         *
-         * @memberof DialogComponent
-         */
-        this.primaryButtonType = 'primary';
-        this.closeEvent = new EventEmitter();
-        this.secondaryButtonClickEvent = new EventEmitter();
-        this.primaryButtonClickEvent = new EventEmitter();
-        this.disableButtons = false;
-    }
-    ngOnInit() {
-        this.areButtonsDisabled();
-    }
-    ngOnChanges(changes) {
-        if (changes['canCloseFn']) {
-            this.dialogRef.disableClose = !this.canCloseFn();
-            this.areButtonsDisabled();
-        }
-    }
-    //Disable primary button when canClose is false
-    areButtonsDisabled() {
-        if (this.canCloseFn() === false) {
-            this.disableButtons = true;
-        }
-        else {
-            this.disableButtons = false;
-        }
-    }
-    //Close modal
-    dismiss() {
-        if (this.canCloseFn()) {
-            this.dialogRef.disableClose = false;
-            this.dialogRef.close();
-        }
-    }
-    onClose(event) {
-        this.closeEvent.emit(event);
-    }
-    onSecondaryButtonClick(event) {
-        this.secondaryButtonClickEvent.emit(event);
-    }
-    onPrimaryButtonClick(event) {
-        this.primaryButtonClickEvent.emit(event);
-    }
-}
-DialogComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: DialogComponent, deps: [{ token: i1$4.MatDialogRef }], target: i0.ɵɵFactoryTarget.Component });
-DialogComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: DialogComponent, selector: "ui-dialog", inputs: { title: "title", showCloseButton: "showCloseButton", canCloseFn: "canCloseFn", secondaryButtonLabel: "secondaryButtonLabel", primaryButtonLabel: "primaryButtonLabel", secondaryButtonType: "secondaryButtonType", primaryButtonType: "primaryButtonType" }, outputs: { closeEvent: "closeEvent", secondaryButtonClickEvent: "secondaryButtonClickEvent", primaryButtonClickEvent: "primaryButtonClickEvent" }, usesOnChanges: true, ngImport: i0, template: "<ng-container>\n  <div mat-dialog-title class=\"dialog-title\">\n    {{ title }}\n    <div *ngIf=\"showCloseButton\">\n      <ui-button\n        type=\"text\"\n        [justIcon]=\"true\"\n        [disabled]=\"disableButtons\"\n        class=\"close\"\n        iconName=\"Close\"\n        label=\"Close dialog\"\n        (click)=\"onClose($event)\"\n        (buttonClickEvent)=\"dismiss()\"\n      ></ui-button>\n    </div>\n  </div>\n  <mat-dialog-content>\n    <ng-content></ng-content>\n  </mat-dialog-content>\n  <div mat-dialog-actions *ngIf=\"secondaryButtonLabel !== '' || primaryButtonLabel !== ''\">\n    <ui-button\n      [type]=\"secondaryButtonType\"\n      *ngIf=\"!!secondaryButtonLabel\"\n      [label]=\"secondaryButtonLabel\"\n      (click)=\"onSecondaryButtonClick($event)\"\n    ></ui-button>\n    <ui-button\n      [type]=\"primaryButtonType\"\n      *ngIf=\"!!primaryButtonLabel\"\n      [disabled]=\"disableButtons\"\n      (click)=\"onPrimaryButtonClick($event)\"\n      [label]=\"primaryButtonLabel\"\n      (buttonClickEvent)=\"dismiss()\"\n    ></ui-button>\n  </div>\n</ng-container>\n", styles: [".ui-dialog-wrapper{display:flex;flex-flow:column}.ui-dialog-wrapper .mat-mdc-dialog-container .mdc-dialog__container .mat-mdc-dialog-surface{border-radius:8px;padding:16px}.ui-dialog-wrapper .mat-mdc-dialog-content{font-size:14px;color:#000;line-height:20px}.dialog-title{display:flex;flex-direction:row;justify-content:space-between;align-items:center;margin:0;font-size:20px!important;font-weight:700!important}.dialog-title .close{margin-right:-24px}.dialog-title:before{content:none}.mat-mdc-dialog-actions{display:flex;justify-content:flex-end;column-gap:16px;padding:16px 0 0;margin-bottom:0;min-height:48px}@media (max-width: 1024px){.ui-dialog-wrapper .mat-mdc-dialog-container .mdc-dialog__container .mat-mdc-dialog-surface{min-width:320px;max-width:600px;border-radius:0}.mat-mdc-dialog-content{max-height:524px}}@media (max-width: 600px){.cdk-overlay-pane.ui-dialog-wrapper{max-width:100%!important;min-height:100%;display:flex;flex-flow:column}.cdk-overlay-pane.ui-dialog-wrapper .mat-mdc-dialog-container .mdc-dialog__container .mat-mdc-dialog-surface{min-width:100%;max-width:100%;height:100%;display:flex;flex-grow:1;border-radius:0}ui-dialog{height:100%;display:flex;flex-flow:column}.mat-mdc-dialog-content{max-height:unset;display:flex;flex-grow:1;flex-direction:column}}\n"], dependencies: [{ kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$4.MatDialogTitle, selector: "[mat-dialog-title], [matDialogTitle]", inputs: ["id"], exportAs: ["matDialogTitle"] }, { kind: "directive", type: i1$4.MatDialogContent, selector: "[mat-dialog-content], mat-dialog-content, [matDialogContent]" }, { kind: "directive", type: i1$4.MatDialogActions, selector: "[mat-dialog-actions], mat-dialog-actions, [matDialogActions]", inputs: ["align"] }, { kind: "component", type: ButtonComponent, selector: "ui-button", inputs: ["size", "type", "label", "iconPosition", "justIcon", "iconName", "disabled", "loading", "fullWidth", "url", "urlTarget", "value"], outputs: ["buttonClickEvent", "buttonHoverEvent"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: DialogComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'ui-dialog', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, template: "<ng-container>\n  <div mat-dialog-title class=\"dialog-title\">\n    {{ title }}\n    <div *ngIf=\"showCloseButton\">\n      <ui-button\n        type=\"text\"\n        [justIcon]=\"true\"\n        [disabled]=\"disableButtons\"\n        class=\"close\"\n        iconName=\"Close\"\n        label=\"Close dialog\"\n        (click)=\"onClose($event)\"\n        (buttonClickEvent)=\"dismiss()\"\n      ></ui-button>\n    </div>\n  </div>\n  <mat-dialog-content>\n    <ng-content></ng-content>\n  </mat-dialog-content>\n  <div mat-dialog-actions *ngIf=\"secondaryButtonLabel !== '' || primaryButtonLabel !== ''\">\n    <ui-button\n      [type]=\"secondaryButtonType\"\n      *ngIf=\"!!secondaryButtonLabel\"\n      [label]=\"secondaryButtonLabel\"\n      (click)=\"onSecondaryButtonClick($event)\"\n    ></ui-button>\n    <ui-button\n      [type]=\"primaryButtonType\"\n      *ngIf=\"!!primaryButtonLabel\"\n      [disabled]=\"disableButtons\"\n      (click)=\"onPrimaryButtonClick($event)\"\n      [label]=\"primaryButtonLabel\"\n      (buttonClickEvent)=\"dismiss()\"\n    ></ui-button>\n  </div>\n</ng-container>\n", styles: [".ui-dialog-wrapper{display:flex;flex-flow:column}.ui-dialog-wrapper .mat-mdc-dialog-container .mdc-dialog__container .mat-mdc-dialog-surface{border-radius:8px;padding:16px}.ui-dialog-wrapper .mat-mdc-dialog-content{font-size:14px;color:#000;line-height:20px}.dialog-title{display:flex;flex-direction:row;justify-content:space-between;align-items:center;margin:0;font-size:20px!important;font-weight:700!important}.dialog-title .close{margin-right:-24px}.dialog-title:before{content:none}.mat-mdc-dialog-actions{display:flex;justify-content:flex-end;column-gap:16px;padding:16px 0 0;margin-bottom:0;min-height:48px}@media (max-width: 1024px){.ui-dialog-wrapper .mat-mdc-dialog-container .mdc-dialog__container .mat-mdc-dialog-surface{min-width:320px;max-width:600px;border-radius:0}.mat-mdc-dialog-content{max-height:524px}}@media (max-width: 600px){.cdk-overlay-pane.ui-dialog-wrapper{max-width:100%!important;min-height:100%;display:flex;flex-flow:column}.cdk-overlay-pane.ui-dialog-wrapper .mat-mdc-dialog-container .mdc-dialog__container .mat-mdc-dialog-surface{min-width:100%;max-width:100%;height:100%;display:flex;flex-grow:1;border-radius:0}ui-dialog{height:100%;display:flex;flex-flow:column}.mat-mdc-dialog-content{max-height:unset;display:flex;flex-grow:1;flex-direction:column}}\n"] }]
-        }], ctorParameters: function () { return [{ type: i1$4.MatDialogRef }]; }, propDecorators: { title: [{
-                type: Input
-            }], showCloseButton: [{
-                type: Input
-            }], canCloseFn: [{
-                type: Input
-            }], secondaryButtonLabel: [{
-                type: Input
-            }], primaryButtonLabel: [{
-                type: Input
-            }], secondaryButtonType: [{
-                type: Input
-            }], primaryButtonType: [{
-                type: Input
-            }], closeEvent: [{
-                type: Output
-            }], secondaryButtonClickEvent: [{
-                type: Output
-            }], primaryButtonClickEvent: [{
-                type: Output
-            }] } });
-
-class DialogService {
-    constructor(matDialog) {
-        this.matDialog = matDialog;
-    }
-    open(dialogComponent) {
-        // Open the dialog using UI custom styles
-        return this.matDialog.open(dialogComponent, {
-            panelClass: 'ui-dialog-wrapper',
-        });
-    }
-}
-DialogService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: DialogService, deps: [{ token: i1$4.MatDialog }], target: i0.ɵɵFactoryTarget.Injectable });
-DialogService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: DialogService });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: DialogService, decorators: [{
-            type: Injectable
-        }], ctorParameters: function () { return [{ type: i1$4.MatDialog }]; } });
-
-class DialogComponentModule {
-}
-DialogComponentModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: DialogComponentModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-DialogComponentModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.9", ngImport: i0, type: DialogComponentModule, declarations: [DialogComponent], imports: [CommonModule, MatDialogModule, ButtonComponentModule], exports: [DialogComponent] });
-DialogComponentModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: DialogComponentModule, providers: [{ provide: MAT_DIALOG_DATA, useValue: {} }, { provide: MatDialogRef, useValue: {} }, DialogService], imports: [CommonModule, MatDialogModule, ButtonComponentModule] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: DialogComponentModule, decorators: [{
-            type: NgModule,
-            args: [{
-                    declarations: [DialogComponent],
-                    imports: [CommonModule, MatDialogModule, ButtonComponentModule],
-                    exports: [DialogComponent],
-                    providers: [{ provide: MAT_DIALOG_DATA, useValue: {} }, { provide: MatDialogRef, useValue: {} }, DialogService],
-                }]
-        }] });
-
-var ElevationType;
-(function (ElevationType) {
-    ElevationType["DEFAULT"] = "default";
-    ElevationType["MODAL"] = "modal";
-})(ElevationType || (ElevationType = {}));
-
-class ElevationShadowComponent {
-    constructor() {
-        /**
-         * The type of elevation shadow.
-         * Default: default.
-         *
-         * @type {ElevationType}
-         * @memberof ElevationShadowComponent
-         */
-        this.elevationType = ElevationType.DEFAULT;
-    }
-}
-ElevationShadowComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: ElevationShadowComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-ElevationShadowComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: ElevationShadowComponent, selector: "ui-elevation-shadow", inputs: { elevationType: "elevationType" }, ngImport: i0, template: "<div [ngClass]=\"elevationType\">\n    <ng-content></ng-content>\n</div>", styles: [".modal{border:2px solid #E0E0E0;box-shadow:2px 24px 48px 8px #00000014;border-radius:8px}.default{border:2px solid #E0E0E0;box-shadow:0 8px 24px 4px #00000014;border-radius:8px}\n"], dependencies: [{ kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: ElevationShadowComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'ui-elevation-shadow', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div [ngClass]=\"elevationType\">\n    <ng-content></ng-content>\n</div>", styles: [".modal{border:2px solid #E0E0E0;box-shadow:2px 24px 48px 8px #00000014;border-radius:8px}.default{border:2px solid #E0E0E0;box-shadow:0 8px 24px 4px #00000014;border-radius:8px}\n"] }]
-        }], propDecorators: { elevationType: [{
-                type: Input
-            }] } });
-
-class ElevationShadowComponentModule {
-}
-ElevationShadowComponentModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: ElevationShadowComponentModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-ElevationShadowComponentModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.9", ngImport: i0, type: ElevationShadowComponentModule, declarations: [ElevationShadowComponent], imports: [CommonModule], exports: [ElevationShadowComponent] });
-ElevationShadowComponentModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: ElevationShadowComponentModule, imports: [CommonModule] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: ElevationShadowComponentModule, decorators: [{
-            type: NgModule,
-            args: [{
-                    declarations: [ElevationShadowComponent],
-                    imports: [CommonModule],
-                    exports: [ElevationShadowComponent],
-                }]
-        }] });
-
-class ProgressBarComponent {
-    constructor() {
-        /**
-         * Color of the progress bar.
-         * Defaults to Test Gorilla primary color.
-         *
-         * @type {string}
-         * @memberof ProgressBarComponent
-         */
-        this.color = '#46A997';
-        /**
-         * Progress value of the progress bar.
-         * Defaults to zero.
-         *
-         * @type {number}
-         * @memberof ProgressBarComponent
-         */
-        this.progress = 0;
-        /**
-         * Mode of the progress bar.
-         * Mode must be one of these values: determinate, indeterminate, buffer, query.
-         * Defaults to 'determinate'.
-         *
-         * @type {ProgressBarMode}
-         * @memberof ProgressBarComponent
-         */
-        this.mode = 'determinate';
-        /**
-         * Buffer value of the progress bar.
-         * Defaults to zero.
-         *
-         * @type {number}
-         * @memberof ProgressBarComponent
-         */
-        this.buffer = 0;
-    }
-}
-ProgressBarComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: ProgressBarComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-ProgressBarComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: ProgressBarComponent, selector: "ui-progress-bar", inputs: { color: "color", progress: "progress", mode: "mode", buffer: "buffer" }, host: { properties: { "style.--color": "this.color" } }, ngImport: i0, template: "<mat-progress-bar\n  [mode]=\"mode\"\n  [value]=\"progress\"\n  [bufferValue]=\"buffer\"\n  aria-label=\"Progress bar\"\n  title=\"progress-bar\"\n  class=\"progress-bar\"\n></mat-progress-bar>\n", styles: [".mat-mdc-progress-bar.progress-bar{height:8px;border-radius:8px}.mat-mdc-progress-bar.progress-bar ::ng-deep .mdc-linear-progress__buffer-bar{background-color:#e0e0e0}.mat-mdc-progress-bar.progress-bar ::ng-deep .mdc-linear-progress__bar-inner{border-top-width:8px}\n"], dependencies: [{ kind: "component", type: i1$5.MatProgressBar, selector: "mat-progress-bar", inputs: ["color", "value", "bufferValue", "mode"], outputs: ["animationEnd"], exportAs: ["matProgressBar"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: ProgressBarComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'ui-progress-bar', changeDetection: ChangeDetectionStrategy.OnPush, template: "<mat-progress-bar\n  [mode]=\"mode\"\n  [value]=\"progress\"\n  [bufferValue]=\"buffer\"\n  aria-label=\"Progress bar\"\n  title=\"progress-bar\"\n  class=\"progress-bar\"\n></mat-progress-bar>\n", styles: [".mat-mdc-progress-bar.progress-bar{height:8px;border-radius:8px}.mat-mdc-progress-bar.progress-bar ::ng-deep .mdc-linear-progress__buffer-bar{background-color:#e0e0e0}.mat-mdc-progress-bar.progress-bar ::ng-deep .mdc-linear-progress__bar-inner{border-top-width:8px}\n"] }]
-        }], ctorParameters: function () { return []; }, propDecorators: { color: [{
-                type: HostBinding,
-                args: ['style.--color']
-            }, {
-                type: Input
-            }], progress: [{
-                type: Input
-            }], mode: [{
-                type: Input
-            }], buffer: [{
-                type: Input
-            }] } });
-
-class DragDropDirective {
-    constructor() {
-        this.fileDropped = new EventEmitter();
-    }
-    // Dragover listener
-    onDragOver(event) {
-        event.preventDefault();
-        event.stopPropagation();
-        this.file = true;
-    }
-    // Dragleave listener
-    onDragLeave(event) {
-        event.preventDefault();
-        event.stopPropagation();
-        this.file = false;
-    }
-    // Drop listener
-    ondrop(event) {
-        event.preventDefault();
-        event.stopPropagation();
-        this.file = false;
-        let files;
-        if (!!event.dataTransfer) {
-            files = event.dataTransfer.files;
-            if (files.length > 0) {
-                this.fileDropped.emit(files);
-            }
-        }
-    }
-}
-DragDropDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: DragDropDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
-DragDropDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.2.9", type: DragDropDirective, selector: "[uiDragDrop]", outputs: { fileDropped: "fileDropped" }, host: { listeners: { "dragover": "onDragOver($event)", "dragleave": "onDragLeave($event)", "drop": "ondrop($event)" }, properties: { "class.file-over": "this.file" } }, ngImport: i0 });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: DragDropDirective, decorators: [{
-            type: Directive,
-            args: [{
-                    selector: '[uiDragDrop]'
-                }]
-        }], ctorParameters: function () { return []; }, propDecorators: { file: [{
-                type: HostBinding,
-                args: ['class.file-over']
-            }], fileDropped: [{
-                type: Output
-            }], onDragOver: [{
-                type: HostListener,
-                args: ['dragover', ['$event']]
-            }], onDragLeave: [{
-                type: HostListener,
-                args: ['dragleave', ['$event']]
-            }], ondrop: [{
-                type: HostListener,
-                args: ['drop', ['$event']]
-            }] } });
-
-class FileUploadComponent {
-    constructor() {
-        this.class = 'ui-file-upload';
-        this.OnDrop = new EventEmitter();
-        /**
-         * @ignore
-         */
-        this.onChange = (_) => { };
-        /**
-         * @ignore
-         */
-        this.onTouch = () => { };
-        this.file = null;
-        this.progress = false;
-        this.success = false;
-    }
-    ngOnInit() {
-        this.browse = true;
-    }
-    //When file is dropped
-    onFileDropped(files) {
-        this.emitFile(files);
-    }
-    //When input changes
-    onChangeUpload(event) {
-        const element = event.currentTarget;
-        this.emitFile(element.files || new FileList());
-    }
-    //Emit drop file
-    emitFile(files) {
-        const [file] = Array.from(files);
-        this.file = file;
-        this.errors = null;
-        this.onTouch();
-        this.onChange(this.file);
-        this.OnDrop.emit(file);
-    }
-    //Show progress-bar
-    showProgress() {
-        this.browse = false;
-        return this.file && !this.errors ? true : false;
-    }
-    //Show success elements
-    showSuccess() {
-        return this.file && this.uploadProgress === 100 && !this.errors ? true : false;
-    }
-    //Show browse when there are error
-    showBrowse() {
-        return this.errors ? true : false;
-    }
-    ngOnChanges(changes) {
-        if (changes['uploadProgress']) {
-            this.progress = this.showProgress();
-            this.success = this.showSuccess();
-            this.browse = this.showBrowse();
-        }
-        if (changes['errors']) {
-            this.progress = this.showProgress();
-            this.success = this.showSuccess();
-            this.browse = this.showBrowse();
-        }
-    }
-    writeValue(value) {
-        if (value) {
-            this.file = value || null;
-        }
-        else {
-            this.file = null;
-        }
-    }
-    registerOnChange(fn) {
-        this.onChange = fn;
-    }
-    registerOnTouched(fn) {
-        this.onTouch = fn;
-    }
-    setDisabledState(isDisabled) {
-        this.disabled = isDisabled;
-    }
-}
-FileUploadComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: FileUploadComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-FileUploadComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: FileUploadComponent, selector: "ui-file-upload", inputs: { maxFileSizeMB: "maxFileSizeMB", supportedFileTypes: "supportedFileTypes", uploadProgress: "uploadProgress", errors: "errors", disabled: "disabled" }, outputs: { OnDrop: "OnDrop" }, host: { properties: { "class": "this.class" } }, providers: [
-        {
-            provide: NG_VALUE_ACCESSOR,
-            useExisting: forwardRef(() => FileUploadComponent),
-            multi: true,
-        },
-    ], usesOnChanges: true, ngImport: i0, template: "<div class=\"upload-file-container\" uiDragDrop [ngClass]=\"{'upload-errors': !!errors}\" (fileDropped)=\"onFileDropped($event)\">\n  <div *ngIf=\"browse\" [@inOutAnimation] class=\"upload-files\">\n    <div class=\"upload-browse\">\n      <ui-icon class=\"upload-icon\" name=\"File-upload\"></ui-icon>\n      <div class=\"errors\" *ngIf=\"!!errors\">\n        <span *ngFor=\"let error of errors\">\n          <ui-icon name=\"Error\"></ui-icon> {{ error }}\n        </span>\n      </div>\n      <input class=\"form-control\" #fileDrop type=\"file\" id=\"fileDrop\" (change)=\"onChangeUpload($event)\">\n      <p>Drag and drop or <label for=\"fileDrop\" class=\"semibold\">browse</label> your files</p>\n      <span class=\"upload-text\">{{ maxFileSizeMB }}MB max file size.</span>\n    </div>\n  </div>\n  <div class=\"upload-change\" [@inOutAnimationChange] *ngIf=\"!!success && !!file && !!progress\">\n    <ui-icon class=\"upload-icon\" name=\"File-upload\"></ui-icon>\n    <input class=\"form-control\" #fileDrop type=\"file\" id=\"fileDrop\" (change)=\"onChangeUpload($event)\" [disabled]=\"disabled\">\n    <p>Drag and drop or <label for=\"fileDrop\" class=\"semibold\">change</label> your files</p>\n    <span  class=\"upload-text\"><strong>{{ file.name }}</strong></span>\n  </div>\n  <div class=\"upload-progress\" [@inOutAnimationProgress] *ngIf=\"!!progress && !!file && !success\">\n    <p>{{ file.name }}</p>\n    <ui-progress-bar\n      [progress]=\"uploadProgress\"\n      ></ui-progress-bar>\n    <p class=\"upload-text\">Uploading <span>{{uploadProgress}}</span>%</p>\n  </div>\n</div>\n<div class=\"upload-supported-files\" *ngIf=\"!!supportedFileTypes\">\n  <span>Supported file types:</span>{{ supportedFileTypes }}\n</div>", styles: [".upload-file-container{border-radius:8px;border:1px dashed #888888;background:#F6F6F6;display:flex;justify-content:center;align-items:center;height:196px;flex-flow:column;position:relative;max-width:563px}.upload-file-container.upload-errors{border:1px dashed #cb7b7a}.upload-file-container .upload-files{display:flex;flex-flow:column;align-items:center;justify-content:center;width:100%;height:196px}.upload-file-container .upload-change,.upload-file-container .upload-browse{display:flex;flex-flow:column;align-items:center;justify-content:center;width:100%;position:relative;height:196px}.upload-file-container .upload-change ui-icon.upload-icon,.upload-file-container .upload-browse ui-icon.upload-icon{margin-bottom:16px}.upload-file-container .upload-change ui-icon.upload-icon mat-icon.size-16 svg,.upload-file-container .upload-browse ui-icon.upload-icon mat-icon.size-16 svg{width:32px;height:32px}.upload-file-container .upload-change input,.upload-file-container .upload-browse input{opacity:0;position:absolute;z-index:2;width:100%;height:100%;cursor:pointer}.upload-file-container .upload-change .upload-text,.upload-file-container .upload-browse .upload-text{margin-top:20px}.upload-file-container .upload-change p,.upload-file-container .upload-browse p{margin:0}.upload-file-container .upload-change p .semibold,.upload-file-container .upload-browse p .semibold{font-weight:400;text-decoration:underline}.upload-file-container .upload-change .errors,.upload-file-container .upload-browse .errors{width:100%;display:flex;align-items:center;justify-content:center;flex-direction:column;margin-bottom:20px;font-size:12px;line-height:16px;color:#cb7b7a}.upload-file-container .upload-change .errors span,.upload-file-container .upload-browse .errors span{display:flex;align-items:center;margin-bottom:5px}.upload-file-container .upload-change .errors span:last-child,.upload-file-container .upload-browse .errors span:last-child{margin-bottom:0}.upload-file-container .upload-change .errors ui-icon,.upload-file-container .upload-browse .errors ui-icon{margin-right:4px}.upload-file-container .upload-change .errors ui-icon mat-icon.size-16 svg,.upload-file-container .upload-browse .errors ui-icon mat-icon.size-16 svg{width:16px;height:16px;color:#cb7b7a}.upload-file-container .upload-progress{padding:0 32px;width:100%}.upload-file-container .upload-text{text-align:right}.upload-supported-files{font-size:12px;line-height:16px;margin-top:8px;display:flex}.upload-supported-files span{font-weight:700;margin-right:5px}@media (max-width: 600px){.upload-file-container{max-width:100%}}\n"], dependencies: [{ kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: IconComponent, selector: "ui-icon", inputs: ["size", "cssClass", "name", "color"] }, { kind: "component", type: ProgressBarComponent, selector: "ui-progress-bar", inputs: ["color", "progress", "mode", "buffer"] }, { kind: "directive", type: DragDropDirective, selector: "[uiDragDrop]", outputs: ["fileDropped"] }], animations: [
-        trigger('inOutAnimation', [
-            transition(':enter', [
-                style({ opacity: 0, height: 0 }),
-                animate('0.2s ease-out', style({ opacity: 1, height: '196px' })),
-            ]),
-            transition(':leave', [
-                style({ opacity: 1, height: '196px' }),
-                animate('0.2s ease-in', style({ opacity: 0, height: 0 })),
-            ]),
-        ]),
-        trigger('inOutAnimationProgress', [
-            transition(':enter', [
-                style({ opacity: 0, height: 0 }),
-                animate('0.2s ease-out', style({ opacity: 1, height: '196px' })),
-            ]),
-            transition(':leave', [
-                style({ opacity: 1, height: '196px' }),
-                animate('0.2s ease-in', style({ opacity: 0, height: 0 })),
-            ]),
-        ]),
-        trigger('inOutAnimationChange', [
-            transition(':enter', [
-                style({ opacity: 0, height: 0 }),
-                animate('0.2s ease-out', style({ opacity: 1, height: '196px' })),
-            ]),
-            transition(':leave', [
-                style({ opacity: 1, height: '196px' }),
-                animate('0.2s ease-in', style({ opacity: 0, height: 0 })),
-            ]),
-        ]),
-    ], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: FileUploadComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'ui-file-upload', encapsulation: ViewEncapsulation.None, providers: [
-                        {
-                            provide: NG_VALUE_ACCESSOR,
-                            useExisting: forwardRef(() => FileUploadComponent),
-                            multi: true,
-                        },
-                    ], changeDetection: ChangeDetectionStrategy.OnPush, animations: [
-                        trigger('inOutAnimation', [
-                            transition(':enter', [
-                                style({ opacity: 0, height: 0 }),
-                                animate('0.2s ease-out', style({ opacity: 1, height: '196px' })),
-                            ]),
-                            transition(':leave', [
-                                style({ opacity: 1, height: '196px' }),
-                                animate('0.2s ease-in', style({ opacity: 0, height: 0 })),
-                            ]),
-                        ]),
-                        trigger('inOutAnimationProgress', [
-                            transition(':enter', [
-                                style({ opacity: 0, height: 0 }),
-                                animate('0.2s ease-out', style({ opacity: 1, height: '196px' })),
-                            ]),
-                            transition(':leave', [
-                                style({ opacity: 1, height: '196px' }),
-                                animate('0.2s ease-in', style({ opacity: 0, height: 0 })),
-                            ]),
-                        ]),
-                        trigger('inOutAnimationChange', [
-                            transition(':enter', [
-                                style({ opacity: 0, height: 0 }),
-                                animate('0.2s ease-out', style({ opacity: 1, height: '196px' })),
-                            ]),
-                            transition(':leave', [
-                                style({ opacity: 1, height: '196px' }),
-                                animate('0.2s ease-in', style({ opacity: 0, height: 0 })),
-                            ]),
-                        ]),
-                    ], template: "<div class=\"upload-file-container\" uiDragDrop [ngClass]=\"{'upload-errors': !!errors}\" (fileDropped)=\"onFileDropped($event)\">\n  <div *ngIf=\"browse\" [@inOutAnimation] class=\"upload-files\">\n    <div class=\"upload-browse\">\n      <ui-icon class=\"upload-icon\" name=\"File-upload\"></ui-icon>\n      <div class=\"errors\" *ngIf=\"!!errors\">\n        <span *ngFor=\"let error of errors\">\n          <ui-icon name=\"Error\"></ui-icon> {{ error }}\n        </span>\n      </div>\n      <input class=\"form-control\" #fileDrop type=\"file\" id=\"fileDrop\" (change)=\"onChangeUpload($event)\">\n      <p>Drag and drop or <label for=\"fileDrop\" class=\"semibold\">browse</label> your files</p>\n      <span class=\"upload-text\">{{ maxFileSizeMB }}MB max file size.</span>\n    </div>\n  </div>\n  <div class=\"upload-change\" [@inOutAnimationChange] *ngIf=\"!!success && !!file && !!progress\">\n    <ui-icon class=\"upload-icon\" name=\"File-upload\"></ui-icon>\n    <input class=\"form-control\" #fileDrop type=\"file\" id=\"fileDrop\" (change)=\"onChangeUpload($event)\" [disabled]=\"disabled\">\n    <p>Drag and drop or <label for=\"fileDrop\" class=\"semibold\">change</label> your files</p>\n    <span  class=\"upload-text\"><strong>{{ file.name }}</strong></span>\n  </div>\n  <div class=\"upload-progress\" [@inOutAnimationProgress] *ngIf=\"!!progress && !!file && !success\">\n    <p>{{ file.name }}</p>\n    <ui-progress-bar\n      [progress]=\"uploadProgress\"\n      ></ui-progress-bar>\n    <p class=\"upload-text\">Uploading <span>{{uploadProgress}}</span>%</p>\n  </div>\n</div>\n<div class=\"upload-supported-files\" *ngIf=\"!!supportedFileTypes\">\n  <span>Supported file types:</span>{{ supportedFileTypes }}\n</div>", styles: [".upload-file-container{border-radius:8px;border:1px dashed #888888;background:#F6F6F6;display:flex;justify-content:center;align-items:center;height:196px;flex-flow:column;position:relative;max-width:563px}.upload-file-container.upload-errors{border:1px dashed #cb7b7a}.upload-file-container .upload-files{display:flex;flex-flow:column;align-items:center;justify-content:center;width:100%;height:196px}.upload-file-container .upload-change,.upload-file-container .upload-browse{display:flex;flex-flow:column;align-items:center;justify-content:center;width:100%;position:relative;height:196px}.upload-file-container .upload-change ui-icon.upload-icon,.upload-file-container .upload-browse ui-icon.upload-icon{margin-bottom:16px}.upload-file-container .upload-change ui-icon.upload-icon mat-icon.size-16 svg,.upload-file-container .upload-browse ui-icon.upload-icon mat-icon.size-16 svg{width:32px;height:32px}.upload-file-container .upload-change input,.upload-file-container .upload-browse input{opacity:0;position:absolute;z-index:2;width:100%;height:100%;cursor:pointer}.upload-file-container .upload-change .upload-text,.upload-file-container .upload-browse .upload-text{margin-top:20px}.upload-file-container .upload-change p,.upload-file-container .upload-browse p{margin:0}.upload-file-container .upload-change p .semibold,.upload-file-container .upload-browse p .semibold{font-weight:400;text-decoration:underline}.upload-file-container .upload-change .errors,.upload-file-container .upload-browse .errors{width:100%;display:flex;align-items:center;justify-content:center;flex-direction:column;margin-bottom:20px;font-size:12px;line-height:16px;color:#cb7b7a}.upload-file-container .upload-change .errors span,.upload-file-container .upload-browse .errors span{display:flex;align-items:center;margin-bottom:5px}.upload-file-container .upload-change .errors span:last-child,.upload-file-container .upload-browse .errors span:last-child{margin-bottom:0}.upload-file-container .upload-change .errors ui-icon,.upload-file-container .upload-browse .errors ui-icon{margin-right:4px}.upload-file-container .upload-change .errors ui-icon mat-icon.size-16 svg,.upload-file-container .upload-browse .errors ui-icon mat-icon.size-16 svg{width:16px;height:16px;color:#cb7b7a}.upload-file-container .upload-progress{padding:0 32px;width:100%}.upload-file-container .upload-text{text-align:right}.upload-supported-files{font-size:12px;line-height:16px;margin-top:8px;display:flex}.upload-supported-files span{font-weight:700;margin-right:5px}@media (max-width: 600px){.upload-file-container{max-width:100%}}\n"] }]
-        }], ctorParameters: function () { return []; }, propDecorators: { class: [{
-                type: HostBinding
-            }], maxFileSizeMB: [{
-                type: Input
-            }], supportedFileTypes: [{
-                type: Input
-            }], uploadProgress: [{
-                type: Input
-            }], errors: [{
-                type: Input
-            }], disabled: [{
-                type: Input
-            }], OnDrop: [{
-                type: Output
-            }] } });
-
-class ProgressBarComponentModule {
-}
-ProgressBarComponentModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: ProgressBarComponentModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-ProgressBarComponentModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.9", ngImport: i0, type: ProgressBarComponentModule, declarations: [ProgressBarComponent], imports: [CommonModule, MatProgressBarModule], exports: [ProgressBarComponent] });
-ProgressBarComponentModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: ProgressBarComponentModule, imports: [CommonModule, MatProgressBarModule] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: ProgressBarComponentModule, decorators: [{
-            type: NgModule,
-            args: [{
-                    declarations: [ProgressBarComponent],
-                    imports: [CommonModule, MatProgressBarModule],
-                    exports: [ProgressBarComponent],
-                    providers: [],
-                }]
-        }] });
-
-class FileUploadComponentModule {
-}
-FileUploadComponentModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: FileUploadComponentModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-FileUploadComponentModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.9", ngImport: i0, type: FileUploadComponentModule, declarations: [FileUploadComponent, DragDropDirective], imports: [CommonModule, MatFormFieldModule, MatInputModule, IconComponentModule, ProgressBarComponentModule], exports: [FileUploadComponent] });
-FileUploadComponentModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: FileUploadComponentModule, imports: [CommonModule, MatFormFieldModule, MatInputModule, IconComponentModule, ProgressBarComponentModule] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: FileUploadComponentModule, decorators: [{
-            type: NgModule,
-            args: [{
-                    declarations: [FileUploadComponent, DragDropDirective],
-                    imports: [CommonModule, MatFormFieldModule, MatInputModule, IconComponentModule, ProgressBarComponentModule],
-                    exports: [FileUploadComponent],
-                    providers: [],
-                }]
-        }] });
-
-const FORGOT_PASSWORD_i18n = {
-    title: 'Reset your password',
-    email_label: 'Email',
-    button_label: 'Send reset link',
-    back_to_login: 'Back to log in',
-};
-
-class ForgotPasswordComponent {
-    /**
-     * @ignore
-     */
-    ngOnInit() { }
-    constructor(fb) {
-        this.fb = fb;
-        // TODO: Some properties and methods are ignored on purpose because of a current issue with compodoc and angular 13
-        // https://github.com/storybookjs/storybook/issues/16865
-        // https://github.com/storybookjs/storybook/issues/17004
-        /**
-         * @ignore
-         */
-        this.forgotPasswordForm = this.fb.group({
-            email: ['', [Validators.required, Validators.email]],
-        });
-        /**
-         * @ignore
-         */
-        this.formErrors = {
-            email: [''],
-        };
-        /**
-         *
-         * @description Object with the translations for the component.
-         * @type {Ii18nForgotPassword}
-         * @memberof ForgotPasswordComponent
-         */
-        this.i18n = FORGOT_PASSWORD_i18n;
-        /**
-         * @ignore
-         */
-        this.submitEvent = new EventEmitter();
-        /**
-         * @ignore
-         */
-        this.backToLoginEvent = new EventEmitter();
-    }
-    submit() {
-        var _a;
-        this.submitEvent.emit({
-            email: (_a = this.forgotPasswordForm.get('email')) === null || _a === void 0 ? void 0 : _a.value,
-        });
-    }
-    backToLogin() {
-        this.backToLoginEvent.emit();
-    }
-    checkErrors(field) {
-        if (this.forgotPasswordForm.controls[field].touched) {
-            if (this.forgotPasswordForm.controls[field].hasError('required')) {
-                this.formErrors[field] = ['This field is required'];
-                return;
-            }
-            if (this.forgotPasswordForm.controls[field].hasError('email')) {
-                this.formErrors[field] = ['Enter a valid email'];
-                return;
-            }
-        }
-        this.formErrors[field] = [''];
-    }
-}
-ForgotPasswordComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: ForgotPasswordComponent, deps: [{ token: i1$3.UntypedFormBuilder }], target: i0.ɵɵFactoryTarget.Component });
-ForgotPasswordComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: ForgotPasswordComponent, selector: "ui-forgot-password", inputs: { formErrors: "formErrors", loading: "loading", i18n: "i18n" }, outputs: { submitEvent: "submitEvent", backToLoginEvent: "backToLoginEvent" }, ngImport: i0, template: "<div class=\"form-box\">\n  <ui-logo></ui-logo>\n  <div class=\"title\">{{ i18n.title }}</div>\n  <form [formGroup]=\"forgotPasswordForm\">\n    <div class=\"field\">\n      <ui-field\n        formControlName=\"email\"\n        [label]=\"i18n.email_label\"\n        [type]=\"'email'\"\n        [required]=\"true\"\n        [errors]=\"formErrors.email\"\n        (ngModelChange)=\"checkErrors('email')\"\n      ></ui-field>\n    </div>\n    <div></div>\n    <div class=\"submit-button\">\n      <ui-button\n        [label]=\"i18n.button_label\"\n        [disabled]=\"forgotPasswordForm.invalid\"\n        [fullWidth]=\"true\"\n        [loading]=\"loading\"\n        (buttonClickEvent)=\"submit()\"\n      ></ui-button>\n    </div>\n    <div class=\"back-login\" (click)=\"backToLogin()\">\n      <mat-icon>arrow_back</mat-icon>\n      <span>{{ i18n.back_to_login }}</span>\n    </div>\n  </form>\n</div>\n", styles: [".form-box{width:672px;padding:64px;background:#ffffff;box-shadow:0 8px 16px #0000001a;border-radius:8px;margin:auto;color:#000}.form-box ui-logo{width:160px;display:inline-flex}.form-box .title{font-weight:700;font-size:22px;line-height:29.7px;margin:40px 0 21px}.form-box .field{width:100%}.form-box .submit-button{margin:3px 0 24px}.form-box .back-login{display:flex;align-content:center;color:#46a997;cursor:pointer}.form-box .back-login mat-icon{margin-right:8px}.form-box .back-login span{padding-top:2px;font-weight:700}\n"], dependencies: [{ kind: "directive", type: i1$3.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$3.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$3.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i1$3.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$3.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: FieldComponent, selector: "ui-field", inputs: ["label", "fieldName", "placeholder", "id", "value", "errors", "disabled", "required", "hintMessage", "type", "updateOnBlur", "allowOnlyDigits"] }, { kind: "component", type: ButtonComponent, selector: "ui-button", inputs: ["size", "type", "label", "iconPosition", "justIcon", "iconName", "disabled", "loading", "fullWidth", "url", "urlTarget", "value"], outputs: ["buttonClickEvent", "buttonHoverEvent"] }, { kind: "component", type: i1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: LogoComponent, selector: "ui-logo", inputs: ["type"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: ForgotPasswordComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'ui-forgot-password', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"form-box\">\n  <ui-logo></ui-logo>\n  <div class=\"title\">{{ i18n.title }}</div>\n  <form [formGroup]=\"forgotPasswordForm\">\n    <div class=\"field\">\n      <ui-field\n        formControlName=\"email\"\n        [label]=\"i18n.email_label\"\n        [type]=\"'email'\"\n        [required]=\"true\"\n        [errors]=\"formErrors.email\"\n        (ngModelChange)=\"checkErrors('email')\"\n      ></ui-field>\n    </div>\n    <div></div>\n    <div class=\"submit-button\">\n      <ui-button\n        [label]=\"i18n.button_label\"\n        [disabled]=\"forgotPasswordForm.invalid\"\n        [fullWidth]=\"true\"\n        [loading]=\"loading\"\n        (buttonClickEvent)=\"submit()\"\n      ></ui-button>\n    </div>\n    <div class=\"back-login\" (click)=\"backToLogin()\">\n      <mat-icon>arrow_back</mat-icon>\n      <span>{{ i18n.back_to_login }}</span>\n    </div>\n  </form>\n</div>\n", styles: [".form-box{width:672px;padding:64px;background:#ffffff;box-shadow:0 8px 16px #0000001a;border-radius:8px;margin:auto;color:#000}.form-box ui-logo{width:160px;display:inline-flex}.form-box .title{font-weight:700;font-size:22px;line-height:29.7px;margin:40px 0 21px}.form-box .field{width:100%}.form-box .submit-button{margin:3px 0 24px}.form-box .back-login{display:flex;align-content:center;color:#46a997;cursor:pointer}.form-box .back-login mat-icon{margin-right:8px}.form-box .back-login span{padding-top:2px;font-weight:700}\n"] }]
-        }], ctorParameters: function () { return [{ type: i1$3.UntypedFormBuilder }]; }, propDecorators: { formErrors: [{
-                type: Input
-            }], loading: [{
-                type: Input
-            }], i18n: [{
-                type: Input
-            }], submitEvent: [{
-                type: Output
-            }], backToLoginEvent: [{
-                type: Output
-            }] } });
-
-class ForgotPasswordComponentModule {
-}
-ForgotPasswordComponentModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: ForgotPasswordComponentModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-ForgotPasswordComponentModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.9", ngImport: i0, type: ForgotPasswordComponentModule, declarations: [ForgotPasswordComponent], imports: [CommonModule,
-        FormsModule,
-        ReactiveFormsModule,
-        FieldComponentModule,
-        ButtonComponentModule,
-        MatIconModule,
-        LogoComponentModule], exports: [ForgotPasswordComponent] });
-ForgotPasswordComponentModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: ForgotPasswordComponentModule, imports: [CommonModule,
-        FormsModule,
-        ReactiveFormsModule,
-        FieldComponentModule,
-        ButtonComponentModule,
-        MatIconModule,
-        LogoComponentModule] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: ForgotPasswordComponentModule, decorators: [{
-            type: NgModule,
-            args: [{
-                    declarations: [ForgotPasswordComponent],
-                    imports: [
-                        CommonModule,
-                        FormsModule,
-                        ReactiveFormsModule,
-                        FieldComponentModule,
-                        ButtonComponentModule,
-                        MatIconModule,
-                        LogoComponentModule,
-                    ],
-                    exports: [ForgotPasswordComponent],
-                    providers: [],
-                }]
-        }] });
-
-class IconLabelComponent {
-    constructor() {
-        /**
-         * Icon size
-         *
-         * @type {IconSize}
-         * @memberof IconLabelComponent
-         */
-        this.iconSize = '16';
-        /**
-         * Label
-         *
-         * @memberof IconLabelComponent
-         */
-        this.text = '';
-    }
-    ngOnInit() { }
-}
-IconLabelComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: IconLabelComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-IconLabelComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: IconLabelComponent, selector: "ui-icon-label", inputs: { iconSize: "iconSize", iconName: "iconName", text: "text" }, ngImport: i0, template: "<ui-icon [name]=\"iconName\" [size]=\"iconSize\" aria-hidden=\"true\"></ui-icon>\n<span>{{ text }}</span>\n", styles: [":host{display:flex;align-items:center}:host ui-icon{margin-right:8px}\n"], dependencies: [{ kind: "component", type: IconComponent, selector: "ui-icon", inputs: ["size", "cssClass", "name", "color"] }] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: IconLabelComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'ui-icon-label', template: "<ui-icon [name]=\"iconName\" [size]=\"iconSize\" aria-hidden=\"true\"></ui-icon>\n<span>{{ text }}</span>\n", styles: [":host{display:flex;align-items:center}:host ui-icon{margin-right:8px}\n"] }]
-        }], ctorParameters: function () { return []; }, propDecorators: { iconSize: [{
-                type: Input
-            }], iconName: [{
-                type: Input
-            }], text: [{
-                type: Input
-            }] } });
-
-class IconLabelComponentModule {
-}
-IconLabelComponentModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: IconLabelComponentModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-IconLabelComponentModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.9", ngImport: i0, type: IconLabelComponentModule, declarations: [IconLabelComponent], imports: [CommonModule, IconComponentModule], exports: [IconLabelComponent] });
-IconLabelComponentModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: IconLabelComponentModule, imports: [CommonModule, IconComponentModule] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: IconLabelComponentModule, decorators: [{
-            type: NgModule,
-            args: [{
-                    declarations: [IconLabelComponent],
-                    imports: [CommonModule, IconComponentModule],
-                    exports: [IconLabelComponent],
-                    providers: [],
-                }]
-        }] });
-
-var LabelSizeEnum;
-(function (LabelSizeEnum) {
-    LabelSizeEnum["SMALL"] = "small";
-    LabelSizeEnum["MEDIUM"] = "medium";
-    LabelSizeEnum["LARGE"] = "large";
-    LabelSizeEnum["BIG"] = "big";
-    LabelSizeEnum["HUGE"] = "huge";
-})(LabelSizeEnum || (LabelSizeEnum = {}));
-
-class LabelComponent {
-    constructor() {
-        /**
-         * @ignore
-         */
-        this.LabelSizeEnum = LabelSizeEnum;
-        /**
-         * Label background color
-         *
-         * @type {string}
-         * @memberof LabelComponent
-         */
-        this.backgroundColor = '';
-        /**
-         * Status text color
-         *
-         * @type {string}
-         * @memberof LabelComponent
-         */
-        this.textColor = '';
-        /**
-         * Status title
-         *
-         * @type {string}
-         * @memberof LabelComponent
-         */
-        this.title = '';
-        /**
-         * Status description
-         *
-         * @type {string}
-         * @memberof LabelComponent
-         */
-        this.description = '';
-        /**
-         * Label size
-         *
-         * @type {LabelSizeEnum}
-         * @memberof LabelComponent
-         */
-        this.size = LabelSizeEnum.SMALL;
-    }
-}
-LabelComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: LabelComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-LabelComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: LabelComponent, selector: "ui-label", inputs: { backgroundColor: "backgroundColor", textColor: "textColor", title: "title", description: "description", size: "size" }, ngImport: i0, template: "<div\n  class=\"label\"\n  [ngStyle]=\"{ 'background-color': backgroundColor, color: textColor }\"\n  [ngClass]=\"{\n    small: size === LabelSizeEnum.SMALL,\n    medium: size === LabelSizeEnum.MEDIUM,\n    large: size === LabelSizeEnum.LARGE,\n    big: size === LabelSizeEnum.BIG,\n    huge: size === LabelSizeEnum.HUGE\n  }\"\n>\n  <div [innerHTML]=\"title\"></div>\n  <div [innerHTML]=\"description\" class=\"description\" *ngIf=\"description && size === LabelSizeEnum.HUGE\"></div>\n</div>\n", styles: [".label{display:flex;flex-direction:column;justify-content:center;align-items:center;font-weight:600;border-radius:4px;width:-moz-fit-content;width:fit-content}.label.small{padding:0 8px;font-size:10px;min-height:16px}.label.medium{padding:2px 8px;font-size:12px;min-height:20px}.label.large{padding:8px 12px;font-size:14px;min-height:32px}.label.big{padding:8px 16px;font-size:14px;min-height:32px}.label.huge{padding:16px;font-size:12px;font-weight:700;min-height:48px;width:100%;max-width:166px;align-items:start}.label.huge .description{font-weight:400;font-size:12px;line-height:16px;padding-top:10px}\n"], dependencies: [{ kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: LabelComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'ui-label', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div\n  class=\"label\"\n  [ngStyle]=\"{ 'background-color': backgroundColor, color: textColor }\"\n  [ngClass]=\"{\n    small: size === LabelSizeEnum.SMALL,\n    medium: size === LabelSizeEnum.MEDIUM,\n    large: size === LabelSizeEnum.LARGE,\n    big: size === LabelSizeEnum.BIG,\n    huge: size === LabelSizeEnum.HUGE\n  }\"\n>\n  <div [innerHTML]=\"title\"></div>\n  <div [innerHTML]=\"description\" class=\"description\" *ngIf=\"description && size === LabelSizeEnum.HUGE\"></div>\n</div>\n", styles: [".label{display:flex;flex-direction:column;justify-content:center;align-items:center;font-weight:600;border-radius:4px;width:-moz-fit-content;width:fit-content}.label.small{padding:0 8px;font-size:10px;min-height:16px}.label.medium{padding:2px 8px;font-size:12px;min-height:20px}.label.large{padding:8px 12px;font-size:14px;min-height:32px}.label.big{padding:8px 16px;font-size:14px;min-height:32px}.label.huge{padding:16px;font-size:12px;font-weight:700;min-height:48px;width:100%;max-width:166px;align-items:start}.label.huge .description{font-weight:400;font-size:12px;line-height:16px;padding-top:10px}\n"] }]
-        }], ctorParameters: function () { return []; }, propDecorators: { backgroundColor: [{
-                type: Input
-            }], textColor: [{
-                type: Input
-            }], title: [{
-                type: Input
-            }], description: [{
-                type: Input
-            }], size: [{
-                type: Input
-            }] } });
-
-class LabelComponentModule {
-}
-LabelComponentModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: LabelComponentModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-LabelComponentModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.9", ngImport: i0, type: LabelComponentModule, declarations: [LabelComponent], imports: [CommonModule], exports: [LabelComponent] });
-LabelComponentModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: LabelComponentModule, imports: [CommonModule] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: LabelComponentModule, decorators: [{
-            type: NgModule,
-            args: [{
-                    declarations: [LabelComponent],
-                    imports: [CommonModule],
-                    exports: [LabelComponent],
-                    providers: [],
-                }]
-        }] });
-
-const LOGIN_i18n = {
-    title: 'Log in to your Career Passport',
-    email_label: 'Email address',
-    password_label: 'Password',
-    remember_me: 'Keep me logged in',
-    forgot_password: 'Forgot password?',
-    button_label: 'Log in',
-    not_have_account: "Don't have an account?",
-    create_account: 'Create one here',
-};
-
-class LoginComponent {
-    /**
-     * @ignore
-     */
-    ngOnInit() {
-        var _a;
-        if (this.email) {
-            (_a = this.loginForm.get('email')) === null || _a === void 0 ? void 0 : _a.setValue(this.email);
-        }
-    }
-    constructor(fb) {
-        this.fb = fb;
-        // TODO: Some properties and methods are ignored on purpose because of a current issue with compodoc and angular 13
-        // https://github.com/storybookjs/storybook/issues/16865
-        // https://github.com/storybookjs/storybook/issues/17004
-        /**
-         * @ignore
-         */
-        this.email = '';
-        /**
-         * @ignore
-         */
-        this.loginForm = this.fb.group({
-            email: ['', [Validators.required, Validators.email]],
-            password: ['', [Validators.required]],
-            remember_me: [false],
-        });
-        /**
-         * @ignore
-         */
-        this.formErrors = {
-            email: '',
-            password: '',
-        };
-        /**
-         * Indicator if the form is loading
-         *
-         * @memberof ButtonComponent
-         */
-        this.loading = false;
-        /**
-         * @description Object with the translations for the component.
-         * @type {Ii18n}
-         * @memberof LoginComponent
-         */
-        this.i18n = LOGIN_i18n;
-        /**
-         * @ignore
-         */
-        this.submitEvent = new EventEmitter();
-        /**
-         * @ignore
-         */
-        this.forgotPasswordEvent = new EventEmitter();
-        /**
-         * @ignore
-         */
-        this.createAccountEvent = new EventEmitter();
-    }
-    submit() {
-        var _a, _b, _c;
-        this.submitEvent.emit({
-            username: (_a = this.loginForm.get('email')) === null || _a === void 0 ? void 0 : _a.value,
-            password: (_b = this.loginForm.get('password')) === null || _b === void 0 ? void 0 : _b.value,
-            remember_me: (_c = this.loginForm.get('remember_me')) === null || _c === void 0 ? void 0 : _c.value,
-        });
-    }
-    forgotPassword() {
-        this.forgotPasswordEvent.emit();
-    }
-    createAccount() {
-        this.createAccountEvent.emit();
-    }
-    checkErrors(field) {
-        if (this.loginForm.controls[field].touched) {
-            if (this.loginForm.controls[field].hasError('required')) {
-                this.formErrors[field] = 'This field is required';
-                return;
-            }
-            if (this.loginForm.controls[field].hasError('email')) {
-                this.formErrors[field] = 'Enter a valid email';
-                return;
-            }
-        }
-        this.formErrors[field] = '';
-    }
-}
-LoginComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: LoginComponent, deps: [{ token: i1$3.UntypedFormBuilder }], target: i0.ɵɵFactoryTarget.Component });
-LoginComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: LoginComponent, selector: "ui-login", inputs: { email: "email", loading: "loading", i18n: "i18n" }, outputs: { submitEvent: "submitEvent", forgotPasswordEvent: "forgotPasswordEvent", createAccountEvent: "createAccountEvent" }, ngImport: i0, template: "<div class=\"ui-login-container\">\n  <ui-logo></ui-logo>\n  <div class=\"title\">{{ i18n.title }}</div>\n  <form [formGroup]=\"loginForm\" class=\"form-wrapper\">\n    <div class=\"field-email\">\n      <ui-field\n        formControlName=\"email\"\n        [label]=\"i18n.email_label\"\n        [type]=\"'email'\"\n        [required]=\"true\"\n        [errors]=\"[formErrors.email]\"\n        (ngModelChange)=\"checkErrors('email')\"\n      ></ui-field>\n    </div>\n    <div class=\"field-password\">\n      <ui-field\n        formControlName=\"password\"\n        [label]=\"i18n.password_label\"\n        [type]=\"'password'\"\n        [required]=\"true\"\n        [errors]=\"[formErrors.password]\"\n        (ngModelChange)=\"checkErrors('password')\"\n      ></ui-field>\n    </div>\n    <div class=\"actions\">\n      <div class=\"remember-me\">\n        <ui-checkbox formControlName=\"remember_me\" [label]=\"i18n.remember_me\"></ui-checkbox>\n      </div>\n      <div class=\"forgot-password\" (click)=\"forgotPassword()\">{{ i18n.forgot_password }}</div>\n    </div>\n    <div class=\"submit-button\">\n      <ui-button\n        [label]=\"i18n.button_label\"\n        [disabled]=\"loginForm.invalid\"\n        [fullWidth]=\"true\"\n        [loading]=\"loading\"\n        (buttonClickEvent)=\"submit()\"\n      ></ui-button>\n    </div>\n    <div class=\"create-account-wrapper\">\n      <p>\n        {{ i18n.not_have_account }}\n        <span class=\"create-account\" (click)=\"createAccount()\">{{ i18n.create_account }}</span>\n      </p>\n    </div>\n  </form>\n</div>\n", styles: [".ui-login-container{display:grid;grid-template-columns:repeat(4,1fr);grid-template-rows:repeat(7,auto);max-width:672px;max-height:594px;height:100%;width:100%;padding:60px;background:#ffffff}.ui-login-container ui-logo{grid-column:1/5;grid-row:1/2;width:160px}.ui-login-container .title{grid-column:1/5;grid-row:2/3;font-weight:700;font-size:22px;line-height:29.7px;margin:24px 0;letter-spacing:-.04em}.ui-login-container .form-wrapper{grid-column:1/5;grid-row:3/8;display:grid;grid-template-columns:repeat(4,1fr);grid-template-rows:repeat(5,auto)}.ui-login-container .form-wrapper .field-email{grid-column:1/5;grid-row:1/2}.ui-login-container .form-wrapper .field-password{grid-column:1/5;grid-row:2/3}.ui-login-container .form-wrapper .actions{grid-column:1/5;grid-row:3/4;display:flex;height:-moz-fit-content;height:fit-content;max-height:20px;justify-content:space-between;margin-top:3px;align-items:center}.ui-login-container .form-wrapper .actions .forgot-password{cursor:pointer;font-weight:700;text-decoration:underline}.ui-login-container .form-wrapper .actions .remember-me{margin-left:-10px}.ui-login-container .form-wrapper .submit-button{margin-top:40px;grid-column:1/5;grid-row:4/5}.ui-login-container .form-wrapper .create-account-wrapper{margin-top:24px;grid-column:1/5;grid-row:5/6}.ui-login-container .form-wrapper .create-account-wrapper p{margin:0;line-height:19.07px}.ui-login-container .form-wrapper .create-account-wrapper .create-account{color:#46a997;cursor:pointer}.ui-login-container .form-wrapper .create-account-wrapper .create-account:hover{text-decoration:underline}@media (min-width: 1024px){.ui-login-container{box-shadow:0 8px 16px #0000001a;border-radius:8px;padding:80px}}\n"], dependencies: [{ kind: "directive", type: i1$3.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$3.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$3.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i1$3.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$3.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: FieldComponent, selector: "ui-field", inputs: ["label", "fieldName", "placeholder", "id", "value", "errors", "disabled", "required", "hintMessage", "type", "updateOnBlur", "allowOnlyDigits"] }, { kind: "component", type: ButtonComponent, selector: "ui-button", inputs: ["size", "type", "label", "iconPosition", "justIcon", "iconName", "disabled", "loading", "fullWidth", "url", "urlTarget", "value"], outputs: ["buttonClickEvent", "buttonHoverEvent"] }, { kind: "component", type: CheckboxComponent, selector: "ui-checkbox", inputs: ["disabled", "checked", "indeterminate", "color", "name", "label", "multiple"], outputs: ["changed"] }, { kind: "component", type: LogoComponent, selector: "ui-logo", inputs: ["type"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: LoginComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'ui-login', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"ui-login-container\">\n  <ui-logo></ui-logo>\n  <div class=\"title\">{{ i18n.title }}</div>\n  <form [formGroup]=\"loginForm\" class=\"form-wrapper\">\n    <div class=\"field-email\">\n      <ui-field\n        formControlName=\"email\"\n        [label]=\"i18n.email_label\"\n        [type]=\"'email'\"\n        [required]=\"true\"\n        [errors]=\"[formErrors.email]\"\n        (ngModelChange)=\"checkErrors('email')\"\n      ></ui-field>\n    </div>\n    <div class=\"field-password\">\n      <ui-field\n        formControlName=\"password\"\n        [label]=\"i18n.password_label\"\n        [type]=\"'password'\"\n        [required]=\"true\"\n        [errors]=\"[formErrors.password]\"\n        (ngModelChange)=\"checkErrors('password')\"\n      ></ui-field>\n    </div>\n    <div class=\"actions\">\n      <div class=\"remember-me\">\n        <ui-checkbox formControlName=\"remember_me\" [label]=\"i18n.remember_me\"></ui-checkbox>\n      </div>\n      <div class=\"forgot-password\" (click)=\"forgotPassword()\">{{ i18n.forgot_password }}</div>\n    </div>\n    <div class=\"submit-button\">\n      <ui-button\n        [label]=\"i18n.button_label\"\n        [disabled]=\"loginForm.invalid\"\n        [fullWidth]=\"true\"\n        [loading]=\"loading\"\n        (buttonClickEvent)=\"submit()\"\n      ></ui-button>\n    </div>\n    <div class=\"create-account-wrapper\">\n      <p>\n        {{ i18n.not_have_account }}\n        <span class=\"create-account\" (click)=\"createAccount()\">{{ i18n.create_account }}</span>\n      </p>\n    </div>\n  </form>\n</div>\n", styles: [".ui-login-container{display:grid;grid-template-columns:repeat(4,1fr);grid-template-rows:repeat(7,auto);max-width:672px;max-height:594px;height:100%;width:100%;padding:60px;background:#ffffff}.ui-login-container ui-logo{grid-column:1/5;grid-row:1/2;width:160px}.ui-login-container .title{grid-column:1/5;grid-row:2/3;font-weight:700;font-size:22px;line-height:29.7px;margin:24px 0;letter-spacing:-.04em}.ui-login-container .form-wrapper{grid-column:1/5;grid-row:3/8;display:grid;grid-template-columns:repeat(4,1fr);grid-template-rows:repeat(5,auto)}.ui-login-container .form-wrapper .field-email{grid-column:1/5;grid-row:1/2}.ui-login-container .form-wrapper .field-password{grid-column:1/5;grid-row:2/3}.ui-login-container .form-wrapper .actions{grid-column:1/5;grid-row:3/4;display:flex;height:-moz-fit-content;height:fit-content;max-height:20px;justify-content:space-between;margin-top:3px;align-items:center}.ui-login-container .form-wrapper .actions .forgot-password{cursor:pointer;font-weight:700;text-decoration:underline}.ui-login-container .form-wrapper .actions .remember-me{margin-left:-10px}.ui-login-container .form-wrapper .submit-button{margin-top:40px;grid-column:1/5;grid-row:4/5}.ui-login-container .form-wrapper .create-account-wrapper{margin-top:24px;grid-column:1/5;grid-row:5/6}.ui-login-container .form-wrapper .create-account-wrapper p{margin:0;line-height:19.07px}.ui-login-container .form-wrapper .create-account-wrapper .create-account{color:#46a997;cursor:pointer}.ui-login-container .form-wrapper .create-account-wrapper .create-account:hover{text-decoration:underline}@media (min-width: 1024px){.ui-login-container{box-shadow:0 8px 16px #0000001a;border-radius:8px;padding:80px}}\n"] }]
-        }], ctorParameters: function () { return [{ type: i1$3.UntypedFormBuilder }]; }, propDecorators: { email: [{
-                type: Input
-            }], loading: [{
-                type: Input
-            }], i18n: [{
-                type: Input
-            }], submitEvent: [{
-                type: Output
-            }], forgotPasswordEvent: [{
-                type: Output
-            }], createAccountEvent: [{
-                type: Output
-            }] } });
-
-class LoginComponentModule {
-}
-LoginComponentModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: LoginComponentModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-LoginComponentModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.9", ngImport: i0, type: LoginComponentModule, declarations: [LoginComponent], imports: [CommonModule,
-        FormsModule,
-        ReactiveFormsModule,
-        FieldComponentModule,
-        ButtonComponentModule,
-        CheckboxComponentModule,
-        LogoComponentModule], exports: [LoginComponent] });
-LoginComponentModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: LoginComponentModule, imports: [CommonModule,
-        FormsModule,
-        ReactiveFormsModule,
-        FieldComponentModule,
-        ButtonComponentModule,
-        CheckboxComponentModule,
-        LogoComponentModule] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: LoginComponentModule, decorators: [{
-            type: NgModule,
-            args: [{
-                    declarations: [LoginComponent],
-                    imports: [
-                        CommonModule,
-                        FormsModule,
-                        ReactiveFormsModule,
-                        FieldComponentModule,
-                        ButtonComponentModule,
-                        CheckboxComponentModule,
-                        LogoComponentModule,
-                    ],
-                    exports: [LoginComponent],
-                    providers: [],
-                }]
-        }] });
-
-class NavbarComponent {
-    constructor() {
-        // TODO: Some properties and methods are ignored on purpose because of a current issue with compodoc and angular 13
-        // https://github.com/storybookjs/storybook/issues/16865
-        // https://github.com/storybookjs/storybook/issues/17004
-        /**
-         * Routes object
-         *
-         * @type {IRoute}
-         * @memberof NavbarComponent
-         * @ignore
-         */
-        this.routes = [];
-        /**
-         * Actived route id
-         *
-         * @type {string}
-         * @memberof NavbarComponent
-         */
-        this.activedRoute = '';
-        /**
-         * User first name and last name
-         *
-         * @type {string}
-         * @memberof NavbarComponent
-         */
-        this.userName = '';
-        /**
-         * Menu items to show in menu above the Log out button
-         *
-         * @type {string}
-         * @memberof NavbarComponent
-         */
-        this.menuItems = [];
-        /**
-         * @ignore
-         */
-        this.navigateEvent = new EventEmitter();
-        /**
-         * @ignore
-         */
-        this.menuItemClicked = new EventEmitter();
-        /**
-         * @ignore
-         */
-        this.logoutEvent = new EventEmitter();
-    }
-    navigate(routeId) {
-        this.navigateEvent.emit(`/${routeId}`);
-    }
-    logout() {
-        this.logoutEvent.emit();
-    }
-    clickMenuItem(id) {
-        this.menuItemClicked.emit(id);
-    }
-}
-NavbarComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: NavbarComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-NavbarComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: NavbarComponent, selector: "ui-navbar", inputs: { routes: "routes", activedRoute: "activedRoute", userName: "userName", menuItems: "menuItems" }, outputs: { navigateEvent: "navigateEvent", menuItemClicked: "menuItemClicked", logoutEvent: "logoutEvent" }, ngImport: i0, template: "<mat-toolbar>\n    <div class=\"custom-toolbar row\">\n            <ui-logo class=\"logo\" (click)=\"navigate('')\"></ui-logo>\n            <div class=\"navigation row\">\n                <a *ngFor=\"let route of routes\" (click)=\"navigate(route.id)\" [ngClass]=\"{'active': activedRoute === route.id}\">\n                    <span>{{ route.title }}</span>\n                </a>\n            </div>\n            <div class=\"actions\">\n                <button mat-button class=\"profile-menu\" [matMenuTriggerFor]=\"menu\">\n                    {{ userName }}\n                    <mat-icon iconPositionEnd>expand_more</mat-icon>\n                </button>\n            </div>\n        </div>\n</mat-toolbar>\n\n<mat-menu #menu=\"matMenu\">\n    <button *ngFor=\"let e of menuItems\" mat-menu-item (click)=\"clickMenuItem(e.id)\">\n      <div class=\"menu-item\">\n        <ui-icon [name]=\"e.icon\" size=\"24\"></ui-icon>\n        {{ e.text }}\n      </div>\n    </button>\n    <button mat-menu-item (click)=\"logout()\">\n        <mat-icon>power_settings_new</mat-icon>\n        Log out\n    </button>\n</mat-menu>\n", styles: [".mat-toolbar{height:80px!important;background-color:#fff!important;padding:0 192px!important}.mat-toolbar .custom-toolbar{width:100%;height:100%;background-color:#fff}.mat-toolbar .custom-toolbar ui-logo.logo{cursor:pointer;width:105px;height:32px;align-self:center;flex:1 0 216px;display:flex}.mat-toolbar .custom-toolbar .navigation{height:100%}.mat-toolbar .custom-toolbar .navigation a{display:flex;align-items:center;height:100%;background:#fff;cursor:pointer}.mat-toolbar .custom-toolbar .navigation a.active{border-top:2px solid #276678}.mat-toolbar .custom-toolbar .navigation a.active span{font-weight:700}.mat-toolbar .custom-toolbar .navigation a span{width:100%;text-align:center;font-weight:400;font-size:14px;line-height:16px}.mat-toolbar .custom-toolbar .navigation a:not(:first-of-type){margin-left:32px}.mat-toolbar .custom-toolbar .actions{width:100%;display:flex;align-items:center;justify-content:flex-end}.mat-toolbar .custom-toolbar .actions .profile-menu{font-weight:600;font-size:14px;height:100%;margin-right:-20px}.mat-toolbar .custom-toolbar .actions .profile-menu mat-icon{font-size:16px;position:relative;top:3px;left:3px}.row{display:flex;flex-direction:row}.menu-item{display:flex;align-items:center}.menu-item ui-icon{margin-right:16px}\n"], dependencies: [{ kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "component", type: i2$4.MatToolbar, selector: "mat-toolbar", inputs: ["color"], exportAs: ["matToolbar"] }, { kind: "component", type: i1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i2$1.MatButton, selector: "    button[mat-button], button[mat-raised-button], button[mat-flat-button],    button[mat-stroked-button]  ", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "component", type: i5$1.MatMenu, selector: "mat-menu", exportAs: ["matMenu"] }, { kind: "component", type: i5$1.MatMenuItem, selector: "[mat-menu-item]", inputs: ["disabled", "disableRipple", "role"], exportAs: ["matMenuItem"] }, { kind: "directive", type: i5$1.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", exportAs: ["matMenuTrigger"] }, { kind: "component", type: LogoComponent, selector: "ui-logo", inputs: ["type"] }, { kind: "component", type: IconComponent, selector: "ui-icon", inputs: ["size", "cssClass", "name", "color"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: NavbarComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'ui-navbar', changeDetection: ChangeDetectionStrategy.OnPush, template: "<mat-toolbar>\n    <div class=\"custom-toolbar row\">\n            <ui-logo class=\"logo\" (click)=\"navigate('')\"></ui-logo>\n            <div class=\"navigation row\">\n                <a *ngFor=\"let route of routes\" (click)=\"navigate(route.id)\" [ngClass]=\"{'active': activedRoute === route.id}\">\n                    <span>{{ route.title }}</span>\n                </a>\n            </div>\n            <div class=\"actions\">\n                <button mat-button class=\"profile-menu\" [matMenuTriggerFor]=\"menu\">\n                    {{ userName }}\n                    <mat-icon iconPositionEnd>expand_more</mat-icon>\n                </button>\n            </div>\n        </div>\n</mat-toolbar>\n\n<mat-menu #menu=\"matMenu\">\n    <button *ngFor=\"let e of menuItems\" mat-menu-item (click)=\"clickMenuItem(e.id)\">\n      <div class=\"menu-item\">\n        <ui-icon [name]=\"e.icon\" size=\"24\"></ui-icon>\n        {{ e.text }}\n      </div>\n    </button>\n    <button mat-menu-item (click)=\"logout()\">\n        <mat-icon>power_settings_new</mat-icon>\n        Log out\n    </button>\n</mat-menu>\n", styles: [".mat-toolbar{height:80px!important;background-color:#fff!important;padding:0 192px!important}.mat-toolbar .custom-toolbar{width:100%;height:100%;background-color:#fff}.mat-toolbar .custom-toolbar ui-logo.logo{cursor:pointer;width:105px;height:32px;align-self:center;flex:1 0 216px;display:flex}.mat-toolbar .custom-toolbar .navigation{height:100%}.mat-toolbar .custom-toolbar .navigation a{display:flex;align-items:center;height:100%;background:#fff;cursor:pointer}.mat-toolbar .custom-toolbar .navigation a.active{border-top:2px solid #276678}.mat-toolbar .custom-toolbar .navigation a.active span{font-weight:700}.mat-toolbar .custom-toolbar .navigation a span{width:100%;text-align:center;font-weight:400;font-size:14px;line-height:16px}.mat-toolbar .custom-toolbar .navigation a:not(:first-of-type){margin-left:32px}.mat-toolbar .custom-toolbar .actions{width:100%;display:flex;align-items:center;justify-content:flex-end}.mat-toolbar .custom-toolbar .actions .profile-menu{font-weight:600;font-size:14px;height:100%;margin-right:-20px}.mat-toolbar .custom-toolbar .actions .profile-menu mat-icon{font-size:16px;position:relative;top:3px;left:3px}.row{display:flex;flex-direction:row}.menu-item{display:flex;align-items:center}.menu-item ui-icon{margin-right:16px}\n"] }]
-        }], ctorParameters: function () { return []; }, propDecorators: { routes: [{
-                type: Input
-            }], activedRoute: [{
-                type: Input
-            }], userName: [{
-                type: Input
-            }], menuItems: [{
-                type: Input
-            }], navigateEvent: [{
-                type: Output
-            }], menuItemClicked: [{
-                type: Output
-            }], logoutEvent: [{
-                type: Output
-            }] } });
-
-class NavbarComponentModule {
-}
-NavbarComponentModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: NavbarComponentModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-NavbarComponentModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.9", ngImport: i0, type: NavbarComponentModule, declarations: [NavbarComponent], imports: [CommonModule,
-        MatToolbarModule,
-        MatIconModule,
-        MatButtonModule,
-        MatRippleModule,
-        MatMenuModule,
-        LogoComponentModule,
-        IconComponentModule], exports: [NavbarComponent] });
-NavbarComponentModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: NavbarComponentModule, imports: [CommonModule,
-        MatToolbarModule,
-        MatIconModule,
-        MatButtonModule,
-        MatRippleModule,
-        MatMenuModule,
-        LogoComponentModule,
-        IconComponentModule] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: NavbarComponentModule, decorators: [{
-            type: NgModule,
-            args: [{
-                    declarations: [NavbarComponent],
-                    imports: [
-                        CommonModule,
-                        MatToolbarModule,
-                        MatIconModule,
-                        MatButtonModule,
-                        MatRippleModule,
-                        MatMenuModule,
-                        LogoComponentModule,
-                        IconComponentModule,
-                    ],
-                    exports: [NavbarComponent],
-                    providers: [],
-                }]
-        }] });
-
-class NavigationComponent {
-    constructor() {
-        /**
-         * @ignore
-         */
-        this.goBackClickedEvent = new EventEmitter();
-    }
-    goBackClicked() {
-        this.goBackClickedEvent.emit();
-    }
-}
-NavigationComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: NavigationComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-NavigationComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: NavigationComponent, selector: "ui-navigation", inputs: { title: "title", subtitle: "subtitle", labelItem: "labelItem", logoURL: "logoURL" }, outputs: { goBackClickedEvent: "goBackClickedEvent" }, ngImport: i0, template: "<div class=\"navigation\">\n  <button aria-label=\"Go back\" mat-icon-button (click)=\"goBackClicked()\">\n    <mat-icon aria-hidden=\"true\">chevron_left</mat-icon>\n  </button>\n  <div class=\"logo\" *ngIf=\"logoURL\">\n    <img [src]=\"logoURL\" />\n  </div>\n  <div class=\"content\">\n    <div class=\"title\">\n      <span>{{ title }}</span>\n      <div class=\"status\" *ngIf=\"labelItem\">\n        <ui-label\n          [backgroundColor]=\"labelItem.backgroundColor\"\n          [textColor]=\"labelItem.textColor\"\n          [title]=\"labelItem.title\"\n          [size]=\"labelItem.size\"\n        >\n        </ui-label>\n      </div>\n    </div>\n    <div class=\"subtitle\">\n      {{ subtitle }}\n    </div>\n  </div>\n</div>\n", styles: [".navigation{width:100%;display:flex;align-items:center}.navigation button{background:#ededed;border-radius:0%}.navigation mat-icon{color:#000}.navigation .logo{margin-left:20px}.navigation .logo img{width:100px;height:100px}.navigation .content{margin-left:20px;display:flex;flex-direction:column}.navigation .content .title{color:#000;font-weight:700;font-size:20px;display:flex;align-items:center;margin-bottom:8px}.navigation .content .title .status{margin-left:8px}.navigation .content .subtitle{color:#528593;font-weight:700;font-size:14px}::ng-deep .mat-mdc-icon-button .mat-mdc-button-persistent-ripple{border-radius:0%!important}\n"], dependencies: [{ kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i2$1.MatIconButton, selector: "button[mat-icon-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "component", type: LabelComponent, selector: "ui-label", inputs: ["backgroundColor", "textColor", "title", "description", "size"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: NavigationComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'ui-navigation', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"navigation\">\n  <button aria-label=\"Go back\" mat-icon-button (click)=\"goBackClicked()\">\n    <mat-icon aria-hidden=\"true\">chevron_left</mat-icon>\n  </button>\n  <div class=\"logo\" *ngIf=\"logoURL\">\n    <img [src]=\"logoURL\" />\n  </div>\n  <div class=\"content\">\n    <div class=\"title\">\n      <span>{{ title }}</span>\n      <div class=\"status\" *ngIf=\"labelItem\">\n        <ui-label\n          [backgroundColor]=\"labelItem.backgroundColor\"\n          [textColor]=\"labelItem.textColor\"\n          [title]=\"labelItem.title\"\n          [size]=\"labelItem.size\"\n        >\n        </ui-label>\n      </div>\n    </div>\n    <div class=\"subtitle\">\n      {{ subtitle }}\n    </div>\n  </div>\n</div>\n", styles: [".navigation{width:100%;display:flex;align-items:center}.navigation button{background:#ededed;border-radius:0%}.navigation mat-icon{color:#000}.navigation .logo{margin-left:20px}.navigation .logo img{width:100px;height:100px}.navigation .content{margin-left:20px;display:flex;flex-direction:column}.navigation .content .title{color:#000;font-weight:700;font-size:20px;display:flex;align-items:center;margin-bottom:8px}.navigation .content .title .status{margin-left:8px}.navigation .content .subtitle{color:#528593;font-weight:700;font-size:14px}::ng-deep .mat-mdc-icon-button .mat-mdc-button-persistent-ripple{border-radius:0%!important}\n"] }]
-        }], ctorParameters: function () { return []; }, propDecorators: { title: [{
-                type: Input
-            }], subtitle: [{
-                type: Input
-            }], labelItem: [{
-                type: Input
-            }], logoURL: [{
-                type: Input
-            }], goBackClickedEvent: [{
-                type: Output
-            }] } });
-
-class NavigationComponentModule {
-}
-NavigationComponentModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: NavigationComponentModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-NavigationComponentModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.9", ngImport: i0, type: NavigationComponentModule, declarations: [NavigationComponent], imports: [CommonModule, MatIconModule, MatButtonModule, LabelComponentModule], exports: [NavigationComponent] });
-NavigationComponentModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: NavigationComponentModule, imports: [CommonModule, MatIconModule, MatButtonModule, LabelComponentModule] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: NavigationComponentModule, decorators: [{
-            type: NgModule,
-            args: [{
-                    declarations: [NavigationComponent],
-                    imports: [CommonModule, MatIconModule, MatButtonModule, LabelComponentModule],
-                    exports: [NavigationComponent],
-                    providers: [],
-                }]
-        }] });
-
-class PaginatorComponent {
-    /**
-     * @ignore
-     */
-    ngOnInit() { }
-    constructor() {
-        // TODO: Some properties and methods are ignored on purpose because of a current issue with compodoc and angular 13
-        // https://github.com/storybookjs/storybook/issues/16865
-        // https://github.com/storybookjs/storybook/issues/17004
-        /**
-         * Paginator size options
-         *
-         * @type {number[]}
-         * @memberof PaginatorComponent
-         */
-        this.pageSizeOptions = [10, 25, 50];
-        /**
-         * Data length
-         *
-         * @type {number}
-         * @memberof PaginatorComponent
-         */
-        this.length = 0;
-        /**
-         * Default page size
-         *
-         * @type {number}
-         * @memberof PaginatorComponent
-         */
-        this.defaultPageSize = 25;
-        /**
-         * @ignore
-         */
-        this.paginatorChangedEvent = new EventEmitter();
-    }
-    paginatorChanged(paginator) {
-        this.paginatorChangedEvent.emit(paginator);
-    }
-}
-PaginatorComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: PaginatorComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-PaginatorComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: PaginatorComponent, selector: "ui-paginator", inputs: { length: "length", defaultPageSize: "defaultPageSize" }, outputs: { paginatorChangedEvent: "paginatorChangedEvent" }, ngImport: i0, template: "<mat-paginator [length]=\"length\"\n              [pageSize]=\"defaultPageSize\"\n              [pageSizeOptions]=\"pageSizeOptions\"\n              (page)=\"paginatorChanged($event)\">\n</mat-paginator>", styles: [".mat-mdc-paginator{border-radius:0 0 8px 8px}.mat-mdc-paginator .mat-mdc-paginator-outer-container{border-radius:0 0 8px 8px;font-weight:400;font-size:14px;line-height:16px;color:#000}.mat-mdc-paginator .mat-mdc-paginator-outer-container .mat-mdc-paginator-container{padding:0}.mat-mdc-paginator .mat-mdc-paginator-outer-container .mat-mdc-paginator-container .mat-mdc-select-value-text{font-size:14px}.mat-mdc-paginator .mat-mdc-paginator-outer-container .mat-mdc-paginator-container .mat-mdc-paginator-range-actions{height:100%}.mat-mdc-paginator .mat-mdc-paginator-outer-container .mat-mdc-paginator-container .mat-mdc-paginator-range-actions button{height:100%;width:70px;border-radius:0}\n"], dependencies: [{ kind: "component", type: i1$6.MatPaginator, selector: "mat-paginator", inputs: ["disabled"], exportAs: ["matPaginator"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: PaginatorComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'ui-paginator', changeDetection: ChangeDetectionStrategy.OnPush, template: "<mat-paginator [length]=\"length\"\n              [pageSize]=\"defaultPageSize\"\n              [pageSizeOptions]=\"pageSizeOptions\"\n              (page)=\"paginatorChanged($event)\">\n</mat-paginator>", styles: [".mat-mdc-paginator{border-radius:0 0 8px 8px}.mat-mdc-paginator .mat-mdc-paginator-outer-container{border-radius:0 0 8px 8px;font-weight:400;font-size:14px;line-height:16px;color:#000}.mat-mdc-paginator .mat-mdc-paginator-outer-container .mat-mdc-paginator-container{padding:0}.mat-mdc-paginator .mat-mdc-paginator-outer-container .mat-mdc-paginator-container .mat-mdc-select-value-text{font-size:14px}.mat-mdc-paginator .mat-mdc-paginator-outer-container .mat-mdc-paginator-container .mat-mdc-paginator-range-actions{height:100%}.mat-mdc-paginator .mat-mdc-paginator-outer-container .mat-mdc-paginator-container .mat-mdc-paginator-range-actions button{height:100%;width:70px;border-radius:0}\n"] }]
-        }], ctorParameters: function () { return []; }, propDecorators: { length: [{
-                type: Input
-            }], defaultPageSize: [{
-                type: Input
-            }], paginatorChangedEvent: [{
-                type: Output
-            }] } });
-
-class PaginatorComponentModule {
-}
-PaginatorComponentModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: PaginatorComponentModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-PaginatorComponentModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.9", ngImport: i0, type: PaginatorComponentModule, declarations: [PaginatorComponent], imports: [CommonModule, MatPaginatorModule], exports: [PaginatorComponent] });
-PaginatorComponentModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: PaginatorComponentModule, imports: [CommonModule, MatPaginatorModule] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: PaginatorComponentModule, decorators: [{
-            type: NgModule,
-            args: [{
-                    declarations: [PaginatorComponent],
-                    imports: [CommonModule, MatPaginatorModule],
-                    exports: [PaginatorComponent],
-                    providers: [],
-                }]
-        }] });
-
-/* eslint-disable no-underscore-dangle */
-class RadioButtonComponent {
-    constructor() {
-        /**
-         * Determines whether the radio button is disabled.
-         * Default: false.
-         *
-         * @type {boolean}
-         * @memberof RadioButtonComponent
-         */
-        this.disabled = false;
-        /**
-         * Determines whether the radio button is checked.
-         * Default: false.
-         *
-         * @type {boolean}
-         * @memberof RadioButtonComponent
-         */
-        //@Input() selected = false;
-        this._selected = false;
-        /**
-         * Determines whether the radio button can be unchecked.
-         * Default: false.
-         *
-         * @type {boolean}
-         * @memberof RadioButtonComponent
-         */
-        this.allowUnselect = false;
-        /**
-         * Determines the radio button color.
-         * Default: Test Gorilla primary color.
-         *
-         * @type {string}
-         * @memberof RadioButtonComponent
-         */
-        this.color = '#46A997';
-        /**
-         * Used to group radios for unique selection.
-         *
-         * @type {string}
-         * @memberof RadioButtonComponent
-         */
-        this.name = '';
-        /**
-         * Text content will be applied to the input element if present.
-         *
-         * @type {string}
-         * @memberof RadioButtonComponent
-         */
-        this.label = '';
-        /**
-         * Determines whether the radio button is a multiple choice cell.
-         * Default: false
-         *
-         * @type {boolean}
-         * @memberof RadioButtonComponent
-         */
-        this.multiple = false;
-        /**
-         * Event emitted when the checked state of the radio button changes.
-         *
-         * @type {boolean}
-         * @memberof RadioButtonComponent
-         */
-        this.changeRadio = new EventEmitter();
-    }
-    get selected() {
-        return this._selected;
-    }
-    set selected(selected) {
-        this._selected = selected;
-    }
-    ngOnInit() {
-        this.classMultiple = this.setClass();
-    }
-    ngOnChanges(changes) {
-        if (changes['selected']) {
-            this.classMultiple = this.setClass();
-        }
-    }
-    //Click method
-    clickRadio(element, event) {
-        //event.preventDefault();
-        if (this.allowUnselect) {
-            element.checked = !element.checked;
-            this._selected = element.checked;
-            this.classMultiple = this.setClass();
-            this.changeRadio.emit({ optionName: element.value, optionChecked: element.checked });
-        }
-        else {
-            this._selected = true;
-            this.changeRadio.emit({ optionName: element.value, optionChecked: true });
-        }
-        if (this.disabled) {
-            this._selected = false;
-            this.changeRadio.emit({ optionName: '', optionChecked: false });
-        }
-    }
-    //Set class for multiple radio
-    setClass() {
-        if (this.multiple) {
-            return this._selected ? 'multiple-checked' : 'multiple-unchecked';
-        }
-        return '';
-    }
-}
-RadioButtonComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: RadioButtonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-RadioButtonComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: RadioButtonComponent, selector: "ui-radio-button", inputs: { disabled: "disabled", selected: "selected", allowUnselect: "allowUnselect", color: "color", name: "name", label: "label", multiple: "multiple", value: "value" }, outputs: { changeRadio: "changeRadio" }, host: { properties: { "style.--color": "this.color" } }, usesOnChanges: true, ngImport: i0, template: "<div [ngClass]=\"classMultiple\">\n  <mat-radio-button\n    #radio\n    [checked]=\"selected\"\n    [disabled]=\"disabled\"\n    [name]=\"name\"\n    [aria-label]=\"label\"\n    [value]=\"value\"\n    class=\"radio-button\"\n    (click)=\"clickRadio(radio, $event)\"\n  >\n    {{ label }}\n  </mat-radio-button>\n</div>", styles: ["::ng-deep .mat-mdc-radio-checked .mdc-radio__outer-circle{border-color:var(--color)!important}::ng-deep .mat-mdc-radio-checked .mdc-radio__inner-circle{background-color:var(--color)!important;border-color:var(--color)!important}::ng-deep .mat-mdc-radio-button .mat-ripple-element{background-color:var(--color)!important}::ng-deep .mat-mdc-radio-button.mat-radio-disabled.mat-radio-checked .mdc-radio__outer-circle,.mat-radio-button.mat-radio-disabled .mdc-radio__outer-circle{border-color:#888!important}::ng-deep .mat-mdc-radio-button.mat-radio-disabled .mdc-radio__inner-circle{background-color:#888!important}.multiple-checked{border:1px solid #46A997;display:flex;flex-direction:row;align-items:center;gap:16px;background:#46A997;border-radius:8px}.multiple-checked ::ng-deep .mat-mdc-radio-button{width:100%;height:100%}.multiple-checked ::ng-deep .mat-mdc-radio-checked .mdc-radio__outer-circle{border:1px solid #ffffff;border-radius:64px;background:#ffffff}.multiple-checked ::ng-deep label{color:#fff;padding:16px 0;height:100%;width:100%}.multiple-unchecked{border:1px solid #E0E0E0;display:flex;flex-direction:row;align-items:center;gap:16px;background:#ffffff;border-radius:8px}.multiple-unchecked ::ng-deep .mat-mdc-radio-button{width:100%;height:100%}.multiple-unchecked:hover{background:#F6F6F6;border:1px solid #E0E0E0}.multiple-unchecked ::ng-deep label{padding:16px 0;height:100%;width:100%}.multiple-unchecked ::ng-deep .mat-mdc-radio-button .mdc-radio .mdc-radio__background:before{opacity:0!important}\n"], dependencies: [{ kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: i2$5.MatRadioButton, selector: "mat-radio-button", inputs: ["disableRipple", "tabIndex"], exportAs: ["matRadioButton"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: RadioButtonComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'ui-radio-button', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div [ngClass]=\"classMultiple\">\n  <mat-radio-button\n    #radio\n    [checked]=\"selected\"\n    [disabled]=\"disabled\"\n    [name]=\"name\"\n    [aria-label]=\"label\"\n    [value]=\"value\"\n    class=\"radio-button\"\n    (click)=\"clickRadio(radio, $event)\"\n  >\n    {{ label }}\n  </mat-radio-button>\n</div>", styles: ["::ng-deep .mat-mdc-radio-checked .mdc-radio__outer-circle{border-color:var(--color)!important}::ng-deep .mat-mdc-radio-checked .mdc-radio__inner-circle{background-color:var(--color)!important;border-color:var(--color)!important}::ng-deep .mat-mdc-radio-button .mat-ripple-element{background-color:var(--color)!important}::ng-deep .mat-mdc-radio-button.mat-radio-disabled.mat-radio-checked .mdc-radio__outer-circle,.mat-radio-button.mat-radio-disabled .mdc-radio__outer-circle{border-color:#888!important}::ng-deep .mat-mdc-radio-button.mat-radio-disabled .mdc-radio__inner-circle{background-color:#888!important}.multiple-checked{border:1px solid #46A997;display:flex;flex-direction:row;align-items:center;gap:16px;background:#46A997;border-radius:8px}.multiple-checked ::ng-deep .mat-mdc-radio-button{width:100%;height:100%}.multiple-checked ::ng-deep .mat-mdc-radio-checked .mdc-radio__outer-circle{border:1px solid #ffffff;border-radius:64px;background:#ffffff}.multiple-checked ::ng-deep label{color:#fff;padding:16px 0;height:100%;width:100%}.multiple-unchecked{border:1px solid #E0E0E0;display:flex;flex-direction:row;align-items:center;gap:16px;background:#ffffff;border-radius:8px}.multiple-unchecked ::ng-deep .mat-mdc-radio-button{width:100%;height:100%}.multiple-unchecked:hover{background:#F6F6F6;border:1px solid #E0E0E0}.multiple-unchecked ::ng-deep label{padding:16px 0;height:100%;width:100%}.multiple-unchecked ::ng-deep .mat-mdc-radio-button .mdc-radio .mdc-radio__background:before{opacity:0!important}\n"] }]
-        }], propDecorators: { disabled: [{
-                type: Input
-            }], selected: [{
-                type: Input
-            }], allowUnselect: [{
-                type: Input
-            }], color: [{
-                type: HostBinding,
-                args: ['style.--color']
-            }, {
-                type: Input
-            }], name: [{
-                type: Input
-            }], label: [{
-                type: Input
-            }], multiple: [{
-                type: Input
-            }], value: [{
-                type: Input
-            }], changeRadio: [{
-                type: Output
-            }] } });
-
-class RadioButtonComponentModule {
-}
-RadioButtonComponentModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: RadioButtonComponentModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-RadioButtonComponentModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.9", ngImport: i0, type: RadioButtonComponentModule, declarations: [RadioButtonComponent], imports: [CommonModule, MatRadioModule, FormsModule, ReactiveFormsModule], exports: [RadioButtonComponent] });
-RadioButtonComponentModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: RadioButtonComponentModule, imports: [CommonModule, MatRadioModule, FormsModule, ReactiveFormsModule] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: RadioButtonComponentModule, decorators: [{
-            type: NgModule,
-            args: [{
-                    declarations: [RadioButtonComponent],
-                    imports: [CommonModule, MatRadioModule, FormsModule, ReactiveFormsModule],
-                    exports: [RadioButtonComponent],
-                }]
-        }] });
-
-//Languages available in the app as enum
-var Language;
-(function (Language) {
-    Language["en"] = "en";
-    Language["es"] = "es";
-    Language["nl"] = "nl";
-    Language["fr"] = "fr";
-    Language["de"] = "de";
-    Language["it-it"] = "it-it";
-    Language["ja-jp"] = "ja-jp";
-    Language["pt-br"] = "pt-br";
-    Language["da-dk"] = "da-dk";
-    Language["nb-no"] = "nb-no";
-    Language["pl-pl"] = "pl-pl";
-    Language["sv-se"] = "sv-se";
-})(Language || (Language = {}));
-//This function retrieves all languages from the enum. It is used to initialize transloco
-const getAvailableLangs = () => Object.values(Language);
-let LanguageService = class LanguageService {
-    constructor(translocoService) {
-        this.translocoService = translocoService;
-        this.defaultLanguageList = [
-            { code: Language.en, label: 'English' },
-            { code: Language.es, label: 'Spanish' },
-            { code: Language.de, label: 'German' },
-            { code: Language.fr, label: 'French' },
-            { code: Language.nl, label: 'Dutch' },
-            { code: Language['it-it'], label: 'Italian' },
-            { code: Language['ja-jp'], label: 'Japanese' },
-            { code: Language['pt-br'], label: 'Portuguese' },
-            { code: Language['da-dk'], label: 'Danish' },
-            { code: Language['nb-no'], label: 'Norwegian' },
-            { code: Language['pl-pl'], label: 'Polish' },
-            { code: Language['sv-se'], label: 'Swedish' },
-        ];
-    }
-    /**
-     *
-     * @description Initialize Language Service.
-     * @memberof LanguageService
-     */
-    init(language) {
-        // Set active language according to user settings. TODO: Replace with user value.
-        this.setActiveLanguage(language);
-        // React to language changes and load the language selected.
-        this.languageChangeSubscription = this.translocoService.langChanges$.subscribe(lang => {
-            this.translocoService.load(lang).subscribe();
-        });
-    }
-    /**
-     *
-     * @description Set a langauge as active language.
-     * @param {string} languageCode Language value code.
-     * @memberof LanguageService
-     */
-    setActiveLanguage(languageCode) {
-        this.translocoService.setActiveLang(languageCode);
-    }
-};
-LanguageService.defaultLanguage = Language.en;
-LanguageService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: LanguageService, deps: [{ token: i1$7.TranslocoService }], target: i0.ɵɵFactoryTarget.Injectable });
-LanguageService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: LanguageService, providedIn: 'root' });
-LanguageService = __decorate([
-    UntilDestroy({ checkProperties: true })
-], LanguageService);
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: LanguageService, decorators: [{
-            type: Injectable,
-            args: [{
-                    providedIn: 'root',
-                }]
-        }], ctorParameters: function () { return [{ type: i1$7.TranslocoService }]; } });
-
-class SnackbarComponent {
-    constructor(data, snackbarRef, languageService) {
-        var _a, _b;
-        this.data = data;
-        this.snackbarRef = snackbarRef;
-        this.languageService = languageService;
-        /**
-         * Background color of the button while in active state
-         *
-         * @type {SnackbarType}
-         * @memberof SnackbarComponent
-         */
-        this.snackbarType = 'success';
-        /**
-         * Snackbar message
-         *
-         * @memberof SnackbarComponent
-         */
-        this.message = '';
-        /**
-         * Set the time that the snackbar will be visible
-         *
-         * @memberof SnackbarComponent
-         */
-        this.seconds = 5;
-        /**
-         * Include dismmiss button
-         *
-         * @memberof SnackbarComponent
-         */
-        this.includeDismissButton = true;
-        /**
-         * Static or fixed position
-         *
-         * @memberof SnackbarComponent
-         */
-        this.fixed = true;
-        /**
-         * The language to be used
-         *
-         * @type {string}
-         * @memberof SnackbarComponent
-         */
-        this.language = LanguageService.defaultLanguage;
-        this.showSnackbar = true;
-        this.visible = false;
-        this.timerStartedAt = 0;
-        this.timerPausedAt = 0;
-        this.translationContext = 'SNACKBAR.';
-        this.snackbarType = (_a = data.snackbarType) !== null && _a !== void 0 ? _a : 'success';
-        this.message = (_b = data.message) !== null && _b !== void 0 ? _b : '';
-    }
-    ngOnInit() {
-        this.milisenconds = this.seconds * 1000;
-        this.iconName = alertBarsUtil.setIcon(this.snackbarType);
-        this.show();
-        this.position = alertBarsUtil.setPosition(this.fixed);
-        this.languageService.init(this.language);
-    }
-    //Show snackbar
-    show() {
-        this.timerStartedAt = Date.now();
-        this.visible = true;
-        this.timer = setTimeout(() => this.hide(), this.milisenconds);
-    }
-    //Hide snackbar
-    hide() {
-        this.visible = false;
-        this.timerPausedAt = 0;
-        this.timerStartedAt = 0;
-        clearTimeout(this.timer);
-        this.timer = undefined;
-    }
-    //Pause timer when mouse enter
-    onMouseEnter() {
-        this.visible = true;
-        this.timerPausedAt = Date.now();
-        clearTimeout(this.timer);
-    }
-    //Continue timer when mouse leave
-    onMouseLeave() {
-        const diff = this.timerPausedAt - this.timerStartedAt;
-        if (diff <= 0) {
-            return this.hide();
-        }
-        this.timer = setTimeout(() => this.hide(), this.milisenconds - diff);
-    }
-    //Hide snackbar when dismiss button is clicked
-    dismissClick() {
-        this.visible = false;
-        this.snackbarRef.dismiss();
-    }
-}
-SnackbarComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SnackbarComponent, deps: [{ token: MAT_SNACK_BAR_DATA }, { token: i1$8.MatSnackBarRef }, { token: LanguageService }], target: i0.ɵɵFactoryTarget.Component });
-SnackbarComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: SnackbarComponent, selector: "ui-snackbar", inputs: { snackbarType: "snackbarType", message: "message", seconds: "seconds", includeDismissButton: "includeDismissButton", fixed: "fixed", language: "language" }, ngImport: i0, template: "<ng-container *transloco=\"let t\">\n  <div\n    [ngClass]=\"snackbarType + ' ' + position\"\n    [@openClose]\n    *ngIf=\"visible\"\n    class=\"snackbar-container\"\n    (mouseenter)=\"onMouseEnter()\"\n    (mouseleave)=\"onMouseLeave()\"\n  >\n    <div class=\"snackbar-text\">\n      <ui-icon [name]=\"iconName\" size=\"24\"></ui-icon>\n      {{ message }}\n    </div>\n    <ui-button\n      *ngIf=\"includeDismissButton\"\n      type=\"text\"\n      [label]=\"t(translationContext + 'DISMISS')\"\n      (buttonClickEvent)=\"dismissClick()\"\n    ></ui-button>\n  </div>\n</ng-container>\n", styles: [":host{display:flex;width:100%;justify-content:center}:host .snackbar-container{max-width:600px}:host .alert-container,:host .snackbar-container{margin:0 auto;display:flex;padding:0 14px;border-radius:4px;align-items:center;justify-content:space-between;opacity:1;min-height:48px}:host .alert-container.fixed,:host .snackbar-container.fixed{position:fixed}:host .alert-container.static,:host .snackbar-container.static{position:relative}:host .alert-container ui-icon,:host .snackbar-container ui-icon{margin-right:14px}:host .alert-container ui-button,:host .snackbar-container ui-button{margin-left:14px}:host .alert-container ::ng-deep button.mat-mdc-unelevated-button.big,:host .snackbar-container ::ng-deep button.mat-mdc-unelevated-button.big{padding:0;min-width:auto}:host .alert-container .alert-text,:host .alert-container .snackbar-text,:host .snackbar-container .alert-text,:host .snackbar-container .snackbar-text{display:flex;align-items:center;color:#000}:host .alert-container .alert-text a,:host .alert-container .snackbar-text a,:host .snackbar-container .alert-text a,:host .snackbar-container .snackbar-text a{color:#000;text-decoration:underline;font-weight:700}:host .alert-container .alert-text a:hover,:host .alert-container .alert-text a:visited,:host .alert-container .alert-text a:focus,:host .alert-container .snackbar-text a:hover,:host .alert-container .snackbar-text a:visited,:host .alert-container .snackbar-text a:focus,:host .snackbar-container .alert-text a:hover,:host .snackbar-container .alert-text a:visited,:host .snackbar-container .alert-text a:focus,:host .snackbar-container .snackbar-text a:hover,:host .snackbar-container .snackbar-text a:visited,:host .snackbar-container .snackbar-text a:focus{text-decoration:none}:host .alert-container.success,:host .snackbar-container.success{background-color:#cbd6cb}:host .alert-container.info,:host .snackbar-container.info{background-color:#c8d7de}:host .alert-container.warning,:host .snackbar-container.warning{background-color:#f0d6bb}:host .alert-container.error,:host .snackbar-container.error{background-color:#e3c3c6}@media (max-width: 600px){:host .alert-container,:host .snackbar-container{padding:8px 14px}}:host .snackbar-container{bottom:0;z-index:98}:host .mat-mdc-snack-bar-container{margin:16px 8px}\n"], dependencies: [{ kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: ButtonComponent, selector: "ui-button", inputs: ["size", "type", "label", "iconPosition", "justIcon", "iconName", "disabled", "loading", "fullWidth", "url", "urlTarget", "value"], outputs: ["buttonClickEvent", "buttonHoverEvent"] }, { kind: "component", type: IconComponent, selector: "ui-icon", inputs: ["size", "cssClass", "name", "color"] }, { kind: "directive", type: i1$7.TranslocoDirective, selector: "[transloco]", inputs: ["transloco", "translocoParams", "translocoScope", "translocoRead", "translocoLang", "translocoLoadingTpl"] }], animations: [
-        trigger('openClose', [
-            transition(':enter', [
-                style({ bottom: '-55px', opacity: 0 }),
-                animate('0.2s ease-out', style({ opacity: 1, bottom: '10px' })),
-            ]),
-            transition(':leave', [
-                style({ bottom: '10px', opacity: 1 }),
-                animate('0.2s ease-in', style({ bottom: '-55px', opacity: 0 })),
-            ]),
-        ]),
-    ] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SnackbarComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'ui-snackbar', animations: [
-                        trigger('openClose', [
-                            transition(':enter', [
-                                style({ bottom: '-55px', opacity: 0 }),
-                                animate('0.2s ease-out', style({ opacity: 1, bottom: '10px' })),
-                            ]),
-                            transition(':leave', [
-                                style({ bottom: '10px', opacity: 1 }),
-                                animate('0.2s ease-in', style({ bottom: '-55px', opacity: 0 })),
-                            ]),
-                        ]),
-                    ], template: "<ng-container *transloco=\"let t\">\n  <div\n    [ngClass]=\"snackbarType + ' ' + position\"\n    [@openClose]\n    *ngIf=\"visible\"\n    class=\"snackbar-container\"\n    (mouseenter)=\"onMouseEnter()\"\n    (mouseleave)=\"onMouseLeave()\"\n  >\n    <div class=\"snackbar-text\">\n      <ui-icon [name]=\"iconName\" size=\"24\"></ui-icon>\n      {{ message }}\n    </div>\n    <ui-button\n      *ngIf=\"includeDismissButton\"\n      type=\"text\"\n      [label]=\"t(translationContext + 'DISMISS')\"\n      (buttonClickEvent)=\"dismissClick()\"\n    ></ui-button>\n  </div>\n</ng-container>\n", styles: [":host{display:flex;width:100%;justify-content:center}:host .snackbar-container{max-width:600px}:host .alert-container,:host .snackbar-container{margin:0 auto;display:flex;padding:0 14px;border-radius:4px;align-items:center;justify-content:space-between;opacity:1;min-height:48px}:host .alert-container.fixed,:host .snackbar-container.fixed{position:fixed}:host .alert-container.static,:host .snackbar-container.static{position:relative}:host .alert-container ui-icon,:host .snackbar-container ui-icon{margin-right:14px}:host .alert-container ui-button,:host .snackbar-container ui-button{margin-left:14px}:host .alert-container ::ng-deep button.mat-mdc-unelevated-button.big,:host .snackbar-container ::ng-deep button.mat-mdc-unelevated-button.big{padding:0;min-width:auto}:host .alert-container .alert-text,:host .alert-container .snackbar-text,:host .snackbar-container .alert-text,:host .snackbar-container .snackbar-text{display:flex;align-items:center;color:#000}:host .alert-container .alert-text a,:host .alert-container .snackbar-text a,:host .snackbar-container .alert-text a,:host .snackbar-container .snackbar-text a{color:#000;text-decoration:underline;font-weight:700}:host .alert-container .alert-text a:hover,:host .alert-container .alert-text a:visited,:host .alert-container .alert-text a:focus,:host .alert-container .snackbar-text a:hover,:host .alert-container .snackbar-text a:visited,:host .alert-container .snackbar-text a:focus,:host .snackbar-container .alert-text a:hover,:host .snackbar-container .alert-text a:visited,:host .snackbar-container .alert-text a:focus,:host .snackbar-container .snackbar-text a:hover,:host .snackbar-container .snackbar-text a:visited,:host .snackbar-container .snackbar-text a:focus{text-decoration:none}:host .alert-container.success,:host .snackbar-container.success{background-color:#cbd6cb}:host .alert-container.info,:host .snackbar-container.info{background-color:#c8d7de}:host .alert-container.warning,:host .snackbar-container.warning{background-color:#f0d6bb}:host .alert-container.error,:host .snackbar-container.error{background-color:#e3c3c6}@media (max-width: 600px){:host .alert-container,:host .snackbar-container{padding:8px 14px}}:host .snackbar-container{bottom:0;z-index:98}:host .mat-mdc-snack-bar-container{margin:16px 8px}\n"] }]
-        }], ctorParameters: function () {
-        return [{ type: undefined, decorators: [{
-                        type: Inject,
-                        args: [MAT_SNACK_BAR_DATA]
-                    }] }, { type: i1$8.MatSnackBarRef }, { type: LanguageService }];
-    }, propDecorators: { snackbarType: [{
-                type: Input
-            }], message: [{
-                type: Input
-            }], seconds: [{
-                type: Input
-            }], includeDismissButton: [{
-                type: Input
-            }], fixed: [{
-                type: Input
-            }], language: [{
-                type: Input
-            }] } });
-
-class SnackbarService {
-    constructor(snackBar) {
-        this.snackBar = snackBar;
-    }
-    error(message) {
-        return this.snackBar.openFromComponent(SnackbarComponent, {
-            data: {
-                snackbarType: 'error',
-                message,
-            },
-        });
-    }
-    success(message) {
-        return this.snackBar.openFromComponent(SnackbarComponent, {
-            data: {
-                snackbarType: 'success',
-                message,
-            },
-        });
-    }
-}
-SnackbarService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SnackbarService, deps: [{ token: i1$8.MatSnackBar }], target: i0.ɵɵFactoryTarget.Injectable });
-SnackbarService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SnackbarService });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SnackbarService, decorators: [{
-            type: Injectable
-        }], ctorParameters: function () { return [{ type: i1$8.MatSnackBar }]; } });
-
-const preloadLang = (transloco) => () => {
-    transloco.setActiveLang('en');
-    return lastValueFrom(transloco.load('en'));
-};
-class SnackbarComponentModule {
-}
-SnackbarComponentModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SnackbarComponentModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-SnackbarComponentModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.9", ngImport: i0, type: SnackbarComponentModule, declarations: [SnackbarComponent], imports: [CommonModule, ButtonComponentModule, IconComponentModule, TranslocoModule], exports: [SnackbarComponent] });
-SnackbarComponentModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SnackbarComponentModule, providers: [
-        SnackbarService,
-        {
-            provide: APP_INITIALIZER,
-            useFactory: preloadLang,
-            deps: [TranslocoService],
-            multi: true,
-        },
-    ], imports: [CommonModule, ButtonComponentModule, IconComponentModule, TranslocoModule] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SnackbarComponentModule, decorators: [{
-            type: NgModule,
-            args: [{
-                    declarations: [SnackbarComponent],
-                    imports: [CommonModule, ButtonComponentModule, IconComponentModule, TranslocoModule],
-                    exports: [SnackbarComponent],
-                    providers: [
-                        SnackbarService,
-                        {
-                            provide: APP_INITIALIZER,
-                            useFactory: preloadLang,
-                            deps: [TranslocoService],
-                            multi: true,
-                        },
-                    ],
-                }]
-        }] });
-
-class DataPropertyGetterPipe {
-    transform(obj, keyName = '') {
-        return this.getDeepVal(obj, keyName);
-    }
-    getDeepVal(obj, path) {
-        if (typeof obj === 'undefined' || obj === null) {
-            return '';
-        }
-        const splittedPath = path.split(/[\.\[\]\"\']{1,2}/);
-        for (let i = 0, l = splittedPath.length; i < l; i++) {
-            if (splittedPath[i] === '') {
-                continue;
-            }
-            obj = obj[splittedPath[i]];
-            if (typeof obj === 'undefined' || obj === null) {
-                return '';
-            }
-        }
-        return obj;
-    }
-}
-DataPropertyGetterPipe.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: DataPropertyGetterPipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe });
-DataPropertyGetterPipe.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "15.2.9", ngImport: i0, type: DataPropertyGetterPipe, name: "dataPropertyGetter" });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: DataPropertyGetterPipe, decorators: [{
-            type: Pipe,
-            args: [{
-                    name: 'dataPropertyGetter',
-                }]
-        }] });
-
-var ColumnTypeEnum;
-(function (ColumnTypeEnum) {
-    ColumnTypeEnum["FIELD"] = "field";
-    ColumnTypeEnum["FUNCTION"] = "function";
-    ColumnTypeEnum["RENDERER"] = "renderer";
-})(ColumnTypeEnum || (ColumnTypeEnum = {}));
-var ColumnAlignmentEnum;
-(function (ColumnAlignmentEnum) {
-    ColumnAlignmentEnum["LEFT"] = "left";
-    ColumnAlignmentEnum["RIGHT"] = "right";
-    ColumnAlignmentEnum["CENTER"] = "center";
-})(ColumnAlignmentEnum || (ColumnAlignmentEnum = {}));
-
-class DynamicComponentDirective {
-    set dynamicComponent(componentRenderer) {
-        if (componentRenderer.component) {
-            this.compRef = this.vcr.createComponent(componentRenderer.component);
-            if (componentRenderer.inputs) {
-                Object.keys(componentRenderer.inputs).map(inputName => (this.compRef.instance[inputName] = componentRenderer.inputs[inputName]));
-            }
-            if (componentRenderer.outputs) {
-                Object.keys(componentRenderer.outputs).map(output => {
-                    var _a;
-                    this.subscription.add(this.compRef.instance[output].subscribe((_a = componentRenderer.outputs) === null || _a === void 0 ? void 0 : _a[output]));
-                });
-            }
-        }
-    }
-    constructor(vcr) {
-        this.vcr = vcr;
-        this.subscription = new Subscription();
-    }
-    ngOnDestroy() {
-        if (this.compRef) {
-            this.compRef.destroy();
-        }
-        this.subscription.unsubscribe();
-    }
-}
-DynamicComponentDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: DynamicComponentDirective, deps: [{ token: i0.ViewContainerRef }], target: i0.ɵɵFactoryTarget.Directive });
-DynamicComponentDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.2.9", type: DynamicComponentDirective, selector: "[dynamicComponent]", inputs: { dynamicComponent: "dynamicComponent" }, ngImport: i0 });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: DynamicComponentDirective, decorators: [{
-            type: Directive,
-            args: [{
-                    selector: '[dynamicComponent]',
-                }]
-        }], ctorParameters: function () { return [{ type: i0.ViewContainerRef }]; }, propDecorators: { dynamicComponent: [{
-                type: Input
-            }] } });
-
-class TableComponent {
-    /**
-     * @ignore
-     */
-    set matSort(matSort) {
-        this.dataSource.sort = matSort;
-        this.dataSource.sortingDataAccessor = (item, property) => this.dataPropertyGetterPipe.transform(item, property);
-    }
-    /**
-     * Data to be rendered
-     *
-     * @ignore
-     * @type {IDataSource}
-     * @memberof TableComponent
-     */
-    set tableData(data) {
-        if (data === null || data === void 0 ? void 0 : data.length) {
-            this.setTableDataSource(data);
-        }
-    }
-    ngOnInit() {
-        this.columnsToDisplay = this.tableColumns.map((tableColumn) => tableColumn.headerName);
-        if (this.tableDetailColumns) {
-            this.columnsDetailToDisplay = this.tableDetailColumns.columnDefs.map((tableColumn) => tableColumn.headerName);
-        }
-    }
-    constructor(dataPropertyGetterPipe) {
-        this.dataPropertyGetterPipe = dataPropertyGetterPipe;
-        /**
-         * @ignore
-         */
-        this.tableDetails = false;
-        /**
-         * Data structure to select which columns should be rendered and their capabilities
-         *
-         * @type {ITableColumn}
-         * @memberof TableComponent
-         */
-        this.tableColumns = [];
-        /**
-         * @ignore
-         */
-        this.onSortEvent = new EventEmitter();
-        /**
-         * @ignore
-         */
-        this.onRowClickEvent = new EventEmitter();
-        /**
-         * @ignore
-         */
-        this.onDetailRowClickEvent = new EventEmitter();
-        /**
-         * @ignore
-         */
-        this.dataSource = new MatTableDataSource([]);
-        /**
-         * @ignore
-         */
-        this.dataSourceDetail = new MatTableDataSource([]);
-        /**
-         * @ignore
-         */
-        this.columnsToDisplay = [];
-        /**
-         * @ignore
-         */
-        this.columnsDetailToDisplay = [];
-        /**
-         * @ignore
-         */
-        this.DataType = ColumnTypeEnum;
-    }
-    onSort(sortParams) {
-        const columnSort = this.tableColumns.find((column) => column.headerName === sortParams.active);
-        if (columnSort === null || columnSort === void 0 ? void 0 : columnSort.field) {
-            sortParams.active = columnSort === null || columnSort === void 0 ? void 0 : columnSort.field;
-        }
-        this.onSortEvent.emit(sortParams);
-    }
-    onRowClick(rowParams) {
-        this.onRowClickEvent.emit(rowParams);
-    }
-    onDetailRowClick(rowParams) {
-        this.onDetailRowClickEvent.emit(rowParams);
-    }
-    toggleRow(element) {
-        this.elementDetail = this.elementDetail === element ? null : element;
-        if (this.elementDetail) {
-            this.tableDetailColumns.setDetailRowData({
-                data: element,
-                setDetailDataSource: this.setTableDetailDataSource.bind(this),
-            });
-        }
-    }
-    /**
-     * @ignore
-     */
-    setTableDataSource(data) {
-        this.dataSource = new MatTableDataSource(data);
-    }
-    /**
-     * @ignore
-     */
-    setTableDetailDataSource(rowData) {
-        this.dataSourceDetail = new MatTableDataSource(rowData);
-    }
-}
-TableComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: TableComponent, deps: [{ token: DataPropertyGetterPipe }], target: i0.ɵɵFactoryTarget.Component });
-TableComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: TableComponent, selector: "ui-table", inputs: { tableDetails: "tableDetails", tableData: "tableData", tableColumns: "tableColumns", tableDetailColumns: "tableDetailColumns" }, outputs: { onSortEvent: "onSortEvent", onRowClickEvent: "onRowClickEvent", onDetailRowClickEvent: "onDetailRowClickEvent" }, viewQueries: [{ propertyName: "matSort", first: true, predicate: MatSort, descendants: true }], ngImport: i0, template: "<table *ngIf=\"!tableDetails\" mat-table [dataSource]=\"dataSource\" matSort (matSortChange)=\"onSort($event)\">\n  <ng-container *ngFor=\"let tableColumn of tableColumns; let i = index\" [matColumnDef]=\"tableColumn.headerName\">\n    <ng-container *ngIf=\"tableColumn.sortable; else notSortable\">\n      <th mat-header-cell *matHeaderCellDef=\"let element\" [mat-sort-header]=\"tableColumn.field || ''\"\n        arrowPosition=\"after\" [ngStyle]=\"{width: tableColumn.styles?.width, minWidth: tableColumn.styles?.['min-width']}\"\n        [ngClass]=\"tableColumn.styles?.alignment ? 'th-'+tableColumn.styles?.alignment : ''\">\n          <ng-container *ngTemplateOutlet=\"tableHeader; context: {tableColumn}\"></ng-container>\n      </th>\n    </ng-container>\n    <ng-template #notSortable>\n      <th mat-header-cell *matHeaderCellDef [ngStyle]=\"{width: tableColumn.styles?.width, minWidth: tableColumn.styles?.['min-width']}\"\n        [ngClass]=\"tableColumn.styles?.alignment ? 'th-'+tableColumn.styles?.alignment : ''\">\n        <ng-container *ngTemplateOutlet=\"tableHeader; context: {tableColumn}\"></ng-container>\n      </th>\n    </ng-template>\n    <td mat-cell *matCellDef=\"let element\" (click)=\"onRowClick(element)\"\n      [align]=\"tableColumn.styles?.alignment\"\n      [ngClass]=\"[tableColumn.styles?.alignment ? 'td-'+tableColumn.styles?.alignment : '', onRowClickEvent.observed && i === tableColumns.length - 1 ? 'row-detail': '']\">\n      <ng-container *ngTemplateOutlet=\"tableDataTpl; context: {element, tableColumn}\"></ng-container>\n      <mat-icon *ngIf=\"onRowClickEvent.observed && i === tableColumns.length - 1\" class=\"row-detail-icon\">navigate_next</mat-icon>\n    </td>\n  </ng-container>\n  <tr mat-header-row *matHeaderRowDef=\"columnsToDisplay\"></tr>\n  <tr mat-row *matRowDef=\"let row; columns: columnsToDisplay;\" [ngClass]=\"{'row-clickable': onRowClickEvent.observed}\"></tr>\n</table>\n\n<table *ngIf=\"tableDetails\" mat-table [dataSource]=\"dataSource\" matSort (matSortChange)=\"onSort($event)\"\n  multiTemplateDataRows>\n  <ng-container *ngFor=\"let tableColumn of tableColumns; let i = index\" [matColumnDef]=\"tableColumn.headerName\">\n    <ng-container *ngIf=\"tableColumn.sortable; else notSortable\">\n      <th mat-header-cell *matHeaderCellDef=\"let element\" [mat-sort-header]=\"tableColumn.field || ''\"\n        arrowPosition=\"after\" [ngStyle]=\"{width: tableColumn.styles?.width, minWidth: tableColumn.styles?.['min-width']}\"\n        [ngClass]=\"tableColumn.styles?.alignment ? 'th-'+tableColumn.styles?.alignment : ''\">\n        <ng-container *ngTemplateOutlet=\"tableHeader; context: {tableColumn}\"></ng-container>\n      </th>\n    </ng-container>\n    <ng-template #notSortable>\n      <th mat-header-cell *matHeaderCellDef [ngStyle]=\"{width: tableColumn.styles?.width, minWidth: tableColumn.styles?.['min-width']}\"\n        [ngClass]=\"tableColumn.styles?.alignment ? 'th-'+tableColumn.styles?.alignment : ''\">\n        <ng-container *ngTemplateOutlet=\"tableHeader; context: {tableColumn}\"></ng-container>\n      </th>\n    </ng-template>\n    <td mat-cell *matCellDef=\"let element\" (click)=\"onRowClick(element)\"\n      [align]=\"tableColumn.styles?.alignment\"\n      [ngClass]=\"[tableColumn.styles?.alignment ? 'td-'+tableColumn.styles?.alignment : '', i === 0 ? 'row-expand' : '']\">\n      <mat-icon *ngIf=\"i === 0\" class=\"row-expand-icon\">{{ element === elementDetail ? 'expand_less' : 'expand_more' }}</mat-icon>\n      <ng-container *ngTemplateOutlet=\"tableDataTpl; context: {element, tableColumn}\"></ng-container>\n    </td>\n  </ng-container>\n\n  <!-- Expanded Content Column -->\n  <ng-container matColumnDef=\"expandedDetail\">\n    <td mat-cell *matCellDef=\"let element\" [attr.colspan]=\"columnsToDisplay.length\">\n      <div class=\"element-detail\" *ngIf=\"dataSourceDetail.data.length\"\n        [@expandDetail]=\"element === elementDetail ? 'expanded' : 'collapsed'\">\n        <table mat-table [dataSource]=\"dataSourceDetail\">\n          <ng-container *ngFor=\"let tableColumn of tableDetailColumns.columnDefs\"\n            [matColumnDef]=\"tableColumn.headerName\">\n            <th mat-header-cell *matHeaderCellDef=\"let element\" arrowPosition=\"after\"\n              [ngStyle]=\"{width: tableColumn.styles?.width}\"\n              [ngClass]=\"tableColumn.styles?.alignment ? 'th-'+tableColumn.styles?.alignment : ''\">\n              {{tableColumn.headerName | uppercase}}\n            </th>\n            <td mat-cell *matCellDef=\"let element\" (click)=\"onDetailRowClick(element)\"\n              [align]=\"tableColumn.styles?.alignment\"\n              [ngClass]=\"tableColumn.styles?.alignment ? 'td-'+tableColumn.styles?.alignment : ''\"\n              [ngStyle]=\"{padding: tableColumn.styles?.padding}\">\n              <ng-container *ngTemplateOutlet=\"tableDataTpl; context: {element, tableColumn}\"></ng-container>\n            </td>\n          </ng-container>\n\n          <tr mat-header-row *matHeaderRowDef=\"columnsDetailToDisplay\"></tr>\n          <tr mat-row *matRowDef=\"let rowDetail; columns: columnsDetailToDisplay;\"></tr>\n        </table>\n      </div>\n    </td>\n  </ng-container>\n\n  <tr mat-header-row *matHeaderRowDef=\"columnsToDisplay\"></tr>\n  <tr mat-row *matRowDef=\"let element; columns: columnsToDisplay;\" class=\"element-row\"\n    [ngClass]=\"{'expanded-row': elementDetail === element, 'row-clickable': tableDetails}\"\n    (click)=\"toggleRow(element)\">\n  </tr>\n  <tr mat-row *matRowDef=\"let row; columns: ['expandedDetail']\" class=\"detail-row\"></tr>\n</table>\n\n<ng-template #tableDataTpl let-element=\"element\" let-tableColumn=\"tableColumn\">\n  <div class=\"align-wrapper\">\n    <ng-container [ngSwitch]=\"tableColumn.type\">\n      <ng-container *ngSwitchCase=\"DataType.FIELD\">\n        {{element | dataPropertyGetter: tableColumn.field}}\n      </ng-container>\n      <ng-container *ngSwitchCase=\"DataType.FUNCTION\">\n        {{tableColumn.function?.(element)}}\n      </ng-container>\n      <ng-container *ngSwitchCase=\"DataType.RENDERER\">\n        <ng-template\n          [dynamicComponent]=\"tableColumn.renderer?.(element)\">\n        </ng-template>\n      </ng-container>\n      <ng-container *ngSwitchDefault>\n        {{element | dataPropertyGetter: tableColumn.field}}\n      </ng-container>\n    </ng-container>\n  </div>\n</ng-template>\n\n<ng-template #tableHeader let-tableColumn=\"tableColumn\">\n  <div class=\"tooltip\" [ngStyle]=\"{'justify-content': tableColumn.styles?.alignment}\" [ngClass]=\"tableColumn.styles?.alignment\">\n    <span>{{tableColumn.headerName | uppercase}}</span>\n    <mat-icon *ngIf=\"tableColumn.headerTooltip\" [matTooltip]=\"tableColumn.headerTooltip\" class=\"tooltip-icon\" (click)=\"$event.stopPropagation()\">help</mat-icon>\n  </div>\n</ng-template>\n", styles: ["table{cursor:initial;width:100%;overflow:hidden;border-radius:8px 8px 0 0;-webkit-user-select:none;user-select:none}table .mat-mdc-header-cell{font-weight:700;color:#000;padding:16px}table .mat-mdc-header-cell .tooltip{display:flex;flex-direction:row;flex-wrap:nowrap;align-items:center}table .mat-mdc-header-cell .tooltip mat-icon{color:#1f5260;font-size:18px;position:relative;top:3px;left:4px;cursor:pointer}table .mat-mdc-cell{padding:16px;text-align:justify}table td,table th,table .mat-mdc-row{border-width:.5px}table .mat-mdc-row:hover:not(.element-detail .mat-row).row-clickable{background-color:#ecf6f5;cursor:pointer}table ::ng-deep .mat-sort-header-arrow{color:#276678}table .label.active{background-color:#46a997;color:#fff}table .label{padding:0 8px;width:-moz-fit-content;width:fit-content;font-weight:600;font-size:10px;border-radius:4px;background-color:#e9f0f1;color:#000}table th.th-right{text-align:right}table th.th-right ::ng-deep .mat-sort-header-container{justify-content:end}table th.th-left{text-align:left}table th.th-left ::ng-deep .mat-sort-header-container{justify-content:start}table th.th-center{text-align:center}table th.th-center ::ng-deep .mat-sort-header-container{justify-content:center}table .row-detail{display:flex;justify-content:space-between}table .row-detail-icon{align-self:center;font-size:16px;height:16px;width:16px}table .row-expand{display:flex}table .row-expand-icon{align-self:center;font-size:14px;height:14px;width:14px;margin-right:8px}table .align-wrapper{display:flex}table td.td-right{text-align:right}table td.td-right .align-wrapper{justify-content:end}table td.td-left{text-align:left}table td.td-left .align-wrapper{justify-content:start}table td.td-center{text-align:center}table td.td-center .align-wrapper{justify-content:center}table tr.detail-row{height:0}table tr.element-row:not(.expanded-row):hover{background:whitesmoke}table tr.element-row:not(.expanded-row):active{background:#efefef}table .element-row td{border-bottom-width:0}table .mat-column-expandedDetail{padding:0}table .element-detail{overflow:hidden;display:flex}table .element-detail table{background-color:#f6f6f6}table .element-detail table .mat-mdc-header-row{visibility:collapse}table .element-detail table .mat-mdc-cell{border-width:0px}\n"], dependencies: [{ kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1$1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "directive", type: i1$1.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i1$1.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "directive", type: i1$1.NgSwitchDefault, selector: "[ngSwitchDefault]" }, { kind: "component", type: i3$1.MatTable, selector: "mat-table, table[mat-table]", exportAs: ["matTable"] }, { kind: "directive", type: i3$1.MatHeaderCellDef, selector: "[matHeaderCellDef]" }, { kind: "directive", type: i3$1.MatHeaderRowDef, selector: "[matHeaderRowDef]", inputs: ["matHeaderRowDef", "matHeaderRowDefSticky"] }, { kind: "directive", type: i3$1.MatColumnDef, selector: "[matColumnDef]", inputs: ["sticky", "matColumnDef"] }, { kind: "directive", type: i3$1.MatCellDef, selector: "[matCellDef]" }, { kind: "directive", type: i3$1.MatRowDef, selector: "[matRowDef]", inputs: ["matRowDefColumns", "matRowDefWhen"] }, { kind: "directive", type: i3$1.MatHeaderCell, selector: "mat-header-cell, th[mat-header-cell]" }, { kind: "directive", type: i3$1.MatCell, selector: "mat-cell, td[mat-cell]" }, { kind: "component", type: i3$1.MatHeaderRow, selector: "mat-header-row, tr[mat-header-row]", exportAs: ["matHeaderRow"] }, { kind: "component", type: i3$1.MatRow, selector: "mat-row, tr[mat-row]", exportAs: ["matRow"] }, { kind: "directive", type: i4$1.MatSort, selector: "[matSort]", inputs: ["matSortDisabled", "matSortActive", "matSortStart", "matSortDirection", "matSortDisableClear"], outputs: ["matSortChange"], exportAs: ["matSort"] }, { kind: "component", type: i4$1.MatSortHeader, selector: "[mat-sort-header]", inputs: ["disabled", "mat-sort-header", "arrowPosition", "start", "sortActionDescription", "disableClear"], exportAs: ["matSortHeader"] }, { kind: "component", type: i1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "directive", type: i6.MatTooltip, selector: "[matTooltip]", exportAs: ["matTooltip"] }, { kind: "directive", type: DynamicComponentDirective, selector: "[dynamicComponent]", inputs: ["dynamicComponent"] }, { kind: "pipe", type: i1$1.UpperCasePipe, name: "uppercase" }, { kind: "pipe", type: DataPropertyGetterPipe, name: "dataPropertyGetter" }], animations: [
-        trigger('expandDetail', [
-            state('collapsed, void', style({ height: '0px' })),
-            state('expanded', style({ height: '*' })),
-            transition('expanded <=> collapsed', animate('225ms cubic-bezier(0.4, 0.0, 0.2, 1)')),
-            transition('expanded <=> void', animate('225ms cubic-bezier(0.4, 0.0, 0.2, 1)')),
-        ]),
-    ], changeDetection: i0.ChangeDetectionStrategy.OnPush });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: TableComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'ui-table', changeDetection: ChangeDetectionStrategy.OnPush, animations: [
-                        trigger('expandDetail', [
-                            state('collapsed, void', style({ height: '0px' })),
-                            state('expanded', style({ height: '*' })),
-                            transition('expanded <=> collapsed', animate('225ms cubic-bezier(0.4, 0.0, 0.2, 1)')),
-                            transition('expanded <=> void', animate('225ms cubic-bezier(0.4, 0.0, 0.2, 1)')),
-                        ]),
-                    ], template: "<table *ngIf=\"!tableDetails\" mat-table [dataSource]=\"dataSource\" matSort (matSortChange)=\"onSort($event)\">\n  <ng-container *ngFor=\"let tableColumn of tableColumns; let i = index\" [matColumnDef]=\"tableColumn.headerName\">\n    <ng-container *ngIf=\"tableColumn.sortable; else notSortable\">\n      <th mat-header-cell *matHeaderCellDef=\"let element\" [mat-sort-header]=\"tableColumn.field || ''\"\n        arrowPosition=\"after\" [ngStyle]=\"{width: tableColumn.styles?.width, minWidth: tableColumn.styles?.['min-width']}\"\n        [ngClass]=\"tableColumn.styles?.alignment ? 'th-'+tableColumn.styles?.alignment : ''\">\n          <ng-container *ngTemplateOutlet=\"tableHeader; context: {tableColumn}\"></ng-container>\n      </th>\n    </ng-container>\n    <ng-template #notSortable>\n      <th mat-header-cell *matHeaderCellDef [ngStyle]=\"{width: tableColumn.styles?.width, minWidth: tableColumn.styles?.['min-width']}\"\n        [ngClass]=\"tableColumn.styles?.alignment ? 'th-'+tableColumn.styles?.alignment : ''\">\n        <ng-container *ngTemplateOutlet=\"tableHeader; context: {tableColumn}\"></ng-container>\n      </th>\n    </ng-template>\n    <td mat-cell *matCellDef=\"let element\" (click)=\"onRowClick(element)\"\n      [align]=\"tableColumn.styles?.alignment\"\n      [ngClass]=\"[tableColumn.styles?.alignment ? 'td-'+tableColumn.styles?.alignment : '', onRowClickEvent.observed && i === tableColumns.length - 1 ? 'row-detail': '']\">\n      <ng-container *ngTemplateOutlet=\"tableDataTpl; context: {element, tableColumn}\"></ng-container>\n      <mat-icon *ngIf=\"onRowClickEvent.observed && i === tableColumns.length - 1\" class=\"row-detail-icon\">navigate_next</mat-icon>\n    </td>\n  </ng-container>\n  <tr mat-header-row *matHeaderRowDef=\"columnsToDisplay\"></tr>\n  <tr mat-row *matRowDef=\"let row; columns: columnsToDisplay;\" [ngClass]=\"{'row-clickable': onRowClickEvent.observed}\"></tr>\n</table>\n\n<table *ngIf=\"tableDetails\" mat-table [dataSource]=\"dataSource\" matSort (matSortChange)=\"onSort($event)\"\n  multiTemplateDataRows>\n  <ng-container *ngFor=\"let tableColumn of tableColumns; let i = index\" [matColumnDef]=\"tableColumn.headerName\">\n    <ng-container *ngIf=\"tableColumn.sortable; else notSortable\">\n      <th mat-header-cell *matHeaderCellDef=\"let element\" [mat-sort-header]=\"tableColumn.field || ''\"\n        arrowPosition=\"after\" [ngStyle]=\"{width: tableColumn.styles?.width, minWidth: tableColumn.styles?.['min-width']}\"\n        [ngClass]=\"tableColumn.styles?.alignment ? 'th-'+tableColumn.styles?.alignment : ''\">\n        <ng-container *ngTemplateOutlet=\"tableHeader; context: {tableColumn}\"></ng-container>\n      </th>\n    </ng-container>\n    <ng-template #notSortable>\n      <th mat-header-cell *matHeaderCellDef [ngStyle]=\"{width: tableColumn.styles?.width, minWidth: tableColumn.styles?.['min-width']}\"\n        [ngClass]=\"tableColumn.styles?.alignment ? 'th-'+tableColumn.styles?.alignment : ''\">\n        <ng-container *ngTemplateOutlet=\"tableHeader; context: {tableColumn}\"></ng-container>\n      </th>\n    </ng-template>\n    <td mat-cell *matCellDef=\"let element\" (click)=\"onRowClick(element)\"\n      [align]=\"tableColumn.styles?.alignment\"\n      [ngClass]=\"[tableColumn.styles?.alignment ? 'td-'+tableColumn.styles?.alignment : '', i === 0 ? 'row-expand' : '']\">\n      <mat-icon *ngIf=\"i === 0\" class=\"row-expand-icon\">{{ element === elementDetail ? 'expand_less' : 'expand_more' }}</mat-icon>\n      <ng-container *ngTemplateOutlet=\"tableDataTpl; context: {element, tableColumn}\"></ng-container>\n    </td>\n  </ng-container>\n\n  <!-- Expanded Content Column -->\n  <ng-container matColumnDef=\"expandedDetail\">\n    <td mat-cell *matCellDef=\"let element\" [attr.colspan]=\"columnsToDisplay.length\">\n      <div class=\"element-detail\" *ngIf=\"dataSourceDetail.data.length\"\n        [@expandDetail]=\"element === elementDetail ? 'expanded' : 'collapsed'\">\n        <table mat-table [dataSource]=\"dataSourceDetail\">\n          <ng-container *ngFor=\"let tableColumn of tableDetailColumns.columnDefs\"\n            [matColumnDef]=\"tableColumn.headerName\">\n            <th mat-header-cell *matHeaderCellDef=\"let element\" arrowPosition=\"after\"\n              [ngStyle]=\"{width: tableColumn.styles?.width}\"\n              [ngClass]=\"tableColumn.styles?.alignment ? 'th-'+tableColumn.styles?.alignment : ''\">\n              {{tableColumn.headerName | uppercase}}\n            </th>\n            <td mat-cell *matCellDef=\"let element\" (click)=\"onDetailRowClick(element)\"\n              [align]=\"tableColumn.styles?.alignment\"\n              [ngClass]=\"tableColumn.styles?.alignment ? 'td-'+tableColumn.styles?.alignment : ''\"\n              [ngStyle]=\"{padding: tableColumn.styles?.padding}\">\n              <ng-container *ngTemplateOutlet=\"tableDataTpl; context: {element, tableColumn}\"></ng-container>\n            </td>\n          </ng-container>\n\n          <tr mat-header-row *matHeaderRowDef=\"columnsDetailToDisplay\"></tr>\n          <tr mat-row *matRowDef=\"let rowDetail; columns: columnsDetailToDisplay;\"></tr>\n        </table>\n      </div>\n    </td>\n  </ng-container>\n\n  <tr mat-header-row *matHeaderRowDef=\"columnsToDisplay\"></tr>\n  <tr mat-row *matRowDef=\"let element; columns: columnsToDisplay;\" class=\"element-row\"\n    [ngClass]=\"{'expanded-row': elementDetail === element, 'row-clickable': tableDetails}\"\n    (click)=\"toggleRow(element)\">\n  </tr>\n  <tr mat-row *matRowDef=\"let row; columns: ['expandedDetail']\" class=\"detail-row\"></tr>\n</table>\n\n<ng-template #tableDataTpl let-element=\"element\" let-tableColumn=\"tableColumn\">\n  <div class=\"align-wrapper\">\n    <ng-container [ngSwitch]=\"tableColumn.type\">\n      <ng-container *ngSwitchCase=\"DataType.FIELD\">\n        {{element | dataPropertyGetter: tableColumn.field}}\n      </ng-container>\n      <ng-container *ngSwitchCase=\"DataType.FUNCTION\">\n        {{tableColumn.function?.(element)}}\n      </ng-container>\n      <ng-container *ngSwitchCase=\"DataType.RENDERER\">\n        <ng-template\n          [dynamicComponent]=\"tableColumn.renderer?.(element)\">\n        </ng-template>\n      </ng-container>\n      <ng-container *ngSwitchDefault>\n        {{element | dataPropertyGetter: tableColumn.field}}\n      </ng-container>\n    </ng-container>\n  </div>\n</ng-template>\n\n<ng-template #tableHeader let-tableColumn=\"tableColumn\">\n  <div class=\"tooltip\" [ngStyle]=\"{'justify-content': tableColumn.styles?.alignment}\" [ngClass]=\"tableColumn.styles?.alignment\">\n    <span>{{tableColumn.headerName | uppercase}}</span>\n    <mat-icon *ngIf=\"tableColumn.headerTooltip\" [matTooltip]=\"tableColumn.headerTooltip\" class=\"tooltip-icon\" (click)=\"$event.stopPropagation()\">help</mat-icon>\n  </div>\n</ng-template>\n", styles: ["table{cursor:initial;width:100%;overflow:hidden;border-radius:8px 8px 0 0;-webkit-user-select:none;user-select:none}table .mat-mdc-header-cell{font-weight:700;color:#000;padding:16px}table .mat-mdc-header-cell .tooltip{display:flex;flex-direction:row;flex-wrap:nowrap;align-items:center}table .mat-mdc-header-cell .tooltip mat-icon{color:#1f5260;font-size:18px;position:relative;top:3px;left:4px;cursor:pointer}table .mat-mdc-cell{padding:16px;text-align:justify}table td,table th,table .mat-mdc-row{border-width:.5px}table .mat-mdc-row:hover:not(.element-detail .mat-row).row-clickable{background-color:#ecf6f5;cursor:pointer}table ::ng-deep .mat-sort-header-arrow{color:#276678}table .label.active{background-color:#46a997;color:#fff}table .label{padding:0 8px;width:-moz-fit-content;width:fit-content;font-weight:600;font-size:10px;border-radius:4px;background-color:#e9f0f1;color:#000}table th.th-right{text-align:right}table th.th-right ::ng-deep .mat-sort-header-container{justify-content:end}table th.th-left{text-align:left}table th.th-left ::ng-deep .mat-sort-header-container{justify-content:start}table th.th-center{text-align:center}table th.th-center ::ng-deep .mat-sort-header-container{justify-content:center}table .row-detail{display:flex;justify-content:space-between}table .row-detail-icon{align-self:center;font-size:16px;height:16px;width:16px}table .row-expand{display:flex}table .row-expand-icon{align-self:center;font-size:14px;height:14px;width:14px;margin-right:8px}table .align-wrapper{display:flex}table td.td-right{text-align:right}table td.td-right .align-wrapper{justify-content:end}table td.td-left{text-align:left}table td.td-left .align-wrapper{justify-content:start}table td.td-center{text-align:center}table td.td-center .align-wrapper{justify-content:center}table tr.detail-row{height:0}table tr.element-row:not(.expanded-row):hover{background:whitesmoke}table tr.element-row:not(.expanded-row):active{background:#efefef}table .element-row td{border-bottom-width:0}table .mat-column-expandedDetail{padding:0}table .element-detail{overflow:hidden;display:flex}table .element-detail table{background-color:#f6f6f6}table .element-detail table .mat-mdc-header-row{visibility:collapse}table .element-detail table .mat-mdc-cell{border-width:0px}\n"] }]
-        }], ctorParameters: function () { return [{ type: DataPropertyGetterPipe }]; }, propDecorators: { matSort: [{
-                type: ViewChild,
-                args: [MatSort]
-            }], tableDetails: [{
-                type: Input
-            }], tableData: [{
-                type: Input
-            }], tableColumns: [{
-                type: Input
-            }], tableDetailColumns: [{
-                type: Input
-            }], onSortEvent: [{
-                type: Output
-            }], onRowClickEvent: [{
-                type: Output
-            }], onDetailRowClickEvent: [{
-                type: Output
-            }] } });
-
-class TableComponentModule {
-}
-TableComponentModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: TableComponentModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-TableComponentModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.9", ngImport: i0, type: TableComponentModule, declarations: [TableComponent, DataPropertyGetterPipe, DynamicComponentDirective], imports: [CommonModule, MatTableModule, MatSortModule, MatIconModule, MatTooltipModule], exports: [TableComponent] });
-TableComponentModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: TableComponentModule, providers: [DataPropertyGetterPipe], imports: [CommonModule, MatTableModule, MatSortModule, MatIconModule, MatTooltipModule] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: TableComponentModule, decorators: [{
-            type: NgModule,
-            args: [{
-                    declarations: [TableComponent, DataPropertyGetterPipe, DynamicComponentDirective],
-                    imports: [CommonModule, MatTableModule, MatSortModule, MatIconModule, MatTooltipModule],
-                    exports: [TableComponent],
-                    providers: [DataPropertyGetterPipe],
-                }]
-        }] });
-
-class TagComponent {
-    constructor() {
-        /**
-         * Icon
-         *
-         * @type {string}
-         * @memberof TagComponent
-         */
-        this.icon = '';
-        /**
-         * Whether to allow the tag to be closed.
-         *
-         * @type {boolean}
-         * @default false
-         * @memberof TagComponent
-         */
-        this.allowClose = false;
-        /**
-         * Whether the tag is in read-only mode.
-         *
-         * @type {boolean}
-         * @default false
-         * @memberof TagComponent
-         */
-        this.readOnly = false;
-        /**
-         * Whether the tag is selected.
-         *
-         * @type {boolean}
-         * @default false
-         * @memberof TagComponent
-         */
-        this.isSelected = false;
-        /**
-         * Display icon when is selected
-         *
-         * @type {boolean}
-         * @default false
-         * @memberof TagComponent
-         */
-        this.showIconWhenSelected = false;
-        /**
-         * Specifies whether the element is disabled.
-         *
-         * @type {boolean}
-         * @default false
-         * @memberof TagComponent
-         */
-        this.isDisabled = false;
-        /**
-         * Event triggered when the tag should be closed.
-         *
-         * @event
-         * @memberof TagComponent
-         */
-        this.close = new EventEmitter();
-        /**
-         * Event triggered when a press action occurs.
-         *
-         * @event
-         * @memberof TagComponent
-         */
-        this.press = new EventEmitter();
-        /**
-         * Subject that needs to be triggered when Label input changes, to check if it's truncated
-         * @private
-         * @type {void}
-         * @memberof TagComponent
-         */
-        this.checkLabelEllipsis$ = new ReplaySubject(1);
-        /**
-         * Observable that indicates if the Label is truncated
-         * debounceTime is used to wait for view to be initialized after receiving a new Label input
-         * @protected
-         * @type {boolean}
-         * @memberof TagComponent
-         */
-        this.isEllipseActiveObs$ = this.checkLabelEllipsis$.pipe(debounceTime(100), map(() => {
-            const el = this.labelElement.nativeElement;
-            return el.offsetWidth < el.scrollWidth;
-        }));
-        this.labelText = '';
-    }
-    /**
-     * Tag's label
-     *
-     * @memberof TagComponent
-     */
-    set label(value) {
-        this.labelText = value;
-        if (this.labelElement) {
-            this.isLabelEllipseActive();
-        }
-    }
-    ngAfterViewInit() {
-        this.isLabelEllipseActive();
-    }
-    onPress() {
-        if (!this.readOnly && !this.allowClose) {
-            this.isSelected = this.showIconWhenSelected ? !this.isSelected : false;
-            this.press.emit(this.isSelected);
-        }
-    }
-    onClose() {
-        this.close.emit();
-    }
-    isLabelEllipseActive() {
-        this.checkLabelEllipsis$.next();
-    }
-    get tabIndex() {
-        return this.isDisabled || this.readOnly ? -1 : 0;
-    }
-    get filled() {
-        return this.readOnly || this.allowClose || this.isSelected;
-    }
-}
-TagComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: TagComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-TagComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: TagComponent, selector: "ui-tag", inputs: { label: "label", icon: "icon", allowClose: "allowClose", readOnly: "readOnly", isSelected: "isSelected", showIconWhenSelected: "showIconWhenSelected", isDisabled: "isDisabled" }, outputs: { close: "close", press: "press" }, viewQueries: [{ propertyName: "labelElement", first: true, predicate: ["labelElement"], descendants: true }], ngImport: i0, template: "<div class=\"tag-wrapper\" [matTooltip]=\"(isEllipseActiveObs$ | async) ? labelText : ''\">\n  <div\n    [tabindex]=\"tabIndex\"\n    class=\"tag-container\"\n    [attr.data-testid]=\"'tag--container'\"\n    [ngClass]=\"{\n      filled: filled,\n      readonly: readOnly,\n      disabled: isDisabled,\n      outlined: !isSelected,\n    }\"\n    (click)=\"onPress()\"\n  >\n    <ui-icon *ngIf=\"icon\" class=\"icon\" [name]=\"icon\"></ui-icon>\n    <ui-icon *ngIf=\"isSelected && showIconWhenSelected\" class=\"icon\" [name]=\"'Check'\"></ui-icon>\n    <span class=\"tag-label\" #labelElement>{{ labelText }}</span>\n    <ui-icon [tabindex]=\"tabIndex\" *ngIf=\"allowClose\" class=\"delete-icon\" (click)=\"onClose()\" [name]=\"'Close'\"></ui-icon>\n  </div>\n</div>\n", styles: [":host .tag-wrapper{max-width:264px}:host .tag-container{height:32px;max-width:264px;border-radius:4px;display:flex;align-items:center;justify-content:center;padding:0 8px;width:-moz-fit-content;width:fit-content;cursor:pointer;margin:4px}:host .tag-container.outlined{border:1px solid #6894A0}:host .tag-container:focus{outline:1px dashed #888888;outline-offset:4px;background:#F6F6F6;border:1px solid #6894A0}:host .tag-container:focus.filled{background-color:#e9f0f1;border:1px solid #276678}:host .tag-container.filled{background:#E9F0F1;border:1px solid #E9F0F1}:host .tag-container.filled:hover{background-color:#e9f0f1;border:1px solid #276678}:host .tag-container.filled:active{background:#A9C2C9;border:1px solid #1B4754}:host .tag-container:hover{background:#F6F6F6;border:1px solid #6894A0}:host .tag-container:active{background:#E9F0F1}:host .tag-container.readonly{pointer-events:none}:host .tag-container.disabled{opacity:.5;border:1px solid #276678;background:#E9F0F1;pointer-events:none}:host .tag-container .tag-label{-webkit-user-select:none;user-select:none;font-size:14px;line-height:20px;font-weight:400;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}:host .tag-container .icon{height:16px;width:16px;min-width:16px;margin-right:8px}:host .tag-container .delete-icon{display:flex;align-items:center;justify-content:center;margin-left:8px;text-align:center;border:1px solid transparent}:host .tag-container .delete-icon:focus{border:1px dashed #1B4754;border-radius:4px}:host .tag-container .delete-icon:focus-visible{outline:none}\n"], dependencies: [{ kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: IconComponent, selector: "ui-icon", inputs: ["size", "cssClass", "name", "color"] }, { kind: "directive", type: i6.MatTooltip, selector: "[matTooltip]", exportAs: ["matTooltip"] }, { kind: "pipe", type: i1$1.AsyncPipe, name: "async" }] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: TagComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'ui-tag', template: "<div class=\"tag-wrapper\" [matTooltip]=\"(isEllipseActiveObs$ | async) ? labelText : ''\">\n  <div\n    [tabindex]=\"tabIndex\"\n    class=\"tag-container\"\n    [attr.data-testid]=\"'tag--container'\"\n    [ngClass]=\"{\n      filled: filled,\n      readonly: readOnly,\n      disabled: isDisabled,\n      outlined: !isSelected,\n    }\"\n    (click)=\"onPress()\"\n  >\n    <ui-icon *ngIf=\"icon\" class=\"icon\" [name]=\"icon\"></ui-icon>\n    <ui-icon *ngIf=\"isSelected && showIconWhenSelected\" class=\"icon\" [name]=\"'Check'\"></ui-icon>\n    <span class=\"tag-label\" #labelElement>{{ labelText }}</span>\n    <ui-icon [tabindex]=\"tabIndex\" *ngIf=\"allowClose\" class=\"delete-icon\" (click)=\"onClose()\" [name]=\"'Close'\"></ui-icon>\n  </div>\n</div>\n", styles: [":host .tag-wrapper{max-width:264px}:host .tag-container{height:32px;max-width:264px;border-radius:4px;display:flex;align-items:center;justify-content:center;padding:0 8px;width:-moz-fit-content;width:fit-content;cursor:pointer;margin:4px}:host .tag-container.outlined{border:1px solid #6894A0}:host .tag-container:focus{outline:1px dashed #888888;outline-offset:4px;background:#F6F6F6;border:1px solid #6894A0}:host .tag-container:focus.filled{background-color:#e9f0f1;border:1px solid #276678}:host .tag-container.filled{background:#E9F0F1;border:1px solid #E9F0F1}:host .tag-container.filled:hover{background-color:#e9f0f1;border:1px solid #276678}:host .tag-container.filled:active{background:#A9C2C9;border:1px solid #1B4754}:host .tag-container:hover{background:#F6F6F6;border:1px solid #6894A0}:host .tag-container:active{background:#E9F0F1}:host .tag-container.readonly{pointer-events:none}:host .tag-container.disabled{opacity:.5;border:1px solid #276678;background:#E9F0F1;pointer-events:none}:host .tag-container .tag-label{-webkit-user-select:none;user-select:none;font-size:14px;line-height:20px;font-weight:400;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}:host .tag-container .icon{height:16px;width:16px;min-width:16px;margin-right:8px}:host .tag-container .delete-icon{display:flex;align-items:center;justify-content:center;margin-left:8px;text-align:center;border:1px solid transparent}:host .tag-container .delete-icon:focus{border:1px dashed #1B4754;border-radius:4px}:host .tag-container .delete-icon:focus-visible{outline:none}\n"] }]
-        }], propDecorators: { label: [{
-                type: Input
-            }], icon: [{
-                type: Input
-            }], allowClose: [{
-                type: Input
-            }], readOnly: [{
-                type: Input
-            }], isSelected: [{
-                type: Input
-            }], showIconWhenSelected: [{
-                type: Input
-            }], isDisabled: [{
-                type: Input
-            }], close: [{
-                type: Output
-            }], press: [{
-                type: Output
-            }], labelElement: [{
-                type: ViewChild,
-                args: ['labelElement']
-            }] } });
-
-var TooltipPositionType;
-(function (TooltipPositionType) {
-    TooltipPositionType["TOP"] = "top";
-    TooltipPositionType["BOTTOM"] = "bottom";
-    TooltipPositionType["LEFT"] = "left";
-    TooltipPositionType["RIGHT"] = "right";
-})(TooltipPositionType || (TooltipPositionType = {}));
-
-class TooltipComponent {
-    constructor() {
-        /**
-         * Allows the user to define the position of the tooltip relative to the parent element.
-         *
-         * @type {TooltipPositionType}
-         * @memberof TooltipComponent
-         */
-        this.position = TooltipPositionType.TOP;
-        /**
-         * The message to be displayed in the tooltip.
-         *
-         * @type {string}
-         * @memberof TooltipComponent
-         */
-        this.message = '';
-    }
-    ngOnInit() {
-        this.setPosition();
-    }
-    //set position
-    setPosition() {
-        switch (this.position) {
-            case TooltipPositionType.TOP:
-                this.matPosition = 'above';
-                break;
-            case TooltipPositionType.BOTTOM:
-                this.matPosition = 'below';
-                break;
-            default:
-                this.matPosition = this.position;
-                break;
-        }
-    }
-}
-TooltipComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: TooltipComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-TooltipComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: TooltipComponent, selector: "ui-tooltip", inputs: { position: "position", message: "message" }, ngImport: i0, template: "<div [matTooltip]=\"message\" [matTooltipPosition]=\"matPosition\" matTooltipClass=\"tooltip\" aria-label=\"tooltip\">\n  <ng-content></ng-content>\n</div>\n", dependencies: [{ kind: "directive", type: i6.MatTooltip, selector: "[matTooltip]", exportAs: ["matTooltip"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: TooltipComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'ui-tooltip', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div [matTooltip]=\"message\" [matTooltipPosition]=\"matPosition\" matTooltipClass=\"tooltip\" aria-label=\"tooltip\">\n  <ng-content></ng-content>\n</div>\n" }]
-        }], propDecorators: { position: [{
-                type: Input
-            }], message: [{
-                type: Input
-            }] } });
-
-class TooltipComponentModule {
-}
-TooltipComponentModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: TooltipComponentModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-TooltipComponentModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.9", ngImport: i0, type: TooltipComponentModule, declarations: [TooltipComponent], imports: [MatTooltipModule], exports: [TooltipComponent] });
-TooltipComponentModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: TooltipComponentModule, imports: [MatTooltipModule] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: TooltipComponentModule, decorators: [{
-            type: NgModule,
-            args: [{
-                    declarations: [TooltipComponent],
-                    imports: [MatTooltipModule],
-                    exports: [TooltipComponent],
-                }]
-        }] });
-
-class TagComponentModule {
-}
-TagComponentModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: TagComponentModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-TagComponentModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.9", ngImport: i0, type: TagComponentModule, declarations: [TagComponent], imports: [CommonModule, IconComponentModule, TooltipComponentModule, MatTooltipModule], exports: [TagComponent] });
-TagComponentModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: TagComponentModule, imports: [CommonModule, IconComponentModule, TooltipComponentModule, MatTooltipModule] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: TagComponentModule, decorators: [{
-            type: NgModule,
-            args: [{
-                    declarations: [TagComponent],
-                    imports: [CommonModule, IconComponentModule, TooltipComponentModule, MatTooltipModule],
-                    exports: [TagComponent],
-                    providers: [],
-                }]
-        }] });
-
-class DropdownComponent {
-    constructor() {
-        this.class = 'ui-dropdown';
-        /**
-         * Text content will be applied to the input element if present.
-         *
-         * @type {string}
-         * @memberof DropdownComponent
-         */
-        this.label = '';
-        /**
-         * Unique id of the element.
-         *
-         * @type {string}
-         * @memberof DropdownComponent
-         */
-        this.id = '';
-        /**
-         * Whether the component is disabled.
-         * Default: false.
-         *
-         * @type {boolean}
-         * @memberof DropdownComponent
-         */
-        this.disabled = false;
-        /**
-         * List of options.
-         *
-         * @type {OptionType}
-         * @memberof DropdownComponent
-         */
-        this.valueList = [];
-        /**
-         * Whether the user should be allowed to clear the values.
-         * Default: true.
-         *
-         * @type {boolean}
-         * @memberof DropdownComponent
-         */
-        this.allowClear = true;
-        /**
-         * This will allow the user to select multiple values at once.
-         * Default: true.
-         *
-         * @type {boolean}
-         * @memberof DropdownComponent
-         */
-        this.allowMultipleSelection = false;
-        /**
-         * Whether the component is required.
-         * Default: false.
-         *
-         * @type {boolean}
-         * @memberof DropdownComponent
-         */
-        this.required = false;
-        /**
-         * @ignore
-         */
-        this.onChange = (_) => { };
-        /**
-         * @ignore
-         */
-        this.onTouch = () => { };
-        this.errors = [];
-        this.valueList = [];
-    }
-    ngOnInit() {
-        this.errorsLength = this.setErrorsLength();
-    }
-    clearValue(event) {
-        event === null || event === void 0 ? void 0 : event.stopPropagation();
-        this.value = '';
-    }
-    //Save select value
-    onChangeOption(event) {
-        this.value = event.value;
-        this.errorsLength = this.setErrorsLength();
-        this.onTouch();
-        this.onChange(this.value);
-    }
-    //Set errors length for validation
-    setErrorsLength() {
-        if (!!this.errors) {
-            return this.errors.length > 0 ? true : false;
-        }
-        return false;
-    }
-    writeValue(value) {
-        if (value) {
-            this.value = value || '';
-        }
-        else {
-            this.value = '';
-        }
-    }
-    registerOnChange(fn) {
-        this.onChange = fn;
-    }
-    registerOnTouched(fn) {
-        this.onTouch = fn;
-    }
-    setDisabledState(isDisabled) {
-        this.disabled = isDisabled;
-    }
-}
-DropdownComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: DropdownComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-DropdownComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: DropdownComponent, selector: "ui-dropdown", inputs: { label: "label", name: "name", placeholder: "placeholder", id: "id", value: "value", errors: "errors", disabled: "disabled", valueList: "valueList", allowClear: "allowClear", allowMultipleSelection: "allowMultipleSelection", required: "required" }, host: { properties: { "class": "this.class" } }, providers: [
-        {
-            provide: NG_VALUE_ACCESSOR,
-            useExisting: forwardRef(() => DropdownComponent),
-            multi: true,
-        },
-    ], ngImport: i0, template: "<mat-form-field appearance=\"outline\" [color]=\"errorsLength ? 'warn' : 'accent'\">\n  <mat-label>{{ label }}  <span *ngIf=\"required\">*</span></mat-label>\n  <mat-select\n    #matSelect\n    [id]=\"id!\"\n    panelClass=\"ui-dropdown-list\"\n    [disabled]=\"disabled\"\n    [multiple]=\"allowMultipleSelection\"\n    [placeholder]=\"placeholder\"\n    [value]=\"value\"\n    (selectionChange)=\"onChangeOption($event)\"\n    [attr.name]=\"name\">\n    <div class=\"mat-option-section\" *ngFor=\"let section of valueList\">\n      <span *ngIf=\"section.sectionTitle\" class=\"section-title\">{{ section.sectionTitle }}</span>\n      <mat-option *ngIf=\"section.value\" #matOption [value]=\"section.value\">\n        {{ section.value }}\n      </mat-option>\n    </div>\n  </mat-select>\n  <ui-button *ngIf=\"allowClear && !matSelect.empty\" type=\"secondary\" [justIcon]=\"true\" class=\"clear\" iconName=\"Close\" label=\"Clear\" (click)=\"clearValue($event)\"></ui-button>\n  <ui-icon color=\"dark\" *ngIf=\"!matSelect.panelOpen\" size=\"24\" name=\"Arrow_down\"></ui-icon>\n  <ui-icon color=\"petrol\" *ngIf=\"matSelect.panelOpen\" size=\"24\" name=\"Arrow_up\"></ui-icon>\n  <mat-hint class=\"error\" *ngIf=\"errorsLength\">\n    <div class=\"errors\" *ngFor=\"let error of errors\">\n      <ui-icon name=\"Error\"></ui-icon>{{ error }}\n    </div>\n  </mat-hint>\n</mat-form-field>\n", styles: ["ui-dropdown{display:flex}ui-dropdown .mat-mdc-form-field{margin-top:0;width:100%}ui-dropdown .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper{height:48px;flex:none}ui-dropdown .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper .mat-mdc-form-field-flex .mat-mdc-floating-label{top:22px}ui-dropdown .mat-mdc-form-field.mat-form-field-appearance-outline .mdc-notched-outline{color:#888}ui-dropdown .mat-mdc-form-field.mat-form-field-appearance-outline .mdc-notched-outline .mdc-floating-label--float-above{transform:translateY(-30px) scale(.75)}ui-dropdown .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-form-field-infix{min-height:48px;padding:4px 0;line-height:22px;display:inline-flex;align-items:center}ui-dropdown .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-select-arrow-wrapper{display:none}ui-dropdown .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-floating-label{color:#888}ui-dropdown .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-form-field-bottom-align:before{height:0}ui-dropdown .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-form-field-hint-wrapper{padding:0}ui-dropdown .mat-mdc-form-field.mat-form-field-appearance-outline.mat-focused .mat-mdc-text-field-wrapper .mat-mdc-form-field-flex .mat-mdc-form-field-infix .mat-mdc-floating-label mat-label{color:#276678}ui-dropdown .mat-mdc-form-field.mat-form-field-appearance-outline.mat-focused ui-icon:not(.clear) svg{color:#276678}ui-dropdown .mat-mdc-form-field.mat-form-field-appearance-outline button.mat-mdc-unelevated-button.secondary.only-icon{padding:0;height:auto;background:transparent}ui-dropdown .mat-mdc-form-field.mat-form-field-appearance-outline button.mat-mdc-unelevated-button.secondary.only-icon:hover,ui-dropdown .mat-mdc-form-field.mat-form-field-appearance-outline button.mat-mdc-unelevated-button.secondary.only-icon:focus{background:transparent;color:inherit;border:none;outline:none}ui-dropdown .mat-mdc-form-field.mat-form-field-appearance-outline button.mat-mdc-unelevated-button.secondary.only-icon.focus.cdk-focused.cdk-mouse-focused{background-color:transparent!important}ui-dropdown .mat-mdc-form-field.mat-form-field-appearance-outline .clear{position:absolute;right:24px}ui-dropdown .mat-mdc-form-field.mat-form-field-appearance-outline .clear mat-icon.black svg{color:#888}ui-dropdown .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn.mat-form-field-appearance-outline:not(.mdc-text-field--disabled) .mat-mdc-form-field-flex:hover .mdc-notched-outline .mdc-notched-outline__leading,ui-dropdown .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn.mat-form-field-appearance-outline:not(.mdc-text-field--disabled) .mat-mdc-form-field-flex:hover .mdc-notched-outline .mdc-notched-outline__trailing,ui-dropdown .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn.mat-form-field-appearance-outline:not(.mdc-text-field--disabled) .mat-mdc-form-field-flex:hover .mdc-notched-outline .mdc-notched-outline__notch{border-color:#cb7b7a}ui-dropdown .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn.mat-form-field-appearance-outline .mdc-notched-outline .mdc-notched-outline__leading,ui-dropdown .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn.mat-form-field-appearance-outline .mdc-notched-outline .mdc-notched-outline__trailing,ui-dropdown .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn.mat-form-field-appearance-outline .mdc-notched-outline .mdc-notched-outline__notch{border-color:#cb7b7a}ui-dropdown .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn.mat-focused .mat-mdc-text-field-wrapper .mat-mdc-form-field-flex .mat-mdc-form-field-infix .mat-mdc-floating-label mat-label{color:#cb7b7a}ui-dropdown .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn.mat-focused ui-icon svg{color:#888}ui-dropdown .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-form-field-subscript-wrapper{padding:0;margin-top:9px;font-size:12px;line-height:16px;position:relative}ui-dropdown .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-form-field-subscript-wrapper .mat-mdc-form-field-hint-spacer{display:none}ui-dropdown .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-form-field-hint.error{display:flex;flex-flow:column;row-gap:4px}ui-dropdown .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-form-field-hint.error .errors{display:flex}ui-dropdown .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-form-field-hint.error,ui-dropdown .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-form-field-hint.error svg{color:#cb7b7a}ui-dropdown .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-form-field-hint.error{display:flex}ui-dropdown .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-form-field-hint.error ui-icon{margin-right:9px}ui-dropdown .mat-mdc-form-field.mat-form-field-appearance-outline.mat-form-field-disabled.mat-form-field-appearance-outline .mdc-notched-outline{color:#e0e0e0}ui-dropdown .mat-mdc-form-field.mat-form-field-appearance-outline.mat-form-field-disabled .options .options-container ui-button svg,ui-dropdown .mat-mdc-form-field.mat-form-field-appearance-outline.mat-form-field-disabled .options .options-container ui-icon svg{color:#e0e0e0}.cdk-overlay-container .cdk-overlay-pane .ui-dropdown-list{margin-top:4px;border-radius:8px!important;box-shadow:0 8px 24px 4px #00000014}.cdk-overlay-container .cdk-overlay-pane .ui-dropdown-list .mat-mdc-option{display:flex;height:48px;color:#000}.cdk-overlay-container .cdk-overlay-pane .ui-dropdown-list .mat-mdc-option .mdc-list-item__primary-text{display:flex;align-items:center;justify-content:space-between}.cdk-overlay-container .cdk-overlay-pane .ui-dropdown-list .mat-option-section .section-title{font-size:12px;text-transform:uppercase;display:flex;height:48px;align-items:center;font-weight:700;padding:0 16px}.cdk-overlay-container .cdk-overlay-pane .ui-dropdown-list.mat-accent mat-option:hover:not(.mdc-list-item--disabled),.cdk-overlay-container .cdk-overlay-pane .ui-dropdown-list.mat-accent mat-option:focus:not(.mdc-list-item--disabled),.cdk-overlay-container .cdk-overlay-pane .ui-dropdown-list.mat-accent .mat-mdc-option-multiple:hover:not(.mdc-list-item--disabled),.cdk-overlay-container .cdk-overlay-pane .ui-dropdown-list.mat-accent .mat-mdc-option-multiple:focus:not(.mdc-list-item--disabled){background-color:#e0e0e0}.cdk-overlay-container .cdk-overlay-pane .ui-dropdown-list.mat-accent mat-option.mat-mdc-option-active,.cdk-overlay-container .cdk-overlay-pane .ui-dropdown-list.mat-accent mat-option.mdc-list-item--selected,.cdk-overlay-container .cdk-overlay-pane .ui-dropdown-list.mat-accent .mat-mdc-option-multiple.mat-mdc-option-active,.cdk-overlay-container .cdk-overlay-pane .ui-dropdown-list.mat-accent .mat-mdc-option-multiple.mdc-list-item--selected{background-color:#e9f0f1;color:#000}.cdk-overlay-container .cdk-overlay-pane .ui-dropdown-list.mat-accent mat-option.mat-mdc-option-active:hover:not(.mdc-list-item--disabled),.cdk-overlay-container .cdk-overlay-pane .ui-dropdown-list.mat-accent mat-option.mat-mdc-option-active:focus:not(.mdc-list-item--disabled),.cdk-overlay-container .cdk-overlay-pane .ui-dropdown-list.mat-accent mat-option.mdc-list-item--selected:hover:not(.mdc-list-item--disabled),.cdk-overlay-container .cdk-overlay-pane .ui-dropdown-list.mat-accent mat-option.mdc-list-item--selected:focus:not(.mdc-list-item--disabled),.cdk-overlay-container .cdk-overlay-pane .ui-dropdown-list.mat-accent .mat-mdc-option-multiple.mat-mdc-option-active:hover:not(.mdc-list-item--disabled),.cdk-overlay-container .cdk-overlay-pane .ui-dropdown-list.mat-accent .mat-mdc-option-multiple.mat-mdc-option-active:focus:not(.mdc-list-item--disabled),.cdk-overlay-container .cdk-overlay-pane .ui-dropdown-list.mat-accent .mat-mdc-option-multiple.mdc-list-item--selected:hover:not(.mdc-list-item--disabled),.cdk-overlay-container .cdk-overlay-pane .ui-dropdown-list.mat-accent .mat-mdc-option-multiple.mdc-list-item--selected:focus:not(.mdc-list-item--disabled){background-color:#c8d7de}.cdk-overlay-container .cdk-overlay-pane .ui-dropdown-list.mat-warn mat-option:hover:not(.mdc-list-item--disabled),.cdk-overlay-container .cdk-overlay-pane .ui-dropdown-list.mat-warn mat-option:focus:not(.mdc-list-item--disabled),.cdk-overlay-container .cdk-overlay-pane .ui-dropdown-list.mat-warn .mat-mdc-option-multiple:hover:not(.mdc-list-item--disabled),.cdk-overlay-container .cdk-overlay-pane .ui-dropdown-list.mat-warn .mat-mdc-option-multiple:focus:not(.mdc-list-item--disabled){background-color:#e0e0e0}.cdk-overlay-container .cdk-overlay-pane .ui-dropdown-list.mat-warn mat-option.mat-mdc-option-active,.cdk-overlay-container .cdk-overlay-pane .ui-dropdown-list.mat-warn mat-option.mdc-list-item--selected,.cdk-overlay-container .cdk-overlay-pane .ui-dropdown-list.mat-warn .mat-mdc-option-multiple.mat-mdc-option-active,.cdk-overlay-container .cdk-overlay-pane .ui-dropdown-list.mat-warn .mat-mdc-option-multiple.mdc-list-item--selected{background-color:#f0dad9;color:#000}.cdk-overlay-container .cdk-overlay-pane .ui-dropdown-list.mat-warn mat-option.mat-mdc-option-active:hover:not(.mdc-list-item--disabled),.cdk-overlay-container .cdk-overlay-pane .ui-dropdown-list.mat-warn mat-option.mat-mdc-option-active:focus:not(.mdc-list-item--disabled),.cdk-overlay-container .cdk-overlay-pane .ui-dropdown-list.mat-warn mat-option.mdc-list-item--selected:hover:not(.mdc-list-item--disabled),.cdk-overlay-container .cdk-overlay-pane .ui-dropdown-list.mat-warn mat-option.mdc-list-item--selected:focus:not(.mdc-list-item--disabled),.cdk-overlay-container .cdk-overlay-pane .ui-dropdown-list.mat-warn .mat-mdc-option-multiple.mat-mdc-option-active:hover:not(.mdc-list-item--disabled),.cdk-overlay-container .cdk-overlay-pane .ui-dropdown-list.mat-warn .mat-mdc-option-multiple.mat-mdc-option-active:focus:not(.mdc-list-item--disabled),.cdk-overlay-container .cdk-overlay-pane .ui-dropdown-list.mat-warn .mat-mdc-option-multiple.mdc-list-item--selected:hover:not(.mdc-list-item--disabled),.cdk-overlay-container .cdk-overlay-pane .ui-dropdown-list.mat-warn .mat-mdc-option-multiple.mdc-list-item--selected:focus:not(.mdc-list-item--disabled){background-color:#e3c3c6}.cdk-overlay-container .cdk-overlay-pane .ui-dropdown-list .mat-mdc-form-field-hint.error{display:flex;flex-flow:column;row-gap:4px}.cdk-overlay-container .cdk-overlay-pane .ui-dropdown-list .mat-mdc-form-field-hint.error .errors{display:flex}\n"], dependencies: [{ kind: "directive", type: i1$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i2$3.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i2$3.MatLabel, selector: "mat-label" }, { kind: "directive", type: i2$3.MatHint, selector: "mat-hint", inputs: ["align", "id"] }, { kind: "component", type: IconComponent, selector: "ui-icon", inputs: ["size", "cssClass", "name", "color"] }, { kind: "component", type: ButtonComponent, selector: "ui-button", inputs: ["size", "type", "label", "iconPosition", "justIcon", "iconName", "disabled", "loading", "fullWidth", "url", "urlTarget", "value"], outputs: ["buttonClickEvent", "buttonHoverEvent"] }, { kind: "component", type: i5$2.MatSelect, selector: "mat-select", inputs: ["disabled", "disableRipple", "tabIndex", "hideSingleSelectionIndicator"], exportAs: ["matSelect"] }, { kind: "component", type: i6$1.MatOption, selector: "mat-option", exportAs: ["matOption"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: DropdownComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'ui-dropdown', encapsulation: ViewEncapsulation.None, providers: [
-                        {
-                            provide: NG_VALUE_ACCESSOR,
-                            useExisting: forwardRef(() => DropdownComponent),
-                            multi: true,
-                        },
-                    ], changeDetection: ChangeDetectionStrategy.OnPush, template: "<mat-form-field appearance=\"outline\" [color]=\"errorsLength ? 'warn' : 'accent'\">\n  <mat-label>{{ label }}  <span *ngIf=\"required\">*</span></mat-label>\n  <mat-select\n    #matSelect\n    [id]=\"id!\"\n    panelClass=\"ui-dropdown-list\"\n    [disabled]=\"disabled\"\n    [multiple]=\"allowMultipleSelection\"\n    [placeholder]=\"placeholder\"\n    [value]=\"value\"\n    (selectionChange)=\"onChangeOption($event)\"\n    [attr.name]=\"name\">\n    <div class=\"mat-option-section\" *ngFor=\"let section of valueList\">\n      <span *ngIf=\"section.sectionTitle\" class=\"section-title\">{{ section.sectionTitle }}</span>\n      <mat-option *ngIf=\"section.value\" #matOption [value]=\"section.value\">\n        {{ section.value }}\n      </mat-option>\n    </div>\n  </mat-select>\n  <ui-button *ngIf=\"allowClear && !matSelect.empty\" type=\"secondary\" [justIcon]=\"true\" class=\"clear\" iconName=\"Close\" label=\"Clear\" (click)=\"clearValue($event)\"></ui-button>\n  <ui-icon color=\"dark\" *ngIf=\"!matSelect.panelOpen\" size=\"24\" name=\"Arrow_down\"></ui-icon>\n  <ui-icon color=\"petrol\" *ngIf=\"matSelect.panelOpen\" size=\"24\" name=\"Arrow_up\"></ui-icon>\n  <mat-hint class=\"error\" *ngIf=\"errorsLength\">\n    <div class=\"errors\" *ngFor=\"let error of errors\">\n      <ui-icon name=\"Error\"></ui-icon>{{ error }}\n    </div>\n  </mat-hint>\n</mat-form-field>\n", styles: ["ui-dropdown{display:flex}ui-dropdown .mat-mdc-form-field{margin-top:0;width:100%}ui-dropdown .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper{height:48px;flex:none}ui-dropdown .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper .mat-mdc-form-field-flex .mat-mdc-floating-label{top:22px}ui-dropdown .mat-mdc-form-field.mat-form-field-appearance-outline .mdc-notched-outline{color:#888}ui-dropdown .mat-mdc-form-field.mat-form-field-appearance-outline .mdc-notched-outline .mdc-floating-label--float-above{transform:translateY(-30px) scale(.75)}ui-dropdown .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-form-field-infix{min-height:48px;padding:4px 0;line-height:22px;display:inline-flex;align-items:center}ui-dropdown .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-select-arrow-wrapper{display:none}ui-dropdown .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-floating-label{color:#888}ui-dropdown .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-form-field-bottom-align:before{height:0}ui-dropdown .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-form-field-hint-wrapper{padding:0}ui-dropdown .mat-mdc-form-field.mat-form-field-appearance-outline.mat-focused .mat-mdc-text-field-wrapper .mat-mdc-form-field-flex .mat-mdc-form-field-infix .mat-mdc-floating-label mat-label{color:#276678}ui-dropdown .mat-mdc-form-field.mat-form-field-appearance-outline.mat-focused ui-icon:not(.clear) svg{color:#276678}ui-dropdown .mat-mdc-form-field.mat-form-field-appearance-outline button.mat-mdc-unelevated-button.secondary.only-icon{padding:0;height:auto;background:transparent}ui-dropdown .mat-mdc-form-field.mat-form-field-appearance-outline button.mat-mdc-unelevated-button.secondary.only-icon:hover,ui-dropdown .mat-mdc-form-field.mat-form-field-appearance-outline button.mat-mdc-unelevated-button.secondary.only-icon:focus{background:transparent;color:inherit;border:none;outline:none}ui-dropdown .mat-mdc-form-field.mat-form-field-appearance-outline button.mat-mdc-unelevated-button.secondary.only-icon.focus.cdk-focused.cdk-mouse-focused{background-color:transparent!important}ui-dropdown .mat-mdc-form-field.mat-form-field-appearance-outline .clear{position:absolute;right:24px}ui-dropdown .mat-mdc-form-field.mat-form-field-appearance-outline .clear mat-icon.black svg{color:#888}ui-dropdown .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn.mat-form-field-appearance-outline:not(.mdc-text-field--disabled) .mat-mdc-form-field-flex:hover .mdc-notched-outline .mdc-notched-outline__leading,ui-dropdown .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn.mat-form-field-appearance-outline:not(.mdc-text-field--disabled) .mat-mdc-form-field-flex:hover .mdc-notched-outline .mdc-notched-outline__trailing,ui-dropdown .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn.mat-form-field-appearance-outline:not(.mdc-text-field--disabled) .mat-mdc-form-field-flex:hover .mdc-notched-outline .mdc-notched-outline__notch{border-color:#cb7b7a}ui-dropdown .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn.mat-form-field-appearance-outline .mdc-notched-outline .mdc-notched-outline__leading,ui-dropdown .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn.mat-form-field-appearance-outline .mdc-notched-outline .mdc-notched-outline__trailing,ui-dropdown .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn.mat-form-field-appearance-outline .mdc-notched-outline .mdc-notched-outline__notch{border-color:#cb7b7a}ui-dropdown .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn.mat-focused .mat-mdc-text-field-wrapper .mat-mdc-form-field-flex .mat-mdc-form-field-infix .mat-mdc-floating-label mat-label{color:#cb7b7a}ui-dropdown .mat-mdc-form-field.mat-form-field-appearance-outline.mat-warn.mat-focused ui-icon svg{color:#888}ui-dropdown .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-form-field-subscript-wrapper{padding:0;margin-top:9px;font-size:12px;line-height:16px;position:relative}ui-dropdown .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-form-field-subscript-wrapper .mat-mdc-form-field-hint-spacer{display:none}ui-dropdown .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-form-field-hint.error{display:flex;flex-flow:column;row-gap:4px}ui-dropdown .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-form-field-hint.error .errors{display:flex}ui-dropdown .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-form-field-hint.error,ui-dropdown .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-form-field-hint.error svg{color:#cb7b7a}ui-dropdown .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-form-field-hint.error{display:flex}ui-dropdown .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-form-field-hint.error ui-icon{margin-right:9px}ui-dropdown .mat-mdc-form-field.mat-form-field-appearance-outline.mat-form-field-disabled.mat-form-field-appearance-outline .mdc-notched-outline{color:#e0e0e0}ui-dropdown .mat-mdc-form-field.mat-form-field-appearance-outline.mat-form-field-disabled .options .options-container ui-button svg,ui-dropdown .mat-mdc-form-field.mat-form-field-appearance-outline.mat-form-field-disabled .options .options-container ui-icon svg{color:#e0e0e0}.cdk-overlay-container .cdk-overlay-pane .ui-dropdown-list{margin-top:4px;border-radius:8px!important;box-shadow:0 8px 24px 4px #00000014}.cdk-overlay-container .cdk-overlay-pane .ui-dropdown-list .mat-mdc-option{display:flex;height:48px;color:#000}.cdk-overlay-container .cdk-overlay-pane .ui-dropdown-list .mat-mdc-option .mdc-list-item__primary-text{display:flex;align-items:center;justify-content:space-between}.cdk-overlay-container .cdk-overlay-pane .ui-dropdown-list .mat-option-section .section-title{font-size:12px;text-transform:uppercase;display:flex;height:48px;align-items:center;font-weight:700;padding:0 16px}.cdk-overlay-container .cdk-overlay-pane .ui-dropdown-list.mat-accent mat-option:hover:not(.mdc-list-item--disabled),.cdk-overlay-container .cdk-overlay-pane .ui-dropdown-list.mat-accent mat-option:focus:not(.mdc-list-item--disabled),.cdk-overlay-container .cdk-overlay-pane .ui-dropdown-list.mat-accent .mat-mdc-option-multiple:hover:not(.mdc-list-item--disabled),.cdk-overlay-container .cdk-overlay-pane .ui-dropdown-list.mat-accent .mat-mdc-option-multiple:focus:not(.mdc-list-item--disabled){background-color:#e0e0e0}.cdk-overlay-container .cdk-overlay-pane .ui-dropdown-list.mat-accent mat-option.mat-mdc-option-active,.cdk-overlay-container .cdk-overlay-pane .ui-dropdown-list.mat-accent mat-option.mdc-list-item--selected,.cdk-overlay-container .cdk-overlay-pane .ui-dropdown-list.mat-accent .mat-mdc-option-multiple.mat-mdc-option-active,.cdk-overlay-container .cdk-overlay-pane .ui-dropdown-list.mat-accent .mat-mdc-option-multiple.mdc-list-item--selected{background-color:#e9f0f1;color:#000}.cdk-overlay-container .cdk-overlay-pane .ui-dropdown-list.mat-accent mat-option.mat-mdc-option-active:hover:not(.mdc-list-item--disabled),.cdk-overlay-container .cdk-overlay-pane .ui-dropdown-list.mat-accent mat-option.mat-mdc-option-active:focus:not(.mdc-list-item--disabled),.cdk-overlay-container .cdk-overlay-pane .ui-dropdown-list.mat-accent mat-option.mdc-list-item--selected:hover:not(.mdc-list-item--disabled),.cdk-overlay-container .cdk-overlay-pane .ui-dropdown-list.mat-accent mat-option.mdc-list-item--selected:focus:not(.mdc-list-item--disabled),.cdk-overlay-container .cdk-overlay-pane .ui-dropdown-list.mat-accent .mat-mdc-option-multiple.mat-mdc-option-active:hover:not(.mdc-list-item--disabled),.cdk-overlay-container .cdk-overlay-pane .ui-dropdown-list.mat-accent .mat-mdc-option-multiple.mat-mdc-option-active:focus:not(.mdc-list-item--disabled),.cdk-overlay-container .cdk-overlay-pane .ui-dropdown-list.mat-accent .mat-mdc-option-multiple.mdc-list-item--selected:hover:not(.mdc-list-item--disabled),.cdk-overlay-container .cdk-overlay-pane .ui-dropdown-list.mat-accent .mat-mdc-option-multiple.mdc-list-item--selected:focus:not(.mdc-list-item--disabled){background-color:#c8d7de}.cdk-overlay-container .cdk-overlay-pane .ui-dropdown-list.mat-warn mat-option:hover:not(.mdc-list-item--disabled),.cdk-overlay-container .cdk-overlay-pane .ui-dropdown-list.mat-warn mat-option:focus:not(.mdc-list-item--disabled),.cdk-overlay-container .cdk-overlay-pane .ui-dropdown-list.mat-warn .mat-mdc-option-multiple:hover:not(.mdc-list-item--disabled),.cdk-overlay-container .cdk-overlay-pane .ui-dropdown-list.mat-warn .mat-mdc-option-multiple:focus:not(.mdc-list-item--disabled){background-color:#e0e0e0}.cdk-overlay-container .cdk-overlay-pane .ui-dropdown-list.mat-warn mat-option.mat-mdc-option-active,.cdk-overlay-container .cdk-overlay-pane .ui-dropdown-list.mat-warn mat-option.mdc-list-item--selected,.cdk-overlay-container .cdk-overlay-pane .ui-dropdown-list.mat-warn .mat-mdc-option-multiple.mat-mdc-option-active,.cdk-overlay-container .cdk-overlay-pane .ui-dropdown-list.mat-warn .mat-mdc-option-multiple.mdc-list-item--selected{background-color:#f0dad9;color:#000}.cdk-overlay-container .cdk-overlay-pane .ui-dropdown-list.mat-warn mat-option.mat-mdc-option-active:hover:not(.mdc-list-item--disabled),.cdk-overlay-container .cdk-overlay-pane .ui-dropdown-list.mat-warn mat-option.mat-mdc-option-active:focus:not(.mdc-list-item--disabled),.cdk-overlay-container .cdk-overlay-pane .ui-dropdown-list.mat-warn mat-option.mdc-list-item--selected:hover:not(.mdc-list-item--disabled),.cdk-overlay-container .cdk-overlay-pane .ui-dropdown-list.mat-warn mat-option.mdc-list-item--selected:focus:not(.mdc-list-item--disabled),.cdk-overlay-container .cdk-overlay-pane .ui-dropdown-list.mat-warn .mat-mdc-option-multiple.mat-mdc-option-active:hover:not(.mdc-list-item--disabled),.cdk-overlay-container .cdk-overlay-pane .ui-dropdown-list.mat-warn .mat-mdc-option-multiple.mat-mdc-option-active:focus:not(.mdc-list-item--disabled),.cdk-overlay-container .cdk-overlay-pane .ui-dropdown-list.mat-warn .mat-mdc-option-multiple.mdc-list-item--selected:hover:not(.mdc-list-item--disabled),.cdk-overlay-container .cdk-overlay-pane .ui-dropdown-list.mat-warn .mat-mdc-option-multiple.mdc-list-item--selected:focus:not(.mdc-list-item--disabled){background-color:#e3c3c6}.cdk-overlay-container .cdk-overlay-pane .ui-dropdown-list .mat-mdc-form-field-hint.error{display:flex;flex-flow:column;row-gap:4px}.cdk-overlay-container .cdk-overlay-pane .ui-dropdown-list .mat-mdc-form-field-hint.error .errors{display:flex}\n"] }]
-        }], ctorParameters: function () { return []; }, propDecorators: { class: [{
-                type: HostBinding
-            }], label: [{
-                type: Input
-            }], name: [{
-                type: Input
-            }], placeholder: [{
-                type: Input
-            }], id: [{
-                type: Input
-            }], value: [{
-                type: Input
-            }], errors: [{
-                type: Input
-            }], disabled: [{
-                type: Input
-            }], valueList: [{
-                type: Input
-            }], allowClear: [{
-                type: Input
-            }], allowMultipleSelection: [{
-                type: Input
-            }], required: [{
-                type: Input
-            }] } });
-
-class DropdownComponentModule {
-}
-DropdownComponentModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: DropdownComponentModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-DropdownComponentModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.9", ngImport: i0, type: DropdownComponentModule, declarations: [DropdownComponent], imports: [CommonModule,
-        MatFormFieldModule,
-        MatInputModule,
-        IconComponentModule,
-        FormsModule,
-        ReactiveFormsModule,
-        ButtonComponentModule,
-        MatSelectModule], exports: [DropdownComponent] });
-DropdownComponentModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: DropdownComponentModule, imports: [CommonModule,
-        MatFormFieldModule,
-        MatInputModule,
-        IconComponentModule,
-        FormsModule,
-        ReactiveFormsModule,
-        ButtonComponentModule,
-        MatSelectModule] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: DropdownComponentModule, decorators: [{
-            type: NgModule,
-            args: [{
-                    declarations: [DropdownComponent],
-                    imports: [
-                        CommonModule,
-                        MatFormFieldModule,
-                        MatInputModule,
-                        IconComponentModule,
-                        FormsModule,
-                        ReactiveFormsModule,
-                        ButtonComponentModule,
-                        MatSelectModule,
-                    ],
-                    exports: [DropdownComponent],
-                    providers: [],
-                }]
-        }] });
-
-class SpinnerComponent {
-}
-SpinnerComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SpinnerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-SpinnerComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: SpinnerComponent, selector: "ui-spinner", ngImport: i0, template: "<svg class=\"spinner\" viewBox=\"0 0 50 50\">\n  <circle class=\"path\" cx=\"25\" cy=\"25\" r=\"20\" fill=\"none\" stroke-width=\"5\"></circle>\n</svg>\n", styles: [".spinner{animation:rotate 2s linear infinite;z-index:999;position:fixed;top:50%;left:50%;margin:-25px 0 0 -25px;width:50px;height:50px}.spinner .path{stroke:#000;stroke-linecap:round;animation:dash 1.5s ease-in-out infinite}@keyframes rotate{to{transform:rotate(360deg)}}@keyframes dash{0%{stroke-dasharray:1,150;stroke-dashoffset:0}50%{stroke-dasharray:90,150;stroke-dashoffset:-35}to{stroke-dasharray:90,150;stroke-dashoffset:-124}}\n"] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SpinnerComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'ui-spinner', template: "<svg class=\"spinner\" viewBox=\"0 0 50 50\">\n  <circle class=\"path\" cx=\"25\" cy=\"25\" r=\"20\" fill=\"none\" stroke-width=\"5\"></circle>\n</svg>\n", styles: [".spinner{animation:rotate 2s linear infinite;z-index:999;position:fixed;top:50%;left:50%;margin:-25px 0 0 -25px;width:50px;height:50px}.spinner .path{stroke:#000;stroke-linecap:round;animation:dash 1.5s ease-in-out infinite}@keyframes rotate{to{transform:rotate(360deg)}}@keyframes dash{0%{stroke-dasharray:1,150;stroke-dashoffset:0}50%{stroke-dasharray:90,150;stroke-dashoffset:-35}to{stroke-dasharray:90,150;stroke-dashoffset:-124}}\n"] }]
-        }] });
-
-class SpinnerComponentModule {
-}
-SpinnerComponentModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SpinnerComponentModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-SpinnerComponentModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.9", ngImport: i0, type: SpinnerComponentModule, declarations: [SpinnerComponent], exports: [SpinnerComponent] });
-SpinnerComponentModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SpinnerComponentModule });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SpinnerComponentModule, decorators: [{
-            type: NgModule,
-            args: [{
-                    declarations: [SpinnerComponent],
-                    exports: [SpinnerComponent],
-                }]
-        }] });
-
-const CONFIRM_DIALOG_i18n = {
-    confirmButtonText: 'YES',
-    cancelButtonText: 'Cancel',
-    title: 'Confirm',
-};
-
-class ConfirmDialogComponent {
-    constructor(dialogRef, data) {
-        var _a, _b, _c;
-        this.dialogRef = dialogRef;
-        this.data = data;
-        this.confirmMessage = data.message;
-        this.confirmButtonText = (_a = data.confirmButtonText) !== null && _a !== void 0 ? _a : CONFIRM_DIALOG_i18n.confirmButtonText;
-        this.cancelButtonText = (_b = data.cancelButtonText) !== null && _b !== void 0 ? _b : CONFIRM_DIALOG_i18n.cancelButtonText;
-        this.title = (_c = data.title) !== null && _c !== void 0 ? _c : CONFIRM_DIALOG_i18n.title;
-    }
-}
-ConfirmDialogComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: ConfirmDialogComponent, deps: [{ token: i1$4.MatDialogRef }, { token: MAT_DIALOG_DATA }], target: i0.ɵɵFactoryTarget.Component });
-ConfirmDialogComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: ConfirmDialogComponent, selector: "ui-confirm-dialog", ngImport: i0, template: "<ui-dialog\n  [title]=\"title\"\n  [primaryButtonLabel]=\"confirmButtonText\"\n  [secondaryButtonLabel]=\"cancelButtonText\"\n  (primaryButtonClickEvent)=\"dialogRef.close(true)\"\n  (secondaryButtonClickEvent)=\"dialogRef.close(false)\"\n  primaryButtonType=\"destructive\"\n  secondaryButtonType=\"outlined\"\n  [showCloseButton]=\"false\"\n>\n  <div class=\"message\">{{ confirmMessage }}</div>\n</ui-dialog>\n", styles: ["::ng-deep .ui-dialog-wrapper{max-width:600px!important}\n"], dependencies: [{ kind: "component", type: DialogComponent, selector: "ui-dialog", inputs: ["title", "showCloseButton", "canCloseFn", "secondaryButtonLabel", "primaryButtonLabel", "secondaryButtonType", "primaryButtonType"], outputs: ["closeEvent", "secondaryButtonClickEvent", "primaryButtonClickEvent"] }] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: ConfirmDialogComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'ui-confirm-dialog', template: "<ui-dialog\n  [title]=\"title\"\n  [primaryButtonLabel]=\"confirmButtonText\"\n  [secondaryButtonLabel]=\"cancelButtonText\"\n  (primaryButtonClickEvent)=\"dialogRef.close(true)\"\n  (secondaryButtonClickEvent)=\"dialogRef.close(false)\"\n  primaryButtonType=\"destructive\"\n  secondaryButtonType=\"outlined\"\n  [showCloseButton]=\"false\"\n>\n  <div class=\"message\">{{ confirmMessage }}</div>\n</ui-dialog>\n", styles: ["::ng-deep .ui-dialog-wrapper{max-width:600px!important}\n"] }]
-        }], ctorParameters: function () {
-        return [{ type: i1$4.MatDialogRef }, { type: undefined, decorators: [{
-                        type: Inject,
-                        args: [MAT_DIALOG_DATA]
-                    }] }];
-    } });
-
-class ConfirmDialogComponentModule {
-}
-ConfirmDialogComponentModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: ConfirmDialogComponentModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-ConfirmDialogComponentModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.9", ngImport: i0, type: ConfirmDialogComponentModule, declarations: [ConfirmDialogComponent], imports: [CommonModule, MatDialogModule, ButtonComponentModule, DialogComponentModule], exports: [ConfirmDialogComponent] });
-ConfirmDialogComponentModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: ConfirmDialogComponentModule, providers: [
-        { provide: MAT_DIALOG_DATA, useValue: {} },
-        { provide: MatDialogRef, useValue: {} },
-    ], imports: [CommonModule, MatDialogModule, ButtonComponentModule, DialogComponentModule] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: ConfirmDialogComponentModule, decorators: [{
-            type: NgModule,
-            args: [{
-                    declarations: [ConfirmDialogComponent],
-                    exports: [ConfirmDialogComponent],
-                    providers: [
-                        { provide: MAT_DIALOG_DATA, useValue: {} },
-                        { provide: MatDialogRef, useValue: {} },
-                    ],
-                    imports: [CommonModule, MatDialogModule, ButtonComponentModule, DialogComponentModule],
-                }]
-        }] });
-
-/* eslint-disable no-underscore-dangle */
-class DatepickerComponent {
-    constructor() {
-        this.class = 'ui-datepicker';
-        /**
-         * Form field label
-         *
-         * @type {string}
-         * @memberof DatepickerComponent
-         */
-        this.label = '';
-        /**
-         * Input placeholder
-         *
-         * @type {string}
-         * @memberof DatepickerComponent
-         */
-        this.placeholder = '';
-        /**
-         * Input id
-         *
-         * @type {string}
-         * @memberof DatepickerComponent
-         */
-        this.id = '';
-        /**
-         * Input is update only on blur
-         *
-         * @type {Boolean}
-         * @memberof DatepickerComponent
-         */
-        this.updateOnBlur = false;
-        /**
-         * @ignore
-         */
-        this.onChange = (_) => { };
-        /**
-         * @ignore
-         */
-        this.onTouch = () => { };
-        /**
-         * Event emitted when the value is change - when used outside of form
-         *
-         * @type {Date}
-         * @memberof DatepickerComponent
-         */
-        this.changed = new EventEmitter();
-        this.range = new FormGroup({
-            start: new FormControl(null),
-            end: new FormControl(null),
-        });
-    }
-    /**
-     * Input field errors
-     *
-     * @type {string}
-     * @memberof DatepickerComponent
-     */
-    set errors(errors) {
-        this._errors = errors;
-        this.errorsLength = this.setErrorsLength();
-    }
-    get hint() {
-        if (this.hintMessage === undefined) {
-            return this.isRange ? 'MM/DD/YYYY - MM/DD/YYYY' : 'MM/DD/YYYY';
-        }
-        return this.hintMessage;
-    }
-    ngOnChanges() {
-        if (this.isRange) {
-            this.setRange();
-        }
-    }
-    // Set errors length for validation
-    // Consider only those errors which which are not empty
-    setErrorsLength() {
-        if (!!this._errors) {
-            return this._errors.filter(err => !!err).length > 0 ? true : false;
-        }
-        return false;
-    }
-    onValueChange(value) {
-        this.writeValue(value);
-        this.errorsLength = this.setErrorsLength();
-        if (!this.updateOnBlur) {
-            this.onTouch();
-        }
-        this.onChange(value);
-        this.changed.emit(value);
-    }
-    writeValue(value) {
-        this.value = value;
-        if (this.isRange) {
-            this.setRange();
-        }
-    }
-    registerOnChange(fn) {
-        this.onChange = fn;
-    }
-    registerOnTouched(fn) {
-        this.onTouch = fn;
-    }
-    setDisabledState(isDisabled) {
-        this.disabled = isDisabled;
-    }
-    dateRangeChange(start, end) {
-        if (start && end) {
-            this.onValueChange(this.getRange(start, end));
-        }
-    }
-    setRange() {
-        var _a;
-        if (typeof this.value === 'string') {
-            const [start, end] = (_a = this.value) === null || _a === void 0 ? void 0 : _a.split('-');
-            if (start) {
-                this.range.controls.start.setValue(new Date(start));
-            }
-            if (end) {
-                this.range.controls.end.setValue(new Date(end));
-            }
-        }
-    }
-    getRange(start, end) {
-        return `${start}-${end}`;
-    }
-}
-DatepickerComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: DatepickerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-DatepickerComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: DatepickerComponent, selector: "ui-datepicker", inputs: { label: "label", fieldName: "fieldName", placeholder: "placeholder", id: "id", value: "value", errors: "errors", isRange: "isRange", disabled: "disabled", required: "required", hintMessage: "hintMessage", updateOnBlur: "updateOnBlur" }, outputs: { changed: "changed" }, host: { properties: { "class": "this.class" } }, providers: [
-        {
-            provide: NG_VALUE_ACCESSOR,
-            useExisting: forwardRef(() => DatepickerComponent),
-            multi: true,
-        },
-    ], usesOnChanges: true, ngImport: i0, template: "<mat-form-field #uiDatepicker appearance=\"outline\" [color]=\"errorsLength ? 'warn' : 'accent'\">\n  <mat-label *ngIf=\"label\">{{ label }}<span *ngIf=\"required\"> *</span></mat-label>\n  <ng-container *ngIf=\"!isRange\">\n    <input *ngIf=\"!isRange\" matInput\n      [matDatepicker]=\"picker\"\n      matInput\n      (blur)=\"onTouch()\"\n      (dateChange)=\"onValueChange($event.value)\"\n      [id]=\"id!\"\n      [placeholder]=\"placeholder!\"\n      [value]=\"value\"\n      [disabled]=\"disabled\"\n      [name]=\"fieldName!\"\n    />\n    <mat-datepicker-toggle matIconSuffix [for]=\"picker\">\n      <ui-icon matDatepickerToggleIcon name=\"Calendar\" size=\"24\" color=\"inherit\"></ui-icon>\n    </mat-datepicker-toggle>\n    <mat-datepicker #picker></mat-datepicker>\n  </ng-container>\n  <ng-container *ngIf=\"isRange\">\n    <mat-date-range-input *ngIf=\"isRange\" [formGroup]=\"range\" [rangePicker]=\"rangePicker\" >\n      <input matStartDate #dateRangeStart formControlName=\"start\" placeholder=\"Start date\" >\n      <input matEndDate  #dateRangeEnd formControlName=\"end\" placeholder=\"End date\" (dateChange)=\"dateRangeChange(dateRangeStart.value, dateRangeEnd.value)\">\n    </mat-date-range-input>\n    <mat-datepicker-toggle matIconSuffix [for]=\"rangePicker\">\n      <ui-icon matDatepickerToggleIcon name=\"Calendar\" size=\"24\" color=\"inherit\"></ui-icon>\n    </mat-datepicker-toggle>\n    <mat-date-range-picker #rangePicker></mat-date-range-picker>\n  </ng-container>\n  <mat-hint class=\"info\" *ngIf=\"hint && !_errors\">{{ hint }}</mat-hint>\n  <mat-hint class=\"error\" *ngIf=\"errorsLength\">\n    <div class=\"errors\" *ngFor=\"let error of _errors\"><ui-icon name=\"Error\"></ui-icon>{{ error }}</div>\n  </mat-hint>\n</mat-form-field>\n", styles: [".ui-datepicker .mat-mdc-form-field{margin-top:0;min-width:296px}.ui-datepicker .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper{height:48px}.ui-datepicker .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper .mat-mdc-form-field-flex .mat-mdc-floating-label{top:22px}.ui-datepicker .mat-mdc-form-field.mat-form-field-appearance-outline .mdc-notched-outline{color:#888}.ui-datepicker .mat-mdc-form-field.mat-form-field-appearance-outline .mdc-notched-outline .mdc-floating-label--float-above{transform:translateY(-30px) scale(.75)}.ui-datepicker .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-form-field-infix{min-height:48px;max-height:48px;padding:4px 0;line-height:22px;display:inline-flex;align-items:center}.ui-datepicker .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-form-field-subscript-wrapper{padding:0 0 12px;margin-top:4px;font-size:12px;line-height:16px;position:relative}.ui-datepicker .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-form-field-subscript-wrapper .mat-form-field-hint-spacer{display:none}.ui-datepicker .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-form-field-hint.info{color:#888;width:100%}.ui-datepicker .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-form-field-bottom-align:before{height:0}.ui-datepicker .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-form-field-hint-wrapper{padding:0}.ui-datepicker .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-form-field-hint.error,.ui-datepicker .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-form-field-hint.error svg{color:#cb7b7a}.ui-datepicker .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-form-field-hint.error{display:flex}.ui-datepicker .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-form-field-hint.error ui-icon{margin-right:9px}.ui-datepicker .mat-mdc-form-field.mat-warn.mat-form-field-appearance-outline:not(.mdc-text-field--disabled) .mat-mdc-form-field-flex:hover .mdc-notched-outline .mdc-notched-outline__leading,.ui-datepicker .mat-mdc-form-field.mat-warn.mat-form-field-appearance-outline:not(.mdc-text-field--disabled) .mat-mdc-form-field-flex:hover .mdc-notched-outline .mdc-notched-outline__trailing,.ui-datepicker .mat-mdc-form-field.mat-warn.mat-form-field-appearance-outline:not(.mdc-text-field--disabled) .mat-mdc-form-field-flex:hover .mdc-notched-outline .mdc-notched-outline__notch{border-color:#cb7b7a}.ui-datepicker .mat-mdc-form-field.mat-warn.mat-form-field-appearance-outline .mdc-notched-outline .mdc-notched-outline__leading,.ui-datepicker .mat-mdc-form-field.mat-warn.mat-form-field-appearance-outline .mdc-notched-outline .mdc-notched-outline__trailing,.ui-datepicker .mat-mdc-form-field.mat-warn.mat-form-field-appearance-outline .mdc-notched-outline .mdc-notched-outline__notch{border-color:#cb7b7a}.ui-datepicker .mat-mdc-form-field.mat-warn.mat-focused .mat-mdc-text-field-wrapper .mat-mdc-form-field-flex .mat-mdc-form-field-infix .mat-form-field-label mat-label{color:#cb7b7a}.ui-datepicker .mat-mdc-form-field .mat-mdc-form-field-hint.error{display:flex;flex-flow:column;row-gap:4px}.ui-datepicker .mat-mdc-form-field .mat-mdc-form-field-hint.error .errors{display:flex}.ui-datepicker .mat-mdc-form-field.mat-accent.mat-form-field-appearance-outline:not(.mat-form-field-disabled) .mat-mdc-form-field-flex:hover .mdc-notched-outline{color:#276678}.ui-datepicker .mat-mdc-form-field.mat-accent.mat-focused .mat-mdc-text-field-wrapper .mat-mdc-form-field-flex .mat-mdc-form-field-infix .mat-form-field-label mat-label{color:#276678}.ui-datepicker .mat-mdc-form-field.mat-form-field-disabled.mat-form-field-appearance-outline .mdc-notched-outline{color:#e0e0e0}.mat-datepicker-content .mat-mdc-button.mat-unthemed .mdc-button__label>span{font-weight:600}.mat-datepicker-content.mat-datepicker-content.mat-accent .mat-calendar-body-cell:not(.mat-calendar-body-disabled):hover>.mat-calendar-body-cell-content:not(.mat-calendar-body-selected):not(.mat-calendar-body-comparison-identical){background-color:#e9f0f1}.mat-datepicker-content.mat-datepicker-content.mat-accent .mat-calendar-body-in-range:before{background-color:#e9f0f1}\n"], dependencies: [{ kind: "directive", type: i1$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i2$3.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i2$3.MatLabel, selector: "mat-label" }, { kind: "directive", type: i2$3.MatHint, selector: "mat-hint", inputs: ["align", "id"] }, { kind: "directive", type: i2$3.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "directive", type: i3.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly"], exportAs: ["matInput"] }, { kind: "component", type: IconComponent, selector: "ui-icon", inputs: ["size", "cssClass", "name", "color"] }, { kind: "directive", type: i1$3.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$3.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$3.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$3.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: i6$2.MatDatepicker, selector: "mat-datepicker", exportAs: ["matDatepicker"] }, { kind: "directive", type: i6$2.MatDatepickerInput, selector: "input[matDatepicker]", inputs: ["matDatepicker", "min", "max", "matDatepickerFilter"], exportAs: ["matDatepickerInput"] }, { kind: "component", type: i6$2.MatDatepickerToggle, selector: "mat-datepicker-toggle", inputs: ["for", "tabIndex", "aria-label", "disabled", "disableRipple"], exportAs: ["matDatepickerToggle"] }, { kind: "directive", type: i6$2.MatDatepickerToggleIcon, selector: "[matDatepickerToggleIcon]" }, { kind: "component", type: i6$2.MatDateRangeInput, selector: "mat-date-range-input", inputs: ["rangePicker", "required", "dateFilter", "min", "max", "disabled", "separator", "comparisonStart", "comparisonEnd"], exportAs: ["matDateRangeInput"] }, { kind: "directive", type: i6$2.MatStartDate, selector: "input[matStartDate]", inputs: ["errorStateMatcher"], outputs: ["dateChange", "dateInput"] }, { kind: "directive", type: i6$2.MatEndDate, selector: "input[matEndDate]", inputs: ["errorStateMatcher"], outputs: ["dateChange", "dateInput"] }, { kind: "component", type: i6$2.MatDateRangePicker, selector: "mat-date-range-picker", exportAs: ["matDateRangePicker"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: DatepickerComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'ui-datepicker', encapsulation: ViewEncapsulation.None, providers: [
-                        {
-                            provide: NG_VALUE_ACCESSOR,
-                            useExisting: forwardRef(() => DatepickerComponent),
-                            multi: true,
-                        },
-                    ], changeDetection: ChangeDetectionStrategy.OnPush, template: "<mat-form-field #uiDatepicker appearance=\"outline\" [color]=\"errorsLength ? 'warn' : 'accent'\">\n  <mat-label *ngIf=\"label\">{{ label }}<span *ngIf=\"required\"> *</span></mat-label>\n  <ng-container *ngIf=\"!isRange\">\n    <input *ngIf=\"!isRange\" matInput\n      [matDatepicker]=\"picker\"\n      matInput\n      (blur)=\"onTouch()\"\n      (dateChange)=\"onValueChange($event.value)\"\n      [id]=\"id!\"\n      [placeholder]=\"placeholder!\"\n      [value]=\"value\"\n      [disabled]=\"disabled\"\n      [name]=\"fieldName!\"\n    />\n    <mat-datepicker-toggle matIconSuffix [for]=\"picker\">\n      <ui-icon matDatepickerToggleIcon name=\"Calendar\" size=\"24\" color=\"inherit\"></ui-icon>\n    </mat-datepicker-toggle>\n    <mat-datepicker #picker></mat-datepicker>\n  </ng-container>\n  <ng-container *ngIf=\"isRange\">\n    <mat-date-range-input *ngIf=\"isRange\" [formGroup]=\"range\" [rangePicker]=\"rangePicker\" >\n      <input matStartDate #dateRangeStart formControlName=\"start\" placeholder=\"Start date\" >\n      <input matEndDate  #dateRangeEnd formControlName=\"end\" placeholder=\"End date\" (dateChange)=\"dateRangeChange(dateRangeStart.value, dateRangeEnd.value)\">\n    </mat-date-range-input>\n    <mat-datepicker-toggle matIconSuffix [for]=\"rangePicker\">\n      <ui-icon matDatepickerToggleIcon name=\"Calendar\" size=\"24\" color=\"inherit\"></ui-icon>\n    </mat-datepicker-toggle>\n    <mat-date-range-picker #rangePicker></mat-date-range-picker>\n  </ng-container>\n  <mat-hint class=\"info\" *ngIf=\"hint && !_errors\">{{ hint }}</mat-hint>\n  <mat-hint class=\"error\" *ngIf=\"errorsLength\">\n    <div class=\"errors\" *ngFor=\"let error of _errors\"><ui-icon name=\"Error\"></ui-icon>{{ error }}</div>\n  </mat-hint>\n</mat-form-field>\n", styles: [".ui-datepicker .mat-mdc-form-field{margin-top:0;min-width:296px}.ui-datepicker .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper{height:48px}.ui-datepicker .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper .mat-mdc-form-field-flex .mat-mdc-floating-label{top:22px}.ui-datepicker .mat-mdc-form-field.mat-form-field-appearance-outline .mdc-notched-outline{color:#888}.ui-datepicker .mat-mdc-form-field.mat-form-field-appearance-outline .mdc-notched-outline .mdc-floating-label--float-above{transform:translateY(-30px) scale(.75)}.ui-datepicker .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-form-field-infix{min-height:48px;max-height:48px;padding:4px 0;line-height:22px;display:inline-flex;align-items:center}.ui-datepicker .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-form-field-subscript-wrapper{padding:0 0 12px;margin-top:4px;font-size:12px;line-height:16px;position:relative}.ui-datepicker .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-form-field-subscript-wrapper .mat-form-field-hint-spacer{display:none}.ui-datepicker .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-form-field-hint.info{color:#888;width:100%}.ui-datepicker .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-form-field-bottom-align:before{height:0}.ui-datepicker .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-form-field-hint-wrapper{padding:0}.ui-datepicker .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-form-field-hint.error,.ui-datepicker .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-form-field-hint.error svg{color:#cb7b7a}.ui-datepicker .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-form-field-hint.error{display:flex}.ui-datepicker .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-form-field-hint.error ui-icon{margin-right:9px}.ui-datepicker .mat-mdc-form-field.mat-warn.mat-form-field-appearance-outline:not(.mdc-text-field--disabled) .mat-mdc-form-field-flex:hover .mdc-notched-outline .mdc-notched-outline__leading,.ui-datepicker .mat-mdc-form-field.mat-warn.mat-form-field-appearance-outline:not(.mdc-text-field--disabled) .mat-mdc-form-field-flex:hover .mdc-notched-outline .mdc-notched-outline__trailing,.ui-datepicker .mat-mdc-form-field.mat-warn.mat-form-field-appearance-outline:not(.mdc-text-field--disabled) .mat-mdc-form-field-flex:hover .mdc-notched-outline .mdc-notched-outline__notch{border-color:#cb7b7a}.ui-datepicker .mat-mdc-form-field.mat-warn.mat-form-field-appearance-outline .mdc-notched-outline .mdc-notched-outline__leading,.ui-datepicker .mat-mdc-form-field.mat-warn.mat-form-field-appearance-outline .mdc-notched-outline .mdc-notched-outline__trailing,.ui-datepicker .mat-mdc-form-field.mat-warn.mat-form-field-appearance-outline .mdc-notched-outline .mdc-notched-outline__notch{border-color:#cb7b7a}.ui-datepicker .mat-mdc-form-field.mat-warn.mat-focused .mat-mdc-text-field-wrapper .mat-mdc-form-field-flex .mat-mdc-form-field-infix .mat-form-field-label mat-label{color:#cb7b7a}.ui-datepicker .mat-mdc-form-field .mat-mdc-form-field-hint.error{display:flex;flex-flow:column;row-gap:4px}.ui-datepicker .mat-mdc-form-field .mat-mdc-form-field-hint.error .errors{display:flex}.ui-datepicker .mat-mdc-form-field.mat-accent.mat-form-field-appearance-outline:not(.mat-form-field-disabled) .mat-mdc-form-field-flex:hover .mdc-notched-outline{color:#276678}.ui-datepicker .mat-mdc-form-field.mat-accent.mat-focused .mat-mdc-text-field-wrapper .mat-mdc-form-field-flex .mat-mdc-form-field-infix .mat-form-field-label mat-label{color:#276678}.ui-datepicker .mat-mdc-form-field.mat-form-field-disabled.mat-form-field-appearance-outline .mdc-notched-outline{color:#e0e0e0}.mat-datepicker-content .mat-mdc-button.mat-unthemed .mdc-button__label>span{font-weight:600}.mat-datepicker-content.mat-datepicker-content.mat-accent .mat-calendar-body-cell:not(.mat-calendar-body-disabled):hover>.mat-calendar-body-cell-content:not(.mat-calendar-body-selected):not(.mat-calendar-body-comparison-identical){background-color:#e9f0f1}.mat-datepicker-content.mat-datepicker-content.mat-accent .mat-calendar-body-in-range:before{background-color:#e9f0f1}\n"] }]
-        }], propDecorators: { class: [{
-                type: HostBinding
-            }], label: [{
-                type: Input
-            }], fieldName: [{
-                type: Input
-            }], placeholder: [{
-                type: Input
-            }], id: [{
-                type: Input
-            }], value: [{
-                type: Input
-            }], errors: [{
-                type: Input
-            }], isRange: [{
-                type: Input
-            }], disabled: [{
-                type: Input
-            }], required: [{
-                type: Input
-            }], hintMessage: [{
-                type: Input
-            }], updateOnBlur: [{
-                type: Input
-            }], changed: [{
-                type: Output
-            }] } });
-
-class DatepickerComponentModule {
-}
-DatepickerComponentModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: DatepickerComponentModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-DatepickerComponentModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.9", ngImport: i0, type: DatepickerComponentModule, declarations: [DatepickerComponent], imports: [CommonModule,
-        MatFormFieldModule,
-        MatInputModule,
-        IconComponentModule,
-        FormsModule,
-        ReactiveFormsModule,
-        MatDatepickerModule,
-        MatNativeDateModule], exports: [DatepickerComponent] });
-DatepickerComponentModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: DatepickerComponentModule, imports: [CommonModule,
-        MatFormFieldModule,
-        MatInputModule,
-        IconComponentModule,
-        FormsModule,
-        ReactiveFormsModule,
-        MatDatepickerModule,
-        MatNativeDateModule] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: DatepickerComponentModule, decorators: [{
-            type: NgModule,
-            args: [{
-                    declarations: [DatepickerComponent],
-                    imports: [
-                        CommonModule,
-                        MatFormFieldModule,
-                        MatInputModule,
-                        IconComponentModule,
-                        FormsModule,
-                        ReactiveFormsModule,
-                        MatDatepickerModule,
-                        MatNativeDateModule,
-                    ],
-                    providers: [],
-                    exports: [DatepickerComponent],
-                }]
-        }] });
-
-class RatingComponent {
-    set length(length) {
-        this.items = Array(Math.max(length, this.MIN_LENGTH))
-            .fill(0)
-            .map((x, i) => i);
-    }
-    constructor() {
-        this.MIN_LENGTH = 0;
-        this.DEFAULT_LENGTH = 5;
-        this.items = [];
-        // todo support stars rating
-        this.theme = 'block';
-        this.barWidth = 35;
-        this.valueChange = new EventEmitter();
-        this.length = this.DEFAULT_LENGTH;
-    }
-    select(index) {
-        this.value = index + 1;
-        this.valueChange.emit(this.value);
-    }
-    onHover(index) {
-        this.hoverIndex = index + 1;
-    }
-}
-RatingComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: RatingComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-RatingComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: RatingComponent, selector: "ui-rating", inputs: { value: "value", theme: "theme", barWidth: "barWidth", length: "length" }, outputs: { valueChange: "valueChange" }, ngImport: i0, template: "<div class=\"rating\" (mouseleave)=\"onHover(-1)\">\n  <div class=\"rating-item\" *ngFor=\"let item of items\" (click)=\"select(item)\" (mouseenter)=\"onHover(item)\"\n    [ngClass]=\"{ 'rating-item-selected': item < value, 'rating-item-hover': item < hoverIndex }\" [ngStyle]=\"{'width.px': barWidth}\">\n  </div>\n</div>\n", styles: [".rating{display:flex;align-content:center;justify-content:flex-start;align-items:center}.rating-item{width:35px;height:16px;border:1px solid #E0E0E0;border-left:0;cursor:pointer}.rating-item-hover{border:0;background-color:#b5ddd5}.rating-item-hover:not(:first-child){border-left:1px solid #ffffff}.rating-item:first-child{border-radius:4px 0 0 4px}.rating-item:first-child:not(.rating-item-selected):not(.rating-item-hover){border-left:1px solid #E0E0E0}.rating-item:last-child{border-radius:0 4px 4px 0}.rating-item:first-child:last-child{border-radius:4px}.rating-item-selected{border:0;background-color:#46a997}.rating-item-selected:not(:first-child){border-left:1px solid #ffffff}\n"], dependencies: [{ kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: RatingComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'ui-rating', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"rating\" (mouseleave)=\"onHover(-1)\">\n  <div class=\"rating-item\" *ngFor=\"let item of items\" (click)=\"select(item)\" (mouseenter)=\"onHover(item)\"\n    [ngClass]=\"{ 'rating-item-selected': item < value, 'rating-item-hover': item < hoverIndex }\" [ngStyle]=\"{'width.px': barWidth}\">\n  </div>\n</div>\n", styles: [".rating{display:flex;align-content:center;justify-content:flex-start;align-items:center}.rating-item{width:35px;height:16px;border:1px solid #E0E0E0;border-left:0;cursor:pointer}.rating-item-hover{border:0;background-color:#b5ddd5}.rating-item-hover:not(:first-child){border-left:1px solid #ffffff}.rating-item:first-child{border-radius:4px 0 0 4px}.rating-item:first-child:not(.rating-item-selected):not(.rating-item-hover){border-left:1px solid #E0E0E0}.rating-item:last-child{border-radius:0 4px 4px 0}.rating-item:first-child:last-child{border-radius:4px}.rating-item-selected{border:0;background-color:#46a997}.rating-item-selected:not(:first-child){border-left:1px solid #ffffff}\n"] }]
-        }], ctorParameters: function () { return []; }, propDecorators: { value: [{
-                type: Input
-            }], theme: [{
-                type: Input
-            }], barWidth: [{
-                type: Input
-            }], length: [{
-                type: Input
-            }], valueChange: [{
-                type: Output
-            }] } });
-
-class RatingComponentModule {
-}
-RatingComponentModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: RatingComponentModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-RatingComponentModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.9", ngImport: i0, type: RatingComponentModule, declarations: [RatingComponent], imports: [CommonModule], exports: [RatingComponent] });
-RatingComponentModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: RatingComponentModule, imports: [CommonModule] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: RatingComponentModule, decorators: [{
-            type: NgModule,
-            args: [{
-                    declarations: [RatingComponent],
-                    imports: [CommonModule],
-                    exports: [RatingComponent],
-                }]
-        }] });
-
-class ToggleComponent {
-    constructor() {
-        /**
-         * The `selected` property determines the current state of the toggle switch.
-         *
-         * @type {boolean}
-         * @default false
-         * @memberof ToggleComponent
-         */
-        this.selected = false;
-        /**
-         * The `disabled` property determines whether the toggle switch is disabled.
-         *
-         * @type {boolean}
-         * @default false
-         * @memberof ToggleComponent
-         */
-        this.disabled = false;
-        /**
-         * The `toggle` event is triggered when the state of the toggle switch changes. It returns the new state.
-         *
-         * @type {event}
-         * @memberof ToggleComponent
-         */
-        this.toggle = new EventEmitter();
-        this.onChange = () => { };
-        this.onTouched = () => { };
-    }
-    onToggle() {
-        if (!this.disabled) {
-            this.selected = !this.selected;
-            this.toggle.emit(this.selected);
-        }
-    }
-    writeValue(state) {
-        if (state) {
-            this.selected = state;
-        }
-    }
-    registerOnChange(fn) {
-        this.onChange = fn;
-    }
-    registerOnTouched(fn) {
-        this.onTouched = fn;
-    }
-    setDisabledState(isDisabled) {
-        this.disabled = isDisabled;
-    }
-}
-ToggleComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: ToggleComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-ToggleComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: ToggleComponent, selector: "ui-toggle", inputs: { selected: "selected", disabled: "disabled" }, outputs: { toggle: "toggle" }, providers: [
-        {
-            provide: NG_VALUE_ACCESSOR,
-            useExisting: forwardRef(() => ToggleComponent),
-            multi: true,
-        },
-    ], ngImport: i0, template: "<div\n  [tabIndex]=\"0\"\n  class=\"toggle-container\"\n  [ngClass]=\"{ 'active': selected, 'disabled': disabled }\"\n  (click)=\"onToggle()\"\n>\n  <div class=\"knob\"></div>\n</div>\n", styles: [":host .toggle-container{width:32px;height:16px;border-radius:16px;background:#888888;display:flex;align-items:center;padding:0 2px;cursor:pointer}:host .toggle-container:focus{outline:1px dashed #888888;outline-offset:4px}:host .toggle-container .knob{height:12px;width:12px;border-radius:16px;background:#F6F6F6;transition:transform .3s}:host .toggle-container.disabled{background:#E0E0E0;pointer-events:none}:host .toggle-container.disabled:focus{outline:none}:host .toggle-container.active{background:#46A997}:host .toggle-container.active.disabled{opacity:.5}:host .toggle-container.active .knob{transform:translate(16px)}\n"], dependencies: [{ kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: ToggleComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'ui-toggle', providers: [
-                        {
-                            provide: NG_VALUE_ACCESSOR,
-                            useExisting: forwardRef(() => ToggleComponent),
-                            multi: true,
-                        },
-                    ], template: "<div\n  [tabIndex]=\"0\"\n  class=\"toggle-container\"\n  [ngClass]=\"{ 'active': selected, 'disabled': disabled }\"\n  (click)=\"onToggle()\"\n>\n  <div class=\"knob\"></div>\n</div>\n", styles: [":host .toggle-container{width:32px;height:16px;border-radius:16px;background:#888888;display:flex;align-items:center;padding:0 2px;cursor:pointer}:host .toggle-container:focus{outline:1px dashed #888888;outline-offset:4px}:host .toggle-container .knob{height:12px;width:12px;border-radius:16px;background:#F6F6F6;transition:transform .3s}:host .toggle-container.disabled{background:#E0E0E0;pointer-events:none}:host .toggle-container.disabled:focus{outline:none}:host .toggle-container.active{background:#46A997}:host .toggle-container.active.disabled{opacity:.5}:host .toggle-container.active .knob{transform:translate(16px)}\n"] }]
-        }], propDecorators: { selected: [{
-                type: Input
-            }], disabled: [{
-                type: Input
-            }], toggle: [{
-                type: Output
-            }] } });
-
-class ToggleComponentModule {
-}
-ToggleComponentModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: ToggleComponentModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-ToggleComponentModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.9", ngImport: i0, type: ToggleComponentModule, declarations: [ToggleComponent], imports: [CommonModule] });
-ToggleComponentModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: ToggleComponentModule, imports: [CommonModule] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: ToggleComponentModule, decorators: [{
-            type: NgModule,
-            args: [{
-                    declarations: [ToggleComponent],
-                    imports: [CommonModule],
-                }]
-        }] });
-
-var AvatarSize;
-(function (AvatarSize) {
-    AvatarSize["SMALL"] = "small";
-    AvatarSize["MEDIUM"] = "medium";
-    AvatarSize["LARGE"] = "large";
-})(AvatarSize || (AvatarSize = {}));
-const iconSize = {
-    small: '16',
-    medium: '24',
-    large: '80',
-};
-
-class NameInitialsPipe {
-    transform(value) {
-        var _a, _b, _c, _d;
-        const initials = value.split(' ').filter(Boolean);
-        if (initials.length > 1) {
-            return initials.map(initial => initial[0].toUpperCase()).join('');
-        }
-        else {
-            const firstLetters = value.substring(0, 2);
-            return `${(_b = (_a = firstLetters[0]) === null || _a === void 0 ? void 0 : _a.toUpperCase()) !== null && _b !== void 0 ? _b : ''}${(_d = (_c = firstLetters[1]) === null || _c === void 0 ? void 0 : _c.toLowerCase()) !== null && _d !== void 0 ? _d : ''}`;
-        }
-    }
-}
-NameInitialsPipe.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: NameInitialsPipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe });
-NameInitialsPipe.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "15.2.9", ngImport: i0, type: NameInitialsPipe, name: "nameInitials" });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: NameInitialsPipe, decorators: [{
-            type: Pipe,
-            args: [{
-                    name: 'nameInitials',
-                }]
-        }] });
-
-class AvatarComponent {
-    constructor() {
-        /**
-         * Input property for specifying the size of the avatar.
-         * @type {AvatarSize}
-         * @default AvatarSize.SMALL
-         * @memberof AvatarComponent
-         */
-        this.size = AvatarSize.SMALL;
-        /**
-         * Input property for specifying the URL of the image to display in the avatar.
-         * @type {string}
-         * @memberof AvatarComponent
-         */
-        this.imageUrl = '';
-        /**
-         * Input property for specifying the initials to display in the avatar.
-         * @type {string}
-         * @memberof AvatarComponent
-         */
-        this.name = '';
-        /**
-         * Input property for specifying the tooltip text for edit.
-         * @type {string}
-         * @memberof AvatarComponent
-         */
-        this.tooltipText = '';
-        /**
-         * Input property that makes avatar clickable.
-         * @type {boolean}
-         * @memberof AvatarComponent
-         */
-        this.allowClick = false;
-        /**
-         * Event emitted when the avatar is clicked.
-         * @type {void}
-         * @memberof AvatarComponent
-         */
-        this.avatarClick = new EventEmitter();
-        this.iconSize = iconSize;
-        this.avatarSize = AvatarSize;
-    }
-    onAvatarClick() {
-        this.avatarClick.emit();
-    }
-    get clickAllowance() {
-        return this.allowClick ? 'clickable' : 'non-clickable';
-    }
-}
-AvatarComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: AvatarComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-AvatarComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: AvatarComponent, selector: "ui-avatar", inputs: { size: "size", imageUrl: "imageUrl", name: "name", tooltipText: "tooltipText", allowClick: "allowClick" }, outputs: { avatarClick: "avatarClick" }, ngImport: i0, template: "<div\n  class=\"avatar-container\"\n  [attr.type]=\"!imageUrl && !name ? 'icon' : 'initials'\"\n  [ngClass]=\"[size, clickAllowance]\"\n  (click)=\"onAvatarClick()\"\n>\n  <span *ngIf=\"name && !imageUrl\">\n    {{ name | nameInitials }}\n  </span>\n  <img *ngIf=\"imageUrl\" [attr.src]=\"imageUrl\" [alt]=\"'profile-image'\">\n  <ui-icon color=\"dark\" [size]=\"iconSize[size]\" *ngIf=\"!imageUrl && !name\" [name]=\"'User-profile'\"></ui-icon>\n</div>\n\n", styles: [":host .clickable{cursor:pointer}:host .non-clickable{pointer-events:none}:host .avatar-container{font-family:Open Sans,sans-serif;font-weight:400;display:flex;justify-content:center;align-items:center;border-radius:100%;background:#CBD6CB;position:relative;-webkit-user-select:none;user-select:none}:host .avatar-container[type=icon]{background:#E0E0E0}:host .avatar-container img{width:100%;height:100%;object-fit:cover;border-radius:100%}:host .avatar-container.small{width:24px;height:24px;font-size:10px}:host .avatar-container.medium{width:48px;height:48px;font-size:20px}:host .avatar-container.large{width:120px;height:120px;font-size:50px;letter-spacing:-2}:host .avatar-container .edit-avatar{display:flex;justify-content:center;align-items:center;position:absolute;right:0;bottom:0;background:#F6F6F6;width:32px;height:32px;border-radius:100%;cursor:pointer;-webkit-backdrop-filter:drop-shadow(0px 8px 24px 4px #000000,8%);backdrop-filter:drop-shadow(0px 8px 24px 4px #000000,8%)}:host .avatar-container .edit-avatar:hover{background:#EDEDED}:host .avatar-container .edit-avatar:active{background:#E0E0E0}:host .avatar-container .edit-avatar:focus{outline:1px dashed #888888;outline-offset:4px}\n"], dependencies: [{ kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: IconComponent, selector: "ui-icon", inputs: ["size", "cssClass", "name", "color"] }, { kind: "pipe", type: NameInitialsPipe, name: "nameInitials" }] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: AvatarComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'ui-avatar', template: "<div\n  class=\"avatar-container\"\n  [attr.type]=\"!imageUrl && !name ? 'icon' : 'initials'\"\n  [ngClass]=\"[size, clickAllowance]\"\n  (click)=\"onAvatarClick()\"\n>\n  <span *ngIf=\"name && !imageUrl\">\n    {{ name | nameInitials }}\n  </span>\n  <img *ngIf=\"imageUrl\" [attr.src]=\"imageUrl\" [alt]=\"'profile-image'\">\n  <ui-icon color=\"dark\" [size]=\"iconSize[size]\" *ngIf=\"!imageUrl && !name\" [name]=\"'User-profile'\"></ui-icon>\n</div>\n\n", styles: [":host .clickable{cursor:pointer}:host .non-clickable{pointer-events:none}:host .avatar-container{font-family:Open Sans,sans-serif;font-weight:400;display:flex;justify-content:center;align-items:center;border-radius:100%;background:#CBD6CB;position:relative;-webkit-user-select:none;user-select:none}:host .avatar-container[type=icon]{background:#E0E0E0}:host .avatar-container img{width:100%;height:100%;object-fit:cover;border-radius:100%}:host .avatar-container.small{width:24px;height:24px;font-size:10px}:host .avatar-container.medium{width:48px;height:48px;font-size:20px}:host .avatar-container.large{width:120px;height:120px;font-size:50px;letter-spacing:-2}:host .avatar-container .edit-avatar{display:flex;justify-content:center;align-items:center;position:absolute;right:0;bottom:0;background:#F6F6F6;width:32px;height:32px;border-radius:100%;cursor:pointer;-webkit-backdrop-filter:drop-shadow(0px 8px 24px 4px #000000,8%);backdrop-filter:drop-shadow(0px 8px 24px 4px #000000,8%)}:host .avatar-container .edit-avatar:hover{background:#EDEDED}:host .avatar-container .edit-avatar:active{background:#E0E0E0}:host .avatar-container .edit-avatar:focus{outline:1px dashed #888888;outline-offset:4px}\n"] }]
-        }], propDecorators: { size: [{
-                type: Input
-            }], imageUrl: [{
-                type: Input
-            }], name: [{
-                type: Input
-            }], tooltipText: [{
-                type: Input
-            }], allowClick: [{
-                type: Input
-            }], avatarClick: [{
-                type: Output
-            }] } });
-
-class AvatarComponentModule {
-}
-AvatarComponentModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: AvatarComponentModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-AvatarComponentModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.9", ngImport: i0, type: AvatarComponentModule, declarations: [AvatarComponent, NameInitialsPipe], imports: [CommonModule, IconComponentModule, MatTooltipModule], exports: [AvatarComponent] });
-AvatarComponentModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: AvatarComponentModule, imports: [CommonModule, IconComponentModule, MatTooltipModule] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: AvatarComponentModule, decorators: [{
-            type: NgModule,
-            args: [{
-                    declarations: [AvatarComponent, NameInitialsPipe],
-                    imports: [CommonModule, IconComponentModule, MatTooltipModule],
-                    exports: [AvatarComponent],
-                }]
-        }] });
-
-/* eslint-disable */
-/* Components */
-// Alert Banner
-
-/**
- * Generated bundle index. Do not edit.
- */
-
-export { AlertBannerComponent, AlertBannerComponentModule, AvatarComponent, AvatarComponentModule, BannerActionComponent, BannerActionComponentModule, ButtonComponent, ButtonComponentModule, CardComponent, CardComponentModule, CheckboxComponent, CheckboxComponentModule, ColumnAlignmentEnum, ColumnTypeEnum, ConfirmDialogComponent, ConfirmDialogComponentModule, CreateAccountComponent, CreateAccountComponentModule, CreatePasswordComponent, CreatePasswordComponentModule, DataPropertyGetterPipe, DatepickerComponent, DatepickerComponentModule, DialogComponent, DialogComponentModule, DialogService, DropdownComponent, DropdownComponentModule, ElevationShadowComponent, ElevationShadowComponentModule, ElevationType, FieldComponent, FieldComponentModule, FileUploadComponent, FileUploadComponentModule, ForgotPasswordComponent, ForgotPasswordComponentModule, IconComponent, IconComponentModule, IconLabelComponent, IconLabelComponentModule, LabelComponent, LabelComponentModule, LabelSizeEnum, LoginComponent, LoginComponentModule, LogoComponent, LogoComponentModule, LogoPathEnum, LogoTypeEnum, NavbarComponent, NavbarComponentModule, NavigationComponent, NavigationComponentModule, PaginatorComponent, PaginatorComponentModule, ProgressBarComponent, ProgressBarComponentModule, RadioButtonComponent, RadioButtonComponentModule, RatingComponent, RatingComponentModule, SnackbarComponent, SnackbarComponentModule, SnackbarService, SpinnerComponent, SpinnerComponentModule, TableComponent, TableComponentModule, TagComponent, TagComponentModule, ToggleComponent, ToggleComponentModule, TooltipComponent, TooltipComponentModule, TooltipPositionType, preloadLang };
-//# sourceMappingURL=testgorilla-tgo-ui.mjs.map