UNPKG

ng-zorro-antd

Version:

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

2 lines 7.6 kB
!function(t,e){"object"==typeof exports&&"undefined"!=typeof module?e(exports,require("@angular/cdk/platform"),require("@angular/core"),require("@angular/common"),require("rxjs"),require("rxjs/operators"),require("ng-zorro-antd/core"),require("ng-zorro-antd/affix")):"function"==typeof define&&define.amd?define("ng-zorro-antd/anchor",["exports","@angular/cdk/platform","@angular/core","@angular/common","rxjs","rxjs/operators","ng-zorro-antd/core","ng-zorro-antd/affix"],e):e(((t=t||self)["ng-zorro-antd"]=t["ng-zorro-antd"]||{},t["ng-zorro-antd"].anchor={}),t.ng.cdk.platform,t.ng.core,t.ng.common,t.rxjs,t.rxjs.operators,t["ng-zorro-antd"].core,t["ng-zorro-antd"].affix)}(this,function(t,e,n,o,r,i,s,a){"use strict";function c(t,e,n,o){var r,i=arguments.length,s=i<3?e:null===o?o=Object.getOwnPropertyDescriptor(e,n):o;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)s=Reflect.decorate(t,e,n,o);else for(var a=t.length-1;a>=0;a--)(r=t[a])&&(s=(i<3?r(s):i>3?r(e,n,s):r(e,n))||s);return i>3&&s&&Object.defineProperty(e,n,s),s}function l(t,e){if("object"==typeof Reflect&&"function"==typeof Reflect.metadata)return Reflect.metadata(t,e)}var p=/#([^#]+)$/,f=function(){function t(t,e,o,r,i){this.nzConfigService=t,this.scrollSrv=e,this.doc=o,this.cdr=r,this.platform=i,this.nzAffix=!0,this.nzClick=new n.EventEmitter,this.nzScroll=new n.EventEmitter,this.visible=!1,this.wrapperStyle={"max-height":"100vh"},this.links=[],this.animating=!1,this.target=null,this.scroll$=null,this.destroyed=!1}return Object.defineProperty(t.prototype,"nzOffsetTop",{get:function(){return this._offsetTop},set:function(t){this._offsetTop=s.toNumber(t,0),this.wrapperStyle={"max-height":"calc(100vh - "+this._offsetTop+"px)"}},enumerable:!0,configurable:!0}),Object.defineProperty(t.prototype,"nzTarget",{set:function(t){this.target="string"==typeof t?this.doc.querySelector(t):t,this.registerScrollEvent()},enumerable:!0,configurable:!0}),t.prototype.registerLink=function(t){this.links.push(t)},t.prototype.unregisterLink=function(t){this.links.splice(this.links.indexOf(t),1)},t.prototype.getTarget=function(){return this.target||window},t.prototype.ngAfterViewInit=function(){this.registerScrollEvent()},t.prototype.ngOnDestroy=function(){this.destroyed=!0,this.removeListen()},t.prototype.registerScrollEvent=function(){var t=this;this.platform.isBrowser&&(this.removeListen(),this.scroll$=r.fromEvent(this.getTarget(),"scroll").pipe(i.throttleTime(50),i.distinctUntilChanged()).subscribe(function(){return t.handleScroll()}),setTimeout(function(){return t.handleScroll()}))},t.prototype.removeListen=function(){this.scroll$&&this.scroll$.unsubscribe()},t.prototype.getOffsetTop=function(t){if(!t||!t.getClientRects().length)return 0;var e=t.getBoundingClientRect();return e.width||e.height?this.getTarget()===window?e.top-t.ownerDocument.documentElement.clientTop:e.top-this.getTarget().getBoundingClientRect().top:e.top},t.prototype.handleScroll=function(){var t=this;if("undefined"!=typeof document&&!this.destroyed&&!this.animating){var e=[],n=(this.nzOffsetTop||0)+this.nzBounds;if(this.links.forEach(function(o){var r=p.exec(o.nzHref.toString());if(r){var i=t.doc.getElementById(r[1]);if(i){var s=t.getOffsetTop(i);s<n&&e.push({top:s,comp:o})}}}),this.visible=!!e.length,this.visible){var o=e.reduce(function(t,e){return e.top>t.top?e:t});this.handleActive(o.comp)}else this.clearActive(),this.cdr.detectChanges()}},t.prototype.clearActive=function(){this.links.forEach(function(t){t.active=!1,t.markForCheck()})},t.prototype.handleActive=function(t){this.clearActive(),t.active=!0,t.markForCheck();var e=t.elementRef.nativeElement.querySelector(".ant-anchor-link-title");this.ink.nativeElement.style.top=e.offsetTop+e.clientHeight/2-4.5+"px",this.visible=!0,this.cdr.detectChanges(),this.nzScroll.emit(t)},t.prototype.handleScrollTo=function(t){var e=this,n=this.doc.querySelector(t.nzHref);if(n){this.animating=!0;var o=this.scrollSrv.getScroll(this.getTarget())+this.getOffsetTop(n)-(this.nzOffsetTop||0);this.scrollSrv.scrollTo(this.getTarget(),o,void 0,function(){e.animating=!1,e.handleActive(t)}),this.nzClick.emit(t.nzHref)}},t.decorators=[{type:n.Component,args:[{selector:"nz-anchor",exportAs:"nzAnchor",preserveWhitespaces:!1,template:'<nz-affix *ngIf="nzAffix;else content" [nzOffsetTop]="nzOffsetTop">\n <ng-template [ngTemplateOutlet]="content"></ng-template>\n</nz-affix>\n<ng-template #content>\n <div class="ant-anchor-wrapper" [ngStyle]="wrapperStyle">\n <div class="ant-anchor" [ngClass]="{\'fixed\': !nzAffix && !nzShowInkInFixed}">\n <div class="ant-anchor-ink">\n <div class="ant-anchor-ink-ball" [class.visible]="visible" #ink></div>\n </div>\n <ng-content></ng-content>\n </div>\n </div>\n</ng-template>',encapsulation:n.ViewEncapsulation.None,changeDetection:n.ChangeDetectionStrategy.OnPush}]}],t.ctorParameters=function(){return[{type:s.NzConfigService},{type:s.NzScrollService},{type:void 0,decorators:[{type:n.Inject,args:[o.DOCUMENT]}]},{type:n.ChangeDetectorRef},{type:e.Platform}]},t.propDecorators={ink:[{type:n.ViewChild,args:["ink",{static:!1}]}],nzAffix:[{type:n.Input}],nzShowInkInFixed:[{type:n.Input}],nzBounds:[{type:n.Input}],nzOffsetTop:[{type:n.Input}],nzTarget:[{type:n.Input}],nzClick:[{type:n.Output}],nzScroll:[{type:n.Output}]},c([s.InputBoolean(),l("design:type",Object)],t.prototype,"nzAffix",void 0),c([s.WithConfig(!1),s.InputBoolean(),l("design:type",Boolean)],t.prototype,"nzShowInkInFixed",void 0),c([s.WithConfig(5),s.InputNumber(),l("design:type",Number)],t.prototype,"nzBounds",void 0),c([s.WithConfig(),l("design:type",Number),l("design:paramtypes",[Number])],t.prototype,"nzOffsetTop",null),t}();var h=function(){function t(t,e,n,o,r){this.elementRef=t,this.anchorComp=e,this.cdr=n,this.platform=o,this.nzHref="#",this.titleStr="",this.active=!1,r.addClass(t.nativeElement,"ant-anchor-link")}return Object.defineProperty(t.prototype,"nzTitle",{set:function(t){t instanceof n.TemplateRef?(this.titleStr=null,this.titleTpl=t):this.titleStr=t},enumerable:!0,configurable:!0}),t.prototype.ngOnInit=function(){this.anchorComp.registerLink(this)},t.prototype.goToClick=function(t){t.preventDefault(),t.stopPropagation(),this.platform.isBrowser&&this.anchorComp.handleScrollTo(this)},t.prototype.markForCheck=function(){this.cdr.markForCheck()},t.prototype.ngOnDestroy=function(){this.anchorComp.unregisterLink(this)},t.decorators=[{type:n.Component,args:[{selector:"nz-link",exportAs:"nzLink",preserveWhitespaces:!1,template:'<a (click)="goToClick($event)" href="{{nzHref}}" class="ant-anchor-link-title" title="{{titleStr}}">\n <span *ngIf="titleStr; else (titleTpl || nzTemplate)">{{ titleStr }}</span>\n</a>\n<ng-content></ng-content>',host:{"[class.ant-anchor-link-active]":"active"},encapsulation:n.ViewEncapsulation.None,changeDetection:n.ChangeDetectionStrategy.OnPush,styles:["\n nz-link {\n display: block;\n }\n "]}]}],t.ctorParameters=function(){return[{type:n.ElementRef},{type:f},{type:n.ChangeDetectorRef},{type:e.Platform},{type:n.Renderer2}]},t.propDecorators={nzHref:[{type:n.Input}],nzTitle:[{type:n.Input}],nzTemplate:[{type:n.ContentChild,args:["nzTemplate",{static:!1}]}]},t}();var u=function(){function t(){}return t.decorators=[{type:n.NgModule,args:[{declarations:[f,h],exports:[f,h],imports:[o.CommonModule,a.NzAffixModule,e.PlatformModule],providers:[s.SCROLL_SERVICE_PROVIDER]}]}],t}();t.NzAnchorComponent=f,t.NzAnchorLinkComponent=h,t.NzAnchorModule=u,Object.defineProperty(t,"__esModule",{value:!0})}); //# sourceMappingURL=ng-zorro-antd-anchor.umd.min.js.map