ng-zorro-antd-mobile
Version:
An enterprise-class mobile UI components based on Ant Design and Angular
157 lines (152 loc) • 6.81 kB
JavaScript
import * as i0 from '@angular/core';
import { Component, Input, HostBinding, NgModule } from '@angular/core';
import * as i1 from '@angular/common';
import { CommonModule } from '@angular/common';
import { FormsModule } from '@angular/forms';
class BadgeComponent {
set size(v) {
this._size = v;
this.setCls();
}
get text() {
return this._text;
}
set text(v) {
this._text = v;
this.setCls();
}
set corner(v) {
this._corner = v;
this.setCls();
}
get dot() {
return this._dot;
}
set dot(v) {
this._dot = v;
if (this._dot) {
this._text = '';
}
this.setCls();
}
set overflowCount(v) {
this._overflowCount = v;
}
set hot(v) {
this._hot = v;
this.setCls();
}
set setStyle(v) {
this.style = v;
}
set className(v) {
this._setClass = v;
const clsArr = this._setClass.split(' ');
clsArr.forEach(cls => {
this.render.addClass(this._ref.nativeElement, cls);
});
}
constructor(_ref, render) {
this._ref = _ref;
this.render = render;
this.prefixCls = 'am-badge';
this.scrollNumberCls = {};
this.style = {};
this._size = 'small';
this._dot = false;
this._hot = false;
this._corner = false;
this._children = false;
this._overflowCount = 99;
this.clsBadge = true;
this.clsBadgeWrp = !this._children;
this.clsBadgeCornerWrp = this._corner;
this.clsBadgeHot = !!this._hot;
this.clsBadgeCornerWrpLg = this._corner && this._size === 'large';
}
setCls() {
this.scrollNumberCls = {
[`${this.prefixCls}-dot`]: this._dot,
[`${this.prefixCls}-dot-large`]: this._dot && this._size === 'large',
[`${this.prefixCls}-text`]: !this._dot && !this._corner,
[`${this.prefixCls}-corner`]: this._corner,
[`${this.prefixCls}-corner-large`]: this._corner && this._size === 'large'
};
this.clsBadgeWrp = !this._children;
this.clsBadgeCornerWrp = this._corner;
this.clsBadgeHot = !!this._hot;
this.clsBadgeCornerWrpLg = this._corner && this._size === 'large';
}
ngOnChanges() {
if (typeof this._text === 'number' && this._text > this._overflowCount) {
this._text = this._overflowCount + '+';
}
}
ngOnInit() {
this.setCls();
}
ngAfterViewInit() {
setTimeout(() => {
if (this._ref.nativeElement.children.length > 1 ||
(this._ref.nativeElement.children.length === 1 && !this.dot && !this.text)) {
this._children = true;
this.setCls();
}
}, 10);
}
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: BadgeComponent, deps: [{ token: i0.ElementRef }, { token: i0.Renderer2 }], target: i0.ɵɵFactoryTarget.Component }); }
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.0.8", type: BadgeComponent, selector: "Badge, nzm-badge", inputs: { size: "size", text: "text", corner: "corner", dot: "dot", overflowCount: "overflowCount", hot: "hot", setStyle: "setStyle", className: "className" }, host: { properties: { "class.am-badge": "this.clsBadge", "class.am-badge-not-a-wrapper": "this.clsBadgeWrp", "class.am-badge-corner-wrapper": "this.clsBadgeCornerWrp", "class.am-badge-hot": "this.clsBadgeHot", "class.am-badge-corner-wrapper-large": "this.clsBadgeCornerWrpLg" } }, usesOnChanges: true, ngImport: i0, template: "<ng-content></ng-content>\n<sup *ngIf=\"dot || text\" [ngClass]=\"scrollNumberCls\" [ngStyle]=\"style\">\n <span>{{ text }}</span>\n</sup>\n", dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: BadgeComponent, decorators: [{
type: Component,
args: [{ selector: 'Badge, nzm-badge', template: "<ng-content></ng-content>\n<sup *ngIf=\"dot || text\" [ngClass]=\"scrollNumberCls\" [ngStyle]=\"style\">\n <span>{{ text }}</span>\n</sup>\n" }]
}], ctorParameters: () => [{ type: i0.ElementRef }, { type: i0.Renderer2 }], propDecorators: { size: [{
type: Input
}], text: [{
type: Input
}], corner: [{
type: Input
}], dot: [{
type: Input
}], overflowCount: [{
type: Input
}], hot: [{
type: Input
}], setStyle: [{
type: Input
}], className: [{
type: Input
}], clsBadge: [{
type: HostBinding,
args: ['class.am-badge']
}], clsBadgeWrp: [{
type: HostBinding,
args: ['class.am-badge-not-a-wrapper']
}], clsBadgeCornerWrp: [{
type: HostBinding,
args: ['class.am-badge-corner-wrapper']
}], clsBadgeHot: [{
type: HostBinding,
args: ['class.am-badge-hot']
}], clsBadgeCornerWrpLg: [{
type: HostBinding,
args: ['class.am-badge-corner-wrapper-large']
}] } });
class BadgeModule {
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: BadgeModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "17.0.8", ngImport: i0, type: BadgeModule, declarations: [BadgeComponent], imports: [CommonModule, FormsModule], exports: [BadgeComponent] }); }
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: BadgeModule, imports: [CommonModule, FormsModule] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: BadgeModule, decorators: [{
type: NgModule,
args: [{
exports: [BadgeComponent],
declarations: [BadgeComponent],
imports: [CommonModule, FormsModule]
}]
}] });
/**
* Generated bundle index. Do not edit.
*/
export { BadgeComponent, BadgeModule };
//# sourceMappingURL=ng-zorro-antd-mobile-badge.mjs.map