import * as tslib_1 from "tslib";
import { Component, Input, ElementRef, ViewEncapsulation, ChangeDetectionStrategy } from '@angular/core';
import { coerceBooleanProperty } from '../util/coerce';
import { dedupleClassName } from '../util/dom';
import { ButtonConfig } from './button.config';
import { OnChange } from '../core/decorators';
/**
 * Button Component
 */
var ButtonComponent = /** @class */ (function () {
    function ButtonComponent(_el, _config) {
        this._el = _el;
        this._config = _config;
        /**
         * button theme, there are four default themes: 'primary' | 'default' | 'neutral' | 'transparent'
         * @default default
         */
        this.theme = 'default';
        /**
         * button size, there are four default sizes: 'xs' | 'sm' | 'default' | 'lg'
         * @default default
         */
        this.size = 'default';
        /**
         * Whether the button is disabled
         * @default false
         */
        this.disabled = false;
        Object.assign(this, _config);
    }
    ButtonComponent.prototype.ngOnChanges = function (changes) {
        // refresh class list
        if (changes['theme'] || changes['size']) {
            this.setClass();
        }
        if (changes['disabled']) {
            this.disabled = coerceBooleanProperty(changes['disabled'].currentValue);
        }
    };
    ButtonComponent.prototype.ngAfterViewInit = function () {
        // init class list
        this.setClass();
    };
    /**
     * set host element classes
     * @docs-private
     */
    ButtonComponent.prototype.setClass = function () {
        var nativeEl = this._el.nativeElement;
        var nativeClassName = nativeEl.className;
        nativeEl.className = dedupleClassName(this.getClassName() + ' ' + nativeClassName).join(' ');
    };
    /**
     * get host element classes, depends on the theme and size.
     * @return {string} class names
     * @docs-private
     */
    ButtonComponent.prototype.getClassName = function () {
        return [
            'nb-widget',
            'nb-button',
            "nb-button-size-" + (this.size || 'default'),
            "nb-button-theme-" + (this.theme || 'default')
        ].join(' ');
    };
    tslib_1.__decorate([
        Input(),
        tslib_1.__metadata("design:type", String)
    ], ButtonComponent.prototype, "theme", void 0);
    tslib_1.__decorate([
        Input(),
        tslib_1.__metadata("design:type", String)
    ], ButtonComponent.prototype, "size", void 0);
    tslib_1.__decorate([
        OnChange(true),
        Input(),
        tslib_1.__metadata("design:type", Boolean)
    ], ButtonComponent.prototype, "disabled", void 0);
    ButtonComponent = tslib_1.__decorate([
        Component({
            selector: 'button[nb-button]',
            template: "<span class=\"nb-button-inner\"><ng-content></ng-content></span>",
            encapsulation: ViewEncapsulation.None,
            changeDetection: ChangeDetectionStrategy.OnPush,
            preserveWhitespaces: false,
            host: {
                // because the button has the original disabled property, we can just use [disabled]
                // otherwise use [attr.disabled]
                '[disabled]': 'disabled || null'
            },
            exportAs: 'nbButton'
        }),
        tslib_1.__metadata("design:paramtypes", [ElementRef,
            ButtonConfig])
    ], ButtonComponent);
    return ButtonComponent;
}());
export { ButtonComponent };
var ButtonAnchorComponent = /** @class */ (function (_super) {
    tslib_1.__extends(ButtonAnchorComponent, _super);
    function ButtonAnchorComponent() {
        return _super !== null && _super.apply(this, arguments) || this;
    }
    /**
     * prevent link button default navigation event
     *
     * @param {Event} event - click event
     * @docs-private
     */
    ButtonAnchorComponent.prototype._haltDisabledEvents = function (event) {
        if (this.disabled) {
            event.preventDefault();
            event.stopImmediatePropagation();
        }
    };
    ButtonAnchorComponent = tslib_1.__decorate([
        Component({
            selector: 'a[nb-button]',
            template: "<span class=\"nb-button-inner\"><ng-content></ng-content></span>",
            encapsulation: ViewEncapsulation.None,
            changeDetection: ChangeDetectionStrategy.OnPush,
            preserveWhitespaces: false,
            host: {
                // For non-interactive, focusable elements set -1
                // otherwize set to 0, using the default sequential focus navigation order
                // see https://www.w3.org/TR/html5/editing.html#the-tabindex-attribute
                '[attr.tabindex]': 'disabled ? -1 : 0',
                // because <a> don't have native disabled property, we neet set [attr.disabled]
                '[attr.disabled]': 'disabled || null',
                '(click)': '_haltDisabledEvents($event)',
            },
            exportAs: 'nbButton, nbAnchor'
        })
    ], ButtonAnchorComponent);
    return ButtonAnchorComponent;
}(ButtonComponent));
export { ButtonAnchorComponent };
//# sourceMappingURL=button.js.map