theme-lib
Version:
This is a simple example Angular Library published to npm.
187 lines • 13.5 kB
JavaScript
/**
* @fileoverview added by tsickle
* @suppress {checkTypes,extraRequire,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
/*
* @license
* Copyright Akveo. All Rights Reserved.
* Licensed under the MIT License. See License.txt in the project root for license information.
*/
import { Component, Input } from '@angular/core';
import { NbLayoutDirectionService } from '../../services/direction.service';
/*
* Badge is a simple labeling component.
* It can be used to add additional information to any content or highlight unread items.
*
* Element is absolute positioned, so parent should be
* [positioned element](https://developer.mozilla.org/en-US/docs/Web/CSS/position).
* It means parent `position` should be set to anything except `static`, e.g. `relative`,
* `absolute`, `fixed`, or `sticky`.
*
* ### Installation
*
* Import `NbBadgeModule` to your feature module.
* ```ts
* @NgModule({
* imports: [
* // ...
* NbBadgeModule,
* ],
* })
* export class PageModule { }
* ```
* ### Usage
*
* Badge with default position and status(color):
*
* ```html
* <nb-badge text="badgeText"></nb-badge>
* ```
*
* For example, badge can be placed into nb-card header:
* @stacked-example(Showcase, badge/badge-showcase.component)
*
* Badge located on the bottom right with warning status:
*
* ```html
* <nb-badge text="badgeText" status="warning" position="bottom right">
* </nb-badge>
* ```
*
* @styles
*
* badge-fg-text:
* badge-primary-bg-color:
* badge-success-bg-color:
* badge-info-bg-color:
* badge-warning-bg-color:
* badge-danger-bg-color:
*/
var NbBadgeComponent = /** @class */ (function () {
function NbBadgeComponent(layoutDirectionService) {
this.layoutDirectionService = layoutDirectionService;
this.colorClass = NbBadgeComponent.STATUS_PRIMARY;
/*
* Text to display
* @type string
*/
this.text = '';
}
Object.defineProperty(NbBadgeComponent.prototype, "status", {
/*
* Badge status (adds specific styles):
* 'primary', 'info', 'success', 'warning', 'danger'
* @param {string} val
* @type string
*/
set: /*
* Badge status (adds specific styles):
* 'primary', 'info', 'success', 'warning', 'danger'
* @param {string} val
* @type string
*/
/**
* @param {?} value
* @return {?}
*/
function (value) {
if (value) {
this.colorClass = value;
}
},
enumerable: true,
configurable: true
});
Object.defineProperty(NbBadgeComponent.prototype, "positionClass", {
get: /**
* @return {?}
*/
function () {
if (!this.position) {
return NbBadgeComponent.TOP_RIGHT;
}
/** @type {?} */
var isLtr = this.layoutDirectionService.isLtr();
/** @type {?} */
var startValue = isLtr ? 'left' : 'right';
/** @type {?} */
var endValue = isLtr ? 'right' : 'left';
return this.position
.replace(/\bstart\b/, startValue)
.replace(/\bend\b/, endValue);
},
enumerable: true,
configurable: true
});
NbBadgeComponent.TOP_LEFT = 'top left';
NbBadgeComponent.TOP_RIGHT = 'top right';
NbBadgeComponent.BOTTOM_LEFT = 'bottom left';
NbBadgeComponent.BOTTOM_RIGHT = 'bottom right';
NbBadgeComponent.TOP_START = 'top start';
NbBadgeComponent.TOP_END = 'top end';
NbBadgeComponent.BOTTOM_START = 'bottom start';
NbBadgeComponent.BOTTOM_END = 'bottom end';
NbBadgeComponent.STATUS_PRIMARY = 'primary';
NbBadgeComponent.STATUS_INFO = 'info';
NbBadgeComponent.STATUS_SUCCESS = 'success';
NbBadgeComponent.STATUS_WARNING = 'warning';
NbBadgeComponent.STATUS_DANGER = 'danger';
NbBadgeComponent.decorators = [
{ type: Component, args: [{
selector: 'nb-badge',
template: "\n <span class=\"nb-badge {{positionClass}} nb-badge-{{colorClass}}\">{{text}}</span>\n ",
styles: [":host .nb-badge{position:absolute;padding:.25em .4em;font-size:75%;font-weight:700;line-height:1;text-align:center;white-space:nowrap;vertical-align:baseline;border-radius:.25rem}:host .nb-badge.top{top:0}:host .nb-badge.right{right:0}:host .nb-badge.bottom{bottom:0}:host .nb-badge.left{left:0}"]
}] }
];
/** @nocollapse */
NbBadgeComponent.ctorParameters = function () { return [
{ type: NbLayoutDirectionService }
]; };
NbBadgeComponent.propDecorators = {
text: [{ type: Input }],
position: [{ type: Input }],
status: [{ type: Input }]
};
return NbBadgeComponent;
}());
export { NbBadgeComponent };
if (false) {
/** @type {?} */
NbBadgeComponent.TOP_LEFT;
/** @type {?} */
NbBadgeComponent.TOP_RIGHT;
/** @type {?} */
NbBadgeComponent.BOTTOM_LEFT;
/** @type {?} */
NbBadgeComponent.BOTTOM_RIGHT;
/** @type {?} */
NbBadgeComponent.TOP_START;
/** @type {?} */
NbBadgeComponent.TOP_END;
/** @type {?} */
NbBadgeComponent.BOTTOM_START;
/** @type {?} */
NbBadgeComponent.BOTTOM_END;
/** @type {?} */
NbBadgeComponent.STATUS_PRIMARY;
/** @type {?} */
NbBadgeComponent.STATUS_INFO;
/** @type {?} */
NbBadgeComponent.STATUS_SUCCESS;
/** @type {?} */
NbBadgeComponent.STATUS_WARNING;
/** @type {?} */
NbBadgeComponent.STATUS_DANGER;
/** @type {?} */
NbBadgeComponent.prototype.colorClass;
/** @type {?} */
NbBadgeComponent.prototype.text;
/** @type {?} */
NbBadgeComponent.prototype.position;
/**
* @type {?}
* @private
*/
NbBadgeComponent.prototype.layoutDirectionService;
}
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiYmFkZ2UuY29tcG9uZW50LmpzIiwic291cmNlUm9vdCI6Im5nOi8vdGhlbWUtbGliLyIsInNvdXJjZXMiOlsibGliL2NvbXBvbmVudHMvYmFkZ2UvYmFkZ2UuY29tcG9uZW50LnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiI7Ozs7Ozs7OztBQU1BLE9BQU8sRUFBRSxTQUFTLEVBQUUsS0FBSyxFQUFFLE1BQU0sZUFBZSxDQUFDO0FBQ2pELE9BQU8sRUFBRSx3QkFBd0IsRUFBRSxNQUFNLGtDQUFrQyxDQUFDOzs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7O0FBa0Q1RTtJQW1FRSwwQkFBb0Isc0JBQWdEO1FBQWhELDJCQUFzQixHQUF0QixzQkFBc0IsQ0FBMEI7UUEzQ3BFLGVBQVUsR0FBVyxnQkFBZ0IsQ0FBQyxjQUFjLENBQUM7Ozs7O1FBTTVDLFNBQUksR0FBVyxFQUFFLENBQUM7SUFxQzRDLENBQUM7SUFuQnhFLHNCQUFhLG9DQUFNO1FBTm5COzs7OztXQUtHOzs7Ozs7Ozs7OztRQUNILFVBQW9CLEtBQUs7WUFDdkIsSUFBSSxLQUFLLEVBQUU7Z0JBQ1QsSUFBSSxDQUFDLFVBQVUsR0FBRyxLQUFLLENBQUM7YUFDekI7UUFDSCxDQUFDOzs7T0FBQTtJQUVELHNCQUFJLDJDQUFhOzs7O1FBQWpCO1lBQ0UsSUFBSSxDQUFDLElBQUksQ0FBQyxRQUFRLEVBQUU7Z0JBQ2xCLE9BQU8sZ0JBQWdCLENBQUMsU0FBUyxDQUFDO2FBQ25DOztnQkFFSyxLQUFLLEdBQUcsSUFBSSxDQUFDLHNCQUFzQixDQUFDLEtBQUssRUFBRTs7Z0JBQzNDLFVBQVUsR0FBRyxLQUFLLENBQUMsQ0FBQyxDQUFDLE1BQU0sQ0FBQyxDQUFDLENBQUMsT0FBTzs7Z0JBQ3JDLFFBQVEsR0FBRyxLQUFLLENBQUMsQ0FBQyxDQUFDLE9BQU8sQ0FBQyxDQUFDLENBQUMsTUFBTTtZQUN6QyxPQUFPLElBQUksQ0FBQyxRQUFRO2lCQUNqQixPQUFPLENBQUMsV0FBVyxFQUFFLFVBQVUsQ0FBQztpQkFDaEMsT0FBTyxDQUFDLFNBQVMsRUFBRSxRQUFRLENBQUMsQ0FBQztRQUNsQyxDQUFDOzs7T0FBQTtJQXpEZSx5QkFBUSxHQUFHLFVBQVUsQ0FBQztJQUN0QiwwQkFBUyxHQUFHLFdBQVcsQ0FBQztJQUN4Qiw0QkFBVyxHQUFHLGFBQWEsQ0FBQztJQUM1Qiw2QkFBWSxHQUFHLGNBQWMsQ0FBQztJQUU5QiwwQkFBUyxHQUFHLFdBQVcsQ0FBQztJQUN4Qix3QkFBTyxHQUFHLFNBQVMsQ0FBQztJQUNwQiw2QkFBWSxHQUFHLGNBQWMsQ0FBQztJQUM5QiwyQkFBVSxHQUFHLFlBQVksQ0FBQztJQUUxQiwrQkFBYyxHQUFHLFNBQVMsQ0FBQztJQUMzQiw0QkFBVyxHQUFHLE1BQU0sQ0FBQztJQUNyQiwrQkFBYyxHQUFHLFNBQVMsQ0FBQztJQUMzQiwrQkFBYyxHQUFHLFNBQVMsQ0FBQztJQUMzQiw4QkFBYSxHQUFHLFFBQVEsQ0FBQzs7Z0JBdEIxQyxTQUFTLFNBQUM7b0JBQ1QsUUFBUSxFQUFFLFVBQVU7b0JBRXBCLFFBQVEsRUFBRSw4RkFFVDs7aUJBQ0Y7Ozs7Z0JBeERRLHdCQUF3Qjs7O3VCQWdGOUIsS0FBSzsyQkFVTCxLQUFLO3lCQVFMLEtBQUs7O0lBb0JSLHVCQUFDO0NBQUEsQUFwRUQsSUFvRUM7U0E3RFksZ0JBQWdCOzs7SUFDM0IsMEJBQXNDOztJQUN0QywyQkFBd0M7O0lBQ3hDLDZCQUE0Qzs7SUFDNUMsOEJBQThDOztJQUU5QywyQkFBd0M7O0lBQ3hDLHlCQUFvQzs7SUFDcEMsOEJBQThDOztJQUM5Qyw0QkFBMEM7O0lBRTFDLGdDQUEyQzs7SUFDM0MsNkJBQXFDOztJQUNyQyxnQ0FBMkM7O0lBQzNDLGdDQUEyQzs7SUFDM0MsK0JBQXlDOztJQUV6QyxzQ0FBcUQ7O0lBTXJELGdDQUEyQjs7SUFVM0Isb0NBQTBCOzs7OztJQTJCZCxrREFBd0QiLCJzb3VyY2VzQ29udGVudCI6WyIvKlxyXG4gKiBAbGljZW5zZVxyXG4gKiBDb3B5cmlnaHQgQWt2ZW8uIEFsbCBSaWdodHMgUmVzZXJ2ZWQuXHJcbiAqIExpY2Vuc2VkIHVuZGVyIHRoZSBNSVQgTGljZW5zZS4gU2VlIExpY2Vuc2UudHh0IGluIHRoZSBwcm9qZWN0IHJvb3QgZm9yIGxpY2Vuc2UgaW5mb3JtYXRpb24uXHJcbiAqL1xyXG5cclxuaW1wb3J0IHsgQ29tcG9uZW50LCBJbnB1dCB9IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xyXG5pbXBvcnQgeyBOYkxheW91dERpcmVjdGlvblNlcnZpY2UgfSBmcm9tICcuLi8uLi9zZXJ2aWNlcy9kaXJlY3Rpb24uc2VydmljZSc7XHJcblxyXG4vKlxyXG4gKiBCYWRnZSBpcyBhIHNpbXBsZSBsYWJlbGluZyBjb21wb25lbnQuXHJcbiAqIEl0IGNhbiBiZSB1c2VkIHRvIGFkZCBhZGRpdGlvbmFsIGluZm9ybWF0aW9uIHRvIGFueSBjb250ZW50IG9yIGhpZ2hsaWdodCB1bnJlYWQgaXRlbXMuXHJcbiAqXHJcbiAqIEVsZW1lbnQgaXMgYWJzb2x1dGUgcG9zaXRpb25lZCwgc28gcGFyZW50IHNob3VsZCBiZVxyXG4gKiBbcG9zaXRpb25lZCBlbGVtZW50XShodHRwczovL2RldmVsb3Blci5tb3ppbGxhLm9yZy9lbi1VUy9kb2NzL1dlYi9DU1MvcG9zaXRpb24pLlxyXG4gKiBJdCBtZWFucyBwYXJlbnQgYHBvc2l0aW9uYCBzaG91bGQgYmUgc2V0IHRvIGFueXRoaW5nIGV4Y2VwdCBgc3RhdGljYCwgZS5nLiBgcmVsYXRpdmVgLFxyXG4gKiBgYWJzb2x1dGVgLCBgZml4ZWRgLCBvciBgc3RpY2t5YC5cclxuICpcclxuICogIyMjIEluc3RhbGxhdGlvblxyXG4gKlxyXG4gKiBJbXBvcnQgYE5iQmFkZ2VNb2R1bGVgIHRvIHlvdXIgZmVhdHVyZSBtb2R1bGUuXHJcbiAqIGBgYHRzXHJcbiAqIEBOZ01vZHVsZSh7XHJcbiAqICAgaW1wb3J0czogW1xyXG4gKiAgIFx0Ly8gLi4uXHJcbiAqICAgICBOYkJhZGdlTW9kdWxlLFxyXG4gKiAgIF0sXHJcbiAqIH0pXHJcbiAqIGV4cG9ydCBjbGFzcyBQYWdlTW9kdWxlIHsgfVxyXG4gKiBgYGBcclxuICogIyMjIFVzYWdlXHJcbiAqXHJcbiAqIEJhZGdlIHdpdGggZGVmYXVsdCBwb3NpdGlvbiBhbmQgc3RhdHVzKGNvbG9yKTpcclxuICpcclxuICogYGBgaHRtbFxyXG4gKiA8bmItYmFkZ2UgdGV4dD1cImJhZGdlVGV4dFwiPjwvbmItYmFkZ2U+XHJcbiAqIGBgYFxyXG4gKlxyXG4gKiBGb3IgZXhhbXBsZSwgYmFkZ2UgY2FuIGJlIHBsYWNlZCBpbnRvIG5iLWNhcmQgaGVhZGVyOlxyXG4gKiBAc3RhY2tlZC1leGFtcGxlKFNob3djYXNlLCBiYWRnZS9iYWRnZS1zaG93Y2FzZS5jb21wb25lbnQpXHJcbiAqXHJcbiAqIEJhZGdlIGxvY2F0ZWQgb24gdGhlIGJvdHRvbSByaWdodCB3aXRoIHdhcm5pbmcgc3RhdHVzOlxyXG4gKlxyXG4gKiBgYGBodG1sXHJcbiAqIDxuYi1iYWRnZSB0ZXh0PVwiYmFkZ2VUZXh0XCIgc3RhdHVzPVwid2FybmluZ1wiIHBvc2l0aW9uPVwiYm90dG9tIHJpZ2h0XCI+XHJcbiAqIDwvbmItYmFkZ2U+XHJcbiAqIGBgYFxyXG4gKlxyXG4gKiBAc3R5bGVzXHJcbiAqXHJcbiAqIGJhZGdlLWZnLXRleHQ6XHJcbiAqIGJhZGdlLXByaW1hcnktYmctY29sb3I6XHJcbiAqIGJhZGdlLXN1Y2Nlc3MtYmctY29sb3I6XHJcbiAqIGJhZGdlLWluZm8tYmctY29sb3I6XHJcbiAqIGJhZGdlLXdhcm5pbmctYmctY29sb3I6XHJcbiAqIGJhZGdlLWRhbmdlci1iZy1jb2xvcjpcclxuICovXHJcbkBDb21wb25lbnQoe1xyXG4gIHNlbGVjdG9yOiAnbmItYmFkZ2UnLFxyXG4gIHN0eWxlVXJsczogWycuL2JhZGdlLmNvbXBvbmVudC5zY3NzJ10sXHJcbiAgdGVtcGxhdGU6IGBcclxuICAgIDxzcGFuIGNsYXNzPVwibmItYmFkZ2Uge3twb3NpdGlvbkNsYXNzfX0gbmItYmFkZ2Ute3tjb2xvckNsYXNzfX1cIj57e3RleHR9fTwvc3Bhbj5cclxuICBgLFxyXG59KVxyXG5leHBvcnQgY2xhc3MgTmJCYWRnZUNvbXBvbmVudCB7XHJcbiAgc3RhdGljIHJlYWRvbmx5IFRPUF9MRUZUID0gJ3RvcCBsZWZ0JztcclxuICBzdGF0aWMgcmVhZG9ubHkgVE9QX1JJR0hUID0gJ3RvcCByaWdodCc7XHJcbiAgc3RhdGljIHJlYWRvbmx5IEJPVFRPTV9MRUZUID0gJ2JvdHRvbSBsZWZ0JztcclxuICBzdGF0aWMgcmVhZG9ubHkgQk9UVE9NX1JJR0hUID0gJ2JvdHRvbSByaWdodCc7XHJcblxyXG4gIHN0YXRpYyByZWFkb25seSBUT1BfU1RBUlQgPSAndG9wIHN0YXJ0JztcclxuICBzdGF0aWMgcmVhZG9ubHkgVE9QX0VORCA9ICd0b3AgZW5kJztcclxuICBzdGF0aWMgcmVhZG9ubHkgQk9UVE9NX1NUQVJUID0gJ2JvdHRvbSBzdGFydCc7XHJcbiAgc3RhdGljIHJlYWRvbmx5IEJPVFRPTV9FTkQgPSAnYm90dG9tIGVuZCc7XHJcblxyXG4gIHN0YXRpYyByZWFkb25seSBTVEFUVVNfUFJJTUFSWSA9ICdwcmltYXJ5JztcclxuICBzdGF0aWMgcmVhZG9ubHkgU1RBVFVTX0lORk8gPSAnaW5mbyc7XHJcbiAgc3RhdGljIHJlYWRvbmx5IFNUQVRVU19TVUNDRVNTID0gJ3N1Y2Nlc3MnO1xyXG4gIHN0YXRpYyByZWFkb25seSBTVEFUVVNfV0FSTklORyA9ICd3YXJuaW5nJztcclxuICBzdGF0aWMgcmVhZG9ubHkgU1RBVFVTX0RBTkdFUiA9ICdkYW5nZXInO1xyXG5cclxuICBjb2xvckNsYXNzOiBzdHJpbmcgPSBOYkJhZGdlQ29tcG9uZW50LlNUQVRVU19QUklNQVJZO1xyXG5cclxuICAvKlxyXG4gICAqIFRleHQgdG8gZGlzcGxheVxyXG4gICAqIEB0eXBlIHN0cmluZ1xyXG4gICAqL1xyXG4gIEBJbnB1dCgpIHRleHQ6IHN0cmluZyA9ICcnO1xyXG5cclxuICAvKlxyXG4gICAqIEJhZGdlIHBvc2l0aW9uXHJcbiAgICpcclxuICAgKiBDYW4gYmUgc2V0IHRvIGFueSBjbGFzcyBvciB0byBvbmUgb2YgcHJlZGVmaW5lZCBwb3NpdGlvbnM6XHJcbiAgICogJ3RvcCBsZWZ0JywgJ3RvcCByaWdodCcsICdib3R0b20gbGVmdCcsICdib3R0b20gcmlnaHQnLFxyXG4gICAqICd0b3Agc3RhcnQnLCAndG9wIGVuZCcsICdib3R0b20gc3RhcnQnLCAnYm90dG9tIGVuZCdcclxuICAgKiBAdHlwZSBzdHJpbmdcclxuICAgKi9cclxuICBASW5wdXQoKSBwb3NpdGlvbjogc3RyaW5nO1xyXG5cclxuICAvKlxyXG4gICAqIEJhZGdlIHN0YXR1cyAoYWRkcyBzcGVjaWZpYyBzdHlsZXMpOlxyXG4gICAqICdwcmltYXJ5JywgJ2luZm8nLCAnc3VjY2VzcycsICd3YXJuaW5nJywgJ2RhbmdlcidcclxuICAgKiBAcGFyYW0ge3N0cmluZ30gdmFsXHJcbiAgICogQHR5cGUgc3RyaW5nXHJcbiAgICovXHJcbiAgQElucHV0KCkgc2V0IHN0YXR1cyh2YWx1ZSkge1xyXG4gICAgaWYgKHZhbHVlKSB7XHJcbiAgICAgIHRoaXMuY29sb3JDbGFzcyA9IHZhbHVlO1xyXG4gICAgfVxyXG4gIH1cclxuXHJcbiAgZ2V0IHBvc2l0aW9uQ2xhc3MoKSB7XHJcbiAgICBpZiAoIXRoaXMucG9zaXRpb24pIHtcclxuICAgICAgcmV0dXJuIE5iQmFkZ2VDb21wb25lbnQuVE9QX1JJR0hUO1xyXG4gICAgfVxyXG5cclxuICAgIGNvbnN0IGlzTHRyID0gdGhpcy5sYXlvdXREaXJlY3Rpb25TZXJ2aWNlLmlzTHRyKCk7XHJcbiAgICBjb25zdCBzdGFydFZhbHVlID0gaXNMdHIgPyAnbGVmdCcgOiAncmlnaHQnO1xyXG4gICAgY29uc3QgZW5kVmFsdWUgPSBpc0x0ciA/ICdyaWdodCcgOiAnbGVmdCc7XHJcbiAgICByZXR1cm4gdGhpcy5wb3NpdGlvblxyXG4gICAgICAucmVwbGFjZSgvXFxic3RhcnRcXGIvLCBzdGFydFZhbHVlKVxyXG4gICAgICAucmVwbGFjZSgvXFxiZW5kXFxiLywgZW5kVmFsdWUpO1xyXG4gIH1cclxuXHJcbiAgY29uc3RydWN0b3IocHJpdmF0ZSBsYXlvdXREaXJlY3Rpb25TZXJ2aWNlOiBOYkxheW91dERpcmVjdGlvblNlcnZpY2UpIHt9XHJcbn1cclxuIl19