UNPKG

ng-zorro-antd

Version:

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

16 lines (14 loc) 8.68 kB
!function(t,e){"object"==typeof exports&&"undefined"!=typeof module?e(exports,require("@angular/core"),require("ng-zorro-antd/core/util"),require("@angular/cdk/bidi"),require("@angular/common")):"function"==typeof define&&define.amd?define("ng-zorro-antd/skeleton",["exports","@angular/core","ng-zorro-antd/core/util","@angular/cdk/bidi","@angular/common"],e):e(((t="undefined"!=typeof globalThis?globalThis:t||self)["ng-zorro-antd"]=t["ng-zorro-antd"]||{},t["ng-zorro-antd"].skeleton={}),t.ng.core,t["ng-zorro-antd"].core.util,t.ng.cdk.bidi,t.ng.common)}(this,(function(t,e,n,a,o){"use strict"; /*! ***************************************************************************** Copyright (c) Microsoft Corporation. Permission to use, copy, modify, and/or distribute this software for any purpose with or without fee is hereby granted. THE SOFTWARE IS PROVIDED "AS IS" AND THE AUTHOR DISCLAIMS ALL WARRANTIES WITH REGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR ANY SPECIAL, DIRECT, INDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES WHATSOEVER RESULTING FROM LOSS OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE OR OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR PERFORMANCE OF THIS SOFTWARE. ***************************************************************************** */Object.create;function r(t,e){var n="function"==typeof Symbol&&t[Symbol.iterator];if(!n)return t;var a,o,r=n.call(t),s=[];try{for(;(void 0===e||e-- >0)&&!(a=r.next()).done;)s.push(a.value)}catch(t){o={error:t}}finally{try{a&&!a.done&&(n=r.return)&&n.call(r)}finally{if(o)throw o.error}}return s}Object.create;var s=function(){function t(t,e,n){this.cdr=t,this.nzActive=!1,this.nzLoading=!0,this.nzRound=!1,this.nzTitle=!0,this.nzAvatar=!1,this.nzParagraph=!0,this.rowsList=[],this.widthList=[],e.addClass(n.nativeElement,"ant-skeleton")}return t.prototype.toCSSUnit=function(t){return void 0===t&&(t=""),n.toCssPixel(t)},t.prototype.getTitleProps=function(){var t=!!this.nzAvatar,e=!!this.nzParagraph,n="";return!t&&e?n="38%":t&&e&&(n="50%"),Object.assign({width:n},this.getProps(this.nzTitle))},t.prototype.getAvatarProps=function(){var t=this.nzTitle&&!this.nzParagraph?"square":"circle";return Object.assign({shape:t,size:"large"},this.getProps(this.nzAvatar))},t.prototype.getParagraphProps=function(){var t=!!this.nzAvatar,e=!!this.nzTitle,n={};return t&&e||(n.width="61%"),n.rows=!t&&e?3:2,Object.assign(Object.assign({},n),this.getProps(this.nzParagraph))},t.prototype.getProps=function(t){return t&&"object"==typeof t?t:{}},t.prototype.getWidthList=function(){var t=this.paragraph,e=t.width,n=t.rows,a=[];return e&&Array.isArray(e)?a=e:e&&!Array.isArray(e)&&((a=[])[n-1]=e),a},t.prototype.updateProps=function(){this.title=this.getTitleProps(),this.avatar=this.getAvatarProps(),this.paragraph=this.getParagraphProps(),this.rowsList=function(){for(var t=[],e=0;e<arguments.length;e++)t=t.concat(r(arguments[e]));return t}(Array(this.paragraph.rows)),this.widthList=this.getWidthList(),this.cdr.markForCheck()},t.prototype.ngOnInit=function(){this.updateProps()},t.prototype.ngOnChanges=function(t){(t.nzTitle||t.nzAvatar||t.nzParagraph)&&this.updateProps()},t}();s.decorators=[{type:e.Component,args:[{changeDetection:e.ChangeDetectionStrategy.OnPush,encapsulation:e.ViewEncapsulation.None,selector:"nz-skeleton",exportAs:"nzSkeleton",host:{"[class.ant-skeleton-with-avatar]":"!!nzAvatar","[class.ant-skeleton-active]":"nzActive","[class.ant-skeleton-round]":"!!nzRound"},template:'\n <ng-container *ngIf="nzLoading">\n <div class="ant-skeleton-header" *ngIf="!!nzAvatar">\n <nz-skeleton-element nzType="avatar" [nzSize]="avatar.size || \'default\'" [nzShape]="avatar.shape || \'circle\'"></nz-skeleton-element>\n </div>\n <div class="ant-skeleton-content">\n <h3 *ngIf="!!nzTitle" class="ant-skeleton-title" [style.width]="toCSSUnit(title.width)"></h3>\n <ul *ngIf="!!nzParagraph" class="ant-skeleton-paragraph">\n <li *ngFor="let row of rowsList; let i = index" [style.width]="toCSSUnit(widthList[i])"></li>\n </ul>\n </div>\n </ng-container>\n <ng-container *ngIf="!nzLoading">\n <ng-content></ng-content>\n </ng-container>\n '}]}],s.ctorParameters=function(){return[{type:e.ChangeDetectorRef},{type:e.Renderer2},{type:e.ElementRef}]},s.propDecorators={nzActive:[{type:e.Input}],nzLoading:[{type:e.Input}],nzRound:[{type:e.Input}],nzTitle:[{type:e.Input}],nzAvatar:[{type:e.Input}],nzParagraph:[{type:e.Input}]};var i=function(t){this.elementRef=t,this.nzActive=!1,this.elementRef.nativeElement.classList.add("ant-skeleton","ant-skeleton-element")};i.decorators=[{type:e.Directive,args:[{selector:"nz-skeleton-element",host:{"[class.ant-skeleton-active]":"nzActive"}}]}],i.ctorParameters=function(){return[{type:e.ElementRef}]},i.propDecorators={nzActive:[{type:e.Input}],nzType:[{type:e.Input}]};var l=function(){this.nzShape="default",this.nzSize="default"};l.decorators=[{type:e.Component,args:[{changeDetection:e.ChangeDetectionStrategy.OnPush,selector:'nz-skeleton-element[nzType="button"]',template:'\n <span\n class="ant-skeleton-button"\n [class.ant-skeleton-button-round]="nzShape === \'round\'"\n [class.ant-skeleton-button-circle]="nzShape === \'circle\'"\n [class.ant-skeleton-button-lg]="nzSize === \'large\'"\n [class.ant-skeleton-button-sm]="nzSize === \'small\'"\n ></span>\n '}]}],l.propDecorators={nzShape:[{type:e.Input}],nzSize:[{type:e.Input}]};var p=function(){function t(){this.nzShape="circle",this.nzSize="default",this.styleMap={}}return t.prototype.ngOnChanges=function(t){if(t.nzSize&&"number"==typeof this.nzSize){var e=this.nzSize+"px";this.styleMap={width:e,height:e,"line-height":e}}else this.styleMap={}},t}();p.decorators=[{type:e.Component,args:[{changeDetection:e.ChangeDetectionStrategy.OnPush,selector:'nz-skeleton-element[nzType="avatar"]',template:'\n <span\n class="ant-skeleton-avatar"\n [class.ant-skeleton-avatar-square]="nzShape === \'square\'"\n [class.ant-skeleton-avatar-circle]="nzShape === \'circle\'"\n [class.ant-skeleton-avatar-lg]="nzSize === \'large\'"\n [class.ant-skeleton-avatar-sm]="nzSize === \'small\'"\n [ngStyle]="styleMap"\n ></span>\n '}]}],p.propDecorators={nzShape:[{type:e.Input}],nzSize:[{type:e.Input}]};var c=function(){this.nzSize="default"};c.decorators=[{type:e.Component,args:[{changeDetection:e.ChangeDetectionStrategy.OnPush,selector:'nz-skeleton-element[nzType="input"]',template:'\n <span\n class="ant-skeleton-input"\n [class.ant-skeleton-input-lg]="nzSize === \'large\'"\n [class.ant-skeleton-input-sm]="nzSize === \'small\'"\n ></span>\n '}]}],c.propDecorators={nzSize:[{type:e.Input}]};var h=function(){};h.decorators=[{type:e.Component,args:[{changeDetection:e.ChangeDetectionStrategy.OnPush,selector:'nz-skeleton-element[nzType="image"]',template:'\n <span class="ant-skeleton-image">\n <svg class="ant-skeleton-image-svg" viewBox="0 0 1098 1024" xmlns="http://www.w3.org/2000/svg">\n <path\n d="M365.714286 329.142857q0 45.714286-32.036571 77.677714t-77.677714 32.036571-77.677714-32.036571-32.036571-77.677714 32.036571-77.677714 77.677714-32.036571 77.677714 32.036571 32.036571 77.677714zM950.857143 548.571429l0 256-804.571429 0 0-109.714286 182.857143-182.857143 91.428571 91.428571 292.571429-292.571429zM1005.714286 146.285714l-914.285714 0q-7.460571 0-12.873143 5.412571t-5.412571 12.873143l0 694.857143q0 7.460571 5.412571 12.873143t12.873143 5.412571l914.285714 0q7.460571 0 12.873143-5.412571t5.412571-12.873143l0-694.857143q0-7.460571-5.412571-12.873143t-12.873143-5.412571zM1097.142857 164.571429l0 694.857143q0 37.741714-26.843429 64.585143t-64.585143 26.843429l-914.285714 0q-37.741714 0-64.585143-26.843429t-26.843429-64.585143l0-694.857143q0-37.741714 26.843429-64.585143t64.585143-26.843429l914.285714 0q37.741714 0 64.585143 26.843429t26.843429 64.585143z"\n class="ant-skeleton-image-path"\n />\n </svg>\n </span>\n '}]}];var u=function(){};u.decorators=[{type:e.NgModule,args:[{declarations:[s,i,l,p,h,c],imports:[a.BidiModule,o.CommonModule],exports:[s,i,l,p,h,c]}]}],t.NzSkeletonComponent=s,t.NzSkeletonElementAvatarComponent=p,t.NzSkeletonElementButtonComponent=l,t.NzSkeletonElementDirective=i,t.NzSkeletonElementImageComponent=h,t.NzSkeletonElementInputComponent=c,t.NzSkeletonModule=u,Object.defineProperty(t,"__esModule",{value:!0})})); //# sourceMappingURL=ng-zorro-antd-skeleton.umd.min.js.map