import * as tslib_1 from "tslib";
import { Component, Input, Output, EventEmitter, ViewChild, forwardRef, TemplateRef, ViewEncapsulation, ChangeDetectionStrategy, ChangeDetectorRef, } from '@angular/core';
import { NG_VALUE_ACCESSOR } from '@angular/forms';
import { OverlayComponent } from '../overlay';
import { OverlayOriginDirective } from '../overlay/overlay-origin.directive';
var Direction;
(function (Direction) {
    Direction["up"] = "up";
    Direction["down"] = "down";
})(Direction || (Direction = {}));
var SelectComponent = /** @class */ (function () {
    function SelectComponent(cd) {
        this.cd = cd;
        this.datasource = [];
        this.theme = 'default';
        this.size = 'default';
        this.searchable = false;
        this.disabled = false;
        this.onChange = new EventEmitter();
        this.onPanelShow = new EventEmitter();
        this.onPanelHide = new EventEmitter();
        this.direction = Direction.down;
        this.expanded = false;
        this.onModelChange = function () { };
        this.onModelTouched = function () { };
        this.placement = 'bottom-left';
    }
    SelectComponent_1 = SelectComponent;
    SelectComponent.prototype.ngOnInit = function () {
        this.selectedData = { value: null, label: this.defaultLabel || '请选择' };
        this.overlay.origin = this.origin;
    };
    SelectComponent.prototype.onToggle = function () {
        this.changeState();
        if (this.expanded) {
            this.bindEvents();
        }
    };
    SelectComponent.prototype.show = function () {
        this.direction = Direction.up;
        this.overlay.show();
    };
    SelectComponent.prototype.hide = function () {
        this.direction = Direction.down;
        this.overlay.hide();
    };
    SelectComponent.prototype.toggleOverlay = function () {
        this.overlay.isVisible() ? this.hide() : this.show();
    };
    SelectComponent.prototype.changeState = function () {
        this.toggleOverlay();
        this.expanded = !this.expanded;
        this.cd.markForCheck();
    };
    SelectComponent.prototype.onSelectedOption = function (data) {
        this.selectedData = data;
        // const initState = this.selectedData.init;
        this.value = this.selectedData.value;
        this.onModelChange(this.selectedData);
        // if (!initState) {
        this.onChange.emit({
            value: this.selectedData.value,
            label: this.selectedData.label
        });
        this.changeState();
        // }
        this.onModelTouched();
        this.setSelectedData();
        this.cd.markForCheck();
    };
    SelectComponent.prototype.clear = function () {
        this.selectedData = { value: null, label: this.defaultLabel || '请选择' };
        this.cd.markForCheck();
    };
    SelectComponent.prototype.bindEvents = function () {
    };
    SelectComponent.prototype.unbindEvents = function () {
        if (this.windowResizeListener) {
            this.windowResizeListener();
            this.windowResizeListener = null;
        }
    };
    SelectComponent.prototype.setSelectedData = function () {
        var _this = this;
        this.datasource.forEach(function (data) {
            if (data.value === _this.value) {
                _this.selectedData = data;
                _this.cd.markForCheck();
            }
        });
    };
    SelectComponent.prototype.writeValue = function (value) {
        if (value === null) {
            this.clear();
            return;
        }
        this.value = value;
        this.setSelectedData();
    };
    SelectComponent.prototype.registerOnChange = function (fn) {
        this.onModelChange = fn;
        this.cd.markForCheck();
    };
    SelectComponent.prototype.registerOnTouched = function (fn) {
        this.onModelTouched = fn;
        this.cd.markForCheck();
    };
    /**
     * Toggles the disabled state of the component. Implemented as part of ControlValueAccessor.
     * @param isDisabled Whether the component should be disabled.
     */
    SelectComponent.prototype.setDisabledState = function (isDisabled) {
        this.disabled = isDisabled;
    };
    SelectComponent.prototype.onClosePanel = function (_panel) {
        this.direction = Direction.down;
    };
    SelectComponent.prototype.ngOnDestroy = function () {
        this.unbindEvents();
    };
    var SelectComponent_1;
    tslib_1.__decorate([
        ViewChild('origin', { static: true }),
        tslib_1.__metadata("design:type", OverlayOriginDirective)
    ], SelectComponent.prototype, "origin", void 0);
    tslib_1.__decorate([
        ViewChild('overlay', { static: true }),
        tslib_1.__metadata("design:type", OverlayComponent)
    ], SelectComponent.prototype, "overlay", void 0);
    tslib_1.__decorate([
        Input(),
        tslib_1.__metadata("design:type", Array)
    ], SelectComponent.prototype, "datasource", void 0);
    tslib_1.__decorate([
        Input(),
        tslib_1.__metadata("design:type", String)
    ], SelectComponent.prototype, "theme", void 0);
    tslib_1.__decorate([
        Input(),
        tslib_1.__metadata("design:type", String)
    ], SelectComponent.prototype, "size", void 0);
    tslib_1.__decorate([
        Input(),
        tslib_1.__metadata("design:type", String)
    ], SelectComponent.prototype, "defaultLabel", void 0);
    tslib_1.__decorate([
        Input(),
        tslib_1.__metadata("design:type", Boolean)
    ], SelectComponent.prototype, "searchable", void 0);
    tslib_1.__decorate([
        Input(),
        tslib_1.__metadata("design:type", Boolean)
    ], SelectComponent.prototype, "disabled", void 0);
    tslib_1.__decorate([
        Input(),
        tslib_1.__metadata("design:type", Object)
    ], SelectComponent.prototype, "value", void 0);
    tslib_1.__decorate([
        Input(),
        tslib_1.__metadata("design:type", TemplateRef)
    ], SelectComponent.prototype, "optionTpl", void 0);
    tslib_1.__decorate([
        Output(),
        tslib_1.__metadata("design:type", EventEmitter)
    ], SelectComponent.prototype, "onChange", void 0);
    tslib_1.__decorate([
        Output(),
        tslib_1.__metadata("design:type", EventEmitter)
    ], SelectComponent.prototype, "onPanelShow", void 0);
    tslib_1.__decorate([
        Output(),
        tslib_1.__metadata("design:type", EventEmitter)
    ], SelectComponent.prototype, "onPanelHide", void 0);
    SelectComponent = SelectComponent_1 = tslib_1.__decorate([
        Component({
            selector: 'nb-select',
            template: "<button nbOverlayOrigin nb-button #origin=\"nbOverlayOrigin\" type=\"button\" theme=\"{{theme}}\" size=\"{{size}}\" (click)=\"onToggle()\"><span class=\"nb-select-label\">{{ selectedData.label }}</span> <i class=\"nb-select-icon {{ direction }}\"></i></button><nb-overlay #overlay class=\"nb-select-overlay\" placement=\"bottom-left\" (closeHandler)=\"onClosePanel($event)\"><nb-select-options (onChange)=\"onSelectedOption($event)\" [styles]=\"styles\" [value]=\"value\" [searchable]=\"searchable\" [optionTpl]=\"optionTpl\" [data]=\"datasource\"></nb-select-options></nb-overlay>",
            encapsulation: ViewEncapsulation.None,
            changeDetection: ChangeDetectionStrategy.OnPush,
            preserveWhitespaces: false,
            host: {
                'class': 'nb-widget nb-select',
                '[class.disabled]': 'disabled',
                '[class.nb-widget-disabled]': 'disabled'
            },
            exportAs: 'nbSelect',
            providers: [{
                    provide: NG_VALUE_ACCESSOR,
                    useExisting: forwardRef(function () { return SelectComponent_1; }),
                    multi: true
                }]
        }),
        tslib_1.__metadata("design:paramtypes", [ChangeDetectorRef])
    ], SelectComponent);
    return SelectComponent;
}());
export { SelectComponent };
//# sourceMappingURL=select.js.map