@taiga-ui/kit/fesm5/taiga-ui-kit-components-badge.js

Taiga UI Angular main components kit

import { __decorate, __param } from 'tslib';
import { Inject, Input, HostBinding, Component, ChangeDetectionStrategy, NgModule } from '@angular/core';
import { isNumber, tuiDefaultProp } from '@taiga-ui/cdk';
import { TUI_MODE, MODE_PROVIDER } from '@taiga-ui/core';
import { Observable } from 'rxjs';
import { CommonModule } from '@angular/common';

var TuiBadgeComponent = /** @class */ (function () {
    function TuiBadgeComponent(mode$) {
        this.mode$ = mode$;
        this.value = '';
        this.size = 'm';
        this.status = "default" /* Default */;
        this.hoverable = false;
    }
    Object.defineProperty(TuiBadgeComponent.prototype, "padding", {
        get: function () {
            return isNumber(this.value.valueOf()) ? 'm' : 'l';
        },
        enumerable: true,
        configurable: true
    });
    Object.defineProperty(TuiBadgeComponent.prototype, "outputValue", {
        get: function () {
            if (isNumber(this.value.valueOf()) && this.value.valueOf() > 99) {
                return '99+';
            }
            else {
                return String(this.value);
            }
        },
        enumerable: true,
        configurable: true
    });
    TuiBadgeComponent.ctorParameters = function () { return [
        { type: Observable, decorators: [{ type: Inject, args: [TUI_MODE,] }] }
    ]; };
    __decorate([
        Input(),
        tuiDefaultProp()
    ], TuiBadgeComponent.prototype, "value", void 0);
    __decorate([
        Input(),
        HostBinding('attr.data-tui-host-size'),
        tuiDefaultProp()
    ], TuiBadgeComponent.prototype, "size", void 0);
    __decorate([
        Input(),
        HostBinding('attr.data-tui-host-status'),
        tuiDefaultProp()
    ], TuiBadgeComponent.prototype, "status", void 0);
    __decorate([
        Input(),
        HostBinding('class._hoverable'),
        tuiDefaultProp()
    ], TuiBadgeComponent.prototype, "hoverable", void 0);
    __decorate([
        HostBinding('attr.data-tui-host-padding')
    ], TuiBadgeComponent.prototype, "padding", null);
    TuiBadgeComponent = __decorate([
        Component({
            selector: 'tui-badge',
            changeDetection: ChangeDetectionStrategy.OnPush,
            template: '{{outputValue}}',
            providers: [MODE_PROVIDER],
            host: {
                '($.data-mode.attr)': 'mode$',
            },
            styles: [":host{font:var(--tui-font-text-s);transition-property:background-color;transition-duration:.3s;transition-timing-function:ease-in-out;position:relative;display:inline-flex;align-items:center;justify-content:center;box-sizing:border-box;color:var(--tui-base-01);border-radius:100px;white-space:nowrap;overflow:hidden}:host:after{transition-property:background;transition-duration:.3s;transition-timing-function:ease-in-out;position:absolute;top:0;left:0;width:100%;height:100%;content:'';box-sizing:border-box;border-radius:inherit;pointer-events:none}:host._hoverable:active[data-tui-host-status=custom]:after,:host._hoverable:hover[data-tui-host-status=custom]:after{background-color:var(--tui-clear)}:host[data-tui-host-status=primary]{background-color:var(--tui-primary);color:var(--tui-primary-text)}:host[data-tui-host-status=primary]._hoverable:hover{background-color:var(--tui-primary-hover)}:host[data-tui-host-status=primary]._hoverable:active{background-color:var(--tui-primary-active)}:host[data-tui-host-status=error]{background-color:var(--tui-error-bg);color:var(--tui-text-01)}:host[data-tui-host-status=error]:before{content:'';color:var(--tui-error-fill)}:host[data-tui-host-status=error]._hoverable:active,:host[data-tui-host-status=error]._hoverable:hover{background-color:var(--tui-error-bg-hover)}:host[data-tui-host-status=error][data-mode=onDark]{background-color:var(--tui-error-bg-night);color:var(--tui-text-01-night)}:host[data-tui-host-status=error][data-mode=onDark]._hoverable:active,:host[data-tui-host-status=error][data-mode=onDark]._hoverable:hover{background-color:var(--tui-error-bg-night-hover)}:host[data-tui-host-status=success]{background-color:var(--tui-success-bg);color:var(--tui-text-01)}:host[data-tui-host-status=success]:before{content:'';color:var(--tui-success-fill)}:host[data-tui-host-status=success]._hoverable:active,:host[data-tui-host-status=success]._hoverable:hover{background-color:var(--tui-success-bg-hover)}:host[data-tui-host-status=success][data-mode=onDark]{background-color:var(--tui-success-bg-night);color:var(--tui-text-01-night)}:host[data-tui-host-status=success][data-mode=onDark]._hoverable:active,:host[data-tui-host-status=success][data-mode=onDark]._hoverable:hover{background-color:var(--tui-success-bg-night-hover)}:host[data-tui-host-status=warning]{background-color:var(--tui-warning-bg);color:var(--tui-text-01)}:host[data-tui-host-status=warning]:before{content:'';color:var(--tui-warning-fill)}:host[data-tui-host-status=warning]._hoverable:active,:host[data-tui-host-status=warning]._hoverable:hover{background-color:var(--tui-warning-bg-hover)}:host[data-tui-host-status=warning][data-mode=onDark]{background-color:var(--tui-warning-bg-night);color:var(--tui-text-01-night)}:host[data-tui-host-status=warning][data-mode=onDark]._hoverable:active,:host[data-tui-host-status=warning][data-mode=onDark]._hoverable:hover{background-color:var(--tui-warning-bg-night-hover)}:host[data-tui-host-status=default]{background-color:var(--tui-base-06)}:host[data-tui-host-status=default]:not([data-mode])._hoverable:hover{background-color:var(--tui-base-07)}:host[data-tui-host-status=default]:not([data-mode])._hoverable:active{background-color:var(--tui-base-08)}:host[data-tui-host-status=default][data-mode=onDark]{background-color:var(--tui-clear-inverse)}:host[data-tui-host-status=default][data-mode=onDark]._hoverable:hover{background-color:var(--tui-clear-inverse-hover)}:host[data-tui-host-status=default][data-mode=onDark]._hoverable:active{background-color:var(--tui-clear-inverse-active)}:host[data-tui-host-status=default][data-mode=onDark]:focus:after{border:2px solid var(--tui-base-01)}:host[data-tui-host-status=default][data-mode=onLight]{background-color:var(--tui-clear);color:var(--tui-text-01)}:host[data-tui-host-status=default][data-mode=onLight]._hoverable:hover{background-color:var(--tui-clear-hover)}:host[data-tui-host-status=default][data-mode=onLight]._hoverable:active{background-color:var(--tui-clear-active)}:host._hoverable{cursor:pointer}:host[data-tui-host-padding='m']{padding:0 8px}:host[data-tui-host-padding='m'][data-tui-host-size='s']{padding:0 6px}:host[data-tui-host-padding='m'][data-tui-host-size='l']{padding:0 10px}:host[data-tui-host-padding='l']{padding:0 12px}:host[data-tui-host-padding='l'][data-tui-host-size='s']{padding:0 10px}:host[data-tui-host-size='s']{font:var(--tui-font-text-xs);height:20px;min-width:20px}:host[data-tui-host-size='m']{height:var(--tui-height-xs);line-height:var(--tui-height-xs);min-width:var(--tui-height-xs)}:host[data-tui-host-size='l']{height:var(--tui-height-s);line-height:var(--tui-height-s);min-width:var(--tui-height-s)}:host:before{display:block;background:currentColor;margin:0 6px 0 -2px;width:6px;height:6px;border-radius:100%}:host[data-tui-host-size='s'] :host:before{width:4px;height:4px}:host[data-tui-host-size='l'] :host:before{margin:0 8px 0 0;width:8px;height:8px}"]
        }),
        __param(0, Inject(TUI_MODE))
    ], TuiBadgeComponent);
    return TuiBadgeComponent;
}());

var TuiBadgeModule = /** @class */ (function () {
    function TuiBadgeModule() {
    }
    TuiBadgeModule = __decorate([
        NgModule({
            imports: [CommonModule],
            declarations: [TuiBadgeComponent],
            exports: [TuiBadgeComponent],
        })
    ], TuiBadgeModule);
    return TuiBadgeModule;
}());

/**
 * Generated bundle index. Do not edit.
 */

export { TuiBadgeComponent, TuiBadgeModule };
//# sourceMappingURL=taiga-ui-kit-components-badge.js.map