import { __decorate, __param } from "tslib";
import { Component, HostBinding, HostListener, Input, Optional } from '@angular/core';
import { FormDisabledDirective } from '../form-disabled.directive';
import { coerceBooleanProperty } from '@angular/cdk/coercion';
var ButtonIconComponent = /** @class */ (function () {
    function ButtonIconComponent(formDisabled) {
        this.formDisabled = formDisabled;
        this.labelPosition = 'right';
        this.labelSize = 'medium';
        this.staticLabel = false;
    }
    Object.defineProperty(ButtonIconComponent.prototype, "setStaticLabel", {
        set: function (value) {
            this.staticLabel = coerceBooleanProperty(value);
        },
        enumerable: true,
        configurable: true
    });
    Object.defineProperty(ButtonIconComponent.prototype, "setDisabled", {
        set: function (value) {
            this.disabled = coerceBooleanProperty(value);
        },
        enumerable: true,
        configurable: true
    });
    ButtonIconComponent.prototype.ngOnInit = function () {
    };
    Object.defineProperty(ButtonIconComponent.prototype, "viewDisabled", {
        get: function () {
            var _a;
            return this.disabled || ((_a = this.formDisabled) === null || _a === void 0 ? void 0 : _a.disabled) || null;
        },
        enumerable: true,
        configurable: true
    });
    Object.defineProperty(ButtonIconComponent.prototype, "iconClass", {
        get: function () {
            var classes = [];
            if (this.color) {
                classes.push('icon--' + this.color);
            }
            if (this.hover) {
                classes.push('icon--hover');
            }
            return classes;
        },
        enumerable: true,
        configurable: true
    });
    Object.defineProperty(ButtonIconComponent.prototype, "labelClass", {
        get: function () {
            var classes = [];
            if (this.labelPosition) {
                classes.push('label--' + this.labelPosition);
            }
            if (this.labelSize) {
                classes.push('label--' + this.labelSize);
            }
            if (this.labelColor) {
                classes.push('label--' + this.labelColor);
            }
            if (this.hover) {
                classes.push('label--hover');
            }
            if (this.staticLabel) {
                classes.push('label--static');
            }
            return classes;
        },
        enumerable: true,
        configurable: true
    });
    ButtonIconComponent.prototype.onMouseEnter = function () {
        this.hover = true;
    };
    ButtonIconComponent.prototype.onMouseLeave = function () {
        this.hover = false;
    };
    ButtonIconComponent.ctorParameters = function () { return [
        { type: FormDisabledDirective, decorators: [{ type: Optional }] }
    ]; };
    __decorate([
        Input()
    ], ButtonIconComponent.prototype, "icon", void 0);
    __decorate([
        Input()
    ], ButtonIconComponent.prototype, "color", void 0);
    __decorate([
        Input()
    ], ButtonIconComponent.prototype, "size", void 0);
    __decorate([
        Input()
    ], ButtonIconComponent.prototype, "shape", void 0);
    __decorate([
        Input()
    ], ButtonIconComponent.prototype, "labelPosition", void 0);
    __decorate([
        Input()
    ], ButtonIconComponent.prototype, "labelSize", void 0);
    __decorate([
        Input()
    ], ButtonIconComponent.prototype, "labelColor", void 0);
    __decorate([
        Input('staticLabel')
    ], ButtonIconComponent.prototype, "setStaticLabel", null);
    __decorate([
        Input('disabled')
    ], ButtonIconComponent.prototype, "setDisabled", null);
    __decorate([
        HostBinding('attr.disabled')
    ], ButtonIconComponent.prototype, "viewDisabled", null);
    __decorate([
        HostListener('mouseenter')
    ], ButtonIconComponent.prototype, "onMouseEnter", null);
    __decorate([
        HostListener('mouseleave')
    ], ButtonIconComponent.prototype, "onMouseLeave", null);
    ButtonIconComponent = __decorate([
        Component({
            // tslint:disable-next-line:component-selector
            selector: '[ui-button-icon]',
            template: "<div class=\"icon\" [class]=\"iconClass\">\n  <ui-icon [name]=\"icon\" size=\"s\" stroke=\"2\"></ui-icon>\n</div>\n<div class=\"label\" [class]=\"labelClass\">\n  <ng-content></ng-content>\n</div>\n",
            styles: [":host{border:none;background:0 0;margin:0;padding:0;display:flex;align-items:center;color:var(--color-contrast-90);text-decoration:none;cursor:pointer}:host[size=small] .icon{width:32px;height:32px}:host[size=small] .icon>ui-icon{transform:scale(.75)}:host[shape=circle] .icon{border-radius:50%}:host:focus-visible .icon{box-shadow:0 0 0 2px var(--btn-icon-color-focus)}:host:active .icon{background:var(--color-contrast-2)}:host:active .icon--primary{background:var(--btn-color-primary-active)}:host:active .icon--critical{background:var(--btn-color-critical-active)}:host:active .icon--warning{background:var(--btn-color-warning-active)}:host:active .icon--contrast-5{background:var(--color-contrast-10)}:host.loading,:host:disabled{cursor:not-allowed;color:var(--color-contrast-20)}:host.loading .icon,:host:disabled .icon{border-color:transparent;background:var(--btn-color-disabled);box-shadow:none}:host.loading .icon--primary,:host:disabled .icon--primary{background:var(--color-primary-dark)}:host.loading .icon--critical,:host:disabled .icon--critical{background:var(--color-critical-dark)}:host.loading .icon--warning,:host:disabled .icon--warning{background:var(--color-warning-dark)}.icon{display:flex;justify-content:center;align-items:center;flex-shrink:0;width:40px;height:40px;border-radius:var(--radius-regular);border:var(--border-thin) var(--color-border);order:1}.icon--primary{border-color:var(--btn-color-primary);background:var(--btn-color-primary);color:var(--btn-color-primary-contrast)}.icon--warning{border-color:var(--color-warning);background:var(--color-warning);color:var(--btn-color-warning-contrast)}.icon--critical{border-color:var(--color-critical);background:var(--color-critical);color:var(--btn-color-critical-contrast)}.icon--contrast-5{border-color:transparent;background:var(--color-contrast-5)}@media screen and (max-width:959px){.label:not(.label--static){display:none}}@media screen and (min-width:960px){.label{display:block;padding:0 10px;white-space:nowrap;order:2}}.label:empty{display:none}.label--left{order:0}.label--right{order:2}.label--big{font-size:var(--btn-default-font-size);font-weight:600}.label--static{padding:0 10px}.label--invert{color:var(--color-bg)}"]
        }),
        __param(0, Optional())
    ], ButtonIconComponent);
    return ButtonIconComponent;
}());
export { ButtonIconComponent };
//# sourceMappingURL=data:application/json;base64, 