ng-zorro-antd
Version:
An enterprise-class UI components based on Ant Design and Angular
452 lines (442 loc) • 16 kB
JavaScript
import { TemplatePortal, PortalInjector, ComponentPortal, PortalModule } from '@angular/cdk/portal';
import { InjectionToken, TemplateRef, Type, Component, ChangeDetectionStrategy, ViewEncapsulation, ViewContainerRef, ChangeDetectorRef, Injector, Input, NgModule } from '@angular/core';
import { Subject } from 'rxjs';
import { startWith, takeUntil } from 'rxjs/operators';
import { NzConfigService } from 'ng-zorro-antd/core/config';
import { NzI18nService, NzI18nModule } from 'ng-zorro-antd/i18n';
import { CommonModule } from '@angular/common';
import { NzOutletModule } from 'ng-zorro-antd/core/outlet';
/**
* @fileoverview added by tsickle
* Generated from: config.ts
* @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
/** @type {?} */
const NZ_EMPTY_COMPONENT_NAME = new InjectionToken('nz-empty-component-name');
/**
* @fileoverview added by tsickle
* Generated from: embed-empty.component.ts
* @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
/**
* @param {?} componentName
* @return {?}
*/
function getEmptySize(componentName) {
switch (componentName) {
case 'table':
case 'list':
return 'normal';
case 'select':
case 'tree-select':
case 'cascader':
case 'transfer':
return 'small';
default:
return '';
}
}
class NzEmbedEmptyComponent {
/**
* @param {?} configService
* @param {?} viewContainerRef
* @param {?} cdr
* @param {?} injector
*/
constructor(configService, viewContainerRef, cdr, injector) {
this.configService = configService;
this.viewContainerRef = viewContainerRef;
this.cdr = cdr;
this.injector = injector;
this.contentType = 'string';
this.size = '';
this.destroy$ = new Subject();
}
/**
* @param {?} changes
* @return {?}
*/
ngOnChanges(changes) {
if (changes.nzComponentName) {
this.size = getEmptySize(changes.nzComponentName.currentValue);
}
if (changes.specificContent && !changes.specificContent.isFirstChange()) {
this.content = changes.specificContent.currentValue;
this.renderEmpty();
}
}
/**
* @return {?}
*/
ngOnInit() {
this.subscribeDefaultEmptyContentChange();
}
/**
* @return {?}
*/
ngOnDestroy() {
this.destroy$.next();
this.destroy$.complete();
}
/**
* @private
* @return {?}
*/
renderEmpty() {
/** @type {?} */
const content = this.content;
if (typeof content === 'string') {
this.contentType = 'string';
}
else if (content instanceof TemplateRef) {
/** @type {?} */
const context = (/** @type {?} */ ({ $implicit: this.nzComponentName }));
this.contentType = 'template';
this.contentPortal = new TemplatePortal(content, this.viewContainerRef, context);
}
else if (content instanceof Type) {
/** @type {?} */
const context = new WeakMap([[NZ_EMPTY_COMPONENT_NAME, this.nzComponentName]]);
/** @type {?} */
const injector = new PortalInjector(this.injector, context);
this.contentType = 'component';
this.contentPortal = new ComponentPortal(content, this.viewContainerRef, injector);
}
else {
this.contentType = 'string';
this.contentPortal = undefined;
}
this.cdr.detectChanges();
}
/**
* @private
* @return {?}
*/
subscribeDefaultEmptyContentChange() {
this.configService
.getConfigChangeEventForComponent('empty')
.pipe(startWith(true), takeUntil(this.destroy$))
.subscribe((/**
* @return {?}
*/
() => {
this.content = this.specificContent || this.getUserDefaultEmptyContent();
this.renderEmpty();
}));
}
/**
* @private
* @return {?}
*/
getUserDefaultEmptyContent() {
return (this.configService.getConfigForComponent('empty') || {}).nzDefaultEmptyContent;
}
}
NzEmbedEmptyComponent.decorators = [
{ type: Component, args: [{
changeDetection: ChangeDetectionStrategy.OnPush,
encapsulation: ViewEncapsulation.None,
selector: 'nz-embed-empty',
exportAs: 'nzEmbedEmpty',
template: `
<ng-container *ngIf="!content && specificContent !== null" [ngSwitch]="size">
<nz-empty *ngSwitchCase="'normal'" class="ant-empty-normal" [nzNotFoundImage]="'simple'"></nz-empty>
<nz-empty *ngSwitchCase="'small'" class="ant-empty-small" [nzNotFoundImage]="'simple'"></nz-empty>
<nz-empty *ngSwitchDefault></nz-empty>
</ng-container>
<ng-container *ngIf="content">
<ng-template *ngIf="contentType !== 'string'" [cdkPortalOutlet]="contentPortal"></ng-template>
<ng-container *ngIf="contentType === 'string'">
{{ content }}
</ng-container>
</ng-container>
`
}] }
];
/** @nocollapse */
NzEmbedEmptyComponent.ctorParameters = () => [
{ type: NzConfigService },
{ type: ViewContainerRef },
{ type: ChangeDetectorRef },
{ type: Injector }
];
NzEmbedEmptyComponent.propDecorators = {
nzComponentName: [{ type: Input }],
specificContent: [{ type: Input }]
};
if (false) {
/** @type {?} */
NzEmbedEmptyComponent.prototype.nzComponentName;
/** @type {?} */
NzEmbedEmptyComponent.prototype.specificContent;
/** @type {?} */
NzEmbedEmptyComponent.prototype.content;
/** @type {?} */
NzEmbedEmptyComponent.prototype.contentType;
/** @type {?} */
NzEmbedEmptyComponent.prototype.contentPortal;
/** @type {?} */
NzEmbedEmptyComponent.prototype.size;
/**
* @type {?}
* @private
*/
NzEmbedEmptyComponent.prototype.destroy$;
/**
* @type {?}
* @private
*/
NzEmbedEmptyComponent.prototype.configService;
/**
* @type {?}
* @private
*/
NzEmbedEmptyComponent.prototype.viewContainerRef;
/**
* @type {?}
* @private
*/
NzEmbedEmptyComponent.prototype.cdr;
/**
* @type {?}
* @private
*/
NzEmbedEmptyComponent.prototype.injector;
}
/**
* @fileoverview added by tsickle
* Generated from: empty.component.ts
* @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
/** @type {?} */
const NzEmptyDefaultImages = (/** @type {?} */ (['default', 'simple']));
class NzEmptyComponent {
/**
* @param {?} i18n
* @param {?} cdr
*/
constructor(i18n, cdr) {
this.i18n = i18n;
this.cdr = cdr;
this.nzNotFoundImage = 'default';
this.isContentString = false;
this.isImageBuildIn = true;
this.locale = {};
this.destroy$ = new Subject();
}
/**
* @param {?} changes
* @return {?}
*/
ngOnChanges(changes) {
const { nzNotFoundContent, nzNotFoundImage } = changes;
if (nzNotFoundContent) {
/** @type {?} */
const content = nzNotFoundContent.currentValue;
this.isContentString = typeof content === 'string';
}
if (nzNotFoundImage) {
/** @type {?} */
const image = nzNotFoundImage.currentValue || 'default';
this.isImageBuildIn = NzEmptyDefaultImages.findIndex((/**
* @param {?} i
* @return {?}
*/
i => i === image)) > -1;
}
}
/**
* @return {?}
*/
ngOnInit() {
this.i18n.localeChange.pipe(takeUntil(this.destroy$)).subscribe((/**
* @return {?}
*/
() => {
this.locale = this.i18n.getLocaleData('Empty');
this.cdr.markForCheck();
}));
}
/**
* @return {?}
*/
ngOnDestroy() {
this.destroy$.next();
this.destroy$.complete();
}
}
NzEmptyComponent.decorators = [
{ type: Component, args: [{
changeDetection: ChangeDetectionStrategy.OnPush,
encapsulation: ViewEncapsulation.None,
selector: 'nz-empty',
exportAs: 'nzEmpty',
template: `
<div class="ant-empty-image">
<ng-container *ngIf="!isImageBuildIn">
<ng-container *nzStringTemplateOutlet="nzNotFoundImage">
<img [src]="nzNotFoundImage" [alt]="isContentString ? nzNotFoundContent : 'empty'" />
</ng-container>
</ng-container>
<nz-empty-default *ngIf="isImageBuildIn && nzNotFoundImage !== 'simple'"></nz-empty-default>
<nz-empty-simple *ngIf="isImageBuildIn && nzNotFoundImage === 'simple'"></nz-empty-simple>
</div>
<p class="ant-empty-description" *ngIf="nzNotFoundContent !== null">
<ng-container *nzStringTemplateOutlet="nzNotFoundContent">
{{ isContentString ? nzNotFoundContent : locale['description'] }}
</ng-container>
</p>
<div class="ant-empty-footer" *ngIf="nzNotFoundFooter">
<ng-container *nzStringTemplateOutlet="nzNotFoundFooter">
{{ nzNotFoundFooter }}
</ng-container>
</div>
`,
host: {
class: 'ant-empty'
}
}] }
];
/** @nocollapse */
NzEmptyComponent.ctorParameters = () => [
{ type: NzI18nService },
{ type: ChangeDetectorRef }
];
NzEmptyComponent.propDecorators = {
nzNotFoundImage: [{ type: Input }],
nzNotFoundContent: [{ type: Input }],
nzNotFoundFooter: [{ type: Input }]
};
if (false) {
/** @type {?} */
NzEmptyComponent.prototype.nzNotFoundImage;
/** @type {?} */
NzEmptyComponent.prototype.nzNotFoundContent;
/** @type {?} */
NzEmptyComponent.prototype.nzNotFoundFooter;
/** @type {?} */
NzEmptyComponent.prototype.isContentString;
/** @type {?} */
NzEmptyComponent.prototype.isImageBuildIn;
/** @type {?} */
NzEmptyComponent.prototype.locale;
/**
* @type {?}
* @private
*/
NzEmptyComponent.prototype.destroy$;
/**
* @type {?}
* @private
*/
NzEmptyComponent.prototype.i18n;
/**
* @type {?}
* @private
*/
NzEmptyComponent.prototype.cdr;
}
/**
* @fileoverview added by tsickle
* Generated from: partial/default.ts
* @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
class NzEmptyDefaultComponent {
}
NzEmptyDefaultComponent.decorators = [
{ type: Component, args: [{
changeDetection: ChangeDetectionStrategy.OnPush,
encapsulation: ViewEncapsulation.None,
selector: 'nz-empty-default',
exportAs: 'nzEmptyDefault',
template: `
<svg class="ant-empty-img-default" width="184" height="152" viewBox="0 0 184 152" xmlns="http://www.w3.org/2000/svg">
<g fill="none" fill-rule="evenodd">
<g transform="translate(24 31.67)">
<ellipse class="ant-empty-img-default-ellipse" cx="67.797" cy="106.89" rx="67.797" ry="12.668" />
<path
class="ant-empty-img-default-path-1"
d="M122.034 69.674L98.109 40.229c-1.148-1.386-2.826-2.225-4.593-2.225h-51.44c-1.766 0-3.444.839-4.592 2.225L13.56 69.674v15.383h108.475V69.674z"
/>
<path
class="ant-empty-img-default-path-2"
d="M101.537 86.214L80.63 61.102c-1.001-1.207-2.507-1.867-4.048-1.867H31.724c-1.54 0-3.047.66-4.048 1.867L6.769 86.214v13.792h94.768V86.214z"
transform="translate(13.56)"
/>
<path
class="ant-empty-img-default-path-3"
d="M33.83 0h67.933a4 4 0 0 1 4 4v93.344a4 4 0 0 1-4 4H33.83a4 4 0 0 1-4-4V4a4 4 0 0 1 4-4z"
/>
<path
class="ant-empty-img-default-path-4"
d="M42.678 9.953h50.237a2 2 0 0 1 2 2V36.91a2 2 0 0 1-2 2H42.678a2 2 0 0 1-2-2V11.953a2 2 0 0 1 2-2zM42.94 49.767h49.713a2.262 2.262 0 1 1 0 4.524H42.94a2.262 2.262 0 0 1 0-4.524zM42.94 61.53h49.713a2.262 2.262 0 1 1 0 4.525H42.94a2.262 2.262 0 0 1 0-4.525zM121.813 105.032c-.775 3.071-3.497 5.36-6.735 5.36H20.515c-3.238 0-5.96-2.29-6.734-5.36a7.309 7.309 0 0 1-.222-1.79V69.675h26.318c2.907 0 5.25 2.448 5.25 5.42v.04c0 2.971 2.37 5.37 5.277 5.37h34.785c2.907 0 5.277-2.421 5.277-5.393V75.1c0-2.972 2.343-5.426 5.25-5.426h26.318v33.569c0 .617-.077 1.216-.221 1.789z"
/>
</g>
<path
class="ant-empty-img-default-path-5"
d="M149.121 33.292l-6.83 2.65a1 1 0 0 1-1.317-1.23l1.937-6.207c-2.589-2.944-4.109-6.534-4.109-10.408C138.802 8.102 148.92 0 161.402 0 173.881 0 184 8.102 184 18.097c0 9.995-10.118 18.097-22.599 18.097-4.528 0-8.744-1.066-12.28-2.902z"
/>
<g class="ant-empty-img-default-g" transform="translate(149.65 15.383)">
<ellipse cx="20.654" cy="3.167" rx="2.849" ry="2.815" />
<path d="M5.698 5.63H0L2.898.704zM9.259.704h4.985V5.63H9.259z" />
</g>
</g>
</svg>
`
}] }
];
/**
* @fileoverview added by tsickle
* Generated from: partial/simple.ts
* @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
class NzEmptySimpleComponent {
}
NzEmptySimpleComponent.decorators = [
{ type: Component, args: [{
changeDetection: ChangeDetectionStrategy.OnPush,
encapsulation: ViewEncapsulation.None,
selector: 'nz-empty-simple',
exportAs: 'nzEmptySimple',
template: `
<svg class="ant-empty-img-simple" width="64" height="41" viewBox="0 0 64 41" xmlns="http://www.w3.org/2000/svg">
<g transform="translate(0 1)" fill="none" fill-rule="evenodd">
<ellipse class="ant-empty-img-simple-ellipse" cx="32" cy="33" rx="32" ry="7" />
<g class="ant-empty-img-simple-g" fill-rule="nonzero">
<path d="M55 12.76L44.854 1.258C44.367.474 43.656 0 42.907 0H21.093c-.749 0-1.46.474-1.947 1.257L9 12.761V22h46v-9.24z" />
<path
d="M41.613 15.931c0-1.605.994-2.93 2.227-2.931H55v18.137C55 33.26 53.68 35 52.05 35h-40.1C10.32 35 9 33.259 9 31.137V13h11.16c1.233 0 2.227 1.323 2.227 2.928v.022c0 1.605 1.005 2.901 2.237 2.901h14.752c1.232 0 2.237-1.308 2.237-2.913v-.007z"
class="ant-empty-img-simple-path"
/>
</g>
</g>
</svg>
`
}] }
];
/**
* @fileoverview added by tsickle
* Generated from: empty.module.ts
* @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
class NzEmptyModule {
}
NzEmptyModule.decorators = [
{ type: NgModule, args: [{
imports: [CommonModule, PortalModule, NzOutletModule, NzI18nModule],
declarations: [NzEmptyComponent, NzEmbedEmptyComponent, NzEmptyDefaultComponent, NzEmptySimpleComponent],
exports: [NzEmptyComponent, NzEmbedEmptyComponent]
},] }
];
/**
* @fileoverview added by tsickle
* Generated from: public-api.ts
* @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
/**
* @fileoverview added by tsickle
* Generated from: ng-zorro-antd-empty.ts
* @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
export { NZ_EMPTY_COMPONENT_NAME, NzEmbedEmptyComponent, NzEmptyComponent, NzEmptyDefaultComponent, NzEmptyModule, NzEmptySimpleComponent };
//# sourceMappingURL=ng-zorro-antd-empty.js.map