@agorapulse/ui-components 2.5.1 → 13.0.2

package/fesm2015/agorapulse-ui-components.js

@@ -1,4176 +0,0 @@
-import * as i0 from '@angular/core';
-import { EventEmitter, Component, ChangeDetectionStrategy, forwardRef, Input, Output, ChangeDetectorRef, ViewChild, Inject, HostListener, InjectionToken, Renderer2, ElementRef, HostBinding, Directive, Optional, ComponentFactoryResolver, ApplicationRef, Injector, NgModule, Injectable, Attribute } from '@angular/core';
-import { CommonModule } from '@angular/common';
-import { OverlayContainer, Overlay, OverlayPositionBuilder, OverlayModule, OverlayConfig } from '@angular/cdk/overlay';
-import { FlexLayoutModule } from '@angular/flex-layout';
-import { NG_VALUE_ACCESSOR, NG_VALIDATORS, FormControl, FormsModule, ReactiveFormsModule } from '@angular/forms';
-import { MatBadgeModule } from '@angular/material/badge';
-import { MatBottomSheetModule } from '@angular/material/bottom-sheet';
-import { MatButtonModule } from '@angular/material/button';
-import { MatButtonToggleModule } from '@angular/material/button-toggle';
-import { MatCardModule } from '@angular/material/card';
-import { MatCheckboxModule } from '@angular/material/checkbox';
-import { MatChipsModule } from '@angular/material/chips';
-import { MatDialogRef, MAT_DIALOG_DATA, MatDialog, MatDialogModule } from '@angular/material/dialog';
-import { MatDividerModule } from '@angular/material/divider';
-import { MatExpansionModule } from '@angular/material/expansion';
-import { MatGridListModule } from '@angular/material/grid-list';
-import { MatIconModule } from '@angular/material/icon';
-import { MatListModule } from '@angular/material/list';
-import { MatMenuTrigger, MatMenuModule } from '@angular/material/menu';
-import { MatProgressBarModule } from '@angular/material/progress-bar';
-import { MatProgressSpinnerModule } from '@angular/material/progress-spinner';
-import { MatRadioModule } from '@angular/material/radio';
-import { MatSidenavModule } from '@angular/material/sidenav';
-import { MatSliderModule } from '@angular/material/slider';
-import { MatSlideToggleModule } from '@angular/material/slide-toggle';
-import { MatSnackBarRef, MAT_SNACK_BAR_DATA, MatSnackBarModule } from '@angular/material/snack-bar';
-import { MatStepperModule } from '@angular/material/stepper';
-import { MatTableModule } from '@angular/material/table';
-import { MatTabsModule, MAT_TABS_CONFIG } from '@angular/material/tabs';
-import { MatToolbarModule } from '@angular/material/toolbar';
-import { NgSelectModule } from '@ng-select/ng-select';
-import { NgxDaterangepickerMd } from 'ngx-daterangepicker-material';
-import moment from 'moment';
-import { trigger, transition, style, animate, AnimationBuilder } from '@angular/animations';
-import { Subject, of, fromEvent, BehaviorSubject, merge } from 'rxjs';
-import { takeUntil, debounceTime, distinctUntilChanged, tap, switchMap, catchError, map, delay } from 'rxjs/operators';
-import { CdkVirtualScrollViewport } from '@angular/cdk/scrolling';
-import format from 'date-fns/format';
-import parse from 'date-fns/parse';
-import IMask from 'imask';
-import * as i1 from '@angular/platform-browser';
-import { DomSanitizer } from '@angular/platform-browser';
-import { ComponentPortal, PortalInjector } from '@angular/cdk/portal';
-import { AgorapulseUiSymbolModule } from '@agorapulse/ui-symbol';
-import { IMaskModule } from 'angular-imask';
-
-class AddCommentComponent {
-    constructor() {
-        this.placeholder = 'Add a comment';
-        this.disable = false;
-        this.action = new EventEmitter();
-        this._commentValue = '';
-        this.propagateChange = () => { };
-    }
-    get commentValue() {
-        return this._commentValue;
-    }
-    set commentValue(value) {
-        this._commentValue = value;
-        this.propagateChange(value);
-    }
-    registerOnChange(fn) {
-        this.propagateChange = fn;
-    }
-    registerOnTouched(fn) { }
-    setDisabledState(isDisabled) {
-        this.disable = isDisabled;
-    }
-    writeValue(obj) {
-        this._commentValue = obj != undefined ? obj : '';
-        this.propagateChange(this._commentValue);
-    }
-    onChange(event) {
-        const value = event.target.value;
-        this._commentValue = value != undefined ? value : '';
-        this.propagateChange(value);
-    }
-}
-AddCommentComponent.decorators = [
-    { type: Component, args: [{
-                changeDetection: ChangeDetectionStrategy.OnPush,
-                selector: 'ap-add-comment',
-                template: "<div class=\"add-comment\">\n    <textarea ap-autosize\n              dir=\"auto\"\n              matInput\n              rows=\"1\"\n              [placeholder]=\"placeholder\"\n              [value]=\"_commentValue\"\n              (keyup)=\"onChange($event)\"\n              (change)=\"onChange($event)\">\n    </textarea>\n\n    <ng-template\n        #defaultTemplate\n        let-action=\"action\">\n        <div class=\"default-template\">\n            <button mat-stroked-button color=\"secondary\" (click)=\"action.emit('send')\">\n                Send\n            </button>\n        </div>\n    </ng-template>\n\n    <ng-template\n        [ngTemplateOutlet]=\"customTemplate || defaultTemplate\"\n        [ngTemplateOutletContext]=\"{\n            action: action\n        }\">\n    </ng-template>\n</div>\n",
-                providers: [{
-                        provide: NG_VALUE_ACCESSOR,
-                        useExisting: forwardRef(() => AddCommentComponent),
-                        multi: true
-                    }],
-                styles: ["[color=facebook]{color:#1877f2}[bgcolor=facebook],[hcolor=facebook]:hover{background-color:#1877f2}[border=facebook]{border:1px solid #1877f2}[color=google]{color:#4e85e8}[bgcolor=google],[hcolor=google]:hover{background-color:#4e85e8}[border=google]{border:1px solid #4e85e8}[color=instagram]{color:#e1306c}[bgcolor=instagram],[hcolor=instagram]:hover{background-color:#e1306c}[border=instagram]{border:1px solid #e1306c}[color=instagrammagenta]{color:#c13584}[bgcolor=instagrammagenta],[hcolor=instagrammagenta]:hover{background-color:#c13584}[border=instagrammagenta]{border:1px solid #c13584}[color=instagramblue]{color:#5851db}[bgcolor=instagramblue],[hcolor=instagramblue]:hover{background-color:#5851db}[border=instagramblue]{border:1px solid #5851db}[color=instagrampurple]{color:#833ab4}[bgcolor=instagrampurple],[hcolor=instagrampurple]:hover{background-color:#833ab4}[border=instagrampurple]{border:1px solid #833ab4}[color=instagramorange]{color:#f56040}[bgcolor=instagramorange],[hcolor=instagramorange]:hover{background-color:#f56040}[border=instagramorange]{border:1px solid #f56040}[color=instagramyellow]{color:#ffdc80}[bgcolor=instagramyellow],[hcolor=instagramyellow]:hover{background-color:#ffdc80}[border=instagramyellow]{border:1px solid #ffdc80}[color=linkedin]{color:#2c67bc}[bgcolor=linkedin],[hcolor=linkedin]:hover{background-color:#2c67bc}[border=linkedin]{border:1px solid #2c67bc}[color=twitter]{color:#55acee}[bgcolor=twitter],[hcolor=twitter]:hover{background-color:#55acee}[border=twitter]{border:1px solid #55acee}[color=youtube]{color:red}[bgcolor=youtube],[hcolor=youtube]:hover{background-color:red}[border=youtube]{border:1px solid red}[color=blood-orange]{color:#ff4d00}[bgcolor=blood-orange],[hcolor=blood-orange]:hover{background-color:#ff4d00}[border=blood-orange]{border:1px solid #ff4d00}[color=pinkish-orange]{color:#ff7b49}[bgcolor=pinkish-orange],[hcolor=pinkish-orange]:hover{background-color:#ff7b49}[border=pinkish-orange]{border:1px solid #ff7b49}[color=charcoal-grey]{color:#2a2f34}[bgcolor=charcoal-grey],[hcolor=charcoal-grey]:hover{background-color:#2a2f34}[border=charcoal-grey]{border:1px solid #2a2f34}[color=azure]{color:#00aeef}[bgcolor=azure],[hcolor=azure]:hover{background-color:#00aeef}[border=azure]{border:1px solid #00aeef}[color=light-azure]{color:#eaf5fd}[bgcolor=light-azure],[hcolor=light-azure]:hover{background-color:#eaf5fd}[border=light-azure]{border:1px solid #eaf5fd}[color=blue-grey]{color:#8d98a9}[bgcolor=blue-grey],[hcolor=blue-grey]:hover{background-color:#8d98a9}[border=blue-grey]{border:1px solid #8d98a9}[color=silver]{color:#ced0da}[bgcolor=silver],[hcolor=silver]:hover{background-color:#ced0da}[border=silver]{border:1px solid #ced0da}[color=pale-grey]{color:#dfe3e9}[bgcolor=pale-grey],[hcolor=pale-grey]:hover{background-color:#dfe3e9}[border=pale-grey]{border:1px solid #dfe3e9}[color=grey-white]{color:#f5f7f8}[bgcolor=grey-white],[hcolor=grey-white]:hover{background-color:#f5f7f8}[border=grey-white]{border:1px solid #f5f7f8}[color=cool-grey]{color:#b4bbc6}[bgcolor=cool-grey],[hcolor=cool-grey]:hover{background-color:#b4bbc6}[border=cool-grey]{border:1px solid #b4bbc6}[color=black]{color:#344563}[bgcolor=black],[hcolor=black]:hover{background-color:#344563}[border=black]{border:1px solid #344563}[color=grey-blue]{color:#68768c}[bgcolor=grey-blue],[hcolor=grey-blue]:hover{background-color:#68768c}[border=grey-blue]{border:1px solid #68768c}[color=strawberry]{color:#f4282d}[bgcolor=strawberry],[hcolor=strawberry]:hover{background-color:#f4282d}[border=strawberry]{border:1px solid #f4282d}[color=light-strawberry]{color:#f8eded}[bgcolor=light-strawberry],[hcolor=light-strawberry]:hover{background-color:#f8eded}[border=light-strawberry]{border:1px solid #f8eded}[color=white]{color:#fff}[bgcolor=white],[hcolor=white]:hover{background-color:#fff}[border=white]{border:1px solid #fff}[color=cool-green]{color:#33c15d}[bgcolor=cool-green],[hcolor=cool-green]:hover{background-color:#33c15d}[border=cool-green]{border:1px solid #33c15d}[color=light-green]{color:#ebfaef}[bgcolor=light-green],[hcolor=light-green]:hover{background-color:#ebfaef}[border=light-green]{border:1px solid #ebfaef}[color=transparent]{color:#0000}[bgcolor=transparent],[hcolor=transparent]:hover{background-color:initial}[border=transparent]{border:1px solid #0000}[color=c0]{color:#a566a5}[bgcolor=c0],[hcolor=c0]:hover{background-color:#a566a5}[border=c0]{border:1px solid #a566a5}[color=c1]{color:#c7ab82}[bgcolor=c1],[hcolor=c1]:hover{background-color:#c7ab82}[border=c1]{border:1px solid #c7ab82}[color=c2]{color:#f2713c}[bgcolor=c2],[hcolor=c2]:hover{background-color:#f2713c}[border=c2]{border:1px solid #f2713c}[color=c3]{color:#ffd006}[bgcolor=c3],[hcolor=c3]:hover{background-color:#ffd006}[border=c3]{border:1px solid #ffd006}[color=c4]{color:#94c5aa}[bgcolor=c4],[hcolor=c4]:hover{background-color:#94c5aa}[border=c4]{border:1px solid #94c5aa}[color=c5]{color:#2a9d8f}[bgcolor=c5],[hcolor=c5]:hover{background-color:#2a9d8f}[border=c5]{border:1px solid #2a9d8f}[color=c6]{color:#78acd8}[bgcolor=c6],[hcolor=c6]:hover{background-color:#78acd8}[border=c6]{border:1px solid #78acd8}[color=c7]{color:#525a9e}[bgcolor=c7],[hcolor=c7]:hover{background-color:#525a9e}[border=c7]{border:1px solid #525a9e}[color=c8]{color:#6a2459}[bgcolor=c8],[hcolor=c8]:hover{background-color:#6a2459}[border=c8]{border:1px solid #6a2459}[color=c9]{color:#74729e}[bgcolor=c9],[hcolor=c9]:hover{background-color:#74729e}[border=c9]{border:1px solid #74729e}.add-comment{border:1px solid #d6dae0;border-radius:4px;display:flex;flex-direction:column}.add-comment:focus-within{border:1px solid #178dfe}.add-comment:not(:focus-within):hover{border-color:#aeb5c1}.add-comment textarea{border:none;background:#0000;color:#858fa1;padding:0;margin:6px 16px}.add-comment input:focus,.add-comment textarea:focus{outline:none}.add-comment .default-template{display:flex;flex-direction:row-reverse}.add-comment .default-template button{background-color:#fff!important;width:90px;margin-right:8px;margin-bottom:8px;align-self:end}.add-comment .default-template button:hover{border-color:#d6dae0!important}.add-comment .default-template button:active{border-color:#aeb5c1!important}"]
-            },] }
-];
-AddCommentComponent.propDecorators = {
-    placeholder: [{ type: Input }],
-    customTemplate: [{ type: Input }],
-    disable: [{ type: Input }],
-    action: [{ type: Output }]
-};
-
-const SizeMap = {
-    'large': '64',
-    'normal': '48',
-    'medium': '40',
-    'medium-sm': '36',
-    'small': '32',
-    'mini': '24',
-    'mini-sm': '16',
-    'micro': '12',
-    'facebook': '40',
-    'linkedin': '40',
-    'instagram': '40',
-    'youtube': '40',
-    'google': '40',
-    'twitter': '48'
-};
-class AvatarComponent {
-    constructor() {
-        this.border = '';
-        this.defaultImageEnabled = true; // DEPRECATED default avatar if we don't have username
-        this.fallbackSymbolId = 'single-neutral';
-        this.fallbackSymbolSize = 'mini';
-        this.loading = 'auto';
-        this.outerBorderHidden = false;
-        this.size = 'medium';
-        this.rounded = false;
-        this.online = false;
-        this.sizeMap = SizeMap;
-    }
-    ngOnInit() {
-    }
-    ngOnChanges(changes) {
-        var _a, _b;
-        if (((_a = changes.social) === null || _a === void 0 ? void 0 : _a.currentValue) || ((_b = changes.size) === null || _b === void 0 ? void 0 : _b.currentValue)) {
-            if (this.social === 'google') {
-                switch (this.size) {
-                    case 'medium-sm':
-                        this.socialSize = '14';
-                        break;
-                    case 'mini':
-                        this.socialSize = '15';
-                        break;
-                    default:
-                        this.socialSize = '19';
-                }
-            }
-            else {
-                this.socialSize = this.size === 'mini' || this.size === 'medium-sm' ? '12' : '16';
-            }
-        }
-        if (changes.defaultImageEnabled && changes.defaultImageEnabled.currentValue) {
-            console.warn("'defaultImageEnabled' attribute is deprecated.");
-        }
-    }
-    onError() {
-        this.imageUrl = null;
-    }
-}
-AvatarComponent.decorators = [
-    { type: Component, args: [{
-                changeDetection: ChangeDetectionStrategy.OnPush,
-                selector: 'ap-avatar',
-                template: "<div class=\"ap-avatar-container {{size}}\">\n    <!-- simple avatar -->\n    <img *ngIf=\"imageUrl; else noPicture\"\n        class=\"ap-avatar {{size}}\"\n         [class.outer-border]=\"!outerBorderHidden\"\n         [class.rounded]=\"rounded\"\n         [attr.border]=\"border\"\n         [attr.loading]=\"loading\"\n         [attr.height]=\"sizeMap[size]\"\n         [attr.width]=\"sizeMap[size]\"\n         [src]=\"imageUrl\"\n         (error)=\"onError()\"/>\n    <!-- image with first letter of screen name -->\n    <ng-template #noPicture>\n        <span\n              class=\"ap-avatar ap-avatar-username {{size}}\"\n              [class.outer-border]=\"!outerBorderHidden\"\n              [class.rounded]=\"rounded\"\n              [attr.border]=\"border\">\n            <ng-container *ngIf=\"username; else symbol\">\n                {{username.charAt(0).toUpperCase()}}\n            </ng-container>\n            <ng-template #symbol>\n                <ap-symbol\n                    [size]=\"fallbackSymbolSize\"\n                    [symbolId]=\"fallbackSymbolId\">\n                </ap-symbol>\n            </ng-template>\n        </span>\n    </ng-template>\n\n    <div  *ngIf=\"social\"\n          class=\"social-symbol-wrapper {{social}} {{size}}\">\n        <ap-symbol [symbolId]=\"social === 'google' ? social + '-my-business-official' : social + '-official'\"\n                   [size]=\"socialSize\">\n        </ap-symbol>\n    </div>\n    <div *ngIf=\"online\" class=\"online-indicator {{size}}\"></div>\n\n</div>\n<label>\n    <ng-content></ng-content>\n</label>\n",
-                styles: ["[color=facebook]{color:#1877f2}[bgcolor=facebook],[hcolor=facebook]:hover{background-color:#1877f2}[border=facebook]{border:1px solid #1877f2}[color=google]{color:#4e85e8}[bgcolor=google],[hcolor=google]:hover{background-color:#4e85e8}[border=google]{border:1px solid #4e85e8}[color=instagram]{color:#e1306c}[bgcolor=instagram],[hcolor=instagram]:hover{background-color:#e1306c}[border=instagram]{border:1px solid #e1306c}[color=instagrammagenta]{color:#c13584}[bgcolor=instagrammagenta],[hcolor=instagrammagenta]:hover{background-color:#c13584}[border=instagrammagenta]{border:1px solid #c13584}[color=instagramblue]{color:#5851db}[bgcolor=instagramblue],[hcolor=instagramblue]:hover{background-color:#5851db}[border=instagramblue]{border:1px solid #5851db}[color=instagrampurple]{color:#833ab4}[bgcolor=instagrampurple],[hcolor=instagrampurple]:hover{background-color:#833ab4}[border=instagrampurple]{border:1px solid #833ab4}[color=instagramorange]{color:#f56040}[bgcolor=instagramorange],[hcolor=instagramorange]:hover{background-color:#f56040}[border=instagramorange]{border:1px solid #f56040}[color=instagramyellow]{color:#ffdc80}[bgcolor=instagramyellow],[hcolor=instagramyellow]:hover{background-color:#ffdc80}[border=instagramyellow]{border:1px solid #ffdc80}[color=linkedin]{color:#2c67bc}[bgcolor=linkedin],[hcolor=linkedin]:hover{background-color:#2c67bc}[border=linkedin]{border:1px solid #2c67bc}[color=twitter]{color:#55acee}[bgcolor=twitter],[hcolor=twitter]:hover{background-color:#55acee}[border=twitter]{border:1px solid #55acee}[color=youtube]{color:red}[bgcolor=youtube],[hcolor=youtube]:hover{background-color:red}[border=youtube]{border:1px solid red}[color=blood-orange]{color:#ff4d00}[bgcolor=blood-orange],[hcolor=blood-orange]:hover{background-color:#ff4d00}[border=blood-orange]{border:1px solid #ff4d00}[color=pinkish-orange]{color:#ff7b49}[bgcolor=pinkish-orange],[hcolor=pinkish-orange]:hover{background-color:#ff7b49}[border=pinkish-orange]{border:1px solid #ff7b49}[color=charcoal-grey]{color:#2a2f34}[bgcolor=charcoal-grey],[hcolor=charcoal-grey]:hover{background-color:#2a2f34}[border=charcoal-grey]{border:1px solid #2a2f34}[color=azure]{color:#00aeef}[bgcolor=azure],[hcolor=azure]:hover{background-color:#00aeef}[border=azure]{border:1px solid #00aeef}[color=light-azure]{color:#eaf5fd}[bgcolor=light-azure],[hcolor=light-azure]:hover{background-color:#eaf5fd}[border=light-azure]{border:1px solid #eaf5fd}[color=blue-grey]{color:#8d98a9}[bgcolor=blue-grey],[hcolor=blue-grey]:hover{background-color:#8d98a9}[border=blue-grey]{border:1px solid #8d98a9}[color=silver]{color:#ced0da}[bgcolor=silver],[hcolor=silver]:hover{background-color:#ced0da}[border=silver]{border:1px solid #ced0da}[color=pale-grey]{color:#dfe3e9}[bgcolor=pale-grey],[hcolor=pale-grey]:hover{background-color:#dfe3e9}[border=pale-grey]{border:1px solid #dfe3e9}[color=grey-white]{color:#f5f7f8}[bgcolor=grey-white],[hcolor=grey-white]:hover{background-color:#f5f7f8}[border=grey-white]{border:1px solid #f5f7f8}[color=cool-grey]{color:#b4bbc6}[bgcolor=cool-grey],[hcolor=cool-grey]:hover{background-color:#b4bbc6}[border=cool-grey]{border:1px solid #b4bbc6}[color=black]{color:#344563}[bgcolor=black],[hcolor=black]:hover{background-color:#344563}[border=black]{border:1px solid #344563}[color=grey-blue]{color:#68768c}[bgcolor=grey-blue],[hcolor=grey-blue]:hover{background-color:#68768c}[border=grey-blue]{border:1px solid #68768c}[color=strawberry]{color:#f4282d}[bgcolor=strawberry],[hcolor=strawberry]:hover{background-color:#f4282d}[border=strawberry]{border:1px solid #f4282d}[color=light-strawberry]{color:#f8eded}[bgcolor=light-strawberry],[hcolor=light-strawberry]:hover{background-color:#f8eded}[border=light-strawberry]{border:1px solid #f8eded}[color=white]{color:#fff}[bgcolor=white],[hcolor=white]:hover{background-color:#fff}[border=white]{border:1px solid #fff}[color=cool-green]{color:#33c15d}[bgcolor=cool-green],[hcolor=cool-green]:hover{background-color:#33c15d}[border=cool-green]{border:1px solid #33c15d}[color=light-green]{color:#ebfaef}[bgcolor=light-green],[hcolor=light-green]:hover{background-color:#ebfaef}[border=light-green]{border:1px solid #ebfaef}[color=transparent]{color:#0000}[bgcolor=transparent],[hcolor=transparent]:hover{background-color:initial}[border=transparent]{border:1px solid #0000}[color=c0]{color:#a566a5}[bgcolor=c0],[hcolor=c0]:hover{background-color:#a566a5}[border=c0]{border:1px solid #a566a5}[color=c1]{color:#c7ab82}[bgcolor=c1],[hcolor=c1]:hover{background-color:#c7ab82}[border=c1]{border:1px solid #c7ab82}[color=c2]{color:#f2713c}[bgcolor=c2],[hcolor=c2]:hover{background-color:#f2713c}[border=c2]{border:1px solid #f2713c}[color=c3]{color:#ffd006}[bgcolor=c3],[hcolor=c3]:hover{background-color:#ffd006}[border=c3]{border:1px solid #ffd006}[color=c4]{color:#94c5aa}[bgcolor=c4],[hcolor=c4]:hover{background-color:#94c5aa}[border=c4]{border:1px solid #94c5aa}[color=c5]{color:#2a9d8f}[bgcolor=c5],[hcolor=c5]:hover{background-color:#2a9d8f}[border=c5]{border:1px solid #2a9d8f}[color=c6]{color:#78acd8}[bgcolor=c6],[hcolor=c6]:hover{background-color:#78acd8}[border=c6]{border:1px solid #78acd8}[color=c7]{color:#525a9e}[bgcolor=c7],[hcolor=c7]:hover{background-color:#525a9e}[border=c7]{border:1px solid #525a9e}[color=c8]{color:#6a2459}[bgcolor=c8],[hcolor=c8]:hover{background-color:#6a2459}[border=c8]{border:1px solid #6a2459}[color=c9]{color:#74729e}[bgcolor=c9],[hcolor=c9]:hover{background-color:#74729e}[border=c9]{border:1px solid #74729e}:host{align-items:center;display:inline-flex}label{margin-left:8px}label:empty{display:none}.ap-avatar-container{position:relative}.ap-avatar-container.large{height:64px;width:64px}.ap-avatar-container.normal{height:48px;width:48px}.ap-avatar-container.medium{height:40px;width:40px}.ap-avatar-container.medium-sm{height:36px;width:36px}.ap-avatar-container.small{height:32px;width:32px}.ap-avatar-container.mini{height:24px;width:24px}.ap-avatar-container.mini-sm{height:16px;width:16px}.ap-avatar-container.micro{height:12px;width:12px}.ap-avatar-container .ap-avatar.outer-border{box-shadow:0 0 0 1.5px #eaecef}.ap-avatar-container .ap-avatar.large{height:64px;width:64px}.ap-avatar-container .ap-avatar.normal{height:48px;width:48px}.ap-avatar-container .ap-avatar.medium{height:40px;width:40px}.ap-avatar-container .ap-avatar.medium-sm{height:36px;width:36px}.ap-avatar-container .ap-avatar.small{height:32px;width:32px}.ap-avatar-container .ap-avatar.mini{height:24px;width:24px}.ap-avatar-container .ap-avatar.mini-sm{height:16px;width:16px}.ap-avatar-container .ap-avatar.micro{height:12px;width:12px}.ap-avatar-container .ap-avatar.facebook,.ap-avatar-container .ap-avatar.google,.ap-avatar-container .ap-avatar.instagram,.ap-avatar-container .ap-avatar.linkedin,.ap-avatar-container .ap-avatar.youtube{height:40px;width:40px}.ap-avatar-container .ap-avatar.twitter{height:48px;width:48px}.ap-avatar-container .ap-avatar:not(.rounded){border-radius:13%}.ap-avatar-container .ap-avatar-username{display:inline-flex;align-items:center;justify-content:center;background-color:#aeb5c1;color:#fff;font-size:24px}.ap-avatar-container .ap-avatar-username ap-symbol{height:24px!important;width:24px!important}.ap-avatar-container .ap-avatar-username.large{font-size:28px}.ap-avatar-container .ap-avatar-username.medium{font-size:18px}.ap-avatar-container .ap-avatar-username.medium-sm{font-size:16px}.ap-avatar-container .ap-avatar-username.small{font-size:14px}.ap-avatar-container .ap-avatar-username.mini,.ap-avatar-container .ap-avatar-username.mini-sm{font-size:12px}.ap-avatar-container .social-symbol-wrapper{position:absolute;right:0;bottom:0;display:flex;align-items:center;justify-content:center;box-shadow:0 0 0 1.5px #eaecef}.ap-avatar-container .social-symbol-wrapper.facebook,.ap-avatar-container .social-symbol-wrapper.twitter,.ap-avatar-container .social-symbol-wrapper.youtube{border-radius:100%}.ap-avatar-container .social-symbol-wrapper.instagram{border-radius:28%}.ap-avatar-container .social-symbol-wrapper.linkedin{border-radius:6%}.ap-avatar-container .social-symbol-wrapper.google{box-shadow:none;right:-3px;bottom:-3px}.ap-avatar-container .social-symbol-wrapper.google ap-symbol{border-radius:0;background-color:initial}.ap-avatar-container .social-symbol-wrapper ap-symbol{border-radius:100%;background-color:#fff}.ap-avatar-container .online-indicator{box-shadow:none;background:#45b854;right:0;bottom:0;position:absolute}.ap-avatar-container .online-indicator.large{outline:5px solid #fff;border-radius:16px;min-height:16px;min-width:16px}.ap-avatar-container .online-indicator.normal{outline:4px solid #fff;border-radius:12px;min-height:12px;min-width:12px}.ap-avatar-container .online-indicator.medium,.ap-avatar-container .online-indicator.medium-sm,.ap-avatar-container .online-indicator.small{outline:3px solid #fff;border-radius:8px;min-height:8px;min-width:8px}.ap-avatar-container .online-indicator.mini,.ap-avatar-container .online-indicator.mini-sm{outline:2px solid #fff;border-radius:6px;min-height:6px;min-width:6px}.ap-avatar-container .online-indicator.micro{outline:1px solid #fff;border-radius:4px;min-height:4px;min-width:4px}"]
-            },] }
-];
-AvatarComponent.propDecorators = {
-    border: [{ type: Input }],
-    defaultImageEnabled: [{ type: Input }],
-    fallbackSymbolId: [{ type: Input }],
-    fallbackSymbolSize: [{ type: Input }],
-    imageUrl: [{ type: Input }],
-    loading: [{ type: Input }],
-    outerBorderHidden: [{ type: Input }],
-    size: [{ type: Input }],
-    social: [{ type: Input }],
-    username: [{ type: Input }],
-    rounded: [{ type: Input }],
-    online: [{ type: Input }]
-};
-
-class ModalComponent {
-    constructor(dialogRef) {
-        this.dialogRef = dialogRef;
-        this.footerVisible = true;
-        this.headerVisible = true;
-        this.containerStyle = {};
-        this.headerStyle = {};
-        this.contentStyle = {};
-        this.footerStyle = {};
-        this.defaultLayout = true;
-        dialogRef.disableClose = true;
-    }
-    /**
-     * Use it to open a modal containing the {@link componentType} component, with the right configuration.
-     */
-    static openWithComponent(matDialog, config, componentType) {
-        let matDialogConfig;
-        if (config) {
-            matDialogConfig = config.matDialogConfig;
-            if (matDialogConfig) {
-                matDialogConfig.panelClass = Array.isArray(config.matDialogConfig.panelClass)
-                    ? [...config.matDialogConfig.panelClass, ModalComponent.PANEL_CLASS] // in case where the panelClass is an array
-                    : [config.matDialogConfig.panelClass, ModalComponent.PANEL_CLASS]; // in the other case, it's a String
-            }
-            else {
-                matDialogConfig = { panelClass: ModalComponent.PANEL_CLASS };
-            }
-        }
-        else {
-            matDialogConfig = {
-                panelClass: ModalComponent.PANEL_CLASS
-            };
-        }
-        matDialogConfig.autoFocus = false; // Prevent first button to be focused
-        const dialogRef = matDialog.open(componentType, matDialogConfig);
-        if (config.backdropCloseEnable === true) {
-            dialogRef.disableClose = false;
-        }
-        return dialogRef;
-    }
-    /**
-     * Use it to open a modal containing the provided templates, with the right configuration.
-     */
-    static openWithTemplates(matDialog, headerTemplate, mainTemplate, footerTemplate, config) {
-        const dialogRef = ModalComponent.openWithComponent(matDialog, config, ModalComponent);
-        dialogRef.componentInstance.closable = (config && config.closable) ? config.closable : false;
-        dialogRef.componentInstance.headerBottomBorderEnabled = (config && config.headerBottomBorderEnabled) ? config.headerBottomBorderEnabled : false;
-        dialogRef.componentInstance.headerTemplate = headerTemplate;
-        dialogRef.componentInstance.mainTemplate = mainTemplate;
-        dialogRef.componentInstance.footerTemplate = footerTemplate;
-        return dialogRef;
-    }
-    close() {
-        this.dialogRef.close();
-    }
-}
-ModalComponent.PANEL_CLASS = 'modal-container';
-ModalComponent.decorators = [
-    { type: Component, args: [{
-                changeDetection: ChangeDetectionStrategy.OnPush,
-                selector: 'ap-modal',
-                template: "<div\n    [ngStyle]=\"containerStyle\"\n    [ngClass]=\"{'modal-wrapper': true, 'default-layout': defaultLayout}\">\n    <button\n        *ngIf=\"closable\"\n        class=\"circle close-button\"\n        mat-flat-button\n        (click)=\"close()\">\n        <ap-symbol symbolId=\"close\"></ap-symbol>\n    </button>\n    <div\n        *ngIf=\"headerTemplate && headerVisible\"\n        [ngStyle]=\"headerStyle\"\n        [ngClass]=\"{header: defaultLayout}\"\n        [class.border-bottom]=\"headerBottomBorderEnabled\">\n        <ng-template [ngTemplateOutlet]=\"headerTemplate\"></ng-template>\n    </div>\n    <div\n        *ngIf=\"mainTemplate\"\n        [ngStyle]=\"contentStyle\"\n        [ngClass]=\"{content: defaultLayout}\">\n        <ng-template [ngTemplateOutlet]=\"mainTemplate\"></ng-template>\n    </div>\n    <div\n        *ngIf=\"footerTemplate && footerVisible\"\n        [ngStyle]=\"footerStyle\"\n        [ngClass]=\"{footer: defaultLayout}\">\n        <ng-template [ngTemplateOutlet]=\"footerTemplate\"></ng-template>\n    </div>\n</div>\n",
-                styles: ["[color=facebook]{color:#1877f2}[bgcolor=facebook],[hcolor=facebook]:hover{background-color:#1877f2}[border=facebook]{border:1px solid #1877f2}[color=google]{color:#4e85e8}[bgcolor=google],[hcolor=google]:hover{background-color:#4e85e8}[border=google]{border:1px solid #4e85e8}[color=instagram]{color:#e1306c}[bgcolor=instagram],[hcolor=instagram]:hover{background-color:#e1306c}[border=instagram]{border:1px solid #e1306c}[color=instagrammagenta]{color:#c13584}[bgcolor=instagrammagenta],[hcolor=instagrammagenta]:hover{background-color:#c13584}[border=instagrammagenta]{border:1px solid #c13584}[color=instagramblue]{color:#5851db}[bgcolor=instagramblue],[hcolor=instagramblue]:hover{background-color:#5851db}[border=instagramblue]{border:1px solid #5851db}[color=instagrampurple]{color:#833ab4}[bgcolor=instagrampurple],[hcolor=instagrampurple]:hover{background-color:#833ab4}[border=instagrampurple]{border:1px solid #833ab4}[color=instagramorange]{color:#f56040}[bgcolor=instagramorange],[hcolor=instagramorange]:hover{background-color:#f56040}[border=instagramorange]{border:1px solid #f56040}[color=instagramyellow]{color:#ffdc80}[bgcolor=instagramyellow],[hcolor=instagramyellow]:hover{background-color:#ffdc80}[border=instagramyellow]{border:1px solid #ffdc80}[color=linkedin]{color:#2c67bc}[bgcolor=linkedin],[hcolor=linkedin]:hover{background-color:#2c67bc}[border=linkedin]{border:1px solid #2c67bc}[color=twitter]{color:#55acee}[bgcolor=twitter],[hcolor=twitter]:hover{background-color:#55acee}[border=twitter]{border:1px solid #55acee}[color=youtube]{color:red}[bgcolor=youtube],[hcolor=youtube]:hover{background-color:red}[border=youtube]{border:1px solid red}[color=blood-orange]{color:#ff4d00}[bgcolor=blood-orange],[hcolor=blood-orange]:hover{background-color:#ff4d00}[border=blood-orange]{border:1px solid #ff4d00}[color=pinkish-orange]{color:#ff7b49}[bgcolor=pinkish-orange],[hcolor=pinkish-orange]:hover{background-color:#ff7b49}[border=pinkish-orange]{border:1px solid #ff7b49}[color=charcoal-grey]{color:#2a2f34}[bgcolor=charcoal-grey],[hcolor=charcoal-grey]:hover{background-color:#2a2f34}[border=charcoal-grey]{border:1px solid #2a2f34}[color=azure]{color:#00aeef}[bgcolor=azure],[hcolor=azure]:hover{background-color:#00aeef}[border=azure]{border:1px solid #00aeef}[color=light-azure]{color:#eaf5fd}[bgcolor=light-azure],[hcolor=light-azure]:hover{background-color:#eaf5fd}[border=light-azure]{border:1px solid #eaf5fd}[color=blue-grey]{color:#8d98a9}[bgcolor=blue-grey],[hcolor=blue-grey]:hover{background-color:#8d98a9}[border=blue-grey]{border:1px solid #8d98a9}[color=silver]{color:#ced0da}[bgcolor=silver],[hcolor=silver]:hover{background-color:#ced0da}[border=silver]{border:1px solid #ced0da}[color=pale-grey]{color:#dfe3e9}[bgcolor=pale-grey],[hcolor=pale-grey]:hover{background-color:#dfe3e9}[border=pale-grey]{border:1px solid #dfe3e9}[color=grey-white]{color:#f5f7f8}[bgcolor=grey-white],[hcolor=grey-white]:hover{background-color:#f5f7f8}[border=grey-white]{border:1px solid #f5f7f8}[color=cool-grey]{color:#b4bbc6}[bgcolor=cool-grey],[hcolor=cool-grey]:hover{background-color:#b4bbc6}[border=cool-grey]{border:1px solid #b4bbc6}[color=black]{color:#344563}[bgcolor=black],[hcolor=black]:hover{background-color:#344563}[border=black]{border:1px solid #344563}[color=grey-blue]{color:#68768c}[bgcolor=grey-blue],[hcolor=grey-blue]:hover{background-color:#68768c}[border=grey-blue]{border:1px solid #68768c}[color=strawberry]{color:#f4282d}[bgcolor=strawberry],[hcolor=strawberry]:hover{background-color:#f4282d}[border=strawberry]{border:1px solid #f4282d}[color=light-strawberry]{color:#f8eded}[bgcolor=light-strawberry],[hcolor=light-strawberry]:hover{background-color:#f8eded}[border=light-strawberry]{border:1px solid #f8eded}[color=white]{color:#fff}[bgcolor=white],[hcolor=white]:hover{background-color:#fff}[border=white]{border:1px solid #fff}[color=cool-green]{color:#33c15d}[bgcolor=cool-green],[hcolor=cool-green]:hover{background-color:#33c15d}[border=cool-green]{border:1px solid #33c15d}[color=light-green]{color:#ebfaef}[bgcolor=light-green],[hcolor=light-green]:hover{background-color:#ebfaef}[border=light-green]{border:1px solid #ebfaef}[color=transparent]{color:#0000}[bgcolor=transparent],[hcolor=transparent]:hover{background-color:initial}[border=transparent]{border:1px solid #0000}[color=c0]{color:#a566a5}[bgcolor=c0],[hcolor=c0]:hover{background-color:#a566a5}[border=c0]{border:1px solid #a566a5}[color=c1]{color:#c7ab82}[bgcolor=c1],[hcolor=c1]:hover{background-color:#c7ab82}[border=c1]{border:1px solid #c7ab82}[color=c2]{color:#f2713c}[bgcolor=c2],[hcolor=c2]:hover{background-color:#f2713c}[border=c2]{border:1px solid #f2713c}[color=c3]{color:#ffd006}[bgcolor=c3],[hcolor=c3]:hover{background-color:#ffd006}[border=c3]{border:1px solid #ffd006}[color=c4]{color:#94c5aa}[bgcolor=c4],[hcolor=c4]:hover{background-color:#94c5aa}[border=c4]{border:1px solid #94c5aa}[color=c5]{color:#2a9d8f}[bgcolor=c5],[hcolor=c5]:hover{background-color:#2a9d8f}[border=c5]{border:1px solid #2a9d8f}[color=c6]{color:#78acd8}[bgcolor=c6],[hcolor=c6]:hover{background-color:#78acd8}[border=c6]{border:1px solid #78acd8}[color=c7]{color:#525a9e}[bgcolor=c7],[hcolor=c7]:hover{background-color:#525a9e}[border=c7]{border:1px solid #525a9e}[color=c8]{color:#6a2459}[bgcolor=c8],[hcolor=c8]:hover{background-color:#6a2459}[border=c8]{border:1px solid #6a2459}[color=c9]{color:#74729e}[bgcolor=c9],[hcolor=c9]:hover{background-color:#74729e}[border=c9]{border:1px solid #74729e}.modal-wrapper{position:relative}.modal-wrapper.default-layout{padding-top:24px;padding-bottom:16px}.modal-wrapper .close-button{margin:-12px;position:absolute;right:24px;top:24px}.modal-wrapper .close-button ap-symbol{height:12px;width:12px}.modal-wrapper .header{padding:0 24px 16px}.modal-wrapper .header ::ng-deep h2{margin-top:0}.modal-wrapper .header.border-bottom{border-bottom:1px solid #eaecef;margin-bottom:16px}.modal-wrapper .content{color:#5d6a82;font-size:16px;padding:0 24px}.modal-wrapper .footer{align-items:center;border-top:1px solid #eaecef;display:flex;justify-content:flex-end;margin-top:24px;padding:14px 24px 0}.modal-wrapper .footer .mat-stroked-button:not(:last-child),.modal-wrapper .footer ::ng-deep .mat-flat-button:not(:last-child){margin-right:16px}::ng-deep .modal-container{max-width:100vw!important;margin:24px 24px calc(2 * 32px)}::ng-deep .modal-container .mat-dialog-container{border-radius:10px;box-shadow:0 25px 50px #0000000a;max-width:100vw;padding:0}::ng-deep .cdk-overlay-dark-backdrop{background:#344563b3}"]
-            },] }
-];
-/** @nocollapse */
-ModalComponent.ctorParameters = () => [
-    { type: MatDialogRef }
-];
-ModalComponent.propDecorators = {
-    closable: [{ type: Input }],
-    headerBottomBorderEnabled: [{ type: Input }],
-    footerTemplate: [{ type: Input }],
-    footerVisible: [{ type: Input }],
-    headerTemplate: [{ type: Input }],
-    headerVisible: [{ type: Input }],
-    mainTemplate: [{ type: Input }],
-    config: [{ type: Input }],
-    containerStyle: [{ type: Input }],
-    headerStyle: [{ type: Input }],
-    contentStyle: [{ type: Input }],
-    footerStyle: [{ type: Input }],
-    defaultLayout: [{ type: Input }]
-};
-
-class ConfirmModalComponent {
-    constructor(dialogRef) {
-        this.dialogRef = dialogRef;
-        this.contentText = '';
-        this.footerCancelButtonId = 'cancel';
-        this.footerCancelButtonLabel = '';
-        this.footerConfirmButtonId = 'confirm';
-        this.footerConfirmButtonLabel = '';
-        this.headerTitle = '';
-        dialogRef.disableClose = true;
-    }
-    onCancel() {
-        this.dialogRef.close(false);
-    }
-    onConfirm() {
-        this.dialogRef.close(true);
-    }
-    static open(dialog, confirmModalTexts, modalConfig = null) {
-        if (!modalConfig) {
-            modalConfig = {};
-        }
-        if (!modalConfig.matDialogConfig) {
-            modalConfig.matDialogConfig = {
-                width: '550px'
-            };
-        }
-        const confirmModal = ModalComponent.openWithComponent(dialog, modalConfig, ConfirmModalComponent);
-        confirmModal.componentInstance.contentText = confirmModalTexts.contentText;
-        confirmModal.componentInstance.footerConfirmButtonId = confirmModalTexts.footerConfirmButtonId;
-        confirmModal.componentInstance.footerConfirmButtonLabel = confirmModalTexts.footerConfirmButtonLabel;
-        confirmModal.componentInstance.footerCancelButtonId = confirmModalTexts.footerCancelButtonId;
-        confirmModal.componentInstance.footerCancelButtonLabel = confirmModalTexts.footerCancelButtonLabel;
-        confirmModal.componentInstance.headerTitle = confirmModalTexts.headerTitle;
-        return confirmModal;
-    }
-}
-ConfirmModalComponent.decorators = [
-    { type: Component, args: [{
-                changeDetection: ChangeDetectionStrategy.OnPush,
-                selector: 'ap-confirm-modal',
-                template: "<ng-template #headerTemplate>\n    <h2>{{headerTitle}}</h2>\n</ng-template>\n\n<ng-template #mainTemplate>\n    <p>{{contentText}}</p>\n</ng-template>\n\n<ng-template #footerTemplate>\n    <button mat-flat-button (click)=\"onCancel()\" [id]=\"footerCancelButtonId\">\n        {{ footerCancelButtonLabel }}\n    </button>\n    <button mat-flat-button color=\"primary\" cdkFocusInitial [id]=footerConfirmButtonId\n            (click)=\"onConfirm()\">\n        {{ footerConfirmButtonLabel }}\n    </button>\n</ng-template>\n\n<ap-modal [closable]=\"true\"\n          [headerTemplate]=\"headerTemplate\"\n          [mainTemplate]=\"mainTemplate\"\n          [footerTemplate]=\"footerTemplate\"\n></ap-modal>\n"
-            },] }
-];
-/** @nocollapse */
-ConfirmModalComponent.ctorParameters = () => [
-    { type: MatDialogRef }
-];
-ConfirmModalComponent.propDecorators = {
-    contentText: [{ type: Input }],
-    footerCancelButtonId: [{ type: Input }],
-    footerCancelButtonLabel: [{ type: Input }],
-    footerConfirmButtonId: [{ type: Input }],
-    footerConfirmButtonLabel: [{ type: Input }],
-    headerTitle: [{ type: Input }]
-};
-
-var DatepickerMode;
-(function (DatepickerMode) {
-    DatepickerMode["Single"] = "Single";
-    DatepickerMode["Multiple"] = "Multiple";
-    DatepickerMode["Range"] = "Range";
-})(DatepickerMode || (DatepickerMode = {}));
-var SideEnum;
-(function (SideEnum) {
-    SideEnum["left"] = "left";
-    SideEnum["right"] = "right";
-})(SideEnum || (SideEnum = {}));
-// TODO fix css for range mode (more lateral padding)
-class DatepickerComponent {
-    constructor(changeDetectorRef) {
-        this.changeDetectorRef = changeDetectorRef;
-        this.i18n = {
-            ranges: {
-                yesterday: 'Yesterday',
-                lastWeek: 'Last Week',
-                last30Days: 'Last 30 days',
-                lastMonth: 'Previous month',
-                thisMonth: 'This Month',
-            }
-        };
-        this.selectedDates = [];
-        this.selectedPeriod = { startDate: null, endDate: null };
-        this.dateSelected = new EventEmitter();
-        this.periodSelected = new EventEmitter();
-        this.DatepickerMode = DatepickerMode;
-        this.doubleCalendarWidth = 528; // 231px calendar table * 2 = 462 (+ 16px x-padding * 4 = 64)
-        this.ranges = {};
-        this.rangePickerWidth = 150;
-        this.pageSet = false;
-        this.isCustomDate = (date) => {
-            var _a, _b;
-            const classes = [];
-            if (this.mode === DatepickerMode.Multiple) {
-                classes.push(this.isSelected(date) ? 'active' : 'force-inactive');
-            }
-            else if (this.mode === DatepickerMode.Single) {
-                classes.push(this.selectedDate && this.selectedDate.isSame(date, 'day') ? 'active' : 'force-inactive');
-            }
-            else if (this.mode === DatepickerMode.Range) {
-                classes.push('range-picker-mode');
-                // Workaround to fix the auto-active today date when no date is selected
-                if (moment().isSame(date, 'day')
-                    && !((_a = this.selectedPeriod) === null || _a === void 0 ? void 0 : _a.startDate)
-                    && !((_b = this.selectedPeriod) === null || _b === void 0 ? void 0 : _b.endDate)) {
-                    classes.push('force-inactive');
-                }
-            }
-            return classes;
-        };
-    }
-    ngOnInit() {
-        this.initRanges();
-        this.initDatePickerLocale();
-    }
-    ngOnChanges(changes) {
-        var _a, _b;
-        this.setWidth();
-        if (this.datepickerRef) {
-            setTimeout(() => {
-                this.datepickerRef.updateCalendars();
-                this.changeDetectorRef.detectChanges();
-            }, 100);
-        }
-        if (((_a = changes.selectedPeriod) === null || _a === void 0 ? void 0 : _a.currentValue) && this.datepickerRef) {
-            if (this.selectedPeriod.startDate === null && this.selectedPeriod.endDate === null) {
-                this.datepickerRef.clear();
-            }
-            else {
-                this.datepickerRef.setStartDate(this.selectedPeriod.startDate);
-                this.datepickerRef.setEndDate(this.selectedPeriod.endDate);
-            }
-        }
-        if (((_b = changes.mode) === null || _b === void 0 ? void 0 : _b.currentValue) === DatepickerMode.Single && this.datepickerRef) {
-            this.setCalendarCurrentPage();
-        }
-    }
-    ngAfterViewInit() {
-        if (this.datepickerRef) {
-            setTimeout(() => {
-                this.datepickerRef.updateCalendars();
-                this.setCalendarCurrentPage();
-            }, 100);
-        }
-    }
-    initDatePickerLocale() {
-        if (this.locale) {
-            moment.locale(this.locale);
-        }
-        let firstDayOfWeekIndex;
-        if (this.firstDayOfWeek === "sunday") {
-            firstDayOfWeekIndex = 0;
-        }
-        else if (this.firstDayOfWeek === "monday") {
-            firstDayOfWeekIndex = 1;
-        }
-        else {
-            firstDayOfWeekIndex = moment.localeData().firstDayOfWeek();
-        }
-        this.localeConfig = {
-            customRangeLabel: 'custom',
-            daysOfWeek: moment.weekdaysMin(),
-            monthNames: moment.months(),
-            firstDay: firstDayOfWeekIndex
-        };
-    }
-    initRanges() {
-        this.ranges[this.i18n.ranges.yesterday] = [moment().subtract(1, 'days'), moment().subtract(1, 'days')];
-        this.ranges[this.i18n.ranges.lastWeek] = [moment().subtract(7, 'days'), moment().subtract(1, 'days')];
-        this.ranges[this.i18n.ranges.last30Days] = [moment().subtract(30, 'days'), moment().subtract(1, 'days')];
-        this.ranges[this.i18n.ranges.lastMonth] = [moment().subtract(1, 'month').startOf('month'), moment().subtract(1, 'month').endOf('month')];
-        this.ranges[this.i18n.ranges.thisMonth] = [moment().startOf('month'), moment().endOf('month')];
-    }
-    isSelected(date) {
-        return this.selectedDates && this.selectedDates.some(selectedDate => selectedDate.isSame(date, 'day'));
-    }
-    onStartDateChanged(event) {
-        const date = event.startDate;
-        if (this.mode !== DatepickerMode.Range) {
-            this.selectedDate = date;
-            this.datepickerRef.setEndDate(date);
-            if (this.pageSet) {
-                this.pageSet = false;
-            }
-            else {
-                this.dateSelected.emit(date.clone());
-                if (this.mode === DatepickerMode.Multiple) {
-                    this.selectedDates.push(date);
-                }
-            }
-            if (this.datepickerRef) {
-                this.datepickerRef.updateCalendars();
-            }
-        }
-    }
-    onDatesUpdated(event) {
-        var _a, _b;
-        if (this.mode === DatepickerMode.Range) {
-            this.periodSelected.emit({
-                startDate: (_a = event.startDate) === null || _a === void 0 ? void 0 : _a.clone(),
-                endDate: (_b = event.endDate) === null || _b === void 0 ? void 0 : _b.clone()
-            });
-        }
-        if (this.datepickerRef) {
-            this.datepickerRef.updateCalendars();
-        }
-    }
-    onNextMonth() {
-        this.datepickerRef.leftCalendar.month = this.datepickerRef.leftCalendar.month.add(1, 'months').clone();
-        this.datepickerRef.rightCalendar.month = this.datepickerRef.rightCalendar.month.add(1, 'months').clone();
-        this.datepickerRef.clickNext(SideEnum.left);
-        this.datepickerRef.clickNext(SideEnum.right);
-    }
-    onPreviousMonth() {
-        this.datepickerRef.leftCalendar.month = this.datepickerRef.leftCalendar.month.subtract(1, 'months').clone();
-        this.datepickerRef.rightCalendar.month = this.datepickerRef.rightCalendar.month.subtract(1, 'months').clone();
-        this.datepickerRef.clickPrev(SideEnum.left);
-        this.datepickerRef.clickPrev(SideEnum.right);
-    }
-    /**
-     * Ugly hack used here to open the calendar on the right day if they are selected dates
-     *      * https://github.com/fetrarij/ngx-daterangepicker-material/issues/139
-     */
-    setCalendarCurrentPage() {
-        const selectedFirstDate = this.selectedDates.length > 0 ? this.selectedDates[0] : this.selectedDate;
-        if (selectedFirstDate && selectedFirstDate.isValid() && this.mode !== DatepickerMode.Range) {
-            const endDate = selectedFirstDate.clone();
-            endDate.add(1, 'month');
-            this.pageSet = true;
-            this.datepickerRef.setStartDate(selectedFirstDate);
-            this.datepickerRef.setEndDate(endDate);
-            this.datepickerRef.updateView();
-        }
-        this.changeDetectorRef.detectChanges();
-    }
-    setWidth() {
-        this.width = this.showRanges && this.mode === DatepickerMode.Range ? this.doubleCalendarWidth + this.rangePickerWidth : this.doubleCalendarWidth;
-    }
-}
-DatepickerComponent.decorators = [
-    { type: Component, args: [{
-                changeDetection: ChangeDetectionStrategy.OnPush,
-                selector: 'ap-datepicker',
-                template: "<div class=\"custom-calendar\" [style.width]=\"width + 'px'\">\n    <div class=\"custom-header\">\n        <div class=\"month-header\"\n             *ngIf=\"this.datepickerRef.leftCalendar.month\">\n            <div class=\"month-arrow-button\" (click)=\"onPreviousMonth()\">\n                <ap-symbol\n                    [symbolId]=\"'arrow-left-1'\"\n                    [color]=\"'#858FA1'\"\n                    [size]=\"'14'\"></ap-symbol>\n            </div>\n            <div class=\"month-label\">\n                {{ this.datepickerRef.leftCalendar.month.locale(locale).format('MMMM YYYY') }}\n            </div>\n        </div>\n        <div class=\"month-header\"\n             *ngIf=\"this.datepickerRef.rightCalendar.month\">\n            <div class=\"month-label\">\n                {{ this.datepickerRef.rightCalendar.month.locale(locale).format('MMMM YYYY') }}\n            </div>\n            <div class=\"month-arrow-button\" (click)=\"onNextMonth()\">\n                <ap-symbol\n                    [symbolId]=\"'arrow-right-1'\"\n                    [color]=\"'#858FA1'\"\n                    [size]=\"'14'\"></ap-symbol>\n            </div>\n        </div>\n        <div class=\"header-filler\" *ngIf=\"showRanges && mode === DatepickerMode.Range\">\n        </div>\n    </div>\n    <ngx-daterangepicker-material\n        #datepickerRef\n        [class.hide-ranges]=\"!showRanges\"\n        [alwaysShowCalendars]=\"true\"\n        [autoApply]=\"true\"\n        [customRangeDirection]=\"true\"\n        [isCustomDate]=\"isCustomDate\"\n        [locale]=\"localeConfig\"\n        [maxDate]=\"maxDate\"\n        [minDate]=\"minDate\"\n        [ranges]=\"showRanges && mode === DatepickerMode.Range ? ranges : null\"\n        (datesUpdated)=\"onDatesUpdated($event)\"\n        (startDateChanged)=\"onStartDateChanged($event)\">\n    </ngx-daterangepicker-material>\n</div>\n",
-                styles: ["[color=facebook]{color:#1877f2}[bgcolor=facebook],[hcolor=facebook]:hover{background-color:#1877f2}[border=facebook]{border:1px solid #1877f2}[color=google]{color:#4e85e8}[bgcolor=google],[hcolor=google]:hover{background-color:#4e85e8}[border=google]{border:1px solid #4e85e8}[color=instagram]{color:#e1306c}[bgcolor=instagram],[hcolor=instagram]:hover{background-color:#e1306c}[border=instagram]{border:1px solid #e1306c}[color=instagrammagenta]{color:#c13584}[bgcolor=instagrammagenta],[hcolor=instagrammagenta]:hover{background-color:#c13584}[border=instagrammagenta]{border:1px solid #c13584}[color=instagramblue]{color:#5851db}[bgcolor=instagramblue],[hcolor=instagramblue]:hover{background-color:#5851db}[border=instagramblue]{border:1px solid #5851db}[color=instagrampurple]{color:#833ab4}[bgcolor=instagrampurple],[hcolor=instagrampurple]:hover{background-color:#833ab4}[border=instagrampurple]{border:1px solid #833ab4}[color=instagramorange]{color:#f56040}[bgcolor=instagramorange],[hcolor=instagramorange]:hover{background-color:#f56040}[border=instagramorange]{border:1px solid #f56040}[color=instagramyellow]{color:#ffdc80}[bgcolor=instagramyellow],[hcolor=instagramyellow]:hover{background-color:#ffdc80}[border=instagramyellow]{border:1px solid #ffdc80}[color=linkedin]{color:#2c67bc}[bgcolor=linkedin],[hcolor=linkedin]:hover{background-color:#2c67bc}[border=linkedin]{border:1px solid #2c67bc}[color=twitter]{color:#55acee}[bgcolor=twitter],[hcolor=twitter]:hover{background-color:#55acee}[border=twitter]{border:1px solid #55acee}[color=youtube]{color:red}[bgcolor=youtube],[hcolor=youtube]:hover{background-color:red}[border=youtube]{border:1px solid red}[color=blood-orange]{color:#ff4d00}[bgcolor=blood-orange],[hcolor=blood-orange]:hover{background-color:#ff4d00}[border=blood-orange]{border:1px solid #ff4d00}[color=pinkish-orange]{color:#ff7b49}[bgcolor=pinkish-orange],[hcolor=pinkish-orange]:hover{background-color:#ff7b49}[border=pinkish-orange]{border:1px solid #ff7b49}[color=charcoal-grey]{color:#2a2f34}[bgcolor=charcoal-grey],[hcolor=charcoal-grey]:hover{background-color:#2a2f34}[border=charcoal-grey]{border:1px solid #2a2f34}[color=azure]{color:#00aeef}[bgcolor=azure],[hcolor=azure]:hover{background-color:#00aeef}[border=azure]{border:1px solid #00aeef}[color=light-azure]{color:#eaf5fd}[bgcolor=light-azure],[hcolor=light-azure]:hover{background-color:#eaf5fd}[border=light-azure]{border:1px solid #eaf5fd}[color=blue-grey]{color:#8d98a9}[bgcolor=blue-grey],[hcolor=blue-grey]:hover{background-color:#8d98a9}[border=blue-grey]{border:1px solid #8d98a9}[color=silver]{color:#ced0da}[bgcolor=silver],[hcolor=silver]:hover{background-color:#ced0da}[border=silver]{border:1px solid #ced0da}[color=pale-grey]{color:#dfe3e9}[bgcolor=pale-grey],[hcolor=pale-grey]:hover{background-color:#dfe3e9}[border=pale-grey]{border:1px solid #dfe3e9}[color=grey-white]{color:#f5f7f8}[bgcolor=grey-white],[hcolor=grey-white]:hover{background-color:#f5f7f8}[border=grey-white]{border:1px solid #f5f7f8}[color=cool-grey]{color:#b4bbc6}[bgcolor=cool-grey],[hcolor=cool-grey]:hover{background-color:#b4bbc6}[border=cool-grey]{border:1px solid #b4bbc6}[color=black]{color:#344563}[bgcolor=black],[hcolor=black]:hover{background-color:#344563}[border=black]{border:1px solid #344563}[color=grey-blue]{color:#68768c}[bgcolor=grey-blue],[hcolor=grey-blue]:hover{background-color:#68768c}[border=grey-blue]{border:1px solid #68768c}[color=strawberry]{color:#f4282d}[bgcolor=strawberry],[hcolor=strawberry]:hover{background-color:#f4282d}[border=strawberry]{border:1px solid #f4282d}[color=light-strawberry]{color:#f8eded}[bgcolor=light-strawberry],[hcolor=light-strawberry]:hover{background-color:#f8eded}[border=light-strawberry]{border:1px solid #f8eded}[color=white]{color:#fff}[bgcolor=white],[hcolor=white]:hover{background-color:#fff}[border=white]{border:1px solid #fff}[color=cool-green]{color:#33c15d}[bgcolor=cool-green],[hcolor=cool-green]:hover{background-color:#33c15d}[border=cool-green]{border:1px solid #33c15d}[color=light-green]{color:#ebfaef}[bgcolor=light-green],[hcolor=light-green]:hover{background-color:#ebfaef}[border=light-green]{border:1px solid #ebfaef}[color=transparent]{color:#0000}[bgcolor=transparent],[hcolor=transparent]:hover{background-color:initial}[border=transparent]{border:1px solid #0000}[color=c0]{color:#a566a5}[bgcolor=c0],[hcolor=c0]:hover{background-color:#a566a5}[border=c0]{border:1px solid #a566a5}[color=c1]{color:#c7ab82}[bgcolor=c1],[hcolor=c1]:hover{background-color:#c7ab82}[border=c1]{border:1px solid #c7ab82}[color=c2]{color:#f2713c}[bgcolor=c2],[hcolor=c2]:hover{background-color:#f2713c}[border=c2]{border:1px solid #f2713c}[color=c3]{color:#ffd006}[bgcolor=c3],[hcolor=c3]:hover{background-color:#ffd006}[border=c3]{border:1px solid #ffd006}[color=c4]{color:#94c5aa}[bgcolor=c4],[hcolor=c4]:hover{background-color:#94c5aa}[border=c4]{border:1px solid #94c5aa}[color=c5]{color:#2a9d8f}[bgcolor=c5],[hcolor=c5]:hover{background-color:#2a9d8f}[border=c5]{border:1px solid #2a9d8f}[color=c6]{color:#78acd8}[bgcolor=c6],[hcolor=c6]:hover{background-color:#78acd8}[border=c6]{border:1px solid #78acd8}[color=c7]{color:#525a9e}[bgcolor=c7],[hcolor=c7]:hover{background-color:#525a9e}[border=c7]{border:1px solid #525a9e}[color=c8]{color:#6a2459}[bgcolor=c8],[hcolor=c8]:hover{background-color:#6a2459}[border=c8]{border:1px solid #6a2459}[color=c9]{color:#74729e}[bgcolor=c9],[hcolor=c9]:hover{background-color:#74729e}[border=c9]{border:1px solid #74729e}::ng-deep .custom-calendar{background-color:#fff;display:flex;flex-direction:column;justify-content:center;border-radius:4px;height:-moz-fit-content;height:fit-content}::ng-deep .custom-calendar .custom-header{display:flex;align-items:center;justify-content:center;color:#344563;font-size:12px;font-weight:700;height:55px;text-transform:capitalize}::ng-deep .custom-calendar .custom-header .month-header{height:30px;width:255px;display:flex;align-items:center}::ng-deep .custom-calendar .custom-header .month-header .month-arrow-button{padding:10px;border-radius:2em;cursor:pointer}::ng-deep .custom-calendar .custom-header .month-header .month-arrow-button:hover{background-color:#eaecef}::ng-deep .custom-calendar .custom-header .month-header .month-label{flex:1;text-align:center}::ng-deep .custom-calendar .custom-header .header-filler{width:150px}::ng-deep .custom-calendar .md-drppicker{font-family:Averta;width:unset;height:219px;padding:0;margin:0 0 16px;box-shadow:none!important;z-index:0!important}::ng-deep .custom-calendar .md-drppicker .ranges{border-left:1px solid #eaecef;float:right!important;max-width:150px;height:100%}::ng-deep .custom-calendar .md-drppicker .ranges ul li{margin-left:12px}::ng-deep .custom-calendar .md-drppicker .ranges ul li:hover{background:unset}::ng-deep .custom-calendar .md-drppicker .ranges ul li button{font-family:Averta;font-size:14px;border-radius:4px;color:#5d6a82}::ng-deep .custom-calendar .md-drppicker .ranges ul li button:hover:not(.active):not(:disabled){color:#178dfe;background:#e8f4ff}::ng-deep .custom-calendar .md-drppicker .ranges ul li button.active{color:#fff;background:#178dfe}::ng-deep .custom-calendar .md-drppicker .ranges ul li button.active:hover{background:#3a9efe}::ng-deep .custom-calendar .md-drppicker .ranges ul li button:disabled{color:#d6dae0;background:none;cursor:default}::ng-deep .custom-calendar .md-drppicker .month{cursor:auto}::ng-deep .custom-calendar .md-drppicker .calendar{margin:0!important;padding:0 16px}::ng-deep .custom-calendar .md-drppicker .calendar.left{border-right:1px solid #eaecef}::ng-deep .custom-calendar .md-drppicker .calendar-table{width:231px;padding:0!important;border:none!important}::ng-deep .custom-calendar .md-drppicker .calendar-table table{border-spacing:0 5px!important;height:184px}::ng-deep .custom-calendar .md-drppicker .calendar-table table td,::ng-deep .custom-calendar .md-drppicker .calendar-table table th{height:unset;border:none}::ng-deep .custom-calendar .md-drppicker .calendar-table table thead{line-height:10px}::ng-deep .custom-calendar .md-drppicker .calendar-table table thead tr:first-child{display:none}::ng-deep .custom-calendar .md-drppicker .calendar-table table thead tr th{color:#aeb5c1;font-weight:700;font-size:12px;text-transform:capitalize;padding-bottom:10px}::ng-deep .custom-calendar .md-drppicker .calendar-table table thead tr th.month,::ng-deep .custom-calendar .md-drppicker .calendar-table table thead tr th.next,::ng-deep .custom-calendar .md-drppicker .calendar-table table thead tr th.prev{color:#344563}::ng-deep .custom-calendar .md-drppicker .calendar-table table thead tr th.next,::ng-deep .custom-calendar .md-drppicker .calendar-table table thead tr th.prev{font-size:16px}::ng-deep .custom-calendar .md-drppicker .calendar-table table tbody tr td:last-child.in-range{border-radius:0 2em 2em 0}::ng-deep .custom-calendar .md-drppicker .calendar-table table tbody tr td:first-child.in-range{border-radius:2em 0 0 2em}::ng-deep .custom-calendar .md-drppicker .calendar-table table tbody td{opacity:1!important;border-spacing:0;height:27px}::ng-deep .custom-calendar .md-drppicker .calendar-table table tbody td span{width:27px!important;height:27px!important;border-radius:50%;display:flex;align-items:center;justify-content:center;margin-left:3px}::ng-deep .custom-calendar .md-drppicker .calendar-table table tbody td.in-range:not(.off):not(.force-inactive){background-color:#e8f4ff!important;color:#344563!important}::ng-deep .custom-calendar .md-drppicker .calendar-table table tbody td.active.start-date:not(.end-date).range-picker-mode:not(.off){border-radius:2em 0 0 2em;background-color:#178dfe!important;color:#fff!important}::ng-deep .custom-calendar .md-drppicker .calendar-table table tbody td.active.end-date:not(.start-date).range-picker-mode:not(.off){border-radius:0 2em 2em 0;background-color:#178dfe!important;color:#fff!important}::ng-deep .custom-calendar .md-drppicker .calendar-table table tbody td.active:not(.force-inactive).start-date.end-date.range-picker-mode:not(.off){background-color:unset!important}::ng-deep .custom-calendar .md-drppicker .calendar-table table tbody td.active:not(.force-inactive).start-date.end-date.range-picker-mode:not(.off) span{border-radius:2em;background-color:#178dfe!important;color:#fff!important}::ng-deep .custom-calendar .md-drppicker .calendar-table table tbody td.available.today.force-inactive:hover span,::ng-deep .custom-calendar .md-drppicker .calendar-table table tbody td.available:not(.start-date):not(.end-date):hover span{background-color:#d1e8ff!important}::ng-deep .custom-calendar .md-drppicker .calendar-table table tbody td.available.today.force-inactive:hover:not(.in-range),::ng-deep .custom-calendar .md-drppicker .calendar-table table tbody td.available:not(.start-date):not(.end-date):hover:not(.in-range){background-color:unset!important}::ng-deep .custom-calendar .md-drppicker .calendar-table table tbody td.available.in-range:not(.start-date):not(.end-date):hover{border-radius:unset!important}::ng-deep .custom-calendar .md-drppicker .calendar-table table tbody td.off{background-color:unset!important;color:#d6dae0!important}::ng-deep .custom-calendar .md-drppicker .calendar-table table tbody td.active:hover:not(.off):not(.range-picker-mode),::ng-deep .custom-calendar .md-drppicker .calendar-table table tbody td.active:not(.off):not(.range-picker-mode):not(.force-inactive){background-color:unset!important}::ng-deep .custom-calendar .md-drppicker .calendar-table table tbody td.active:hover:not(.off):not(.range-picker-mode) span,::ng-deep .custom-calendar .md-drppicker .calendar-table table tbody td.active:not(.off):not(.range-picker-mode):not(.force-inactive) span{background-color:#178dfe!important;color:#fff!important}::ng-deep .custom-calendar .md-drppicker .calendar-table table tbody td.force-inactive{background-color:unset!important;color:#5d6a82}::ng-deep .custom-calendar .md-drppicker .calendar-table table tbody td.today:not(.off) span{border:1px solid #178dfe;color:#5d6a82;height:25px!important;width:25px!important}::ng-deep .custom-calendar .md-drppicker .calendar-table table tbody td.today:not(.off).end-date:not(.force-inactive) span,::ng-deep .custom-calendar .md-drppicker .calendar-table table tbody td.today:not(.off).start-date:not(.force-inactive) span{color:#fff}.hide-ranges ::ng-deep.ranges{display:none}"]
-            },] }
-];
-/** @nocollapse */
-DatepickerComponent.ctorParameters = () => [
-    { type: ChangeDetectorRef }
-];
-DatepickerComponent.propDecorators = {
-    datepickerRef: [{ type: ViewChild, args: ['datepickerRef',] }],
-    firstDayOfWeek: [{ type: Input }],
-    i18n: [{ type: Input }],
-    locale: [{ type: Input }],
-    maxDate: [{ type: Input }],
-    minDate: [{ type: Input }],
-    mode: [{ type: Input }],
-    selectedDate: [{ type: Input }],
-    selectedDates: [{ type: Input }],
-    selectedPeriod: [{ type: Input }],
-    showRanges: [{ type: Input }],
-    dateSelected: [{ type: Output }],
-    periodSelected: [{ type: Output }]
-};
-
-class DotsStepperComponent {
-    constructor() {
-        this.disabled = false;
-        this.forwardAllowed = true;
-        this.items = [];
-        this.size = '';
-        this.dotClick = new EventEmitter();
-    }
-    ngOnChanges() {
-        this.currentItem = this.items[this.index];
-    }
-    onDotClick(event, item, index) {
-        event.stopPropagation();
-        if (this.disabled || (!this.forwardAllowed && index > this.index)) {
-            return;
-        }
-        this.currentItem = item;
-        this.index = index;
-        this.dotClick.emit(this.index);
-    }
-}
-DotsStepperComponent.decorators = [
-    { type: Component, args: [{
-                changeDetection: ChangeDetectionStrategy.OnPush,
-                selector: 'ap-dots-stepper',
-                template: "<div class=\"dots\"\n    [ngClass]=\"{'small-dots': size == 'small'}\">\n    <div class=\"dot\"\n         *ngFor=\"let item of items; let i = index\"\n         [ngClass]=\"{'active': item === currentItem, 'disabled': disabled || (!forwardAllowed  && i > index) }\"\n         (click)=\"onDotClick($event, item, i)\">\n    </div>\n</div>\n",
-                styles: ["[color=facebook]{color:#1877f2}[bgcolor=facebook],[hcolor=facebook]:hover{background-color:#1877f2}[border=facebook]{border:1px solid #1877f2}[color=google]{color:#4e85e8}[bgcolor=google],[hcolor=google]:hover{background-color:#4e85e8}[border=google]{border:1px solid #4e85e8}[color=instagram]{color:#e1306c}[bgcolor=instagram],[hcolor=instagram]:hover{background-color:#e1306c}[border=instagram]{border:1px solid #e1306c}[color=instagrammagenta]{color:#c13584}[bgcolor=instagrammagenta],[hcolor=instagrammagenta]:hover{background-color:#c13584}[border=instagrammagenta]{border:1px solid #c13584}[color=instagramblue]{color:#5851db}[bgcolor=instagramblue],[hcolor=instagramblue]:hover{background-color:#5851db}[border=instagramblue]{border:1px solid #5851db}[color=instagrampurple]{color:#833ab4}[bgcolor=instagrampurple],[hcolor=instagrampurple]:hover{background-color:#833ab4}[border=instagrampurple]{border:1px solid #833ab4}[color=instagramorange]{color:#f56040}[bgcolor=instagramorange],[hcolor=instagramorange]:hover{background-color:#f56040}[border=instagramorange]{border:1px solid #f56040}[color=instagramyellow]{color:#ffdc80}[bgcolor=instagramyellow],[hcolor=instagramyellow]:hover{background-color:#ffdc80}[border=instagramyellow]{border:1px solid #ffdc80}[color=linkedin]{color:#2c67bc}[bgcolor=linkedin],[hcolor=linkedin]:hover{background-color:#2c67bc}[border=linkedin]{border:1px solid #2c67bc}[color=twitter]{color:#55acee}[bgcolor=twitter],[hcolor=twitter]:hover{background-color:#55acee}[border=twitter]{border:1px solid #55acee}[color=youtube]{color:red}[bgcolor=youtube],[hcolor=youtube]:hover{background-color:red}[border=youtube]{border:1px solid red}[color=blood-orange]{color:#ff4d00}[bgcolor=blood-orange],[hcolor=blood-orange]:hover{background-color:#ff4d00}[border=blood-orange]{border:1px solid #ff4d00}[color=pinkish-orange]{color:#ff7b49}[bgcolor=pinkish-orange],[hcolor=pinkish-orange]:hover{background-color:#ff7b49}[border=pinkish-orange]{border:1px solid #ff7b49}[color=charcoal-grey]{color:#2a2f34}[bgcolor=charcoal-grey],[hcolor=charcoal-grey]:hover{background-color:#2a2f34}[border=charcoal-grey]{border:1px solid #2a2f34}[color=azure]{color:#00aeef}[bgcolor=azure],[hcolor=azure]:hover{background-color:#00aeef}[border=azure]{border:1px solid #00aeef}[color=light-azure]{color:#eaf5fd}[bgcolor=light-azure],[hcolor=light-azure]:hover{background-color:#eaf5fd}[border=light-azure]{border:1px solid #eaf5fd}[color=blue-grey]{color:#8d98a9}[bgcolor=blue-grey],[hcolor=blue-grey]:hover{background-color:#8d98a9}[border=blue-grey]{border:1px solid #8d98a9}[color=silver]{color:#ced0da}[bgcolor=silver],[hcolor=silver]:hover{background-color:#ced0da}[border=silver]{border:1px solid #ced0da}[color=pale-grey]{color:#dfe3e9}[bgcolor=pale-grey],[hcolor=pale-grey]:hover{background-color:#dfe3e9}[border=pale-grey]{border:1px solid #dfe3e9}[color=grey-white]{color:#f5f7f8}[bgcolor=grey-white],[hcolor=grey-white]:hover{background-color:#f5f7f8}[border=grey-white]{border:1px solid #f5f7f8}[color=cool-grey]{color:#b4bbc6}[bgcolor=cool-grey],[hcolor=cool-grey]:hover{background-color:#b4bbc6}[border=cool-grey]{border:1px solid #b4bbc6}[color=black]{color:#344563}[bgcolor=black],[hcolor=black]:hover{background-color:#344563}[border=black]{border:1px solid #344563}[color=grey-blue]{color:#68768c}[bgcolor=grey-blue],[hcolor=grey-blue]:hover{background-color:#68768c}[border=grey-blue]{border:1px solid #68768c}[color=strawberry]{color:#f4282d}[bgcolor=strawberry],[hcolor=strawberry]:hover{background-color:#f4282d}[border=strawberry]{border:1px solid #f4282d}[color=light-strawberry]{color:#f8eded}[bgcolor=light-strawberry],[hcolor=light-strawberry]:hover{background-color:#f8eded}[border=light-strawberry]{border:1px solid #f8eded}[color=white]{color:#fff}[bgcolor=white],[hcolor=white]:hover{background-color:#fff}[border=white]{border:1px solid #fff}[color=cool-green]{color:#33c15d}[bgcolor=cool-green],[hcolor=cool-green]:hover{background-color:#33c15d}[border=cool-green]{border:1px solid #33c15d}[color=light-green]{color:#ebfaef}[bgcolor=light-green],[hcolor=light-green]:hover{background-color:#ebfaef}[border=light-green]{border:1px solid #ebfaef}[color=transparent]{color:#0000}[bgcolor=transparent],[hcolor=transparent]:hover{background-color:initial}[border=transparent]{border:1px solid #0000}[color=c0]{color:#a566a5}[bgcolor=c0],[hcolor=c0]:hover{background-color:#a566a5}[border=c0]{border:1px solid #a566a5}[color=c1]{color:#c7ab82}[bgcolor=c1],[hcolor=c1]:hover{background-color:#c7ab82}[border=c1]{border:1px solid #c7ab82}[color=c2]{color:#f2713c}[bgcolor=c2],[hcolor=c2]:hover{background-color:#f2713c}[border=c2]{border:1px solid #f2713c}[color=c3]{color:#ffd006}[bgcolor=c3],[hcolor=c3]:hover{background-color:#ffd006}[border=c3]{border:1px solid #ffd006}[color=c4]{color:#94c5aa}[bgcolor=c4],[hcolor=c4]:hover{background-color:#94c5aa}[border=c4]{border:1px solid #94c5aa}[color=c5]{color:#2a9d8f}[bgcolor=c5],[hcolor=c5]:hover{background-color:#2a9d8f}[border=c5]{border:1px solid #2a9d8f}[color=c6]{color:#78acd8}[bgcolor=c6],[hcolor=c6]:hover{background-color:#78acd8}[border=c6]{border:1px solid #78acd8}[color=c7]{color:#525a9e}[bgcolor=c7],[hcolor=c7]:hover{background-color:#525a9e}[border=c7]{border:1px solid #525a9e}[color=c8]{color:#6a2459}[bgcolor=c8],[hcolor=c8]:hover{background-color:#6a2459}[border=c8]{border:1px solid #6a2459}[color=c9]{color:#74729e}[bgcolor=c9],[hcolor=c9]:hover{background-color:#74729e}[border=c9]{border:1px solid #74729e}.dots{align-items:stretch;box-sizing:border-box;display:flex;flex-direction:row;place-content:stretch center;position:absolute}.dots .dot{-webkit-transition:all .2s ease-in-out;background:#d6dae0;border-radius:50%;cursor:pointer;height:8px;margin:16px 4px;transition:all .2s ease-in-out;width:8px}.dots .dot.active{background:#178dfe;cursor:auto}.dots .dot.disabled{background:#d6dae0;cursor:auto}.dots.small-dots .dot{height:6px;margin:16px 2px;width:6px}"]
-            },] }
-];
-/** @nocollapse */
-DotsStepperComponent.ctorParameters = () => [];
-DotsStepperComponent.propDecorators = {
-    disabled: [{ type: Input }],
-    forwardAllowed: [{ type: Input }],
-    index: [{ type: Input }],
-    items: [{ type: Input }],
-    size: [{ type: Input }],
-    dotClick: [{ type: Output }]
-};
-
-class EditTagsModalComponent {
-    constructor(data, dialogRef, dialog) {
-        this.data = data;
-        this.dialogRef = dialogRef;
-        this.dialog = dialog;
-        this.deletedTags = [];
-        this.editTag = new EventEmitter();
-        this.savingTags = [];
-        this.tagEditedIndex = null;
-        this.updatedTags = new Map();
-        this.updateStatusByTags = new Map();
-        this.destroy$ = new Subject();
-        data.tags$.pipe(takeUntil(this.destroy$)).subscribe(tags => {
-            if (tags) {
-                this.tags = [...tags];
-                this.filteredTags = [...tags];
-                tags.forEach(tag => this.updatedTags.set(tag, tag));
-            }
-        });
-        data.updateStatusByTag$.pipe(takeUntil(this.destroy$)).subscribe((updateStatusByTag) => {
-            if (updateStatusByTag) {
-                const updateStatusByTagMap = new Map();
-                updateStatusByTag.forEach(value => {
-                    updateStatusByTagMap.set(value.tag, value.loading);
-                    if (value.loading === false) {
-                        this.updateTagSuccess(value.tag);
-                    }
-                });
-                this.updateStatusByTags = updateStatusByTagMap;
-            }
-        });
-    }
-    cancelEdit() {
-        this.tagEditedIndex = null;
-    }
-    onDone() {
-        this.dialogRef.close();
-    }
-    onEdit(index) {
-        this.tagEditedIndex = index;
-    }
-    onRemove(tag) {
-        this.updatedTags.set(tag, null);
-        const updatedTag = new Map();
-        updatedTag.set(tag, null);
-        this.editTag.emit(updatedTag);
-        this.tagEditedIndex = null;
-    }
-    onValidateInput(index) {
-        this.onValidate(this.tagInput.nativeElement.value, index);
-    }
-    onValidate(value, index) {
-        if (value) {
-            const entry = Array.from(this.updatedTags.entries()).find(((keyValue) => keyValue[1] === this.tags[index]));
-            this.updatedTags.set(entry[0], value);
-            const updatedTag = new Map();
-            updatedTag.set(entry[0], value);
-            this.tags[index] = value;
-            this.filteredTags[index] = value;
-            this.editTag.emit(updatedTag);
-            this.savingTags.push(value);
-            this.tagEditedIndex = null;
-        }
-    }
-    onValidateEnter(event, index) {
-        if (event.key === 'Enter') {
-            this.onValidate(event.target.value, index);
-        }
-    }
-    onSearch(tag) {
-        this.filteredTags = Array.from(this.updatedTags.values()).filter((item) => item === null || item === void 0 ? void 0 : item.toLowerCase().includes(tag.toLowerCase()));
-    }
-    updateTagSuccess(tag) {
-        if (this.updatedTags.get(tag) === null) {
-            this.deletedTags.push(tag);
-            setTimeout(() => {
-                this.tags = this.tags.filter(tagToFilter => tagToFilter !== tag);
-                this.filteredTags = this.filteredTags.filter(tagToFilter => tagToFilter !== tag);
-                this.deletedTags = this.deletedTags.filter(tagToFilter => tagToFilter !== tag);
-            }, 2000);
-        }
-        else {
-            setTimeout(() => {
-                this.savingTags = this.savingTags.filter(tagToFilter => tagToFilter !== tag);
-            }, 6000);
-        }
-    }
-    ngOnDestroy() {
-        this.destroy$.next();
-        this.destroy$.complete();
-    }
-}
-EditTagsModalComponent.decorators = [
-    { type: Component, args: [{
-                template: "<ng-template #headerTemplate>\n    <h2 class=\"title\">\n        {{ data.translatedString.title }}\n    </h2>\n    <p class=\"large\">{{ data.translatedString.subtitle }}</p>\n</ng-template>\n<ng-template #mainTemplate>\n    <div class=\"main-container\">\n        <div class=\"search\">\n            <div class=\"input-group\">\n                <input type=\"text\"\n                       placeholder=\"{{ data.translatedString.searchPlaceholder }}\"\n                       (keyup)=\"onSearch($event.target.value)\">\n                <ap-symbol class=\"input-group-append\"\n                           [symbolId]=\"'search-alternate'\"\n                           [size]=\"'micro'\">\n                </ap-symbol>\n            </div>\n        </div>\n        <div class=\"tags-content\" *ngIf=\"filteredTags\">\n            <div class=\"tag-row\" *ngFor=\"let tag of filteredTags;let i=index\"\n                 [@tagRemoved]=\"deletedTags.includes(filteredTags[i]) ? 'deleted' : 'valid'\">\n                <span *ngIf=\"tagEditedIndex !== i\" [class.disabled]=\"tagEditedIndex !== null\"> {{tag}} </span>\n                <input type=\"text\" *ngIf=\"tagEditedIndex === i\" [value]=\"filteredTags[i]\"\n                       (keyup)=\"onValidateEnter($event, i)\" #tagInput/>\n                <div class=\"button-container\">\n                    <img alt=\"spinner-loading\" width=\"20\" height=\"20\" src=\"../../assets/img/spinner_animation.gif\"\n                         *ngIf=\"updateStatusByTags?.get(filteredTags[i]) || updateStatusByTags?.get(tag)\"/>\n                    <div class=\"edit-label saved-label\"\n                         *ngIf=\"updateStatusByTags?.get(filteredTags[i]) === false && tagEditedIndex != i && savingTags.includes(filteredTags[i])\"\n                         [@tagSaved]>\n                        <ap-symbol [symbolId]=\"'check-1'\" [size]=\"'pico'\"></ap-symbol>\n                        {{ data.translatedString.savedLabel }}\n                    </div>\n                    <div class=\"edit-label deleted-label\"\n                         *ngIf=\"updateStatusByTags?.get(filteredTags[i]) === false && updatedTags && updatedTags.has(tag) && updatedTags.get(tag) === null\">\n                        <ap-symbol [symbolId]=\"'delete-2-alternate'\" [size]=\"'pico'\"></ap-symbol>\n                        {{ data.translatedString.deletedLabel }}\n                    </div>\n                    <button mat-flat-button *ngIf=\"tagEditedIndex !== i\"\n                            class=\"circle edit-button\"\n                            (click)=\"onEdit(i)\">\n                        <ap-symbol [symbolId]=\"'pencil-2'\"></ap-symbol>\n                    </button>\n                    <div *ngIf=\"tagEditedIndex === i\">\n                        <button mat-flat-button\n                                class=\"circle button-action button-validate\"\n                                [apTooltipNeo]=\"{content: data.translatedString.validateTooltip}\"\n                                [color]=\"'#858fa1'\"\n                                (click)=\"onValidateInput(i)\">\n                            <ap-symbol symbolId=\"check-2\"></ap-symbol>\n                        </button>\n                        <button mat-flat-button\n                                class=\"circle button-action button-cancel\"\n                                [apTooltipNeo]=\"{content: data.translatedString.cancelTooltip}\"\n                                [color]=\"'#858fa1'\"\n                                (click)=\"cancelEdit()\">\n                            <ap-symbol symbolId=\"delete-2-alternate\"></ap-symbol>\n                        </button>\n                        <button mat-flat-button\n                                class=\"circle button-action button-remove\"\n                                [apTooltipNeo]=\"{content: data.translatedString.deleteTooltip}\"\n                                [color]=\"'#858fa1'\"\n                                (click)=\"onRemove(tag)\">\n                            <ap-symbol symbolId=\"bin-2\"></ap-symbol>\n                        </button>\n                    </div>\n                </div>\n            </div>\n\n        </div>\n        <div class=\"loader\">\n            <img alt=\"spinner-loading\" src=\"../../assets/img/spinner_animation.gif\"\n                 *ngIf=\"!filteredTags\"/>\n        </div>\n    </div>\n</ng-template>\n<ng-template #footerTemplate>\n    <div class=\"footer\">\n        <div>\n            <button mat-flat-button class=\"done-button\" (click)=\"onDone()\" color=\"primary\">\n                {{data.translatedString.doneLabel}}\n            </button>\n        </div>\n    </div>\n\n</ng-template>\n\n<ap-modal class=\"design-system\"\n          closable=\"true\"\n          [headerTemplate]=\"headerTemplate\"\n          [mainTemplate]=\"mainTemplate\"\n          [footerTemplate]=\"footerTemplate\"></ap-modal>\n",
-                animations: [
-                    trigger('tagSaved', [
-                        transition('void => *', [
-                            style({ opacity: 1 }),
-                            style({ width: 'fit-content' }),
-                            style({ display: 'flex' }),
-                            animate('6000ms', style({ opacity: 0 })),
-                        ]),
-                    ]),
-                    trigger('tagRemoved', [
-                        transition('valid => deleted', [
-                            style({ opacity: 1 }),
-                            animate('1000ms 1000ms', style({ opacity: 0 })),
-                        ]),
-                    ])
-                ],
-                styles: ["[color=facebook]{color:#1877f2}[bgcolor=facebook],[hcolor=facebook]:hover{background-color:#1877f2}[border=facebook]{border:1px solid #1877f2}[color=google]{color:#4e85e8}[bgcolor=google],[hcolor=google]:hover{background-color:#4e85e8}[border=google]{border:1px solid #4e85e8}[color=instagram]{color:#e1306c}[bgcolor=instagram],[hcolor=instagram]:hover{background-color:#e1306c}[border=instagram]{border:1px solid #e1306c}[color=instagrammagenta]{color:#c13584}[bgcolor=instagrammagenta],[hcolor=instagrammagenta]:hover{background-color:#c13584}[border=instagrammagenta]{border:1px solid #c13584}[color=instagramblue]{color:#5851db}[bgcolor=instagramblue],[hcolor=instagramblue]:hover{background-color:#5851db}[border=instagramblue]{border:1px solid #5851db}[color=instagrampurple]{color:#833ab4}[bgcolor=instagrampurple],[hcolor=instagrampurple]:hover{background-color:#833ab4}[border=instagrampurple]{border:1px solid #833ab4}[color=instagramorange]{color:#f56040}[bgcolor=instagramorange],[hcolor=instagramorange]:hover{background-color:#f56040}[border=instagramorange]{border:1px solid #f56040}[color=instagramyellow]{color:#ffdc80}[bgcolor=instagramyellow],[hcolor=instagramyellow]:hover{background-color:#ffdc80}[border=instagramyellow]{border:1px solid #ffdc80}[color=linkedin]{color:#2c67bc}[bgcolor=linkedin],[hcolor=linkedin]:hover{background-color:#2c67bc}[border=linkedin]{border:1px solid #2c67bc}[color=twitter]{color:#55acee}[bgcolor=twitter],[hcolor=twitter]:hover{background-color:#55acee}[border=twitter]{border:1px solid #55acee}[color=youtube]{color:red}[bgcolor=youtube],[hcolor=youtube]:hover{background-color:red}[border=youtube]{border:1px solid red}[color=blood-orange]{color:#ff4d00}[bgcolor=blood-orange],[hcolor=blood-orange]:hover{background-color:#ff4d00}[border=blood-orange]{border:1px solid #ff4d00}[color=pinkish-orange]{color:#ff7b49}[bgcolor=pinkish-orange],[hcolor=pinkish-orange]:hover{background-color:#ff7b49}[border=pinkish-orange]{border:1px solid #ff7b49}[color=charcoal-grey]{color:#2a2f34}[bgcolor=charcoal-grey],[hcolor=charcoal-grey]:hover{background-color:#2a2f34}[border=charcoal-grey]{border:1px solid #2a2f34}[color=azure]{color:#00aeef}[bgcolor=azure],[hcolor=azure]:hover{background-color:#00aeef}[border=azure]{border:1px solid #00aeef}[color=light-azure]{color:#eaf5fd}[bgcolor=light-azure],[hcolor=light-azure]:hover{background-color:#eaf5fd}[border=light-azure]{border:1px solid #eaf5fd}[color=blue-grey]{color:#8d98a9}[bgcolor=blue-grey],[hcolor=blue-grey]:hover{background-color:#8d98a9}[border=blue-grey]{border:1px solid #8d98a9}[color=silver]{color:#ced0da}[bgcolor=silver],[hcolor=silver]:hover{background-color:#ced0da}[border=silver]{border:1px solid #ced0da}[color=pale-grey]{color:#dfe3e9}[bgcolor=pale-grey],[hcolor=pale-grey]:hover{background-color:#dfe3e9}[border=pale-grey]{border:1px solid #dfe3e9}[color=grey-white]{color:#f5f7f8}[bgcolor=grey-white],[hcolor=grey-white]:hover{background-color:#f5f7f8}[border=grey-white]{border:1px solid #f5f7f8}[color=cool-grey]{color:#b4bbc6}[bgcolor=cool-grey],[hcolor=cool-grey]:hover{background-color:#b4bbc6}[border=cool-grey]{border:1px solid #b4bbc6}[color=black]{color:#344563}[bgcolor=black],[hcolor=black]:hover{background-color:#344563}[border=black]{border:1px solid #344563}[color=grey-blue]{color:#68768c}[bgcolor=grey-blue],[hcolor=grey-blue]:hover{background-color:#68768c}[border=grey-blue]{border:1px solid #68768c}[color=strawberry]{color:#f4282d}[bgcolor=strawberry],[hcolor=strawberry]:hover{background-color:#f4282d}[border=strawberry]{border:1px solid #f4282d}[color=light-strawberry]{color:#f8eded}[bgcolor=light-strawberry],[hcolor=light-strawberry]:hover{background-color:#f8eded}[border=light-strawberry]{border:1px solid #f8eded}[color=white]{color:#fff}[bgcolor=white],[hcolor=white]:hover{background-color:#fff}[border=white]{border:1px solid #fff}[color=cool-green]{color:#33c15d}[bgcolor=cool-green],[hcolor=cool-green]:hover{background-color:#33c15d}[border=cool-green]{border:1px solid #33c15d}[color=light-green]{color:#ebfaef}[bgcolor=light-green],[hcolor=light-green]:hover{background-color:#ebfaef}[border=light-green]{border:1px solid #ebfaef}[color=transparent]{color:#0000}[bgcolor=transparent],[hcolor=transparent]:hover{background-color:initial}[border=transparent]{border:1px solid #0000}[color=c0]{color:#a566a5}[bgcolor=c0],[hcolor=c0]:hover{background-color:#a566a5}[border=c0]{border:1px solid #a566a5}[color=c1]{color:#c7ab82}[bgcolor=c1],[hcolor=c1]:hover{background-color:#c7ab82}[border=c1]{border:1px solid #c7ab82}[color=c2]{color:#f2713c}[bgcolor=c2],[hcolor=c2]:hover{background-color:#f2713c}[border=c2]{border:1px solid #f2713c}[color=c3]{color:#ffd006}[bgcolor=c3],[hcolor=c3]:hover{background-color:#ffd006}[border=c3]{border:1px solid #ffd006}[color=c4]{color:#94c5aa}[bgcolor=c4],[hcolor=c4]:hover{background-color:#94c5aa}[border=c4]{border:1px solid #94c5aa}[color=c5]{color:#2a9d8f}[bgcolor=c5],[hcolor=c5]:hover{background-color:#2a9d8f}[border=c5]{border:1px solid #2a9d8f}[color=c6]{color:#78acd8}[bgcolor=c6],[hcolor=c6]:hover{background-color:#78acd8}[border=c6]{border:1px solid #78acd8}[color=c7]{color:#525a9e}[bgcolor=c7],[hcolor=c7]:hover{background-color:#525a9e}[border=c7]{border:1px solid #525a9e}[color=c8]{color:#6a2459}[bgcolor=c8],[hcolor=c8]:hover{background-color:#6a2459}[border=c8]{border:1px solid #6a2459}[color=c9]{color:#74729e}[bgcolor=c9],[hcolor=c9]:hover{background-color:#74729e}[border=c9]{border:1px solid #74729e}.title{font-weight:700!important;margin-bottom:16px}p.large{color:#5d6a82;font-size:14px}.max-character-size-notification{margin-top:8px}.content{display:flex;margin-top:16px}.search{padding-bottom:16px}.loader{display:flex;align-items:center;width:100%;flex-direction:column}.tags-content{max-height:245px;overflow-y:scroll;overflow-x:hidden}.tag-row{display:flex;align-items:center;margin-left:-4px;margin-right:-8px;padding:4px;min-height:44px}.tag-row .button-container{flex:1;display:flex;align-items:center}.tag-row .button-container .edit-button{display:none}.tag-row .button-container .edit-label{display:none;align-items:center;opacity:0;background-color:#ecf7ed;color:#45b854;border-radius:25px;align-self:center;width:0;padding:4px 8px;font-weight:700;font-size:10px;line-height:12px}.tag-row .button-container .edit-label ap-symbol{padding-right:4px}.tag-row .button-container .edit-label.deleted-label{display:flex;width:-moz-fit-content;width:fit-content;opacity:1;background-color:#fde7e7;color:#e81313}.tag-row input,.tag-row span{margin-right:8px}.tag-row input{width:252px;max-width:252px}.tag-row:not(.disabled):hover .button-container .edit-button{display:block}.tag-row .disabled{color:#aeb5c1}.notification-warning{margin-bottom:8px}.footer{flex-direction:column}.footer,.footer div{display:flex}.footer p{text-align:right;color:#e81313}.footer .done-button{background-color:#ff6726;color:#fff}.footer .done-button:hover{background-color:#ff560d}.footer .done-button:active{background-color:#ff4d00}:host::ng-deep button,:host::ng-deep input,:host::ng-deep select,:host::ng-deep textarea{outline:none}:host::ng-deep input{border-radius:4px;color:#344563;font-family:Averta;font-size:14px;font-weight:400;padding:8px 16px}:host::ng-deep input::placeholder{color:#aeb5c1}:host::ng-deep input:focus:not(.transparent){border-color:#178dfe}:host::ng-deep .input-group{display:flex;flex-direction:row;width:252px;border:1px solid #d6dae0;border-radius:4px;color:#344563}:host::ng-deep .input-group input{border:none;box-sizing:border-box;width:100%}:host::ng-deep .input-group .input-group-append{position:relative;top:10px;right:10px;height:15px;width:15px;color:#858fa1}"]
-            },] }
-];
-/** @nocollapse */
-EditTagsModalComponent.ctorParameters = () => [
-    { type: undefined, decorators: [{ type: Inject, args: [MAT_DIALOG_DATA,] }] },
-    { type: MatDialogRef },
-    { type: MatDialog }
-];
-EditTagsModalComponent.propDecorators = {
-    tagInput: [{ type: ViewChild, args: ['tagInput',] }]
-};
-
-var InstagramCarouselItemType;
-(function (InstagramCarouselItemType) {
-    InstagramCarouselItemType["IMAGE"] = "photo";
-    InstagramCarouselItemType["VIDEO"] = "video";
-})(InstagramCarouselItemType || (InstagramCarouselItemType = {}));
-class ImageCarouselComponent {
-    constructor(animationBuilder) {
-        this.animationBuilder = animationBuilder;
-        this.InstagramCarouselItemType = InstagramCarouselItemType;
-        this.items = [];
-        this.dotsInside = false;
-        this.soundEnabled = false;
-        this.supportGif = true;
-        this.tinyMode = false;
-        this.currentImageChanged = new EventEmitter();
-        this._selectedIndex = 0;
-        this.carouselOffset = 0;
-        this.videoPlayers = [];
-    }
-    get selectedIndex() {
-        return this._selectedIndex;
-    }
-    set selectedIndex(value) {
-        this.videoPause(this.selectedIndex);
-        if (value < 0) {
-            value = 0;
-        }
-        if (value > this.items.length - 1) {
-            value = this.items.length - 1;
-        }
-        this._selectedIndex = value;
-        this.move();
-        if (this.tinyMode && this.mouseOver) {
-            this.videoPlay(this.selectedIndex);
-        }
-    }
-    isPrevButtonEnabled() {
-        return this.selectedIndex > 0;
-    }
-    isNextButtonEnabled() {
-        if (this.items && this.items[this.selectedIndex]) {
-            return this.selectedIndex < this.items.length - 1;
-        }
-        return false;
-    }
-    isVideo() {
-        if (this.items && this.items[this.selectedIndex]) {
-            return this.items[this.selectedIndex].type === InstagramCarouselItemType.VIDEO;
-        }
-        return false;
-    }
-    dotsDisplayed() {
-        if (this.items && this.items[this.selectedIndex]) {
-            return this.items.length > 1;
-        }
-        return false;
-    }
-    prev() {
-        this.selectedIndex -= 1;
-        this.currentImageChanged.emit(this.items[this.selectedIndex]);
-    }
-    next() {
-        this.selectedIndex += 1;
-        this.currentImageChanged.emit(this.items[this.selectedIndex]);
-    }
-    play(event, index) {
-        if (!this.tinyMode) {
-            const videoPlayer = this.videoPlayers[index];
-            if (videoPlayer) {
-                videoPlayer.paused ? this.videoPlay(index) : this.videoPause(index);
-            }
-            event.stopPropagation();
-        }
-    }
-    move(instantaneous = false) {
-        this.carouselOffset = -this.carousel.nativeElement.offsetWidth * this.selectedIndex;
-        this.animationBuilder.build(animate(instantaneous ? '1ms' : '250ms ease-in', style({ transform: `translateX(${this.carouselOffset}px)` }))).create(this.carousel.nativeElement).play();
-    }
-    onMouseEntersVideo(event, index) {
-        this.mouseOver = true;
-        if (this.tinyMode) {
-            this.videoPlay(index);
-        }
-    }
-    onMouseLeavesVideo(event, index) {
-        this.mouseOver = false;
-        if (this.tinyMode) {
-            this.videoPause(index);
-        }
-    }
-    onResize(event) {
-        this.move(true);
-    }
-    registerVideoPlayer(event, index) {
-        this.videoPlayers[index] = event.target;
-        event.target.muted = !this.soundEnabled;
-    }
-    videoPause(index) {
-        const videoPlayer = this.videoPlayers[index];
-        if (videoPlayer) {
-            videoPlayer.pause();
-            this.isPlaying = false;
-        }
-    }
-    videoPlay(index) {
-        const videoPlayer = this.videoPlayers[index];
-        if (videoPlayer) {
-            videoPlayer.play();
-            this.isPlaying = true;
-        }
-    }
-    switchSound() {
-        this.soundEnabled = !this.soundEnabled;
-        for (const player of this.videoPlayers) {
-            player.muted = !this.soundEnabled;
-        }
-    }
-}
-ImageCarouselComponent.decorators = [
-    { type: Component, args: [{
-                changeDetection: ChangeDetectionStrategy.OnPush,
-                selector: 'ap-image-carousel',
-                template: "<section *ngIf=\"items && items.length > 0 && items[0].url\">\n    <div class=\"carousel-wrapper\"\n         (mouseenter)=\"onMouseEntersVideo($event, selectedIndex)\"\n         (mouseleave)=\"onMouseLeavesVideo($event, selectedIndex)\">\n        <ul class=\"carousel-inner\" #carousel>\n            <li *ngFor=\"let item of items; let i = index\" class=\"carousel-item\">\n                <ng-template [ngIf]=\"item.type === InstagramCarouselItemType.IMAGE && item.url\">\n                    <img apFrozenGif\n                         [apFrozen]=\"!supportGif\"\n                         [default]=\"'assets/img/default.png'\"\n                         [src]=\"item.url\">\n                </ng-template>\n                <ng-template [ngIf]=\"item.type === InstagramCarouselItemType.VIDEO && item.url\">\n                    <video [id]=\"'video-' + i\"\n                           [attr.poster]=\"item.thumbnailUrl\"\n                           [loop]=\"tinyMode\"\n                           [src]=\"item.url\"\n                           (click)=\"play($event, i)\"\n                           (ended)=\"isPlaying = false\"\n                           (loadstart)=\"registerVideoPlayer($event, i)\">\n                    </video>\n                    <svg class=\"play-button\"\n                         xmlns=\"http://www.w3.org/2000/svg\"\n                         (click)=\"play($event, i)\">\n                        <path *ngIf=\"!isPlaying\" d=\"M11,10 L18,13.74 18,22.28 11,26 M18,13.74 L26,18 26,18 18,22.28\"/>\n                    </svg>\n                    <mat-icon class=\"sound-button\"\n                              *ngIf=\"!tinyMode\"\n                              (click)=\"switchSound(); $event.stopPropagation();\">\n                        {{soundEnabled ? 'volume_up' : 'volume_off'}}\n                    </mat-icon>\n                </ng-template>\n            </li>\n        </ul>\n\n        <svg class=\"nav-button prev\"\n             [ngClass]=\"{'disabled': !isPrevButtonEnabled(), 'tiny': tinyMode}\"\n             (click)=\"prev(); $event.stopPropagation();\"\n             xmlns=\"http://www.w3.org/2000/svg\"\n             viewBox=\"0 0 455 455\">\n            <path d=\"M227.5,0C101.855,0,0,101.855,0,227.5S101.855,455,227.5,455S455,353.145,455,227.5S353.145,0,227.5,0z M199.476,355.589\n                  l-21.248-21.178L284.791,227.5L178.228,120.589l21.248-21.178L327.148,227.5L199.476,355.589z\"/>\n        </svg>\n\n        <svg class=\"nav-button next\"\n             [ngClass]=\"{'disabled': !isNextButtonEnabled(), 'tiny': tinyMode}\"\n             (click)=\"next(); $event.stopPropagation();\"\n             xmlns=\"http://www.w3.org/2000/svg\"\n             viewBox=\"0 0 455 455\">\n            <path d=\"M227.5,0C101.855,0,0,101.855,0,227.5S101.855,455,227.5,455S455,353.145,455,227.5S353.145,0,227.5,0z M199.476,355.589\n\t              l-21.248-21.178L284.791,227.5L178.228,120.589l21.248-21.178L327.148,227.5L199.476,355.589z\"/>\n        </svg>\n    </div>\n    <div [ngClass]=\"{'inside': dotsInside}\">\n        <ap-dots-stepper\n            fxLayout=\"row\"\n            fxLayoutAlign=\"center\"\n            size=\"small\"\n            *ngIf=\"dotsDisplayed()\"\n            [items]=\"items\"\n            [index]=\"selectedIndex\"\n            (dotClick)=\"selectedIndex = $event\"></ap-dots-stepper>\n    </div>\n</section>\n",
-                styles: ["[color=facebook]{color:#1877f2}[bgcolor=facebook],[hcolor=facebook]:hover{background-color:#1877f2}[border=facebook]{border:1px solid #1877f2}[color=google]{color:#4e85e8}[bgcolor=google],[hcolor=google]:hover{background-color:#4e85e8}[border=google]{border:1px solid #4e85e8}[color=instagram]{color:#e1306c}[bgcolor=instagram],[hcolor=instagram]:hover{background-color:#e1306c}[border=instagram]{border:1px solid #e1306c}[color=instagrammagenta]{color:#c13584}[bgcolor=instagrammagenta],[hcolor=instagrammagenta]:hover{background-color:#c13584}[border=instagrammagenta]{border:1px solid #c13584}[color=instagramblue]{color:#5851db}[bgcolor=instagramblue],[hcolor=instagramblue]:hover{background-color:#5851db}[border=instagramblue]{border:1px solid #5851db}[color=instagrampurple]{color:#833ab4}[bgcolor=instagrampurple],[hcolor=instagrampurple]:hover{background-color:#833ab4}[border=instagrampurple]{border:1px solid #833ab4}[color=instagramorange]{color:#f56040}[bgcolor=instagramorange],[hcolor=instagramorange]:hover{background-color:#f56040}[border=instagramorange]{border:1px solid #f56040}[color=instagramyellow]{color:#ffdc80}[bgcolor=instagramyellow],[hcolor=instagramyellow]:hover{background-color:#ffdc80}[border=instagramyellow]{border:1px solid #ffdc80}[color=linkedin]{color:#2c67bc}[bgcolor=linkedin],[hcolor=linkedin]:hover{background-color:#2c67bc}[border=linkedin]{border:1px solid #2c67bc}[color=twitter]{color:#55acee}[bgcolor=twitter],[hcolor=twitter]:hover{background-color:#55acee}[border=twitter]{border:1px solid #55acee}[color=youtube]{color:red}[bgcolor=youtube],[hcolor=youtube]:hover{background-color:red}[border=youtube]{border:1px solid red}[color=blood-orange]{color:#ff4d00}[bgcolor=blood-orange],[hcolor=blood-orange]:hover{background-color:#ff4d00}[border=blood-orange]{border:1px solid #ff4d00}[color=pinkish-orange]{color:#ff7b49}[bgcolor=pinkish-orange],[hcolor=pinkish-orange]:hover{background-color:#ff7b49}[border=pinkish-orange]{border:1px solid #ff7b49}[color=charcoal-grey]{color:#2a2f34}[bgcolor=charcoal-grey],[hcolor=charcoal-grey]:hover{background-color:#2a2f34}[border=charcoal-grey]{border:1px solid #2a2f34}[color=azure]{color:#00aeef}[bgcolor=azure],[hcolor=azure]:hover{background-color:#00aeef}[border=azure]{border:1px solid #00aeef}[color=light-azure]{color:#eaf5fd}[bgcolor=light-azure],[hcolor=light-azure]:hover{background-color:#eaf5fd}[border=light-azure]{border:1px solid #eaf5fd}[color=blue-grey]{color:#8d98a9}[bgcolor=blue-grey],[hcolor=blue-grey]:hover{background-color:#8d98a9}[border=blue-grey]{border:1px solid #8d98a9}[color=silver]{color:#ced0da}[bgcolor=silver],[hcolor=silver]:hover{background-color:#ced0da}[border=silver]{border:1px solid #ced0da}[color=pale-grey]{color:#dfe3e9}[bgcolor=pale-grey],[hcolor=pale-grey]:hover{background-color:#dfe3e9}[border=pale-grey]{border:1px solid #dfe3e9}[color=grey-white]{color:#f5f7f8}[bgcolor=grey-white],[hcolor=grey-white]:hover{background-color:#f5f7f8}[border=grey-white]{border:1px solid #f5f7f8}[color=cool-grey]{color:#b4bbc6}[bgcolor=cool-grey],[hcolor=cool-grey]:hover{background-color:#b4bbc6}[border=cool-grey]{border:1px solid #b4bbc6}[color=black]{color:#344563}[bgcolor=black],[hcolor=black]:hover{background-color:#344563}[border=black]{border:1px solid #344563}[color=grey-blue]{color:#68768c}[bgcolor=grey-blue],[hcolor=grey-blue]:hover{background-color:#68768c}[border=grey-blue]{border:1px solid #68768c}[color=strawberry]{color:#f4282d}[bgcolor=strawberry],[hcolor=strawberry]:hover{background-color:#f4282d}[border=strawberry]{border:1px solid #f4282d}[color=light-strawberry]{color:#f8eded}[bgcolor=light-strawberry],[hcolor=light-strawberry]:hover{background-color:#f8eded}[border=light-strawberry]{border:1px solid #f8eded}[color=white]{color:#fff}[bgcolor=white],[hcolor=white]:hover{background-color:#fff}[border=white]{border:1px solid #fff}[color=cool-green]{color:#33c15d}[bgcolor=cool-green],[hcolor=cool-green]:hover{background-color:#33c15d}[border=cool-green]{border:1px solid #33c15d}[color=light-green]{color:#ebfaef}[bgcolor=light-green],[hcolor=light-green]:hover{background-color:#ebfaef}[border=light-green]{border:1px solid #ebfaef}[color=transparent]{color:#0000}[bgcolor=transparent],[hcolor=transparent]:hover{background-color:initial}[border=transparent]{border:1px solid #0000}[color=c0]{color:#a566a5}[bgcolor=c0],[hcolor=c0]:hover{background-color:#a566a5}[border=c0]{border:1px solid #a566a5}[color=c1]{color:#c7ab82}[bgcolor=c1],[hcolor=c1]:hover{background-color:#c7ab82}[border=c1]{border:1px solid #c7ab82}[color=c2]{color:#f2713c}[bgcolor=c2],[hcolor=c2]:hover{background-color:#f2713c}[border=c2]{border:1px solid #f2713c}[color=c3]{color:#ffd006}[bgcolor=c3],[hcolor=c3]:hover{background-color:#ffd006}[border=c3]{border:1px solid #ffd006}[color=c4]{color:#94c5aa}[bgcolor=c4],[hcolor=c4]:hover{background-color:#94c5aa}[border=c4]{border:1px solid #94c5aa}[color=c5]{color:#2a9d8f}[bgcolor=c5],[hcolor=c5]:hover{background-color:#2a9d8f}[border=c5]{border:1px solid #2a9d8f}[color=c6]{color:#78acd8}[bgcolor=c6],[hcolor=c6]:hover{background-color:#78acd8}[border=c6]{border:1px solid #78acd8}[color=c7]{color:#525a9e}[bgcolor=c7],[hcolor=c7]:hover{background-color:#525a9e}[border=c7]{border:1px solid #525a9e}[color=c8]{color:#6a2459}[bgcolor=c8],[hcolor=c8]:hover{background-color:#6a2459}[border=c8]{border:1px solid #6a2459}[color=c9]{color:#74729e}[bgcolor=c9],[hcolor=c9]:hover{background-color:#74729e}[border=c9]{border:1px solid #74729e}section{position:relative}section .carousel-wrapper{overflow:hidden;width:100%;padding-top:100%;position:relative}section .carousel-wrapper .carousel-inner{position:absolute;top:0;margin:0;padding:0;width:100%;height:100%;display:flex;list-style:none}section .carousel-wrapper .carousel-inner .carousel-item{position:relative;width:100%;flex-shrink:0;text-align:center}section .carousel-wrapper .carousel-inner .carousel-item img,section .carousel-wrapper .carousel-inner .carousel-item video{height:100%;width:100%;object-fit:cover;object-position:center}section .carousel-wrapper .carousel-inner .carousel-item .play-button{z-index:1000;position:absolute;top:0;right:0;bottom:0;left:0;width:32px;height:32px;transform:scale(2);margin:auto;filter:drop-shadow(0 0 1px rgba(0,0,0,.25))}section .carousel-wrapper .carousel-inner .carousel-item .play-button path{fill:#fffc}section .carousel-wrapper .carousel-inner .carousel-item .sound-button{z-index:1000;position:absolute;right:8px;bottom:8px;color:#fff}section .carousel-wrapper .nav-button{width:30px;height:30px;position:absolute;top:0;bottom:0;cursor:pointer;margin:auto;opacity:.4;filter:drop-shadow(0 0 1px rgba(0,0,0,.25))}section .carousel-wrapper .nav-button.tiny{width:20px;height:20px}section .carousel-wrapper .nav-button path{fill:#fffc}section .carousel-wrapper .nav-button.prev{left:12px;transform:rotate(180deg)}section .carousel-wrapper .nav-button.next{right:12px}section .carousel-wrapper .nav-button.disabled{display:none}section ::ng-deep div.inside ap-dots-stepper div.dots{bottom:0;width:calc(100% - 80px)}"]
-            },] }
-];
-/** @nocollapse */
-ImageCarouselComponent.ctorParameters = () => [
-    { type: AnimationBuilder }
-];
-ImageCarouselComponent.propDecorators = {
-    carousel: [{ type: ViewChild, args: ['carousel',] }],
-    items: [{ type: Input }],
-    dotsInside: [{ type: Input }],
-    soundEnabled: [{ type: Input }],
-    supportGif: [{ type: Input }],
-    tinyMode: [{ type: Input }],
-    currentImageChanged: [{ type: Output }],
-    onResize: [{ type: HostListener, args: ['window:resize', ['$event'],] }]
-};
-
-class FeatureOnboardingComponent {
-    constructor(dialogRef) {
-        this.dialogRef = dialogRef;
-        // translations
-        this.backButtonLabel = '';
-        this.finishButtonLabel = '';
-        this.nextButtonLabel = '';
-        this.arrowsDisplayed = false; // To display arrows to switch element on carousel
-        this.slideDisplayedIndex = 0; // The current element displayed
-    }
-    onClickNext() {
-        this.slideDisplayedIndex !== this.templates.length - 1 ? this.slideDisplayedIndex = this.slideDisplayedIndex + 1 : this.onCloseCarousel();
-    }
-    onClickPrevious() {
-        this.slideDisplayedIndex = this.slideDisplayedIndex - 1;
-    }
-    onCloseCarousel() {
-        this.dialogRef.close(true);
-    }
-}
-FeatureOnboardingComponent.decorators = [
-    { type: Component, args: [{
-                changeDetection: ChangeDetectionStrategy.OnPush,
-                selector: 'ap-feature-onboarding',
-                template: "<ng-template #mainTemplate>\n    <div class=\"carousel-main-container\">\n        <div class=\"carousel-content\">\n            <div *ngFor=\"let template of templates; let i = index\"\n                 class=\"carousel-slide-element\"\n                 [class.carousel-slide-element-not-displayed]=\"i !== slideDisplayedIndex\"\n                 [class.carousel-slide-element-active]=\"i === slideDisplayedIndex\">\n                <ng-container *ngTemplateOutlet=\"template\"></ng-container>\n                <div class=\"carousel-dots-container\">\n                    <ap-dots-stepper\n                        fxLayout=\"row\"\n                        fxLayoutAlign=\"center\"\n                        size=\"small\"\n                        *ngIf=\"templates.length > 1\"\n                        [items]=\"templates\"\n                        [index]=\"slideDisplayedIndex\"\n                        (dotClick)=\"slideDisplayedIndex = $event\"></ap-dots-stepper>\n                </div>\n            </div>\n\n            <div *ngIf=\"arrowsDisplayed\">\n                <ap-symbol *ngIf=\"slideDisplayedIndex !== 0\"\n                           class=\"nav-button prev\"\n                           [symbolId]=\"'arrow-button-left'\"\n                           (click)=\"onClickPrevious()\">\n                </ap-symbol>\n\n                <ap-symbol class=\"nav-button next\"\n                           [symbolId]=\"'arrow-button-right'\"\n                           (click)=\"onClickNext(); $event.stopPropagation();\">\n                </ap-symbol>\n            </div>\n        </div>\n\n        <div class=\"carousel-footer\">\n            <div class=\"button-container\">\n                <button *ngIf=\"slideDisplayedIndex !== 0\"\n                        mat-flat-button\n                        class=\"carousel-previous-button\"\n                        (click)=\"onClickPrevious()\">\n                    {{backButtonLabel}}\n                </button>\n                <button mat-flat-button\n                        [color]=\"'primary'\"\n                        (click)=\"onClickNext()\">\n                    <div *ngIf=\"slideDisplayedIndex !== templates.length - 1\">{{nextButtonLabel}}</div>\n                    <div *ngIf=\"slideDisplayedIndex === templates.length - 1\">{{finishButtonLabel}}</div>\n                </button>\n            </div>\n        </div>\n    </div>\n</ng-template>\n\n<ap-modal class=\"design-system\"\n          [closable]=\"false\"\n          [mainTemplate]=\"mainTemplate\"\n></ap-modal>\n",
-                styles: ["[color=facebook]{color:#1877f2}[bgcolor=facebook],[hcolor=facebook]:hover{background-color:#1877f2}[border=facebook]{border:1px solid #1877f2}[color=google]{color:#4e85e8}[bgcolor=google],[hcolor=google]:hover{background-color:#4e85e8}[border=google]{border:1px solid #4e85e8}[color=instagram]{color:#e1306c}[bgcolor=instagram],[hcolor=instagram]:hover{background-color:#e1306c}[border=instagram]{border:1px solid #e1306c}[color=instagrammagenta]{color:#c13584}[bgcolor=instagrammagenta],[hcolor=instagrammagenta]:hover{background-color:#c13584}[border=instagrammagenta]{border:1px solid #c13584}[color=instagramblue]{color:#5851db}[bgcolor=instagramblue],[hcolor=instagramblue]:hover{background-color:#5851db}[border=instagramblue]{border:1px solid #5851db}[color=instagrampurple]{color:#833ab4}[bgcolor=instagrampurple],[hcolor=instagrampurple]:hover{background-color:#833ab4}[border=instagrampurple]{border:1px solid #833ab4}[color=instagramorange]{color:#f56040}[bgcolor=instagramorange],[hcolor=instagramorange]:hover{background-color:#f56040}[border=instagramorange]{border:1px solid #f56040}[color=instagramyellow]{color:#ffdc80}[bgcolor=instagramyellow],[hcolor=instagramyellow]:hover{background-color:#ffdc80}[border=instagramyellow]{border:1px solid #ffdc80}[color=linkedin]{color:#2c67bc}[bgcolor=linkedin],[hcolor=linkedin]:hover{background-color:#2c67bc}[border=linkedin]{border:1px solid #2c67bc}[color=twitter]{color:#55acee}[bgcolor=twitter],[hcolor=twitter]:hover{background-color:#55acee}[border=twitter]{border:1px solid #55acee}[color=youtube]{color:red}[bgcolor=youtube],[hcolor=youtube]:hover{background-color:red}[border=youtube]{border:1px solid red}[color=blood-orange]{color:#ff4d00}[bgcolor=blood-orange],[hcolor=blood-orange]:hover{background-color:#ff4d00}[border=blood-orange]{border:1px solid #ff4d00}[color=pinkish-orange]{color:#ff7b49}[bgcolor=pinkish-orange],[hcolor=pinkish-orange]:hover{background-color:#ff7b49}[border=pinkish-orange]{border:1px solid #ff7b49}[color=charcoal-grey]{color:#2a2f34}[bgcolor=charcoal-grey],[hcolor=charcoal-grey]:hover{background-color:#2a2f34}[border=charcoal-grey]{border:1px solid #2a2f34}[color=azure]{color:#00aeef}[bgcolor=azure],[hcolor=azure]:hover{background-color:#00aeef}[border=azure]{border:1px solid #00aeef}[color=light-azure]{color:#eaf5fd}[bgcolor=light-azure],[hcolor=light-azure]:hover{background-color:#eaf5fd}[border=light-azure]{border:1px solid #eaf5fd}[color=blue-grey]{color:#8d98a9}[bgcolor=blue-grey],[hcolor=blue-grey]:hover{background-color:#8d98a9}[border=blue-grey]{border:1px solid #8d98a9}[color=silver]{color:#ced0da}[bgcolor=silver],[hcolor=silver]:hover{background-color:#ced0da}[border=silver]{border:1px solid #ced0da}[color=pale-grey]{color:#dfe3e9}[bgcolor=pale-grey],[hcolor=pale-grey]:hover{background-color:#dfe3e9}[border=pale-grey]{border:1px solid #dfe3e9}[color=grey-white]{color:#f5f7f8}[bgcolor=grey-white],[hcolor=grey-white]:hover{background-color:#f5f7f8}[border=grey-white]{border:1px solid #f5f7f8}[color=cool-grey]{color:#b4bbc6}[bgcolor=cool-grey],[hcolor=cool-grey]:hover{background-color:#b4bbc6}[border=cool-grey]{border:1px solid #b4bbc6}[color=black]{color:#344563}[bgcolor=black],[hcolor=black]:hover{background-color:#344563}[border=black]{border:1px solid #344563}[color=grey-blue]{color:#68768c}[bgcolor=grey-blue],[hcolor=grey-blue]:hover{background-color:#68768c}[border=grey-blue]{border:1px solid #68768c}[color=strawberry]{color:#f4282d}[bgcolor=strawberry],[hcolor=strawberry]:hover{background-color:#f4282d}[border=strawberry]{border:1px solid #f4282d}[color=light-strawberry]{color:#f8eded}[bgcolor=light-strawberry],[hcolor=light-strawberry]:hover{background-color:#f8eded}[border=light-strawberry]{border:1px solid #f8eded}[color=white]{color:#fff}[bgcolor=white],[hcolor=white]:hover{background-color:#fff}[border=white]{border:1px solid #fff}[color=cool-green]{color:#33c15d}[bgcolor=cool-green],[hcolor=cool-green]:hover{background-color:#33c15d}[border=cool-green]{border:1px solid #33c15d}[color=light-green]{color:#ebfaef}[bgcolor=light-green],[hcolor=light-green]:hover{background-color:#ebfaef}[border=light-green]{border:1px solid #ebfaef}[color=transparent]{color:#0000}[bgcolor=transparent],[hcolor=transparent]:hover{background-color:initial}[border=transparent]{border:1px solid #0000}[color=c0]{color:#a566a5}[bgcolor=c0],[hcolor=c0]:hover{background-color:#a566a5}[border=c0]{border:1px solid #a566a5}[color=c1]{color:#c7ab82}[bgcolor=c1],[hcolor=c1]:hover{background-color:#c7ab82}[border=c1]{border:1px solid #c7ab82}[color=c2]{color:#f2713c}[bgcolor=c2],[hcolor=c2]:hover{background-color:#f2713c}[border=c2]{border:1px solid #f2713c}[color=c3]{color:#ffd006}[bgcolor=c3],[hcolor=c3]:hover{background-color:#ffd006}[border=c3]{border:1px solid #ffd006}[color=c4]{color:#94c5aa}[bgcolor=c4],[hcolor=c4]:hover{background-color:#94c5aa}[border=c4]{border:1px solid #94c5aa}[color=c5]{color:#2a9d8f}[bgcolor=c5],[hcolor=c5]:hover{background-color:#2a9d8f}[border=c5]{border:1px solid #2a9d8f}[color=c6]{color:#78acd8}[bgcolor=c6],[hcolor=c6]:hover{background-color:#78acd8}[border=c6]{border:1px solid #78acd8}[color=c7]{color:#525a9e}[bgcolor=c7],[hcolor=c7]:hover{background-color:#525a9e}[border=c7]{border:1px solid #525a9e}[color=c8]{color:#6a2459}[bgcolor=c8],[hcolor=c8]:hover{background-color:#6a2459}[border=c8]{border:1px solid #6a2459}[color=c9]{color:#74729e}[bgcolor=c9],[hcolor=c9]:hover{background-color:#74729e}[border=c9]{border:1px solid #74729e}ap-modal ::ng-deep .modal-wrapper{padding:0!important}ap-modal ::ng-deep .modal-wrapper .content{padding:0!important}.carousel-main-container{display:flex;flex-direction:column;overflow:hidden}.carousel-main-container .carousel-content{width:100%;height:100%;position:relative;margin:auto;justify-content:center;align-items:center}.carousel-main-container .carousel-content .carousel-slide-element,.carousel-main-container .carousel-content .carousel-slide-element.carousel-slide-element-not-displayed{display:none}.carousel-main-container .carousel-content .carousel-slide-element.carousel-slide-element-active{display:flex;flex-direction:column;justify-content:center;align-items:center}.carousel-main-container .carousel-content .nav-button{width:30px;height:30px;position:absolute;top:0;bottom:0;cursor:pointer;margin:auto;opacity:.4;filter:drop-shadow(0 0 1px rgba(0,0,0,.25))}.carousel-main-container .carousel-content .nav-button.tiny{width:20px;height:20px}.carousel-main-container .carousel-content .nav-button path{fill:#fffc}.carousel-main-container .carousel-content .nav-button.prev{left:12px}.carousel-main-container .carousel-content .nav-button.next{right:12px}.carousel-main-container .carousel-content .nav-button.disabled{display:none}.carousel-main-container .carousel-content .carousel-dots-container{height:28px;margin-bottom:16px}.carousel-main-container .carousel-footer{align-items:center;justify-content:flex-end;display:flex;padding:0 16px;height:68px;border-top:1px solid #eaecef}.carousel-main-container .carousel-footer .button-container{margin-right:24px}.carousel-main-container .carousel-footer .button-container .carousel-previous-button{margin-right:8px}"]
-            },] }
-];
-/** @nocollapse */
-FeatureOnboardingComponent.ctorParameters = () => [
-    { type: MatDialogRef }
-];
-
-class LeadModalComponent {
-    constructor(dialogRef, translatedStrings) {
-        this.dialogRef = dialogRef;
-        this.translatedStrings = translatedStrings;
-        this.plans = {
-            PRO: 'pro',
-            PREMIUM: 'premium',
-            PREMIUM_PLUS: 'premium+',
-            ENTERPRISE: 'enterprise',
-        };
-        this.orderedPlans = [
-            this.plans.PRO,
-            this.plans.PREMIUM,
-            this.plans.PREMIUM_PLUS,
-            this.plans.ENTERPRISE,
-        ];
-        dialogRef.disableClose = true;
-    }
-    onValidate(qualifiedProfilePlan, qualifiedTeamPlan, profileType) {
-        const qualifiedPlan = this.orderedPlans.indexOf(qualifiedProfilePlan) > this.orderedPlans.indexOf(qualifiedTeamPlan)
-            ? qualifiedProfilePlan
-            : qualifiedTeamPlan;
-        return {
-            language: window.navigator && window.navigator.language ? window.navigator.language : '',
-            qualifiedPlan: qualifiedPlan,
-            qualifiedProfilePlan: qualifiedProfilePlan,
-            qualifiedTeamPlan: qualifiedTeamPlan,
-            profileType: profileType
-        };
-    }
-}
-LeadModalComponent.decorators = [
-    { type: Component, args: [{
-                changeDetection: ChangeDetectionStrategy.OnPush,
-                selector: 'ap-lead-modal',
-                template: "<ng-template #headerTemplate>\n    <h1 mat-dialog-title>\n        {{translatedStrings.title}}\n    </h1>\n</ng-template>\n\n<ng-template #mainTemplate>\n    <div mat-dialog-content>\n            <div class=\"form-field\">\n                <label for=\"profileField\">\n                    {{translatedStrings.profileFieldLabel}}\n                </label>\n                <mat-button-toggle-group\n                    [(ngModel)]=\"qualifiedProfilePlan\"\n                    id=\"profileField\"\n                    name=\"qualifiedProfilePlan\">\n                    <mat-button-toggle [value]=\"plans.PRO\">1 - 10</mat-button-toggle>\n                    <mat-button-toggle [value]=\"plans.PREMIUM\">11 - 25</mat-button-toggle>\n                    <mat-button-toggle [value]=\"plans.PREMIUM_PLUS\">26 - 40</mat-button-toggle>\n                    <mat-button-toggle [value]=\"plans.ENTERPRISE\">40+</mat-button-toggle>\n                </mat-button-toggle-group>\n            </div>\n            <div class=\"form-field\">\n                <label for=\"teamField\">\n                    {{translatedStrings.teamFieldLabel}}\n                </label>\n                <mat-button-toggle-group\n                    [(ngModel)]=\"qualifiedTeamPlan\"\n                    id=\"teamField\"\n                    name=\"qualifiedTeamPlan\">\n                    <mat-button-toggle [value]=\"plans.PRO\">1 - 2</mat-button-toggle>\n                    <mat-button-toggle [value]=\"plans.PREMIUM\">3 - 4</mat-button-toggle>\n                    <mat-button-toggle [value]=\"plans.PREMIUM_PLUS\">5 - 8</mat-button-toggle>\n                    <mat-button-toggle [value]=\"plans.ENTERPRISE\">8+</mat-button-toggle>\n                </mat-button-toggle-group>\n            </div>\n            <div class=\"form-field\">\n                <label for=\"agencyField\">\n                    {{translatedStrings.agencyFieldLabel}}\n                </label>\n                <mat-button-toggle-group\n                    [(ngModel)]=\"profileType\"\n                    id=\"agencyField\"\n                    class=\"agency-toggle\"\n                    name=\"profileType\">\n                    <mat-button-toggle value=\"agency\">{{translatedStrings.agencyYesLabel}}</mat-button-toggle>\n                    <mat-button-toggle value=\"none\">{{translatedStrings.agencyNoLabel}}</mat-button-toggle>\n                </mat-button-toggle-group>\n            </div>\n    </div>\n</ng-template>\n\n<ng-template #footerTemplate>\n    <div>\n        <button mat-flat-button\n                color=\"primary\"\n                [disabled]=\"!(qualifiedProfilePlan && qualifiedTeamPlan && profileType)\"\n                [mat-dialog-close]=\"onValidate(qualifiedProfilePlan, qualifiedTeamPlan, profileType)\">\n            {{translatedStrings.validateButtonLabel}}\n        </button>\n    </div>\n</ng-template>\n\n<ap-modal\n    [headerTemplate]=\"headerTemplate\"\n    [mainTemplate]=\"mainTemplate\"\n    [footerTemplate]=\"footerTemplate\"\n></ap-modal>\n"
-            },] }
-];
-/** @nocollapse */
-LeadModalComponent.ctorParameters = () => [
-    { type: MatDialogRef },
-    { type: undefined, decorators: [{ type: Inject, args: [MAT_DIALOG_DATA,] }] }
-];
-
-var KEY_CODE;
-(function (KEY_CODE) {
-    KEY_CODE[KEY_CODE["RIGHT_ARROW"] = 39] = "RIGHT_ARROW";
-    KEY_CODE[KEY_CODE["LEFT_ARROW"] = 37] = "LEFT_ARROW";
-})(KEY_CODE || (KEY_CODE = {}));
-class MediaDisplayOverlayDialogComponent {
-    constructor(dialogRef, data) {
-        this.dialogRef = dialogRef;
-        this.data = data;
-        this.currentUrlIndex = 1;
-        this.urls = []; // all urls
-        this.mediaType = 'image'; // 'image', 'video'
-        this.supportGif = true;
-    }
-    ngOnInit() {
-        // const data = ModalService.getModal('media-display-overlay') || {};
-        if (this.data) {
-            if (this.data.urls && this.data.urls.length > 0) {
-                this.urls = this.data.urls;
-            }
-            if (this.data.url) {
-                if (this.urls.length === 0) {
-                    this.urls = [this.data.url];
-                }
-                this.url = this.data.url;
-                this.currentUrlIndex = this.urls.indexOf(this.data.url) + 1;
-            }
-        }
-    }
-    onClose() {
-        this.dialogRef.close();
-    }
-    onNext($event) {
-        if (this.currentUrlIndex < this.urls.length) {
-            this.currentUrlIndex += 1;
-            this.url = this.urls[this.currentUrlIndex - 1];
-        }
-        $event.stopPropagation();
-    }
-    onPrevious($event) {
-        if (this.currentUrlIndex > 1) {
-            this.currentUrlIndex -= 1;
-            this.url = this.urls[this.currentUrlIndex - 1];
-        }
-        $event.stopPropagation();
-    }
-    keyEvent(event) {
-        if (event.keyCode === KEY_CODE.RIGHT_ARROW) {
-            this.onNext(event);
-        }
-        if (event.keyCode === KEY_CODE.LEFT_ARROW) {
-            this.onPrevious(event);
-        }
-    }
-}
-MediaDisplayOverlayDialogComponent.config = {
-    position: {
-        top: '10px',
-        right: '10px',
-        left: '10px'
-    },
-    height: '100%',
-    width: '100%',
-    maxWidth: 'none',
-    panelClass: 'full-screen-modal',
-    backdropClass: 'dark-backdrop'
-};
-MediaDisplayOverlayDialogComponent.decorators = [
-    { type: Component, args: [{
-                changeDetection: ChangeDetectionStrategy.OnPush,
-                selector: 'ap-media-display-overlay',
-                template: "<div class=\"full\" (click)=\"onClose()\">\n    <div class=\"media-display ap-new\">\n        <header class=\"ap-modal-header\">\n            <ap-symbol\n                id=\"close\"\n                color=\"white\"\n                size=\"micro\"\n                (click)=\"onClose()\">\n            </ap-symbol>\n        </header>\n        <content class=\"ap-modal-content\">\n            <div *ngIf=\"urls.length > 1\"\n                 class=\"next-prev-container left\"\n                 [class.disabled]=\"currentUrlIndex <= 1\"\n                 (click)=\"onPrevious($event)\">\n                <div class=\"icon-container\">\n                    <ap-symbol\n                        id=\"arrow-left-1\"\n                        [color]=\"currentUrlIndex <= 1  ? 'grey-blue' : 'white'\"\n                        size=\"small\">\n                    </ap-symbol>\n                </div>\n            </div>\n            <div class=\"media-container\">\n                <img *ngIf=\"url && mediaType =='image'\" apFrozenGif [apFrozen]=\"!supportGif\" [src]=\"url\" (click)=\"$event.stopPropagation()\">\n            </div>\n            <div *ngIf=\"urls.length > 1\"\n                 class=\"next-prev-container right\"\n                 [class.disabled]=\"currentUrlIndex >= urls.length\"\n                 (click)=\"onNext($event)\">\n                <div class=\"icon-container\">\n                    <ap-symbol\n                        id=\"arrow-right-1\"\n                        [color]=\"currentUrlIndex >= urls.length ? 'grey-blue' : 'white'\"\n                        size=\"small\">\n                    </ap-symbol>\n                </div>\n            </div>\n        </content>\n        <footer *ngIf=\"urls && urls.length > 1\"\n                class=\"ap-modal-footer\">\n            <div class=\"index-container\">\n                {{currentUrlIndex}} / {{urls.length}}\n            </div>\n        </footer>\n    </div>\n</div>\n",
-                styles: ["[color=facebook]{color:#1877f2}[bgcolor=facebook],[hcolor=facebook]:hover{background-color:#1877f2}[border=facebook]{border:1px solid #1877f2}[color=google]{color:#4e85e8}[bgcolor=google],[hcolor=google]:hover{background-color:#4e85e8}[border=google]{border:1px solid #4e85e8}[color=instagram]{color:#e1306c}[bgcolor=instagram],[hcolor=instagram]:hover{background-color:#e1306c}[border=instagram]{border:1px solid #e1306c}[color=instagrammagenta]{color:#c13584}[bgcolor=instagrammagenta],[hcolor=instagrammagenta]:hover{background-color:#c13584}[border=instagrammagenta]{border:1px solid #c13584}[color=instagramblue]{color:#5851db}[bgcolor=instagramblue],[hcolor=instagramblue]:hover{background-color:#5851db}[border=instagramblue]{border:1px solid #5851db}[color=instagrampurple]{color:#833ab4}[bgcolor=instagrampurple],[hcolor=instagrampurple]:hover{background-color:#833ab4}[border=instagrampurple]{border:1px solid #833ab4}[color=instagramorange]{color:#f56040}[bgcolor=instagramorange],[hcolor=instagramorange]:hover{background-color:#f56040}[border=instagramorange]{border:1px solid #f56040}[color=instagramyellow]{color:#ffdc80}[bgcolor=instagramyellow],[hcolor=instagramyellow]:hover{background-color:#ffdc80}[border=instagramyellow]{border:1px solid #ffdc80}[color=linkedin]{color:#2c67bc}[bgcolor=linkedin],[hcolor=linkedin]:hover{background-color:#2c67bc}[border=linkedin]{border:1px solid #2c67bc}[color=twitter]{color:#55acee}[bgcolor=twitter],[hcolor=twitter]:hover{background-color:#55acee}[border=twitter]{border:1px solid #55acee}[color=youtube]{color:red}[bgcolor=youtube],[hcolor=youtube]:hover{background-color:red}[border=youtube]{border:1px solid red}[color=blood-orange]{color:#ff4d00}[bgcolor=blood-orange],[hcolor=blood-orange]:hover{background-color:#ff4d00}[border=blood-orange]{border:1px solid #ff4d00}[color=pinkish-orange]{color:#ff7b49}[bgcolor=pinkish-orange],[hcolor=pinkish-orange]:hover{background-color:#ff7b49}[border=pinkish-orange]{border:1px solid #ff7b49}[color=charcoal-grey]{color:#2a2f34}[bgcolor=charcoal-grey],[hcolor=charcoal-grey]:hover{background-color:#2a2f34}[border=charcoal-grey]{border:1px solid #2a2f34}[color=azure]{color:#00aeef}[bgcolor=azure],[hcolor=azure]:hover{background-color:#00aeef}[border=azure]{border:1px solid #00aeef}[color=light-azure]{color:#eaf5fd}[bgcolor=light-azure],[hcolor=light-azure]:hover{background-color:#eaf5fd}[border=light-azure]{border:1px solid #eaf5fd}[color=blue-grey]{color:#8d98a9}[bgcolor=blue-grey],[hcolor=blue-grey]:hover{background-color:#8d98a9}[border=blue-grey]{border:1px solid #8d98a9}[color=silver]{color:#ced0da}[bgcolor=silver],[hcolor=silver]:hover{background-color:#ced0da}[border=silver]{border:1px solid #ced0da}[color=pale-grey]{color:#dfe3e9}[bgcolor=pale-grey],[hcolor=pale-grey]:hover{background-color:#dfe3e9}[border=pale-grey]{border:1px solid #dfe3e9}[color=grey-white]{color:#f5f7f8}[bgcolor=grey-white],[hcolor=grey-white]:hover{background-color:#f5f7f8}[border=grey-white]{border:1px solid #f5f7f8}[color=cool-grey]{color:#b4bbc6}[bgcolor=cool-grey],[hcolor=cool-grey]:hover{background-color:#b4bbc6}[border=cool-grey]{border:1px solid #b4bbc6}[color=black]{color:#344563}[bgcolor=black],[hcolor=black]:hover{background-color:#344563}[border=black]{border:1px solid #344563}[color=grey-blue]{color:#68768c}[bgcolor=grey-blue],[hcolor=grey-blue]:hover{background-color:#68768c}[border=grey-blue]{border:1px solid #68768c}[color=strawberry]{color:#f4282d}[bgcolor=strawberry],[hcolor=strawberry]:hover{background-color:#f4282d}[border=strawberry]{border:1px solid #f4282d}[color=light-strawberry]{color:#f8eded}[bgcolor=light-strawberry],[hcolor=light-strawberry]:hover{background-color:#f8eded}[border=light-strawberry]{border:1px solid #f8eded}[color=white]{color:#fff}[bgcolor=white],[hcolor=white]:hover{background-color:#fff}[border=white]{border:1px solid #fff}[color=cool-green]{color:#33c15d}[bgcolor=cool-green],[hcolor=cool-green]:hover{background-color:#33c15d}[border=cool-green]{border:1px solid #33c15d}[color=light-green]{color:#ebfaef}[bgcolor=light-green],[hcolor=light-green]:hover{background-color:#ebfaef}[border=light-green]{border:1px solid #ebfaef}[color=transparent]{color:#0000}[bgcolor=transparent],[hcolor=transparent]:hover{background-color:initial}[border=transparent]{border:1px solid #0000}[color=c0]{color:#a566a5}[bgcolor=c0],[hcolor=c0]:hover{background-color:#a566a5}[border=c0]{border:1px solid #a566a5}[color=c1]{color:#c7ab82}[bgcolor=c1],[hcolor=c1]:hover{background-color:#c7ab82}[border=c1]{border:1px solid #c7ab82}[color=c2]{color:#f2713c}[bgcolor=c2],[hcolor=c2]:hover{background-color:#f2713c}[border=c2]{border:1px solid #f2713c}[color=c3]{color:#ffd006}[bgcolor=c3],[hcolor=c3]:hover{background-color:#ffd006}[border=c3]{border:1px solid #ffd006}[color=c4]{color:#94c5aa}[bgcolor=c4],[hcolor=c4]:hover{background-color:#94c5aa}[border=c4]{border:1px solid #94c5aa}[color=c5]{color:#2a9d8f}[bgcolor=c5],[hcolor=c5]:hover{background-color:#2a9d8f}[border=c5]{border:1px solid #2a9d8f}[color=c6]{color:#78acd8}[bgcolor=c6],[hcolor=c6]:hover{background-color:#78acd8}[border=c6]{border:1px solid #78acd8}[color=c7]{color:#525a9e}[bgcolor=c7],[hcolor=c7]:hover{background-color:#525a9e}[border=c7]{border:1px solid #525a9e}[color=c8]{color:#6a2459}[bgcolor=c8],[hcolor=c8]:hover{background-color:#6a2459}[border=c8]{border:1px solid #6a2459}[color=c9]{color:#74729e}[bgcolor=c9],[hcolor=c9]:hover{background-color:#74729e}[border=c9]{border:1px solid #74729e}:host{width:100%;height:100%}.full,.media-display{height:100%;width:100%}.media-display{background:#0000;display:flex;flex-direction:column}.media-display .media-container{margin:auto;flex:1;align-items:center;flex-direction:column;display:flex}.media-display .media-container img{max-width:80%}.media-display .ap-modal-content{padding-bottom:10px;margin:auto}.media-display .ap-modal-header{background:#0000;border-bottom:none;display:flex;justify-content:flex-end}.media-display .ap-modal-header .ap-modal-close{color:#fff}.media-display .ap-modal-header .ap-modal-close.ap-icon{font-size:45px}.media-display .ap-modal-footer{justify-content:flex-end;background:#0000;border:none;margin-bottom:24px;align-items:center;display:flex;flex-direction:column}.media-display .ap-modal-footer .index-container{color:#fff;font-size:24px;display:inline;background-color:#0000001a;border-radius:20px;padding:16px}.media-display .next-prev-container{display:flex;justify-content:center;align-items:center;width:60px;height:60px;position:absolute;top:45%;cursor:pointer;background-color:#0000001a;border-radius:60px;color:#fff}.media-display .next-prev-container .ap-icon{font-size:45px}.media-display .next-prev-container.right{margin-right:24px;right:0}.media-display .next-prev-container.right .icon-container{margin-left:7px}.media-display .next-prev-container[disabled] .ap-icon{color:#dfe3e9}.media-display .next-prev-container.left{margin-left:24px;left:0}.media-display .next-prev-container.left .icon-container{margin-right:5px}.media-display .next-prev-container.disabled{cursor:not-allowed}"]
-            },] }
-];
-/** @nocollapse */
-MediaDisplayOverlayDialogComponent.ctorParameters = () => [
-    { type: MatDialogRef },
-    { type: undefined, decorators: [{ type: Inject, args: [MAT_DIALOG_DATA,] }] }
-];
-MediaDisplayOverlayDialogComponent.propDecorators = {
-    keyEvent: [{ type: HostListener, args: ['window:keyup', ['$event'],] }]
-};
-
-class OverlayDialogRef {
-    constructor(overlayRef) {
-        this.overlayRef = overlayRef;
-    }
-    close() {
-        this.overlayRef.dispose();
-    }
-}
-const OVERLAY_DATA = new InjectionToken('OVERLAY_DATA');
-class OverlayDialogComponent {
-    constructor(dialogRef, data) {
-        this.dialogRef = dialogRef;
-        this.data = data;
-    }
-    close() {
-        this.dialogRef.close();
-    }
-}
-OverlayDialogComponent.decorators = [
-    { type: Component, args: [{
-                selector: 'ap-overlay',
-                template: "<div class=\"header-overlay\">\n    <ap-symbol\n        id=\"close\"\n        color=\"#858fa1\"\n        size=\"18\"\n        (click)=\"close()\"\n        class=\"\">\n\n    </ap-symbol>\n</div>\n\n<div class=\"container-overlay\">\n    <ng-container *ngTemplateOutlet=\"data\"></ng-container>\n</div>\n",
-                styles: ["[color=facebook]{color:#1877f2}[bgcolor=facebook],[hcolor=facebook]:hover{background-color:#1877f2}[border=facebook]{border:1px solid #1877f2}[color=google]{color:#4e85e8}[bgcolor=google],[hcolor=google]:hover{background-color:#4e85e8}[border=google]{border:1px solid #4e85e8}[color=instagram]{color:#e1306c}[bgcolor=instagram],[hcolor=instagram]:hover{background-color:#e1306c}[border=instagram]{border:1px solid #e1306c}[color=instagrammagenta]{color:#c13584}[bgcolor=instagrammagenta],[hcolor=instagrammagenta]:hover{background-color:#c13584}[border=instagrammagenta]{border:1px solid #c13584}[color=instagramblue]{color:#5851db}[bgcolor=instagramblue],[hcolor=instagramblue]:hover{background-color:#5851db}[border=instagramblue]{border:1px solid #5851db}[color=instagrampurple]{color:#833ab4}[bgcolor=instagrampurple],[hcolor=instagrampurple]:hover{background-color:#833ab4}[border=instagrampurple]{border:1px solid #833ab4}[color=instagramorange]{color:#f56040}[bgcolor=instagramorange],[hcolor=instagramorange]:hover{background-color:#f56040}[border=instagramorange]{border:1px solid #f56040}[color=instagramyellow]{color:#ffdc80}[bgcolor=instagramyellow],[hcolor=instagramyellow]:hover{background-color:#ffdc80}[border=instagramyellow]{border:1px solid #ffdc80}[color=linkedin]{color:#2c67bc}[bgcolor=linkedin],[hcolor=linkedin]:hover{background-color:#2c67bc}[border=linkedin]{border:1px solid #2c67bc}[color=twitter]{color:#55acee}[bgcolor=twitter],[hcolor=twitter]:hover{background-color:#55acee}[border=twitter]{border:1px solid #55acee}[color=youtube]{color:red}[bgcolor=youtube],[hcolor=youtube]:hover{background-color:red}[border=youtube]{border:1px solid red}[color=blood-orange]{color:#ff4d00}[bgcolor=blood-orange],[hcolor=blood-orange]:hover{background-color:#ff4d00}[border=blood-orange]{border:1px solid #ff4d00}[color=pinkish-orange]{color:#ff7b49}[bgcolor=pinkish-orange],[hcolor=pinkish-orange]:hover{background-color:#ff7b49}[border=pinkish-orange]{border:1px solid #ff7b49}[color=charcoal-grey]{color:#2a2f34}[bgcolor=charcoal-grey],[hcolor=charcoal-grey]:hover{background-color:#2a2f34}[border=charcoal-grey]{border:1px solid #2a2f34}[color=azure]{color:#00aeef}[bgcolor=azure],[hcolor=azure]:hover{background-color:#00aeef}[border=azure]{border:1px solid #00aeef}[color=light-azure]{color:#eaf5fd}[bgcolor=light-azure],[hcolor=light-azure]:hover{background-color:#eaf5fd}[border=light-azure]{border:1px solid #eaf5fd}[color=blue-grey]{color:#8d98a9}[bgcolor=blue-grey],[hcolor=blue-grey]:hover{background-color:#8d98a9}[border=blue-grey]{border:1px solid #8d98a9}[color=silver]{color:#ced0da}[bgcolor=silver],[hcolor=silver]:hover{background-color:#ced0da}[border=silver]{border:1px solid #ced0da}[color=pale-grey]{color:#dfe3e9}[bgcolor=pale-grey],[hcolor=pale-grey]:hover{background-color:#dfe3e9}[border=pale-grey]{border:1px solid #dfe3e9}[color=grey-white]{color:#f5f7f8}[bgcolor=grey-white],[hcolor=grey-white]:hover{background-color:#f5f7f8}[border=grey-white]{border:1px solid #f5f7f8}[color=cool-grey]{color:#b4bbc6}[bgcolor=cool-grey],[hcolor=cool-grey]:hover{background-color:#b4bbc6}[border=cool-grey]{border:1px solid #b4bbc6}[color=black]{color:#344563}[bgcolor=black],[hcolor=black]:hover{background-color:#344563}[border=black]{border:1px solid #344563}[color=grey-blue]{color:#68768c}[bgcolor=grey-blue],[hcolor=grey-blue]:hover{background-color:#68768c}[border=grey-blue]{border:1px solid #68768c}[color=strawberry]{color:#f4282d}[bgcolor=strawberry],[hcolor=strawberry]:hover{background-color:#f4282d}[border=strawberry]{border:1px solid #f4282d}[color=light-strawberry]{color:#f8eded}[bgcolor=light-strawberry],[hcolor=light-strawberry]:hover{background-color:#f8eded}[border=light-strawberry]{border:1px solid #f8eded}[color=white]{color:#fff}[bgcolor=white],[hcolor=white]:hover{background-color:#fff}[border=white]{border:1px solid #fff}[color=cool-green]{color:#33c15d}[bgcolor=cool-green],[hcolor=cool-green]:hover{background-color:#33c15d}[border=cool-green]{border:1px solid #33c15d}[color=light-green]{color:#ebfaef}[bgcolor=light-green],[hcolor=light-green]:hover{background-color:#ebfaef}[border=light-green]{border:1px solid #ebfaef}[color=transparent]{color:#0000}[bgcolor=transparent],[hcolor=transparent]:hover{background-color:initial}[border=transparent]{border:1px solid #0000}[color=c0]{color:#a566a5}[bgcolor=c0],[hcolor=c0]:hover{background-color:#a566a5}[border=c0]{border:1px solid #a566a5}[color=c1]{color:#c7ab82}[bgcolor=c1],[hcolor=c1]:hover{background-color:#c7ab82}[border=c1]{border:1px solid #c7ab82}[color=c2]{color:#f2713c}[bgcolor=c2],[hcolor=c2]:hover{background-color:#f2713c}[border=c2]{border:1px solid #f2713c}[color=c3]{color:#ffd006}[bgcolor=c3],[hcolor=c3]:hover{background-color:#ffd006}[border=c3]{border:1px solid #ffd006}[color=c4]{color:#94c5aa}[bgcolor=c4],[hcolor=c4]:hover{background-color:#94c5aa}[border=c4]{border:1px solid #94c5aa}[color=c5]{color:#2a9d8f}[bgcolor=c5],[hcolor=c5]:hover{background-color:#2a9d8f}[border=c5]{border:1px solid #2a9d8f}[color=c6]{color:#78acd8}[bgcolor=c6],[hcolor=c6]:hover{background-color:#78acd8}[border=c6]{border:1px solid #78acd8}[color=c7]{color:#525a9e}[bgcolor=c7],[hcolor=c7]:hover{background-color:#525a9e}[border=c7]{border:1px solid #525a9e}[color=c8]{color:#6a2459}[bgcolor=c8],[hcolor=c8]:hover{background-color:#6a2459}[border=c8]{border:1px solid #6a2459}[color=c9]{color:#74729e}[bgcolor=c9],[hcolor=c9]:hover{background-color:#74729e}[border=c9]{border:1px solid #74729e}:host{display:flex;flex-direction:column;align-items:center;justify-content:center;width:100vw;height:100vh}:host .header-overlay{width:100vw;flex-direction:row-reverse;display:flex;position:absolute;top:0;right:0;padding-right:48px;padding-top:48px}:host .header-overlay ap-symbol:hover{cursor:pointer}:host ::ng-deep img{max-height:325px}"]
-            },] }
-];
-/** @nocollapse */
-OverlayDialogComponent.ctorParameters = () => [
-    { type: OverlayDialogRef },
-    { type: undefined, decorators: [{ type: Inject, args: [OVERLAY_DATA,] }] }
-];
-
-class OverlayInDivComponent {
-    constructor() {
-        this.closable = true;
-        this.close = new EventEmitter();
-    }
-}
-OverlayInDivComponent.decorators = [
-    { type: Component, args: [{
-                changeDetection: ChangeDetectionStrategy.OnPush,
-                selector: 'ap-overlay-in-div',
-                template: "<div class=\"header-overlay\" *ngIf=\"closable\">\n    <ap-symbol\n        id=\"close\"\n        color=\"#858fa1\"\n        size=\"18\"\n        (click)=\"this.close.emit('close')\"\n        class=\"\">\n    </ap-symbol>\n</div>\n\n<div class=\"splash-screen\">\n    <img *ngIf=\"imgPath\" [src]=\"imgPath\"/>\n    <h2 class=\"padding-y-l\">{{ title }}</h2>\n    <h3 class=\"label\"> {{ subtitle }}</h3>\n</div>\n",
-                styles: ["[color=facebook]{color:#1877f2}[bgcolor=facebook],[hcolor=facebook]:hover{background-color:#1877f2}[border=facebook]{border:1px solid #1877f2}[color=google]{color:#4e85e8}[bgcolor=google],[hcolor=google]:hover{background-color:#4e85e8}[border=google]{border:1px solid #4e85e8}[color=instagram]{color:#e1306c}[bgcolor=instagram],[hcolor=instagram]:hover{background-color:#e1306c}[border=instagram]{border:1px solid #e1306c}[color=instagrammagenta]{color:#c13584}[bgcolor=instagrammagenta],[hcolor=instagrammagenta]:hover{background-color:#c13584}[border=instagrammagenta]{border:1px solid #c13584}[color=instagramblue]{color:#5851db}[bgcolor=instagramblue],[hcolor=instagramblue]:hover{background-color:#5851db}[border=instagramblue]{border:1px solid #5851db}[color=instagrampurple]{color:#833ab4}[bgcolor=instagrampurple],[hcolor=instagrampurple]:hover{background-color:#833ab4}[border=instagrampurple]{border:1px solid #833ab4}[color=instagramorange]{color:#f56040}[bgcolor=instagramorange],[hcolor=instagramorange]:hover{background-color:#f56040}[border=instagramorange]{border:1px solid #f56040}[color=instagramyellow]{color:#ffdc80}[bgcolor=instagramyellow],[hcolor=instagramyellow]:hover{background-color:#ffdc80}[border=instagramyellow]{border:1px solid #ffdc80}[color=linkedin]{color:#2c67bc}[bgcolor=linkedin],[hcolor=linkedin]:hover{background-color:#2c67bc}[border=linkedin]{border:1px solid #2c67bc}[color=twitter]{color:#55acee}[bgcolor=twitter],[hcolor=twitter]:hover{background-color:#55acee}[border=twitter]{border:1px solid #55acee}[color=youtube]{color:red}[bgcolor=youtube],[hcolor=youtube]:hover{background-color:red}[border=youtube]{border:1px solid red}[color=blood-orange]{color:#ff4d00}[bgcolor=blood-orange],[hcolor=blood-orange]:hover{background-color:#ff4d00}[border=blood-orange]{border:1px solid #ff4d00}[color=pinkish-orange]{color:#ff7b49}[bgcolor=pinkish-orange],[hcolor=pinkish-orange]:hover{background-color:#ff7b49}[border=pinkish-orange]{border:1px solid #ff7b49}[color=charcoal-grey]{color:#2a2f34}[bgcolor=charcoal-grey],[hcolor=charcoal-grey]:hover{background-color:#2a2f34}[border=charcoal-grey]{border:1px solid #2a2f34}[color=azure]{color:#00aeef}[bgcolor=azure],[hcolor=azure]:hover{background-color:#00aeef}[border=azure]{border:1px solid #00aeef}[color=light-azure]{color:#eaf5fd}[bgcolor=light-azure],[hcolor=light-azure]:hover{background-color:#eaf5fd}[border=light-azure]{border:1px solid #eaf5fd}[color=blue-grey]{color:#8d98a9}[bgcolor=blue-grey],[hcolor=blue-grey]:hover{background-color:#8d98a9}[border=blue-grey]{border:1px solid #8d98a9}[color=silver]{color:#ced0da}[bgcolor=silver],[hcolor=silver]:hover{background-color:#ced0da}[border=silver]{border:1px solid #ced0da}[color=pale-grey]{color:#dfe3e9}[bgcolor=pale-grey],[hcolor=pale-grey]:hover{background-color:#dfe3e9}[border=pale-grey]{border:1px solid #dfe3e9}[color=grey-white]{color:#f5f7f8}[bgcolor=grey-white],[hcolor=grey-white]:hover{background-color:#f5f7f8}[border=grey-white]{border:1px solid #f5f7f8}[color=cool-grey]{color:#b4bbc6}[bgcolor=cool-grey],[hcolor=cool-grey]:hover{background-color:#b4bbc6}[border=cool-grey]{border:1px solid #b4bbc6}[color=black]{color:#344563}[bgcolor=black],[hcolor=black]:hover{background-color:#344563}[border=black]{border:1px solid #344563}[color=grey-blue]{color:#68768c}[bgcolor=grey-blue],[hcolor=grey-blue]:hover{background-color:#68768c}[border=grey-blue]{border:1px solid #68768c}[color=strawberry]{color:#f4282d}[bgcolor=strawberry],[hcolor=strawberry]:hover{background-color:#f4282d}[border=strawberry]{border:1px solid #f4282d}[color=light-strawberry]{color:#f8eded}[bgcolor=light-strawberry],[hcolor=light-strawberry]:hover{background-color:#f8eded}[border=light-strawberry]{border:1px solid #f8eded}[color=white]{color:#fff}[bgcolor=white],[hcolor=white]:hover{background-color:#fff}[border=white]{border:1px solid #fff}[color=cool-green]{color:#33c15d}[bgcolor=cool-green],[hcolor=cool-green]:hover{background-color:#33c15d}[border=cool-green]{border:1px solid #33c15d}[color=light-green]{color:#ebfaef}[bgcolor=light-green],[hcolor=light-green]:hover{background-color:#ebfaef}[border=light-green]{border:1px solid #ebfaef}[color=transparent]{color:#0000}[bgcolor=transparent],[hcolor=transparent]:hover{background-color:initial}[border=transparent]{border:1px solid #0000}[color=c0]{color:#a566a5}[bgcolor=c0],[hcolor=c0]:hover{background-color:#a566a5}[border=c0]{border:1px solid #a566a5}[color=c1]{color:#c7ab82}[bgcolor=c1],[hcolor=c1]:hover{background-color:#c7ab82}[border=c1]{border:1px solid #c7ab82}[color=c2]{color:#f2713c}[bgcolor=c2],[hcolor=c2]:hover{background-color:#f2713c}[border=c2]{border:1px solid #f2713c}[color=c3]{color:#ffd006}[bgcolor=c3],[hcolor=c3]:hover{background-color:#ffd006}[border=c3]{border:1px solid #ffd006}[color=c4]{color:#94c5aa}[bgcolor=c4],[hcolor=c4]:hover{background-color:#94c5aa}[border=c4]{border:1px solid #94c5aa}[color=c5]{color:#2a9d8f}[bgcolor=c5],[hcolor=c5]:hover{background-color:#2a9d8f}[border=c5]{border:1px solid #2a9d8f}[color=c6]{color:#78acd8}[bgcolor=c6],[hcolor=c6]:hover{background-color:#78acd8}[border=c6]{border:1px solid #78acd8}[color=c7]{color:#525a9e}[bgcolor=c7],[hcolor=c7]:hover{background-color:#525a9e}[border=c7]{border:1px solid #525a9e}[color=c8]{color:#6a2459}[bgcolor=c8],[hcolor=c8]:hover{background-color:#6a2459}[border=c8]{border:1px solid #6a2459}[color=c9]{color:#74729e}[bgcolor=c9],[hcolor=c9]:hover{background-color:#74729e}[border=c9]{border:1px solid #74729e}.splash-screen{display:flex;flex-direction:column;align-items:center;justify-content:center;height:100%;width:100%;padding-right:20%}.splash-screen img{width:480px}.splash-screen .label{max-width:500px;justify-content:center}:host{background:radial-gradient(#f5f7f8,#f5f7f880);position:absolute;width:100%;height:100%;top:0;left:0;z-index:99999999}:host .header-overlay{width:100vw;flex-direction:row-reverse;display:flex;position:absolute;top:0;right:0;padding-right:48px;padding-top:48px}:host .header-overlay ap-symbol:hover{cursor:pointer}"]
-            },] }
-];
-OverlayInDivComponent.propDecorators = {
-    title: [{ type: Input }],
-    subtitle: [{ type: Input }],
-    imgPath: [{ type: Input }],
-    closable: [{ type: Input }],
-    close: [{ type: Output }]
-};
-
-class PlaceComponent {
-}
-PlaceComponent.decorators = [
-    { type: Component, args: [{
-                changeDetection: ChangeDetectionStrategy.OnPush,
-                selector: 'ap-place',
-                template: "<div class=\"place\">\n    <ap-symbol\n        [symbolId]=\"service + '-official'\"\n        [size]=\"'micro'\">\n    </ap-symbol>\n    <ng-content></ng-content>\n</div>\n",
-                styles: ["[color=facebook]{color:#1877f2}[bgcolor=facebook],[hcolor=facebook]:hover{background-color:#1877f2}[border=facebook]{border:1px solid #1877f2}[color=google]{color:#4e85e8}[bgcolor=google],[hcolor=google]:hover{background-color:#4e85e8}[border=google]{border:1px solid #4e85e8}[color=instagram]{color:#e1306c}[bgcolor=instagram],[hcolor=instagram]:hover{background-color:#e1306c}[border=instagram]{border:1px solid #e1306c}[color=instagrammagenta]{color:#c13584}[bgcolor=instagrammagenta],[hcolor=instagrammagenta]:hover{background-color:#c13584}[border=instagrammagenta]{border:1px solid #c13584}[color=instagramblue]{color:#5851db}[bgcolor=instagramblue],[hcolor=instagramblue]:hover{background-color:#5851db}[border=instagramblue]{border:1px solid #5851db}[color=instagrampurple]{color:#833ab4}[bgcolor=instagrampurple],[hcolor=instagrampurple]:hover{background-color:#833ab4}[border=instagrampurple]{border:1px solid #833ab4}[color=instagramorange]{color:#f56040}[bgcolor=instagramorange],[hcolor=instagramorange]:hover{background-color:#f56040}[border=instagramorange]{border:1px solid #f56040}[color=instagramyellow]{color:#ffdc80}[bgcolor=instagramyellow],[hcolor=instagramyellow]:hover{background-color:#ffdc80}[border=instagramyellow]{border:1px solid #ffdc80}[color=linkedin]{color:#2c67bc}[bgcolor=linkedin],[hcolor=linkedin]:hover{background-color:#2c67bc}[border=linkedin]{border:1px solid #2c67bc}[color=twitter]{color:#55acee}[bgcolor=twitter],[hcolor=twitter]:hover{background-color:#55acee}[border=twitter]{border:1px solid #55acee}[color=youtube]{color:red}[bgcolor=youtube],[hcolor=youtube]:hover{background-color:red}[border=youtube]{border:1px solid red}[color=blood-orange]{color:#ff4d00}[bgcolor=blood-orange],[hcolor=blood-orange]:hover{background-color:#ff4d00}[border=blood-orange]{border:1px solid #ff4d00}[color=pinkish-orange]{color:#ff7b49}[bgcolor=pinkish-orange],[hcolor=pinkish-orange]:hover{background-color:#ff7b49}[border=pinkish-orange]{border:1px solid #ff7b49}[color=charcoal-grey]{color:#2a2f34}[bgcolor=charcoal-grey],[hcolor=charcoal-grey]:hover{background-color:#2a2f34}[border=charcoal-grey]{border:1px solid #2a2f34}[color=azure]{color:#00aeef}[bgcolor=azure],[hcolor=azure]:hover{background-color:#00aeef}[border=azure]{border:1px solid #00aeef}[color=light-azure]{color:#eaf5fd}[bgcolor=light-azure],[hcolor=light-azure]:hover{background-color:#eaf5fd}[border=light-azure]{border:1px solid #eaf5fd}[color=blue-grey]{color:#8d98a9}[bgcolor=blue-grey],[hcolor=blue-grey]:hover{background-color:#8d98a9}[border=blue-grey]{border:1px solid #8d98a9}[color=silver]{color:#ced0da}[bgcolor=silver],[hcolor=silver]:hover{background-color:#ced0da}[border=silver]{border:1px solid #ced0da}[color=pale-grey]{color:#dfe3e9}[bgcolor=pale-grey],[hcolor=pale-grey]:hover{background-color:#dfe3e9}[border=pale-grey]{border:1px solid #dfe3e9}[color=grey-white]{color:#f5f7f8}[bgcolor=grey-white],[hcolor=grey-white]:hover{background-color:#f5f7f8}[border=grey-white]{border:1px solid #f5f7f8}[color=cool-grey]{color:#b4bbc6}[bgcolor=cool-grey],[hcolor=cool-grey]:hover{background-color:#b4bbc6}[border=cool-grey]{border:1px solid #b4bbc6}[color=black]{color:#344563}[bgcolor=black],[hcolor=black]:hover{background-color:#344563}[border=black]{border:1px solid #344563}[color=grey-blue]{color:#68768c}[bgcolor=grey-blue],[hcolor=grey-blue]:hover{background-color:#68768c}[border=grey-blue]{border:1px solid #68768c}[color=strawberry]{color:#f4282d}[bgcolor=strawberry],[hcolor=strawberry]:hover{background-color:#f4282d}[border=strawberry]{border:1px solid #f4282d}[color=light-strawberry]{color:#f8eded}[bgcolor=light-strawberry],[hcolor=light-strawberry]:hover{background-color:#f8eded}[border=light-strawberry]{border:1px solid #f8eded}[color=white]{color:#fff}[bgcolor=white],[hcolor=white]:hover{background-color:#fff}[border=white]{border:1px solid #fff}[color=cool-green]{color:#33c15d}[bgcolor=cool-green],[hcolor=cool-green]:hover{background-color:#33c15d}[border=cool-green]{border:1px solid #33c15d}[color=light-green]{color:#ebfaef}[bgcolor=light-green],[hcolor=light-green]:hover{background-color:#ebfaef}[border=light-green]{border:1px solid #ebfaef}[color=transparent]{color:#0000}[bgcolor=transparent],[hcolor=transparent]:hover{background-color:initial}[border=transparent]{border:1px solid #0000}[color=c0]{color:#a566a5}[bgcolor=c0],[hcolor=c0]:hover{background-color:#a566a5}[border=c0]{border:1px solid #a566a5}[color=c1]{color:#c7ab82}[bgcolor=c1],[hcolor=c1]:hover{background-color:#c7ab82}[border=c1]{border:1px solid #c7ab82}[color=c2]{color:#f2713c}[bgcolor=c2],[hcolor=c2]:hover{background-color:#f2713c}[border=c2]{border:1px solid #f2713c}[color=c3]{color:#ffd006}[bgcolor=c3],[hcolor=c3]:hover{background-color:#ffd006}[border=c3]{border:1px solid #ffd006}[color=c4]{color:#94c5aa}[bgcolor=c4],[hcolor=c4]:hover{background-color:#94c5aa}[border=c4]{border:1px solid #94c5aa}[color=c5]{color:#2a9d8f}[bgcolor=c5],[hcolor=c5]:hover{background-color:#2a9d8f}[border=c5]{border:1px solid #2a9d8f}[color=c6]{color:#78acd8}[bgcolor=c6],[hcolor=c6]:hover{background-color:#78acd8}[border=c6]{border:1px solid #78acd8}[color=c7]{color:#525a9e}[bgcolor=c7],[hcolor=c7]:hover{background-color:#525a9e}[border=c7]{border:1px solid #525a9e}[color=c8]{color:#6a2459}[bgcolor=c8],[hcolor=c8]:hover{background-color:#6a2459}[border=c8]{border:1px solid #6a2459}[color=c9]{color:#74729e}[bgcolor=c9],[hcolor=c9]:hover{background-color:#74729e}[border=c9]{border:1px solid #74729e}.place{margin-right:16px;padding-bottom:4px;color:#344563;text-wrap:none;display:flex}.place ap-symbol{margin-right:8px}"]
-            },] }
-];
-PlaceComponent.propDecorators = {
-    service: [{ type: Input }]
-};
-
-class PlaceListComponent {
-}
-PlaceListComponent.decorators = [
-    { type: Component, args: [{
-                changeDetection: ChangeDetectionStrategy.OnPush,
-                selector: 'ap-place-list',
-                template: "<div class=\"place-list\">\n    <ng-content></ng-content>\n</div>\n",
-                styles: [".place-list{display:flex;flex-wrap:wrap;justify-content:center;margin-bottom:-4px;margin-right:-16px}"]
-            },] }
-];
-
-const defaultOptions = {
-    'apPopmenuBorder': true,
-    'apPopmenuDisabled': false,
-    'apPopmenuBackground': true,
-    'hasBackdrop': true,
-    'placement': 'top',
-    'rounded': true,
-    'showDelay': 0,
-    'hideDelay': 10,
-    'hideDelayMobile': 0,
-    'shadow': true,
-    'theme': 'dark',
-    'offset': 8,
-    'maxWidth': '600',
-};
-
-/**
- * This is not a real service, but it looks like it from the outside.
- * It's just an InjectionToken used to import the config (initOptions) object, provided from the outside
- */
-const PopmenuOptionsService = new InjectionToken('PopmenuOptions');
-
-class PopmenuComponent {
-    constructor(renderer, elementRef, changeDetectorRef) {
-        this.renderer = renderer;
-        this.elementRef = elementRef;
-        this.changeDetectorRef = changeDetectorRef;
-        this.events = new EventEmitter();
-        this.arrowTopPosition = '50%';
-        this.arrowBottomPosition = '50%';
-        this.menuClosed = new EventEmitter();
-        this.menuOpened = new EventEmitter();
-        this.viewInit = false;
-        this._show = false;
-    }
-    get show() {
-        return this._show;
-    }
-    set show(value) {
-        if (value) {
-            this.setPosition();
-        }
-        this._show = value;
-    }
-    set close(value) {
-        if (value) {
-            this.trigger.closeMenu();
-        }
-    }
-    get arrow() {
-        return this.data.options.arrow && this.border;
-    }
-    get arrowOffset() {
-        return this.data.options.arrowOffset;
-    }
-    get arrowPosition() {
-        return this.data.options.arrowPosition;
-    }
-    get autoPlacement() {
-        return this.data.options.autoPlacement;
-    }
-    get background() {
-        return this.data.options.apPopmenuBackground;
-    }
-    get border() {
-        return this.data.options.apPopmenuBorder;
-    }
-    get element() {
-        return this.data.element;
-    }
-    get elementPosition() {
-        return this.data.elementPosition;
-    }
-    get hasBackdrop() {
-        return this.data.options.hasBackdrop;
-    }
-    get isThemeLight() {
-        return this.options['theme'] === 'light';
-    }
-    get options() {
-        return this.data.options;
-    }
-    get placement() {
-        return this.data.options.placement;
-    }
-    get rounded() {
-        return this.data.options.rounded;
-    }
-    get shadow() {
-        return this.data.options.shadow;
-    }
-    get tooltipOffset() {
-        return Number(this.data.options.offset);
-    }
-    get value() {
-        return this.data.value;
-    }
-    ngAfterViewInit() {
-        this.viewInit = true;
-    }
-    onMenuClosed() {
-        // we set a timeout to wait for the menu to be really closed
-        setTimeout(() => this.menuClosed.emit(), 200);
-    }
-    onMenuOpened() {
-        // we set a timeout to wait for the menu to be really opened
-        setTimeout(() => this.menuOpened.emit(), 100);
-    }
-    setHostStyle(placement) {
-        const isSvg = this.element instanceof SVGElement;
-        const tooltip = this.elementRef.nativeElement;
-        const isCustomPosition = !this.elementPosition.x;
-        let elementHeight = !this.element.offsetHeight ? this.element.getBoundingClientRect().height : this.element.offsetHeight;
-        let elementWidth = !this.element.offsetWidth ? this.element.getBoundingClientRect().width : this.element.offsetWidth;
-        const tooltipHeight = tooltip.clientHeight;
-        const tooltipWidth = tooltip.clientWidth;
-        const scrollY = window.pageYOffset;
-        let topStyle;
-        let leftStyle;
-        if (isCustomPosition) {
-            if (placement && placement.split(' ')[0] === 'top') {
-                this.below = false;
-            }
-            if (placement && placement.split(' ')[0] === 'bottom') {
-                this.below = true;
-            }
-            elementHeight = 0;
-            elementWidth = 0;
-            topStyle = this.elementPosition.top;
-            leftStyle = this.elementPosition.left;
-            if (this.arrow && this.arrowPosition) {
-                this.arrowClass = 'arrow-' + this.arrowPosition;
-                switch (this.arrowPosition) {
-                    case 'left':
-                    case 'right':
-                        this.arrowLeftPosition = undefined;
-                        this.arrowRightPosition = undefined;
-                        this.arrowBottomPosition = 'auto';
-                        this.arrowTopPosition = this.arrowOffset + '%';
-                        break;
-                    case 'top':
-                    case 'bottom':
-                        this.arrowLeftPosition = this.arrowOffset + '%';
-                        this.arrowRightPosition = 'auto';
-                        this.arrowBottomPosition = undefined;
-                        this.arrowTopPosition = undefined;
-                        break;
-                }
-            }
-        }
-        else {
-            if (placement.split(' ')[0] === 'top') {
-                this.below = false;
-                topStyle = this.elementPosition.top - this.tooltipOffset;
-                topStyle += 8;
-            }
-            if (placement.split(' ')[0] === 'bottom') {
-                this.below = true;
-                topStyle = this.elementPosition.bottom + this.tooltipOffset;
-                // We remove 8px due to the margin-top we put to display the arrow.
-                topStyle -= 8;
-            }
-            if (placement.split(' ')[0] === 'left') {
-                leftStyle = this.elementPosition.left - tooltipWidth - this.tooltipOffset;
-            }
-            if (placement.split(' ')[0] === 'right') {
-                leftStyle = this.elementPosition.left + elementWidth + this.tooltipOffset;
-            }
-            if (placement.split(' ')[0] === 'left' || placement.split(' ')[0] === 'right') {
-                topStyle = (this.elementPosition.top + scrollY) + elementHeight / 2 - tooltip.clientHeight / 2;
-            }
-            if (placement === 'right bottom') {
-                this.below = true;
-                this.before = false;
-                this.arrowClass = 'arrow-left';
-                topStyle = (this.elementPosition.top + scrollY);
-                this.arrowRightPosition = undefined;
-                this.arrowLeftPosition = undefined;
-                this.arrowBottomPosition = 'auto';
-                this.arrowTopPosition = this.arrowOffset ? (this.arrowOffset + '%') : (elementHeight / 2 + 'px');
-            }
-            if (placement === 'left bottom') {
-                this.below = true;
-                this.before = true;
-                this.arrowClass = 'arrow-right';
-                topStyle = (this.elementPosition.top + scrollY);
-                this.arrowLeftPosition = undefined;
-                this.arrowRightPosition = undefined;
-                this.arrowBottomPosition = 'auto';
-                this.arrowTopPosition = this.arrowOffset ? (this.arrowOffset + '%') : (elementHeight / 2 + 'px');
-            }
-            if (placement === 'right top') {
-                this.below = false;
-                this.before = false;
-                this.arrowClass = 'arrow-left';
-                topStyle = (this.elementPosition.top + elementHeight + scrollY);
-                this.arrowLeftPosition = undefined;
-                this.arrowRightPosition = undefined;
-                this.arrowTopPosition = 'auto';
-                this.arrowBottomPosition = this.arrowOffset ? (this.arrowOffset + '%') : (-(tooltip.clientHeight - elementHeight / 2) + 'px');
-            }
-            if (placement === 'left top') {
-                this.below = false;
-                this.before = true;
-                this.arrowClass = 'arrow-right';
-                topStyle = (this.elementPosition.top + elementHeight + scrollY);
-                this.arrowRightPosition = undefined;
-                this.arrowLeftPosition = undefined;
-                this.arrowTopPosition = 'auto';
-                this.arrowBottomPosition = this.arrowOffset ? (this.arrowOffset + '%') : (-(tooltip.clientHeight - elementHeight / 2) + 'px');
-            }
-            if (placement === 'bottom right') {
-                this.before = false;
-                this.below = true;
-                this.arrowClass = 'arrow-top';
-                leftStyle = this.elementPosition.left;
-                this.arrowTopPosition = undefined;
-                this.arrowRightPosition = 'auto';
-                this.arrowLeftPosition = this.arrowOffset ? (this.arrowOffset + '%') : (((elementWidth / 2) - 4.5) + 'px');
-            }
-            if (placement === 'bottom left') {
-                this.before = true;
-                this.below = true;
-                this.arrowClass = 'arrow-top';
-                leftStyle = this.elementPosition.right;
-                this.arrowTopPosition = undefined;
-                this.arrowLeftPosition = 'auto';
-                this.arrowRightPosition = this.arrowOffset ? (this.arrowOffset + '%') : (((elementWidth / 2) - 2.5) + 'px');
-            }
-            if (placement === 'top right') {
-                this.before = false;
-                this.below = false;
-                this.arrowClass = 'arrow-bottom';
-                leftStyle = this.elementPosition.left;
-                this.arrowBottomPosition = undefined;
-                this.arrowTopPosition = undefined;
-                this.arrowRightPosition = 'auto';
-                this.arrowLeftPosition = this.arrowOffset ? (this.arrowOffset + '%') : (((elementWidth / 2) - 4.5) + 'px');
-            }
-            if (placement === 'top left') {
-                this.before = true;
-                this.below = false;
-                this.arrowClass = 'arrow-bottom';
-                leftStyle = this.elementPosition.right;
-                this.arrowBottomPosition = undefined;
-                this.arrowTopPosition = undefined;
-                this.arrowLeftPosition = 'auto';
-                this.arrowRightPosition = this.arrowOffset ? (this.arrowOffset + '%') : (((elementWidth / 2) - 2.5) + 'px');
-            }
-        }
-        // This line is PURE MAGIC and super important. It allows to force mat-menu
-        // to reposition the menu with the new xPosition / yPosition.
-        this.changeDetectorRef.detectChanges();
-        const topEdge = topStyle;
-        const bottomEdge = topStyle + tooltipHeight;
-        const leftEdge = leftStyle;
-        const rightEdge = leftStyle + tooltipWidth;
-        if ((topEdge < 0 || bottomEdge > document.body.clientHeight ||
-            leftEdge < 0 || rightEdge > document.body.clientWidth) && this.autoPlacement) {
-            return false;
-        }
-        this.hostStyleTop = topStyle + 'px';
-        this.hostStyleLeft = leftStyle + 'px';
-        return true;
-    }
-    setPlacementClass(placement) {
-        this.renderer.addClass(this.elementRef.nativeElement, 'tooltip-' + (placement ? placement.split(' ')[0] : placement));
-        this.renderer.addClass(this.elementRef.nativeElement, 'yPosition-' +
-            (placement && placement.split(' ').length === 2 ? placement.split(' ')[1] : 'center'));
-        if (this.elementRef.nativeElement.children && this.elementRef.nativeElement.children.length > 1) {
-            const tooltipArrow = Array.from(this.elementRef.nativeElement.children).filter((child) => child.getAttribute('id') === 'tooltipArrow');
-            if (tooltipArrow && tooltipArrow.length === 1) {
-                if (placement && placement.split(' ').length === 2 && placement.split(' ')[1] === 'bottom') {
-                    this.renderer.setStyle(tooltipArrow[0], 'top', this.arrowTopPosition);
-                }
-                else if (placement && placement.split(' ').length === 2 && placement.split(' ')[1] === 'top') {
-                    this.renderer.setStyle(tooltipArrow[0], 'top', this.arrowBottomPosition);
-                }
-            }
-        }
-    }
-    setPosition() {
-        if (this.setHostStyle(this.placement)) {
-            this.setPlacementClass(this.placement);
-            if (this.viewInit) {
-                // We did this in order to reset overlayRef (multi web component needed with matmenu and cdk overlay)
-                if (this.trigger["_overlayRef"]) {
-                    this.trigger["_overlayRef"].dispose();
-                    this.trigger["_overlayRef"] = null;
-                }
-                this.trigger.openMenu();
-            }
-            return;
-        }
-        else {
-            const placements = ['top', 'right', 'bottom', 'left'];
-            for (const placement of placements) {
-                if (this.setHostStyle(placement)) {
-                    this.setPlacementClass(placement);
-                    if (this.viewInit) {
-                        this.trigger.openMenu();
-                    }
-                    return;
-                }
-            }
-        }
-    }
-}
-PopmenuComponent.decorators = [
-    { type: Component, args: [{
-                changeDetection: ChangeDetectionStrategy.OnPush,
-                selector: 'ap-popmenu',
-                template: "<button id=\"menuTrigger\" class=\"button-trigger\" mat-button\n        [matMenuTriggerFor]=\"menu\" (menuClosed)=\"onMenuClosed()\" (menuOpened)=\"onMenuOpened()\">\n</button>\n<mat-menu #menu=\"matMenu\" [yPosition]=\"!below ? 'above': 'below'\" [xPosition]=\"!before? 'after': 'before'\" [overlapTrigger]=\"false\"\n          [hasBackdrop]=\"hasBackdrop\"\n          class=\"pop-menu {{arrow ? 'arrow-before ' + arrowClass : ''}} {{shadow ? 'shadow' : ''}} {{border ? '' : (shadow ? 'shadow-no-border' : '')}} {{rounded ? 'rounded-component' : ''}} {{ background ? '' : 'no-background'}}\">\n\n    <div *ngIf=\"arrow\" class=\"{{arrow ? 'arrow-before ' + arrowClass : ''}}\" [ngStyle]=\"{'left': arrowLeftPosition, 'right': arrowRightPosition, 'top': arrowTopPosition, 'bottom': arrowBottomPosition}\"></div>\n    <div (click)=\"$event.stopPropagation()\" class=\"{{rounded ? 'rounded-component' : ''}} outline-none\">\n        <div class=\"{{border ? 'popover-content ' : ''}} {{rounded ? 'rounded-component' : ''}}\">\n            <ng-container *ngTemplateOutlet=\"value\"></ng-container>\n        </div>\n    </div>\n</mat-menu>\n\n\n",
-                styles: ["[color=facebook]{color:#1877f2}[bgcolor=facebook],[hcolor=facebook]:hover{background-color:#1877f2}[border=facebook]{border:1px solid #1877f2}[color=google]{color:#4e85e8}[bgcolor=google],[hcolor=google]:hover{background-color:#4e85e8}[border=google]{border:1px solid #4e85e8}[color=instagram]{color:#e1306c}[bgcolor=instagram],[hcolor=instagram]:hover{background-color:#e1306c}[border=instagram]{border:1px solid #e1306c}[color=instagrammagenta]{color:#c13584}[bgcolor=instagrammagenta],[hcolor=instagrammagenta]:hover{background-color:#c13584}[border=instagrammagenta]{border:1px solid #c13584}[color=instagramblue]{color:#5851db}[bgcolor=instagramblue],[hcolor=instagramblue]:hover{background-color:#5851db}[border=instagramblue]{border:1px solid #5851db}[color=instagrampurple]{color:#833ab4}[bgcolor=instagrampurple],[hcolor=instagrampurple]:hover{background-color:#833ab4}[border=instagrampurple]{border:1px solid #833ab4}[color=instagramorange]{color:#f56040}[bgcolor=instagramorange],[hcolor=instagramorange]:hover{background-color:#f56040}[border=instagramorange]{border:1px solid #f56040}[color=instagramyellow]{color:#ffdc80}[bgcolor=instagramyellow],[hcolor=instagramyellow]:hover{background-color:#ffdc80}[border=instagramyellow]{border:1px solid #ffdc80}[color=linkedin]{color:#2c67bc}[bgcolor=linkedin],[hcolor=linkedin]:hover{background-color:#2c67bc}[border=linkedin]{border:1px solid #2c67bc}[color=twitter]{color:#55acee}[bgcolor=twitter],[hcolor=twitter]:hover{background-color:#55acee}[border=twitter]{border:1px solid #55acee}[color=youtube]{color:red}[bgcolor=youtube],[hcolor=youtube]:hover{background-color:red}[border=youtube]{border:1px solid red}[color=blood-orange]{color:#ff4d00}[bgcolor=blood-orange],[hcolor=blood-orange]:hover{background-color:#ff4d00}[border=blood-orange]{border:1px solid #ff4d00}[color=pinkish-orange]{color:#ff7b49}[bgcolor=pinkish-orange],[hcolor=pinkish-orange]:hover{background-color:#ff7b49}[border=pinkish-orange]{border:1px solid #ff7b49}[color=charcoal-grey]{color:#2a2f34}[bgcolor=charcoal-grey],[hcolor=charcoal-grey]:hover{background-color:#2a2f34}[border=charcoal-grey]{border:1px solid #2a2f34}[color=azure]{color:#00aeef}[bgcolor=azure],[hcolor=azure]:hover{background-color:#00aeef}[border=azure]{border:1px solid #00aeef}[color=light-azure]{color:#eaf5fd}[bgcolor=light-azure],[hcolor=light-azure]:hover{background-color:#eaf5fd}[border=light-azure]{border:1px solid #eaf5fd}[color=blue-grey]{color:#8d98a9}[bgcolor=blue-grey],[hcolor=blue-grey]:hover{background-color:#8d98a9}[border=blue-grey]{border:1px solid #8d98a9}[color=silver]{color:#ced0da}[bgcolor=silver],[hcolor=silver]:hover{background-color:#ced0da}[border=silver]{border:1px solid #ced0da}[color=pale-grey]{color:#dfe3e9}[bgcolor=pale-grey],[hcolor=pale-grey]:hover{background-color:#dfe3e9}[border=pale-grey]{border:1px solid #dfe3e9}[color=grey-white]{color:#f5f7f8}[bgcolor=grey-white],[hcolor=grey-white]:hover{background-color:#f5f7f8}[border=grey-white]{border:1px solid #f5f7f8}[color=cool-grey]{color:#b4bbc6}[bgcolor=cool-grey],[hcolor=cool-grey]:hover{background-color:#b4bbc6}[border=cool-grey]{border:1px solid #b4bbc6}[color=black]{color:#344563}[bgcolor=black],[hcolor=black]:hover{background-color:#344563}[border=black]{border:1px solid #344563}[color=grey-blue]{color:#68768c}[bgcolor=grey-blue],[hcolor=grey-blue]:hover{background-color:#68768c}[border=grey-blue]{border:1px solid #68768c}[color=strawberry]{color:#f4282d}[bgcolor=strawberry],[hcolor=strawberry]:hover{background-color:#f4282d}[border=strawberry]{border:1px solid #f4282d}[color=light-strawberry]{color:#f8eded}[bgcolor=light-strawberry],[hcolor=light-strawberry]:hover{background-color:#f8eded}[border=light-strawberry]{border:1px solid #f8eded}[color=white]{color:#fff}[bgcolor=white],[hcolor=white]:hover{background-color:#fff}[border=white]{border:1px solid #fff}[color=cool-green]{color:#33c15d}[bgcolor=cool-green],[hcolor=cool-green]:hover{background-color:#33c15d}[border=cool-green]{border:1px solid #33c15d}[color=light-green]{color:#ebfaef}[bgcolor=light-green],[hcolor=light-green]:hover{background-color:#ebfaef}[border=light-green]{border:1px solid #ebfaef}[color=transparent]{color:#0000}[bgcolor=transparent],[hcolor=transparent]:hover{background-color:initial}[border=transparent]{border:1px solid #0000}[color=c0]{color:#a566a5}[bgcolor=c0],[hcolor=c0]:hover{background-color:#a566a5}[border=c0]{border:1px solid #a566a5}[color=c1]{color:#c7ab82}[bgcolor=c1],[hcolor=c1]:hover{background-color:#c7ab82}[border=c1]{border:1px solid #c7ab82}[color=c2]{color:#f2713c}[bgcolor=c2],[hcolor=c2]:hover{background-color:#f2713c}[border=c2]{border:1px solid #f2713c}[color=c3]{color:#ffd006}[bgcolor=c3],[hcolor=c3]:hover{background-color:#ffd006}[border=c3]{border:1px solid #ffd006}[color=c4]{color:#94c5aa}[bgcolor=c4],[hcolor=c4]:hover{background-color:#94c5aa}[border=c4]{border:1px solid #94c5aa}[color=c5]{color:#2a9d8f}[bgcolor=c5],[hcolor=c5]:hover{background-color:#2a9d8f}[border=c5]{border:1px solid #2a9d8f}[color=c6]{color:#78acd8}[bgcolor=c6],[hcolor=c6]:hover{background-color:#78acd8}[border=c6]{border:1px solid #78acd8}[color=c7]{color:#525a9e}[bgcolor=c7],[hcolor=c7]:hover{background-color:#525a9e}[border=c7]{border:1px solid #525a9e}[color=c8]{color:#6a2459}[bgcolor=c8],[hcolor=c8]:hover{background-color:#6a2459}[border=c8]{border:1px solid #6a2459}[color=c9]{color:#74729e}[bgcolor=c9],[hcolor=c9]:hover{background-color:#74729e}[border=c9]{border:1px solid #74729e}.mat-menu-content{padding:0}.mat-menu-item{height:inherit;width:inherit;background-color:#fff;padding:0;cursor:default;box-shadow:0 4px 10px 0 #0000001c}.mat-menu-item:hover{background-color:#fff!important;cursor:default;box-shadow:none!important}.outline-none{outline:none}.mat-menu-item-highlighted:not([disabled]),.mat-menu-item.cdk-keyboard-focused:not([disabled]),.mat-menu-item.cdk-program-focused:not([disabled]),.mat-menu-item:hover:not([disabled]){background-color:#fff!important;cursor:default;box-shadow:none!important}:host ::ng-deep .mat-button{max-width:1px;max-height:1px;min-width:1px;min-height:1px;padding:0;margin:0}:host{position:absolute;max-width:1px;max-height:1px;display:flex}.button-trigger{padding:0;border:none;height:1px;width:1px}::ng-deep .rounded-component .mat-menu-content{border-radius:4px}::ng-deep .rounded-component{border-radius:4px}::ng-deep .no-background .rounded-component{position:fixed}.popover-content{border:1px solid #dfe3e9}"]
-            },] }
-];
-/** @nocollapse */
-PopmenuComponent.ctorParameters = () => [
-    { type: Renderer2 },
-    { type: ElementRef },
-    { type: ChangeDetectorRef }
-];
-PopmenuComponent.propDecorators = {
-    data: [{ type: Input }],
-    menuClosed: [{ type: Output }],
-    menuOpened: [{ type: Output }],
-    trigger: [{ type: ViewChild, args: [MatMenuTrigger,] }],
-    hostStyleTop: [{ type: HostBinding, args: ['style.top',] }],
-    hostStyleBorderRadius: [{ type: HostBinding, args: ['style.border-radius',] }],
-    hostStyleLeft: [{ type: HostBinding, args: ['style.left',] }],
-    hostStyleZIndex: [{ type: HostBinding, args: ['style.z-index',] }],
-    hostStyleTransition: [{ type: HostBinding, args: ['style.transition',] }],
-    hostStyleWidth: [{ type: HostBinding, args: ['style.width',] }],
-    hostStyleMaxWidth: [{ type: HostBinding, args: ['style.max-width',] }],
-    hostStylePointerEvents: [{ type: HostBinding, args: ['style.pointer-events',] }],
-    hostClassShow: [{ type: HostBinding, args: ['class.tooltip-show',] }],
-    hostClassShadow: [{ type: HostBinding, args: ['class.tooltip-shadow',] }],
-    hostClassLight: [{ type: HostBinding, args: ['class.tooltip-light',] }],
-    show: [{ type: Input }],
-    close: [{ type: Input }]
-};
-
-class PopmenuDirective {
-    constructor(initOptions, renderer, elementRef, componentFactoryResolver, appRef, injector) {
-        this.initOptions = initOptions;
-        this.renderer = renderer;
-        this.elementRef = elementRef;
-        this.componentFactoryResolver = componentFactoryResolver;
-        this.appRef = appRef;
-        this.injector = injector;
-        this.apPopmenuBackground = true;
-        this.close = false;
-        this.hasBackdrop = true;
-        this.pointer = true;
-        this.menuClosed = new EventEmitter();
-        this.menuOpened = new EventEmitter();
-        this._options = {};
-    }
-    get options() {
-        return this._options;
-    }
-    set options(value) {
-        if (value && defaultOptions) {
-            this._options = value;
-        }
-    }
-    get destroyDelay() {
-        return Number(this.getHideDelay()) + Number(this.options['animationDuration']);
-    }
-    get isDisplayOnHover() {
-        if (this.options['display'] === false) {
-            return false;
-        }
-        if (this.options['displayTouchscreen'] === false) {
-            return false;
-        }
-        if (this.options['trigger'] !== 'hover') {
-            return false;
-        }
-        return true;
-    }
-    get isTooltipDestroyed() {
-        return this.componentRef && this.componentRef.hostView.destroyed;
-    }
-    get tooltipPosition() {
-        if (this.options['position']) {
-            return this.options['position'];
-        }
-        else {
-            return this.elementPosition;
-        }
-    }
-    appendComponentToBody(component, data = {}) {
-        this.componentRef = this.componentFactoryResolver
-            .resolveComponentFactory(component)
-            .create(this.injector);
-        this.componentRef.instance.data = {
-            value: this.popMenuValue,
-            element: this.elementRef.nativeElement,
-            elementPosition: this.tooltipPosition,
-            options: this.options
-        };
-        this.appRef.attachView(this.componentRef.hostView);
-        const domElem = this.componentRef.hostView.rootNodes[0];
-        document.body.appendChild(domElem);
-        this.componentSubscribe = this.componentRef.instance.menuClosed.subscribe((event) => {
-            this.handleClose(event);
-        });
-        this.componentSubscribe = this.componentRef.instance.menuOpened.subscribe((event) => {
-            this.handleOpen(event);
-        });
-    }
-    handleClose(event) {
-        this.menuClosed.emit();
-    }
-    handleOpen(event) {
-        this.menuOpened.emit();
-    }
-    applyOptionsDefault(defaultOptions, options) {
-        this.options = Object.assign({}, defaultOptions, this.initOptions || {}, options);
-    }
-    clearTimeouts() {
-        if (this.createTimeoutId) {
-            clearTimeout(this.createTimeoutId);
-        }
-        if (this.showTimeoutId) {
-            clearTimeout(this.showTimeoutId);
-        }
-        if (this.hideTimeoutId) {
-            clearTimeout(this.hideTimeoutId);
-        }
-        if (this.destroyTimeoutId) {
-            clearTimeout(this.destroyTimeoutId);
-        }
-    }
-    createPopMenu() {
-        this.clearTimeouts();
-        this.createTimeoutId = window.setTimeout(() => {
-            this.appendComponentToBody(PopmenuComponent);
-        }, this.getShowDelay());
-        this.showTimeoutId = window.setTimeout(() => {
-            this.showTooltipElem();
-        }, this.getShowDelay());
-    }
-    getElementPosition() {
-        this.elementPosition = this.elementRef.nativeElement.getBoundingClientRect();
-    }
-    getHideDelay() {
-        return this.options['hideDelay'];
-    }
-    getProperties(changes) {
-        let properties = {};
-        for (const prop in changes) {
-            if (prop !== 'options' && prop !== 'tooltipValue') {
-                properties[prop] = changes[prop].currentValue;
-            }
-            if (prop === 'options') {
-                properties = changes[prop].currentValue;
-            }
-        }
-        return properties;
-    }
-    getShowDelay() {
-        return this.options['showDelay'];
-    }
-    ngOnChanges(changes) {
-        if (changes.pointer) {
-            if (!this.pointer) {
-                this.renderer.removeStyle(this.elementRef.nativeElement, 'cursor');
-            }
-            else {
-                this.renderer.setStyle(this.elementRef.nativeElement, 'cursor', 'pointer');
-            }
-        }
-        if (changes.close && changes.close.currentValue) {
-            this.hideTooltipElem();
-        }
-        const changedOptions = this.getProperties(changes);
-        this.applyOptionsDefault(this.options && Object.keys(this.options).length > 0 ? this.options : defaultOptions, changedOptions);
-    }
-    ngOnInit() {
-        if (this.pointer) {
-            this.renderer.setStyle(this.elementRef.nativeElement, 'cursor', 'pointer');
-        }
-    }
-    onClick() {
-        if (this.apPopmenuDisabled) {
-            return;
-        }
-        this.show();
-        this.close = false;
-    }
-    show() {
-        this.getElementPosition();
-        if (!this.componentRef || this.isTooltipDestroyed) {
-            this.createPopMenu();
-        }
-        else if (!this.isTooltipDestroyed) {
-            this.showTooltipElem();
-        }
-    }
-    showTooltipElem() {
-        this.componentRef.instance.data = {
-            value: this.popMenuValue,
-            element: this.elementRef.nativeElement,
-            elementPosition: this.tooltipPosition,
-            options: this.options
-        };
-        this.clearTimeouts();
-        this.componentRef.instance.show = true;
-    }
-    hideTooltipElem() {
-        if (this.componentRef) {
-            this.componentRef.instance.close = true;
-        }
-    }
-}
-PopmenuDirective.decorators = [
-    { type: Directive, args: [{
-                selector: '[apPopmenu]'
-            },] }
-];
-/** @nocollapse */
-PopmenuDirective.ctorParameters = () => [
-    { type: undefined, decorators: [{ type: Optional }, { type: Inject, args: [PopmenuOptionsService,] }] },
-    { type: Renderer2 },
-    { type: ElementRef },
-    { type: ComponentFactoryResolver },
-    { type: ApplicationRef },
-    { type: Injector }
-];
-PopmenuDirective.propDecorators = {
-    apPopmenuBorder: [{ type: Input }],
-    apPopmenuDisabled: [{ type: Input }],
-    apPopmenuBackground: [{ type: Input }],
-    arrow: [{ type: Input }],
-    arrowOffset: [{ type: Input }],
-    arrowPosition: [{ type: Input }],
-    close: [{ type: Input }],
-    hasBackdrop: [{ type: Input }],
-    offset: [{ type: Input }],
-    placement: [{ type: Input }],
-    pointer: [{ type: Input }],
-    popMenuValue: [{ type: Input, args: ['apPopmenu',] }],
-    position: [{ type: Input }],
-    rounded: [{ type: Input }],
-    shadow: [{ type: Input }],
-    menuClosed: [{ type: Output }],
-    menuOpened: [{ type: Output }],
-    options: [{ type: Input, args: ['options',] }],
-    onClick: [{ type: HostListener, args: ['click',] }]
-};
-
-class PopmenuModule {
-    static forRoot(initOptions) {
-        return {
-            ngModule: PopmenuModule,
-            providers: [
-                {
-                    provide: PopmenuOptionsService,
-                    useValue: initOptions
-                }
-            ]
-        };
-    }
-}
-PopmenuModule.decorators = [
-    { type: NgModule, args: [{
-                declarations: [
-                    PopmenuDirective,
-                    PopmenuComponent
-                ],
-                imports: [
-                    CommonModule,
-                    MatMenuModule,
-                ],
-                entryComponents: [
-                    PopmenuComponent
-                ],
-                exports: [
-                    PopmenuDirective
-                ]
-            },] }
-];
-
-class SplashscreenComponent {
-    constructor() {
-        this.cardLabels = [];
-        this.cardDirection = 'horizontal';
-        this.disposition = 'row';
-        this.imgHeight = 150;
-        this.imgPaths = [];
-        this.imgWidth = 150;
-        this.title = '';
-        /**
-         * The container and the cards width. All:
-         * - 100% of parent width
-         * - default: 750px for the container and 50% of the container for each card
-         */
-        this.width = 'default';
-    }
-}
-SplashscreenComponent.decorators = [
-    { type: Component, args: [{
-                changeDetection: ChangeDetectionStrategy.OnPush,
-                selector: 'ap-splashscreen',
-                template: "<div class=\"main-container ap-new {{width}}-width\">\n    <h1>{{title}}</h1>\n    <div class=\"info-container {{cardDirection}} {{width}}-width\">\n        <ng-container *ngFor=\"let label of cardLabels; let i = index\">\n            <div class=\"info-card {{width}}-width\">\n                <div class=\"info-card-content {{disposition}}\">\n                    <div class=\"img-container\">\n                        <img src=\"{{imgPaths[i]}}\" height=\"{{imgHeight}}\" width=\"{{imgWidth}}\" />\n                    </div>\n                    <div class=\"text-container\">\n                        <p>{{label}}</p>\n                    </div>\n                </div>\n                <div class=\"button-container\" *ngIf=\"i == 0\">\n                    <ng-content select=\"ap-button.first\"></ng-content>\n                </div>\n                <div class=\"button-container\" *ngIf=\"i == 1\">\n                    <ng-content select=\"ap-button.second\"></ng-content>\n                </div>\n            </div>\n        </ng-container>\n    </div>\n    <ng-content select=\"footer\"></ng-content>\n</div>\n",
-                styles: ["[color=facebook]{color:#1877f2}[bgcolor=facebook],[hcolor=facebook]:hover{background-color:#1877f2}[border=facebook]{border:1px solid #1877f2}[color=google]{color:#4e85e8}[bgcolor=google],[hcolor=google]:hover{background-color:#4e85e8}[border=google]{border:1px solid #4e85e8}[color=instagram]{color:#e1306c}[bgcolor=instagram],[hcolor=instagram]:hover{background-color:#e1306c}[border=instagram]{border:1px solid #e1306c}[color=instagrammagenta]{color:#c13584}[bgcolor=instagrammagenta],[hcolor=instagrammagenta]:hover{background-color:#c13584}[border=instagrammagenta]{border:1px solid #c13584}[color=instagramblue]{color:#5851db}[bgcolor=instagramblue],[hcolor=instagramblue]:hover{background-color:#5851db}[border=instagramblue]{border:1px solid #5851db}[color=instagrampurple]{color:#833ab4}[bgcolor=instagrampurple],[hcolor=instagrampurple]:hover{background-color:#833ab4}[border=instagrampurple]{border:1px solid #833ab4}[color=instagramorange]{color:#f56040}[bgcolor=instagramorange],[hcolor=instagramorange]:hover{background-color:#f56040}[border=instagramorange]{border:1px solid #f56040}[color=instagramyellow]{color:#ffdc80}[bgcolor=instagramyellow],[hcolor=instagramyellow]:hover{background-color:#ffdc80}[border=instagramyellow]{border:1px solid #ffdc80}[color=linkedin]{color:#2c67bc}[bgcolor=linkedin],[hcolor=linkedin]:hover{background-color:#2c67bc}[border=linkedin]{border:1px solid #2c67bc}[color=twitter]{color:#55acee}[bgcolor=twitter],[hcolor=twitter]:hover{background-color:#55acee}[border=twitter]{border:1px solid #55acee}[color=youtube]{color:red}[bgcolor=youtube],[hcolor=youtube]:hover{background-color:red}[border=youtube]{border:1px solid red}[color=blood-orange]{color:#ff4d00}[bgcolor=blood-orange],[hcolor=blood-orange]:hover{background-color:#ff4d00}[border=blood-orange]{border:1px solid #ff4d00}[color=pinkish-orange]{color:#ff7b49}[bgcolor=pinkish-orange],[hcolor=pinkish-orange]:hover{background-color:#ff7b49}[border=pinkish-orange]{border:1px solid #ff7b49}[color=charcoal-grey]{color:#2a2f34}[bgcolor=charcoal-grey],[hcolor=charcoal-grey]:hover{background-color:#2a2f34}[border=charcoal-grey]{border:1px solid #2a2f34}[color=azure]{color:#00aeef}[bgcolor=azure],[hcolor=azure]:hover{background-color:#00aeef}[border=azure]{border:1px solid #00aeef}[color=light-azure]{color:#eaf5fd}[bgcolor=light-azure],[hcolor=light-azure]:hover{background-color:#eaf5fd}[border=light-azure]{border:1px solid #eaf5fd}[color=blue-grey]{color:#8d98a9}[bgcolor=blue-grey],[hcolor=blue-grey]:hover{background-color:#8d98a9}[border=blue-grey]{border:1px solid #8d98a9}[color=silver]{color:#ced0da}[bgcolor=silver],[hcolor=silver]:hover{background-color:#ced0da}[border=silver]{border:1px solid #ced0da}[color=pale-grey]{color:#dfe3e9}[bgcolor=pale-grey],[hcolor=pale-grey]:hover{background-color:#dfe3e9}[border=pale-grey]{border:1px solid #dfe3e9}[color=grey-white]{color:#f5f7f8}[bgcolor=grey-white],[hcolor=grey-white]:hover{background-color:#f5f7f8}[border=grey-white]{border:1px solid #f5f7f8}[color=cool-grey]{color:#b4bbc6}[bgcolor=cool-grey],[hcolor=cool-grey]:hover{background-color:#b4bbc6}[border=cool-grey]{border:1px solid #b4bbc6}[color=black]{color:#344563}[bgcolor=black],[hcolor=black]:hover{background-color:#344563}[border=black]{border:1px solid #344563}[color=grey-blue]{color:#68768c}[bgcolor=grey-blue],[hcolor=grey-blue]:hover{background-color:#68768c}[border=grey-blue]{border:1px solid #68768c}[color=strawberry]{color:#f4282d}[bgcolor=strawberry],[hcolor=strawberry]:hover{background-color:#f4282d}[border=strawberry]{border:1px solid #f4282d}[color=light-strawberry]{color:#f8eded}[bgcolor=light-strawberry],[hcolor=light-strawberry]:hover{background-color:#f8eded}[border=light-strawberry]{border:1px solid #f8eded}[color=white]{color:#fff}[bgcolor=white],[hcolor=white]:hover{background-color:#fff}[border=white]{border:1px solid #fff}[color=cool-green]{color:#33c15d}[bgcolor=cool-green],[hcolor=cool-green]:hover{background-color:#33c15d}[border=cool-green]{border:1px solid #33c15d}[color=light-green]{color:#ebfaef}[bgcolor=light-green],[hcolor=light-green]:hover{background-color:#ebfaef}[border=light-green]{border:1px solid #ebfaef}[color=transparent]{color:#0000}[bgcolor=transparent],[hcolor=transparent]:hover{background-color:initial}[border=transparent]{border:1px solid #0000}[color=c0]{color:#a566a5}[bgcolor=c0],[hcolor=c0]:hover{background-color:#a566a5}[border=c0]{border:1px solid #a566a5}[color=c1]{color:#c7ab82}[bgcolor=c1],[hcolor=c1]:hover{background-color:#c7ab82}[border=c1]{border:1px solid #c7ab82}[color=c2]{color:#f2713c}[bgcolor=c2],[hcolor=c2]:hover{background-color:#f2713c}[border=c2]{border:1px solid #f2713c}[color=c3]{color:#ffd006}[bgcolor=c3],[hcolor=c3]:hover{background-color:#ffd006}[border=c3]{border:1px solid #ffd006}[color=c4]{color:#94c5aa}[bgcolor=c4],[hcolor=c4]:hover{background-color:#94c5aa}[border=c4]{border:1px solid #94c5aa}[color=c5]{color:#2a9d8f}[bgcolor=c5],[hcolor=c5]:hover{background-color:#2a9d8f}[border=c5]{border:1px solid #2a9d8f}[color=c6]{color:#78acd8}[bgcolor=c6],[hcolor=c6]:hover{background-color:#78acd8}[border=c6]{border:1px solid #78acd8}[color=c7]{color:#525a9e}[bgcolor=c7],[hcolor=c7]:hover{background-color:#525a9e}[border=c7]{border:1px solid #525a9e}[color=c8]{color:#6a2459}[bgcolor=c8],[hcolor=c8]:hover{background-color:#6a2459}[border=c8]{border:1px solid #6a2459}[color=c9]{color:#74729e}[bgcolor=c9],[hcolor=c9]:hover{background-color:#74729e}[border=c9]{border:1px solid #74729e}.main-container{align-items:center;justify-content:center;text-align:center}.main-container.default-width{width:750px}.main-container.all-width{width:100%}.main-container .info-container{align-items:center;display:flex;justify-content:center;min-height:250px;flex-wrap:wrap}.main-container .info-container.vertical{flex-direction:column}.main-container .info-container.horizontal{flex-direction:row}.main-container .info-container .info-card{flex:1 0 33%;background-color:#fff;display:flex;flex-direction:column;min-height:80%;margin:32px 16px 16px;padding:12px}.main-container .info-container .info-card.default-width{width:50%}.main-container .info-container .info-card.all-width{width:100%}.main-container .info-container .info-card .info-card-content{padding:12px;align-items:center;display:flex;height:70%;justify-content:center;text-align:left}.main-container .info-container .info-card .info-card-content.column{flex-direction:column}.main-container .info-container .info-card .info-card-content.row{flex-direction:row}.main-container .info-container .info-card .img-container{padding:12px}.main-container .info-container .info-card .img-container img{float:left;position:relative;vertical-align:middle}.main-container .info-container .info-card .button-container{align-items:flex-end;display:flex;flex:1;justify-content:center;padding:12px}:host ::ng-deep button{color:#fff!important;display:block}:host-context(.resize-splashscreen) .main-container{width:100%}"]
-            },] }
-];
-SplashscreenComponent.propDecorators = {
-    cardLabels: [{ type: Input }],
-    cardDirection: [{ type: Input }],
-    disposition: [{ type: Input }],
-    imgHeight: [{ type: Input }],
-    imgPaths: [{ type: Input }],
-    imgWidth: [{ type: Input }],
-    title: [{ type: Input }],
-    width: [{ type: Input }]
-};
-
-class TagComponent {
-    constructor() {
-        this.color = '';
-        this.onlyText = false;
-    }
-}
-TagComponent.decorators = [
-    { type: Component, args: [{
-                changeDetection: ChangeDetectionStrategy.OnPush,
-                selector: 'ap-tag',
-                template: "<div class=\"tag\"\n    [ngClass]=\"color\"\n    [class.big-padding]=\"onlyText\">\n    <ng-content></ng-content>\n</div>\n",
-                styles: ["[color=facebook]{color:#1877f2}[bgcolor=facebook],[hcolor=facebook]:hover{background-color:#1877f2}[border=facebook]{border:1px solid #1877f2}[color=google]{color:#4e85e8}[bgcolor=google],[hcolor=google]:hover{background-color:#4e85e8}[border=google]{border:1px solid #4e85e8}[color=instagram]{color:#e1306c}[bgcolor=instagram],[hcolor=instagram]:hover{background-color:#e1306c}[border=instagram]{border:1px solid #e1306c}[color=instagrammagenta]{color:#c13584}[bgcolor=instagrammagenta],[hcolor=instagrammagenta]:hover{background-color:#c13584}[border=instagrammagenta]{border:1px solid #c13584}[color=instagramblue]{color:#5851db}[bgcolor=instagramblue],[hcolor=instagramblue]:hover{background-color:#5851db}[border=instagramblue]{border:1px solid #5851db}[color=instagrampurple]{color:#833ab4}[bgcolor=instagrampurple],[hcolor=instagrampurple]:hover{background-color:#833ab4}[border=instagrampurple]{border:1px solid #833ab4}[color=instagramorange]{color:#f56040}[bgcolor=instagramorange],[hcolor=instagramorange]:hover{background-color:#f56040}[border=instagramorange]{border:1px solid #f56040}[color=instagramyellow]{color:#ffdc80}[bgcolor=instagramyellow],[hcolor=instagramyellow]:hover{background-color:#ffdc80}[border=instagramyellow]{border:1px solid #ffdc80}[color=linkedin]{color:#2c67bc}[bgcolor=linkedin],[hcolor=linkedin]:hover{background-color:#2c67bc}[border=linkedin]{border:1px solid #2c67bc}[color=twitter]{color:#55acee}[bgcolor=twitter],[hcolor=twitter]:hover{background-color:#55acee}[border=twitter]{border:1px solid #55acee}[color=youtube]{color:red}[bgcolor=youtube],[hcolor=youtube]:hover{background-color:red}[border=youtube]{border:1px solid red}[color=blood-orange]{color:#ff4d00}[bgcolor=blood-orange],[hcolor=blood-orange]:hover{background-color:#ff4d00}[border=blood-orange]{border:1px solid #ff4d00}[color=pinkish-orange]{color:#ff7b49}[bgcolor=pinkish-orange],[hcolor=pinkish-orange]:hover{background-color:#ff7b49}[border=pinkish-orange]{border:1px solid #ff7b49}[color=charcoal-grey]{color:#2a2f34}[bgcolor=charcoal-grey],[hcolor=charcoal-grey]:hover{background-color:#2a2f34}[border=charcoal-grey]{border:1px solid #2a2f34}[color=azure]{color:#00aeef}[bgcolor=azure],[hcolor=azure]:hover{background-color:#00aeef}[border=azure]{border:1px solid #00aeef}[color=light-azure]{color:#eaf5fd}[bgcolor=light-azure],[hcolor=light-azure]:hover{background-color:#eaf5fd}[border=light-azure]{border:1px solid #eaf5fd}[color=blue-grey]{color:#8d98a9}[bgcolor=blue-grey],[hcolor=blue-grey]:hover{background-color:#8d98a9}[border=blue-grey]{border:1px solid #8d98a9}[color=silver]{color:#ced0da}[bgcolor=silver],[hcolor=silver]:hover{background-color:#ced0da}[border=silver]{border:1px solid #ced0da}[color=pale-grey]{color:#dfe3e9}[bgcolor=pale-grey],[hcolor=pale-grey]:hover{background-color:#dfe3e9}[border=pale-grey]{border:1px solid #dfe3e9}[color=grey-white]{color:#f5f7f8}[bgcolor=grey-white],[hcolor=grey-white]:hover{background-color:#f5f7f8}[border=grey-white]{border:1px solid #f5f7f8}[color=cool-grey]{color:#b4bbc6}[bgcolor=cool-grey],[hcolor=cool-grey]:hover{background-color:#b4bbc6}[border=cool-grey]{border:1px solid #b4bbc6}[color=black]{color:#344563}[bgcolor=black],[hcolor=black]:hover{background-color:#344563}[border=black]{border:1px solid #344563}[color=grey-blue]{color:#68768c}[bgcolor=grey-blue],[hcolor=grey-blue]:hover{background-color:#68768c}[border=grey-blue]{border:1px solid #68768c}[color=strawberry]{color:#f4282d}[bgcolor=strawberry],[hcolor=strawberry]:hover{background-color:#f4282d}[border=strawberry]{border:1px solid #f4282d}[color=light-strawberry]{color:#f8eded}[bgcolor=light-strawberry],[hcolor=light-strawberry]:hover{background-color:#f8eded}[border=light-strawberry]{border:1px solid #f8eded}[color=white]{color:#fff}[bgcolor=white],[hcolor=white]:hover{background-color:#fff}[border=white]{border:1px solid #fff}[color=cool-green]{color:#33c15d}[bgcolor=cool-green],[hcolor=cool-green]:hover{background-color:#33c15d}[border=cool-green]{border:1px solid #33c15d}[color=light-green]{color:#ebfaef}[bgcolor=light-green],[hcolor=light-green]:hover{background-color:#ebfaef}[border=light-green]{border:1px solid #ebfaef}[color=transparent]{color:#0000}[bgcolor=transparent],[hcolor=transparent]:hover{background-color:initial}[border=transparent]{border:1px solid #0000}[color=c0]{color:#a566a5}[bgcolor=c0],[hcolor=c0]:hover{background-color:#a566a5}[border=c0]{border:1px solid #a566a5}[color=c1]{color:#c7ab82}[bgcolor=c1],[hcolor=c1]:hover{background-color:#c7ab82}[border=c1]{border:1px solid #c7ab82}[color=c2]{color:#f2713c}[bgcolor=c2],[hcolor=c2]:hover{background-color:#f2713c}[border=c2]{border:1px solid #f2713c}[color=c3]{color:#ffd006}[bgcolor=c3],[hcolor=c3]:hover{background-color:#ffd006}[border=c3]{border:1px solid #ffd006}[color=c4]{color:#94c5aa}[bgcolor=c4],[hcolor=c4]:hover{background-color:#94c5aa}[border=c4]{border:1px solid #94c5aa}[color=c5]{color:#2a9d8f}[bgcolor=c5],[hcolor=c5]:hover{background-color:#2a9d8f}[border=c5]{border:1px solid #2a9d8f}[color=c6]{color:#78acd8}[bgcolor=c6],[hcolor=c6]:hover{background-color:#78acd8}[border=c6]{border:1px solid #78acd8}[color=c7]{color:#525a9e}[bgcolor=c7],[hcolor=c7]:hover{background-color:#525a9e}[border=c7]{border:1px solid #525a9e}[color=c8]{color:#6a2459}[bgcolor=c8],[hcolor=c8]:hover{background-color:#6a2459}[border=c8]{border:1px solid #6a2459}[color=c9]{color:#74729e}[bgcolor=c9],[hcolor=c9]:hover{background-color:#74729e}[border=c9]{border:1px solid #74729e}.tag{padding:4px 8px;color:#344563;align-self:center;background:#e8f4ff;border-radius:25px;text-wrap:none}.tag.blue{background-color:#e8f4ff;color:#178dfe}.tag.red{background-color:#fde7e7;color:#e81313}.tag.purple{background-color:#efedf8;color:#6554c0}.tag.orange{background-color:#ffefe9;color:#ff6726}.tag.yellow{background-color:#fffde9;color:#ffe91f}.tag.green{background-color:#ecf7ed;color:#45b854}.tag.big-padding{padding:8px 16px}"]
-            },] }
-];
-TagComponent.propDecorators = {
-    color: [{ type: Input }],
-    onlyText: [{ type: Input }]
-};
-
-class TagListComponent {
-}
-TagListComponent.decorators = [
-    { type: Component, args: [{
-                changeDetection: ChangeDetectionStrategy.OnPush,
-                selector: 'ap-tag-list',
-                template: "<div class=\"tags-list\">\n    <ng-content></ng-content>\n</div>\n",
-                styles: [".tags-list{display:flex;flex-direction:row;flex-wrap:wrap;justify-content:center;margin-bottom:-4px;margin-right:-8px}"]
-            },] }
-];
-
-class TryPopupComponent {
-    constructor() {
-        this.trialClicked = new EventEmitter();
-        this.closeClicked = new EventEmitter();
-        this.tryAgorapulsePopupVisible = true;
-        this.logoUrl = 'assets/img/style/logos/logo-blue.svg';
-    }
-    onClose() {
-        this.tryAgorapulsePopupVisible = false;
-        this.closeClicked.emit();
-    }
-    onButtonClick() {
-        this.trialClicked.emit();
-        this.onClose();
-        window.open(this.trialUrl, '_blank');
-    }
-}
-TryPopupComponent.decorators = [
-    { type: Component, args: [{
-                changeDetection: ChangeDetectionStrategy.OnPush,
-                selector: 'ap-try-popup',
-                template: "<ng-template [ngIf]=\"tryAgorapulsePopupVisible\">\n    <div class=\"try-popup\">\n        <button (click)=\"onClose()\" class=\"close-button\" id=\"try-button\" mat-flat-button>\n            <mat-icon>close</mat-icon>\n        </button>\n\n        <div class=\"row\">\n            <div class=\"col s6\">\n                <img class=\"agorapulse-logo\" [src]=\"logoUrl\" alt=\"Agorapulse\">\n                <p class=\"subtitle\">\n                    {{texts.description}}\n                </p>\n            </div>\n\n            <div class=\"col s6 button-container\">\n                <button (click)=\"onButtonClick()\"\n                        color=\"primary\"\n                        mat-flat-button>\n                    {{texts.tryButtonLabel}}\n                </button>\n            </div>\n        </div>\n    </div>\n</ng-template>\n",
-                styles: ["[color=facebook]{color:#1877f2}[bgcolor=facebook],[hcolor=facebook]:hover{background-color:#1877f2}[border=facebook]{border:1px solid #1877f2}[color=google]{color:#4e85e8}[bgcolor=google],[hcolor=google]:hover{background-color:#4e85e8}[border=google]{border:1px solid #4e85e8}[color=instagram]{color:#e1306c}[bgcolor=instagram],[hcolor=instagram]:hover{background-color:#e1306c}[border=instagram]{border:1px solid #e1306c}[color=instagrammagenta]{color:#c13584}[bgcolor=instagrammagenta],[hcolor=instagrammagenta]:hover{background-color:#c13584}[border=instagrammagenta]{border:1px solid #c13584}[color=instagramblue]{color:#5851db}[bgcolor=instagramblue],[hcolor=instagramblue]:hover{background-color:#5851db}[border=instagramblue]{border:1px solid #5851db}[color=instagrampurple]{color:#833ab4}[bgcolor=instagrampurple],[hcolor=instagrampurple]:hover{background-color:#833ab4}[border=instagrampurple]{border:1px solid #833ab4}[color=instagramorange]{color:#f56040}[bgcolor=instagramorange],[hcolor=instagramorange]:hover{background-color:#f56040}[border=instagramorange]{border:1px solid #f56040}[color=instagramyellow]{color:#ffdc80}[bgcolor=instagramyellow],[hcolor=instagramyellow]:hover{background-color:#ffdc80}[border=instagramyellow]{border:1px solid #ffdc80}[color=linkedin]{color:#2c67bc}[bgcolor=linkedin],[hcolor=linkedin]:hover{background-color:#2c67bc}[border=linkedin]{border:1px solid #2c67bc}[color=twitter]{color:#55acee}[bgcolor=twitter],[hcolor=twitter]:hover{background-color:#55acee}[border=twitter]{border:1px solid #55acee}[color=youtube]{color:red}[bgcolor=youtube],[hcolor=youtube]:hover{background-color:red}[border=youtube]{border:1px solid red}[color=blood-orange]{color:#ff4d00}[bgcolor=blood-orange],[hcolor=blood-orange]:hover{background-color:#ff4d00}[border=blood-orange]{border:1px solid #ff4d00}[color=pinkish-orange]{color:#ff7b49}[bgcolor=pinkish-orange],[hcolor=pinkish-orange]:hover{background-color:#ff7b49}[border=pinkish-orange]{border:1px solid #ff7b49}[color=charcoal-grey]{color:#2a2f34}[bgcolor=charcoal-grey],[hcolor=charcoal-grey]:hover{background-color:#2a2f34}[border=charcoal-grey]{border:1px solid #2a2f34}[color=azure]{color:#00aeef}[bgcolor=azure],[hcolor=azure]:hover{background-color:#00aeef}[border=azure]{border:1px solid #00aeef}[color=light-azure]{color:#eaf5fd}[bgcolor=light-azure],[hcolor=light-azure]:hover{background-color:#eaf5fd}[border=light-azure]{border:1px solid #eaf5fd}[color=blue-grey]{color:#8d98a9}[bgcolor=blue-grey],[hcolor=blue-grey]:hover{background-color:#8d98a9}[border=blue-grey]{border:1px solid #8d98a9}[color=silver]{color:#ced0da}[bgcolor=silver],[hcolor=silver]:hover{background-color:#ced0da}[border=silver]{border:1px solid #ced0da}[color=pale-grey]{color:#dfe3e9}[bgcolor=pale-grey],[hcolor=pale-grey]:hover{background-color:#dfe3e9}[border=pale-grey]{border:1px solid #dfe3e9}[color=grey-white]{color:#f5f7f8}[bgcolor=grey-white],[hcolor=grey-white]:hover{background-color:#f5f7f8}[border=grey-white]{border:1px solid #f5f7f8}[color=cool-grey]{color:#b4bbc6}[bgcolor=cool-grey],[hcolor=cool-grey]:hover{background-color:#b4bbc6}[border=cool-grey]{border:1px solid #b4bbc6}[color=black]{color:#344563}[bgcolor=black],[hcolor=black]:hover{background-color:#344563}[border=black]{border:1px solid #344563}[color=grey-blue]{color:#68768c}[bgcolor=grey-blue],[hcolor=grey-blue]:hover{background-color:#68768c}[border=grey-blue]{border:1px solid #68768c}[color=strawberry]{color:#f4282d}[bgcolor=strawberry],[hcolor=strawberry]:hover{background-color:#f4282d}[border=strawberry]{border:1px solid #f4282d}[color=light-strawberry]{color:#f8eded}[bgcolor=light-strawberry],[hcolor=light-strawberry]:hover{background-color:#f8eded}[border=light-strawberry]{border:1px solid #f8eded}[color=white]{color:#fff}[bgcolor=white],[hcolor=white]:hover{background-color:#fff}[border=white]{border:1px solid #fff}[color=cool-green]{color:#33c15d}[bgcolor=cool-green],[hcolor=cool-green]:hover{background-color:#33c15d}[border=cool-green]{border:1px solid #33c15d}[color=light-green]{color:#ebfaef}[bgcolor=light-green],[hcolor=light-green]:hover{background-color:#ebfaef}[border=light-green]{border:1px solid #ebfaef}[color=transparent]{color:#0000}[bgcolor=transparent],[hcolor=transparent]:hover{background-color:initial}[border=transparent]{border:1px solid #0000}[color=c0]{color:#a566a5}[bgcolor=c0],[hcolor=c0]:hover{background-color:#a566a5}[border=c0]{border:1px solid #a566a5}[color=c1]{color:#c7ab82}[bgcolor=c1],[hcolor=c1]:hover{background-color:#c7ab82}[border=c1]{border:1px solid #c7ab82}[color=c2]{color:#f2713c}[bgcolor=c2],[hcolor=c2]:hover{background-color:#f2713c}[border=c2]{border:1px solid #f2713c}[color=c3]{color:#ffd006}[bgcolor=c3],[hcolor=c3]:hover{background-color:#ffd006}[border=c3]{border:1px solid #ffd006}[color=c4]{color:#94c5aa}[bgcolor=c4],[hcolor=c4]:hover{background-color:#94c5aa}[border=c4]{border:1px solid #94c5aa}[color=c5]{color:#2a9d8f}[bgcolor=c5],[hcolor=c5]:hover{background-color:#2a9d8f}[border=c5]{border:1px solid #2a9d8f}[color=c6]{color:#78acd8}[bgcolor=c6],[hcolor=c6]:hover{background-color:#78acd8}[border=c6]{border:1px solid #78acd8}[color=c7]{color:#525a9e}[bgcolor=c7],[hcolor=c7]:hover{background-color:#525a9e}[border=c7]{border:1px solid #525a9e}[color=c8]{color:#6a2459}[bgcolor=c8],[hcolor=c8]:hover{background-color:#6a2459}[border=c8]{border:1px solid #6a2459}[color=c9]{color:#74729e}[bgcolor=c9],[hcolor=c9]:hover{background-color:#74729e}[border=c9]{border:1px solid #74729e}.try-popup{background-color:#fff;border-radius:8px;bottom:16px;box-shadow:0 8px 14px 0 #e0e5ee80;height:92px;padding:24px 10px;position:fixed;right:16px;width:336px;z-index:10}.close-button{position:absolute;right:1px;top:0;background:#0000}.agorapulse-logo{height:28px}.button-container{text-align:end;margin-top:30px}"]
-            },] }
-];
-TryPopupComponent.propDecorators = {
-    texts: [{ type: Input }],
-    trialUrl: [{ type: Input }],
-    trialClicked: [{ type: Output }],
-    closeClicked: [{ type: Output }]
-};
-
-class TagsSelectorComponent {
-    constructor() {
-        this.INFINITY = Number.MAX_SAFE_INTEGER;
-        this.addTagEnabled = true;
-        this.disabled = false;
-        this.initialTags = [];
-        this.loadingOnSearch = true;
-        this.multipleEnabled = true;
-        this.selectTags = new EventEmitter();
-        this.searchErrorMessage = new EventEmitter();
-        this.tags = [];
-        this.tagsInput$ = new Subject();
-        this.tagsLoading = false;
-    }
-    ngOnInit() {
-        this.tags = this.initialTags;
-        this.setSearchFunction();
-    }
-    ngOnChanges(changes) {
-        var _a;
-        if ((_a = changes === null || changes === void 0 ? void 0 : changes.initialTags) === null || _a === void 0 ? void 0 : _a.currentValue) {
-            this.tags = this.initialTags;
-        }
-    }
-    onAdd() {
-        this.tags$ = of([]);
-        this.setSearchFunction();
-    }
-    onOpen() {
-        this.tagsInput$.next('');
-    }
-    onTagsChange() {
-        this.selectTags.emit(this.tags);
-    }
-    setSearchFunction() {
-        this.tags$ = this.tagsInput$.pipe(debounceTime(this.loadingOnSearch ? 400 : 0), distinctUntilChanged(), tap(() => {
-            this.tagsLoading = true;
-        }), switchMap((term) => this.searchTagsFunction(term).pipe(catchError((response) => {
-            this.searchErrorMessage.emit(response.error ? response.error.message : 'Error');
-            return [];
-        }), map(response => {
-            this.tagsLoading = false;
-            if (!response || Object.keys(response).length == 0) {
-                return [];
-            }
-            return response;
-        }))));
-    }
-}
-TagsSelectorComponent.decorators = [
-    { type: Component, args: [{
-                selector: 'ap-tags-selector',
-                template: "<!-- @JRA [multiple]=\"false\" break the component display and behavior, we use [maxSelectedItems]=\"1\" as efficient workaround -->\n<ng-select class=\"tags-select\"\n           [disabled]=\"disabled\"\n           [addTag]=\"addTagEnabled\"\n           [maxSelectedItems]=\"multipleEnabled ? INFINITY : 1\"\n           [multiple]=\"true\"\n           [hideSelected]=\"true\"\n           [placeholder]=\"labels.placeholder\"\n           [loading]=\"tagsLoading\"\n           [items]=\"tags$ | async\"\n           [typeahead]=\"tagsInput$\"\n           [minTermLength]=\"0\"\n           [clearable]=\"false\"\n           [(ngModel)]=\"tags\"\n           (open)=\"onOpen()\"\n           (change)=\"onTagsChange()\"\n           (add)=\"onAdd()\"\n           appendTo=\"body\">\n    <ng-template ng-multi-label-tmp let-items=\"items\" let-clear=\"clear\">\n        <div class=\"tag-item\" *ngFor=\"let item of items\">\n            <div class=\"selected-tag\">\n                <div class=\"selected-tag-label\">{{item}}</div>\n                <div class=\"selected-tag-cross-container\" *ngIf=\"!disabled\" (click)=\"clear(item)\">\n                    <ap-symbol class=\"selected-tag-cross\"\n                               [symbolId]=\"'remove-bold'\"\n                               [size]=\"'pico'\"\n                    ></ap-symbol>\n                </div>\n            </div>\n        </div>\n    </ng-template>\n    <ng-template ng-option-tmp let-item=\"item\" let-index=\"index\" let-search=\"searchTerm\">\n        <div *ngIf=\"search\"><b>{{item.substring(0, search.length)}}</b>{{item.substring(search.length, item.length)}}</div>\n        <div *ngIf=\"!search\">{{item}}</div>\n    </ng-template>\n    <ng-template ng-tag-tmp let-item=\"item\" let-index=\"index\" let-search=\"searchTerm\">\n        <div class=\"add-tag\">\n            <ap-symbol class=\"add-tag-icon\"\n                       [symbolId]=\"'add-circle-bold-alternate'\"\n                       [size]=\"'micro'\"\n            ></ap-symbol>\n            <div class=\"add-tag-preview\">{{labels.createTag}} \"{{search}}\"</div>\n        </div>\n    </ng-template>\n</ng-select>\n",
-                styles: ["[color=facebook]{color:#1877f2}[bgcolor=facebook],[hcolor=facebook]:hover{background-color:#1877f2}[border=facebook]{border:1px solid #1877f2}[color=google]{color:#4e85e8}[bgcolor=google],[hcolor=google]:hover{background-color:#4e85e8}[border=google]{border:1px solid #4e85e8}[color=instagram]{color:#e1306c}[bgcolor=instagram],[hcolor=instagram]:hover{background-color:#e1306c}[border=instagram]{border:1px solid #e1306c}[color=instagrammagenta]{color:#c13584}[bgcolor=instagrammagenta],[hcolor=instagrammagenta]:hover{background-color:#c13584}[border=instagrammagenta]{border:1px solid #c13584}[color=instagramblue]{color:#5851db}[bgcolor=instagramblue],[hcolor=instagramblue]:hover{background-color:#5851db}[border=instagramblue]{border:1px solid #5851db}[color=instagrampurple]{color:#833ab4}[bgcolor=instagrampurple],[hcolor=instagrampurple]:hover{background-color:#833ab4}[border=instagrampurple]{border:1px solid #833ab4}[color=instagramorange]{color:#f56040}[bgcolor=instagramorange],[hcolor=instagramorange]:hover{background-color:#f56040}[border=instagramorange]{border:1px solid #f56040}[color=instagramyellow]{color:#ffdc80}[bgcolor=instagramyellow],[hcolor=instagramyellow]:hover{background-color:#ffdc80}[border=instagramyellow]{border:1px solid #ffdc80}[color=linkedin]{color:#2c67bc}[bgcolor=linkedin],[hcolor=linkedin]:hover{background-color:#2c67bc}[border=linkedin]{border:1px solid #2c67bc}[color=twitter]{color:#55acee}[bgcolor=twitter],[hcolor=twitter]:hover{background-color:#55acee}[border=twitter]{border:1px solid #55acee}[color=youtube]{color:red}[bgcolor=youtube],[hcolor=youtube]:hover{background-color:red}[border=youtube]{border:1px solid red}[color=blood-orange]{color:#ff4d00}[bgcolor=blood-orange],[hcolor=blood-orange]:hover{background-color:#ff4d00}[border=blood-orange]{border:1px solid #ff4d00}[color=pinkish-orange]{color:#ff7b49}[bgcolor=pinkish-orange],[hcolor=pinkish-orange]:hover{background-color:#ff7b49}[border=pinkish-orange]{border:1px solid #ff7b49}[color=charcoal-grey]{color:#2a2f34}[bgcolor=charcoal-grey],[hcolor=charcoal-grey]:hover{background-color:#2a2f34}[border=charcoal-grey]{border:1px solid #2a2f34}[color=azure]{color:#00aeef}[bgcolor=azure],[hcolor=azure]:hover{background-color:#00aeef}[border=azure]{border:1px solid #00aeef}[color=light-azure]{color:#eaf5fd}[bgcolor=light-azure],[hcolor=light-azure]:hover{background-color:#eaf5fd}[border=light-azure]{border:1px solid #eaf5fd}[color=blue-grey]{color:#8d98a9}[bgcolor=blue-grey],[hcolor=blue-grey]:hover{background-color:#8d98a9}[border=blue-grey]{border:1px solid #8d98a9}[color=silver]{color:#ced0da}[bgcolor=silver],[hcolor=silver]:hover{background-color:#ced0da}[border=silver]{border:1px solid #ced0da}[color=pale-grey]{color:#dfe3e9}[bgcolor=pale-grey],[hcolor=pale-grey]:hover{background-color:#dfe3e9}[border=pale-grey]{border:1px solid #dfe3e9}[color=grey-white]{color:#f5f7f8}[bgcolor=grey-white],[hcolor=grey-white]:hover{background-color:#f5f7f8}[border=grey-white]{border:1px solid #f5f7f8}[color=cool-grey]{color:#b4bbc6}[bgcolor=cool-grey],[hcolor=cool-grey]:hover{background-color:#b4bbc6}[border=cool-grey]{border:1px solid #b4bbc6}[color=black]{color:#344563}[bgcolor=black],[hcolor=black]:hover{background-color:#344563}[border=black]{border:1px solid #344563}[color=grey-blue]{color:#68768c}[bgcolor=grey-blue],[hcolor=grey-blue]:hover{background-color:#68768c}[border=grey-blue]{border:1px solid #68768c}[color=strawberry]{color:#f4282d}[bgcolor=strawberry],[hcolor=strawberry]:hover{background-color:#f4282d}[border=strawberry]{border:1px solid #f4282d}[color=light-strawberry]{color:#f8eded}[bgcolor=light-strawberry],[hcolor=light-strawberry]:hover{background-color:#f8eded}[border=light-strawberry]{border:1px solid #f8eded}[color=white]{color:#fff}[bgcolor=white],[hcolor=white]:hover{background-color:#fff}[border=white]{border:1px solid #fff}[color=cool-green]{color:#33c15d}[bgcolor=cool-green],[hcolor=cool-green]:hover{background-color:#33c15d}[border=cool-green]{border:1px solid #33c15d}[color=light-green]{color:#ebfaef}[bgcolor=light-green],[hcolor=light-green]:hover{background-color:#ebfaef}[border=light-green]{border:1px solid #ebfaef}[color=transparent]{color:#0000}[bgcolor=transparent],[hcolor=transparent]:hover{background-color:initial}[border=transparent]{border:1px solid #0000}[color=c0]{color:#a566a5}[bgcolor=c0],[hcolor=c0]:hover{background-color:#a566a5}[border=c0]{border:1px solid #a566a5}[color=c1]{color:#c7ab82}[bgcolor=c1],[hcolor=c1]:hover{background-color:#c7ab82}[border=c1]{border:1px solid #c7ab82}[color=c2]{color:#f2713c}[bgcolor=c2],[hcolor=c2]:hover{background-color:#f2713c}[border=c2]{border:1px solid #f2713c}[color=c3]{color:#ffd006}[bgcolor=c3],[hcolor=c3]:hover{background-color:#ffd006}[border=c3]{border:1px solid #ffd006}[color=c4]{color:#94c5aa}[bgcolor=c4],[hcolor=c4]:hover{background-color:#94c5aa}[border=c4]{border:1px solid #94c5aa}[color=c5]{color:#2a9d8f}[bgcolor=c5],[hcolor=c5]:hover{background-color:#2a9d8f}[border=c5]{border:1px solid #2a9d8f}[color=c6]{color:#78acd8}[bgcolor=c6],[hcolor=c6]:hover{background-color:#78acd8}[border=c6]{border:1px solid #78acd8}[color=c7]{color:#525a9e}[bgcolor=c7],[hcolor=c7]:hover{background-color:#525a9e}[border=c7]{border:1px solid #525a9e}[color=c8]{color:#6a2459}[bgcolor=c8],[hcolor=c8]:hover{background-color:#6a2459}[border=c8]{border:1px solid #6a2459}[color=c9]{color:#74729e}[bgcolor=c9],[hcolor=c9]:hover{background-color:#74729e}[border=c9]{border:1px solid #74729e}:host{max-width:260px;display:flex}.tags-select{width:260px}.tags-select .tag-item{max-width:228px}.tags-select .tag-item .selected-tag{border-radius:100px;background-color:#e8f4ff;padding-left:8px;margin-bottom:4px;margin-right:4px;display:flex;align-items:center}.tags-select .tag-item .selected-tag .selected-tag-label{padding-right:4px;color:#344563;display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.tags-select .tag-item .selected-tag .selected-tag-cross-container{width:20px;height:20px;border-radius:100px;display:flex;align-items:center;justify-content:center;margin:2px;cursor:pointer}.tags-select .tag-item .selected-tag .selected-tag-cross-container:hover{background-color:#d1e8ff}.tags-select .tag-item .selected-tag .selected-tag-cross-container:hover ::ng-deep ap-symbol *{color:#178dfe}.tags-select .tag-item .selected-tag .selected-tag-cross-container ::ng-deep .selected-tag-cross *{color:#858fa1}::ng-deep .tags-select.ng-select .ng-select-container .ng-value-container{overflow-y:auto;overflow-x:hidden;max-height:64px;padding-left:6px!important}.ng-option ap-symbol{color:#858fa1}.add-tag{display:flex;align-items:center}.add-tag .add-tag-icon{padding-right:8px}.add-tag-preview{text-overflow:ellipsis;display:block;white-space:nowrap;overflow:hidden}"]
-            },] }
-];
-/** @nocollapse */
-TagsSelectorComponent.ctorParameters = () => [];
-TagsSelectorComponent.propDecorators = {
-    addTagEnabled: [{ type: Input }],
-    disabled: [{ type: Input }],
-    initialTags: [{ type: Input }],
-    labels: [{ type: Input }],
-    loadingOnSearch: [{ type: Input }],
-    multipleEnabled: [{ type: Input }],
-    searchTagsFunction: [{ type: Input }],
-    selectTags: [{ type: Output }],
-    searchErrorMessage: [{ type: Output }]
-};
-
-var TimeFormat;
-(function (TimeFormat) {
-    TimeFormat["Meridian"] = "Meridian";
-    TimeFormat["Default"] = "Default";
-})(TimeFormat || (TimeFormat = {}));
-class TimepickerComponent {
-    constructor(changeDetectorRef, overlayContainer, renderer) {
-        this.changeDetectorRef = changeDetectorRef;
-        this.overlayContainer = overlayContainer;
-        this.renderer = renderer;
-        this.disabled = false;
-        this.format = TimeFormat.Default;
-        this.invalid = false;
-        this.period = 15;
-        this.placement = 'bottom';
-        this.timeModelChange = new EventEmitter();
-        this.closeMenu = false;
-        this.openedMenu = false;
-        this.position = null;
-        this.previousTime = null;
-        this.TimeFormat = TimeFormat;
-        this.timeFormat12 = /(^[01]?\d)(:)([0-5]\d)(am|pm)+?$/i;
-        this.timeFormat12anySeparator = /(^[01]?\d)([^0-9])([0-5]\d)(am|pm)+?$/i;
-        this.timeFormat12WithoutMinute = /(^[01]?\d)(am|pm)+?$/i;
-        this.timeFormat24 = /^([01]?[0-9]|2[0-3]):[0-5][0-9]$/;
-        this.timeFormat24anySeparator = /^([01]?[0-9]|2[0-3])([^0-9])([0-5][0-9])$/;
-        this.times = [];
-        this.validated = false;
-        this.listFocus = false;
-        this.validationStarted = false;
-        const disableAnimations = true;
-        // get overlay container to set property that disables animations
-        const overlayContainerElement = this.overlayContainer.getContainerElement();
-        // angular animations renderer hooks up the logic to disable animations into setProperty
-        this.renderer.setProperty(overlayContainerElement, "@.disabled", disableAnimations);
-    }
-    ngOnInit() {
-        this.generateTimeSlots();
-    }
-    ngOnChanges(changes) {
-        this.generateTimeSlots();
-        if (changes.placement && changes.placement.currentValue) {
-            if (changes.placement.currentValue === 'top') {
-                this.position = {
-                    top: 179,
-                    left: this.inputBox.nativeElement.getBoundingClientRect().left
-                };
-            }
-            else {
-                this.position = { top: this.inputBox.nativeElement.getBoundingClientRect().top +
-                        this.inputBox.nativeElement.getBoundingClientRect().height,
-                    left: this.inputBox.nativeElement.getBoundingClientRect().left };
-            }
-            setTimeout(() => {
-                this.changeDetectorRef.markForCheck();
-            }, 200);
-        }
-    }
-    emitChanges() {
-        const time24Format = this.format === TimeFormat.Default ? this.timeModel : TimepickerComponent.convert12To24(this.timeModel);
-        const time = {
-            hours: this.getHoursFrom24(time24Format),
-            minutes: this.getMinutesFrom24(time24Format),
-            best: false,
-        };
-        this.timeModelChange.emit(time);
-        this.closeMenu = true;
-        this.changeDetectorRef.detectChanges();
-        this.inputBox.nativeElement.focus();
-    }
-    getHoursFrom24(time24Format) {
-        return +(time24Format.split(':')[0]);
-    }
-    getMinutesFrom24(time24Format) {
-        return +(time24Format.split(':')[1]);
-    }
-    generateTimeSlots() {
-        this.changeDetectorRef.detectChanges();
-        this.times = Object.assign([], []);
-        if (!this.timeModel) {
-            this.timeModel = moment().format('HH:mm');
-        }
-        if (this.format === TimeFormat.Meridian) {
-            if (!this.timeModel.includes('am') && !this.timeModel.includes('pm')) {
-                this.timeModel = TimepickerComponent.convert24To12(this.timeModel);
-            }
-        }
-        else {
-            if (this.timeModel.includes('am') || this.timeModel.includes('pm')) {
-                this.timeModel = TimepickerComponent.convert12To24(this.timeModel);
-            }
-        }
-        for (let i = 0; i < 24; i++) {
-            let hour = i;
-            let meridian = '';
-            if (this.format === TimeFormat.Meridian) {
-                meridian = 'am';
-                if (hour >= 12) {
-                    meridian = 'pm';
-                    if (hour > 12) {
-                        hour = hour - 12;
-                    }
-                }
-                if (hour === 0) {
-                    hour = 12;
-                }
-            }
-            for (let j = 0; j < 60; j += this.period) {
-                const time = hour + ':' + TimepickerComponent.toFixed(j, 10) + meridian;
-                this.times = [...this.times, time];
-            }
-        }
-        if (!this.timeModel) {
-            this.timeModel = moment().format('HH:mm');
-            if (this.format === TimeFormat.Meridian) {
-                this.timeModel = moment().format('hh:mma');
-            }
-        }
-        this.changeDetectorRef.detectChanges();
-    }
-    focusOnList(focusEnabled) {
-        this.listFocus = focusEnabled;
-    }
-    onMenuClosed() {
-        this.closeMenu = true;
-        this.openedMenu = false;
-        this.listFocus = false;
-        if (!this.validationStarted) {
-            this.validate(this.timeModel);
-        }
-        this.viewPort.setRenderedContentOffset(0);
-        this.viewPort.scrollToIndex(0);
-        this.validated = false;
-        this.validationStarted = false;
-    }
-    onModelChange(time) {
-        this.timeActive = null;
-        if (!this.validated) {
-            for (let i = 0; i < this.times.length; i++) {
-                const checkTime = this.checkTime(time, this.times[i]);
-                if (checkTime.match) {
-                    this.scrollToIndex(i);
-                    if (checkTime.exactMatch) {
-                        this.timeActive = i;
-                    }
-                    break;
-                }
-            }
-        }
-        this.validated = false;
-    }
-    openTimePicker() {
-        this.previousTime = this.timeModel;
-        this.closeMenu = false;
-        if (this.placement === 'top') {
-            this.position = {
-                top: 179,
-                left: this.inputBox.nativeElement.getBoundingClientRect().left
-            };
-        }
-        else {
-            this.position = { top: (this.inputBox.nativeElement.getBoundingClientRect().top - 1),
-                left: this.inputBox.nativeElement.getBoundingClientRect().left };
-        }
-        if (!this.openedMenu && !this.validated) {
-            this.openedMenu = true;
-            setTimeout(() => {
-                var _a, _b;
-                this.onModelChange(this.timeModel);
-                (_a = this.inputTime) === null || _a === void 0 ? void 0 : _a.nativeElement.focus();
-                (_b = this.inputTime) === null || _b === void 0 ? void 0 : _b.nativeElement.select();
-            }, 50);
-        }
-        this.validated = false;
-        return false;
-    }
-    selectTime(time) {
-        this.timeModel = time;
-        this.emitChanges();
-    }
-    validate(time) {
-        this.validationStarted = true;
-        if (!this.listFocus) {
-            if (this.timeFormat24anySeparator.test(time)) {
-                time = time.replace(this.timeFormat24anySeparator, '$1:$3');
-            }
-            else if (this.timeFormat12anySeparator.test(time)) {
-                time = time.replace(this.timeFormat12anySeparator, '$1:$3$4');
-            }
-            this.validated = true;
-            let timeFound = false;
-            for (let i = 0; i < this.times.length; i++) {
-                const checkTime = this.checkTime(time, this.times[i]);
-                if (checkTime.match && checkTime.exactMatch) {
-                    this.selectTime(this.times[i]);
-                    timeFound = true;
-                    break;
-                }
-            }
-            if (!timeFound) {
-                let validTime;
-                if (this.format === TimeFormat.Meridian) {
-                    validTime = this.timeFormat12.test(time);
-                    if (!validTime) {
-                        validTime = this.timeFormat24.test(time);
-                        if (validTime) {
-                            time = TimepickerComponent.convert24To12(time);
-                        }
-                        else {
-                            validTime = this.timeFormat12WithoutMinute.test(time);
-                            if (validTime) {
-                                time = time.replace(this.timeFormat12WithoutMinute, '$1:00$2');
-                            }
-                        }
-                    }
-                }
-                else {
-                    validTime = this.timeFormat24.test(time);
-                    if (!validTime) {
-                        validTime = this.timeFormat12.test(time);
-                        if (validTime) {
-                            time = TimepickerComponent.convert12To24(time);
-                        }
-                    }
-                }
-                if (validTime) {
-                    this.selectTime(time);
-                }
-                else {
-                    this.selectTime(this.previousTime);
-                }
-            }
-        }
-    }
-    scrollToIndex(i) {
-        this.viewPort.scrollToIndex(i, 'smooth');
-    }
-    static formatTime(time, format) {
-        let timeString = `${time.hours}` + ':' + `${time.minutes}`.padStart(2, '0');
-        if (format === TimeFormat.Meridian) {
-            timeString = TimepickerComponent.convert24To12(timeString);
-        }
-        return timeString;
-    }
-    checkTime(term, termToMatch) {
-        var _a;
-        let exactMatch = true;
-        if (this.timeFormat24anySeparator.test(term)) {
-            term = term.replace(this.timeFormat24anySeparator, '$1:$3');
-        }
-        else if (this.timeFormat12anySeparator.test(term)) {
-            term = term.replace(this.timeFormat12anySeparator, '$1:$3$4');
-        }
-        if (term === '') {
-            return { match: false, exactMatch: false };
-        }
-        const terms = term.split(':');
-        if ((!isNaN(parseInt(terms[0]))) && ((_a = terms[1]) === null || _a === void 0 ? void 0 : _a.length) >= 2 && !isNaN(parseInt(terms[1].substring(0, 2)))) {
-            const hour = parseInt(terms[0]);
-            let newHour = hour;
-            let newMinutes = terms[1].substring(0, 2);
-            const minutes = parseInt(newMinutes);
-            if (minutes !== 0) {
-                if (minutes <= 15) {
-                    newMinutes = '15';
-                }
-                else if (minutes <= 30) {
-                    newMinutes = '30';
-                }
-                else if (minutes <= 45) {
-                    newMinutes = '45';
-                }
-                else {
-                    newHour += 1;
-                    newMinutes = '00';
-                }
-            }
-            if (parseInt(newMinutes) !== minutes || newHour !== hour) {
-                exactMatch = false;
-            }
-            term = newHour + ':' + newMinutes + terms[1].substring(2, terms[1].length);
-        }
-        let meridian = '';
-        if (this.format === TimeFormat.Meridian) {
-            if (terms[0]) {
-                if (!isNaN(parseInt(terms[0]))) {
-                    let hour = parseInt(terms[0]);
-                    if (hour > 12) {
-                        hour = hour - 12;
-                        term = hour + ':' + (terms[1] ? terms[1].substring(0, 2) : '00');
-                        meridian = 'pm';
-                    }
-                    if (!term.endsWith('am') && !term.endsWith('pm')) {
-                        term += meridian;
-                    }
-                }
-            }
-            if (this.timeFormat12WithoutMinute.test(term)) {
-                term = term.substring(0, term.length - 2) + ':00' + term.substring(term.length - 2, term.length);
-            }
-        }
-        return { match: termToMatch.startsWith(term), exactMatch };
-    }
-    static convert12To24(time) {
-        const terms = time.split(':');
-        const minutes = terms[1].substring(0, 2);
-        const meridian = terms[1].substring(2, 4);
-        let hour = parseInt(terms[0]);
-        if (!isNaN(parseInt(terms[0]))) {
-            if (meridian === 'pm' && hour < 12) {
-                hour = hour + 12;
-            }
-            if (meridian === 'am' && hour === 12) {
-                hour = 0;
-            }
-        }
-        return hour + ':' + minutes;
-    }
-    static convert24To12(time) {
-        const terms = time.split(':');
-        let meridian = 'am';
-        let hour = parseInt(terms[0]);
-        if (!isNaN(parseInt(terms[0]))) {
-            if (hour >= 12) {
-                meridian = 'pm';
-                if (hour > 12) {
-                    hour = hour - 12;
-                }
-            }
-            if (hour === 0) {
-                hour = 12;
-            }
-        }
-        return hour + ':' + terms[1] + meridian;
-    }
-    static toFixed(num, fix) {
-        let fixedNum = num;
-        if (num < fix) {
-            fixedNum = '0' + fixedNum;
-        }
-        return fixedNum;
-    }
-}
-TimepickerComponent.decorators = [
-    { type: Component, args: [{
-                changeDetection: ChangeDetectionStrategy.OnPush,
-                selector: 'ap-timepicker',
-                template: "<div class=\"display-flex\" [class.meridian]=\"format === TimeFormat.Meridian\">\n    <ng-template #timeOptionsTemplate >\n        <input #inputTime\n               *ngIf=\"placement == 'bottom'\"\n               class=\"time-input menu\"\n               type=\"text\"\n               [(ngModel)]=\"timeModel\"\n               (ngModelChange)=\"onModelChange($event)\"\n               (blur)=\"validate($event?.target?.value)\"\n               (keydown.enter)=\"validate($event?.target?.value)\"\n               (mouseenter)=\"focusOnList(false)\">\n        <div class=\"time-options-container {{placement}}\"\n             (mouseenter)=\"focusOnList(true)\"\n             (mouseleave)=\"focusOnList(false)\">\n            <cdk-virtual-scroll-viewport style=\"height: 100%\" itemSize=\"33\" class=\"scroll\" minBufferPx=\"200\" maxBufferPx=\"200\" autofocus>\n                <div style=\"visibility: hidden;max-height: 0\">\u20AC</div>\n                <div *cdkVirtualFor=\"let item of times;let i = index\"  (click)=\"selectTime(item)\" id=\"_apTime_{{i}}\" class=\"time-line\" [class.selected]=\"timeActive === i\">\n                    <span class=\"hour\">{{item}}</span>\n                </div>\n            </cdk-virtual-scroll-viewport>\n        </div>\n        <input #inputTime\n               *ngIf=\"placement == 'top'\"\n               class=\"time-input menu\"\n               type=\"text\"\n               [(ngModel)]=\"timeModel\"\n               (ngModelChange)=\"onModelChange($event)\"\n               (blur)=\"validate($event?.target?.value)\"\n               (keydown.enter)=\"validate($event?.target?.value)\"\n               (mouseenter)=\"focusOnList(false)\">\n\n    </ng-template>\n\n    <input #inputBox\n           class=\"time-input\"\n           [ngClass]=\"{'invalid': invalid}\"\n           type=\"text\"\n           [(ngModel)]=\"timeModel\"\n           (click)=\"openTimePicker()\"\n           [disabled]=\"disabled\"\n           [apPopmenu]=\"timeOptionsTemplate\"\n           [apTooltipNeo]=\"{content: invalidationMessage, display: invalidationMessage && invalid}\"\n           [shadow]=\"false\"\n           [apPopmenuBorder]=\"false\"\n           [apPopmenuBackground]=\"false\"\n           [hasBackdrop]=\"true\"\n           [close]=\"closeMenu\"\n           [pointer]=\"true\"\n           [position]=\"position\"\n           [placement]=\"placement\"\n           [rounded]=\"true\"\n           (menuClosed)=\"onMenuClosed()\"\n           placement=\"bottom right\"\n           color=\"secondary\"\n           readonly>\n\n</div>\n",
-                styles: ["[color=facebook]{color:#1877f2}[bgcolor=facebook],[hcolor=facebook]:hover{background-color:#1877f2}[border=facebook]{border:1px solid #1877f2}[color=google]{color:#4e85e8}[bgcolor=google],[hcolor=google]:hover{background-color:#4e85e8}[border=google]{border:1px solid #4e85e8}[color=instagram]{color:#e1306c}[bgcolor=instagram],[hcolor=instagram]:hover{background-color:#e1306c}[border=instagram]{border:1px solid #e1306c}[color=instagrammagenta]{color:#c13584}[bgcolor=instagrammagenta],[hcolor=instagrammagenta]:hover{background-color:#c13584}[border=instagrammagenta]{border:1px solid #c13584}[color=instagramblue]{color:#5851db}[bgcolor=instagramblue],[hcolor=instagramblue]:hover{background-color:#5851db}[border=instagramblue]{border:1px solid #5851db}[color=instagrampurple]{color:#833ab4}[bgcolor=instagrampurple],[hcolor=instagrampurple]:hover{background-color:#833ab4}[border=instagrampurple]{border:1px solid #833ab4}[color=instagramorange]{color:#f56040}[bgcolor=instagramorange],[hcolor=instagramorange]:hover{background-color:#f56040}[border=instagramorange]{border:1px solid #f56040}[color=instagramyellow]{color:#ffdc80}[bgcolor=instagramyellow],[hcolor=instagramyellow]:hover{background-color:#ffdc80}[border=instagramyellow]{border:1px solid #ffdc80}[color=linkedin]{color:#2c67bc}[bgcolor=linkedin],[hcolor=linkedin]:hover{background-color:#2c67bc}[border=linkedin]{border:1px solid #2c67bc}[color=twitter]{color:#55acee}[bgcolor=twitter],[hcolor=twitter]:hover{background-color:#55acee}[border=twitter]{border:1px solid #55acee}[color=youtube]{color:red}[bgcolor=youtube],[hcolor=youtube]:hover{background-color:red}[border=youtube]{border:1px solid red}[color=blood-orange]{color:#ff4d00}[bgcolor=blood-orange],[hcolor=blood-orange]:hover{background-color:#ff4d00}[border=blood-orange]{border:1px solid #ff4d00}[color=pinkish-orange]{color:#ff7b49}[bgcolor=pinkish-orange],[hcolor=pinkish-orange]:hover{background-color:#ff7b49}[border=pinkish-orange]{border:1px solid #ff7b49}[color=charcoal-grey]{color:#2a2f34}[bgcolor=charcoal-grey],[hcolor=charcoal-grey]:hover{background-color:#2a2f34}[border=charcoal-grey]{border:1px solid #2a2f34}[color=azure]{color:#00aeef}[bgcolor=azure],[hcolor=azure]:hover{background-color:#00aeef}[border=azure]{border:1px solid #00aeef}[color=light-azure]{color:#eaf5fd}[bgcolor=light-azure],[hcolor=light-azure]:hover{background-color:#eaf5fd}[border=light-azure]{border:1px solid #eaf5fd}[color=blue-grey]{color:#8d98a9}[bgcolor=blue-grey],[hcolor=blue-grey]:hover{background-color:#8d98a9}[border=blue-grey]{border:1px solid #8d98a9}[color=silver]{color:#ced0da}[bgcolor=silver],[hcolor=silver]:hover{background-color:#ced0da}[border=silver]{border:1px solid #ced0da}[color=pale-grey]{color:#dfe3e9}[bgcolor=pale-grey],[hcolor=pale-grey]:hover{background-color:#dfe3e9}[border=pale-grey]{border:1px solid #dfe3e9}[color=grey-white]{color:#f5f7f8}[bgcolor=grey-white],[hcolor=grey-white]:hover{background-color:#f5f7f8}[border=grey-white]{border:1px solid #f5f7f8}[color=cool-grey]{color:#b4bbc6}[bgcolor=cool-grey],[hcolor=cool-grey]:hover{background-color:#b4bbc6}[border=cool-grey]{border:1px solid #b4bbc6}[color=black]{color:#344563}[bgcolor=black],[hcolor=black]:hover{background-color:#344563}[border=black]{border:1px solid #344563}[color=grey-blue]{color:#68768c}[bgcolor=grey-blue],[hcolor=grey-blue]:hover{background-color:#68768c}[border=grey-blue]{border:1px solid #68768c}[color=strawberry]{color:#f4282d}[bgcolor=strawberry],[hcolor=strawberry]:hover{background-color:#f4282d}[border=strawberry]{border:1px solid #f4282d}[color=light-strawberry]{color:#f8eded}[bgcolor=light-strawberry],[hcolor=light-strawberry]:hover{background-color:#f8eded}[border=light-strawberry]{border:1px solid #f8eded}[color=white]{color:#fff}[bgcolor=white],[hcolor=white]:hover{background-color:#fff}[border=white]{border:1px solid #fff}[color=cool-green]{color:#33c15d}[bgcolor=cool-green],[hcolor=cool-green]:hover{background-color:#33c15d}[border=cool-green]{border:1px solid #33c15d}[color=light-green]{color:#ebfaef}[bgcolor=light-green],[hcolor=light-green]:hover{background-color:#ebfaef}[border=light-green]{border:1px solid #ebfaef}[color=transparent]{color:#0000}[bgcolor=transparent],[hcolor=transparent]:hover{background-color:initial}[border=transparent]{border:1px solid #0000}[color=c0]{color:#a566a5}[bgcolor=c0],[hcolor=c0]:hover{background-color:#a566a5}[border=c0]{border:1px solid #a566a5}[color=c1]{color:#c7ab82}[bgcolor=c1],[hcolor=c1]:hover{background-color:#c7ab82}[border=c1]{border:1px solid #c7ab82}[color=c2]{color:#f2713c}[bgcolor=c2],[hcolor=c2]:hover{background-color:#f2713c}[border=c2]{border:1px solid #f2713c}[color=c3]{color:#ffd006}[bgcolor=c3],[hcolor=c3]:hover{background-color:#ffd006}[border=c3]{border:1px solid #ffd006}[color=c4]{color:#94c5aa}[bgcolor=c4],[hcolor=c4]:hover{background-color:#94c5aa}[border=c4]{border:1px solid #94c5aa}[color=c5]{color:#2a9d8f}[bgcolor=c5],[hcolor=c5]:hover{background-color:#2a9d8f}[border=c5]{border:1px solid #2a9d8f}[color=c6]{color:#78acd8}[bgcolor=c6],[hcolor=c6]:hover{background-color:#78acd8}[border=c6]{border:1px solid #78acd8}[color=c7]{color:#525a9e}[bgcolor=c7],[hcolor=c7]:hover{background-color:#525a9e}[border=c7]{border:1px solid #525a9e}[color=c8]{color:#6a2459}[bgcolor=c8],[hcolor=c8]:hover{background-color:#6a2459}[border=c8]{border:1px solid #6a2459}[color=c9]{color:#74729e}[bgcolor=c9],[hcolor=c9]:hover{background-color:#74729e}[border=c9]{border:1px solid #74729e}.time-options-container{background-color:#fff;border-radius:4px;box-shadow:0 7px 50px #00000014;z-index:999999;pointer-events:all;height:173px;width:170px;overflow-y:hidden;text-align:left;color:#344563}.time-options-container.bottom{margin-top:5px}.time-options-container.top{margin-bottom:5px}.time-options-container .scroll{overflow-x:hidden}.time-options-container .time-line{height:33px;min-width:165px;cursor:pointer;display:flex;align-items:center}.time-options-container .time-line.selected,.time-options-container .time-line:hover{background-color:#e8f4ff!important;color:#178dfe}.time-options-container .time-line span{padding-left:16px}.hidden{display:none!important}.time-input{color:#344563;font-family:inherit;font-weight:400;height:36px;line-height:24px;margin:0;min-width:0;width:80px;outline:none;z-index:0;cursor:text;border-radius:4px;border:1px solid #d6dae0;text-align:center;padding:0}.time-input.invalid{border:1px solid #e81313;border-radius:4px}.time-input[disabled]{color:#aeb5c1}.time-input[disabled]:hover{cursor:auto!important}.time-input:hover:not([disabled]){cursor:text}.time-input.menu,.time-input:active:not([disabled]),.time-input:focus:not([disabled]){border:1px solid #178dfe}.time-input.menu.top{padding-bottom:0}"]
-            },] }
-];
-/** @nocollapse */
-TimepickerComponent.ctorParameters = () => [
-    { type: ChangeDetectorRef },
-    { type: OverlayContainer },
-    { type: Renderer2 }
-];
-TimepickerComponent.propDecorators = {
-    inputBox: [{ type: ViewChild, args: ['inputBox',] }],
-    inputTime: [{ type: ViewChild, args: ['inputTime',] }],
-    viewPort: [{ type: ViewChild, args: [CdkVirtualScrollViewport,] }],
-    disabled: [{ type: Input }],
-    format: [{ type: Input }],
-    invalid: [{ type: Input }],
-    invalidationMessage: [{ type: Input }],
-    period: [{ type: Input }],
-    placement: [{ type: Input }],
-    timeModel: [{ type: Input }],
-    timeModelChange: [{ type: Output }]
-};
-
-class NeoTimepickerComponent {
-    constructor(changeDetectorRef) {
-        this.changeDetectorRef = changeDetectorRef;
-        this.i18n = {
-            hourLabel: 'Hour',
-            minuteLabel: 'Minute',
-            meridianLabel: 'AM/PM',
-            doneLabel: 'Done',
-            cancelLabel: 'Cancel',
-        };
-        this.disabled = false;
-        this.format = TimeFormat.Default;
-        this.invalid = false;
-        this.placement = 'bottom';
-        this.timeModelChange = new EventEmitter();
-        this.meridians = ['AM', 'PM'];
-        this.imaskDefault = {
-            mask: 'HH:MM',
-            blocks: {
-                HH: {
-                    mask: IMask.MaskedRange,
-                    from: 0,
-                    to: 23,
-                    autofix: 'pad',
-                },
-                MM: {
-                    mask: IMask.MaskedRange,
-                    from: 0,
-                    to: 59,
-                    autofix: 'pad',
-                },
-            },
-        };
-        this.imaskMeridian = {
-            mask: 'HH:MM AMPM',
-            blocks: {
-                HH: {
-                    mask: IMask.MaskedRange,
-                    from: 1,
-                    to: 12,
-                    autofix: 'pad',
-                },
-                MM: {
-                    mask: IMask.MaskedRange,
-                    from: 0,
-                    to: 59,
-                    autofix: 'pad',
-                },
-                AMPM: {
-                    mask: IMask.MaskedEnum,
-                    enum: ['AM', 'PM']
-                }
-            },
-            lazy: false,
-            prepare: function (str) {
-                return str.toUpperCase();
-            },
-        };
-        this.ENTER_KEY = 'Enter';
-        this.ESCAPE_KEY = 'Escape';
-        this.FIX_NUMBER = 10;
-        this.HOURS_MAX = 24;
-        this.HOURS_MERIDIAN_MAX = 12;
-        this.MARGIN = 8;
-        this.MINUTES_MAX = 60;
-        this.TIME_OPTION_HEIGHT = 387;
-        this.TIME_PICKER_DEFAULT_WIDTH = 96;
-        this.TIME_PICKER_MERIDIAN_WIDTH = 152;
-        this.ROW_HEIGHT = 36;
-        this.hours = [];
-        this.minutes = [];
-        this.position = null;
-        this.TimeFormat = TimeFormat;
-    }
-    onKeypress(event) {
-        if (this.timepickerOpened) {
-            if (event.code === this.ENTER_KEY) {
-                this.onSaveSelection();
-            }
-            if (event.code === this.ESCAPE_KEY) {
-                this.onCancelSelection();
-            }
-        }
-    }
-    ngOnInit() {
-        this.generateTimeSlots();
-        this.onTimeModelChange();
-    }
-    ngOnChanges(changes) {
-        var _a, _b, _c;
-        this.generateTimeSlots();
-        if ((_a = changes.format) === null || _a === void 0 ? void 0 : _a.currentValue) {
-            this.timeFormat = this.format === TimeFormat.Default ? 'HH:mm' : 'hh:mm a';
-            if (this.format === TimeFormat.Default && this.meridians.some(meridian => { var _a; return (_a = this.timeModel) === null || _a === void 0 ? void 0 : _a.endsWith(meridian); })) {
-                this.timeModel = NeoTimepickerComponent.convert12To24(this.timeModel);
-            }
-            else if (this.format === TimeFormat.Meridian && this.meridians.every(meridian => { var _a; return !((_a = this.timeModel) === null || _a === void 0 ? void 0 : _a.endsWith(meridian)); })) {
-                this.timeModel = NeoTimepickerComponent.convert24To12(this.timeModel);
-            }
-            setTimeout(() => this.changeDetectorRef.markForCheck());
-        }
-        if ((_b = changes.placement) === null || _b === void 0 ? void 0 : _b.currentValue) {
-            this.updateTimePickerPosition();
-        }
-        if ((_c = changes.format) === null || _c === void 0 ? void 0 : _c.currentValue) {
-            this.updateTimePickerPosition();
-        }
-    }
-    onOpenTimepicker() {
-        this.destroy$ = new Subject();
-        this.previousValue = this.timeModel;
-        this.timepickerOpened = true;
-        this.timepickerClosed = false;
-        this.updateTimePickerPosition();
-        setTimeout(() => {
-            this.updateElementPosition('minute', this.selectedMinute, 'auto');
-            this.updateElementPosition('hour', this.selectedHour, 'auto');
-            this.updateElementPosition('meridian', this.selectedMeridian, 'auto');
-            this.inputBox.nativeElement.focus();
-            this.inputBox.nativeElement.select();
-        }, 1);
-        this.changeDetectorRef.markForCheck();
-    }
-    onTimepickerOpened() {
-        this.hoursScrollObserver$ = this.onObserveElementScroll(this.hourOptions.nativeElement);
-        this.minutesScrollObserver$ = this.onObserveElementScroll(this.minutesOptions.nativeElement);
-        this.hoursScrollObserver$.subscribe((indexToScroll) => {
-            this.updateTimeModel(this.hours[indexToScroll], this.selectedMinute, this.selectedMeridian);
-        });
-        this.minutesScrollObserver$.subscribe((indexToScroll) => {
-            this.updateTimeModel(this.selectedHour, this.minutes[indexToScroll], this.selectedMeridian);
-        });
-        if (this.format === TimeFormat.Meridian) {
-            this.meridiansScrollObserver$ = this.onObserveElementScroll(this.meridiansOptions.nativeElement);
-            this.meridiansScrollObserver$.subscribe((indexToScroll) => {
-                this.updateTimeModel(this.selectedHour, this.selectedMinute, this.meridians[indexToScroll]);
-            });
-        }
-    }
-    onObserveElementScroll(element) {
-        return fromEvent(element, 'scroll').pipe(debounceTime(150), distinctUntilChanged(), takeUntil(this.destroy$), map(() => {
-            return Math.round(element.scrollTop / this.ROW_HEIGHT);
-        }));
-    }
-    onTimePickerClosed() {
-        this.onCancelSelection();
-        this.destroy$.next();
-        this.destroy$.complete();
-    }
-    onTimeModelChange() {
-        let date = new Date();
-        if (this.timeModel) {
-            date = parse(this.timeModel, this.timeFormat, new Date());
-        }
-        this.timeModel = format(date, this.timeFormat);
-        if (!this.previousValue) {
-            this.previousValue = this.timeModel;
-        }
-        let jsHour = date.getHours();
-        if (this.format === TimeFormat.Meridian) {
-            if (jsHour > 12) {
-                jsHour = jsHour - 12;
-            }
-            // JS doesn't handle well AM/PM hour so 12:53 PM will be 00:53 ...
-            if (jsHour == 0) {
-                jsHour = 12;
-            }
-        }
-        const hour = NeoTimepickerComponent.toFixed(jsHour.toString(), 10);
-        if (hour != this.selectedHour) {
-            this.selectedHour = hour;
-            this.updateElementPosition('hour', this.selectedHour, 'auto');
-        }
-        const minute = NeoTimepickerComponent.toFixed(date.getMinutes().toString(), 10);
-        if (minute != this.selectedMinute) {
-            this.selectedMinute = minute;
-            this.updateElementPosition('minute', this.selectedMinute, 'auto');
-        }
-        if (this.format === TimeFormat.Meridian && this.selectedMeridian !== this.timeModel.split(' ')[1]) {
-            this.selectedMeridian = this.timeModel.split(' ')[1];
-            this.updateElementPosition('meridian', this.selectedMeridian, 'auto');
-        }
-        this.changeDetectorRef.markForCheck();
-    }
-    onSelectHour(hour) {
-        this.updateTimeModel(hour, this.selectedMinute, this.selectedMeridian);
-    }
-    onSelectMinute(minute) {
-        this.updateTimeModel(this.selectedHour, minute, this.selectedMeridian);
-    }
-    onSelectMeridian(meridian) {
-        this.updateTimeModel(this.selectedHour, this.selectedMinute, meridian);
-    }
-    onSaveSelection() {
-        this.previousValue = this.timeModel;
-        this.timepickerClosed = true;
-        this.timepickerOpened = false;
-        const timeModelValue = parse(this.timeModel, this.timeFormat, new Date());
-        this.timeModelChange.emit({
-            hours: timeModelValue.getHours(),
-            minutes: timeModelValue.getMinutes(),
-        });
-        this.changeDetectorRef.markForCheck();
-    }
-    onCancelSelection() {
-        this.timepickerClosed = true;
-        this.timepickerOpened = false;
-        this.timeModel = this.previousValue;
-        this.changeDetectorRef.markForCheck();
-    }
-    onMaskValidateComplete(value) {
-        if (this.timeModel !== value) {
-            this.timeModel = value;
-        }
-        this.onTimeModelChange();
-    }
-    updateTimeModel(hour, minute, meridian) {
-        if (this.format === TimeFormat.Meridian) {
-            this.timeModel = `${hour}:${minute} ${meridian}`;
-        }
-        else {
-            this.timeModel = `${hour}:${minute}`;
-        }
-        this.changeDetectorRef.markForCheck();
-    }
-    updateElementPosition(elementType, id, scrollBehavior) {
-        const element = document.getElementById(`${elementType}-${id}`);
-        this.scrollToElement(element, scrollBehavior);
-    }
-    scrollToElement(element, behavior = 'auto') {
-        if (element) {
-            setTimeout(() => {
-                element.scrollIntoView({
-                    behavior,
-                    block: 'center',
-                    inline: 'center'
-                });
-            }, 1);
-        }
-    }
-    /**
-     * Fullfill minutes and hours arrays like [0, 1, 2 ... 12] and [0, 1, 2, ... 59]
-     */
-    generateTimeSlots() {
-        this.hours = [];
-        this.minutes = [NeoTimepickerComponent.toFixed(0, this.FIX_NUMBER)];
-        for (let i = 1; i <= this.HOURS_MERIDIAN_MAX; i++) {
-            const indexToAdd = NeoTimepickerComponent.toFixed(i, this.FIX_NUMBER);
-            this.hours.push(indexToAdd);
-            this.minutes.push(indexToAdd);
-        }
-        if (this.format === TimeFormat.Default) {
-            this.hours = [NeoTimepickerComponent.toFixed(0, this.FIX_NUMBER), ...this.hours];
-            for (let i = 13; i < this.HOURS_MAX; i++) {
-                this.hours.push(NeoTimepickerComponent.toFixed(i, this.FIX_NUMBER));
-            }
-        }
-        for (let i = 13; i < this.MINUTES_MAX; i++) {
-            this.minutes.push(NeoTimepickerComponent.toFixed(i, this.FIX_NUMBER));
-        }
-        this.changeDetectorRef.markForCheck();
-    }
-    updateTimePickerPosition() {
-        var _a;
-        if ((_a = this.inputBox) === null || _a === void 0 ? void 0 : _a.nativeElement) {
-            const inputBoxBounds = this.inputBox.nativeElement.getBoundingClientRect();
-            const topPosition = inputBoxBounds.top - this.TIME_OPTION_HEIGHT - this.MARGIN;
-            const bottomPosition = inputBoxBounds.top + inputBoxBounds.height;
-            const timePickerWidth = this.format === TimeFormat.Meridian ? this.TIME_PICKER_MERIDIAN_WIDTH : this.TIME_PICKER_DEFAULT_WIDTH;
-            const shift = (timePickerWidth - inputBoxBounds.width) / 2;
-            if (this.placement === 'top') {
-                this.position = {
-                    top: topPosition < 0 ? bottomPosition : topPosition,
-                    left: inputBoxBounds.left - shift,
-                };
-            }
-            else {
-                this.position = {
-                    top: bottomPosition + this.TIME_OPTION_HEIGHT + this.MARGIN > window.innerHeight ? topPosition : bottomPosition,
-                    left: inputBoxBounds.left - shift,
-                };
-            }
-            this.changeDetectorRef.markForCheck();
-        }
-    }
-    static convert12To24(time) {
-        const terms = time.split(':');
-        const minutes = terms[1].substring(0, 2);
-        const meridian = terms[1].trim().slice(-2).toUpperCase();
-        let hour = parseInt(terms[0]);
-        if (!isNaN(parseInt(terms[0]))) {
-            if (meridian === 'PM' && hour < 12) {
-                hour = hour + 12;
-            }
-            if (meridian === 'AM' && hour === 12) {
-                hour = 0;
-            }
-        }
-        return `${hour}:${minutes}`;
-    }
-    static convert24To12(time) {
-        const terms = time.split(':');
-        let meridian = 'AM';
-        let hour = parseInt(terms[0]);
-        let minute = parseInt(terms[1]);
-        if (!isNaN(parseInt(terms[0]))) {
-            if (hour >= 12) {
-                meridian = 'PM';
-                if (hour > 12) {
-                    hour = hour - 12;
-                }
-            }
-            if (hour === 0) {
-                hour = 12;
-            }
-        }
-        const hourStr = NeoTimepickerComponent.toFixed(hour, 10);
-        const minuteStr = NeoTimepickerComponent.toFixed(minute, 10);
-        return `${hourStr}:${minuteStr} ${meridian}`;
-    }
-    /**
-     * Return 08 for 8, 06 for 6
-     * @param num
-     * @param fix
-     * @private
-     */
-    static toFixed(num, fix) {
-        let fixedNum = num.toString();
-        if (num < fix) {
-            fixedNum = `0${fixedNum}`;
-        }
-        return fixedNum;
-    }
-}
-NeoTimepickerComponent.decorators = [
-    { type: Component, args: [{
-                changeDetection: ChangeDetectionStrategy.OnPush,
-                selector: 'ap-neo-timepicker',
-                template: "<div class=\"time-picker-container\">\n    <ng-template #timeOptionsTemplate>\n        <div class=\"time-picker-options\"\n             [class.meridian]=\"format === TimeFormat.Meridian\"\n             *ngIf=\"timepickerOpened\"\n             #timepicker\n        >\n            <div class=\"header\">\n                <span> {{ i18n.hourLabel }} </span>\n                <span> {{ i18n.minuteLabel }} </span>\n                <span *ngIf=\"format === TimeFormat.Meridian\"> {{ i18n.meridianLabel }} </span>\n            </div>\n            <div class=\"content\">\n                <div class=\"selector\">\n                    <span>:</span>\n                    <span *ngIf=\"format === TimeFormat.Meridian\"></span>\n                </div>\n                <div class=\"options\"\n                    #hourOptions>\n                    <div class=\"invisible-block\"></div>\n                    <div *ngFor=\"let hour of hours;\"\n                        class=\"option\"\n                        [id]=\"'hour-' + hour\"\n                        [class.selected]=\"hour === selectedHour\"\n                        (click)=\"onSelectHour(hour)\">\n                        {{ hour }}\n                    </div>\n                    <div class=\"invisible-block\"></div>\n                </div>\n                <div class=\"divider\"></div>\n                <div class=\"options\"\n                     #minutesOptions>\n                    <div class=\"invisible-block\"></div>\n                    <div *ngFor=\"let minute of minutes;\"\n                         class=\"option\"\n                         [id]=\"'minute-' + minute\"\n                         [class.selected]=\"minute === selectedMinute\"\n                         (click)=\"onSelectMinute(minute)\">\n                        {{ minute }}\n                    </div>\n                    <div class=\"invisible-block\"></div>\n                </div>\n                <div *ngIf=\"format === TimeFormat.Meridian\"\n                     class=\"divider\"></div>\n                <div *ngIf=\"format === TimeFormat.Meridian\"\n                     class=\"options\"\n                     #meridiansOptions>\n                    <div class=\"invisible-block\"></div>\n                    <div *ngFor=\"let meridian of meridians;\"\n                         class=\"option\"\n                         [id]=\"'meridian-' + meridian\"\n                         [class.selected]=\"selectedMeridian === meridian\"\n                         (click)=\"onSelectMeridian(meridian)\">\n                        {{ meridian }}\n                    </div>\n                    <div class=\"invisible-block\"></div>\n                </div>\n            </div>\n            <div class=\"buttons\">\n                <button mat-flat-button\n                        class=\"full-width\"\n                        color=\"primary\"\n                        (click)=\"onSaveSelection()\">\n                    {{ i18n.doneLabel }}\n                </button>\n                <button mat-flat-button\n                        class=\"full-width\"\n                        (click)=\"onCancelSelection()\">\n                    {{ i18n.cancelLabel }}\n                </button>\n            </div>\n        </div>\n    </ng-template>\n    <input #inputBox\n           class=\"time-input\"\n           placement=\"bottom right\"\n           color=\"secondary\"\n           [class.active]=\"timepickerOpened\"\n           [class.invalid]=\"invalid\"\n           [apPopmenu]=\"timeOptionsTemplate\"\n           [apPopmenuBackground]=\"false\"\n           [apPopmenuBorder]=\"false\"\n           [apPopmenuDisabled]=\"timepickerOpened\"\n           [apTooltipNeo]=\"{content: invalidationMessage, display: invalidationMessage && invalid}\"\n           [close]=\"timepickerClosed\"\n           [disabled]=\"disabled\"\n           [imask]=\"format === TimeFormat.Meridian ? imaskMeridian : imaskDefault\"\n           [(ngModel)]=\"timeModel\"\n           [pointer]=\"true\"\n           [position]=\"position\"\n           [rounded]=\"true\"\n           [shadow]=\"false\"\n           (click)=\"onOpenTimepicker()\"\n           (complete)=\"onMaskValidateComplete($event)\"\n           (menuClosed)=\"onTimePickerClosed()\"\n           (menuOpened)=\"onTimepickerOpened()\">\n</div>\n",
-                styles: ["[color=facebook]{color:#1877f2}[bgcolor=facebook],[hcolor=facebook]:hover{background-color:#1877f2}[border=facebook]{border:1px solid #1877f2}[color=google]{color:#4e85e8}[bgcolor=google],[hcolor=google]:hover{background-color:#4e85e8}[border=google]{border:1px solid #4e85e8}[color=instagram]{color:#e1306c}[bgcolor=instagram],[hcolor=instagram]:hover{background-color:#e1306c}[border=instagram]{border:1px solid #e1306c}[color=instagrammagenta]{color:#c13584}[bgcolor=instagrammagenta],[hcolor=instagrammagenta]:hover{background-color:#c13584}[border=instagrammagenta]{border:1px solid #c13584}[color=instagramblue]{color:#5851db}[bgcolor=instagramblue],[hcolor=instagramblue]:hover{background-color:#5851db}[border=instagramblue]{border:1px solid #5851db}[color=instagrampurple]{color:#833ab4}[bgcolor=instagrampurple],[hcolor=instagrampurple]:hover{background-color:#833ab4}[border=instagrampurple]{border:1px solid #833ab4}[color=instagramorange]{color:#f56040}[bgcolor=instagramorange],[hcolor=instagramorange]:hover{background-color:#f56040}[border=instagramorange]{border:1px solid #f56040}[color=instagramyellow]{color:#ffdc80}[bgcolor=instagramyellow],[hcolor=instagramyellow]:hover{background-color:#ffdc80}[border=instagramyellow]{border:1px solid #ffdc80}[color=linkedin]{color:#2c67bc}[bgcolor=linkedin],[hcolor=linkedin]:hover{background-color:#2c67bc}[border=linkedin]{border:1px solid #2c67bc}[color=twitter]{color:#55acee}[bgcolor=twitter],[hcolor=twitter]:hover{background-color:#55acee}[border=twitter]{border:1px solid #55acee}[color=youtube]{color:red}[bgcolor=youtube],[hcolor=youtube]:hover{background-color:red}[border=youtube]{border:1px solid red}[color=blood-orange]{color:#ff4d00}[bgcolor=blood-orange],[hcolor=blood-orange]:hover{background-color:#ff4d00}[border=blood-orange]{border:1px solid #ff4d00}[color=pinkish-orange]{color:#ff7b49}[bgcolor=pinkish-orange],[hcolor=pinkish-orange]:hover{background-color:#ff7b49}[border=pinkish-orange]{border:1px solid #ff7b49}[color=charcoal-grey]{color:#2a2f34}[bgcolor=charcoal-grey],[hcolor=charcoal-grey]:hover{background-color:#2a2f34}[border=charcoal-grey]{border:1px solid #2a2f34}[color=azure]{color:#00aeef}[bgcolor=azure],[hcolor=azure]:hover{background-color:#00aeef}[border=azure]{border:1px solid #00aeef}[color=light-azure]{color:#eaf5fd}[bgcolor=light-azure],[hcolor=light-azure]:hover{background-color:#eaf5fd}[border=light-azure]{border:1px solid #eaf5fd}[color=blue-grey]{color:#8d98a9}[bgcolor=blue-grey],[hcolor=blue-grey]:hover{background-color:#8d98a9}[border=blue-grey]{border:1px solid #8d98a9}[color=silver]{color:#ced0da}[bgcolor=silver],[hcolor=silver]:hover{background-color:#ced0da}[border=silver]{border:1px solid #ced0da}[color=pale-grey]{color:#dfe3e9}[bgcolor=pale-grey],[hcolor=pale-grey]:hover{background-color:#dfe3e9}[border=pale-grey]{border:1px solid #dfe3e9}[color=grey-white]{color:#f5f7f8}[bgcolor=grey-white],[hcolor=grey-white]:hover{background-color:#f5f7f8}[border=grey-white]{border:1px solid #f5f7f8}[color=cool-grey]{color:#b4bbc6}[bgcolor=cool-grey],[hcolor=cool-grey]:hover{background-color:#b4bbc6}[border=cool-grey]{border:1px solid #b4bbc6}[color=black]{color:#344563}[bgcolor=black],[hcolor=black]:hover{background-color:#344563}[border=black]{border:1px solid #344563}[color=grey-blue]{color:#68768c}[bgcolor=grey-blue],[hcolor=grey-blue]:hover{background-color:#68768c}[border=grey-blue]{border:1px solid #68768c}[color=strawberry]{color:#f4282d}[bgcolor=strawberry],[hcolor=strawberry]:hover{background-color:#f4282d}[border=strawberry]{border:1px solid #f4282d}[color=light-strawberry]{color:#f8eded}[bgcolor=light-strawberry],[hcolor=light-strawberry]:hover{background-color:#f8eded}[border=light-strawberry]{border:1px solid #f8eded}[color=white]{color:#fff}[bgcolor=white],[hcolor=white]:hover{background-color:#fff}[border=white]{border:1px solid #fff}[color=cool-green]{color:#33c15d}[bgcolor=cool-green],[hcolor=cool-green]:hover{background-color:#33c15d}[border=cool-green]{border:1px solid #33c15d}[color=light-green]{color:#ebfaef}[bgcolor=light-green],[hcolor=light-green]:hover{background-color:#ebfaef}[border=light-green]{border:1px solid #ebfaef}[color=transparent]{color:#0000}[bgcolor=transparent],[hcolor=transparent]:hover{background-color:initial}[border=transparent]{border:1px solid #0000}[color=c0]{color:#a566a5}[bgcolor=c0],[hcolor=c0]:hover{background-color:#a566a5}[border=c0]{border:1px solid #a566a5}[color=c1]{color:#c7ab82}[bgcolor=c1],[hcolor=c1]:hover{background-color:#c7ab82}[border=c1]{border:1px solid #c7ab82}[color=c2]{color:#f2713c}[bgcolor=c2],[hcolor=c2]:hover{background-color:#f2713c}[border=c2]{border:1px solid #f2713c}[color=c3]{color:#ffd006}[bgcolor=c3],[hcolor=c3]:hover{background-color:#ffd006}[border=c3]{border:1px solid #ffd006}[color=c4]{color:#94c5aa}[bgcolor=c4],[hcolor=c4]:hover{background-color:#94c5aa}[border=c4]{border:1px solid #94c5aa}[color=c5]{color:#2a9d8f}[bgcolor=c5],[hcolor=c5]:hover{background-color:#2a9d8f}[border=c5]{border:1px solid #2a9d8f}[color=c6]{color:#78acd8}[bgcolor=c6],[hcolor=c6]:hover{background-color:#78acd8}[border=c6]{border:1px solid #78acd8}[color=c7]{color:#525a9e}[bgcolor=c7],[hcolor=c7]:hover{background-color:#525a9e}[border=c7]{border:1px solid #525a9e}[color=c8]{color:#6a2459}[bgcolor=c8],[hcolor=c8]:hover{background-color:#6a2459}[border=c8]{border:1px solid #6a2459}[color=c9]{color:#74729e}[bgcolor=c9],[hcolor=c9]:hover{background-color:#74729e}[border=c9]{border:1px solid #74729e}.time-picker-container{display:flex}.time-input{width:80px;max-width:80px;text-align:center;padding:0;margin:0;height:36px;line-height:24px}.time-input.active{border-color:#178dfe}.time-picker-options{display:flex;flex-direction:column;width:96px;margin-top:8px;max-width:96px;height:379px;background:#fff;border-radius:4px;overflow:hidden;box-shadow:0 3px 10px #00000014}.time-picker-options.meridian{width:152px;max-width:152px}.time-picker-options .header{display:flex;align-items:center;min-height:29px;border-bottom:1px solid #eaecef;color:#344563;font-size:12px;line-height:18px}.time-picker-options .header>span{flex:1;text-align:center}.time-picker-options .content{display:flex;position:relative;min-height:252px;overflow:hidden}.time-picker-options .content .selector{display:flex;justify-content:space-evenly;align-items:center;background-color:#f9f9fa;border-top:1px solid #eaecef;border-bottom:1px solid #eaecef;width:100%;height:34px;position:absolute;top:50%;transform:translateY(-50%);z-index:4;box-sizing:border-box}.time-picker-options .content .divider{height:100%;width:1px;background:#eaecef}.time-picker-options .content .options{flex:1;height:100%;overflow-y:scroll;z-index:5;scroll-snap-type:y mandatory;-ms-overflow-style:none;scrollbar-width:none}.time-picker-options .content .options::-webkit-scrollbar{display:none}.time-picker-options .content .options .invisible-block{min-height:109px;max-height:109px;width:100%}.time-picker-options .content .options .option{min-height:34px;display:flex;z-index:5;justify-content:center;align-items:center;font-size:14px;line-height:17px;color:#aeb5c1;scroll-snap-align:center;padding-block:1px}.time-picker-options .content .options .option:hover{color:#178dfe;cursor:pointer}.time-picker-options .content .options .option.selected{color:#344563!important}.time-picker-options .content .meridian{flex:1;display:flex;flex-direction:column;justify-content:center}.time-picker-options .content .meridian>div{min-height:34px;display:flex;justify-content:center;align-items:center;font-size:14px;line-height:17px;color:#aeb5c1;scroll-snap-align:center}.time-picker-options .buttons{display:flex;flex-direction:column;padding:8px;min-height:96px;border-top:1px solid #eaecef;grid-gap:8px;gap:8px}.time-picker-options .buttons button{font-weight:700;min-width:80px}"]
-            },] }
-];
-/** @nocollapse */
-NeoTimepickerComponent.ctorParameters = () => [
-    { type: ChangeDetectorRef }
-];
-NeoTimepickerComponent.propDecorators = {
-    inputBox: [{ type: ViewChild, args: ['inputBox',] }],
-    hourOptions: [{ type: ViewChild, args: ['hourOptions',] }],
-    minutesOptions: [{ type: ViewChild, args: ['minutesOptions',] }],
-    meridiansOptions: [{ type: ViewChild, args: ['meridiansOptions',] }],
-    timepicker: [{ type: ViewChild, args: ['timepicker',] }],
-    i18n: [{ type: Input }],
-    disabled: [{ type: Input }],
-    format: [{ type: Input }],
-    invalid: [{ type: Input }],
-    invalidationMessage: [{ type: Input }],
-    placement: [{ type: Input }],
-    timeModel: [{ type: Input }],
-    timeModelChange: [{ type: Output }],
-    onKeypress: [{ type: HostListener, args: ['window:keydown', ['$event'],] }]
-};
-
-class NotificationComponent {
-    constructor() {
-        this.type = 'info';
-    }
-}
-NotificationComponent.decorators = [
-    { type: Component, args: [{
-                selector: 'ap-notification',
-                template: "<div\n    class=\"main\"\n    [ngClass]=\"{'warning': type === 'warning', 'error': type === 'error', 'success': type === 'success'}\">\n    <span class=\"border\"></span>\n    <span class=\"icon\">\n        <ng-content select=\"[icon]\"></ng-content>\n    </span>\n    <ng-content select=\"[text]\"></ng-content>\n</div>\n",
-                changeDetection: ChangeDetectionStrategy.OnPush,
-                styles: ["[color=facebook]{color:#1877f2}[bgcolor=facebook],[hcolor=facebook]:hover{background-color:#1877f2}[border=facebook]{border:1px solid #1877f2}[color=google]{color:#4e85e8}[bgcolor=google],[hcolor=google]:hover{background-color:#4e85e8}[border=google]{border:1px solid #4e85e8}[color=instagram]{color:#e1306c}[bgcolor=instagram],[hcolor=instagram]:hover{background-color:#e1306c}[border=instagram]{border:1px solid #e1306c}[color=instagrammagenta]{color:#c13584}[bgcolor=instagrammagenta],[hcolor=instagrammagenta]:hover{background-color:#c13584}[border=instagrammagenta]{border:1px solid #c13584}[color=instagramblue]{color:#5851db}[bgcolor=instagramblue],[hcolor=instagramblue]:hover{background-color:#5851db}[border=instagramblue]{border:1px solid #5851db}[color=instagrampurple]{color:#833ab4}[bgcolor=instagrampurple],[hcolor=instagrampurple]:hover{background-color:#833ab4}[border=instagrampurple]{border:1px solid #833ab4}[color=instagramorange]{color:#f56040}[bgcolor=instagramorange],[hcolor=instagramorange]:hover{background-color:#f56040}[border=instagramorange]{border:1px solid #f56040}[color=instagramyellow]{color:#ffdc80}[bgcolor=instagramyellow],[hcolor=instagramyellow]:hover{background-color:#ffdc80}[border=instagramyellow]{border:1px solid #ffdc80}[color=linkedin]{color:#2c67bc}[bgcolor=linkedin],[hcolor=linkedin]:hover{background-color:#2c67bc}[border=linkedin]{border:1px solid #2c67bc}[color=twitter]{color:#55acee}[bgcolor=twitter],[hcolor=twitter]:hover{background-color:#55acee}[border=twitter]{border:1px solid #55acee}[color=youtube]{color:red}[bgcolor=youtube],[hcolor=youtube]:hover{background-color:red}[border=youtube]{border:1px solid red}[color=blood-orange]{color:#ff4d00}[bgcolor=blood-orange],[hcolor=blood-orange]:hover{background-color:#ff4d00}[border=blood-orange]{border:1px solid #ff4d00}[color=pinkish-orange]{color:#ff7b49}[bgcolor=pinkish-orange],[hcolor=pinkish-orange]:hover{background-color:#ff7b49}[border=pinkish-orange]{border:1px solid #ff7b49}[color=charcoal-grey]{color:#2a2f34}[bgcolor=charcoal-grey],[hcolor=charcoal-grey]:hover{background-color:#2a2f34}[border=charcoal-grey]{border:1px solid #2a2f34}[color=azure]{color:#00aeef}[bgcolor=azure],[hcolor=azure]:hover{background-color:#00aeef}[border=azure]{border:1px solid #00aeef}[color=light-azure]{color:#eaf5fd}[bgcolor=light-azure],[hcolor=light-azure]:hover{background-color:#eaf5fd}[border=light-azure]{border:1px solid #eaf5fd}[color=blue-grey]{color:#8d98a9}[bgcolor=blue-grey],[hcolor=blue-grey]:hover{background-color:#8d98a9}[border=blue-grey]{border:1px solid #8d98a9}[color=silver]{color:#ced0da}[bgcolor=silver],[hcolor=silver]:hover{background-color:#ced0da}[border=silver]{border:1px solid #ced0da}[color=pale-grey]{color:#dfe3e9}[bgcolor=pale-grey],[hcolor=pale-grey]:hover{background-color:#dfe3e9}[border=pale-grey]{border:1px solid #dfe3e9}[color=grey-white]{color:#f5f7f8}[bgcolor=grey-white],[hcolor=grey-white]:hover{background-color:#f5f7f8}[border=grey-white]{border:1px solid #f5f7f8}[color=cool-grey]{color:#b4bbc6}[bgcolor=cool-grey],[hcolor=cool-grey]:hover{background-color:#b4bbc6}[border=cool-grey]{border:1px solid #b4bbc6}[color=black]{color:#344563}[bgcolor=black],[hcolor=black]:hover{background-color:#344563}[border=black]{border:1px solid #344563}[color=grey-blue]{color:#68768c}[bgcolor=grey-blue],[hcolor=grey-blue]:hover{background-color:#68768c}[border=grey-blue]{border:1px solid #68768c}[color=strawberry]{color:#f4282d}[bgcolor=strawberry],[hcolor=strawberry]:hover{background-color:#f4282d}[border=strawberry]{border:1px solid #f4282d}[color=light-strawberry]{color:#f8eded}[bgcolor=light-strawberry],[hcolor=light-strawberry]:hover{background-color:#f8eded}[border=light-strawberry]{border:1px solid #f8eded}[color=white]{color:#fff}[bgcolor=white],[hcolor=white]:hover{background-color:#fff}[border=white]{border:1px solid #fff}[color=cool-green]{color:#33c15d}[bgcolor=cool-green],[hcolor=cool-green]:hover{background-color:#33c15d}[border=cool-green]{border:1px solid #33c15d}[color=light-green]{color:#ebfaef}[bgcolor=light-green],[hcolor=light-green]:hover{background-color:#ebfaef}[border=light-green]{border:1px solid #ebfaef}[color=transparent]{color:#0000}[bgcolor=transparent],[hcolor=transparent]:hover{background-color:initial}[border=transparent]{border:1px solid #0000}[color=c0]{color:#a566a5}[bgcolor=c0],[hcolor=c0]:hover{background-color:#a566a5}[border=c0]{border:1px solid #a566a5}[color=c1]{color:#c7ab82}[bgcolor=c1],[hcolor=c1]:hover{background-color:#c7ab82}[border=c1]{border:1px solid #c7ab82}[color=c2]{color:#f2713c}[bgcolor=c2],[hcolor=c2]:hover{background-color:#f2713c}[border=c2]{border:1px solid #f2713c}[color=c3]{color:#ffd006}[bgcolor=c3],[hcolor=c3]:hover{background-color:#ffd006}[border=c3]{border:1px solid #ffd006}[color=c4]{color:#94c5aa}[bgcolor=c4],[hcolor=c4]:hover{background-color:#94c5aa}[border=c4]{border:1px solid #94c5aa}[color=c5]{color:#2a9d8f}[bgcolor=c5],[hcolor=c5]:hover{background-color:#2a9d8f}[border=c5]{border:1px solid #2a9d8f}[color=c6]{color:#78acd8}[bgcolor=c6],[hcolor=c6]:hover{background-color:#78acd8}[border=c6]{border:1px solid #78acd8}[color=c7]{color:#525a9e}[bgcolor=c7],[hcolor=c7]:hover{background-color:#525a9e}[border=c7]{border:1px solid #525a9e}[color=c8]{color:#6a2459}[bgcolor=c8],[hcolor=c8]:hover{background-color:#6a2459}[border=c8]{border:1px solid #6a2459}[color=c9]{color:#74729e}[bgcolor=c9],[hcolor=c9]:hover{background-color:#74729e}[border=c9]{border:1px solid #74729e}:host{display:block}.main{display:flex;font-size:14px;line-height:17px;align-items:center;background:#eff5fc;color:#178dfe;padding:8px 16px 8px 8px;border-radius:4px}.main .border{align-self:stretch;border:2px solid #178dfe;border-radius:4px}.main .border,.main .icon{margin-right:8px}.main.warning{background-color:#fffde9;color:#858fa1}.main.warning .border{border-color:#ffe91f}.main.error{background-color:#fde7e7;color:#e81313}.main.error .border{border-color:#e81313}.main.success{background-color:#ecf7ed;color:#45b854}.main.success .border{border-color:#45b854}.main.full-width{width:100%}"]
-            },] }
-];
-NotificationComponent.propDecorators = {
-    type: [{ type: Input }]
-};
-
-class StepperComponent {
-    constructor() {
-        this.steps = []; // Immutable after init.
-        this.stepClicked = new EventEmitter();
-        this.stepTexts = {};
-        this.currentIndex = 0;
-    }
-    ngOnChanges(changes) {
-        var _a;
-        if (((_a = this.steps) === null || _a === void 0 ? void 0 : _a.length) > 0 && this.currentStep) {
-            this.currentIndex = this.steps.findIndex(step => step.id === this.currentStep.id);
-        }
-        else {
-            this.currentIndex = 0;
-        }
-    }
-    clickCurrentStep(step) {
-        this.stepClicked.emit(step);
-    }
-}
-StepperComponent.decorators = [
-    { type: Component, args: [{
-                changeDetection: ChangeDetectionStrategy.OnPush,
-                selector: 'ap-stepper',
-                template: "<div class=\"main\">\n    <span class=\"item\"\n          *ngFor=\"let step of steps; let index=index; let last=last\" >\n        <span [ngClass]=\" {\n                'number': true,\n                'active': index === currentIndex,\n                'no-more-active': currentIndex > index,\n                'not-yet-active': currentIndex < index}\">\n            {{index + 1}}\n        </span>\n        <span class=\"text\" [ngClass]=\"{'clickable': step.clickable}\" (click)=\"step.clickable ? clickCurrentStep(step) : false\">\n        {{step.name}}\n        </span>\n        <ap-symbol\n            *ngIf=\"!last\"\n            [id]=\"'arrow-right-1'\"\n            [size]=\"'12px'\">\n        </ap-symbol>\n    </span>\n</div>\n",
-                styles: ["[color=facebook]{color:#1877f2}[bgcolor=facebook],[hcolor=facebook]:hover{background-color:#1877f2}[border=facebook]{border:1px solid #1877f2}[color=google]{color:#4e85e8}[bgcolor=google],[hcolor=google]:hover{background-color:#4e85e8}[border=google]{border:1px solid #4e85e8}[color=instagram]{color:#e1306c}[bgcolor=instagram],[hcolor=instagram]:hover{background-color:#e1306c}[border=instagram]{border:1px solid #e1306c}[color=instagrammagenta]{color:#c13584}[bgcolor=instagrammagenta],[hcolor=instagrammagenta]:hover{background-color:#c13584}[border=instagrammagenta]{border:1px solid #c13584}[color=instagramblue]{color:#5851db}[bgcolor=instagramblue],[hcolor=instagramblue]:hover{background-color:#5851db}[border=instagramblue]{border:1px solid #5851db}[color=instagrampurple]{color:#833ab4}[bgcolor=instagrampurple],[hcolor=instagrampurple]:hover{background-color:#833ab4}[border=instagrampurple]{border:1px solid #833ab4}[color=instagramorange]{color:#f56040}[bgcolor=instagramorange],[hcolor=instagramorange]:hover{background-color:#f56040}[border=instagramorange]{border:1px solid #f56040}[color=instagramyellow]{color:#ffdc80}[bgcolor=instagramyellow],[hcolor=instagramyellow]:hover{background-color:#ffdc80}[border=instagramyellow]{border:1px solid #ffdc80}[color=linkedin]{color:#2c67bc}[bgcolor=linkedin],[hcolor=linkedin]:hover{background-color:#2c67bc}[border=linkedin]{border:1px solid #2c67bc}[color=twitter]{color:#55acee}[bgcolor=twitter],[hcolor=twitter]:hover{background-color:#55acee}[border=twitter]{border:1px solid #55acee}[color=youtube]{color:red}[bgcolor=youtube],[hcolor=youtube]:hover{background-color:red}[border=youtube]{border:1px solid red}[color=blood-orange]{color:#ff4d00}[bgcolor=blood-orange],[hcolor=blood-orange]:hover{background-color:#ff4d00}[border=blood-orange]{border:1px solid #ff4d00}[color=pinkish-orange]{color:#ff7b49}[bgcolor=pinkish-orange],[hcolor=pinkish-orange]:hover{background-color:#ff7b49}[border=pinkish-orange]{border:1px solid #ff7b49}[color=charcoal-grey]{color:#2a2f34}[bgcolor=charcoal-grey],[hcolor=charcoal-grey]:hover{background-color:#2a2f34}[border=charcoal-grey]{border:1px solid #2a2f34}[color=azure]{color:#00aeef}[bgcolor=azure],[hcolor=azure]:hover{background-color:#00aeef}[border=azure]{border:1px solid #00aeef}[color=light-azure]{color:#eaf5fd}[bgcolor=light-azure],[hcolor=light-azure]:hover{background-color:#eaf5fd}[border=light-azure]{border:1px solid #eaf5fd}[color=blue-grey]{color:#8d98a9}[bgcolor=blue-grey],[hcolor=blue-grey]:hover{background-color:#8d98a9}[border=blue-grey]{border:1px solid #8d98a9}[color=silver]{color:#ced0da}[bgcolor=silver],[hcolor=silver]:hover{background-color:#ced0da}[border=silver]{border:1px solid #ced0da}[color=pale-grey]{color:#dfe3e9}[bgcolor=pale-grey],[hcolor=pale-grey]:hover{background-color:#dfe3e9}[border=pale-grey]{border:1px solid #dfe3e9}[color=grey-white]{color:#f5f7f8}[bgcolor=grey-white],[hcolor=grey-white]:hover{background-color:#f5f7f8}[border=grey-white]{border:1px solid #f5f7f8}[color=cool-grey]{color:#b4bbc6}[bgcolor=cool-grey],[hcolor=cool-grey]:hover{background-color:#b4bbc6}[border=cool-grey]{border:1px solid #b4bbc6}[color=black]{color:#344563}[bgcolor=black],[hcolor=black]:hover{background-color:#344563}[border=black]{border:1px solid #344563}[color=grey-blue]{color:#68768c}[bgcolor=grey-blue],[hcolor=grey-blue]:hover{background-color:#68768c}[border=grey-blue]{border:1px solid #68768c}[color=strawberry]{color:#f4282d}[bgcolor=strawberry],[hcolor=strawberry]:hover{background-color:#f4282d}[border=strawberry]{border:1px solid #f4282d}[color=light-strawberry]{color:#f8eded}[bgcolor=light-strawberry],[hcolor=light-strawberry]:hover{background-color:#f8eded}[border=light-strawberry]{border:1px solid #f8eded}[color=white]{color:#fff}[bgcolor=white],[hcolor=white]:hover{background-color:#fff}[border=white]{border:1px solid #fff}[color=cool-green]{color:#33c15d}[bgcolor=cool-green],[hcolor=cool-green]:hover{background-color:#33c15d}[border=cool-green]{border:1px solid #33c15d}[color=light-green]{color:#ebfaef}[bgcolor=light-green],[hcolor=light-green]:hover{background-color:#ebfaef}[border=light-green]{border:1px solid #ebfaef}[color=transparent]{color:#0000}[bgcolor=transparent],[hcolor=transparent]:hover{background-color:initial}[border=transparent]{border:1px solid #0000}[color=c0]{color:#a566a5}[bgcolor=c0],[hcolor=c0]:hover{background-color:#a566a5}[border=c0]{border:1px solid #a566a5}[color=c1]{color:#c7ab82}[bgcolor=c1],[hcolor=c1]:hover{background-color:#c7ab82}[border=c1]{border:1px solid #c7ab82}[color=c2]{color:#f2713c}[bgcolor=c2],[hcolor=c2]:hover{background-color:#f2713c}[border=c2]{border:1px solid #f2713c}[color=c3]{color:#ffd006}[bgcolor=c3],[hcolor=c3]:hover{background-color:#ffd006}[border=c3]{border:1px solid #ffd006}[color=c4]{color:#94c5aa}[bgcolor=c4],[hcolor=c4]:hover{background-color:#94c5aa}[border=c4]{border:1px solid #94c5aa}[color=c5]{color:#2a9d8f}[bgcolor=c5],[hcolor=c5]:hover{background-color:#2a9d8f}[border=c5]{border:1px solid #2a9d8f}[color=c6]{color:#78acd8}[bgcolor=c6],[hcolor=c6]:hover{background-color:#78acd8}[border=c6]{border:1px solid #78acd8}[color=c7]{color:#525a9e}[bgcolor=c7],[hcolor=c7]:hover{background-color:#525a9e}[border=c7]{border:1px solid #525a9e}[color=c8]{color:#6a2459}[bgcolor=c8],[hcolor=c8]:hover{background-color:#6a2459}[border=c8]{border:1px solid #6a2459}[color=c9]{color:#74729e}[bgcolor=c9],[hcolor=c9]:hover{background-color:#74729e}[border=c9]{border:1px solid #74729e}.active{font-weight:700}.main{display:flex}.main .item{height:-moz-fit-content;height:fit-content}.main .item .number{border-radius:24px;width:24px;height:24px;display:inline-block;text-align:center;vertical-align:middle;line-height:24px;box-sizing:border-box}.main .item .number.active{box-shadow:0 0 0 1.5px #e8f4ff;border:1.5px solid #e8f4ff;line-height:21px;background-color:#178dfe;color:#fff}.main .item .number.no-more-active{background-color:#e8f4ff;color:#178dfe}.main .item .number.not-yet-active{border:1px solid #e8f4ff;line-height:22px;background-color:initial;color:#178dfe}.main .item .text{padding-left:8px;height:-moz-fit-content;height:fit-content;margin:auto;line-height:24px;vertical-align:middle}.main .item .text.clickable:hover{color:#178dfe;cursor:pointer}.main .item ap-symbol{color:#858fa1;margin:auto 10px;vertical-align:middle;display:inline-block}"]
-            },] }
-];
-/** @nocollapse */
-StepperComponent.ctorParameters = () => [];
-StepperComponent.propDecorators = {
-    currentStep: [{ type: Input }],
-    steps: [{ type: Input }],
-    stepClicked: [{ type: Output }]
-};
-
-class SnackBarComponent {
-    constructor(snackBarRef, data) {
-        this.snackBarRef = snackBarRef;
-        this.data = data;
-    }
-}
-SnackBarComponent.decorators = [
-    { type: Component, args: [{
-                changeDetection: ChangeDetectionStrategy.OnPush,
-                selector: 'ap-snackbar',
-                template: "<div class=\"snackbar-content\">\n    <div class=\"snackbar-text\" [innerHTML]=\"data.message\">\n    </div>\n    <ap-symbol\n        class=\"snackbar-close\"\n        symbolId=\"close\"\n        size=\"12\"\n        (click)=\"snackBarRef.dismiss()\">\n    </ap-symbol>\n</div>\n",
-                styles: ["[color=facebook]{color:#1877f2}[bgcolor=facebook],[hcolor=facebook]:hover{background-color:#1877f2}[border=facebook]{border:1px solid #1877f2}[color=google]{color:#4e85e8}[bgcolor=google],[hcolor=google]:hover{background-color:#4e85e8}[border=google]{border:1px solid #4e85e8}[color=instagram]{color:#e1306c}[bgcolor=instagram],[hcolor=instagram]:hover{background-color:#e1306c}[border=instagram]{border:1px solid #e1306c}[color=instagrammagenta]{color:#c13584}[bgcolor=instagrammagenta],[hcolor=instagrammagenta]:hover{background-color:#c13584}[border=instagrammagenta]{border:1px solid #c13584}[color=instagramblue]{color:#5851db}[bgcolor=instagramblue],[hcolor=instagramblue]:hover{background-color:#5851db}[border=instagramblue]{border:1px solid #5851db}[color=instagrampurple]{color:#833ab4}[bgcolor=instagrampurple],[hcolor=instagrampurple]:hover{background-color:#833ab4}[border=instagrampurple]{border:1px solid #833ab4}[color=instagramorange]{color:#f56040}[bgcolor=instagramorange],[hcolor=instagramorange]:hover{background-color:#f56040}[border=instagramorange]{border:1px solid #f56040}[color=instagramyellow]{color:#ffdc80}[bgcolor=instagramyellow],[hcolor=instagramyellow]:hover{background-color:#ffdc80}[border=instagramyellow]{border:1px solid #ffdc80}[color=linkedin]{color:#2c67bc}[bgcolor=linkedin],[hcolor=linkedin]:hover{background-color:#2c67bc}[border=linkedin]{border:1px solid #2c67bc}[color=twitter]{color:#55acee}[bgcolor=twitter],[hcolor=twitter]:hover{background-color:#55acee}[border=twitter]{border:1px solid #55acee}[color=youtube]{color:red}[bgcolor=youtube],[hcolor=youtube]:hover{background-color:red}[border=youtube]{border:1px solid red}[color=blood-orange]{color:#ff4d00}[bgcolor=blood-orange],[hcolor=blood-orange]:hover{background-color:#ff4d00}[border=blood-orange]{border:1px solid #ff4d00}[color=pinkish-orange]{color:#ff7b49}[bgcolor=pinkish-orange],[hcolor=pinkish-orange]:hover{background-color:#ff7b49}[border=pinkish-orange]{border:1px solid #ff7b49}[color=charcoal-grey]{color:#2a2f34}[bgcolor=charcoal-grey],[hcolor=charcoal-grey]:hover{background-color:#2a2f34}[border=charcoal-grey]{border:1px solid #2a2f34}[color=azure]{color:#00aeef}[bgcolor=azure],[hcolor=azure]:hover{background-color:#00aeef}[border=azure]{border:1px solid #00aeef}[color=light-azure]{color:#eaf5fd}[bgcolor=light-azure],[hcolor=light-azure]:hover{background-color:#eaf5fd}[border=light-azure]{border:1px solid #eaf5fd}[color=blue-grey]{color:#8d98a9}[bgcolor=blue-grey],[hcolor=blue-grey]:hover{background-color:#8d98a9}[border=blue-grey]{border:1px solid #8d98a9}[color=silver]{color:#ced0da}[bgcolor=silver],[hcolor=silver]:hover{background-color:#ced0da}[border=silver]{border:1px solid #ced0da}[color=pale-grey]{color:#dfe3e9}[bgcolor=pale-grey],[hcolor=pale-grey]:hover{background-color:#dfe3e9}[border=pale-grey]{border:1px solid #dfe3e9}[color=grey-white]{color:#f5f7f8}[bgcolor=grey-white],[hcolor=grey-white]:hover{background-color:#f5f7f8}[border=grey-white]{border:1px solid #f5f7f8}[color=cool-grey]{color:#b4bbc6}[bgcolor=cool-grey],[hcolor=cool-grey]:hover{background-color:#b4bbc6}[border=cool-grey]{border:1px solid #b4bbc6}[color=black]{color:#344563}[bgcolor=black],[hcolor=black]:hover{background-color:#344563}[border=black]{border:1px solid #344563}[color=grey-blue]{color:#68768c}[bgcolor=grey-blue],[hcolor=grey-blue]:hover{background-color:#68768c}[border=grey-blue]{border:1px solid #68768c}[color=strawberry]{color:#f4282d}[bgcolor=strawberry],[hcolor=strawberry]:hover{background-color:#f4282d}[border=strawberry]{border:1px solid #f4282d}[color=light-strawberry]{color:#f8eded}[bgcolor=light-strawberry],[hcolor=light-strawberry]:hover{background-color:#f8eded}[border=light-strawberry]{border:1px solid #f8eded}[color=white]{color:#fff}[bgcolor=white],[hcolor=white]:hover{background-color:#fff}[border=white]{border:1px solid #fff}[color=cool-green]{color:#33c15d}[bgcolor=cool-green],[hcolor=cool-green]:hover{background-color:#33c15d}[border=cool-green]{border:1px solid #33c15d}[color=light-green]{color:#ebfaef}[bgcolor=light-green],[hcolor=light-green]:hover{background-color:#ebfaef}[border=light-green]{border:1px solid #ebfaef}[color=transparent]{color:#0000}[bgcolor=transparent],[hcolor=transparent]:hover{background-color:initial}[border=transparent]{border:1px solid #0000}[color=c0]{color:#a566a5}[bgcolor=c0],[hcolor=c0]:hover{background-color:#a566a5}[border=c0]{border:1px solid #a566a5}[color=c1]{color:#c7ab82}[bgcolor=c1],[hcolor=c1]:hover{background-color:#c7ab82}[border=c1]{border:1px solid #c7ab82}[color=c2]{color:#f2713c}[bgcolor=c2],[hcolor=c2]:hover{background-color:#f2713c}[border=c2]{border:1px solid #f2713c}[color=c3]{color:#ffd006}[bgcolor=c3],[hcolor=c3]:hover{background-color:#ffd006}[border=c3]{border:1px solid #ffd006}[color=c4]{color:#94c5aa}[bgcolor=c4],[hcolor=c4]:hover{background-color:#94c5aa}[border=c4]{border:1px solid #94c5aa}[color=c5]{color:#2a9d8f}[bgcolor=c5],[hcolor=c5]:hover{background-color:#2a9d8f}[border=c5]{border:1px solid #2a9d8f}[color=c6]{color:#78acd8}[bgcolor=c6],[hcolor=c6]:hover{background-color:#78acd8}[border=c6]{border:1px solid #78acd8}[color=c7]{color:#525a9e}[bgcolor=c7],[hcolor=c7]:hover{background-color:#525a9e}[border=c7]{border:1px solid #525a9e}[color=c8]{color:#6a2459}[bgcolor=c8],[hcolor=c8]:hover{background-color:#6a2459}[border=c8]{border:1px solid #6a2459}[color=c9]{color:#74729e}[bgcolor=c9],[hcolor=c9]:hover{background-color:#74729e}[border=c9]{border:1px solid #74729e}.snackbar-content{display:flex;margin-top:4px}.snackbar-content .snackbar-close{margin-top:2px;margin-left:32px;cursor:pointer;color:#d6dae0}.snackbar-content .snackbar-text{flex:1}:host-context(.warning) .snackbar-content .snackbar-close{color:#858fa1}"]
-            },] }
-];
-/** @nocollapse */
-SnackBarComponent.ctorParameters = () => [
-    { type: MatSnackBarRef },
-    { type: undefined, decorators: [{ type: Inject, args: [MAT_SNACK_BAR_DATA,] }] }
-];
-
-class PaginatorComponent {
-    constructor() {
-        this.itemCount = 0;
-        this.itemCountPerPage = 10;
-        this.edgeSize = 5;
-        this.middleSize = 3;
-        this.currentPageIndex = 0;
-        this.currentPageIndexChange = new EventEmitter();
-        this.pageCount = 0;
-        this.firstPageDisplayed = true;
-        this.lastPageDisplayed = true;
-    }
-    ngOnChanges(changes) {
-        // make sure middle size is an odd number
-        if (changes.middleSize && this.middleSize % 2 === 0) {
-            this.middleSize++;
-        }
-        if (this.itemCountPerPage && (changes.itemCount || changes.itemCountPerPage) || changes.currentPageIndex) {
-            this.pageCount = Math.ceil(this.itemCount / this.itemCountPerPage);
-            // make sure page index is between min and max page index
-            this.currentPageIndex = Math.max(0, Math.min(this.pageCount - 1, this.currentPageIndex));
-            this.firstPageDisplayed = this.currentPageIndex === 0;
-            this.lastPageDisplayed = this.currentPageIndex === this.pageCount - 1;
-        }
-    }
-    onSelectPage(pageIndex) {
-        this.currentPageIndexChange.emit(pageIndex);
-    }
-}
-PaginatorComponent.decorators = [
-    { type: Component, args: [{
-                selector: 'ap-paginator',
-                template: "<div class=\"item-index-overview\">\n    {{(currentPageIndex * itemCountPerPage) + 1}}\n    -{{lastPageDisplayed ? itemCount : (currentPageIndex + 1) * itemCountPerPage}}\n    of {{itemCount}}\n</div>\n\n<div class=\"pages\">\n    <button class=\"square\"\n            mat-flat-button\n            [disabled]=\"firstPageDisplayed\"\n            (click)=\"onSelectPage(currentPageIndex - 1)\">\n        <ap-symbol symbolId=\"arrow-left-1\"></ap-symbol>\n    </button>\n    <ng-container *ngIf=\"pageCount > edgeSize + 1; else allPagesDisplayed\">\n        <ng-container *ngIf=\"currentPageIndex >= edgeSize - 1; else oneOfFirstPagesDisplayed\">\n            <ng-container *ngIf=\"currentPageIndex <= pageCount - edgeSize; else oneOfLastPagesDisplayed\">\n                <ap-paginator-button [pageIndex]=\"0\"\n                                     [selectedPageIndex]=\"currentPageIndex\"\n                                     (selectPage)=\"onSelectPage($event)\">\n                </ap-paginator-button>\n                <span class=\"ellipsis\">...</span>\n                <ng-container *ngFor=\"let dummy of [].constructor(middleSize); let i = index\">\n                    <ap-paginator-button [pageIndex]=\"currentPageIndex + i - (middleSize - 1) / 2\"\n                                         [selectedPageIndex]=\"currentPageIndex\"\n                                         (selectPage)=\"onSelectPage($event)\">\n                    </ap-paginator-button>\n                </ng-container>\n                <span class=\"ellipsis\">...</span>\n                <ap-paginator-button [pageIndex]=\"pageCount - 1\"\n                                     [selectedPageIndex]=\"currentPageIndex\"\n                                     (selectPage)=\"onSelectPage($event)\">\n                </ap-paginator-button>\n            </ng-container>\n        </ng-container>\n        <ng-template #oneOfFirstPagesDisplayed>\n            <ng-container *ngFor=\"let dummy of [].constructor(edgeSize); let i = index\">\n                <ap-paginator-button [pageIndex]=\"i\"\n                                     [selectedPageIndex]=\"currentPageIndex\"\n                                     (selectPage)=\"onSelectPage($event)\">\n                </ap-paginator-button>\n            </ng-container>\n            <span class=\"ellipsis\">...</span>\n            <ap-paginator-button [pageIndex]=\"pageCount - 1\"\n                                 [selectedPageIndex]=\"currentPageIndex\"\n                                 (selectPage)=\"onSelectPage($event)\">\n            </ap-paginator-button>\n        </ng-template>\n        <ng-template #oneOfLastPagesDisplayed>\n            <ap-paginator-button [pageIndex]=\"0\"\n                                 [selectedPageIndex]=\"currentPageIndex\"\n                                 (selectPage)=\"onSelectPage($event)\">\n            </ap-paginator-button>\n            <span class=\"ellipsis\">...</span>\n            <ng-container *ngFor=\"let dummy of [].constructor(edgeSize); let i = index\">\n                <ap-paginator-button [pageIndex]=\"pageCount - edgeSize + i\"\n                                     [selectedPageIndex]=\"currentPageIndex\"\n                                     (selectPage)=\"onSelectPage($event)\">\n                </ap-paginator-button>\n            </ng-container>\n        </ng-template>\n    </ng-container>\n    <ng-template #allPagesDisplayed>\n        <ng-container *ngFor=\"let dummy of [].constructor(pageCount); let i = index\">\n            <ap-paginator-button [pageIndex]=\"i\"\n                                 [selectedPageIndex]=\"currentPageIndex\"\n                                 (selectPage)=\"onSelectPage($event)\">\n            </ap-paginator-button>\n        </ng-container>\n    </ng-template>\n    <button class=\"square\"\n            mat-flat-button\n            [disabled]=\"lastPageDisplayed\"\n            (click)=\"onSelectPage(currentPageIndex + 1)\">\n        <ap-symbol symbolId=\"arrow-right-1\"></ap-symbol>\n    </button>\n</div>\n",
-                changeDetection: ChangeDetectionStrategy.OnPush,
-                styles: ["[color=facebook]{color:#1877f2}[bgcolor=facebook],[hcolor=facebook]:hover{background-color:#1877f2}[border=facebook]{border:1px solid #1877f2}[color=google]{color:#4e85e8}[bgcolor=google],[hcolor=google]:hover{background-color:#4e85e8}[border=google]{border:1px solid #4e85e8}[color=instagram]{color:#e1306c}[bgcolor=instagram],[hcolor=instagram]:hover{background-color:#e1306c}[border=instagram]{border:1px solid #e1306c}[color=instagrammagenta]{color:#c13584}[bgcolor=instagrammagenta],[hcolor=instagrammagenta]:hover{background-color:#c13584}[border=instagrammagenta]{border:1px solid #c13584}[color=instagramblue]{color:#5851db}[bgcolor=instagramblue],[hcolor=instagramblue]:hover{background-color:#5851db}[border=instagramblue]{border:1px solid #5851db}[color=instagrampurple]{color:#833ab4}[bgcolor=instagrampurple],[hcolor=instagrampurple]:hover{background-color:#833ab4}[border=instagrampurple]{border:1px solid #833ab4}[color=instagramorange]{color:#f56040}[bgcolor=instagramorange],[hcolor=instagramorange]:hover{background-color:#f56040}[border=instagramorange]{border:1px solid #f56040}[color=instagramyellow]{color:#ffdc80}[bgcolor=instagramyellow],[hcolor=instagramyellow]:hover{background-color:#ffdc80}[border=instagramyellow]{border:1px solid #ffdc80}[color=linkedin]{color:#2c67bc}[bgcolor=linkedin],[hcolor=linkedin]:hover{background-color:#2c67bc}[border=linkedin]{border:1px solid #2c67bc}[color=twitter]{color:#55acee}[bgcolor=twitter],[hcolor=twitter]:hover{background-color:#55acee}[border=twitter]{border:1px solid #55acee}[color=youtube]{color:red}[bgcolor=youtube],[hcolor=youtube]:hover{background-color:red}[border=youtube]{border:1px solid red}[color=blood-orange]{color:#ff4d00}[bgcolor=blood-orange],[hcolor=blood-orange]:hover{background-color:#ff4d00}[border=blood-orange]{border:1px solid #ff4d00}[color=pinkish-orange]{color:#ff7b49}[bgcolor=pinkish-orange],[hcolor=pinkish-orange]:hover{background-color:#ff7b49}[border=pinkish-orange]{border:1px solid #ff7b49}[color=charcoal-grey]{color:#2a2f34}[bgcolor=charcoal-grey],[hcolor=charcoal-grey]:hover{background-color:#2a2f34}[border=charcoal-grey]{border:1px solid #2a2f34}[color=azure]{color:#00aeef}[bgcolor=azure],[hcolor=azure]:hover{background-color:#00aeef}[border=azure]{border:1px solid #00aeef}[color=light-azure]{color:#eaf5fd}[bgcolor=light-azure],[hcolor=light-azure]:hover{background-color:#eaf5fd}[border=light-azure]{border:1px solid #eaf5fd}[color=blue-grey]{color:#8d98a9}[bgcolor=blue-grey],[hcolor=blue-grey]:hover{background-color:#8d98a9}[border=blue-grey]{border:1px solid #8d98a9}[color=silver]{color:#ced0da}[bgcolor=silver],[hcolor=silver]:hover{background-color:#ced0da}[border=silver]{border:1px solid #ced0da}[color=pale-grey]{color:#dfe3e9}[bgcolor=pale-grey],[hcolor=pale-grey]:hover{background-color:#dfe3e9}[border=pale-grey]{border:1px solid #dfe3e9}[color=grey-white]{color:#f5f7f8}[bgcolor=grey-white],[hcolor=grey-white]:hover{background-color:#f5f7f8}[border=grey-white]{border:1px solid #f5f7f8}[color=cool-grey]{color:#b4bbc6}[bgcolor=cool-grey],[hcolor=cool-grey]:hover{background-color:#b4bbc6}[border=cool-grey]{border:1px solid #b4bbc6}[color=black]{color:#344563}[bgcolor=black],[hcolor=black]:hover{background-color:#344563}[border=black]{border:1px solid #344563}[color=grey-blue]{color:#68768c}[bgcolor=grey-blue],[hcolor=grey-blue]:hover{background-color:#68768c}[border=grey-blue]{border:1px solid #68768c}[color=strawberry]{color:#f4282d}[bgcolor=strawberry],[hcolor=strawberry]:hover{background-color:#f4282d}[border=strawberry]{border:1px solid #f4282d}[color=light-strawberry]{color:#f8eded}[bgcolor=light-strawberry],[hcolor=light-strawberry]:hover{background-color:#f8eded}[border=light-strawberry]{border:1px solid #f8eded}[color=white]{color:#fff}[bgcolor=white],[hcolor=white]:hover{background-color:#fff}[border=white]{border:1px solid #fff}[color=cool-green]{color:#33c15d}[bgcolor=cool-green],[hcolor=cool-green]:hover{background-color:#33c15d}[border=cool-green]{border:1px solid #33c15d}[color=light-green]{color:#ebfaef}[bgcolor=light-green],[hcolor=light-green]:hover{background-color:#ebfaef}[border=light-green]{border:1px solid #ebfaef}[color=transparent]{color:#0000}[bgcolor=transparent],[hcolor=transparent]:hover{background-color:initial}[border=transparent]{border:1px solid #0000}[color=c0]{color:#a566a5}[bgcolor=c0],[hcolor=c0]:hover{background-color:#a566a5}[border=c0]{border:1px solid #a566a5}[color=c1]{color:#c7ab82}[bgcolor=c1],[hcolor=c1]:hover{background-color:#c7ab82}[border=c1]{border:1px solid #c7ab82}[color=c2]{color:#f2713c}[bgcolor=c2],[hcolor=c2]:hover{background-color:#f2713c}[border=c2]{border:1px solid #f2713c}[color=c3]{color:#ffd006}[bgcolor=c3],[hcolor=c3]:hover{background-color:#ffd006}[border=c3]{border:1px solid #ffd006}[color=c4]{color:#94c5aa}[bgcolor=c4],[hcolor=c4]:hover{background-color:#94c5aa}[border=c4]{border:1px solid #94c5aa}[color=c5]{color:#2a9d8f}[bgcolor=c5],[hcolor=c5]:hover{background-color:#2a9d8f}[border=c5]{border:1px solid #2a9d8f}[color=c6]{color:#78acd8}[bgcolor=c6],[hcolor=c6]:hover{background-color:#78acd8}[border=c6]{border:1px solid #78acd8}[color=c7]{color:#525a9e}[bgcolor=c7],[hcolor=c7]:hover{background-color:#525a9e}[border=c7]{border:1px solid #525a9e}[color=c8]{color:#6a2459}[bgcolor=c8],[hcolor=c8]:hover{background-color:#6a2459}[border=c8]{border:1px solid #6a2459}[color=c9]{color:#74729e}[bgcolor=c9],[hcolor=c9]:hover{background-color:#74729e}[border=c9]{border:1px solid #74729e}.item-index-overview{position:absolute;line-height:36px}.pages{display:flex;justify-content:center;color:#178dfe}.pages ap-paginator-button,.pages button.mat-flat-button{vertical-align:middle}.pages button.mat-flat-button:not(.mat-accent):not([disabled]){color:#178dfe}.pages button.mat-flat-button:not(.mat-accent):not([disabled]):hover{background-color:#e8f4ff}.pages .ellipsis{display:inline-block;width:36px;line-height:36px;text-align:center;vertical-align:bottom}"]
-            },] }
-];
-PaginatorComponent.propDecorators = {
-    itemCount: [{ type: Input }],
-    itemCountPerPage: [{ type: Input }],
-    edgeSize: [{ type: Input }],
-    middleSize: [{ type: Input }],
-    currentPageIndex: [{ type: Input }],
-    currentPageIndexChange: [{ type: Output }]
-};
-
-class PaginatorButtonComponent {
-    constructor() {
-        this.pageIndex = 0;
-        this.selectedPageIndex = 0;
-        this.selectPage = new EventEmitter();
-    }
-}
-PaginatorButtonComponent.decorators = [
-    { type: Component, args: [{
-                selector: 'ap-paginator-button',
-                template: "<button class=\"square\"\n        mat-flat-button\n        [color]=\"selectedPageIndex === pageIndex ? 'accent' : undefined\"\n        (click)=\" selectPage.emit(pageIndex)\">\n    {{pageIndex + 1}}\n</button>\n",
-                changeDetection: ChangeDetectionStrategy.OnPush,
-                styles: ["[color=facebook]{color:#1877f2}[bgcolor=facebook],[hcolor=facebook]:hover{background-color:#1877f2}[border=facebook]{border:1px solid #1877f2}[color=google]{color:#4e85e8}[bgcolor=google],[hcolor=google]:hover{background-color:#4e85e8}[border=google]{border:1px solid #4e85e8}[color=instagram]{color:#e1306c}[bgcolor=instagram],[hcolor=instagram]:hover{background-color:#e1306c}[border=instagram]{border:1px solid #e1306c}[color=instagrammagenta]{color:#c13584}[bgcolor=instagrammagenta],[hcolor=instagrammagenta]:hover{background-color:#c13584}[border=instagrammagenta]{border:1px solid #c13584}[color=instagramblue]{color:#5851db}[bgcolor=instagramblue],[hcolor=instagramblue]:hover{background-color:#5851db}[border=instagramblue]{border:1px solid #5851db}[color=instagrampurple]{color:#833ab4}[bgcolor=instagrampurple],[hcolor=instagrampurple]:hover{background-color:#833ab4}[border=instagrampurple]{border:1px solid #833ab4}[color=instagramorange]{color:#f56040}[bgcolor=instagramorange],[hcolor=instagramorange]:hover{background-color:#f56040}[border=instagramorange]{border:1px solid #f56040}[color=instagramyellow]{color:#ffdc80}[bgcolor=instagramyellow],[hcolor=instagramyellow]:hover{background-color:#ffdc80}[border=instagramyellow]{border:1px solid #ffdc80}[color=linkedin]{color:#2c67bc}[bgcolor=linkedin],[hcolor=linkedin]:hover{background-color:#2c67bc}[border=linkedin]{border:1px solid #2c67bc}[color=twitter]{color:#55acee}[bgcolor=twitter],[hcolor=twitter]:hover{background-color:#55acee}[border=twitter]{border:1px solid #55acee}[color=youtube]{color:red}[bgcolor=youtube],[hcolor=youtube]:hover{background-color:red}[border=youtube]{border:1px solid red}[color=blood-orange]{color:#ff4d00}[bgcolor=blood-orange],[hcolor=blood-orange]:hover{background-color:#ff4d00}[border=blood-orange]{border:1px solid #ff4d00}[color=pinkish-orange]{color:#ff7b49}[bgcolor=pinkish-orange],[hcolor=pinkish-orange]:hover{background-color:#ff7b49}[border=pinkish-orange]{border:1px solid #ff7b49}[color=charcoal-grey]{color:#2a2f34}[bgcolor=charcoal-grey],[hcolor=charcoal-grey]:hover{background-color:#2a2f34}[border=charcoal-grey]{border:1px solid #2a2f34}[color=azure]{color:#00aeef}[bgcolor=azure],[hcolor=azure]:hover{background-color:#00aeef}[border=azure]{border:1px solid #00aeef}[color=light-azure]{color:#eaf5fd}[bgcolor=light-azure],[hcolor=light-azure]:hover{background-color:#eaf5fd}[border=light-azure]{border:1px solid #eaf5fd}[color=blue-grey]{color:#8d98a9}[bgcolor=blue-grey],[hcolor=blue-grey]:hover{background-color:#8d98a9}[border=blue-grey]{border:1px solid #8d98a9}[color=silver]{color:#ced0da}[bgcolor=silver],[hcolor=silver]:hover{background-color:#ced0da}[border=silver]{border:1px solid #ced0da}[color=pale-grey]{color:#dfe3e9}[bgcolor=pale-grey],[hcolor=pale-grey]:hover{background-color:#dfe3e9}[border=pale-grey]{border:1px solid #dfe3e9}[color=grey-white]{color:#f5f7f8}[bgcolor=grey-white],[hcolor=grey-white]:hover{background-color:#f5f7f8}[border=grey-white]{border:1px solid #f5f7f8}[color=cool-grey]{color:#b4bbc6}[bgcolor=cool-grey],[hcolor=cool-grey]:hover{background-color:#b4bbc6}[border=cool-grey]{border:1px solid #b4bbc6}[color=black]{color:#344563}[bgcolor=black],[hcolor=black]:hover{background-color:#344563}[border=black]{border:1px solid #344563}[color=grey-blue]{color:#68768c}[bgcolor=grey-blue],[hcolor=grey-blue]:hover{background-color:#68768c}[border=grey-blue]{border:1px solid #68768c}[color=strawberry]{color:#f4282d}[bgcolor=strawberry],[hcolor=strawberry]:hover{background-color:#f4282d}[border=strawberry]{border:1px solid #f4282d}[color=light-strawberry]{color:#f8eded}[bgcolor=light-strawberry],[hcolor=light-strawberry]:hover{background-color:#f8eded}[border=light-strawberry]{border:1px solid #f8eded}[color=white]{color:#fff}[bgcolor=white],[hcolor=white]:hover{background-color:#fff}[border=white]{border:1px solid #fff}[color=cool-green]{color:#33c15d}[bgcolor=cool-green],[hcolor=cool-green]:hover{background-color:#33c15d}[border=cool-green]{border:1px solid #33c15d}[color=light-green]{color:#ebfaef}[bgcolor=light-green],[hcolor=light-green]:hover{background-color:#ebfaef}[border=light-green]{border:1px solid #ebfaef}[color=transparent]{color:#0000}[bgcolor=transparent],[hcolor=transparent]:hover{background-color:initial}[border=transparent]{border:1px solid #0000}[color=c0]{color:#a566a5}[bgcolor=c0],[hcolor=c0]:hover{background-color:#a566a5}[border=c0]{border:1px solid #a566a5}[color=c1]{color:#c7ab82}[bgcolor=c1],[hcolor=c1]:hover{background-color:#c7ab82}[border=c1]{border:1px solid #c7ab82}[color=c2]{color:#f2713c}[bgcolor=c2],[hcolor=c2]:hover{background-color:#f2713c}[border=c2]{border:1px solid #f2713c}[color=c3]{color:#ffd006}[bgcolor=c3],[hcolor=c3]:hover{background-color:#ffd006}[border=c3]{border:1px solid #ffd006}[color=c4]{color:#94c5aa}[bgcolor=c4],[hcolor=c4]:hover{background-color:#94c5aa}[border=c4]{border:1px solid #94c5aa}[color=c5]{color:#2a9d8f}[bgcolor=c5],[hcolor=c5]:hover{background-color:#2a9d8f}[border=c5]{border:1px solid #2a9d8f}[color=c6]{color:#78acd8}[bgcolor=c6],[hcolor=c6]:hover{background-color:#78acd8}[border=c6]{border:1px solid #78acd8}[color=c7]{color:#525a9e}[bgcolor=c7],[hcolor=c7]:hover{background-color:#525a9e}[border=c7]{border:1px solid #525a9e}[color=c8]{color:#6a2459}[bgcolor=c8],[hcolor=c8]:hover{background-color:#6a2459}[border=c8]{border:1px solid #6a2459}[color=c9]{color:#74729e}[bgcolor=c9],[hcolor=c9]:hover{background-color:#74729e}[border=c9]{border:1px solid #74729e}button.mat-flat-button{color:#178dfe}button.mat-flat-button:not(.mat-accent):not([disabled]):hover{background-color:#e8f4ff}"]
-            },] }
-];
-PaginatorButtonComponent.propDecorators = {
-    pageIndex: [{ type: Input }],
-    selectedPageIndex: [{ type: Input }],
-    selectPage: [{ type: Output }]
-};
-
-class PhoneNumberInputComponent {
-    constructor() {
-        this.changePhoneNumber = new EventEmitter();
-        this.changePhoneNumberCode = new EventEmitter();
-        this.currentPhoneNumberCode = '';
-        this.currentPhoneNumber = '';
-        this.codeValid = false;
-        this.numberValid = false;
-        this.valid = false;
-        this.onTouched = () => { };
-        this.onChanged = () => { };
-    }
-    set phoneNumber(phoneNumber) {
-        this.updatePhone(undefined, phoneNumber, false);
-    }
-    set phoneNumberCode(phoneNumberCode) {
-        this.updatePhone(phoneNumberCode, undefined, false);
-    }
-    ngOnChanges(changes) {
-        this.checkValidation();
-    }
-    ngOnInit() {
-        this.checkValidation();
-    }
-    filterChars(event) {
-        const pattern = /[0-9]/;
-        const inputChar = String.fromCharCode(event.charCode);
-        if (!pattern.test(inputChar)) {
-            event.preventDefault();
-        }
-    }
-    onChangePhoneNumberCode(code) {
-        this.updatePhone(code, undefined);
-    }
-    onChangePhoneNumber(phoneNumber) {
-        this.updatePhone(undefined, phoneNumber);
-    }
-    updatePhone(code, phoneNumber, emitOnChange = true) {
-        let updated = false;
-        if (code !== undefined && code !== this.currentPhoneNumberCode) {
-            this.currentPhoneNumberCode = code;
-            this.changePhoneNumberCode.emit(code);
-            updated = true;
-        }
-        if (phoneNumber !== undefined && phoneNumber !== this.currentPhoneNumber) {
-            this.currentPhoneNumber = phoneNumber;
-            this.changePhoneNumber.emit(phoneNumber);
-            updated = true;
-        }
-        if (updated) {
-            this.checkValidation();
-            if (emitOnChange) {
-                this.onChanged({
-                    phoneNumber: this.currentPhoneNumber,
-                    phoneNumberCode: this.currentPhoneNumberCode
-                });
-            }
-        }
-    }
-    registerOnChange(fn) {
-        this.onChanged = fn;
-    }
-    registerOnTouched(fn) {
-        this.onTouched = fn;
-    }
-    validate(control) {
-        return (!this.required || this.valid) ? null : { phoneNumber: 'invalid' };
-    }
-    writeValue(phone) {
-        if (!phone) {
-            this.updatePhone('', '', false);
-        }
-        else if ('phoneNumber' in phone && 'phoneNumberCode' in phone) {
-            this.updatePhone(phone.phoneNumberCode, phone.phoneNumber, false);
-        }
-        else {
-            console.error('Phone number input ignored, wrong format: ' + JSON.stringify(phone));
-        }
-    }
-    phoneNumberCodeSearchFn(term, item) {
-        term = term.toLocaleLowerCase();
-        return item.countryName.toLocaleLowerCase().indexOf(term) > -1 || item.phoneNumberCode.toLocaleLowerCase().indexOf(term) > -1;
-    }
-    checkValidation() {
-        this.codeValid = !this.required || (this.currentPhoneNumberCode && this.currentPhoneNumberCode.length > 0);
-        this.numberValid = !this.required || (this.currentPhoneNumber && this.currentPhoneNumber.length > 0);
-        this.valid = this.codeValid && this.numberValid;
-    }
-}
-PhoneNumberInputComponent.decorators = [
-    { type: Component, args: [{
-                selector: 'ap-phone-number-input',
-                template: "<div class=\"main-container\">\n    <ng-select\n        #phoneNumberCodeInput=\"ngModel\"\n        name=\"phoneNumberCodeInput\"\n        class=\"phone-select\"\n        [ngClass]=\"{ 'invalid': (!codeValid) && (submitted || phoneNumberCodeInput.touched), 'valid' : statusOk && codeValid && phoneNumberCodeInput.touched}\"\n        [items]=\"phoneNumberInfos\"\n        bindLabel=\"countryName\"\n        bindValue=\"phoneNumberCode\"\n        [clearable]=\"false\"\n        [searchable]=\"true\"\n        [searchFn]=\"phoneNumberCodeSearchFn\"\n        (ngModelChange)=\"onChangePhoneNumberCode($event)\"\n        (focusin)=\"this.onTouched()\"\n        [ngModel]=\"currentPhoneNumberCode\">\n        <ng-template\n            ng-label-tmp\n            let-item=\"item\">\n            <div\n                *ngIf=\"item && item.countryCode\"\n                class=\"flag\">\n                <img *ngIf=\"!!flagsBucketUrl\" [src]=\"flagsBucketUrl+'/' + item.countryCode.toUpperCase() + '.png'\" width=\"24\" alt=\"flag\">\n                <span *ngIf=\"!flagsBucketUrl\">{{ item.countryCode }}</span>\n            </div>\n        </ng-template>\n        <ng-template\n            ng-option-tmp\n            let-item=\"item\">\n            <div> {{ item.countryName }} - {{item.phoneNumberCode}}</div>\n        </ng-template>\n    </ng-select>\n    <div\n        class=\"code-container\"\n        [ngClass]=\"{ 'invalid': (!numberValid) && (submitted || phoneNumberInput.touched), 'valid' : statusOk && numberValid && phoneNumberInput.touched }\">\n        <span *ngIf=\"currentPhoneNumberCode\">\n            ({{currentPhoneNumberCode}})\n        </span>\n    </div>\n    <div\n        class=\"separator-container\"\n        [ngClass]=\"{ 'invalid': (!numberValid) && (submitted || phoneNumberInput.touched), 'valid' : statusOk && numberValid && phoneNumberInput.touched }\">\n        <div class=\"separator\"></div>\n    </div>\n    <div\n        class=\"input-wrapper\"\n        [ngClass]=\"{ 'invalid': (!numberValid) && (submitted || phoneNumberInput.touched), 'valid' : statusOk && numberValid && phoneNumberInput.touched}\">\n        <input\n            #phoneNumberInput=\"ngModel\"\n            name=\"phoneNumberInput\"\n            type=\"tel\"\n            data-recurly=\"phone\"\n            class=\"flex-2 phone-field\"\n            [ngModel]=\"currentPhoneNumber\"\n            (keypress)=\"filterChars($event)\"\n            (ngModelChange)=\"onChangePhoneNumber($event)\"\n            (focusin)=\"onTouched()\">\n    </div>\n</div>\n<div class=\"form-field-message invalid\"\n     [hidden]=\"!(!valid && (submitted || phoneNumberInput.touched))\">\n    {{ requiredLabel }}\n</div>\n",
-                providers: [
-                    {
-                        provide: NG_VALUE_ACCESSOR,
-                        useExisting: forwardRef(() => PhoneNumberInputComponent),
-                        multi: true
-                    },
-                    {
-                        provide: NG_VALIDATORS,
-                        useExisting: forwardRef(() => PhoneNumberInputComponent),
-                        multi: true
-                    }
-                ],
-                styles: ["[color=facebook]{color:#1877f2}[bgcolor=facebook],[hcolor=facebook]:hover{background-color:#1877f2}[border=facebook]{border:1px solid #1877f2}[color=google]{color:#4e85e8}[bgcolor=google],[hcolor=google]:hover{background-color:#4e85e8}[border=google]{border:1px solid #4e85e8}[color=instagram]{color:#e1306c}[bgcolor=instagram],[hcolor=instagram]:hover{background-color:#e1306c}[border=instagram]{border:1px solid #e1306c}[color=instagrammagenta]{color:#c13584}[bgcolor=instagrammagenta],[hcolor=instagrammagenta]:hover{background-color:#c13584}[border=instagrammagenta]{border:1px solid #c13584}[color=instagramblue]{color:#5851db}[bgcolor=instagramblue],[hcolor=instagramblue]:hover{background-color:#5851db}[border=instagramblue]{border:1px solid #5851db}[color=instagrampurple]{color:#833ab4}[bgcolor=instagrampurple],[hcolor=instagrampurple]:hover{background-color:#833ab4}[border=instagrampurple]{border:1px solid #833ab4}[color=instagramorange]{color:#f56040}[bgcolor=instagramorange],[hcolor=instagramorange]:hover{background-color:#f56040}[border=instagramorange]{border:1px solid #f56040}[color=instagramyellow]{color:#ffdc80}[bgcolor=instagramyellow],[hcolor=instagramyellow]:hover{background-color:#ffdc80}[border=instagramyellow]{border:1px solid #ffdc80}[color=linkedin]{color:#2c67bc}[bgcolor=linkedin],[hcolor=linkedin]:hover{background-color:#2c67bc}[border=linkedin]{border:1px solid #2c67bc}[color=twitter]{color:#55acee}[bgcolor=twitter],[hcolor=twitter]:hover{background-color:#55acee}[border=twitter]{border:1px solid #55acee}[color=youtube]{color:red}[bgcolor=youtube],[hcolor=youtube]:hover{background-color:red}[border=youtube]{border:1px solid red}[color=blood-orange]{color:#ff4d00}[bgcolor=blood-orange],[hcolor=blood-orange]:hover{background-color:#ff4d00}[border=blood-orange]{border:1px solid #ff4d00}[color=pinkish-orange]{color:#ff7b49}[bgcolor=pinkish-orange],[hcolor=pinkish-orange]:hover{background-color:#ff7b49}[border=pinkish-orange]{border:1px solid #ff7b49}[color=charcoal-grey]{color:#2a2f34}[bgcolor=charcoal-grey],[hcolor=charcoal-grey]:hover{background-color:#2a2f34}[border=charcoal-grey]{border:1px solid #2a2f34}[color=azure]{color:#00aeef}[bgcolor=azure],[hcolor=azure]:hover{background-color:#00aeef}[border=azure]{border:1px solid #00aeef}[color=light-azure]{color:#eaf5fd}[bgcolor=light-azure],[hcolor=light-azure]:hover{background-color:#eaf5fd}[border=light-azure]{border:1px solid #eaf5fd}[color=blue-grey]{color:#8d98a9}[bgcolor=blue-grey],[hcolor=blue-grey]:hover{background-color:#8d98a9}[border=blue-grey]{border:1px solid #8d98a9}[color=silver]{color:#ced0da}[bgcolor=silver],[hcolor=silver]:hover{background-color:#ced0da}[border=silver]{border:1px solid #ced0da}[color=pale-grey]{color:#dfe3e9}[bgcolor=pale-grey],[hcolor=pale-grey]:hover{background-color:#dfe3e9}[border=pale-grey]{border:1px solid #dfe3e9}[color=grey-white]{color:#f5f7f8}[bgcolor=grey-white],[hcolor=grey-white]:hover{background-color:#f5f7f8}[border=grey-white]{border:1px solid #f5f7f8}[color=cool-grey]{color:#b4bbc6}[bgcolor=cool-grey],[hcolor=cool-grey]:hover{background-color:#b4bbc6}[border=cool-grey]{border:1px solid #b4bbc6}[color=black]{color:#344563}[bgcolor=black],[hcolor=black]:hover{background-color:#344563}[border=black]{border:1px solid #344563}[color=grey-blue]{color:#68768c}[bgcolor=grey-blue],[hcolor=grey-blue]:hover{background-color:#68768c}[border=grey-blue]{border:1px solid #68768c}[color=strawberry]{color:#f4282d}[bgcolor=strawberry],[hcolor=strawberry]:hover{background-color:#f4282d}[border=strawberry]{border:1px solid #f4282d}[color=light-strawberry]{color:#f8eded}[bgcolor=light-strawberry],[hcolor=light-strawberry]:hover{background-color:#f8eded}[border=light-strawberry]{border:1px solid #f8eded}[color=white]{color:#fff}[bgcolor=white],[hcolor=white]:hover{background-color:#fff}[border=white]{border:1px solid #fff}[color=cool-green]{color:#33c15d}[bgcolor=cool-green],[hcolor=cool-green]:hover{background-color:#33c15d}[border=cool-green]{border:1px solid #33c15d}[color=light-green]{color:#ebfaef}[bgcolor=light-green],[hcolor=light-green]:hover{background-color:#ebfaef}[border=light-green]{border:1px solid #ebfaef}[color=transparent]{color:#0000}[bgcolor=transparent],[hcolor=transparent]:hover{background-color:initial}[border=transparent]{border:1px solid #0000}[color=c0]{color:#a566a5}[bgcolor=c0],[hcolor=c0]:hover{background-color:#a566a5}[border=c0]{border:1px solid #a566a5}[color=c1]{color:#c7ab82}[bgcolor=c1],[hcolor=c1]:hover{background-color:#c7ab82}[border=c1]{border:1px solid #c7ab82}[color=c2]{color:#f2713c}[bgcolor=c2],[hcolor=c2]:hover{background-color:#f2713c}[border=c2]{border:1px solid #f2713c}[color=c3]{color:#ffd006}[bgcolor=c3],[hcolor=c3]:hover{background-color:#ffd006}[border=c3]{border:1px solid #ffd006}[color=c4]{color:#94c5aa}[bgcolor=c4],[hcolor=c4]:hover{background-color:#94c5aa}[border=c4]{border:1px solid #94c5aa}[color=c5]{color:#2a9d8f}[bgcolor=c5],[hcolor=c5]:hover{background-color:#2a9d8f}[border=c5]{border:1px solid #2a9d8f}[color=c6]{color:#78acd8}[bgcolor=c6],[hcolor=c6]:hover{background-color:#78acd8}[border=c6]{border:1px solid #78acd8}[color=c7]{color:#525a9e}[bgcolor=c7],[hcolor=c7]:hover{background-color:#525a9e}[border=c7]{border:1px solid #525a9e}[color=c8]{color:#6a2459}[bgcolor=c8],[hcolor=c8]:hover{background-color:#6a2459}[border=c8]{border:1px solid #6a2459}[color=c9]{color:#74729e}[bgcolor=c9],[hcolor=c9]:hover{background-color:#74729e}[border=c9]{border:1px solid #74729e}.main-container{display:flex}.main-container div.code-container{border-top:1px solid #d6dae0;border-left:1px solid #d6dae0;border-bottom:1px solid #d6dae0;border-right-width:0;border-top-left-radius:4px;border-bottom-left-radius:4px;color:#344563;flex:1 0 auto;display:flex;font-weight:400;font-size:14px;justify-content:center;margin-left:8px;min-width:32px;padding:8px 0 8px 16px;text-align:center;background-color:#fff}.main-container div.code-container.invalid{border-top-color:#e81313;border-left-color:#e81313;border-bottom-color:#e81313}.main-container div.code-container.valid{border-top-color:#45b854;border-left-color:#45b854;border-bottom-color:#45b854}.main-container div.code-container span{margin-top:auto;margin-bottom:auto}.main-container div.separator-container{display:flex;flex-direction:column;justify-content:center;align-content:center;background-color:#fff;border-bottom:1px solid #d6dae0;border-top:1px solid #d6dae0;min-height:30px;padding-right:8px;padding-left:6px;width:4px}.main-container div.separator-container.invalid{border-bottom-color:#e81313;border-top-color:#e81313}.main-container div.separator-container.valid{border-bottom-color:#45b854;border-top-color:#45b854}.main-container div.separator-container div.separator{border-right:1px solid #f5f5f7;height:16px}.main-container .input-wrapper{background-color:#fff;border-top:1px solid #d6dae0;border-right:1px solid #d6dae0;border-bottom:1px solid #d6dae0;border-left-width:0;border-radius:0 4px 4px 0;padding:8px 0;width:100%}.main-container .input-wrapper.invalid{border-bottom-color:#e81313;border-top-color:#e81313;border-right-color:#e81313}.main-container .input-wrapper.valid{border-bottom-color:#45b854;border-top-color:#45b854;border-right-color:#45b854}.main-container .input-wrapper input.phone-field{border:none;color:#344563;font-style:normal;font-weight:400;font-size:14px;height:100%;padding:0;width:inherit}.main-container .phone-select{flex:1 0 auto;width:70px}.main-container .phone-select ::ng-deep .ng-input{padding:2px 16px}.main-container .phone-select ::ng-deep .ng-dropdown-panel{width:auto}.main-container .phone-select .flag{display:flex}"]
-            },] }
-];
-PhoneNumberInputComponent.propDecorators = {
-    flagsBucketUrl: [{ type: Input }],
-    phoneNumberInfos: [{ type: Input }],
-    phoneNumber: [{ type: Input }],
-    phoneNumberCode: [{ type: Input }],
-    required: [{ type: Input }],
-    requiredLabel: [{ type: Input }],
-    submitted: [{ type: Input }],
-    statusOk: [{ type: Input }],
-    changePhoneNumber: [{ type: Output }],
-    changePhoneNumberCode: [{ type: Output }]
-};
-
-class SlideToggleComponent {
-    constructor() {
-        this._checked = false;
-        this.disabled = false;
-        this.checkedChange = new EventEmitter();
-        this.onTouched = () => {
-        };
-        this.onChanged = () => {
-        };
-    }
-    set checked(status) {
-        this._checked = status;
-        this.onChanged(status);
-    }
-    get checked() {
-        return this._checked;
-    }
-    checkManuallyChange(checked) {
-        if (this._checked !== checked) {
-            this.checkedChange.emit(checked);
-        }
-    }
-    onClick() {
-        if (!this.disabled) {
-            this.checkedChange.emit(!this.checked);
-        }
-    }
-    registerOnChange(fn) {
-        this.onChanged = fn;
-    }
-    registerOnTouched(fn) {
-        this.onTouched = fn;
-    }
-    writeValue(status) {
-        this.checked = status;
-    }
-}
-SlideToggleComponent.decorators = [
-    { type: Component, args: [{
-                selector: 'ap-slide-toggle',
-                template: "<label\n    class=\"switch\"\n    [ngClass]=\"{checked:checked, enabled: !disabled}\"\n    (click)=\"onClick()\">\n    <span\n        [ngClass]=\"{checked:checked}\"\n        class=\"slider\">\n    </span>\n</label>\n",
-                providers: [
-                    {
-                        provide: NG_VALUE_ACCESSOR,
-                        useExisting: forwardRef(() => SlideToggleComponent),
-                        multi: true
-                    }
-                ],
-                styles: ["[color=facebook]{color:#1877f2}[bgcolor=facebook],[hcolor=facebook]:hover{background-color:#1877f2}[border=facebook]{border:1px solid #1877f2}[color=google]{color:#4e85e8}[bgcolor=google],[hcolor=google]:hover{background-color:#4e85e8}[border=google]{border:1px solid #4e85e8}[color=instagram]{color:#e1306c}[bgcolor=instagram],[hcolor=instagram]:hover{background-color:#e1306c}[border=instagram]{border:1px solid #e1306c}[color=instagrammagenta]{color:#c13584}[bgcolor=instagrammagenta],[hcolor=instagrammagenta]:hover{background-color:#c13584}[border=instagrammagenta]{border:1px solid #c13584}[color=instagramblue]{color:#5851db}[bgcolor=instagramblue],[hcolor=instagramblue]:hover{background-color:#5851db}[border=instagramblue]{border:1px solid #5851db}[color=instagrampurple]{color:#833ab4}[bgcolor=instagrampurple],[hcolor=instagrampurple]:hover{background-color:#833ab4}[border=instagrampurple]{border:1px solid #833ab4}[color=instagramorange]{color:#f56040}[bgcolor=instagramorange],[hcolor=instagramorange]:hover{background-color:#f56040}[border=instagramorange]{border:1px solid #f56040}[color=instagramyellow]{color:#ffdc80}[bgcolor=instagramyellow],[hcolor=instagramyellow]:hover{background-color:#ffdc80}[border=instagramyellow]{border:1px solid #ffdc80}[color=linkedin]{color:#2c67bc}[bgcolor=linkedin],[hcolor=linkedin]:hover{background-color:#2c67bc}[border=linkedin]{border:1px solid #2c67bc}[color=twitter]{color:#55acee}[bgcolor=twitter],[hcolor=twitter]:hover{background-color:#55acee}[border=twitter]{border:1px solid #55acee}[color=youtube]{color:red}[bgcolor=youtube],[hcolor=youtube]:hover{background-color:red}[border=youtube]{border:1px solid red}[color=blood-orange]{color:#ff4d00}[bgcolor=blood-orange],[hcolor=blood-orange]:hover{background-color:#ff4d00}[border=blood-orange]{border:1px solid #ff4d00}[color=pinkish-orange]{color:#ff7b49}[bgcolor=pinkish-orange],[hcolor=pinkish-orange]:hover{background-color:#ff7b49}[border=pinkish-orange]{border:1px solid #ff7b49}[color=charcoal-grey]{color:#2a2f34}[bgcolor=charcoal-grey],[hcolor=charcoal-grey]:hover{background-color:#2a2f34}[border=charcoal-grey]{border:1px solid #2a2f34}[color=azure]{color:#00aeef}[bgcolor=azure],[hcolor=azure]:hover{background-color:#00aeef}[border=azure]{border:1px solid #00aeef}[color=light-azure]{color:#eaf5fd}[bgcolor=light-azure],[hcolor=light-azure]:hover{background-color:#eaf5fd}[border=light-azure]{border:1px solid #eaf5fd}[color=blue-grey]{color:#8d98a9}[bgcolor=blue-grey],[hcolor=blue-grey]:hover{background-color:#8d98a9}[border=blue-grey]{border:1px solid #8d98a9}[color=silver]{color:#ced0da}[bgcolor=silver],[hcolor=silver]:hover{background-color:#ced0da}[border=silver]{border:1px solid #ced0da}[color=pale-grey]{color:#dfe3e9}[bgcolor=pale-grey],[hcolor=pale-grey]:hover{background-color:#dfe3e9}[border=pale-grey]{border:1px solid #dfe3e9}[color=grey-white]{color:#f5f7f8}[bgcolor=grey-white],[hcolor=grey-white]:hover{background-color:#f5f7f8}[border=grey-white]{border:1px solid #f5f7f8}[color=cool-grey]{color:#b4bbc6}[bgcolor=cool-grey],[hcolor=cool-grey]:hover{background-color:#b4bbc6}[border=cool-grey]{border:1px solid #b4bbc6}[color=black]{color:#344563}[bgcolor=black],[hcolor=black]:hover{background-color:#344563}[border=black]{border:1px solid #344563}[color=grey-blue]{color:#68768c}[bgcolor=grey-blue],[hcolor=grey-blue]:hover{background-color:#68768c}[border=grey-blue]{border:1px solid #68768c}[color=strawberry]{color:#f4282d}[bgcolor=strawberry],[hcolor=strawberry]:hover{background-color:#f4282d}[border=strawberry]{border:1px solid #f4282d}[color=light-strawberry]{color:#f8eded}[bgcolor=light-strawberry],[hcolor=light-strawberry]:hover{background-color:#f8eded}[border=light-strawberry]{border:1px solid #f8eded}[color=white]{color:#fff}[bgcolor=white],[hcolor=white]:hover{background-color:#fff}[border=white]{border:1px solid #fff}[color=cool-green]{color:#33c15d}[bgcolor=cool-green],[hcolor=cool-green]:hover{background-color:#33c15d}[border=cool-green]{border:1px solid #33c15d}[color=light-green]{color:#ebfaef}[bgcolor=light-green],[hcolor=light-green]:hover{background-color:#ebfaef}[border=light-green]{border:1px solid #ebfaef}[color=transparent]{color:#0000}[bgcolor=transparent],[hcolor=transparent]:hover{background-color:initial}[border=transparent]{border:1px solid #0000}[color=c0]{color:#a566a5}[bgcolor=c0],[hcolor=c0]:hover{background-color:#a566a5}[border=c0]{border:1px solid #a566a5}[color=c1]{color:#c7ab82}[bgcolor=c1],[hcolor=c1]:hover{background-color:#c7ab82}[border=c1]{border:1px solid #c7ab82}[color=c2]{color:#f2713c}[bgcolor=c2],[hcolor=c2]:hover{background-color:#f2713c}[border=c2]{border:1px solid #f2713c}[color=c3]{color:#ffd006}[bgcolor=c3],[hcolor=c3]:hover{background-color:#ffd006}[border=c3]{border:1px solid #ffd006}[color=c4]{color:#94c5aa}[bgcolor=c4],[hcolor=c4]:hover{background-color:#94c5aa}[border=c4]{border:1px solid #94c5aa}[color=c5]{color:#2a9d8f}[bgcolor=c5],[hcolor=c5]:hover{background-color:#2a9d8f}[border=c5]{border:1px solid #2a9d8f}[color=c6]{color:#78acd8}[bgcolor=c6],[hcolor=c6]:hover{background-color:#78acd8}[border=c6]{border:1px solid #78acd8}[color=c7]{color:#525a9e}[bgcolor=c7],[hcolor=c7]:hover{background-color:#525a9e}[border=c7]{border:1px solid #525a9e}[color=c8]{color:#6a2459}[bgcolor=c8],[hcolor=c8]:hover{background-color:#6a2459}[border=c8]{border:1px solid #6a2459}[color=c9]{color:#74729e}[bgcolor=c9],[hcolor=c9]:hover{background-color:#74729e}[border=c9]{border:1px solid #74729e}.switch{position:relative;display:inline-block;width:34px;height:16px;background-color:#ccc;border-radius:14px}.switch.enabled{cursor:pointer}.switch.checked{background-color:#00aeef}.slider{position:absolute;top:1px;left:1px;right:0;bottom:0;transition:.2s;content:\"\";height:14px;width:14px;border-radius:50%;background-color:#fff}.slider.checked{transform:translateX(18px)}"]
-            },] }
-];
-SlideToggleComponent.propDecorators = {
-    checked: [{ type: Input }],
-    disabled: [{ type: Input }],
-    checkedChange: [{ type: Output }]
-};
-
-class PasswordStrengthBarComponent {
-    constructor() {
-        this.defaultStrength = ['weak', 'fair', 'good', 'strong', 'excellent'];
-        this.labels = ['Weak', 'Fair', 'Good', 'Strong', 'Excellent'];
-    }
-    getStrengthIndexAndColor(password) {
-        return this.getColor(PasswordStrengthBarComponent.measureStrength(password));
-    }
-    ngOnChanges(changes) {
-        var _a;
-        const password = (_a = changes.passwordToCheck) === null || _a === void 0 ? void 0 : _a.currentValue;
-        if (password) {
-            const idx = this.getStrengthIndexAndColor(password);
-            this.passwordStrength = this.defaultStrength[idx - 1];
-            this.label = this.labels[idx - 1];
-        }
-    }
-    ngOnInit() {
-        this.labels = [this.labelWeak, this.labelFair, this.labelGood, this.labelStrong, this.labelExcellent];
-    }
-    static measureStrength(p) {
-        let force = 0;
-        const regex = /[$-/:-?{-~!"^_`\[\]]/g; // "
-        const lowerLetters = /[a-z]+/.test(p);
-        const upperLetters = /[A-Z]+/.test(p);
-        const numbers = /[0-9]+/.test(p);
-        const symbols = regex.test(p);
-        const flags = [lowerLetters, upperLetters, numbers, symbols];
-        let passedMatches = 0;
-        for (let flag of flags) {
-            passedMatches += flag === true ? 1 : 0;
-        }
-        force += 2 * p.length + ((p.length >= 10) ? 1 : 0);
-        force += passedMatches * 10;
-        // penality (short password)
-        force = (p.length <= 5) ? Math.min(force, 10) : force;
-        // penality (poor variety of characters)
-        force = (passedMatches === 1) ? Math.min(force, 10) : force;
-        force = (passedMatches === 2) ? Math.min(force, 20) : force;
-        force = (passedMatches === 3) ? Math.min(force, 40) : force;
-        return force;
-    }
-    getColor(strength) {
-        let idx = 0;
-        if (strength <= 10) {
-            idx = 0;
-        }
-        else if (strength <= 20) {
-            idx = 1;
-        }
-        else if (strength <= 30) {
-            idx = 2;
-        }
-        else if (strength <= 40) {
-            idx = 3;
-        }
-        else {
-            idx = 4;
-        }
-        return idx + 1;
-    }
-}
-PasswordStrengthBarComponent.decorators = [
-    { type: Component, args: [{
-                changeDetection: ChangeDetectionStrategy.OnPush,
-                selector: 'ap-password-strength-bar',
-                template: "<div id=\"managerPasswordStrength\">\n    <div class=\"managerPasswordStrengthBar\">\n        <span [className]=\"'security-bar ' + passwordStrength\"\n              *ngIf=\"!!passwordStrength\">\n        </span>\n    </div>\n    <div class=\"managerPasswordStrengthLabel\">\n        <span class=\"password-strength-label caption\"\n              *ngIf=\"!!passwordStrength\">\n            {{ label }}\n        </span>\n    </div>\n</div>\n",
-                styles: ["[color=facebook]{color:#1877f2}[bgcolor=facebook],[hcolor=facebook]:hover{background-color:#1877f2}[border=facebook]{border:1px solid #1877f2}[color=google]{color:#4e85e8}[bgcolor=google],[hcolor=google]:hover{background-color:#4e85e8}[border=google]{border:1px solid #4e85e8}[color=instagram]{color:#e1306c}[bgcolor=instagram],[hcolor=instagram]:hover{background-color:#e1306c}[border=instagram]{border:1px solid #e1306c}[color=instagrammagenta]{color:#c13584}[bgcolor=instagrammagenta],[hcolor=instagrammagenta]:hover{background-color:#c13584}[border=instagrammagenta]{border:1px solid #c13584}[color=instagramblue]{color:#5851db}[bgcolor=instagramblue],[hcolor=instagramblue]:hover{background-color:#5851db}[border=instagramblue]{border:1px solid #5851db}[color=instagrampurple]{color:#833ab4}[bgcolor=instagrampurple],[hcolor=instagrampurple]:hover{background-color:#833ab4}[border=instagrampurple]{border:1px solid #833ab4}[color=instagramorange]{color:#f56040}[bgcolor=instagramorange],[hcolor=instagramorange]:hover{background-color:#f56040}[border=instagramorange]{border:1px solid #f56040}[color=instagramyellow]{color:#ffdc80}[bgcolor=instagramyellow],[hcolor=instagramyellow]:hover{background-color:#ffdc80}[border=instagramyellow]{border:1px solid #ffdc80}[color=linkedin]{color:#2c67bc}[bgcolor=linkedin],[hcolor=linkedin]:hover{background-color:#2c67bc}[border=linkedin]{border:1px solid #2c67bc}[color=twitter]{color:#55acee}[bgcolor=twitter],[hcolor=twitter]:hover{background-color:#55acee}[border=twitter]{border:1px solid #55acee}[color=youtube]{color:red}[bgcolor=youtube],[hcolor=youtube]:hover{background-color:red}[border=youtube]{border:1px solid red}[color=blood-orange]{color:#ff4d00}[bgcolor=blood-orange],[hcolor=blood-orange]:hover{background-color:#ff4d00}[border=blood-orange]{border:1px solid #ff4d00}[color=pinkish-orange]{color:#ff7b49}[bgcolor=pinkish-orange],[hcolor=pinkish-orange]:hover{background-color:#ff7b49}[border=pinkish-orange]{border:1px solid #ff7b49}[color=charcoal-grey]{color:#2a2f34}[bgcolor=charcoal-grey],[hcolor=charcoal-grey]:hover{background-color:#2a2f34}[border=charcoal-grey]{border:1px solid #2a2f34}[color=azure]{color:#00aeef}[bgcolor=azure],[hcolor=azure]:hover{background-color:#00aeef}[border=azure]{border:1px solid #00aeef}[color=light-azure]{color:#eaf5fd}[bgcolor=light-azure],[hcolor=light-azure]:hover{background-color:#eaf5fd}[border=light-azure]{border:1px solid #eaf5fd}[color=blue-grey]{color:#8d98a9}[bgcolor=blue-grey],[hcolor=blue-grey]:hover{background-color:#8d98a9}[border=blue-grey]{border:1px solid #8d98a9}[color=silver]{color:#ced0da}[bgcolor=silver],[hcolor=silver]:hover{background-color:#ced0da}[border=silver]{border:1px solid #ced0da}[color=pale-grey]{color:#dfe3e9}[bgcolor=pale-grey],[hcolor=pale-grey]:hover{background-color:#dfe3e9}[border=pale-grey]{border:1px solid #dfe3e9}[color=grey-white]{color:#f5f7f8}[bgcolor=grey-white],[hcolor=grey-white]:hover{background-color:#f5f7f8}[border=grey-white]{border:1px solid #f5f7f8}[color=cool-grey]{color:#b4bbc6}[bgcolor=cool-grey],[hcolor=cool-grey]:hover{background-color:#b4bbc6}[border=cool-grey]{border:1px solid #b4bbc6}[color=black]{color:#344563}[bgcolor=black],[hcolor=black]:hover{background-color:#344563}[border=black]{border:1px solid #344563}[color=grey-blue]{color:#68768c}[bgcolor=grey-blue],[hcolor=grey-blue]:hover{background-color:#68768c}[border=grey-blue]{border:1px solid #68768c}[color=strawberry]{color:#f4282d}[bgcolor=strawberry],[hcolor=strawberry]:hover{background-color:#f4282d}[border=strawberry]{border:1px solid #f4282d}[color=light-strawberry]{color:#f8eded}[bgcolor=light-strawberry],[hcolor=light-strawberry]:hover{background-color:#f8eded}[border=light-strawberry]{border:1px solid #f8eded}[color=white]{color:#fff}[bgcolor=white],[hcolor=white]:hover{background-color:#fff}[border=white]{border:1px solid #fff}[color=cool-green]{color:#33c15d}[bgcolor=cool-green],[hcolor=cool-green]:hover{background-color:#33c15d}[border=cool-green]{border:1px solid #33c15d}[color=light-green]{color:#ebfaef}[bgcolor=light-green],[hcolor=light-green]:hover{background-color:#ebfaef}[border=light-green]{border:1px solid #ebfaef}[color=transparent]{color:#0000}[bgcolor=transparent],[hcolor=transparent]:hover{background-color:initial}[border=transparent]{border:1px solid #0000}[color=c0]{color:#a566a5}[bgcolor=c0],[hcolor=c0]:hover{background-color:#a566a5}[border=c0]{border:1px solid #a566a5}[color=c1]{color:#c7ab82}[bgcolor=c1],[hcolor=c1]:hover{background-color:#c7ab82}[border=c1]{border:1px solid #c7ab82}[color=c2]{color:#f2713c}[bgcolor=c2],[hcolor=c2]:hover{background-color:#f2713c}[border=c2]{border:1px solid #f2713c}[color=c3]{color:#ffd006}[bgcolor=c3],[hcolor=c3]:hover{background-color:#ffd006}[border=c3]{border:1px solid #ffd006}[color=c4]{color:#94c5aa}[bgcolor=c4],[hcolor=c4]:hover{background-color:#94c5aa}[border=c4]{border:1px solid #94c5aa}[color=c5]{color:#2a9d8f}[bgcolor=c5],[hcolor=c5]:hover{background-color:#2a9d8f}[border=c5]{border:1px solid #2a9d8f}[color=c6]{color:#78acd8}[bgcolor=c6],[hcolor=c6]:hover{background-color:#78acd8}[border=c6]{border:1px solid #78acd8}[color=c7]{color:#525a9e}[bgcolor=c7],[hcolor=c7]:hover{background-color:#525a9e}[border=c7]{border:1px solid #525a9e}[color=c8]{color:#6a2459}[bgcolor=c8],[hcolor=c8]:hover{background-color:#6a2459}[border=c8]{border:1px solid #6a2459}[color=c9]{color:#74729e}[bgcolor=c9],[hcolor=c9]:hover{background-color:#74729e}[border=c9]{border:1px solid #74729e}.managerPasswordStrengthLabel{display:flex;width:100%}.managerPasswordStrengthLabel .password-strength-label{font-size:12px;margin-top:4px}div.managerPasswordStrengthBar{display:flex;width:100%;background:#f5f5f7;border-radius:4px;height:4px}div.managerPasswordStrengthBar span.security-bar{border-radius:5px}div.managerPasswordStrengthBar span.weak{background:#f17171;width:20%}div.managerPasswordStrengthBar span.fair{background:#ffa47d;width:40%}div.managerPasswordStrengthBar span.good{background:#ffa47d;width:60%}div.managerPasswordStrengthBar span.strong{background:#8fd498;width:80%}div.managerPasswordStrengthBar span.excellent{background:#8fd498;width:100%}"]
-            },] }
-];
-/** @nocollapse */
-PasswordStrengthBarComponent.ctorParameters = () => [];
-PasswordStrengthBarComponent.propDecorators = {
-    passwordToCheck: [{ type: Input }],
-    labelWeak: [{ type: Input }],
-    labelFair: [{ type: Input }],
-    labelGood: [{ type: Input }],
-    labelStrong: [{ type: Input }],
-    labelExcellent: [{ type: Input }]
-};
-
-class PasswordStrengthDisplayBarComponent {
-    constructor() {
-        this.defaultLabels = ['weak', 'fair', 'good', 'strong', 'excellent'];
-        this.labels = this.defaultLabels;
-    }
-    set strength(strength) {
-        if (strength === null) {
-            this.passwordStrength = null;
-            return;
-        }
-        try {
-            this.passwordStrength = this.defaultLabels[strength];
-            this.label = this.labels[strength];
-        }
-        catch (e) {
-            this.passwordStrength = null;
-            console.error("PasswordStrengthBar - Invalid strength value min0/max4 got " + strength);
-        }
-    }
-    ngOnInit() {
-        this.labels = [this.labelWeak, this.labelFair, this.labelGood, this.labelStrong, this.labelExcellent];
-    }
-}
-PasswordStrengthDisplayBarComponent.decorators = [
-    { type: Component, args: [{
-                changeDetection: ChangeDetectionStrategy.OnPush,
-                selector: 'ap-password-strength-display-bar',
-                template: "<div id=\"managerPasswordStrength\">\n    <div class=\"managerPasswordStrengthBar\">\n        <span\n        *ngIf=\"!!passwordStrength\"\n        [className]=\"'security-bar ' + passwordStrength\">\n        </span>\n    </div>\n    <div class=\"managerPasswordStrengthLabel\">\n        <span\n        *ngIf=\"!!passwordStrength\"\n        class=\"password-strength-label caption\">\n            {{ label }}\n        </span>\n    </div>\n</div>\n",
-                styles: ["[color=facebook]{color:#1877f2}[bgcolor=facebook],[hcolor=facebook]:hover{background-color:#1877f2}[border=facebook]{border:1px solid #1877f2}[color=google]{color:#4e85e8}[bgcolor=google],[hcolor=google]:hover{background-color:#4e85e8}[border=google]{border:1px solid #4e85e8}[color=instagram]{color:#e1306c}[bgcolor=instagram],[hcolor=instagram]:hover{background-color:#e1306c}[border=instagram]{border:1px solid #e1306c}[color=instagrammagenta]{color:#c13584}[bgcolor=instagrammagenta],[hcolor=instagrammagenta]:hover{background-color:#c13584}[border=instagrammagenta]{border:1px solid #c13584}[color=instagramblue]{color:#5851db}[bgcolor=instagramblue],[hcolor=instagramblue]:hover{background-color:#5851db}[border=instagramblue]{border:1px solid #5851db}[color=instagrampurple]{color:#833ab4}[bgcolor=instagrampurple],[hcolor=instagrampurple]:hover{background-color:#833ab4}[border=instagrampurple]{border:1px solid #833ab4}[color=instagramorange]{color:#f56040}[bgcolor=instagramorange],[hcolor=instagramorange]:hover{background-color:#f56040}[border=instagramorange]{border:1px solid #f56040}[color=instagramyellow]{color:#ffdc80}[bgcolor=instagramyellow],[hcolor=instagramyellow]:hover{background-color:#ffdc80}[border=instagramyellow]{border:1px solid #ffdc80}[color=linkedin]{color:#2c67bc}[bgcolor=linkedin],[hcolor=linkedin]:hover{background-color:#2c67bc}[border=linkedin]{border:1px solid #2c67bc}[color=twitter]{color:#55acee}[bgcolor=twitter],[hcolor=twitter]:hover{background-color:#55acee}[border=twitter]{border:1px solid #55acee}[color=youtube]{color:red}[bgcolor=youtube],[hcolor=youtube]:hover{background-color:red}[border=youtube]{border:1px solid red}[color=blood-orange]{color:#ff4d00}[bgcolor=blood-orange],[hcolor=blood-orange]:hover{background-color:#ff4d00}[border=blood-orange]{border:1px solid #ff4d00}[color=pinkish-orange]{color:#ff7b49}[bgcolor=pinkish-orange],[hcolor=pinkish-orange]:hover{background-color:#ff7b49}[border=pinkish-orange]{border:1px solid #ff7b49}[color=charcoal-grey]{color:#2a2f34}[bgcolor=charcoal-grey],[hcolor=charcoal-grey]:hover{background-color:#2a2f34}[border=charcoal-grey]{border:1px solid #2a2f34}[color=azure]{color:#00aeef}[bgcolor=azure],[hcolor=azure]:hover{background-color:#00aeef}[border=azure]{border:1px solid #00aeef}[color=light-azure]{color:#eaf5fd}[bgcolor=light-azure],[hcolor=light-azure]:hover{background-color:#eaf5fd}[border=light-azure]{border:1px solid #eaf5fd}[color=blue-grey]{color:#8d98a9}[bgcolor=blue-grey],[hcolor=blue-grey]:hover{background-color:#8d98a9}[border=blue-grey]{border:1px solid #8d98a9}[color=silver]{color:#ced0da}[bgcolor=silver],[hcolor=silver]:hover{background-color:#ced0da}[border=silver]{border:1px solid #ced0da}[color=pale-grey]{color:#dfe3e9}[bgcolor=pale-grey],[hcolor=pale-grey]:hover{background-color:#dfe3e9}[border=pale-grey]{border:1px solid #dfe3e9}[color=grey-white]{color:#f5f7f8}[bgcolor=grey-white],[hcolor=grey-white]:hover{background-color:#f5f7f8}[border=grey-white]{border:1px solid #f5f7f8}[color=cool-grey]{color:#b4bbc6}[bgcolor=cool-grey],[hcolor=cool-grey]:hover{background-color:#b4bbc6}[border=cool-grey]{border:1px solid #b4bbc6}[color=black]{color:#344563}[bgcolor=black],[hcolor=black]:hover{background-color:#344563}[border=black]{border:1px solid #344563}[color=grey-blue]{color:#68768c}[bgcolor=grey-blue],[hcolor=grey-blue]:hover{background-color:#68768c}[border=grey-blue]{border:1px solid #68768c}[color=strawberry]{color:#f4282d}[bgcolor=strawberry],[hcolor=strawberry]:hover{background-color:#f4282d}[border=strawberry]{border:1px solid #f4282d}[color=light-strawberry]{color:#f8eded}[bgcolor=light-strawberry],[hcolor=light-strawberry]:hover{background-color:#f8eded}[border=light-strawberry]{border:1px solid #f8eded}[color=white]{color:#fff}[bgcolor=white],[hcolor=white]:hover{background-color:#fff}[border=white]{border:1px solid #fff}[color=cool-green]{color:#33c15d}[bgcolor=cool-green],[hcolor=cool-green]:hover{background-color:#33c15d}[border=cool-green]{border:1px solid #33c15d}[color=light-green]{color:#ebfaef}[bgcolor=light-green],[hcolor=light-green]:hover{background-color:#ebfaef}[border=light-green]{border:1px solid #ebfaef}[color=transparent]{color:#0000}[bgcolor=transparent],[hcolor=transparent]:hover{background-color:initial}[border=transparent]{border:1px solid #0000}[color=c0]{color:#a566a5}[bgcolor=c0],[hcolor=c0]:hover{background-color:#a566a5}[border=c0]{border:1px solid #a566a5}[color=c1]{color:#c7ab82}[bgcolor=c1],[hcolor=c1]:hover{background-color:#c7ab82}[border=c1]{border:1px solid #c7ab82}[color=c2]{color:#f2713c}[bgcolor=c2],[hcolor=c2]:hover{background-color:#f2713c}[border=c2]{border:1px solid #f2713c}[color=c3]{color:#ffd006}[bgcolor=c3],[hcolor=c3]:hover{background-color:#ffd006}[border=c3]{border:1px solid #ffd006}[color=c4]{color:#94c5aa}[bgcolor=c4],[hcolor=c4]:hover{background-color:#94c5aa}[border=c4]{border:1px solid #94c5aa}[color=c5]{color:#2a9d8f}[bgcolor=c5],[hcolor=c5]:hover{background-color:#2a9d8f}[border=c5]{border:1px solid #2a9d8f}[color=c6]{color:#78acd8}[bgcolor=c6],[hcolor=c6]:hover{background-color:#78acd8}[border=c6]{border:1px solid #78acd8}[color=c7]{color:#525a9e}[bgcolor=c7],[hcolor=c7]:hover{background-color:#525a9e}[border=c7]{border:1px solid #525a9e}[color=c8]{color:#6a2459}[bgcolor=c8],[hcolor=c8]:hover{background-color:#6a2459}[border=c8]{border:1px solid #6a2459}[color=c9]{color:#74729e}[bgcolor=c9],[hcolor=c9]:hover{background-color:#74729e}[border=c9]{border:1px solid #74729e}.managerPasswordStrengthLabel{display:flex;width:100%}.managerPasswordStrengthLabel .password-strength-label{font-size:12px;margin-top:4px}div.managerPasswordStrengthBar{display:flex;width:100%;background:#f5f5f7;border-radius:4px;height:4px}div.managerPasswordStrengthBar span.security-bar{border-radius:5px}div.managerPasswordStrengthBar span.weak{background:#f17171;width:20%}div.managerPasswordStrengthBar span.fair{background:#ffa47d;width:40%}div.managerPasswordStrengthBar span.good{background:#ffa47d;width:60%}div.managerPasswordStrengthBar span.strong{background:#8fd498;width:80%}div.managerPasswordStrengthBar span.excellent{background:#8fd498;width:100%}"]
-            },] }
-];
-PasswordStrengthDisplayBarComponent.propDecorators = {
-    labelWeak: [{ type: Input }],
-    labelFair: [{ type: Input }],
-    labelGood: [{ type: Input }],
-    labelStrong: [{ type: Input }],
-    labelExcellent: [{ type: Input }],
-    strength: [{ type: Input }]
-};
-
-class SnackbarsThreadService {
-    constructor(domSanitizer) {
-        this.domSanitizer = domSanitizer;
-        this._list = [];
-        this.snackbarList = new BehaviorSubject([]);
-    }
-    _emit() {
-        this.snackbarList.next(this._list);
-    }
-    add(elem) {
-        const notification = {
-            id: Math.random().toString(36).substring(7) + Date.now().toString(),
-            snackbarType: elem.snackbarType,
-            snackbarText: this.domSanitizer.bypassSecurityTrustHtml(elem.snackbarText)
-        };
-        this._list.unshift(notification);
-        while (this._list.length > 3) {
-            this.remove(this._list.slice(-1).pop().id);
-        }
-        this._emit();
-        setTimeout(() => this.remove(notification.id), 5000);
-    }
-    remove(id) {
-        const index = this._list.findIndex(el => el.id === id);
-        index > -1 && this._list.splice(index, 1);
-        this._emit();
-    }
-}
-/** @nocollapse */ SnackbarsThreadService.ɵprov = i0.ɵɵdefineInjectable({ factory: function SnackbarsThreadService_Factory() { return new SnackbarsThreadService(i0.ɵɵinject(i1.DomSanitizer)); }, token: SnackbarsThreadService, providedIn: "root" });
-SnackbarsThreadService.decorators = [
-    { type: Injectable, args: [{
-                providedIn: "root"
-            },] }
-];
-/** @nocollapse */
-SnackbarsThreadService.ctorParameters = () => [
-    { type: DomSanitizer }
-];
-
-const snackbarTypesMap = {
-    0: "info",
-    1: "success",
-    2: "warning",
-    3: "error"
-};
-const snackbarIconsMap = {
-    0: "messages-bubble-dot",
-    1: "check-circle",
-    2: "alert-circle",
-    3: "remove-circle"
-};
-
-class SnackbarsThreadComponent {
-    constructor(snackbarsThreadService) {
-        this.snackbarsThreadService = snackbarsThreadService;
-        this.SnackbarTypesMap = snackbarTypesMap;
-        this.SnackbarIconsMap = snackbarIconsMap;
-    }
-    remove(id) {
-        this.snackbarsThreadService.remove(id);
-    }
-}
-SnackbarsThreadComponent.decorators = [
-    { type: Component, args: [{
-                selector: "app-snackbars-thread",
-                template: "<div class=\"thread-container\">\n    <div @fadeAnimation\n         *ngFor=\"let el of snackbarsThreadService.snackbarList | async\"\n         class=\"item {{SnackbarTypesMap[el.snackbarType]}}\"\n    >\n        <div class=\"left\">\n            <div class=\"icon {{SnackbarTypesMap[el.snackbarType]}}\">\n                <ap-symbol\n                    [symbolId]=\"SnackbarIconsMap[el.snackbarType]\"\n                    [color]=\"'white'\"\n                    [size]=\"'mini'\">\n                </ap-symbol>\n            </div>\n            <div class=\"text\">\n                <div [innerHTML]=\"el.snackbarText\"></div>\n            </div>\n        </div>\n        <div class=\"close\" (click)=\"remove(el.id)\">\n            <div class=\"{{SnackbarTypesMap[el.snackbarType]}}\">\n                <ap-symbol\n                    [symbolId]=\"'close'\"\n                    [size]=\"'12'\">\n                </ap-symbol>\n            </div>\n        </div>\n    </div>\n</div>\n",
-                animations: [
-                    trigger("fadeAnimation", [
-                        transition(":enter", [
-                            style({
-                                height: 0,
-                                minHeight: 0,
-                                opacity: 0,
-                                transform: "translateY(-5%)",
-                                padding: 0
-                            }),
-                            // padding and min-height should be the same as in scss file
-                            animate("300ms ease-in", style({ height: "*", minHeight: "72px", padding: "7px 3px 7px 7px" })),
-                            animate("200ms ease-in", style({ opacity: 0.5, transform: "translateY(0%)" })),
-                            animate("200ms ease-in", style({ opacity: 1 }))
-                        ]),
-                        transition(":leave", [
-                            animate("300ms ease-out", style({
-                                opacity: 0,
-                                transform: "translateY(-5%)"
-                            })),
-                            animate("300ms ease-out", style({ height: 0, minHeight: 0 }))
-                        ])
-                    ])
-                ],
-                styles: ["[color=facebook]{color:#1877f2}[bgcolor=facebook],[hcolor=facebook]:hover{background-color:#1877f2}[border=facebook]{border:1px solid #1877f2}[color=google]{color:#4e85e8}[bgcolor=google],[hcolor=google]:hover{background-color:#4e85e8}[border=google]{border:1px solid #4e85e8}[color=instagram]{color:#e1306c}[bgcolor=instagram],[hcolor=instagram]:hover{background-color:#e1306c}[border=instagram]{border:1px solid #e1306c}[color=instagrammagenta]{color:#c13584}[bgcolor=instagrammagenta],[hcolor=instagrammagenta]:hover{background-color:#c13584}[border=instagrammagenta]{border:1px solid #c13584}[color=instagramblue]{color:#5851db}[bgcolor=instagramblue],[hcolor=instagramblue]:hover{background-color:#5851db}[border=instagramblue]{border:1px solid #5851db}[color=instagrampurple]{color:#833ab4}[bgcolor=instagrampurple],[hcolor=instagrampurple]:hover{background-color:#833ab4}[border=instagrampurple]{border:1px solid #833ab4}[color=instagramorange]{color:#f56040}[bgcolor=instagramorange],[hcolor=instagramorange]:hover{background-color:#f56040}[border=instagramorange]{border:1px solid #f56040}[color=instagramyellow]{color:#ffdc80}[bgcolor=instagramyellow],[hcolor=instagramyellow]:hover{background-color:#ffdc80}[border=instagramyellow]{border:1px solid #ffdc80}[color=linkedin]{color:#2c67bc}[bgcolor=linkedin],[hcolor=linkedin]:hover{background-color:#2c67bc}[border=linkedin]{border:1px solid #2c67bc}[color=twitter]{color:#55acee}[bgcolor=twitter],[hcolor=twitter]:hover{background-color:#55acee}[border=twitter]{border:1px solid #55acee}[color=youtube]{color:red}[bgcolor=youtube],[hcolor=youtube]:hover{background-color:red}[border=youtube]{border:1px solid red}[color=blood-orange]{color:#ff4d00}[bgcolor=blood-orange],[hcolor=blood-orange]:hover{background-color:#ff4d00}[border=blood-orange]{border:1px solid #ff4d00}[color=pinkish-orange]{color:#ff7b49}[bgcolor=pinkish-orange],[hcolor=pinkish-orange]:hover{background-color:#ff7b49}[border=pinkish-orange]{border:1px solid #ff7b49}[color=charcoal-grey]{color:#2a2f34}[bgcolor=charcoal-grey],[hcolor=charcoal-grey]:hover{background-color:#2a2f34}[border=charcoal-grey]{border:1px solid #2a2f34}[color=azure]{color:#00aeef}[bgcolor=azure],[hcolor=azure]:hover{background-color:#00aeef}[border=azure]{border:1px solid #00aeef}[color=light-azure]{color:#eaf5fd}[bgcolor=light-azure],[hcolor=light-azure]:hover{background-color:#eaf5fd}[border=light-azure]{border:1px solid #eaf5fd}[color=blue-grey]{color:#8d98a9}[bgcolor=blue-grey],[hcolor=blue-grey]:hover{background-color:#8d98a9}[border=blue-grey]{border:1px solid #8d98a9}[color=silver]{color:#ced0da}[bgcolor=silver],[hcolor=silver]:hover{background-color:#ced0da}[border=silver]{border:1px solid #ced0da}[color=pale-grey]{color:#dfe3e9}[bgcolor=pale-grey],[hcolor=pale-grey]:hover{background-color:#dfe3e9}[border=pale-grey]{border:1px solid #dfe3e9}[color=grey-white]{color:#f5f7f8}[bgcolor=grey-white],[hcolor=grey-white]:hover{background-color:#f5f7f8}[border=grey-white]{border:1px solid #f5f7f8}[color=cool-grey]{color:#b4bbc6}[bgcolor=cool-grey],[hcolor=cool-grey]:hover{background-color:#b4bbc6}[border=cool-grey]{border:1px solid #b4bbc6}[color=black]{color:#344563}[bgcolor=black],[hcolor=black]:hover{background-color:#344563}[border=black]{border:1px solid #344563}[color=grey-blue]{color:#68768c}[bgcolor=grey-blue],[hcolor=grey-blue]:hover{background-color:#68768c}[border=grey-blue]{border:1px solid #68768c}[color=strawberry]{color:#f4282d}[bgcolor=strawberry],[hcolor=strawberry]:hover{background-color:#f4282d}[border=strawberry]{border:1px solid #f4282d}[color=light-strawberry]{color:#f8eded}[bgcolor=light-strawberry],[hcolor=light-strawberry]:hover{background-color:#f8eded}[border=light-strawberry]{border:1px solid #f8eded}[color=white]{color:#fff}[bgcolor=white],[hcolor=white]:hover{background-color:#fff}[border=white]{border:1px solid #fff}[color=cool-green]{color:#33c15d}[bgcolor=cool-green],[hcolor=cool-green]:hover{background-color:#33c15d}[border=cool-green]{border:1px solid #33c15d}[color=light-green]{color:#ebfaef}[bgcolor=light-green],[hcolor=light-green]:hover{background-color:#ebfaef}[border=light-green]{border:1px solid #ebfaef}[color=transparent]{color:#0000}[bgcolor=transparent],[hcolor=transparent]:hover{background-color:initial}[border=transparent]{border:1px solid #0000}[color=c0]{color:#a566a5}[bgcolor=c0],[hcolor=c0]:hover{background-color:#a566a5}[border=c0]{border:1px solid #a566a5}[color=c1]{color:#c7ab82}[bgcolor=c1],[hcolor=c1]:hover{background-color:#c7ab82}[border=c1]{border:1px solid #c7ab82}[color=c2]{color:#f2713c}[bgcolor=c2],[hcolor=c2]:hover{background-color:#f2713c}[border=c2]{border:1px solid #f2713c}[color=c3]{color:#ffd006}[bgcolor=c3],[hcolor=c3]:hover{background-color:#ffd006}[border=c3]{border:1px solid #ffd006}[color=c4]{color:#94c5aa}[bgcolor=c4],[hcolor=c4]:hover{background-color:#94c5aa}[border=c4]{border:1px solid #94c5aa}[color=c5]{color:#2a9d8f}[bgcolor=c5],[hcolor=c5]:hover{background-color:#2a9d8f}[border=c5]{border:1px solid #2a9d8f}[color=c6]{color:#78acd8}[bgcolor=c6],[hcolor=c6]:hover{background-color:#78acd8}[border=c6]{border:1px solid #78acd8}[color=c7]{color:#525a9e}[bgcolor=c7],[hcolor=c7]:hover{background-color:#525a9e}[border=c7]{border:1px solid #525a9e}[color=c8]{color:#6a2459}[bgcolor=c8],[hcolor=c8]:hover{background-color:#6a2459}[border=c8]{border:1px solid #6a2459}[color=c9]{color:#74729e}[bgcolor=c9],[hcolor=c9]:hover{background-color:#74729e}[border=c9]{border:1px solid #74729e}.thread-container{position:absolute;top:60px;right:16px;width:357px;z-index:999}.thread-container .item{min-height:72px;height:auto;padding:7px 3px 7px 7px;box-sizing:border-box;box-shadow:0 25px 50px #0000000a;border:1px solid;border-radius:8px;display:flex;flex-direction:row;justify-content:space-between;align-content:flex-start}.thread-container .item:not(:last-child){margin-bottom:8px}.thread-container .item.info{background-color:#e8f4ff;border-color:#74bbfe}.thread-container .item.success{background-color:#ecf7ed;border-color:#8fd498}.thread-container .item.warning{background-color:#fff8e6;border-color:#fdd366}.thread-container .item.error{background-color:#fde7e7;border-color:#f17171}.thread-container .item>div{display:flex}.thread-container .item>div .icon{height:56px;width:56px;border-radius:4px;margin:0 16px 0 0;display:flex;justify-content:center;align-items:center}.thread-container .item>div .icon.info{background-color:#178dfe}.thread-container .item>div .icon.success{background-color:#45b854}.thread-container .item>div .icon.warning{background-color:#fbb500}.thread-container .item>div .icon.error{background-color:#e81313}.thread-container .item>div .text{width:221px;font-size:14px;display:flex;justify-content:flex-start;align-items:center;overflow-wrap:anywhere;color:#344563}.thread-container .item .close{height:56px;width:36px;display:flex;justify-content:center;align-items:center}.thread-container .item .close>div{height:36px;width:36px;display:flex;justify-content:center;align-items:center}.thread-container .item .close>div ap-symbol{color:#858fa1}.thread-container .item .close>div:hover{border-radius:50%;cursor:pointer}.thread-container .item .close>div:hover ap-symbol{color:#5d6a82}.thread-container .item .close>div:hover.info{background-color:#d1e8ff}.thread-container .item .close>div:hover.success{background-color:#daf1dd}.thread-container .item .close>div:hover.warning{background-color:#fef0cc}.thread-container .item .close>div:hover.error{background-color:#fad0d0}"]
-            },] }
-];
-/** @nocollapse */
-SnackbarsThreadComponent.ctorParameters = () => [
-    { type: SnackbarsThreadService }
-];
-
-class StarRatingComponent {
-    constructor() {
-        this.score = 0;
-        this.maxScore = 5;
-        this.size = 'nano';
-        this.colorOn = '#FBBC04';
-        this.colorOff = '#DADCE0';
-        this.filledStars = [];
-    }
-    ngOnChanges(changes) {
-        if (changes.score) {
-            if (this.score >= 0) {
-                for (let i = 0; i < this.maxScore; i++) {
-                    this.filledStars[i] = i < this.score;
-                }
-            }
-            else {
-                this.filledStars.length = 0;
-            }
-        }
-    }
-}
-StarRatingComponent.decorators = [
-    { type: Component, args: [{
-                selector: 'ap-star-rating',
-                template: "<span class=\"star-rating\">\n    <ap-symbol *ngFor=\"let activeStar of filledStars\"\n               [color]=\"activeStar ? colorOn: colorOff\"\n               [symbolId]=\"'rating-star'\"\n               [size]=\"size\">\n    </ap-symbol>\n</span>\n",
-                styles: [".star-rating ap-symbol{display:inline-block}.star-rating ap-symbol:not(:first-child){padding-left:3px}"]
-            },] }
-];
-StarRatingComponent.propDecorators = {
-    score: [{ type: Input }],
-    maxScore: [{ type: Input }],
-    size: [{ type: Input }],
-    colorOn: [{ type: Input }],
-    colorOff: [{ type: Input }]
-};
-
-/**
- * expand textarea to fit content. Doesn't shrink.
- */
-class AutosizeTextareaDirective {
-    constructor(element) {
-        this.element = element;
-    }
-    onInput() {
-        this.resize();
-    }
-    ngAfterContentChecked() {
-        this.resize();
-    }
-    resize() {
-        const style = this.element.nativeElement.style;
-        const scrollHeight = this.element.nativeElement.scrollHeight;
-        const actualHeight = this.element.nativeElement.offsetHeight;
-        if (AutosizeTextareaDirective.maxHeight < scrollHeight) {
-            // we arrived at the max
-            style.overflow = 'auto';
-            style.height = `${AutosizeTextareaDirective.maxHeight}px`;
-        }
-        else if (actualHeight < scrollHeight) {
-            style.overflow = 'hidden';
-            style.height = `${scrollHeight}px`;
-        }
-    }
-}
-AutosizeTextareaDirective.maxHeight = 200;
-AutosizeTextareaDirective.decorators = [
-    { type: Directive, args: [{
-                selector: 'textarea[ap-autosize]'
-            },] }
-];
-/** @nocollapse */
-AutosizeTextareaDirective.ctorParameters = () => [
-    { type: ElementRef }
-];
-AutosizeTextareaDirective.propDecorators = {
-    onInput: [{ type: HostListener, args: ['input',] }]
-};
-
-class DefaultImageDirective {
-    updateUrl() {
-        if (this.default) {
-            this.src = this.default;
-        }
-        else {
-            this.src = 'assets/lib-ui-components/img/default-avatar.png';
-        }
-    }
-}
-DefaultImageDirective.decorators = [
-    { type: Directive, args: [{
-                selector: 'img[default]',
-                host: {
-                    '(error)': 'updateUrl()',
-                    '[src]': 'src'
-                }
-            },] }
-];
-DefaultImageDirective.propDecorators = {
-    src: [{ type: Input }],
-    default: [{ type: Input }]
-};
-
-/**
- * Removes excess text from element until it fits in elements
- * and appends a ellipsis symbol to end of text. This requires that
- * the elements height be fixed
- *
- * @example
- * ```html
- * <p apEllipsis>Ullamco esse laborum</p>
- * ```
- *
- */
-class EllipsisDirective {
-    constructor(el) {
-        this.el = el;
-        this.apEllipsisClip = false;
-        this.apEllipsisChar = '...';
-        this.apEllipsisClickable = false;
-        this.apEllipsisRemovedElementsCount = new EventEmitter();
-        this.apEllipsisRemovedText = new EventEmitter();
-    }
-    get hasOverflow() {
-        const el = this.el.nativeElement;
-        return (el.scrollHeight > el.offsetHeight) || (el.scrollWidth > el.offsetWidth);
-    }
-    ngAfterContentChecked() {
-        this.clipText();
-    }
-    clipText() {
-        const el = this.el.nativeElement;
-        let text = el.innerText;
-        let removedText = '';
-        if (this.apEllipsisIndex > -1) {
-            removedText = text.substring(this.apEllipsisIndex, text.length - 1) + removedText;
-            text = text.substring(0, this.apEllipsisIndex);
-            el.innerText = `${text}${this.apEllipsisChar}`;
-            if (this.apEllipsisClickable) {
-                el.addEventListener('click', () => {
-                    el.innerText = `${text}${removedText}`;
-                });
-            }
-        }
-        else {
-            while (this.hasOverflow && text.length > 0) {
-                removedText = text[text.length - 1] + removedText;
-                text = text.substring(0, text.length - 1);
-                el.innerText = `${text}${this.apEllipsisChar}`;
-            }
-        }
-        if (this.apEllipsisSeparator) {
-            const removedElementsCount = removedText.split(this.apEllipsisSeparator)
-                .filter(element => !!element && element.length > 0).length;
-            if (removedElementsCount > 0) {
-                this.apEllipsisRemovedElementsCount.emit(removedElementsCount);
-            }
-        }
-        if (removedText && removedText.length > 0) {
-            this.apEllipsisRemovedText.emit(removedText);
-        }
-    }
-    handleReadmore() {
-    }
-}
-EllipsisDirective.decorators = [
-    { type: Directive, args: [{
-                selector: '[apEllipsis]',
-            },] }
-];
-/** @nocollapse */
-EllipsisDirective.ctorParameters = () => [
-    { type: ElementRef }
-];
-EllipsisDirective.propDecorators = {
-    apEllipsisSeparator: [{ type: Input }],
-    apEllipsisClip: [{ type: Input }],
-    apEllipsisIndex: [{ type: Input }],
-    apEllipsisChar: [{ type: Input }],
-    apEllipsisClickable: [{ type: Input }],
-    apEllipsisRemovedElementsCount: [{ type: Output }],
-    apEllipsisRemovedText: [{ type: Output }]
-};
-
-class GifService {
-    static isGif(src) {
-        return src && src.split('?')[0].endsWith('.gif');
-    }
-}
-/**
- * If the image is a GIF then replace the img element by a canvas containing a frozen gif.
- * Note 1: if the image is displayed under a condition, the condition must be applied on the parent of the image, so the
- * new canvas element will have the same condition.
- * Note 2: the image must not have the properties "display" and "visibility" in its style. Since they are used to frozen
- * the GIF. You need to apply this properties on the parent element.
- * Note 3: If the GIF is frozen, all the event are propagated to the image. However, all events are dispatched
- * with an Event instance. Ex: click event is not dispatched with a MouseEvent instance.
- */
-class FrozenGifDirective {
-    constructor(elementRef) {
-        this.elementRef = elementRef;
-        this.frozen = true;
-        // Add all the events that need to be propagated.
-        this.events = ['click'];
-        const element = this.elementRef.nativeElement;
-        if (!(element instanceof HTMLImageElement)) {
-            return;
-        }
-        this.element = element;
-    }
-    ngOnChanges(changes) {
-        let freeze = false;
-        if (changes.src) {
-            freeze = true;
-        }
-        if (changes.frozen) {
-            if (changes.frozen.currentValue) {
-                freeze = true;
-            }
-            else {
-                this.unfreeze();
-            }
-        }
-        if (freeze) {
-            this.freeze();
-        }
-    }
-    freeze() {
-        if (!GifService.isGif(this.src) || !this.frozen) {
-            this.unfreeze();
-            return;
-        }
-        // hack to avoid displaying the GIF before replacing it by the canvas
-        this.element.style.visibility = 'hidden';
-        this.element.addEventListener('load', () => this.addCanvas());
-    }
-    addCanvas() {
-        if (this.canvas) {
-            this.canvas.remove();
-        }
-        this.canvas = document.createElement('canvas');
-        this.canvas.width = this.element.width;
-        this.canvas.height = this.element.height;
-        this.canvas.getContext('2d').drawImage(this.element, 0, 0, this.canvas.width, this.canvas.height);
-        for (let i = 0; i < this.element.attributes.length; i++) {
-            const attr = this.element.attributes[i];
-            if (attr.name === 'id') { // avoid two elements with the same id
-                this.canvas.setAttribute('id', attr.value + '_frozenGif');
-            }
-            else if (attr.name === 'style' && attr.value.includes('visibility: hidden;') || attr.value.includes('display: none;')) {
-                // remove the added 'visibility: hidden' and 'display: none'
-                const styleValue = attr.value;
-                this.canvas.setAttribute('style', styleValue.replace('visibility: hidden;', '').replace('display: none;', ''));
-            }
-            else if (attr.name !== '"') { // test for invalid attributes
-                this.canvas.setAttribute(attr.name, attr.value);
-            }
-        }
-        this.addEvents();
-        this.element.parentNode.insertBefore(this.canvas, this.element);
-        this.element.style.display = 'none';
-    }
-    addEvents() {
-        this.events.forEach((eventName) => {
-            this.canvas.addEventListener(eventName, (ev) => this.element.dispatchEvent(
-            // wm: find a way to dispatch the right event type
-            new Event(ev.type, ev)));
-        });
-    }
-    unfreeze() {
-        if (this.canvas) {
-            this.canvas.remove();
-            this.canvas = null;
-        }
-        this.element.style.visibility = 'inherit';
-        this.element.style.display = 'inherit';
-    }
-}
-FrozenGifDirective.decorators = [
-    { type: Directive, args: [{
-                selector: 'img[apFrozenGif]',
-                host: {
-                    '[src]': 'src'
-                }
-            },] }
-];
-/** @nocollapse */
-FrozenGifDirective.ctorParameters = () => [
-    { type: ElementRef }
-];
-FrozenGifDirective.propDecorators = {
-    src: [{ type: Input }],
-    frozen: [{ type: Input, args: ['apFrozen',] }],
-    events: [{ type: Input, args: ['apGifEvents',] }]
-};
-
-// Based on https://scotch.io/tutorials/how-to-implement-a-custom-validator-directive-confirm-password-in-angular-2
-class EqualValidatorDirective {
-    constructor(validateEqual, validateEqualReference) {
-        this.validateEqual = validateEqual;
-        this.validateEqualReference = validateEqualReference;
-    }
-    validate(self) {
-        let other = self.root.get(this.validateEqual);
-        if (other) {
-            if (this.isReference()) {
-                if (self.value === other.value) {
-                    delete other.errors['validateEqual'];
-                    if (!Object.keys(other.errors).length) {
-                        other.setErrors(null);
-                    }
-                }
-                else {
-                    other.setErrors({ validateEqual: false });
-                }
-            }
-            else if (self.value !== other.value) {
-                return { validateEqual: false };
-            }
-        }
-        return null;
-    }
-    isReference() {
-        if (!this.validateEqualReference) {
-            return false;
-        }
-        return this.validateEqualReference === 'true';
-    }
-}
-EqualValidatorDirective.decorators = [
-    { type: Directive, args: [{
-                selector: '[validateEqual][formControlName],[validateEqual][formControl],[validateEqual][ngModel]',
-                providers: [
-                    {
-                        provide: NG_VALIDATORS,
-                        useExisting: forwardRef(() => EqualValidatorDirective),
-                        multi: true
-                    }
-                ]
-            },] }
-];
-/** @nocollapse */
-EqualValidatorDirective.ctorParameters = () => [
-    { type: String, decorators: [{ type: Attribute, args: ['validateEqual',] }] },
-    { type: String, decorators: [{ type: Attribute, args: ['validateEqualReference',] }] }
-];
-
-const PART_START = '<ng-container data-mst="';
-const PARSE_MIDDLE = '">';
-const PARSE_END = '</ng-container>';
-const CLASS_SEPARATOR = ',';
-/**
- * This directive aims to parse simple string to extract some specific tags and to turn them into SPAN with styling classes attributes.
- * The specific tags must this schema: <ng-container data-mst="STYLING-CLASSES>TEXT</ng-container>.
- * Example: 'Lorem <ng-container data-mst="my-style">ipsum</ng-container> dolor sit amet'.
- */
-class MultiStyleTextDirective {
-    constructor(elRef, renderer) {
-        this.elRef = elRef;
-        this.renderer = renderer;
-        this.childrenCreated = [];
-    }
-    set multiStyleText(fullText) {
-        // First remove previously added children (on update).
-        for (const child of this.childrenCreated) {
-            this.renderer.removeChild(this.elRef.nativeElement, child);
-        }
-        const parts = MultiStyleTextDirective.parse(fullText);
-        for (const part of parts) {
-            if (part.clazz) {
-                const span = this.renderer.createElement('span');
-                const text = this.renderer.createText(part.content);
-                this.renderer.appendChild(span, text);
-                part.clazz.forEach(clazz => this.renderer.addClass(span, clazz));
-                this.renderer.appendChild(this.elRef.nativeElement, span);
-                this.childrenCreated.push(span);
-            }
-            else {
-                const text = this.renderer.createText(part.content);
-                this.renderer.appendChild(this.elRef.nativeElement, text);
-                this.childrenCreated.push(text);
-            }
-        }
-    }
-    static parse(toParse) {
-        const parts = [];
-        let startIndex = toParse.indexOf(PART_START);
-        while (startIndex >= 0) {
-            if (startIndex > 0) {
-                // Optional start before parser start.
-                parts.push({ content: toParse.substr(0, startIndex) });
-            }
-            const elem = this.cutFirstGroup(toParse.substr(startIndex));
-            if (elem === 'invalid') {
-                return [];
-            }
-            else if (elem) {
-                parts.push({ content: elem.content, clazz: elem.classes });
-                toParse = elem.rest;
-                startIndex = toParse.indexOf(PART_START);
-            }
-            else {
-                parts.push({ content: toParse });
-            }
-        }
-        // Very end
-        if (toParse.length > 0) {
-            parts.push({ content: toParse });
-        }
-        return parts;
-    }
-    static cutFirstGroup(toCut) {
-        if (!toCut.startsWith(PART_START)) {
-            // String doesnt start with expected parser start.
-            return null;
-        }
-        const afterParserStart = toCut.substr(PART_START.length);
-        let index = afterParserStart.indexOf(PARSE_MIDDLE);
-        if (index <= 0) {
-            console.error('Not able to parse invalid string: ' + toCut);
-            return 'invalid';
-        }
-        const classes = afterParserStart.substr(0, index);
-        let rest = afterParserStart.substr(index + PARSE_MIDDLE.length);
-        index = rest.indexOf(PARSE_END);
-        if (index <= 0) {
-            console.error('Not able to parse invalid string: ' + toCut);
-            return 'invalid';
-        }
-        const content = rest.substr(0, index);
-        rest = rest.substr(index + PARSE_END.length);
-        return { content, classes: classes.split(CLASS_SEPARATOR), rest };
-    }
-}
-MultiStyleTextDirective.decorators = [
-    { type: Directive, args: [{
-                // tslint:disable-next-line:directive-selector
-                selector: '[multiStyleText]'
-            },] }
-];
-/** @nocollapse */
-MultiStyleTextDirective.ctorParameters = () => [
-    { type: ElementRef },
-    { type: Renderer2 }
-];
-MultiStyleTextDirective.propDecorators = {
-    multiStyleText: [{ type: Input }]
-};
-
-const topLeftPosition = {
-    originX: 'start',
-    originY: 'top',
-    overlayX: 'start',
-    overlayY: 'bottom',
-    offsetY: -12
-};
-const topPosition = {
-    originX: 'center',
-    originY: 'top',
-    overlayX: 'center',
-    overlayY: 'bottom',
-    offsetY: -12
-};
-const topRightPosition = {
-    originX: 'end',
-    originY: 'top',
-    overlayX: 'end',
-    overlayY: 'bottom',
-    offsetY: -12
-};
-const bottomLeftPosition = {
-    originX: 'start',
-    originY: 'bottom',
-    overlayX: 'start',
-    overlayY: 'top',
-    offsetY: 12
-};
-const bottomPosition = {
-    originX: 'center',
-    originY: 'bottom',
-    overlayX: 'center',
-    overlayY: 'top',
-    offsetY: 12
-};
-const bottomRightPosition = {
-    originX: 'end',
-    originY: 'bottom',
-    overlayX: 'end',
-    overlayY: 'top',
-    offsetY: 12
-};
-const leftPostion = {
-    originX: 'start',
-    originY: 'center',
-    overlayX: 'end',
-    overlayY: 'center',
-    offsetX: -12
-};
-const rightPosition = {
-    originX: 'end',
-    originY: 'center',
-    overlayX: 'start',
-    overlayY: 'center',
-    offsetX: 12
-};
-const tooltipNeoPositions = {
-    topLeft: topLeftPosition,
-    top: topPosition,
-    topRight: topRightPosition,
-    left: leftPostion,
-    right: rightPosition,
-    bottomLeft: bottomLeftPosition,
-    bottom: bottomPosition,
-    bottomRight: bottomRightPosition
-};
-
-class TooltipNeoService {
-    constructor() {
-        this.clickOutside$ = new Subject();
-    }
-}
-/** @nocollapse */ TooltipNeoService.ɵprov = i0.ɵɵdefineInjectable({ factory: function TooltipNeoService_Factory() { return new TooltipNeoService(); }, token: TooltipNeoService, providedIn: "root" });
-TooltipNeoService.decorators = [
-    { type: Injectable, args: [{
-                providedIn: 'root'
-            },] }
-];
-
-class TooltipNeoComponent {
-    constructor(_elementRef, _tooltipNeoService) {
-        this._elementRef = _elementRef;
-        this._tooltipNeoService = _tooltipNeoService;
-    }
-    ngOnInit() {
-        this.params.borderColor
-            ? this.border = `solid 1px ${this.params.borderColor}`
-            : this.border = undefined;
-    }
-    onClickOutside(event) {
-        if (!this._elementRef.nativeElement.contains(event.target)) {
-            this._tooltipNeoService.clickOutside$.next();
-        }
-    }
-}
-TooltipNeoComponent.decorators = [
-    { type: Component, args: [{
-                selector: 'ap-tooltip-neo',
-                changeDetection: ChangeDetectionStrategy.OnPush,
-                template: "<div @neoTooltip [ngSwitch]=\"params.contentType\"\n     class=\"tooltip {{params.maxWidth}}\"\n     [style.background]=\"params.backgroundColor\"\n     [style.border]=\"border\"\n    >\n    <div *ngIf=\"params.displayArrow\"\n         class=\"arrow-tooltip {{params.position}}\"\n         [class.border]=\"!!params.borderColor\"\n         [style.background]=\"params.backgroundColor\"\n         [style.borderTop]=\"border\"\n         [style.borderRight]=\"border\"\n    ></div>\n    <ng-container *ngIf=\"params.title\">\n        <div class=\"text title\">{{params.title}}</div>\n    </ng-container>\n    <ng-container *ngSwitchCase=\"'text'\">\n        <ng-container *ngIf=\"params.content\">\n            <div class=\"text content\">{{params.content}}</div>\n        </ng-container>\n    </ng-container>\n    <ng-container *ngSwitchCase=\"'template'\">\n        <ng-container *ngTemplateOutlet=\"params.content\">\n        </ng-container>\n    </ng-container>\n</div>\n",
-                animations: [
-                    trigger('neoTooltip', [
-                        transition(':enter', [
-                            style({ opacity: 0 }),
-                            animate(200, style({ opacity: 1 }))
-                        ]),
-                        transition(':leave', [animate(200, style({ opacity: 0 }))])
-                    ])
-                ],
-                styles: ["[color=facebook]{color:#1877f2}[bgcolor=facebook],[hcolor=facebook]:hover{background-color:#1877f2}[border=facebook]{border:1px solid #1877f2}[color=google]{color:#4e85e8}[bgcolor=google],[hcolor=google]:hover{background-color:#4e85e8}[border=google]{border:1px solid #4e85e8}[color=instagram]{color:#e1306c}[bgcolor=instagram],[hcolor=instagram]:hover{background-color:#e1306c}[border=instagram]{border:1px solid #e1306c}[color=instagrammagenta]{color:#c13584}[bgcolor=instagrammagenta],[hcolor=instagrammagenta]:hover{background-color:#c13584}[border=instagrammagenta]{border:1px solid #c13584}[color=instagramblue]{color:#5851db}[bgcolor=instagramblue],[hcolor=instagramblue]:hover{background-color:#5851db}[border=instagramblue]{border:1px solid #5851db}[color=instagrampurple]{color:#833ab4}[bgcolor=instagrampurple],[hcolor=instagrampurple]:hover{background-color:#833ab4}[border=instagrampurple]{border:1px solid #833ab4}[color=instagramorange]{color:#f56040}[bgcolor=instagramorange],[hcolor=instagramorange]:hover{background-color:#f56040}[border=instagramorange]{border:1px solid #f56040}[color=instagramyellow]{color:#ffdc80}[bgcolor=instagramyellow],[hcolor=instagramyellow]:hover{background-color:#ffdc80}[border=instagramyellow]{border:1px solid #ffdc80}[color=linkedin]{color:#2c67bc}[bgcolor=linkedin],[hcolor=linkedin]:hover{background-color:#2c67bc}[border=linkedin]{border:1px solid #2c67bc}[color=twitter]{color:#55acee}[bgcolor=twitter],[hcolor=twitter]:hover{background-color:#55acee}[border=twitter]{border:1px solid #55acee}[color=youtube]{color:red}[bgcolor=youtube],[hcolor=youtube]:hover{background-color:red}[border=youtube]{border:1px solid red}[color=blood-orange]{color:#ff4d00}[bgcolor=blood-orange],[hcolor=blood-orange]:hover{background-color:#ff4d00}[border=blood-orange]{border:1px solid #ff4d00}[color=pinkish-orange]{color:#ff7b49}[bgcolor=pinkish-orange],[hcolor=pinkish-orange]:hover{background-color:#ff7b49}[border=pinkish-orange]{border:1px solid #ff7b49}[color=charcoal-grey]{color:#2a2f34}[bgcolor=charcoal-grey],[hcolor=charcoal-grey]:hover{background-color:#2a2f34}[border=charcoal-grey]{border:1px solid #2a2f34}[color=azure]{color:#00aeef}[bgcolor=azure],[hcolor=azure]:hover{background-color:#00aeef}[border=azure]{border:1px solid #00aeef}[color=light-azure]{color:#eaf5fd}[bgcolor=light-azure],[hcolor=light-azure]:hover{background-color:#eaf5fd}[border=light-azure]{border:1px solid #eaf5fd}[color=blue-grey]{color:#8d98a9}[bgcolor=blue-grey],[hcolor=blue-grey]:hover{background-color:#8d98a9}[border=blue-grey]{border:1px solid #8d98a9}[color=silver]{color:#ced0da}[bgcolor=silver],[hcolor=silver]:hover{background-color:#ced0da}[border=silver]{border:1px solid #ced0da}[color=pale-grey]{color:#dfe3e9}[bgcolor=pale-grey],[hcolor=pale-grey]:hover{background-color:#dfe3e9}[border=pale-grey]{border:1px solid #dfe3e9}[color=grey-white]{color:#f5f7f8}[bgcolor=grey-white],[hcolor=grey-white]:hover{background-color:#f5f7f8}[border=grey-white]{border:1px solid #f5f7f8}[color=cool-grey]{color:#b4bbc6}[bgcolor=cool-grey],[hcolor=cool-grey]:hover{background-color:#b4bbc6}[border=cool-grey]{border:1px solid #b4bbc6}[color=black]{color:#344563}[bgcolor=black],[hcolor=black]:hover{background-color:#344563}[border=black]{border:1px solid #344563}[color=grey-blue]{color:#68768c}[bgcolor=grey-blue],[hcolor=grey-blue]:hover{background-color:#68768c}[border=grey-blue]{border:1px solid #68768c}[color=strawberry]{color:#f4282d}[bgcolor=strawberry],[hcolor=strawberry]:hover{background-color:#f4282d}[border=strawberry]{border:1px solid #f4282d}[color=light-strawberry]{color:#f8eded}[bgcolor=light-strawberry],[hcolor=light-strawberry]:hover{background-color:#f8eded}[border=light-strawberry]{border:1px solid #f8eded}[color=white]{color:#fff}[bgcolor=white],[hcolor=white]:hover{background-color:#fff}[border=white]{border:1px solid #fff}[color=cool-green]{color:#33c15d}[bgcolor=cool-green],[hcolor=cool-green]:hover{background-color:#33c15d}[border=cool-green]{border:1px solid #33c15d}[color=light-green]{color:#ebfaef}[bgcolor=light-green],[hcolor=light-green]:hover{background-color:#ebfaef}[border=light-green]{border:1px solid #ebfaef}[color=transparent]{color:#0000}[bgcolor=transparent],[hcolor=transparent]:hover{background-color:initial}[border=transparent]{border:1px solid #0000}[color=c0]{color:#a566a5}[bgcolor=c0],[hcolor=c0]:hover{background-color:#a566a5}[border=c0]{border:1px solid #a566a5}[color=c1]{color:#c7ab82}[bgcolor=c1],[hcolor=c1]:hover{background-color:#c7ab82}[border=c1]{border:1px solid #c7ab82}[color=c2]{color:#f2713c}[bgcolor=c2],[hcolor=c2]:hover{background-color:#f2713c}[border=c2]{border:1px solid #f2713c}[color=c3]{color:#ffd006}[bgcolor=c3],[hcolor=c3]:hover{background-color:#ffd006}[border=c3]{border:1px solid #ffd006}[color=c4]{color:#94c5aa}[bgcolor=c4],[hcolor=c4]:hover{background-color:#94c5aa}[border=c4]{border:1px solid #94c5aa}[color=c5]{color:#2a9d8f}[bgcolor=c5],[hcolor=c5]:hover{background-color:#2a9d8f}[border=c5]{border:1px solid #2a9d8f}[color=c6]{color:#78acd8}[bgcolor=c6],[hcolor=c6]:hover{background-color:#78acd8}[border=c6]{border:1px solid #78acd8}[color=c7]{color:#525a9e}[bgcolor=c7],[hcolor=c7]:hover{background-color:#525a9e}[border=c7]{border:1px solid #525a9e}[color=c8]{color:#6a2459}[bgcolor=c8],[hcolor=c8]:hover{background-color:#6a2459}[border=c8]{border:1px solid #6a2459}[color=c9]{color:#74729e}[bgcolor=c9],[hcolor=c9]:hover{background-color:#74729e}[border=c9]{border:1px solid #74729e}.tooltip{border-radius:8px;filter:drop-shadow(0 0 10px rgba(0,0,0,.08));position:relative;display:flex;flex-direction:column;align-items:flex-start;min-height:18px}.tooltip .arrow-tooltip{position:absolute;height:12px;width:12px;border-top-right-radius:2px}.tooltip .arrow-tooltip.topLeft{left:12px;top:calc(100% - 6px);transform:rotate(135deg)}.tooltip .arrow-tooltip.top{left:calc(50% - 6px);top:calc(100% - 6px);transform:rotate(135deg)}.tooltip .arrow-tooltip.topRight{right:12px;top:calc(100% - 6px);transform:rotate(135deg)}.tooltip .arrow-tooltip.left{top:calc(50% - 6px);transform:rotate(45deg)}.tooltip .arrow-tooltip.left:not(.border){right:-6px}.tooltip .arrow-tooltip.left.border{right:-7px}.tooltip .arrow-tooltip.right{top:calc(50% - 6px);transform:rotate(-135deg)}.tooltip .arrow-tooltip.right:not(.border){left:-6px}.tooltip .arrow-tooltip.right.border{left:-7px}.tooltip .arrow-tooltip.bottomLeft{left:12px;transform:rotate(-45deg)}.tooltip .arrow-tooltip.bottomLeft:not(.border){top:-6px}.tooltip .arrow-tooltip.bottomLeft.border{top:-7px}.tooltip .arrow-tooltip.bottom{left:calc(50% - 6px);transform:rotate(-45deg)}.tooltip .arrow-tooltip.bottom:not(.border){top:-6px}.tooltip .arrow-tooltip.bottom.border{top:-7px}.tooltip .arrow-tooltip.bottomRight{right:12px;transform:rotate(-45deg)}.tooltip .arrow-tooltip.bottomRight:not(.border){top:-6px}.tooltip .arrow-tooltip.bottomRight.border{top:-7px}.tooltip.full{max-width:350px}.tooltip.medium{max-width:300px}.tooltip .text{font-size:14px;color:#212e44}.tooltip .title{align-items:flex-start;font-weight:700;margin:8px 16px 0}.tooltip .content{padding:8px 16px;overflow-wrap:anywhere}"]
-            },] }
-];
-/** @nocollapse */
-TooltipNeoComponent.ctorParameters = () => [
-    { type: ElementRef },
-    { type: TooltipNeoService }
-];
-TooltipNeoComponent.propDecorators = {
-    params: [{ type: Input }],
-    onClickOutside: [{ type: HostListener, args: ['document:click', ['$event'],] }]
-};
-
-class TooltipNeoDirective {
-    constructor(_elementRef, _overlay, _overlayPositionBuilder, _tooltipNeoService) {
-        this._elementRef = _elementRef;
-        this._overlay = _overlay;
-        this._overlayPositionBuilder = _overlayPositionBuilder;
-        this._tooltipNeoService = _tooltipNeoService;
-        this._destroy$ = new Subject();
-        this._hide$ = new Subject();
-        this._mouseEntered = false;
-        this._show$ = new Subject();
-    }
-    static enableTooltip(content, contentType, display) {
-        return !!content && !!contentType && !!display;
-    }
-    ngOnChanges(changes) {
-        var _a, _b, _c, _d;
-        if ((((_b = (_a = changes === null || changes === void 0 ? void 0 : changes.apTooltipNeo) === null || _a === void 0 ? void 0 : _a.currentValue) === null || _b === void 0 ? void 0 : _b.display) || ((_d = (_c = changes === null || changes === void 0 ? void 0 : changes.apTooltipNeo) === null || _c === void 0 ? void 0 : _c.currentValue) === null || _d === void 0 ? void 0 : _d.position)) && this._mouseEntered) {
-            this._setSettings();
-            this._allowDisplay ? this._show$.next(true) : this._hide$.next(false);
-        }
-    }
-    ngOnInit() {
-        this._initiateTooltip();
-    }
-    ngOnDestroy() {
-        this._detach();
-        this._destroy$.next();
-        this._destroy$.complete();
-    }
-    _setSettings() {
-        if (typeof this.apTooltipNeo === 'object') {
-            const { content = undefined, backgroundColor = '#ffffff', borderColor = undefined, contentType = 'text', display = true, displayArrow = true, maxWidth = 'full', position = 'top', title = '' } = this.apTooltipNeo;
-            this._params = { content, backgroundColor, borderColor, contentType, display, displayArrow, maxWidth, position, title };
-            this._allowDisplay = TooltipNeoDirective.enableTooltip(content, contentType, display);
-        }
-        if (typeof this.apTooltipNeo === 'string') {
-            const content = this.apTooltipNeo, backgroundColor = '#ffffff', borderColor = undefined, contentType = 'text', display = true, displayArrow = true, maxWidth = 'full', position = 'top', title = '';
-            this._params = { content, backgroundColor, borderColor, contentType, position, display, displayArrow, title, maxWidth };
-            this._allowDisplay = TooltipNeoDirective.enableTooltip(content, contentType, display);
-        }
-    }
-    _initiateTooltip() {
-        merge(this._hide$, this._show$)
-            .pipe(switchMap(bool => {
-            if (!bool) {
-                return of(bool);
-            }
-            return of(bool).pipe(delay(200));
-        }), takeUntil(this._destroy$))
-            .subscribe(bool => {
-            if (bool) {
-                this._elementRefMouseLeave$ = fromEvent(this._elementRef.nativeElement, 'mouseleave')
-                    .subscribe(() => this._detach());
-                const positionStrategy = this._overlayPositionBuilder
-                    .flexibleConnectedTo(this._elementRef)
-                    .withPositions([tooltipNeoPositions[this._params.position]]);
-                const scrollStrategy = this._overlay.scrollStrategies.close();
-                this._overlayRef = this._overlay.create({ positionStrategy, scrollStrategy });
-                const tooltipRef = this._overlayRef.attach(new ComponentPortal(TooltipNeoComponent));
-                tooltipRef.instance.params = this._params;
-            }
-            else {
-                this._detach();
-            }
-        });
-        this._tooltipNeoService.clickOutside$
-            .pipe(takeUntil(this._destroy$))
-            .subscribe(() => this._hide$.next());
-    }
-    _detach() {
-        this._overlayRef && this._overlayRef.hasAttached() && this._overlayRef.detach();
-        this._elementRefMouseLeave$ && this._elementRefMouseLeave$.unsubscribe();
-    }
-    onMouseEnter() {
-        this._setSettings();
-        this._mouseEntered = true;
-        this._allowDisplay && this._params && this._show$.next(true);
-    }
-    onMouseLeave() {
-        this._mouseEntered = false;
-        this._hide$.next(false);
-    }
-}
-TooltipNeoDirective.decorators = [
-    { type: Directive, args: [{ selector: '[apTooltipNeo]' },] }
-];
-/** @nocollapse */
-TooltipNeoDirective.ctorParameters = () => [
-    { type: ElementRef },
-    { type: Overlay },
-    { type: OverlayPositionBuilder },
-    { type: TooltipNeoService }
-];
-TooltipNeoDirective.propDecorators = {
-    apTooltipNeo: [{ type: Input }],
-    onMouseEnter: [{ type: HostListener, args: ['mouseenter',] }],
-    onMouseLeave: [{ type: HostListener, args: ['mouseleave',] }]
-};
-
-// Agorapulse
-class TruncateTooltipDirective {
-    constructor(tooltipNeo, elementRef) {
-        this.tooltipNeo = tooltipNeo;
-        this.elementRef = elementRef;
-    }
-    updateTruncateState() {
-        const element = this.elementRef.nativeElement;
-        const truncated = element.scrollWidth > element.clientWidth;
-        this.tooltipNeo.apTooltipNeo = truncated ? this.truncateTooltip : '';
-    }
-    ngOnInit() {
-        this.elementRefMouseOver$ = fromEvent(this.elementRef.nativeElement, 'mouseover')
-            .subscribe(() => this.updateTruncateState());
-    }
-    ngOnDestroy() {
-        this.elementRefMouseOver$.unsubscribe();
-    }
-}
-TruncateTooltipDirective.decorators = [
-    { type: Directive, args: [{ selector: '[apTooltipNeo][truncateTooltip]' },] }
-];
-/** @nocollapse */
-TruncateTooltipDirective.ctorParameters = () => [
-    { type: TooltipNeoDirective },
-    { type: ElementRef }
-];
-TruncateTooltipDirective.propDecorators = {
-    truncateTooltip: [{ type: Input }]
-};
-
-const PASSWORD_CONTROL_VALUE_ACCESSOR = {
-    provide: NG_VALUE_ACCESSOR,
-    useExisting: forwardRef(() => PasswordInputComponent),
-    multi: true
-};
-class PasswordInputComponent {
-    constructor() {
-        this.inputType = PasswordInputComponent.type[1];
-        this.fullWidth = false;
-        this.disabled = false;
-        this.controler = new FormControl('');
-        this.onChange = (password) => { };
-        this.onTouch = () => { };
-    }
-    /**
-     * Change between visible and hidden password
-     */
-    toggleInputType() {
-        this.inputType = PasswordInputComponent.type[PasswordInputComponent.type.indexOf(this.inputType) == 0 ? 1 : 0];
-    }
-    writeValue(obj) {
-        this.controler.setValue(obj);
-    }
-    registerOnChange(fn) {
-        this.onChange = fn;
-    }
-    registerOnTouched(fn) {
-        this.onTouch = fn;
-    }
-    setDisabledState(isDisabled) {
-        this.disabled = isDisabled;
-    }
-    ngOnInit() {
-        this.changes = this.controler.valueChanges.subscribe((val) => {
-            if (this.onChange) {
-                this.onChange(val);
-            }
-        });
-    }
-    ngOnDestroy() {
-        if (this.changes) {
-            this.changes.unsubscribe();
-        }
-    }
-}
-PasswordInputComponent.type = ['text', 'password'];
-PasswordInputComponent.decorators = [
-    { type: Component, args: [{
-                selector: 'ap-password-input',
-                template: "<div class=\"input-group\"\n    [ngClass]=\"{'disabled': disabled, 'full-width': fullWidth}\">\n    <input \n        #passwordInput\n        [type]=\"inputType\"\n        [name]=\"name\"\n        autocomplete=\"password\"\n        [placeholder]=\"placeholder\"\n        [disabled]=\"disabled\"\n        [formControl]=\"controler\"\n        (blur)=\"onTouch && onTouch()\">\n    <ap-symbol\n        (click)=\"toggleInputType()\"\n        class=\"input-group-append\"\n        [symbolId]=\"inputType === 'text' ? 'view-on' : 'view-off'\"\n        size=\"micro\"\n        state=\"full\">\n    </ap-symbol>\n</div>\n",
-                providers: [PASSWORD_CONTROL_VALUE_ACCESSOR],
-                styles: ["[color=facebook]{color:#1877f2}[bgcolor=facebook],[hcolor=facebook]:hover{background-color:#1877f2}[border=facebook]{border:1px solid #1877f2}[color=google]{color:#4e85e8}[bgcolor=google],[hcolor=google]:hover{background-color:#4e85e8}[border=google]{border:1px solid #4e85e8}[color=instagram]{color:#e1306c}[bgcolor=instagram],[hcolor=instagram]:hover{background-color:#e1306c}[border=instagram]{border:1px solid #e1306c}[color=instagrammagenta]{color:#c13584}[bgcolor=instagrammagenta],[hcolor=instagrammagenta]:hover{background-color:#c13584}[border=instagrammagenta]{border:1px solid #c13584}[color=instagramblue]{color:#5851db}[bgcolor=instagramblue],[hcolor=instagramblue]:hover{background-color:#5851db}[border=instagramblue]{border:1px solid #5851db}[color=instagrampurple]{color:#833ab4}[bgcolor=instagrampurple],[hcolor=instagrampurple]:hover{background-color:#833ab4}[border=instagrampurple]{border:1px solid #833ab4}[color=instagramorange]{color:#f56040}[bgcolor=instagramorange],[hcolor=instagramorange]:hover{background-color:#f56040}[border=instagramorange]{border:1px solid #f56040}[color=instagramyellow]{color:#ffdc80}[bgcolor=instagramyellow],[hcolor=instagramyellow]:hover{background-color:#ffdc80}[border=instagramyellow]{border:1px solid #ffdc80}[color=linkedin]{color:#2c67bc}[bgcolor=linkedin],[hcolor=linkedin]:hover{background-color:#2c67bc}[border=linkedin]{border:1px solid #2c67bc}[color=twitter]{color:#55acee}[bgcolor=twitter],[hcolor=twitter]:hover{background-color:#55acee}[border=twitter]{border:1px solid #55acee}[color=youtube]{color:red}[bgcolor=youtube],[hcolor=youtube]:hover{background-color:red}[border=youtube]{border:1px solid red}[color=blood-orange]{color:#ff4d00}[bgcolor=blood-orange],[hcolor=blood-orange]:hover{background-color:#ff4d00}[border=blood-orange]{border:1px solid #ff4d00}[color=pinkish-orange]{color:#ff7b49}[bgcolor=pinkish-orange],[hcolor=pinkish-orange]:hover{background-color:#ff7b49}[border=pinkish-orange]{border:1px solid #ff7b49}[color=charcoal-grey]{color:#2a2f34}[bgcolor=charcoal-grey],[hcolor=charcoal-grey]:hover{background-color:#2a2f34}[border=charcoal-grey]{border:1px solid #2a2f34}[color=azure]{color:#00aeef}[bgcolor=azure],[hcolor=azure]:hover{background-color:#00aeef}[border=azure]{border:1px solid #00aeef}[color=light-azure]{color:#eaf5fd}[bgcolor=light-azure],[hcolor=light-azure]:hover{background-color:#eaf5fd}[border=light-azure]{border:1px solid #eaf5fd}[color=blue-grey]{color:#8d98a9}[bgcolor=blue-grey],[hcolor=blue-grey]:hover{background-color:#8d98a9}[border=blue-grey]{border:1px solid #8d98a9}[color=silver]{color:#ced0da}[bgcolor=silver],[hcolor=silver]:hover{background-color:#ced0da}[border=silver]{border:1px solid #ced0da}[color=pale-grey]{color:#dfe3e9}[bgcolor=pale-grey],[hcolor=pale-grey]:hover{background-color:#dfe3e9}[border=pale-grey]{border:1px solid #dfe3e9}[color=grey-white]{color:#f5f7f8}[bgcolor=grey-white],[hcolor=grey-white]:hover{background-color:#f5f7f8}[border=grey-white]{border:1px solid #f5f7f8}[color=cool-grey]{color:#b4bbc6}[bgcolor=cool-grey],[hcolor=cool-grey]:hover{background-color:#b4bbc6}[border=cool-grey]{border:1px solid #b4bbc6}[color=black]{color:#344563}[bgcolor=black],[hcolor=black]:hover{background-color:#344563}[border=black]{border:1px solid #344563}[color=grey-blue]{color:#68768c}[bgcolor=grey-blue],[hcolor=grey-blue]:hover{background-color:#68768c}[border=grey-blue]{border:1px solid #68768c}[color=strawberry]{color:#f4282d}[bgcolor=strawberry],[hcolor=strawberry]:hover{background-color:#f4282d}[border=strawberry]{border:1px solid #f4282d}[color=light-strawberry]{color:#f8eded}[bgcolor=light-strawberry],[hcolor=light-strawberry]:hover{background-color:#f8eded}[border=light-strawberry]{border:1px solid #f8eded}[color=white]{color:#fff}[bgcolor=white],[hcolor=white]:hover{background-color:#fff}[border=white]{border:1px solid #fff}[color=cool-green]{color:#33c15d}[bgcolor=cool-green],[hcolor=cool-green]:hover{background-color:#33c15d}[border=cool-green]{border:1px solid #33c15d}[color=light-green]{color:#ebfaef}[bgcolor=light-green],[hcolor=light-green]:hover{background-color:#ebfaef}[border=light-green]{border:1px solid #ebfaef}[color=transparent]{color:#0000}[bgcolor=transparent],[hcolor=transparent]:hover{background-color:initial}[border=transparent]{border:1px solid #0000}[color=c0]{color:#a566a5}[bgcolor=c0],[hcolor=c0]:hover{background-color:#a566a5}[border=c0]{border:1px solid #a566a5}[color=c1]{color:#c7ab82}[bgcolor=c1],[hcolor=c1]:hover{background-color:#c7ab82}[border=c1]{border:1px solid #c7ab82}[color=c2]{color:#f2713c}[bgcolor=c2],[hcolor=c2]:hover{background-color:#f2713c}[border=c2]{border:1px solid #f2713c}[color=c3]{color:#ffd006}[bgcolor=c3],[hcolor=c3]:hover{background-color:#ffd006}[border=c3]{border:1px solid #ffd006}[color=c4]{color:#94c5aa}[bgcolor=c4],[hcolor=c4]:hover{background-color:#94c5aa}[border=c4]{border:1px solid #94c5aa}[color=c5]{color:#2a9d8f}[bgcolor=c5],[hcolor=c5]:hover{background-color:#2a9d8f}[border=c5]{border:1px solid #2a9d8f}[color=c6]{color:#78acd8}[bgcolor=c6],[hcolor=c6]:hover{background-color:#78acd8}[border=c6]{border:1px solid #78acd8}[color=c7]{color:#525a9e}[bgcolor=c7],[hcolor=c7]:hover{background-color:#525a9e}[border=c7]{border:1px solid #525a9e}[color=c8]{color:#6a2459}[bgcolor=c8],[hcolor=c8]:hover{background-color:#6a2459}[border=c8]{border:1px solid #6a2459}[color=c9]{color:#74729e}[bgcolor=c9],[hcolor=c9]:hover{background-color:#74729e}[border=c9]{border:1px solid #74729e}:host{display:flex}:host.ng-invalid.ng-dirty.ng-touched:not([disabled]):not(.transparent)>.input-group{border:1px solid #e81313}:host.valid:not([disabled]):not(.transparent)>.input-group{border:1px solid #45b854}.input-group-append{cursor:pointer}"]
-            },] }
-];
-/** @nocollapse */
-PasswordInputComponent.ctorParameters = () => [];
-PasswordInputComponent.propDecorators = {
-    name: [{ type: Input }],
-    placeholder: [{ type: Input }],
-    fullWidth: [{ type: Input }],
-    passwordInput: [{ type: ViewChild, args: ['passwordInput',] }]
-};
-
-const globalRippleConfig = { disabled: true };
-const ɵ0 = { animationDuration: '0ms' };
-class AgorapulseUiComponentsModule {
-}
-AgorapulseUiComponentsModule.decorators = [
-    { type: NgModule, args: [{
-                declarations: [
-                    // Components
-                    AddCommentComponent,
-                    AvatarComponent,
-                    AutosizeTextareaDirective,
-                    StepperComponent,
-                    ConfirmModalComponent,
-                    DatepickerComponent,
-                    DotsStepperComponent,
-                    EditTagsModalComponent,
-                    EllipsisDirective,
-                    ImageCarouselComponent,
-                    FeatureOnboardingComponent,
-                    LeadModalComponent,
-                    MediaDisplayOverlayDialogComponent,
-                    ModalComponent,
-                    OverlayDialogComponent,
-                    OverlayInDivComponent,
-                    PasswordInputComponent,
-                    PasswordStrengthBarComponent,
-                    PasswordStrengthDisplayBarComponent,
-                    PhoneNumberInputComponent,
-                    PlaceComponent,
-                    PlaceListComponent,
-                    SnackBarComponent,
-                    SplashscreenComponent,
-                    StarRatingComponent,
-                    TagComponent,
-                    TagListComponent,
-                    TagsSelectorComponent,
-                    TimepickerComponent,
-                    NeoTimepickerComponent,
-                    TryPopupComponent,
-                    NotificationComponent,
-                    PaginatorComponent,
-                    PaginatorButtonComponent,
-                    SlideToggleComponent,
-                    SnackbarsThreadComponent,
-                    TooltipNeoComponent,
-                    // Directives
-                    AutosizeTextareaDirective,
-                    DefaultImageDirective,
-                    FrozenGifDirective,
-                    SlideToggleComponent,
-                    EqualValidatorDirective,
-                    MultiStyleTextDirective,
-                    TruncateTooltipDirective,
-                    TooltipNeoDirective,
-                ],
-                imports: [
-                    AgorapulseUiSymbolModule,
-                    CommonModule,
-                    NgxDaterangepickerMd,
-                    FormsModule,
-                    ReactiveFormsModule,
-                    NgSelectModule,
-                    PopmenuModule,
-                    OverlayModule,
-                    // Components
-                    MatBadgeModule,
-                    MatButtonModule,
-                    MatButtonToggleModule,
-                    MatChipsModule,
-                    MatExpansionModule,
-                    // MatFormFieldModule,
-                    MatCheckboxModule,
-                    MatIconModule,
-                    // MatInputModule,
-                    MatProgressBarModule,
-                    MatProgressSpinnerModule,
-                    MatRadioModule,
-                    MatSliderModule,
-                    MatSlideToggleModule,
-                    // Navigation
-                    MatMenuModule,
-                    MatSidenavModule,
-                    MatToolbarModule,
-                    // Layout
-                    MatCardModule,
-                    MatDividerModule,
-                    // MatExpansionModule,
-                    MatGridListModule,
-                    MatListModule,
-                    MatTabsModule,
-                    MatStepperModule,
-                    FlexLayoutModule,
-                    // Popups & Modals
-                    MatBottomSheetModule,
-                    MatDialogModule,
-                    MatSnackBarModule,
-                    // Table
-                    MatTableModule,
-                    // Mask
-                    IMaskModule
-                ],
-                exports: [
-                    FormsModule,
-                    ReactiveFormsModule,
-                    // Components
-                    AddCommentComponent,
-                    AvatarComponent,
-                    StepperComponent,
-                    ConfirmModalComponent,
-                    DatepickerComponent,
-                    DotsStepperComponent,
-                    EditTagsModalComponent,
-                    EllipsisDirective,
-                    ImageCarouselComponent,
-                    FeatureOnboardingComponent,
-                    LeadModalComponent,
-                    MediaDisplayOverlayDialogComponent,
-                    ModalComponent,
-                    OverlayDialogComponent,
-                    OverlayInDivComponent,
-                    PhoneNumberInputComponent,
-                    PasswordInputComponent,
-                    PasswordStrengthBarComponent,
-                    PasswordStrengthDisplayBarComponent,
-                    PlaceComponent,
-                    PlaceListComponent,
-                    SnackBarComponent,
-                    SplashscreenComponent,
-                    StarRatingComponent,
-                    TagComponent,
-                    TagListComponent,
-                    TagsSelectorComponent,
-                    TimepickerComponent,
-                    NeoTimepickerComponent,
-                    TryPopupComponent,
-                    NotificationComponent,
-                    PaginatorComponent,
-                    PaginatorButtonComponent,
-                    SlideToggleComponent,
-                    SnackbarsThreadComponent,
-                    // Directives
-                    AutosizeTextareaDirective,
-                    DefaultImageDirective,
-                    FrozenGifDirective,
-                    EqualValidatorDirective,
-                    MultiStyleTextDirective,
-                    TruncateTooltipDirective,
-                    TooltipNeoDirective,
-                    // Modules
-                    NgSelectModule,
-                    PopmenuModule,
-                    // Components
-                    MatBadgeModule,
-                    MatButtonModule,
-                    MatButtonToggleModule,
-                    MatCheckboxModule,
-                    MatChipsModule,
-                    MatExpansionModule,
-                    // MatFormFieldModule,
-                    MatIconModule,
-                    // MatInputModule,
-                    MatProgressBarModule,
-                    MatProgressSpinnerModule,
-                    MatRadioModule,
-                    MatSliderModule,
-                    MatSlideToggleModule,
-                    // Navigation
-                    MatMenuModule,
-                    MatSidenavModule,
-                    MatToolbarModule,
-                    // Layout
-                    MatCardModule,
-                    MatDividerModule,
-                    // MatExpansionModule,
-                    MatGridListModule,
-                    MatListModule,
-                    MatTabsModule,
-                    MatStepperModule,
-                    // Popups & Modals
-                    MatBottomSheetModule,
-                    MatDialogModule,
-                    MatSnackBarModule,
-                    // Table
-                    MatTableModule
-                ],
-                entryComponents: [
-                    ConfirmModalComponent,
-                    LeadModalComponent,
-                    TryPopupComponent,
-                    MediaDisplayOverlayDialogComponent,
-                    ModalComponent,
-                    FeatureOnboardingComponent,
-                    OverlayDialogComponent,
-                    SnackBarComponent
-                ],
-                providers: [
-                    // Disable ripple effect
-                    // {provide: MAT_RIPPLE_GLOBAL_OPTIONS, useValue: {disabled: true}},
-                    // Disable tabs animation
-                    { provide: MAT_TABS_CONFIG, useValue: ɵ0 }
-                ]
-            },] }
-];
-
-const DEFAULT_CONFIG = {
-    hasBackdrop: true,
-    backdropClass: 'dark-backdrop',
-    panelClass: 'tm-file-preview-dialog-panel',
-    template: null
-};
-class OverlayDialogService {
-    constructor(injector, overlay) {
-        this.injector = injector;
-        this.overlay = overlay;
-    }
-    open(config = {}) {
-        const dialogConfig = Object.assign(Object.assign({}, DEFAULT_CONFIG), config);
-        const overlayRef = this.createOverlay(dialogConfig);
-        const dialogRef = new OverlayDialogRef(overlayRef);
-        const overlayComponent = this.attachDialogContainer(overlayRef, dialogConfig, dialogRef);
-        return dialogRef;
-    }
-    createOverlay(config) {
-        const overlayConfig = this.getOverlayConfig(config);
-        return this.overlay.create(overlayConfig);
-    }
-    attachDialogContainer(overlayRef, config, dialogRef) {
-        const injector = this.createInjector(config, dialogRef);
-        const containerPortal = new ComponentPortal(OverlayDialogComponent, null, injector);
-        const containerRef = overlayRef.attach(containerPortal);
-        return containerRef.instance;
-    }
-    createInjector(config, dialogRef) {
-        const injectionTokens = new WeakMap();
-        injectionTokens.set(OverlayDialogRef, dialogRef);
-        injectionTokens.set(OVERLAY_DATA, config.template);
-        return new PortalInjector(this.injector, injectionTokens);
-    }
-    getOverlayConfig(config) {
-        const positionStrategy = this.overlay.position()
-            .global()
-            .centerHorizontally()
-            .centerVertically();
-        const overlayConfig = new OverlayConfig({
-            hasBackdrop: config.hasBackdrop,
-            backdropClass: config.backdropClass,
-            panelClass: config.panelClass,
-            scrollStrategy: this.overlay.scrollStrategies.block(),
-            positionStrategy
-        });
-        return overlayConfig;
-    }
-}
-OverlayDialogService.decorators = [
-    { type: Injectable }
-];
-/** @nocollapse */
-OverlayDialogService.ctorParameters = () => [
-    { type: Injector },
-    { type: Overlay }
-];
-
-class CodeStatus {
-    constructor(snackbarText, snackbarType) {
-        this.snackbarText = snackbarText;
-        this.snackbarType = snackbarType;
-    }
-}
-class CodeStatusInfo extends CodeStatus {
-    constructor(snackbarText) {
-        super(snackbarText, 0);
-    }
-}
-class CodeStatusSuccess extends CodeStatus {
-    constructor(snackbarText) {
-        super(snackbarText, 1);
-    }
-}
-class CodeStatusWarning extends CodeStatus {
-    constructor(snackbarText) {
-        super(snackbarText, 2);
-    }
-}
-class CodeStatusError extends CodeStatus {
-    constructor(snackbarText) {
-        super(snackbarText, 3);
-    }
-}
-function generateCodeStatus(text, type) {
-    switch (type) {
-        case 'info':
-            return new CodeStatusInfo(text);
-        case 'success':
-            return new CodeStatusSuccess(text);
-        case 'warning':
-            return new CodeStatusWarning(text);
-        case 'error':
-            return new CodeStatusError(text);
-        default:
-            return new CodeStatusInfo(text);
-    }
-}
-
-/*
- * Public API Surface of ui
- */
-
-/**
- * Generated bundle index. Do not edit.
- */
-
-export { AddCommentComponent, AgorapulseUiComponentsModule, AutosizeTextareaDirective, AvatarComponent, ConfirmModalComponent, DatepickerComponent, DatepickerMode, DefaultImageDirective, DotsStepperComponent, EditTagsModalComponent, EllipsisDirective, EqualValidatorDirective, FeatureOnboardingComponent, FrozenGifDirective, ImageCarouselComponent, InstagramCarouselItemType, LeadModalComponent, MediaDisplayOverlayDialogComponent, ModalComponent, MultiStyleTextDirective, NotificationComponent, OverlayDialogComponent, OverlayDialogService, OverlayInDivComponent, PaginatorButtonComponent, PaginatorComponent, PasswordInputComponent, PasswordStrengthBarComponent, PasswordStrengthDisplayBarComponent, PhoneNumberInputComponent, PlaceComponent, PlaceListComponent, PopmenuComponent, PopmenuDirective, PopmenuModule, SlideToggleComponent, SnackBarComponent, SnackbarsThreadComponent, SnackbarsThreadService, SplashscreenComponent, StarRatingComponent, StepperComponent, TagComponent, TagListComponent, TagsSelectorComponent, TimeFormat, TimepickerComponent, TooltipNeoDirective, TruncateTooltipDirective, TryPopupComponent, generateCodeStatus, OverlayDialogRef as ɵa, OVERLAY_DATA as ɵb, PASSWORD_CONTROL_VALUE_ACCESSOR as ɵc, NeoTimepickerComponent as ɵd, TooltipNeoComponent as ɵe, TooltipNeoService as ɵf, PopmenuOptionsService as ɵg };
-//# sourceMappingURL=agorapulse-ui-components.js.map