ng-zorro-antd
Version:
An enterprise-class UI components based on Ant Design and Angular
118 lines • 12.3 kB
JavaScript
/**
* Use of this source code is governed by an MIT-style license that can be
* found in the LICENSE file at https://github.com/NG-ZORRO/ng-zorro-antd/blob/master/LICENSE
*/
import { NgIf } from '@angular/common';
import { ChangeDetectionStrategy, Component, Input, ViewChild, ViewEncapsulation } from '@angular/core';
import { NzOutletModule } from 'ng-zorro-antd/core/outlet';
import { TimelineTimeDefaultColors } from './typings';
import * as i0 from "@angular/core";
import * as i1 from "./timeline.service";
import * as i2 from "ng-zorro-antd/core/outlet";
function isDefaultColor(color) {
return TimelineTimeDefaultColors.findIndex(i => i === color) !== -1;
}
export class NzTimelineItemComponent {
constructor(cdr, timelineService) {
this.cdr = cdr;
this.timelineService = timelineService;
this.nzColor = 'blue';
this.isLast = false;
this.borderColor = null;
}
ngOnChanges(changes) {
this.timelineService.markForCheck();
if (changes.nzColor) {
this.updateCustomColor();
}
}
detectChanges() {
this.cdr.detectChanges();
}
updateCustomColor() {
this.borderColor = isDefaultColor(this.nzColor) ? null : this.nzColor;
}
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.4", ngImport: i0, type: NzTimelineItemComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: i1.TimelineService }], target: i0.ɵɵFactoryTarget.Component }); }
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.4", type: NzTimelineItemComponent, isStandalone: true, selector: "nz-timeline-item, [nz-timeline-item]", inputs: { nzPosition: "nzPosition", nzColor: "nzColor", nzDot: "nzDot", nzLabel: "nzLabel" }, viewQueries: [{ propertyName: "template", first: true, predicate: ["template"], descendants: true }], exportAs: ["nzTimelineItem"], usesOnChanges: true, ngImport: i0, template: `
<ng-template #template>
<li
class="ant-timeline-item"
[class.ant-timeline-item-right]="(nzPosition || position) === 'right'"
[class.ant-timeline-item-left]="(nzPosition || position) === 'left'"
[class.ant-timeline-item-last]="isLast"
>
<div *ngIf="nzLabel" class="ant-timeline-item-label">
<ng-container *nzStringTemplateOutlet="nzLabel">{{ nzLabel }}</ng-container>
</div>
<div class="ant-timeline-item-tail"></div>
<div
class="ant-timeline-item-head"
[class.ant-timeline-item-head-red]="nzColor === 'red'"
[class.ant-timeline-item-head-blue]="nzColor === 'blue'"
[class.ant-timeline-item-head-green]="nzColor === 'green'"
[class.ant-timeline-item-head-gray]="nzColor === 'gray'"
[class.ant-timeline-item-head-custom]="!!nzDot"
[style.border-color]="borderColor"
>
<ng-container *nzStringTemplateOutlet="nzDot">{{ nzDot }}</ng-container>
</div>
<div class="ant-timeline-item-content">
<ng-content></ng-content>
</div>
</li>
</ng-template>
`, isInline: true, dependencies: [{ kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: NzOutletModule }, { kind: "directive", type: i2.NzStringTemplateOutletDirective, selector: "[nzStringTemplateOutlet]", inputs: ["nzStringTemplateOutletContext", "nzStringTemplateOutlet"], exportAs: ["nzStringTemplateOutlet"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.4", ngImport: i0, type: NzTimelineItemComponent, decorators: [{
type: Component,
args: [{
changeDetection: ChangeDetectionStrategy.OnPush,
encapsulation: ViewEncapsulation.None,
preserveWhitespaces: false,
selector: 'nz-timeline-item, [nz-timeline-item]',
exportAs: 'nzTimelineItem',
template: `
<ng-template #template>
<li
class="ant-timeline-item"
[class.ant-timeline-item-right]="(nzPosition || position) === 'right'"
[class.ant-timeline-item-left]="(nzPosition || position) === 'left'"
[class.ant-timeline-item-last]="isLast"
>
<div *ngIf="nzLabel" class="ant-timeline-item-label">
<ng-container *nzStringTemplateOutlet="nzLabel">{{ nzLabel }}</ng-container>
</div>
<div class="ant-timeline-item-tail"></div>
<div
class="ant-timeline-item-head"
[class.ant-timeline-item-head-red]="nzColor === 'red'"
[class.ant-timeline-item-head-blue]="nzColor === 'blue'"
[class.ant-timeline-item-head-green]="nzColor === 'green'"
[class.ant-timeline-item-head-gray]="nzColor === 'gray'"
[class.ant-timeline-item-head-custom]="!!nzDot"
[style.border-color]="borderColor"
>
<ng-container *nzStringTemplateOutlet="nzDot">{{ nzDot }}</ng-container>
</div>
<div class="ant-timeline-item-content">
<ng-content></ng-content>
</div>
</li>
</ng-template>
`,
imports: [NgIf, NzOutletModule],
standalone: true
}]
}], ctorParameters: () => [{ type: i0.ChangeDetectorRef }, { type: i1.TimelineService }], propDecorators: { template: [{
type: ViewChild,
args: ['template', { static: false }]
}], nzPosition: [{
type: Input
}], nzColor: [{
type: Input
}], nzDot: [{
type: Input
}], nzLabel: [{
type: Input
}] } });
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoidGltZWxpbmUtaXRlbS5jb21wb25lbnQuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi9jb21wb25lbnRzL3RpbWVsaW5lL3RpbWVsaW5lLWl0ZW0uY29tcG9uZW50LnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBOzs7R0FHRztBQUVILE9BQU8sRUFBRSxJQUFJLEVBQUUsTUFBTSxpQkFBaUIsQ0FBQztBQUN2QyxPQUFPLEVBQ0wsdUJBQXVCLEVBRXZCLFNBQVMsRUFDVCxLQUFLLEVBSUwsU0FBUyxFQUNULGlCQUFpQixFQUNsQixNQUFNLGVBQWUsQ0FBQztBQUV2QixPQUFPLEVBQUUsY0FBYyxFQUFFLE1BQU0sMkJBQTJCLENBQUM7QUFHM0QsT0FBTyxFQUEyQyx5QkFBeUIsRUFBRSxNQUFNLFdBQVcsQ0FBQzs7OztBQUUvRixTQUFTLGNBQWMsQ0FBQyxLQUFjO0lBQ3BDLE9BQU8seUJBQXlCLENBQUMsU0FBUyxDQUFDLENBQUMsQ0FBQyxFQUFFLENBQUMsQ0FBQyxLQUFLLEtBQUssQ0FBQyxLQUFLLENBQUMsQ0FBQyxDQUFDO0FBQ3RFLENBQUM7QUF3Q0QsTUFBTSxPQUFPLHVCQUF1QjtJQVlsQyxZQUNVLEdBQXNCLEVBQ3RCLGVBQWdDO1FBRGhDLFFBQUcsR0FBSCxHQUFHLENBQW1CO1FBQ3RCLG9CQUFlLEdBQWYsZUFBZSxDQUFpQjtRQVZqQyxZQUFPLEdBQXdCLE1BQU0sQ0FBQztRQUkvQyxXQUFNLEdBQUcsS0FBSyxDQUFDO1FBQ2YsZ0JBQVcsR0FBa0IsSUFBSSxDQUFDO0lBTS9CLENBQUM7SUFFSixXQUFXLENBQUMsT0FBc0I7UUFDaEMsSUFBSSxDQUFDLGVBQWUsQ0FBQyxZQUFZLEVBQUUsQ0FBQztRQUNwQyxJQUFJLE9BQU8sQ0FBQyxPQUFPLEVBQUUsQ0FBQztZQUNwQixJQUFJLENBQUMsaUJBQWlCLEVBQUUsQ0FBQztRQUMzQixDQUFDO0lBQ0gsQ0FBQztJQUVELGFBQWE7UUFDWCxJQUFJLENBQUMsR0FBRyxDQUFDLGFBQWEsRUFBRSxDQUFDO0lBQzNCLENBQUM7SUFFTyxpQkFBaUI7UUFDdkIsSUFBSSxDQUFDLFdBQVcsR0FBRyxjQUFjLENBQUMsSUFBSSxDQUFDLE9BQU8sQ0FBQyxDQUFDLENBQUMsQ0FBQyxJQUFJLENBQUMsQ0FBQyxDQUFDLElBQUksQ0FBQyxPQUFPLENBQUM7SUFDeEUsQ0FBQzs4R0E5QlUsdUJBQXVCO2tHQUF2Qix1QkFBdUIsdVZBaEN4Qjs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7OztHQTRCVCw0REFDUyxJQUFJLDRGQUFFLGNBQWM7OzJGQUduQix1QkFBdUI7a0JBdENuQyxTQUFTO21CQUFDO29CQUNULGVBQWUsRUFBRSx1QkFBdUIsQ0FBQyxNQUFNO29CQUMvQyxhQUFhLEVBQUUsaUJBQWlCLENBQUMsSUFBSTtvQkFDckMsbUJBQW1CLEVBQUUsS0FBSztvQkFDMUIsUUFBUSxFQUFFLHNDQUFzQztvQkFDaEQsUUFBUSxFQUFFLGdCQUFnQjtvQkFDMUIsUUFBUSxFQUFFOzs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7O0dBNEJUO29CQUNELE9BQU8sRUFBRSxDQUFDLElBQUksRUFBRSxjQUFjLENBQUM7b0JBQy9CLFVBQVUsRUFBRSxJQUFJO2lCQUNqQjtvSEFFMkMsUUFBUTtzQkFBakQsU0FBUzt1QkFBQyxVQUFVLEVBQUUsRUFBRSxNQUFNLEVBQUUsS0FBSyxFQUFFO2dCQUUvQixVQUFVO3NCQUFsQixLQUFLO2dCQUNHLE9BQU87c0JBQWYsS0FBSztnQkFDRyxLQUFLO3NCQUFiLEtBQUs7Z0JBQ0csT0FBTztzQkFBZixLQUFLIiwic291cmNlc0NvbnRlbnQiOlsiLyoqXG4gKiBVc2Ugb2YgdGhpcyBzb3VyY2UgY29kZSBpcyBnb3Zlcm5lZCBieSBhbiBNSVQtc3R5bGUgbGljZW5zZSB0aGF0IGNhbiBiZVxuICogZm91bmQgaW4gdGhlIExJQ0VOU0UgZmlsZSBhdCBodHRwczovL2dpdGh1Yi5jb20vTkctWk9SUk8vbmctem9ycm8tYW50ZC9ibG9iL21hc3Rlci9MSUNFTlNFXG4gKi9cblxuaW1wb3J0IHsgTmdJZiB9IGZyb20gJ0Bhbmd1bGFyL2NvbW1vbic7XG5pbXBvcnQge1xuICBDaGFuZ2VEZXRlY3Rpb25TdHJhdGVneSxcbiAgQ2hhbmdlRGV0ZWN0b3JSZWYsXG4gIENvbXBvbmVudCxcbiAgSW5wdXQsXG4gIE9uQ2hhbmdlcyxcbiAgU2ltcGxlQ2hhbmdlcyxcbiAgVGVtcGxhdGVSZWYsXG4gIFZpZXdDaGlsZCxcbiAgVmlld0VuY2Fwc3VsYXRpb25cbn0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XG5cbmltcG9ydCB7IE56T3V0bGV0TW9kdWxlIH0gZnJvbSAnbmctem9ycm8tYW50ZC9jb3JlL291dGxldCc7XG5cbmltcG9ydCB7IFRpbWVsaW5lU2VydmljZSB9IGZyb20gJy4vdGltZWxpbmUuc2VydmljZSc7XG5pbXBvcnQgeyBOelRpbWVsaW5lSXRlbUNvbG9yLCBOelRpbWVsaW5lUG9zaXRpb24sIFRpbWVsaW5lVGltZURlZmF1bHRDb2xvcnMgfSBmcm9tICcuL3R5cGluZ3MnO1xuXG5mdW5jdGlvbiBpc0RlZmF1bHRDb2xvcihjb2xvcj86IHN0cmluZyk6IGJvb2xlYW4ge1xuICByZXR1cm4gVGltZWxpbmVUaW1lRGVmYXVsdENvbG9ycy5maW5kSW5kZXgoaSA9PiBpID09PSBjb2xvcikgIT09IC0xO1xufVxuXG5AQ29tcG9uZW50KHtcbiAgY2hhbmdlRGV0ZWN0aW9uOiBDaGFuZ2VEZXRlY3Rpb25TdHJhdGVneS5PblB1c2gsXG4gIGVuY2Fwc3VsYXRpb246IFZpZXdFbmNhcHN1bGF0aW9uLk5vbmUsXG4gIHByZXNlcnZlV2hpdGVzcGFjZXM6IGZhbHNlLFxuICBzZWxlY3RvcjogJ256LXRpbWVsaW5lLWl0ZW0sIFtuei10aW1lbGluZS1pdGVtXScsXG4gIGV4cG9ydEFzOiAnbnpUaW1lbGluZUl0ZW0nLFxuICB0ZW1wbGF0ZTogYFxuICAgIDxuZy10ZW1wbGF0ZSAjdGVtcGxhdGU+XG4gICAgICA8bGlcbiAgICAgICAgY2xhc3M9XCJhbnQtdGltZWxpbmUtaXRlbVwiXG4gICAgICAgIFtjbGFzcy5hbnQtdGltZWxpbmUtaXRlbS1yaWdodF09XCIobnpQb3NpdGlvbiB8fCBwb3NpdGlvbikgPT09ICdyaWdodCdcIlxuICAgICAgICBbY2xhc3MuYW50LXRpbWVsaW5lLWl0ZW0tbGVmdF09XCIobnpQb3NpdGlvbiB8fCBwb3NpdGlvbikgPT09ICdsZWZ0J1wiXG4gICAgICAgIFtjbGFzcy5hbnQtdGltZWxpbmUtaXRlbS1sYXN0XT1cImlzTGFzdFwiXG4gICAgICA+XG4gICAgICAgIDxkaXYgKm5nSWY9XCJuekxhYmVsXCIgY2xhc3M9XCJhbnQtdGltZWxpbmUtaXRlbS1sYWJlbFwiPlxuICAgICAgICAgIDxuZy1jb250YWluZXIgKm56U3RyaW5nVGVtcGxhdGVPdXRsZXQ9XCJuekxhYmVsXCI+e3sgbnpMYWJlbCB9fTwvbmctY29udGFpbmVyPlxuICAgICAgICA8L2Rpdj5cbiAgICAgICAgPGRpdiBjbGFzcz1cImFudC10aW1lbGluZS1pdGVtLXRhaWxcIj48L2Rpdj5cbiAgICAgICAgPGRpdlxuICAgICAgICAgIGNsYXNzPVwiYW50LXRpbWVsaW5lLWl0ZW0taGVhZFwiXG4gICAgICAgICAgW2NsYXNzLmFudC10aW1lbGluZS1pdGVtLWhlYWQtcmVkXT1cIm56Q29sb3IgPT09ICdyZWQnXCJcbiAgICAgICAgICBbY2xhc3MuYW50LXRpbWVsaW5lLWl0ZW0taGVhZC1ibHVlXT1cIm56Q29sb3IgPT09ICdibHVlJ1wiXG4gICAgICAgICAgW2NsYXNzLmFudC10aW1lbGluZS1pdGVtLWhlYWQtZ3JlZW5dPVwibnpDb2xvciA9PT0gJ2dyZWVuJ1wiXG4gICAgICAgICAgW2NsYXNzLmFudC10aW1lbGluZS1pdGVtLWhlYWQtZ3JheV09XCJuekNvbG9yID09PSAnZ3JheSdcIlxuICAgICAgICAgIFtjbGFzcy5hbnQtdGltZWxpbmUtaXRlbS1oZWFkLWN1c3RvbV09XCIhIW56RG90XCJcbiAgICAgICAgICBbc3R5bGUuYm9yZGVyLWNvbG9yXT1cImJvcmRlckNvbG9yXCJcbiAgICAgICAgPlxuICAgICAgICAgIDxuZy1jb250YWluZXIgKm56U3RyaW5nVGVtcGxhdGVPdXRsZXQ9XCJuekRvdFwiPnt7IG56RG90IH19PC9uZy1jb250YWluZXI+XG4gICAgICAgIDwvZGl2PlxuICAgICAgICA8ZGl2IGNsYXNzPVwiYW50LXRpbWVsaW5lLWl0ZW0tY29udGVudFwiPlxuICAgICAgICAgIDxuZy1jb250ZW50PjwvbmctY29udGVudD5cbiAgICAgICAgPC9kaXY+XG4gICAgICA8L2xpPlxuICAgIDwvbmctdGVtcGxhdGU+XG4gIGAsXG4gIGltcG9ydHM6IFtOZ0lmLCBOek91dGxldE1vZHVsZV0sXG4gIHN0YW5kYWxvbmU6IHRydWVcbn0pXG5leHBvcnQgY2xhc3MgTnpUaW1lbGluZUl0ZW1Db21wb25lbnQgaW1wbGVtZW50cyBPbkNoYW5nZXMge1xuICBAVmlld0NoaWxkKCd0ZW1wbGF0ZScsIHsgc3RhdGljOiBmYWxzZSB9KSB0ZW1wbGF0ZSE6IFRlbXBsYXRlUmVmPHZvaWQ+O1xuXG4gIEBJbnB1dCgpIG56UG9zaXRpb24/OiBOelRpbWVsaW5lUG9zaXRpb247XG4gIEBJbnB1dCgpIG56Q29sb3I6IE56VGltZWxpbmVJdGVtQ29sb3IgPSAnYmx1ZSc7XG4gIEBJbnB1dCgpIG56RG90Pzogc3RyaW5nIHwgVGVtcGxhdGVSZWY8dm9pZD47XG4gIEBJbnB1dCgpIG56TGFiZWw/OiBzdHJpbmcgfCBUZW1wbGF0ZVJlZjx2b2lkPjtcblxuICBpc0xhc3QgPSBmYWxzZTtcbiAgYm9yZGVyQ29sb3I6IHN0cmluZyB8IG51bGwgPSBudWxsO1xuICBwb3NpdGlvbj86IE56VGltZWxpbmVQb3NpdGlvbjtcblxuICBjb25zdHJ1Y3RvcihcbiAgICBwcml2YXRlIGNkcjogQ2hhbmdlRGV0ZWN0b3JSZWYsXG4gICAgcHJpdmF0ZSB0aW1lbGluZVNlcnZpY2U6IFRpbWVsaW5lU2VydmljZVxuICApIHt9XG5cbiAgbmdPbkNoYW5nZXMoY2hhbmdlczogU2ltcGxlQ2hhbmdlcyk6IHZvaWQge1xuICAgIHRoaXMudGltZWxpbmVTZXJ2aWNlLm1hcmtGb3JDaGVjaygpO1xuICAgIGlmIChjaGFuZ2VzLm56Q29sb3IpIHtcbiAgICAgIHRoaXMudXBkYXRlQ3VzdG9tQ29sb3IoKTtcbiAgICB9XG4gIH1cblxuICBkZXRlY3RDaGFuZ2VzKCk6IHZvaWQge1xuICAgIHRoaXMuY2RyLmRldGVjdENoYW5nZXMoKTtcbiAgfVxuXG4gIHByaXZhdGUgdXBkYXRlQ3VzdG9tQ29sb3IoKTogdm9pZCB7XG4gICAgdGhpcy5ib3JkZXJDb2xvciA9IGlzRGVmYXVsdENvbG9yKHRoaXMubnpDb2xvcikgPyBudWxsIDogdGhpcy5uekNvbG9yO1xuICB9XG59XG4iXX0=