ng-zorro-antd
Version:
An enterprise-class UI components based on Ant Design and Angular
23 lines (21 loc) • 7.44 kB
JavaScript
!function(t,n){"object"==typeof exports&&"undefined"!=typeof module?n(exports,require("@angular/core"),require("ng-zorro-antd/core/util"),require("@angular/common")):"function"==typeof define&&define.amd?define("ng-zorro-antd/skeleton",["exports","@angular/core","ng-zorro-antd/core/util","@angular/common"],n):n(((t=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.common)}(this,(function(t,n,e,a){"use strict";
/*! *****************************************************************************
Copyright (c) Microsoft Corporation. All rights reserved.
Licensed under the Apache License, Version 2.0 (the "License"); you may not use
this file except in compliance with the License. You may obtain a copy of the
License at http://www.apache.org/licenses/LICENSE-2.0
THIS CODE IS PROVIDED ON AN *AS IS* BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
KIND, EITHER EXPRESS OR IMPLIED, INCLUDING WITHOUT LIMITATION ANY IMPLIED
WARRANTIES OR CONDITIONS OF TITLE, FITNESS FOR A PARTICULAR PURPOSE,
MERCHANTABLITY OR NON-INFRINGEMENT.
See the Apache Version 2.0 License for specific language governing permissions
and limitations under the License.
***************************************************************************** */var r=function(){return(r=Object.assign||function(t){for(var n,e=1,a=arguments.length;e<a;e++)for(var r in n=arguments[e])Object.prototype.hasOwnProperty.call(n,r)&&(t[r]=n[r]);return t}).apply(this,arguments)};function o(t,n){var e="function"==typeof Symbol&&t[Symbol.iterator];if(!e)return t;var a,r,o=e.call(t),s=[];try{for(;(void 0===n||n-- >0)&&!(a=o.next()).done;)s.push(a.value)}catch(t){r={error:t}}finally{try{a&&!a.done&&(e=o.return)&&e.call(o)}finally{if(r)throw r.error}}return s}var s=function(){function t(t,n,e){this.cdr=t,this.nzActive=!1,this.nzLoading=!0,this.nzTitle=!0,this.nzAvatar=!1,this.nzParagraph=!0,this.rowsList=[],this.widthList=[],n.addClass(e.nativeElement,"ant-skeleton")}return t.prototype.toCSSUnit=function(t){return void 0===t&&(t=""),e.toCssPixel(t)},t.prototype.getTitleProps=function(){var t=!!this.nzAvatar,n=!!this.nzParagraph,e="";return!t&&n?e="38%":t&&n&&(e="50%"),r({width:e},this.getProps(this.nzTitle))},t.prototype.getAvatarProps=function(){var t=this.nzTitle&&!this.nzParagraph?"square":"circle";return r({shape:t,size:"large"},this.getProps(this.nzAvatar))},t.prototype.getParagraphProps=function(){var t=!!this.nzAvatar,n=!!this.nzTitle,e={};return t&&n||(e.width="61%"),e.rows=!t&&n?3:2,r(r({},e),this.getProps(this.nzParagraph))},t.prototype.getProps=function(t){return t&&"object"==typeof t?t:{}},t.prototype.getWidthList=function(){var t=this.paragraph,n=t.width,e=t.rows,a=[];return n&&Array.isArray(n)?a=n:n&&!Array.isArray(n)&&((a=[])[e-1]=n),a},t.prototype.updateProps=function(){this.title=this.getTitleProps(),this.avatar=this.getAvatarProps(),this.paragraph=this.getParagraphProps(),this.rowsList=function(){for(var t=[],n=0;n<arguments.length;n++)t=t.concat(o(arguments[n]));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.decorators=[{type:n.Component,args:[{changeDetection:n.ChangeDetectionStrategy.OnPush,encapsulation:n.ViewEncapsulation.None,selector:"nz-skeleton",exportAs:"nzSkeleton",host:{"[class.ant-skeleton-with-avatar]":"!!nzAvatar","[class.ant-skeleton-active]":"nzActive"},template:'\n <ng-container *ngIf="nzLoading">\n <div class="ant-skeleton-header" *ngIf="!!nzAvatar">\n <nz-skeleton-element nzType="avatar" [nzSize]="avatar.size" [nzShape]="avatar.shape"></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 '}]}],t.ctorParameters=function(){return[{type:n.ChangeDetectorRef},{type:n.Renderer2},{type:n.ElementRef}]},t.propDecorators={nzActive:[{type:n.Input}],nzLoading:[{type:n.Input}],nzTitle:[{type:n.Input}],nzAvatar:[{type:n.Input}],nzParagraph:[{type:n.Input}]},t}();var i=function(){function t(){this.nzActive=!1}return t.decorators=[{type:n.Directive,args:[{selector:"nz-skeleton-element",host:{"[class.ant-skeleton]":"true","[class.ant-skeleton-element]":"true","[class.ant-skeleton-active]":"nzActive"}}]}],t.propDecorators={nzActive:[{type:n.Input}],nzType:[{type:n.Input}]},t}();var l=function(){function t(){}return t.decorators=[{type:n.Component,args:[{changeDetection:n.ChangeDetectionStrategy.OnPush,selector:'nz-skeleton-element[nzType="button"]',template:'\n <span\n [class.ant-skeleton-button]="true"\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 >\n </span>\n '}]}],t.propDecorators={nzShape:[{type:n.Input}],nzSize:[{type:n.Input}]},t}();var p=function(){function t(){this.styleMap={}}return t.prototype.ngOnChanges=function(t){if(t.nzSize&&"number"==typeof this.nzSize){var n=this.nzSize+"px";this.styleMap={width:n,height:n,"line-height":n}}else this.styleMap={}},t.decorators=[{type:n.Component,args:[{changeDetection:n.ChangeDetectionStrategy.OnPush,selector:'nz-skeleton-element[nzType="avatar"]',template:'\n <span\n [class.ant-skeleton-avatar]="true"\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 >\n </span>\n '}]}],t.propDecorators={nzShape:[{type:n.Input}],nzSize:[{type:n.Input}]},t}();var c=function(){function t(){}return t.decorators=[{type:n.Component,args:[{changeDetection:n.ChangeDetectionStrategy.OnPush,selector:'nz-skeleton-element[nzType="input"]',template:'\n <span\n [class.ant-skeleton-input]="true"\n [class.ant-skeleton-input-lg]="nzSize === \'large\'"\n [class.ant-skeleton-input-sm]="nzSize === \'small\'"\n >\n </span>\n '}]}],t.propDecorators={nzSize:[{type:n.Input}]},t}();var u=function(){function t(){}return t.decorators=[{type:n.NgModule,args:[{declarations:[s,i,l,p,c],imports:[a.CommonModule],exports:[s,i,l,p,c]}]}],t}();
/**
* @license
* Copyright Alibaba.com All Rights Reserved.
*
* Use of this source code is governed by an MIT-style license that can be
* found in the LICENSE file at https://github.com/NG-ZORRO/ng-zorro-antd/blob/master/LICENSE
*/t.NzSkeletonComponent=s,t.NzSkeletonElementAvatarComponent=p,t.NzSkeletonElementButtonComponent=l,t.NzSkeletonElementDirective=i,t.NzSkeletonElementInputComponent=c,t.NzSkeletonModule=u,Object.defineProperty(t,"__esModule",{value:!0})}));
//# sourceMappingURL=ng-zorro-antd-skeleton.umd.min.js.map