import { __decorate, __extends } from "tslib";
import { ChangeDetectionStrategy, Component, Input, ViewEncapsulation } from '@angular/core';
import { mixinDisabled } from '@bravobit/bb-foundation';
var BbSpinnerBase = /** @class */ (function () {
    function BbSpinnerBase() {
    }
    return BbSpinnerBase;
}());
var BbSpinnerMixinBase = mixinDisabled(BbSpinnerBase);
var BbSpinner = /** @class */ (function (_super) {
    __extends(BbSpinner, _super);
    function BbSpinner() {
        var _this = _super !== null && _super.apply(this, arguments) || this;
        // Inputs.
        _this.color = '#303f9f';
        _this.alt = 'Loading...';
        return _this;
    }
    __decorate([
        Input()
    ], BbSpinner.prototype, "color", void 0);
    __decorate([
        Input()
    ], BbSpinner.prototype, "alt", void 0);
    BbSpinner = __decorate([
        Component({
            selector: 'bb-spinner',
            template: "<!--\r\n    The spinner element.\r\n\r\n    This element contains a circle with a 25% bar that spins\r\n    indefinitely. The border color can be set via the \"color\"\r\n    property.\r\n-->\r\n<div class=\"bb-spinner-container\">\r\n    <div [style.border-left-color]=\"color\"\r\n         [class.disabled]=\"disabled\"\r\n         class=\"bb-spinner-loader\"\r\n         aria-live=\"assertive\"\r\n         role=\"alert\">\r\n        {{ alt }}\r\n    </div>\r\n    <ng-content select=\"img\"></ng-content>\r\n</div>\r\n\r\n<!--\r\n    The content of the spinner.\r\n\r\n    This element contains the content of the spinner. The user\r\n    can set the content inside the tag.\r\n-->\r\n<span class=\"bb-spinner-content\">\r\n    <ng-content></ng-content>\r\n</span>\r\n",
            changeDetection: ChangeDetectionStrategy.OnPush,
            encapsulation: ViewEncapsulation.None,
            host: { 'class': 'bb-spinner' },
            inputs: ['color', 'alt', 'disabled'],
            preserveWhitespaces: false,
            styles: [".bb-spinner{color:#565656;padding:20px 0;text-align:center;-ms-flex-align:center;align-items:center;display:-ms-inline-flexbox;display:inline-flex;-ms-flex-direction:column;flex-direction:column;-ms-flex-pack:center;justify-content:center}.bb-spinner.block{display:-ms-flexbox;display:flex}.bb-spinner.inverse .bb-spinner-loader{border-color:rgba(255,255,255,.15)}.bb-spinner.inverse .bb-spinner-content{color:rgba(255,255,255,.5)}.bb-spinner.small .bb-spinner-loader,.bb-spinner.small .bb-spinner-loader:after{width:20px;height:20px;min-width:20px;min-height:20px}.bb-spinner.small .bb-spinner-loader{border-width:2px}.bb-spinner.small .bb-spinner-content{font-size:12px}.bb-spinner.medium .bb-spinner-loader,.bb-spinner.medium .bb-spinner-loader:after{width:60px;height:60px;min-width:60px;min-height:60px}.bb-spinner.medium .bb-spinner-loader{border-width:4px}.bb-spinner.medium .bb-spinner-content{font-size:16px}.bb-spinner.large .bb-spinner-loader,.bb-spinner.large .bb-spinner-loader:after{width:100px;height:100px;min-width:100px;min-height:100px}.bb-spinner.large .bb-spinner-loader{border-width:6px}.bb-spinner.large .bb-spinner-content{font-size:20px}.bb-spinner.horizontal{text-align:left;-ms-flex-direction:row;flex-direction:row}.bb-spinner.horizontal .bb-spinner-content:not(:empty){margin-left:10px;margin-top:0}.bb-spinner.vertical{text-align:center;-ms-flex-direction:column;flex-direction:column}.bb-spinner.vertical .bb-spinner-content:not(:empty){margin-left:0;margin-top:10px}.bb-spinner-container{display:-ms-flexbox;display:flex;position:relative}.bb-spinner-container>img{top:20%;left:20%;width:60%;height:60%;position:absolute}.bb-spinner-loader{margin:0;padding:0;overflow:hidden;text-indent:100%;color:transparent;position:relative;display:inline-block;vertical-align:middle;border:4px solid #f2f4f6;-webkit-animation:1s linear infinite spin;animation:1s linear infinite spin}.bb-spinner-loader,.bb-spinner-loader:after{width:60px;height:60px;min-width:60px;min-height:60px;border-radius:50%}.bb-spinner-loader.disabled{cursor:default;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;pointer-events:none;-webkit-animation-play-state:paused;animation-play-state:paused}.bb-spinner-content:not(:empty){font-size:16px;margin-top:10px;font-weight:500}@-webkit-keyframes spin{from{transform:rotate(0)}to{transform:rotate(360deg)}}@keyframes spin{from{transform:rotate(0)}to{transform:rotate(360deg)}}"]
        })
    ], BbSpinner);
    return BbSpinner;
}(BbSpinnerMixinBase));
export { BbSpinner };
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoic3Bpbm5lci5jb21wb25lbnQuanMiLCJzb3VyY2VSb290Ijoibmc6Ly9AYnJhdm9iaXQvYmItZm91bmRhdGlvbi9lbGVtZW50cy8iLCJzb3VyY2VzIjpbImxpYi9zcGlubmVyL3NwaW5uZXIuY29tcG9uZW50LnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiI7QUFBQSxPQUFPLEVBQUMsdUJBQXVCLEVBQUUsU0FBUyxFQUFFLEtBQUssRUFBRSxpQkFBaUIsRUFBQyxNQUFNLGVBQWUsQ0FBQztBQUMzRixPQUFPLEVBQW9DLGFBQWEsRUFBQyxNQUFNLHlCQUF5QixDQUFDO0FBRXpGO0lBQUE7SUFDQSxDQUFDO0lBQUQsb0JBQUM7QUFBRCxDQUFDLEFBREQsSUFDQztBQUVELElBQU0sa0JBQWtCLEdBRWxCLGFBQWEsQ0FBQyxhQUFhLENBQUMsQ0FBQztBQVluQztJQUErQiw2QkFBa0I7SUFBakQ7UUFBQSxxRUFNQztRQUpHLFVBQVU7UUFDRCxXQUFLLEdBQVcsU0FBUyxDQUFDO1FBQzFCLFNBQUcsR0FBVyxZQUFZLENBQUM7O0lBRXhDLENBQUM7SUFIWTtRQUFSLEtBQUssRUFBRTs0Q0FBMkI7SUFDMUI7UUFBUixLQUFLLEVBQUU7MENBQTRCO0lBSjNCLFNBQVM7UUFWckIsU0FBUyxDQUFDO1lBQ1AsUUFBUSxFQUFFLFlBQVk7WUFDdEIsZ3hCQUF1QztZQUV2QyxlQUFlLEVBQUUsdUJBQXVCLENBQUMsTUFBTTtZQUMvQyxhQUFhLEVBQUUsaUJBQWlCLENBQUMsSUFBSTtZQUNyQyxJQUFJLEVBQUUsRUFBQyxPQUFPLEVBQUUsWUFBWSxFQUFDO1lBQzdCLE1BQU0sRUFBRSxDQUFDLE9BQU8sRUFBRSxLQUFLLEVBQUUsVUFBVSxDQUFDO1lBQ3BDLG1CQUFtQixFQUFFLEtBQUs7O1NBQzdCLENBQUM7T0FDVyxTQUFTLENBTXJCO0lBQUQsZ0JBQUM7Q0FBQSxBQU5ELENBQStCLGtCQUFrQixHQU1oRDtTQU5ZLFNBQVMiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQge0NoYW5nZURldGVjdGlvblN0cmF0ZWd5LCBDb21wb25lbnQsIElucHV0LCBWaWV3RW5jYXBzdWxhdGlvbn0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XHJcbmltcG9ydCB7Q2FuRGlzYWJsZSwgQ2FuRGlzYWJsZUNvbnN0cnVjdG9yLCBtaXhpbkRpc2FibGVkfSBmcm9tICdAYnJhdm9iaXQvYmItZm91bmRhdGlvbic7XHJcblxyXG5jbGFzcyBCYlNwaW5uZXJCYXNlIHtcclxufVxyXG5cclxuY29uc3QgQmJTcGlubmVyTWl4aW5CYXNlOiBDYW5EaXNhYmxlQ29uc3RydWN0b3JcclxuICAgICYgdHlwZW9mIEJiU3Bpbm5lckJhc2VcclxuICAgID0gbWl4aW5EaXNhYmxlZChCYlNwaW5uZXJCYXNlKTtcclxuXHJcbkBDb21wb25lbnQoe1xyXG4gICAgc2VsZWN0b3I6ICdiYi1zcGlubmVyJyxcclxuICAgIHRlbXBsYXRlVXJsOiAnLi9zcGlubmVyLmNvbXBvbmVudC5odG1sJyxcclxuICAgIHN0eWxlVXJsczogWycuL3NwaW5uZXIuY29tcG9uZW50LnNjc3MnXSxcclxuICAgIGNoYW5nZURldGVjdGlvbjogQ2hhbmdlRGV0ZWN0aW9uU3RyYXRlZ3kuT25QdXNoLFxyXG4gICAgZW5jYXBzdWxhdGlvbjogVmlld0VuY2Fwc3VsYXRpb24uTm9uZSxcclxuICAgIGhvc3Q6IHsnY2xhc3MnOiAnYmItc3Bpbm5lcid9LFxyXG4gICAgaW5wdXRzOiBbJ2NvbG9yJywgJ2FsdCcsICdkaXNhYmxlZCddLFxyXG4gICAgcHJlc2VydmVXaGl0ZXNwYWNlczogZmFsc2VcclxufSlcclxuZXhwb3J0IGNsYXNzIEJiU3Bpbm5lciBleHRlbmRzIEJiU3Bpbm5lck1peGluQmFzZSBpbXBsZW1lbnRzIENhbkRpc2FibGUge1xyXG5cclxuICAgIC8vIElucHV0cy5cclxuICAgIEBJbnB1dCgpIGNvbG9yOiBzdHJpbmcgPSAnIzMwM2Y5Zic7XHJcbiAgICBASW5wdXQoKSBhbHQ6IHN0cmluZyA9ICdMb2FkaW5nLi4uJztcclxuXHJcbn1cclxuIl19