UNPKG

ng-zorro-antd

Version:

An enterprise-class UI components based on Ant Design and Angular

2 lines 5.74 kB
!function(e,n){"object"==typeof exports&&"undefined"!=typeof module?n(exports,require("@angular/core"),require("@angular/cdk/platform"),require("rxjs"),require("rxjs/operators"),require("ng-zorro-antd/core"),require("@angular/common"),require("ng-zorro-antd/icon")):"function"==typeof define&&define.amd?define("ng-zorro-antd/timeline",["exports","@angular/core","@angular/cdk/platform","rxjs","rxjs/operators","ng-zorro-antd/core","@angular/common","ng-zorro-antd/icon"],n):n(((e=e||self)["ng-zorro-antd"]=e["ng-zorro-antd"]||{},e["ng-zorro-antd"].timeline={}),e.ng.core,e.ng.cdk.platform,e.rxjs,e.rxjs.operators,e["ng-zorro-antd"].core,e.ng.common,e["ng-zorro-antd"].icon)}(this,function(e,n,t,i,r,o,a,s){"use strict";var l=function(){function e(e,n){this.renderer=e,this.cdr=n,this.nzColor="blue",this.isLast=!1}return e.prototype.ngOnInit=function(){this.tryUpdateCustomColor()},e.prototype.ngOnChanges=function(e){e.nzColor&&this.tryUpdateCustomColor()},e.prototype.detectChanges=function(){this.cdr.detectChanges()},e.prototype.tryUpdateCustomColor=function(){var e=this.liTemplate.nativeElement.querySelector(".ant-timeline-item-head");-1===["blue","red","green","gray"].indexOf(this.nzColor)?this.renderer.setStyle(e,"border-color",this.nzColor):this.renderer.removeStyle(e,"border-color")},e.decorators=[{type:n.Component,args:[{changeDetection:n.ChangeDetectionStrategy.OnPush,encapsulation:n.ViewEncapsulation.None,preserveWhitespaces:!1,selector:"nz-timeline-item, [nz-timeline-item]",exportAs:"nzTimelineItem",template:'<li\n class="ant-timeline-item"\n [class.ant-timeline-item-right]="position === \'right\'"\n [class.ant-timeline-item-left]="position === \'left\'"\n [class.ant-timeline-item-last]="isLast"\n #liTemplate>\n <div class="ant-timeline-item-tail"></div>\n <div\n class="ant-timeline-item-head"\n [class.ant-timeline-item-head-red]="nzColor === \'red\'"\n [class.ant-timeline-item-head-blue]="nzColor === \'blue\'"\n [class.ant-timeline-item-head-green]="nzColor === \'green\'"\n [class.ant-timeline-item-head-gray]="nzColor === \'gray\'"\n [class.ant-timeline-item-head-custom]="!!nzDot">\n <ng-container *nzStringTemplateOutlet="nzDot">{{ nzDot }}</ng-container>\n </div>\n <div class="ant-timeline-item-content">\n <ng-content></ng-content>\n </div>\n</li>\n'}]}],e.ctorParameters=function(){return[{type:n.Renderer2},{type:n.ChangeDetectorRef}]},e.propDecorators={liTemplate:[{type:n.ViewChild,args:["liTemplate",{static:!0}]}],nzColor:[{type:n.Input}],nzDot:[{type:n.Input}]},e}();var d=function(){function e(e,n){this.cdr=e,this.platform=n,this.nzReverse=!1,this.isPendingBoolean=!1,this.destroy$=new i.Subject}return e.prototype.ngOnChanges=function(e){var n=e.nzMode,t=e.nzReverse,i=e.nzPending;n&&(n.previousValue!==n.currentValue||n.isFirstChange())&&this.updateChildren(),t&&t.previousValue!==t.currentValue&&!t.isFirstChange()&&this.reverseChildTimelineDots(),i&&(this.isPendingBoolean=!0===i.currentValue)},e.prototype.ngAfterContentInit=function(){var e=this;this.updateChildren(),this.listOfTimeLine&&this.listOfTimeLine.changes.pipe(r.takeUntil(this.destroy$)).subscribe(function(){e.updateChildren()})},e.prototype.ngOnDestroy=function(){this.destroy$.next(),this.destroy$.complete()},e.prototype.updateChildren=function(){var e=this;if(this.listOfTimeLine&&this.listOfTimeLine.length){var n=this.listOfTimeLine.length;this.listOfTimeLine.toArray().forEach(function(t,i){t.isLast=e.nzReverse?0===i:i===n-1,t.position="left"!==e.nzMode&&e.nzMode?"right"===e.nzMode?"right":"alternate"===e.nzMode&&i%2==0?"left":"right":void 0,t.detectChanges()}),this.cdr.markForCheck()}},e.prototype.reverseChildTimelineDots=function(){this.platform.isBrowser&&(o.reverseChildNodes(this.timeline.nativeElement),this.updateChildren())},e.decorators=[{type:n.Component,args:[{changeDetection:n.ChangeDetectionStrategy.OnPush,encapsulation:n.ViewEncapsulation.None,preserveWhitespaces:!1,selector:"nz-timeline",exportAs:"nzTimeline",template:'<ul\n class="ant-timeline"\n [class.ant-timeline-right]="nzMode === \'right\'"\n [class.ant-timeline-alternate]="nzMode === \'alternate\'"\n [class.ant-timeline-pending]="!!nzPending"\n [class.ant-timeline-reverse]="nzReverse"\n #timeline>\n \x3c!-- User inserted timeline dots. --\x3e\n <ng-content></ng-content>\n \x3c!-- Pending dot. --\x3e\n <li *ngIf="nzPending" class="ant-timeline-item ant-timeline-item-pending">\n <div class="ant-timeline-item-tail"></div>\n <div class="ant-timeline-item-head ant-timeline-item-head-custom ant-timeline-item-head-blue">\n <ng-container *nzStringTemplateOutlet="nzPendingDot">\n {{ nzPendingDot }}<i *ngIf="!nzPendingDot" nz-icon nzType="loading"></i>\n </ng-container>\n </div>\n <div class="ant-timeline-item-content">\n <ng-container *nzStringTemplateOutlet="nzPending">\n {{ isPendingBoolean ? \'\' : nzPending }}\n </ng-container>\n </div>\n </li>\n</ul>\n'}]}],e.ctorParameters=function(){return[{type:n.ChangeDetectorRef},{type:t.Platform}]},e.propDecorators={timeline:[{type:n.ViewChild,args:["timeline",{static:!1}]}],listOfTimeLine:[{type:n.ContentChildren,args:[l]}],_pendingContent:[{type:n.ContentChild,args:["pending",{static:!1}]}],nzMode:[{type:n.Input}],nzPending:[{type:n.Input}],nzPendingDot:[{type:n.Input}],nzReverse:[{type:n.Input}]},e}();var c=function(){function e(){}return e.decorators=[{type:n.NgModule,args:[{declarations:[l,d],exports:[l,d],imports:[a.CommonModule,t.PlatformModule,s.NzIconModule,o.NzAddOnModule]}]}],e}();e.NzTimelineComponent=d,e.NzTimelineItemComponent=l,e.NzTimelineModule=c,Object.defineProperty(e,"__esModule",{value:!0})}); //# sourceMappingURL=ng-zorro-antd-timeline.umd.min.js.map