UNPKG

@ngx-performance-ui/ui

Version:
2,758 lines 105 kB
import * as enLocale from 'date-fns/locale/en';
import * as trLocale from 'date-fns/locale/tr';
import { NG_VALUE_ACCESSOR } from '@angular/forms';
import compare from 'just-compare';
import { DomSanitizer } from '@angular/platform-browser';
import { isNullOrUndefined } from 'util';
import { timer, Observable, Subject } from 'rxjs';
import { take, filter, takeUntil } from 'rxjs/operators';
import { __extends, __decorate, __assign, __spread, __metadata } from 'tslib';
import { EventEmitter, Input, Output, Component, ChangeDetectionStrategy, ElementRef, forwardRef, Injector, ViewChild, ViewEncapsulation, ChangeDetectorRef, ContentChild, Renderer2, TemplateRef, Inject, ComponentFactoryResolver, ViewContainerRef, Directive, ApplicationRef, ReflectiveInjector, NgModule } from '@angular/core';
import { NgDatepickerModule } from 'ng2-datepicker';
import { AbstractNgModelComponent, uuid, takeUntilDestroy, LazyLoadScriptService, EventListenerState, LoaderState, takeUntilNotNull, EventListenerRemove, EventListenerAdd, EventListenerScrollVertical, CoreModule } from '@ngx-performance-ui/core';
import { Store, Select, Actions, ofActionDispatched, State, NgxsModule } from '@ngxs/store';
import { PerfectScrollbarModule } from 'ngx-perfect-scrollbar';
import { FontAwesomeModule } from '@fortawesome/angular-fontawesome';
import { library } from '@fortawesome/fontawesome-svg-core';
import { faCalendarDay, faInfoCircle, faSearch, faTimes } from '@fortawesome/free-solid-svg-icons';
import { NgxSlickJsModule } from 'ngx-slickjs';

/**
 * @fileoverview added by tsickle
 * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
 */
/**
 * @template T
 */
var AbstractInputComponent = /** @class */ (function (_super) {
    __extends(AbstractInputComponent, _super);
    function AbstractInputComponent() {
        var _this = _super !== null && _super.apply(this, arguments) || this;
        _this.autofocus = false;
        _this.autofocusDelay = 0;
        _this.id = uuid();
        _this.required = false;
        _this.hidden = false;
        _this.placeholder = '';
        _this.type = 'text';
        _this.blur = new EventEmitter();
        _this.focus = new EventEmitter();
        _this.keyup = new EventEmitter();
        _this.click = new EventEmitter();
        return _this;
    }
    AbstractInputComponent.decorators = [
        { type: Component, args: [{
                    template: ''
                }] }
    ];
    AbstractInputComponent.propDecorators = {
        autofocus: [{ type: Input }],
        autofocusDelay: [{ type: Input }],
        classes: [{ type: Input }],
        labelText: [{ type: Input }],
        labelClasses: [{ type: Input }],
        id: [{ type: Input }],
        name: [{ type: Input }],
        tabindex: [{ type: Input }],
        required: [{ type: Input }],
        hidden: [{ type: Input }],
        placeholder: [{ type: Input }],
        type: [{ type: Input }],
        blur: [{ type: Output }],
        focus: [{ type: Output }],
        keyup: [{ type: Output }],
        click: [{ type: Output }]
    };
    return AbstractInputComponent;
}(AbstractNgModelComponent));

/**
 * @fileoverview added by tsickle
 * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
 */

/**
 * @fileoverview added by tsickle
 * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
 */
var LayoutScroll = /** @class */ (function () {
    function LayoutScroll(payload) {
        this.payload = payload;
    }
    LayoutScroll.type = '[Layout] Scroll';
    return LayoutScroll;
}());

/**
 * @fileoverview added by tsickle
 * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
 */
var ToasterShow = /** @class */ (function () {
    function ToasterShow(payload) {
        this.payload = payload;
    }
    ToasterShow.type = '[Toaster] Show]';
    return ToasterShow;
}());

/**
 * @fileoverview added by tsickle
 * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
 */

/**
 * @fileoverview added by tsickle
 * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
 */
var AutocompleteComponent = /** @class */ (function (_super) {
    __extends(AutocompleteComponent, _super);
    function AutocompleteComponent(injector) {
        var _this = _super.call(this, injector) || this;
        _this.injector = injector;
        _this.items = [];
        _this.containerClasses = '';
        _this.delay = 200;
        _this.select = new EventEmitter();
        _this.placeholder = 'Type in here';
        _this.autocomplete = 'nop';
        _this.showList = false;
        _this.inputValue = '';
        _this.valueFn = (/**
         * @param {?} value
         * @return {?}
         */
        function (value) {
            if (!value)
                return value;
            _this.inputValue = value.text;
            return value;
        });
        _this.trackByFn = (/**
         * @param {?} _
         * @param {?} value
         * @return {?}
         */
        function (_, value) { return value.text; });
        return _this;
    }
    /**
     * @return {?}
     */
    AutocompleteComponent.prototype.ngOnDestroy = /**
     * @return {?}
     */
    function () { };
    /**
     * @param {?} event
     * @return {?}
     */
    AutocompleteComponent.prototype.onBlur = /**
     * @param {?} event
     * @return {?}
     */
    function (event) {
        var _this = this;
        timer(this.delay)
            .pipe(takeUntilDestroy(this))
            .subscribe((/**
         * @return {?}
         */
        function () {
            _this.showList = false;
            _this.inputValue = (_this.value || { text: '' }).text;
            _this.cdRef.detectChanges();
        }));
        this.blur.emit(event);
    };
    /**
     * @param {?} event
     * @return {?}
     */
    AutocompleteComponent.prototype.onFocus = /**
     * @param {?} event
     * @return {?}
     */
    function (event) {
        var _this = this;
        timer(this.delay)
            .pipe(takeUntilDestroy(this))
            .subscribe((/**
         * @return {?}
         */
        function () {
            _this.showList = true;
            _this.cdRef.detectChanges();
        }));
        this.focus.emit(event);
    };
    /**
     * @param {?} item
     * @return {?}
     */
    AutocompleteComponent.prototype.onSelect = /**
     * @param {?} item
     * @return {?}
     */
    function (item) {
        this.value = item;
        this.select.emit(item);
    };
    /**
     * @param {?} value
     * @return {?}
     */
    AutocompleteComponent.prototype.onChangeInputValue = /**
     * @param {?} value
     * @return {?}
     */
    function (value) {
        /** @type {?} */
        var found = this.items.find((/**
         * @param {?} item
         * @return {?}
         */
        function (item) { return item.text.toLocaleLowerCase() === value.toLocaleLowerCase(); }));
        if (found) {
            this.value = found;
            this.inputValue = found.text;
            return;
        }
        if (!value || value === '')
            this.value = undefined;
    };
    /**
     * @return {?}
     */
    AutocompleteComponent.prototype.clear = /**
     * @return {?}
     */
    function () {
        this.value = undefined;
        this.inputValue = '';
        this.showList = false;
    };
    AutocompleteComponent.decorators = [
        { type: Component, args: [{
                    selector: 'p-autocomplete',
                    template: "\n    <div class=\"autocomplete-container {{ containerClasses }}\">\n      <label *ngIf=\"labelText\" class=\"{{ labelClasses }}\" [attr.for]=\"id\" [innerHTML]=\"labelText\"></label>\n      <p-input\n        [(ngModel)]=\"inputValue\"\n        (ngModelChange)=\"onChangeInputValue($event)\"\n        class=\"w-100 {{ classes }}\"\n        [id]=\"id\"\n        [attr.type]=\"type\"\n        [attr.placeholder]=\"placeholder\"\n        [hidden]=\"hidden\"\n        [name]=\"name\"\n        [disabled]=\"disabled\"\n        [attr.tabindex]=\"tabindex\"\n        [required]=\"required\"\n        [autofocus]=\"autofocus\"\n        [autofocusDelay]=\"autofocusDelay\"\n        autocomplete=\"nop\"\n        (focus)=\"onFocus($event)\"\n        (blur)=\"onBlur($event)\"\n        (click)=\"click.emit($event)\"\n      ></p-input>\n      <fa-icon *ngIf=\"value\" [icon]=\"['fas', 'times']\" class=\"text-secondary\" (click)=\"clear()\"></fa-icon>\n      <div *ngIf=\"showList\" class=\"list-group\">\n        <a\n          [pHighlight]=\"inputValue\"\n          [pHighlightHide]=\"true\"\n          *ngFor=\"let item of items; trackBy: trackByFn\"\n          class=\"list-group-item list-group-item-action\"\n          [class.list-group-item-secondary]=\"value?.text === item.text\"\n          (click)=\"onSelect(item)\"\n        >\n          {{ item.text }}\n        </a>\n      </div>\n    </div>\n  ",
                    changeDetection: ChangeDetectionStrategy.OnPush,
                    encapsulation: ViewEncapsulation.None,
                    providers: [
                        {
                            provide: NG_VALUE_ACCESSOR,
                            useExisting: forwardRef((/**
                             * @return {?}
                             */
                            function () { return AutocompleteComponent; })),
                            multi: true,
                        },
                    ]
                }] }
    ];
    /** @nocollapse */
    AutocompleteComponent.ctorParameters = function () { return [
        { type: Injector }
    ]; };
    AutocompleteComponent.propDecorators = {
        items: [{ type: Input }],
        containerClasses: [{ type: Input }],
        delay: [{ type: Input }],
        select: [{ type: Output }],
        placeholder: [{ type: Input }],
        input: [{ type: ViewChild, args: ['input', { read: ElementRef },] }]
    };
    return AutocompleteComponent;
}(AbstractInputComponent));

/**
 * @fileoverview added by tsickle
 * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
 */
// https://developers.google.com/chart/interactive/docs/
var GoogleChartComponent = /** @class */ (function () {
    function GoogleChartComponent(lazyLoadScriptService) {
        var _this = this;
        this.lazyLoadScriptService = lazyLoadScriptService;
        this.chartType = 'AreaChart';
        this.style = { width: '100%', height: 'auto' };
        this.containerClasses = '';
        this.drawFn = (/**
         * @param {?} _
         * @return {?}
         */
        function (_) {
            if (_this.dataTable && _this.dataTable.length) {
                _this.data = google.visualization.arrayToDataTable(_this.dataTable);
            }
            else if (_this.columns && _this.columns.length && _this.rows && _this.rows.length) {
                _this.data = new google.visualization.DataTable();
                _this.columns.forEach((/**
                 * @param {?} column
                 * @return {?}
                 */
                function (column) { return _this.data.addColumn(column.type, column.label); }));
                _this.data.addRows(_this.rows);
            }
            else {
                console.error('Must set datatable or columns and rows inputs');
                return;
            }
            _this.chart = new google.visualization[_this.chartType](_this.chartContainer.nativeElement);
            _this.chart.draw(_this.data, _this.options);
            _this.ready.emit();
        });
        this.ready = new EventEmitter();
    }
    Object.defineProperty(GoogleChartComponent.prototype, "packages", {
        get: /**
         * @return {?}
         */
        function () {
            if (this.chartType === 'AnnotationChart')
                return [this.chartType.toLowerCase()];
            return ['corechart'];
        },
        enumerable: true,
        configurable: true
    });
    /**
     * @return {?}
     */
    GoogleChartComponent.prototype.ngAfterViewInit = /**
     * @return {?}
     */
    function () {
        var _this = this;
        this.lazyLoadScriptService
            .loadScript('https://www.gstatic.com/charts/loader.js')
            .pipe(take(1))
            .subscribe((/**
         * @param {?} _
         * @return {?}
         */
        function (_) {
            google.charts.load('current', { packages: _this.packages });
            google.charts.setOnLoadCallback(_this.drawFn);
        }));
    };
    GoogleChartComponent.decorators = [
        { type: Component, args: [{
                    selector: 'p-google-chart',
                    template: "\n    <div #chartContainer class=\"{{ containerClasses }}\" [ngStyle]=\"style\"></div>\n  ",
                    changeDetection: ChangeDetectionStrategy.OnPush,
                    encapsulation: ViewEncapsulation.None
                }] }
    ];
    /** @nocollapse */
    GoogleChartComponent.ctorParameters = function () { return [
        { type: LazyLoadScriptService }
    ]; };
    GoogleChartComponent.propDecorators = {
        chartType: [{ type: Input }],
        dataTable: [{ type: Input }],
        columns: [{ type: Input }],
        rows: [{ type: Input }],
        options: [{ type: Input }],
        style: [{ type: Input }],
        containerClasses: [{ type: Input }],
        drawFn: [{ type: Input }],
        ready: [{ type: Output }],
        chartContainer: [{ type: ViewChild, args: ['chartContainer',] }]
    };
    return GoogleChartComponent;
}());

/**
 * @fileoverview added by tsickle
 * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
 */
var AnnotationChartComponent = /** @class */ (function () {
    function AnnotationChartComponent(store) {
        this.store = store;
        // https://developers.google.com/chart/interactive/docs/gallery/annotationchart
        this.annotationChartColumns = [
            { type: 'date', label: 'Date' },
            { type: 'number', label: 'Kepler-22b mission' },
            { type: 'string', label: 'Kepler title' },
            { type: 'string', label: 'Kepler text' },
            { type: 'number', label: 'Gliese 163 mission' },
            { type: 'string', label: 'Gliese title' },
            { type: 'string', label: 'Gliese text' },
        ];
        this.annotationChartRows = [
            [new Date(2314, 2, 15), 12400, undefined, undefined, 10645, undefined, undefined],
            [new Date(2314, 2, 16), 24045, 'Lalibertines', 'First encounter', 12374, undefined, undefined],
            [new Date(2314, 2, 17), 35022, 'Lalibertines', 'They are very tall', 15766, 'Gallantors', 'First Encounter'],
            [
                new Date(2314, 2, 18),
                12284,
                'Lalibertines',
                'Attack on our crew!',
                34334,
                'Gallantors',
                'Statement of shared principles',
            ],
            [new Date(2314, 2, 19), 8476, 'Lalibertines', 'Heavy casualties', 66467, 'Gallantors', 'Mysteries revealed'],
            [new Date(2314, 2, 20), 0, 'Lalibertines', 'All crew lost', 79463, 'Gallantors', 'Omniscience achieved'],
        ];
        this.annotationChartOptions = {
            displayAnnotations: true,
        };
    }
    Object.defineProperty(AnnotationChartComponent.prototype, "chart", {
        get: /**
         * @return {?}
         */
        function () {
            return this.annotationChart.chart;
        },
        enumerable: true,
        configurable: true
    });
    /**
     * @return {?}
     */
    AnnotationChartComponent.prototype.rangeChangeHandler = /**
     * @return {?}
     */
    function () {
        google.visualization.events.addListener(this.chart, 'rangechange', (/**
         * @param {?} event
         * @return {?}
         */
        function (event) {
            console.log('You changed the range to ', event['start'], ' and ', event['end']);
        }));
    };
    /**
     * @return {?}
     */
    AnnotationChartComponent.prototype.clearChart = /**
     * @return {?}
     */
    function () {
        this.chart.clearChart();
    };
    /**
     * @return {?}
     */
    AnnotationChartComponent.prototype.getContainer = /**
     * @return {?}
     */
    function () {
        console.log(this.chart.getContainer());
        this.showToaster();
    };
    /**
     * @return {?}
     */
    AnnotationChartComponent.prototype.getSelection = /**
     * @return {?}
     */
    function () {
        console.log(this.chart.getSelection());
        this.showToaster();
    };
    /**
     * @return {?}
     */
    AnnotationChartComponent.prototype.getVisibleChartRange = /**
     * @return {?}
     */
    function () {
        console.log(this.chart.getVisibleChartRange());
        this.showToaster();
    };
    /**
     * @param {?} index
     * @return {?}
     */
    AnnotationChartComponent.prototype.hideDataColumns = /**
     * @param {?} index
     * @return {?}
     */
    function (index) {
        this.chart.hideDataColumns(index);
    };
    /**
     * @param {?} index
     * @return {?}
     */
    AnnotationChartComponent.prototype.showDataColumns = /**
     * @param {?} index
     * @return {?}
     */
    function (index) {
        this.chart.showDataColumns(index);
    };
    /**
     * @param {?} start
     * @param {?} end
     * @return {?}
     */
    AnnotationChartComponent.prototype.setVisibleChartRange = /**
     * @param {?} start
     * @param {?} end
     * @return {?}
     */
    function (start, end) {
        this.chart.setVisibleChartRange(start, end);
    };
    /**
     * @return {?}
     */
    AnnotationChartComponent.prototype.showToaster = /**
     * @return {?}
     */
    function () {
        this.store.dispatch(new ToasterShow({ body: 'Check the console' }));
    };
    AnnotationChartComponent.decorators = [
        { type: Component, args: [{
                    selector: 'p-annotation-chart',
                    template: "\n    <p-google-chart\n      #annotationChart\n      chartType=\"AnnotationChart\"\n      [columns]=\"annotationChartColumns\"\n      [rows]=\"annotationChartRows\"\n      [options]=\"annotationChartOptions\"\n      (ready)=\"rangeChangeHandler()\"\n    ></p-google-chart>\n\n    <div *ngIf=\"chart\" class=\"row mt-2\">\n      <div class=\"col-12\">\n        <h4>Methods</h4>\n        <button (click)=\"clearChart()\" class=\"btn btn-sm btn-secondary m-1\">clearChart()</button>\n        <button (click)=\"hideDataColumns([1, 2, 3])\" class=\"btn btn-sm btn-secondary m-1\">\n          hideDataColumns(columnIndexes)\n        </button>\n        <button (click)=\"showDataColumns([1, 2, 3])\" class=\"btn btn-sm btn-secondary m-1\">\n          showDataColumns(columnIndexes)\n        </button>\n        <button (click)=\"getContainer()\" class=\"btn btn-sm btn-secondary m-1\">getContainer()</button>\n        <button (click)=\"getSelection()\" class=\"btn btn-sm btn-secondary m-1\">getSelection()</button>\n        <button (click)=\"getVisibleChartRange()\" class=\"btn btn-sm btn-secondary m-1\">getVisibleChartRange()</button>\n        <button\n          (click)=\"setVisibleChartRange(annotationChartRows[0][0], annotationChartRows[1][0])\"\n          class=\"btn btn-sm btn-secondary m-1\"\n        >\n          setVisibleChartRange(start, end)\n        </button>\n      </div>\n    </div>\n  ",
                    changeDetection: ChangeDetectionStrategy.OnPush,
                    encapsulation: ViewEncapsulation.None
                }] }
    ];
    /** @nocollapse */
    AnnotationChartComponent.ctorParameters = function () { return [
        { type: Store }
    ]; };
    AnnotationChartComponent.propDecorators = {
        annotationChart: [{ type: ViewChild, args: ['annotationChart',] }]
    };
    return AnnotationChartComponent;
}());

/**
 * @fileoverview added by tsickle
 * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
 */

/**
 * @fileoverview added by tsickle
 * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
 */
var DatePickerComponent = /** @class */ (function (_super) {
    __extends(DatePickerComponent, _super);
    function DatePickerComponent(injector) {
        var _this = _super.call(this, injector) || this;
        _this.injector = injector;
        _this.locale = 'tr';
        _this.position = 'bottom-right';
        _this.barTitleIfEmpty = 'Click to select a date';
        _this.placeholder = 'Click to select a date';
        _this.addClass = 'form-control';
        _this.labelClass = '';
        _this.label = 'Start Date';
        _this.destroy$ = new Subject();
        _this.closable = false;
        return _this;
    }
    Object.defineProperty(DatePickerComponent.prototype, "options", {
        get: /**
         * @return {?}
         */
        function () {
            return {
                minYear: 1890,
                maxYear: 2040,
                displayFormat: this.displayFormat,
                barTitleFormat: 'MMMM YYYY',
                dayNamesFormat: 'dd',
                firstCalendarDay: 1,
                // 0 - Sunday, 1 - Monday
                locale: this.locale === 'tr' ? trLocale : enLocale,
                barTitleIfEmpty: this.barTitleIfEmpty,
                placeholder: this.placeholder,
                // HTML input placeholder attribute (default: '')
                addClass: this.addClass,
                // Optional, value to pass on to [ngClass] on the input field
                fieldId: "p-date-picker-" + uuid(),
            };
        },
        enumerable: true,
        configurable: true
    });
    Object.defineProperty(DatePickerComponent.prototype, "displayFormat", {
        get: /**
         * @return {?}
         */
        function () {
            return this.locale === 'tr' ? 'dd.MM.yyyy' : 'MMM d, y';
        },
        enumerable: true,
        configurable: true
    });
    Object.defineProperty(DatePickerComponent.prototype, "date", {
        get: /**
         * @return {?}
         */
        function () {
            return this.value ? new Date(this.value) : null;
        },
        enumerable: true,
        configurable: true
    });
    /**
     * @private
     * @return {?}
     */
    DatePickerComponent.prototype.subscribeToEvents = /**
     * @private
     * @return {?}
     */
    function () {
        var _this = this;
        this.click$
            .pipe(takeUntil(this.destroy$), filter((/**
         * @param {?} event
         * @return {?}
         */
        function (event) {
            return event &&
                _this.closable &&
                !_this.group.nativeElement.contains(event.target) &&
                !document.querySelector('#datepicker').contains((/** @type {?} */ (event.target)));
        })))
            .subscribe((/**
         * @return {?}
         */
        function () { return _this.toggle(); }));
    };
    /**
     * @return {?}
     */
    DatePickerComponent.prototype.ngOnDestroy = /**
     * @return {?}
     */
    function () {
        this.destroy$.next();
    };
    /**
     * @return {?}
     */
    DatePickerComponent.prototype.onClick = /**
     * @return {?}
     */
    function () {
        if (this.datePicker.isOpened)
            return;
        this.toggle();
    };
    /**
     * @return {?}
     */
    DatePickerComponent.prototype.toggle = /**
     * @return {?}
     */
    function () {
        var _this = this;
        if (this.datePicker.isOpened) {
            this.hide();
        }
        else {
            this.show();
        }
        setTimeout((/**
         * @return {?}
         */
        function () { return _this.cdRef.detectChanges(); }), 0);
    };
    /**
     * @return {?}
     */
    DatePickerComponent.prototype.show = /**
     * @return {?}
     */
    function () {
        var _this = this;
        this.flip();
        this.datePicker.toggle();
        this.closable = false;
        this.subscribeToEvents();
        setTimeout((/**
         * @return {?}
         */
        function () {
            _this.closable = true;
        }), 500);
    };
    /**
     * @return {?}
     */
    DatePickerComponent.prototype.hide = /**
     * @return {?}
     */
    function () {
        this.datePicker.toggle();
        this.destroy$.next();
    };
    /**
     * @return {?}
     */
    DatePickerComponent.prototype.flip = /**
     * @return {?}
     */
    function () {
        var _a = ((/** @type {?} */ (this.group.nativeElement))).getBoundingClientRect(), bottom = _a.bottom, top = _a.top;
        var innerHeight = window.innerHeight;
        if (bottom + 330 > innerHeight && this.position.indexOf('bottom') > -1) {
            this.position = (/** @type {?} */ (this.position.replace('bottom', 'top')));
            this.cdRef.detectChanges();
        }
        else if (top - 330 < 0 && this.position.indexOf('top') > -1) {
            this.position = (/** @type {?} */ (this.position.replace('top', 'bottom')));
            this.cdRef.detectChanges();
        }
    };
    /**
     * @return {?}
     */
    DatePickerComponent.prototype.clear = /**
     * @return {?}
     */
    function () {
        this.value = null;
    };
    DatePickerComponent.decorators = [
        { type: Component, args: [{
                    selector: 'p-datepicker',
                    template: "<div class=\"datepicker-container\">\n  <label class=\"{{ labelClass }}\" [attr.for]=\"options.fieldId\">{{ label }}</label>\n  <div #group class=\"input-group\">\n    <input\n      type=\"text\"\n      class=\"form-control bg-white\"\n      [readonly]=\"true\"\n      [attr.placeholder]=\"placeholder\"\n      [value]=\"date | date: displayFormat\"\n      (click)=\"onClick()\"\n    />\n    <fa-icon *ngIf=\"value\" [icon]=\"['fas', 'times']\" class=\"text-secondary\" (click)=\"clear()\"></fa-icon>\n    <div class=\"input-group-prepend\">\n      <span class=\"input-group-text bg-white\" (click)=\"toggle()\">\n        <fa-icon *ngIf=\"value\" [icon]=\"['fas', 'calendar-day']\"></fa-icon>\n      </span>\n    </div>\n  </div>\n  <ng-datepicker\n    id=\"datepicker\"\n    #datePicker\n    [headless]=\"true\"\n    [position]=\"position\"\n    [options]=\"options\"\n    [(ngModel)]=\"value\"\n    (ngModelChange)=\"destroy$.next()\"\n  >\n  </ng-datepicker>\n</div>\n",
                    changeDetection: ChangeDetectionStrategy.OnPush,
                    encapsulation: ViewEncapsulation.None,
                    providers: [
                        {
                            provide: NG_VALUE_ACCESSOR,
                            useExisting: forwardRef((/**
                             * @return {?}
                             */
                            function () { return DatePickerComponent; })),
                            multi: true,
                        },
                    ]
                }] }
    ];
    /** @nocollapse */
    DatePickerComponent.ctorParameters = function () { return [
        { type: Injector }
    ]; };
    DatePickerComponent.propDecorators = {
        locale: [{ type: Input }],
        position: [{ type: Input }],
        barTitleIfEmpty: [{ type: Input }],
        placeholder: [{ type: Input }],
        addClass: [{ type: Input }],
        labelClass: [{ type: Input }],
        label: [{ type: Input }],
        datePicker: [{ type: ViewChild, args: ['datePicker',] }],
        group: [{ type: ViewChild, args: ['group', { read: ElementRef },] }]
    };
    __decorate([
        Select(EventListenerState.getOne('click')),
        __metadata("design:type", Observable)
    ], DatePickerComponent.prototype, "click$", void 0);
    return DatePickerComponent;
}(AbstractNgModelComponent));

/**
 * @fileoverview added by tsickle
 * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
 */
var CheckboxComponent = /** @class */ (function (_super) {
    __extends(CheckboxComponent, _super);
    function CheckboxComponent() {
        return _super !== null && _super.apply(this, arguments) || this;
    }
    /**
     * @return {?}
     */
    CheckboxComponent.prototype.onKeyup = /**
     * @return {?}
     */
    function () {
        this.value = !this.value;
    };
    /**
     * @param {?} event
     * @return {?}
     */
    CheckboxComponent.prototype.onChangeValue = /**
     * @param {?} event
     * @return {?}
     */
    function (event) {
        this.value = !this.value;
        this.click.emit(event);
    };
    CheckboxComponent.decorators = [
        { type: Component, args: [{
                    selector: 'p-checkbox',
                    template: "\n    <div class=\"form-group form-checkbox {{ classes }}\">\n      <input\n        type=\"checkbox\"\n        [(ngModel)]=\"value\"\n        [id]=\"id\"\n        [attr.name]=\"name\"\n        [hidden]=\"hidden\"\n        [disabled]=\"disabled\"\n        class=\"form-check-input {{ classes }}\"\n        [required]=\"required\"\n        (keyup)=\"keyup.emit($event)\"\n        (focus)=\"focus.emit($event)\"\n        (blur)=\"blur.emit($event)\"\n      />\n\n      <label\n        *ngIf=\"labelText\"\n        [htmlFor]=\"id\"\n        (keyup.space)=\"onKeyup()\"\n        (click)=\"onChangeValue($event)\"\n        tabindex=\"0\"\n        class=\"form-check-label {{ labelClasses }}\"\n      >\n        <p class=\"mb-0\">{{ labelText }}</p>\n      </label>\n    </div>\n  ",
                    providers: [
                        {
                            provide: NG_VALUE_ACCESSOR,
                            useExisting: forwardRef((/**
                             * @return {?}
                             */
                            function () { return CheckboxComponent; })),
                            multi: true,
                        },
                    ],
                    changeDetection: ChangeDetectionStrategy.OnPush,
                    encapsulation: ViewEncapsulation.None
                }] }
    ];
    return CheckboxComponent;
}(AbstractInputComponent));

/**
 * @fileoverview added by tsickle
 * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
 */
var InputComponent = /** @class */ (function (_super) {
    __extends(InputComponent, _super);
    function InputComponent() {
        var _this = _super !== null && _super.apply(this, arguments) || this;
        _this._textMask = {
            mask: false,
        };
        _this.autocomplete = 'on';
        _this.autocorrect = false;
        _this.spellcheck = false;
        _this.change = new EventEmitter();
        _this.blur = new EventEmitter();
        _this.focus = new EventEmitter();
        _this.keyup = new EventEmitter();
        _this.click = new EventEmitter();
        return _this;
    }
    Object.defineProperty(InputComponent.prototype, "textMask", {
        get: /**
         * @return {?}
         */
        function () {
            return this._textMask;
        },
        set: /**
         * @param {?} value
         * @return {?}
         */
        function (value) {
            this._textMask = __assign({}, value, { mask: value.mask || false, guide: value.guide || false, keepCharPositionsMask: value.keepCharPositionsMask || false });
        },
        enumerable: true,
        configurable: true
    });
    InputComponent.decorators = [
        { type: Component, args: [{
                    selector: 'p-input',
                    template: "\n    <label *ngIf=\"labelText\" class=\"{{ labelClasses }}\" [attr.for]=\"id\" [innerHTML]=\"labelText\"></label>\n    <input\n      #input\n      class=\"form-control {{ classes }}\"\n      [(ngModel)]=\"value\"\n      [id]=\"id\"\n      [attr.type]=\"type\"\n      [attr.placeholder]=\"placeholder\"\n      [textMask]=\"textMask\"\n      [hidden]=\"hidden\"\n      [name]=\"name\"\n      [disabled]=\"disabled\"\n      [min]=\"'' + min\"\n      [max]=\"'' + max\"\n      [minlength]=\"minlength\"\n      [maxlength]=\"maxlength\"\n      [attr.tabindex]=\"tabindex\"\n      [attr.autocomplete]=\"autocomplete\"\n      [attr.autocorrect]=\"autocorrect\"\n      [attr.spellcheck]=\"spellcheck\"\n      [required]=\"required\"\n      [autofocus]=\"autofocus\"\n      [autofocusDelay]=\"autofocusDelay\"\n      (keyup)=\"keyup.emit($event)\"\n      (focus)=\"focus.emit($event)\"\n      (blur)=\"blur.emit($event)\"\n      (click)=\"click.emit($event)\"\n    />\n    <small *ngIf=\"helpText\" class=\"form-text text-muted {{ helpTextClasses }}\" [innerHTML]=\"helpText\"></small>\n  ",
                    changeDetection: ChangeDetectionStrategy.OnPush,
                    encapsulation: ViewEncapsulation.None,
                    providers: [
                        {
                            provide: NG_VALUE_ACCESSOR,
                            useExisting: forwardRef((/**
                             * @return {?}
                             */
                            function () { return InputComponent; })),
                            multi: true,
                        },
                    ]
                }] }
    ];
    InputComponent.propDecorators = {
        textMask: [{ type: Input }],
        helpText: [{ type: Input }],
        helpTextClasses: [{ type: Input }],
        min: [{ type: Input }],
        max: [{ type: Input }],
        minlength: [{ type: Input }],
        maxlength: [{ type: Input }],
        autocomplete: [{ type: Input }],
        autocorrect: [{ type: Input }],
        spellcheck: [{ type: Input }],
        change: [{ type: Output }],
        blur: [{ type: Output }],
        focus: [{ type: Output }],
        keyup: [{ type: Output }],
        click: [{ type: Output }]
    };
    return InputComponent;
}(AbstractInputComponent));

/**
 * @fileoverview added by tsickle
 * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
 */
var RadioComponent = /** @class */ (function (_super) {
    __extends(RadioComponent, _super);
    function RadioComponent() {
        var _this = _super !== null && _super.apply(this, arguments) || this;
        _this.id = uuid();
        _this.name = 'radio';
        return _this;
    }
    RadioComponent.decorators = [
        { type: Component, args: [{
                    selector: 'p-radio',
                    template: "\n    <div class=\"custom-control custom-radio custom-control-inline {{ classes }}\">\n      <input\n        [attr.id]=\"id\"\n        [attr.name]=\"name\"\n        [value]=\"radioValue\"\n        [disabled]=\"disabled\"\n        [(ngModel)]=\"value\"\n        type=\"radio\"\n        class=\"custom-control-input\"\n      />\n      <label class=\"custom-control-label\" [attr.for]=\"id\"><ng-content></ng-content></label>\n    </div>\n  ",
                    providers: [
                        {
                            provide: NG_VALUE_ACCESSOR,
                            useExisting: forwardRef((/**
                             * @return {?}
                             */
                            function () { return RadioComponent; })),
                            multi: true,
                        },
                    ],
                    changeDetection: ChangeDetectionStrategy.Default,
                    encapsulation: ViewEncapsulation.None
                }] }
    ];
    RadioComponent.propDecorators = {
        classes: [{ type: Input }],
        id: [{ type: Input }],
        name: [{ type: Input }],
        radioValue: [{ type: Input }]
    };
    return RadioComponent;
}(AbstractNgModelComponent));

/**
 * @fileoverview added by tsickle
 * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
 */
var SpinnerComponent = /** @class */ (function (_super) {
    __extends(SpinnerComponent, _super);
    function SpinnerComponent() {
        var _this = _super !== null && _super.apply(this, arguments) || this;
        _this.min = 1;
        _this.max = 100;
        _this.buttonClass = 'btn btn-secondary';
        _this.increaseLabel = '+';
        _this.decreaseLabel = '-';
        _this.step = 1;
        _this.valueLimitFn = (/**
         * @param {?} value
         * @return {?}
         */
        function (value) {
            if (value > _this.max)
                return _this.max;
            if (value < _this.min)
                return _this.min;
            return false;
        });
        return _this;
    }
    Object.defineProperty(SpinnerComponent.prototype, "defaultValue", {
        get: /**
         * @return {?}
         */
        function () {
            return this.min;
        },
        enumerable: true,
        configurable: true
    });
    /**
     * @param {?} value
     * @return {?}
     */
    SpinnerComponent.prototype.onClick = /**
     * @param {?} value
     * @return {?}
     */
    function (value) {
        this.value = value;
    };
    SpinnerComponent.decorators = [
        { type: Component, args: [{
                    selector: 'p-spinner',
                    template: "\n    <div class=\"input-group mb-3\">\n      <div class=\"input-group-prepend\">\n        <button type=\"button\" class=\"{{ buttonClass }}\" (click)=\"onClick(value - step)\" [disabled]=\"disabled\">\n          {{ decreaseLabel }}\n        </button>\n      </div>\n      <input\n        type=\"number\"\n        class=\"form-control text-center {{ classes }}\"\n        [(ngModel)]=\"value\"\n        [id]=\"id\"\n        [hidden]=\"hidden\"\n        [name]=\"name\"\n        [disabled]=\"disabled\"\n        [min]=\"min\"\n        [max]=\"max\"\n        [attr.tabindex]=\"tabindex\"\n        [required]=\"required\"\n        [autofocus]=\"autofocus\"\n        [autofocusDelay]=\"autofocusDelay\"\n        (keyup)=\"keyup.emit($event)\"\n        (focus)=\"focus.emit($event)\"\n        (blur)=\"blur.emit($event)\"\n      />\n      <div class=\"input-group-append\">\n        <button type=\"button\" class=\"{{ buttonClass }}\" (click)=\"onClick(value + step)\" [disabled]=\"disabled\">\n          {{ increaseLabel }}\n        </button>\n      </div>\n    </div>\n  ",
                    providers: [
                        {
                            provide: NG_VALUE_ACCESSOR,
                            useExisting: forwardRef((/**
                             * @return {?}
                             */
                            function () { return SpinnerComponent; })),
                            multi: true,
                        },
                    ],
                    changeDetection: ChangeDetectionStrategy.OnPush,
                    encapsulation: ViewEncapsulation.None
                }] }
    ];
    SpinnerComponent.propDecorators = {
        min: [{ type: Input }],
        max: [{ type: Input }],
        buttonClass: [{ type: Input }],
        increaseLabel: [{ type: Input }],
        decreaseLabel: [{ type: Input }],
        step: [{ type: Input }]
    };
    return SpinnerComponent;
}(AbstractInputComponent));

/**
 * @fileoverview added by tsickle
 * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
 */
var TextAreaComponent = /** @class */ (function (_super) {
    __extends(TextAreaComponent, _super);
    function TextAreaComponent() {
        var _this = _super !== null && _super.apply(this, arguments) || this;
        _this.autosize = true;
        _this.rows = 1;
        _this.cols = 20;
        _this.change = new EventEmitter();
        _this.blur = new EventEmitter();
        _this.focus = new EventEmitter();
        _this.keyup = new EventEmitter();
        _this.click = new EventEmitter();
        return _this;
    }
    TextAreaComponent.decorators = [
        { type: Component, args: [{
                    selector: 'p-textarea',
                    template: "\n    <label *ngIf=\"labelText\" class=\"{{ labelClasses }}\" [attr.for]=\"id\" [innerHTML]=\"labelText\"></label>\n    <textarea\n      class=\"form-control {{ classes }}\"\n      [(ngModel)]=\"value\"\n      [autosize]=\"autosize\"\n      [rows]=\"rows\"\n      [cols]=\"cols\"\n      [id]=\"id\"\n      [attr.placeholder]=\"placeholder\"\n      [hidden]=\"hidden\"\n      [name]=\"name\"\n      [disabled]=\"disabled\"\n      [minlength]=\"minlength\"\n      [maxlength]=\"maxlength\"\n      [attr.tabindex]=\"tabindex\"\n      [required]=\"required\"\n      [autofocus]=\"autofocus\"\n      [autofocusDelay]=\"autofocusDelay\"\n      (keyup)=\"keyup.emit($event)\"\n      (focus)=\"focus.emit($event)\"\n      (blur)=\"blur.emit($event)\"\n      (click)=\"click.emit($event)\"\n    ></textarea>\n    <small *ngIf=\"helpText\" class=\"form-text text-muted {{ helpTextClasses }}\" [innerHTML]=\"helpText\"></small>\n  ",
                    changeDetection: ChangeDetectionStrategy.OnPush,
                    encapsulation: ViewEncapsulation.None,
                    providers: [
                        {
                            provide: NG_VALUE_ACCESSOR,
                            useExisting: forwardRef((/**
                             * @return {?}
                             */
                            function () { return TextAreaComponent; })),
                            multi: true,
                        },
                    ]
                }] }
    ];
    TextAreaComponent.propDecorators = {
        autosize: [{ type: Input }],
        rows: [{ type: Input }],
        cols: [{ type: Input }],
        helpText: [{ type: Input }],
        helpTextClasses: [{ type: Input }],
        minlength: [{ type: Input }],
        maxlength: [{ type: Input }],
        change: [{ type: Output }],
        blur: [{ type: Output }],
        focus: [{ type: Output }],
        keyup: [{ type: Output }],
        click: [{ type: Output }]
    };
    return TextAreaComponent;
}(AbstractInputComponent));

/**
 * @fileoverview added by tsickle
 * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
 */
var ListboxComponent = /** @class */ (function (_super) {
    __extends(ListboxComponent, _super);
    function ListboxComponent(injector) {
        var _this = _super.call(this, injector) || this;
        _this.injector = injector;
        _this.items = [];
        _this.classes = '';
        _this.activeClass = 'active';
        _this.title = '';
        _this.isFilterShow = true;
        _this.filterPlaceholder = '';
        _this.multiple = false;
        _this.filterValue = '';
        _this.trackByFn = (/**
         * @param {?} index
         * @param {?} item
         * @return {?}
         */
        function (index, item) { return item.text || index; });
        return _this;
    }
    /**
     * @param {?} item
     * @return {?}
     */
    ListboxComponent.prototype.onClick = /**
     * @param {?} item
     * @return {?}
     */
    function (item) {
        if (!this.multiple) {
            compare(this.value, item) ? (this.value = (/** @type {?} */ ({}))) : (this.value = item);
            return;
        }
        if (!this.value || !Array.isArray(this.value) || !this.value.length)
            this.value = [];
        /** @type {?} */
        var index = this.value.findIndex((/**
         * @param {?} val
         * @return {?}
         */
        function (val) { return compare(val, item); }));
        if (index > -1) {
            this.value = __spread(this.value.slice(0, index), this.value.slice(index + 1));
        }
        else {
            /** @type {?} */
            var cloneItem = __assign({}, item);
            delete cloneItem.classes;
            this.value = __spread(this.value, [cloneItem]);
        }
        this.cdRef.detectChanges();
    };
    /**
     * @param {?} item
     * @return {?}
     */
    ListboxComponent.prototype.isActive = /**
     * @param {?} item
     * @return {?}
     */
    function (item) {
        if (!this.multiple) {
            return compare(this.value, item);
        }
        if (!this.value || !((/** @type {?} */ (this.value))).length)
            return;
        /** @type {?} */
        var cloneItem = __assign({}, item);
        delete cloneItem.classes;
        return ((/** @type {?} */ (this.value))).findIndex((/**
         * @param {?} val
         * @return {?}
         */
        function (val) { return compare(val, cloneItem); })) > -1;
    };
    ListboxComponent.decorators = [
        { type: Component, args: [{
                    selector: 'p-listbox',
                    template: "\n    <div class=\"card\">\n      <div class=\"card-header\">\n        <div class=\"col-12 px-0\">\n          <h5>{{ title }}</h5>\n        </div>\n        <div *ngIf=\"isFilterShow\" class=\"col-12 px-0 mt-2\">\n          <div class=\"input-group mb-3\">\n            <div class=\"input-group-prepend\">\n              <span class=\"input-group-text\"><fa-icon [icon]=\"['fas', 'search']\"></fa-icon></span>\n            </div>\n            <p-input\n              [(ngModel)]=\"filterValue\"\n              [attr.placeholder]=\"filterPlaceholder\"\n              classes=\"bg-transparent\"\n              class=\"w-75\"\n            ></p-input>\n          </div>\n        </div>\n      </div>\n      <ul class=\"list-group  list-group-flush {{ classes }}\">\n        <li\n          *pFor=\"\n            let item of items;\n            filterValue: filterValue;\n            filterContain: true;\n            filterKey: 'text';\n            trackBy: trackByFn\n          \"\n          [ngClass]=\"[isActive(item) ? activeClass : '']\"\n          (click)=\"onClick(item)\"\n          style=\"cursor: pointer\"\n          class=\"list-group-item {{ item.classes }}\"\n        >\n          {{ item.text }}\n        </li>\n      </ul>\n    </div>\n  ",
                    encapsulation: ViewEncapsulation.None,
                    changeDetection: ChangeDetectionStrategy.OnPush,
                    providers: [
                        {
                            provide: NG_VALUE_ACCESSOR,
                            useExisting: forwardRef((/**
                             * @return {?}
                             */
                            function () { return ListboxComponent; })),
                            multi: true,
                        },
                    ]
                }] }
    ];
    /** @nocollapse */
    ListboxComponent.ctorParameters = function () { return [
        { type: Injector }
    ]; };
    ListboxComponent.propDecorators = {
        items: [{ type: Input }],
        classes: [{ type: Input }],
        activeClass: [{ type: Input }],
        title: [{ type: Input }],
        isFilterShow: [{ type: Input }],
        filterPlaceholder: [{ type: Input }],
        multiple: [{ type: Input }]
    };
    return ListboxComponent;
}(AbstractNgModelComponent));

/**
 * @fileoverview added by tsickle
 * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
 */
var ModalComponent = /** @class */ (function () {
    function ModalComponent(injector, renderer) {
        this.injector = injector;
        this.renderer = renderer;
        this.centered = true;
        this.modalClass = '';
        this.size = 'md';
        this.visibleChange = new EventEmitter();
        this._visible = false;
        this.closable = false;
        this.destroy$ = new Subject();
        this.cdRef = injector.get(ChangeDetectorRef);
    }
    Object.defineProperty(ModalComponent.prototype, "visible", {
        get: /**
         * @return {?}
         */
        function () {
            return this._visible;
        },
        set: /**
         * @param {?} value
         * @return {?}
         */
        function (value) {
            var _this = this;
            if (value) {
                this.setVisible(value);
                this.listen();
            }
            else {
                this.closable = false;
                this.renderer.addClass(this.modalContent.nativeElement, 'fade-out-top');
                setTimeout((/**
                 * @return {?}
                 */
                function () {
                    _this.setVisible(value);
                    _this.renderer.removeClass(_this.modalContent.nativeElement, 'fade-out-top');
                    _this.ngOnDestroy();
                }), 400);
            }
        },
        enumerable: true,
        configurable: true
    });
    /**
     * @return {?}
     */
    ModalComponent.prototype.ngOnDestroy = /**
     * @return {?}
     */
    function () {
        this.destroy$.next();
    };
    /**
     * @param {?} value
     * @return {?}
     */
    ModalComponent.prototype.setVisible = /**
     * @param {?} value
     * @return {?}
     */
    function (value) {
        var _this = this;
        this._visible = value;
        this.visibleChange.emit(value);
        value
            ? timer(500)
                .pipe(take(1))
                .subscribe((/**
             * @param {?} _
             * @return {?}
             */
            function (_) { return (_this.closable = true); }))
            : (this.closable = false);
    };
    /**
     * @return {?}
     */
    ModalComponent.prototype.listen = /**
     * @return {?}
     */
    function () {
        var _this = this;
        this.click$
            .pipe(takeUntil(this.destroy$), filter((/**
         * @param {?} event
         * @return {?}
         */
        function (event) {
            return event && _this.closable && _this.modalContent && !_this.modalContent.nativeElement.contains(event.target);
        })))
            .subscribe((/**
         * @param {?} _
         * @return {?}
         */
        function (_) {
            _this.visible = false;
        }));
        this.keyup$
            .pipe(takeUntil(this.destroy$), filter((/**
         * @param {?} key
         * @return {?}
         */
        function (key) { return key && key.code === 'Escape' && _this.closable; })))
            .subscribe((/**
         * @param {?} _
         * @return {?}
         */
        function (_) {
            _this.visible = false;
        }));
    };
    ModalComponent.decorators = [
        { type: Component, args: [{
                    selector: 'p-modal',
                    template: "<!-- Modal -->\n<div\n  id=\"p-modal\"\n  tabindex=\"-1\"\n  class=\"modal fade {{ modalClass }}\"\n  [class.show]=\"visible\"\n  [style.display]=\"visible ? 'block' : 'none'\"\n  [style.padding-right.px]=\"'15'\"\n>\n  <perfect-scrollbar style=\"max-height: auto;\" [config]=\"{ suppressScrollX: true }\">\n    <div\n      style=\"position: relative; max-width: 600px;\"\n      id=\"p-modal-container\"\n      class=\"modal-dialog modal-{{ size }} fade-in-top\"\n      [class.modal-dialog-centered]=\"centered\"\n      #pModalContent\n    >\n      <div #content id=\"p-modal-content\" class=\"modal-content\">\n        <div id=\"p-modal-header\" class=\"modal-header\">\n          <ng-container *ngTemplateOutlet=\"pHeader\"></ng-container>\n\n          <button id=\"p-modal-close-button\" type=\"button\" class=\"close\" (click)=\"visible = false\">\n            <span aria-hidden=\"true\">&times;</span>\n          </button>\n        </div>\n        <div id=\"p-modal-body\" class=\"modal-body\">\n          <ng-container *ngTemplateOutlet=\"pBody\"></ng-container>\n\n          <div id=\"p-modal-footer\" class=\"modal-footer\">\n            <ng-container *ngTemplateOutlet=\"pFooter\"></ng-container>\n          </div>\n        </div>\n      </div>\n    </div>\n  </perfect-scrollbar>\n\n  <ng-content></ng-content>\n</div>\n",
                    changeDetection: ChangeDetectionStrategy.OnPush,
                    encapsulation: ViewEncapsulation.None
                }] }
    ];
    /** @nocollapse */
    ModalComponent.ctorParameters = function () { return [
        { type: Injector },
        { type: Renderer2 }
    ]; };
    ModalComponent.propDecorators = {
        visible: [{ type: Input }],
        centered: [{ type: Input }],
        modalClass: [{ type: Input }],
        size: [{ type: Input }],
        visibleChange: [{ type: Output }],
        pHeader: [{ type: ContentChild, args: ['pHeader',] }],
        pBody: [{ type: ContentChild, args: ['pBody',] }],
        pFooter: [{ type: ContentChild, args: ['pFooter',] }],
        modalContent: [{ type: ViewChild, args: ['pModalContent',] }]
    };
    __decorate([
        Select(EventListenerState.getOne('click')),
        __metadata("design:type", Observable)
    ], ModalComponent.prototype, "click$", void 0);
    __decorate([
        Select(EventListenerState.getOne('keyup')),
        __metadata("design:type", Observable)
    ], ModalComponent.prototype, "keyup$", void 0);
    return ModalComponent;
}());

/**
 * @fileoverview added by tsickle
 * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
 */
var PaginationComponent = /** @class */ (function (_super) {
    __extends(PaginationComponent, _super);
    function PaginationComponent() {
        var _this = _super !== null && _super.apply(this, arguments) || this;
        _this.alignment = 'start';
        _this.classes = '';
        _this.paginationRange = 7;
        _this.totalPages = 15;
        _this.previousLabel = 'Previous';
        _this.nextLabel = 'Next';
        _this.size = 'sm';
        return _this;
    }
    Object.defineProperty(PaginationComponent.prototype, "pages", {
        get: /**
         * @return {?}
         */
        function () {
            var _this = this;
            if (this.paginationRange >= this.totalPages) {
                return Array.apply(null, { length: this.totalPages }).map((/**
                 * @param {?} _
                 * @param {?} index
                 * @return {?}
                 */
                function (_, index) { return ({ value: index + 1 }); }));
            }
            /** @type {?} */
            var halfWay = Math.floor(this.paginationRange / 2);
            /** @type {?} */
            var isStart = this.value <= halfWay;
            /** @type {?} */
            var isEnd = this.totalPages - this.value < halfWay;
            return Array.apply(null, { length: this.paginationRange }).map((/**
             * @param {?} _
             * @param {?} index
             * @return {?}
             */
            function (_, index) {
                /** @type {?} */
                var i = index + 1;
                if (isStart) {
                    return {
                        value: halfWay + 2 >= i ? i : _this.totalPages - (_this.paginationRange - i),
                        label: halfWay + 2 === i ? '...' : null,
                    };
                }
                if (isEnd) {
                    return {
                        value: _this.paginationRange - halfWay - 2 < i ? _this.totalPages - (_this.paginationRange - i) : i,
                        label: halfWay === i ? '...' : null,
                    };
                }
                return {
                    value: i === 1
                        ? 1
                        : i === _this.paginationRange
                            ? _this.totalPages
                            : _this.value + (halfWay - _this.paginationRange + i),
                    label: 2 === i || _this.paginationRange - 1 === i ? '...' : null,
                };
            }));
        },
        enumerable: true,
        configurable: true
    });
    /**
     * @param {?} __0
     * @return {?}
     */
    PaginationComponent.prototype.ngOnChanges = /**
     * @param {?} __0
     * @return {?}
     */
    function (_a) {
        var _this = this;
        var ngModel = _a.ngModel;
        if (!ngModel)
            return;
        if (!ngModel.currentValue)
            setTimeout((/**
             * @param {?} _
             * @return {?}
             */
            function (_) { return (_this.value = 1); }), 0);
        if (ngModel.currentValue > this.totalPages || ngModel.currentValue < 1)
            setTimeout((/**
             * @param {?} _
             * @return {?}
             */
            function (_) { return (_this.value = ngModel.previousValue); }), 0);
    };
    /**
     * @param {?} value
     * @return {?}
     */
    PaginationComponent.prototype.change = /**
     * @param {?} value
     * @return {?}
     */
    function (value) {
        if (value < 1 || value > this.totalPages)
            return;
        this.value = value;
    };
    PaginationComponent.decorators = [
        { type: Component, args: [{
                    selector: 'p-pagination',
                    template: "\n    <ul class=\"pagination pagination-{{ size }} justify-content-{{ alignment }}\">\n      <li [class.disabled]=\"value === 1\" (click)=\"change(value - 1)\" class=\"page-item\">\n        <span class=\"page-link\">{{ previousLabel }}</span>\n      </li>\n      <li\n        *ngFor=\"let page of pages\"\n        [class.active]=\"page.value === value\"\n        (click)=\"change(page.value)\"\n        class=\"page-item\"\n      >\n        <span class=\"page-link\">{{ page.label || page.value }}</span>\n      </li>\n      <li [class.disabled]=\"value === totalPages\" (click)=\"change(value + 1)\" class=\"page-item\">\n        <span class=\"page-link\">{{ nextLabel }}</span>\n      </li>\n    </ul>\n  ",
                    changeDetection: ChangeDetectionStrategy.OnPush,
                    encapsulation: ViewEncapsulation.None,
                    providers: [
                        {
                            provide: NG_VALUE_ACCESSOR,
                            useExisting: forwardRef((/**
                             * @return {?}
                             */
                            function () { return PaginationComponent; })),
                            multi: true,
                        },
                    ]
                }] }
    ];
    PaginationComponent.propDecorators = {
        alignment: [{ type: Input }],
        classes: [{ type: Input }],
        paginationRange: [{ type: Input }],
        totalPages: [{ type: Input }],
        previousLabel: [{ type: Input }],
        nextLabel: [{ type: Input }],
        size: [{ type: Input }]
    };
    return PaginationComponent;
}(AbstractNgModelComponent));

/**
 * @fileoverview added by tsickle
 * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
 */
var TooltipComponent = /** @class */ (function () {
    function TooltipComponent(tooltip, cdRef) {
        this.tooltip = tooltip;
        this.cdRef = cdRef;
        this.style = { position: 'fixed', visibility: 'hidden' };
        this.arrowPart = 5;
    }
    Object.defineProperty(TooltipComponent.prototype, "classes", {
        get: /**
         * @return {?}
         */
        function () {
            return "tooltip bs-tooltip-" + this.tooltip.placement + " show";
        },
        enumerable: true,
        configurable: true
    });
    /**
     * @return {?}
     */
    TooltipComponent.prototype.ngAfterViewInit = /**
     * @return {?}
     */
    function () {
        var _this = this;
        setTimeout((/**
         * @return {?}
         */
        function () {
            _this.setPosition();
            _this.style = __assign({}, _this.style, { visibility: 'visible' });
            _this.cdRef.detectChanges();
        }), 0);
    };
    /**
     * @return {?}
     */
    TooltipComponent.prototype.setPosition = /**
     * @return {?}
     */
    function () {
        var _a = this.tooltip.element.getBoundingClientRect(), left = _a.left, right = _a.right, top = _a.top, bottom = _a.bottom, width = _a.width, height = _a.height;
        var _b = this.container.nativeElement.getBoundingClientRect(), hostWidth = _b.width, hostHeight = _b.height;
        var innerHeight = window.innerHeight, innerWidth = window.innerWidth;
        switch (this.tooltip.placement) {
            case 'top':
                if (top - hostHeight - this.arrowPart < 0)
                    this.tooltip.placement = 'bottom';
                this.setY(left, top, bottom, width, hostHeight, hostWidth);
                break;
            case 'bottom':
                if (bottom + hostHeight + this.arrowPart > innerHeight)
                    this.tooltip.placement = 'top';
                this.setY(left, top, bottom, width, hostHeight, hostWidth);
                break;
            case 'left':
                if (left - hostWidth - this.arrowPart < 0)
                    this.tooltip.placement = 'right';
                this.setX(left, top, right, height, hostHeight, hostWidth);
                break;
            case 'right':
                if (right + hostWidth + this.arrowPart > innerWidth)
                    this.tooltip.placement = 'left';
                this.setX(left, top, right, height, hostHeight, hostWidth);
                break;
        }
    };
    /**
     * @param {?} left
     * @param {?} top
     * @param {?} bottom
     * @param {?} width
     * @param {?} hostHeight
     * @param {?} hostWidth
     * @return {?}
     */
    TooltipComponent.prototype.setY = /**
     * @param {?} left
     * @param {?} top
     * @param {?} bottom
     * @param {?} width
     * @param {?} hostHeight
     * @param {?} hostWidth
     * @return {?}
     */
    function (left, top, bottom, width, hostHeight, hostWidth) {
        this.style.left = left + (width - hostWidth) / 2 + 'px';
        this.tooltip.placement === 'top'
            ? (this.style.top = top - hostHeight - this.arrowPart + 'px')
            : (this.style.top = bottom + this.arrowPart + 'px');
    };
    /**
     * @param {?} left
     * @param {?} top
     * @param {?} right
     * @param {?} height
     * @param {?} hostHeight
     * @param {?} hostWidth
     * @return {?}
     */
    TooltipComponent.prototype.setX = /**
     * @param {?} left
     * @param {?} top
     * @param {?} right
     * @param {?} height
     * @param {?} hostHeight
     * @param {?} hostWidth
     * @return {?}
     */
    function (left, top, right, height, hostHeight, hostWidth) {
        this.style.top = top + (height - hostHeight) / 2 + 'px';
        this.tooltip.placement === 'left'
            ? (this.style.left = left - hostWidth - this.arrowPart + 'px')
            : (this.style.left = right + this.arrowPart + 'px');
    };
    TooltipComponent.decorators = [
        { type: Component, args: [{
                    selector: 'p-tooltip',
                    host: {
                        role: 'tooltip',
                    },
                    template: "\n    <div #container class=\"{{ classes }}\" [ngStyle]=\"style\">\n      <div class=\"tooltip-arrow arrow\"></div>\n      <div class=\"tooltip-inner\"><ng-content></ng-content></div>\n    </div>\n  ",
                    changeDetection: ChangeDetectionStrategy.OnPush,
                    encapsulation: ViewEncapsulation.None
                }] }
    ];
    /** @nocollapse */
    TooltipComponent.ctorParameters = function () { return [
        { type: undefined, decorators: [{ type: Inject, args: ['TOOLTIP_PROVIDER',] }] },
        { type: ChangeDetectorRef }
    ]; };
    TooltipComponent.propDecorators = {
        container: [{ type: ViewChild, args: ['container',] }]
    };
    return TooltipComponent;
}());

/**
 * @fileoverview added by tsickle
 * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
 */
var PopoverComponent = /** @class */ (function (_super) {
    __extends(PopoverComponent, _super);
    function PopoverComponent(popover, cdRef) {
        var _this = _super.call(this, popover, cdRef) || this;
        _this.popover = popover;
        _this.cdRef = cdRef;
        _this.arrowStyle = {};
        _this.arrowPart = 10;
        return _this;
    }
    Object.defineProperty(PopoverComponent.prototype, "classes", {
        get: /**
         * @return {?}
         */
        function () {
            return "popover fade bs-popover-" + this.popover.placement + " show";
        },
        enumerable: true,
        configurable: true
    });
    /**
     * @return {?}
     */
    PopoverComponent.prototype.ngAfterViewInit = /**
     * @return {?}
     */
    function () {
        var _this = this;
        setTimeout((/**
         * @return {?}
         */
        function () {
            _this.setPosition();
            _this.style = __assign({}, _this.style, { visibility: 'visible' });
            _this.cdRef.detectChanges();
        }), 0);
    };
    /**
     * @return {?}
     */
    PopoverComponent.prototype.setPosition = /**
     * @return {?}
     */
    function () {
        var _a = this.popover.element.getBoundingClientRect(), left = _a.left, right = _a.right, top = _a.top, bottom = _a.bottom, width = _a.width, height = _a.height;
        var _b = this.container.nativeElement.getBoundingClientRect(), hostWidth = _b.width, hostHeight = _b.height;
        var innerHeight = window.innerHeight, innerWidth = window.innerWidth;
        switch (this.popover.placement) {
            case 'top':
                if (top - hostHeight - this.arrowPart < 0)
                    this.popover.placement = 'bottom';
                this.setY(left, top, bottom, width, hostHeight, hostWidth);
                this.arrowStyle.left = hostWidth / 2 - 12 + 'px';
                break;
            case 'bottom':
                if (bottom + hostHeight + this.arrowPart > innerHeight)
                    this.popover.placement = 'top';
                this.setY(left, top, bottom, width, hostHeight, hostWidth);
                this.arrowStyle.left = hostWidth / 2 - 12 + 'px';
                break;
            case 'left':
                if (left - hostWidth - this.arrowPart < 0)
                    this.popover.placement = 'right';
                this.setX(left, top, right, height, hostHeight, hostWidth);
                this.arrowStyle.top = hostHeight / 2 - 12 + 'px';
                break;
            case 'right':
                if (right + hostWidth + this.arrowPart > innerWidth)
                    this.popover.placement = 'left';
                this.setX(left, top, right, height, hostHeight, hostWidth);
                this.arrowStyle.top = hostHeight / 2 - 12 + 'px';
                break;
        }
    };
    PopoverComponent.decorators = [
        { type: Component, args: [{
                    selector: 'p-popover',
                    template: "\n    <div #container [ngStyle]=\"style\" class=\"{{ classes }}\">\n      <div [ngStyle]=\"arrowStyle\" class=\"arrow\"></div>\n      <h3 class=\"popover-header\"><ng-content></ng-content></h3>\n      <div class=\"popover-body\"><ng-content></ng-content></div>\n    </div>\n  "
                }] }
    ];
    /** @nocollapse */
    PopoverComponent.ctorParameters = function () { return [
        { type: undefined, decorators: [{ type: Inject, args: ['POPOVER_PROVIDER',] }] },
        { type: ChangeDetectorRef }
    ]; };
    return PopoverComponent;
}(TooltipComponent));

/**
 * @fileoverview added by tsickle
 * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
 */
var ProgressBarComponent = /** @class */ (function () {
    function ProgressBarComponent(cdRef) {
        this.cdRef = cdRef;
        this.classes = 'progress-bar bg-danger';
        this.speed = 30;
        this.height = '10px';
    }
    /**
     * @return {?}
     */
    ProgressBarComponent.prototype.ngOnInit = /**
     * @return {?}
     */
    function () {
        var _this = this;
        this.show$.pipe(takeUntilDestroy(this)).subscribe((/**
         * @param {?} status
         * @return {?}
         */
        function (status) {
            if (status === true) {
                if (_this.show) {
                    setTimeout((/**
                     * @return {?}
                     */
                    function () {
                        _this.showFn();
                    }), 900);
                    return;
                }
                _this.showFn();
                return;
            }
            _this.value = 100;
            _this.cdRef.detectChanges();
            setTimeout((/**
             * @return {?}
             */
            function () {
                clearInterval(_this.interval);
                _this.show = false;
                _this.cdRef.detectChanges();
            }), 800);
        }));
    };
    /**
     * @return {?}
     */
    ProgressBarComponent.prototype.showFn = /**
     * @return {?}
     */
    function () {
        this.value = 0;
        this.show = true;
        this.cdRef.detectChanges();
        this.setValue();
    };
    /**
     * @return {?}
     */
    ProgressBarComponent.prototype.setValue = /**
     * @return {?}
     */
    function () {
        var _this = this;
        this.interval = setInterval((/**
         * @return {?}
         */
        function () {
            /** @type {?} */
            var plus = Math.random() * _this.speed;
            if (_this.value < 100 - plus) {
                _this.value += plus;
            }
            else {
                _this.value += 0.1;
            }
            _this.cdRef.detectChanges();
        }), 500);
    };
    /**
     * @return {?}
     */
    ProgressBarComponent.prototype.ngOnDestroy = /**
     * @return {?}
     */
    function () { };
    ProgressBarComponent.decorators = [
        { type: Component, args: [{
                    selector: 'p-progress-bar',
                    template: "\n    <div *ngIf=\"show\" class=\"progress\" [style.height]=\"height\">\n      <div [ngStyle]=\"{ width: value + '%' }\" class=\"{{ classes }}\"></div>\n    </div>\n  ",
                    changeDetection: ChangeDetectionStrategy.OnPush,
                    encapsulation: ViewEncapsulation.None
                }] }
    ];
    /** @nocollapse */
    ProgressBarComponent.ctorParameters = function () { return [
        { type: ChangeDetectorRef }
    ]; };
    ProgressBarComponent.propDecorators = {
        classes: [{ type: Input }]
    };
    __decorate([
        Select(LoaderState.progress),
        __metadata("design:type", Observable)
    ], ProgressBarComponent.prototype, "show$", void 0);
    return ProgressBarComponent;
}());

/**
 * @fileoverview added by tsickle
 * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
 */
var SelectComponent = /** @class */ (function (_super) {
    __extends(SelectComponent, _super);
    function SelectComponent() {
        var _this = _super !== null && _super.apply(this, arguments) || this;
        _this.options = [];
        _this.selectClass = '';
        _this.compareFn = compare;
        _this.select = new EventEmitter();
        return _this;
    }
    /**
     * @param {?} value
     * @return {?}
     */
    SelectComponent.prototype.onSelect = /**
     * @param {?} value
     * @return {?}
     */
    function (value) {
        this.select.emit(value);
    };
    /**
     * @param {?} option
     * @return {?}
     */
    SelectComponent.prototype.getOptionLabel = /**
     * @param {?} option
     * @return {?}
     */
    function (option) {
        var _a = (/** @type {?} */ (option)), label = _a.label, value = _a.value;
        return label || (typeof value === 'string' || typeof value === 'number' ? String(value) : String(option));
    };
    /**
     * @param {?} _
     * @param {?} option
     * @return {?}
     */
    SelectComponent.prototype.trackByFn = /**
     * @param {?} _
     * @param {?} option
     * @return {?}
     */
    function (_, option) {
        var _a = (/** @type {?} */ (option)), label = _a.label, value = _a.value;
        if (value === undefined || value instanceof Object) {
            return label || option;
        }
        return value;
    };
    /**
     * @param {?} option
     * @return {?}
     */
    SelectComponent.prototype.getOptionValue = /**
     * @param {?} option
     * @return {?}
     */
    function (option) {
        var value = (/** @type {?} */ (option)).value;
        if (value === undefined)
            return option;
        return value;
    };
    SelectComponent.decorators = [
        { type: Component, args: [{
                    selector: 'p-select',
                    template: "\n    <label [attr.for]=\"selectId\">{{ label }}</label>\n    <select\n      class=\"custom-select {{ selectClass }}\"\n      [(ngModel)]=\"value\"\n      [attr.id]=\"selectId\"\n      [compareWith]=\"compareFn\"\n      (ngModelChange)=\"onSelect($event)\"\n    >\n      <option [ngValue]=\"undefined\" *ngIf=\"placeholder\">{{ placeholder }}</option>\n      <option *ngFor=\"let option of options; trackBy: trackByFn\" [ngValue]=\"getOptionValue(option)\"\n        >{{ getOptionLabel(option) }}\n      </option>\n    </select>\n  ",
                    providers: [
                        {
                            provide: NG_VALUE_ACCESSOR,
                            useExisting: forwardRef((/**
                             * @return {?}
                             */
                            function () { return SelectComponent; })),
                            multi: true,
                        },
                    ],
                    changeDetection: ChangeDetectionStrategy.OnPush,
                    encapsulation: ViewEncapsulation.None
                }] }
    ];
    SelectComponent.propDecorators = {
        options: [{ type: Input }],
        selectId: [{ type: Input }],
        selectClass: [{ type: Input }],
        compareFn: [{ type: Input }],
        label: [{ type: Input }],
        placeholder: [{ type: Input }],
        select: [{ type: Output }]
    };
    return SelectComponent;
}(AbstractNgModelComponent));

/**
 * @fileoverview added by tsickle
 * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
 */
var ToasterComponent = /** @class */ (function () {
    function ToasterComponent(renderer) {
        this.renderer = renderer;
        this.destroy = new EventEmitter();
    }
    /**
     * @return {?}
     */
    ToasterComponent.prototype.ngOnInit = /**
     * @return {?}
     */
    function () {
        var _this = this;
        setTimeout((/**
         * @return {?}
         */
        function () { return _this.close(); }), this.timeout);
    };
    /**
     * @return {?}
     */
    ToasterComponent.prototype.close = /**
     * @return {?}
     */
    function () {
        var _this = this;
        this.renderer.setStyle(this.toast.nativeElement, 'animation', 'moveOutTop .5s');
        setTimeout((/**
         * @return {?}
         */
        function () {
            _this.destroy.emit();
        }), 500);
    };
    ToasterComponent.decorators = [
        { type: Component, args: [{
                    selector: 'p-toaster',
                    template: "\n    <div #toast class=\"toaster alert alert-{{ type }} alert-dismissible show move-in-top\">\n      <div *ngIf=\"header\" class=\"header\">\n        <div class=\"icon\"><fa-icon [icon]=\"['fas', 'info-circle']\"></fa-icon></div>\n        <span class=\"alert-heading\">{{ header }}</span>\n      </div>\n      <div class=\"body\" [innerHtml]=\"body\"></div>\n      <button *ngIf=\"closeOnClick\" type=\"button\" class=\"close\" (click)=\"close()\"><span>&times;</span></button>\n    </div>\n  ",
                    changeDetection: ChangeDetectionStrategy.OnPush
                }] }
    ];
    /** @nocollapse */
    ToasterComponent.ctorParameters = function () { return [
        { type: Renderer2 }
    ]; };
    ToasterComponent.propDecorators = {
        destroy: [{ type: Output }],
        toast: [{ type: ViewChild, args: ['toast',] }]
    };
    return ToasterComponent;
}());

/**
 * @fileoverview added by tsickle
 * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
 */
var ToasterContainerComponent = /** @class */ (function () {
    function ToasterContainerComponent(actions, cdRef, sanitizer, resolver) {
        this.actions = actions;
        this.cdRef = cdRef;
        this.sanitizer = sanitizer;
        this.resolver = resolver;
    }
    /**
     * @return {?}
     */
    ToasterContainerComponent.prototype.ngOnInit = /**
     * @return {?}
     */
    function () {
        var _this = this;
        this.actions.pipe(ofActionDispatched(ToasterShow)).subscribe((/**
         * @param {?} action
         * @return {?}
         */
        function (action) {
            _this.create(action.payload);
        }));
    };
    /**
     * @param {?} payload
     * @return {?}
     */
    ToasterContainerComponent.prototype.create = /**
     * @param {?} payload
     * @return {?}
     */
    function (payload) {
        /** @type {?} */
        var factory = this.resolver.resolveComponentFactory(ToasterComponent);
        /** @type {?} */
        var component = this.container.createComponent(factory);
        component.instance.body = payload.body ? this.sanitizer.bypassSecurityTrustHtml(payload.body) : '';
        component.instance.header = payload.header;
        component.instance.closeOnClick = isNullOrUndefined(payload.closeOnClick) ? true : payload.closeOnClick;
        component.instance.type = payload.type || 'primary';
        component.instance.timeout = payload.timeout || 5000;
        this.cdRef.detectChanges();
        component.instance.destroy.pipe(take(1)).subscribe((/**
         * @param {?} _
         * @return {?}
         */
        function (_) {
            component.destroy();
        }));
    };
    ToasterContainerComponent.decorators = [
        { type: Component, args: [{
                    selector: 'p-toaster-container',
                    template: "\n    <div class=\"toast-container\"><ng-container #container></ng-container></div>\n  ",
                    changeDetection: ChangeDetectionStrategy.OnPush
                }] }
    ];
    /** @nocollapse */
    ToasterContainerComponent.ctorParameters = function () { return [
        { type: Actions },
        { type: ChangeDetectorRef },
        { type: DomSanitizer },
        { type: ComponentFactoryResolver }
    ]; };
    ToasterContainerComponent.propDecorators = {
        container: [{ type: ViewChild, args: ['container', { read: ViewContainerRef },] }]
    };
    return ToasterContainerComponent;
}());

/**
 * @fileoverview added by tsickle
 * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
 */

/**
 * @fileoverview added by tsickle
 * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
 */
/**
 * @param {?=} content
 * @return {?}
 */
function createProjectableNode(content) {
    if (content === void 0) { content = ''; }
    if (typeof content === 'string') {
        return [this.renderer.createText(content)];
    }
    if (content instanceof TemplateRef) {
        return this.vcRef.createEmbeddedView(content, this.context).rootNodes;
    }
    /** @type {?} */
    var factory = this.resolver.resolveComponentFactory(content);
    var nativeElement = factory.create(this.injector).location.nativeElement;
    return [nativeElement];
}

/**
 * @fileoverview added by tsickle
 * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
 */

/**
 * @fileoverview added by tsickle
 * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
 */
var DropdownDirective = /** @class */ (function () {
    function DropdownDirective(renderer, elRef, vcRef) {
        this.renderer = renderer;
        this.elRef = elRef;
        this.vcRef = vcRef;
        this.show = false;
        this.trigger = 'click';
    }
    Object.defineProperty(DropdownDirective.prototype, "pDropdown", {
        get: /**
         * @return {?}
         */
        function () {
            return this._pDropdown;
        },
        set: /**
         * @param {?} v
         * @return {?}
         */
        function (v) {
            this._pDropdown = v;
            if (this.dropdownContainer)
                this.remove();
            this.view();
        },
        enumerable: true,
        configurable: true
    });
    /**
     * @private
     * @return {?}
     */
    DropdownDirective.prototype.subscribeToMouse = /**
     * @private
     * @return {?}
     */
    function () {
        var _this = this;
        (this.trigger === 'mousemove' ? this.mousemove$ : this.click$)
            .pipe(takeUntilDestroy(this), filter((/**
         * @param {?} event
         * @return {?}
         */
        function (event) { return !!event; })))
            .subscribe((/**
         * @param {?} event
         * @return {?}
         */
        function (event) {
            if (_this.elRef.nativeElement.contains(event.target)) {
                if (_this.show) {
                    _this.hide();
                }
                else {
                    // this.renderer.removeClass(this.dropdownContainer, 'collapse-top');
                    _this.renderer.removeClass(_this.dropdownContainer, 'd-none');
                    _this.show = true;
                }
            }
            else if (!_this.elRef.nativeElement.contains(event.target) &&
                !_this.dropdownContainer.contains((/** @type {?} */ (event.target)))) {
                _this.hide();
            }
        }));
    };
    /**
     * @return {?}
     */
    DropdownDirective.prototype.ngOnInit = /**
     * @return {?}
     */
    function () {
        this.view();
        this.subscribeToMouse();
    };
    /**
     * @return {?}
     */
    DropdownDirective.prototype.ngOnDestroy = /**
     * @return {?}
     */
    function () { };
    /**
     * @return {?}
     */
    DropdownDirective.prototype.view = /**
     * @return {?}
     */
    function () {
        var _this = this;
        /** @type {?} */
        var element = this.elRef.nativeElement;
        /** @type {?} */
        var elWidth = element.offsetWidth;
        this.container = this.renderer.createElement('div');
        this.renderer.setStyle(this.container, 'position', 'relative');
        this.renderer.addClass(this.container, 'd-inline-block');
        /** @type {?} */
        var parent = this.renderer.parentNode(element);
        this.renderer.appendChild(this.container, element);
        this.dropdownContainer = this.renderer.createElement('div');
        if (!this.show)
            this.renderer.addClass(this.dropdownContainer, 'd-none');
        this.renderer.addClass(this.dropdownContainer, 'card');
        this.renderer.setStyle(this.dropdownContainer, 'position', 'absolute');
        this.renderer.setStyle(this.dropdownContainer, 'min-width', elWidth + "px");
        this.renderer.setStyle(this.dropdownContainer, 'padding', "1.25rem");
        this.renderer.setStyle(this.dropdownContainer, 'z-index', "1000");
        /** @type {?} */
        var dropdownContentNode = createProjectableNode.call(this, this.pDropdown);
        dropdownContentNode.forEach((/**
         * @param {?} node
         * @return {?}
         */
        function (node) {
            _this.renderer.appendChild(_this.dropdownContainer, node);
        }));
        this.renderer.appendChild(this.container, this.dropdownContainer);
        this.renderer.appendChild(parent, this.container);
        // this.renderer.addClass(this.dropdownContainer, 'expand-top');
    };
    /**
     * @return {?}
     */
    DropdownDirective.prototype.hide = /**
     * @return {?}
     */
    function () {
        var _this = this;
        // this.renderer.addClass(this.dropdownContainer, 'collapse-top');
        setTimeout((/**
         * @return {?}
         */
        function () {
            _this.renderer.addClass(_this.dropdownContainer, 'd-none');
        }), 270);
        this.show = false;
    };
    /**
     * @return {?}
     */
    DropdownDirective.prototype.remove = /**
     * @return {?}
     */
    function () {
        this.dropdownContainer.remove();
    };
    DropdownDirective.decorators = [
        { type: Directive, args: [{
                    selector: '[pDropdown]',
                    exportAs: 'pDropdown',
                },] }
    ];
    /** @nocollapse */
    DropdownDirective.ctorParameters = function () { return [
        { type: Renderer2 },
        { type: ElementRef },
        { type: ViewContainerRef }
    ]; };
    DropdownDirective.propDecorators = {
        pDropdown: [{ type: Input }],
        show: [{ type: Input, args: ['pDropdownShowInitialize',] }],
        trigger: [{ type: Input, args: ['pDropdownTrigger',] }]
    };
    __decorate([
        Select(EventListenerState.getOne('mousemove')),
        __metadata("design:type", Observable)
    ], DropdownDirective.prototype, "mousemove$", void 0);
    __decorate([
        Select(EventListenerState.getOne('click')),
        __metadata("design:type", Observable)
    ], DropdownDirective.prototype, "click$", void 0);
    return DropdownDirective;
}());

/**
 * @fileoverview added by tsickle
 * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
 */
var PopoverDirective = /** @class */ (function () {
    function PopoverDirective(actions, appRef, elRef, renderer, resolver, store, vcRef) {
        this.actions = actions;
        this.appRef = appRef;
        this.elRef = elRef;
        this.renderer = renderer;
        this.resolver = resolver;
        this.store = store;
        this.vcRef = vcRef;
        this.context = {};
        this.placement = 'top';
        this.trigger = 'click';
        this.destroy$ = new Subject();
    }
    Object.defineProperty(PopoverDirective.prototype, "containerRect", {
        get: /**
         * @return {?}
         */
        function () {
            return ((/** @type {?} */ (((/** @type {?} */ (this.popover.location.nativeElement))).childNodes[0]))).getBoundingClientRect();
        },
        enumerable: true,
        configurable: true
    });
    /**
     * @return {?}
     */
    PopoverDirective.prototype.ngOnInit = /**
     * @return {?}
     */
    function () {
        var _this = this;
        (this.trigger === 'mousemove' ? this.mousemove$ : this.click$)
            .pipe(takeUntilDestroy(this), filter((/**
         * @param {?} event
         * @return {?}
         */
        function (event) { return !!event; })))
            .subscribe((/**
         * @param {?} event
         * @return {?}
         */
        function (event) {
            /** @type {?} */
            var onMouseContainerOver = false;
            if (_this.popover) {
                _this.popover.hostView.detectChanges();
                var _a = _this.containerRect, top_1 = _a.top, bottom = _a.bottom, left = _a.left, right = _a.right;
                var x = event.x, y = event.y;
                onMouseContainerOver = top_1 < y && bottom > y && left < x && right > x;
            }
            if (!_this.popover && _this.elRef.nativeElement.contains(event.target)) {
                _this.show();
            }
            else if (_this.popover && !_this.elRef.nativeElement.contains(event.target) && !onMouseContainerOver) {
                _this.hide();
            }
        }));
    };
    /**
     * @return {?}
     */
    PopoverDirective.prototype.ngOnDestroy = /**
     * @return {?}
     */
    function () {
        this.hide();
    };
    /**
     * @return {?}
     */
    PopoverDirective.prototype.show = /**
     * @return {?}
     */
    function () {
        /** @type {?} */
        var element = (/** @type {?} */ (this.elRef.nativeElement));
        /** @type {?} */
        var injector = ReflectiveInjector.resolveAndCreate([
            { provide: 'POPOVER_PROVIDER', useValue: (/** @type {?} */ ({ element: element, placement: this.placement })) },
        ]);
        /** @type {?} */
        var hedaerNode = createProjectableNode.call(this, this.header);
        /** @type {?} */
        var contentNode = createProjectableNode.call(this, this.content);
        this.popover = this.resolver.resolveComponentFactory(PopoverComponent).create(injector, [hedaerNode, contentNode]);
        this.appRef.attachView(this.popover.hostView);
        this.renderer.appendChild(this.renderer.selectRootElement('p-root', true), ((/** @type {?} */ (this.popover.hostView))).rootNodes[0]);
        this.subscribeTo();
    };
    /**
     * @return {?}
     */
    PopoverDirective.prototype.hide = /**
     * @return {?}
     */
    function () {
        if (this.popover) {
            this.popover.destroy();
            this.popover = null;
        }
        this.destroy$.next();
        this.store.dispatch(new EventListenerRemove('resize'));
    };
    /**
     * @return {?}
     */
    PopoverDirective.prototype.subscribeTo = /**
     * @return {?}
     */
    function () {
        var _this = this;
        this.store.dispatch(new EventListenerAdd('resize'));
        this.resize$
            .pipe(filter((/**
         * @param {?} event
         * @return {?}
         */
        function (event) { return !!event; })), takeUntilNotNull(this.destroy$))
            .subscribe((/**
         * @param {?} _
         * @return {?}
         */
        function (_) { return _this.hide(); }));
        this.actions
            .pipe(ofActionDispatched(EventListenerScrollVertical), takeUntilNotNull(this.destroy$))
            .subscribe((/**
         * @param {?} _
         * @return {?}
         */
        function (_) { return _this.hide(); }));
    };
    PopoverDirective.decorators = [
        { type: Directive, args: [{
                    selector: '[pPopover]',
                    exportAs: 'pPopover',
                },] }
    ];
    /** @nocollapse */
    PopoverDirective.ctorParameters = function () { return [
        { type: Actions },
        { type: ApplicationRef },
        { type: ElementRef },
        { type: Renderer2 },
        { type: ComponentFactoryResolver },
        { type: Store },
        { type: ViewContainerRef }
    ]; };
    PopoverDirective.propDecorators = {
        content: [{ type: Input, args: ['pPopover',] }],
        context: [{ type: Input, args: ['pPopoverContext',] }],
        header: [{ type: Input, args: ['pPopoverHeader',] }],
        placement: [{ type: Input, args: ['pPopoverPlacement',] }],
        trigger: [{ type: Input, args: ['pPopoverTrigger',] }]
    };
    __decorate([
        Select(EventListenerState.getOne('mousemove')),
        __metadata("design:type", Observable)
    ], PopoverDirective.prototype, "mousemove$", void 0);
    __decorate([
        Select(EventListenerState.getOne('click')),
        __metadata("design:type", Observable)
    ], PopoverDirective.prototype, "click$", void 0);
    __decorate([
        Select(EventListenerState.getOne('resize')),
        __metadata("design:type", Observable)
    ], PopoverDirective.prototype, "resize$", void 0);
    return PopoverDirective;
}());

/**
 * @fileoverview added by tsickle
 * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
 */
var TooltipDirective = /** @class */ (function () {
    function TooltipDirective(actions, appRef, elRef, injector, renderer, resolver, vcRef, store) {
        this.actions = actions;
        this.appRef = appRef;
        this.elRef = elRef;
        this.injector = injector;
        this.renderer = renderer;
        this.resolver = resolver;
        this.vcRef = vcRef;
        this.store = store;
        this.context = {};
        this.placement = 'top';
        this.trigger = 'mousemove';
        this.destroy$ = new Subject();
    }
    Object.defineProperty(TooltipDirective.prototype, "containerRect", {
        get: /**
         * @return {?}
         */
        function () {
            return ((/** @type {?} */ (((/** @type {?} */ (this.tooltip.location.nativeElement))).childNodes[0]))).getBoundingClientRect();
        },
        enumerable: true,
        configurable: true
    });
    /**
     * @return {?}
     */
    TooltipDirective.prototype.ngOnInit = /**
     * @return {?}
     */
    function () {
        var _this = this;
        (this.trigger === 'mousemove' ? this.mousemove$ : this.click$)
            .pipe(takeUntilDestroy(this), filter((/**
         * @param {?} event
         * @return {?}
         */
        function (event) { return !!event; })))
            .subscribe((/**
         * @param {?} event
         * @return {?}
         */
        function (event) {
            /** @type {?} */
            var onMouseContainerOver = false;
            if (_this.tooltip) {
                _this.tooltip.hostView.detectChanges();
                var _a = _this.containerRect, top_1 = _a.top, bottom = _a.bottom, left = _a.left, right = _a.right;
                var x = event.x, y = event.y;
                onMouseContainerOver = top_1 < y && bottom > y && left < x && right > x;
            }
            if (!_this.tooltip && _this.elRef.nativeElement.contains(event.target)) {
                _this.show();
            }
            else if (_this.tooltip && !_this.elRef.nativeElement.contains(event.target) && !onMouseContainerOver) {
                _this.hide();
            }
        }));
    };
    /**
     * @return {?}
     */
    TooltipDirective.prototype.ngOnDestroy = /**
     * @return {?}
     */
    function () {
        this.hide();
    };
    /**
     * @return {?}
     */
    TooltipDirective.prototype.show = /**
     * @return {?}
     */
    function () {
        /** @type {?} */
        var element = (/** @type {?} */ (this.elRef.nativeElement));
        /** @type {?} */
        var injector = ReflectiveInjector.resolveAndCreate([
            { provide: 'TOOLTIP_PROVIDER', useValue: (/** @type {?} */ ({ element: element, placement: this.placement })) },
        ]);
        /** @type {?} */
        var projectableNode = createProjectableNode.call(this, this.content);
        this.tooltip = this.resolver.resolveComponentFactory(TooltipComponent).create(injector, [projectableNode]);
        this.appRef.attachView(this.tooltip.hostView);
        this.renderer.appendChild(this.renderer.selectRootElement('p-root', true), ((/** @type {?} */ (this.tooltip.hostView))).rootNodes[0]);
        this.subscribeTo();
    };
    /**
     * @return {?}
     */
    TooltipDirective.prototype.hide = /**
     * @return {?}
     */
    function () {
        if (this.tooltip) {
            this.tooltip.destroy();
            this.tooltip = null;
        }
        this.destroy$.next();
        this.store.dispatch(new EventListenerRemove('resize'));
    };
    /**
     * @return {?}
     */
    TooltipDirective.prototype.subscribeTo = /**
     * @return {?}
     */
    function () {
        var _this = this;
        this.store.dispatch(new EventListenerAdd('resize'));
        this.resize$
            .pipe(filter((/**
         * @param {?} event
         * @return {?}
         */
        function (event) { return !!event; })), takeUntilNotNull(this.destroy$))
            .subscribe((/**
         * @param {?} _
         * @return {?}
         */
        function (_) { return _this.hide(); }));
        this.actions
            .pipe(ofActionDispatched(EventListenerScrollVertical), takeUntilNotNull(this.destroy$))
            .subscribe((/**
         * @param {?} _
         * @return {?}
         */
        function (_) { return _this.hide(); }));
    };
    TooltipDirective.decorators = [
        { type: Directive, args: [{
                    selector: '[pTooltip]',
                    exportAs: 'pTooltip',
                },] }
    ];
    /** @nocollapse */
    TooltipDirective.ctorParameters = function () { return [
        { type: Actions },
        { type: ApplicationRef },
        { type: ElementRef },
        { type: Injector },
        { type: Renderer2 },
        { type: ComponentFactoryResolver },
        { type: ViewContainerRef },
        { type: Store }
    ]; };
    TooltipDirective.propDecorators = {
        content: [{ type: Input, args: ['pTooltip',] }],
        context: [{ type: Input, args: ['pTooltipContext',] }],
        placement: [{ type: Input, args: ['pTooltipPlacement',] }],
        trigger: [{ type: Input, args: ['pTooltipTrigger',] }]
    };
    __decorate([
        Select(EventListenerState.getOne('mousemove')),
        __metadata("design:type", Observable)
    ], TooltipDirective.prototype, "mousemove$", void 0);
    __decorate([
        Select(EventListenerState.getOne('click')),
        __metadata("design:type", Observable)
    ], TooltipDirective.prototype, "click$", void 0);
    __decorate([
        Select(EventListenerState.getOne('resize')),
        __metadata("design:type", Observable)
    ], TooltipDirective.prototype, "resize$", void 0);
    return TooltipDirective;
}());

/**
 * @fileoverview added by tsickle
 * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
 */

/**
 * @fileoverview added by tsickle
 * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
 */
var GoogleChart;
(function (GoogleChart) {
    /**
     * @record
     */
    function Column() { }
    GoogleChart.Column = Column;
})(GoogleChart || (GoogleChart = {}));

/**
 * @fileoverview added by tsickle
 * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
 */
var Toaster;
(function (Toaster) {
    /**
     * @record
     */
    function State$$1() { }
    Toaster.State = State$$1;
})(Toaster || (Toaster = {}));

/**
 * @fileoverview added by tsickle
 * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
 */
var Tooltip;
(function (Tooltip) {
    /**
     * @record
     */
    function Config() { }
    Tooltip.Config = Config;
})(Tooltip || (Tooltip = {}));

/**
 * @fileoverview added by tsickle
 * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
 */

/**
 * @fileoverview added by tsickle
 * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
 */
var ToasterState = /** @class */ (function () {
    function ToasterState() {
    }
    ToasterState = __decorate([
        State({
            name: 'ToasterState',
        })
    ], ToasterState);
    return ToasterState;
}());

/**
 * @fileoverview added by tsickle
 * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
 */

/**
 * @fileoverview added by tsickle
 * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
 */
library.add(faCalendarDay, faInfoCircle, faSearch, faTimes);
var UiModule = /** @class */ (function () {
    function UiModule() {
    }
    UiModule.decorators = [
        { type: NgModule, args: [{
                    imports: [
                        CoreModule,
                        CoreModule,
                        FontAwesomeModule,
                        NgDatepickerModule,
                        NgxsModule.forFeature([ToasterState]),
                        PerfectScrollbarModule,
                    ],
                    declarations: [
                        // abstracts
                        AbstractInputComponent,
                        // charts
                        AnnotationChartComponent,
                        // components
                        AutocompleteComponent,
                        CheckboxComponent,
                        GoogleChartComponent,
                        DatePickerComponent,
                        InputComponent,
                        ListboxComponent,
                        ModalComponent,
                        PaginationComponent,
                        PopoverComponent,
                        ProgressBarComponent,
                        RadioComponent,
                        SelectComponent,
                        SpinnerComponent,
                        TextAreaComponent,
                        ToasterComponent,
                        ToasterContainerComponent,
                        TooltipComponent,
                        // Directives
                        DropdownDirective,
                        PopoverDirective,
                        TooltipDirective,
                    ],
                    entryComponents: [ToasterComponent, PopoverComponent, TooltipComponent],
                    exports: [
                        // modules
                        FontAwesomeModule,
                        NgDatepickerModule,
                        NgxSlickJsModule,
                        PerfectScrollbarModule,
                        // charts
                        AnnotationChartComponent,
                        // components
                        AutocompleteComponent,
                        CheckboxComponent,
                        GoogleChartComponent,
                        DatePickerComponent,
                        InputComponent,
                        ListboxComponent,
                        ModalComponent,
                        PaginationComponent,
                        PopoverComponent,
                        ProgressBarComponent,
                        RadioComponent,
                        SelectComponent,
                        SpinnerComponent,
                        TextAreaComponent,
                        ToasterComponent,
                        ToasterContainerComponent,
                        TooltipComponent,
                        // Directives
                        DropdownDirective,
                        PopoverDirective,
                        TooltipDirective,
                    ],
                },] }
    ];
    return UiModule;
}());

/**
 * @fileoverview added by tsickle
 * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
 */

/**
 * @fileoverview added by tsickle
 * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
 */

export { AbstractInputComponent, LayoutScroll, ToasterShow, AutocompleteComponent, AnnotationChartComponent, DatePickerComponent, GoogleChartComponent, CheckboxComponent, InputComponent, RadioComponent, SpinnerComponent, TextAreaComponent, ListboxComponent, ModalComponent, PaginationComponent, PopoverComponent, ProgressBarComponent, SelectComponent, ToasterComponent, ToasterContainerComponent, TooltipComponent, DropdownDirective, PopoverDirective, TooltipDirective, ToasterState, createProjectableNode, UiModule, AbstractInputComponent as ɵe, AbstractInputComponent as ɵb, AutocompleteComponent as ɵd, AnnotationChartComponent as ɵc, DatePickerComponent as ɵh, GoogleChartComponent as ɵg, CheckboxComponent as ɵf, InputComponent as ɵi, RadioComponent as ɵq, SpinnerComponent as ɵs, TextAreaComponent as ɵt, ListboxComponent as ɵj, ModalComponent as ɵk, PaginationComponent as ɵl, PopoverComponent as ɵm, ProgressBarComponent as ɵp, SelectComponent as ɵr, ToasterContainerComponent as ɵv, ToasterComponent as ɵu, TooltipComponent as ɵn, DropdownDirective as ɵw, PopoverDirective as ɵx, TooltipDirective as ɵy, ToasterState as ɵa };

//# sourceMappingURL=ngx-performance-ui-ui.js.map