UNPKG

ng-zorro-antd

Version:

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

2 lines 13 kB
!function(t,e){"object"==typeof exports&&"undefined"!=typeof module?e(exports,require("@angular/cdk/platform"),require("@angular/common"),require("@angular/core"),require("ng-zorro-antd/core"),require("ng-zorro-antd/i18n"),require("ng-zorro-antd/icon"),require("ng-zorro-antd/input"),require("ng-zorro-antd/tooltip"),require("rxjs"),require("rxjs/operators")):"function"==typeof define&&define.amd?define("ng-zorro-antd/typography",["exports","@angular/cdk/platform","@angular/common","@angular/core","ng-zorro-antd/core","ng-zorro-antd/i18n","ng-zorro-antd/icon","ng-zorro-antd/input","ng-zorro-antd/tooltip","rxjs","rxjs/operators"],e):e(((t=t||self)["ng-zorro-antd"]=t["ng-zorro-antd"]||{},t["ng-zorro-antd"].typography={}),t.ng.cdk.platform,t.ng.common,t.ng.core,t["ng-zorro-antd"].core,t["ng-zorro-antd"].i18n,t["ng-zorro-antd"].icon,t["ng-zorro-antd"].input,t["ng-zorro-antd"].tooltip,t.rxjs,t.rxjs.operators)}(this,function(t,e,n,i,o,s,r,p,a,c,l){"use strict";function d(t,e,n,i){var o,s=arguments.length,r=s<3?e:null===i?i=Object.getOwnPropertyDescriptor(e,n):i;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)r=Reflect.decorate(t,e,n,i);else for(var p=t.length-1;p>=0;p--)(o=t[p])&&(r=(s<3?o(r):s>3?o(e,n,r):o(e,n))||r);return s>3&&r&&Object.defineProperty(e,n,r),r}function h(t,e){if("object"==typeof Reflect&&"function"==typeof Reflect.metadata)return Reflect.metadata(t,e)}var u=function(){function t(t,e,n,o){this.host=t,this.cdr=e,this.copyToClipboard=n,this.i18n=o,this.copied=!1,this.locale={},this.nativeElement=this.host.nativeElement,this.destroy$=new c.Subject,this.textCopy=new i.EventEmitter}return t.prototype.ngOnInit=function(){var t=this;this.i18n.localeChange.pipe(l.takeUntil(this.destroy$)).subscribe(function(){t.locale=t.i18n.getLocaleData("Text"),t.cdr.markForCheck()})},t.prototype.ngOnDestroy=function(){clearTimeout(this.copyId)},t.prototype.onClick=function(){var t=this;if(!this.copied){this.copied=!0,this.cdr.detectChanges();var e=this.text;this.textCopy.emit(e),this.copyToClipboard.copy(e).then(function(){return t.onCopied()}).catch(function(){return t.onCopied()})}},t.prototype.onCopied=function(){var t=this;clearTimeout(this.copyId),this.copyId=setTimeout(function(){t.copied=!1,t.cdr.detectChanges()},3e3)},t.decorators=[{type:i.Component,args:[{selector:"nz-text-copy",exportAs:"nzTextCopy",template:'<button\n nz-tooltip\n nz-trans-button\n [nzTitle]="copied ? locale?.copied : locale?.copy"\n class="ant-typography-copy"\n [class.ant-typography-copy-success]="copied"\n (click)="onClick()">\n <i nz-icon [nzType]="copied ? \'check\' : \'copy\'"></i>\n</button>\n\n',changeDetection:i.ChangeDetectionStrategy.OnPush,encapsulation:i.ViewEncapsulation.None,preserveWhitespaces:!1}]}],t.ctorParameters=function(){return[{type:i.ElementRef},{type:i.ChangeDetectorRef},{type:o.NzCopyToClipboardService},{type:s.NzI18nService}]},t.propDecorators={text:[{type:i.Input}],textCopy:[{type:i.Output}]},t}();var y=function(){function t(t,e,n){this.host=t,this.cdr=e,this.i18n=n,this.editing=!1,this.locale={},this.destroy$=new c.Subject,this.startEditing=new i.EventEmitter,this.endEditing=new i.EventEmitter,this.nativeElement=this.host.nativeElement}return t.prototype.ngOnInit=function(){var t=this;this.i18n.localeChange.pipe(l.takeUntil(this.destroy$)).subscribe(function(){t.locale=t.i18n.getLocaleData("Text"),t.cdr.markForCheck()})},t.prototype.ngOnDestroy=function(){this.destroy$.next(),this.destroy$.complete()},t.prototype.onClick=function(){this.beforeText=this.text,this.currentText=this.beforeText,this.editing=!0,this.startEditing.emit(),this.focusAndSetValue()},t.prototype.confirm=function(){this.editing=!1,this.endEditing.emit(this.currentText)},t.prototype.onInput=function(t){var e=t.target;this.currentText=e.value},t.prototype.onEnter=function(t){t.stopPropagation(),t.preventDefault(),this.confirm()},t.prototype.onCancel=function(){this.currentText=this.beforeText,this.confirm()},t.prototype.focusAndSetValue=function(){var t=this;setTimeout(function(){t.textarea&&t.textarea.nativeElement&&(t.textarea.nativeElement.focus(),t.textarea.nativeElement.value=t.currentText,t.autosizeDirective.resizeToFitContent())})},t.decorators=[{type:i.Component,args:[{selector:"nz-text-edit",exportAs:"nzTextEdit",template:'<button\n *ngIf="!editing"\n [nzTitle]="locale?.edit"\n nz-tooltip\n nz-trans-button\n class="ant-typography-edit"\n (click)="onClick()">\n <i nz-icon nzType="edit"></i>\n</button>\n<ng-container *ngIf="editing">\n <textarea #textarea\n nz-input\n nzAutosize\n (input)="onInput($event)"\n (blur)="confirm()"\n (keydown.esc)="onCancel()"\n (keydown.enter)="onEnter($event)">\n </textarea>\n <button nz-trans-button class="ant-typography-edit-content-confirm" (click)="confirm()">\n <i nz-icon nzType="enter"></i>\n </button>\n</ng-container>\n',changeDetection:i.ChangeDetectionStrategy.OnPush,encapsulation:i.ViewEncapsulation.None,preserveWhitespaces:!1}]}],t.ctorParameters=function(){return[{type:i.ElementRef},{type:i.ChangeDetectorRef},{type:s.NzI18nService}]},t.propDecorators={text:[{type:i.Input}],startEditing:[{type:i.Output}],endEditing:[{type:i.Output}],textarea:[{type:i.ViewChild,args:["textarea",{static:!1}]}],autosizeDirective:[{type:i.ViewChild,args:[p.NzAutosizeDirective,{static:!1}]}]},t}();var g=function(){function t(t,e,n,o,s,r,p,a){this.nzConfigService=t,this.host=e,this.cdr=n,this.viewContainerRef=o,this.renderer=s,this.platform=r,this.i18n=p,this.nzDomEventService=a,this.nzCopyable=!1,this.nzEditable=!1,this.nzDisabled=!1,this.nzExpandable=!1,this.nzEllipsis=!1,this.nzContentChange=new i.EventEmitter,this.nzCopy=new i.EventEmitter,this.nzExpandChange=new i.EventEmitter,this.locale={},this.editing=!1,this.cssEllipsis=!1,this.isEllipsis=!1,this.expanded=!1,this.ellipsisStr="...",this.viewInit=!1,this.rfaId=-1,this.destroy$=new c.Subject,this.windowResizeSubscription=c.Subscription.EMPTY}return Object.defineProperty(t.prototype,"canCssEllipsis",{get:function(){return this.nzEllipsis&&this.cssEllipsis&&!this.expanded},enumerable:!0,configurable:!0}),Object.defineProperty(t.prototype,"copyText",{get:function(){return"string"==typeof this.nzCopyText?this.nzCopyText:this.nzContent},enumerable:!0,configurable:!0}),t.prototype.onTextCopy=function(t){this.nzCopy.emit(t)},t.prototype.onStartEditing=function(){this.editing=!0},t.prototype.onEndEditing=function(t){this.editing=!1,this.nzContentChange.emit(t),this.nzContent===t&&this.renderOnNextFrame()},t.prototype.onExpand=function(){this.expanded=!0,this.nzExpandChange.emit()},t.prototype.canUseCSSEllipsis=function(){return!(this.nzEditable||this.nzCopyable||this.nzExpandable)&&(1===this.nzEllipsisRows?o.isStyleSupport("textOverflow"):o.isStyleSupport("webkitLineClamp"))},t.prototype.renderOnNextFrame=function(){var t=this;o.cancelRequestAnimationFrame(this.rfaId),!this.viewInit||!this.nzEllipsis||this.nzEllipsisRows<0||this.expanded||!this.platform.isBrowser||(this.rfaId=o.reqAnimFrame(function(){t.syncEllipsis()}))},t.prototype.getOriginContentViewRef=function(){var t=this,e=this.viewContainerRef.createEmbeddedView(this.contentTemplate,{content:this.nzContent});return e.detectChanges(),{viewRef:e,removeView:function(){t.viewContainerRef.remove(t.viewContainerRef.indexOf(e))}}},t.prototype.syncEllipsis=function(){var t=this;if(!this.cssEllipsis){var e=this.getOriginContentViewRef(),n=e.viewRef,i=e.removeView,s=[this.textCopyRef,this.textEditRef,this.expandableBtn].filter(function(t){return t&&t.nativeElement}).map(function(t){return t.nativeElement}),r=o.measure(this.host.nativeElement,this.nzEllipsisRows,n.rootNodes,s,this.ellipsisStr),p=r.contentNodes,a=r.text,c=r.ellipsis;i(),this.ellipsisText=a,this.isEllipsis=c;for(var l=this.ellipsisContainer.nativeElement;l.firstChild;)this.renderer.removeChild(l,l.firstChild);p.forEach(function(e){t.renderer.appendChild(l,e.cloneNode(!0))}),this.cdr.markForCheck()}},t.prototype.renderAndSubscribeWindowResize=function(){var t=this;this.platform.isBrowser&&(this.windowResizeSubscription.unsubscribe(),this.cssEllipsis=this.canUseCSSEllipsis(),this.renderOnNextFrame(),this.windowResizeSubscription=this.nzDomEventService.registerResizeListener().pipe(l.takeUntil(this.destroy$),l.finalize(function(){return t.nzDomEventService.unregisterResizeListener()})).subscribe(function(){return t.renderOnNextFrame()}))},t.prototype.ngOnInit=function(){var t=this;this.i18n.localeChange.pipe(l.takeUntil(this.destroy$)).subscribe(function(){t.locale=t.i18n.getLocaleData("Text"),t.cdr.markForCheck()})},t.prototype.ngAfterViewInit=function(){this.viewInit=!0,this.renderAndSubscribeWindowResize()},t.prototype.ngOnChanges=function(t){var e=t.nzCopyable,n=t.nzEditable,i=t.nzExpandable,o=t.nzEllipsis,s=t.nzContent,r=t.nzEllipsisRows;(e||n||i||o||s||r)&&this.nzEllipsis&&(this.expanded?this.windowResizeSubscription.unsubscribe():this.renderAndSubscribeWindowResize())},t.prototype.ngOnDestroy=function(){this.destroy$.next(),this.destroy$.complete(),this.windowResizeSubscription.unsubscribe()},t.decorators=[{type:i.Component,args:[{selector:"\n nz-typography,\n [nz-typography],\n p[nz-paragraph],\n span[nz-text],\n h1[nz-title], h2[nz-title], h3[nz-title], h4[nz-title]\n ",exportAs:"nzTypography",template:'<ng-template #contentTemplate let-content="content">\n <ng-content *ngIf="!content"></ng-content>\n {{content}}\n</ng-template>\n\n<ng-container *ngIf="!editing">\n <ng-container *ngIf="expanded || (!nzExpandable && nzEllipsisRows === 1) || canCssEllipsis">\n <ng-template [ngTemplateOutlet]="contentTemplate" [ngTemplateOutletContext]="{ content: nzContent}"></ng-template>\n </ng-container>\n <ng-container *ngIf="nzEllipsis && !expanded && (nzEllipsisRows > 1 || nzExpandable)">\n <span #ellipsisContainer></span>\n <ng-container *ngIf="isEllipsis">{{ellipsisStr}}</ng-container>\n <a #expandable *ngIf="nzExpandable && isEllipsis" class="ant-typography-expand" (click)="onExpand()">{{locale?.expand}}</a>\n </ng-container>\n</ng-container>\n\n<nz-text-edit\n *ngIf="nzEditable"\n [text]="nzContent"\n (endEditing)="onEndEditing($event)"\n (startEditing)="onStartEditing()">\n</nz-text-edit>\n\n<nz-text-copy *ngIf="nzCopyable && !editing" [text]="copyText" (textCopy)="onTextCopy($event)"></nz-text-copy>\n\n',changeDetection:i.ChangeDetectionStrategy.OnPush,encapsulation:i.ViewEncapsulation.None,preserveWhitespaces:!1,host:{"[class.ant-typography]":"!editing","[class.ant-typography-edit-content]":"editing","[class.ant-typography-secondary]":'nzType === "secondary"',"[class.ant-typography-warning]":'nzType === "warning"',"[class.ant-typography-danger]":'nzType === "danger"',"[class.ant-typography-disabled]":"nzDisabled","[class.ant-typography-ellipsis]":"nzEllipsis && !expanded","[class.ant-typography-ellipsis-single-line]":"canCssEllipsis && nzEllipsisRows === 1","[class.ant-typography-ellipsis-multiple-line]":"canCssEllipsis && nzEllipsisRows > 1","[style.-webkit-line-clamp]":"(canCssEllipsis && nzEllipsisRows > 1) ? nzEllipsisRows : null"}}]}],t.ctorParameters=function(){return[{type:o.NzConfigService},{type:i.ElementRef},{type:i.ChangeDetectorRef},{type:i.ViewContainerRef},{type:i.Renderer2},{type:e.Platform},{type:s.NzI18nService},{type:o.NzDomEventService}]},t.propDecorators={nzCopyable:[{type:i.Input}],nzEditable:[{type:i.Input}],nzDisabled:[{type:i.Input}],nzExpandable:[{type:i.Input}],nzEllipsis:[{type:i.Input}],nzContent:[{type:i.Input}],nzEllipsisRows:[{type:i.Input}],nzType:[{type:i.Input}],nzCopyText:[{type:i.Input}],nzContentChange:[{type:i.Output}],nzCopy:[{type:i.Output}],nzExpandChange:[{type:i.Output}],textEditRef:[{type:i.ViewChild,args:[y,{static:!1}]}],textCopyRef:[{type:i.ViewChild,args:[u,{static:!1}]}],ellipsisContainer:[{type:i.ViewChild,args:["ellipsisContainer",{static:!1}]}],expandableBtn:[{type:i.ViewChild,args:["expandable",{static:!1}]}],contentTemplate:[{type:i.ViewChild,args:["contentTemplate",{static:!1}]}]},d([o.InputBoolean(),h("design:type",Object)],t.prototype,"nzCopyable",void 0),d([o.InputBoolean(),h("design:type",Object)],t.prototype,"nzEditable",void 0),d([o.InputBoolean(),h("design:type",Object)],t.prototype,"nzDisabled",void 0),d([o.InputBoolean(),h("design:type",Object)],t.prototype,"nzExpandable",void 0),d([o.InputBoolean(),h("design:type",Object)],t.prototype,"nzEllipsis",void 0),d([o.WithConfig(1),o.InputNumber(),h("design:type",Number)],t.prototype,"nzEllipsisRows",void 0),t}();var z=function(){function t(){}return t.decorators=[{type:i.NgModule,args:[{imports:[n.CommonModule,r.NzIconModule,a.NzToolTipModule,p.NzInputModule,s.NzI18nModule,o.NzTransButtonModule,o.NzCopyToClipboardServiceModule],exports:[g,u,y,e.PlatformModule],declarations:[g,u,y]}]}],t}();t.NzTextCopyComponent=u,t.NzTextEditComponent=y,t.NzTypographyComponent=g,t.NzTypographyModule=z,Object.defineProperty(t,"__esModule",{value:!0})}); //# sourceMappingURL=ng-zorro-antd-typography.umd.min.js.map