UNPKG

ng-zorro-antd

Version:

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

2 lines 9.13 kB
!function(t,e){"object"==typeof exports&&"undefined"!=typeof module?e(exports,require("@angular/core"),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/steps",["exports","@angular/core","rxjs","rxjs/operators","ng-zorro-antd/core","@angular/common","ng-zorro-antd/icon"],e):e(((t=t||self)["ng-zorro-antd"]=t["ng-zorro-antd"]||{},t["ng-zorro-antd"].steps={}),t.ng.core,t.rxjs,t.rxjs.operators,t["ng-zorro-antd"].core,t.ng.common,t["ng-zorro-antd"].icon)}(this,function(t,e,n,s,o,i,r){"use strict";function a(t,e){if("object"==typeof Reflect&&"function"==typeof Reflect.metadata)return Reflect.metadata(t,e)}function c(t,e){var n="function"==typeof Symbol&&t[Symbol.iterator];if(!n)return t;var s,o,i=n.call(t),r=[];try{for(;(void 0===e||e-- >0)&&!(s=i.next()).done;)r.push(s.value)}catch(t){o={error:t}}finally{try{s&&!s.done&&(n=i.return)&&n.call(i)}finally{if(o)throw o.error}}return r}var p=function(){function t(t,e,s){this.cdr=t,this.nzDisabled=!1,this.isCustomStatus=!1,this._status="wait",this.oldAPIIcon=!0,this.isIconString=!0,this.direction="horizontal",this.index=0,this.last=!1,this.outStatus="process",this.showProcessDot=!1,this.clickable=!1,this.click$=new n.Subject,this._currentIndex=0,e.addClass(s.nativeElement,"ant-steps-item")}return Object.defineProperty(t.prototype,"nzStatus",{get:function(){return this._status},set:function(t){this._status=t,this.isCustomStatus=!0},enumerable:!0,configurable:!0}),Object.defineProperty(t.prototype,"nzIcon",{get:function(){return this._icon},set:function(t){t instanceof e.TemplateRef?this.isIconString=!1:(this.isIconString=!0,this.oldAPIIcon="string"==typeof t&&t.indexOf("anticon")>-1),this._icon=t},enumerable:!0,configurable:!0}),Object.defineProperty(t.prototype,"currentIndex",{get:function(){return this._currentIndex},set:function(t){this._currentIndex=t,this.isCustomStatus||(this._status=t>this.index?"finish":t===this.index?this.outStatus||"":"wait")},enumerable:!0,configurable:!0}),t.prototype.onClick=function(){this.clickable&&this.currentIndex!==this.index&&!this.nzDisabled&&this.click$.next(this.index)},t.prototype.markForCheck=function(){this.cdr.markForCheck()},t.prototype.ngOnDestroy=function(){this.click$.complete()},t.decorators=[{type:e.Component,args:[{changeDetection:e.ChangeDetectionStrategy.OnPush,encapsulation:e.ViewEncapsulation.None,selector:"nz-step",exportAs:"nzStep",preserveWhitespaces:!1,template:'<div\n class="ant-steps-item-container"\n [attr.role]="(clickable && !nzDisabled) ? \'button\' : null"\n [tabindex]="(clickable && !nzDisabled) ? 0 : null"\n (click)="onClick()">\n <div class="ant-steps-item-tail" *ngIf="last !== true"></div>\n <div class="ant-steps-item-icon">\n <ng-template [ngIf]="!showProcessDot">\n <span class="ant-steps-icon" *ngIf="nzStatus === \'finish\' && !nzIcon"><i nz-icon nzType="check"></i></span>\n <span class="ant-steps-icon" *ngIf="nzStatus === \'error\'"><i nz-icon nzType="close"></i></span>\n <span\n class="ant-steps-icon"\n *ngIf="(nzStatus === \'process\' || nzStatus === \'wait\') && !nzIcon">{{ index + 1 }}</span>\n <span class="ant-steps-icon" *ngIf="nzIcon">\n <ng-container *ngIf="isIconString; else iconTemplate">\n <i nz-icon [nzType]="!oldAPIIcon && nzIcon" [ngClass]="oldAPIIcon && nzIcon"></i>\n </ng-container>\n <ng-template #iconTemplate>\n <ng-template [ngTemplateOutlet]="nzIcon"></ng-template>\n </ng-template>\n </span>\n </ng-template>\n <ng-template [ngIf]="showProcessDot">\n <span class="ant-steps-icon">\n <ng-template #processDotTemplate>\n <span class="ant-steps-icon-dot"></span>\n </ng-template>\n <ng-template\n [ngTemplateOutlet]="customProcessTemplate||processDotTemplate"\n [ngTemplateOutletContext]="{ $implicit: processDotTemplate, status:nzStatus, index:index }">\n </ng-template>\n </span>\n </ng-template>\n </div>\n <div class="ant-steps-item-content">\n <div class="ant-steps-item-title">\n <ng-container *nzStringTemplateOutlet="nzTitle">{{ nzTitle }}</ng-container>\n <div *ngIf="nzSubtitle" class="ant-steps-item-subtitle">\n <ng-container *nzStringTemplateOutlet="nzSubtitle">{{ nzSubtitle }}</ng-container>\n </div>\n </div>\n <div class="ant-steps-item-description">\n <ng-container *nzStringTemplateOutlet="nzDescription">{{ nzDescription }}</ng-container>\n </div>\n </div>\n</div>\n',host:{"[class.ant-steps-item-wait]":'nzStatus === "wait"',"[class.ant-steps-item-process]":'nzStatus === "process"',"[class.ant-steps-item-finish]":'nzStatus === "finish"',"[class.ant-steps-item-error]":'nzStatus === "error"',"[class.ant-steps-item-active]":"currentIndex === index","[class.ant-steps-item-disabled]":"nzDisabled","[class.ant-steps-item-custom]":"!!nzIcon","[class.ant-steps-next-error]":'(outStatus === "error") && (currentIndex === index + 1)'}}]}],t.ctorParameters=function(){return[{type:e.ChangeDetectorRef},{type:e.Renderer2},{type:e.ElementRef}]},t.propDecorators={processDotTemplate:[{type:e.ViewChild,args:["processDotTemplate",{static:!1}]}],nzTitle:[{type:e.Input}],nzSubtitle:[{type:e.Input}],nzDescription:[{type:e.Input}],nzDisabled:[{type:e.Input}],nzStatus:[{type:e.Input}],nzIcon:[{type:e.Input}]},function(t,e,n,s){var o,i=arguments.length,r=i<3?e:null===s?s=Object.getOwnPropertyDescriptor(e,n):s;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)r=Reflect.decorate(t,e,n,s);else for(var a=t.length-1;a>=0;a--)(o=t[a])&&(r=(i<3?o(r):i>3?o(e,n,r):o(e,n))||r);i>3&&r&&Object.defineProperty(e,n,r)}([o.InputBoolean(),a("design:type",Object)],t.prototype,"nzDisabled",void 0),t}();var l=function(){function t(){this.nzCurrent=0,this.nzDirection="horizontal",this.nzLabelPlacement="horizontal",this.nzType="default",this.nzSize="default",this.nzStartIndex=0,this.nzStatus="process",this.nzIndexChange=new e.EventEmitter,this.destroy$=new n.Subject,this.showProcessDot=!1}return Object.defineProperty(t.prototype,"nzProgressDot",{set:function(t){t instanceof e.TemplateRef?(this.showProcessDot=!0,this.customProcessDotTemplate=t):this.showProcessDot=o.toBoolean(t),this.updateChildrenSteps()},enumerable:!0,configurable:!0}),t.prototype.ngOnChanges=function(t){(t.nzStartIndex||t.nzDirection||t.nzStatus||t.nzCurrent)&&this.updateChildrenSteps(),(t.nzDirection||t.nzProgressDot||t.nzLabelPlacement||t.nzSize)&&this.setClassMap()},t.prototype.ngOnInit=function(){this.setClassMap(),this.updateChildrenSteps()},t.prototype.ngOnDestroy=function(){this.destroy$.next(),this.destroy$.complete(),this.indexChangeSubscription&&this.indexChangeSubscription.unsubscribe()},t.prototype.ngAfterContentInit=function(){var t=this;this.steps&&this.steps.changes.pipe(s.startWith(null),s.takeUntil(this.destroy$)).subscribe(function(){t.updateChildrenSteps()})},t.prototype.updateChildrenSteps=function(){var t=this;if(this.steps){var e=this.steps.length;this.steps.toArray().forEach(function(n,s){Promise.resolve().then(function(){n.outStatus=t.nzStatus,n.showProcessDot=t.showProcessDot,t.customProcessDotTemplate&&(n.customProcessTemplate=t.customProcessDotTemplate),n.clickable=t.nzIndexChange.observers.length>0,n.direction=t.nzDirection,n.index=s+t.nzStartIndex,n.currentIndex=t.nzCurrent,n.last=e===s+1,n.markForCheck()})}),this.indexChangeSubscription&&this.indexChangeSubscription.unsubscribe(),this.indexChangeSubscription=n.merge.apply(void 0,function(){for(var t=[],e=0;e<arguments.length;e++)t=t.concat(c(arguments[e]));return t}(this.steps.map(function(t){return t.click$}))).subscribe(function(e){return t.nzIndexChange.emit(e)})}},t.prototype.setClassMap=function(){var t;this.classMap=((t={})["ant-steps-"+this.nzDirection]=!0,t["ant-steps-label-horizontal"]="horizontal"===this.nzDirection,t["ant-steps-label-vertical"]=(this.showProcessDot||"vertical"===this.nzLabelPlacement)&&"horizontal"===this.nzDirection,t["ant-steps-dot"]=this.showProcessDot,t["ant-steps-small"]="small"===this.nzSize,t["ant-steps-navigation"]="navigation"===this.nzType,t)},t.decorators=[{type:e.Component,args:[{changeDetection:e.ChangeDetectionStrategy.OnPush,encapsulation:e.ViewEncapsulation.None,preserveWhitespaces:!1,selector:"nz-steps",exportAs:"nzSteps",template:'<div class="ant-steps" [ngClass]="classMap">\n <ng-content></ng-content>\n</div>'}]}],t.propDecorators={steps:[{type:e.ContentChildren,args:[p]}],nzCurrent:[{type:e.Input}],nzDirection:[{type:e.Input}],nzLabelPlacement:[{type:e.Input}],nzType:[{type:e.Input}],nzSize:[{type:e.Input}],nzStartIndex:[{type:e.Input}],nzStatus:[{type:e.Input}],nzProgressDot:[{type:e.Input}],nzIndexChange:[{type:e.Output}]},t}();var u=function(){function t(){}return t.decorators=[{type:e.NgModule,args:[{imports:[i.CommonModule,r.NzIconModule,o.NzAddOnModule],exports:[l,p],declarations:[l,p]}]}],t}();t.NzStepComponent=p,t.NzStepsComponent=l,t.NzStepsModule=u,Object.defineProperty(t,"__esModule",{value:!0})}); //# sourceMappingURL=ng-zorro-antd-steps.umd.min.js.map